@charset "UTF-8";
/* CSS Document */


/* --------------------| BODY |-------------------- */

html, body {
font-size: 12px;
color: #474747;
width: 100%;
height: 100%;
}

body {
background: #fff;
background-image:url(images/background/country_crossroads_mainbg.png);
background-repeat:repeat-x;
}

/* --------------------| GENERAL TEXT |-------------------- */

.blue { 	color: #454a82; }

a {
color: #454a82;
}

a:hover {
	text-decoration: underline;
}

h1,h2,h3,h4,h5,h6,
h1 *, h2 *, h3 *, h4 *, h5 *, h6 * {
font-weight: normal;
}

h2{
font-size: 24px;
text-transform: uppercase;
color:  #454a82;
font-family: Verdana, Arial, Helvetica, sans-serif;
margin-bottom:20px;
}

strong {
font-weight: bold;
}

em {
font-style: oblique;
}

p{
line-height: 20px;
color: #0f0f2f;
font-family: Verdana, Arial, Helvetica, sans-serif;
margin-bottom:15px;
}

/* --------------------| GENERAL CRAP |-------------------- */

.clear {
clear:both;
display: block;
}

.clearfix:after {
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}

.clearfix {display:inline-block;}
/* Hide from IE Mac \*/
.clearfix {display:block;}
/* End hide from IE Mac */

.clear10 {height:10px; clear:both;}
.clear15 {height:15px; clear:both;}
.clear20 {height:20px; clear:both;}
.clear30 {height:30px; clear:both;}
.clear45 {height:45px; clear:both;}
.clear40 {height:40px; clear:both;}
.clear60 {height:60px; clear:both;}

.right { float: right !important; }
.left { float: left !important; }

.textRight { text-align: right; }
.textLeft { text-align: left; }


/* --------------------| MAIN CONTENT AREA |-------------------- */


#contentBorder{
	width: 998px;
	background-image:url(images/background/country_crossroads_border.png);
	margin: 0 auto 0 auto;
}


#contentContainer {
width: 900px;
height:725px;
margin: 0 auto 0 auto;

}

#mainArea{
background-image: url(images/background/country_crossroads_homebg.png);
height: 544px;
width: 900px;
display:block;
}


#textArea{
padding: 25px 25px 0 25px;
}
#textArea2{
padding: 20px 0px 20px 5px;
}

/*---------------------| Pictures --------------------------*/

#imageArea{
padding: 0px 0px 0px 0px;
display:block;
}

/* --------------------| HEADER AND NAV |-------------------- */

#header {
height: 158px;
background-image:url(images/header/country_crossroads_headerbg.png);
}

	a#headerLogo {
	float: left;
	padding-left:3px;
	margin-top: 25px;
	display: inline;
	}
	
	
	
#navMain{
height: 37px;
width: 900px;
background-image:url(images/navigation/country_crossroads_navbg.png);
background-repeat:repeat-x;
}
	
	#navMain ul {
	float: right;
	margin-right:35px;
	}
	
	
		#navMain ul li {
		display: inline-block;
		float: left;
		}
			
			
		 #navMain ul li a#about{
		background-image: url(images/navigation/country_crossroads_nav.png);
		background-repeat: no-repeat;
		background-position: 0px 0px;
		height: 37px;
		width: 115px;
		display: block;
		}
			
		#navMain ul li a#about:hover{
		background-position: 0px -38px;
		}
		
			
		 #navMain ul li a#aboutActive{
		background-image: url(images/navigation/country_crossroads_nav.png);
		background-repeat: no-repeat;
		background-position: 0px -38px;
		height: 37px;
		width: 115px;
		display: block;
		}
			
		#navMain ul li a#services{
		background-image: url(images/navigation/country_crossroads_nav.png);
		background-repeat: no-repeat;
		background-position: -115px 0px;
		height: 37px;
		width: 103px;
		display: block;
		}
			
		#navMain ul li a#services:hover{
		background-position: -115px -38px;
		}
		
		#navMain ul li a#servicesActive{
		background-image: url(images/navigation/country_crossroads_nav.png);
		background-repeat: no-repeat;
		background-position: -115px -38px;
		height: 37px;
		width: 103px;
		display: block;
		}
		
		#navMain ul li a#projects{
		background-image: url(images/navigation/country_crossroads_nav.png);
		background-repeat: no-repeat;
		background-position: -218px 0px;
ery		height: 37px;
		width: 91px;
		display: block;
		}
		
		#navMain ul li a#projects:hover{
		background-position: -218px -38px;
		}
		
		#navMain ul li a#projectsActive{
		background-image: url(images/navigation/country_crossroads_nav.png);
		background-repeat: no-repeat;
		background-position: -218px -38px;
		height: 37px;
		width: 91px;
		display: block;
		}
			
		
		#navMain ul li a#gallery{
		background-image: url(images/navigation/country_crossroads_nav.png);
		background-repeat: no-repeat;
		background-position: -309px 0px;
		height: 37px;
		width: 84px;
		display: block;
		}
			
		#navMain ul li a#gallery:hover{
		background-position: -309px -38px;
		}
		
		#navMain ul li a#galleryActive{
		background-image: url(images/navigation/country_crossroads_nav.png);
		background-repeat: no-repeat;
		background-position: -309px -38px;
		height: 37px;
		width: 84px;
		display: block;
		}
		
		#navMain ul li a#contact{
		background-image: url(images/navigation/country_crossroads_nav.png);
		background-repeat: no-repeat;
		background-position: -393px 0px;
		height: 37px;
		width: 109px;
		display: block;
		}
			
		#navMain ul li a#contact:hover{
		background-position: -393px -38px;
		}
		
		#navMain ul li a#contactActive{
		background-image: url(images/navigation/country_crossroads_nav.png);
		background-repeat: no-repeat;
		background-position: -393px -38px;
		height: 37px;
		width: 109px;
		display: block;
		}
		
		#navMain ul li a#warranty{
		background-image: url(images/navigation/country_crossroads_nav.png);
		background-repeat: no-repeat;
		background-position: -504px 0px;
		height: 37px;
		width: 96px;
		display: block;
		}
			
		#navMain ul li a#warranty:hover{
		background-position: -504px -38px;
		}
		
		#navMain ul li a#warrantyActive{
		background-image: url(images/navigation/country_crossroads_nav.png);
		background-repeat: no-repeat;
		background-position: -504px -38px;
		height: 37px;
		width: 96px;
		display: block;
		}
		
		/* --------------------|PROJECT LIST |-------------------- */

#projectList{
padding: 30px 30px 0 30px;
height: 20px;
width: 150px;
}

#projectDate{
padding: 30px 30px 0 30px;
height: 20px;
width: 200px;
margin: 60px;
}

#projectAddress{
padding: 30px 30px 0 30px;
height: 20px;
width: 300px;
}

#projectDetail{
padding: 30px 30px 0 30px;
height: 20px;
width: 300px;
}


/* --------------------| GALLERY |-------------------- */

#galleryBox{
width:60l0px;
margin: 20px 0 0 3px;
}

#galleryBox a{
border: solid 1px #FFF;
width:80px;
height: 48px;
display:block;
float:left;
margin:5px 10px 5px 0;
}


#galleryBox a.rightPic{
border: solid 1px #FFF;
width:110px;
height: 70px;
display:block;
float:left;
margin:5px 0 5px 0;
}

#galleryBox a:hover{
border: solid 1px #4b518f;

}

/* --------------------| TABS |-------------------- */
#tabs ul{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:14px;
	
	
	}
	
	
	.tabBoxFirst{
	height:18px;
	display:block;
	border-bottom: 1px solid #d9d7d9;
	padding:30px 0 8px 0;
	
	
}
	
	.tabBox{
	height:18px;
	display:block;
	border-bottom: 1px solid #d9d7d9;
	padding:10px 0 8px 0;
	
	
}
.tabBoxLast{
	height:18px;
	display:block;
	padding:10px 0 30px 0;
}

#tabs ul li.leftList{
	float:left;
	color:#454a82;
	line-height:18px;
	
	
} 
#tabs ul li.rightList{
	float:right;
	color:#0f0f2f;
	line-height:18px;
	} 
	
	.ui-tabs { 
width: 550px;
}
.ui-tabs .ui-tabs-nav li { 
float: left; 
border-bottom-width: 0 !important; 
margin: 0 1px 0 0; 
padding: 0; 
display: inline;
}
.ui-tabs .ui-tabs-nav li a { 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:18px;
float: left; 
color: #8e9ab2;
text-decoration: none; 
padding: 6px 12px; 
background-color: #d9d7d9;
display:inline;
}

.ui-tabs .ui-tabs-nav li.ui-tabs-selected { 
border-bottom-width: 0;
}

.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { 
cursor: pointer;
color:#454a82;
background-color: #bbbdc6;
}
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { 
cursor: pointer; 

}

.ui-tabs .ui-tabs-panel {
padding: 0 10px 0 10px; 
background-color: #bbbdc6;
clear:both;
}
 

.ui-tabs .ui-tabs-hide { display: none !important; }

	
#scroll{
	height: expression( this.scrollHeight > 332 ? "333px" : "auto" );
   	max-height: 450px;
	overflow:auto;
}	


/* --------------------| FOOTER |-------------------- */

#footer {
height: 159px;
background-image: url(images/footer/country_crossroads_footer.png);
background-repeat:repeat-x;
}