/* ** A CSS Document ** */

html { min-height: 100%; height: auto; width: 100%; padding: 0; margin: 0; }
body { width: 100%; padding: 0; margin: 0; font: 100% Verdana, Arial, sans-serif; background: #fff; }

@font-face { font-family: 'SFCollegiateSolidRegular'; src: url('fonts/SF_Collegiate_Solid.eot');
	src: local('SF Collegiate Solid'), local('SFCollegiateSolid'), url('fonts/SF_Collegiate_Solid.woff') format('woff'), url('fonts/SF_Collegiate_Solid.ttf') format('truetype'), url('fonts/SF_Collegiate_Solid.svg#SFCollegiateSolid') format('svg');
	}
@font-face { font-family: 'MandatoryRegular'; src: url('fonts/mandator.eot');
	src: local('Mandatory'), local('Mandatory'), url('fonts/mandator.woff') format('woff'), url('fonts/mandator.ttf') format('truetype'), url('fonts/mandator.svg#Mandatory') format('svg');
	}
@font-face { font-family: 'WorldBoldItalic'; src: url('fonts/noworld.eot');
	src: local(' World'), local('ChaneyBoldItalic'), url('fonts/noworld.woff') format('woff'), url('fonts/noworld.ttf') format('truetype'), url('fonts/noworld.svg#ChaneyBoldItalic') format('svg');
	}

/* ** Default Link Styling ** */
a:link, a:visited { color: #000; text-decoration: underline; }
a:hover, a:focus { color: #000; text-decoration: none; }
a:active {  } 

#wrapper { position: relative; width: 100%; min-height: 100%; margin: 0; padding: 0; background: url(res/content_bg.png) repeat left top; overflow: hidden; outline: 0px solid red; }
* html #wrapper { height: 100%; }
	#header { position: relative; width: 100%; height: 157px; background: url(res/header_bg.png) repeat-x left top; overflow: hidden; outline: 0px solid red;
		-moz-box-shadow: 0px 10px 15px #333; -webkit-box-shadow: 0px 10px 25px #333; box-shadow: 0px 10px 25px #333;
		}
		#header-inner { position: relative; width: 940px; height: 157px; padding: 0 20px; margin: 0 auto; outline: 0px solid green; }
			#header-inner h1 { position: absolute; left: 151px; top: 38px; text-transform: uppercase; letter-spacing: -0.05em; color: #fff; 
				font: 3em "SFCollegiateSolidRegular", Verdana, Arial, sans-serif;
				}
			#header-inner h2 { position: absolute; top: 75px; left: 337px; text-transform: uppercase; color: #1e427c; font: 1em "MandatoryRegular", Verdana, Arial, sans-serif; }
	#content { position: relative; width: 100%; height: auto; background: url(res/content_dropshdw.png) repeat-x left bottom; outline: 0px solid red; }	
		#content-inner { position: relative; width: 940px; height: auto; min-height: 500px; padding: 46px 20px 91px 20px; margin: 0 auto; overflow: auto; outline: 0px solid red; }
	#footer { position: relative; width: 100%; height: 71px; padding: 0; margin: -71px 0 0 0; background: #fff; }
		#footer-inner { position: relative; width: 980px; height: 71px; padding: 0; margin: 0 auto; outline: 0px solid green; }
			#footer-inner ul li, #footer-inner ul li a { color: #767676; font-size: 10px; }
			#footer a:hover { color: #000 !important; }

.logo-link { display: block; position: absolute; top: 9px; left: 17px; width: 111px; height: 107px; text-indent: -9999%; text-transform: capitalize; background: url(res/logo.png) no-repeat left top; }			
.logo-byCemex { display: block; position: absolute; bottom: 91px; left: 20px; width: 64px; height: 58px; z-index: 0; text-indent: -999%; text-transform: capitalize; background: url(res/logo-byCemex.png) no-repeat left top; }
.logo-byCemex-alt { display: block; position: absolute; bottom: 91px; right: 20px; width: 64px; height: 58px; z-index: 0; text-indent: -999%; text-transform: capitalize; background: url(res/logo-byCemex.png) no-repeat left top; }
.contact { position: absolute; top: 0; right: 24px; width: auto; height: 36px; padding: 12px 15px 0 15px; text-transform: uppercase; background: url(res/headerbutton_bg.png) repeat-x left top;  
	font: 1em "MandatoryRegular", Verdana, Arial, sans-serif; 
	color: #fff !important; 
	text-decoration: none !important;
	}
	.contact span { text-shadow: 1px 1px 0px #fff; }
.copy-block { float: right; width: 49%; list-style: none; overflow: auto; margin: 10px 0; outline: 0px solid yellow; }
	.copy-block li { float: right; width: auto; }	
span.red  { color: #eb3c46; }
span.bold-black { font-weight: bold; color: #000; }
span.bold-white { font-weight: bold; color: #fff; }

.inset-shdw { border-left: 1px solid #fff !important; border-right: 1px solid #fff !important; 
	-webkit-box-shadow: inset 0px 0px 6px #333; -moz-box-shadow: inset 0px 0px 6px #333; box-shadow: inset 0px 0px 6px #333; 
	}
.homepage-img { background: url(res/cemexone_truck.png) no-repeat left 150px; }
.clear { content: "."; clear: both; height: 0; visibility: hidden; }

/* ** NAVS ** */
ul[class|="nav"] { float: left; list-style: none; overflow: auto; outline: 0px solid purple; }
	ul[class|="nav"] li { float: left; }
	
	.nav-header { position: absolute; bottom: 0; left: 0; z-index: 5; width: 100%; height: 30px; padding: 0; overflow: hidden; border: 0px solid blue; }
		.nav-header li { padding: 0 0 4px 0; height: 26px; outline: 0px solid blue; border-left: 1px solid #aaaaaa; border-right: 1px solid #fff; overflow: hidden; }
			.nav-header li a.mirrored { position: relative; z-index: 10; display: block; width: auto; height: 16px; color: #666; text-decoration: none; margin: 0 0 16px 0; 
				text-transform: uppercase; 
				padding: 4px 20px 9px 20px;
				font: 0.875em "WorldBoldItalic", Verdana, Arial, sans-serif;
				}
				.nav-header li:hover, .nav-header li a:hover { cursor: pointer; color: #fff; }
	.nav-footer { width: auto; height: auto; margin: 10px 0; }
		.nav-footer li a { text-decoration: none; }
			.nav-footer li a:hover { text-decoration: underline; }
	
	.current { background: url(res/nav_bg-hover.png) repeat-x left top !important; border-left: 1px solid #fff !important; border-right: 1px solid #fff !important; color: #fff !important;
		-webkit-box-shadow: inset 0px 0px 6px #333; -moz-box-shadow: inset 0px 0px 6px #333; box-shadow: inset 0px 0px 6px #333;
		}
		.current a { color: #fff !important; }

/* ** CONTENT-BLOCKS ** */
div[class|="content-block"] { outline: 0px solid green; }
	.content-block-imgRotator { position: relative; float: right; width: 157px; height: auto; margin: 0 0 0 15px; overflow: auto; }
		.content-block-imgRotator h3 { margin: 0 0 9px 14px; font-size: 0.9em; font-weight: normal; text-transform: uppercase; color: #0c0e0d; line-height: 1.0em; }
		.content-block-imgRotator p { font-size: 0.675em; color: #fff; margin: 8px 0 0 12px; }
			.img-display-block { position: relative; list-style: none; width: 155px; height: 146px; background: none; padding: 0; margin: 0; outline: 0px solid red; }
	
	.content-block-spotlight { position: absolute; bottom: 91px; right: 20px; width: 210px; height: 119px; padding: 50px 0 0 70px; background: url(res/gears.png) no-repeat left top; }
		.content-block-spotlight h3 { font-size: 0.95em; font-weight: normal; text-transform: uppercase; color: #fff; margin: 0 0 3px 0; }
		.content-block-spotlight h4 { font-size: 0.75em; font-weight: bold; color: #ccc; margin: 0 0 5px 0; }
		.content-block-spotlight p { font-size: 0.675em; color: #adadad; }
	
	.content-block-imgL { float: left; width: 370px; height: auto; border: 2px solid #fff; background: #fff; background: rgba(255,255,255,0.85); margin: 0 22px 0 0; padding: 0; text-align: center; }
	.content-block-imgL-alt { float: left; width: 370px; height: auto; border: 2px solid #fff; background: #fff; background: rgba(255,255,255,0.85); margin: 0 0 0 22px; padding: 0; text-align: center; }
		.locations-size { width: 418px !important; }
		html>/**/body .locations-mozilla-fix, x:-moz-any-link, x:default { padding-bottom: 12px; }
		
	.content-block-text { position: relative; float: left; width: 480px; height: auto; min-height: 200px; z-index: 2; background: rgba(255,255,255,0.65); padding: 20px 30px; overflow: hidden; 
		border-top: 1px solid #fff;
		margin: 0 0 90px 0;
		}
		.content-block-text h3 { font: 1em "MandatoryRegular", Verdana, Arial, sans-serif; color: #091c5a; text-transform: uppercase; margin: 0 0 20px 0; line-height: 1.3em; }
			.content-block-text h3 b { font-style: normal; font-size: 1.75em; margin-left: 7px; }
		.content-block-text p { font-size: 0.825em !important; line-height: 1.5em; clear: both; }
		.content-block-text img { float: right; margin: 15px 15px 15px 0px; }
		.content-block-text ul { float: left; width: 45%; margin: 15px 0 15px 15px; padding: 0 0 0 10px; }
			.content-block-text ul li { font-size: 0.725em; line-height: 1.5em; }
	.block-narrow { width: 328px !important; }
	.block-full { width: 880px !important; }
	
	.content-block-small { position: relative; float: right; clear: right; width: 330px; height: auto; z-index: 2; background: rgba(255,255,255,0.65); padding: 20px; margin: 0 0 16px 22px; 
		overflow: hidden; 
		border-top: 1px solid #fff; 
		}
		.content-block-small h4 { font: 1em "MandatoryRegular", Verdana, Arial, sans-serif; color: #091c5a; text-transform: uppercase; margin: 0 0 16px 0; line-height: 1.3em; }
		.content-block-small p { font-size: 0.725em !important; line-height: 1.6em; clear: both; }
		.content-block-small img { float: right; margin: 0px 0 15px 15px; }
		.content-block-small ul { float: left; width: auto; margin: 30px 0 30px 20px; padding: 0 0 0 10px; }
			.content-block-small ul li { font-size: 0.725em; line-height: 1.5em; }
		
		.quotebox { position: relative; float: right; width: auto; height: auto; margin: 16px 0 16px 16px !important; }

/* ** TAB STYLES ** */
	#tabs-container { position: relative; z-index: 2; width: auto; height: auto; margin: 20px 0; padding: 0; overflow: hidden; border: 0px solid blue; } 
		#tabs-container div div { clear: left; display: block; width: 440px; height: auto; padding: 10px 20px 20px 20px; background: #fff; background: rgba(255,255,255,0.75); overflow: hidden; } 
			#tabs-container div div img { float: right; margin: 15px 0 15px 15px; }
		
		.ui-tabs-nav { list-style: none; margin: 0 !important; padding: 0 !important; }	
			.ui-tabs-nav li { float: left; padding: 7px !important; }
				.ui-tabs-nav li a { padding: 5px 7px; text-decoration: none; font: 1.75em "SFCollegiateSolidRegular", Verdana, Arial, sans-serif; }
			
			.ui-tabs .ui-tabs-hide { display: none; }		
			.ui-state-hover, .ui-state-active { border: 0px solid #000; border-top: 0px solid #fff;
				background-image: -moz-linear-gradient(top, rgba(9,28,90,0.75) 0%, rgba(255,255,255,0.75) 75%); 
 				background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%, rgba(9,28,90,0.75)), color-stop(75%, rgba(255,255,255,0.75)));
				}
				.ui-state-active a { -webkit-text-shadow: 0px 1px 0px #fff; -moz-text-shadow: 0px 1px 0px #fff; text-shadow: 0px 1px 0px #fff; }
			.ui-widget-content { outline: 0px solid green; }
			.ui-tabs-panel { height: 100%; padding: 30px 0 0 0; outline: 0px solid red; }		
				
/* ** CONCRETE CALCULATOR FORMS ** */		
	#main-calculator-container { position: relative; z-index: 2; width: auto; height: auto; margin: 0; padding: 0; border: 0px solid blue;  }
		ul.calc-selector { width: 100%; height: 30px; list-style: none; margin: 0; padding: 0; outline: 0px solid yellow; }
			ul.calc-selector li { float: left; padding: 5px 0px; outline: 0px solid red; }
			ul.calc-selector li a { padding: 5px 15px; text-decoration: none; font: 1.75em "SFCollegiateSolidRegular", Verdana, Arial, sans-serif; outline: 0px solid green; }
			
			form[name|="conc-calculator"] {  }
				#calculator-container-slabs, #calculator-container-footings, #calculator-container-columns { padding: 30px 30px 0px 30px; overflow: hidden; 
					background: url(res/content-block-text_bg-IE.png) repeat left top; 
					}
				form[id|="conc-calculator"] input, form[id|="conc-calculator"] label, form[id|="conc-calculator"] em { float: left; font-size: 0.875em; }
				form[id|="conc-calculator"] label { display: block; width: auto; height: auto; font-weight: bold; }
					form[id|="conc-calculator"] label[for="width_field"], form[id|="conc-calculator"] label[for="diameter_field"] { margin: 0; }				
					form[id|="conc-calculator"] label[for="length_field"] { margin: 0 0 0 64px; }
					form[id|="conc-calculator"] label[for="height_field"] { margin: 0 0 0 39px; }					
					form[id|="conc-calculator"] label[for="depth_field"] { margin: 0 0 0 57px; }
				form[id|="conc-calculator"] input { font-size: 0.775em; padding: 2px 0; } 				
					.width_field, .length_field, .depth_field, .diameter_field, .height_field { width: 50px; }
					.width_field, .diameter_field { margin: 0 10px 0 0; }
					.length_field, .height_field { margin: 0 10px 0 0; }
					.depth_field { margin: 0 10px 0 0; }
				form[id|="conc-calculator"] em { margin: 3px 20px 0 0; }
				.conc-calc_btns { float: right !important; clear: left; display: block; width: auto; height: auto; padding: 3px 10px 6px 10px !important; cursor: pointer; 
					border: 1px solid #fff; 
					margin: 0 0 0 10px;
					font: 0.975em "MandatoryRegular", Verdana, Arial, sans-serif !important; 
					background: url("res/nav_bg.png") repeat-x left top;
					}
					.conc-calc_btns:hover { border: 1px solid #ccc; border-bottom: 1px solid #999; }
					.conc-calc_btns:active { color: #fff; background: url(res/nav_bg-hover.png) repeat-x left top; border: 1px solid #999; border-bottom: 1px solid #ccc; }
				form[id|="conc-calculator"] span { display: block; width: 100%; height: 35px; padding: 8px 30px 0 30px; margin: 20px 0 0 -30px; background: #bc1922; }
					form[id|="conc-calculator"] label[for="CubicYards"] { font-weight: bold; margin: 5px 10px 0 0; color: #fff; }
						.cubicYards_field { width: 50px; }

/* ** INFORMATION REQUEST FORM ** */
	.form-box { float: left; width: auto; height: auto; background: none; z-index: 5; padding: 0; margin: 20px 0 0 0; clear: both; overflow: hidden; outline: 0px solid red; }
	
	.information-request { position: relative; right: 0; top: 0; width: 440px; height: auto; margin: 0 5px; padding: 10px; border: 0; z-index: 10; clear: both; overflow: hidden;
		background: url(res/content-block-text_bg-IE.png) repeat left top;
		}
		.information-request fieldset { width: auto; height: auto; padding: 15px 15px 15px 25px; border: 3px solid #fff; clear: both; overflow: hidden; outline: 0px solid blue; }
		.information-request legend { margin: 0 0 8px -8px; padding: 0 8px; color: #091c5a; font: 1em "MandatoryRegular", Arial, sans-serif; text-transform: uppercase; }
		.information-request span { font: 11pt Verdana, sans-serif; color: #000; margin: 0; padding: 0; }
			.information-request strong { color: #eb3c46; }
		.information-request label[class|="label"] { float: left; clear: left; display: block; width: 150px; margin: 3px 10px 3px 0; text-align: right; vertical-align: baseline; 
			font: 0.875em Verdana, sans-serif; 
			}
		.information-request input[class|="field"] { margin: 3px 0; width: 225px; }
		.information-request .submitBtn { float: right; width: 150px; margin: 15px 0 0 0; padding: 5px 15px; background: #091c5a; color: #fff; cursor: pointer; 
			border: 1px solid #08184c;
			font: 1em "MandatoryRegular", Times, serif;
			}
			.information-request .submitBtn:hover, .information-request .submitBtn:focus { border: 1px solid #08184c; border-top: 1px solid #3665b2; }
			.information-request .submitBtn:active { border: 1px solid #08184c; border-bottom: 1px solid #3665b2; }
