/* -------------------------------------------------- Table of Contents ----------------------------------------------------- :: Browser Resets :: Main Structure :: Sub Structure :: Universal Classes :: Universal Facebook Styles */ /* -------------------------------------------------- :: Browser Resets -------------------------------------------------- */ body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; /* Google Fonts - for example - will render proper sizes in all browsers with this fix (no matter what color - Firefox traditionally renders bolder for white color text) */ margin: 0; padding: 0; position: relative; /* FONT FAMILY */ font-family: 'Open Sans', Helvetica, Arial, sans-serif; font-size:15px; line-height: 1.3; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; } body.landing {background:#02253f;} .landing .content {background:#fff; padding:30px;} /* Headings */ h1, h2, h3, h4, h5, h6 {font-family: 'Raleway', sans-serif; font-weight:400;} h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {} h1 {font-size:32px; margin-bottom:5px;} h2 {font-size:28px; margin-bottom:5px;} h3 {font-size:26px; margin-bottom:8px;} h4 {font-size:24px; margin-bottom:8px; color:#06a3de; text-transform:initial; } h5 {font-size:20px; margin-bottom:10px;} h6 {font-size:16px; margin-bottom:10px;} /* Heading Siblings - (when one heading follows another) */ h1 + h2 {margin-top:0;} /* styles for the h2 following an h1 */ h2 + h3 {margin-top:0;} /* styles for the h3 following an h2 */ h3 + h4 {margin-top:0;} /* etc */ h4 + h5 {margin-top:0;} h5 + h6 {margin-top:0;} /* p tag styles directly after a heading */ h1 + p, h2 + p, h3 + p, h4 + p, h5 + p, h6 + p {margin-top:0;} .content > h1:first-child, .content > h2:first-child, .content > h3:first-child, .content > h4:first-child, .content > h5:first-child, .content > p:first-child {margin-top:0;} /* Elements */ p {margin-bottom:20px; margin-top:0px;} a {color:#1765a1;} a:hover {color:#06a3de;} a:visited {} a:focus {} ul, ol {} li {} em, i {font-style: italic;} strong, b {font-weight: 700;} hr {border: 0; border-bottom: 1px solid #ccc; clear: both; display:block; height: 0; margin: 15px 0;} small {font-size: 70%;} img {display:inline-block; vertical-align:middle; max-width:100%; height:auto; -ms-interpolation-mode:bicubic} textarea {height:auto; min-height:50px;} select {box-sizing: border-box; width:100%;} pre {overflow:auto;} /* Buttons */ button {padding:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;border-radius:5px;background:transparent;line-height:1} [data-whatinput='mouse'] button {outline:0} a.button, p.button a, span.button a, input.button, input[type=submit], button { font-weight:700; display:inline-block; font-family:'Raleway', sans-serif; text-transform:uppercase; padding:10px 30px; text-align:center; font-size:16px; text-decoration:none; margin-bottom:15px; border:0; box-shadow:none; transition: background .3s ease; -webkit-transition:background .3s ease; cursor:pointer; background:#e82833; color:#fff; border-radius:4px; } a.button.secondary, p.button.secondary a, span.button.secondary a, input.button.secondary {background:#06a3de;} a.button.callout, p.button.callout a, span.button.callout a, input.button.callout {background:#1766a1;} a.button:hover, p.button a:hover, span.button a:hover, input.button:hover, input[type=submit]:hover, button:hover {background:#c8151f;} a.button.secondary:hover, p.button.secondary a:hover, span.button.secondary a:hover, input.button.secondary:hover {background:#048ec2;} a.button.callout:hover, p.button.callout a:hover, span.button.callout a:hover, input.button.callout:hover {background:#095086;} a.button.skinny, p.button.skinny a, span.button.skinny a, input.button.skinny {padding:5px 15px; font-size:15px;} /* Forms */ /* basic input styles */ [type='text'],[type='password'],[type='date'],[type='datetime'],[type='datetime-local'],[type='month'],[type='week'],[type='email'],[type='number'],[type='search'],[type='tel'],[type='time'],[type='url'],[type='color'],textarea {display:block;width:100%;height:2.2rem;margin:0 0 15px;padding:5px;font-family:inherit;border:1px solid #cacaca;background-color:#fff;color:#4b4b4e;transition:border .2s ease-out;-webkit-appearance:none;-moz-appearance:none;appearance:none} @media only screen and (max-width: 640px) { [type='text'],[type='password'],[type='date'],[type='datetime'],[type='datetime-local'],[type='month'],[type='week'],[type='email'],[type='number'],[type='search'],[type='tel'],[type='time'],[type='url'],[type='color'],textarea {height: 3rem;} } textarea{max-width:100%} textarea[rows]{height:auto} [type='text']:focus,[type='password']:focus,[type='date']:focus,[type='datetime']:focus,[type='datetime-local']:focus,[type='month']:focus,[type='week']:focus,[type='email']:focus,[type='number']:focus,[type='search']:focus,[type='tel']:focus,[type='time']:focus,[type='url']:focus,[type='color']:focus,textarea:focus{outline:none;border:1px solid #8a8a8a;background-color:#fdfdfd} /* placeholder text styles - must stay separate */ input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{color:#b0acac} input::-moz-placeholder,textarea::-moz-placeholder{color:#b0acac} input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:#b0acac} input::placeholder,textarea::placeholder{color:#b0acac} /* Readonly Text Styles */ input:disabled,input[readonly],textarea:disabled,textarea[readonly]{background-color:#e8ebf3;cursor:not-allowed} input:disabled:focus,input[readonly]:focus,textarea:disabled:focus,textarea[readonly]:focus{background-color:#e8ebf3;border:1px solid #cacaca} [type='file'],[type='checkbox'],[type='radio']{margin:0 0 15px} [type='checkbox'] + label,[type='radio'] + label{display:inline-block;vertical-align:baseline;margin-left:5px;margin-right:15px;margin-bottom:0} [type='checkbox'] + label[for],[type='radio'] + label[for]{cursor:pointer} label > [type='checkbox'],label > [type='radio']{margin-right:5px} [type='file']{width:100%} label{display:block;margin:0} select{height:34px;margin:0 0 15px;padding:5px;font-family:inherit;border:1px solid #cacaca;border-radius:0;background-color:#fff;color:#4b4b4e;background-image:url("data:image/svg+xml;utf8,");background-origin:content-box;background-position:right -1rem center;background-repeat:no-repeat;background-size:9px 6px;padding-right:20px;-webkit-appearance:none;-moz-appearance:none;appearance:none} @media screen and (min-width: 0\0) { select{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIpJREFUeNrEkckNgDAMBBfRkEt0ObRBBdsGXUDgmQfK4XhH2m8czQAAy27R3tsw4Qfe2x8uOO6oYLb6GlOor3GF+swURAOmUJ+RwtEJs9WvTGEYxBXqI1MQAZhCfUQKRzDMVj+TwrAIV6jvSUEkYAr1LSkcyTBb/V+KYfX7xAeusq3sLDtGH3kEGACPWIflNZfhRQAAAABJRU5ErkJggg==)} } select:focus{outline:none;border:1px solid #8a8a8a;background-color:#fdfdfd;transition:border .2s ease-out} select:disabled{background-color:#fdfdfd;cursor:not-allowed} select::-ms-expand{display:none} select[multiple]{height:auto;background-image:none} /* Recaptcha styling */ .simpleAntiSpam div{margin:6px auto!important} .g-recaptcha div{margin:0 auto!important} /* Date picker */ #ui-datepicker-div {display:none;} .ui-datepicker{background:#fff;border:1px solid #cacaca;padding:15px;margin:10px 20px;-webkit-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.1);-moz-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.1);box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.1);} .ui-datepicker-header{text-align:center;font-size:16px;font-weight:800} .ui-datepicker-prev{float:left;font-size:13px;text-transform:uppercase} .ui-datepicker-next{float:right;font-size:13px;text-transform:uppercase} .ui-datepicker-title{clear:both} .ui-datepicker-calendar{min-width:200px} .ui-datepicker-calendar th{width:14.2%;font-weight:600} .ui-datepicker-calendar td{vertical-align:middle;text-align:center} .ui-datepicker-calendar td a{padding:2px} /* Tables */ table {width:100%;} caption, th, td {} @media only screen and (max-width: 100%) and (min-width: 768px) { table tbody tr td {padding:2% 0;} /* remember to define focus styles! */ } /* Sticky Classes - Foundation */ .sticky-container{position:relative} .sticky{position:relative;z-index:0;transform:translate3d(0,0,0)} .sticky.is-stuck{position:fixed;z-index:5} .sticky.is-stuck.is-at-top{top:0} .sticky.is-stuck.is-at-bottom{bottom:0} .sticky.is-anchored{position:relative;right:auto;left:auto} .sticky.is-anchored.is-at-bottom{bottom:0} /* -------------------------------------------------- :: Menu Structure -------------------------------------------------- */ /* Menu structe */ #header {width:100%; z-index:1000;} #header.is-at-bottom {top:0 !important; bottom:auto !important;} .logo-wrapper {text-align:center; position:relative;} .logo-wrapper img {max-width:240px; transition: all .3s ease; -webkit-transition:all .3s ease;} #header.is-stuck .logo-wrapper img {max-width:200px;} #header.is-stuck ul.main_menu {margin-top:10px;} ul.main_menu {margin:20px 0 0; padding:0; list-style-type:none; text-align:center; transition: all .3s ease; -webkit-transition:all .3s ease;} ul.main_menu > li {display:inline-block; position:relative;} ul.main_menu li a {text-decoration:none;} ul.main_menu li ul {position:absolute; margin:0; padding:0; list-style-type:none; display:none; border-top:3px solid #06a3de;} ul.main_menu li ul {} /* Custom Menu Styles */ #header {background:#fff; border-bottom:3px solid #06a3de;} header {padding:15px 0 0;} #header .row {position:relative;} ul.main_menu li ul {background:rgba(6,163,222,.95); width:230px;} ul.main_menu > li > a {transition: all .3s ease; -webkit-transition:all .3s ease;} /* styles for the top level links only */ ul.main_menu > li > a:hover {background:#06a3de; color:#fff;} ul.main_menu > li.sfHover > a {background:#06a3de; color:#fff;} ul.main_menu li ul li a {text-transform:initial; color:#fff; font-size:15px; padding:10px 5px; transition: all .3s ease; -webkit-transition:all .3s ease;} /* styles for the drop down level links */ ul.main_menu li ul li a:hover {background:#1766a1; color:#fff;} ul.main_menu a {font-family:'Raleway', sans-serif; color:#000; font-weight:700; text-transform:uppercase; display:block; padding:7px 7px 5px;} #header .social {position:absolute; right:.9375rem; top:0; max-width:182px; z-index:1;} #header .social.mobile {display:none;} #header .social .button {display:block; margin:0; font-size: 15px; padding: 5px 10px;width: 100%; position:relative;} #header .social .magazine { width:60px; height:45px; margin-left:3px; overflow:hidden; position:absolute; -ms-transform: rotate(-8deg); /* IE 9 */ -webkit-transform: rotate(-8deg); /* Chrome, Safari, Opera */ transform: rotate(-8deg); } #header .social .magazine img {width:60px;} #header .social .icon {margin:5px 3px 3px; font-size:20px; color:#000; display:inline-block;} #header .social .media {margin-left:73px; display:inline-block;} #header .social #search_box_form input[type="text"] {display:inline-block; width:90%; margin:5px 0 0; height:1.4rem; padding:1px 5px; font-size:13px;} #header .social #search_box_form a {color:#cacaca;} /* Mobile Menu Styles - referance mobile_menu.css and grab the associated styles for what side you want the menu on */ /* Functionality ***** REPLACE THESE ***********/ .cbp-spmenu { position: fixed; overflow:scroll; right: -240px; width: 240px; height: 100%; top: 0; z-index: 1000; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; } .menuOpen .cbp-spmenu {right:0;} .cbp-spmenu-push { overflow-x: hidden; position: relative; right: 0; left:0; } .cbp-spmenu-push.menuOpen {right:240px; left:-240px; position:fixed;} /*END REPLACE SECTION */ /*Custom Menu styles */ .cbp-spmenu {background:#eee;} .cbp-spmenu h3 {margin:20px 15px 0;} #search_box_form_mobile {margin:10px 15px;} #search_box_form_mobile input[type="text"] {display:inline-block; width:90%; margin:0;} .cbp-spmenu .social {margin:0 15px 10px; text-align:center;} .cbp-spmenu .social a {margin:0 10px 10px 0; font-size:30px; color:#06a3de;} .mobile_menu {margin:0; list-style-type:none; padding:0;} .mobile_menu a {text-decoration:none;} .mobile_menu > li {border-top:1px solid #c1c9c1;} .mobile_menu > li.top li:first-child {border-top:1px solid #c1c9c1;} .mobile_menu > li > a {font-size:20px; padding:8px 15px; display:block; background:#eee;} .mobile_menu li ul {list-style-type:none; margin:0; padding:0;} .mobile_menu li ul li a {font-size:16px; padding:8px 15px 8px 25px; display:block; background:#ddd;} /* Menu Hamburger styles */ #showMobile { position: relative; height: 27px; width: 35px; cursor: pointer; transition: opacity .25s ease; float:right; display:none; } #showMobile:hover {} #showMobile.active .top {transform: translateY(11px) translateX(0) rotate(45deg);} #showMobile.active .middle {opacity: 0;} #showMobile.active .bottom {transform: translateY(-11px) translateX(0) rotate(-45deg);} #showMobile span { background: #1766a1; border: none; height: 4px; width: 100%; position: absolute; top: 0; left: 0; transition: all .35s ease; cursor: pointer; } #showMobile span:nth-of-type(2) {top: 11px;} #showMobile span:nth-of-type(3) {top: 22px;} /* homepage */ /* Tubular Background Video */ #tubular-container {z-index: 0 !important; top: 0; position: absolute !important;} #tubular-player {width: 100% !important; height: 100% !important; top: 0 !important; left: 0 !important; /*width: 120% !important; height: 120% !important; top: -10% !important; left: -10% !important;*/} /* Overwriting the JS for the iframe - since I have #bg-video 16/9 ratio percentage */ #tubular-shield {background: #000; opacity: .2;} #bg-video {height: 0; padding-bottom: 56.25%; background: #000; /*border-right:3px solid #fff;*/} #bg-video .vid-text {position:absolute; top:43%; left:15%; width:85%; } #bg-video .vid-text h1 {color:#fff; font-weight:700; border-left:2px solid #fff; padding-left:10px; margin:25px; text-shadow: 0px 0px 5px rgba(150, 150, 150, 1);} @media only screen and (min-width:1024px) and (max-width: 1400px) { #tubular-player {width: 100% !important; height: 100% !important;/*width: 170% !important; height: 170% !important; left: -35% !important; top: -35% !important;*/} } @media only screen and (min-width:641px) and (max-width: 1023px) { #tubular-player {width: 100% !important; height: 100% !important; top: 0 !important;} } .featured-news {background:#061c3e; display:block; padding-bottom:30px;} .featured-news .heading {background:#06a3de; padding:5px 10px; margin-bottom:15px;} .featured-news .heading h6 {color:#fff; font-weight:700; margin:0;} .featured-news h5 {margin:10px 15px 30px;} .featured-news h5 a {color:#beedff; text-transform:initial; margin-bottom:30px;} .featured-news .story {padding:10px 20px;} .featured-news .story.odd {background:#0b264e;} .featured-news .story .wrap {max-width:450px;} .featured-news .story h5 {color:#fff; text-transform:initial; margin:0;} .featured-news .story h5 a {color:#fff; text-decoration:none;} .featured-news .story h5 a:hover {text-decoration:underline;} .featured-news .story p {color:#beedff; font-weight:700; margin:0;} .featured-news .story .thumb {} .featured-news .story .thumb img {padding:0 15px; max-width: 130px;} .main-banner {background:#01122a; padding:20px 0 13px; text-align:center;} .main-banner iframe {width:100% !important; max-width:728px;} .main-banner div {width:100% !important; max-width:728px; padding: 0;} .video-gallery { padding:70px 0; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f1f1f1+100 */ background: #ffffff; /* Old browsers */ background: -moz-linear-gradient(top, #ffffff 0%, #f1f1f1 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #ffffff 0%,#f1f1f1 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #ffffff 0%,#f1f1f1 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f1f1f1',GradientType=0 ); /* IE6-9 */ } .video-gallery h3 {text-align:center; border-bottom:2px solid #06a3de; display:inline-block; margin-bottom:30px; margin-top:0;} .video-gallery h3 a {color:#000;} .video-gallery .vid {margin:0 auto 20px; position:relative; max-width:620px;} .video-gallery .vid img {width:100%;} .video-gallery .vid .play {position:absolute; top:0; width:100%; text-align:center; color:#fff; opacity:.8; font-size:80px; top:36%; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease;} .video-gallery .vid .play.fav {position:absolute; top:0; width:100%; text-align:center; font-size:120px; top:33%;} .video-gallery a {text-decoration:none;} .video-gallery .button {width:100%; max-width:620px;} .video-gallery a:hover .play {opacity:1;} .video-gallery .vid .heading {background:#06a3de; padding:5px;} .video-gallery .vid .heading p {margin:0; color:#fff; font-family:'Raleway', Arial, sans-serif; text-transform:uppercase; font-weight:700;} .subscribe {padding:40px 0;} .subscribe .cover {text-align:center;} .subscribe .cover img { -ms-transform: rotate(-7deg); /* IE 9 */ -webkit-transform: rotate(-7deg); /* Chrome, Safari, Opera */ transform: rotate(-7deg); padding:20px; } .home .news {padding:100px 0; background:#f6f6f6 url('../jpg/background-map.jpg') no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} .home .news h3 {display:inline-block; border-bottom:2px solid #06a3de; margin-top:0;} .home .news h3 a {color:#000; text-decoration:none;} .home .news h4 {margin:15px 0 5px;} .home .news h4 a{color:#06a3de; text-decoration:none;} .home .news p {color:#565656; font-size:18px; margin-top:0;} .home .news a.detail {color:#000; position:relative; z-index:1; font-weight:700; text-decoration:none; font-size:16px; border-left:6px solid #41b6e3; display:block; padding:5px 10px; line-height:1.3; transition: background linear .5s;} .home .news a.detail:after { position: absolute; content: ''; top:0; left: 0; width: 0; height: 100%; background-color: #fff; transform-origin:left; transition:width 0.25s ease; z-index:-1; } .home .news a.detail:hover:after { width: 100%; } .home .news .news-banner {text-align:center; margin-top:15px;} .home .news .news-banner a {border:0; padding:15px; background:#41b6e3; display:inline-block;} .home .news .news-banner a img {border:2px solid #fff;} .home .subscribe .button {margin-right:10px;} .resources {padding:50px 0 80px;} .resources h3 {text-align:center; border-bottom:2px solid #06a3de; display:inline-block; margin-bottom:25px;} .resources .quicklink {position:relative; text-align:center; margin-bottom:25px;} .resources .quicklink .label {position:absolute; top:0; bottom:0; left:0; width:100%; text-align:center; padding:15px;} .resources .quicklink .label p {font-family:'Raleway', Arial, sans-serif; text-transform:uppercase; font-size:26px; font-weight:700; color:#fff; line-height:1.2; margin:25px 0 0;} .resources .quicklink-banner {margin-bottom:15px;} .sponsors {background:#f7f7f7; padding:70px 0;} .sponsors h3 {margin:0; color:#252c39;} .sponsors p {color:#565656; font-size:18px; margin:5px 0;} .sponsors .logos {max-width:630px;} .sponsors img {margin:10px 12px;} .sponsors a {display:inline-block;} .callout {padding:70px 0 60px; background:#0e5489 url('../jpg/background-waves.jpg') no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} .callout h3 {color:#9ae3ff; margin:25px 0 0;} .callout p {color:#fff; font-size:18px; margin:5px 0 25px;} /* Subpage */ .header-image {width:100%; height:170px; position:relative; background:#0e5489 url('../jpg/background-waves.jpg') no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} .header-image.tall {height:400px;} .header-image .heading {position:absolute; width:100%; bottom:0;} .header-image .heading h1 {color:#fff;} .sub.page {background:#f8f8f8;} .content {padding:40px 0 50px; position:relative;} .content .share-buttons {position:absolute; right:0; top:10px; width:100%;} .content a[name], .content a[id] {margin-top: -130px; position: absolute;} .imgleft {float: left; margin: 0 20px 20px 0;} .imgright {float: right; margin: 0 0 20px 20px;} .sidebar {background:#fff; padding:20px; position:relative; margin-top:-55px; margin-bottom:55px;} .sidebar .item {border-top:1px solid #1765a1; padding:20px 0 0; margin-top:20px;} .sidebar .item:first-child {border-top:none; padding-top:0; margin-top:0;} .sidebar h5 {color:#d2232a; font-weight:700; text-align:center; margin:0;} .sidebar .event-image {float:left; margin:0 10px 10px 0;} .sidebar .event-image img {width:80px; border-radius:4px; border:1px solid #1765a1;} .sidebar .event-item p.date {font-size:11px; text-transform:uppercase; font-weight:700; margin:0; color:#06a3de;} .sidebar .event-item h6 {font-size:15px; text-transform:initial; margin:0; font-weight:700} .sidebar .event-item a {text-decoration:none;} .sidebar .event-item a:hover {text-decoration:underline;} .sidebar .event {margin-top:15px;} /* Enews Sign-up Form Sub-Page */ #enews-sign-up .email-list-options div:nth-child(1) {display: none;} /* news */ .top-banner {background:#f1f1f1; margin:20px 0;} .top-banner h4 {margin:5px 0; color:#1765a1;} .news-item {margin-bottom:25px;} .news-item h4 {margin:0 0 5px;} .news-item h4 a {text-decoration:none;} .news-item .image {width:200px; height:180px; background:#fff url(../jpg/icon-news.jpg) no-repeat center center; background-size:contain; margin-bottom:10px;} .news-item .button {display:block; font-size:15px; padding:5px 10px;} .news-item .date {color:#06a3de; font-weight:700; margin:0;} .news-item .tags {color:#1765a1; font-size:13px; font-family:'Raleway', Arial, sans-serif; margin:15px 0 0;} .news-item .author {font-size:13px;color:#d2232a; margin:0;} .related-vid {background:#e8e8e8; padding:10px;} .related-vid h5 {color:#000; margin:0 0 5px;} .related-vid .video {background:#fff; padding:15px; margin:0 auto 30px; max-width:600px;} .related-vid .video .flex-video {margin-bottom:0;} .related-vid .video p {color:#000; margin:5px 0 0;} .related-vid .video h4 {color:#06a3de; margin:5px 0 0;} .related-vid .button {margin:0 0;} .sidebar.news {margin-top:-135px;} .sidebar .news-categories h6 {margin:0; font-size:18px; font-weight:600;} .sidebar .news-categories h6 a {text-decoration:none;} .sidebar .news-categories img {margin:5px 10px 5px 0;} .sidebar .tag {font-weight:600; display:block; padding:3px 0; line-height:1.2; font-family:'Raleway', Arial, sans-serif;} .sidebar .news_search {margin-top:10px;} .sidebar .news_search input[type=text]{border:2px solid #06a3de; margin:0; display:inline-block; width:90%;} .sidebar .news_search a {font-size:18px;} /* video gallery */ .video-gallery-lister .video {background:#fff; padding:15px; margin:0 auto 30px; min-height:298px; max-width:370px;} .video-gallery-lister .video .category {margin:3px 0; color:#06a3de; font-weight:700; font-size:14px;} .video-gallery-lister .video h5 {margin:0; font-size:18px; font-weight:700;} .video-gallery-lister .video h5 a {text-decoration:none;} .video-gallery-lister .video .image {position:relative;} .video-gallery-lister .video .image .overlay {position:absolute; top:30%; left:0; width:100%; text-align:center; font-size:70px; color:#fff; opacity:.9; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease;} .video-gallery-lister .video .image:hover .overlay {opacity:1;} .video-intro {margin:30px 0 50px;} .main-gallery .video-intro {margin:0 auto;} .main-gallery .boattest-ribbon {background: #264d86; padding: 40px 0;} .main-gallery .boattest-ribbon h3 {color: #fff; margin: 0;} @media only screen and (max-width: 639px) { .main-gallery .boattest-ribbon h3 {margin-top: 30px;} } .main-gallery .boattest-ribbon p {color: #d9d9d9; margin: 0 0 20px 0; font-size: 18px;} .main-gallery .boattest-ribbon a.button {margin: 0;} .video-intro h3 {margin:0;} .video-intro p {color:#979797; font-size:18px; margin:0;} .video-detail {margin-top:-325px; position:relative; padding-bottom:50px;} .video-detail h1 {color:#fff; margin:10px 0;} .video-detail .video {background:#fff; padding:30px 30px 10px; text-align:left; margin-bottom:20px;} .video-detail .video .category {color:#06a3de; font-weight:700; margin:0; font-size:15px;} .video-detail .video h4 {margin:0; color:#1765a1; font-weight:700;} .video-cat-lister {background:#fff; padding:25px 20px 20px;} .video-cat-lister img {max-width:100px; margin:0 10px 10px 20px;} .video-cat-lister .category {color:#06a3de; font-weight:700; margin:0; font-size:13px;} .video-cat-lister h6 {margin:0; font-weight:700;} .video-cat-lister h6 a {text-decoration:none;} .video-cat-lister .add-space {margin-bottom:20px;} .video-cat-lister .button {display:block; margin-bottom:0;} .video-detail .buttons .icon-wrap {width:12%; display:inline-block; text-align:center;} .video-detail .buttons .button {width:86%; margin:0 0 10px;} .video-detail .buttons h5 {margin:0px 0 15px; border-bottom:1px solid #0b264e; padding-bottom:5px;} .video-detail .related-news h5 {margin:0px 0 15px; border-bottom:1px solid #0b264e; padding-bottom:5px;} .video-detail .related-news p {margin-bottom:10px;} .video-detail .related-news a { color: #000; position: relative; z-index: 1; font-weight: 700; text-decoration: none; font-size: 16px; border-left: 6px solid #41b6e3; display: block; padding: 5px 10px; line-height: 1.3; transition: background linear .5s; } .video-detail .related-news a:after { position: absolute; content: ''; top:0; left: 0; width: 0; height: 100%; background-color: #fff; transform-origin:left; transition:width 0.25s ease; z-index:-1; } .video-detail .related-news a:hover:after { width: 100%; } .main-gallery h5 {text-align:center;color:#1765a1; font-weight:600; margin-top:20px;} .main-gallery .video-detail .video .button {margin:15px auto 20px; display:block;} .main-gallery .video-intro {margin:50px auto 30px;} .main-gallery .video-intro img {margin-bottom:15px;} .spotlight.odd {background:#fff;} .spotlight {padding:30px 0;} .spotlight .video {padding:15px 15px 1px; margin:0;} .spotlight .category {color:#06a3de; font-weight:700; margin:0;} .spotlight h4 {color:#1765a1; margin:0; font-weight:600;} /* Events */ #AddForm {background:#fff; padding:0 20px 20px; margin:30px; border:1px solid #ccc;} .event-item h3 {margin:0;} .event-item h5 {margin:10px 0 5px;} /* classifieds */ #classifieds {border:1px solid #ccc;} #classifieds th {background:#1766a1; padding:8px;} #classifieds th a {color:#fff; text-decoration:none; display:block;} #classifieds td {padding:8px;} #classifieds .even td {background:#fff;} /* CHARSET STUFF WAS HERE */ /* boating services */ .boating-services .microsite {background:#fff; border:1px solid #ccc; padding:15px; margin-bottom:25px; min-height:370px;} .boating-services .microsite h4 {margin:10px 0 0;} .boating-services .dir_basic {margin-bottom:25px;} /* LOCATIONS */ #locations .location {background:#fff; padding:10px; font-size:14px; min-height:120px; border:1px solid #ddd;} #locations .location h6 {margin:0; font-weight:700; color:#1765a1;} #locations .location p {margin:0;} #locations .location .ad-info {margin-top:15px;} .locations-content #legend2 {padding:15px; background:#fff; margin:20px 0;} .locations-content #legend2 div {margin-bottom:10px;} .locations-content #legend2 img {width:15px; margin-right:3px;} .locations-content #class0_0 {width:100%; max-width:300px;} /* Footer */ #footer {background:#0b264e; border-top:4px solid #e82833; padding:40px 0 0;} #footer p {color:#70a9ef;} #footer .quicklinks {margin-bottom:15px;} #footer .quicklinks a {color:#70a9ef; text-transform:uppercase; text-decoration:none; font-size:12px; display:block;} #footer ul {margin:0; padding:0; list-style-type:none;} #footer li {margin:8px 0;} #footer h5 {color:#fff; margin:15px 0 0; text-transform:initial;} #footer .quicklinks h5 {margin:0;} #footer .small {font-size:13px;} #footer .social i {font-size:28px; color:#fff; padding:7px;} #footer #broadcastemail_signup_form {margin-top:10px;} #footer #broadcastemail_signup_form input[type=text] {width:auto; font-size:14px; height:1.8rem; float:left; margin:0; border:0;} #footer #broadcastemail_signup_form button {color:#fff; font-size:28px; padding:0 10px 0 14px; height:1.8rem; background:#06a3de; border-radius:0; border-left:1px solid #0b264e;} #footer #broadcastemail_signup_form button:hover {cursor:pointer;} .admin-links {background:#0a326e; margin-top:40px;} .admin-links a {color:#70a9ef; text-decoration:none;} .admin-links a:hover {text-decoration:underline;} .admin-links p {color:#70a9ef; margin:10px 0; font-size:14px;} /* ModuleBegin::photo */ /* Photo Lister */ .photo-albums-container {padding: 40px 0 80px;} .album-container {text-align:left; margin:0 0 20px;} .album-container h5 {margin-top:10px; margin-bottom:0px;} .photo-album {position:relative; padding: 0;} .photo-album img {width:94%;} .album .blank-photo {display: block; width: 94%; height: 100%; border: 1px solid #bdbdbe; background: #fff; display: block; position: absolute; top: 0; -webkit-transition: all 200ms ease; transition: all 200ms ease;} .album .blank-photo.one {left: 4px; top: 3px;} .album .blank-photo.two {left: 7px; top: 6px;} .album:hover .blank-photo.one {left: 6px; top: 5px;} .album:hover .blank-photo.two {left: 11px; top: 9px;} .photo-frame {border: 1px solid #bdbdbe; margin: 1px 1px 0 1px; padding: 3px; background: #fff; display: block; position:relative;} /* Photo Thumbnails */ .album-thumbs-lister {margin-bottom: 50px;} .photo-thumb-item .photo-thumb-caption { background: rgba(23,100,161, 0.8); color: #fff; position: absolute; bottom: 0; left: 0; right: 0; padding: 5px 0; z-index: 100; text-align: center; font-weight: bold; } #album-thumbs-container {margin-bottom: 20px;} /* Photo Detail */ .photo-album.dark-bg h2 a {color: #fff; text-decoration: none;} .photo-album.dark-bg h2.center {text-align: center;} .photo-album.dark-bg {background:#3a3a3a; padding:50px 0;} .detail-image {position: relative; margin:0 auto; padding-top:10px; padding-bottom:15px;} .dark-bg .detail-image img {width: auto; height: auto; max-height: 650px; display: block; margin: auto; -webkit-box-shadow: 0 0 40px 0 rgba(0,0,0,.9); box-shadow: 0 0 40px 0 rgba(0,0,0,.9);} .photo-album-nav a {color: #fff;text-decoration: none;position: absolute; top: 49%;} .photo-album-nav a.prev {left: 0;} .photo-album-nav a.next {right: 0;} .detail-image .photo-album-nav img {width: auto; -webkit-box-shadow: none; box-shadow: none;} .dark-bg p.pages {font-size: 14px; font-weight: 700; margin-top: 20px; color:#fff;} .dark-bg h2{color:#fff; margin-top:10px;} .dark-bg p{color:#fff;} .album-thumb-wrapper{margin-bottom:40px;} #album-thumbnails {margin:40px 10px 20px;} .square.thumb {width: 74px; height: 74px; float: left; margin: 0 7px 7px 0; overflow: hidden; position: relative;} #album-thumbnails .thumb img { min-width: 100%; min-height: 100%; position: absolute; max-width: 160%; top: 50%; left: 50%; margin-left: -37px; margin-top: -37px;} .thumbnails h3.title span {font-weight:normal; font-size: 16px; font-family: Verdana, Arial, Helvetica, sans-serif;} p.center.album-photo-back a {color: white;font-size: 14px;} /* Photo Slide */ .photoSlidelWrapper { } .photoSlideWrapper .photoDetail { padding: 10px 0px; text-align: center; } .photoSlide span { display: block; } .photoImage img {border:1px solid #ccc; padding:5px;} .photoSlideWrapper .photoRemote { width: 210px; margin: 0 auto; border: 0; clear: both; } /* ModuleEnd::photo */ /*! * Justified Gallery - v3.5.1 * http://miromannino.github.io/Justified-Gallery/ * Copyright (c) 2015 Miro Mannino * Licensed under the MIT license. */ @-webkit-keyframes justified-gallery-show-caption-animation{from{opacity:0}to{opacity:.7}}@-moz-keyframes justified-gallery-show-caption-animation{from{opacity:0}to{opacity:.7}}@-o-keyframes justified-gallery-show-caption-animation{from{opacity:0}to{opacity:.7}}@keyframes justified-gallery-show-caption-animation{from{opacity:0}to{opacity:.7}}@-webkit-keyframes justified-gallery-show-entry-animation{from{opacity:0}to{opacity:1}}@-moz-keyframes justified-gallery-show-entry-animation{from{opacity:0}to{opacity:1}}@-o-keyframes justified-gallery-show-entry-animation{from{opacity:0}to{opacity:1}}@keyframes justified-gallery-show-entry-animation{from{opacity:0}to{opacity:1}}.justified-gallery{width:100%;position:relative;overflow:hidden}.justified-gallery>a,.justified-gallery>div{position:absolute;display:inline-block;overflow:hidden;opacity:0;filter:alpha(opacity=0)}.justified-gallery>a>img,.justified-gallery>div>img,.justified-gallery>a>a>img,.justified-gallery>div>a>img{position:absolute;top:50%;left:50%;margin:0;padding:0;border:0}.justified-gallery>a>.caption,.justified-gallery>div>.caption{display:none;position:absolute;bottom:0;padding:5px;background-color:#000;left:0;right:0;margin:0;color:#fff;font-size:12px;font-weight:300;font-family:sans-serif}.justified-gallery>a>.caption.caption-visible,.justified-gallery>div>.caption.caption-visible{display:initial;opacity:.7;filter:"alpha(opacity=70)";-webkit-animation:justified-gallery-show-caption-animation 500ms 0 ease;-moz-animation:justified-gallery-show-caption-animation 500ms 0 ease;-ms-animation:justified-gallery-show-caption-animation 500ms 0 ease}.justified-gallery>.entry-visible{opacity:1;filter:alpha(opacity=100);-webkit-animation:justified-gallery-show-entry-animation 500ms 0 ease;-moz-animation:justified-gallery-show-entry-animation 500ms 0 ease;-ms-animation:justified-gallery-show-entry-animation 500ms 0 ease}.justified-gallery>.spinner{position:absolute;bottom:0;margin-left:-24px;padding:10px 0;left:50%;opacity:initial;filter:initial;overflow:initial}.justified-gallery>.spinner>span{display:inline-block;opacity:0;filter:alpha(opacity=0);width:8px;height:8px;margin:0 4px;background-color:#000;border-top-left-radius:6px;border-top-right-radius:6px;border-bottom-right-radius:6px;border-bottom-left-radius:6px} /* -------------------------------------------------- :: Universal Classes -------------------------------------------------- */ /* Alignment Classes */ .text-center {text-align: center;} .text-left {text-align: left;} .text-right {text-align: right;} .clear {clear: both;} .imgleft {float: left; padding: 0 15px 15px 0;} .imgright {float: right; padding: 0 0 15px 15px;} .imgcenter {display: inline-block; margin: auto;} /* Miscellaneous Classes */ .formtextRequired {font-weight:bold;} .formtextRequired:before {content:"*";} .row.full-width, .columns.full-width {margin: 0!important; max-width: none!important; padding: 0!important; width: 100%!important;} .hide { display: none; } .hideclear { clear:both; height:0; overflow:hidden; visibility:hidden; } /* Pagination Classes */ .prevnextCurrent, .prevnextLink, .prevnextWindow { display:inline-block; line-height:0; padding:10px 2px; margin:0 2px; text-align:center;} .prevnextCurrent:hover, .prevnextLink:hover, .prevnextWindow:hover {} /* -------------------------------------------------- :: Other Miscellaneous -------------------------------------------------- */ /* Google Maps & Locations Directory Classes */ #googlemap img, object, embed, .GMapEZ img, #map_canvas embed, #map_canvas img, #map_canvas object, .map_canvas img, .map_canvas embed, .map_canvas object, .mqa-display img, .mqa-display embed, .mqa-display object {max-width: none !important;} /* Removes random added height from Google Remarketing Tags - if tags are on the site */ iframe[name='google_conversion_frame'] { height: 0 !important; width: 0 !important; line-height: 0 !important; font-size: 0 !important; margin-top: -13px; float: left;} /* responsive video wrapper */ .responsive-embed,.flex-video{position:relative;height:0;margin-bottom:1rem;padding-bottom:56.25%;overflow:hidden} .responsive-embed iframe,.responsive-embed object,.responsive-embed embed,.responsive-embed video,.flex-video iframe,.flex-video object,.flex-video embed,.flex-video video{position:absolute;top:0;left:0;width:100%;height:100%} .responsive-embed.widescreen,.flex-video.widescreen{padding-bottom:56.25%} /* -------------------------------------------------- :: SILENT SALESMAN -------------------------------------------------- */ .corner-box {position:fixed; bottom:10px; right:15px; z-index:500; opacity:0; display:none;} .corner-box.box-left {right:auto; left:15px;} .corner-box .header {padding:10px 15px; transition: all .3s ease;} .corner-box .header svg {width:20px; margin: 0 5px -4px 0; fill:#fff;} .corner-box .header.no-title svg {margin:0 0 -4px 0;} .corner-box .container {border:2px solid #fff; border-radius:25px; -webkit-border-radius:25px; transition: all .3s ease;} .corner-box .header:hover {cursor:pointer;} .corner-box .header p {margin:0; color:#fff; font-size:16px; font-weight:800; display:inline-block;} .corner-box .content {display:none; width:340px; max-height:445px; overflow-y:auto; padding:0;} .corner-box .wrapper {font-size:14px; background:#fff; margin:0 10px 10px; padding:10px; border-radius:6px; -webkit-border-radius:6px} .corner-box .wrapper p {font-size:14px; margin:0 auto 15px;} .corner-box .wrapper .button {margin:0 auto; display:block;} .corner-box.open .header {border-radius:15px 15px 0 0; -webkit-border-radius:15px 15px 0 0; } .corner-box.open .header:after {content:'\25bc'; position:absolute; right:10px; color:#fff;} .corner-box.open .content {border-radius:0 0 15px 15px; -webkit-border-radius:0 0 15px 15px;} .corner-box.open .container {border-radius:15px; -webkit-border-radius:15px;} @media only screen and (max-width: 370px) { .corner-box .content {width:100%;} .corner-box.open {right:15px; left:15px;} } @media only screen and (max-height: 660px) { .corner-box .content {max-height:320px;} } @media only screen and (max-height: 530px) { .corner-box .content {max-height:220px;} } @media only screen and (max-height: 430px) { .corner-box .content {max-height:180px;} } @media only screen and (max-height: 360px) { .corner-box .content {max-height:120px;} } /* -------------------------------------------------- :: Media Query Fixes Foundation classes & their media query sizes: .small- max-width 640px .medium- min-width 641px .large- min-width 1025px .xlarge- min-width 1441px .xxlarge- min-width 1921px --------------------------------------------------- */ /* Media Queries Large / Desktop & up */ @media only screen and (max-width: 1024px) { .sponsors .logos {max-width:100%; text-align:center;} .sidebar {margin:0 auto 55px; max-width:660px;} #bg-video {border:none;} } /* Media Queries Medium-Large / Between Tablet & Desktop */ @media only screen and (min-width: 641px) and (max-width: 1024px) { } /* Media Queries Medium / Tablet & up */ @media only screen and (min-width: 641px) { } /* Media Queries Medium & Lower / Mid-tablet, phones & below */ @media only screen and (max-width: 767px) { #showMobile {display:block; margin-top:40px;} .main_menu {display:none;} .logo-wrapper {margin:0; text-align:left;} .logo-wrapper img {max-width:200px;} #header .social {display:none;} header {padding-bottom:15px;} #header .social.mobile {display:block; position:initial; max-width:none;} #header .social .button {display:inline-block; width:200px; margin-top:10px;} #header .social .media {margin:0;} .photo-album-nav {text-align:center; margin-top:15px;} .photo-album-nav a {position:relative;} .photo-album-nav a.prev {margin-right:10px;} .photo-album-nav a.next {margin-left:10px;} } /* Media Queries Small / Mobile */ @media only screen and (max-width: 640px) { form td {display: block;} form input, form textarea, form select {width: 100%;} .boating-services .microsite {min-height:0;} } /* Media Queries Extra Small / Phone */ @media only screen and (max-width: 479px) { } @media only screen and (max-width: 319px) { } /* -------------------------------------------------- :: Print Styles Credit to Paul Irish and HTML5 Boilerplate (html5boilerplate.com) -------------------------------------------------- */ .print-only { display: none !important; } @media print { * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */ p a, p a:visited { color: #444 !important; text-decoration: underline; } p a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */ pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */ tr, img { page-break-inside: avoid; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3{ page-break-after: avoid; } .hide-on-print { display: none !important; } .print-only { display: block !important; } }