body { 
   background: var(--main-bg-color); }
   
.wrap { 
   width: 1200px; 
   position: relative; }
   
   .simple .wrap { width: 800px; }
   
header {
   top: 0;
   left: 0;
   right: 0;
   margin: 0 auto ;
   height: auto;
   padding: 14px 0 6px 0;
   /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#242f55+0,242f55+100&0.8+0,0+100 */
   background: -moz-linear-gradient(top,  rgba(35,31,32,0.2) 0%, rgba(35,31,32,0) 100%); /* FF3.6-15 */
   background: -webkit-linear-gradient(top,  rgba(35,31,32,0.2) 0%,rgba(35,31,32,0) 100%); /* Chrome10-25,Safari5.1-6 */
   background: linear-gradient(to bottom,  rgba(35,31,32,0.2) 0%,rgba(35,31,32,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#231F2055', endColorstr='#231F2055',GradientType=0 ); /* IE6-9 */
   width: 100%;
   z-index: 1001;
   position: fixed;
   float: none;
   display: block;
   -webkit-transition: all .3s ease-in-out;
   -moz-transition: all .3s ease-in-out;
   -ms-transition: all .3s ease-in-out;
   -o-transition: all .3s ease-in-out;
   transition: all .3s ease-in-out;}
   
   header .wrap {
      width: 1200px; }
      
   header.sticky { 
      background: var(--main-bg-color);
      padding: 14px 0 6px 0; 
      -webkit-box-shadow: 0 0 3px 0 rgba(0,0,0,.2);
      box-shadow: 0 0 3px 0 rgba(0,0,0,.2);}
   
   .interior header {
      position: fixed;
      top: 0;
      border-bottom: 10px var(--main-highlight) solid;
      background: var(--main-bg-color);
      -webkit-box-shadow: 0 0 3px 0 rgba(0,0,0,.2);
      box-shadow: 0 0 3px 0 rgba(0,0,0,.2);}      
      
   .simple header { position: relative; }
      
.logo {
   display: inline-block;
   text-align: left; 
   z-index: 1000; }
   
   .logo img, .logo svg {
      position: relative;
      width: 100%;
      margin: 0 auto;
      z-index: 1001;
      display: block;
      background: none;
      padding: 0;
      text-align: center;
      max-width: 240px;
      vertical-align: middle; }
      
      .interior .logo img, .interior .logo svg { max-width: 240px;  }
      
      header.sticky .logo img, header.sticky .logo svg { }
      
      .simple .logo { display: block; text-align: center; }
      
      .simple .logo img, .simple .logo svg { max-width: 240px; }
      
.social {
   width: auto;
   position: relative;
   top: 1em;
   float: right;
   font-size: 200%; }
   
   header.sticky .social { display: none; }
   
.social .link {
   color: #505050;
   font-weight: 500;
   vertical-align: top;
   text-transform: uppercase;
   letter-spacing: 1px;
   display: inline-block;
   padding: .75em 1em;
   margin-right: 2em; }

.social .icons {
   font-size: 1.5em;
   padding: .45em;
   display: inline-block;
   color: white; }
   
   .social .icons:hover {
      color: #ff6900; }




   
/* Responsive Video */
.video-container {
  position: relative;
   padding-bottom: 56.25%; /* 16:9 */
   padding-top: 25px;
   height: 0;
}
.video-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


    

/* Site Footer
------------------------------------ */
footer {
   background: var(--main-bg-color);
   border-top: 10px var(--main-highlight) solid;
   color: var(--main-text-color);
   font-weight: 400;
   padding: 2em 0; 
   position: relative;
   z-index: 99;
   text-align: center;
   margin: 0 auto; }   
   
   nav#foot {
      display: block; }
      
   nav#foot ul li {
      display: inline-block; }
      
   nav#foot ul li a {
      padding: .5em .75em;
      font-size: 110%;
      font-weight: 500;
      line-height: 1;
      color: var(--link-color);    
      display: inline-block;
      text-transform: uppercase;
      letter-spacing: 0px;
      -webkit-border-radius: 2px 2px 2px 2px;
      border-radius: 2px 2px 2px 2px;
      -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;
      transition:         all .35s ease-in-out; }
   
      .ie nav#foot ul li a { }
      nav#foot ul li a.donate { -webkit-box-shadow:inset 0 0 0 2px var(--button-bg-color); box-shadow:inset 0 0 0 2px var(--button-bg-color); }
      nav#foot ul li a.donate:hover {  -webkit-box-shadow:inset 0 0 0 2px var(--button-bg-color); box-shadow:inset 0 0 0 2px var(--button-bg-color);}
      nav#foot ul li a.active:hover { -webkit-box-shadow:inset 0 0 0 2px var(--button-bg-active-color); box-shadow:inset 0 0 0 2px var(--button-bg-active-color); }
   
      nav#foot ul li a:hover { background: var(--link-color); color: white; }
      nav#foot ul li a:active { background: var(--link-hover-color); color: white;  }

   nav#foot .share {
      margin: 2em 0;
      display: block;
      font-size: 120%;
      vertical-align: middle; }
      
   .simple nav#foot { display: none !important; }
   
footer .paidfor { 
  font-size: .9em; 
  border: 1px solid #000;
  padding: .5em 1em;
  margin: 1.5em 0 3em;
  display: inline-block;
}
footer a { 
  color: var(--link-color); 
  padding: .5em 1em;
}
footer a:hover { 
  color: var(--link-hover-color);  
}
footer a:active { 
  color: var(--link-active-color);  
} 
@media only screen and (min-width: 740px) and (min-device-width: 480px) {  
  footer .paidfor { 
    font-size: 1.1em; 
  }  
}

@media only screen and (min-width: 1000px) and (min-device-width: 480px) {  
  .paidfor { 
    font-size: 1.4em;
  }
}
