/* CSS Document */

/*** Shafi Imports Style Sheet ***/
/*** Created by Paul Wallas ***/


/*** Some sensible defualts ***/
strong { font-weight: bold }
em { font-style: italic }
ol { list-style:none }

* a { position:relative } /* Gets links displaying over a PNG background */
a { outline:none } /* Gets rid of Firefox's dotted borders */
a img { border:none } /* Gets rid of IE's blue borders */

.fl-left { float:left; }
.fl-right { float:right; }
.img-left { float:left; margin:3px 20px 10px 0; padding:0; }
.img-right { float:right; margin:3px 0 10px 20px; padding:0; }

.clr { clear:both; }


/*** SITE STYLES ***/
body { margin:0; padding:0; background:url(../images/bg.jpg) top repeat-x; font:Verdana, Arial, Helvetica, sans-serif; }
#outerContainer { width:995px; margin:34px auto 0 auto; }


/*** TOP NAV ( the little one ) ***/
.topHome { background:url(../images/top-home.jpg) top left; width:28px; height:41px; float:left; display:block; }
.topHome:hover { background:url(../images/top-home.jpg) top right; width:28px; height:41px; float:left; display:block; }
.topContact { background:url(../images/top-contact.jpg) top left; width:30px; height:41px; float:left; display:block; }
.topContact:hover { background:url(../images/top-contact.jpg) top right; width:30px; height:41px; float:left; display:block; }


/*** CONTENT ***/
#contentContainer { background:url(../images/content-bg.jpg) no-repeat; width:995px; height:608px; display:block; }
#logo { margin:18px 0 0 63px; float:left; }
.flashTop { margin:18px 0 0 -1px; float:left; }


/*** NAVIGATION ***/
#navContainer { float:left; width:140px; text-align:right; }
#navigation { position:relative; top:2px; left:120px; padding: 0; list-style: none; height: 549px; background: url(../images/colorbar_light2.jpg) no-repeat; }
#navigation li { width: 119px; margin-left: -49px; }
#navigation li a { display: block; margin-left: -70px; padding-top: 50px; width: 119px; height: 0; overflow: hidden; background: #000; opacity: .8; -webkit-border-radius: 0px; }
#navigation .home a       { background: url(../images/home.gif) no-repeat top right; }
#navigation .services a   { background: url(../images/services.gif) no-repeat top right; }
#navigation .products a      { background: url(../images/products.gif) no-repeat top right; }
#navigation .trades a   { background: url(../images/trades.gif) no-repeat top right; }
#navigation .about a        { background: url(../images/about.gif) no-repeat top right; }
#navigation .contact a { background: url(../images/contact.gif) no-repeat top right; }


/*** VERTICAL SCROLLER ***/
#verticalScroller { width:432px; margin:-430px 0 0 70px; float:left; }


/*** CTA'S ***/
.cta-text { font-size:12px; font-family:Arial, Helvetica, sans-serif; color:#2d2a4f; display:block; width:175px; margin:0 auto; padding:6px 0 0 0; }
.cta1 { width:202px; height:212px; float:left; margin:-260px 0 0 510px; }
.cta2 { width:202px; height:212px; float:left; margin:-212px 0 0 210px; }


/*** FOOT ***/
#footNav { padding:23px 0 0 75px; }
#footMenu { margin:30px 0 0 0; width:320px; float:left; }
.footHome { background:url(../images/foot-home.gif) top left; height:27px; width:222px; display:block; border:none; }
.footHome:hover { background:url(../images/foot-home.gif) top right; cursor:pointer; } 
.footServices { background:url(../images/foot-services.gif) top left; height:27px; width:222px; display:block; border:none; }
.footServices:hover { background:url(../images/foot-services.gif) top right; cursor:pointer; } 
.footProducts { background:url(../images/foot-products.gif) top left; height:27px; width:222px; display:block; border:none; }
.footProducts:hover { background:url(../images/foot-products.gif) top right; cursor:pointer; } 
.footTrade { background:url(../images/foot-trades.gif) top left; height:27px; width:222px; display:block; border:none; }
.footTrade:hover { background:url(../images/foot-trades.gif) top right; cursor:pointer; }
.footAbout { background:url(../images/foot-about.gif) top left; height:27px; width:222px; display:block; border:none; }
.footAbout:hover { background:url(../images/foot-about.gif) top right; cursor:pointer; }
.footContact { background:url(../images/foot-contact.gif) top left; height:27px; width:222px; display:block; border:none; }
.footContact:hover { background:url(../images/foot-contact.gif) top right; cursor:pointer; } 
#footLatestContainer { margin:30px 0 0 0; width:320px; float:left; }
#footLatest { margin:15px 0 0 75px; }
#footLatestContent { font-size:11px; line-height:16px; color:#2c2c2c; width:235px; margin:10px 0 0 79px; font-family:Verdana, Arial, Helvetica, sans-serif; }

#footContactContainer { margin:30px 0 0 0; width:320px; float:left; }
#footContact { margin:15px 0 0 71px; }


/*** FORM ***/
#textfield { width:210px; height:22px; background-color:#e5e5e5; border:none; padding:2px 0 0 2px; }
#textfield2 { width:210px; height:22px; background-color:#e5e5e5; border:none; padding:2px 0 0 2px; }
#textarea { width:210px; height:50px; background-color:#e5e5e5; border:none; padding:2px 0 0 2px; }
#submit { border:1px solid #9f9f9f; width:72px; height:24px; margin:5px 23px 0 0; text-indent:none; }
#submit:hover { border:1px solid #000; width:72px; height:24px; margin:5px 23px 0 0; text-indent:none; cursor:pointer; }