@charset "UTF-8";


/* General Styles */

body { background: url(../img/bkgd.gif) repeat #2696c0; margin: 0 0 0 0; text-align: center; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 19px; }

.colclear { background: none; clear: both; height: 10px; }

a, a:link, a:visited { color: #f06533;  }
a:hover { color: #492f91; }

h2.h2contact { font-size: 16px; margin-bottom: 5px; line-height: 22px; }
h2 { font-size: 14px; line-height: 22px; color: #000; }

.photoleft { float: left; padding-bottom: 10px; padding-right: 10px; }
.photoright { float: right; padding-bottom: 10px; padding-left: 10px; }

.imghead { border-bottom: 1px dotted #d4b054; padding-bottom: 10px; margin-bottom: 20px; }




/* Body */

#main { width: 1054px; text-align: center; background: url(../img/bkgd-main.gif) repeat-y top center; margin: 0 auto; }


#header { width: 1054px; margin: 0 auto; height: 200px; background: none; text-align: left; padding-bottom: 20px; }
#logo { float: left; width: 210px; height: 200px; background: #fedc85; position: absolute; margin: 0 0 0 55px; }
.navtop { float: left; width: 668px; height: 21px; background: url(../img/bkgd-navtop.jpg) no-repeat #fedc85; position: absolute; margin: 0px 0 0 331px; }
.navleft { float: left; width: 66px; height: 200px; background: url(../img/bkgd-navleft.jpg) no-repeat #fedc85; position: absolute; margin: 0 0 0 265px; }
.navright { float: left; width: 55px; height: 141px; background: url(../img/bkgd-navright.gif) no-repeat; position: absolute; margin: 62px 0 0 999px; }
.hdtop { float: left; width: 668px; height: 41px; background: url(../img/bkgd-hd-top.jpg) no-repeat #fedc85; position: absolute; margin: 121px 0 0 331px; }
.hd { float: left; width: 436px; height: 38px; background: #fedc85; position: absolute; margin: 162px 0 0 331px; }
.hdright { float: left; width: 232px; height: 38px; background: url(../img/bkgd-hd-right.gif) no-repeat #fedc85; position: absolute; margin: 162px 0 0 767px; }



#leftcol { float: left; width: 191px; padding: 0 0 0 100px; background: none; text-align: left; }
.leftcol { float: left; width: 191px; padding: 0 0 0 100px; background: none; text-align: left; }
	


#rightcol { float: left; width: 623px; padding: 0 0 0 40px; background: none; text-align: left; }
.rightcol { float: left; width: 623px; padding: 0 0 0 40px; background: none; text-align: left; }

#subleftcol {float: left; width: 335px; padding-right: 20px;  background: none;}
#subrightcol {float: left; width: 265px; background: none; text-align: center; }

#extralinks { text-align: center; padding-top: 5px; }
#extralinks a, #extralinks a:link, #extralinks a:visited { text-decoration: none; color: #000; font-weight: bold; }
#extralinks a:hover { text-decoration: underline; color: #f06533; font-weight: bold; }
.extralink { width: 218px; height: 22px; background: url(../img/btn/btn-sublinks.gif) no-repeat; padding: 5px 0 0 35px; margin-bottom: 5px; text-align: left; }



h1.h1footer { text-align: center; color: #036; font-size: 18px; margin: 0 0 20px 0; }
#homefooter { width: 1000px; padding: 0 0 50px 0; text-align: center; background: none; margin: 0 auto; }
#homefooter a, #homefooter a:link, #homefooter a:visited { color: #036; }
#homefooter a:hover { color: #9FF; }



#footer { width: 1054px; height: 289px; text-align: left; background: url(../img/footer.gif) no-repeat top center; margin: 0 auto; }
#footerlinks { float: left; background: none; position: absolute; width: 605px; margin: 85px 0 0 157px; text-align: left; }
.footerlink { padding-right: 20px; font-weight: bold; }
#footermedia { float: left; height: 50px; background: none; position: absolute; width: 605px; margin: 35px 0 0 157px; text-align: left; }
.mediaicon { margin-bottom: -10px; padding-left: 15px; border: none; }
#footerlegal { float: left; position: absolute; width: 187px; margin: 85px 0 0 767px; text-align: right; }









/* Nav */
#subnav { width: 191px; background: url(../img/subnavmid.jpg) repeat-y; }
.subnavtop { width: 191px; height: 68px; background: url(../img/subnavtop.jpg) no-repeat; }
.subnavbottom { width: 191px; height: 66px; background: url(../img/subnavbottom.jpg) no-repeat; }


#subnav ul
{
margin-left: 20px;
padding-left: 0;
list-style-type: none;
font-family: Arial, Helvetica, sans-serif;
}

#topsubnav { border-top: 1px solid #f5d488; }

#subnav a
{
display: block;
padding: 5px;
width: 140px;
background: none;
border-bottom: 1px solid #f5d488;
text-align: right;
font-weight: bold; font-size: 14px;
}

#subnav a:link, #subnavlist a:visited
{
color: #000;
text-decoration: none;
}

#subnav a:hover
{
background-color: #f5d488;
color: #000;
}


#navigation { float: left; width: 670px; height: 100px; background: #fedc85; position: absolute; margin: 21px 0 0 331px; z-index: 500; }


#nav {padding:0; margin:0; list-style:none; height:100px; position:relative; z-index:200; font-family:arial, verdana, sans-serif; width:670px;}
#nav li.top {display:block; float:left;}
#nav li a {display:block; float:left; height:100px; width:134px; text-decoration:none; padding:0; cursor:pointer;}
#nav li a b {margin-left:-9999px;}

#nav li a.home {background: url(../img/nav/home.jpg);}
#nav li a.meet {background:url(../img/nav/meet.jpg);}
#nav li a.about {background:url(../img/nav/about.jpg);}
#nav li a.buy {background:url(../img/nav/buy.jpg);}
#nav li a.contact {background:url(../img/nav/contact.jpg);}

#nav li:hover a,
#nav a:hover
{background-position: 0 100px;}

#nav table {position:absolute; top:0; left:0; border-collapse:collapse; padding:0; width:0; height:0; margin:-1px;}

#nav .sub {position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}

#nav li:hover {position:relative; z-index:200;}
#nav a:hover {position:relative; white-space:normal; z-index:200;}

#nav :hover ul.sub
{left:0; top:100px; background: none; width:134px; height:auto; z-index:300; }
#nav :hover ul.sub li
{display:block; height:29px; position:relative; float:left; width:134px; font-weight:normal;}
#nav :hover ul.sub li a
{display:block; height:29px; width:134px; text-decoration:none; padding:0; cursor:pointer; }
#nav :hover ul.sub li a b { position:absolute; left:-9999px; margin:0;}

#nav :hover ul li a.grippa {background:url(../img/nav/nav-bttn-grippa.gif);}
#nav :hover ul li a.dip {background:url(../img/nav/nav-bttn-dip.gif);}
#nav :hover ul li a.pearl {background:url(../img/nav/nav-bttn-pearl.gif);}
#nav :hover ul li a.casestudies {background:url(../img/nav/nav-bttn-casestudies.gif);}

#nav :hover ul.sub li a:hover 
{background-position: 0 29px; position:relative;}

#nav :hover ul.sub li a:hover b {left:-9999; top:-9999; background:none; color: #069; display:block; font-size:10px;}