/*
Theme Name: MBS V2
Theme URI: http://mbsradio.com/
Author: Kerri Dawe
Author URI: www.kerridawe.com
*/


blockquote{margin: 30px 0 22px;}
p{line-height:1.6;}
.content ul, .content ol{margin-bottom:30px !important; line-height:2;}

#header{
  position: -webkit-sticky;
  position: sticky;
  top: -1px;
  z-index: 5000;
  padding:0; 
  width: 100%;
}

.skip-link {
  background: #372f2d;
  color: #fff !important;
  font-weight: 700;
  text-decoration: none;
  left: 50%;
  padding: 5px 10px;
  position: absolute;
  transform: translateY(-100%);
  transition: transform 0.3s;
}

.skip-link:focus {
  transform: translateY(0%);
}

#header .logo {float: left; margin: 15px 30px 15px 0;}
#header .logo img{max-height:40px;}

.leaderboard > div{text-align:center;}
.leaderboard iframe{box-shadow: 0 0 2px rgba(0,0,0,0.3); margin:0 auto;}
#top .leaderboard iframe{margin: 20px auto;}

.menu-toggle.btn-primary{display: none;}

#header #nav{background:#372f2d; box-shadow: 0 0 3px rgba(0,0,0,0.3); width: 100%; z-index: 5000; display:flex;}
#header #nav ul{background: #372f2d; list-style:none; padding:0; margin:0; height: 100%; display: inline-block;}
#header #nav ul li{position:relative; height: 100%; float: left; display:flex; align-items: center;}
#header #nav ul li a{font-size:12px; color:#fdfdfd; display:flex; height: 100%; align-items: center; padding:10px 15px; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); transition: all .2s ease-in-out;}
#header #nav ul li a:hover, #header #nav ul li.current-menu-item a, #header #nav ul li.current-menu-item a:hover{text-decoration:none; background:#337ab7; transition: background 0.2s linear;}

#header #nav ul ul{display:none; position:absolute; z-index:5000; top:100%; left:0; width:200px; box-shadow:none;}
#header #nav ul ul li{display:block; background:#337ab7;}
#header #nav ul ul li a{display:block;}
#header #nav ul li:hover ul{display:block;}

/* .leaderboard{display: block; height: 100px; background: #eee;} */


/* LISTEN LIVE */
/* NOW PLAYING EDIT */
#listen-live{
  background: #333;
	color:#fff;	
  font-size: 10px;
  display: flex;
  height: 100%;
  /* width: 300px; */
  float: right;
}
#listen-live .title{ 
  float: left;
  background: url('images/bg-listen-live.jpg') center center no-repeat;
  background-size: cover;
  display:flex; 
  height: 100%;
  align-items: center;
  padding: 0 60px 0 15px;
  margin-right: 15px;
  font-weight: 600;
  font-size: 18px;
  line-height: 1;
  color: #fff;
  text-transform: uppercase;
  text-decoration: none;
}
#listen-live .title:hover{
  text-decoration: none;
}
#listen-live .now-playing{
  display:flex;
  flex-flow: wrap;
  align-content: center;
  height: 100%;
  max-width: 150px;
}
#listen-live .now-playing span{
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  text-overflow: ellipsis;
  overflow: hidden;
}

/* FEATURED */
#featured{margin-bottom: 50px;}
#featured a{display: block; box-shadow: 0 0 3px rgba(0, 0, 0, 0.3); transition: all .2s ease-in-out;} 
#featured a:hover{transform: scale(1.05);}

#listen-feature{
  background-repeat: no-repeat;
  background-size:cover;
  background-position: center center;
  text-align: center;
  min-height:650px;
  text-transform: uppercase;
  font-size: 30px;
  font-weight: 400;
  display:flex; 
  align-items: center;
}
#listen-feature .headline{
  width:100%;
  max-width: 700px;
  margin: 0 auto;
  padding:0;
}
#listen-feature .headline img{width:900px; max-width:90%; margin-bottom:20px;}
#listen-feature .btn{
  font-size: 26px;
  padding: 10px 20px;
  margin-top: 15px; 
  transition: all .2s ease-in-out;
}
#listen-feature .btn:hover{transform: scale(1.05);}
#listen-feature .btn i{margin-left: 10px;}

#listen-feature .btn.yellow{
  background-color:#F2C125;
  border-color:#F2C125;
}

.accent-bg{background: url(images/bg.jpg) top center no-repeat; background-size: auto 100%; padding-top: 50px;}


/* ARTICLES */
article{margin-bottom:20px;}
article header img{width:100%; height:auto;}
article .meta{font-size:12px; text-transform:uppercase; margin:10px 0;}
article .meta .fa{margin-right:3px;}
article .meta .spacer{padding:0 5px;}

/* POLLS */
article .meta.poll-date{background: #eee; padding: 10px; margin-bottom: 0; width: 100%;}
.sidebar-item .totalpoll-poll-container{background: #eee; padding: 10px;}
.sidebar-item .totalpoll-poll-container h4{font-size: 12px;}

/* HOME PAGE ARTICLES & LISTING PAGES */
.listing article{margin-bottom:30px; background:#fff; box-shadow: 0 0 2px rgba(0,0,0,0.3);}
.listing div.col-sm-6:nth-child(2n+1) {clear: both; }
.listing article section{padding:20px;}
.listing article h2{font-size:14px; line-height: 1.4; text-transform: uppercase; font-weight: 600; margin: 0;}
.listing article h2 a{color: #333; text-decoration: none;}
.listing article p{font-size: 14px;}
.listing .prev-next-posts{clear: both;}

/* SINGLE ARTICLES */
.single article{padding-bottom:20px;}
.single article header h1, .page-title{text-shadow: 1px 1px #f1f1f1; margin-bottom:20px; font-weight:900;}
.single article section{clear:both; background:#fff; padding:15px 30px;}
.single article .meta, .single article .share, .single article .share div{display:inline-block;}
.single article .meta{float:left;}
.single article .share{float:right;}
.single article .share .title{float:left; margin:6px 10px 0 0;}
.single article h1, .single article h2, .single article h3, .single article h4, .single article h5, .single article h6{font-weight:normal;}
.single article img{max-width: 100%; height: auto;}

.related{padding:15px 30px;}
.realted h3{font-weight: normal;}
.related article section{clear: initial;}
.related article h2{font-weight: 6                                    00;}
.related article .meta{float: initial;}

.wp-caption{width: auto !important;}
.wp-caption-text{font-size: 14px; font-style: italic; color: #999; padding-top: 5px;}


/* PAGINATION */
.prev-posts-link, .next-posts-link{display: inline-block;}

/* SPONSORS */
.sponsors h3{margin:0 0 20px 0; text-shadow: 1px 1px #f1f1f1;}
.sponsors img{border:1px solid #a39d91;margin-bottom: 20px;}

/* EVENTS WIDGET */
.tribe-events-calendar{background:#fff;}

.events-list{display:table ;width: 100%; box-shadow: 0 0 2px rgba(0,0,0,0.3);}
.events-list .event{ display:table-row; background:#372f2d; color:#fff;}
.events-list .event .event-date{
	display:table-cell;
	vertical-align:middle;
	width: 70px;
	min-height: 86px;
	text-align: center;
	padding: 10px 0;
	background:#337ab7;
	box-shadow: inset -3px 0 0 rgba(0, 0, 0, 0.1);
	border-bottom:1px solid #fff;
}
.events-list .event .event-date .day{font-size:26px; font-weight:900; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4); line-height:1;}
.events-list .event .event-date .month{display:block; line-height:1;}
.events-list .event .event-date .year{font-size:16px; font-weight:900; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4); line-height:1;}
.events-list .event .event-details{
	display:table-cell;
	padding: 15px;
	width: auto;
	border-bottom:1px solid #fff;
}
.events-list .event .event-details h5{margin:0;}

/* SIDEBAR */
.sidebar-item{margin-bottom:20px;}
.sidebar-item h3{margin-top:0;}
.sidebar-item img{box-shadow: 0 0 2px rgba(0,0,0,0.3);}

.awesome-weather-wrap, .fb-page{box-shadow: 0 0 2px rgba(0,0,0,0.3);}

.tribe-countdown-text{
  background: #fff;
  margin: 0 !important; 
  padding: 20px 20px 0 20px;
}
.tribe-countdown-time{
  background: #fff;
  padding: 10px 20px 20px 20px;
}

.totalpoll-poll-container .totalpoll-choices .totalpoll-choice{
	width: 100%;
}

/* SOCIAL ICONS */
#social{
	position:fixed;
	top: 200px;
	right: 0;
	z-index: 5000;
}

.social a{
	display: block;
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	color: #fff;
	background: #666;
	font-size:23px;
}
.social a:hover{color:#fff;}
.social a.facebook{background:#3b5998;}
.social a.twitter{background:#000;}
.social a.instagram{background:#ed4956;}
.social a.youtube{background:#ff0000;}

/* FOOTER */
.accent-bg{
	/* background:transparent url('/wp-content/uploads/2016/06/body-footer-bg.jpg') bottom center no-repeat; */
	background-size: 100% auto; 
	padding-bottom:40px;
}

#footer{
	background: #1e1918;
	color: #afadad;
	padding:40px 0;
}
#footer .container{padding:40px 0;}
#footer .logo img{max-width:200px;}
#footer h3{margin-top:0; font-weight:600;}

#footer ul{margin:0; padding:0; list-style:none;}
#footer ul li{
	float:left;
	width:48%;
	margin-right:1%;
}
#footer ul li a{
	display:block;
	padding: 10px 0;
	border-top:1px solid #373130;
	color:#afadad; 
	font-size:14px;
}

#footer .social a{float:left; margin-right:5px;}	

#copyright{
	background: #2f2826;
	color: #7e7b7b;
	padding: 20px 0;
	font-size: 12px; 
	text-transform:uppercase;
  font-weight: 600;
}
#copyright img{padding-right:10px;}
#copyright a{
	color: #7e7b7b;
}
#copyright .btn{color: #fff; margin-left: 10px;}


/* MISC */	
.clear{clear:both;}
.cf:before, .cf:after{content: " ";  display: table;}
.cf:after{clear: both;}
.cf{*zoom: 1;}

.alignleft{float:left; margin:0 30px 30px 0;}
.alignright{float:right; margin:0 0 30px 30px;}

.valign {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.btn-default{border:0 !important; padding:13px 20px !important; color:#175694 !important; border-radius:3px !important; font-weight:300 !important;}
.btn-sm.btn-default{padding:5px 10px !important;}
.btn-default span{margin-left:10px;}

.gform_confirmation_wrapper {
  color: #3c763d;
  background-color: #dff0d8;
  border-color: #d6e9c6;
  padding: 15px;
  margin-bottom: 20px;
  border: 1px solid transparent;
  border-radius: 4px;
}

.grecaptcha-badge{visibility: hidden;}
.captcha-notice{font-size: small; margin-top: 30px;}

/* Large Screen Sizes */
@media (max-width: 1200px){
  /* LISTEN LIVE */
  /* NOW PLAYING EDIT */
  #listen-live{
    /* width: 230px; */
  }
  #listen-live .title{
    font-size: 14px;
    padding: 0 50px 0 15px;
  }
	
}

/* Medium Screen Sizes */
@media (max-width: 992px){	
  
  #nav .container{position: relative; }
  #header #nav{box-shadow: initial;}
  #header #nav ul{
    display: none;
    height: auto;
    position: absolute;
    z-index: 4000;
    top: 69px;
    left: 0;
    width: 100%;
    box-shadow: 0 0 3px rgba(0,0,0,0.6);
  }
  #header #nav ul li:first-child{box-shadow: 0 0 -3px rgba(0,0,0,0.6);}
  #header #nav ul li, #header #nav ul li a{width: 100%; height: auto; display: block; align-items:initial; font-size: 14px;}
	
	.menu-toggle.btn-primary{margin: 18px 0 0 0; display: inline-block;}
  
  #listen-feature{min-height: 450px; font-size: 20px;}
  #listen-feature .headline{padding-left: 20px;}
  #listen-feature h1{font-size: 50px;}
  
  #footer{display: none;}
		
}


@media (min-width: 992px){	
  /* ADD FIXED WIDTH SIDEBAR */
  #sidebar {
      width: inherit;
      min-width: 320px;
      max-width: 320px;
      min-height: 100%;
      position:relative;
  }
  #content {
      width: calc(100% - 320px);
  }
  
}

/* Small Screen Sizes */
@media (max-width: 768px) {	
  
  #nav .container{width: 100%; padding: 0 0 0 20px;}
  
  #listen-live{width: auto;}
  #listen-live .title{margin: 0;}
  #listen-live .now-playing{display: none;}
	
}
 
/* X-Small Screen Sizes */
@media (max-width: 767px) {	
  #header #nav ul{display: none;}
  
  .sidebar-item{margin: 0 auto 20px auto; width: 300px;}
  
  .accent-bg{padding-top: 20px;}
	
	#copyright, #copyright .text-right{text-align: center;}
  #copyright .text-right{padding-top: 10px;}
	
}

@media (max-width: 580px) {	
  
  #listen-feature{
    min-height: 220px; 
    font-size: 11px;
    padding: 50px 0;
  }
  #listen-feature .container{width: 100%;}
  #listen-feature .headline{width: 70%;}
  #listen-feature h1{font-size: 22px; max-width: 240px;}
  #listen-feature .btn-lg{
    padding: 6px 12px;
    font-size: 14px;
    border-radius: 4px;
  }
  
  .listing .thumb{
    float: none;
    width: initial;
    min-width: initial;
    margin-right: initial;
    margin-bottom: 20px;
  }

}