/* Section ID
------------------------------------ */

#id {
    background: repeat-x center top transparent;  
    text-align: left;
    margin-bottom: 5px;
    }

#id a { display: block; }

#id h1 {
    margin: 0 auto;
    font-size: 1em;
    text-transform: uppercase;
    color: #ea371a;
    line-height: 1;
    font-weight: normal; 
    }

  

  
  
/* Meta
----------------------------- */ 

.meta { 
  border-bottom: 1px solid #fdfdfd; 
  padding: 0 0 10px;
  margin-bottom: 15px; }

.meta small {
  font-size: 10px;
  line-height: 1;
  text-transform: uppercase; }  

.meta h2 { line-height: 1; }


/* Photo with INSET Shadow
----------------------------- */ 

.header-image {
  display: block;
  width: 100%;
  margin-bottom: .75em;
  } 

.header-image img {
  width: 100%;
  }  
     


/* Photo with INSET Shadow
----------------------------- */ 

.photo {
  display: block;
  width: 100%;
  } 
  
@media (min-width : 960px) { 
  .photo {
    width: auto;
    float: right;
    margin: 0 0 1.5em 1.5em; 
    max-width: 45%;
    } 
  }

.photo img {
  width: 100%;
  }  
     

    
    
/* Expander 
--------------------------------------------------- */

.expander { margin: 0 0 5px; }

.expander-header { 
    cursor: pointer;
    padding: 10px 0;
    display: block;  
    }

.expander-header h2 {
  font-size: 1.3em;
  line-height: 1;
  text-transform: none;
  margin: 0;
  padding: 0 0 0 1.5em;
  position: relative;
  padding-bottom: 0 !important; 
  }  


.expander-header h2:before {
    background: #91a2d5 url(../img/expander.png) no-repeat center 5px; 
    width: 22px;
    height: 21px;
    display: block;
    content:" ";
    -moz-border-radius:    20px;
    -webkit-border-radius: 20px;
    border-radius:         20px;    
    color: #fff;
    font-size: 1.5em;
    line-height: 19px;
    font-weight: 300;
    text-align: center;
    position: absolute;
    top: 0;
    left: 0;
    transition:         all 0s ease-in-out;    
    -webkit-transition: all 0s ease-in-out;  
    -moz-transition:    all 0s ease-in-out;  
    -o-transition:      all 0s ease-in-out;  
    -ms-transition:     all 0s ease-in-out; 
    }
  
.expander-header:hover h2:before { background-color: #2f478c; }

.expander-header:active h2:before { 
  background-color: #202666; 
  box-shadow:         inset 1px 1px 2px rgba(0, 0, 0, 0.3);       
  -moz-box-shadow:    inset 1px 1px 2px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.3);  }

.expander-header.selected h2:before { background-position: center -47px !important; }

.expander-header p { margin-bottom: 0; }

.expander-header:hover { background-position: 630px -68px; }      

.expander-body { 
    background: #fff;
    padding: .5em 0 1.5em 2em; 
    }       
  
.expander-body p:last-child { margin-bottom: 0; }           


/* Our People
------------------------------------ */

.people-list a {
    background-color: #2f5771;
    background-repeat: no-repeat;
    background-position: center center;
    background-size:         cover;
    -webkit-background-size: cover;
    -moz-background-size:    cover;
    -o-background-size:      cover;   
    width: 280px;
    height: 180px;
    margin: 10px;
    float: left; 
    position: relative;
    }
  
.people-list a:hover { 
    background-color: #ea2628;
    -moz-box-shadow:    inset 0 -4px 0 #f55f00, inset 0 0 0 2px rgba(19,49,69,.75);
    -webkit-box-shadow: inset 0 -4px 0 #f55f00, inset 0 0 0 2px rgba(19,49,69,.75);
    box-shadow:         inset 0 -4px 0 #f55f00, inset 0 0 0 2px rgba(19,49,69,.75); 
    }
    
.people-list a:hover { 
    background-color: #0e2838;
    -moz-box-shadow:    inset 0 -5px 0 #f55f00, inset 0 0 0 2px rgba(19,49,69,.75);
    -webkit-box-shadow: inset 0 -5px 0 #f55f00, inset 0 0 0 2px rgba(19,49,69,.75);
    box-shadow:         inset 0 -5px 0 #f55f00, inset 0 0 0 2px rgba(19,49,69,.75);
    }

.people-list h3 {
    background-color: rgba(29,57,75,.8);  
    width: 260px;
    padding: 10px;
    margin: 0 !important;
    font-size: 28px;
    line-height: .8;
    color: #fff;
    text-align: left;  
    position: absolute;
    bottom: 0;
    left: 0;
    }  
  
.people-list a:hover h3 {
    background-color: rgba(29,57,75,1);  
    color: #f66200; 
    bottom: 5px; 
    }
  
    @media (max-width : 1200px) {
        .people-list a {
            width: 220px;
            height: 130px; 
            }
        .people-list h3 {
            font-size: 20px;
            width: 200px; 
            }
        }   

/* Press Contact
------------------------------------ */

.press-contact { 
  background-color: #fbfbfb;
  text-align: left;
  line-height: 1.3;
  padding: 20px;
  margin-bottom: 20px;
  } 
  
.press-contact:hover { background-color: #f0f4f6; }  

.press-contact h3 {
  font-family: "bebas-neue",sans-serif;
  font-weight: 400;  
  font-size: 25px;
  line-height: 1;
  font-style: normal;
  padding: 0 0 10px;
  margin: 0; 
  }  
  
.press-contact strong { display: block; }    

.press-contact em {
  display: block;
  margin-bottom: 4px; } 

/* --- General Contact Information --- */  

.contact-info { 
  font-size: 11px; 
  line-height: 1.8;
  text-transform: uppercase; }
.candidates .contact-info { margin-top: 7px; }

.contact-info span, .contact-info a { 
  display: block; }

.contact-info.line div, .contact-info.line a { 
  display: inline-block;
  float: left; 
  margin-right: 15px; }
  
.contact-info .icon { 
  background-repeat: no-repeat;
  background-position: center center;
  background-color: #123043; 
  float: left;
  margin-right: 3px;
  }
  
.contact-info *:hover .icon { background-color: #fc6100; }

.contact-info .website .icon,
.contact-info .fb .icon,
.contact-info .tw .icon,
.contact-info .phone .icon,
.contact-info .do .icon { 
  width: 14px;
  height: 14px; 
  -moz-border-radius:    7px;
  -webkit-border-radius: 7px;
  border-radius:         7px; }
.contact-info .website .icon { background-image: url(../img/link-tiny.png); }
.contact-info .fb .icon { background-image: url(../img/facebook-tiny.png); }
.contact-info .tw .icon { background-image: url(../img/twitter-tiny.png); }
.contact-info .phone .icon { background-image: url(../img/phone-tiny.png); }
.contact-info .do .icon { background-image: url(../img/donate-tiny.png); }

.contact-info .email .icon { 
  background-image: url(../img/email-tiny.png) ;
  width: 14px;
  height: 10px;
  margin-top: 5px; }
    
/* --- Events --- */
#map_container {
  width: 100%;
  height: 350px; }
  
#simplesearch {
  background: #e7eef1; 
  padding: 20px;
  margin-bottom: 15px; }
  
#simplesearch input,
#simplesearch select { 
  background: #fff;
  border: none;
  margin: 0 auto;
  padding: 6px; 
  border-radius:         4px;
  -moz-border-radius:    4px; 
  -webkit-border-radius: 4px;    
  cursor: pointer; 
  font-family: "jubilat",serif;
  font-weight: 400;
  font-style: italic;
  font-size: 15px;
  line-height: 1;
  color: #0c2535;
  box-shadow:         inset 1px 1px 1px rgba(0, 0, 0, 0.15);       
  -moz-box-shadow:    inset 1px 1px 1px rgba(0, 0, 0, 0.15);
  -webkit-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.15);  
  } 

#simplesearch input:hover,
#simplesearch select:hover { 
  background: #1c3b4f; 
  color: #f65f00; 
  box-shadow:         1px 1px 3px rgba(0, 0, 0, 0.3);       
  -moz-box-shadow:    1px 1px 3px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3); 
  }

/* ---- Placeholder Text Equalizer ---- */

#simplesearch input:-ms-input-placeholder            { color: #fb9400; }
#simplesearch input::-webkit-input-placeholder       { color: #fb9400; }
#simplesearch input:hover:-ms-input-placeholder      { color: #f65f00; }
#simplesearch input:hover::-webkit-input-placeholder { color: #f65f00; }     

#simplesearch input:focus,
#simplesearch select:focus { 
  background: #f1f4f5;   
  color: #1c3b4f;
  cursor: text; 
  box-shadow:         inset 1px 1px 1px rgba(0, 0, 0, 0.35);       
  -moz-box-shadow:    inset 1px 1px 1px rgba(0, 0, 0, 0.35);
  -webkit-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.35); } 
  
#simplesearch input[type=submit] {
  background: #f35e00;
  padding: 4px;  
  -moz-border-radius:    5px;
  -webkit-border-radius: 5px;
  border-radius:         5px;  
  margin: 0 auto !important;
  display: inline-block; 
  border: 0; 
  font-family: "bebas-neue",sans-serif;
  font-weight: 400 !important;
  cursor: pointer !important;
  font-size: 20px;
  line-height: 1;
  font-style: normal;
  color: #fff; 
  } 
#simplesearch input[type=submit]:hover { background-color: #fb9400; }  
#simplesearch input[type=submit]:active { 
  background-color: #e05700; 
  -moz-box-shadow:    inset 0 1px 4px rgba(0,0,0,.3);
  -webkit-box-shadow: inset 0 1px 4px rgba(0,0,0,.3);
  box-shadow:         inset 0 1px 4px rgba(0,0,0,.3); }   


.event small {
  font-size: 12px !important; }
  
.event .address,
.event .location {
  color: #55646e;
  line-height: 1.2; }
  
.event .fn { font-weight: bold; }  
.event .address p { 
  display: inline;
  margin: 0; }  
  
.event .location .address { 
  display: block;
  margin: 3px 0 0; }    

/* --- More --- */
  
.more { 
  border-top: 1px solid #fdfdfd;   
  margin-top: 20px;
  padding-top: 20px; }  
  
.more h3 a { color: #0e2a3c; }
.more h3 a:hover { color: #f65f00; }  

.more .list article h3 { font-size: 20px; }
.more .list article p { font-size: 12px; }









/* --- Tabs --- */


#media-tabs {
    position: relative; 
    }
    
.panel {
    position: relative; 
    margin: 0;
    }  
 

/* --- Slide Tabs --- */

#media-tabs .ui-tabs-nav {
    list-style: none;
    margin: 0;
    height: 38px;
    }
      
#media-tabs .ui-tabs-nav li { 
    display: block;
    float: left;
    }

#media-tabs .ui-tabs-nav li a { 
    background-color: #f2f2f2;
    font-size: 16px;
    line-height: 1;
    text-transform: uppercase;
    display: block;
    text-align: center; 
    padding: 8px 15px;
    height: 16px;      
    position: relative;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition:   all .3s ease-in-out;
    -ms-transition:  all .3s ease-in-out;
    transition:      all .3s ease-in-out; 
    }
    
    @media (max-width : 1800px) { #media-tabs .ui-tabs-nav li a { font-size: 15px; height: 15px; }} 
    @media (max-width : 1500px) { #media-tabs .ui-tabs-nav li a { font-size: 14px; height: 14px; padding: 8px 12px; }} 
    @media (max-width : 1370px) { #media-tabs .ui-tabs-nav li a { font-size: 13px; height: 13px; padding: 8px; text-transform: none ;}} 
       
    #media-tabs .ui-tabs-nav li:hover a {
        background-color: #69942f;
        color: white; 
        }
         
    #media-tabs .ui-tabs-nav li:active a {
        background-color: #547626;
        color: white; 
        }
         
    #media-tabs .ui-tabs-nav li.ui-tabs-active a {
        background-color: #547626;
        color: white;
        }  
         
    #media-tabs .ui-tabs-nav li.ui-tabs-active > a:after{ 
        height: 0; 
        width: 0;    
        margin-left: -8px;  
        content: " ";    
        position: absolute;
        top: 28px;
        left: 50%; 
        bottom: 100%;   
        pointer-events: none;
        border-width: 8px !important;
        border-color: rgba(84, 118, 38, 0); 
        border: solid transparent; 
        border-top-color: #547626; 
        } 



/* --- Back/Next Buttons --- */

#media-tabs .control {
    background-color: white;   
    background-repeat: no-repeat;
    width: 32px;
    height: 61px;  
    position: absolute;
    top: 270px; 
    -webkit-transition: all .3s ease-in-out;
    -moz-transition:    all .3s ease-in-out;
    -o-transition:      all .3s ease-in-out;
    -ms-transition:     all .3s ease-in-out;
    transition:         all .3s ease-in-out; 
    }
    
    @media (max-width : 1800px) { #media-tabs .control{ top: 245px; }} 
    @media (max-width : 1500px) { #media-tabs .control { top: 220px; }} 
    @media (max-width : 1370px) { #media-tabs .control { top: 190px; }} 

#media-tabs .control.back { left: 0; }    	 
#media-tabs .control.next { right: 0; }					

#media-tabs .control .arrow {
    background-repeat: no-repeat;
    opacity: .5;
    width: 32px;
    height: 61px;
    display: block;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition:    all .3s ease-in-out;
    -o-transition:      all .3s ease-in-out;
    -ms-transition:     all .3s ease-in-out;
    transition:         all .3s ease-in-out; 
    }
  
#media-tabs .control.back .arrow {
    background-image: url(../img/left.png);
    background-position: left center;
    }  		
  
#media-tabs .control.next .arrow {
    background-image: url(../img/right.png);
    background-position: right center;
    }		

#media-tabs .control:hover .arrow { opacity: .75; }
#media-tabs .control:active .arrow { opacity: 1; }
  
  
  

/* PHOTOS
------------------------------------ */

.photo-thumbnail {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover !important;  
    padding-bottom: 100%;
    display: block;
    margin: 0 0 1em 0;
    height: 0;
    position: relative;
    }

    @media (min-width : 768px) and (max-width : 959px) { 
      .photo-thumbnail { 
          width: 49%; 
          float: left;
          margin: 0 2% 1em 0; 
          padding-bottom: 50%;
          }
      .photo-thumbnail:nth-of-type(2n) { margin-right: 0; }
      } 
        
    @media (min-width : 960px) and (max-width : 1199px)  { 
      .photo-thumbnail { 
          width: 32.5%; 
          float: left;
          margin: 0 1.25% 1em 0; 
          padding-bottom: 33%;
          }
      .photo-thumbnail:nth-of-type(3n) { margin-right: 0; }
      } 
        
    @media (min-width : 1200px) { 
      .photo-thumbnail { 
          width: 24%; 
          float: left;
          margin: 0 1.33% 1em 0; 
          padding-bottom: 25%;
          }
      .photo-thumbnail:nth-of-type(4n) { margin-right: 0; }
      }   


.photo-thumbnail .text { padding: .5em; font-size: .9em; line-height: 1; }
    

.photo-thumbnail a .text, .photo-thumbnail .text {
    background: rgba(0,0,0,.8);
    height: auto;
    font-weight: 300;
    color: #d7d7d7;
    position: absolute;
    bottom: 0;
    }     
    



/* VIDEO
------------------------------------ */

#video {
    position: relative;
    overflow: hidden;
    height: auto;
    border-bottom: 2px solid #dedede;
    padding-bottom: 10px;
    }
       
#video iframe {
    width: 100%;
    height: 160px; 
    }

    @media (min-width : 360px) { #video iframe { height: 200px; }} 
    @media (min-width : 400px) { #video iframe { height: 220px; }} 
    @media (min-width : 768px) { #video iframe { height: 400px; }} 
    @media (min-width : 960px) { #video iframe { height: 520px; }} 

#video .text {
    padding: 1em 0;
    }

#video h2, 
#video p { margin: 0; }

#video:hover .text {
    bottom: -100px;
    }


#video .video {
    position: relative; 
    padding-bottom: 56.25%; 
    height: 0; 
    overflow: hidden; 
    max-width: 100%; 
    height: auto;
    }
 
#video .video iframe, 
#video .video object, 
#video .video embed { 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    }
  
.feed  h2 { margin: 1em 0; }     

.feed.video { width: 100%; }
.feed.video .panel { min-height: 500px; } 

.feed.video article {
    width: 98%;
    min-height: 180px;
    padding: 1em;
    }
    
    @media (min-width : 768px)  { .feed.video article { width: 50%; padding: 1em 1%; float: left; } } 
    @media (min-width : 960px)  { .feed.video article { width: 33%; } } 
    @media (min-width : 1200px) { .feed.video article { width: 25%; } } 
    
#content .feed.video ul {
    list-style: outside none none !important;
    margin: 0;
    position: absolute;
    right: 0;
    top: 12px;
    }

.video-feed.blocks article:last-child { margin-right: 0; }

.feed.video article:hover {
  background-color: #f6f6f6; 
  -moz-box-shadow:    0 1px 2px rgba(0,0,0,.15);
  -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.15);
  box-shadow:         0 1px 2px rgba(0,0,0,.15); 
  }

.feed.video article:active,
.feed.video article.active{
    background-color: #f3f3f3; 
    }

.feed.video article figure {
    width: 100%;
    height: 0;
    padding-bottom: 56%;
    margin-bottom: 1em;
    display: block;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    }
  

.feed.video article h3 { 
    font-size: .85em; 
    margin-bottom: 0;
    }