﻿*{margin: 0; padding: 0;}

img{border: none;}

body{
text-align: center;
background: #ffffff url(Images/bgBody.png) repeat-x left top;
font-family: Arial, Helvetica, Sans-Serif;
padding-bottom: 30px;
}

#Wrapper{
width: 950px;
min-height: 800px;
_height: 800px;
margin: 0 auto;
text-align: left;
}

#Header{
width: 950px;
height: 106px;
}

#HeaderLeft{
width: 200px;
height: 72px;
padding-top: 34px;
float: left;
}

#HeaderRight{
width: 750px;
height: 106px;
float: left;
}

#Search{
width: 750px;
height: 50px;
display: block;
}

#SearchBox{
width: 209px;
height: 33px;
margin: 6px 0 0 475px;
padding: 7px 0 0 28px;
background: url(Images/bgSearch.png) no-repeat left top;
}

/*--TOPMENU--*/
#TopMenu{
width: 750px;
height: 25px;
text-align: right;
display: block;
}

#TopMenu ul{
width: 750px;
margin-top: 24px;
height: 25px;
background: url(Images/bgMenu.png) no-repeat right bottom;
list-style-type: none;
}

#TopMenu ul li{
width: 30px;
display: inline;
margin-left: 25px;
font-family: Trebuchet MS, Arial, Helvetica;
color: #ffffff;
}

#TopMenu ul li a{
text-decoration: none;
font-family: Trebuchet MS, Arial, Helvetica;
color: #ffffff;
border-bottom: solid 3px #4d8abe;
display: inline-block; 
vertical-align: bottom; 
}

#TopMenu ul li a:hover{
border-bottom: solid 3px #e2a600;
}
/*--TOPMENU-END--*/

#HeaderTitle{
width: 950px;
height: 60px;
margin-top: 38px;
}


/*--CONTENT STARTS--*/
#BreadCrumb{
width: 950px;
height: 20px;
margin-top: 30px;
color: #db9f4d;
font-size: 12px;
}

#BreadCrumb a{
color: #ffffff;
}

#BreadCrumb span{
color: #ffffff;
}

#Content{
width: 950px;
height: 700px;
}

#ContentLeft{
width: 700px;
height: 600px;
float: left;
}

#ContentPage{
width: 678px;
height: 850px;
padding: 23px 0 0 20px;
background-color: #ffffff;
border: solid 1px #dedede;
}

#ProductText p{
padding: 20px 48px 0 0 ;
line-height: 18px;
font-size: 13px;
}

#ContentRight{
width: 250px;
height: 600px;
float: left;
}

#RightTop{
width: 205px;
height: 144px;
padding: 6px 20px 0 25px;
color: #ffffff;
font-size: 13px;
}

#RightTop h3{
font-size: 19px;
}

#RightTop span{
display: block;
}

#RightTop a{
display: block;
margin-top: 12px;
}

#RightMenu{
width: 225px;
height: 300px;
padding: 0 0 0 25px;
}

#RightMenu h4{
font-size: 18px;
color: #0056a1;
}

#RightMenu ul{
width: 230px;
height: 205px;
margin-top: 16px;
}

#RightMenu ul li{
width: 230px;
display: block;
}

#RightMenu ul li a{
width: 225px;
height: 22px;
padding: 6px 0 0 5px;
display: block;
color: #005187;
text-decoration: none;
font-size: 14px;
border-bottom: solid 1px #e5ebf1;
}

#RightMenu ul li a:hover{
background: #005198;
color: #ffffff;
}

#Footer{
width: 940px;
height: 21px;
background-color: #003151;
color: #ffffff;
font-size: 12px;
padding: 4px 0 0 10px;
}

#Footer span{
padding-left: 450px;
font-size: 11px;
}



/*--HOME-PAGE-*/
#HomeTopBoxes{
width: 950px;
height: 225px;
margin: 26px 0 22px 0;
}

#HomeBottomBoxes{
width: 468px;
height: 180px;
float: left;
margin: 4px 0 0 0;
padding-left: 12px;
}

#HomeQuote{
width: 462px;
height: 180px;
float: left;
background: url(Images/bgQuote.png) no-repeat left top;

}

.Box{
width: 310px;
height: 225px;
margin-right: 10px;
float: left;
}

.BoxImg{
width: 310px;
height: 172px;
}

.BoxLink{
width: 310px;
height: 54px;
margin-left: 2px;
}

.BoxSmallHome{
width: 224px;
height: 152px;
margin-left: 10px;
float: left;
}

.HomeBtnView{
width: 60px;
height: 21px;
margin: 125px 0 0 390px;
}


/*--PRODUCT-SUB-PAGES--*/
#SubFeatures{
width: 612px;
height: 146px;
margin: 30px 0 0 12px;
}

#SubFeatureBullets{
width: 614px;
height: 116px;
margin: 8px 0 0 0;
background: url(Images/bgSubBullets1.png) no-repeat left top;
}

#SubFeatureBullets ul{
width: 285px;
height: 100px;
font-family: Calibri;
font-size: 13px;
font-weight: bold;
margin: 15px 0 0 15px;
float: left;
}

#SubFeatureBullets ul li{
color: #003f7a;
margin-bottom: 8px;
}

#SubFeatureBullets ul li span{
color: #131313;
}

.PDFLink{
margin-top: 79px;
margin-left: 3px;
}

#ClientsBW{
width: 611px;
height: 114px;
margin: 55px 0 0 12px;
background: url(Images/bgClients1.png) no-repeat left top;
display: block;
}

/*--AUTOMEDIA-PAGE-*/
#AutomediaPageTop{
width: 645px;
height: 185px;
}

#AutomediaLeftP{
width: 435px;
height: 185px;
float: left;
}

#AutomediaRight{
width: 210px;
height: 160px;
float: left;
padding-top: 25px;
}

#AutomediaLinks{
width: 470px;
height: 35px;
margin: 25px 0 5px 10px;
}

#AutomediaLinks a{
width: 220px;
height: 35px;
margin-right: 8px;
}


/*--ABOUT-PAGE-*/
#AboutLogos{
width: 608px;
height: 187px;
margin: 10px 0 0 15px;
background: url(Images/bgAboutLogos.png) no-repeat left top;
}

.BtnViewAll{
width: 193px;
height: 28px;
margin: 10px 0 0 434px;
}

.AboutH2{
margin: 30px 0 0 10px;
}

#CustomerLogos{
width: 607px;
height: 400px;
margin: 10px 0 0 15px;
}






/*--CONTACT-PAGE-*/
#ContactFields{
width: 605px;
height: 500px;
margin-top: 25px;
margin-left: 10px;
}

#ContactFields span{
font-size: 12px;
font-weight: bold;
}

#ContactFieldsTop{
width: 565px;
height: 300px;
padding: 20px 0 0 40px;
background: url(Images/bgContactTop.png) no-repeat left top;
}

.ContactTopFloat{
width: 270px;
height: 200px;
float: left;
}

#ContactBottom{
width: 565px;
height: 225px;
margin-top: 10px;
padding: 20px 0 0 40px;
background: url(Images/bgContactBot.png) no-repeat left top;
}

.ContactMap{
margin: 10px 0 10px 0;
}

.ContactSpan{
font-weight: bold;
font-size: 13px;
}

.ContactSpan2{
font-weight: bold;
font-size: 12px;
}

.BtnSend{
width: 123px;
height: 28px;
margin: 0 0 0 350px;
}











/*--FLICKER-FREE-BOX-LINKS--*/
.BoxLink {display:block; height:54px; }

.BoxLinkImg1 {height:54px; width: 305px; background: url(Images/box1A.png) no-repeat left top;}
.BoxLinkImg2 {height:54px; width: 305px; background: url(Images/box2A.png) no-repeat left top;}
.BoxLinkImg3 {height:54px; width: 305px; background: url(Images/box3A.png) no-repeat left top;}
.BoxLinkImg4 {height:54px; width: 305px; background: url(Images/box4A.png) no-repeat left top;}
.BoxLinkImg5 {height:54px; width: 305px; background: url(Images/box5A.png) no-repeat left top;}


.BoxLink a {float:left; margin-right:1px; display:block; width:305px;}
.BoxLink a {display:block; width:305px; padding-top:54px; height:0; color:#000; text-decoration:none; overflow:hidden;}
* html .BoxLink a:link, * html .BoxLink a:visited {height:54px; he\ight:0;}
 
.BoxLink a#Box1 {background:transparent url(Images/box1AOver.png) -305px -54px no-repeat;}
.BoxLink a#Box2 {background:transparent url(Images/box2AOver.png) -305px -54px no-repeat;}
.BoxLink a#Box3 {background:transparent url(Images/box3AOver.png) -305px -54px no-repeat;}
.BoxLink a#Box4 {background:transparent url(Images/box4AOver.png) -305px -54px no-repeat;}
.BoxLink a#Box5 {background:transparent url(Images/box5AOver.png) -305px -54px no-repeat;}




.BoxLink a#Box1:hover, .BoxLink a#Box2:hover, .BoxLink a#Box3:hover, .BoxLink a#Box4:hover, .BoxLink a#Box5:hover {background-position:top right; z-index:50;}
 
* html .BoxLink a:hover {height:54px; he\ight:0;}
/*--END--*/


#HomeContent{
width: 950px;
height: 300px;
}

#HomeContentLeft{
width: 450px;
height: 300px;
float: left;
}

#HomeContentRight{
width: 500px;
height: 300px;
float: left;
}

.SmallBox{
width: 232px;
height: 160px;
margin: 20px 0 0 28px;
float: left;
}


/*--PRODUCT-PAGE-*/
.ProdBox{
width: 660px;
height: 150px;
margin-top: 20px;
}

.ProdBoxLeft{
width: 435px;
height: 152px;
float: left;
font-size: 11px;
color: #004a8b;
}

.ProdBoxRight{
width: 225px;
height: 156px;
float: left;
}

.ProdBoxLeft H2{
color: #004a8b;
font-size: 17px;
}

.ProdBoxLeft H2 a{
color: #004a8b;
font-size: 17px;
padding: 0;
}

.ProdBoxLeft span{
display: block;
padding: 10px 15px 0 0;
line-height: 18px;
margin-bottom: 8px;
font-size: 14px;
color: #383838;
}

.ProdBoxLeft p{
padding: 5px 15px 0 0;
line-height: 18px;
margin-bottom: 8px;
color: #151616;

}

.ProdBoxLeft a{
font-size: 11px;
color: #004a8b;
padding: 0 3px 0 3px;
text-decoration: none;
}

.ProdBoxLeft a:hover{
text-decoration: underline;
}

.SubProdList{
width: 400px;
height: 61px;
}

.SubProdList ul{
width: 400px;
height: 61px;
padding-top: 10px;
list-style-type: none;
}

.SubProdList ul li a{
width: 163px;
height: 22px;
float: left;
color: #383838;
font-weight: bold;
font-size: 11px;
font-family: Verdana;
margin: 5px 0 0 5px;
padding: 6px 0 0 30px;
background: url(Images/bgBtnSubProd.png) no-repeat left top;
}

.SubProdList ul li a:hover{
background: url(Images/bgBtnSubProd2.png) no-repeat left top;
text-decoration: none;
}


/*--SIGN-RANGE-*/
.SignRangeBox1{
width: 639px;
height: 119px;
margin: 8px 0 0 0;
}

.DotDot{
width: 639px;
height: 5px;
background: url(Images/liftsep.png) no-repeat left top;
}







/*--TEXT-CLASSES--*/
h1{
width: 660px;
height: 32px;
padding-top: 4px;
font-family: Trebuchet MS, Lucida Sans, Arial;
display: block;
color: #151616;
background: url(Images/bgSubH1.png) no-repeat left top;
}

.ProductH1{
width: 660px;
height: 27px;
padding-top: 9px;
font-family: Trebuchet MS, Lucida Sans, Arial;
display: block;
color: #151616;
background: url(Images/bgSubH1.png) no-repeat left top;
}

p{
font-size: 14px;
color: #2b2b2b;
}

.SubProdSpan{
font-weight: bold; 
font-size: 12px; 
width: 400px; 
}
 
.ContentLink{
text-decoration: none;
color: #003f7a;
}



/*--PRODUCT-GALLERY-SCROLLER--*/
#ProductGalleryScroll{
width: 611px;
height: 158px;
margin: 15px 0 0 12px;
}

#ScrollDiv{
width: 611px;
height: 138px;
background: url(Images/bgProductGallery.png) no-repeat left top;
margin: 8px 0 0 0;
overflow: hidden;
}

.jcarousel-container{
width: 611px;
height: 138px;
margin: 0;
position: relative;
}

.jcarousel-clip{
width: 515px;
z-index: 2;
padding: 0;
margin: 0;
overflow: hidden;
position: relative;
float: left;
}

.jcarousel-list{
height: 107px;
z-index: 1;
overflow: hidden;
position: relative;
top: 0;
left: 0;
margin: 0;
padding: 0;
}

.jcarousel-list li,
.jcarousel-item{
float: left;
list-style: none;
width: 156px;
height: 107px;
}

.jcarousel-skin-tango .jcarousel-container{
-moz-border-radius: 10px;
width: 611px;
height: 107px;
}

.jcarousel-skin-tango .jcarousel-container-horizontal{
width: 547px;
height: 107px;
padding: 14px 0 0 53px;
}

.jcarousel-skin-tango .jcarousel-item{
width: 156px;
height: 107px;
}

.jcarousel-skin-tango .jcarousel-item-horizontal{
margin-right: 17px;
}

.jcarousel-skin-tango .jcarousel-next-horizontal{
position: absolute;
top: 64px;
left: 578px;
width: 32px;
height: 32px;
cursor: pointer;
background: url(Images/ArrowR.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal{
position: absolute;
top: 64px;
left: 25px;
width: 32px;
height: 32px;
cursor: pointer;
background: url(Images/ArrowL.png) no-repeat 0 0;
}
/*--END-SCROLLER--*/



/*--LIGHTBOX-IMAGE-POPUP--*/
#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(Images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(Images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }
