/*  
 *  DEVELOPER NOTES:
 *    
 *  I strongly recommend using a SASS compiler and editing the .scss files,
 *  but if you must code your styles in the traditional way, please...
 *  
 *  ### ONLY EDIT THIS STYLESHEET ###
 *  ### NEVER EDIT theme.css DIRECTLY ###
 *  
 *  shell.css is compiled from the .scss files, if you edit it directly,
 *  your changes will get overwritten the next time it is compiled.
 *  
 *  
 *  We are no longer using a separate stylesheet for media queries.
 *  Please use the following formatting:
 *  
 *  

/* Default Bootstrap Breakpoints

   @media (min-width: 480px) {}
   @media (min-width: 768px) {}
   @media (min-width: 992px) {}
   @media (min-width: 1200px) {}

   Design Mobile First, meaning your intial styles will be for phone viewports, 330px. 
   Followed by your media-queries for larger viewports. Example:

  .class {
    padding: .5em;
    font-size: 1em;
  }

  @media (min-width: 480px) { // Once the browser hits 480+:
    .class {
      font-size: 1.1em;
    }
  }

  @media (min-width: 768px) {  // Once the browser hits 768+:
    .class {
      font-size: 1.2em;
      padding: .65em .75em;
    }
  }

 */  
 
/*Global*/

hr { border: 0; height: 0; padding-bottom: 28px; background: url(../images/div.png) center bottom no-repeat; margin: 30px 0;}

h2 {color:#ac7631!important;}
h3 {color:#ac7631!important; font-size:26px;}
h4 {font-style:italic!important; font-size:18px!important;}

/*HISTORY*/

.history-pic-main { float:left; margin:0 1em 1em 0; width:100%; max-width:500px; display:block; height:auto!important; /*padding:3px; border:#722f13 1px solid; box-shadow: 5px 5px 5px #111;
-moz-box-shadow: 5px 5px 5px #111; -webkit-box-shadow: 5px 5px 5px #111;*/}
.history-pic { width:100%; max-width:400px; display:block; height:auto!important; /*padding:3px; border:#722f13 1px solid; box-shadow: 5px 5px 5px #111;
-moz-box-shadow: 5px 5px 5px #111; -webkit-box-shadow: 5px 5px 5px #111;*/}

#history-block-main {padding-bottom: 72px; background: url(../images/div.png) center bottom no-repeat; margin-bottom: 40px; overflow: hidden;}
#history-block { display:inline-block; margin-bottom:1em; width:60%;}

.history-date { font-family: Arial, Helvetica, sans-serif 'cabin'; font-size:2.5em; padding:10px; border:#722f13 1px solid; float:left; margin: 0 .5em .5em 0; color: #ccc; background: #000; box-shadow: 5px 5px 5px #111;
-moz-box-shadow: 5px 5px 5px #111; -webkit-box-shadow: 5px 5px 5px #111;}
.history-text {padding-left: 8em;}


@media only screen and (max-width: 1200px) {
  
.product-box { width: 100%; margin-bottom: 10%; height: 10%; padding: 2%; }
.product-box img { display: block; height: 40%;  }

}

@media only screen and (max-width: 640px) {
  
#history-block {width:100%;}
.history-pic {width: 85%; float:none;}
.history-date { text-align:center; float:none;}
.history-text {padding:0;}
#wood-types {border-bottom:0;}
.wood li {width:90%!important;}
.body li {width:90%!important;}
.distributor li {width:90%!important;}
.dating-pic {float:none!important; width:100%; max-width:400px!important;}

}

@media only screen and (max-width: 480px) {
  
  .product-box { text-align: center;  }
  .product-box img { text-align: center; float: none; margin: 0 auto; }
  .guitar-info { margin-left: 0px; }
  .dating-pic {float:none!important; width:100%; max-width:400px!important;}


}

/*CRAFTSMANSHIP*/

.craftsmanship-pic{ float:left; padding:3px; border:#722f13 1px solid; margin:0 1em 1em 0; width:100%; max-width:400px; display:block; height:auto!important;box-shadow: 5px 5px 5px #111;
-moz-box-shadow: 5px 5px 5px #111; -webkit-box-shadow: 5px 5px 5px #111;}

#craftsmanship-block-main,
#craftsmanship-block { padding-bottom: 72px; background: url(../images/div.png) center bottom no-repeat; margin-bottom: 40px; overflow: hidden;}

#craftsmanship-block-main:after,
#craftsmanship-block:after {content:""; clear: both; display: table;}

/*DESIGN FEATURES*/

.features-pic-left{ float:left; padding:3px; border:#722f13 1px solid; margin:0 1em 1em 0; width:100%; max-width:400px; display:block; height:auto!important;box-shadow: 5px 5px 5px #111;
-moz-box-shadow: 5px 5px 5px #111; -webkit-box-shadow: 5px 5px 5px #111;}
.features-pic-right{ float:right; padding:3px; border:#722f13 1px solid; margin:0 0 1em 1em; width:100%; max-width:400px; display:block; height:auto!important;box-shadow: 5px 5px 5px #111;
-moz-box-shadow: 5px 5px 5px #111; -webkit-box-shadow: 5px 5px 5px #111;}

#features-block-main,
#features-block { padding-bottom: 72px; background: url(../images/div.png) center bottom no-repeat; margin-bottom: 40px; overflow: hidden;}

#features-block-main:after,
#features-block:after {content:""; clear: both; display: table;}


/*WOOD TYPES*/

.wood-pic{ float:left; padding:3px; border:#722f13 1px solid; margin-bottom: 1em; width:100%; max-width:300px; display:block; height:auto!important;box-shadow: 5px 5px 5px #111;
-moz-box-shadow: 5px 5px 5px #111; -webkit-box-shadow: 5px 5px 5px #111;}

#wood-types {padding-bottom: 72px; background: url(../images/div.png) center bottom no-repeat; margin-bottom: 40px; overflow: hidden;}
.wood li {display: inline-block; list-style: none; margin-left: 1em; width: 22%; vertical-align: top;}

/*BODY TYPES*/

#body-types-main { padding-bottom: 72px; background: url(../images/div.png) center bottom no-repeat; margin-bottom: 40px; overflow: hidden;}

.body-pic { float:left; padding:3px; margin-bottom: 1em; width:100%; max-width:300px; display:block; height:auto!important; }

#body-types {padding-bottom: 72px; background: url(../images/div.png) center bottom no-repeat; margin-bottom: 40px; overflow: hidden;}

.body li {display: inline-block; list-style: none; margin-left: 1em; width: 22%; vertical-align: top;}
.body-btns {vertical-align:bottom; position:relative; bottom:0; display:inline-table;}

/*EVENTS*/

.coming-soon {padding:3px; border:#722f13 1px solid; margin-bottom: 1em; width:100%; max-width:1000px; display:block; height:auto!important;box-shadow: 5px 5px 5px #111;
-moz-box-shadow: 5px 5px 5px #111; -webkit-box-shadow: 5px 5px 5px #111;}

/*CARE & MAINTENANCE*/

.care-pic { float:right; padding:3px; border:#722f13 1px solid; margin:0 0 1em 1em; width:100%; max-width:500px; display:block; height:auto!important;box-shadow: 5px 5px 5px #111;
-moz-box-shadow: 5px 5px 5px #111; -webkit-box-shadow: 5px 5px 5px #111;}

/*DATING YOUR TAKAMINE*/

.dating-pic { float:left; padding:3px;  margin:0 1em 1em 0; width:100%; max-width:300px; display:block; height:auto!important;}

#dating-block {padding-bottom: 72px; background: url(../images/div.png) center bottom no-repeat; margin-bottom: 40px; overflow: hidden;}

/*NEWS*/

article.articles-block.clearfix {border-bottom: #722f13 1px dotted; margin-bottom: 1em;}
div.articles-date {font-size: 1em;font-weight: normal;color: #722f13;}
div.articles-body {margin-bottom: 1em;}

/*RSS*/

div.utility ul li {list-style:none; float: right; position: relative; top:-3.5em;}



#distributor-block {padding-bottom: 72px; background: url(../images/div.png) center bottom no-repeat; margin-bottom: 40px; overflow: hidden;}
.distributor li {display: inline-block; list-style: none; margin-left: 1em; width: 22%; vertical-align: top;}


/*ARTIST LANDING PAGE*/

.billboard-slide-sub img {display: block; max-width: 100%; max-height:345px; height: auto!important; }
.thumbnail .caption {font-size:.8em!important;}


/*PRO-SERIES*/

.proseries-pic { padding:3px; width:100%; max-width:1000px; display:block; height:auto!important; margin: 0 auto 1em;}

/*G-SERIES*/

.gseries-pic { padding:3px; margin: 0 auto 1em; width:100%; max-width:1000px; display:block; height:auto!important; }