/* `Power User View
----------------------------------------------------------------------------------------------------*/

#power_grid_view {
	background: #123 url(../img/gradient_bg.png) no-repeat center top;
	color: #fff;
	font: 12px Arial, sans-serif;
}

#power_grid_view * {
	border: 0;
	margin: 0;
	outline: 0;
	padding: 0;
}

#power_grid p,
#power_grid h6 {
	line-height: 1.1;
}

/* `Navigation Bar
----------------------------------------------------------------------------------------------------*/

#power_grid_nav {
	margin: 0 auto;
	overflow: hidden;
	position: relative;
	height: 50px;
}

#power_grid_pending {
	color: #789;
	display: none;
	line-height: 1;
	position: absolute;
	top: 18px;
	left: 185px;
}

#power_grid_pending span {
	color: #abc;
}

#power_grid_reset,
#power_grid_toggle,
#power_grid_open_all,
#power_grid_flip_check {
	cursor: pointer;
	display: none;
	line-height: 1;
	position: absolute;
	top: 15px;
}

#power_grid_toggle {
	background: url(../img/toggle.png) no-repeat;
	font-size: 0;
	overflow: hidden;
	text-indent: -99999px;
	width: 179px;
	height: 19px;
	left: 0;
}

#power_grid_toggle.alt {
	background-position: left bottom;
}

#power_grid_flip_check {
	background: url(../img/flip_check.png) no-repeat;
	font-size: 0;
	overflow: hidden;
	text-indent: -99999px;
	width: 89px;
	height: 19px;
	left: 240px;
}

#power_grid_flip_check.alt {
	background-position: 0 -19px;
}

#power_grid_reset {
	background: url(../img/button_top_reset.png) no-repeat;
	text-indent: -99999px;
	right: 130px;
	width: 55px;
	height: 23px;
}

#power_grid_open_all {
	right: 0;
}

#power_grid_reset.dimmed,
#power_grid_open_all.dimmed {
	cursor: default;
	opacity: 0.5;
	filter: alpha(opacity = 50);
}

#power_grid_open_all img,
#power_grid_open_all span {
	float: left;
}

#power_grid_open_all span {
	background: url(../img/button_top_mid.gif) repeat-x;
	overflow: hidden;
	padding: 5px 5px 0;
	height: 20px;
}

/* `Grid Area
----------------------------------------------------------------------------------------------------*/

#power_grid_wrap {
	position: relative;
}

#power_grid {
	background: url(../img/gloss.png);
	list-style: none;
	margin: 0 auto;
	overflow: hidden;
	position: relative;
}

#power_grid li {
	cursor: default;
	float: left;
	margin: 0 1px 1px 0;
	overflow: hidden;
	position: relative;
	width: 239px;
	height: 179px;
}

#power_grid .power_grid_mute {
	opacity: 0.05;
}

#power_grid li p {
	color: #abc;
	padding: 10px 10px 0;
}

#power_grid li p:first-child {
	font-size: 14px;
	line-height: 18px;
}

#power_grid h6 {
	padding: 10px 10px 0;
	font-size: 16px;
	font-weight: normal;
}

#power_grid .power_grid_favicon {
	background: url(../img/favicon_bg.png) no-repeat;
	float: left;
	margin: 0 10px 0 0;
	padding: 1px;
	width: 16px;
	height: 16px;
}

.power_grid_screenshot,
.power_grid_selected {
	font-size: 0;
	overflow: hidden;
	position: absolute;
	width: 239px;
	height: 179px;
	top: 0;
	left: 0;
}

.power_grid_screenshot {
	background: #123 url(../img/spinner.gif) no-repeat center center;
}

.power_grid_screenshot.transparent {
	opacity: 0.6;
	filter: alpha(opacity = 60);
}

.power_grid_selected {
	background: url(../img/selected_bg.png);
	display: none;
}

.power_grid_selected img {
	position: absolute;
	top: 76px;
	left: 107px;
}

/* `Extra Side Areas + Pagination Arrows
----------------------------------------------------------------------------------------------------*/

#power_grid_extra_l,
#power_grid_extra_r,
#power_grid_nav_arrow_l,
#power_grid_nav_arrow_r,
#power_grid_nav_arrow_l span,
#power_grid_nav_arrow_r span {
	font-size: 0;
	overflow: hidden;
	position: absolute;
}

#power_grid_extra_l,
#power_grid_extra_r {
	background: url(../img/gloss.png);
	top: 0;
}

#power_grid_extra_l {
	background-position: right top;
	left: 0;
}

#power_grid_extra_r {
	right: 0;
}

#power_grid_nav_arrow_l,
#power_grid_nav_arrow_r {
	background: url(../img/nav_arrow_bg.png) no-repeat -1px -1px;
	cursor: pointer;
	display: none;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#power_grid_nav_arrow_l:hover,
#power_grid_nav_arrow_r:hover {
	background-position: 0 0;
	background-repeat: repeat;
}

#power_grid_nav_arrow_l span,
#power_grid_nav_arrow_r span {
	background: url(../img/nav_arrow_icons.png) no-repeat;
	margin: -13px 0 0 -11px;
	top: 50%;
	left: 50%;
	width: 22px;
	height: 25px;
}

#power_grid_nav_arrow_r span {
	background-position: left bottom;
}

#power_grid_nav_arrow_l:hover span {
	background-position: right top;
}

#power_grid_nav_arrow_r:hover span {
	background-position: right bottom;
}

/* `Frame Around <li>
----------------------------------------------------------------------------------------------------*/

.power_grid_frame {
	background: url(../img/hover_frame.png) no-repeat;
	display: none;
	font-size: 0;
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	width: 239px;
	height: 179px;
}

.power_grid_frame a {
	position: absolute;
	top: 5px;
	left: 5px;
	width: 229px;
	height: 140px;
}

.power_grid_button_x,
.power_grid_button_star {
	background: url(../img/action_buttons.png) no-repeat;
	cursor: pointer;
	position: absolute;
	top: 147px;
	width: 28px;
	height: 28px;
}

.power_grid_button_x {
	left: 85px;
}

.power_grid_button_star {
	background-position: -28px 0;
	left: 130px;
}

.power_grid_button_x:hover {
	background-position: 0 -28px;
}

.power_grid_button_star:hover {
	background-position: -28px -28px;
}

.power_grid_button_x span,
.power_grid_button_star span {
	background: #000;
	color: #fff;
	display: none;
	font-size: 10px;
	letter-spacing: 1px;
	line-height: 20px;
	overflow: hidden;
	text-align: center;
	text-transform: uppercase;
	position: absolute;
	top: -22px;
	left: -7px;
	width: 40px;
	height: 20px;
}

/* `Hover States On/Off
----------------------------------------------------------------------------------------------------*/

.power_grid_button_x:hover span,
.power_grid_button_star:hover span {
	display: block;
}

.power_grid_hide_screens_noswap .power_grid_screenshot,
.power_grid_hide_screens_swap .power_grid_screenshot {
	display: none;
}

.power_grid_hide_screens_swap li.hover .power_grid_screenshot,
.power_grid_hide_screens_swap li:hover .power_grid_screenshot {
	display: block;
}

.power_grid_show_screens_noswap .power_grid_screenshot,
.power_grid_show_screens_swap .power_grid_screenshot {
	display: block;
}

.power_grid_show_screens_swap li.hover .power_grid_screenshot,
.power_grid_show_screens_swap li:hover .power_grid_screenshot {
	display: none;
}

#power_grid li.hover .power_grid_frame,
#power_grid li:hover .power_grid_frame {
	display: block;
}

/* `Bottom Row
----------------------------------------------------------------------------------------------------*/

#power_grid_bottom {
	color: #789;
	display: none;
	font-size: 12px;
	margin: 0 auto;
	overflow: hidden;
	position: relative;
	text-transform: uppercase;
}

#power_grid_bottom strong {
	color: #fff;
	font-weight: normal;
}

#power_grid_attribution,
#power_grid_keys {
	line-height: 30px;
	position: absolute;
	top: 0;
}

#power_grid_attribution {
	color: #345;
	left: 0;
}

#power_grid_keys {
	right: 0;
}

#power_grid_attribution img {
	vertical-align: middle;
}

#power_grid_result_count
{
	line-height: 30px;
	text-align: center;
}

/*#power_grid_loading {
	display: none;
	position: absolute;
	top: 9px;
	right: 0;
}*/

/* `Error State
----------------------------------------------------------------------------------------------------*/

li#power_grid_error {
	float: none;
	font-size: 30px;
	line-height: 180px;
	margin: 0;
	text-align: center;
	width: auto;
}

li#power_grid_error span {
	background: url(../img/stop.png) no-repeat left center;
	padding: 10px 0 10px 40px;
}