/* CSS to reset elements' default padding and margins */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
ul {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
q:before,q:after{content:'';}

/* CSS to baseline font sizes */
body {font:13px arial,helvetica,clean,sans-serif;font-size:small;}
table {font-size:inherit;font-size:100%;}
select, input, textarea {font-family:arial,helvetica,clean,sans-serif; font-size:99%;}
pre, code {font:115% monospace;font-size:100%;}
body {line-height:1.22em;}



body {
	background-color:#ffffff;
	font-family:"Calibri", "Lucida Grande", Arial, sans-serif;
}

/*
The 'container' div uses the 'magic margin' of 0 auto,
which allows the div to be centered within the viewport.
*/
#container {
	width:730px;
	margin:0 auto;
	border:solid 10px #ededed;
	border-top-width:0px;
	padding:0px 10px 10px 10px;
	background-image:url("/img/backgrounds/container.gif");
	background-repeat:repeat-x;
}

/* TOP MENUBAR */
#menubar {
	border:solid 3px #f90100;
	border-width:3px 0px 3px 0px;
	height:28px; /* because the elements within are position absolutely, we need
					to specify a height for the containing div */
}
#menubar li {
	float:left;
}
/* we use one GIF image for the entire menubar - if we use seperate images
the rollover transition will flicker in IE6. This way we use the background-position
to 'move' the menubar image to the right position. */
#menubar a {
	display:block;
	background-image:url("/img/menubar.gif");
	height:28px;
}
#menubar a span {
	display:none;
}
/* the background-position works like this:
[width from RIGHT of image]px [width from TOP of image]px */
a.mbHome			{width:65px; background-position:730px 0px;}
a.mbIntro			{width:122px; background-position:665px 0px;}
a.mbRepairs			{width:150px; background-position:543px 0px;}
a.mbWater			{width:125px; background-position:393px 0px;}
a.mbFloor			{width:161px; background-position:268px 0px;}
a.mbContact			{width:107px; background-position:107px 0px;}
/* as you can see, for the rollover we simply
duplicate the original background-position, but change
the second (TOP) parameter to 28px */
a:hover.mbHome		{background-position:730px 28px;}
a:hover.mbIntro	{background-position:665px 28px;}
a:hover.mbRepairs	{background-position:543px 28px;}
a:hover.mbWater		{background-position:393px 28px;}
a:hover.mbFloor		{background-position:268px 28px;}
a:hover.mbContact	{background-position:107px 28px;}




/* LEFT MENU */
/*the left menu is positioned absolutely so that
it takes no 'vertical space' */
#leftmenu {
	position:absolute;
	width:137px;
	background-color:#6b6b6b;
	background-image:url("/img/backgrounds/in-this-section.gif");
	background-repeat:no-repeat;
	padding:35px 5px 5px 5px;
	border:solid 0px #f90100;
	border-width:0px 0px 3px 3px;
}
#leftmenu a {
	display:block;
	color:white;
	font-size:90%;
	font-weight:bold;
	text-decoration:none;
	text-transform:uppercase;
	margin-bottom:3px;
	text-align:right;
	padding:3px 6px 3px 6px;
}
#leftmenu a:hover {
	background-color:#404040;
}

/*scroller*/
#scroller{
	margin-top:50px;
	float:right;


}
#motioncontainer {
	padding:20px;
	background:#666666;
	text-align:center;
	margin-left:30px;

}

#motioncontainer a img{ /*image border color*/
	padding:5px;
	background:#999999; 
	border: 1px solid #000000;
	margin-bottom:8px;
		margin-left:9px;
		text-align:center;
	
	
}

#imagecontainer{

}

#motioncontainer a:hover img{ /*image border hover color*/
border: 1px solid navy;
}

#motioncontainer a:hover{
color: red; /* Dummy definition to overcome IE bug */
}

#statusdiv{
	position: absolute;
	padding: 2px;
	left: -300px;
	background-color: lightyellow;
	border: 1px solid gray;
	visibility: hidden;
}

/* MAIN CONTENT BOX */
#main-content {
	margin-left:150px;
	border:solid 0px #f90100;
	border-left-width:3px;
	padding:15px 30px 30px 30px;
	min-height:450px;
}
#main-content h1, #main-content-mini h1 {
	font-size:220%;
	line-height:120%;
	color:#f90100;
	border:solid 0px #6b6b6b;
	border-bottom-width:3px;
	text-transform:uppercase;
	margin-bottom:20px;
}
#main-content p {
	font-size:110%;
	line-height:150%;
	margin-bottom:7px;
}



/* COMPANY INFO */

#company-info {
	position:absolute;
	width:140px;
	font-size:16px;
	text-align:right;
	top: 400px;
	margin: 0px;
}
#company-info p {
	color:#6b6b6b;
	font-size:80%;
	margin-bottom:7px;
	line-height:120%;
	text-align:right;
}

#full-systems h1 {
	font-size:180%;
	line-height:120%;
	color:#f90100;
	text-transform:uppercase;
}

#photoLeft {
	float:left;
	display:block;
	padding-right: 15px;
	overflow: auto;
}
/*#menuRight {
	margin-left:410px;
}*/
#menuRight table { padding-bottom: 20px; }
#menuRight ol{
	padding-top:10px;
	padding-left:50px;
	list-style:inline;
	
}
#menuRight li{
	padding-left:10px;
	
	text-align:left;
	text-decoration:none;
}
#infoBar {
	text-align:left;
	display:block;
}

.clearboth { clear: both; 
}

.imgLeft { 
	float:left;
	padding: 0px 10px 0px 5px;
}
.moreLink { 
	padding: 145px 0px 0px 0px;
}



/* GALLERY GRID */

table#galleryGrid td		{width:135px; height:125px; text-align:center;
								vertical-align:center;}
table#galleryGrid img 		{ padding:3px; background-color:white; }


img.blueBorder{
	border:double 1px	#0000FF;
}
img.purpleBorder{
	border:double 1px	#9933CC;
}
img.redBorder{
	border:double 1px #FF0000;
}

#fullImageInfo{
	margin-left:15px;
	border-color:#000000;
	border:thin;
	display:block;
}

#fullImage{
	padding-left:5px;
}



#structuralService{
	float:left;
	display:inline;
	width:150px;
	/*padding-right:10px;*/
	position: absolute;
	/*float: left;*/
}
#structuralService a{

	display:block;
}

#waterproofingService{
	float:left;
	display:inline;
	width:150px;
	/*padding-right:10px;*/
	position: absolute;
	/*float: left;*/
	
}
#waterproofingService a{

	display:block;
}
#industrialService{
	float:left;
	display:inline;
	width:150px;
	padding-right:10px;
	
}
#industrialService a{
	display:block;

}
/* MAIN CONTENT BOX MINI */
#main-content-mini{

	padding:0px 20px 20px 20px;
	min-height:450px;
}
#main-content-mini h1 {
	font-size:150%;
	line-height:120%;

	text-transform:uppercase;
	margin-bottom:20px;
}
#main-content-mini p {
	font-size:110%;
	line-height:145%;
	margin-bottom:7px;
}
a.aHeadStyleStruct{
	color:red;
}
a.aStyleStruct{
	padding-left:10px;
	color:red;
	background-image:url(../img/bullet_point.gif);
	background-repeat:no-repeat;
	background-position:0px 6px;
}
a.aStyleStruct2, span.aStyleStruct2 {
	padding-left:10px;
	color:red;
	text-size: 85%;
	text-decoration: none;
}

a.aHeadStyleWater{
	color:#0033CC;
}
a.aStyleWater{
	padding-left:10px;
	color:#0033CC;
	background-image:url(../img/bullet_point.gif);
	background-repeat:no-repeat;
	
	background-position:0px 6px;
}
a.aHeadStyleFloor{
	color:#893881;

}
a.aStyleFloor{
	padding-left:10px;
	color:#893881;
	background-image:url(../img/bullet_point.gif);
	background-repeat:no-repeat;
	
	background-position:0px 6px;
}
div#fullImageContainer,	div#fullImageContainerRed,	div#fullImageContainerBlue,	div#fullImageContainerPurple{ padding:5px; border:3px solid #f7f7f7; text-align:center;
								vertical-align:center; 
								background-image:url("/img/backgrounds/gallery-grid-bg.gif");
								background-repeat:repeat-x;
								height:100%;
								}
div#full-systems{				 padding:5px; border:3px solid #f7f7f7; text-align:left;
								vertical-align:center; 
								background-image:url("/img/backgrounds/gallery-grid-bg.gif");
								background-repeat:repeat-x;
								height:100%;
								}
								
								
div#fullImageContainer img, div#full-systems img{border:double 1px #aaaaaa; padding:3px; background-color:white;}

div#fullImageContainerRed img 		{border:double 1px #aaaaaa; padding:3px; background-color:Red;}

div#fullImageContainerBlue img 		{border:double 1px #aaaaaa; padding:3px; background-color:Blue;}

div#fullImageContainerPurple img 		{border:double 1px #aaaaaa; padding:3px; background-color:Purple;}

div#fullImageInfo {		
	text-align:left;
	padding-left:40px;					
	padding-right:40px;	
	display:block;	

}
div#fullImageInfo h1{
	
	font-size:120%;
	line-height:150%;
	margin-bottom:7px;
}
div#fullImageInfo h2{
	font-size:110%;
	line-height:150%;
	margin-bottom:7px;
}
div#fullImageInfo h3{
	font-size:100%;
	line-height:150%;
	margin-bottom:7px;
}

div#fullImageCat{
	font-size:20px;
	padding-bottom:10px;
}
#loading { 
	width:160px;
	height:400px; 
	text-align:justify; 
	background-color:#666666;
	display:block;
} 
#company-info
{
font-weight:bold;
/*margin-top: -40px;*/
}

.waterproofhighlight {
	color: #0075ba;
}

#main-content-mini p strong { font-weight: bold; }
#photodiv {
	padding-left: 170px;
	width: 375px;
}
.nodec {
	text-decoration: none;
}
iframe#servicesDynamic{
	position: absolute;
}
#waterproofingService {
}
#industrialService {
}
iframe#mainsite, iframe#servicesDynamic { margin-left: 180px; }