/* ALL SCREEN SIZES */ body { padding: 0; margin: 0; background-color: #306686; background-image: url(../images/blue.jpg); color: #ffffff; font-size: 62.5%; } #w1 { position: relative; } #w2 { position: absolute; top: 0; left: 0; width: 100%; overflow-x: hidden; } #headerwrapper { background-image: url(../images/bottom.jpg); background-size: cover auto; background-position: center bottom; background-repeat: no-repeat; } header { position: relative; } #logo { position: absolute; height: auto; } #topphone { position: absolute; font-family: "PT Sans Narrow", sans-serif; color: #fff; text-decoration: none; } #socials { position: absolute; font-family: "PT Sans Narrow", sans-serif; } #socials a { color: #fff; text-decoration: none; } footer { position: relative; } #wreck, #boatanchor, #fishes { position: absolute; z-index: 1; } #footerphone, #footeraddress, #copyright { color: #d4d4d4; font-family: "Open Sans", sans-serif; line-height: 1.1em; text-align: center; } #footerphone a { color: #d4d4d4; text-decoration: none; } #credits { font-family: "Open Sans", sans-serif; color: #afb2ae; position: absolute; z-index: 10; width: 100%; text-align: center; vertical-align: middle; line-height: 32px; } #credits a { color: #afb2ae; text-decoration: none; } #credits img { vertical-align: middle; } @keyframes animatedBackground { from { background-position: 2000px 0; } to { background-position: 0 0; } } @keyframes swinging { 0%{transform: rotate(2deg);} 50%{transform: rotate(-1deg)} 100%{transform: rotate(2deg);} } #waves { width: 100%; height: 100%; animation: animatedBackground 250s linear infinite; background-image: url(../images/top.jpg); background-size: cover auto; background-position: center top; background-repeat: repeat-x; } #cloud1, #cloud2 { position: absolute; } #boat { position: absolute; -webkit-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-animation: swinging 7.5s ease-in-out forwards infinite; animation: swinging 7.5s ease-in-out forwards infinite; } h1 { font-family: "Great Vibes", serif; text-align: center; font-weight: 300; } h2,h3,h4,h5,h6 { font-family: "Open Sans Condensed", sans-serif; font-weight: 300; line-height: 1.1em; } section p, .fl-photo-caption { font-family: "Open Sans", arial, helvetica, sans-serif; color: #fff; line-height: 1.4em; font-weight: 300; } strong { font-weight: 600; } section ul > li { list-style-type: disc; font-family: "Open Sans", arial, helvetica, sans-serif; color: #fff; line-height: 1.4em; font-weight: 300; } section ol > li { list-style-type: decimal; font-family: "Open Sans", arial, helvetica, sans-serif; color: #fff; line-height: 1.4em; font-weight: 300; } section li li { font-size: 100%; } section ol > li > ol > li { list-style-type:lower-alpha } section ol > li > ol > li > ol > li { list-style-type:lower-roman } section ul > li > ul > li { list-style-type:square } section ul > li > ul > li > ul > li { list-style-type:circle } .fl-module-content .fl-rich-text a { color: #c9d418; transition: all 0.3s ease; text-decoration: underline; } .fl-module-content .fl-rich-text a:visited { color: #fff; text-decoration: underline; } .fl-module-content .fl-rich-text a:hover, .fl-module-content .fl-rich-text a:focus { color: #f0ff00; text-decoration: underline; } #menu:not( .mm-menu ) { display: none; } .mm-menu.mm-theme-dark { background-color: #306686; background-image: url(../images/blue.jpg)!important; } .mm-title { font-family: "Great Vibes", serif; font-weight: 300; font-size: 24px; color: #fff!important; } .mm-listview li { font-family: "Barlow Condensed", arial, sans-serif; font-size: 18px; } .handwriting p { font-family: "Open Sans Condensed", sans-serif!important; font-size: 22px; } .uabb-button, .uabb-button:hover, .uabb-button:visited, .uabb-button:active { text-decoration: none!important; } .mce-container-body, .wp-link-input, .ui-autocomplete { color: #222!important; } .wp-link-input, .ui-autocomplete { font-family: "Open Sans", arial, helvetica, sans-serif!important; font-size: 18px!important; } .ufaq-faq-title-text h4 { font-size: 20px!important; font-family: "Open Sans", arial, helvetica, sans-serif!important; font-weight: 600; } .ufaq-faq-categories { display: none!important; } .ewd-ufaq-post-margin-symbol span { font-size: 20px!important; } .ewd-ufaq-post-margin-symbol { padding-top: 10px!important; } .fl-photo-caption { white-space: normal!important; font-style: italic; text-align: center; font-size: 14px!important; } .rpwwt-widget .widgettitle { text-align: center; font-family: "Great Vibes", serif!important; padding-bottom: 20px!important; } .rpwwt-widget ul li img { width: 150px!important; height: auto!important; border-radius: 50%; margin-right: 20px; } .rpwwt-post-title { font-size: 24px; font-weight: 600; margin-bottom: 8px; padding-top: 20px; margin-left: -1px; } .rpwwt-widget a { color: #c9d418!important; } .rpwwt-widget ul li { overflow: visible!important; list-style-type: none!important; } .featuredimage img { max-width: 98%; height: auto; border-radius: 3px; display: block; margin: 5px auto; } #prevlink, #nextlink { font-family: "Barlow Condensed", arial, sans-serif; font-size: 20px; width: 48%; } #nextlink { float: right; text-align: right; } #prevlink { float: left; } #prevlink a, #nextlink a { text-decoration: none!important; color: #fff!important; display: inline-block; padding: 10px; border: #497e9c solid 1px; border-radius: 10px; } div#n2-ss-2 .n2-ss-slider-3 { border-radius: 4px; } .gform_wrapper div.validation_error { color: #eeee00!important; border-top: #eeee00 solid 2px!important; border-bottom: #eeee00 solid 2px!important; font-family: "Open Sans", arial, helvetica, sans-serif!important; font-size: 18px!important; } .rpwwt-widget li { clear: left; } /* end all screen sizes */ @media all and (min-width: 1355px) { section { padding: 40px 0 0 0; } header { height: 355px; } #logo { top: 20px; left: 50%; margin-left: -210px; width: 420px; } #topphone { top: 185px; left: 50%; margin-left: -150px; font-size: 24px; } #socials { top: 185px; right: 50%; margin-right: -175px; font-size: 24px; } #socials a { margin: 0 5px; } #naviwrapper { position: absolute; bottom: 0; left: 0; width: 100%; } footer { height: 340px; padding: 0; } #wreck { left: 0; bottom: 0; } #boatanchor { right: 10%; bottom: 30px; } #fishes { right: 16%; top: 0; } #footerphone { font-size: 24px; padding-bottom: 10px; padding-top: 22px; } #footeraddress { font-size: 24px; padding-bottom: 25px; } #copyright { font-size: 14px; } #credits { font-size: 12px; bottom: 20px; left: 0; } #cloud1 { top: 60px; left: 10%; width: 185px; height: 58px; } #cloud2 { top: 100px; right: 10%; width: 290px; height: 82px; } #boat { top: 200px; left: 20%; } h1 { font-size: 70px; margin: 0 0 28px 0; } h2,h3,h4,h5,h6 { margin: 30px 0 18px 0; } h2 { font-size: 50px; } h3 { font-size: 46px; } h4 { font-size: 44px; } h5 { font-size: 42px; } h6 { font-size: 40px; } section p, .fl-photo-caption { font-size: 17px; margin: 0 0 10px 0; } section p.larger, .larger p { font-size: 30px; } section ul, section ol { padding: 0; margin: 5px 0 5px 21px; } section ul > li, section ol > li { font-size: 17px; margin: 0 0 8px 0; } #mobilenavigationicon { display: none; } .navigationBox { text-align: center; margin: 0 auto; } .navigation { display: block; position: relative; text-align: center; } #nav { margin: 0; padding: 0; list-style-type: none; position: relative; display: block; text-align: center; } #nav ul { margin: 0; padding: 0; list-style-type: none; } #nav a { display: inline-block; color: #fff; text-decoration: none; line-height: 40px; font-size: 26px; font-family: "Barlow Condensed", arial, sans-serif; padding: 0 10px; text-transform: uppercase; } #nav a:hover { color:#fff400; } #nav li { display: inline-block; position:relative; } #nav ul { position: absolute; z-index: 999999999; display: none; width: 240px; top: 40px; left: 0; background-image: url(../images/blue.jpg); border-radius: 5px; border: #1e5c81 solid 1px; } #nav ul ul { left: 230px; top: 0; z-index: 999999999; } #nav li li { display: block!important; position: relative; float: left; } #nav li ul a { line-height: 1.2em; font-family: "Barlow Condensed", arial, sans-serif; width: 220px; float: left; text-align: left; text-transform: none; font-size: 20px; padding: 8px 10px!important; } #nav li ul a:hover { color: #fff400; } #nav ul li:hover > a, #nav li:hover > a { color: #fff400; } #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul { display: none; z-index: 999999999; } #nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul { display: block; } .mainmenu li.has-children > a:after { content: '\25BE'; vertical-align: top; } .mainmenu li li.has-children > a:after { content: '\25B8'; vertical-align: top; } } @media all and (min-width: 1075px) and (max-width: 1354px) { section { padding: 40px 0 0 0; } header { height: 355px; } #logo { top: 20px; left: 50%; margin-left: -210px; width: 420px; } #topphone { top: 185px; left: 50%; margin-left: -150px; font-size: 24px; } #socials { top: 185px; right: 50%; margin-right: -175px; font-size: 24px; } #socials a { margin: 0 5px; } #naviwrapper { position: absolute; bottom: 0; left: 0; width: 100%; } footer { height: 340px; padding: 0; } #wreck { left: 0; bottom: 0; } #boatanchor { right: 10%; bottom: 30px; } #fishes { right: 16%; top: 0; } #footerphone { font-size: 24px; padding-bottom: 10px; padding-top: 22px; } #footeraddress { font-size: 24px; padding-bottom: 25px; } #copyright { font-size: 14px; } #credits { font-size: 12px; bottom: 20px; left: 0; } #cloud1 { top: 60px; left: 3%; width: 185px; height: 58px; } #cloud2 { top: 100px; right: 1%; width: 290px; height: 82px; } #boat { top: 200px; left: 10%; } h1 { font-size: 70px; margin: 0 0 28px 0; } h2,h3,h4,h5,h6 { margin: 30px 0 18px 0; } h2 { font-size: 50px; } h3 { font-size: 46px; } h4 { font-size: 44px; } h5 { font-size: 42px; } h6 { font-size: 40px; } section p, .fl-photo-caption { font-size: 17px; margin: 0 0 10px 0; } section p.larger, .larger p { font-size: 30px; } section ul, section ol { padding: 0; margin: 5px 0 5px 21px; } section ul > li, section ol > li { font-size: 17px; margin: 0 0 8px 0; } #mobilenavigationicon { display: none; } .navigationBox { text-align: center; margin: 0 auto; } .navigation { display: block; position: relative; text-align: center; } #nav { margin: 0; padding: 0; list-style-type: none; position: relative; display: block; text-align: center; } #nav ul { margin: 0; padding: 0; list-style-type: none; } #nav a { display: inline-block; color: #fff; text-decoration: none; line-height: 40px; font-size: 26px; font-family: "Barlow Condensed", arial, sans-serif; padding: 0 10px; text-transform: uppercase; } #nav a:hover { color:#fff400; } #nav li { display: inline-block; position:relative; } #nav ul { position: absolute; z-index: 999999999; display: none; width: 240px; top: 40px; left: 0; background-image: url(../images/blue.jpg); border-radius: 5px; border: #1e5c81 solid 1px; } #nav ul ul { left: 230px; top: 0; z-index: 999999999; } #nav li li { display: block!important; position: relative; float: left; } #nav li ul a { line-height: 1.2em; font-family: "Barlow Condensed", arial, sans-serif; width: 220px; float: left; text-align: left; text-transform: none; font-size: 20px; padding: 8px 10px!important; } #nav li ul a:hover { color: #fff400; } #nav ul li:hover > a, #nav li:hover > a { color: #fff400; } #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul { display: none; z-index: 999999999; } #nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul { display: block; } .mainmenu li.has-children > a:after { content: '\25BE'; vertical-align: top; } .mainmenu li li.has-children > a:after { content: '\25B8'; vertical-align: top; } } @media all and (min-width: 720px) and (max-width: 1074px) { section { padding: 0; } header { height: 355px; } #logo { top: 20px; left: 50%; margin-left: -150px; width: 300px; } #topphone { top: 135px; left: 50%; margin-left: -130px; font-size: 21px; } #socials { top: 135px; right: 50%; margin-right: -145px; font-size: 20px; } #socials a { margin: 0 5px; } footer { height: 340px; padding: 0; } #wreck { width: 350px; height: auto; left: 0; bottom: 0; } #boatanchor { width: 80px; height: auto; right: 10%; bottom: 30px; } #fishes { right: 5%; top: 0; } #footerphone { font-size: 21px; padding-bottom: 10px; padding-top: 22px; } #footeraddress { font-size: 21px; padding-bottom: 25px; } #copyright { font-size: 14px; } #credits { font-size: 12px; bottom: 20px; left: 0; } #cloud1 { top: 60px; left: 2%; width: 135px; height: auto; } #cloud2 { top: 100px; right: 2%; width: 180px; height: auto; } #boat { top: 200px; left: 15%; } h1 { font-size: 70px; margin: 0 0 28px 0; } h2,h3,h4,h5,h6 { margin: 30px 0 18px 0; } h2 { font-size: 50px; } h3 { font-size: 46px; } h4 { font-size: 44px; } h5 { font-size: 42px; } h6 { font-size: 40px; } section p, .fl-photo-caption { font-size: 17px; margin: 0 0 10px 0; } section p.larger, .larger p { font-size: 30px; } section ul, section ol { padding: 0; margin: 5px 0 5px 21px; } section ul > li, section ol > li { font-size: 17px; margin: 0 0 8px 0; } #naviwrapper { display: none; } #mobilenavigationicon { position: absolute; top: 20px; right: 30px; vertical-align: middle; } #mobilenavigationicon span { display: block; width: 35px; height: 6px; background-color: #fff; margin: 5px 0; border-radius: 2px; } } @media all and (min-width: 480px) and (max-width: 719px) { section { padding: 0; } header { height: 355px; } #logo { top: 20px; left: 50%; margin-left: -150px; width: 300px; } #topphone { top: 135px; left: 50%; margin-left: -130px; font-size: 21px; } #socials { top: 135px; right: 50%; margin-right: -145px; font-size: 20px; } #socials a { margin: 0 5px; } footer { height: 340px; padding: 0; } #wreck { width: 350px; height: auto; left: 0; bottom: 0; } #boatanchor { width: 80px; height: auto; right: 10%; bottom: 30px; } #fishes { right: 5%; top: 0; } #footerphone { font-size: 21px; padding-bottom: 10px; padding-top: 22px; } #footeraddress { font-size: 21px; padding-bottom: 25px; } #copyright { font-size: 14px; } #credits { font-size: 12px; bottom: 20px; left: 0; } #cloud1 { top: 30px; left: 2%; width: 75px; height: auto; } #cloud2 { top: 100px; right: 2%; width: 80px; height: auto; } #boat { top: 200px; left: 15%; } h1 { font-size: 60px; margin: 0 0 28px 0; } h2,h3,h4,h5,h6 { margin: 30px 0 18px 0; } h2 { font-size: 40px; } h3 { font-size: 37px; } h4 { font-size: 34px; } h5 { font-size: 31px; } h6 { font-size: 28px; } section p, .fl-photo-caption { font-size: 16px; margin: 0 0 10px 0; } section p.larger, .larger p { font-size: 26px; } section ul, section ol { padding: 0; margin: 5px 0 5px 21px; } section ul > li, section ol > li { font-size: 16px; margin: 0 0 8px 0; } #naviwrapper { display: none; } #mobilenavigationicon { position: absolute; top: 20px; right: 30px; vertical-align: middle; } #mobilenavigationicon span { display: block; width: 35px; height: 6px; background-color: #fff; margin: 5px 0; border-radius: 2px; } } @media all and (min-width: 200px) and (max-width: 479px) { section { padding: 0; } header { height: 355px; } #logo { top: 20px; left: 50%; margin-left: -120px; width: 240px; } #topphone { top: 135px; left: 50%; margin-left: -130px; font-size: 21px; } #socials { top: 135px; right: 50%; margin-right: -145px; font-size: 20px; } #socials a { margin: 0 5px; } footer { height: 340px; padding: 0; } #wreck { width: 250px; height: auto; left: 0; bottom: 0; } #boatanchor { width: 50px; height: auto; right: 5%; bottom: 30px; } #fishes { width: 95px; height: auto; right: 5%; top: 0; } #footerphone { font-size: 21px; padding-bottom: 10px; padding-top: 22px; } #footeraddress { font-size: 21px; padding-bottom: 25px; } #copyright { font-size: 14px; } #credits { font-size: 12px; bottom: 20px; left: 0; } #cloud1 { top: 30px; left: 2%; width: 75px; height: auto; } #cloud2 { top: 180px; right: 2%; width: 80px; height: auto; } #boat { top: 200px; left: 5%; width: 240px; height: auto; } h1 { font-size: 50px; margin: 0 0 28px 0; } h2,h3,h4,h5,h6 { margin: 30px 0 18px 0; } h2 { font-size: 40px; } h3 { font-size: 38px; } h4 { font-size: 36px; } h5 { font-size: 34px; } h6 { font-size: 32px; } section p, .fl-photo-caption { font-size: 15px; margin: 0 0 10px 0; } section p.larger, .larger p { font-size: 26px; } section ul, section ol { padding: 0; margin: 5px 0 5px 21px; } section ul > li, section ol > li { font-size: 15px; margin: 0 0 8px 0; } #naviwrapper { display: none; } #mobilenavigationicon { position: absolute; top: 15px; right: 15px; vertical-align: middle; } #mobilenavigationicon span { display: block; width: 35px; height: 6px; background-color: #fff; margin: 5px 0; border-radius: 2px; } .mobilehide { display: none; } .mobileblock { display: block; } }