body#interior, #body {
   background: white;
   width: 100%; }

section#microsite {
   width: 100%;
   position: relative; }

section#microsite .landing {
   height: 80vh;
   min-height: 800px;
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;  }
   
   section#microsite .landing h1 {
      font-size: 80%;
      text-transform: uppercase;
      letter-spacing: 1px;
      color: white;
      padding: 1em 0;
      position: absolute;
      line-height: 1;
      clear: both;
      width: 100%;
      text-align: center;
      background: rgba(0,0,0,.25);}

section#microsite .inside { 
   background: #00192c;
   color: white;
   height: auto;
   padding: 2em 0; }
   
   section#microsite #logo-micro h1 {
      font-size: 300%;
      line-height: 1;
      margin: 0;
      color: white; }
      
      section#microsite .inside h1 {
         display: none; }

#logo-micro {
   display: block;
   width: 100%; }
   
#logo-micro img {
   padding: 4.5em 0;
   max-height: 220px;
   -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;}
   
   section#microsite .inside #logo-micro img { height: 125px; padding: 0; }
   
   #logo-micro:hover img {
      -moz-transform: scale(1.05);
      -ms-transform: scale(1.05);
      -webkit-transform: scale(1.05);
      transform: scale(1.05); }
   
.topbanner {
   position: absolute;
   padding: 2em;
   bottom: 4em;
   color: white;
   width: calc(60% - 4em);
   margin: 0 calc(25% - 4em);
   background: rgba(0,140,255,.9);
   -webkit-border-radius: 10px 10px 10px 10px;
   border-radius: 10px 10px 10px 10px;
   -webkit-box-shadow: 0 0 30px 0 rgba(0,0,0,.1);
   box-shadow: 0 0 30px 0 rgba(0,0,0,.1); }
   
   .topbanner h1 {
      font-size: 225%;
      color: white;
      margin-bottom: .5em; }
    
   .topbanner h2 {
      color: #fdba31;
      font-size: 140%;
      text-align: center;
      text-transform: uppercase;
      font-weight: 700; }
      
   .topbanner .icons a {
      margin-top: .1em;
      display: inline-block;
      font-size: 150%;
      background: white;
      padding: .5em;
      border-radius: 50%;
      width: 30px;
      height: 30px;
      line-height: 30px;}
      
      .topbanner .icons a:hover {
         background: #fdba31; }
         
      .button.action {
         display: block;
         position: relative;
         padding: 1em;
         text-align: center;
         color: #004881;
         font-size: 125%;
         background: #fdba31;
         width: calc(80% - 2em);
         min-height: 72px;
         line-height: 1.1;
         font-weight: 700;
         text-transform: uppercase;
         -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;}
         
         .button.action:hover {
            color: #fdba31;
            background: #004881; }
            
         .button.action span {
            margin: 0;
            position: absolute;
            width: 80%;
            top: 50%;
            left: 50%;
            margin-right: -50%;
            transform: translate(-50%, -50%); }
            
.join-us {
   float: none;
   height: auto;
   display: block;
   width: 80%;
   margin: 0 auto;
   padding: 0;
   background: none;
   text-align: left;
   font-size: 100%;
   border: 0; }
   
   .join-us:hover { background: none; }
      
   .join-us ol li {
       float: none;
       display: block; }
   
   .join-us input {
      display: block;
       background: white;
       width: calc(100% - 20px);
       border: none;
       padding: 10px;
       margin-bottom: 5px;
       font-size: 100%;
       color: #717171;
       cursor: pointer;
       -moz-box-shadow: initial;
       -webkit-box-shadow: initial;
       box-shadow: initial;
       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; }

   .join-us .zip {
       width: calc(100% - 20px);
       margin: 0; }
   
   .join-us li.submit {
      margin-top: 5px;
      float: none;
      width: 100%;
      text-align: center; }

   .join-us button {
       background: #003158;
       color: white;
       border: none;
       width: auto;
       line-height: 1;
       padding: 0.5em 2em;
       font-size: 120%;
       -moz-border-radius: 0px;
      -webkit-border-radius: 0px;
       border-radius: 0px;}
      
.col {
   display: inline-block;
   vertical-align: top; }
   
   .one-third {
      width: 33%; }
   
   .two-third {
      width: 67%; }
   
   .full-width {
      width: 100%; }
      
   .half {
      width: 50%;
      float: left; }
      
   .third {
      width: 30%;
      margin: 0 4% 0 0;
      float: left; }
   #below div #video.third:last-child {
      margin: 0 0 0 0; }
      
#hightlighted-above {
   background: #003158;
   width: 100%;
   padding: 2em 0; }   
   
   #hightlighted-above .wrap {
      width: 1200px; }
   
   #hightlighted-above h2 { color: white; }
   
   .flex-container {
      width: 100%;
      height: auto;
      font-size: 110%;
      color: white;
      display: -webkit-flex; /* Safari */
      display: flex; }
   
   .flex-container article {
      -webkit-flex: 1;  /* Safari 6.1+ */
      -ms-flex: 1;  /* IE 10 */    
      flex: 1;
      margin-right: 1%; }
       
   .flex-container article a {
      background: #004985;
      margin-right: 1%;
      padding: 1em;
      height: calc(100% - 2em);
      color: white;
      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; }
      
   .flex-container article a:hover {
      background: #0076d7; }

#i-map {
   width: 100%;
   text-align:center; 
   padding: 2em 0;
   background: #b5322e; }
   
   #i-map span a { color: white; text-decoration: underline; }
   #i-map span a:hover { color: rgba(255,255,255,.5); }
   
   #i-map #map #map_inner div svg { display:none !important; }
   #i-map #map #map_inner rect { display:none !important; }

#below.wrap {
    width: 1200px; }

   #below #news {
      margin: 2em 0;   
   }
      
   #below #video, #below #photos {
      margin-bottom: 2em;   
   }

.videoWrapper {
   position: relative;
   padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
   
#below.middle {
   margin: 0 auto;
   background: #eee;
   width: 100%;
   padding: 2em 0; }   
   
   #below.middle .wrap {
      width: 1200px; }
      
      @media only screen and (max-width: 1220px)  {
         #below.middle { padding: 2em 3%; width: 94%; } 
         #below.middle .wrap { width: 100%; }
      }
      
      
#below h2 {
   color: #003158;
   text-align: left;
   width: 100%; }
      
   h2 .button {
      font-size: 40%;
      padding: .35em .75em;
      -webkit-border-radius: 3px 3px 3px 3px;
      border-radius: 3px 3px 3px 3px;
      background: #003158;
      color: white;
      line-height: 1;
      margin: 0 0 0 10px;
      top: -5px;
      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; }
      
      h2 .button.white { 
         color: #003158;
         background: white; }
      
      h2 .button:hover, h2 .button.white:hover {
         background: #008cff;
         color: white; }
         
         
article.news-pr {
   display: inline-block;
   width: 31%;
   position: relative;
   vertical-align: top;
   text-align: left;
   margin: 1em 3% 1em 0;
   float: left;}
   
   article.news-pr:nth-child(3n+4) { margin-right: 0; }
   article.news-pr:nth-child(3n+5) { clear: both; margin-right: 3%;}
   article.news-pr h3 { 
      font-size: 160%;
      -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; }
   article.news-pr:hover h3 { color: #008cff; }
   
   
#video article {
   width: 100%;
   height: 320px; 
   display: block;
   position: relative; }
         
      #video article a {
         display: block; }
         
      #video article .icon {
         position: absolute;
         color: #fdba31;
         font-size: 70px;
         font-family: 'trilogyicons';
         z-index: 101;
         top: 40%;
         left: calc(50% - 35px);
         text-transform: uppercase;}
         
      #video article figure {
         width: 100%;
         height: 100%;
         background: #003158;
         position: absolute;
         z-index: 1; }
      
      #video article figure .image {
         width: 100%;
         height: 100%;
         background-size: cover;
         background-repeat: no-repeat;
         background-position: center;
         opacity: .25;
         -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; }
         
         #video article:hover figure .image {
            opacity: .65; }
         
      #video article h2 {
         color: white;
         font-size: 180%;
         position: absolute;
         z-index: 100;
         text-align: center;
         bottom: 1em;
         font-weight: 700; }
         
#photos article {
   margin: 0 .75em .75em 0;
   display: inline-block; }

   #photos article figure {
         width: 150px;
         height: 150px;
         background: #003158;
         position: relative;
         z-index: 1; }
      
      #photos article figure .image {
         width: 100%;
         height: 100%;
         background-size: cover;
         background-repeat: no-repeat;
         background-position: center;
         opacity: .5;
         -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; }
         
         #photos article:hover figure .image {
            opacity: 1.0; }

/* General Form Styles */   

form.general {
	padding: 0;
	}
   
form.general h1 {
   color: #0066ba;
   margin-bottom: .5em;
   text-align: center; 
}
	
@media only screen and (min-width: 740px)  { 
	form.general {
		padding: 1em 0 0;
		max-width: 660px;
		}
	}	

form.general .field {
  padding: 0 0 .5em;
  text-align: center;
    width: calc(48% - 1.2em); 
    margin: 0 2%;
  }
  
form.general .field.message {
   width: calc(100% - 1.9em);
}
  
@media only screen and (max-width : 740px) { 
  form.general .field {
    padding-bottom: .5em;
    width: calc(96% - 1.2em);
    margin: 0 2%;    }
  } 

@media only screen and (min-width : 740px) { 
	form.general .cf .field {
    float: left;
    padding-left: .5em;
    }
  form.general .cf .field:first-child {
    padding-left: 0;
    }
  } 
  
form.general .button {
  padding: .5em 0 0;
  text-align: center;
  }
  
form.general input, 
form.general textarea {
  width: 100%;
  background: white;
  border: 1px solid #a4a4a4;
  color: #0066ba;
  font-size: .8em;
  padding: .6em;
  }
  
form.general input:focus,
form.general textarea:focus {
  background: white;
  border: 1px solid #999999;
  color: black;
  }

form.general button {
  background: #0066ba;
  padding: .35em .5em;
  color: white;
  white-space: nowrap;
  display: inline-block;
  font-weight: 700;
  font-size: 1.5em;
  text-transform: uppercase;
  border: none;
  }

form .disclaimer {
   margin: 0 2% 2% 2%;
   font-size: 50%;  }


select {
   height: 50px;
    width: 100%;
    font-size: .8em;
    background: white;
    color: #777;
}
      
@media only screen and (max-width: 1200px)  {
   section#microsite .landing h1 { font-size: 70%; }
   section#microsite .landing { height: 80vh; min-height: 680px; }
   #logo-micro img { height: 150px; }
   .topbanner { width: calc(80% - 4em); margin: 0 calc(15% - 4em); bottom: 2em; }
   #hightlighted-above .wrap, #below.wrap { width: 94%; }
   #photos article figure { width: 125px; height: 125px; }
   article.news-pr { font-size: 85%; }
   .flex-container { display: block; }
   .flex-container article { margin: 0 0 .5em 0; }
}

@media only screen and (max-width: 720px)  {
   .primary .join-us { width: auto; }
   section#microsite .landing {  height: auto; background-position: top center; background-size: contain; min-height: none; }
   article.news-pr { font-size: 85%; width: 100%;  margin: 0 0 1em 0; float: none; }
   .half, #below .photos { width: 90% !important; float: none !important; margin: 0 0 1em 0 !important; }
   .topbanner { position: relative; width: 100%; margin: 0 auto; padding: 1em 0; border-radius: 0; bottom: initial; background: rgba(0,140,255,1); }
   section#microsite .landing h1 { position: relative; }
   #logo-micro img { padding: 1em 0; max-width: 100%; }
   .join-us input, .join-us .zip { width: 100%; }
   #video article { height: 240px; }
   #video article h2 { font-size: 140%; }
}









