/*

Theme Name: Coconut Tree

Author: Synchromedia Group

Author URI: http://www.smg.com.au



*/



/* =Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html

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



.woocommerce div.product{ position: inherit !important;  }

img{ border: 0px;     max-width: 100%;

    height: auto;}

a{ color: #f59560;  text-decoration: none; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out;}

a:hover{  color: #00AA8D; text-decoration: underline;}

body{ margin: 0px; padding: 0px; font: 16px/25px 'Open Sans';color: #231f20; background: url(images/back.png); }

input[type="text"], input[type="email"],textarea, select { font: 15px/24px 'Open Sans'; padding: 4px; width: 96%; border: 1px solid #CCC;}

input[type="submit"]{ padding: 10px 20px; background: #00AA8D; font-weight: 700;  font-size: 16px; color: #FFF;  border: 0px; font-family: inherit; }

input[type="submit"]:hover{ background: #231F20; cursor: pointer;  }

h1,h2,h3,h4,h5,p,form,blockquote{ 	margin: 0px; padding: 0px;		margin-bottom: 20px;}

h1{ font-size: 26px; font-weight: 400; line-height: 30px; text-transform: uppercase;  color: #00a98d;}

h1 .smaller{ font-size: 20px; }

.home .entry-content h2 { font-size: 27px; }

h2{ font-size: 17px; line-height: 35px; font-weight: 700;   text-transform: uppercase;}

h3{ font-size: 14px; line-height: 25px; font-weight: 700; color: #f59560; text-transform: uppercase;  }

h4{ font-size: 14px; line-height: 25px; font-weight: 700; color: #231f20; text-transform: uppercase; margin-bottom: 10px;  }

.home h2 a{ color: #231f20;  }

blockquote{ font-size: 25px; line-height: 30px; margin-left: 30px; }

p{ }

#cart{ float: right; font-weight: 700; right: 0px; margin-right: 12px; margin-top: 30px; color: #FFF;}

#cart a{ color: #FFF;}

#coconuttrees{ height: 350px; background: url(images/coconut-trees.jpg) no-repeat center; 

  -webkit-background-size: cover;

  -moz-background-size: cover;

  -o-background-size: cover;

  background-size: cover; display:none; }



#coconut{  font-size: 25px; font-weight: 400; clear: both; font-style: italic;}

.alignleft{ float: left; margin-right: 30px; margin-bottom: 30px; }

.alignright{ float: right; margin-left: 30px; margin-bottom: 30px }

.aligncenter{ text-align:center;}

#header .wrapper{ width: 1200px; }

.wrapper{ margin: 0px auto; width: 900px;}

.wrap{ margin: 0px auto; width: 900px; }

#colours{ background: url(images/borderheader.png); height: 5px;}



.home #contentArea .wrapper{ width: 900px; }



.wp-image-166{ max-width: 100%; height: auto; }

#banner p{ margin: 0px; padding: 0px; }

#banner img{ display: block; }

.freedelivery{ position: absolute; z-index: 999; right: 0px; }



hr{ border: 0px; border-bottom: 3px solid #f59560;  margin: 0px; padding: 0px; margin-top: 20px; margin-bottom: 20px; }

.page-id-606 hr{ border-bottom: 3px solid #00a98d;; }

#banner{ background: url(images/bannerback.png); }



.woocommerce #contentArea .wrapper, .blog #contentArea .wrapper{ width: 900px; }

td{ padding: 3px;}

#header{ background: #FFF; height: 165px; overflow: hidden;}

.home .free{ float: left;
    line-height: 40px;
    font-size: 13px;
    padding-right: 20px; display: block;}
    .free{ display: none;  }

#rightHeader{ float: left; }

#footer h2{ margin-bottom: 5px;  }

#footer{ background: #00a98d; color: #FFF; min-height: 200px; padding: 30px; }

#footer ul { margin: 0px; padding: 0px; margin-right:60px; margin-bottom: 30px;}

#footer ul li{ list-style: none; }

#footer ul li a{ font-size: 15px; color: #FFF; text-decoration: none; text-transform: uppercase;  margin-bottom: 5px; }

#footer ul li a:hover{ background: #231f20; }

#logo{ float:left;  }

#menu{ padding-top:65px; display: block; }

#menu ul{ margin: 0px; padding: 0px;  }

#menu ul li{ list-style: none; display: inline-block;  }

#menu ul li a{  display: block;  padding: 0px 8px; color: #231f20; font-size: 14px; font-weight: 400; line-height: 60px; text-transform: uppercase; text-decoration: none; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }

 

#menu ul li.current-menu-item a{ color: #00AA8D; font-weight: 700; }

#menu ul li a:hover{ background: #00AA8D; color: #FFF; }  

#menu ul.sub-menu{ display: none; }



#menu ul li ul.sub-menu								{ position:absolute; margin:0; padding:0; background:#00AA8D; display:none; z-index:9999999999; overflow:hidden; border:none;}

#menu ul li ul.sub-menu li							{ display:block; margin:0; padding:0; width:150px;}

#menu ul li ul.sub-menu li a							{ margin:0; padding:0 20px; font-size:14px; font-weight:normal; border:none; line-height:40px; display:block; border-radius: 0px; color: #FFF; }

#menu ul li ul.sub-menu li a:hover,

#menu ul li ul.sub-menu li.current-menu-item a		{ background-color:#231f20; color:#fff;  border-radius: 0px; }



.homeLeft{ width: 30%; float: left; }

.homeRight{ width: 70%; float: left;}



#slides{ position: absolute; margin-left: 389px; margin-top: 15px; width: 571px; height: 158px; overflow:hidden; }

.circles:after, #contentArea:after, .entry-content:after {

    content:'';

    display:block;

    clear: both;

}

.woocommerce div.product .woocommerce-tabs ul.tabs li, .woocommerce #content div.product .woocommerce-tabs ul.tabs li, .woocommerce-page div.product .woocommerce-tabs ul.tabs li, .woocommerce-page #content div.product .woocommerce-tabs ul.tabs li{ -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out;  }

a.skin{ background: url(images/coconut-tree-categories_02.png) no-repeat; background-size: contain; width: 30%; margin-right: 5%; height: 300px; display: inline-block; float: left; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out;}

a.hair{ background: url(images/coconut-tree-categories_04.png) no-repeat; background-size: contain; width: 30%; margin-right: 5%; height: 300px; display: inline-block; float: left; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out;}

a.kids{ background: url(images/coconut-tree-categories_06.png) no-repeat; background-size: contain; width: 30%; height: 300px; display: inline-block;  float: left; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out;}



.home a.skin, .page-id-388 a.skin{ float: none; width: 100%; margin-right: 0px;  }

.home a.hair, .page-id-388 a.hair{ float: none; width: 100%;  margin-right: 0px; }

.home a.kids, .page-id-388 a.kids{ float: none; width: 100%;  margin-right: 0px; }





.home #content img{ margin: 0px;}

.home .ezcol-one-third{  }



#footer .wrapper{ padding: 30px; width: 1140px; }



a.thumbnail-wrapper{ box-shadow: 0 1px 5px 0 rgba(0,0,0,0.3);

-webkit-box-shadow: 0 1px 5px 0 rgba(0,0,0,0.3); float: left;margin-right: 30px; margin-bottom: 30px; width:150px; height: 150px;  display: block; overflow:hidden; }

a.thumbnail-wrapper img{ width: auto; height: 100%; }





.blog .post{ clear:both; }



.leftCol{ width: 45%; margin-right: 10%; float: left; }

.rightCol{ width: 45%; float: left;}







#contentArea{ min-height: 600px; background: url(images/coconut-tree-leaves.png) center top no-repeat; }

#content{ padding-top: 15px; }

#content img{ margin-bottom: 15px; }

.footMenu{  float: left; }

#mailing{ float: right; }

#mailing input[type="text"]{ padding: 4px; -webkit-appearance: none;}

#mailing input[type="submit"]{ background: #f59560; color: #FFF; border: 0px; padding: 4px 15px;-webkit-appearance: none; }

.rslides {

  position: relative;

  list-style: none;

  overflow: hidden;

  width: 100%;

  padding: 0;

  margin: 0;

  }



.rslides li {

  -webkit-backface-visibility: hidden;

  position: absolute;

  display: none;

  width: 100%;

  left: 0;

  top: 0;

  }



.rslides li:first-child {

  position: relative;

  display: block;

  float: left;

  }



.rslides img {

  display: block;

  height: auto;

  float: left;

  width: 100%;

  border: 0;

  }

  .social a img{ margin-right: 15px; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }

 .social a:hover img{ opacity: 0.8; }

	



#content{ background: #FFF; padding: 30px; }

#content{ }





.woocommerce div.product div.images img, .woocommerce #content div.product div.images img, .woocommerce-page div.product div.images img, .woocommerce-page #content div.product div.images img{   }

.woocommerce .related ul li.product, .woocommerce .related ul.products li.product, .woocommerce .upsells.products ul li.product, .woocommerce .upsells.products ul.products li.product, .woocommerce-page .related ul li.product, .woocommerce-page .related ul.products li.product, .woocommerce-page .upsells.products ul li.product, .woocommerce-page .upsells.products ul.products li.product{ width: 20% !important; }

.woocommerce .related ul li.product img, .woocommerce .related ul.products li.product img, .woocommerce .upsells.products ul li.product img, .woocommerce .upsells.products ul.products li.product img, .woocommerce-page .related ul li.product img, .woocommerce-page .related ul.products li.product img, .woocommerce-page .upsells.products ul li.product img, .woocommerce-page .upsells.products ul.products li.product img{  }

.woocommerce ul.products li.product a img, .woocommerce-page ul.products li.product a img{  }

.woocommerce ul.products li.product a:hover img, .woocommerce-page ul.products li.product a:hover img{    -moz-box-sizing:    border-box;

   -webkit-box-sizing: border-box;

   box-sizing:         border-box;box-shadow: 0 1px 15px rgba(0,0,0,0.3);

-webkit-box-shadow: 0 1px 15px rgba(0,0,0,0.3);}

.woocommerce ul.products li.product h3, .woocommerce-page ul.products li.product h3{  font-size: 18px; font-weight: 900; line-height: 22px; text-transform: inherit; }

.woocommerce .woocommerce-result-count, .woocommerce-page .woocommerce-result-count{ display: none;}

.woocommerce .woocommerce-ordering, .woocommerce-page .woocommerce-ordering{ display: none; }

.product_meta {

   display: none;

}

.signature{ font: 30px/44px 'Yellowtail'; color: #333;}







#header #social{ position: relative; float: right; z-index: 999999; margin-top: -110px;  }

#footer #social{ float: right; }

.woocommerce div.product p.price, .woocommerce div.product span.price, .woocommerce ul.products li.product .price{ color: #231f20 !important; font-weight: 700 !important; }



.related{ clear:both; }



.cycloneslider-template-standard .cycloneslider-slides{  }

.cycloneslider-template-standard{ margin-bottom: 0px !important; }

.cycloneslider-template-standard .cycloneslider-caption{ bottom: inherit !important; top: 0%; opacity: 1 !important; text-align: center !important; background: none !important;  color: #777 !important;   }

.cycloneslider-template-standard .cycloneslider-caption-title{ font-size: 30px !important;  }

#cycloneslider-home-image-slideshow-1{ margin-bottom: 0px !important; }

.yith_magnifier_zoom_magnifier{ border-radius: 50em !important;}



.mc4wp-form{ margin: 0px !important; }



.btn{ display: none; }

#specialoffer{ text-align:center; }

#specialoffer h1{ margin-bottom: 0px; line-height: 60px; }

#shoponline{ position: absolute; right: 30px; margin-top: -30px; z-index: 999999; }



.page-id-425 .entry-content img{ margin-right: 30px; margin-bottom: 30px;}



.woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt{   background: #00AA8D !important; }



#content:after {

    content: '';

    display: block;

    clear: both;

}



#black-studio-tinymce-6{ font-size: 13px; }

/* Accordion Styles */

.accordion {



    margin-bottom: 20px;

    clear:both;

}

.accordion-title {

  background: #000;

  color: #FFF;

    margin: 0;

    padding: 10px 15px;

    padding-right: 60px;

    cursor: pointer;

}

.accordion-title:hover {  color: #231f20;   cursor: pointer; }

.accordion-title:first-child {border: none;}

.accordion-title.open {cursor: default; background: url(images/morehide.png) right center no-repeat #16A388; margin-bottom: 10px;}

.accordion-title {cursor: default; background: url(images/moreshow.png) right center no-repeat #16A388; margin-bottom: 10px;}

.accordion-content {padding-bottom: 20px;}

#wcj_widget_multicurrency-3{ float: right; padding-right: 30px; padding-top: 30px; }



.mainhead{ width: 55%; }



@media only screen and (max-width: 1200px) {

.wrapper{ width: auto; }

#content{ padding: 10px; }

#footer .wrapper, #header .wrapper{ width: auto; }

#header #social{ position: absolute; right: 30px; top: 10px; margin: 0px; }

#menu{ float: none;  padding-top: 65px; }

#menu ul li a{	padding: 0px 8px; font-size: 14px; }

  #menu ul li a{ text-align: center;  line-height: 40px;}

}

@media only screen and (max-width: 1028px) {





	#menu ul{ float: none; }



#menu ul li ul.sub-menu li a							{ display:block; margin:0; padding:0; width:auto;}





}

@media only screen and (max-width: 960px) {

.woocommerce #contentArea .wrapper, .blog #contentArea .wrapper{ width: auto; }

	body{ -webkit-text-size-adjust: 100%;	}

    img{ max-width: 100%;  height: auto;}

.wrapper{ width: auto; }

#shoponline{ right: 15px; }

#shoponline img{ height: 80px; width: auto; }

.home #contentArea .wrapper{ width: auto; }

	

#slides{ position: relative; width: auto; float: left; margin-left: 0px;}

#content{ padding: 10px; }



#coconuttrees{ height: 200px !important;}



}

@media only screen and (max-width: 900px) {

.wrap{ width: auto; }

}



@media only screen and (max-width: 820px) {

  .mainhead{ width: auto; }

  #header #social{ right: 80px; }

      #logo{ width: auto; height: auto; float: none;     margin-left: 10px;}

  #logo img{ width: 60%; max-width: 205px; height: auto; }

#menu{ display: none;     padding-top: 35px; }

#menu ul li a{ padding: 0px 15px; }

.btn{ display: block; }

.btn { 

    position: relative;         

   top: 15px;

   right: 5px;

   float: right;

  padding: 10px;

    border-radius: 2px; 

    height: 36px; 

    width:36px;  

}

#lines:before { 

    border-bottom: 17px double #f59560;

    border-top: 6px solid #f59560;    

    content:"";

    height: 5px; 

    position: absolute; 

  

    width:36px; 

}

.btn:hover{ 

  cursor: pointer;

  }

  #header{ height: auto; }



  #slides{ position: relative; width: auto; height: auto; float: none; margin-left: 0px;}

    .clear{ clear:both; }

    #contentArea{ min-height: 300px; }

.leftCol{ width: auto; float: none;}

.rightCol{ width: auto; float: none;}



.homeLeft{ width: auto; }

.homeRight{ width: auto; }



  body{ font-size: 13px; line-height: 20px; }



  #content{ float: none; }

  #content div{ margin: 0px; padding: 0px; }



  .home #content img{ margin: 0px; }



  .footMenu{  float:none; }

  #footer{ padding: 10px; }

  #footer a{ color: #FFF;}

#footer h2{ text-align: center; }

  h1{ font-size: 24px; line-height: 30px; }

  h2{ font-size: 20px; line-height: 24px; }

  

  #mailing{ float: none; text-align: center; }

  #footer ul{ margin-bottom: 15px;  margin-right: 0px; }

  #footer ul li a { display: block; text-align: center; line-height: 30px; }

  .social img{ width: auto; height: auto; } 



}

@media only screen and (max-width: 630px) {


    .home .free{ display: none; }



#header #social{ right: 65px; }






}

@media only screen and (max-width: 374px) {
#header #social{ display: none; }
}