@charset "utf-8";
/* CSS Document for Construction Cost Association*/

* {font-family: Arial, Helvetica, sans-serif; font-size: 100%;}
html {height:100%; margin: 0px; padding: 0px; vertical-align:top;}
body, body.Home {height:100%;background: #d0d6de; margin: 0px; padding: 0px; position:relative;}
img {max-width:100%;height:auto; border:0;} .ie8 img {width:auto;height:auto;} 
	.HDArea {background: #f5c113;width: 100%; padding: 3% 0 0 0; float: left; }
	.Home .HDArea {margin: 0px 0px 0px 0px; padding: 3% 0 0 0;width: 100%; background: url('images/hmpg-bg.jpg') 0 0 repeat-x; }
		.HD {color: #FFFFFF;width: 90%; margin: 0px auto; }
		.HDWrapper {background: url('images/hd-bg.jpg') bottom repeat-x;width: 100%; height: 100%; position: relative; float: left; height: auto;}
		.CIS  {width: 24%; float: left;}
			.CIS  h1 {border:none; width: 100%;max-height: 100%; margin: 0% 0 0 0; padding: 0px;}
			.CIS  h1 a {display:block;background: url('images/acc-logo.png') 0 bottom no-repeat; text-indent: -10000px;max-width: 100%; height: 135px;border-bottom: none; background-size: 99.5%; margin: 2% 0 0 0;}
		.Title {background: url('images/title.png') 0 0 no-repeat; text-indent: -10000px; max-width: 60%; line-height: 400%; background-size: 100%; margin-left: 40%; margin-top: 2.5%;}
		
		.GlobalNav {float: right; margin: 1% 0 0 0; width: 60%; }
			.GlobalNav ul {margin: 0px; padding: 0px; }
			.GlobalNav ul li {list-style: none; float: left; margin: 0% 10% 1% 0%;}
			.GlobalNav ul li a { display:block; line-height:1.5; color: #FFFFFF; font-size: 120%; text-decoration: none; white-space:nowrap;}
			.GlobalNav ul li a:hover {color: #f5c113;}

.ContentArea {background: #efefef; width: 90%; margin: 0px auto; clear:both;}
.Home .ContentArea {background: url('images/hmcontent-bg.jpg'); text-align: left;}
	.SideImages { float: left; width: 30%; margin: 0% 10% 3% 0%;}
	.SideImages IMG {}
	.Home .Content {width: auto; margin: 0px; padding: 0px;}
	.Content { /*float: left;width: 60%;*/margin: 0% 2% 2% 2%; }
	/*.slogan {background: #000000; width: 300px; float: left;}
		.slogan ul {margin: 5%; padding: 0px;}
		.slogan ul li {list-style: none; margin: 0px 0px 15px 0px; padding: 0px; font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif; font-size: 200%; color: #FFFFFF; font-weight: bold; float: left;}*/
	 .ImageArea {width: 100%; float: left; text-align:left;}
	.clear{clear:both;}
	.Footer {margin: 0px auto; color: #FFFFFF; font-size: 9pt; background: #312c2a; clear:both; padding: 7px 0px; text-align:center;}
		.Footer P {margin: 0px;padding: 0px 0px;}
		
/***** ------ TYPORGRAPHY ------ ******/
h1 {font-size: 270%; color: #616568; font-weight: normal; padding-top: 5.5%;}
h2 {font-size: 200%; color: #8b7306; font-weight: normal; margin: 4% 0%;}
h3 {font-size: 170%; color: #62550b; font-weight: normal; margin: 4% 0%;}
h4 {font-size: 160%; color: #2b4042; margin: 22px 0px;  margin: 3% 0%;}
h5 {font-size: 150%; color: #8e3905; font-weight: normal; margin: 4% 0% 2% 0%;}
h6 {font-size: 120%; color: #383838; margin:2% 0;}

ul li {list-style: disc; margin-bottom: 1%;}

HR {border-top: #CCCCCC 1px solid; background: #FFFFFF;color: #FFFFFF; margin: 15px 0px;}

.Content a:link, .Content a:active, .Content a:visited  {color: #225c89; text-decoration: none; font-weight: bold;}
.Content a:hover {color: #930101; text-decoration: none;}

/*.slogan { display:block; position: relative; top: 40px; left: 50px; z-index: 100;}
	.slogan ul {margin: 0px; padding: 0px;}
	.slogan ul li {list-style: none; margin: 0px 0px 15px 0px; padding: 0px; font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif; font-size: 27pt; color: #FFFFFF; width: 400px; font-weight: bold;}*/


/*	-------------------------------------------------------------
	ROTATING IMAGES - STYLES FOR SCREEN / PROJECTION
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/

/*#slideshow {
	position:relative;
	float: right;
	width:1024px;
	height:505px;
	overflow:hidden;
	clear:none;
	background: url(images/home-img-bg.jpg) 0 0  no-repeat;

}*/
#slideshow {
	position:relative;
	float: right;
	width:100%;
	height: 100%;
	overflow:hidden;
	clear:none;
	margin-bottom: -1%;
	/*background: url(images/home-img-bg.jpg) 0 0  no-repeat;
*/
}

#slideshow ul {}
#slideshow li {list-style: none; background: none; padding: 0px;}	

#slides {
	position: relative;
	background-color:none;
	overflow:hidden;
	width: 100%;
	height:auto;
	margin:0;
	padding:0;	
}
/*#slides {
	position: relative;
	background-color:none;
	overflow:hidden;
	width: 1024px;
	height:505px;
	margin:0;
	padding:0;
}
#slides a IMG {width: 1024px; height: 505px; border:none;}*/

@media screen and (min-width:320px) and (max-width:1023px){
	
.HDWrapper {background-position: 0 bottom;}
	.CIS { margin: 0% 0 0 0%}
	.CIS  h1 a {background-position: 0 0; min-height: 95px; margin: 10% 0 0 0; padding: 0; height: auto; background-size: 90%;}
	.Title {line-height: 350%; position relative: top -0.5; right: 0; margin-left: 25%; max-width: 75%; margin-top: 6%;}
	.GlobalNav  {margin: 1.5% 2% 0% 2%; width: 90%; clear:both;}
	.GlobalNav ul li a {font-size: 127%;}
#slideshow {max-width: 100%;}
#slideshow IMG {width: 100%; }
}
@media screen and (max-width:768px){
	.Title { margin-top: 4.5%;}
	.CIS  h1 a {min-height: 80px;}

}

@media screen and (max-width:640px){
	.CIS { margin: 0% 0 0 0%}
	.CIS  h1 a { background-position: 0 0; min-height: 65px;margin: 0; padding: 10% 0 0 0; height: auto;}
	.Title {line-height: 250%; position relative: right: 0; margin-top: 1%; margin-left: 25%; max-width: 75%;}
	.GlobalNav  {margin:  0.5% 2%; width: 95%; clear:both;}
	.GlobalNav ul li {margin: 0% 9% 1% 0%;}
	.GlobalNav ul li a {font-size: 127%;}
}

@media screen and (max-width:480px){ 
.HDWrapper {}
	.CIS  h1 a {min-height: 50px; margin-top: -5%;}
	.Title {margin-top: 0%;}
	.GlobalNav ul li { margin-right: 4%;}
}
@media screen and (max-width:320px){
	.CIS  h1 a {min-height: 50px; margin: 0% 0% 0% -6%;min-height: 50px;}
	.Title {margin-top: 10%; max-width: 100%; margin-left: 0%;}
	.GlobalNav ul li { margin-right: 10%;}

}
@media screen and (max-width:240px) {
	.CIS  h1 a {min-height: 25px;}
	.Title {line-height: 100%;}
}
@media screen and (min-width:1024px) {
.ContentArea, .HD {width: 1024px;}
.HDWrapper {background-position: 0 50px;}
.CIS  h1 a {width: 295px; height: 138px; background-size: 100%;}
.Title {width: 712px; height: 50px; margin-top:50px; }
.GlobalNav {margin-top: 5px; }
.GlobalNav ul li {margin: 0 7% 1% 4%;}
.GlobalNav ul li a {}
.ImageArea { width: 1024px;}
.SideImages  {width: 400px; margin: 0px 10px 0px 0px;}
.Content { width: 550px; text-align:left; position: relative; float: left; margin: 10px 10px 0px 0px; padding: 0px 0px 10px 10px;}
#slideshow {
	width:1024px;
	height:505px;
	margin-bottom: 0px;
}
#slides {
	width: 1024px;
	height:505px;
}
#slides a IMG {width: 1024px; height: 505px; border:none;}

}