/*========================================================
global adjustments 
==========================================================*/
:root {
  --klrn-primary-dark: #014452;
  --klrn-primary: #247182;
  --klrn-primary-lightest: #F4F4F4;
  --klrn-donate: #d7594a;
  --klrn-donate-text: #ac031f;
}

html {
  height: 100%;
}
body {
  min-height: 100%;
  display: flex;
  flex-direction: column;
}
body {
  font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* overrides [class*="span"] style that messes with some classes added to body, such as "hispanic" */
body {
  float: none !important;
  margin-left: 0px !important;
}

body,
.station-header .menu__ul.navbar-nav .menu__li > .menu-item,
.station-header .menu__ul.navbar-nav .menu__li > .menu-item:hover,
.station-header .menu__ul.navbar-nav .menu__li > .menu-item:focus,
#component-bab3ce50-d94b-11e7-854c-b3ea37ebaa13
  .footer-wrapper.light
  .links-column
  .column-header,
#component-bab3ce50-d94b-11e7-854c-b3ea37ebaa13
  .footer-wrapper.light
  .footer-details,
#component-bab3ce50-d94b-11e7-854c-b3ea37ebaa13
  .footer-wrapper.light
  .footer-details
  *,
.blog-entry-container .blog-entry-title,
.blog-entry-container .blog-entry-content,
.blogEntry__24_Rs .title,
.blogEntry__24_Rs .title *,
.blogEntry__24_Rs .content-body {
  color: #474747;
}

header,
footer {
  flex-shrink: 0;
}
.station-header .station-header-logo img {
  max-width: 152px;
  max-width: 140px;
}
main {
  flex-grow: 1;
}
main .component,
.content .component,
footer .component {
  margin-top: 2.6rem;
}

.content .component .filer-image-container {
  display: block;
}
.content .component .filer-image-container .filer-image {
  width: 100%;
}
.section-header-component.underline .section-header-value {
  margin: 0 16px;
}
.section-header-component.underline .section-header-value .text-input {
  margin-top: -0.9vw;
  margin-top: 3rem;
  margin-bottom: 0;
}

ul,
ol {
  margin-bottom: 18px;
}
ul li,
ol li,
.text-container ul li,
.text-container ol li {
  line-height: 1.625;
}

cite {
  display: inline-block;
  margin-left: 2.5em;
  margin-right: 2.5em;
}

.promo-container .promo .read-more__link,
.schedule .schedule__tz-va p a,
.text-container .read-more__link,
.klrn_button.read-more__link {
  font-style: italic;
}

.section-header-component.underline .h2_tag .text-input {
  border-bottom-width: 2px;
}
.section-header-component .section-header-value .text-input {
  font-weight: 300 !important;
}

@media (max-width: 375px) {
  main .component,
  .content .component,
  footer .component {
    margin-top: 2.6rem;
  }
}

.station-header.menu--navbar-nav {
  z-index: 2;
}
.station-header .menu__ul.navbar-nav .menu__li.highlight {
  background-color: var(--klrn-donate);
}
.station-header .menu__ul.navbar-nav .menu__li.highlight .menu-item {
  color: #fff;
  font-weight: bold;
}

.station-header .menu__ul.navbar-nav .menu__li.highlight:hover,
.station-header .menu__ul.navbar-nav .menu__li.highlight:focus {
  background-color: var(--klrn-primary-lightest);
}
.station-header .menu__ul.navbar-nav .menu__li.highlight .menu-item:hover,
.station-header .menu__ul.navbar-nav .menu__li.highlight .menu-item:focus {
  color: var(--klrn-donate-text);
}

.section-header-component .section-header-value.h1_tag .text-input,
h1,
.section-header-component .section-header-value.h2_tag .text-input,
h2,
.section-header-component .section-header-value.h3_tag .text-input,
h3 {
  margin: 0.1em 0 16px 0;
  font-weight: 300;
}

.section-header-component .section-header-value.h1_tag .text-input,
.section-header-component .section-header-value.h2_tag .text-input,
.section-header-component .section-header-value.h3_tag .text-input {
  margin: 0 0 12px 0;
  margin: 0;
}

.section-header-component .section-header-value.h1_tag .text-input,
h1 {
  font-size: 2.8rem;
}

.section-header-component .section-header-value.h2_tag .text-input,
h2 {
  font-size: 2.4rem;
}
.section-header-component .section-header-value.h3_tag .text-input,
h3 {
  font-size: 2rem;
}

.promo {
  padding: 16px;
}
.promo-container .promo .promo-link img {
  width: 100%;
}
.promo-container .promo .promo-text {
  padding: 12px 0 4px 0;
}
.promo-container .promo .promo-text .description {
  font-weight: 400;
}
.promo-container .promo .read-more__link,
.promo-container .promo .read-more--no-link {
  margin-top: 4px;
}

/* fix section header component */
.section-header-component .section-header-value {
  font-weight: 300 !important;
}

.section-header-component.underline h2 {
  border-bottom-width: 2px;
  line-height: 1.45;
}

/* fix promo w/date margin */
article > div.promo-text.span6 > p.channel {
  margin: 12px 0 !important;
}

@media (min-width: 768px) {
  .promo-container.horizontal .promo .promo-text {
    margin-top: -14px;
    padding-top: 0;
    padding-left: 16px;
  }
  .promo-container.horizontal .promo .promo-link {
    width: 40%;
  }
  .promo-container.horizontal .promo .promo-text {
    width: 60%;
  }
}

@media (min-width: 1025px) {
  .station-header .menu__ul.navbar-nav {
    margin-right: 0;
  }
  .station-header .menu__ul.navbar-nav .menu__li.highlight {
    border: 2px solid #fff;
    margin-right: 2px;
    border-width: calc(2px * (1 / 0.9)); /* adjust for 90% zoom */
  }  
  .station-header .menu__ul.navbar-nav .menu__li.highlight:hover,
  .station-header .menu__ul.navbar-nav .menu__li.highlight:focus {
    border-left: 1px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
    margin-left: 1px;
    margin-right: 3px;
  }
  .station-header .menu__ul.navbar-nav .menu__li.highlight a {
    position: relative;
    top: -2px;
  }
  .submenu {
    padding: 0.6em 0;
  }
}

@media (max-width: 1279px) {
  .station-header .station-header-logo {
    padding: 0 16px 0 0;
  }
}

@media (min-width: 1280px) {
  .station-header .station-header-logo {
    padding: 0 16px;
    padding: 0 16px 0 0;
  }
  .station-header .station-header-search .menu-search-icon {
    padding-right: 0;
  }
}

@media (min-width: 1312px) {
  .section-header-component.underline .section-header-value {
    margin: 0;
  }
}

/*================================================== 
nav search button 
==================================================*/

@media (min-width: 1312px) {
  .station-header .station-header-search {
    width: 35px;
  }
}

/*========================================================
fix text and some other items bumping viewport edge in mobile 
==========================================================*/

@media (max-width: 1311px) {
  nav#c33ef9a0-d91e-11e7-8b84-67caa8590abc .menu-container {
    padding: 0 0 0 16px;
  }

  .klrn_podcast_embed,
  .blogRiver__2-Wjj {
    padding: 0 16px;
  }

  main
    > .row-fluid
    > .container
    > .content-wrapper
    > .row-fluid
    > .container
    > .span12
    > .component
    > .filer-image-container
    > img {
    padding: 0 16px;
  }

  #component-c33ef9a0-d91e-11e7-8b84-67caa8590abc .menu__trigger {
    margin-left: 12px;
    border: none;
  }

  .video-container__wrapper {
    padding: 16px 16px 0;
    background-color: var(--klrn-primary-lightest);
  }
  .video-component .video-container {
    min-height: auto;
  }
  .video-component .video-info {
    padding: 16px 0;
  }

  .klrn_youtube_playlist[data-klrn-show-lines='0'] .video-container__wrapper,
  .klrn_youtube_video[data-klrn-show-lines='0'] .video-container__wrapper {
    padding-bottom: 16px;
  }
}

@media (min-width: 1024px) and (max-width: 1311px) {
  .rail-wrapper.pull-right > .row-fluid > .container > .span12 > .component {
    margin-right: 16px;
  }
}

main
  > .row-fluid
  > .container
  > .content-wrapper
  > .row-fluid:first-child
  > .container
  > .span12
  > .component
  > .filer-image-container
  > img {
  padding: 0;
}

.rail-wrapper.pull-right
  > .row-fluid
  > .container
  > .span12
  > .component:first-child {
  margin-right: 0;
}

/*========================================================
text containers 
==========================================================*/

/*
.text-container {line-height: 1.6;}
.text-container img, .text-container .text-component-img-wrapper {margin-bottom: 2.5rem;}
*/

.text-container {
  padding-bottom: 0 !important;
}
@media (min-width: 1312px) {
  .text-container {
    padding: 0 !important;
  }
}

.text-container p:last-child,
.text-container ul:last-child {
  margin-bottom: 0;
}

.text-container .image {
  margin-top: 0;
}
.text-container .image.image-style-align-left,
.text-container .image.image-style-align-right {
  margin-top: 6px;
  margin-top: 8px;
}
.text-container .image.image-style-align-left {
  max-width: 40%;
}

.text-container .image-style-align-left.klrn_text_container_mobile_image_block,
.text-container
  .image-style-align-right.klrn_text_container_mobile_image_block {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
  margin-bottom: 24px;
  text-align: center;
}

.text-container
  .image-style-align-left.klrn_text_container_mobile_image_block
  > img,
.text-container
  .image-style-align-right.klrn_text_container_mobile_image_block
  > img {
  width: 100%;
}

hr {
  clear: both;
  margin: 12px 0 12px;
  border-top: 2px solid #eee;
  display: inline-block;
  width: 100%;
}
hr:first-child {
  margin-top: 16px;
}
hr:last-child {
  margin-bottom: 0;
}

/*========================================================
nav tabs
==========================================================*/

.nav {
  margin: 0 15px 3px;
}
@media (min-width: 768px) {
  .nav {
    margin-bottom: 0;
  }
}

@media (min-width: 1024px) {
  .nav {
    margin: 0 7px;
  }
}

.nav-tabs > li > a {
  font-size: 1.6rem;
  border: 1px solid #ddd;
}
.nav-tabs > .active > a,
.nav-tabs > .active > a:hover {
  background-color: var(--klrn-primary);
  color: #fff;
}
.nav-tabs > .active > a:focus {
  text-decoration: none;
}

/*========================================================
manage how and when promo boxes display
==========================================================*/

main.content .span12.column-12 .promo-container.vertical,
main.content .span8.column-8 .promo-container.vertical,
main.content .span6.column-6 .promo-container.vertical,
main.content.content-with-rail .span3.column-3 .promo-container.vertical,
main.content.content-with-rail .span6.column-6 .promo-container.horizontal,
main.content .promo-container.horizontal {
  display: none;
}

main.content.content-with-rail .span12.column-12 .promo-container.horizontal {
  display: block;
}

@media (min-width: 1280px) {
  main.content
    #layout-ba6653c8-7257-4172-ad4f-5cbb0383f9f4
    .promo-container.vertical
    p.description,
  main.content.content-with-rail .promo-container.horizontal p.description {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
  }

  main.content .promo-container.vertical p.description {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
  }

  main.content.content-with-rail .promo-container.vertical p.description {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
  }
}

/*========================================================
rss feeds
==========================================================*/

.rss-feed .articles li .item-image {
  margin-top: 4px;
}
.rss-feed .articles li .item-image + .item-description {
  margin-left: 160px;
}
.rss-feed .articles li .item-description {
  margin-bottom: 10px;
}
.rss-feed h2 {
  margin: 0.2em 0 0.7em 16px;
}
.rss-feed .articles li h3 {
  margin: 0.1em 0 0.5em 0;
}

@media (min-width: 1312px) {
  .rss-feed h2 {
    margin-left: 0px;
  }
}

/*========================================================
poster grid module
==========================================================*/

/* global grids */
ul.posters {
  margin-bottom: 0;
}
.poster-grid img:hover {
  opacity: 0.85;
}
.poster-grid .row-fluid [class*='span'] {
  min-height: initial;
}

@media (min-width: 768px) {
  .poster-grid .posters > .poster {
    margin-bottom: 8px;
  }
}

@media (max-width: 767px) {
  .poster-grid.column-12 .poster {
    margin-right: 0;
    margin-left: calc(6.5% / 2);
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .poster-grid.column-12 .poster {
    margin-right: 0;
    margin-left: calc(8% / 4);
  }
}

@media (min-width: 992px) {
  .poster-grid.column-12 .poster {
    margin-right: 0;
    margin-left: calc(8.5% / 6);
  }
}

/*========================================================
sponsor logos component 
==========================================================*/

.sponsor-logos-component {
  padding: 0;
}
.sponsor-logos-component .logos {
  padding: 0;
}
ul.logos {
  margin: 0;
}
.sponsor-logos-component .logos .logo-container {
  width: auto;
  height: auto;
  margin: 0 32px 16px;
  padding: 0;
}
.sponsor-logos-component .logos .logo-container .logo-img {
  max-height: none;
}

/*========================================================
video player embed
==========================================================*/

.video-component .video-info .title {
  margin: 0;
  line-height: 1.625;
  font-weight: 400;
}

.video-component .video-info .channel,
.video-component .video-info .description {
  display: none;
}

/*========================================================
KLRN podcast embed
==========================================================*/

.klrn_podcast_embed {
  margin: 0;
  text-align: center;
}

/*========================================================
constant contact signup forms
==========================================================*/

.scigirls
  main.content:not(.content-with-rail)
  > .row-fluid
  > .container
  .content-wrapper
  .container:not(.full-width),
.signup
  main.content:not(.content-with-rail)
  > .row-fluid
  > .container
  .content-wrapper
  .container:not(.full-width) {
  max-width: 980px;
}

.scigirls h1,
.signup h1 {
  padding-top: 0;
  margin-bottom: 15px !important;
}

.scigirls h3,
.signup h3 {
  padding-top: 0;
  margin: 15px 0 25px !important;
  font-weight: bold;
}

.scigirls form p:nth-child(2),
.signup form p:nth-child(2) {
  margin-bottom: 30px !important;
}

.scigirls label,
.signup label {
  font-size: 16px;
}

.scigirls input,
.scigirls select,
.signup input,
.signup select {
  font-size: 100%;
}

.scigirls input,
.signup input {
  height: auto;
  font-size: 100%;
}

.scigirls input[type='checkbox'],
.signup input[type='checkbox'] {
  margin: 3px 3px 3px 4px;
  vertical-align: baseline;
}

.scigirls .ctct-custom-form .ctct-form-footer,
.signup .ctct-custom-form .ctct-form-footer {
  font-size: 14px;
}

.scigirls #success_message,
.signup #success_message {
  display: block;
  margin: 20px auto 30px;
  font-size: 20px;
}