/*if css3*/
@media screen and (min-width: 0px) {

  .zone {width: auto; max-width: 1000px;}
  html {overflow-x: hidden;}

}

/*over base size*/
@media screen and (min-width: 1280px) {

  .zone {width: auto; max-width: 1130px;}
  .preview {font-size: 1.1em;}
  .preview-large {font-size: 1.3em;}


}


/*under base size*/
@media screen and (max-width: 1000px) {

  #logo {width: 226px; background-position: right 0;}

  

  #search-container {width: 261px; padding: 13px 20px 13px 15px; }
  #search-container input {height: 36px; font-size: 14px;}
  #search-container button {position: absolute; top: 0; right: -5px; padding: 0; width: 60px; background: #2461AF; -moz-border-radius: 0 4px 4px 0; -webkit-border-radius: 0 4px 4px 0; border-radius: 0 4px 4px 0; height: 36px}
  

    
  /*.preview-sponsor {position: relative; margin: -.15em 0 0 .25em; }
  .preview-large .preview-sponsor {position: absolute; margin: .5em 0 0; }*/
  
  
  .tv-show-location {width: 33.33%;}
  
  
  
}


@media screen and (max-width: 870px) {

  #header {height: auto;}
  #nav-toggle {display: block; width: 42px; height: 0; overflow: hidden; padding: 42px 0 0; background: url(images/nav_toggle.png) no-repeat; float: right; margin: 10px 0 0; cursor: pointer; position: relative;}
  
  .nav-on {background: #123664;}
  .nav-on body {position: relative; left: -250px;}
  .nav-on #nav-toggle {opacity: .5; right: -20px;}
  .nav-on #nav-group {display: block;}
  
  .nav-on #logo,
  .nav-on #content,
  .nav-on #footer {opacity: .2; pointer-events: none;}
  
  #nav-group {display: none; width: 250px; position: absolute; top: 0; right: -250px; z-index: 1000; padding-top: 42px;}
  
  #nav-alpha {background: none; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; padding: 0; border-radius: 0;}
  
  #nav-categories > ul > li {float: none;}
  #nav-categories > ul > li > a {color: #fff; padding: .5em 1em;}
  #nav-categories > ul > li:hover > a {opacity: 1}
 
 #nav-categories > ul > li.parent:after {display: none!important;}

  #nav-categories > ul ul {display: block; position: static; border-radius: 0; box-shadow: none; width: auto; margin: 0; background: #fff; text-align: left;}
#nav-categories > ul ul li {border-top: 1px solid rgba(0,0,0,.1);}

#nav-categories > ul ul li a {display: block; color: #222; padding: .25em 1em;}
#nav-categories > ul ul li a:hover {background: rgba(0,0,0,.1);}
  
  #nav-beta {position: static;}
  
  
  
#nav-utility {padding: 0; margin: 0 0 20px; }
#nav-utility ul {text-align: center; font-size: 1em; border-top: 1px solid rgba(255,255,255,.1);}
#nav-utility li {display: block; border-bottom: 1px solid rgba(255,255,255,.1);}
#nav-utility li:after {display: none;}
#nav-utility li a {display: block; color: #fff; padding: .5em;}
#nav-utility li a:hover {text-decoration: none; color: #4995D3;}

#nav-utility li#nav-mailing-list {margin: 0;}
#nav-utility li#nav-mailing-list a {background: none; color: #fff; padding: .5em; border-radius: 0;}
#nav-utility li#nav-mailing-list a:hover {background-color: transparent; color: #4995D3}

  #nav-utility li#nav-search {position: absolute; top: 5px; left: 5px;}


#socials {position: static;}  
  
  
  
  
  #search-container {top: 0; left: 0; right: 0; height: 55px; padding: 10px 15px 10px 10px; display: block; width: auto;}
  #search-container input,
  #search-container button {height: 35px; font-weight: normal; font-size: 13px;}
  
  #search-container button {width: 35px; height: 35px; padding: 0; text-indent: -9999px; background-image: url(images/nav_search.png); background-size: 100% auto;}
  
  #nav-search a {display: none!important;}
  
  
  
  
  #email-container,
  #categories-container {position: static; width: auto; margin-left: 0; display: none!important; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; background: #0D284A; }

  #email-container ul,
  #categories-container ul {padding: 0;}
  
  #email-container ul li,
  #categories-container ul li {display: block; width: auto; padding: 0; text-align: left}
  
  #email-container ul li a,
  #categories-container ul li a {overflow: hidden; padding: 10px; }
  
  #email-container ul li a:hover,
  #categories-container ul li a:hover {background-color: #3784E7;}
  
  #email-container ul li a img,
  #categories-container ul li a img {display: block; width: 42px; margin: 0 1em 0 0; border: 0; float: left;}

  #email-container ul li a h3,
  #categories-container ul li a h3 {font-size: .9em; margin: 1em 0 0; }


  .categories-on > a {background-color: #3784E7!important; -moz-box-shadow: none!important; -webkit-box-shadow: none!important; box-shadow: none!important; z-index: 10001}
  .categories-on #categories-container {display: block!important;}

  .email-on > a {background-color: #3784E7!important; -moz-box-shadow: none!important; -webkit-box-shadow: none!important; box-shadow: none!important; z-index: 10001}
  .email-on #email-container {display: block!important;}




  
  #nav-beta {background: none; padding: 0; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none;  text-align: center;  background: #0d284a; padding: 1em 0 1.2em}
  
  #utility {float: none; line-height: auto; padding: 0 0 1em;}
  #utility ul li {display: block;}
  #utility ul li a {padding: 0; color: #fff; font-size: 1.2em; padding: .25em;}
  
  #socials {float: none;}
  #socials > ul > li.social-d {display: block; margin: 0 0 15px;}
  #socials > ul > li > a {width: 32px; padding: 32px 0 0; display: inline-block; margin: 0 0 5px;}
  

.social-dropdown {position: static; display: block; padding-top: 0;}
.social-dropdown:before {display: none;}
.social-dropdown ul {background: none; padding: 0;  -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none;}
.social-dropdown a {white-space: inherit; background: none!important; padding: 0; font-size: .9em;}
  .social-dropdown a:before {content:""; display: inline-block; width: 0; height: 0; border-left: 1em solid #3784E7; border-top: 1em solid transparent; border-bottom: 1em solid transparent; font-size: .35em; vertical-align: middle; margin: -.7em 1.5em 0 0}
  
  
  
  
  #content {padding-top: 6px;}
  

  #footer {text-align: center; padding: 30px 0;}
  #copyright {float: none;}
  #copyright-meta {border-top: 1px solid #5195d3; margin: 2em 0}
  #copyright-meta li {display: block; padding: 0; font-size: 1.2em; border: 0; border-bottom: 1px solid #5195d3}
  #copyright-meta li a {display: block; padding: 1em;}
  
  #footer-meta {float: none;}
  
  .col-a, .col-b {float: none!important; width: auto!important; padding: 0!important; margin: 14px 0 0;}
  .col-a:first-child, .col-b:first-child {margin: 0;}
  
  .advertisement {max-width: 364px; margin: 0 auto 14px;}
  .column-previews .advertisement {max-width: none;}
  
  .column-previews {margin: 0 7px;}
  .column-previews:after {content:""; display: table; clear: both;}
  .column-previews .preview {width: 50%; display: inline-block; vertical-align: top; float: left;}
  
  .column-previews .section-header {margin-left: -7px; margin-right: -7px;}
  .column-previews .preview:nth-of-type(odd) {left: -7px;}
  .column-previews .preview:nth-of-type(even) {right: -7px;}
  
  .preview-alt {width: 100%; font-size: 1.1em;}
  
  /*.preview-sponsor {position: absolute; margin: .5em 0 0; }*/

  
  
  
  
  .layout-featured-triple .layout-featured-block {width: 50%;}
  
  
  #photos-listing li {width: 48%;}
  
  

  
      /*<><><> syndicate <><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><>*/

      #marketing-header {display: none;}
      .marketing-video h3 {text-align: left;}
  
  

}

  
  
@media screen and (max-width: 750px) {


  
  
  .advertise-block {display: block;  width: auto; margin: 1.5em 0 0; padding: 1.5em 0 0; border-top: 1px solid #eee;}

  .advertise-block h2 {margin-top: 0;}
  
  
  .category-billboard-title {position: static; background: #fff; margin: 0; padding: 1.2em 1.2em .5em }
.category-billboard-title h1 a {color: #151515;}  
.category-billboard-title h1 {color: #151515; margin: 0; padding: 0}
  
  .category-blurb {padding-top: 0;}
  .category-blurb p {font-size: 1em;}
  
  /*
  .category-billboard-title.no-blurb {border-bottom: 2px solid #e3e3e3; padding: 1em 0; margin: 0;}
  .category-billboard-title.no-blurb h1 {margin: 0;} 
  */
  
  .breadcrumbs {border-top: 1px solid #eee;}
  
  .contact-trifecta {margin: 0; padding: 0; border: 0;}
  .contact-trifecta ul li {float: none; width: auto; text-align: left; margin: 0 0 1em; padding: 0 0 1em; border-bottom: 1px solid #eee; position: relative; padding-right: 90px; overflow: hidden;}
  .contact-trifecta ul li img {width: 150px; position: absolute; top: 0; right: -30px;}
  .contact-trifecta p {padding: 0;}
  .contact-trifecta h3 {margin: 0 0 .5em;}
  
  
  .course-3-col .course-block {width: 50%;}

.category-billboard-icon {position: absolute; top: .5em; left: .5em;}
  
  
  .banner-ad .md {display: block!important;}
  .banner-ad .lg {display: none!important;}
  
  .tv-show-location {width: 50%;}
  
  
  
  





  
  

}

@media screen and (max-width: 700px) {

  .preview-alt {font-size: 1em;}
  
  /*.preview-sponsor {position: relative; margin: -.15em 0 0 .25em; }*/
  
  
  .category-billboard-title h1,
  .section-header h2 {font-size: 1.8em}
  
  
  
  

  #search-results-form input#search {width: 100%!important; padding: 0 .5em!important;}
  #search-results-form button {margin: 0; width: 90px; position: absolute; top: 0; right: 0;}

  #search-results-form label {display: inline; vertical-align: middle;}

  .search-field {padding-right: 100px; position: relative;}
  
  
  
  #radio-states {text-align: left;}
  #radio-states select {width: 100%; margin: .25em 0;}
  #radio-stations {width: auto;}
  #radio-stations tr {display: block; border-bottom: 1px solid #eee;}
  #radio-stations tbody {display: block;}
  #radio-stations tr:nth-child(even) {background: #eee;}
  #radio-stations tr td {display: block; border: 0;}
  #radio-stations .state-header {width: 10%; font-size: 1.8em; padding: 1em 0 .5em}
  #radio-stations .state-col {float: left; width: auto; font-weight: bold}
  #radio-stations .city-col {float: left; width: auto; font-weight: bold;}
  #radio-stations .call-col {float: left; width: auto; clear: both;}
  #radio-stations .station-col {float: left; width: auto; }
  #radio-stations .info-col {width: auto; clear: both;}
  

}





@media screen and (max-width: 650px) {




}


@media screen and (max-width: 600px) {
  

  

  .zone {padding: 0 15px;}
  .nav-on #nav-toggle {right: -15px;}
  
  
  
  
  .advertisers-image {width: 49%;}
  
  .share {position: static; float: right;}
  
  .share-button-icon {margin: 8px 0 0 5px; height: 16px; width: 24px; background-size: cover; float: left;}
  .share-button {line-height: 34px; height: 34px; width: 84px;}
  
  .story-info {min-height: 0; padding: 0;}
  
  .vip-coming-soon h1 {font-size: 2em;}

  
}


@media screen and (max-width: 540px) { 
  

  .column-previews {margin: 0;}
  .column-previews .preview {width: 100%;}
  .column-previews .section-header {margin-left: 0px; margin-right: 0px;}
  .column-previews .preview:nth-of-type(odd) {left: 0px;}
  .column-previews .preview:nth-of-type(even) {right: 0px;}

  
  .layout-featured-triple .layout-featured-block,
  .layout-featured-block {width: 100%;}
  
  .preview-alt,
  .preview-default {font-size: 1.1em; overflow: hidden;}

  /*.preview-sponsor {position: absolute; margin: .5em 0 0; }*/
  
  .story-details #billboard-text h2,
  .category-billboard-title h1,
  .section-header h2 {font-size: 1.6em} 
  
  
  
  .course-2-col .course-block,
  .course-3-col .course-block {width: 100%;}
  
  
  
  #photos-listing li {width: 98%;}
  
  .tv-show-location {width: 100%; text-align: center;}
  
  
  
      /*<><><> syndicate <><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><>*/


.marketing-quote {padding-left: 0; padding-right: 0;}
.marketing-quote:before {top: 5px;}
  
  .marketing-quote-pager {position: static; text-align: center;}
  .marketing-quote-pager span {display: inline-block; float: none; width: 1em; padding: 1em 0 0;}
  
  .marketing-videos-wrapper {padding: 0;}
  .marketing-videos-wrapper:after {content:""; display: table; clear: both;}
  
  .marketing-videos-wrapper .cycle-prev,
  .marketing-videos-wrapper .cycle-next {position: static; background: #2461AF; width: 50%; border: 0!important; height: auto!important; margin: 0; text-align: center; color: #fff; font-weight: bold; padding: .5em 0; }
  
  .marketing-videos-wrapper .cycle-prev:hover,
  .marketing-videos-wrapper .cycle-next:hover {background-color: #5195D3;}
  
  
  .marketing-videos-wrapper .cycle-prev {float: left; border-right: 1px solid #000!important;}
  .marketing-videos-wrapper .cycle-prev:before {content:""; display: inline-block; width: 0; height: 0; border-top: 1em solid transparent; border-bottom: 1em solid transparent; border-right: 1em solid #fff; font-size: .35em; margin: 0 1em;}
  .marketing-videos-wrapper .cycle-next {float: right;}
  .marketing-videos-wrapper .cycle-next:after {content:""; display: inline-block; width: 0; height: 0; border-top: 1em solid transparent; border-bottom: 1em solid transparent; border-left: 1em solid #fff; font-size: .35em; margin: 0 1em;}

  

  
  
/*<><><> articles <><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><>*/
   
.articles-photo {width: 100%; padding: 0; margin: 0 0 10px;}

.articles-body {margin-left: 0; padding-left: 0;}
  
  
  
}

  
@media screen and (max-width: 470px) {


  .advertisers-image {width: 100%;}
  
  .banner-ad .md {display: none!important;}
  .banner-ad .sm {display: block!important;}

.banner-ad .sm a {display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 49.5%; background: rgba(0,0,0,0);}
.banner-ad .sm a:first-child {top: 0; bottom: auto;}


   
}



@media screen and (max-width: 400px) {

  .preview-alt,
  .preview-default {font-size: 1em; overflow: hidden;}
  
  
  #search-results-form {background: none; padding: 0; border: 0; overflow: hidden;}

  
}

@media screen and (max-width: 380px) {

  /*.preview-sponsor {position: relative; margin: -.15em 0 0 .25em; }*/

}