@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Oswald:300,600);
@import url(https://fonts.googleapis.com/css?family=Quattrocento+Sans:400,700);

body {
    margin:0 auto;
    font-family: 'Quattrocento Sans', sans-serif;
    font-size: 1.4em;
    overflow-x: hidden;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
}

header {
    z-index: 11;
    position:relative;
}

.gradient {
    background-image:url(../images/blue.png);
    background: url(../images/blue-down-transup.png) repeat-x;
    background: url(../images/top.png) repeat-x;
    position:relative;
    z-index:10;
    background-size:contain;
    width: 100%;
    height: 200px;
    margin-top: 0px;

/*    margin-top: -110px;*/


}

.container-other {
    max-width: 1100px;
    margin: -100px auto 0;
    padding: 0 5%;
    position:relative;
    z-index:11;
}

/*HEADER*/

b, .bold{
    font-weight: 700;
}

#logo {
    max-width: 230px;
    width: 100%;
    margin: 20px 0 0 20px;
    float: left;
}

#desktop-nav {
    font-family: 'Oswald', sans-serif;
    float: left;
    margin-top: 55px;
    font-size:1.2em;
}

#mobile-nav, #no-js-nav {
    display: none;
}

#desktop-nav a {
    margin-left: 3.7em;
    text-decoration: none;
    color: black;
    color: #1E4985;
    color: #265BA6;
    color: #225296;
    float: left;
    text-align: center;
    line-height: 35px;
}


#desktop-nav a:focus, #desktop-nav a:hover {
    color: #8BB0E5;

}

#desktop-nav a:first-child {
    margin-left: 3em;
}

.single {
    margin-top: 13px;
}

/*MAIN*/

h1 {
    display: inline;
    font-size: 1.3em;
}

h2 {
    font-size: 1.2em;
}

.not-index h2 {
    color: #BFD2ED;
    font-size:1.3em;
}
.not-index h3 {
    color: #BFD2ED;
}

#about h2 {
    margin-left:30%;
}

#main-info {
/*
    
    background-image:url(../images/individuals/sky2.jpg) ;
    background-repeat: no-repeat;
    background-size:cover;
    background-position: 0 -15px;
    
    
*/
    
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#feffff+0,a8c1e3+83&0+0,0.5+51,1+74 */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZlZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iI2M5ZDllZSIgc3RvcC1vcGFjaXR5PSIwLjUiLz4KICAgIDxzdG9wIG9mZnNldD0iNzQlIiBzdG9wLWNvbG9yPSIjYjFjOGU2IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iODMlIiBzdG9wLWNvbG9yPSIjYThjMWUzIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
background: -moz-linear-gradient(top,  rgba(254,255,255,0) 0%, rgba(201,217,238,0.5) 51%, rgba(177,200,230,1) 74%, rgba(168,193,227,1) 83%); /* FF3.6-15 */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(254,255,255,0)), color-stop(51%,rgba(201,217,238,0.5)), color-stop(74%,rgba(177,200,230,1)), color-stop(83%,rgba(168,193,227,1))); /* Chrome4-9,Safari4-5 */
background: -webkit-linear-gradient(top,  rgba(254,255,255,0) 0%,rgba(201,217,238,0.5) 51%,rgba(177,200,230,1) 74%,rgba(168,193,227,1) 83%); /* Chrome10-25,Safari5.1-6 */
background: -o-linear-gradient(top,  rgba(254,255,255,0) 0%,rgba(201,217,238,0.5) 51%,rgba(177,200,230,1) 74%,rgba(168,193,227,1) 83%); /* Opera 11.10-11.50 */
background: -ms-linear-gradient(top,  rgba(254,255,255,0) 0%,rgba(201,217,238,0.5) 51%,rgba(177,200,230,1) 74%,rgba(168,193,227,1) 83%); /* IE10 preview */
background: linear-gradient(to bottom,  rgba(254,255,255,0) 0%,rgba(201,217,238,0.5) 51%,rgba(177,200,230,1) 74%,rgba(168,193,227,1) 83%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00feffff', endColorstr='#a8c1e3',GradientType=0 ); /* IE6-8 */

}

#main-text {
    width: 52%;
    display: block;
    margin: 20px 0 20px 8%;
    padding-bottom: 90px;
    padding: 10px 0 90px 0;
    font-size: 1.1em;
    line-height: 30px;
    position: relative;
    z-index: 11;
}
#home-right {
    position: absolute;
    top: 155px;
    left: 60%;
}

#under {
    position: absolute;
    left: -10px;
    z-index: 1;
    top: -50px;

}

#over {
    position: absolute;
    left: -30px;
    z-index: 3;
    top: -30px;
}

#menu-btn {
    display: none;
}

#water {
    width: 1460px;
    width: 100%;
    margin: 0 auto;
    margin: -180px auto -25px;
    z-index: 2;
    position: relative;
    min-height: 880px;
    height: auto;
    background:url(../images/individuals/watershort.png);
    background-repeat: repeat;

}

/*, #3778D2*/


#boat {
    float: left;
    margin-top: 50px;
    margin-left: 4%;
    position: relative;
    z-index: 2;
}
#boat img {
    width: 100%;
    height: auto;
    max-width: 440px;
}
#boat p {
    margin:0;
}

.fb-page {
        position: relative;
        z-index: 11;
        float: left;
        margin: 40px 0 30px 8%;
}

hr {
    display: none;
}

#links {
/*
    background-image:url(../images/individuals/waterpart.png) ;
    background-repeat: repeat-x;
    background-size:10% auto;
*/

    max-width: 1100px;
/*    width: 90%;*/
    z-index: 10;
    position: relative;
    font-family: 'Oswald', sans-serif;
    text-align: center;
    font-size: 1.2em; 
/*    position: absolute;*/
/*    margin-top:2.5em;*/
    height:300px;
    margin: -90px auto;
    padding-top: 40px;
}

#socialmedia {
    width: 100px;
    margin:0 auto 15px;
}

    
#facebook {
    width: 45px;
    height:43px;
    float: left;
    display: block;
    background: url(../images/facebook.svg) no-repeat 0 0;
}

#facebook:hover, #facebook:focus {
    background: url(../images/facebook.svg) no-repeat 0 -46px;
}

#mail {
    width: 45px;
    height:43px;
    float: left;
    display: block;
    background: url(../images/mail.svg) no-repeat  0 0;
}

#mail:hover, #mail:focus {
    background: url(../images/mail.svg) no-repeat 0 -46px;
}

.feat {
    width: 32%;
    margin: 0 auto;
    float: left;
    margin-top: 80px;
    position: relative;
    z-index: 10;
}

.text-feat {
    margin-left: 15px;
}

.image-link {
    padding-top: 20px;
    margin-bottom: 15px;
    display: block;
    font-weight: bold;
    color: white;
    text-decoration: none;
}
.image-link:focus,.other a:focus, #boat a:focus, footer a:focus,
.image-link:hover,.other a:hover, #boat a:hover, footer a:hover {
    color: #8BB0E5;
}

#boat .rov:hover {
   -webkit-animation: swing 2s;
    animation: swing 2s; 
}

.facebook-link {
    display: block;
    font-weight: bold;
    color: white;
    text-decoration: none;
}

#links img {
    margin-left: 5%;
}

/*
#links img:first-child {
    margin-left: 10%;
}
*/

.links {
    float: left;
    margin: 0 auto;
/*    height:340px;*/

}

.links a {
    text-decoration: none;
    color: white;
}

.clear {
    clear: both;
}

.not-index footer {
/*    background: #4a85d6;*/
/*    margin: 0;*/
}

#left {
    width: 20%;
    float: left;
    margin-right: 10%;
}

#aboutnav {
    text-align: left;
    padding: 0px;
}

#aboutnav li {
    list-style-type: none;
}

#right {
    float: left;
    width: 70%;
}
#affiliations li {
    list-style-type: lower-alpha;
    padding:5px 0;
}
#affiliations a {
    text-decoration: none;
}
footer {
    text-align: center;
    color: #376ED2;
    color: black;
    font-weight: 600;
    font-family: 'Oswald', sans-serif;   
    font-size: 1.2em;
    position:relative;
    z-index: 10;
    margin: -50px 0 0 0;
    padding: 50px 0 20px 0;
    background: url(../images/blue-down-transup.png) repeat-x;
    clear: both;
}

.small {
    font-size: .7em;
}

/*
ul {display: none;}

.container-other {
    height:500px;
}
*/

.other {
/*    background: #3778D2;*/
    background: #4a85d6;
    color:#DEE8F7;

    padding-bottom: 20px;
    padding-top: 100px;
    margin-top: -50px;
    margin-top: -130px;
    background: url(../images/individuals/waterpattern.jpg);
    background-repeat: repeat;
    background-position:0 -30px;

    color: black;
/*
    -moz-box-shadow: .5px 1px 2px rgba(255,255,255,.4);
		  -webkit-box-shadow: .5px 1px 2px rgba(255,255,255,.4);
    text-shadow: 0 0 0 transparent, .5px 1px 2px rgba(255,255,255,.4);
*/

}

.other a, footer a {
    text-shadow: none;
    color: white;
    text-decoration: none;
}

#mail {
    margin-left: 7.5px
}

a {
    color: #8BB0E5;
}

.thumbs {
box-shadow: 0 0 8px 8px #3f78c9 inset;
-webkit-box-shadow: 0 0 8px 8px #3f78c9 inset;
 -moz-box-shadow: 0 0 8px 8px #3f78c9 inset;
}


@media screen and (min-width: 2400px) {
#home-right {
    left: 55%;
}
}

@media screen and (max-width: 1238px) {

    
#main-text {
    margin: 20px 0px 20px 7%;
}
    
#logo {
    max-width: 180px;
    width: 100%;
    margin: 20px 0 0 20px;
    float: left;
 
}
    
#logo:hover {
/*
       -webkit-animation: enlarge 1s;
    animation: enlarge 1s; 
*/
    
}
/*
@-webkit-keyframes enlarge { 0% { max-width: 180px; } 100% { max-width: 183px; }  }
   @-moz-keyframes enlarge { 0% { max-width: 180px; } 100% { max-width: 183px; }  }
     @-o-keyframes enlarge { 0% { max-width: 180px; } 100% { max-width: 183px; }  }
        @keyframes enlarge { 0% { max-width: 180px; } 100% { max-width: 183px; }  }
*/



}

@media screen and (max-width: 1108px) {
#desktop-nav a:first-child {
    margin-left: 1em;
}
    
#desktop-nav a {
    margin-left: 3em;
}   
}

@media screen and (max-width: 1070px) {
.gallery .other {
    background: #3D6FB9;
    background: url(../images/individuals/waterpattern.jpg);
    margin-top: -120px;
}
.gallery .gradient {
    display: block;
}
    
#boat {
    margin-left: 0;
}
    
}

@media screen and (max-width: 1044px) {
#main-info {
    background-position: 0 0;
}
    
#main-text {
    width: 54%;
    width:90%;
    margin: 15px 0px 20px 6%;
    font-size: 1.0em;
}

#home-right {
    display: none;
}
    


#links {
    margin-top: -50px;
}

#desktop-nav a {
    margin-left: 2.9em;
}

.feat {
    margin-top: 50px;
}
}

/*969*/

@media screen and (min-width: 976px) {
    #mobile-nav{
    display: none !important;
}

}

@media screen and (max-width: 975px) {

#water {
    background:url(../images/individuals/waterlong.png);
    background-size: contain;
}
    
.container-other {
        margin: -120px auto 0 auto;
    
}

.other {
    background: #3D6FB9;

    margin-top: -120px;
}
.gradient {
    display: block;
}

#desktop-nav {
    display: none;
}
  
.not-index #mobile-nav {
        margin-bottom: -50px;
}
    
.not-index #mobile-nav ul {
    padding: 30px 0;
    background-color: #e9f0f6;
}
        
    
#mobile-nav ul {
    padding: 10px 0;
/*
    background-color: #376ED2;
    background-color: #9FC7E0;
    background-color: #e9f0f6;
*/

} 
    
#mobile-nav li {
    list-style-type: none;
    text-align: center;
    padding: 10px 0;
}
    
#mobile-nav a {
    text-decoration: none;
    color: #3C89B9;
    color: #225296;
}
    
#mobile-nav a:focus, #mobile-nav a:hover {
    color: #8BB0E5;
}
    
#mobile-menu { /*link*/
    height: 77px;
    width: 74px;
    background: black;
    background: url(../images/menu.svg) no-repeat 0 0;
    display: block;
    float: right;
    margin: 50px 40px 0 0;
    text-decoration: none;
}

    
#mobile-menu:focus, #mobile-menu:hover{
    background: url(../images/menu.svg) no-repeat 0 -71px;
}

#links {
    background-size: cover;
    height: auto;
}
#links img:first-child {
    margin-left: 0;
}
    
 
  
.feat {
    width: 100%;
    margin: 0 auto;
    float: none;
}
    
.image-link {
    width: 263px;
    margin: 0 auto;
}


.fb-page {
    float: none;
    clear: both;
    margin-left: 0;
    margin-bottom:120px;
}

#boat {
    float: none;
    margin-left: 0;
    width: 80%;
    margin: 0 auto 50px;
    
}
    
#links {
    padding-top: 120px;
}

#links img {
    margin-left: 0;
}

footer {
    padding: 40px 0 20px 0;
/*    margin: -5px 0 0 0;*/
}   

hr {
    display: block;
    height: 6px;
    border: 0;
    box-shadow: inset 0 12px 12px -12px rgba(0, 0, 0, 0.7);
    position: relative;
    z-index: 10;
    width: 80%;
    margin: 30px auto;
}


}

@media screen and (max-width: 805px) {
#left, #right {
    width: 100%;
    float: none;
}
#aboutnav {
    text-align: center;
}
#aboutnav li {
    padding: 10px 0;
}
    
#about h2 {
    margin-left:0;
    text-align: center;
}
    
}

@media screen and (max-width: 614px) {
#water {
    background-size: cover;
}
#mobile-menu {
    margin: 50px 20px 0px 0px;
}

}

@media screen and (max-width: 607px) {
#links img {
    margin-left: 0;
}

#main-info {
/*    height: 340px;*/
    background-position: 0px -2em;
}

}

@media screen and (max-width: 427px) {
#water {
    margin: -200px auto 0px;
}
    
footer {
    padding-bottom:20px;
}
    
#programs {
    padding: 0 20px 0;
}
    

}

@media screen and (max-width: 418px) {
#main-text {
    width: 90%;
    margin: 10px 0px 20px 6%;
/*    height: 400px;*/
}
    
    #main-info {
/*    height: 340px;*/
    background-position: 0px -3.4em;
}



}