@font-face {  
        font-family: proximaBold;
        src: url(../fonts/ProximaNova-Bold.woff);
    }
    @font-face {
        font-family: proximaLight;
        src: url(../fonts/ProximaNova-Light.woff);
    }
    @font-face {
        font-family: proximaMedium;
        src: url(../fonts/ProximaNova-Medium.woff);
    }

    @keyframes spin {
        0% {transform: rotate(0deg); }
        100% {transform: rotate(360deg); }
    }

    h1 {
        color: #282829;
        font-size:47px;
        font-family: proximaBold !important;
        line-height: 50px;
    }

    *,
    *::before,
    *::after {
        box-sizing: border-box;
    }

    input,
    button,
    select,
    optgroup,
    textarea {
      margin: 0;
      font-family: inherit;
      font-size: inherit;
      line-height: inherit;
    }

    button,
    input {
        overflow: visible;
    }

    button,
    select {
        text-transform: none;
    }

    button,
    html [type="button"],
    [type="reset"],
    [type="submit"] {
         -webkit-appearance: button;
    }

    .navbar {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        padding: 0.5rem 1rem;
        -webkit-box-shadow: 3px 5px 7px 0px #888;
        -moz-box-shadow: 3px 5px 7px 0px #888;
        box-shadow: 3px 5px 7px 0px #888;
        -ms-box-shadow: 3px 5px 7px 0px #888;
    }

    img {
        vertical-align: middle;
        border-style: none;
    }

    h1, h2, h3, h4, h5, h6 {
        margin-top: 0;
        margin-bottom: 0.5rem;
    }

    .container {
      width: 100%;
      padding-right: 15px;
      padding-left: 15px;
      margin-right: auto;
      margin-left: auto;
    }

    @media (min-width: 576px) {
      .container {
        max-width: 540px;
      }
    }

    @media (min-width: 768px) {
      .container {
        max-width: 720px;
      }
    }

    @media (min-width: 992px) {
      .container {
        max-width: 960px;
      }
    }

    @media (min-width: 1200px) {
      .container {
        max-width: 1140px;
      }
    }

    p {
        margin-top: 0;
        margin-bottom: 1rem;
        color: #282829;
        font-size: 0.18em;
    }

    span {
        font-family: proximaBold !important;
    }

    span a{
        text-decoration: none;
        color: black;
    }

    body {
        font-family: proximaLight !important;
        border:0;
        margin:0;
        overflow-y:hidden;
    }

    .imgdiv {
        left:0;
        position:fixed;
        top:0;

    }

    a {
        color: #007bff;
        text-decoration: none;
        background-color: transparent;
        -webkit-text-decoration-skip: objects;
    }

    .navBar {
        position:fixed;
        top:0;
        left:0;
        height: 10%;
        z-index:100;
        width:100%;
        background-color: #F8F9FA;
    }

    #fan1 {
        animation: spin 8s linear 0s infinite;
    }

    .menuItem {
        font-family: proximaMedium !important;
        float: right;
        color: black;
        padding: 40px 0px 30px 50px;
        text-align: center;
        cursor:pointer;
    }

    .innerImgDiv {
        float:left;
    }

    .theatreMode {
        position:fixed;
        width: 100%;
        height: 100%;
        z-index:200;
        background-color: rgba(0,0,0,0);
        display:none;
    }

    #video {
        display:none;
        margin-top: 15%;
    }

.collapsey li {
    font-family: proximaMedium;
}

.skewBox {
    transform: skewX(17.6deg);
    position: absolute;
    top: 0px;
    transform-origin: top left;
    width:10px;
}
.straightBox {
    position: absolute;
    top: 0px;
    transform-origin: top left;
    width:10px;

}

.nemIslands {
	position:relative; 
	top:-10px; 
	z-index:-1;
	background-image:url("../images/island-01-generation_v003.png");
	background-repeat:no-repeat;
	background-size:402%;
}

.nemIslands2 {
	position:relative; 
	top:-40px; 
	z-index:-1;
	background-image:url("../images/island-01-generation_v003.png");
	background-repeat:no-repeat;
	background-size:402%;
}

.imgHover {
	opacity: 0.5;
	transition: all 250ms ease;
}

.imgHover:hover {
	opacity: 1;
}

.proximaMedium{
	font-family:proximaMedium !important;
}

.shift {
    transform: translate(70px)
}

.shift2 {
    transform: translate(-70px)
}

.shift3 {
    transform: translate(-150px)
}

.collapsedTopButton {
    outline:none;
    border: 1px solid transparent;
    margin-right: 8%;
    cursor:pointer;
    position: absolute;
}

.secretContent {
    display:none;
    margin:0;
    float:right;
    padding-top: 15px;
    padding-left: 0;
    color: white;
    text-align: right;
    text-decoration: none;
}


.secretContent li {
    cursor: pointer;
    padding: 5px 20px 5px 20px;
    text-decoration: none;
    display: block;
    -webkit-box-shadow: 3px 5px 7px 0px #888;
    -moz-box-shadow: 3px 5px 7px 0px #888;
    box-shadow: 3px 5px 7px 0px #888;
    -ms-box-shadow: 3px 5px 7px 0px #888;
}


.dropDownDiv {
    position: fixed;
    width:250px;
    left: 340px;
    top: 32px;
    z-index:100;
}


.contentContainer{
    float: left;
}

.hideonbig {
	display:none;
}

#h21 {
	display:none;
}
    @media (max-width: 1350px) {
        .collapsey {
            display:none;
            padding:0;
            text-align:center;
        }
        
        #h21 {
			display:block;
        }
        
        #h17 {
			display: none;
		}
        
        .hideonbig {
			display:block
        }
        
        .contentContainer{
            float: right;
        }
        
        .circle {
            display:none;
            padding:0;
            text-align:center;
        }
        
        .secretContent {
            display:block;
            text-align: left;
        }

        .collapsedTopButton {
            display:block;
            position:absolute;
            outline:none;
            right:0;
            margin-right:25px;
            font-size: 1.25rem;
            background-color:transparent;
            border:0px;
            float:right;
        }
        .nav-contentHidden{
			display:none;       
        }
        
		.dropDownDiv {
			right: 40px;
			top: 10%;
			left:auto;
		}
		#hamCollapse2 {
			display:none;
		}
    }

@media (max-width: 380px) {
    .navLogo {
        
    }
}

/*    li {
        display:inline-block;
        float:none;
        padding-left:10px;
        padding-right:20px;
 		font-family:proximaMedium;
   }

    ul {
        text-align: right;
        align-self: center;
    }*/

.nav-contentHidden {
    margin:0;
    float:right;
    padding-top: 1rem;
    padding-left: 0;
    color: white;
    text-decoration: none;
}

.nav-contentHidden li {
    cursor: pointer;
    padding: 5px 20px 5px 20px;
    text-decoration: none;
    display: block;
    -webkit-box-shadow: 3px 5px 7px 0px #888;
    -moz-box-shadow: 3px 5px 7px 0px #888;
    box-shadow: 3px 5px 7px 0px #888;
    -ms-box-shadow: 3px 5px 7px 0px #888;
}

@media (max-width: 800px) {
    
    .fixedTop {
        width:100%;
    }
}

@media (max-width: 497px) {
}

.fixedTop {
    background-color: white;
    display:none;
    position:fixed;
    right: 0;
    top:58px;
    z-index:20;
    width:200px;
    -webkit-box-shadow: 1px -1px 20px 6px #888;
    -moz-box-shadow: 1px -1px 20px 6px #888;
    box-shadow: 1px -1px 20px 6px #888;
    -ms-box-shadow: 1px -1px 20px 6px #888;
}


.a7 {
    position:absolute; 
    font-size:0.53em; 
    line-height:1em; 
    color:white; 
    opacity:0;
}

.absolute {
    position: absolute;
}

.absoluteOpacity { 
    position: absolute;
    opacity: 0;
}

.relativeOpacity {
    position: relative;
    opacity: 0;
}

.pointer {
    cursor: pointer;   
}

.arrows {
    width:50%; 
    height:auto;
    filter: drop-shadow( 1px 1px 4px rgba(255, 255, 255, 1));
}

.white {
    color: white;
}

.font40 {
    font-size: 0.4em;
    line-height: 1em;
}

.font48 {
    font-size: 0.48em;
    line-height: 1em;
    color: white;
}

.font48b { 
    font-size:.48em;
    line-height:1em;
    color:black;
}

.font60 {
    font-size: 0.65em;
    line-height: 1.1em;
}

.font63 {
    font-size: 0.63em;
    line-height: 1.1em;
}

.font34 {
    font-size: 0.34em;
    line-height: 1.1em;
    color: white;
    text-align: center;
}

.font25 {
    font-size: 0.25em;
    color: white;
}

.font17 {
    font-size: 0.17em;
    line-height: 1.1em;
    text-align:center;
}

.font18 {
    font-size: 0.18em;
    line-height: 1.1em;
}

.textShadow {
    text-shadow: 1px 1px 8px #373737;
}

.dropShadow {
    filter: drop-shadow(1px 1px 4px rgba(0, 0, 0, 0.72)); 
}

.z0 {
    z-index: 0;  
}

.z1 {
    z-index: 1;
}

.z2 {
    z-index: 2;
}

.z3 {
    z-index: 3;
}

.z4 {
    z-index: 4;
}

.z5 {
    z-index: 5;
}

.z100 {
    z-index:100;
}

.z101 {
    z-index: 101;
}

.center {
    text-align:center;
}

.dropdown {
    background-color: rgba(255,255,255,1);
    height: auto;
    width: 220px;
    margin-bottom: 2px;
}

.dropdown img{
    height: 6%;
}

.dropdown p{
    margin-top: 0.2rem;
    margin-bottom: 0.2rem;
}

.circle {
    background-color: rgba(255,255,255,1);
    float:right;
    width:80px;
    height:80px;
    border-radius:50%;
    right:0;
    margin:0;
    cursor: pointer;
    -webkit-box-shadow: 3px 5px 7px 0px #666;
    -moz-box-shadow: 3px 5px 7px 0px #666;
    box-shadow: 3px 5px 7px 0px #666;
    -ms-box-shadow: 3px 5px 7px 0px #666;
}

.circle img {
    margin-left: auto;
    margin-right: auto;
    padding-top: 16%;
    margin-bottom: auto;
    display: block;
}

.navdiv>ul {
    text-align: right;
    align-self: center;
}

.navdiv>ul>li {
    display:inline-block;
    float:none;
    padding-left:10px;
    padding-right:20px;
}

.article {
    height:200px;
}

hr {
    margin-top: 40px;
    margin-bottom: 40px;
}

.active {
    background-color: white;
    box-shadow: 6px 7px 20px 0px #AAA;
}

.black {
    color: black;
}

    .tabs {
        padding-top: 3%;
        padding-bottom: 3%;
    }

@media (max-height: 880px) {
    .tabs {
        padding-top: 2.5%;
    }
}

@media (max-height: 750px) {
    .tabs {
        padding-top: 2%;
    }
}

@media (max-height: 660px) {
    .tabs {
        padding-top: 1%;
    }
}

.tabs p {
    font-size:1rem;
    display:inline;
}

.social {
    padding-top:25%;
    padding-right:10px;
}

.snippet {
    color: #AAA;

}

.formText {
    background-color: #e7e7e7;
    border: 0;
    display:inline-block;
}

.formButton {
    display: inline;
    float:right;
}

.container{
    font-family:proximaLight;
}

a:hover{
    text-decoration: none;
    color:black;
}
.drop {
    filter: url(#drop-shadow);
    -webkit-filter: url(#drop-shadow);
}

ul.energy li{
/*
    list-style-image: url("../images/aboutPage/dotPoint.png");
*/
	list-style-type: circle;
}
 
ul.topInteractiveBar {
    text-align: right;
    align-self: center;
}

li.topInteractiveBar {
    display:inline-block;
    float:none;
    padding-left:10px;
    padding-right:20px;
}

.dropdownp {
    font-size:1rem; 
    cursor:pointer; 
    display:inline;
    margin-top:10px; 
    font-family: proximaMedium;
}

.permanentTab {
    transition: all 0.5s ease; 
    width: 50px;
    height: 144px;
    background-color: #fff;
    position: fixed;
    left:0;
    top: 43%;
    -webkit-box-shadow: 3px 5px 7px 0px #666;
    -moz-box-shadow: 3px 5px 7px 0px #666;
    box-shadow: 3px 5px 7px 0px #666;
    -ms-box-shadow: 3px 5px 7px 0px #666;
    opacity: 0.4;
}

.permanentTab:hover {
    opacity:1;
}

#e14:hover {
    color:white;
}