@import url('shop.css');
@charset "utf-8";
/* RED FUSION CSS*/
html.authed body { padding-top: 100px; }

@import url('http://fonts.orcas.co.nz/Font/Gibson-light.css');
@import url('http://fonts.orcas.co.nz/Font/Gibson.css');
@import url('http://fonts.orcas.co.nz/Font/Avenir 45 Book.css');
@import url('http://fonts.orcas.co.nz/Font/Avenir 65 Medium.css');

/*----- font-family: 'Gibson-light'; 'Gibson'; 'Avenir 45 Book'; 'Avenir 65 Medium'; ----*/


html, body { padding: 0; margin: 0; color: #333;  font-family: Arial, Helvetica, sans-serif; }

h1 { font-family:'Gibson', Arial, Helvetica, sans-serif; font-weight: 600; font-size: 22px; line-height: 25px; text-transform: uppercase; letter-spacing: 1px; color: #000;}
h2 { font-family:'Gibson', Arial, Helvetica, sans-serif; font-weight: 600; font-size: 18px; line-height: 22px; text-transform: uppercase; letter-spacing: 1px; color: #f60000;}
p { font-size: 15px; line-height: 18px; color: #333;}
a { color:#FE0F00; text-decoration: none; font-size: 15px; line-height: 18px;}
a:hover { text-decoration: underline;}

li { font-size: 15px; line-height: 18px; color: #333;}
a img { border: none;}

.footer-h1 { font-family:'Gibson', Arial, Helvetica, sans-serif; font-size: 16px; line-height: 25px; text-transform: uppercase; letter-spacing: 1px; color: #fff; border-bottom: solid 1px #ccc;}
.footer-text {  font-size: 15px; line-height: 18px; color: #999;}
.footer-text a { color:#999; text-decoration: none;font-size: 15px; line-height: 18px;}
.footer-text a:hover { color: #fff;}
 
 
#outer { border-top: solid 8px #FE0F00;}

#header { width: 1000px; margin: 30px auto; }

#logo { width: 191px ; height: 105px; float: left; background-image: url('../images/logo.jpg'); background-repeat: no-repeat;}
#main-menu { width: 710px; height: 70px; padding: 20px 0 0 0; float: right;}

ul#main { list-style: none; padding: 0; margin: 0; width: 710px; height: 70px;}
ul#main li { float: left; height: 70px; padding: 0;}
ul#main li a { height: 70px; background-image:url('../images/new-menu.jpg'); display: block; padding: 0;}
ul#main li a span { display: none;}

ul#main li#home a { width: 55px; background-position: 0 0;}
ul#main li#about-us a { width: 102px; background-position: -55px 0;}
ul#main li#services a { width: 102px; background-position: -157px 0;}
ul#main li#portfolio a { width: 102px; background-position: -259px 0;}
ul#main li#shop a { width: 102px; background-position: -361px 0;}
ul#main li#retailers a { width: 102px; background-position: -463px 0;}
ul#main li#faq a { width: 76px; background-position: -565px 0;}
ul#main li#contact a { width: 69px; background-position: -641px 0;}

ul#main li#home a:hover, ul#main li#home.sel a { background-position: 0 -70px;}
ul#main li#about-us a:hover, ul#main li#about-us.sel a { background-position: -55px -70px;}
ul#main li#services a:hover, ul#main li#services.sel a { background-position: -157px -70px;}
ul#main li#portfolio a:hover, ul#main li#portfolio.sel a { background-position: -259px -70px;}
ul#main li#shop a:hover, ul#main li#shop.sel a { background-position: -361px -70px;}
ul#main li#retailers a:hover, ul#main li#retailers.sel a { background-position: -463px -70px;}
ul#main li#faq a:hover, ul#main li#faq.sel a {background-position: -565px -70px;}
ul#main li#contact a:hover, ul#main li#contact.sel a { background-position: -641px -70px;}

#social-links { width: 90px; margin: 10px 0 20px 910px; height: 30px; }
ul#social { width: 90px; height: 30px; padding: 0; margin: 0;}
ul#social li { list-style: none; float: left; padding: 0; margin: 0; height: 30px;}
ul#social li a { text-decoration: none; display: block; background-image:url('../images/social-links.jpg'); padding: 0; height: 30px;}
ul#social li a span { display: none;}

ul#social li#facebook a { width: 31px; background-position: 0 0;}
ul#social li#google-plus a { width: 59px; background-position: -31px 0;}
ul#social li#facebook a:hover { width: 31px; height: 30px; background-position: 0 -30px;}
ul#social li#google-plus a:hover { width: 59px; height: 30px; background-position: -31px -30px;}

#second-menu #login a { width: auto; float: right; height: 20px; padding: 10px 20px; text-transform: uppercase; font-size: 12px; line-height: 20px; font-family: 'Gibson', Arial, sans-serif; color: #918C8C;letter-spacing: 1px; text-decoration: none; }
#second-menu #cart-icon a { color: #918C8C;letter-spacing: 1px; text-decoration: none;height: 20px; margin: 10px 0;text-transform: uppercase; border-left: solid 2px #918C8C;font-size: 12px; line-height: 20px; display: block; float: right; padding: 0 20px; font-family: 'Gibson', Arial, sans-serif; }
#second-menu #login a:hover {color:#FE0F00; }
#second-menu #cart-icon a:hover {color:#FE0F00; }

#second-menu { width: 1000px; height: 40px; margin: 0 0 20px 0; background-color: #F6F6F6;}

/*#second-menu #cart-icon a { width: 105px; float: right; height: 20px; background-image: url('../images/cart-icon.png'); background-repeat: no-repeat; background-position: 90px top; border-left: solid 2px #918C8C; display: block; text-decoration: none; color: #918C8C; font-size: 12px; letter-spacing: 1px; line-height: 20px; text-transform: uppercase; font-family: 'Gibson', Arial, Helvetica, sans-serif; padding: 0 15px; margin: 10px 0; opacity: 0.5;}
#second-menu #cart-icon a:hover { opacity: 1;}
*/
/* Shop Top Menu */
#second-menu ul.menu { width: auto; float: left; height: 40px; padding: 0 0 0 20px; margin: 0; list-style: none; }
#second-menu ul.menu li { float: left; padding-right: 25px; position: relative; }
#second-menu ul.menu li a { text-decoration: none; color: #918C8C; font-size: 12px; letter-spacing: 1px; line-height: 40px; text-transform: uppercase; font-family: 'Gibson', sans-serif; }
#second-menu ul.menu li a:hover, #second-menu ul.menu li.sel a { color:#FE0F00; } 
#second-menu ul.menu li ul { display: none; position: absolute; top: 40px; left: -11px; padding: 0; margin: 0; list-style: none; background-image: url('../images/bkgrd-opaque.png'); z-index: 50; border: solid 1px #ececec; box-shadow: 2px 2px 2px #ccc; }
#second-menu ul.menu li:hover ul { display: block; width: 170px; }
#second-menu ul.menu li:hover ul li { padding: 4px 10px; float: none; }
#second-menu ul.menu li ul li a { line-height: 16px; color: #918C8C; }
#second-menu ul.menu li.sel ul li a { color: #918C8C; }
#second-menu ul.menu li ul li a:hover { color:#FE0F00; }


#custom-menu { float: left; height: 40px; width: auto;}
#custom-menu ul.menu { height: 40px; margin: 0; padding: 0;}
#custom-menu ul.menu li { list-style: none; float: left; padding-right: 33px; }
#custom-menu ul.menu li a { text-decoration: none; color: #918C8C; font-size: 12px; letter-spacing: 1px; line-height: 40px; text-transform: uppercase; font-family: 'Gibson', sans-serif;}
#custom-menu ul.menu li a:hover, #custom-menu ul.menu li.sel a { color:#FE0F00; } 

/* Shop Side Menu */
#left-col-menu ul.menu { padding: 10px; margin: 0; list-style: none; }
#left-col-menu ul.menu li { }
#left-col-menu ul.menu li a { text-decoration: none; color: #555; }

#banner { width: 1000px; margin: 20px auto; }

/*#arrows { width: 92px; height: 44px; position: absolute; right: 10px; bottom: 0;}
#left a { width: 44px; height: 44px; background-color: #666; opacity: 0.8; color: #fff; font-size: 30px; line-height: 44px; text-align: center; margin-right: 4px; float: left; text-decoration: none;}
#right a { width: 44px; height: 44px; background-color: #666; opacity: 0.8; color: #fff; font-size: 30px; line-height: 44px; text-align: center; float: right; text-decoration: none;}

#left a:hover { background-color: #FE0F00;}
#right a:hover { background-color: #FE0F00;}*/


#content { width: 1000px; margin: 0 auto 30px auto; }
#content.laser-icon { background-image: url('../images/laser-icon-full.jpg'); background-repeat: no-repeat; background-position: left top; padding-top: 30px;}
#left-col { width: 440px;  float: left; padding-left: 20px;}
#square-home { float: right; width: 440px;padding-right: 20px;}

#breadcrumb { width: 1000px; margin: 20px auto; }
#left-col-menu { width: 230px; float: left; background-color: #ECECEC; }
#right-content { width: 750px; float: right; }


#showcase { width: 1000px; margin: 0 auto 20px auto; }


#footer { background-color: #444444; width: 100%; }
#footer-inner { width: 1000px; margin: auto; padding: 0;}

#footer-left { width: 320px; float: left; margin-right: 20px;}
#footer-middle { width: 320px; float: left;}
#footer-right { width: 320px; float: right;}

#footer-tagline { width: 1000px; clear: both; margin: auto; padding: 15px 0; height: 30px; line-height: 30px; text-align: center; background-image: url('../images/laser-icon-full-blk.png'); background-repeat: no-repeat; background-position: left top;}

.contact-form { width: 420px; padding: 10px 20px 40px 40px; background-color: #F0F3F6; background-image:url('../images/form-arrow.jpg'); background-repeat: no-repeat; background-position: left top; margin-bottom: 30px;}
.contact-form .field { width: 420px;  }
.contact-form .field .title { float:left; width: 130px; padding-top: 1px; font-family:'Avenir 65 Medium', sans-serif; font-size: 15px; line-height: 16px; color: #999; }
.contact-form .field .input { padding-left: 135px;  margin-top: 13px; }
.contact-form .field .input .date-day { width: 30px; margin-right: 10px;}
.contact-form .field .input .date-month { width: 100px;} 
.contact-form .field .input .date-year { width: 60px; margin-left: 10px;}
.contact-form .field .input input { height: 16px; width: 270px; background-color: #fff; border: none; color: #999; font-family: Arial, Helvetica, sans-serif;}
.contact-form .field .input select { width: 267px; border: none;}
.contact-form .field .input textarea { height: 50px; width: 267px; background-color: #fff; border: none; color: #999; font-family: Arial, Helvetica, sans-serif;}
.contact-form .submit { width: 420px; clear: left; height: 20px;}
.contact-form .submit input { margin: 10px 20px 20px 0;letter-spacing: 1px; padding: 2px 15px; text-align:center; float: right; font-family:'Avenir 65 Medium', sans-serif; font-weight: bold; font-size: 15px;color: #444444; background-color: #fff; border: none; height: 20px; line-height: 20px; text-transform: uppercase; clear: left;} 
.contact-form .submit input:hover { background-color:#FE0F00; color: #fff;}

/*FOOTER ENQUIRE FORM*/
#footer-right .contact-form { width: 330px; padding: 0; margin: 0; background-color: transparent; background-image: none;}
#footer-right .contact-form .field { width: 330px;  }
#footer-right .contact-form .field .title { float:left; width: 80px; padding-top: 1px; font-family:'Avenir 65 Medium', sans-serif; font-size: 15px; line-height: 16px; color: #999; }
#footer-right .contact-form .field .input { padding-left: 85px;  margin-top: 9px;}
#footer-right .contact-form .field .input input { height: 16px; width: 222px; background-color: #666; border: none; color: #fff; font-family: Arial, Helvetica, sans-serif;}
#footer-right .contact-form .field .input select { width: 222px; background-color: #666; border: none;}
#footer-right .contact-form .field .input textarea { height: 50px; width: 219px; background-color: #666; border: none; color: #fff; font-family: Arial, Helvetica, sans-serif;}
#footer-right .contact-form .submit { width:330px; height: 40px; clear: left;}
#footer-right .contact-form .submit input { margin: 10px 22px 0 0;letter-spacing: 1px; padding: 2px 15px; text-align:center; float: right; font-family:'Avenir 65 Medium', sans-serif; font-size: 15px;color: #444444; background-color: #fff; border: none; height: 20px; line-height: 20px; text-transform: uppercase; } 
#footer-right .contact-form .submit input:hover { background-color:#FE0F00; color: #fff;}
/* END FORM */


/*COLUMN LAYOUT*/
.layout-columns { width: 1000px; padding: 0; }
.layout-columns .grid-col .content-viewer { padding: 20px;}

.grid-col { float: left; display: inline; }

/* 1000 wide */
.layout-columns .col_1 { width: 1000px;}

.layout-columns .col_1_2 { width: 1000px;}
.layout-columns .col_1_2.alpha { width: 490px; margin-right: 10px; }
.layout-columns .col_1_2.omega { width: 490px;  margin-left: 10px;}

.layout-columns .col_1_3 { width: 230px;}
.layout-columns .col_1_3.alpha { width: 486px; margin-right: 26px;}
.layout-columns .col_1_3.omega { width: 230px; margin-left: 26px;}

.layout-columns .col_1_4 { width: 230px; margin-right: 26px;}
.layout-columns .col_1_4.alpha { width: 230px; }
.layout-columns .col_1_4.omega { width: 230px; margin: 0;}
.layout-columns .col_1_4 .content-viewer { width: 230px;}

.layout-columns.form .col_1 { width: 1000px; background-image:url('../images/laser-icon-full.jpg'); background-repeat: no-repeat; background-position: left top; padding-top: 35px;}
.layout-columns.form .col_1_2 { width: 1000px; }
.layout-columns.form .col_1_2.alpha .content-viewer {padding: 0 20px 20px 20px; }
.layout-columns.form .col_1_2.alpha { width: 470px; margin-right: 10px; }
.layout-columns.form .col_1_2.omega { width: 510px;  margin-left: 10px;}

.layout-columns.tight .col_1_3 { width: 240px;}
.layout-columns.tight .col_1_3.alpha { width: 486px; margin-right: 26px;}
.layout-columns.tight .col_1_3.omega { width: 240px; margin-left: 6px;}

.layout-columns.tight .col_1_4 { width: 240px; margin-right: 6px;}
.layout-columns.tight .col_1_4.alpha { width: 260px; }
.layout-columns.tight .col_1_4.omega { width: 240px; margin: 0;}
.layout-columns.tight .col_1_4 .content-viewer { width: 240px;}

/* #Clearing
================================================== */
/* Self Clearing Goodness */
.container:after {
  content: "\0020";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden; }

/* Use clearfix class on parent to clear nested columns,
or wrap each row of columns in a <div class="row"> */
.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
  content: '\0020';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0; }

.row:after,
.clearfix:after {
  clear: both; }

.row,
.clearfix {
  zoom: 1; }

/* You can also use a <br class="clear" /> to clear columns */
.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0; }



/*CUSTOM LIST VIEWERS*/
/*-------------------------------------------------------------*/
/*HOME SLIDER*/
#home-slider {width: 1000px; height: 300px;  position: relative; overflow: hidden; z-index: 5; padding: 0; margin: 0;}
#home-slider .item { position: absolute; left: 0; bottom: 0; }
#home-slider .item .info { position: absolute; right: 0; width: 300px; padding: 20px; margin-top:50px; background-image: url('../images/bkgrd-opaque.png'); background-repeat: repeat; color: #999999; line-height: 35px; text-transform: uppercase; font-size: 30px; font-weight: 400; font-family: 'Gibson', sans-serif; letter-spacing: 1px; }
/* end home slider */

/*HOME SECONDARY BANNERS THREEEES*/
.home-three { width: 1012px; margin-top: 12px;}
.home-three .item a { width: 325px; height: 120px; float: left; margin-right: 12px; position: relative;}
.home-three .item a .title { background-color: red; height: 24px; line-height: 24px; padding: 4px 15px; color: #fff; text-align: center; letter-spacing: 1px; text-transform: uppercase; font-size: 16px; display: block; position: absolute; left: 27%; top: 40%; font-family: 'Avenir 65 Medium', sans-serif; opacity: 0.75;}
.home-three .item a:hover .title {opacity: 1;}
/*THREE END*/


/*END*/
/*CUSTOM ITEM HOME CLIENT SQUARES*/
.home-squares { width: 493px; height: 105px; overflow: hidden; margin: 17px 0 5px 0;}
.home-squares .squares a {  width: 105px; height: 105px; float: left; margin: 0 7px 7px 0; opacity: 0.75;display: block; text-decoration: none; }
.home-squares .squares a:hover {opacity: 1;}

.footer-services { width: 997px; margin: 20px 0 0 0; height: 230px; overflow: hidden;}
.footer-services .heading { float: left; height: 44px; line-height: 44px; background-image:url('../images/footer-slider-top.jpg'); background-repeat: no-repeat; background-position: left top; padding-left: 65px; margin-bottom: 20px; width: 820px; font-family: 'Avenir 45 Book', sans-serif; text-transform: uppercase; letter-spacing: 1px; color: #000; font-size: 18px;}

.footer-services .navigation {  width: 93px; height: 44px; float: right; }
.footer-services .navigation a.prev { width: 44px; height: 44px; display: block; float: left; background-image:url('../images/arrow-back.jpg'); background-repeat: no-repeat;}
.footer-services .navigation a.next { width: 44px; height: 44px; display: block; float: right;background-image:url('../images/arrow-next.jpg'); background-repeat: no-repeat; }
.footer-services .navigation a span { display: none;}

.footer-services .navigation a.prev:hover { background-image:url('../images/arrow-back-hover.jpg');}
.footer-services .navigation a.next:hover {background-image:url('../images/arrow-next-hover.jpg'); }

.footer-services .services { clear: both; }
.footer-services .services .service {width: 105px; float: left; margin-right: 37px;}
.footer-services .services .service a { display: block; text-decoration: none;}
.footer-services .services .service a .title { text-decoration: none; color: #999; font-size: 13px; width: 105px;}
.footer-services .services .service a:hover .title { color: #333; text-decoration: none;}
.footer-services .services .service a .image { width: 105px; height: 105px; margin-bottom: 1px;}
.footer-services .services .service a .reflection { width: 105px; height: 105px; position: relative; display: block; z-index: 3; opacity: 0.5;}
.footer-services .services .service a .reflection .overlay { width: 105px; height: 105px; display: block; position: absolute; top: 0; left: 0; z-index: 50; background-image: url('../images/reflect-overlay-105.png'); background-repeat: no-repeat;}

.quotes-2-col { height:160px; margin: 20px 0;position: relative; width: 440px; background-color:#F1F4F7; background-image:url('../images/quote-home-bottom.png'); background-repeat: no-repeat; background-position: right bottom; padding-top: 10px;}
.quotes-2-col .q-top { position: absolute; top: 5px; left: 2px; width: 33px; height: 25px; background-image: url('../images/quote-top.png'); background-repeat: no-repeat;}
.quotes-2-col .quote { width: 400px; padding: 8px 2px 16px 10px; position: absolute; margin: 0 0 0 10px; background-image: url('../images/quote-bottom.png'); background-repeat: no-repeat; background-position: right bottom; }
.quotes-2-col .quote .text { font-family: Georgia, Serif; font-size: 24px; line-height: 29px; font-style: italic; padding-left: 35px; letter-spacing: 1px; color: #666; }
.quotes-2-col .quote .author { font-family: Georgia, Serif; font-size: 12px; line-height: 15px; margin: -3px 0 0 -21px; padding: 8px 0 0 29px; background-position: 9px 0; color:#666;}
.quotes-2-col .quote .author .person { }

/*what we do services list*/
.what-we-do { width: 1020px; margin: 20px 20px 20px 0;}
.what-we-do .item { float: left; overflow: hidden;}
.what-we-do .item a { width: 320px; margin: 0 20px 20px 0; float: left; display: block; }
.what-we-do .item a img { height: 120px; }
.what-we-do .item a .title { width: 300px; padding: 10px 20px 20px 0; color: #999; text-transform: uppercase; display: block; text-align: center; text-decoration: none;}
.what-we-do .item a:hover .title { color: #000; text-decoration: none;}
.what-we-do .item a:hover { text-decoration: none;}
/*-------------------------------------------------------------*/
/*END CUSTOM LIST VIEWERS*/

/*CUSTOM ITEMS*/
/*----------------------------------------------*/

/*GENERIC */
.slider { position: relative; overflow: hidden; z-index: 11; padding: 0; margin: 0;}
.slider .item { position: absolute; left: 0; top: 0; z-index: 15;}
.slider .navigation a.prev { width: 30px; height: 30px; background-image:url('../images/slider-left-button.png'); background-repeat: no-repeat; position: absolute; left: 0; top: 40%; z-index: 16; opacity: 0.4;}
.slider .navigation a.next { width: 30px; height: 30px; background-image:url('../images/slider-right-button.png'); background-repeat: no-repeat; position: absolute; right: 0; top: 40%; z-index: 16; opacity: 0.4;}

.slider .navigation a:hover.prev { opacity: 0.8;}
.slider .navigation a:hover.next { opacity: 0.8;}


/*SERVICES CUSTOM ITEM*/
.services-item { width: 490px; height: 340px; position: relative; margin-bottom: 40px; }
.services-item .items { width: 430px; height: 300px; position: absolute; left: 30px; top: 40px;}

/*portfolio previous*/
.forward-backward-nav { width: 1000px; height: 44px; margin: 20px 0; border-top: dotted 1px #ccc; padding-top: 20px;}
.forward-backward-nav a { display: block; height: 44px; padding: 15px 0; text-decoration: none; background-repeat: no-repeat; color: #999; text-transform: uppercase; font-family: 'Avenir 65 Medium', sans-serif; font-size: 13px; }
.forward-backward-nav a:hover { color: #f60000; }
.forward-backward-nav a.back { float: left; margin: 0; padding-left: 55px; background-image: url('../images/arrow-back.jpg'); background-position: left top; }
.forward-backward-nav a.forward { float: right; margin: 0; padding-right: 55px; background-image: url('../images/arrow-next.jpg'); background-position: right top; }
.forward-backward-nav a.back:hover { background-image: url('../images/arrow-back-hover.jpg'); }
.forward-backward-nav a.forward:hover { background-image: url('../images/arrow-next-hover.jpg'); }

 .faq-viewer .heading {font-family:'Gibson', sans-serif; font-weight: 600; font-size: 22px; line-height: 25px; text-transform: uppercase; letter-spacing: 1px; color: #000; background-image:url('../images/laser-icon-full.jpg'); background-repeat: no-repeat; background-position: left top; margin-bottom: 30px; padding: 25px 0 0 20px;}
.faq-viewer .toggler { display: block; padding: 0 20px; }
.faq-viewer .toggler-closed {  text-decoration: none;font-family: 'Avenir 65 Medium', sans-serif;  font-size: 14px; color: #000; line-height: 40px; }
.faq-viewer .toggler-opened {  font-family: 'Avenir 65 Medium', sans-serif; font-size: 14px; color: #000; text-decoration: none; line-height: 40px;}
.faq-viewer .answer p{ padding: 0 20px; color: #999; }
 
.gallery { width: 980px; height: 120px; margin: 20px 0 40px 15px; overflow: hidden; }
.gallery .image { width: 120px; height: 120px; float: left; margin-right: 20px;}

.portfolio-button a { height: 40px; width: 250px;color: #fff; padding: 0 30px; text-decoration: none; background-color: #ccc; margin: -20px 0 10px 0; text-align: center; text-transform:uppercase; font-size: 18px; letter-spacing: 1px; font-family: 'Avenir 65 Medium', Arial, sans-serif;display: block; line-height: 40px; }
.portfolio-button a:hover { background: #f60000;}