
/* Expander 
--------------------------------------------------- */

.expander { margin: 0 0 5px; }

.expander-header { 
  cursor: pointer;
  padding: 10px 0;
  display: block;	
  -webkit-transition: background-color .35s ease-in-out, color .35s ease-in-out;
  -moz-transition:    background-color .35s ease-in-out, color .35s ease-in-out;
  -o-transition:      background-color .35s ease-in-out, color .35s ease-in-out;
  -ms-transition:     background-color .35s ease-in-out, color .35s ease-in-out;
  transition:         background-color .35s ease-in-out, color .35s ease-in-out; }

.expander-header h2 {
  font-size: 18px;
  color: #eb6e1f;
  line-height: 1;
  text-transform: none;
  margin: 0;
  padding: 0 25px 0 0;
  position: relative;
  padding-bottom: 0 !important; 
  transition:         color .3s ease-in-out;    
  -webkit-transition: color .3s ease-in-out;  
  -moz-transition:    color .3s ease-in-out;  
  -o-transition:      color .3s ease-in-out;  
  -ms-transition:     color .3s ease-in-out; }   
.expander-header:hover h2,
.expander-header.selected h2 { color: #fdb825 !important; }   
.expander-header.selected:hover h2 { color: #00aec5 !important; }   

.expander-header h2:after {
  background: #00aec5 url(/theme/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: 22px;
  line-height: 19px;
  font-weight: 300;
  text-align: center;
  position: absolute;
  top: 0;
  right: 0;
  transition:         background-color .3s ease-in-out;    
  -webkit-transition: background-color .3s ease-in-out;  
  -moz-transition:    background-color .3s ease-in-out;  
  -o-transition:      background-color .3s ease-in-out;  
  -ms-transition:     background-color .3s ease-in-out; }
  
.expander-header:hover h2:after { background-color: #eb6e1f; }

.expander-header:active h2:after { 
  background-color: #fdb825; 
  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:after { background-position: center -47px !important; }

.expander-header p { margin-bottom: 0; }

.expander-header:hover { background-position: 630px -68px; }
.expander-header:active {  }        

.expander-body { 
  background: #fff;
  padding: 5px 0; }       
.expander-body p:last-child { margin-bottom: 0; }           








/* ------------ Promos ------------ */   

.promos {
    width: 250px; 
    float: left; 
    }

.promos a {
    background-color: #8c9ca3;
    background-repeat: no-repeat;
    background-position: center center;
    height: 110px;
    margin: 0 0 10px;
    display: block;    
    transition:         all .35s ease-in-out;    
    -webkit-transition: all .35s ease-in-out;  
    -moz-transition:    all .35s ease-in-out;  
    -o-transition:      all .35s ease-in-out;  
    -ms-transition:     all .35s ease-in-out; 
    }

.promos a:hover {
    background: #11b8d2; 
    -moz-box-shadow:    0 1px 2px rgba(0,0,0,.35);
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.35);
    box-shadow:         0 1px 2px rgba(0,0,0,.35); 
    }
  
.promos a:active {
    background: #0e9cb6; 
    -moz-box-shadow:    inset 1px 0px 2px rgba(0,0,0,.35);
    -webkit-box-shadow: inset 1px 0px 2px rgba(0,0,0,.35);
    box-shadow:         inset 1px 0px 2px rgba(0,0,0,.35); 
    } 
  



/* --------------- Our Voices --------------- */

#voices {
    width: 300px;
    padding: 30px;
    float: left;
    border-top: 5px solid #f28c20;
    background: url('/theme/img/below1200.png') repeat-y center right;
    -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 : 1200px) { 
        #voices { 
            width: 250px;
            padding: 20px;
            background: url('/theme/img/below960.png') repeat-y center right;
            } } 
                      
#voices h2 {
    font-size: 16px;
    font-family: 'Montserrat', Arial, Helvetica, serif;
    font-weight: 400;
    line-height: 1;
    text-transform: uppercase;
    margin: 0 0 10px; 
    color: #7b7b7b;
    }  
    
#voices h2 a {
    -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;
    }
      
#voices blockquote { 
    font-size: 21px;
    line-height: 25px;
    font-family: georgia,times,serif;
    font-style: italic;
    margin: 0;
    color: #787878;
    }     
   
    @media (max-width : 1200px) { 
        #voices blockquote { 
            font-size: 19px;
            line-height: 23px;
            } }   
   
    



/* Working for Families */


.working-for-families h2 { 
    text-align: center; 
    color: #f18a21;
    margin-bottom: 10px;   
    font-family: 'Montserrat', Arial, Helvetica, serif;
    font-size: 32px;
    font-weight: 400;
    text-transform: uppercase;
    }

#form-panel { 
    width: 100%; 
    position: relative;
    }

#form-panel .cf {  
    padding: 20px 8% 40px;
    background: #f5f5f5;
    }

#form-panel label { 
    font-size: 14px;
    font-weight: bold; 
    }
    
    @media (max-width : 1200px) { #form-panel label { font-size: 12px; } }   
    
#form-panel fieldset label { 
    font-weight: normal; 
    margin-left: 5px;
    }

#form-panel .column { 
    float: left; 
    height: 110px; 
    width: 18%;
    margin: 0 1%;
    }
    
#form-panel .column select { 
    width: 100%;
    background: white;
    border: 1px solid #cfcfcf;
    padding: 0;
    }
    
#form-panel .column select option { 
    padding: 2px 0 2px 4px;
    }

.select-multiple {
    text-align: center;
    clear: both;
    font-size: 11px;
    line-height: 1;
    font-weight: normal;
    overflow: hidden; 
    position: absolute;
    top: 130px;
    left: 9%;
    width: 48.5%;
    }
      
.select-multiple .line {
    height: 7px;
    border: 1px dotted #a8aaae;
    margin-bottom: 6px;
    border-top: none;
    }


.buttons  {     
    text-align: center;
    margin: 15px 0;
    }
      
button { 
    padding: 5px;
    color: #616162;
    font-size: 14px !important;
    font-weight: normal;
    display: inline-block;; 
    }
        


/* Table */

#wff-table { 
    border: 1px solid #dddbd1;
    border-bottom: none; 
    border-right: none;
    color: #5d5d5c;
    font-size: 14px;
    line-height: 11px;
    margin-top: 15px;
    display: none;
    }

#wff-table td, 
#wff-table th {
    border: 1px solid #dddbd1;
    border-top: none; 
    border-left: none;
    text-align: center;
    }
    
#wff-table td:first-child,
#wff-table td:last-child,
#wff-table th:first-child,
#wff-table th:last-child {
    text-align: left;
    }
    
#wff-table td:nth-child(2),
#wff-table td:nth-child(3),
#wff-table td:nth-child(8) {
    }
    
    
#wff-table th {
  background: #f5f5f5; 
  padding: 12px;
  font-weight: normal;
  color: #00839a;
  transition:         all .25s ease-in-out;    
  -webkit-transition: all .25s ease-in-out;  
  -moz-transition:    all .25s ease-in-out;  
  -o-transition:      all .25s ease-in-out;  
  -ms-transition:     all .25s ease-in-out;    
  -moz-box-sizing:    border-box; 
  -webkit-box-sizing: border-box;
  box-sizing:         border-box; }

#wff-table .col1 { width: 12%; }
#wff-table .col2 { width: 9%; }
#wff-table .col3 { width: 8%; }
#wff-table .col4 { width: 7.5%; }
#wff-table .col5 { width: 8%; }
#wff-table .col6 { width: 8%; }
#wff-table .col7 { width: 8.5%; }
#wff-table .col8 { width: 11%; }
#wff-table .col9 { width: 28%; color: #787878; }

#wff-table th.sortable {
  cursor: pointer;
}

#wff-table th.sortable:hover {
  background-color: #d2d2d2;
  color: #35627c;
}

#wff-table th.sorted,
#wff-table th.sorted:hover {
  background: #fff;
  color: #a1a1a1;
  cursor: auto; 
  -moz-box-shadow:    inset 0 1px 4px rgba(0,0,0,.2);
  -webkit-box-shadow: inset 0 1px 4px rgba(0,0,0,.2);
  box-shadow:         inset 0 1px 4px rgba(0,0,0,.2);
}

#wff-table th.sorted span { display: inline; }
#wff-table th.sorted span:before {
  content: "6";
  display: inline-block;
  color: #00839a;
  font-size: .7em;
  padding-left: 3px; }


#wff-table td {
    background: #fff; 
    padding: 10px;
    }

#wff-table td a { 
    display: block; 
    font-weight: bold;
    }

aside {
  background: #f5f5f5;
  width: 20%;
  padding: 20px;
  float: right;
  margin: 0 15px 15px;
  }
aside form,
aside select { width: 100%; }


.pagination {
  margin: 10px;
}

.pagination div {
  display: inline-block;
  float: left;
  padding: 3px;
  border: 1px solid #dddbd1;
  background: #f5f5f5;
  min-width: 20px;
  text-align: center;
}
  

#loading { 
  padding: 10px 0;
  text-align: center;}




  
/* Paid Leave */

.paid-leave #hub-form li {
    float: left;
    margin: 0;
    padding: 0 .25em 0 0;
    position: relative;
    }
    
.paid-leave #hub-form li:last-child {
    padding: 0;
    }
    
.paid-leave #hub-form input,
.paid-leave #hub-form button {
    font-size: 1.1em !important;
    line-height: 1;
    padding: .75em;
    width: 100%;
    float: none;
    }

.paid-leave #hub-form button {
    padding: .7em;
    }

.paid-leave #hub-form .email-field {
    width: 50%;
    }

.paid-leave #hub-form .zip-field {
    width: 25%;
    }

.paid-leave #hub-form .button {
    width: 25%;
    }
    

    
  
/* --------------- Video --------------- */

#video { 
  position: 
  relative; 
  padding-bottom: 56.25%; 
  height: 0; 
  overflow: hidden; 
  max-width: 100%; 
  margin-bottom: .75em;
  } 
  
#video iframe, 
#video object, 
#video embed { 
  position: absolute; 
  top: 0; 
  left: 0;
  width: 100%; 
  height: 100%; 
  }
  
.video-description { 
  border-bottom: 1px solid #e0e0e0;
  margin-bottom: 1.5em;
  }

.video-description h2 { margin: 0; }


/* Video archive Snippet */

.feed { position: relative; }

.feed.video h2 { margin: 0 0 10px 0; }     

.feed.video { width: 100%; position: relative; }
.feed.video .panel { min-height: 500px; } 

.feed.video article {
    width: 23%;
    min-height: 150px;
    padding: 15px 1%;
    float: left;
    }

.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%;
    padding-bottom: 56.25%;
    margin-bottom: 10px;
    display: block;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    }

.feed.video article h3 { 
    font-size: .85em; 
    margin-bottom: 0;
    }


/* Video archive controls */

.ui-tabs-nav {
  list-style: none;
  margin: 0;
  position: absolute;
  top: 0;
  right: 0;
  }

.ui-tabs-nav li {
  display: inline-block;
  color: white;
  background: #e0e0e0;
  padding: .5em;
  width: 1em;
  height: 1em;
  text-align: center;
  font-size: .8em;
  font-weight: bold;
  line-height: 1;
  -moz-border-radius:    50%;
  -webkit-border-radius: 50%;
  border-radius:         50%;  
  -webkit-transition: all .2s ease-in-out;  
  -moz-transition:    all .2s ease-in-out;  
  -o-transition:      all .2s ease-in-out;  
  -ms-transition:     all .2s ease-in-out;
  transition:         all .2s ease-in-out;    
  }

.ui-tabs-nav li:hover {
  -moz-transform:    scale(1.2);
  -ms-transform:     scale(1.2);
  -webkit-transform: scale(1.2);
  transform:         scale(1.2);
  }
  
.ui-tabs-nav li a {
  color: white; 
  }


.ui-tabs-nav li.ui-state-active { background: #00849c; }

