
/* Default Setting */
* {
   padding: 0;
   margin: 0;
   text-decoration: none;
}

body {
	font: normal 12px Arial, Verdana, Sans-Serif;
	background-color: #F4F5EB;
	color:#808080;
	margin-bottom:5px;
}

ul {
  list-style: none;
}

li {
  margin: 0 0 0px 0;
  padding: 0;
}

a {
	text-decoration: none;
	color: #2489DB;
}

a:hover {
	color: #f60;
}
a img {
	border: 0;
}
a.pages:link,a.pages:visited{
  	font-size:12px;
  	padding:3px 8px;
  	color:#686868;
  	border:#cccccc 1px solid;
  	text-decoration:none;
}
a.pages:hover,a.pages:active{
  	font-size:12px;
  	padding:3px 8px;
  	color:#E268E2;
  	background:#00E200;
  	border:#cccccc 1px solid;
}  
.pagesnow{
	font-size:12px;
	padding:3px 8px;
	color:#FF0000;
	border:#cccccc 0px solid;
}
    /* Container*/

#container { 
    width:800px !important; 
	width:800px;
	margin:5px auto ;
	padding-top:6px !important;
	padding-right:0px !important;
	padding: 0px 6px 10px 6px;
	background: #FFF; 
	border:1px #CCCCCC solid;
}
	/* header */

#header {
	color: #303030;
	width: 740px;
	margin-bottom:20px;
}
#header_bg {
	clear: both;
	height: 70px;
}
.logo {
	float: left;
	display:block;
}

.header__info {
	float: right;
	height: auto;
	padding: 8px !important;
	padding-bottom:0px;
	width: 300px;
	margin: 16px 10px 0 0;
	color: #808080;
}

  /* main menu search */
 #search {
	float: right;
    color: #000;
	padding: 0;
	min-height: 20px; /* FF height */
	height: auto;	/* IE height */
	width: 300px;
	text-align:right;
} 
#search p{
    margin:0;
	padding:0;
}


form, form p { 
   margin: 0;
   padding:0;
   line-height: 22px;
   text-align:left;
}
.search { 
   width: 110px; 
   border: 1px solid #357994; 
   background: #fff; 
   color: #000; 
   padding: 4px; 
   font-size: 12px;
 }
.search:hover { 
   background: #E7F5DB; 
 }
 .search:visited { 
   background: #FFF; 
 }
.button { 
   width:85px;
   max-width:100px;
   min-width:50px;
   padding:2px 2px 2px 2px;
   font: normal 12px Arial, Sans-Serif;
   line-height: 12px;
   
}

/* navigation */

#navigation {
	clear: left;
    float: left;
	width: 160px;
	height:auto;
	margin-left:2px;
	margin-bottom:5px;
}
.line {
    border-bottom:1px dashed #fff;
}
.l1 {	
	width: 160px;
	font-size: 12px;
}	

.l1_current_active {
	text-align: left;
	margin-bottom:1px;
	height:auto;
	color: #fff;
	font-weight:bold;
	display: block;
	padding: 6px 8px 6px 20px;
	background: #2E839C url(navigation-arrow.gif) no-repeat 6px center; 
}
.l1_current_active a {
	color: #fff;
}
.l1_current_active a:hover {
	color: #fff;
}
.l2 {
	list-style: none;
}

.l2 a,l2 a:visited {
	text-align: left;
	height: 24px !important;
	height:22px;
	line-height:24px !important;
	line-height:22px;
	color: #fff;
	display: block;
	padding-top:0px !important;
	padding:2px 8px 0px 20px;
	background: #2E839C url(arrow.gif) no-repeat 0px 8px; 
}	
	
.l2 a:hover {
    background: #20596A url(arrow.gif) no-repeat 0px 8px;	
	padding-top:0px !important;
	padding-top:2px;
	color: #EBFfFf;
}

.l3 {
	list-style: none;
}

.l3 a,l3 a:visited {
	text-align: left;
	height: 20px !important;
	height:18px;
	line-height:20px !important;
	line-height:18px;
	color: #028181;
	display: block;
	padding-top:0px !important;
	padding:2px 8px 0px 20px;
	padding: 2px 8px 0 26px;
	background: #B6E0EA url(strelica1.gif) no-repeat 18px center; 
}
.l3 a:hover {
	color: #f60;
	background: #B6E0EA url(strelica3.gif) no-repeat 18px center; 
}
.l4 {
	list-style: none;
}

.l4 a,l4 a:visited {
	text-align: left;
	height: 18px;
	color: #018F8F;
	display: block;
	line-height:18px;
	padding: 2px 8px 0 26px;
	background: #B6E0EA; 
}
.l4 a:hover {
	color: #f60;
	background: #B6E0EA; 
}

.actived {
	color: #f60;
	display:block;
}

.l2current a{
    color:#fff;
	background: #2E839C url(arrow.gif) no-repeat 0px 8px;; 
}
.l2current a:hover{
    color:#fff;
}

.l3current a{
    color:#f60;
	background: #F0F0F0 url(strelica3.gif) no-repeat 18px center; 
}
.l3current a:hover{
    color:#f60;
}

.l4current a{
    color:#f60;
	background: #F0F0F0; 
}
.l4current a:hover{
    color:#f60;
	background: #F0F0F0; 
}

/*-----------------------------------------------------------styles for the icons*/

#icons{
	width:570px;
	margin-left:0px;
}

.icon{
	width:94px;
	height:94px;
	float:left;
}

.icon a{
	display:block;
	width:94px;
	height:94px;
	background-repeat:no-repeat;
}

.icon a:hover{
	background-position:0 -92px;
}

.icon a span{
	display:none;
}

.bio{
	background-image:url(shortcut01.jpg);
}

.wind{
	background-image:url(shortcut02.jpg);
}

.micro{
	background-image:url(shortcut03.jpg);
}

.hydro{
	background-image:url(shortcut04.jpg);
}

.marine{
	background-image:url(shortcut05.jpg)
}

.solar{
	background-image:url(shortcut06.jpg);
}

/* rightsidebar */

#rightsidebar {
	float: right;
	margin-right:10px !important;
	margin-right:0px;
	width:184px !important;
	width: 186px;
	background: #FFF;
	text-align:justify;
	color: #ccc;
}
#rightsidebar h1 {
	padding:5px 0 5px 10px;
	font-size:12px;
	background: #2E839C;
	color:#FFF;
	text-align:left;
}
#rightsidebar p {
	padding: 10px 0px 10px 4px;
	color: #808080;
	margin-bottom:5px;
	line-height:130%;
}
.red{
    color:#FF0202;
}
#rightsidebar img {
	margin: 0 5px 2px 0px;
    display:block;
	background:transparent;
}
.block {
	padding-top:2px;
	padding-left:2px;
}
.rightsidebar p:hover {
	color: #F60;
}

#rightsidebar a{
	display:block;
}
#rightsidebar li {
	padding:3px 0 3px 8px;
	border-bottom: 0px solid #ddd;
	background: transparent url(strelica2.gif) no-repeat left center;
	color:#777;
    font: normal 12px Arial, Sans-Serif;
	margin-left:6px;
	text-align:left;
}

#rightsidebar span {
	color:#808080;
}

	/* content */

#content {
    float:left;
	padding: 0 0px 5px 9px;
	width:385px !important;
	line-height: 150%;
}

#content h1 {
    clear:both;
	margin-bottom:4px;
	padding:5px 0 5px 5px;
	font:bold 13px Arial, Sans-Serif;
	color:#33ADDB;
	text-align:left;
}
#content h2 {
	padding:5px 0 5px 10px;
	margin-top:5px;
	font-size:12px;
	background: #2E839C;
	color:#FFF;
	text-align:left;
}
#content p {
	margin-bottom:4px;
	padding:0 0 5px 0;
	border-bottom: 1px solid #ddd;
	color:#888;
	text-align:left;
}

#content span {
	margin-right:4px;
	color:#808080;
	/*float:right;*/
}
.date {
	background: transparent url(clanak.gif) repeat-x bottom;
	padding-bottom:8px;
	padding-right:10px;
	text-align:right;
	font-size:12px;
}
h2 a {
    color:#fff;
}
h2 a:hover {
   color:#fff;
   text-decoration:underline;
}
#content li a, #content li a:visited {
	text-align: left;
	height: 20px !important;
	height:18px;
	line-height:20px !important;
	line-height:18px;
	color: #028181;
	display: block;
	padding-top:0px !important;
}
#content li a:hover {
	color: #f60;
}

.more {
	padding-right:16px;
	float:right;
}
.more a{
    color:#fff;
}
.more a:hover{
    color:#f60;
}

/*-----------------------------------------------------------styles for the index body*/

#index_body {
    float:left;
	padding: 0 0px 5px 9px;
	width:610px !important;
	line-height: 150%;
}
#cure_news{
	margin-right:10px !important;
	width:184px !important;
	background: #FFF;
	text-align:justify;
	color: #ccc;
}
#isun_news{
	float:right; 
	margin-right:50px !important;
	width:184px !important;
	background: #FFF;
	text-align:justify;
	color: #ccc;
}
#index_body #title {
	padding:5px 0 5px 10px;
	margin-top:5px;
	font-size:12px;
	background: #2E839C;
	color:#FFF;
	text-align:left;
}
#index_body #title a, #index_body #title a:visited{
	color:#fff;
}
#index_body #title a:hover{
   color:#fff;
   text-decoration:underline;
}
#index_body li {
	padding:4px 0 4px 8px;
	margin-left:4px;
	background: transparent url(strelica2.gif) no-repeat left center;
}
#content li {
	padding-top:6px !important;
	padding-bottom:6px !important;
	padding:4px 0 4px 8px;
	border-bottom: 0px dashed #ddd;
	background: transparent url(strelica2.gif) no-repeat left center;
	color:#777;
    font: normal 12px Arial, Sans-Serif;
	margin-left:4px;
	text-align:left;
}

.content_info {
	padding-top: 2px;
	height: 30px;
	margin: 5px 0 5px 0;
	border-top: 1px solid #eee;
	font-size: 100%;
	text-transform: uppercase;	
	color: #808080;
}

/*footer*/

#footer {
	clear: both;
	background:  #2E839C;
	color: #A1DCEA;
	font-size: 12px;
	text-align: right;
	padding: 6px 10px 8px 0 !important;
	padding:6px;
	margin-top:0 !important;
	margin-left:2px !important;
	margin-right:12px !important;
	margin-bottom:0 !important;
	margin:10px 6px 0 4px;
	height:18px !important;
	height:20px;
}
#footer a {
	color: #fff;
}
#footer a:hover {
	text-decoration: underline;
}
	


	/* content */

#application {
    width:532px !important;
	width:528px;
	float:right;
	background:  #f9f9f9;
	padding:10px 30px 0 14px;
	margin-right:10px !important;
	margin-right:2px;
	margin-bottom:10px !important;
	border:1px solid #e0e0e0;
}
#application form {
	float:right;
	height:700px;
	margin-left:24px;
}

#application h1{
    color:#f60;
	margin:10px;
	padding:10px;
	border-bottom:1px solid #898989;
	text-align:center;
	font-size:24px;
}
#application h2{
    color:#555;
	padding:20px 10px 10px 0;
	font-size:18px;
}

#application span{
    color:#6A757D;
   position:relative;
   bottom:14px !important;
   bottom:14px;
}

.contactyou {
    color:#f60;
	margin-top:10px;
	font:bold 13px Arial, Sans-Serif;
	margin:20px 0;
}
#application p{
    color:#6A757D;
	margin:6px 0;
	font-size:13px;
    line-height:18px;
}

#application li {
    font-size:13px;
	color:#009933;
}



#application strong{
	font:bold 12px Arial, Sans-Serif;
}

.input_bg {
	background:  #fff;
	border:1px solid #999;
	width:100px;
	height:18px;
	line-height:18px;
}
.hla_bg {
	background:  #fff;
	border:1px solid #999;
	width:39px;
	height:18px;
	line-height:18px;
}
.but {
   width:50px;
   height:30px;
   color:#f60;
   line-height:150%;
   position:relative;
   top:3px;
}
.test_bg {
   width:224px !important;
   width:210px;
}

/* article */
#article {
    width:506px !important;
	width:513px;
	min-height:600px;
	float:right;
	/*--background:  #f9f9f9;*/
	padding-right:35px !important;
	padding-right:25px;
	padding-left:30px;
	margin-bottom:10px !important;
	margin-right:12px !important;
	margin:0 3px 0 0px;
	text-align:center;
	border:1px solid #e0e0e0;
	font-size:13px;
	line-height:200%;
}

#article form {
	float:right;
	height:600px;
}

#article h1{
    color:#898989;
	margin:10px 0;
	padding:10px;
	border-bottom:1px solid #818181;
	text-align:center;
	font-size:20px;
}
#article h2{
    color:#555;
	padding:20px 10px 10px 0;
	font-size:18px;
}

#article span{
   color:#808080;
}
#article p{
    color:#6A757D;
	margin:5px 5px 10px 5px;
    line-height:200%;
	text-align:left;
	text-indent:26px;
}
#article ul{
    color:#6A757D;
	margin:5px 5px 5px 5px;
    line-height:150%;
	text-align:left;
}

#article strong	{color:#555;}

#article li	{
   list-style-type:disc;
   margin-left:48px;
}

#article ol{
    color:#6A757D;
	margin:5px 5px 5px 15px;
    line-height:150%;
	text-align:left;
}

#article h3{
    color:#f60;
	margin-top:20px;
	font:bold 13px Arial, Sans-Serif;
}

#article h5{
    color:#f60;
	font:bold 15px Arial, Sans-Serif;
	margin-top:25px;
	text-align:left;
}

#latesarticle {
	margin:6px 0 10px 0;
}

#latesarticle li{
    text-align:left;
	padding:10px 0 4px 8px;
	margin-left:20px;
}
#latesarticle a.tag_title_link {
	padding-top:6px !important;
	padding-bottom:6px !important;
	padding:4px 0 4px 8px;
	border-bottom: 0px dashed #ddd;
	background: transparent url(strelica3.gif) no-repeat left center;
    font: normal 12px Arial, Sans-Serif;
	text-align:center;

}
#article strong{
	font:bold 12px Arial, Sans-Serif;
	text-align:center;
	color:#f60;
}

#article p img{
     width:70%;
	 margin:0 auto;
	 display:block;
	 font-size:12px;
}

.article_date {
     color:#606060;

}
.article_pages {
     margin:20px auto;

}
.pre_and_next {
     border:0px dotted #808080;

}


#category {
    width:506px !important;
	width:520px;
	min-height:500px !important;
	float:right;
	background:  #f9f9f9;
	padding-right:35px !important;
	padding-right:25px;
	padding-left:30px;
	padding-bottom:20px;
	margin-bottom:10px !important;
	margin-right:12px !important;
	margin:0 3px 0 0px;
	text-align:center;
	border:1px solid #e0e0e0;
	font-size:13px;
}

#category span {
	margin-right:2px;
	color:#808080;
}
#category h1 {
	padding:5px 0 5px 10px;
	margin:15px auto;
	margin-bottom:5px;
	font-size:28px;
	color:#f60;
	border-bottom:0px dashed #808080;
	text-align:center;
}
#category h2 {
	padding:5px 0 5px 10px;
	margin:10px auto 10px auto;
	font-size:16px;
	color:#029C9C;
	border: 1px solid #e0e0e0;
	background: #fff;
	text-align:left;
}

#category li {
	padding:5px 0 5px 8px;
	border-bottom: 0px dashed #ddd;
	background: transparent url(strelica2.gif) no-repeat left center;
	color:#777;
    font: normal 13px Arial, Sans-Serif;
	margin-left:10px;
	text-align:left;
}
#category p {
	padding:5px 0 5px 10px;
	text-align:left;
} .question {
	float:left;
  	font-size:14px;
  	padding:3px 8px;
  	color:#E228E2;
	text-align:left;
	width:470px;
	cursor:pointer;
	display:block;
	padding-top:1px;
	padding-bottom:1px;
}
.answer {
	text-align:left;
  	font-size:14px;
	width:460px;
  	color:#28B228;
	line-height:150%;
	padding-left:35px !important;
	padding-left:0px;
	padding-top:5px;
	display:block;
}
/* 频道首页  */
#channel_index {
    width:506px !important;
	width:520px;
	min-height:500px !important;
	height:500px;
	float:right;
	background:  #f9f9f9;
	padding-right:35px !important;
	padding-right:25px;
	padding-left:30px;
	padding-top:30px;
	margin-bottom:10px !important;
	margin-right:12px !important;
	margin:0 3px 0 0px;
	border:1px solid #e0e0e0;
}
#channel_index p {
	border-bottom: 0px dashed #ddd;
	color:#777;
    font: normal 14px Arial, Sans-Serif;
	margin-left:10px;
	text-align:left;
	padding-bottom:14px;
	line-height:150%;
}
#channel_index h1 {
	padding:5px 0 5px 10px;
	margin:0px auto;
	margin-bottom:10px;
	font-size:28px;
	color:#f60;
	border-bottom:0px dashed #808080;
	text-align:center;
}

	/* 捐赠者回访*/
#feedback {
    width:572px !important;
	width:570px;
	min-height:500px;
	float:right;
	background:  #f9f9f9;
	margin-right:10px !important;
	margin-right:2px;
	margin-bottom:10px !important;
	border:1px solid #e0e0e0;
}
#feedback form {
	padding:10px 10px 40px 10px;
}

#feedback h1{
    color:#f60;
	padding:10px 12px 10px 12px;
	border-bottom:1px solid #999;
	width:380px;
	text-align:center;
	margin:10px auto;
	font-size:24px;
}
#feedback h2{
    color:#f60;
	padding:10px 12px 10px 12px;
	width:476px;
	text-align:center;
	margin:10px auto 0 auto;
	font-size:16px;
	font-weight:bold;
}
#feedback .message{
    width:460px;
	font-weight:normal;
	text-align:left;
	margin:0 auto;
	color:#808080;
	border-top:0;
    line-height:250%;
	padding:20px;
}

#feedback p{
    color:#555;
	margin:3px 0;
	padding:6px 4px 4px 8px;
	font-size:14px;
    line-height:150%;
}

#feedback input {
    position:relative !important;
	position:relative;
	bottom:2px !important;
	bottom:0;
	right:2px !important;
	right:0;
}
#feedback img{
   text-align:center;
   margin:0 auto;
}

.input_bg {
	height:18px;
	line-height:18px;
}
.but {
   width:50px;
   height:30px;
   color:#f60;
   line-height:150%;
   position:relative;
   top:3px;
}
.test_bg {
   width:224px !important;
   width:210px;
}

.fault {
    font:bold 16px Arial, Sans-Serif;
	color:#FD9617;
	width:410px;
	padding:20px 0 10px 56px;
	margin-left:40px;
	background: transparent url(warming.jpg) no-repeat left center;
	line-height:120%;
}
.warming  {
    font:normal 13px Arial, Sans-Serif;
	color:#f60;
	border:1px dashed #e0e0e0;
	background:#FFF;
	line-height:150%;
	padding:5px 10px 10px 10px;
}

.warmingwidth {
    width:390px;
	margin:10px auto;
}
  
     /*  阳光搜索 */

#isunsou {
    width:506px !important;
	width:513px;
	height:400px;
	float:right;
	background:  #f9f9f9;
	padding-right:35px !important;
	padding-right:25px;
	padding-left:30px;
	margin-bottom:10px !important;
	margin-right:12px !important;
	margin:0 3px 0 0px;
	text-align:left;
	border:1px solid #e0e0e0;
}

#isunsou span {
	margin-right:2px;
	color:#808080;
}
#isunsou h1 {
	padding:5px 0 5px 10px;
	margin:15px auto;
	margin-bottom:5px;
	font-size:28px;
	color:#f60;
	border-bottom:0px dashed #808080;
	text-align:center;
}
#isunsou h2 {
	padding:5px 0 5px 10px;
	margin:15px auto;
	font-size:16px;
	color:#029C9C;
	border: 1px dashed #e0e0e0;
	background: #fff;
	text-align:left;
}

#isunsou h5 {
	padding:5px 0 5px 8px;
	border-bottom: 0px dashed #ddd;
	background: transparent url(strelica2.gif) no-repeat left center;
	color:#777;
    	font: normal 13px Arial, Sans-Serif;
	margin-left:10px;
	text-align:left;
}
#isunsou p {
	padding:5px 0 5px 10px;
	text-align:left;
}

/*框头*/
.box_title{
	color: #000;
	border-top:1px solid #c0ccc9;
	background: #af0;
	background-repeat:repeat-x;
	height:22px;
	line-height:22px;
	padding:0 5px;
	clear:both;
}
/*提示出错框*/
.error_box{
	border:1px solid #c0ccc9;
	border-top-width:0;
	border-style:outset;
	text-align:center;
	margin-top:50px;
	margin-bottom:10px;
	padding-bottom: 10px;
	width:100px;
}
.error_box span{
	text-decoration: underline;
	color:#0000AA!important;
}
/*结果框*/
.result_box{
	border:1px solid #c0ccc9;
	border-top-width:0;
	border-style:outset;
	text-align:center;
	margin-top:50px;
	margin-bottom:10px;
	padding-bottom: 10px;
	width:500px;
}

/*-google-*/

/*搜索本站*/
/* the GSearchControl CSS Classes
 * .gsc-control : the primary class of the control
 */
.gsc-control {
    width: 500px;
}

.gsc-control div {
  position: static;
}

/* control inputs
 * .gsc-search-box : the container that hosts the text input area
 * .gsc-input : the text input area
 * .gsc-keeper : the save link below savable results
 */
form.gsc-search-box {
  font-size: 13px;
  margin:10px 0 4px 0;
  width: 100%;
}

/*
 * This table contains the input element as well as the search button
 * Note that the search button column is fixed width, designed to hold the
 * button div's background image
 */
table.gsc-search-box {
  width : 100%;
  margin-bottom : 4px;
  height:19px;
}

table.gsc-search-box td {
  vertical-align : middle;
}

table.gsc-search-box td.gsc-input {
  padding-right : 2px;
}

td.gsc-search-button {
  width : 1%;
}

td.gsc-clear-button {
  width : 14px;
}

/**
 * undo common generic table rules
 * that tend to impact branding
 */
table.gsc-branding td,
table.gsc-branding {
  margin: 0 0 0 0;
  padding: 0 0 0 0;
  border : none;
}

table.gsc-branding {
  border-style : none;
  border-width : 0px;
  border-spacing : 0px 0px;
  width : 100%;
}

td.gsc-branding-text {
  vertical-align : top;
}

td.gsc-branding-text div.gsc-branding-text {
  padding-bottom : 2px;
  text-align : right;
  color : #6A757D;
  font-size : 12px;
  margin-right : 2px;
}

td.gsc-branding-img-noclear {
  width : 51px;
  vertical-align : bottom;
}

td.gsc-branding-img {
  width : 65px;
  vertical-align : bottom;
}

table.gsc-branding-vertical td.gsc-branding-text div.gsc-branding-text {
  margin-right : 0px;
  text-align : center;
}

table.gsc-branding-vertical td.gsc-branding-img-noclear {
  text-align : center;
}

div.gsc-branding-img,
div.gsc-branding-img-noclear,
img.gsc-branding-img,
img.gsc-branding-img-noclear {
  padding-top : 1px;
}

img.gsc-branding-img,
img.gsc-branding-img-noclear {
  margin : 0 0 0 0;
  padding-right : 0;
  padding-left : 0;
  padding-bottom : 0;
  border : none;
  display : inline;
}

a.gsc-branding-clickable {
  cursor : pointer;
}

input.gsc-search-button {
  margin-left : 2px;
}

div.gsc-clear-button {
  display : inline;
  text-align : right;
  margin-left : 4px;
  margin-right : 4px;
  padding-left : 10px;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url('clear.gif');
  cursor : pointer;
}

/*
 * Given that this is sitting in a variable width tabel cell, the idea is
 * for it to consume the entire cell. The adjacent cell contains the search
 * button and that is a fixed width cell.
 */
input.gsc-input {
  padding-left : 2px;
  border-style : solid;
  border-width : 1px;
  border-color : #BCCDF0;
  width : 99%;
  height:20px;
  line-height:20px;
}

.gsc-keeper {
  color: #3366cc;
  text-decoration: underline;
  font-size: 13px;
  cursor: pointer;
  font-weight: normal;

  padding-left: 16px;
  background-repeat: no-repeat;
  background-position: 1px 3px;
  background-image: url('blue_check.gif');
}

/* each section of results has a results header table
 * .gsc-resultsHeader : the header itseld
 * td.twiddleRegionCell : the section that controls twiddleing of the section to expand/collapse
 * td.configLabelCell : the twiddler that controls active configuration of a searcher (used in GlocalSearch)
 * .gsc-twiddle : the twiddle image, note, this is a div that wraps gsc-title so that standard image replacement is feasible
 * .gsc-twiddle-closed : class added to gsc-twiddle when the twiddler is in the closed state
 * .gsc-twiddle-opened : class added to gsc-twiddle when the twiddler is in the opened state
 * .gsc-title : the section's title (e.g., Web Results, etc.)
 * .gsc-stats : contains the result counts
 * .gsc-stats
 */
.gsc-resultsHeader {
  clear: both;
  width: 100%;
  border-bottom: 1px solid #e9e9e9;
  margin-bottom : 4px;
}

.gsc-resultsHeader td.gsc-twiddleRegionCell{
  width: 75%;
}

.gsc-resultsHeader td.gsc-configLabelCell{
  text-align: right;
  width: 75%;
}

/*
 * note that the next three classes are all joined together
 * to implement the twiddle image. apps can substitute in their
 * own images but will need to account for the image size here
 * as well as in the left padding of the title element
 *
 * Note: uds provides the following images that work with the geometry/padding defined below
 *  to use these images simply over-ride the.gsc-twiddle-opened/-closed class and specify an alternate image
 *  or use an image of your own design
 */
.gsc-resultsHeader .gsc-twiddle{
  margin-top: 4px;
  display: inline;
  cursor: pointer;
  background-repeat: no-repeat;
  background-position: 0px 2px;
}
.gsc-resultsHeader td.gsc-twiddle-closed div.gsc-twiddle{
  background-image: url('arrow_close.gif');
}
.gsc-resultsHeader td.gsc-twiddle-opened div.gsc-twiddle{
  background-image: url('arrow_open.gif');
}

.gsc-resultsHeader .gsc-title{
  color: #336633;
  font-size:12px;
  margin-right: 10px;
  padding-left: 14px;
  display: inline;
}

.gsc-resultsHeader .gsc-stats {
  color: #6A757D;
  font-size:12px;
  font-weight: normal;
  display : inline;
}

.gsc-resultsHeader td.gsc-twiddle-opened .gsc-stats {
  display : none;
}

/*
 * .gsc-results-selector : box surrounding individual selectors for 1, more, or all results
 * .gsc-result-selector : an individual selector
 * .gsc-one-result : single result selector
 * .gsc-more-results : more (4) results selector
 * .gsc-all-results : all results (8) selector
 */
.gsc-results-selector {
  display : inline;
}

.gsc-resultsHeader td.gsc-twiddle-closed .gsc-results-selector {
  display : none;
}

.gsc-result-selector {
  cursor : pointer;
  display : inline;
  font-size : 13px;
  padding-left : 13px;
  background-repeat: no-repeat;
  background-position: center left;
}

/* default mode is dark */
.gsc-one-result {
  background-image: url('one-complex-dark.gif');
}

.gsc-more-results {
  background-image: url('more-complex-dark.gif');
}

.gsc-all-results {
  background-image: url('all-complex-dark.gif');
  padding-right : 1px;
}

/* active mode is light */
.gsc-one-result-active .gsc-one-result {
  background-image: url('one-complex-light-blue.gif');
}

.gsc-more-results-active .gsc-more-results {
  background-image: url('more-complex-light-blue.gif');
}

.gsc-all-results-active .gsc-all-results {
  background-image: url('all-complex-light-blue.gif');
}

.gsc-resultsHeader .gsc-configLabel{
  color: #6A757D;
  display: inline;
  font-size:12px;
  cursor: pointer;
}

.gsc-resultsHeader td.gsc-configLabelCell span.gsc-twiddle-closed {
  padding-right: 12px;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url('settings.gif');
}


/* tabbed mode of search control
 * .gsc-tabsArea : the box containing all of the tabs
 * .gsc-tabsAreaInvisible : same as above, but this is the state when search has been cleared
 * .gsc-tabHeader : an individual tab
 * .gsc-tabHeader.gsc-tabhActive : the active tab
 * .gsc-tabHeader.gsc-tabhInactive : an inactive tab
 * .gsc-tabData : the data area/box containg results and header data for each tab
 * .gsc-tabData.gsc-tabdActive : the data area for the active tab
 * .gsc-tabData.gsc-tabdInactive : the data area for inactive tabs
 */
.gsc-tabsArea {
  clear: both;
  margin-top: 6px;
  }

.gsc-tabsArea .gs-spacer {
  font-size : 1px;
  margin-right : 2px;
  overflow : hidden;
}

.gsc-tabsArea .gs-spacer-opera {
  margin-right : 0px;
}

.gsc-tabsAreaInvisible {
  display : none;
  }

.gsc-tabHeader {
  display: inline;
  cursor: pointer;
  padding-left: 6px;
  padding-right: 6px;
  margin-right: 0px;
  }

.gsc-tabHeader.gsc-tabhActive {
  border-left: 1px solid #e9e9e9;
  border-right: 1px solid #e9e9e9;
  border-top: 2px solid #ff9900;
  color: black;
  }

.gsc-tabHeader.gsc-tabhInactive {
  border-left: 1px solid #e9e9e9;
  border-right: 1px solid #e9e9e9;
  border-top: 2px solid #e9e9e9;
  background: #e9e9e9;
  color: #6A757D;
  }

.gsc-tabData.gsc-tabdActive {
  display: block;
  }

.gsc-tabData.gsc-tabdInactive {
  display: none;
  }

/* tab specific results header supression
 * - no twiddle, tabbed mode runs in full expand mode
 * - no title
 * - no stats
 */
.gsc-tabData .gsc-resultsHeader .gsc-title {
  display: none;
  }

.gsc-tabData .gsc-resultsHeader .gsc-stats {
  display: none;
  }

.gsc-tabData .gsc-resultsHeader .gsc-results-selector {
  display : none;
}



/* the results for each section
 * .gsc-resultsbox-{visible,invisible} : a complete-collection of results including headers
 * .gsc-results : the collection of results for a given searcher
 * .gsc-result : a generic result within the control. each result has this class, as well as .gsc-xxxResult where xxx is web, image, local, blog, etc.
 */
.gsc-resultsbox-visible {
  display : block;
}

.gsc-resultsbox-invisible {
  display : none;
}

.gsc-results {
  clear: both;
  padding-bottom: 2px;
}

.gsc-result {
  margin-bottom: 10px;
}

.gsc-result .gs-title {
  height: 1.4em;
  overflow: hidden;
  }

/* specialized, result type specific, fine grained controls */
.gsc-result div.gs-watermark {
  display: none;
}

/* Ads
 */
.gsc-results .gsc-result img.gs-ad-marker {
  display: none;
}

/* Standard configuration div/form */
div.gsc-config {
  border: 1px solid #e9e9e9;
  margin-top: 0px;
  margin-bottom: 10px;
  padding-top : 2px;
  padding-left : 6px;
  padding-right : 6px;
  padding-bottom : 6px;
}

form.gsc-config {
  margin-bottom : 0px;
}

.gsc-configSetting {
  margin-top : 6px;
  }

.gsc-configSetting_Label {
  color: #6A757D;
  }

.gsc-configSettingInput {
  color: #6A757D;
  border: 1px solid #e9e9e9;
  width: 75%;
  }

.gsc-configSettingCheckbox {
  color: #6A757D;
  margin-right: 6px;
  }

.gsc-configSettingCheckboxLabel {
  display : inline;
  color: #6A757D;
  }

div.gsc-configSettingSubmit {
  margin-top : 8px;
  text-align : right;
}

input.gsc-configSettingSubmit {
  display: inline;
  font-size:12px;
  cursor: pointer;
}


/* Image Search
 */
.gsc-imageResult {
  float: left;
  margin-bottom: 1em;
  margin-right: 20px;
}

.gs-imageResult {
  width: 114px; /* default width + 1px border */
  overflow : hidden;
}

.gs-imageResult .gs-image-box {
  height: 86px; /* default height + 1px border */
  position : relative;
}

/* note, left edge is auto-set by search control */
.gs-imageResult .gs-image-box img.gs-image {
  position : absolute;
  bottom : 0px;
}

.gs-imageResult .gs-text-box {
  text-align: center;
  overflow : hidden;
  height: 4em;
}

.gs-imageResult .gs-snippet {
  overflow : hidden;
  line-height: 1em;
  cursor : pointer;
  white-space : nowrap;
}
.gs-imageResult .gs-visibleUrl {
  cursor : pointer;
}
.gs-imageResult .gs-size {
  color: #6f6f6f;
}

/* Video Search
 * - single line title
 */

.gsc-videoResult .gs-videoResult .gs-title {
  line-height: 1.3em;
  height: 1.3em;
  overflow: hidden;
  }

.gsc-videoResult .gs-videoResult .gs-snippet {
  line-height: 1.3em;
  max-height: 2.6em;
  overflow: hidden;
  }

/* trailing more link at the bottom of
 * a collection of results
 */
.gsc-imageResult .gsc-trailing-more-results {
  clear : both;
}

.gsc-results .gsc-trailing-more-results {
  margin-bottom : 10px;
}

.gsc-results .gsc-trailing-more-results,
.gsc-results .gsc-trailing-more-results * {
  color: #0000cc;
  text-decoration: underline;
}


/*** End of Control, Begin Results ***/

/* generic, cross cutting result style
 * - in the form of .gs-result .gs-xxx where xxx is the generic style
 * .gs-title : typically the first line of a result, typically a link, image results over ride this, since for image results, the image is the link
 * .gs-divider : typically seperates results from ads
 * .gs-visibleUrl : typically the last line of a result, displayed in green. sometimes a link (like in blog search)
 * .gs-clusterUrl : for news, and other similar services, this is a cluster of additional results
 * img.gs-image : an actial image in a result
 * .gs-phone : a phone number
 * .gs-address : an address (includes street, city, region, country)
 * .gs-streetAddress : a street (including #)
 * .gs-city : a city
 * .gs-region : a region (zip code, area, etc.)
 * .gs-country : a country
 * .gs-snippet : snippetized content
 * .gs-watermark : indicator that user selected this result
 * .gs-metadata : generic metadata, e.g.,
 * .gs-image-box : generic container for a result's image (within a table)
 * .gs-text-box : generic container for a result's text content (within a table). Note that this class, and image-box are only used in video
 */
.gs-result .gs-title,
.gs-result .gs-title * {
  color: #0000cc;
  text-decoration: underline;
  text-align: left;
}

.gs-divider {
  padding-bottom: 8px;
  text-align: center;
  color: #6A757D;
}

.gs-result a.gs-visibleUrl,
.gs-result .gs-visibleUrl {
  color: #008000;
  text-decoration: none;
}

/* relative and absolute dates, note, news/books inlines these */
.gs-relativePublishedDate,
.gs-publishedDate {
  color: #6f6f6f;
  text-decoration: none;
}
.gs-result a.gs-clusterUrl,
.gs-result .gs-clusterUrl {
  color: #008000;
  text-decoration: underline;
  cursor: pointer;
}

.gs-newsResult .gs-publisher {
  color: #6f6f6f;
  display : inline;
  text-decoration: none;
}

/*
 * For news results there are two dates...
 * The relative date is visible while in the
 * search control and the published date
 * is visible when clipped. Why? It doesn't
 * make sense to say 4 hours ago for a clipped
 * result...
 */

/* establish the base style */
.gs-newsResult .gs-relativePublishedDate,
.gs-newsResult .gs-publishedDate {
  display : inline;
  margin-left : 4px;
}

/* base styling for relative date is none */
.gs-blogResult .gs-relativePublishedDate,
.gs-newsResult .gs-relativePublishedDate {
  display : none;
}

/* suppress publishedDate while in the control */
.gsc-blogResult .gs-blogResult .gs-publishedDate,
.gsc-newsResult .gs-newsResult .gs-publishedDate {
  display : none;
}

/* enable relativePublishedDate while in the control */
.gsc-blogResult .gs-blogResult .gs-relativePublishedDate,
.gsc-newsResult .gs-newsResult .gs-relativePublishedDate {
  display : inline;
}

.gs-newsResult .gs-location {
  color: #6f6f6f;
  display : inline;
  text-decoration: none;
}

.gs-result img.gs-image {
  vertical-align : middle;
  border : 1px solid #0000cc;
}

.gs-result div.gs-phone {}

.gs-result .gs-directions,
.gs-result .gs-directions * {
  color: #7777cc;
  font-weight: normal;
  text-decoration : underline;
  cursor : pointer;
}

.gs-secondary-link,
.gs-secondary-link * {
  color: #7777cc;
  font-weight: normal;
  text-decoration : underline;
  cursor : pointer;
}

/* wrapper around user supplied to/from mode directions
 * normally this is disabled by default, and gs-directions is enabled
 * apps can easily switch this by setting display:block on the rule below,
 * and display:none on the rule above
 * e.g., add these two rules to switch local results into
 * alternate style driving directions
 * .gs-localResult .gs-directions-to-from { display : block; }
 * .gs-localResult .gs-directions { display : none; }
 */
.gs-result .gs-directions-to-from {
  display : none;
  margin-top : 4px;
}
.gs-result .gs-directions-to-from .gs-label {
  display : inline;
  margin-right : 4px;
}

.gs-result .gs-directions-to-from div.gs-secondary-link {
  display : inline;
}

.gs-result .gs-directions-to-from .gs-spacer {
  display : inline;
  margin-right : 3px;
  margin-left : 3px;
}

.gs-videoResult a.gs-publisher,
.gs-videoResult .gs-publisher {
  color: #008000;
  text-decoration: none;
}

.gs-result a {
  cursor: pointer;
}

.gs-result .gs-address {
}

.gs-result .gs-snippet {
}

.gs-no-results-result .gs-snippet,
.gs-error-result .gs-snippet {
  padding : 5px;
  margin : 5px;
  border : 1px solid rgb(255,204,51);
  background-color : rgb(255,244,194);
}

.gs-result .gs-watermark{
  font-size: 10px;
  color: #7777cc;
}

div.gs-results-attribution {
  text-align : center;
  margin-bottom : 4px;
}

div.gs-results-attribution,
div.gs-results-attribution * {
  font-size : 10px;
  color : #6A757D;
  text-decoration : none;
}

div.gs-results-attribution a {
  color: #0000cc;
  cursor : pointer;
}

div.gs-results-attribution a:hover {
  text-decoration : underline;
}

.gs-result .gs-metadata{
  color: #6A757D;
}

/* searcher specific styling for
 * - web ad
 * - web
 * - local
 * - image (none)
 * - blog (none)
 * - video (none)
 */

/* webAd search specific over rides
 * .gs-ad-marker : disabled in control, but on in green to indicate clipped result is an ad
 */
.gs-localAd img.gs-ad-marker,
.gs-webAd img.gs-ad-marker {
  padding-left: 4px;
}

/* default is to not show long mode visible urls
 * apps should selectively enable this while disabling
 * div.gs-visibleUrl-short
 */
.gs-webResult div.gs-visibleUrl-long {
  width : 100%;
  overflow : hidden;
  display : none;
}

/* local search specific over rides
 * - city, region displayed inline
 * - country supressed
 * - small font size for info window's
 */

.gs-localAd div.gs-address * {
  color : #6A757D;
}

.gs-localAd div.gs-street {
  display: inline;
}

div.gs-city {
  display: inline;
}

div.gs-region {
  display: inline;
}

div.gs-country {
  display: none;
}

div.gs-infoWindow * {
  font-size:12px;
  }

/* video search specific over rides
 * - align the table data
 * - default image width garuntee
 * - appropriate cell seperation
 */

/* todo(markl): workaround until gre in gmail fixes his styles */
.gs-videoResult * {
  font-size: 13px;
  }

/*
.gs-videoResult td .gs-image {
  vertical-align : middle;
}

.gs-videoResult td.gs-image-box {
  background-color : #000000;
}*/

.gs-videoResult td div.gs-image-box {
  width : 110px;
  height : 78px;
}

.gs-videoResult td div.gs-text-box {
  vertical-align: top;
  margin-left: 4px;
  }


/* book search specific over rides
 * - default image width garuntee
 * - appropriate cell seperation
 */

div.gs-book-image-box td,
.gs-bookResult td {
  vertical-align : top;
}

/*div.gs-book-image-box,
div.gs-book-image-box div {
  position : static;
  text-align : start;
}       */

div.gs-book-image-box {
  width : 75px;
  height : 90px;
}

.gs-bookResult td div.gs-text-box {
  vertical-align: top;
  margin-left: 4px;
  }

div.gs-book-image-box img {
  border-spacing : 0px 0px;
  border : none;
}

div.gs-book-image-box div.gs-row-1 {
  line-height : 7px;
}

div.gs-book-image-box img.gs-pages {
  height : 7px;
  width : 45px;
}

div.gs-book-image-box img.gs-page-edge {
  height : 7px;
  width : 11px;
}

div.gs-book-image-box div.gs-row-2 {
}

div.gs-book-image-box img.gs-image {
  height : 80px;
  border : 1px solid #a0a0a0;
}

.gs-bookResult .gs-author {
  display : inline;
  color: #6f6f6f;
}
.gs-bookResult .gs-publishedDate {
  display : inline;
}

.gs-bookResult .gs-pageCount {
  display : inline;
  color: #6f6f6f;
  margin-left : 4px;
}

.gs-bookResult .gs-id {}

#searchglossary {
    width:506px !important;
	width:513px;
	min-height:600px !important;
	height:700px;
	float:right;
	background:  #f9f9f9;
	padding-right:35px !important;
	padding-right:25px;
	padding-left:30px;
	padding-bottom:20px;
	margin-bottom:10px !important;
	margin-right:12px !important;
	margin:0 3px 0 0px;
	text-align:center;
	border:1px solid #e0e0e0;
}

#searchglossary h1 {
	padding:5px 0 5px 10px;
	margin:15px auto;
	margin-bottom:5px;
	font-size:20px;
	color:#f60;
	border-bottom:0px dashed #808080;
	text-align:center;
}
#searchglossary h2 {
	padding:5px 0 5px 10px;
	margin:10px auto 10px auto;
	font-size:15px;
	color:#029C9C;
	background: #fff;
	text-align:left;
}


#searchglossary p {
	padding:5px 0 5px 10px;
	text-align:left;
    font:normal 14px verdana;
	line-height:150%;
}

#begroup {
    width:506px !important;
	width:513px;
	min-height:500px !important;
	float:right;
	background:  #f9f9f9;
	padding-right:35px !important;
	padding-right:25px;
	padding-left:30px;
	padding-bottom:20px;
	margin-bottom:10px !important;
	margin-right:12px !important;
	margin:0 3px 0 0px;
	text-align:center;
	border:1px solid #e0e0e0;
}

#begroup h1 {
	margin:50px auto 15px auto;
	font-size:28px;
	color:#f60;
	border-bottom:0px dashed #808080;
	text-align:center;
	border-bottom:1px solid #555;
	width:410px;
}
#begroup h2 {
	padding:5px 0 5px 10px;
	margin:10px auto 10px auto;
	font:bold 14px verdana;
	color:#f60;
	border:1px dashed #e0e0e0;
	background: #fff;
	text-align:left;
}
#begroup p {
	padding:5px 0 5px 10px;
	text-align:left;
	font-size:12px;
	line-height:200%;
	font-size:13px;
	margin:0 auto;
}
#output {
    width:572px !important;
	width:570px;
	float:right;
	background:  #f9f9f9;
	margin-right:10px !important;
	margin-right:2px;
	margin-bottom:10px !important;
	border:1px solid #e0e0e0;
	padding:30px 0 30px 0;
}

#output h1{
    color:#f60;
	padding:10px 12px 10px 12px;
	width:476px;
	text-align:center;
	margin:10px auto 0 auto;
	font-size:16px;
	font-weight:bold;
}
#output .message{
    width:460px;
	font-weight:normal;
	text-align:left;
	margin:0 auto;
	color:#808080;
	border-top:0;
    line-height:250%;
	padding:20px;
}

#output p{
    color:#555;
	margin:3px 0;
	padding:6px 4px 4px 8px;
	font-size:14px;
    line-height:150%;
}

#output input {
    position:relative !important;
	position:absolute;
	bottom:2px !important;
	bottom:0;
	right:2px !important;
	right:0;
}
#output img{
   text-align:center;
   margin:0 auto;
}
#output span{
   color:#f60;
   margin-left:200px;
   text-decoration: underline;
}


#queryform {
    width:506px !important;
	width:513px;
	min-height:600px !important;
	float:right;
	background:  #f9f9f9;
	padding-right:35px !important;
	padding-right:25px;
	padding-left:30px;
	padding-bottom:20px;
	margin-bottom:10px !important;
	margin-right:12px !important;
	margin:0 3px 0 0px;
	text-align:center;
	border:1px solid #e0e0e0;
}

#queryform h1 {
	padding:5px 0 5px 10px;
	margin:15px auto;
	margin-bottom:5px;
	font-size:20px;
	color:#f60;
	text-align:center;
}
#queryform h2 {
	padding:5px 0 5px 10px;
	margin:10px auto 5px auto;
	font-size:15px;
	color:#029C9C;
	background: #fff;
	text-align:left;
	border: 1px solid #e0e0e0;
}


#queryform p {
	padding:5px 0 5px 10px;
	text-align:left;
    font:normal 14px verdana;
	line-height:150%;
}

#queryform a{
	color:#029C9C;
}

#queryform a:hover{
	color:#029C1C;
}
