/*
* Skeleton V2.0.4
* Copyright 2014, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 12/29/2014
*/


/* Table of contents
-------------------------------------------------------------------------------- 
- Grid
- Base Styles
- Typography
- Links
- Buttons
- Forms
- Lists
- Code
- Tables
- Spacing
- Utilities
- Clearing
- Media Queries
*/

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Grid
-------------------------------------------------------------------------------- */ 
.container {
  position: relative;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 20px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }
.column,
.columns {
  width: 100%;
  float: left;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }
  
.row {position:relative;}

/* For devices larger than 400px */
@media (min-width: 400px) {
  .container {
    width: 85%;
    padding: 0; }
    
   .social {float:right;}
}

/* For devices larger than 550px */
@media (min-width: 550px) {
  .container {
    width: 80%; }
  .column,
  .columns {
    margin-left: 4%; }
  .column:first-child,
  .columns:first-child {
    margin-left: 0; }

  .one.column,
  .one.columns                    { width: 4.66666666667%; }
  .two.columns                    { width: 13.3333333333%; }
  .three.columns                  { width: 22%;            }
  .four.columns                   { width: 30.6666666667%; }
  .five.columns                   { width: 39.3333333333%; }
  .six.columns                    { width: 48%;            }
  .seven.columns                  { width: 56.6666666667%; }
  .eight.columns                  { width: 65.3333333333%; }
  .nine.columns                   { width: 74.0%;          }
  .ten.columns                    { width: 82.6666666667%; }
  .eleven.columns                 { width: 91.3333333333%; }
  .twelve.columns                 { width: 100%; margin-left: 0; }

  .one-third.column               { width: 30.6666666667%; }
  .two-thirds.column              { width: 65.3333333333%; }

  .one-half.column                { width: 48%; }

  /* Offsets */
  .offset-by-one.column:first-child,
  .offset-by-one.columns:first-child          { margin-left: 8.66666666667%; }
  .offset-by-one.column,
  .offset-by-one.columns          { margin-left: 12.66666666667%; }
  .offset-by-two.column:first-child,
  .offset-by-two.columns:first-child,
  .offset-by-twoAB.columns         { margin-left: 17.3333333333%; }
  .offset-by-two.column,
  .offset-by-two.columns          { margin-left: 17.3333333333%; }
  .offset-by-three.column,
  .offset-by-three.columns        { margin-left: 26%;            }
  .offset-by-four.column,
  .offset-by-four.columns         { margin-left: 34.6666666667%; }
  .offset-by-five.column,
  .offset-by-five.columns         { margin-left: 43.3333333333%; }
  .offset-by-fiveAB.columns       { margin-left: 39.3333333333%; }
  .offset-by-six.column,
  .offset-by-six.columns          { margin-left: 52%;            }
  .offset-by-seven.column,
  .offset-by-seven.columns        { margin-left: 60.6666666667%; }
  .offset-by-eight.column,
  .offset-by-eight.columns        { margin-left: 69.3333333333%; }
  .offset-by-nine.column,
  .offset-by-nine.columns         { margin-left: 78.0%;          }
  .offset-by-ten.column,
  .offset-by-ten.columns          { margin-left: 86.6666666667%; }
  .offset-by-eleven.column,
  .offset-by-eleven.columns       { margin-left: 95.3333333333%; }

  .offset-by-one-third.column,
  .offset-by-one-third.columns    { margin-left: 34.6666666667%; }
  .offset-by-two-thirds.column,
  .offset-by-two-thirds.columns   { margin-left: 69.3333333333%; }

  .offset-by-one-half.column,
  .offset-by-one-half.columns     { margin-left: 52%; }

}




/* Base Styles
-------------------------------------------------------------------------------- */ 
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
  font-size: 62.5%; }
  
body {
  font-size: 1.6em; /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 1.4;
  font-weight: 400;
  font-family: 'source-serif-pro', serif;
  color: #343f46; 
  position: relative;
  margin: 0;
  padding: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
    -ms-flex-direction: column;
        flex-direction: column;
  }
  
  html, body {
    height: 100%;
    min-height: 100%;
}


/* Typography  
-------------------------------------------------------------------------------- */ 

.dark-bg p, .dark-bg h1, .dark-bg h2, .dark-bg h3, .dark-bg h4, .dark-bg blockquote {color:#FFF;}
.positive blockquote {color:#faa519}

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: 2rem;
  font-weight: 300; 
  }

  #opener h1  { font-size: calc(20px + (30 - 20) * (100vw - 320px) / (1500 - 320)); font-family: 'proxima-nova', serif; font-weight: 900; line-height:1.1;  margin:0;  letter-spacing:.6rem; text-transform:uppercase; color:#3fbdad;}
  h1  { font-size: calc(16px + (20 - 16) * (100vw - 320px) / (1500 - 320)); font-family: 'proxima-nova', serif; font-weight: 900; line-height:1.1;  margin:100px 0;  letter-spacing:.6rem; text-transform:uppercase; text-align:center;}
  h2 { font-size: calc(22px + (26 - 22) * (100vw - 320px) / (1500 - 320)); font-family: 'source-serif-pro', serif; margin:0 0 70px 0;  }
  h3 { font-size: calc(20px + (30 - 20) * (100vw - 320px) / (1500 - 320)); font-family: 'proxima-nova', serif; font-weight: 900; font-weight: 900; margin:0; }
  #opener-fixed h3 { font-size: calc(140px + (600 - 140) * (100vw - 320px) / (1500 - 320));  font-family: 'source-serif-pro', serif; font-weight: 300; margin:0; color:#FFF;}
  h4 { font-size: calc(16px + (20 - 16) * (100vw - 320px) / (1500 - 320)); font-family: 'proxima-nova', serif; font-weight: 700; line-height:-1; margin:10px 0 0 0; text-transform:uppercase; letter-spacing:0.2em}
  h5 { font-size: calc(16px + (20 - 16) * (100vw - 320px) / (1500 - 320)); font-family: 'proxima-nova', serif; font-weight: 700; line-height:-1; margin:10px 0 0 0; text-transform:uppercase; letter-spacing:0.2em}
  h6 { font-size: 1.7rem; font-family: 'source-serif-pro', serif; color: #87dadf; }
  p {margin:0 0 30px 0;}
  
  p.facts {font-size: calc(100px + (140 - 100) * (100vw - 320px) / (1500 - 320)); font-family: 'source-serif-pro', serif; font-weight: 700; margin:10px 0 0 0;  padding:10px 0 0 0; line-height:0.8; border-top:1px solid #FFF;}
  p.facts.first {border-top:none;}
  p.facts-more {font-family: 'proxima-nova', serif;  margin:0; padding:10% 0 100px 0;}
  
blockquote {font-size: calc(20px + (34 - 20) * (100vw - 320px) / (1500 - 320)); font-family: 'source-serif-pro', serif; font-weight: 700; line-height:1.1; hanging-punctuation: first; color:#005a76; margin:0; padding:0; }

footer p {font-size: calc(12px + (14 - 12) * (100vw - 320px) / (1500 - 320)); font-family: 'proxima-nova', sans-serif; }
footer a, footer a:visited {color: #FFF;}
footer a:hover, footer a:active, footer a:focus {color: #3cbcac;}
.social {width: 80px !important;}
	
.intro { font-size: calc(22px + (40 - 22) * (100vw - 320px) / (1500 - 320));
	font-family: 'source-serif-pro', serif;
	font-weight: 300;
	line-height:105%;
	text-align:center;
	margin:200px 0;
	}
	
.name {
	font-size: 16px;
	font-family: 'proxima-nova', serif; 
	font-weight: 900;
	text-transform:uppercase; 
	margin:2.5rem 0 0;
	letter-spacing:.2em;
	}
	
.title {
	font-size: 16px;
	font-family: 'proxima-nova', sans-serif; 
	font-weight: 400;
	text-transform:uppercase;
	letter-spacing:.2em;
	margin:0;
	}

.heavy  {font-weight: 600;}


@media screen and (min-width: 1500px) {
	#opener h1 { font-size: 30px}
	h1 { font-size: 20px}
	h2 { font-size: 26px}
	h3 { font-size: 30px;}
	#opener-fixed h3 { font-size: 600px;}
	blockquote { font-size: 34px}
	#introduction p{ font-size: 24px}
	h4 { font-size: 16px}
	h5 { font-size: 20px}
	footer p{ font-size: 14px}
	.intro { font-size: 40px;}
	p.facts { font-size: 140px;}
}

@media screen and (max-width: 320px) {
	#opener h1 { font-size: 20px}
	h1 { font-size: 16px}
	h2 { font-size: 22px}
	h3 { font-size: 20px}
	#opener-fixed h3 { font-size: 140px;}
	blockquote { font-size: 20px}
	#introduction p{ font-size: 20px}
	h4 { font-size: 16px}
	h5 { font-size: 16px}
	footer p{ font-size: 12px}
	.intro { font-size: 22px;}
	p.facts { font-size: 100px;}
}

/*Sections
-------------------------------------------------------------------------------- */ 
header {
	background-color:rgba(51, 62, 70, 0);
    padding: 26px 0;
    width: 100%;
    color: #FFF;
	position:fixed;
	top:0;
	display:block;
	z-index: 3000;
	height:85px;
	-moz-transition:all .2s ease-in; -o-transition:all .2s ease-in; -webkit-transition:all .2s ease-in;
    }
    
/*.changed {
	background-color:rgba(51, 62, 70, 1);
	box-shadow: 0 6px 14px -10px black;
	}
*/
    
#logo, #logo img {width:231px; -webkit-box-sizing: border-box; box-sizing: border-box;}

/*
 * Let's target IE to respect aspect ratios and sizes for img tags containing SVG files
 *
 * [1] IE9
 * [2] IE10+
 */
/* 1 */
.ie9 img[src$=".svg"] {
  width: 100%; 
}
/* 2 */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  img[src$=".svg"] {
    width: 100%; 
  }
}

footer {
    margin: 0;
    width: 100%;
    color: #FFF;
    padding:50px 0;
    }

.light-bg footer, .light-bg footer a  {color: #343f46;}    
.light-bg footer a:hover, .light-bg footer a:active, .light-bg footer a:focus {color: #005a76;}


p img {margin:100px 0 !important;}
.sticky img, .sticky.first  {margin:0 0 100px 0 !important;}

#button-nav {background-color:#3fbdad; color:#FFF; text-align: center; overflow:hidden; position:relative; height:80vh; margin-top: 100px;}
.light-bg #button-nav  {background: #005a76;}

#button-nav h5 {text-transform:uppercase; margin:0 0 40px 0;}

#button-nav a { font-size: calc(28px + (40 - 28) * (100vw - 320px) / (1500 - 320));  font-family: 'source-serif-pro', serif; font-weight: 300; margin:0; padding:0; color:#FFF; text-transform:none; border:none; letter-spacing: .1rem; position:relative;}
#button-nav a:hover { color:#005a76; letter-spacing: 0.5rem;}

#button-nav a:before {
  content: "";
  position: absolute;
  width: 0%;
  height: 2px;
  bottom: 0;
  left: 50%;
  background-color: #005a76;
  visibility: hidden;
  -webkit-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
}

#button-nav a:hover:before {
  width: 100%;
  visibility: visible;
  left:0;
}

.light-bg #button-nav a:hover { color:#00d1af; letter-spacing: 0.5rem;}
.light-bg #button-nav a:before { background-color: #00d1af; }

#button-nav p {margin-top:50px;}
#button-nav .date {position:absolute; top: 50%; left: 0; right: 0; margin: auto; height: 80vh; z-index:-1}
.date p {font-size: calc(140px + (500 - 140) * (100vw - 320px) / (1500 - 320)); font-weight:300; opacity: 0.2;}

.dark-bg .date p {opacity: 0.1;}
.light-bg .date p {opacity: 0.2;}
#button-nav .date p {opacity: 0.2;}

#date-header-wrap {color:#FFF; text-align: center; overflow:hidden; position:fixed; top:0; height:290px; z-index:-200; width:100%;}
#date-header-wrap .date {position: absolute;
    top: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0;
    right: 0;
    margin: auto; height: 290px;}
    

@media screen and (min-width: 1500px) {
.date p {font-size: 500px;}
}

@media screen and (max-width: 320px) {
.date p {font-size: 140px;}
}



.centered {
	position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0;
    right: 0;
    margin: auto;
}


    
#opener {
 	color:#3FBDA7;
    width: 100%;
    position:relative;
    text-align:center;
    height:100vh;
    overflow: hidden;
 }
 
 #opener-fixed {
 	color:#3FBDA7;
    width: 100%;
    position:fixed;
    text-align:center;
    height:100vh;
    overflow: hidden;
    top:0;
    left:0;
    right:0;
    bottom:0;
    z-index:-10;
 }
 
#main-pics {padding:200px 0;}
.hero-image {padding:100px 0;} 
.home .image1 {z-index:1;}
.home .image2 {z-index:0;}
.padded { margin-top:40px; position: relative; z-index: 2;}	

 #wrap {
    width: 100%;
    -webkit-box-flex: 1;
        -ms-flex: 1 0 auto;
            flex: 1 0 auto;
	} 
 #wrap-sub {
 	margin-top:290px;
    width: 100%;
    -webkit-box-flex: 1;
        -ms-flex: 1 0 auto;
            flex: 1 0 auto;
	}
	
.middle-fit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    position:relative;
    flex-flow: row nowrap; /* required */
    }

.full {
	z-index:2000;
	position:relative;
	    box-sizing: border-box; /* required */
    width: 100%; /* required */
    flex: none; /* required */
	}
.back {
	z-index:10;
	position:relative;
	    box-sizing: border-box; /* required */
    width: 100%; /* required */
    flex: none; /* required */
    margin-left: -100%; /* required */
	}
  

@media only screen and (max-width: 549px) { 
	#opener {padding:100px 0 70px 0;}
}

/*image rollovers */

.main-link {
	border: 30px solid #333e46;
    box-sizing: border-box;
    margin-top:-200px;
    overflow:hidden;
}

.main-image-link {
    height: 0;
    padding-bottom: 100.15%;
    float: left;
    display: inline-block;
    position: relative;
    width: 100%;
}

.main-image-link-image-fill {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}

.color-fill {
    display: block;
    height: 100%;
    opacity: 0;
    position: absolute;
    top: 0;
    -webkit-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
    width: 100%;
    z-index: 1;
    background-color: #3cbcac;
}

.titles {
    display: block;
    height: 100%;
    opacity:0;
    position: absolute;
    top: 0;
    -webkit-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
    width: 100%;
    z-index: 2;
}

.titles > h3 {
    padding: 10px;
    margin: 0;
    text-transform:uppercase;    
    color: #FFF;
    text-align: center;
    display: block;
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
    transform: translate3d(0,0,0);
}

.main-link:hover .main-image-link-image-fill {transform: scale(1.1);}
.main-link:hover .color-fill {opacity: .8;}
.main-link:hover .titles {opacity: 1;}
.main-link:hover .titles > h3 {transform: translate3d(0,-50%,0);}

@media only screen and (max-width: 549px) {
#main-pics {padding-top:10px;}
.main-link {margin-top:10px; border: 10px solid #333e46;}
}


/* Animations
-------------------------------------------------------------------------------- */ 

    .fader {
        opacity: 0;
        transform: translateY(6em);
    }
    
    .fader.is-visible {
		opacity: 1;
		transform: translateY(0);
		transition: transform 1.5s .25s cubic-bezier(0,1,.3,1),
              opacity .3s .25s ease-out;
	}
	
	#opener {
		opacity: 0;
		transition: opacity .5s .25s ease-out;
	}

	#opener.is-visible {
		opacity: 1;
	}
	
	#opener h1 {
		transform: translateY(3em);
		transition: transform 1.5s .25s cubic-bezier(0,1,.3,1), filter 10s 2s ease-out;
        will-change: transform;
	}

	#opener.is-visible h1, .is-visible .h1sub {
		transform: translateY(0);
	}
	
	h3 span {
		display:inline-block;
		overflow:hidden;
		margin-top:10%;
		color:#3b444c;
	}

	.is-visible  h3 span em{
		transform: translateY(0);
	}
	
	h3 span em {
		display:block;
		transform: translateY(2em);
        will-change: transform;
        font-style:normal;
	}
	
	h3 span em {
		transition: transform 1.5s .25s cubic-bezier(0,1,.3,1), filter 10s 2s ease-out;
	}

	h3 span:nth-of-type(2) em {
		transition: transform 1.5s .35s cubic-bezier(0,1,.3,1), filter 10s 2s ease-out;
	}
	h3 span:nth-of-type(3) em {
		transition: transform 1.5s .45s cubic-bezier(0,1,.3,1), filter 10s 2s ease-out;
	}
	h3 span:nth-of-type(4) em {
		transition: transform 1.5s .55s cubic-bezier(0,1,.3,1), filter 10s 2s ease-out;
	}	


/* Links
-------------------------------------------------------------------------------- */ 
a {
  color: #5db1b5; text-decoration:none; -moz-transition:all  .2s ease-in; -o-transition:all  .2s ease-in; -webkit-transition:all  .2s ease-in;}
a:hover {
  color: #333e46;  text-decoration:none;}
  
  .btn {
   font-weight:700;
    position: relative;
    text-decoration: none;
    padding: 0 65px 0 0;
}

.btn:before {
    border-top: 2px solid #5db1b5;
    border-right: 2px solid #5db1b5;
    width: 12px;
    height: 12px;
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transform: translate(0,-6px) rotate(45deg);
    -ms-transform: translate(0,-6px) rotate(45deg);
    transform: translate(0,-6px) rotate(45deg);
}

.btn:after {
    width: 25px;
    height: 2px;
    background-color: #5db1b5;
}
.btn:after, .btn:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 20px;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

a.btn:hover:before{right:0;border-top:2px solid #333e46;border-right:2px solid #333e46;}
a.btn:hover:after{right:0;width:45px;background-color:#333e46;}
  
  
/* Social Media 
-------------------------------------------------------------------------------- */ 
.social{margin:0; float:right;}
.social-media1 {display:block; float:left; background:url("../images/linkedin-icon-on.png") no-repeat; margin-left:0px; background-size:24px 24px;}
.social-media2 {display:block; float:left; background:url("../images/twitter-icon-on.png") no-repeat; margin-left:15px; background-size:24px 24px;}

.social-media1 a, .social-media1 a:link, .social-media1 a:visited,
.social-media2 a, .social-media2 a:link, .social-media2 a:visited{ display:block; width: 24px; height: 24px; }

.social-media1 a:hover img,
.social-media2 a:hover img{ visibility:hidden; text-indent: 0; border:0;}



/* Navigation
-------------------------------------------------------------------------------- */ 

.nav {width:100% !important; margin-left: 0;}
    
.button_container {
  /*position: absolute; top: 20px; right: 0; */
  display:block;
  position:relative;
  float:right;
  height: 15px;
  width: 25px;
  cursor: pointer;
  -webkit-transition: opacity .25s ease;
  -o-transition: opacity .25s ease;
  transition: opacity .25s ease;
  margin-top:5px;
  z-index: 2000;
} 
 
.menu {
border-radius:25px;
padding: 5px 5px;
width: 25px;
height: 35px;
z-index: 1200;
-webkit-transition: all .25s ease;
-o-transition: all .25s ease;
transition: all .25s ease;
}

.menu:hover {
background-color: none;

}

.menu::before {
  display:none;
}

/* Larger than phablet */
@media (min-width: 900px) {
/*.menu::before {
 display:inline-block;
  content: "Menu ";
  font-size: .875em;
  font-family: 'proxima-nova', sans-serif;
} */

.menu { width:13.3333333333%; padding: 5px 0 5px 15px;}

}


/* Toggle the navigation bar open  */
header ul.nav.open { height: auto; }
header ul.nav.open li { display: block; }
header .nav {width: 100%; float: none; display: block; margin: 0; padding: 0; top: 20px; left: 0px; z-index: 998; clear: both; }
header ul.nav {position: relative; display: block; overflow:hidden; margin: 0; padding:0;}
header p {font-size: 28px; font-family:'proxima-nova', sans-serif;  text-transform:uppercase; font-weight:600;}

header ul.nav li {display: block; min-height: 20px; position: relative; opacity: 0; width:80%; margin:0 auto;}
header ul.nav li:first-child{padding-top:10px;} 
header ul.nav li a, header ul.nav li a:visited { font-size: 28px; font-weight:300;  color:#FFF; display: block; width: 100%; padding:0 0 15px 0; text-decoration:none; margin-bottom:2px; -moz-transition:all .2s;
-o-transition:all .2s;
-webkit-transition:all .2s; position: relative; line-height:110%;}
header ul.nav li a:hover { opacity: 0.3; text-decoration:none;}
header ul.nav li.first a, header ul.nav li.last a{border-bottom:none; padding-bottom:20px; font-family:'proxima-nova', sans-serif;  text-transform:uppercase; font-weight:600; margin-top:60px; width: 30.6666666667%;}

.overlay {position: fixed;  top: 0; left: 0; width: 100%; height: 0%; opacity: 0; visibility: hidden; -webkit-transition: opacity .35s, visibility .35s, height .35s; -o-transition: opacity .35s, visibility .35s, height .35s; transition: opacity .35s, visibility .35s, height .35s; overflow: hidden; z-index:1000;}
.overlay.open { opacity: 1; visibility: visible;  height: 100vh; } 
.overlay.open .color-overlay {opacity: 1; z-index: 1;}
.overlay.open li {-webkit-animation: fadeIn .5s ease forwards;animation: fadeIn .5s ease forwards; -webkit-animation-delay: .2s; animation-delay: .2s; border:none;}
.overlay.open li:nth-of-type(2) { -webkit-animation-delay: .25s; animation-delay: .25s;}
.overlay.open li:nth-of-type(3) { -webkit-animation-delay: .30s; animation-delay: .30s;}
.overlay.open li:nth-of-type(4) { -webkit-animation-delay: .35s; animation-delay: .35s;}
.overlay.open li:nth-of-type(5) { -webkit-animation-delay: .40s; animation-delay: .40s;}
.overlay.open li:nth-of-type(6) { -webkit-animation-delay: .45s; animation-delay: .45s;}
.overlay.open li:nth-of-type(7) { -webkit-animation-delay: .50s; animation-delay: .50s;}
.overlay.open li:nth-of-type(8) { -webkit-animation-delay: .55s; animation-delay: .55s;}
.overlay.open li:nth-of-type(9) { -webkit-animation-delay: .60s; animation-delay: .60s;}
.overlay.open li:nth-of-type(10) { -webkit-animation-delay: .65s; animation-delay: .65s;}
.overlay.open li:nth-of-type(11) { -webkit-animation-delay: .70s; animation-delay: .70s;}
.overlay.open nav { position: relative; height: 80vh; /*top: 50%; transform: translateY(-50%); text-align: center;*/ z-index: 1000; overflow-y: scroll;padding-right:20px;margin-right:-20px; margin-top:50px;}
.overlay.open ul li a:hover:after,
.overlay.open ul li a:focus:after,
.overlay.open ul li a:active:after { width: 100%;}    
@-webkit-keyframes fadeInRight 0% { opacity: 0; left: 20%; }    
@keyframes fadeInRight 0% { opacity: 0; left: 20%; }
@-webkit-keyframes fadeInRight 100% { opacity: 1; left: 0; }
@keyframes fadeInRight 100% { opacity: 1; left: 0; }  

.fixedPosition { overflow:hidden; padding-right: 15px;}

.button_container.activated .toggle-top{
  -webkit-transform: translateY(10px) translateX(0) rotate(45deg);
  -ms-transform: translateY(10px) translateX(0) rotate(45deg);
  transform: translateY(10px) translateX(0) rotate(45deg);
  }

.button_container.activated .toggle-middle {
  opacity: 0;
  }
    
.button_container.activated .toggle-bottom {
  -webkit-transform: translateY(-10px) translateX(0) rotate(-45deg);
  -ms-transform: translateY(-10px) translateX(0) rotate(-45deg);
  transform: translateY(-10px) translateX(0) rotate(-45deg);
  }

.dark-bg .button_container span {
  background: #FFF none repeat scroll 0 0;
  border: medium none;
  cursor: pointer;
  height: 2px;
  left: 0;
  position: absolute;
  top: 0;
  -webkit-transition: all 0.35s ease 0s;
  -o-transition: all 0.35s ease 0s;
  transition: all 0.35s ease 0s;
  width: 100%;
  }
  
.light-bg .button_container span {
  background: #333e46 none repeat scroll 0 0;
  border: medium none;
  cursor: pointer;
  height: 2px;
  left: 0;
  position: absolute;
  top: 0;
  -webkit-transition: all 0.35s ease 0s;
  -o-transition: all 0.35s ease 0s;
  transition: all 0.35s ease 0s;
  width: 100%;
  }

.button_container span:nth-of-type(2) {
  top: 6px;
  }

.button_container span:nth-of-type(3) {
  top:12px;
  }
  
.button_container.activated span {
background: #FFF;
  border: none;
  height: 3px;
  width: 100%;
  position: absolute;
  top: 0px;
  left: 0;
  -webkit-transition:  all .35s ease;
  -o-transition:  all .35s ease;
  transition:  all .35s ease;
  cursor: pointer;
  z-index:2000;
  } 

.button_container.activated span:nth-of-type(2) { top: 10px;}
.button_container.activated span:nth-of-type(3) { top: 20px;}

.color-overlay { display: block; height: 100%; opacity: 0; position: absolute; top: 0; -webkit-transition: opacity 0.2s ease 0s; -o-transition: opacity 0.2s ease 0s; transition: opacity 0.2s ease 0s; width: 100%; z-index: 1; background-color: #3cbcac;}


/* End Mobile Styles */

/* Buttons
-------------------------------------------------------------------------------- */ 
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
  margin:20px 0;
  width:100%;
  display: inline-block;
  padding: 12px 5px 12px 5px;
  color: #000;
  text-align: center;
  font-family:'proxima-nova', sans-serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .1rem;
  text-transform: uppercase;
  text-decoration: none;
  background-color: transparent;
  border: 2px solid #3cbcac;
  cursor: pointer;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
  color: #FFF;
  border-color: #3cbcac;
  background-color: #3cbcac;
  outline: 0; }
.button.button-primary,
button.button-primary,
input[type="submit"].button-primary,
input[type="reset"].button-primary,
input[type="button"].button-primary {
  color: #FFF;
  background-color: #33C3F0;
  border-color: #33C3F0; }
.button.button-primary:hover,
button.button-primary:hover,
input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover,
.button.button-primary:focus,
button.button-primary:focus,
input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
  color: #FFF;
  background-color: #1EAEDB;
  border-color: #1EAEDB; }
 
@media (min-width: 550px) {
.button {margin:100px 0;}
}  
  
  /* Lists
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.container ul {margin: 0 0 120px 10px; padding-left:10px; margin-bottom:3px;  font-size: 1.6rem;}
.container ul li {margin-bottom:10px;}
.container ul li {list-style-image:url('../images/dash.gif');}	



  /* Video
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.video-wrapper {
    position: relative;
    background-color: none;
    padding-bottom: 56.5%;
    height: 0;
    margin-bottom: 20px;
    overflow: hidden;
    max-width: 100%;
}

.video-wrapper object, .video-wrapper embed, .video-wrapper video {
    position: absolute;
    top: 0;
    left: 0;
    width: auto;
    height: 100%;
}

.homepage-video {
    position: relative;
    top: 0;
    left: 0;
    height: auto;
    width: 100%;
    display: block;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
}


/* Spacing
-------------------------------------------------------------------------------- */ 

input,
textarea,
select,
fieldset {
  margin-bottom: 1.5rem; }
pre,
dl,
figure,
table,
p,
ul,
ol,
form {
  margin-bottom: 2.5rem; }
  

/* Utilities
-------------------------------------------------------------------------------- */ 
.u-full-width {
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;}
.u-max-full-width {
  max-width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }
.u-pull-right {
  float: right; }
.u-pull-left {
  float: left; 
  margin-left:0;}
  
  


/* Misc
-------------------------------------------------------------------------------- */ 
hr {
  margin-top: 3rem;
  margin-bottom: 3.5rem;
  border-width: 0;
  border-top: 1px solid #E1E1E1; }
  
  
/* #Images
-------------------------------------------------------------------------------- */ 

.scale-with-grid img{
   max-width: 100%;
   height: auto;
   width: auto\9; /* ie8 */
   border:0;
   padding:0;
   margin:0;
   display:block;
}


/* Clearing
-------------------------------------------------------------------------------- */ 

/* Self Clearing Goodness */
.responsive-services,
#about-links:after,
.container:after,
.row:after,
.u-cf{
  content: "";
  display: table;
  clear: both; }
  
.clear {
  clear: both; }

/* Mobile
-------------------------------------------------------------------------------- */ 

/* For devices larger than 400px */
@media only screen and (max-width: 421px) {

html {
	font-size: 55%; 
	}

#logo, #logo img {
    width: 220px;
	}

.menu {
	width: 35px;
	height: 35px;
	}
	
}
@media only screen and (max-width: 549px) {  
#date-header-wrap {opacity:0;}
#wrap-sub {margin-top:90px;}
h1 {margin: 50px 0;}
.intro {margin: 0 0 50px 0;}
p.facts-more {padding: 10% 0 50px 0;}
p img {margin:50px 0 !important;}
.hero-image { padding: 50px 0; }

.changed {
	background-color:rgba(51, 62, 70, 1);
	box-shadow: 0 6px 14px -10px black;
	}
	
}

@media only screen and (min-width: 550px) {    
.sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 290px;
}
}