/* == STYLESHEET FUNCTIONS
------------------------------------------------------------------------------------------------------------------------
- Defines the site-wide layout for core structure
- Defines reusable widget code
- Defines page specific layout
- Overrides base HTML elements where required
----------------------------------------------------------------------------------------------------------------------*/

/* == CONTENTS
------------------------------------------------------------------------------------------------------------------------
- Main Layout
- Head Content
- Primary Navigation
- Foot Content

[Widget Styles:]

----------------------------------------------------------------------------------------------------------------------*/


/* == Main Layout
----------------------------------------------------------------------------------------------------------------------*/

#cont{background: url(/img/bg-cont.gif) repeat-x top left; padding: 11px 0 0 0;}
#wrap{width: 945px; background: #2e434b; margin: 0 auto; padding: 7px 25px;}
#wrap #head{float: left; position: relative; width: 100%; height: 390px; background: url(/img/bg-head.gif) no-repeat 0 125px;}
#wrap #mainContent{float: left; width: 100%; margin: 12px 0 0 0;}
#wrap #foot{float: left; width: 915px; background: #1e2b2f; color: #d0dbe3; font-size: 85%; text-transform: uppercase; font-weight: bold; border-top: 1px #466774 solid; vertical-align: top; padding: 10px 15px;}
#wrap #teamBar{float: left; width: 915px; text-align:center;background: #17242a; color: #d0dbe3; border-top: 1px #466774 solid; padding: 10px 15px;}


/* == Head Content
----------------------------------------------------------------------------------------------------------------------*/

#wrap #head #logo a.logo{position: absolute; width: 580px; height: 82px; top: 29px; left: 39px;}
#wrap #logo{position: relative; width: 100%; height: 125px; background: url(/img/bg-logo.gif) no-repeat 39px 29px;}

#wrap #logo .basket{float: right; position: relative; width: 268px; height: 94px; background: url(/img/bg-basket.gif?1) no-repeat top right; color: #fff;}
#wrap #logo .basket .inner{position: relative; width: 180px; height: 70px; top: 7px; left: 95px;}
#wrap #logo .basket .inner h5, 
#wrap #logo .basket .inner p{position: absolute; margin: 0; padding: 0;}
#wrap #logo .basket .inner h5{font-size:145%;font-weight:bold;padding-left:10px;width:150px;border:none;}
#wrap #logo .basket .inner p.links,
#wrap #logo .basket .inner p.items, 
#wrap #logo .basket .inner p.total{font-size: 85%;}
#wrap #logo .basket .inner p.items{left:5px;top:25px;}
#wrap #logo .basket .inner p.total{left:85px;top:25px;}
#wrap #logo .basket .inner p.links{border-top:1px dashed #3F8E96;left:0;padding-left:20px;padding-top:5px;top:45px;width:130px;}
#wrap #logo .basket .inner p span, #wrap #logo .basket .inner a{color: #63c1c9; font-weight: bold; text-decoration: none;}
#wrap #banner{position: absolute; width: 947px; height: 256px; left: 0; bottom: 0; background: url(/img/banner2.gif) no-repeat bottom center;}
#wrap #banner .text{position: absolute; width: 260px; left: 260px; bottom: 105px; color: #fff; font-weight: bold; font-size: 170%; font-style: italic; text-align: justify;}
#wrap #banner .endorse{float:right;display:inline;width:205px;height:160px;overflow:hidden;margin-top:85px;margin-right:10px;}
#wrap #banner .slideshow .supplierbox{width: 205px;height: 160px;}
#wrap #banner .slideshow .supplierbox img{float:left;margin-right:5px;}
#wrap #banner .slideshow .supplierbox p{width:90px;float:left;color:#fff; font-size: 90%;}
#wrap #banner .endorse a{margin-left:35px;}

/* == Navigation Styles
----------------------------------------------------------------------------------------------------------------------*/

#wrap #nav{width: 100%; height: 45px;}

#wrap #nav ul{float: left; display: inline; margin: 4px 0 0 11px; padding: 0;position: relative;}
#wrap #nav ul li{float: left; zoom: 1;display: inline; list-style: none; margin: 0; padding: 0;}
#wrap #nav ul li span,
#wrap #nav ul li a{float: left; height: 37px; display: block; line-height: 37px; margin: 0; padding: 0 12px; color: #d0dbe3; text-decoration: none; font-size: 95%; font-weight: bold; text-transform: uppercase; border-left: 1px #243136 solid; border-right: 1px #293d43 solid;}
#wrap #nav ul li a:hover{color: #fff;}
#wrap #nav ul li a.first{border-left: 0;}
#wrap #nav ul li a.last{border-right: 0;}
#wrap #nav ul li.hover,
#wrap #nav ul li:hover{position: relative;}
#wrap #nav ul li ul{width: 145px;padding-top:10px;visibility: hidden;position:absolute;margin:0;top:30px;left:-1px;border-bottom:2px solid #59809E;z-index:2000;}
#wrap #nav ul li ul li{width: 145px;background:url(/img/bg-head-dropdown.gif) repeat-x;border-left: 1px #243136 solid; border-right: 1px #293d43 solid;}
#wrap #nav ul li ul li a{width:120px; display: inline-block;line-height:32px;height:32px;-moz-box-shadow:2px 1px 3px 1px #59809E;border-color: #243136 #293D43;border-style:solid;border-width:0 1px;} 
#wrap #nav ul li a.secondLast{padding-right:65px;}
/* == Main Content Styles
----------------------------------------------------------------------------------------------------------------------*/
#wrap #mainContent #right h1{font-size:180%;font-weight:bold;}
#wrap #mainContent #left, #wrap #mainContent #right{float: left; display: inline; width: 255px; padding: 0 0 12px 0;}
#wrap #mainContent #right{width: 660px; min-height: 690px; _height: 690px; background: url(/img/bg-right-top.gif) no-repeat top left #fff; margin: 0; padding: 15px 15px 25px;}

#wrap #mainContent #left span.title{color: #fff; display: block; font-weight: bold; text-transform: uppercase;}

#wrap #mainContent #left .curve{float: left;margin-bottom:10px; display: inline; width: 241px; background: transparent url(/img/bg-curveleft.gif?1) no-repeat scroll left top;}
#wrap #mainContent #left .curve span.title{height: 40px; line-height: 35px; padding: 0 30px; margin: 9px 0 0 0;}
#wrap #mainContent #left .curve .content{background:#1D292E url(/img/bg-product-list.gif?1) repeat-y scroll right center;color:#D0DBE3;float:left;padding:5px 5px 0;width:231px;}
#wrap #mainContent #left .curveBottom {background: transparent url(/img/bg-curveleft-bottom.gif?1) no-repeat scroll left bottom; float: left; padding:0px 5px 5px 5px; width:231px; height:10px; color: #d0dbe3;}

#wrap #mainContent #left .curve a{color: #d0dbe3;}
#wrap #mainContent #left .curve ul{padding: 0 10px 0 0;display:inline-block;}
#wrap #mainContent #left .curve ul li{list-style: url(/img/bullet-curveleft.gif); border-bottom: 1px #59809e dashed; padding: 0 0 5px 0; margin: 0 0 5px 0;}
#wrap #mainContent #left .curve ul li a{text-decoration: none;}

#wrap #mainContent #left .signup{float: left; height: 105px; margin:0 0 15px 1px; width:235px; color: #b3bcc0; font-size: 120%;}
#wrap #mainContent #left .signup span.title{font-size: 110%;}
#wrap #mainContent #left .signup fieldset{margin-top:5px;}
#wrap #mainContent #left .signup .submit{width: 60px; height: 27px; padding: 0; background: #ff6600; color: #fff; font-size: 80%;}
#wrap #mainContent #left .signup input{height:17px;width:140px;}

#wrap #mainContent #left .supplierbox{float: left;}
#wrap #mainContent #left .supplierbox .content{width: 230px; background: #fff; border: 1px #568ba6 solid; border-width:1px; -moz-border-radius:7px; padding: 3px; color: #fff; font-size: 120%; line-height:30px;}
#wrap #mainContent #left .supplierbox .content img{margin:0;}

#wrap #mainContent #right .specialoffer{float: left; position: relative; width: 605px; height: 145px; background: url(/img/bg-specialoffer.jpg) repeat-y top left; color: #fff;}
#wrap #mainContent #right .specialoffer .title{position: absolute; top: 22px; left: 125px; font-size: 190%; font-style: italic; font-weight: bold;}
#wrap #mainContent #right .specialoffer .desc{position: absolute; top: 66px; left: 205px;}
#wrap #mainContent #right .specialoffer .proddetails{position: absolute; top: 22px; right: 10px; font-size: 150%; font-weight: bold; line-height: 28px; text-align: right;}
#wrap #mainContent #right .specialoffer .proddetails span{font-size: 130%;}
#wrap #mainContent #right .specialoffer a{color: #fff;}

#wrap #mainContent #right .split{float: left; width: 47%; margin: 0 5% 0 0;}

#wrap #mainContent #right .featuredprod{width: 100%; height: 200px; background: url(/img/bg-featuredprod.gif) #eaeced repeat-x top left; border: 1px #dbdbdb solid; font-size: 110%; line-height: 20px;}
#wrap #mainContent #right .featuredprod .packshot{float: left; margin: 15px 15px 0 7px;}
#wrap #mainContent #right .featuredprod .title{display: block; height: 45px; line-height: 50px; color: #fff; font-size: 105%; font-weight: bold; margin: 0 0 10px 0;}
#wrap #mainContent #right .featuredprod .price{font-weight: bold; font-size: 110%;}


/* == Text, Images, Links Etc.
----------------------------------------------------------------------------------------------------------------------*/

#wrap .btn, #wrap input.btn{display: inline-block; height: 28px; line-height: 28px; background: url(/img/bg-btn.gif) repeat-x top left; border: 1px #202f38 solid; border-width: 0 1px; margin: 10px 0; padding: 0 8px; color: #FFF; font-size: 8pt; text-decoration: none;}
.addtobasket, #wrap input.addtobasket{width: 105px; height: 27px; line-height: 26px; background: url(/img/btn-addtobasket.png) no-repeat top left; padding: 0; border: 0; text-align: center; color: #fff; font-weight: bold; font-size: 8pt;}
.btn a, .addtobasket a{color: #CFD3D4;}
.hometext{font-size: 120%; font-weight: bold; line-height: 19px;}
.quotes{background: url(/img/bg-quotes.gif) no-repeat bottom right; padding: 0 0 10px 0;}
img.endorsement{float: left; margin: 0 15px 15px 0; padding: 2px; border: 1px #ccc solid;}

.socialLinks{margin-left: 440px;}
.socialLinks img{margin-right: 5px;}

#wrap #teamBar span{margin:0 auto;}
#wrap #teamBar img{margin: 0 15px 0 0;}

/* == Form Styles
----------------------------------------------------------------------------------------------------------------------*/
#wrap div.search{float: right; width: 285px; display: inline; margin-left: 0; margin-top: -6px;}
#wrap div.searchinner{margin: 10px 0 0 0; float: right; }
#wrap .search fieldset{border: 0; padding: 0; }
#wrap .search fieldset label{float: left; color: #fff; margin-top: 1px; font-weight: bold;}
#wrap .search fieldset input{float: left;  width: 175px; background: #fff; color: #333;height:12px; border: 1px #5f9bb9 solid; padding: 4px; margin: 0;}
#wrap .search fieldset input.submit{float: left; width: 33px; height: 22px; color: #fff;padding-top:2px; font-weight: bold; border: 0; margin: 0 0 0 5px; border: 1px #5f9bb9 solid; background-color: #ff6600}

#wrap #mainContent #right .contactform h3{padding:15px 15px 0;margin:0;font-size:130%;}
#wrap #mainContent #right .contactform fieldset{border:none; padding: 0 15px;}
#wrap #mainContent #right .contactform legend{background: #aaa; border: 1px #ccc solid; padding: 2px 5px; color: #fff;}
#wrap #mainContent #right .contactform fieldset label{float: left; width: 120px;}
#wrap #mainContent #right .contactform fieldset input{float: left; width: 220px;}
#wrap #mainContent #right .contactform fieldset input.addtobasket{float: left; width:105px}

#wrap #mainContent #right .contactform fieldset textarea{float: left; width: 300px; height: 130px;width:300px;color:#999;}
#wrap #mainContent #right .contactform fieldset .checkbox input{width: 14px; margin: 10px 0 0 0; border: 0;}
#wrap #mainContent #right .contactform fieldset .submit{width: 70px; border: 1px #666 solid; background-color: #30464E; color: #fff; font-size: 90%; font-weight: bold; font-family: 'Trebuchet MS';}
#wrap #mainContent #right .contactform fieldset div.err, 
#wrap #mainContent #right .contactform fieldset div.info{background: #f3f3f3; margin: 0 0 15px 0; padding: 10px; font-size: 90%; color: #ec2e76; font-weight: bold;}
#wrap #mainContent #right .contactform fieldset div.info{color: #25d580;}


/* == Paging Styles
------------------------------------------------- */

#wrap #mainContent .paging{float: right; padding: 8px 0 0 0; margin: 0;}
#wrap #mainContent .paging .text{ float:left; margin-right: 15px; margin: 5px 0 0 0; padding: 0 10px 0 0; font-weight: bold;}
#wrap #mainContent .paging .pg{ float:left;}
#wrap #mainContent .paging .pg ul{float:left; text-align:right; list-style: none; margin: 0;}
#wrap #mainContent .paging .pg ul li{float:left; list-style: none;}
#wrap #mainContent .paging .pg ul li.det{padding: 2px 4px 2px 0;}
#wrap #mainContent .paging .pg ul li a{float:left; text-align:center; padding: 1px 0; margin: 0 1px; background-color: transparent; width:  18px; color: #30464E; text-decoration:none; font-weight:bold;}
#wrap #mainContent .paging .pg ul li a:hover,
#wrap #mainContent .paging .pg ul li a.on{background-color: #30464E; color:#fff !important; text-decoration:none !important;}
#wrap #mainContent .paging .pg ul li a:hover{background-color: #536a73;}
#wrap #mainContent .orderList, .orderList table, .orderList tr, .orderList th, .orderList td {border: none;}


/* == News List Styles
------------------------------------------------- */
#wrap #mainContent #newslist{}
#wrap #mainContent #newslist div.newsitem{float:left; padding:5px; width:96%; margin-bottom:0px;}
#wrap #mainContent #newslist h2{margin: 5px 0; padding: 0;}
#wrap #mainContent #newslist img{margin: 0;}
#wrap #mainContent #newslist .newdate, #wrap #mainContent #newslist .more{background: url(/img/icon-date.gif) no-repeat 0 0; margin: 0; padding: 1px 0 0 20px; color: #999; font-size: 90%;}
#wrap #mainContent #newslist .more{float: right; background: url(/img/icon-newsmore.gif) no-repeat top left; margin: 0 0 10px 0; padding: 0 0 0 18px; font-size: 85%;}
#wrap #mainContent #newslist .newdate{}


/* == News Item Styles
------------------------------------------------- */
#wrap #mainContent #newsItem h2{margin: 5px 0 3px 0; padding: 0;}
#wrap #mainContent #newsItem img {margin: 10px;}
#wrap #mainContent #newsItem .newdate{background: url(/img/icon-date.gif) no-repeat top left; margin: 0; padding: 0 0 0 18px; color: #999; font-size: 90%;}


/*= Product Listing
------------------------------------------------- */

#wrap #mainContent .prodlisting .prod{width: 595px; border-bottom: 1px #cbd3cb solid; margin: 0 0 12px 0;}
#wrap #mainContent .prodlisting .prod .img{float: left; display: inline; width: 110px; text-align: center; margin-bottom:10px;}
#wrap #mainContent .prodlisting .prod .img img{padding: 2px; border: 1px #cbd3cb solid;}
#wrap #mainContent .prodlisting .prod .details{float: left; display: inline; width: 320px; margin: 0 20px;}
#wrap #mainContent .prodlisting .prod .details h3{margin: 0;}
#wrap #mainContent .prodlisting .prod .details p{font-size: 90%; line-height: 14px;}
#wrap #mainContent .prodlisting .prod .btn{float: left; display: inline; width: 75px; margin: 18px 0 0 0;}
#wrap #mainContent .prodlisting .prod .buy{float: left; display: inline; width: 120px; margin: 0 0 0 0;}
#wrap #mainContent .prodlisting .prod .buy span.price{font-size: 140%; color: #c6270d; font-weight: bold;}
#wrap #mainContent .prodlisting .prod .buy span.price b{font-size: 60%; font-weight: normal;}
#wrap #mainContent .prodlisting .prod .buy .addtobasket{margin: 5px 0 0 0;}
#wrap #mainContent .prodlisting .prod .more{float: left; background: url(/img/icon-newsmore.gif) no-repeat top left; margin: 0 0 10px 0; padding: 0 0 0 18px; font-size: 100%;}


/* == Checkout Styles
------------------------------------------------- */
#wrap #mainContent #checkout{position: relative;}
#wrap #mainContent #checkout input.alt {margin-right:15px; float:right; }
#wrap #mainContent #checkout .promo {background-color:#eee; padding: 0 15px 15px 15px; border: 1px #ccc solid; border-width: 1px;}
#wrap #mainContent #checkout .promo fieldset .submit{float:left; display:inline; margin: 1px 0 0 10px; background: #911821; border: 1px #333 solid; color: #fff; height: 22px; font-size: 90%; padding: 0 5px;}
#wrap #mainContent #checkout .promo fieldset .inputMedium { float:left; margin-left:10px;}
#wrap #mainContent #checkout .promo fieldset label { float:left; display:inline; }
#wrap #mainContent #checkout .promo fieldset input.addtobasket { margin:0 0 0 10px;}

#wrap #mainContent #checkout img {margin:5px; float:left;}
#wrap #mainContent #checkout h2, #wrap #mainContent #checkout h3{border: 0;}
#wrap #mainContent #checkout fieldset{border: 0;}

#wrap #mainContent #checkout fieldset.checkout{}
#wrap #mainContent #checkout fieldset.checkout label{width: 100px; margin: 3px 10px 3px 0;}
#wrap #mainContent #checkout fieldset.checkout input{width: 140px; margin: 4px 0;}
#wrap #mainContent #checkout fieldset.checkout select{width: 146px; margin: 4px 0;}
#wrap #mainContent #checkout fieldset.checkout ul.mandatory li{list-style: none; font-weight: bold; font-size: 90%;}


/* == Quick Basket Styles
------------------------------------------------- */

#wrap #mainContent #checkout .quickbasket{float: left; width: 210px;padding: 10px 10px 0 10px;border: dashed 2px #8ab4ca;}
#wrap #mainContent #checkout .quickbasket p{margin-top: 3px;}
#wrap #mainContent #checkout .quickbasket ul{list-style-image: url(/_img/bullet-yellow.gif)}
#wrap #mainContent #checkout .quickbasket ul li a{text-decoration: none;font-size: 90%; font-weight: bold;}


/* == Error / Confirmation Styles
------------------------------------------------- */

#wrap #mainContent #right #checkout .checkout .err, #wrap #mainContent #right #checkout .checkout .info{background: #eee url(/img/warning.gif) no-repeat scroll 5px center; border: 1px solid #EC2E76; color: #EC2E76; font-weight:bold; margin: 10px 0; padding: 30px 0 30px 70px;}
#wrap #mainContent #right #checkout .checkout .info{background: #eee url(/img/success.gif) no-repeat scroll 5px center; border: 1px solid #25d580; color: #25d580;}
#wrap #mainContent #right #checkout .checkout .info li, #wrap #mainContent #right #checkout .err li {list-style-image:none; list-style-type:none;}


/* == Foot Content
----------------------------------------------------------------------------------------------------------------------*/

#wrap #foot a{color: #d0dbe3; margin: 0 2px; text-decoration: none; }
#wrap #foot a:hover{text-decoration: underline;}

/* == Product 
----------------------------------------------------------------------------------------------------------------------*/
#wrap .productfeature {}
#wrap .productfeature img { float:left; padding:2px; border:1px solid #CCC;margin:0 20px 0 0;}
#wrap .productfeature .details {float:left; width:auto; max-width:375px;}
#wrap .productfeature .details h2 {margin:0 0 5px 0;}
#wrap .productfeature .details .price {color:#C6270D; font-size:140%;font-weight:bold; margin-right:10px;}
#wrap .productfeature .details .instock {font-size:140%;font-weight:bold; margin-right:10px;}
#wrap .productfeature .details .stockOpt  {font-size:120%;font-weight:bold; margin-right:10px;  color:#C6270D;}
#wrap .productfeature .details span {float:left;color:#999999;font-size:90%;}
#wrap .productfeature .prod .details {float:left; margin-right:40px;}

/* == Basket
----------------------------------------------------------------------------------------------------------------------*/
#wrap #checkout img {padding:2px; border:solid 1px #CCC;}
#wrap #checkout .more {float: left; background: url(/img/icon-newsmore.gif) no-repeat top left; margin: 3px 0 10px 0; padding: 0 0 0 18px; font-size: 100%;}

/* == Gallery
----------------------------------------------------------------------------------------------------------------------*/
#wrap .gallery .caption{display: block; width: 600px; text-align: center; font-style: italic; text-transform: capitalize;}
#wrap .gallery ul{list-style: none; width: 600px; margin: 0 auto;}
#wrap .gallery ul li{float: left; display: inline; width: 80px; height: 80px; overflow: hidden; margin: 0 9px 10px 8px; border: 1px #666 solid;}
#wrap .gallery ul.four{margin: 0 0 0 81px;}
#wrap .gallery ul.four li{margin: 0 14px 10px 14px;}
#wrap .gallery ul.five li{margin: 0 18px 10px 19px;}
#wrap .gallery ul.seven li{margin: 0 1px 10px 2px;}
#wrap .gallery ul li a{display: none;}
#wrap .gallery ul li div{position:absolute;display:none;top:0;left:180px}
#wrap .gallery ul li div img{cursor:pointer}
#wrap .gallery ul li.active div img, #wrap .leftCol .gallery ul li.active div{display:block}
#wrap .gallery ul li img.thumb{cursor:pointer;top:auto;left:auto;display:block;width:auto;height:auto}
#wrap .gallery ul li .caption{display:block;padding-top:.5em;}
* html #wrap .leftCol .gallery ul li div span{width: 600px} /* MSIE bug */

#wrap .gallery .main_image{width: 600px; height: 450px; background: #000; margin: 0;}
#wrap .gallery .main_image img{margin-bottom: 5px; border: 1px #666 solid; background: #000;}
#wrap .galleria_wrapper img {margin-left:35px;}
#wrap .galleria_container {padding: 30px 0 30px 0; margin-left:10px; margin-top:5px; width:575px;}
#wrap .galleria_container img {border:1px solid #CCC; padding: 2px;}

/* == Ambassadors Gallery
----------------------------------------------------------------------------------------------------------------------*/

#wrap .ambassadors ul.thumb{margin:0;list-style:none;}
#wrap .ambassadors ul.thumb li {position: relative;background:#000;float:left;height:165px;margin:0;padding:0;width:218px;}
#wrap .ambassadors ul.thumb li img{float:left;margin:0;-ms-interpolation-mode: bicubic;position:absolute;top:0;left:0;}
#wrap .ambassadors ul.thumb li img.hover{-moz-box-shadow:0px 0px 5px 3px #59809E;border:1px solid #59809E;}
#wrap .ambassadors ul{margin:0;list-style:none;}
#wrap .ambassadors li{float:left;height:65px;margin:0;padding:95px 20px 5px;width:178px;background:#000;font-size:85%;}
#wrap .ambassadors li h5{border:none;margin-bottom:0px;}
#wrap .ambassadors li h5 a{color:#fff;font-size:145%;font-weight:bold;text-decoration:none; }
#wrap .ambassadors li h5 a:hover{text-decoration:underline;}
#wrap .bio img{float:left; margin-right:20px;margin-bottom:20px;}


/* == PAS Teams Gallery
----------------------------------------------------------------------------------------------------------------------*/
#wrap .teams img{float:left;margin:0;}
#wrap .teams ul.thumb{margin:0;list-style:none;}
#wrap .teams ul.thumb li { -moz-border-radius:4px;position: relative;background:#fff;border:1px solid #666;float:left;height:175px;margin:5px;padding:7px;width:190px;}
#wrap .teams ul.thumb li img{float:left;margin:0;-ms-interpolation-mode: bicubic;position:absolute;top:0;left:0;}
#wrap .teams ul.thumb li img.hover{-moz-box-shadow:0px 0px 5px 3px #59809E;border:1px solid #59809E;}

/* == Staff
----------------------------------------------------------------------------------------------------------------------*/
#wrap .staff img{float:left; margin-right:15px;}
#wrap .staff .staffHolder{float:left;margin-bottom:15px;padding:0 10px;width:440px;border: 1px #568ba6 solid; border-width:1px; -moz-border-radius:7px;}