/* Company names */

#root_names .color_mainhead_label, #root_names .color_mainhead_icon
{
	padding-top: 12px;
	padding-bottom: 0px;
	height: 100px !important;
}

.page
{
	font-size: 11px;
}

.page a
{
	color: #006d68;
}


.page ul
{
	list-style-type:square;
}

#page_about, #page_climate, #page_climatehome
{
	display: none;
}

/* temp */

/*
.solutionimg img
{
	width: 150px;
}
*/

html
{
		
}





body, html
{
/*	height: 100%;*/

	font-family: verdana;
}

body
{
/*	height: 0;*/
overflow-y:scroll;
}

#sitecontainer
{
	/*width: 1000px;
	margin: 0 auto;
	*/

	height: 100%;
}

#left
{
	width: 215px;
/*
	float: left;
	min-height: 100%;

    height:     auto !important;
    height:     100%;
*/
	min-height: 100%;

    height:     auto !important;
    height:     100%;


	margin-right: 25px;
}



#right
{
	width: 730px;
	float: right;
}



/* Styles for the left side */


.filter_item input
{
	display: none;
}


.filter-item-selector
{
	font-size: 10px;
	height: 20px;
	line-height: 20px;
	vertical-align: middle;
	position:relative;
}

.climate-item-selector
{
/*	position:relative;*/
}


/* Multiline table hack */
.multiline_vcenter
{
	display: table;
	height: 100%;
}
	
.multiline_vcenter div 
{
  display: table-cell;
  vertical-align: middle;
}

.adaptiveheader, .climateinformation, .aboutmenu
{
	min-height: 60px;
	color: #ffffff;
	font-size: 11px;
	vertical-align: middle;
	background-color: #006d68;
	cursor:pointer;
}

.adaptiveheader .icon, .climateinformation .icon, .aboutmenu .icon
{
	background-color: #77aba9;
	vertical-align: middle;
	line-height: 60px;
}

.filter
{
	background-color: #dcdcdc;
	height: 50px;
	color: #000000;
	font-size: 11px;
	line-height: 50px;
}

.icon
{
	height: 100%;
	float: left;
	margin-right: 10px;
	text-align: center;
}

.filter .icon
{
	background-color:  #e5e5e5;
}

.filteritem .icon
{
	background-color: #f2f2f2;
	vertical-align: middle;
	line-height: 30px;
}

 .active .icon 
{
	background-color: #efe097  !important;
}

.active
{
	background-color: #ead674 !important;
}


.left-color
{
	width: 30px;
	min-height: 30px;
	float: left;
	float: left;
	margin-right: 10px;
	text-align: center;

	background-color: #ff0000;
}

.filteroption
{
	background-color: #f8f7de;
	cursor: pointer;
}

.filteroption div
{
	padding-left: 38px;	
	border-bottom: 1px solid #ffffff;
}

.filteroption div:last-child
{
	padding-left: 38px;	
	border-bottom: 0px;
}

.filteritem, .resultsitem
{
	background-color: #eeeeee;
	min-height: 30px;
	color: #000000;


	vertical-align: middle;
	line-height: 30px;
	border-bottom: 1px solid #ffffff;

	cursor: pointer;
}

.resultsitem
{
	font-size: 11px;
}

.filteritem, #numresultsbar
{
	font-size: 10px;
}

#climateinformation
{
	font-size: 11px;
	vertical-align: middle;
	border-bottom: 1px solid #ffffff;
	cursor: pointer;

	min-height: 60px;
}

#menu_about
{
	font-size: 11px;
	vertical-align: middle;
	border-bottom: 1px solid #ffffff;
	cursor: pointer;

	min-height: 60px;
}


.filteroption .climate-item-selector, .leftbutton
{
	padding:0px !important;
}

.climate-item-selector .icon,  .leftbutton .icon
{
	background-color: #e5e5e5;
	padding: 0px;

	float: left;

}

.climate-item-selector, .leftbutton
{
	background-color: #dcdcdc;
	color: #000000;
}



.height_60
{
	height: 60px !important;
}

#climates div, #aboutitems div
{
	line-height: 30px;
	min-height: 30px;
}

#aboutitems
{
	display:none;
}


#aboutmenu div
{
	line-height: 30px;
	min-height: 30px;
}


.hasborder
{
	border-bottom: 1px solid #ffffff;
}

#activemenu
{
	position:fixed;
	top:0;
	width: 215px;
}


#leftmenu .icon
{
	width: 30px;
}

.resultsitem
{
	height: 30px;
	background-color: #ead674;
	
}

.resultsitem .icon
{
	background-color: #efe097;
}


/*
.about
{

	color: #ffffff;
	font-size: 11px;
	vertical-align: middle;
	background-color: #006d68;
	min-height: 60px;
	line-height: 60px;
	cursor:pointer;
}
*/

#aboutmenu
{
	line-height: default;
}

/*
.about .icon
{
	background-color: #77aba9;
	height: 60px;
	vertical-align: middle;
	line-height: 60px;
}
*/


.filler
{
	background-color: #006d68;

	min-height: 100%; 
	height: 50px;

}

.filler .icon
{
	background-color: #77aba9;
}

.selectedfilter
{
	/*background-color: #cece00 !important;*/
	position: relative;

}

.filteritem div
{
	position: relative;
}

.arrow
{
	position: absolute;
	right: 4px;
	top: 12px;
}

.removebutton
	{
	position: absolute;
	right: 4px;
	top: 8px;
	
	display:none;

}

.selectedfilter .removebutton
{
	display:block;
}


/*
.menuitem .icon
{
	background-color: #77aba9;
}
*/

/* Styles for the right content side */

.solutionitem:hover .hilight
{
	background-color: #fdfce9;
}

.solutionitem
{
	width: 230px;
	height: 160px;

	margin-right: 10px;
	margin-bottom: 10px;
	
	float: left;

}

.solutioncaption
{
	background-color: #eeeeee;
	height: 30px;
	font-size: 11px;

}

.solutionimg
{
	background-color: #fafafa;
	height: 130px;
	vertical-align: middle;
	line-height: 130px;
	background-position: center center;
	background-repeat: no-repeat;;

}

.solutionimg, .solutioncaption
{
	text-align: center;
}

.scorenindicator-bg
{
	background-color: #F99393;
}
.scoreindicator
{
	line-height: 4px;
	background-color: #77ABA9;
	height: 4px;
	width: 200px;
}

.scorepct
{
	width: 1px;
	height: 10px;
	line-height: 10px;
	background-color: #000000;
	text-align: right;
}

#resultsheader
{
	height: 60px;
	line-height: 60px;
	vertical-align: middle;
}

#resultsheader .header_left
{
	height: 100%;
	width: 200px;
	float: left;
	line-height: normal;
}

#resultsheader .header_right
{
	float: left;
	vertical-align: middle;
	width: 500px;

	height: 60px;
	position: relative;
}

hr
{	
	min-height: 1px;
	height: 1px;
	line-height: 1px;
	background-color: #4a8f8c;
	width: 100%;
	margin: 0px;

	position: absolute;
	top: 50%;
	left: 0px;
}

.grey .solutionitem
{
	filter: alpha(opacity=50);
	opacity: 0.5;
}

#numresultsbar
{
	display: none;
}

/* Details view */

.solutiondetails
{
	width: 710px;
	background-color: #eeeeee;
	height: auto;
	border-bottom: 3px solid #f8f7de;
	margin: 10px 0px 10px 0px;
}

.solutiondetails h1
{
	font-size: 18px;
}

.solutiondetails, .solutiondetails h2
{
	font-size: 10px;
}

.solutiondetails h2
{
	font-weight:bold;
}

.detail-placeholder
{
	clear: left;
	overflow:hidden;
}

#details-clonable
{
	display:none;

}

/* End details view */


/* Bars */

.valuebar
{
	line-height: 10px;
	height: 10px;

	background-color: #77aba9;
	width: 80px;
}

.color_pluvial
{
	background-color: #77aba9;
}

.color_drought
{
	background-color: #ead674;
}

.color_heat
{
	background-color: #f99393;
}

.color_coastal
{
	background-color: #b2d5df;
}

.color_ground
{
	background-color: #dcdcdc;
}

.t-value 
{
	text-align: right;
}


/* End bars */

.details-photoholder
{
	position: relative;
	height: 330px;
	overflow:hidden;
}

.photo_caption
{
	position: absolute;
	bottom: 10px;
	left: 10px;
	width: 690px;	
	height: 30px;
	padding: 8px;

	background-color: #ffffff;
	filter: alpha(opacity=80);
	opacity: 0.8;

}

/* Buttons */

.squarebutton
{
	width: 30px;
	height: 30px;
	background-color: #ffffff;
	background-repeat: no-repeat;
	background-position:center; 
	cursor:pointer;
}

.button-left
{
	position:absolute;
	top: 150px;
	left: 10px;
	background-image: url(../img/gui/arrow-left.png);
}

.button-right
{
	position:absolute;
	top: 150px;
	right: 10px;
	background-image: url(../img/gui/arrow-right.png);

}


.button-close
{
	position:absolute;
	top: 10px;
	left: 670px;
	background-image: url(../img/gui/cross.png);
}

/* End buttons */


/* Icons next to filters */


/* Reset bar */

#resetfilterbutton
{
	width: 60px;
	height: 20px;
	background-color: #c02525;
	border: 0px;
	color: #ffffff;
	margin-right: 12px;
	font-size: 12px;
	line-height: normal;
	/*display: none;*/
}

#resetfilterbar
{
	display: none;
}

.filter
{
	background-color: #dcdcdc;
	height: 50px;
	color: #000000;
	font-size: 11px;
	line-height: 50px;
}

.icon
{
	height: 100%;
	float: left;
	margin-right: 10px;
	text-align: center;
}

.filter .icon
{
	background-color:  #e5e5e5;
}

#resetfilterbar
{
	text-align: right;
}

#notice_adaptationtarget
{
	display:block;
}

/* Climate home */

.climate-text
{
	width: 200px;
	height: 330px;
	background-color: #fafafa;
	font-size: 10px;
	float:left;
	padding: 18px;
	margin-right: 10px;
}

.cityblock, .aboutblock
{ 
	cursor: pointer;
	width: 230px;
	height: 161px;
	background-color: #fafafa;
	float:left;
	margin-bottom: 10px;
}

.cityblockleft
{
	margin-right: 10px;
}

.citycaption
{
	height: 32px;
	line-height: 32px;
	font-size: 10px;
	color: #000000;
	text-align: center;
	vertical-align:middle;
}


.aboutblock
{
	text-align: center;
}

.citycaption
{
	background-color: #eeeeee;
}

.aboutimage
{
	height: 128px;
	vertical-align:middle;
	line-height: 128px;
	border: 1px solid #eeeeee;
	margin-bottom: 1px;
}


/* For header with line */

.line-center{
    margin:0;
	padding:0 10px 0px 0px;
    background:#fff;
    display:inline-block;
}

.page h2{
    position:relative;
    z-index:2;
	font-size: 11px;
	margin-left: 0px;
	margin-right: 0px;
	padding-left: 0px;
	width: 710px;
	
}
.page h2:after{
    content:"";
    position:absolute;
    top:50%;
    left:0;
    right:0;
    border-top:solid 1px #4a8f8c;
    z-index:-1;
}

.icon_adaptation
{
height: 60px;
}

.details-properties
{
	width:210px; 
	float:left;
}


.details-description
{
	width: 470px;
	float: left; 
	padding: 0px 20px 0px 20px;
}

.details-description h2
{
	border: none;
}

.details-description h2:after
{
	border: none;
}


h3
{
	font-size: 11px;
}


#climatetable-home td
{
	font-size: 10px;
	padding: 5px;
	border-bottom: 1px solid #eeeeee;


}

#climateslider
{
	display:none;
}

#climatetable-home
{
	background-color: #fafafa;
	border-collapse: collapse;


}

#climate-cityname
{
	font-size: 18px !important;
}

#climatetable-home .columns td
{
	background-color: #eeeeee;
}

#climate-cityname
{
	padding-top: 10px !important;
	padding-bottom: 10px  !important;
	padding-left: 22px  !important;
}

#climatetable-home tbody
{
	border-bottom: 2px solid #40928e;
	
}


#btn-climate-close
{
	width: 30px;
	height: 30px;
	background-color: #ffffff;
	line-height: 30px;
	text-align: center;
	vertical-align:middle;
	float:right;
}

#climate-close
{
	text-align:right;
}


.text-block
{

	background-color: #fafafa;
	padding: 16px;
	width: 710px;
}


#searchbox
{
	width: 710px;
	text-align:right;
	padding: 0px;
	margin: 0px;
	vertical-align: top;
}

#searchtext
{
	color: #000000;
	background-color: #eeeeee;
	border: 0px;
	height: 30px;
	width: 200px;
}

#searchbutton
{
	border: 0px;
	padding: 0px;
	margin: 0px;
	background-image: url(../img/gui/search-button.png);
	width: 30px;
	height: 30px;
	float: right;
	background-repeat: no-repeat;
	background-position: center center;
	background-color: #006D68;
}