
html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}

a img {
  border: none;
}
html {
  width:100%;
  height:100%;
}
body {
  width: 100%;
  height: 100%;
  font-size: 18px;
  background-image: url(../images/bg_blue_gradient.jpg);
  background-repeat: repeat-x;
  background-color: #235980;
  /*font-family: 'Lato', sans-serif;*/
  font-family: "Cabin", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 400;
   font-variation-settings: "wdth" 100;
}

h4, h3 {
  margin: 0;
  padding: .2em 0;	
}

.hide-section {
  display: none;
}

/* DEFAULT LINKS */

a:link, a:visited {
  color: #004a80;
  text-decoration: none;
}
a:hover, a:active {
  color: #235980;
  text-decoration: underline;
}

#content_container {
  width: 1200px;
  max-width: 100%;
  margin: 0 auto;
  padding-bottom: 2em;
}
#content {
  width: 100%;
  max-width: 100%;
  background-image: url(../images/bg_content_gradient.jpg);
  background-repeat: repeat-x;
  background-color: #ebf7ff;
  padding: 0 1em 1em 1em;
  box-shadow: 0 6px 8px rgba(16,40,57,0.75);
}
.lower {
  width: 100%;
  max-width: 100%;
}
.border_bottom {
  border-bottom: 1px solid #235980;
}

/* HEADER */

#header {
  width: 750px;
  max-width: 100%;
  margin: 0 auto;
  text-align: center;
  padding: 0 1em;
  padding: 0 1.5vw;
}
.header_img {
  position: relative;
  z-index: 2;
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
}
.header_img_stacked {
  display: none;
  position: relative;
  z-index: 2;
  max-width: 100%;
  height: auto;
  margin: .3em auto 0 auto;
}
.site_subtitle  {
  position: relative;
  z-index: 1;
  font-family: 'Lato', sans-serif;
  text-shadow: 0 1px rgba(1,109,169,0.8);
  font-size: 1.2em;
  padding: 0;
  margin: -.8em 0 0 0;
  color: #d4f0ff;	
  font-weight: 600;
  letter-spacing: .1em;
  text-decoration: none;
  text-align: center;
}
.page_title{
  font-family: 'Lato', sans-serif;
  text-shadow: 0 1px rgba(235,247,255,0.45);
  font-size: 1.5em;
  padding: .35em 0 .15em 0;
  margin: 0;
  color: #083756;	
  font-weight: 600;
  letter-spacing: .1em;
  text-decoration: none;
  text-align: center;
}
.subhead-text {
  text-align: center;
  margin: 0;
  padding: .25em 0 1em 0;
}
.subhead-text a:link, .text a:visited {
text-decoration: none;
font-weight: bold;
}


/* NAV */

.nav {
  font-size: 1em;
  width: 100%;
  max-width: 100%;
  padding: .3em;
  text-align: center;
}
#compact_nav {
  display: none;
  font-size: 1em;
  width: 100%;
  max-width: 100%;
  padding: 0 .3em;
  line-height: 1 !important;
  text-align: right;
}
ul.nav_links {
  display: inline;	
  padding: 0;
  margin: 0;
}
li.nav_item {
  display: inline;
  padding: 0;
  margin: 0;
}
.nav_link:link, .nav_link:visited  {
  font-family: 'Lato', sans-serif;
  margin: 0 .5em;	
  font-weight: 900;
  letter-spacing: .1em;
  cursor: pointer !important; /* Why does this need important? */
  white-space: nowrap;
  text-shadow: 0 1px rgba(235,247,255,0.45);
  color: #0b4a74;	
  text-decoration: none;
}
.nav_link:hover, a.nav_link:active {
  text-shadow: 1px 0 rgba(235,247,255,0.45);
  color: #043352;
  text-decoration: none;
}
.nav_current {
  font-family: 'Lato', sans-serif;
  text-shadow: 1px 0 rgba(235,247,255,0.45);
  margin: 0 .5em;
  color: #032135;
  font-weight: 900;
  letter-spacing: .1em;
}
.mobile_menu_link:link, .mobile_menu_link:visited {
  font-size: 2rem;
  font-family: 'Lato', sans-serif;
  text-shadow: 1px 0 rgba(235,247,255,0.45);
  color: #043352;
  font-weight: 900;
  letter-spacing: .1em;
  text-decoration: none;
  padding-right: 1em;
}
.mobile_menu_link:hover, .mobile_menu_link:active {
  text-shadow: 0 1px rgba(9,60,94,0.45);
  color: white;
}
#close_menu_link {
  display:none;	
}

/* HOME PAGE */

.left {
  display:inline-block;
  vertical-align:top;
  width:70%;
  max-width:70%;
  padding:.5em .8em 1em .8em;
}
.left_inner {
  max-width:100%;
  padding:0 .5em;
}
.right {
  display:inline-block;
  vertical-align:top;
  width:30%;
  max-width:30%;
  height:100%;
  margin-top:.5em;
  padding:.3em .8em 1em .8em;
  border-left:1px solid #235980;
}

.right_h2 {
  width:100%;
  font-size:1.2em;
  margin:0;
  padding:.2em 0;
  font-family: 'Lato', sans-serif;
  text-shadow:0 1px #fff;
  font-weight:900;
  color:#0b4a74;
  letter-spacing:.1em;
}
.right_h3 {
  font-family: 'Lato', sans-serif;
  font-size: 1.1em;
  padding: 0;
  margin: 0 0 .1em 0;
  font-weight: 900 ;
  color: #333;
  letter-spacing: .1em;
}
.right_h4 {
  font-family: 'Lato', sans-serif;
  font-size: 1em;
  padding: 0;
  margin: .3em 0 .7em 0;
}
#listen {
  display: inline-block;
  width: 100%;
  max-width: 100%;
}

/* Home page audio player */

.featured_track {
  list-style-type: none;
  margin-left: 0;
  padding-left: 0;
}
.track_selection {
  padding-bottom: 1em;
}
select {
  max-width: 100%;
  font-size: .9em;
  font-family: 'Lota', sans-serif;
  margin: 0 0 .5em 0;
  -webkit-appearance: menulist;
  background-color: transparent;
  border: solid 1px #53809e;
}
.audio-player {
  width: 400px;
  max-width: 100%;
  position: relative;
  z-index: 1000;
}

/* Home Page Calendar */

#homepage_calendar {
  width: 100%;
  max-width: 100%;
  border-top: 1px solid #235980;
  padding-top: .5em;
}

#calendar_slideshow {
position:relative;
z-index:1;
width:100%;
margin:.3em 0 .5em 0;
box-sizing: content-box !important;
}

.calendar_event {
position:relative;
z-index:2;
width:95%;
display:none;
padding:.7em;
line-height:1.3;
border:solid 2px #53809e;
border-radius:.6em;
background-color:#ebf7ff;
}
.first_event {
display:block;
}
.event_info {
font-weight:400 !important;
}
.back_next_div {
width:100%;
padding:.5em .5em 0 .5em;
font-size:.9em;
line-height:1.3;
}
.prev {
display:inline-block;
cursor:pointer;
position:relative;
z-index:4;
padding-right:1em;
}
.next {
  display: inline-block;
  cursor: pointer;
}
.prev:hover, .next:hover {
  color: darkgreen;
}


/* SIDE BAR STUFF */

.sidebar_stuff {
  width: 100%;
  max-width: 100%;
  margin: .5em 0;
  line-height: 1.2;
  border-top: 1px solid #235980;
  padding-top: .5em;
}
.sidebar_lists {
  margin: .5em 0;
  padding: 0;
}
.sidebar_list_item {
  margin: 0;
  padding: 0;
  list-style: none;
  line-height: 1.8;
  font-size: .95em; font-size:.95rem;
}
.sidebar_stuff {
  margin: 1em 0;
  line-height: 1.4;
}
#sidebar_about {
  font-size: .9em;
  font-size: .9rem;
}
.sidebar_right {
  display: block;
  width: 100%;
  max-width: 100%;
}

/* LANDSCAPE Slideshow (Home, Contact) */

#slideshow {
  margin: 1em auto .5em auto;
  width: 100%;
  max-width: 100%;
  height: auto !important;
  text-align: center;
  position: relative;
  z-index: 1; /* This needs to be higher than img.slideshow and lower than audio-player */
}
.cycle-slideshow {
  width: 100%;
  max-width: 100%;
}
img.first {
  display: block;
}
.slideshow {
  margin: 0 auto;
  max-width: 100%;
  height: auto !important;
  box-shadow: 3px 3px 6px rgba(0, 0, 0, .75);
  position: relative;
  z-index: 0;
}


/* POSTS: */

.post {
  width: 100%;
  max-width: 100%;
  padding: .5em .5em 1em .5em;
  border-bottom: 1px solid #759bb4;
  line-height: 1.3;
}
.first-post {
  padding-top: 2em;
}
h2.title {
  font-size: 1.3em;
  padding: .2em 0;
  margin: 0;
  color: #163d58 /*#272518*/;
  letter-spacing: .02em;
  font-weight: 900;
  line-height: 1.6;
  /*text-shadow: 0 1px #fff;*/
  /*text-transform: uppercase;*/
}
.subtitle {
  /*font-family:georgia, "Times New Roman", Times, serif;*/
  font-size: 1.1em;
  padding: 0 0 1rem 0;
  margin: 0;
  color: #444 /*#272518*/;
  /*text-shadow: 0 1px #fff;*/
  /*letter-spacing: .04em;*/
  /*text-transform: uppercase;*/
  line-height: 1.6;
}
.text {
  line-height: 1.54;
  padding-top: .5em;
  /*width: 95%;*/
}
.text a:link, .text a:visited {
  text-decoration: none;
  font-weight: bold;
}
.text a:hover, .text a:active {
  text-decoration: underline;
}
.text p:first-child {
  margin-top: 0;
}
.no_border {
 border: none;
}
.border {
  border: 1px solid #999;
}
.post_img {
  margin: .3em;
  max-width: 100%;
}
.post_img.non_clickable {
  cursor: default;
}
.post_img.clickable {
  cursor: pointer;
}
.post_img_full {
  max-width: 90%; /* New */
  box-shadow: 8px 8px 16px #000000;
  border: 1px solid #333333;
  position: fixed;
  top: 40px;
  left: 40px;
  display: none;
  z-index: 100;
  cursor: pointer;
}
.caption {
  line-height: 1.2;
  font-size: .95em;

}



/* Listen: */

.album {
width:100%;
padding:.5em 2% 1em 1em;
}
.album_cover {
display:inline-block;
width:35%;
max-width:35%;
vertical-align:top;
padding:2em 0 0 0;
}
.album_cover_small {
display:none;
width:100%;
max-width:100%;
vertical-align:top;
padding:1em 1em 0 1em;
}
.cd_cover {
max-width:100%;
height:auto;
box-shadow: 3px 3px 4px rgba(28, 29, 30, .75);
}
.cd_cover_small {
max-width:100%;
height:auto;
box-shadow: 3px 3px 4px rgba(28, 29, 30, .75);
}
.cd_name_small {
  display:inline-block;
  vertical-align:baseline;
  font-weight:900;
  font-size:1.5em;
  padding:0 0 0 .5em;
  margin:0;
  font-family:'Lota', sans-serif;
}
.track-play-instructions {
  margin:0;
  padding:.5em;	
}
.tracks_table_div {
  display:inline-block;
  width:60%;
  max-width:60%;
  vertical-align:top;
  padding:.8em;
  margin:0 1em;
  background-color: #235980;
  border-radius:.8em;
  box-shadow: 2px 2px 4px rgba(28, 29, 30, .75);
}
.tracks {
  font-family:'Lato', sans-serif;
  padding:.5em;
  width:100%;
  max-width:100%;
  background-color:white;
  border-radius:.6em;
  box-shadow:0 -2px 1px #183d58, 0 2px 1px #183d58;
}

div.track_name {
  font-size:.9em;
  cursor:pointer;
  border-bottom:1px solid #dedede;
  padding:.3em;
  width:100%;
}

div.track_info {
  font-size:.9em;
  line-height:1.4;
  padding:.5em;
  display:none;
  width:100%;
  border-bottom:1px solid #dedede;
}
div.track_info p {
  padding:.3em 0;
  color:#111;
}
.cd_name {
  font-weight:bold;
  font-size:1.4em;
  padding:0;
  margin:1em 0 0 0;
  font-family:georgia, "Times New Roman", Times, sans-serif;
}
.audio-player-status {
  display:inline-block;
  padding: 0 .25em;
}
.audio-player-listen {
  padding: 0 0 0 2rem;
}

/* MEET THE BAND */

.bandmember_container {
  width:100%;
  margin-top:.5em;
}
.bandmember {
  display:inline-block;
  vertical-align:top;
  max-width:45%;
  height:auto;
  margin:1em;
  padding:1em;
  line-height:1.3;
  font-size:.9em;
  background-image:url(/images/bg_content_gradient.jpg);
  background-position:bottom;
  background-repeat:repeat;
  box-shadow: 3px 3px 6px rgba(28,29,30, .75);
}
.bandmember h3 {
  font-weight:900;
  padding:0;
  margin:.5em 0;
}
.bandmember h4 {
  padding:0;
  margin:.5em 0;
}
.bandmember_img {
  display:inline-block;
  vertical-align:top;
  max-width:45%;
  height:auto;
  margin:2em 1em 0 auto;
  box-shadow: 3px 3px 6px rgba(28,29,30, .75);
}
.bandmember_caption {
  text-align:right;
  margin:0;
  padding:.3em .5em;
  display:none;
}

/* SCHEDULE: */	

.main_schedule {
  display:inline-block;
  vertical-align:top;
  width:40%;
  max-width:40%;
  height:auto !important;
  margin:1em 0 0 1em;
  padding-bottom:2em;
  box-shadow: 3px 3px 6px rgba(28,29,30, .75);
}
.month_div {
  width:100%;
  max-width:100%;
  margin:.3em 0 0 1em;
  padding-bottom:.8em;
}
.gig_div {
  line-height:1.3;
  max-width:100%;
  margin:.5em 1em;
  padding-bottom:8px;
  border-bottom:1px solid #48442c;/*#272518;*/
}

.gig_month {
  font-size:1.4em;
  font-weight:900;
  padding:0;
  margin:.8em 0 .5em 0;
}
h2.no_events {
  font-size:1.2em;
  font-weight:900;
  padding:0;
  margin:1em;
}
h3.gig_date {
  font-size:1em;
  font-weight:900;
  color:black;
  padding:0;
  margin:0;
}
h4.gig_venue {
  font-size:1em;
  font-weight:bold;
  margin:.8em 0;
}
h5.gig_event {
  font-size:1em;
  font-weight:bold;
  margin:.8em 0;
}
p.gig_details {
  margin:.3em 0;
}
.slideshow_div_schedule {
  display:inline-block;
  vertical-align:top;
  width:50%;
  max-width:50%;
  padding: 0 5%;
}
.slideshow_div_schedule img {
  display: none;
}
.slideshow_div_schedule img.first {
  display: block;
}



/* Purchase: */




/* CONTACT: */
div#lower_contact {
width:100%;
max-width:100%;
padding: .5em 0 0 0;
}
#main_contact {
display:inline-block;
vertical-align:top;
width:60%;
max-width:60%;
padding:1em;
line-height:1.3;
font-size:.9em;
}
#sidebar_contact {
 display:inline-block;
  vertical-align:top;
  width:40%;
  max-width:40%;
  padding:.5em;
  margin:0;
}
#contact_form {
width:100%;
}
.contact_input {
  width:100%;
}
.contact_message {
  width:100%;
  height:6em;	
}
.contact_td {
  padding: .3em;
}
.contact_label {
  text-align:right;
}
.contact_result {
display:inline-block;
margin:12px;
padding:12px;
border: 2px solid #ababab;
font-size:1.1em;
font-weight:bold;
}
#contact_submit {
  margin-right:.5em;
}
#result-message {
  padding: 0 .5rem;
  border: 1px solid #235980;
  border-radius: .5rem;
  display: inline-block;
  font-weight: bold;
  margin: 1rem 0;
}
.more_info {
  display:none;
}

/* VIDEOS: */
	
.videos {
width:100%;
max-width:100%;
padding:1em 0;
}
.video_left_container {
display:inline-block;
vertical-align:top;
width:57%;
max-width:57%;
}
video_left_inner_smaller {
width:480px;
max-width:100%;
}
.video_left {
position:relative;
padding-top:25px;
padding-bottom: 56.25%;
height:0;
}
.video_left_alt {
position:relative;
padding-top:25px;
padding-bottom: 75%;
height:0;
}
.video_left iframe, .video_left_alt iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height:100%;
box-shadow: 3px 3px 6px rgba(28,29,30, .75);
}
.video_right {
display:inline-block;
vertical-align:top;
width:40%;
max-width:40%;
padding:0 1em 1em 2em;
font-size:.9em;
margin:0;
}

/* MEDIA QUERIES ***************************************************************************************************** */

@media only screen 
  and
  (min-width: 801px) {
.nav {
  display:block !important;
  }
}

@media only screen 
  and /*(min-device-width : 320px) 
  and (max-device-width : 480px),*/
  (max-width: 800px) {

/* MOBILE NAV */
	
.nav {
display:none;
}
#compact_nav {
  display:block;
}
#nav_links {
  display:inline;	
  padding:0;
  margin:0;
}
#nav_links li {
  padding:0;
  margin:0;
}
a.nav_link:link, a.nav_link:visited  {
  font-family: 'Lato', sans-serif;
  text-shadow:0 1px rgba(9,60,94,0.45);
  margin:.4em;
  color:white;	
  font-weight:900;
  letter-spacing:.1em;
  text-decoration:none;
  font-size:1.2em;
}
#content {
  padding:0;
  box-shadow: none;
}
.nav_current {
  font-size: 1.2em;
}

/* ALL */

.header_img_stacked {
  display:block;
}
.header_img {
  display:none;
}
.responsive {
  width:100% !important;
  max-width:100% !important;
}

.responsive-clear {
  width:100% !important;
  max-width:100% !important;
}
.site_subtitle {
  font-size:1em;
  margin:0 0 .5em 0;
}

/* HOME PAGE */

.left {
display:block;
width:100%;
max-width:100%;
padding:0;
}
.left_inner {
margin:0;
}
.right {
display:block;
width:100%;
max-width:100%;
height:auto;
margin-top:0;
padding:.3em .8em 1em .8em;
/*z-index:0;*/
border:none;
}
.sidebar_right {
padding:0 1em;
}
.sidebar_stuff{
border:none;
margin:0;
}
div.post h2.title {
width:100%;
margin-top:.5em;
}
div.post .subtitle, .text {
width:100%;
}
.thumb_img, .thumb_img_no_border, .post_img {
  width: auto;
  height: auto;
  max-width: 100%;
  margin: 0 auto;
  cursor: default;
}
.post_img_full {
  display: none;
}
.caption {
  width: 100%;
  max-width: 100%;
  margin: 1em .5em .5em .5em;
}
.text {
  font-size: .9em;
}

/* LANDSCAPE slideshow */

#slideshow {
margin: .5em auto 0 auto;
padding: 0;
}
.slideshow {
width: 100%;
max-width: 100%;
box-shadow: none;
}

/* Audio */

#track_details_mobile {
font-size: 1em;
}
#listen{
width: 100%;
max-width: 100%;
}
/* Calendar */

.calendar_event {
font-size: 1em;
}
.back_next_div {
font-size: 1em;
padding: .5em;
}
.calendar_event {
display: inline-block;
width: 60%;
}

/* Purchase: */



/* Listen: */

.album {
  width: 100%;
  max-width: 100%;
  padding: 0 0 1em 0;
}
.album_cover {
  display: none;
}
.album_cover_small {
  display: inline-block;
}
.tracks_table_div {
  width: 100%;
  max-width: 100%;
  padding: .8em;
  margin: 0;
  background-color: #235980;
  border-radius: .8em;
  box-shadow: 2px 2px 4px rgba(28, 29, 30, .75);
}
.tracks {
  font-family: 'Lato', sans-serif;
  padding: .5em;
  width: 480px;
  background-color: white;
  border-radius: .6em;
  box-shadow: 0 -2px 1px #183d58, 0 2px 1px #183d58;
}
div.track_name {
  font-size: 1.1em;
  cursor: pointer;
  border-bottom: 1px solid #dedede;
  padding: .5em;
  width: 100%;
  line-height: 1.5;
}

/* CONTACT */

#main_contact {
  display: block;
  width: 100%;
  max-width: 100%;
  padding: 0;
}
#sidebar_contact {
  display: block;
  width: 100%;
  max-width: 100%;
}
#contact_form {
  padding: 0 1em;
}

/* THE BAND */

.bandmember {
width:100%;
max-width:100%;
margin:.5em 0;
}
.bandmember_img {
height:auto;
max-width:100%;
margin:.5em auto;
text-align:center;
}
.bandmember_caption {
display:block;
}

/* SCHEDULE */

.main_schedule {
width:100%;
max-width:100%;
margin:0;
padding: 0 1em ;
box-shadow:none;
}
.slideshow_div_schedule {
position:static;
width:100%;
max-width:100%;
margin:0;
padding:1em 0;
}
.month_div {
margin-left:0;
padding-bottom:.3em;
}
.gig_div {
margin:.5em 0;
}
.gig_month {
margin:.3em 0;
}

/* VIDEO */
.videos {
padding:.5em 0;
}
.video_left_container {
width:100%;
max-width:100%;
}
video_left_inner_smaller {
width:100%;
max-width:100%;
}
.video_right {
width:100%;
max-width:100%;
padding:0 0 0 1em;
}
.video_left, .video_left_alt {
padding-top:1em;
}

/* -------------------- */
}
/*  end media queries */