/* ******************************************************************** */ 
/*                  Generated by: http://csscreator.com                 */
/* ******************************************************************** */
html, body{ 
font-size : 12px; 
padding : 0; 
margin : 0; 
font-family : arial; 
color : #002249; 
background-image: 
url('images/testsliver.jpg');
background-repeat: repeat-x; 
background-color: #B5CDD9;
scrollbar-face-color:#01244A; 
scrollbar-track-color:#63A2D7; 
scrollbar-arrow-color:#63A2D7; 
scrollbar-shadow-color:#01244A; 
scrollbar-dark-shadow-color:#01244A; 
scrollbar-3dlight-color:#01244A; 
scrollbar-highlight-color:#ffffff
} 

img { border: 0; } 
 
#pagewidth{ 
margin-top: 20px;
 width:958px; 
 text-align:center; 
  background-color:#ffffff; 
      margin-left: auto;
    margin-right: auto;
} 
 
#header{
 position:relative; 
 height:235px; 
 background-color:#ffffff; 
 width:100%;
 display:block;
 text-align: center:

} 

#topblack{
margin-left: 9px;
padding-top: 3px;
width: 930px;
border: 6px solid white;
 position:relative; 
 height:28px; 
 background-color:#000000; 
font-weight: bold;
 display:block;
} 
#topblack h2{
font-family: arial;
 color: #ffffff;
 font-size: 16px;
padding-top: 2px;
padding-bottom: 0px;
padding-left: 0px;
padding-left: 10px;
margin: 0px;
float: left;
}

#topblack h3{
font-family: arial;
 color: #ffffff;
 font-size: 16px;
padding-top: 2px;
padding-bottom: 0px;
padding-left: 0px;
padding-left: 10px;
margin: 0px;
float: left;
}
 
#leftcol{
 width:171px; 
 float:left; 
 position:relative; 
 background-color:#ffffff; 
 padding-left: 10px;
 }
 
#maincol{
text-align: left;
 background-color: #FFFFFF;  
 position: relative; 
 width:758px;
 float:right; 
 padding-right: 10px;
 padding-top: 10px;
 }
 
#footer{
 height:100px; 
  background-color:#B5CDD9; 
 clear:both;
 display:block;
} 
 

 
 
/* ******************************************************************** */ 
/* Clearfix: http://csscreator.com/attributes/containedfloat.php        */
/* ******************************************************************** */
.clearfix:after {
 content: "."; 
 display: block; 
height: 0; 
 clear: both; 
 visibility: hidden;
 }
 
.clearfix{display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix{height: 1%;}
.clearfix{display: block;}
/* End hide from IE-mac */  


 
 
/* ******************************************************************** */ 
/*                      printer styles                                  */ 
/* ******************************************************************** */ 
     
 @media print{ 
/*hide the left column when printing*/ 
#leftcol{display:none;} 
#twocols, #maincol{width:100%; float:none;}
}
















body {
font-size : 12px; 
padding : 0; 
margin : 0; 
font-family : arial; 
color : #002249; 
background-image: 
url('images/testsliver.jpg');
background-repeat: repeat-x; 
background-color: #B5CDD9;
scrollbar-face-color:#01244A; 
scrollbar-track-color:#63A2D7; 
scrollbar-arrow-color:#63A2D7; 
scrollbar-shadow-color:#01244A; 
scrollbar-dark-shadow-color:#01244A; 
scrollbar-3dlight-color:#01244A; 
scrollbar-highlight-color:#ffffff
} 
h1 {
font-family: arial;
font-size: 28px;
text-decoration: none;
font-weight: normal;
color: #fc0;

}
A:link {
font-weight : normal; 
font-size : 12px; 
font-family : arial; 
color : #069; 
text-decoration : none; 
} 
A:visited {
font-weight : normal; 
font-size : 12px; 
font-family : arial; 
color : #069; 
text-decoration : none; 
} 
A:active {
font-weight : normal; 
font-size : 12px; 
font-family : arial; 
color : #069; 
text-decoration : none; 
} 
A:hover {
font-weight : normal; 
font-size : 12px; 
font-family : arial; 
color : #64903d; 
text-decoration : none; 
} 
table {
margin : 0; 
padding : 0; 
border-collapse : collapse; 
border : 0 none inherit; 
} 
td {
padding : 0; 
margin : 0; 
border : 0 none inherit; 
border-collapse : collapse; 
font-size : 12px; 
font-family: arial;
} 
.linkbar {
background-color : #f1f3e9; 
padding : 10px; 
width : 191px; 
vertical-align : top; 
} 
.linkbartitle {
background-color : #ffffff; 
border : 1px dashed #bcc2a6; 
font-family : arial; 
font-size : 12px; 
color : #006699; 
font-weight : bold; 
text-align : center; 
} 
.subbanner {
border-bottom : 1px dashed #bcc2a6; 
} 
.content {
background-color : #ffffff; 
padding : 10px; 
text-align : justify; 
font-size: 10px;
color: #002249;
font-family: arial;
} 
.footer {
font-weight: normal;
font-family : verdana; 
font-size : 11px; 
color : #002249; 
padding : 5px; 
text-align : center; 
} 
A.footerlinks:link {
font-weight: normal;
font-family : verdana; 
font-size : 11px; 
color : #002249; 
text-decoration : none; 
} 
A.footerlinks:visited {
font-weight: normal;
font-family : verdana; 
font-size : 11px; 
color : #002249; 
text-decoration : none; 
} 
A.footerlinks:active {
font-weight: normal;
font-family : verdana; 
font-size : 11px; 
color : #002249; 
text-decoration : none; 
} 
A.footerlinks:hover {
font-weight: normal;
font-family : verdana; 
font-size : 11px; 
color : #002249; 
text-decoration : underline; 
} 
img {
border : 0 none inherit; 
border : 0; 
position : relative; 
margin : 0; 
padding : 0; 
border-collapse : collapse; 
} 
.topbanner {
background : #002249 url('images/bannerbackback2.jpg') repeat; 
width : 100%; 
height : 196px; 
} 
.featuredband {
background : #ffffff url('images/featuredband.jpg') repeat; 
width : 100%; 
height : 19px; 
} 
.clientband {
background : #ffffff url('images/client.jpg') repeat; 
width : 100%; 
height : 19px; 
} 
.featuredimg {
background-color : #bcc2a6; 
text-align : center; 
font-family : arial black; 
color : #f1f3e9; 
font-size : 12px; 
} 
.featuredimg.img {
border : 1px solid black; 
} 
.featured {
background-color : #bcc2a6; 
padding-top : 6px; 
} 

.portblue {
padding-top: 25px;
padding-left: 14px;
padding-right: 14px;
background-image: url("images/blueback.jpg"); 
color: #ffffff;
height: 165px;
width: 728px;
font-weight: normal;
text-align: left;
vertical-align: text-top;
}

.portgreen {
padding-top: 25px;
padding-left: 14px;
padding-right: 14px;
background-image: url("images/greenback.jpg"); 
color: #ffffff;
height: 165px;
width: 728px;
font-weight: normal;
text-align: left;
vertical-align: text-top;
}

.portorange {
padding-top: 25px;
padding-left: 14px;
padding-right: 14px;
background-image: url("images/orangeback.jpg"); 
color: #ffffff;
height: 165px;
width: 728px;
font-weight: normal;
text-align: left;
vertical-align: text-top;
}

.portblack {
padding-top: 25px;
padding-left: 14px;
padding-right: 14px;
background-image: url("images/blackback.jpg"); 
color: #ffffff;
height: 165px;
width: 728px;
font-weight: normal;
text-align: left;
vertical-align: text-top;
}

img.portimages {
text-align: left;
border: 1px solid black;
margin-right: 5px;
}

a:hover .portimages {
text-align: left;
border: 1px solid black;
margin-right: 5px;
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
}

.thanksblue {
text-align: justify; 
padding-left: 10px; 
padding-top: 25px;
padding-right: 15px;
background-image: url("images/testblue.jpg"); 
color: #ffffff;
height: 210px;
width: 728px;
font-weight: normal;
font-size: 14px;
font-family: arial;
}

.thanksblack {
text-align: justify; 
padding-left: 10px; 
padding-top: 25px;
padding-right: 15px;
background-image: url("images/testblack.jpg"); 
color: #ffffff;
height: 210px;
width: 728px;
font-weight: normal;
font-size: 14px;
font-family: arial;
}

.thanksgreen {
text-align: justify; 
padding-left: 10px; 
padding-top: 25px;
padding-right: 15px;
background-image: url("images/testgreen.jpg"); 
color: #ffffff;
height: 210px;
width: 728px;
font-weight: normal;
font-size: 14px;
font-family: arial;
}

.thanksorange {
text-align: justify; 
padding-left: 10px; 
padding-top: 25px;
padding-right: 15px;
background-image: url("images/testorange.jpg"); 
color: #ffffff;
height: 210px;
width: 728px;
font-weight: normal;
font-size: 14px;
font-family: arial;
}


.testbox1 {
background-image: url("images/blacksliver.jpg"); 
background-repeat: repeat-x;
padding: 14px;
color: #ffffff;
height: 182px;
}

.testbox1a {
background: #707070;
background-image: url("images/blacksliver.jpg"); 
background-repeat: repeat-x;
padding: 14px;
color: #ffffff;
height: 182px;
}
a.whitelink:link {color: white; text-decoration: underline}
a.whitelink:hover {color: white; text-decoration: none}



.testbox2 {
background-image: url("images/orangesliver.jpg"); 
background-repeat: repeat-x;
padding: 14px;
color: #ffffff;
height: 182px;
}

.testbox2a {
background: #D49E00;
background-image: url("images/orangesliver.jpg"); 
background-repeat: repeat-x;
padding: 14px;
color: #ffffff;
height: 182px;
}

.testbox3 {
background-image: url("images/bluesliver.jpg"); 
background-repeat: repeat-x;
padding: 14px;
color: #ffffff;
height: 182px;
}

.testbox3a {
background: #2B557D;
padding: 16px;
color: #ffffff;
}



.testbox4 {
background-image: url("images/greensliver.jpg"); 
background-repeat: repeat-x;
padding: 14px;
color: #ffffff;
height: 182px;
}

.testbox4a {
background: #84AE3E;
padding: 14px;
color: #ffffff;
}

A.rfq:link {
font-weight : bold; 
font-size : 12px; 
font-family : arial; 
color : #006699; 
text-decoration : none; 
} 
A.rfq:visited {
font-weight : bold; 
font-size : 12px; 
font-family : arial; 
color : #006699; 
text-decoration : none; 
} 
A.rfq:active {
font-weight : bold; 
font-size : 12px; 
font-family : arial; 
color : #006699; 
text-decoration : none; 
} 
A.rfq:hover {
font-weight : bold; 
font-size : 12px; 
font-family : arial; 
color : #E0798F; 
text-decoration : none; 
} 

#lightbox{
	background-color:#eee;
	padding: 10px;
	border-bottom: 2px solid #666;
	border-right: 2px solid #666;
	}
#lightboxDetails{
	font-size: 0.8em;
	padding-top: 0.4em;
	}	
#lightboxCaption{ float: left; }
#keyboardMsg{ float: right; }

#lightbox img{ border: none; } 
#overlay img{ border: none; }

#overlay{ background-image: url(images/overlay.png); }

* html #overlay{
	background-color: #000;
	back\ground-color: transparent;
	background-image: url(images/blank.gif);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/overlay.png", sizingMethod="scale");
	}

.shadetabs{
padding: 3px 0;
margin-left: 0;
margin-top: 1px;
margin-bottom: 0;
font: bold 11px Verdana;
list-style-type: none;
text-align: left; /*set to left, center, or right to align the menu as desired*/
}

.shadetabs li{
display: inline;
margin: 0;
font: bold 11px Verdana;
}

.shadetabs li a{
font: bold 11px Verdana;
text-decoration: none;
padding: 3px 7px;
margin-right: 3px;
border: 1px solid #778;
color: #333333;
}

.shadetabs li a:visited{
font: bold 11px Verdana;
color: #333333;
}

.shadetabs li a:hover{
font: bold 11px Verdana;
text-decoration: none;
color: #ffcc00;
}

.shadetabs li.selected{
font: bold 11px Verdana;
position: relative;
top: 1px;
}

.shadetabs li.selected a{ /*selected main tab style */
/*background-image: url(images/righton.jpg);*/
background: #000000;
color: white;
font: bold 11px Verdana;
}

.shadetabs li.selected a:hover{ /*selected main tab style */
text-decoration: none;
font: bold 11px Verdana;
}

.tabcontentstyle{ /*style of tab content oontainer*/
width: 772px;
margin-bottom: 1em;
padding: 0px;
font: bold 11px Verdana;
}

.tabcontent{
display:none;
}

@media print {
.tabcontent {
display:block!important;
}
}

#lightbox{
	background-color:#eee;
	padding: 10px;
	border-bottom: 2px solid #666;
	border-right: 2px solid #666;
	}
#lightboxDetails{
	font-size: 0.8em;
	padding-top: 0.4em;
	}	
#lightboxCaption{ float: left; }
#keyboardMsg{ float: right; }

#lightbox img{ border: none; } 
#overlay img{ border: none; }

#overlay{ background-image: url(overlay.png); }

* html #overlay{
	background-color: #000;
	back\ground-color: transparent;
	background-image: url(blank.gif);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="overlay.png", sizingMethod="scale");
	}


A.cs:link {
font-weight : normal; 
font-size : 12px; 
font-family : arial; 
color : #fff; 
text-decoration : none; 
} 
A.cs:visited {
font-weight : normal; 
font-size : 12px; 
font-family : arial; 
color : #fff; 
text-decoration : none; 
} 
A.cs:active {
font-weight : normal; 
font-size : 12px; 
font-family : arial; 
color : #fff; 
text-decoration : none; 
} 
A.cs:hover {
font-weight : normal; 
font-size : 12px; 
font-family : arial; 
color : #fff; 
text-decoration : underline; 
} 



#navcontainer
{
padding-left: 13px;
padding-bottom: 10px;
}

#home
{ 
float: left;
display: block;
  width: 66px;
  height: 25px;
  background: url("http://www.tannercreative.com/buttons/images/home.jpg") no-repeat 0 0;
}
#home:hover{   background-position: 0 -25px; }
#home span{  display: none;}

#about-us
{ 
float: left;
display: block;
  width: 93px;
  height: 25px;
  background: url("http://www.tannercreative.com/buttons/images/about-us.jpg") no-repeat 0 0;
}
#about-us:hover{   background-position: 0 -25px; }
#about-us span{  display: none;}

#what-we-offer
{ 
float: left;
display: block;
  width: 129px;
  height: 25px;
  background: url("http://www.tannercreative.com/buttons/images/what-we-offer.jpg") no-repeat 0 0;
}
#what-we-offer:hover{   background-position: 0 -25px; }
#what-we-offer span{  display: none;}

#view-our-work
{ 
float: left;
display: block;
  width: 130px;
  height: 25px;
  background: url("http://www.tannercreative.com/buttons/images/view-our-work.jpg") no-repeat 0 0;
}
#view-our-work:hover{   background-position: 0 -25px; }
#view-our-work span{  display: none;}

#thanks-tanner
{ 
float: left;
display: block;
  width: 131px;
  height: 25px;
  background: url("http://www.tannercreative.com/buttons/images/thanks-tanner.jpg") no-repeat 0 0;
}
#thanks-tanner:hover{   background-position: 0 -25px; }
#thanks-tanner span{  display: none;}

#faq
{ 
float: left;
display: block;
  width: 75px;
  height: 25px;
  background: url("http://www.tannercreative.com/buttons/images/faq.jpg") no-repeat 0 0;
}
#faq:hover{   background-position: 0 -25px; }
#faq span{  display: none;}

#free-quote
{ 
float: left;
display: block;
  width: 102px;
  height: 25px;
  background: url("http://www.tannercreative.com/buttons/images/free-quote.jpg") no-repeat 0 0;
}
#free-quote:hover{   background-position: 0 -25px; }
#free-quote span{  display: none;}

#free-articles
{ 
float: left;
display: block;
  width: 114px;
  height: 25px;
  background: url("http://www.tannercreative.com/buttons/images/free-articles.jpg") no-repeat 0 0;
}
#free-articles:hover{   background-position: 0 -25px; }
#free-articles span{  display: none;}

#contact-us
{ 
float: left;
display: block;
  width: 92px;
  height: 25px;
  background: url("http://www.tannercreative.com/buttons/images/contact-us.jpg") no-repeat 0 0;
}
#contact-us:hover{   background-position: 0 -25px; }
#contact-us span{  display: none;}

h2.front {
font-family: arial;
color: #8DB64B;
font-size: 18px;
font-weight: bold;
padding-left: 10px;
margin: 3px;
}

h3 {
font-family: arial;
color: orange;
font-size: 16px;
font-weight: bold;
margin: 3px;
}

a:hover .frontpage-portfolio {
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
}

#home-form {
font-family: arial; font-size: 14px; width: 725px; padding: 10px; color: white; border: 2px solid #2A537B; background-image:url('images/quoteback.jpg');
text-align: left;
}

.portfolio-leftbar {
background-color: #ffffff; padding: 10px; text-align: right; border-bottom: 1px solid #D7D8CC;
}

input, textarea{
background: #ffffff; font-size: 14px; border: 1px solid #002249;
}

.overwhelm {
font-family: arial;
font-size: 16px;
font-weight: bold;
text-align: center;
color: orange;
}

.logobox1 {
display: block;
text-align: center;
float: left;
height: 250px;
width: 49%;
border: 3px solid #dddddd;
vertical-align: middle;
}


.logobox2 {
display: block;
text-align: center;
float: right;
height: 250px;
width: 49%;
border: 3px solid #dddddd;
vertical-align: middle;

}
.logomainbox {
width:726px; 
min-height: 2250px;
vertical-align: middle;
}