/* Custom CSS */

@media screen and (max-width:630px) {
 
 .dropdown{
width:48% !important;

}

#right{
float:right;  
margin-right:0 !important;
}

#left{
  float:left;
}
#searchbar{
  width:100% !important;
  margin-bottom:15px;
}

#search{
 text-align:left !important;
}

.dropdown-content{
 width:49% !important;
 height:250px;
 overflow:scroll;
}

.dropdown-content a{
 height:0;
 font-size:12px;
}

.search-icon{
 display:none; 
}



}
#store-nav-div{
 width:100%;
 position:relative;
 display:block;
}

#search{
 width:100%; 
 text-align:left;
}

.dropbtn {
  background-color: black;
  color: white;
  padding: 9px;
  width:100%;
  font-size: 14px;
  border: none;
  color:white;
  font-weight:bold !important;
  cursor: pointer;
  margin:0 !importtant;
}

.dropdown {
  width:32%;
  float:left;
  display: block;
}

.search-icon{
 float:right;
 padding:4px 5px 5px 10px;
 top:5px;
 position:absolute;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color:#f2f2f2;
  min-width: 160px;
  width:32%;
  text-align:center;
  height:400px;
  overflow:scroll;
  margin:-20px 0 0 0;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  color: black;
  font-weight:bold;
  padding: 16px 16px;
  text-decoration: none;
  display: block;
  line-height:0px;
  font-size:14px;
  font-family:'Open Sans';
}

.dropdown-content a:hover{

}



.dropdown-content a:hover {background-color: #e0dfde}

.dropdown:hover .dropdown-content {
  display: block;
}

.dropdown:hover .dropbtn {
  background-color: #347CAB;
  color:white;
}


/* Add a black background color to the top navigation */
.topnav {
  background-color: #347cab;
  overflow: hidden;
}

/* Style the links inside the navigation bar */
.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  font-family:'Open Sans';
  font-weight:bold;
  text-align: center;
  padding: 12px 13px;
  text-decoration: none;
  font-size: 17px;
}

/* Change the color of links on hover */
.topnav a:hover {
  background-color: black;
  color: white;
}

/* Add an active class to highlight the current page */
.topnav a.active {
  background-color: #347cab;
  color: white;
}

/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
  display: none;
}

.topnav .icon:focus{
 color:white; 
}

/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
@media screen and (max-width: 750px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
    padding:18px 18px 0 18px;
  
    height:55px;
    
  }
}


/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 750px) {
  
  .topnav a:not(:first-child) {
    text-align: center !important;
    font-size:13px;
}

  .topnav.responsive {position: relative;}
  .topnav.responsive a.icon {
    position: absolute;
    right: 0;
    top: 0;
    color:white;

  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
 
  }
}

@media only screen and (max-width: 750px) {
  
  #banner{
    margin-top:0px !important;
  }

#header-container{
 display:none; 
}
}

@media only screen and (min-width: 750px){

  .topnav{
    display:none;
}
}
#mc_embed_signup {
    background: none !important;
    clear: left;
    font: 14px Helvetica,Arial,sans-serif;
}


#release-info li{
 float:left;
 background:#347cab;
 color:white;
 font-size:13px;padding:5px;
 margin-right:15px;
 list-style:none;
}
.product_photos .thumbnails {
  margin-bottom: 0;
  margin-left: 0;
  padding:0;
  list-style: none;
  text-align: center;
  width:100%;
}

.product_photos .featured img {
  width: 100%;
  padding-right:30px;
 display:block;
}



#pre-order{
  font-family:'Open Sans';
  font-size:11px;
  line-height:20px;
  margin-bottom:15px;
}

.thumbnails li {
  float: left;
  height: auto;
  width: 22%;
  margin-right:10px;
  margin-top: 10px;
  padding: 10px;
}

.thumbnails .featured {
  width: 100%;
  margin: 0;
  padding: 0;
}

#store-stuff{
 float:right; 
   position:relative;
  display:inline-block;
 list-style:none;
 font-size:20px;
 padding:5px;
 margin-bottom:20px;
 color:#347cab;
 font-weight:bold;
}
 #store-stuff li{
   float:right;
 }
 
#cats li{
  position:relative;
  display:inline-block;
 list-style:none;
 float:left;
 font-size:13px;
 padding:0px;
 background:none;
 margin-right:5px;
 margin-top:10px;
 margin-bottom:10px;
 text-transform:uppercase;
 color:white;
 font-weight:bold;
}

#cats li a{
color:black;
}
#header-content img{
 width:50px; 
 float:left;
 margin-top:16px;
 margin-right:20px;
}
article img{
 width:100% !important; 
}

.media-summary{
 border-bottom:1px solid #d4d4d4;" 

}

.media-summary img {
  width:100%;
}

.tour-band{
 font-weight:bold;
 font-size:20px;
 background: #347cab;
 width:100%;
 float:left;
 color:white;
 margin-bottom:20px;
 padding:10px;
}
#header-container{
  height:85px; 
  width:100%;
  background:#347cab;
  float:left;
  padding:0 10px;
  margin:0 0px;
  border-bottom:0px solid black;
}

#header-content{
  padding:0 0px;
  max-width:1100px;
  margin:0 auto;
}

#title{
  padding-top:15px;
  font-size:30px;
  font-family:'Helvetica'; 
  color:white;
  font-weight:bold;
  letter-spacing:1px;
  line-height:auto;
  display:block;
}

#nav{
  float:left;
  color:#d4d4d4;
  padding-bottom:20px;
}

#nav li{
  padding-right:9px;
  float:left;
  font-size:15px;
  color:#d4d4d4 !important;
  font-weight:bold;
  display:inline;
}

#nav li a {
  color:#C9E4CA;
}

#nav li a:hover{
  color:#87BBA2;
  transition: color 0.5s ease;
}

ul{
  margin:0; 
}

.row{
  max-width:100%;
}

.row .row {
    width: auto;
    margin-left:0;
    margin-right:0;
    margin-top: 0;
    margin-bottom: 0;
    max-width: none;
}
  
.columns{
  padding:0;
}
    
.orbit-container{
  margin-top:0px !important; 
}

#banner{
 margin-top:20px;
 border:0px solid black; 
}

h1{

 font-size:20px !important;
 font-family:helvetica;
 font-weight:bold;
 letter-spacing:1px;

}


h1 div{
  padding:7px 9px 5px 9px;
   float:left;
  background:#347cab;
  color:white;
  margin-bottom:10px;
  width:auto:}

.header-h1{
  position:block;
  margin-bottom:10px;
}


hr{
  margin:0 0 15px 0 !important;
  padding:0 !important;
  border:1px solid #d4d4d4; 
}


@media only screen and (min-width: 64.063em) {
.large-block-grid-5>li {
    width: 20%;
    padding: 0 0.625rem .15rem !important;
}
}


#shop-by-artist{
  padding-top:15px;
 padding-bottom:0px;
 float:left;
 width:100%;
 height:auto;
}

.artists{
 float:left;
 list-style-type:none;
 padding:15px 30px 20px 0 ;
}

.artists li{
 color:#2c6eb4;
 font-size:14px;
 font-weight:bold;
}

#footer-left{
 float:left:
 padding:0;
 margin:0;
}

.media-heading{
  margin-top:0;
 font-weight:bold;
 font-size:18px;
 margin-bottom:10px !important;
}

.date{
  margin-bottom:16px;
  font-family:helvetica;
  font-size:13px;
  margin-top:7px;
  float:left;
  color:white;
  background:#87BBA2;
  padding:4px 6px 4px 4px;
  font-style:italic;

}

#daterapper{
  display:block;
  height:45px;
  width:100%;
 float:left;


}

#social{
 width:auto; 
 float:right;
}

#social li{
  float:left;
  font-size:18px;
  padding-left:10px;
  display:inline;
  
}

#social li a{
 color:white;
}

[data-clearing] li {
    float: left;
    margin-right: 25px;
}

br{
 height:150px; 
}

.spacer{
  height:15px;
}

p{
 font-size:13px; 
}



/* Media Queries */

@media only screen and (max-width: 640px){
  
  [data-clearing] li {
    float: left;
    margin-right: 0px;
    margin-bottom:15px;
}
}
@media only screen and (max-width: 700px) {
  
#nav li{
  font-size:12px;
}

#nav{
  position:relative;
  float:none;
  width:100%;display:block;
}

#social {display:none;}


#title{
  margin-top:5px;
 font-size:22px; 
}}

@media only screen and (max-width: 960px) {
 #news > .left {
  width:100% !important; 
 }
 
 #news > .right {
 display:none;
}
}

  
  

/* Foundation Overrides */

a {
  outline:0;
  color: #347cab;
}

a:focus{
 outline:0; 
}

a:hover, a:focus {
  color: black;
}

.button {
  background-color: #000000;
  border-color: #2795b6;
  color: #ffffff;
}

.button:hover, .button:focus {
  background-color: #2795b6;
  border-color: #2795b6;
  color: #ffffff;
}

.hide {
  display: none !important;
}

.orbit-container {
  margin: 0 0 1.1875rem 0;
}

.orbit-container .orbit-slides-container li {
  text-align: center;
}

.orbit-con tent .orbit-slides-container li img {
  margin: 0 auto;
}

.orbit-container .orbit-timer {
  visibility: hidden;
}

.orbit-container .orbit-bullets-container .orbit-bullets {
  margin-bottom: 0.59375rem;
}

.postfix {
  height: 2.125rem;
}

.postfix.button {
  height: 2.125rem;
  line-height: 2.125rem;
}

nav.pagination {
  display: block;
  font-size: 1rem;
  height: 1.5rem;
  line-height: 1.6;
  margin-left: -0.3125rem;
}

nav.pagination span {
  color: #999999;
  font-size: 0.875rem;
  height: 1.5rem;
  margin-left: 0.3125rem;
}

nav.pagination span a, nav.pagination span.current, nav.pagination span.inactive {
  background-color: transparent;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  color: #999999;
  display: block;
  padding: 0.0625rem 0.625rem 0.0625rem;
}

nav.pagination span:hover a, nav.pagination span a:focus {
  background-color: #e6e6e6;
  color: #999999;
}

nav.pagination span.inactive {
  background-color: transparent;
  color: #999999;
  cursor: default;
}

nav.pagination span.inactive:hover, nav.pagination span.inactive:focus {
  background-color: transparent;
}

nav.pagination span.current {
  background-color: #347cab;
  color: #ffffff;
  font-weight: bold;
  cursor: default;
}

nav.pagination span.current:hover, nav.pagination span.current:focus {
  background-color: #347cab;
  color: #ffffff;
}

nav.pagination span {
  float: left;
  display: block;
}

.pagination-centered nav.pagination span {
  float: none;
  display: inline-block;
}

.postfix {
  height: 2.2125rem;
}


.th {
  border: none;
  -webkit-box-shadow: none;
  box-shadow: none; }

  .th:hover, .th:focus {
    -webkit-box-shadow: none;
    box-shadow: none; }


.top-bar .title-area .name h1 a img {
  height: auto;
  margin-top: -2px;
  max-height: 42px;
  max-width: 175px;
  width: auto;
}

.top-bar-section ul li > a {
  font-weight: 300;
}

@media only screen and (min-width: 40.063em) {
  .top-bar-section .social li a {
    padding: 0 7px;
  }

  h1 a.right, h2 a.right, h3 a.right, h4 a.right, h5 a.right {
    font-size: 0.5em;
    margin-top: 1.5em;
  }
}


/* Layout */

body {
background:#f7f7f7;
}

h1, h2, h3, h4, h5, h6 {
  color: #222222;
}

h4{
 font-family:helvetica;
 color:black;
 font-weight:bold;
 font-size:26px;
}


.news-headline{
 font-weight:700;
 margin-bottom:0px !important;
 line-height:19px;
 padding-bottom:8px;
}

.content-container {
  height:auto;
 margin:0 10px;
 background:#f7f7f7;
}

.content-container > div {
  margin: 0 auto;
  padding: 1.1875rem 0;
  max-width:1090px;
  width: 100%;
}

.content-container h1 .right, .content-container h2 .right, .content-container h3 .right, .content-container h4 .right, .content-container h5 .right {
  font-size: 0.65em;
  margin-top: 0.5em;
}

.content-container h1 + hr, .content-container h2 + hr, .content-container h3 + hr, .content-container h4 + hr, .content-container h5 + hr {
  margin-top: 0;
}

.footer-container {
  border-top:1px solid #B7D5D4;
  width:100%;
  float:left;
padding:50px 15px 30px 15px;
}

.footer-container p{
 color:black !important; 
}

#footer-content{
  margin:0 auto;
 max-width:1100px;
 min-height:200px;
}

#footer-content > .left{
  float:left;
  color:black;
  width:33% !important;
}

#footer-content > .right {
 float:left !important;
 width:33%;

}

.footer-container > div {
  margin: 0 auto;
  width: 100%;
}

.footer-container p, .footer-container ul {
  font-size: 13px;
}

.footer-container a {
  color: #f9f9f9;
}

.footer-container a:hover {
  color: #ffffff;
}

.panel-info {
  margin-top:3px;
  line-height:18px;
}

.panel-info a{
  font-size:13px;
  line-height:14px;
  text-transform:uppercase;
  font-weight:bold;
}

#news > .left{
 float:Left;
 width:68%;
}

#news > .right {
 width:30% !important; 
 height:auto;
}

#news-page > .left{
 width:70% !important; 
}

#news-page > .right{

  width:28% !important;

}


#roster-item-left{
  float:left;
  width:60%;
  height:auto
}

#roster-item-right{
  float:right;
  width:37%;
  height:auto;
}


/* Errors */

#error {
  padding: 100px 0 150px 0;
}

#error h3 {
  text-align: center;
}

#error p {
  text-align: center;
}


/* Product Grid */

.product {
  margin: 0 auto;
  max-width: 202px;
}

.product a.th {
  display: block;
  height: 200px;
  line-height: 200px;
  position: relative;
  text-align: center;
}

@media (max-width:900px) {
  #footer-content > .left {
  float:left;
  color:black;
  width:45% !important;
  padding:0 10px 20px 0;
}

#clear{
  clear:left;
}
}

@media (max-width:700px) {
  #footer-content > .left {
  width:100% !important;
  padding:0 0px 15px 0px;
}
}


#mc_embed_signup form {
    display: block;
    position: relative;
    text-align: left;
    padding: 10px 0 10px 0% !important;
}


@media (max-width: 400px) {

  .product a.th {
    height: 150px;
    line-height: 150px;
  }
  
  .product a.th img {
    max-height: 100%;
    max-width: 100%;
  }
}

.product a.th .panel-banner {
  background-color: rgba(0, 0, 0, 0.55);
  bottom: 0;
  color: #ffffff;
  font-size: 0.75rem;
  line-height: 1.25rem;
  margin: 0 0 0 0;
  padding: 0.25rem;
  position: absolute;
  text-align: center;
  width: 100%;
  z-index: 100;
}

.product .panel {
  background-color: transparent;
  border-color: transparent;
  font-size: 0.9rem;
  padding: 0.25rem 0rem;
}

.product .panel div {
  display: block;
  margin-bottom: 0em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product .panel-info div + div {
  font-size: 0.75rem;
  margin-top: 0rem;
}


/* Product Page */

#product {

}

#product .clearing-assembled {
  
  margin: 0 auto 1.1875rem auto;
  max-width: 432px;
}

#product .clearing-assembled .clearing-thumbs li {
  text-align: center;
  width: 100%;
}

#product .clearing-assembled .clearing-thumbs li + li {
  height: 125px;
  line-height: 125px;
  margin: 0;
  padding: 5px;
  text-align: center;
  width: 33%;
}

@media (max-width: 400px) {

  #product .clearing-assembled .clearing-thumbs li + li {
    height: 75px;
    line-height: 75px;
  }
}

#product .clearing-assembled .clearing-thumbs li + li a img {
  max-height: 100%;
  max-width: 100%;
}

#product .clearing-assembled.clearing-blackout {
  max-width: 100%;
}

#product .clearing-assembled.clearing-blackout .clearing-thumbs li {
  width: 120px !important;
}

#product .panel {
  background-color: transparent;
  border-color: transparent;
  font-size: 0.9rem;
  padding: 0.5rem;
}

#product .panel div {
  display: block;
  margin-bottom: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#product .panel-banner {
  background-color: rgba(0, 0, 0, 0.55);
  color: #ffffff;
  font-size: 0.75rem;
  line-height: 1.25rem;
  margin: 0 0 1.1875rem 0;
  padding: 0.25rem;
  text-align: center;
}

#product .soundcloud-container {
  margin-bottom: 1.1875rem;
}

#product .add-to-cart-container {

}


/* Product Search */

#search {
  display: inline;
  float: right;
  margin: 0;
  text-align: right;
}

#search input {
  font-size: 0.6875rem;
  padding: 0.625rem 0.625rem 0.625rem 0.625rem;
}

#search .button {
  background-color: #000000;
  border: 2px solid #2795b6;
  margin: 0;
  padding: 0.625rem 0.625rem 0.625rem 0.625rem;
}



/* Event Grid */

.event {
  margin: 0 auto;
  max-width: 202px;
}

.event a.th {
  display: block;
  height: 200px;
  line-height: 200px;
  position: relative;
  text-align: center;
}

@media (max-width: 400px) {

  .event a.th {
    height: 150px;
    line-height: 150px;
  }
  
  .event a.th img {
    max-height: 100%;
    max-width: 100%;
  }
}

.event a.th .panel-banner {
  background-color: rgba(0, 0, 0, 0.55);
  bottom: 0;
  color: #ffffff;
  font-size: 0.75rem;
  line-height: 1.25rem;
  margin: 0 0 0 0;
  padding: 0.25rem;
  position: absolute;
  text-align: center;
  width: 100%;
  z-index: 100;
}

.event .panel {
  background-color: transparent;
  border-color: transparent;
  font-size: 0.9rem;
  padding: 0.25rem 0rem;
}

.event .panel div {
  display: block;
  margin-bottom: 0rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.event .panel-info div + div {
  font-size: 0.75rem;
  margin-top: 0rem;
}


/* Event Page */

#event {

}

#event .clearing-assembled {
  
  margin: 0 auto 1.1875rem auto;
  max-width: 432px;
}

#event .clearing-assembled .clearing-thumbs li {
  text-align: center;
  width: 100%;
}

#event .clearing-assembled .clearing-thumbs li + li {
  height: 125px;
  line-height: 125px;
  margin: 0;
  padding: 5px;
  text-align: center;
  width: 33%;
}

@media (max-width: 400px) {

  #event .clearing-assembled .clearing-thumbs li + li {
    height: 75px;
    line-height: 75px;
  }
}

#event .clearing-assembled .clearing-thumbs li + li a img {
  max-height: 100%;
  max-width: 100%;
}

#event .clearing-assembled.clearing-blackout {
  max-width: 100%;
}

#event .clearing-assembled.clearing-blackout .clearing-thumbs li {
  width: 120px !important;
}

#event .panel {
  background-color: transparent;
  border-color: transparent;
  font-size: 0.9rem;
  padding: 0.5rem;
}

#event .panel div {
  display: block;
  margin-bottom: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#event .panel-banner {
  background-color: rgba(0, 0, 0, 0.55);
  color: #ffffff;
  font-size: 0.75rem;
  line-height: 1.25rem;
  margin: 0 0 1.1875rem 0;
  padding: 0.25rem;
  text-align: center;
}

#event .map-container {
  margin-bottom: 1.1875rem;
}

#event .soundcloud-container {
  margin-bottom: 1.1875rem;
}

#event .add-to-cart-container {

}


/* Contact Page */

#contact {

}

#contact textarea {
  height: 115px;
}

#contact #recaptcha_widget_div {
  margin: 0 0 1rem 0;
}


/* Gallery Page */

#gallery {

}

#gallery ul li > div {
  margin: 0 auto;
  max-width: 202px;
}


/* History Page */

#history {

}

#history .history-item {

}

#history .history-item .orbit-container {
  -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
  margin: 0 auto 1.1875rem auto;
  max-width: 300px;
}

#history .history-item .release-information {
  font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Helvetica, Arial, sans-serif;
  font-size: 0.8rem;
  margin-bottom: 0;
}

#history .history-item .links.inline-list a {
  font-size: 0.9rem;
}


/* Order Page */

#order {

}

#order #question .panel {
  font-size: 0.9rem;
  line-height: 1.2rem;
  padding: 0.75rem 0;
  text-align: center;
}

#order table tbody tr td + td {
  text-align: right;
}

/* Roster Page */

#roster {

}

#roster ul li > div {
  margin: 0 auto;
  max-width: 202px;
}

#roster ul li > div .panel {
  background-color: transparent;
  border-color: transparent;
  font-size: 0.9rem;
  padding: 0.25rem 0rem;
}

#roster ul li > div .panel div {
  display: block;
  margin-bottom: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}


/* Roster Item Page */

#roster-item {

}

#roster-item #description p {
  font-size: 0.9rem;
}

#roster-item #links .inline-list a {
  font-size: 0.9rem;
}

#roster-item #soundcloud iframe {
  margin-bottom: 1rem;
}

#roster-item #bandsintown {
  margin-bottom: 1rem;
}