/* http://meyerweb.com/eric/tools/css/reset/  v2.0 | 20110126 License: none (public domain) */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

table { border-collapse: collapse; border-spacing: 0; }

footer { color: #512e20; text-align: center; background-color: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; font-family: 'caladea', serif; letter-spacing: 1px; width: 100%; }

footer .footer-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; width: 100%; }

@media only screen and (min-width: 768px) { footer .footer-inner { -ms-flex-wrap: nowrap; flex-wrap: nowrap; width: 70%; margin: 0 auto; } }

footer .footer-inner div { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: space-evenly; -ms-flex-pack: space-evenly; justify-content: space-evenly; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; margin: 1rem auto; }

@media only screen and (min-width: 481px) { footer .footer-inner div { min-width: 33%; } }

@media only screen and (min-width: 768px) { footer .footer-inner div { -ms-flex-pack: distribute; justify-content: space-around; margin: 0; width: 50%; } }

footer .footer-inner div a { margin: 0; font-size: 11px; color: #512e20; text-decoration: none; text-transform: uppercase; }

footer .footer-inner div a:hover { color: #5894bc; }

footer .footer-inner div a:active { color: #1a3960; }

footer .footer-inner div a img { width: 55%; }

@media only screen and (min-width: 768px) { footer .footer-inner div a { margin: 0 1.3em; } }

footer .footer-inner .link { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; -webkit-box-flex: 1; -ms-flex: 1 0 100%; flex: 1 0 100%; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 0; margin-top: 1.5rem; }

@media only screen and (min-width: 768px) { footer .footer-inner .link { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; margin: 1rem; } }

header { color: #ffffff; background-image: url("../images/Ship_Background_Mobile.png"); background-repeat: no-repeat; background-size: cover; background-position: center; }

@media only screen and (min-width: 481px) { header { background-image: url("../images/Ship_Background.png"); } }

header img { margin: auto; }

@media only screen and (min-width: 481px) { header img { width: 50%; } }

header > * { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; }

header h2 { font-size: 1.8rem; font-family: 'Bebas Neue', sans-serif; letter-spacing: 2px; }

@media only screen and (min-width: 768px) { header h2 { font-size: 2.75rem; } }

header p { font-size: .8rem; font-family: 'caladea', serif; font-weight: 700; letter-spacing: 1px; }

@media only screen and (min-width: 768px) { header p { font-size: 1.2rem; padding-bottom: 5rem; font-weight: 400; } }

header .header-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 2.5rem 0 2rem; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; }

header .header-inner img { padding-bottom: 2rem; padding-top: 1rem; }

header .header-inner h2 { padding-bottom: .5rem; }

header .header-inner p { line-height: 1.5; }

@media only screen and (min-width: 1000px) { header .header-inner p { width: 70%; } }

@media only screen and (min-width: 481px) { header .header-inner { width: 70%; margin: 0 auto; } }

.locals { color: #1a3960; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding-bottom: 1.8rem; position: relative; font-family: 'caladea', serif; }

.locals.container { width: 90%; margin: 0 auto; }

@media only screen and (min-width: 768px) { .locals.container { width: 60%; } }

.locals__text { margin-top: 1.875rem; margin-bottom: 1.25rem; text-align: center; font-family: 'caladea', serif; letter-spacing: 1px; }

.locals__text button { justify-self: flex-end; font-size: 21px; font-family: 'Bebas Neue', sans-serif; letter-spacing: 1px; background-color: transparent; color: #ffffff; border: 1px solid #ffffff; text-align: center; padding: 0.3rem 1.5rem; outline: none; cursor: pointer; display: none; }

.locals__text button:hover { background-color: #1a3960; }

.locals__text button:active { background-color: #ffffff; color: #1a3960; border-color: #1a3960; }

.locals__text-header { 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-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 0.9rem; white-space: nowrap; }

.locals h2 { font-size: 2rem; text-align: center; margin-right: 1rem; font-family: 'Bebas Neue', sans-serif; -webkit-transform: translateY(0.2rem); -ms-transform: translateY(0.2rem); transform: translateY(0.2rem); }

@media only screen and (min-width: 481px) { .locals h2 { font-size: 39.2px; } }

.locals h3 { font-weight: bold; }

.locals p { font-size: 0.7rem; }

@media only screen and (min-width: 500px) { .locals p { font-size: .9rem; } }

.locals .locals-images-container { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; color: #22395d; }

.locals .locals-images-container .ind-local { position: relative; width: 50%; margin-bottom: 1.25rem; }

@media only screen and (min-width: 768px) { .locals .locals-images-container .ind-local { width: 25%; } }

.locals .locals-images-container .ind-local__inner { padding: 5px; }

.locals .locals-images-container .ind-local__inner .play-button { width: 15%; background-image: url(../images/Video_Icon.png); position: absolute; left: 8%; top: 8%; background: transparent; }

.locals .locals-images-container .ind-local__inner .ind-local-desc { line-height: 1.2rem; }

@media only screen and (min-width: 768px) { .locals .ind-local-desc { display: none; }
  .locals button { display: inline-block; } }

.locals__popup-container { position: absolute; top: 5%; left: 0; right: 0; }

.locals__popup-video { background-color: black; height: 100px; }

.locals__popup-desc-container { width: 100%; background-color: #22395e; }

.locals__popup-button { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); color: white; outline: none; background-color: transparent; border: none; cursor: pointer; }

.locals__popup-button.next { right: 2%; }

.locals__popup-button.prev { left: 2%; }

body { background-color: #9bbfd7; position: relative; }

.container { margin: 0 20px; }

@media only screen and (min-width: 481px) { .container { margin: 0 30px; } }

@media only screen and (min-width: 481px) { .hide-desktop { display: none !important; } }

.hide-mobile { display: none; }

@media only screen and (min-width: 481px) { .hide-mobile { display: block; } }

img { width: 100%; }

html, body { font-size: 1rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.map { background-color: #699bc1; width: 100%; }

.map__text { background: #699bc1; display: -webkit-box; display: -ms-flexbox; display: flex; padding: 1.5rem; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; letter-spacing: 1px; line-height: 2rem; }

@media only screen and (min-width: 481px) { .map__text { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } }

.map__text--heading1 { font-family: 'caladea', serif; margin-bottom: 0.3rem; font-size: 20.75px; color: #1b3960; }

@media only screen and (min-width: 481px) { .map__text--heading1 { margin-bottom: 0; } }

.map__text--heading2 { font-size: 46px; margin: 0; color: #ffffff; font-family: 'Bebas Neue', sans-serif; }

@media only screen and (min-width: 481px) { .map__text--heading2 { font-size: 23px; margin-left: 0.3em; } }

.map .interactive-map { width: 100%; }

.map .interactive-map .popup-buttons { position: absolute; z-index: 2; border: none; border-color: none; border-radius: 0; outline: 0; background: none; text-decoration: none; }

.map .interactive-map .popup-buttons :hover, .map .interactive-map .popup-buttons :active, .map .interactive-map .popup-buttons :focus { border: none; border-color: none; border-radius: 0; outline: 0; background: none; text-decoration: none; }

.map .interactive-map #popup1 { position: absolute; left: 65.6%; top: 68.3%; width: 3%; height: 4%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background: #000; }

.map .interactive-map #popup2 { position: absolute; left: 46.7%; top: 26%; width: 3%; height: 4%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background: #000; }

.map .interactive-map #popup3 { position: absolute; left: 37.3%; top: 38.8%; width: 3%; height: 4%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background: #000; }

.map .interactive-map #popup4 { position: absolute; left: 32%; top: 18%; width: 3%; height: 4%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background: #000; }

.map .interactive-map #popup5 { position: absolute; left: 25.6%; top: 20.5%; width: 3%; height: 4%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background: #000; }

.map .interactive-map #popup6 { position: absolute; left: 23.5%; top: 8.1%; width: 3%; height: 4%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background: #000; }

.map .interactive-map #popup7 { position: absolute; left: 26.7%; top: 8.1%; width: 3%; height: 4%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background: #000; }

.map .interactive-map #popup8 { position: absolute; left: 43.7%; top: 6.1%; width: 3%; height: 4%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background: #000; }

.map .map-instructions--desktop { width: 250px; position: absolute; top: 37%; right: 0; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 1; opacity: 1; }

@media only screen and (max-width: 768px) { .map .map-instructions--desktop { display: none; } }

.map .map-instructions--mobile { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 3; opacity: 1; height: 100%; }

.map .map-container { position: relative; overflow: hidden; z-index: 0; }

.map .map-container__inner { position: absolute; top: 0; left: 0; right: 0; bottom: 0; }

.map .buttons { position: absolute; bottom: 30px; right: 30px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; border-right: 1px solid #ebf2f7; background: #ebf2f7; }

.map .buttons__zoom-in, .map .buttons__zoom-out { border: 0; outline: none; color: #1a3960; text-align: center; cursor: pointer; border-radius: 0; width: 50px; height: 50px; font-size: 30px; margin: auto; }

@media only screen and (max-width: 480px) { .map .buttons__zoom-in, .map .buttons__zoom-out { width: 40px; height: 35px; font-size: 1rem; } }

.map .buttons__zoom-in:after { content: ""; /* This is necessary for the pseudo element to work. */ display: block; /* This will put the pseudo element on its own line. */ margin: 0 auto; /* This will center the border. */ width: 76%; /* Change this to whatever width you want. */ border-bottom: 1px solid #bac3cf; /* This creates the border. Replace black with whatever color you want. */ position: absolute; top: 50%; left: 0; right: 0; }

.map .buttons__zoom-in:active, .map .buttons__zoom-out:active { color: #9bbfd7; }

@-webkit-keyframes fade-out { 0% { opacity: 1;
    z-index: 3; }
  100% { opacity: 0;
    z-index: 1; } }

@keyframes fade-out { 0% { opacity: 1;
    z-index: 3; }
  100% { opacity: 0;
    z-index: 1; } }

.modal { position: fixed; z-index: 1; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background-color: transparent; display: none; width: 90%; overflow-y: auto; overflow-x: hidden; height: auto; }

@media only screen and (min-width: 992px) { .modal { width: 70%; } }

@media only screen and (min-width: 1200px) { .modal { width: 50%; } }

.modal__header { margin-bottom: 0.8rem; position: relative; }

.modal__header div { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; min-height: inherit; }

.modal__header #popup-exit { font-size: 45px; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); position: absolute; z-index: 2; right: 4px; top: -4px; cursor: pointer; color: white; background-color: transparent; }

.modal__header--icon-container { background-color: white; -webkit-box-flex: 2; -ms-flex: 2; flex: 2; position: relative; -webkit-clip-path: polygon(0 0, 100% 0, 64% 100%, 0 100%); clip-path: polygon(0 0, 100% 0, 64% 100%, 0 100%); }

.modal__header--icon { width: 4rem; position: absolute; top: 50%; left: 39%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.modal__header--heading-container { background-color: #1b3960; -webkit-box-flex: 6; -ms-flex: 6; flex: 6; -webkit-transform: translateX(-10%); -ms-transform: translateX(-10%); transform: translateX(-10%); -webkit-clip-path: polygon(12% 0%, 100% 0%, 100% 100%, 0% 100%); clip-path: polygon(12% 0%, 100% 0%, 100% 100%, 0% 100%); }

.modal__header--heading { font-size: 2rem; font-family: 'Bebas Neue', sans-serif; color: #f6d53b; padding: 1rem 0 1rem 2rem; text-align: center; margin: auto; }

@media only screen and (min-width: 768px) { .modal__header--heading { font-size: 2.75rem; } }

.modal__header--filler { position: absolute; right: 0; width: 50%; top: 0; bottom: 0; background-color: #1b3960; z-index: -1; }

.modal__body { background-color: white; padding: 3.3%; }

.modal__body p { font-size: 1.4rem; font-family: 'Caladea', serif; padding: 3%; }

.modal__body a { font-size: 1.4rem; font-family: 'Caladea', serif; color: #000000; }

.local_modal { /* This way it could be display flex or grid or whatever also. */ display: block; position: fixed; z-index: 100; left: 50%; top: 50%; -webkit-box-shadow: 0px 0px 20px 1px rgba(0, 0, 0, 0.5); box-shadow: 0px 0px 20px 1px rgba(0, 0, 0, 0.5); /* Use this for centering if unknown width/height */ -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); /* If known, negative margins are probably better (less chance of blurry text). */ /* margin: -200px 0 0 -200px; */ width: 90%; }

@media only screen and (min-width: 480px) and (max-width: 992px) { .local_modal { -webkit-box-shadow: 0px 0px 0px 75px rgba(0, 0, 0, 0.8); box-shadow: 0px 0px 0px 75px rgba(0, 0, 0, 0.8); } }

@media only screen and (min-width: 992px) { .local_modal { max-width: 600px; } }

@media only screen and (min-width: 1440px) { .local_modal { max-width: 1000px; } }

.closed { display: none; }

.item { position: relative; }

.vidbottom { background-color: #1b3860; padding: 1rem; margin-top: -1%; }

.vidbottom p { color: #ffffff; font-family: 'Muli', sans-serif; font-weight: 700; }

@media only screen and (min-width: 1440px) { .vidbottom p { font-size: 1.5rem; } }

.playbutton { background-image: url(/assets/images/play_button.png); background-repeat: no-repeat; width: 40%; height: 40%; position: absolute; left: 0%; right: 0%; top: 0%; bottom: 0%; margin: auto; background-size: contain; background-position: center; opacity: 1; z-index: 3; }

nav { font-family: 'caladea', serif; }

nav #burger { position: absolute; right: 15px; top: 5px; z-index: 3; color: white; }

nav #nav-close { position: absolute; right: 15px; top: 5px; font-size: 3rem; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); display: none; z-index: 3; color: white; }

nav .desktop-nav { position: absolute; top: 20px; left: 0; right: 0; display: none; width: 100%; margin: 0 auto; -ms-flex-pack: distribute; justify-content: space-around; background: transparent; }

@media only screen and (min-width: 768px) { nav .desktop-nav { top: 40px; } }

@media only screen and (min-width: 481px) { nav .desktop-nav { display: -webkit-box; display: -ms-flexbox; display: flex; } }

nav .desktop-nav div { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; }

@media only screen and (min-width: 768px) { nav .desktop-nav div { min-width: 200px; } }

nav .desktop-nav a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; color: #ffffff; text-decoration: none; font-size: 1rem; margin: 0 3.8%; white-space: nowrap; font-family: 'Bebas Neue'; letter-spacing: 2px; }

nav .desktop-nav a:hover { color: #9bbed7; }

nav .desktop-nav a:active { color: #c6b7a5; }

nav .mobile-nav { display: none; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; position: absolute; top: 0; left: 0; right: 0; }

nav .mobile-nav--home-link { background: transparent; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

nav .mobile-nav--home-link img { width: 35%; margin-top: 0.5rem; margin-bottom: 0.3rem; }

nav .mobile-nav--links { height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: distribute; justify-content: space-around; background-color: white; padding: 3rem 0; font-weight: 600; font-family: 'Bebas Neue'; font-size: 2rem; letter-spacing: 2px; }

nav .mobile-nav--links a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; color: #22385d; text-decoration: none; }

@media only screen and (min-width: 481px) { nav .mobile-nav { display: none; } }

.close-button { position: fixed; top: 12%; left: 90%; z-index: 1; background: none; border: none; color: #ffffff; font-size: 3rem; -webkit-transform: rotate(45deg) translate(-50%, -50%); -ms-transform: rotate(45deg) translate(-50%, -50%); transform: rotate(45deg) translate(-50%, -50%); }

@media only screen and (min-width: 768px) { .close-button { display: none; } }

.prev, .next { position: fixed; top: 50%; left: 5%; z-index: 1; background: none; border: none; color: #ffffff; font-size: 3rem; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.prev:focus, .prev:active, .next:focus, .next:active { outline: none; }

.prev :hover, .next :hover { cursor: pointer; border: none; outline: none; }

/*# sourceMappingURL=index.css.map */