@media only screen and (max-width: 1400px){
   #hero .control.back { left: -45px; }
   #hero .control.next { right: -45px; }
}

@media only screen and (max-width: 1305px){
   #hero .control.back { left: 0; }
   #hero .control.next { right: 0; }
}

@media only screen and (max-width: 1220px){
   header { width: 100%; }  
   #logo { left: 0; }
   nav#main { width: 100%; }
   nav#main ul { margin-left: 10px;}
   nav#main ul li a { font-size: 18px; padding: 12px 10px 10px 10px; }
   
   #hero { width: auto; }
   .slide a { width: auto; }
   #hero ul { top: 20px; left: 20px; }
   #hero .text.left { left: 20px; }
   #hero .text.right { right: 20px; }
   #hero .control { top: 60px; }  
   #hero .control.back { left: 0px; }   		
   #hero .control.next { right: 0px; }
   
   .below { width: auto; padding: 0 20px 20px 20px; }
   #tabs { width: auto; float: none; margin-right: 350px; }
   .actions { position: absolute; right: 20px; left: inherit; }
   #sidebar { width: 200px; }
   
   .promo-large { width: 200px; position: absolute; }
   .promo-large a { height: 200px; background-size: 200px; }
   .feed { width: auto; max-width: 700px; height: auto; float: none; padding: 10px; margin: 0 210px 0 210px; }
   .ui-tabs-panel { clear: none; }
   #home .feed { margin: 0; width: auto; height: auto; }
   #trending { margin: 0 210px !important; }
   #quicklinks { width: 180px; padding: 10px; }
   .promo-small { width: 200px; }
   .promo-small a { height: 90px; background-size: 200px; }
   
   #body { width: auto; padding: 15px; }
   #content { width: 65%; padding: 1em; }
   .wide #content { width: auto; }
   #options { }
   
   body#interior .promo-large { width: 250px; position: relative; }
   body#interior .promo-large a { height: 250px; background-size: 250px; }
   body#interior #quicklinks { width: 220px; padding: 15px; }
   #interior .feed { margin: 0; max-width: auto; }
   #interior .actions { position: inherit; }
   
   footer { width: auto; padding: 20px; font-size: 11px; }
   nav#footer ul li { max-width: 140px; padding-right: 20px; }
   nav#footer ul li a { height: 13px; font-size: 13px; }
   nav#footer ol, nav#footer ol li a { font-size: 11px !important; line-height: 11px !important; }
}
@media only screen and (max-width: 1170px){
   #utility-nav { top: 25px; right: 15px; }
   #utility-nav ul { text-align: right; }
   .search { float: right; margin: 0.5em 0; position: absolute !important; top: 1.5em; right: 0px; }
   #utility-nav ul li.members-only { display: table; right: 20px; }
   nav#main ul li a { font-size: 17px; padding: 12px 10px 10px 10px; }
   ul.tabs li { font-size: 15px; }
   ul.tabs li a { padding: 0px 10px; }
}

@media only screen and (max-width: 1080px){
   nav#main ul li a { font-size: 15px; padding: 13px 10px 9px 10px; }
   ul.tabs li { font-size: 14px; }
   ul.tabs li a { padding: 0px 5px; }
}

@media only screen and (max-width: 969px){
   header { height: 84px; border-bottom: 20px #ad2624 solid; }
   #logo { left: 5px; }
   #logo img { width: 280px; }
   #utility-nav { top: initial; bottom: -20px; width: 100%; right: initial; }
   #utility-nav ul li { display: none; }
   #utility-nav ul li.members-only { display: block; right: 0px; }
   #utility-nav ul li.members-only a { float: none; text-align: center; right: initial; top: initial;}
   nav#main { position: absolute; top: 0; width: auto; right: 0; }
   nav#main ul { margin: 0; }
   nav#main ul li { display: none; }
   nav#main ul li.nav-menu { display: block; float:right; margin: 1em; }
   nav#main ul li.nav-menu a { font-family: 'trilogyicons'; font-size: 48px !important; padding: .1em; -webkit-border-radius: 5px; border-radius: 5px; background: #fff;  color: #003659; height: 48px; }
   nav#main ul li.nav-menu a:hover, nav#main ul li.nav-menu a:active { color: #ad2624; }
   nav#main ol { right: 0; top: 50px; left: initial; width:250px; -webkit-box-shadow: -5px 5px 5px 0 rgba(0,0,0,.2); box-shadow: -5px 5px 5px 0 rgba(0,0,0,.2); }
   nav#main ol li { display: block; }
   nav#main ol li.hidden-menu a { font-family: "proxima-nova", sans-serif; font-size: 16px !important; height: 16px; background: #eee; border-radius: 0; -webkit-border-radius: 0; }
   #hero { height: 400px; }
   
   .slide { -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
   .slide.none { -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover }
   .slide a { width: 100%; height: 400px; } 
   #hero .text.left { width: 400px; padding: 1em; left: 5px; bottom: 20px; }
   #hero .text.center { width: auto; padding: 1em; margin: 0 5px; bottom: 20px; left: initial; }
   #hero .text.right { width: 400px; padding: 1em; right: 5px; bottom: 20px; }
   #hero ul { display: none; }
   #hero a h1 { font-size: 32px; }
   #hero a p { font-size: 18px; }
   #hero .button { margin: 0 1em; }
  
   .below { width: auto; padding: 0 5px 5px 5px; }
   #home .feed.news { margin: 0; max-width: none; }
   #featured { position: relative; width: auto; }
   #tabs { width: auto; float: none; margin-right: 245px; top: -5px; }
   #tabs #quicklinks { position: relative; clear:both; left: 0px;  width: auto; margin: 1em 0 0 .5em; }
   #tabs #quicklinks.wide { clear: both; min-width: none; position: relative; float: none;  margin: 1em 0 0 .5em;  }
   .actions { position: absolute; width: 240px; top: -5px; right: 5px; left: inherit; }
   #sidebar { width: 200px; }
   .feed { width: auto; max-width: 490px; height: auto; float: none; padding: 10px; margin: 0 210px 0 210px; }
   .feed.grid article { width: auto; height: auto; min-height: initial !important; }
   
   #id a { width: auto; }
   #id h1 { font-size: 2em; }
   #content { width: 60%; padding: 1em; }
   #options {  }
  
   nav#footer ul { display: none; }
   footer address, footer span.links { clear: both; float: none; margin: 0 auto; text-align: center; padding: .5em 0; }
   nav#footer .styled-select { display: block; background-color: #fff; }
   
   .below_bottom-items .promo-large { position: relative;  }
   .below_bottom-items #trending.feed { float: left; margin: 20px 0 0 0 !important; }
}

@media only screen and (max-width: 840px){
   #body { width: auto; padding: 0; }
   #content { padding: 1em; margin: 0; width: auto; }
   #options { position: relative; top: inherit; right: inherit; left: inherit; width: 100%; margin: 0; padding: 0; }
   #snav { float: left; width: 50%; margin: 1.5em 1em; }
   #snav h3 { padding-left: 10px; }
   #snav li a { background: rgba(0,0,0,.1); padding: 8px 5px 6px 10px; }
   #snav li a:hover, #snav li a:active { background: rgba(0,0,0,.2); padding: 8px 5px 6px 15px; }
   #snav li a:before { font-family: 'trilogyicons'; font-size: 16px; content: "" }
   #snav li a:after { font-family: 'trilogyicons'; font-size: 16px; content: " >" }
   body#interior .promo-large { float: right; margin: 1.5em 1em; }
   body#interior #quicklinks { display: none; }
   ul.tabs li { font-size: 13px; }
   #trending { margin: 0 245px 0 210px !important; }
}

@media only screen and (max-width: 800px){
   #tabs.simpleTabs { display:none; }
   .expander { display:block; } 
   #tabs { min-height: none; }
   .sidebox { width: auto; margin: 1em 0; float: none; }
   #trending { clear: both; margin: 0 245px 0 0 !important; }
}

@media only screen and (max-width: 660px){
   .slide { -webkit-background-size: 100%; -moz-background-size: 100%; -o-background-size: 100%; background-size: 100%; }   
   #hero .text.left, #hero .text.center, #hero .text.right { width: auto; padding: 1em; margin: 0 5px; bottom: 20px; left: initial; right: auto; text-align: center; }
   #hero ul { display: none; }
   #hero a h1 { font-size: 24px; }
   #hero a p { font-size: 16px; } 
   #hero .control { top: 40px; }
   
   #sidebar { position: relative; top: auto; right: 40px; clear: none; }
   #quicklinks, #promo-small { float: none; }
   #quicklinks { width: 220px; padding: 10px; margin-bottom: 5px; }
   #interior .actions { clear: both; }
   
   #join-the-political-fund { float:none; width: 98%; }
   
   .promo-small { width: 240px; }
   .promo-small a { height: 112px; background-size: 240px; }
   .feed { margin: 0 0 0 205px; }
   #interior .feed { margin: 0; max-width: auto; padding: 0; }
   
   #id a {  }
   #id h1 { font-size: 1.5em; }
   #id:hover h1:after { content: "" }

  .title li { margin: 0; }
  .title a { font-size: 12px; }
    
  #volunteer { width: 90%; }
  
  .below_bottom-items { width: calc(100% - 285px); text-align: center; }
  .below_bottom-items #sidebar, .below_bottom-items .promo-large, .below_bottom-items .promo-small { float: none; right: initial; left: initial; }
}

@media only screen and (max-width: 640px){
   #options { width: 100%; padding: 0; clear: both; position: relative; top: inherit; right: inherit; }
   #snav { float: none; width: auto; padding: 0; margin; 0; }
   body#interior .promo-large { float: left; clear: both; margin: 1em; }
   .expander-header h2 { font-size: 14px; }
   #full-map-big { display: none; }
   .below_bottom-items { padding: 0; width: 100%; -webkit-box-shadow: 0; box-shadow: 0; }
}

@media only screen and (max-width: 500px){
  #hero { height: 170px; }
  .slide a { width: 100%; height: 170px; } 
  #hero .text.left, #hero .text.center, #hero .text.right { width: 100%; padding: 1em 0 1.5em 0; margin: 0; bottom: 0; left: initial; right: auto; text-align: center; }
  #hero a h1, #hero .text h1 { font-size: 24px; margin: 0 0 7px; }	
  #hero a p { display: none; }
  
  .below { width: auto; padding: 0; }
  
  #tabs { display: block; width: 100%; margin: 0; float: left; clear: both; top: 0;  -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none;}
  .expander { padding: 2px 0 2px 0; }
  .expander-header h2 { font-size: 18px; }
  .actions { display: block; width: 100%; position: relative; top: 0; left: 0;  -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-align: center; }
  article.action { text-align: left; }
  #sidebar { display: block; background: #fff; position: relative; top: 0; left: 0; float: left; clear: both;  width: 100%;  -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none;}
  #quicklinks { width: 100%; padding: 0; margin: 0; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none;}
  #home #quicklinks.module { padding: 1em 0; float: left; width: 100%; text-align: center; }
  #home #quicklinks.module h2 { font-size: 22px; }
  .styled-select { width: 90%; float:none; }
  .promo-small { background: #b4b4b4; width: 100%; display: block; position: relative; top: 0; left: 0; padding: 1em 0;  -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none;}
  .promo-small a { width: 250px; height: 120px; margin: 0 auto; }
  .promo-large { display: none; }
  .feed { display: block; position: relative; top: 0; left: 0; margin: 0 auto; padding: 1em; float: left; clear: both; width: auto; background: none;  -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none;}
   #trending { clear: both; margin: 0 !important; }

   body#interior .promo-large { width: 250px; position: relative; display: block; }
   body#interior .promo-large a { height: 250px; background-size: 250px; }
   
   footer { margin: 5px 0 0 0; }
   footer h2 { font-size: 20px; }
}

@media only screen and (max-width: 400px){
   #logo { left: 5px; top: 5px; }
   #logo img { width: 225px; }
   #hero { height: 170px; }
   .slide a { width: 100%; height: 170px; } 
   .half { clear: both; padding: 0; float: none; width: auto; margin: 0 0 1em 0; }
   .half.right { width: auto; float: none; }
   img { max-width: 300px !important; }
}