@media only screen and (max-width: 1400px){
   #hero, .slide { height: 700px; }
   nav#main { font-size: 90%; }
   .wrap { width: 90%; }
   #body { padding: 2% 0; }
   footer { width: 100%; }
   #hero, #below { font-size: 90%; }
   #hompepage-promo-boxes { top: -2.5em; margin-bottom: -1em; } 
   h1 { font-size: 220%; }
   h2 { font-size: 180%; }
   h3 { font-size: 140%;} 
   h4 { font-size: 120%;}
}

@media only screen and (max-width: 1240px) {
   .logo, .logo img { max-height: 60px; width: auto; }
   nav .share { display: none; }
   nav#main { position: absolute; top: 5px; right: 0; }
   nav ul#menu li { display: none; }
   nav ul#menu li#top-menu { display: block !important; }
   nav ul#menu li#top-menu #top-dropdown li { display: block !important; }
   nav ul#menu li#top-menu  > a { color: white !important;  }
   nav ul#menu li#top-menu  > a:hover { color: white !important;  }

   #hero { }
   #below { font-size: 80%; padding: 1em 0; }
   #hompepage-promo-boxes { top: 0; margin: 1em 0 2em 0; }
   #below:before { display: none; }
   
   #content { width: auto; padding: 1em 0; }
   h1 { font-size: 200%; }
   h2 { font-size: 160%; }
   h3 { font-size: 130%;} 
   h4 { font-size: 110%;}
   #options { width: auto; padding-left: 3%;  margin-left: 3%; }
}

@media only screen and (max-width: 1000px) {
   footer .logo img { width: auto; }
   .flex-block { display: block; }
   .col, .col:first-child { display: block; width: 100%; margin: 0 0 2em 0; }
}

@media only screen and (max-width: 920px) {
   .slide { height: 400px; }
   nav#main { font-size: 90%; }
   nav#main ul li { margin-right: 0em; }
   #overview { display: block; }
   .partner-logo img { height: 90px; }
   #hero { height: auto; }
   #intro { position: relative; width: 100%; top: initial; height: auto; right: initial; }
   #intro .actions { position: relative; }
   #contact .left { margin: 0 0 2em 0; width: 100%; display: block; }
   #contact .right { background: #eee; padding: 5.0%; width: 90%; display: block; }
}

@media only screen and (max-width: 720px) { 
   header {  }
   .slide { height: 300px; }
   #body { display: block; padding: 1em 0; }
   #content, #options { width: 100%; display: block; margin: 0 0 2em 0; padding: 0; border: none; }
   #options { border-top: 1px #eee solid; padding: 2em 0 0 0; }
   .rightrail { display: block; width: auto; margin: 0 auto; padding: 1em; }
   #below .wrap { display: block !important; }
   form div.fields { width: 100%; }
   form li { display: block; width: 100% !important; margin: .2em 0 !important; }
   form div.submission { margin: 0; }
   #signup h2 { font-size: 80%; }
   h1 { font-size: 170%; }
   h2 { font-size: 140%; }
   h3 { font-size: 120%;} 
   h4 { font-size: 110%;}
   footer div { display: block !important; font-size: 90%; }
   footer .share { position: relative; top: 0; }
   footer .leftcol, footer .paidfor, footer .rightcol { display: block; width: 100%; text-align: center; margin: 0 0 1em 0; }
}

@media only screen and (max-width: 640px) { 
   #ticker .tick span.number { font-size: 500%; }
   #ticker .tick span.title { font-size: 120%; }
   #hero h2 { font-size: 160%; }
   #hero .button { font-size: 200%; }
   .social-right .button { font-size: 90% !important; }
   .actions-buttons { width: 100%; display: block; }
   .actions-buttons .button {font-size: 90% !important; display: block; width: 100%; padding: 1.5em 0; margin-bottom: 1em; }
   td { display: inline-block; }
   .slide { height: 250px; }
   #body { font-size: 90%; line-height: 1.2; }
   article li { margin-bottom: 0.5em; }
   .partner-logo img { height: 60px; }
   #hompepage-promo-boxes { display: block; margin: 1em 0; }
   #hompepage-promo-boxes article { width: 100% !important; height: 300px; }
   #hompepage-promo-boxes article:hover { 
      -webkit-box-shadow: none;
      box-shadow: none;
      -moz-transform: none;
      -webkit-transform: none;
      -o-transform: none;
      -ms-transform: none;
      transform: none;  }
   #mc_embed_signup .mc-field-group2, #mc_embed_signup .mc-field-group3 { width: 100% !important; margin: 0 0 .3em 0;}
   .resources-promos-grid { grid-template-columns: repeat(1, 1fr); grid-template-rows: repeat(4, 1fr); grid-row-gap: 1em;
   }
}

@media only screen and (max-width: 500px) { 
   .slide { height: 200px; }
   #ticker .tick { padding: 10px 0; width: 21.5%; border: 2px #6c9670 solid; border-radius: 10px;} 
   #ticker .tick span.number { font-size: 400%; }
   #ticker .tick span.title { font-size: 100%; }
   #body { font-size: 90%; line-height: 1.2; }
}

@media only screen and (max-width: 460px) { 
}
