body {
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    color: #333;
    font-size: 14px;
    line-height: 20px;
}

.w-layout-hflex {
  flex-direction: row;
  align-items: flex-start;
  display: flex;
}

.w-form-formradioinput--inputType-custom {
  width: 12px;
  height: 12px;
  border: 1px solid #ccc;
  border-radius: 50%;
}

.w-form-formradioinput--inputType-custom.w--redirected-focus {
  box-shadow: 0 0 3px 1px #3898ec;
}

.w-form-formradioinput--inputType-custom.w--redirected-checked {
  border-width: 4px;
  border-color: #3898ec;
}

.w-layout-grid {
  grid-row-gap: 16px;
  grid-column-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.w-embed-youtubevideo {
  width: 100%;
  position: relative;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/static/youtube-placeholder.2b05e7d68d.svg');
  background-size: cover;
  background-position: 50% 50%;
}

.w-embed-youtubevideo:empty {
  min-height: 75px;
  padding-bottom: 56.25%;
}

h1 {
    margin-top: 20px;
    margin-bottom: 10px;
    box-shadow: 1px 1px 3px 0 #000;
    font-size: 38px;
    line-height: 44px;
    font-weight: 700;
}

h2 {
    margin-top: 20px;
    margin-bottom: 10px;
    font-size: 32px;
    line-height: 36px;
    font-weight: bold;
}

h3 {
    margin-top: 20px;
    margin-bottom: 10px;
    font-size: 24px;
    line-height: 30px;
    font-weight: bold;
}

h4 {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 18px;
    line-height: 24px;
    font-weight: bold;
}

p {
    margin-bottom: 10px;
}

a {
    text-decoration: underline;
}

blockquote {
    margin-bottom: 10px;
    padding: 10px 20px;
    border-left: 5px solid #e2e2e2;
    font-size: 18px;
    line-height: 22px;
}

iframe.module-added {
    display: none;
}

iframe.full {
    position: fixed;
    height: 100%;
    width: 100%;
    z-index: 9999;
    top: 0;
    border: 0;
    display: block !important;
}

.iframe-close {
    display: block;
    position: fixed;
    top: 1px;
    left: 52px;
    cursor: pointer;
    font-size: 3em;
    color: #0099cc;
    padding: 0.3em;
    height: 2em;
    width: 2em;
    z-index: 10000;
}

blockquote {
    border-left: 5px solid #e2e2e2;
    margin-bottom: 10px;
    padding: 10px 20px;
    font-size: 18px;
    line-height: 22px;
}

.utility-page-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100vw;
    height: 100vh;
    max-height: 100%;
    max-width: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.utility-page-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 260px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
}

.utility-page-form {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.section-header {
    display: block;
    width: 100%;
    height: 60px;
    background-image: -webkit-linear-gradient(270deg, #60b9cb, #60b9cb),
        -webkit-linear-gradient(180deg, #a0e5ce, #98d7ec);
    background-image: linear-gradient(180deg, #60b9cb, #60b9cb),
        linear-gradient(270deg, #a0e5ce, #98d7ec);
}

.section-footer {
    position: relative;
    left: 0px;
    right: 0px;
    bottom: 0px;
    display: block;
    width: 100%;
    height: 70vh;
    margin-top: 20px;
    background-image: -webkit-linear-gradient(0deg, #97def6, #a0e5ce);
    background-image: linear-gradient(90deg, #97def6, #a0e5ce);
    text-align: center;
}

.section-footer.err {
    height: 100vh;
    margin-top: 0px;
}

.section-footer.cam {
    position: static;
    width: auto;
    height: 100vh;
    margin-top: 0px;
}

.flex-logo-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 275px;
}

.flex-logo-wrapper.banner-logo-wrapper {
    position: static;
    z-index: 1000;
    height: 100px;
}

.flex-logo-wrapper.banner-logo-wrapper.footer-logo {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 0px;
    margin-bottom: 30px;
}

.left-wrapper {
    overflow: visible;
    width: 38%;
    height: 110px;
    margin-right: 0px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    background-image: url("/img/swelleye-left.png");
    background-position: 0px 0px;
    background-size: 400px;
}

.left-wrapper.logo-left {
    height: 55px;
    margin-top: 0px;
    margin-right: 0px;
    -webkit-flex-basis: 35%;
    -ms-flex-preferred-size: 35%;
    flex-basis: 35%;
    background-image: url("/img/logo-wave-left.svg");
    background-position: 0px 0px;
    background-size: 150px;
    background-repeat: repeat-x;
}

.left-wrapper.logo-left.footer {
    margin-right: 0px;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-flex-basis: 35%;
    -ms-flex-preferred-size: 35%;
    flex-basis: 35%;
    background-image: url("/img/logo-wave-left.svg");
    background-position: 0px 0px;
    background-size: 200px;
    background-repeat: repeat-x;
}

.middle-wrapper {
    display: block;
    overflow: visible;
    width: 20%;
    min-width: 300px;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    background-image: url("/img/swelleye.png");
    background-position: 50% 0px;
    background-size: 400px;
    background-repeat: no-repeat;
}

.middle-wrapper.logo-center {
    width: 10%;
    min-width: 0px;
    -webkit-flex-basis: 136px;
    -ms-flex-preferred-size: 136px;
    flex-basis: 136px;
    background-image: url("/img/logo-swelleye-full-size.svg");
    background-size: 150px;
}

.middle-wrapper.logo-center.footer {
    padding-bottom: 100px;
    -webkit-flex-basis: 136px;
    -ms-flex-preferred-size: 136px;
    flex-basis: 136px;
    background-size: 200px;
}

.right-wrapper {
    overflow: visible;
    width: 35%;
    height: 110px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    background-image: url("/img/swelleye-right.png");
    background-position: 100% 0px;
    background-size: 400px;
    background-repeat: repeat-x;
}

.right-wrapper.logo-right {
    height: 55px;
    margin-left: 0px;
    -webkit-flex-basis: 35%;
    -ms-flex-preferred-size: 35%;
    flex-basis: 35%;
    background-image: url("/img/logo-wave-right.svg");
    background-position: 100% 0px;
    background-size: 150px;
}

.right-wrapper.logo-right.footer {
    margin-left: 0px;
    -webkit-box-flex: 35%;
    -webkit-flex: 35%;
    -ms-flex: 35%;
    flex: 35%;
    background-image: url("/img/logo-wave-right.svg");
    background-position: 100% 0px;
    background-size: 200px;
    background-repeat: repeat-x;
}

.text-block {
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin-bottom: 40px;
}

.text-block.coming-text {
    left: 0px;
    top: 100px;
    right: 0px;
    bottom: auto;
    margin-top: 20px;
    margin-bottom: 20px;
    font-family: Fontawesome, sans-serif;
    color: #fff;
    font-size: 1.5em;
    line-height: 1.3em;
    letter-spacing: 0.1em;
}

.text-block.coming-text.cam {
    position: static;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 25px;
    letter-spacing: 0em;
}

.text-block._404-text-2 {
    left: 0px;
    top: 125px;
    right: 0px;
    bottom: auto;
    margin-top: 50px;
    margin-bottom: 20px;
    font-family: Muli, sans-serif;
    color: #fff;
    font-size: 32px;
    line-height: 1.2em;
    font-weight: 600;
    letter-spacing: 2px;
}

.text-block._404-text-3 {
    left: 0px;
    top: 200px;
    right: 0px;
    bottom: auto;
    margin-top: 50px;
    margin-bottom: 20px;
    font-family: Fontawesome, sans-serif;
    color: #fff;
    font-size: 1.5em;
    line-height: 1.3em;
    letter-spacing: 0.1em;
}

.section {
    height: 90vh;
}

.section.header {
    height: auto;
}

.section.tabs {
    height: auto;
    border-top: 1px none #000;
    border-bottom: 1px none #09c;
}

.section.tabs.hidden-plans {
    display: none;
}

.flex-parent-plug-ban {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: auto;
    margin-bottom: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.flex-parent-plug-ban.slider {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.ad-mid-page-banner {
    width: 100%;
    max-width: none;
    border: 2px none #fff;
    border-radius: 0px;
}

.nav-link {
    margin-bottom: 0px;
    padding-bottom: 10px;
    font-family: "Josefin Sans", sans-serif;
    color: #fff;
    font-size: 26px;
    line-height: 22px;
    font-weight: 300;
    text-align: center;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.nav-link:hover {
    border-bottom: 1px solid #60b9cb;
}

.nav-link.subscribe-link {
    color: #ff7000;
    font-weight: 400;
}

.nav-link.subscribe-link:hover {
    border-bottom: 1px solid #60b9cb;
    text-shadow: none;
}

.map-container-div {
    height: 440px;
    margin-top: 0px;
    margin-bottom: 0px;
}

.banner-logo-div {
    position: relative;
    margin-top: 0px;
    padding-top: 10px;
}

.section-2 {
    margin-top: 40px;
    margin-bottom: 80px;
}

.section-2.info {
    margin-top: 80px;
    margin-bottom: 100px;
}

.info-icon {
    padding-bottom: 10px;
    border: 1px none #000;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
}

.container-info {
    text-align: center;
}

.heading-info {
    font-family: "Josefin Sans", sans-serif;
    color: rgba(0, 153, 204, 0.8);
    font-size: 20px;
    font-weight: 300;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.heading-info.latest {
    padding: 20px 15px 12px;
    font-size: 18px;
    text-align: center;
    letter-spacing: 0px;
}

.heading-info.streaming {
    padding-top: 20px;
    padding-bottom: 0px;
}

.heading-info.streaming.cam {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 10px 5px 6px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    color: #fff;
    line-height: 20px;
    font-weight: 300;
}

.heading-info.streaming.cam.vid {
    padding-bottom: 4px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    font-size: 18px;
    text-align: left;
}

.heading-info.about {
    margin-top: 35px;
    margin-bottom: 10px;
    font-family: "Open Sans", sans-serif;
    color: #09c;
    font-size: 22px;
    line-height: 24px;
    font-weight: 600;
    text-transform: none;
}

.heading-info.about._3-4-tw {
    margin-top: 0px;
    text-align: center;
}

.heading-info.about.center {
    text-align: center;
}

.heading-info.about.center.my-multi {
    margin-top: 0px;
}

.heading-info.about.trouble {
    color: orange;
}

.heading-info.pro {
    margin-top: 20px;
    padding-top: 0px;
    padding-right: 5px;
    padding-left: 5px;
    font-weight: 700;
}

.heading-info.pro.border {
    margin-top: 15px;
}

.heading-info.pro.payment {
    width: 20%;
    margin-top: 10px;
    margin-bottom: 5px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    color: #fff;
    font-size: 18px;
    line-height: 18px;
    font-weight: 300;
    text-align: center;
    letter-spacing: 0.5px;
}

.heading-info.pro.payment.bk {
    width: 100%;
    font-family: Muli, sans-serif;
    color: #999;
    text-transform: none;
}

.text-info {
    margin-top: 0px;
    margin-bottom: 0px;
    padding-right: 5px;
    padding-left: 5px;
    font-family: "Josefin Sans", sans-serif;
    color: hsla(0, 0%, 60%, 0.8);
    font-size: 17px;
    line-height: 22px;
    font-weight: 300;
    text-align: justify;
    letter-spacing: 0.5px;
}

.text-info.stream {
    padding: 15px;
    text-align: justify;
}

.text-info.stream.pro {
    margin-top: 50px;
    margin-bottom: 50px;
    color: #999;
    font-size: 22px;
    font-weight: 400;
    text-align: center;
}

.text-info.stream.pro.no-email {
    margin-top: 0px;
    margin-bottom: 0px;
    font-family: Muli, sans-serif;
    font-size: 18px;
    letter-spacing: 0.5px;
}

.text-info.ad {
    padding-top: 15px;
    padding-left: 15px;
    color: #09c;
}

.text-info.ad.right {
    padding-right: 100px;
    text-align: right;
}

.text-info.ad.popup {
    position: relative;
    z-index: 9999;
    margin-bottom: 25px;
    padding-right: 25px;
    padding-left: 25px;
    color: #666;
}

.text-info.ad.pro {
    margin-bottom: 20px;
    padding-top: 0px;
    padding-left: 5px;
    font-family: Muli, sans-serif;
    font-weight: 400;
    text-align: center;
}

.text-info.ad.pro.descrip {
    padding-right: 15px;
    padding-left: 15px;
    color: #999;
    font-size: 15px;
    font-weight: 300;
    text-align: justify;
}

.text-info.ad.pro.descrip.margin {
    margin-top: 15px;
    text-align: center;
    letter-spacing: 0px;
}

.text-info.ad.pro.descrip.margin.surfcheck {
    margin-top: 50px;
    margin-bottom: 0px;
}

.text-info.ad.pro.descrip.zh {
    color: #888;
    font-size: 17px;
}

.text-info.ad.pro.border {
    margin-bottom: 16px;
}

.text-info.ad.pro.border.no-email {
    margin-bottom: 25px;
    cursor: pointer;
}

.button-cta {
    width: 30%;
    margin-top: 0px;
    padding-top: 14px;
    padding-bottom: 12px;
    float: none;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border: 1px solid #98d7ec;
    border-radius: 2px;
    background-color: #98d7ec;
    -webkit-transition: background-color 200ms ease, color 100ms ease;
    transition: background-color 200ms ease, color 100ms ease;
    font-family: "Josefin Sans", sans-serif;
    color: #fff;
    font-size: 20px;
    font-weight: 300;
    text-align: center;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.button-cta:hover {
    background-color: #fff;
    color: #60b9cb;
}

.button-cta.button-map {
    width: auto;
    border-color: #fff;
    background-color: #fff;
    color: #60b9cb;
    font-weight: 300;
    cursor: default;
}

.button-cta.button-map:hover {
    background-color: transparent;
    color: #fff;
}

.button-cta.button-map.button-map-tablet.button-map-phone-port {
    padding: 20px 20px 15px;
    border-radius: 2px;
    box-shadow: 4px 6px 15px 5px rgba(0, 0, 0, 0.1);
    -webkit-transition: background-color 200ms ease, color 100ms ease,
        box-shadow 300ms ease;
    transition: background-color 200ms ease, color 100ms ease,
        box-shadow 300ms ease;
}

.button-cta.button-map.button-map-tablet.button-map-phone-port:hover {
    box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.1);
}

.button-cta.button-map.button-map-tablet.button-map-phone-port.cs {
    position: relative;
    bottom: 25px;
    padding: 15px 55px 10px;
}

.button-cta.button-map.button-map-tablet.button-map-phone-port.cs._404 {
    top: 325px;
    bottom: 0px;
    margin-top: 25px;
}

.button-cta.button-map.button-map-tablet.button-map-phone-port.cs._404.rt {
    margin-left: 50px;
}

.map-container {
    position: relative;
    top: -440px;
    z-index: 1;
    height: 440px;
}

.section-hosts {
    height: 235px;
    margin: 100px 75px;
    padding-top: 0px;
    padding-bottom: 0px;
    border-style: solid none;
    border-width: 1px;
    border-color: rgba(0, 0, 0, 0.2);
    text-align: center;
}

.section-hosts.section-hosts-mobile {
    height: auto;
    margin-top: 150px;
    margin-bottom: 150px;
    border-style: none;
}

.section-hosts.section-hosts-mobile.multi {
    margin-right: 0px;
    margin-left: 0px;
}

.section-hosts.section-hosts-mobile.multi.ph {
    display: none;
}

.sponsor-image {
    max-width: none;
    margin: 5px 24px 10px;
    border-style: none;
    border-width: 1px;
    border-color: rgba(0, 0, 0, 0.2);
    -webkit-transition: box-shadow 200ms ease-out;
    transition: box-shadow 200ms ease-out;
}

.sponsor-image:hover {
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.4), 0 6px 12px 0 rgba(0, 0, 0, 0.2);
}

.button.hosts {
    position: static;
    top: -10px;
    display: block;
    margin-right: auto;
    margin-bottom: 25px;
    margin-left: auto;
    padding-top: 0px;
    padding-bottom: 0px;
    background-color: transparent;
    font-family: Muli;
    color: hsla(0, 0%, 60%, 0.7);
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 1px;
    text-decoration: none;
    text-transform: none;
}

.icon-link:hover {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

.icon-link.cams:hover {
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
}

.icon-link.forecasts:hover {
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
}

.icon-link.shops:hover {
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
}

.icon-link.learn:hover {
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
}

.heading-1 {
    margin-top: 0px;
    margin-bottom: 20px;
    float: none;
    box-shadow: none;
    font-family: Muli, sans-serif;
    color: #333;
    font-size: 46px;
    line-height: 1.2em;
    font-weight: 200;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.heading-1.hero-text {
    margin-top: 0px;
    margin-bottom: 0px;
    padding-right: 20px;
    padding-bottom: 35px;
    padding-left: 20px;
    color: #fff;
    font-size: 32px;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: none;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
}

.heading-1.hero-text.cs {
    position: relative;
    bottom: 125px;
    padding-bottom: 0px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
}

.heading-1.blog {
    margin-top: 20px;
    margin-bottom: 0px;
    color: #09c;
    font-size: 34px;
}

.map-overlay {
    position: relative;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 1998;
    display: block;
    height: 440px;
    background-image: -webkit-linear-gradient(0deg, #98d7ec, #a0e5ce);
    background-image: linear-gradient(90deg, #98d7ec, #a0e5ce);
    opacity: 0.85;
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
    color: #60b9cb;
}

.map-overlay:hover {
    opacity: 0.8;
}

.map-overlay.load-map-button {
  position: relative;
  background-image: url('/img/map-overlay-cams-en.png');
  background-color: #99c6ca;
  background-position: 50% 50%;
  background-size: auto;
  background-repeat: no-repeat;
  opacity: 1;
}

.map-overlay.load-map-button.zh {
  position: relative;
  background-image: url('/img/map-overlay-cams-zh.png');
  background-color: #99c6ca;
  background-position: 50% 50%;
  background-size: auto;
  background-repeat: no-repeat;
  opacity: 1;
}

.map-overlay.load-map-button.biz {
  position: relative;
  background-image: url('/img/map-overlay-biz-en.png');
  background-color: #99c6ca;
  background-position: 50% 50%;
  background-size: auto;
  background-repeat: no-repeat;
  opacity: 1;
}

.map-overlay.load-map-button.biz.zh {
  position: relative;
  background-image: url('/img/map-overlay-biz-zh.png');
  background-color: #99c6ca;
  background-position: 50% 50%;
  background-size: auto;
  background-repeat: no-repeat;
  opacity: 1;
}

.map-overlay.load-map-button.spots {
  position: relative;
  background-image: url('/img/map-overlay-spots-en.png');
  background-color: #99c6ca;
  background-position: 50% 50%;
  background-size: auto;
  background-repeat: no-repeat;
  opacity: 1;
}

.map-overlay.load-map-button.spots.zh {
  position: relative;
  background-image: url('/img/map-overlay-spots-zh.png');
  background-color: #99c6ca;
  background-position: 50% 50%;
  background-size: auto;
  background-repeat: no-repeat;
  opacity: 1;
}

.map-overlay.load-map-button.spots-2 {
  position: relative;
  background-image: url('/img/map-overlay-spots2-en.png');
  background-color: #99c6ca;
  background-position: 50% 50%;
  background-size: auto;
  background-repeat: no-repeat;
  opacity: 1;
}

.map-overlay.load-map-button.spots-2.zh {
  position: relative;
  background-image: url('/img/map-overlay-spots2-zh.png');
  background-color: #99c6ca;
  background-position: 50% 50%;
  background-size: auto;
  background-repeat: no-repeat;
  opacity: 1;
}

.map-overlay.load-map-button.homepage {
  position: relative;
  background-image: url('/img/map-overlay-spots-surfer-en.png');
  background-color: #99c6ca;
  background-position: 50% 50%;
  background-size: auto;
  background-repeat: no-repeat;
  opacity: 0.25;
}

.map-overlay.load-map-button.homepage.zh {
  position: relative;
  background-image: url('/img/map-overlay-spots-surfer-zh.png');
  background-color: #99c6ca;
  background-position: 50% 50%;
  background-size: auto;
  background-repeat: no-repeat;
  opacity: 0.25;
}

.container {
    position: relative;
    top: 175px;
    z-index: 1999;
    margin-bottom: -155px;
    text-align: center;
}

.container.en {
    top: 145px;
    margin-bottom: -240px;
}

.container.simp {
    margin-bottom: -190px;
}

.container.ja {
    top: 145px;
    margin-bottom: -220px;
}

.map-text-button-overlay-wrap {
    margin-top: -55px;
}

.map-text-button-overlay-wrap.load-map-button {
  margin-top: 0px;
}


.tab-link {
    width: 25%;
    padding-top: 15px;
    padding-bottom: 15px;
    border-style: solid solid none;
    border-width: 1px;
    border-color: #000;
    background-color: #fff;
    -webkit-transition: background-color 100ms ease;
    transition: background-color 100ms ease;
    font-family: Muli, sans-serif;
    color: #666;
    font-size: 18px;
    line-height: 0.5em;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
}

.tab-link:hover {
    background-color: #000;
    opacity: 1;
    color: #fff;
}

.tab-link.w--current {
    border-bottom-style: none;
    border-left-style: solid;
    background-color: #000;
    color: #fff;
    font-weight: 600;
    text-decoration: none;
}

.tab-link.tabs {
    width: 33.33333333%;
    border-color: rgba(0, 153, 204, 0.2) rgba(0, 153, 204, 0.2) #09c;
    border-bottom-style: solid;
    -webkit-transition: background-color 100ms ease, color 100ms ease;
    transition: background-color 100ms ease, color 100ms ease;
    color: rgba(0, 153, 204, 0.4);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.tab-link.tabs:hover {
    padding-top: 15px;
    border-style: solid;
    border-color: #09c;
    background-color: #fff;
    color: #09c;
    font-weight: 300;
}

.tab-link.tabs.w--current {
    border-style: solid;
    border-color: #09c #09c rgba(0, 153, 204, 0);
    background-color: #fff;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    -webkit-transition-duration: 200ms, 100ms;
    transition-duration: 200ms, 100ms;
    color: #09c;
}

.tab-link.tabs.w--current:hover {
    border-style: solid solid none;
}

.tab-link.forecast-tabs {
    width: 14.28571429%;
    padding: 10px 5px;
    border-color: rgba(0, 153, 204, 0.2) rgba(0, 153, 204, 0.2) #09c;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    background-color: #98d7ec;
    -webkit-transition: background-color 100ms ease, color 100ms ease;
    transition: background-color 100ms ease, color 100ms ease;
    color: #fff;
    border-style: solid none none;
}

.tab-link.forecast-tabs:hover {
    padding-top: 10px;
    background-color: #fff;
    color: #09c;
    font-weight: 300;
}

.tab-link.forecast-tabs.w--current {
    border-style: solid none none;
    border-color: #09c;
    border-right-width: 1px;
    border-left-width: 1px;
    background-color: #fff;
    -webkit-transition-duration: 200ms, 100ms;
    transition-duration: 200ms, 100ms;
    color: #09c;
}

.tab-link.forecast-tabs.w--current:hover {
    border-style: none;
}

.tabs-menu {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 10px;
    border-style: none;
    border-width: 1px;
    border-color: #000 #000 rgba(0, 153, 204, 0.2);
}

.tabs-menu.multi {
    margin-bottom: 0px;
}

.tab-pane {
    border-top: 1px none #000;
}

.video-flex-parent {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 20px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.video-flex-parent.cam {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.video-flex-parent.cam.vid {
    padding-top: 10px;
    padding-bottom: 10px;
}

.video-flex-parent.cam.vid.last {
    padding-bottom: 20px;
}

.video-flex-parent.cam.vid.how-to {
    width: 95%;
    padding-right: 0px;
    padding-bottom: 30px;
    padding-left: 0px;
}

.video-flex-parent.cam.blog-related {
    display: block;
    width: 65%;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.video-flex-parent.pro {
    padding-top: 35px;
    padding-right: 0px;
    padding-left: 0px;
}

.video-flex-parent.pro.descr {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.video-flex-parent.pro.descr.giveaway {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.video-flex-parent.pro.descr.no-trial {
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
}

.side-columns {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 25px 0px 0px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.side-columns.see-the-surf-first {
    padding-top: 40px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
}

.side-columns.see-the-surf-first.side-columns-reports {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.side-columns.see-the-surf-first.side-columns-reports.phone-land-twsr-side {
    padding-top: 0px;
}

.vid-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-right: 0px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: left;
}

.vid-container.right {
    position: relative;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-right: 50px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-align-content: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
    -webkit-flex-basis: 40%;
    -ms-flex-preferred-size: 40%;
    flex-basis: 40%;
}

.vid-container.right.see-button {
    padding-right: 0px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
}

.button-more-vids {
    position: relative;
    z-index: 5;
    display: block;
    width: 100%;
    height: auto;
    margin-top: 20px;
    padding-top: 30px;
    padding-bottom: 22px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    border: 1px solid #09c;
    border-radius: 2px;
    background-color: #fff;
    -webkit-transition: background-color 200ms ease, color 100ms ease;
    transition: background-color 200ms ease, color 100ms ease;
    font-family: "Josefin Sans", sans-serif;
    color: #09c;
    font-size: 20px;
    line-height: 1px;
    font-weight: 300;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    border-radius: 5px;
}

.button-more-vids:hover {
    border-style: solid;
    border-color: #98d7ec;
    background-color: #98d7ec;
    color: #fff;
}

.button-more-vids.cancel {
    position: static;
    display: block;
    width: 33%;
    margin-top: 50px;
    margin-right: auto;
    margin-left: auto;
    padding-right: 25px;
    padding-left: 25px;
    border-radius: 5px;
}

.button-more-vids.cancel:hover {
    padding-top: 29px;
    padding-bottom: 21px;
    border-width: 2px;
    border-color: #09c;
    border-radius: 0px;
    background-color: #fff;
    color: #09c;
}

.button-more-vids.cancel.sub {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 45px;
    margin-top: 20px;
    padding: 0px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-width: 1px;
    border-color: orange;
    background-color: transparent;
    background-image: -webkit-gradient(linear,
            left top,
            left bottom,
            from(rgba(0, 0, 0, 0.2)),
            to(rgba(0, 0, 0, 0.2)));
    background-image: linear-gradient(180deg,
            rgba(0, 0, 0, 0.2),
            rgba(0, 0, 0, 0.2));
    font-family: Muli;
    color: orange;
    text-transform: none;
}

.button-more-vids.cancel.sub:hover {
    padding: 0px;
    border-width: 2px;
}

.button-more-vids.cancel.sub.try-pro {
    position: static;
    top: 0px;
    right: -20%;
    width: auto;
    margin: 0px;
    padding-right: 15px;
    padding-left: 15px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    border-width: 3px;
    background-image: none;
    font-weight: 700;
    text-align: center;
    border-radius: 5px;
}

.button-more-vids.cancel.sub.try-pro:hover {
    border-width: 3px;
    background-color: #09c;
    color: #fff;
}

.text-tabs {
    padding-top: 5px;
    font-family: "Josefin Sans", sans-serif;
    font-size: 20px;
    font-weight: 300;
}

.slider {
    display: block;
    height: auto;
    background-color: transparent;
}

.slider.wk-wave-vid {
    display: block;
    width: 940px;
    margin-right: auto;
    margin-left: auto;
}

.icon {
    margin-left: 0px;
    color: hsla(0, 0%, 60%, 0.25);
}

.icon:hover {
    color: #999;
}

.icon.phone-land-arrow.phone-port-arrow.desktop-arrow {
    margin-top: 210px;
}

.icon.phone-land-arrow.phone-port-arrow.desktop-arrow.port-arrow {
    margin-top: auto;
    margin-bottom: auto;
    -webkit-transition: color 300ms ease;
    transition: color 300ms ease;
}

.icon.phone-land-arrow.phone-port-arrow.desktop-arrow.port-arrow:hover {
    color: #09c;
}

.icon.desktop-arrow {
    margin-top: 210px;
}

.icon.desktop-arrow.port-arrow {
    -webkit-transition: color 300ms ease;
    transition: color 300ms ease;
}

.icon.desktop-arrow.port-arrow:hover {
    color: #09c;
}

.icon-2 {
    margin-right: 0px;
    color: hsla(0, 0%, 60%, 0.25);
}

.icon-2:hover {
    color: #999;
}

.icon-2.phone-land-arrow.phone-port-arrow.desktop-arrow {
    margin-top: 210px;
}

.icon-2.phone-land-arrow.phone-port-arrow.desktop-arrow.port-arrow {
    margin-top: auto;
    margin-right: -8px;
    margin-bottom: auto;
    opacity: 1;
    -webkit-transition: color 300ms ease;
    transition: color 300ms ease;
}

.icon-2.phone-land-arrow.phone-port-arrow.desktop-arrow.port-arrow:hover {
    color: #09c;
}

.icon-2.desktop-arrow {
    margin-top: 210px;
}

.icon-2.desktop-arrow.port-arrow {
    -webkit-transition: color 300ms ease;
    transition: color 300ms ease;
}

.icon-2.desktop-arrow.port-arrow:hover {
    color: #09c;
}

.section-tabs-ad {
    margin-top: 25px;
    margin-bottom: 50px;
}

.flex-parent-tabs-plug {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.arrow-right {
    display: none;
    width: 45px;
    margin-top: -22px;
    margin-bottom: 54px;
}

.left-arrow {
    display: none;
    margin-top: -22px;
    margin-bottom: 54px;
    margin-left: -8px;
    padding-left: 0px;
}

.left-arrow.arrow-vimeo {
    width: 50px;
}

.footer {
    padding-top: 33px;
    padding-bottom: 0px;
    background-image: -webkit-linear-gradient(0deg, #98d7ec, #a0e5ce);
    background-image: linear-gradient(90deg, #98d7ec, #a0e5ce);
}

.footer-container {
    max-width: 1200px;
    margin-right: auto;
    margin-left: auto;
}

.footer-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 0px;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.footer-col {
    padding-right: 20px;
    padding-left: 20px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
}

.footer-col.social {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-left: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 30%;
    -ms-flex: 0 0 30%;
    flex: 0 0 30%;
}

.footer-links-wrap {
    margin-bottom: 20px;
    padding-bottom: 10px;
    text-align: left;
}

.footer-links-wrap.tagline {
    margin-bottom: 0px;
}

.footer-title {
    font-family: Muli, sans-serif;
    color: #fff;
    font-size: 18px;
    line-height: 1.6em;
    font-weight: 300;
    letter-spacing: 1px;
    text-transform: none;
}

.footer-link {
    display: block;
    margin-right: 0px;
    padding-top: 1px;
    padding-bottom: 1px;
    border: 1px none #0885af;
    font-family: Muli, sans-serif;
    color: #0885af;
    font-size: 15px;
    line-height: 1.8em;
    font-weight: 400;
    text-decoration: none;
    cursor: pointer;
}

.footer-link:hover {
    padding-bottom: 0px;
    border-bottom-style: solid;
    border-bottom-color: #fff;
    color: #0885af;
    text-decoration: none;
}

.copyright-wrap {
    padding-right: 20px;
}

.copyright-text {
    display: block;
    margin-top: 25px;
    margin-bottom: 5px;
    padding-right: 0px;
    padding-left: 0px;
    font-family: Muli, sans-serif;
    color: #0885af;
    font-size: 13px;
    line-height: 1.4em;
    font-weight: 400;
    text-align: center;
    letter-spacing: 0px;
    text-decoration: none;
}

.copyright-text:hover {
    border-bottom: 1px none #fff;
    color: #0885af;
}

.copyright-text.no-margin {
    margin-top: 5px;
    margin-bottom: 0px;
}

.text-social {
    padding: 5px 15px;
    border: 1px solid #fff;
    border-radius: 5px;
    -webkit-transition: background-color 300ms ease, color 300ms ease;
    transition: background-color 300ms ease, color 300ms ease;
    font-family: Fontawesome, sans-serif;
    color: #fff;
    font-size: 24px;
    line-height: 1.4em;
    text-align: left;
    letter-spacing: 0px;
    text-decoration: none;
}

.text-social:hover {
    background-color: #fff;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    color: #a0e5ce;
}

.text-social.youtube {
    padding-right: 11px;
    padding-left: 11px;
}

.text-social.instagram {
    padding-right: 12px;
    padding-left: 12px;
}

.link-block-2 {
    padding-right: 20px;
    text-align: center;
    text-decoration: none;
}

.social-link {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.email-subscribe {
    padding-right: 20px;
    text-align: right;
}

.email-subscribe.success {
    padding-right: 0px;
}

.email-subscribe.contact {
    margin-top: 35px;
    margin-bottom: 10px;
    padding-right: 0px;
}

.email-subscribe.host {
    margin-top: 35px;
    margin-bottom: 10px;
    padding-right: 0px;
}

.email-subscribe.free {
    margin-top: 0px;
    margin-bottom: 50px;
    padding-top: 35px;
    padding-right: 0px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.email-subscribe.free.pro.last {
    padding-top: 0px;
}

.email-subscribe.free.giveaway {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.form-wrapper {
    display: block;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    color: #fff;
}

.form-wrapper.success {
    margin-bottom: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.form {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-right: 20px;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.form.email {
    padding-right: 0px;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-family: "Open Sans", sans-serif;
    color: #fff;
    font-size: 15px;
    text-align: center;
}

.form.email.success {
    display: block;
    width: 100%;
    padding-right: 0px;
}

.form.email.footer2 {
    display: block;
}

.submit-button {
    width: auto;
    height: 43px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-style: solid solid solid none;
    border-width: 1px;
    border-color: #fff;
    background-color: transparent;
    -webkit-transition: color 300ms ease, background-color 300ms ease;
    transition: color 300ms ease, background-color 300ms ease;
    font-family: Muli, sans-serif;
    font-size: 15px;
    text-align: center;
    text-transform: uppercase;
}

.submit-button:hover {
    background-color: #fff;
    color: #a0e5ce;
}

.submit-button.hidden.success {
    border-top-style: none;
}

.submit-button.hidden.success.sub {
    margin-top: 15px;
    border-top-style: solid;
    background-image: none;
}

.submit-button.hidden.success.sub:hover {
    background-image: -webkit-linear-gradient(270deg,
            hsla(0, 0%, 100%, 0.6),
            hsla(0, 0%, 100%, 0.6));
    background-image: linear-gradient(180deg,
            hsla(0, 0%, 100%, 0.6),
            hsla(0, 0%, 100%, 0.6));
}

.submit-button.email {
    width: 100%;
    border-left-style: solid;
}

.submit-button.sub {
    width: 100%;
    margin-top: 15px;
    border-left-style: solid;
    border-radius: 5px;
}

.text-field {
    display: block;
    height: 43px;
    margin-bottom: 15px;
    padding-top: 11px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    border: 1px solid #fff;
    border-radius: 5px;
    background-color: transparent;
    font-family: Fontawesome, sans-serif;
    color: #0885af;
    font-size: 15px;
    letter-spacing: 0.5px;
}

.text-field:focus {
    border-color: #fff;
    background-color: hsla(0, 0%, 100%, 0.3);
    color: #0885af;
    text-align: center;
    letter-spacing: 1px;
}

.text-field::-webkit-input-placeholder {
    color: #0885af;
}

.text-field:-ms-input-placeholder {
    color: #0885af;
}

.text-field::placeholder {
    color: #0885af;
}

.text-field.hidden.success {
    width: 40%;
    margin-bottom: 0px;
    border-bottom-style: solid;
    text-align: center;
}

.text-field.hidden.success:hover {
    padding-top: 15px;
    padding-bottom: 15px;
    color: #50a5b6;
}

.text-field.hidden.success:active {
    background-color: transparent;
    background-image: -webkit-gradient(linear,
            left top,
            left bottom,
            from(hsla(0, 0%, 100%, 0.6)),
            to(hsla(0, 0%, 100%, 0.6)));
    background-image: linear-gradient(180deg,
            hsla(0, 0%, 100%, 0.6),
            hsla(0, 0%, 100%, 0.6));
    color: #60b9cb;
}

.text-field.hidden.success:focus {
    padding-top: 15px;
    padding-bottom: 15px;
    border: 2px solid #60b9cb;
    background-color: transparent;
    background-image: -webkit-gradient(linear,
            left top,
            left bottom,
            from(hsla(0, 0%, 100%, 0.6)),
            to(hsla(0, 0%, 100%, 0.6)));
    background-image: linear-gradient(180deg,
            hsla(0, 0%, 100%, 0.6),
            hsla(0, 0%, 100%, 0.6));
    color: #60b9cb;
    text-align: center;
}

.text-field.hidden.success::-webkit-input-placeholder {
    color: #60b9cb;
}

.text-field.hidden.success:-ms-input-placeholder {
    color: #60b9cb;
}

.text-field.hidden.success::placeholder {
    color: #60b9cb;
}

.text-field.hidden.success.subhide {
  margin-top: 0px;
  padding-top: 14px;
  padding-bottom: 14px;
  border-top-style: none;
  color: #60b9cb;
  font-weight: 100;
  text-align: left;
}

.text-field.hidden.success.subhide:hover {
  padding: 13px 14px;
  border-top-style: solid;
  border-top-width: 1px;
}

.text-field.hidden.success.subhide:focus {
  padding: 13px 13px 13px 14px;
  background-color: hsla(0, 0%, 100%, 0.6);
  background-image: none;
  color: #60b9cb;
  text-align: left;
  letter-spacing: 0.5px;
}

.text-field.hidden.success.subhide::-webkit-input-placeholder {
  color: #60b9cb;
}

.text-field.hidden.success.subhide:-ms-input-placeholder {
  color: #60b9cb;
}

.text-field.hidden.success.subhide::-ms-input-placeholder {
  color: #60b9cb;
}

.text-field.hidden.success.subhide::placeholder {
  color: #60b9cb;
}

.text-field.hidden.success.subhide.top {
  margin-top: 15px;
  border-top-style: solid;
  border-bottom-style: solid;
  color: #b9a8a8;
  font-weight: 100;
  text-align: left;
}

.text-field.hidden.success.subhide.top:hover {
  padding-left: 14px;
  border-top-width: 2px;
}

.text-field.hidden.success.subhide.top:focus {
  padding-left: 14px;
  text-align: left;
  letter-spacing: 0.5px;
}

.text-field.hidden.contact {
    display: block;
    width: 30%;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    border-bottom-style: solid;
    text-align: center;
    border-radius: 5px;
}

.text-field.hidden.contact:hover {
    padding-top: 15px;
    padding-bottom: 15px;
    border-width: 2px;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    color: #09c;
}

.text-field.hidden.contact:active {
    background-color: transparent;
    color: #09c;
}

.text-field.hidden.contact:focus {
    padding-top: 15px;
    padding-bottom: 15px;
    border: 2px solid #60b9cb;
    background-color: transparent;
    color: #09c;
    text-align: center;
}

.text-field.hidden.contact::-webkit-input-placeholder {
    color: #60b9cb;
}

.text-field.hidden.contact:-ms-input-placeholder {
    color: #60b9cb;
}

.text-field.hidden.contact::placeholder {
    color: #60b9cb;
}

.text-field.hidden.contact.free {
    width: 20%;
    background-image: none;
}

.text-field.hidden.contact.free.pro {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: auto;
    height: 45px;
    margin-right: 35px;
    margin-left: 20px;
    padding: 0px 20px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-decoration: none;
    text-transform: uppercase;
}

.text-field.hidden.contact.free.pro:focus {
    letter-spacing: 0.5px;
}

.text-field.hidden.contact.free.pro.rt {
    margin-right: 20px;
    margin-left: 35px;
}

.text-field.hidden.contact.free.pro.login {
    width: 340px;
    margin-right: 0px;
    margin-left: 0px;
    border-radius: 5px;
}

.text-field.hidden.contact.free.pro.zh {
    border-style: solid;
    border-radius: 10px;
    font-weight: 600;
}

.text-field.hidden.contact.free.pro.zh.giveaway {
    width: 65%;
}

.text-field.hidden.contact.free.my-multi {
    padding: 14px 5px;
    border-style: solid;
    border-width: 1px;
    background-color: hsla(0, 0%, 100%, 0.2);
    font-size: 20px;
    line-height: 20px;
    border-radius: 5px;
}

.text-field.hidden.contact.free.my-multi:hover {
    padding-top: 12px;
    padding-bottom: 12px;
    border-width: 3px;
    background-color: rgba(255, 165, 0, 0.2);
}

.text-field.hidden.contact.free.my-multi:focus {
    padding-top: 12px;
    padding-bottom: 12px;
    border-width: 3px;
    border-color: #09c;
    background-color: rgba(255, 165, 0, 0.2);
}

.text-field.hidden.contact.free.my-multi:visited {
    padding-top: 14px;
    padding-bottom: 14px;
    border-width: 1px;
    background-color: hsla(0, 0%, 100%, 0.2);
}

.text-field.hidden.contact.free.my-multi.tab-ph-land {
    display: none;
}

.text-field.hidden.host {
    display: block;
    width: 30%;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    border-bottom-style: solid;
    background-image: none;
    text-align: center;
    border-radius: 5px;
}

.text-field.hidden.host:hover {
    padding-top: 15px;
    padding-bottom: 15px;
    border-width: 2px;
    background-image: none;
    color: #09c;
}

.text-field.hidden.host:active {
    background-color: transparent;
    color: #09c;
}

.text-field.hidden.host:focus {
    padding-top: 15px;
    padding-bottom: 15px;
    border: 2px solid #09c;
    background-color: transparent;
    color: #09c;
    text-align: center;
}

.text-field.hidden.host::-webkit-input-placeholder {
    color: #60b9cb;
}

.text-field.hidden.host:-ms-input-placeholder {
    color: #60b9cb;
}

.text-field.hidden.host::placeholder {
    color: #60b9cb;
}

.text-field.hidden.list {
    display: block;
    width: 30%;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    border-bottom-style: solid;
    background-image: none;
    text-align: center;
    border-radius: 5px;
}

.text-field.hidden.list:hover {
    padding-top: 15px;
    padding-bottom: 15px;
    border-width: 2px;
    background-image: none;
    color: #09c;
}

.text-field.hidden.list:active {
    background-color: transparent;
    color: #09c;
}

.text-field.hidden.list:focus {
    padding-top: 15px;
    padding-bottom: 15px;
    border: 2px solid #60b9cb;
    background-color: transparent;
    color: #09c;
    text-align: center;
}

.text-field.hidden.list::-webkit-input-placeholder {
    color: #60b9cb;
}

.text-field.hidden.list:-ms-input-placeholder {
    color: #60b9cb;
}

.text-field.hidden.list::-ms-input-placeholder {
    color: #60b9cb;
}

.text-field.hidden.list::placeholder {
    color: #60b9cb;
}

.text-field.hidden.list.multi {
    width: 40%;
    padding-top: 15px;
    border-style: solid;
    border-width: 1px;
    background-color: hsla(0, 0%, 100%, 0.2);
    font-size: 20px;
    border-radius: 5px;
}

.text-field.hidden.list.multi:hover {
    padding: 13px 10px 14px;
    border-style: solid;
    border-width: 3px;
}

.text-field.hidden.list.multi:focus {
    padding: 13px 10px 14px;
    border-width: 3px;
    border-color: #09c;
}

.text-field.hidden.list.multi:visited {
    padding: 13px 10px 14px;
    border-width: 3px;
}

.text-field.email {
    margin-top: 0px;
    margin-bottom: 0px;
    border-top-style: none;
    border-bottom-style: solid;
    background-image: -webkit-linear-gradient(270deg, transparent, transparent);
    background-image: linear-gradient(180deg, transparent, transparent);
    text-align: center;
}

.text-field.email:focus {
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    text-align: left;
}

.text-field.email.top {
    display: block;
    border-top-style: solid;
}

.text-field.units {
    width: 60px;
    height: auto;
    margin-bottom: 0px;
    padding: 0px;
    color: #09c;
    font-size: 48px;
    text-align: center;
}

.text-field.units.spot {
    border-style: none;
    font-family: "Josefin Sans", sans-serif;
    color: #09c;
    font-size: 17px;
    line-height: 18px;
    font-weight: 400;
    text-align: left;
    letter-spacing: 0px;
}

.success-message {
    width: 100%;
    margin-bottom: 10px;
    padding: 0px;
    background-color: transparent;
}

.success-message.success {
    margin-bottom: 0px;
}

.text-block-5 {
    padding: 10px;
    border: 1px solid #fff;
    font-family: Fontawesome, sans-serif;
    color: #0885af;
    font-size: 17px;
    line-height: 1.4em;
    letter-spacing: 1px;
}

.error-message {
    padding-right: 20px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    background-color: transparent;
}

.error-message.email {
    padding-right: 10px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    color: red;
    text-align: center;
}

.text-block-6 {
    font-family: Muli, sans-serif;
    font-size: 15px;
    line-height: 1.4em;
}

.text-block-6.hidden.success.mail {
    width: 100%;
    border-color: #60b9cb;
    background-image: -webkit-linear-gradient(270deg, #60b9cb, #60b9cb);
    background-image: linear-gradient(180deg, #60b9cb, #60b9cb);
    color: #fff;
}

.scroll-to-top {
    position: fixed;
    right: 0px;
    bottom: 90px;
    z-index: 9997;
    display: none;
    width: 40px;
    height: 40px;
    padding: 8px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid #98d7ec;
    background-color: transparent;
    opacity: 0;
    -webkit-transition: background-color 300ms ease;
    transition: background-color 300ms ease;
    font-family: Fontawesome, sans-serif;
    color: #98d7ec;
    font-weight: 700;
}

.scroll-to-top:hover {
    border-color: #09c;
    background-color: transparent;
    opacity: 1;
    color: #09c;
}

.scroll-to-top.sidenav {
    bottom: 50px;
    padding-right: 8px;
    padding-left: 8px;
    font-size: 20px;
}

.scroll-to-top.share {
    left: 0px;
    z-index: 9997;
    display: none;
    width: 40px;
    height: 40px;
    padding: 8px;
    border-color: #a0e5ce;
    opacity: 0;
    color: #a0e5ce;
    font-size: 22px;
}

.scroll-to-top.share:hover {
    border-color: #09c;
    color: #09c;
}

.scroll-to-top.share.fb {
    position: static;
    border-color: #98d7ec;
    background-color: #98d7ec;
    background-image: url("/img/social-fb.png");
    background-position: 50% 50%;
    background-size: contain;
    background-repeat: no-repeat;
}

.scroll-to-top.share.fb:hover {
    border-color: #09c;
}

.scroll-to-top.share.twit {
    position: static;
    border-color: #98d7ec;
    background-color: #98d7ec;
    background-image: url("/img/social-twit.png");
    background-position: 50% 50%;
    background-size: contain;
    background-repeat: no-repeat;
}

.scroll-to-top.share.twit:hover {
    border-color: #09c;
}

.scroll-to-top.share.mail {
    position: static;
    border-color: #98d7ec;
    background-color: #98d7ec;
    background-image: url("/img/social-mail.png");
    background-position: 50% 50%;
    background-size: contain;
    background-repeat: no-repeat;
}

.scroll-to-top.share.mail:hover {
    border-color: #09c;
}

.sponsors-flex-parent {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: auto;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.section-3 {
    margin-bottom: 0px;
}

.text-tagline {
    margin-top: 0px;
    margin-bottom: 25px;
    padding-right: 20px;
    font-family: Muli, sans-serif;
    color: #0885af;
    font-size: 18px;
    line-height: 1.6em;
    font-style: italic;
    font-weight: 400;
    text-align: right;
}

.surfing-in-taiwan {
    position: static;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 500px;
    margin-top: 150px;
    margin-bottom: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    background-image: url("/img/sit9.png");
    background-position: 50% 50%;
    background-size: cover;
    background-repeat: no-repeat;
    opacity: 1;
}

.sit-paragraph {
    display: block;
    width: 82%;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    padding: 0px;
    font-family: "Open Sans", sans-serif;
    color: #0885af;
    font-size: 17px;
    line-height: 1.3em;
    text-align: justify;
}

.sit-link {
    color: #905890;
    font-weight: 600;
    text-decoration: none;
    text-transform: none;
}

.sit-link:hover {
    color: purple;
}

.sit-link.blue {
    color: #09c;
    font-weight: 300;
}

.sit-link.blue:hover {
    color: #60b9cb;
}

.sit-link.my-multi {
  display: block;
  font-family: Muli, sans-serif;
  color: #888;
  font-size: 17px;
  line-height: 18px;
  font-weight: 400;
  text-align: center;
}

.div-block {
    margin-top: auto;
    margin-bottom: auto;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.cta-button-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    background-image: -webkit-linear-gradient(270deg, #60b9cb, #60b9cb);
    background-image: linear-gradient(180deg, #60b9cb, #60b9cb);
}

.recommend {
    margin-top: 0px;
    margin-bottom: 150px;
}

.news-flex-pa {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.section-heading {
    margin-top: 0px;
    box-shadow: none;
    font-family: "Josefin Sans", sans-serif;
    color: #09c;
    font-size: 32px;
    line-height: 1.4em;
    font-weight: 400;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.section-heading.sit-heading {
    width: 940px;
    padding-top: 20px;
}

.section-heading.pro-heading {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 40%;
    margin-bottom: 0px;
    padding-top: 20px;
    font-weight: 400;
    text-transform: uppercase;
}

.section-heading.pro-heading.right {
    width: 60%;
    margin-bottom: 0px;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    font-size: 28px;
    font-weight: 300;
    text-transform: none;
}

.section-heading.ad {
    margin-bottom: 5px;
    color: #09c;
    font-size: 24px;
    font-weight: 300;
}

.section-heading.ad.right {
    text-align: right;
}

.section-heading.ad.popup {
    position: relative;
    z-index: 9999;
    margin-top: 25px;
    padding-right: 25px;
    padding-left: 25px;
    font-size: 22px;
}

.section-heading.feedback-heading {
    display: block;
    width: 90%;
    margin: 25px auto 0px;
    padding-top: 0px;
    padding-left: 0px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 28px;
    font-weight: 400;
    text-transform: uppercase;
}

.section-heading.welcome {
    margin-bottom: 20px;
    padding-top: 10px;
    text-align: center;
    text-transform: none;
}

.section-heading.wk-wave-vid {
    margin-top: 25px;
    padding-left: 0px;
    line-height: 1.1em;
    text-align: center;
}

.section-heading.tos {
    font-size: 30px;
    text-align: center;
}

.section-heading.pro {
    margin-top: 35px;
}

.section-heading.center {
    text-align: center;
}

.news-div {
    margin-right: 0px;
    margin-left: 0px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border-radius: 2px;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    -webkit-transition: box-shadow 300ms ease;
    transition: box-shadow 300ms ease;
    text-align: center;
    border: solid 1px #0099cc;
    border-radius: 5px;
}

.news-div:hover {
    box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.1);
}

.news-div.left {
    margin-right: 20px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border: solid 1px #0099cc;
    border-radius: 5px;
}

.news-div.right {
    margin-left: 20px;
}

.news-div.tos {
    width: 65%;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
}

.news-div.no-shadow {
    box-shadow: none;
    -webkit-transition-property: none;
    transition-property: none;
    border: none;
}

.news-div.no-shadow.tos.ph {
    display: none;
}

.link-block-4 {
    text-decoration: none;
}

.link-block-4.blog {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.link-block-4.blog.en {
    margin-bottom: 25px;
}

.stream-image {
    position: relative;
    z-index: 2;
    border-color: transparent;
}

.stream-image:hover {
    opacity: 1;
}

.stream-image.soon {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    -webkit-filter: saturate(0%);
    filter: saturate(0%);
    cursor: default;
}

.stream-image.vids {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.stream-image.vids.blog {
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

.stream-image.vids.pro24 {
    border: 1px #999;
    border-radius: 0;
}

.stream-image.vids.pro24.thumbs {
    width: 275px;
    margin-left: 20px;
}

.stream-image.plug-unit-300x250 {
    max-width: 100%;
    border-color: transparent;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.stream-image.plug-unit-300x150 {
    max-width: 100%;
    border-color: transparent;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.stream-image.plug-unit-300x150.blog {
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

.stream-image.plug-unit-300x250 {
    max-width: 100%;
    border-color: transparent;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.stream-image.plug-unit-300x250.blog {
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

.stream-div {
    min-height: 370px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 41%;
    -ms-flex: 0 41%;
    flex: 0 41%;
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    -webkit-transition: box-shadow 300ms ease;
    transition: box-shadow 300ms ease;
    text-align: center;
    border: solid 1px #0099cc;
    border-radius: 5px;
}

.stream-div:hover {
    box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.1);
}

.stream-div.tabphland.cam {
    min-height: 0px;
    margin-right: 20px;
    margin-left: 20px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
}

.stream-div.tabphland.cam.blog {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 41%;
    -ms-flex: 0 0 41%;
    flex: 0 0 41%;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.stream-div.tabphland.cam.vid {
    width: 100%;
    margin-right: 10px;
    margin-left: 10px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.stream-div.tabphland.cam.vid.pro {
    max-width: 640px;
    margin-top: 30px;
    margin-bottom: 75px;
}

.stream-div.tabphland.cam.vid.pro.left {
    text-align: left;
}

.stream-div.tabphland.cam.vid.pro.pro24 {
    box-shadow: none;
    background-image: none;
    border-style: none;
    align-self: flex-end;
    width: 100%;
    margin: 0 0 30px;
    padding-top: 30px;
    transition-property: none;
}

.stream-div.tabphland.ad-unit-ph-only {
    display: none;
    min-height: 0px;
    margin-right: 20px;
    margin-left: 20px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
}

.stream-div.pro {
    box-shadow: none;
    cursor: pointer;
    border: 2px solid #7ca6c6;
    border-radius: 10px;
    flex-basis: 30%;
    min-height: 0;
}

.stream-div.pro:hover {
    box-shadow: 4px 6px 15px 5px #0000001a;
}

.stream-div.pro.border {
    border: 5px solid orange;
    display: block;
    box-shadow: 1px 2px 5px 1px #0000001a;
}

.stream-div.pro.border:hover {
    box-shadow: 1px 2px 5px 1px #0000001a;
}

.stream-div.pro.border.no-email {
    -webkit-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    border-color: red;
    cursor: default;
}

.stream-div.pro.no-hover {
    cursor: default;
}

.video-wrap {
    position: relative;
}

.blog-link {
    -webkit-transition: color 300ms ease;
    transition: color 300ms ease;
    color: #09c;
    text-decoration: none;
}

.blog-link:hover {
    color: #98d7ec;
}

.blog-link.back {
    display: none;
    width: auto;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: transparent;
    font-family: Muli, sans-serif;
    color: #fff;
    font-size: 16px;
    line-height: 18px;
}

.dropdown-toggle {
    position: static;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    display: inline-block;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    padding: 20px 5px;
    float: none;
}

.dropdown-toggle.w--open {
    float: none;
}

.dropdown-toggle.nav-icon3.blue {
    margin-left: 0px;
    padding: 15px 10px 18px;
    color: hsla(0, 0%, 60%, 0.4);
    font-weight: 700;
}

.dropdown-toggle.nav-icon3.blue:hover {
    color: #98d7ec;
}

.dropdown-toggle.nav-icon3.blue:focus {
    color: #98d7ec;
}

.dropdown-toggle.nav-icon3.green {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 30px;
    height: 30px;
    margin-top: -2px;
    margin-right: 10px;
    padding: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.dropdown-toggle.nav-icon3.green:hover {
    color: #98d7ec;
}

.dropdown-toggle.nav-icon3.green:active {
    color: #333;
}

.dropdown-toggle.nav-icon3.green:focus {
    color: #333;
}

.dropdown-link {
    display: block;
    width: 100vw;
    margin-top: 0px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 20px;
    padding-bottom: 20px;
    background-color: transparent;
    background-image: -webkit-linear-gradient(0deg, #98d7ec, #a0e5ce);
    background-image: linear-gradient(90deg, #98d7ec, #a0e5ce);
    color: #666;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
}

.dropdown-link.nav-link {
    padding-top: 15px;
    padding-bottom: 10px;
    color: #fff;
}

.dropdown-link.nav-link.droplink1 {
    margin-top: 8px;
    padding-top: 29px;
}

.dropdown-link.nav-link.subscribe-link {
    display: block;
    padding-top: 17px;
    padding-bottom: 12px;
    color: #ff7000;
}

.dropdown-link.nav-link.bottom-left {
    padding-top: 119px;
    padding-bottom: 119px;
}

.dropdown-link.nav-link.newnav {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-top: 0px;
    padding-bottom: 1px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.dropdown-link.nav-link.newnav:hover {
    padding-bottom: 0px;
}

.dropdown-link.nav-link.newnav.pro {
    background-image: linear-gradient(90deg, #7da6c7, #68b8fa);
}

.dropdown-list {
    position: absolute;
    overflow: hidden;
    margin-top: -10px;
}

.dropdown-list.w--open {
    right: 0px;
    display: block;
    width: 100%;
    margin-top: 0px;
    margin-right: auto;
    margin-left: auto;
    background-color: transparent;
}

.navbar-parent {
    position: static;
    left: 0px;
    top: 0px;
    bottom: 0px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: -50px;
    margin-bottom: 55px;
    padding-top: 0px;
    padding-bottom: 0px;
    float: none;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-align-content: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
}

.dropdown {
    position: static;
    left: 0px;
    right: 0px;
    z-index: 2002;
    margin-top: 0px;
    margin-right: 0px;
    margin-left: 0px;
    float: none;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    text-align: left;
}

.container-nav {
    position: static;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 37px;
    margin-top: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.container-nav.right-nav {
    display: none;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    text-align: left;
}

.nav-div {
    position: relative;
    z-index: 2999;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    max-width: 960px;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.sit-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.sit-slider {
    display: block;
    width: auto;
    min-width: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    background-color: transparent;
}

.icon-3 {
    margin-top: 320px;
}

.icon-4 {
    margin-top: 320px;
}

.sit-slide {
    left: 0px;
    right: 0px;
    bottom: -315px;
    width: 100%;
    height: 90%;
}

.sit-slide.sit-slide-2 {
    bottom: -285px;
}

.sit-slide.sit-slide-3 {
    bottom: -310px;
}

.sit-arrow {
    -webkit-transition: color 400ms ease;
    transition: color 400ms ease;
}

.sit-arrow:hover {
    color: #09c;
}

.slide-nav-2.en {
    display: none;
    margin-bottom: -40px;
}

.footer-title-phone-port {
    font-family: Muli, sans-serif;
    color: #fff;
    font-size: 18px;
    line-height: 1.6em;
    font-weight: 300;
    letter-spacing: 1px;
    text-transform: none;
}

.footer-link-phone {
    display: block;
    margin-right: 0px;
    padding-top: 1px;
    padding-bottom: 1px;
    -webkit-transition: color 200ms ease;
    transition: color 200ms ease;
    font-family: Muli, sans-serif;
    color: #0885af;
    font-size: 15px;
    line-height: 1.8em;
    font-weight: 400;
    text-decoration: none;
}

.footer-link-phone:hover {
    color: #fff;
    font-weight: 600;
}

.dropdown-list-phone {
    display: block;
    overflow: hidden;
}

.try-premium-section {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: auto;
    margin-top: 100px;
    margin-bottom: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
}

.button-cta-premium {
    width: 100%;
    margin-top: 0px;
    padding: 25px;
    float: none;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    border: 1px solid #60b9cb;
    border-radius: 0px;
    background-color: #60b9cb;
    -webkit-transition: color 400ms ease;
    transition: color 400ms ease;
    font-family: Muli, sans-serif;
    color: #fff;
    font-size: 24px;
    line-height: 24px;
    font-weight: 400;
    text-align: center;
    letter-spacing: 1px;
    text-decoration: none;
    text-transform: none;
}

.button-cta-premium:hover {
    border-style: solid;
    border-color: #60b9cb;
    background-color: #60b9cb;
    box-shadow: none;
    color: hsla(0, 0%, 100%, 0.7);
}

.premium-form-section {
    display: block;
    overflow: hidden;
    margin-right: auto;
    margin-left: auto;
    background-image: url("/img/pro-back2.jpg");
    background-position: 50% 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: scroll;
    opacity: 1;
    letter-spacing: 1px;
}

.premium-form-section.pro {
    background-image: none;
    margin-top: 0;
    display: block;
}

.form-wrapper-premium {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 15px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-align-content: space-between;
    -ms-flex-line-pack: justify;
    align-content: space-between;
    color: #fff;
}

.form-premium {
    float: none;
}

.premium-title-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

.pro-div-form {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.pro-div-checklist {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 20px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: justify;
}

.pro-field-label {
    width: 50%;
    margin-bottom: 2px;
    font-family: "Open Sans", sans-serif;
    color: #09c;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.pro-field-label.password {
    width: 30%;
    float: left;
}

.pro-field-label.password-right {
    width: 70%;
    float: left;
    text-transform: none;
}

.pro-text-field {
    padding-top: 0px;
    padding-bottom: 0px;
    border-color: #09c;
    background-color: transparent;
    -webkit-transition: background-color 300ms ease;
    transition: background-color 300ms ease;
    font-family: Muli, sans-serif;
    color: #09c;
    font-weight: 400;
    letter-spacing: 1.5px;
    border-radius: 5px;
}

.pro-text-field:hover {
    background-color: rgba(144, 88, 144, 0.15);
}

.pro-text-field:focus {
    border: 1px solid #09c;
    background-color: rgba(144, 88, 144, 0.15);
}

.pro-text-field.units {
    margin-bottom: 0px;
    background-color: #fff;
    border-radius: 5px;
}

.pro-text-field.check {
    padding-left: 80px;
    font-size: 16px;
    line-height: 22px;
}

.pro-text-field.check:hover {
    background-color: transparent;
}

.form-block {
    width: 90%;
    margin-bottom: 10px;
}

.submit-button-pro {
    width: 100%;
    margin-top: 30px;
}

.submit-button-pro.button-cta-premium {
    margin-top: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-style: solid;
    border-color: #98d7ec;
    background-color: #98d7ec;
    box-shadow: 2px 3px 10px 5px rgba(0, 0, 0, 0.1);
    font-family: "Open Sans", sans-serif;
    color: #fff;
    font-weight: 400;
    text-transform: uppercase;
}

.submit-button-pro.button-cta-premium:hover {
    border-style: solid;
    border-color: #09c;
    background-color: transparent;
    box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.1);
    color: #09c;
}

.submit-button-pro.button-cta-premium.feedback {
    box-shadow: none;
    border-radius: 5px;
}

.submit-button-pro.button-cta-premium.welcome {
    display: block;
    width: 90%;
    margin: 10px auto;
    padding-top: 10px;
    box-shadow: none;
    -webkit-transition-duration: 200ms;
    transition-duration: 200ms;
    text-transform: none;
}

.submit-button-pro.button-cta-premium.welcome._2 {
    border-color: #09c;
    background-color: #fff;
    color: #09c;
}

.submit-button-pro.button-cta-premium.welcome._2:hover {
    border-color: #98d7ec;
    background-color: #98d7ec;
    color: #fff;
}

.pro-paragraph {
    display: block;
    width: auto;
    margin: 20px auto 0px;
    padding: 0px;
    font-family: "Open Sans", sans-serif;
    color: #09c;
    font-size: 12px;
    line-height: 1.3em;
    text-align: justify;
    letter-spacing: 0px;
}

.pro-link {
    padding-top: 0px;
    color: #905890;
    font-weight: 400;
    text-transform: none;
}

.pro-link:hover {
    color: purple;
    font-weight: 400;
}

.pro-checklist {
    width: 40%;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    text-align: left;
}

.pro-checklist.right {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 60%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    text-align: left;
}

.pro-checklist.right.free {
    display: block;
    width: 75%;
}

.pro-checklist.right.free.pro {
    width: 100%;
}

.pro-checkbox {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 0px 10px 0px 5px;
    float: left;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-align-content: space-around;
    -ms-flex-line-pack: distribute;
    align-content: space-around;
    -webkit-box-flex: 0;
    -webkit-flex: 0 6 16.67%;
    -ms-flex: 0 6 16.67%;
    flex: 0 6 16.67%;
    font-family: Fontawesome, sans-serif;
    color: #09c;
    font-size: 32px;
    line-height: 1em;
    font-weight: 100;
    text-align: left;
}

.pro-checkbox.free {
    margin-right: 15px;
    padding-right: 0px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-flex-basis: 10%;
    -ms-flex-preferred-size: 10%;
    flex-basis: 10%;
}

.pro-checklist-paragraph {
    display: block;
    width: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 0px;
    float: right;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-family: "Open Sans", sans-serif;
    color: #09c;
    font-size: 14px;
    line-height: 1.3em;
    text-align: justify;
    letter-spacing: 0px;
}

.pro-checklist-paragraph.last-item {
    padding-bottom: 5px;
}

.pro-checklist-paragraph.zh {
    font-size: 16px;
}

.text-span-pro {
    font-weight: 700;
    text-transform: uppercase;
}

.pro-sign-in {
    display: block;
    width: auto;
    margin: 5px auto 35px;
    padding: 0px;
    font-family: "Open Sans", sans-serif;
    color: #09c;
    font-size: 12px;
    line-height: 1.3em;
    text-align: justify;
    letter-spacing: 1px;
}

.sign-in-link {
    padding-top: 0px;
    color: #905890;
    font-weight: 400;
    text-decoration: none;
    text-transform: none;
}

.sign-in-link:hover {
    color: purple;
    font-weight: 400;
}

.signin-link {
    padding-top: 0px;
    color: #905890;
    font-weight: 400;
    text-decoration: none;
    text-transform: none;
}

.signin-link:hover {
    color: purple;
    font-weight: 400;
}

.error-message-2 {
    border-style: solid;
    border-width: 5px;
    border-color: orange;
    background-color: #fff;
    color: #000;
}

.host-text-link-top {
    position: relative;
    z-index: 2;
    display: block;
    width: 130px;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition: color 200ms ease;
    transition: color 200ms ease;
    font-family: 'Josefin Sans', sans-serif;
    color: #555;
    font-size: 14px;
    line-height: 19px;
    font-weight: 300;
    text-align: center;
    text-decoration: none;
}

.host-text-link-top:hover {
    color: #09c;
    font-weight: 300;
}

.footer-language-div {
    position: relative;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    overflow: hidden;
    width: 100%;
    height: 50px;
    border-style: solid none none;
    border-width: 1px;
    border-color: rgba(0, 153, 204, 0.4) rgba(0, 0, 0, 0.31) transparent;
}

.footer-lang-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 20px;
    margin-top: 15px;
    margin-bottom: 0px;
    padding-right: 150px;
    padding-left: 150px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.footer-language-link {
    display: block;
    margin-top: 0px;
    margin-bottom: 0px;
    padding-right: 0px;
    padding-left: 0px;
    -webkit-transition: color 300ms ease;
    transition: color 300ms ease;
    font-family: Muli, sans-serif;
    color: rgba(0, 0, 0, 0.31);
    font-size: 13px;
    line-height: 1.4em;
    font-weight: 400;
    text-align: right;
    letter-spacing: 0px;
    text-decoration: none;
}

.footer-language-link:hover {
    color: #0885af;
}

._3-4-tw-flex-parent {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 400px;
    min-height: 100%;
    margin-top: 5px;
    margin-bottom: 150px;
}

._3-4-tw-flex-parent.en {
    height: 100%;
}

._3-4-tw-side-divs {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border-style: solid none;
    border-width: 1px 2px;
    border-color: #09c;
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(152, 215, 236, 0.25)), to(rgba(152, 215, 236, 0.25)));
    background-image: linear-gradient(180deg, rgba(152, 215, 236, 0.25), rgba(152, 215, 236, 0.25));
}

._3-4-tw-side-divs.right {
    -webkit-box-flex: 0;
    -webkit-flex: 0 50%;
    -ms-flex: 0 50%;
    flex: 0 50%;
    background-image: url("/img/3-4-tw.jpg");
    background-position: 50% 50%;
    background-size: cover;
    background-repeat: no-repeat;
}

._3-4-tw-text {
    display: block;
    width: auto;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    padding: 0px 10% 5%;
    font-family: "Open Sans", sans-serif;
    color: #0885af;
    font-size: 17px;
    line-height: 1.7em;
    text-align: justify;
}

._3-4-tw-text.success {
    padding-top: 25px;
    padding-bottom: 25px;
    font-family: Fontawesome, sans-serif;
}

._3-4-tw-text.pro-cta {
    display: block;
    width: auto;
    margin-right: 15px;
    margin-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    float: none;
    clear: none;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    font-size: 18px;
    line-height: 18px;
    text-align: left;
}

._3-4-tw-text.pro-cta._30-day {
    float: none;
    clear: none;
    color: #dc2126;
    text-align: left;
    flex-flow: row;
    align-self: center;
    margin-right: 0;
    padding-left: 0;
    font-size: 16px;
    display: block;
}

._3-4-tw-text.pro-cta._30-day.black {
    color: #888;
    text-align: center;
    padding-top: 5px;
}

._3-4-tw-text.pro-cta._30-day.center {
    color: #e79705;
    text-align: center;
    margin-bottom: 30px;
}

._3-4-tw-text.donate {
    z-index: 1998;
    filter: drop-shadow(1px 1px 1px #000000b3);
    color: #ffffff;
    text-align: center;
    padding-bottom: 0%;
    padding-left: 5%;
    padding-right: 5%;
    font-size: 24px;
    line-height: 28px;
    position: static;
}

._3-4-tw-heading {
    margin-top: 0px;
    margin-bottom: 0px;
    padding-top: 20px;
    padding-bottom: 20px;
    box-shadow: none;
    font-family: "Josefin Sans", sans-serif;
    color: #09c;
    font-size: 32px;
    line-height: 1.4em;
    font-weight: 400;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

._3-4-tw-link {
    color: #905890;
    font-weight: 600;
    text-decoration: none;
    text-transform: none;
    cursor: pointer;
}

._3-4-tw-link:hover {
    color: purple;
}

._3-4-tw-link.sub {
    color: orange;
}

._3-4-tw-link.sub.pro-content {
    position: static;
    left: 0%;
    top: 0px;
    right: 0%;
    bottom: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-top: 0px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 24px;
    line-height: 36px;
    font-weight: 400;
    text-align: center;
}

._3-4-tw-link.blk {
    color: #000;
    font-weight: 400;
}

._3-4-tw-link.blk:hover {
    color: #fff;
    font-weight: 700;
}

.surf-spot-hero {
    height: 90vh;
}

.surf-spot-hero.surf-spot-tabs {
    height: auto;
    margin-top: 15px;
    border-style: none;
    border-width: 1px;
    border-color: #000 #000 #60b9cb;
}

.surf-spot-hero.surf-biz-tabs {
    height: auto;
    margin-top: 15px;
    border-style: none;
    border-width: 1px;
    border-color: #000 #000 #60b9cb;
}

.surf-spot-tabs {
    margin-top: 10px;
}

.surf-spot-hero-image {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 5px;
    padding: 0px 0px 5px 5px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-perspective: 2000px;
    perspective: 2000px;
}

.surf-spot-desc {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: auto;
    width: 30%;
    height: auto;
    max-height: 360px;
    min-height: 360px;
    min-width: 640px;
    margin-right: 15px;
    margin-left: 0px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-flex: 1;
    -webkit-flex: 1 2 67%;
    -ms-flex: 1 2 67%;
    flex: 1 2 67%;
    border-radius: 5px;
    background-image: -webkit-gradient(linear,
            left top,
            left bottom,
            from(#fff),
            to(#fff));
    background-image: linear-gradient(180deg, #fff, #fff);
    border: solid 1px #0099cc;
    text-align: center;
     -webkit-backface-visibility: hidden;
    backface-visibility: hidden;

}

.surf-spot-slide-1 {
    display: block;
    height: auto;
    margin-right: 35px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.surf-spot-des-text {
    margin-top: 0px;
    margin-bottom: 0px;
    padding-right: 35px;
    padding-left: 5px;
    font-family: "Josefin Sans", sans-serif;
    color: #777;
    font-size: 17px;
    line-height: 22px;
    font-weight: 300;
    text-align: justify;
    letter-spacing: 0.5px;
}

.surf-spot-des-text.surf-spot-text-2 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 25px 25px 20px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    font-family: Muli;
    color: #666;
    text-align: left;
}

.surf-spot-des-text.surf-spot-text-2.en-no-cam.sub {
    color: #fff;
    text-align: center;
}

.surf-desc-wrapper {
    position: relative;
}

.surf-desc-slider {
    display: block;
    height: auto;
    background-color: transparent;
}

.surf-spot-hero-div {
    display: block;
    width: 940px;
    margin-right: auto;
    margin-left: auto;
}

.surf-spot-flip-div-mobile {
    display: none;
    width: 30%;
    height: auto;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-align-content: space-between;
    -ms-flex-line-pack: justify;
    align-content: space-between;
    -webkit-box-flex: 0;
    -webkit-flex: 0 33%;
    -ms-flex: 0 33%;
    flex: 0 33%;
    border-radius: 5px;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    box-shadow: 4px 6px 15px 5px rgba(0, 0, 0, 0.1);
    -webkit-transition: box-shadow 300ms ease;
    transition: box-shadow 300ms ease;
    text-align: center;
}

.surf-spot-flip-div-mobile:hover {
    box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.1);
}

.spot-infographic {
    display: block;
    margin: 15px auto 20px;
    cursor: pointer;
}

.spot-desc-heading {
    margin-bottom: 0px;
    margin-top: 0px;
    padding-top: 20px;
    padding-left: 35px;
    box-shadow: none;
    font-family: "Josefin Sans", sans-serif;
    color: #09c;
    font-size: 20px;
    line-height: 24px;
    font-weight: 300;
    text-align: left;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.spot-desc-heading.blurb {
    margin-bottom: 20px;
}

.spot-desc-heading.inforgraphic {
    padding-left: 0px;
    text-align: center;
}

.spot-desc-heading.inforgraphic-dt {
    margin-top: 0px;
    padding-top: 20px;
    padding-left: 0px;
    text-align: center;
}

.spot-desc-heading.sub {
    padding-left: 0px;
    font-family: Muli;
    color: orange;
    font-size: 24px;
    font-weight: 700;
    text-align: center;
    letter-spacing: 1.5px;
    text-transform: none;
}

.spot-desc-heading.sub.tide {
    margin-top: 25px;
    padding-bottom: 10px;
}

.inforgraphic-link {
    position: relative;
    z-index: 2;
    display: block;
    width: 50%;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    padding-right: 20px;
    padding-bottom: 15px;
    float: right;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition: color 200ms ease;
    transition: color 200ms ease;
    font-family: Fontawesome, sans-serif;
    color: rgba(0, 153, 204, 0.55);
    font-size: 18px;
    line-height: 19px;
    font-weight: 300;
    text-align: right;
    letter-spacing: 1px;
    text-decoration: none;
    cursor: pointer;
}

.inforgraphic-link:hover {
    color: #09c;
    font-weight: 300;
}

.surf-spot-characteristics {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: auto;
    height: auto;
    margin-top: 10px;
    margin-right: 5px;
    margin-bottom: 15px;
    margin-left: 5px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1 2 67%;
    -ms-flex: 1 2 67%;
    flex: 1 2 67%;
    border-radius: 5px;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    border: solid 1px #0099cc;
    text-align: center;
}

.spot-char-text {
    display: block;
    width: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 3px 10px 0px;
    float: right;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-family: Muli, sans-serif;
    color: #666;
    font-size: 17px;
    line-height: 22px;
    font-weight: 300;
    text-align: center;
    letter-spacing: 0.5px;
}

.spot-char-flex-parent {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 15px;
    margin-bottom: 15px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border-style: none solid none none;
    border-width: 1px;
    border-color: #000 #60b9cb #000 #000;
}

.spot-char-flex-parent.last {
    border-right-style: none;
}

.spot-char-title {
    display: block;
    width: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 0px 15px 2px;
    float: right;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-family: "Open Sans", sans-serif;
    color: #09c;
    font-size: 17px;
    line-height: 22px;
    font-weight: 300;
    text-align: center;
    letter-spacing: 0.5px;
}

.spot-photo-slider {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: auto;
    height: auto;
    margin-top: 0px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    background-color: transparent;
}

.slider-arrow {
    height: 50px;
    margin-left: 0px;
    -webkit-transition: color 300ms ease;
    transition: color 300ms ease;
    color: hsla(0, 0%, 100%, 0.9);
}

.slider-arrow:hover {
    color: #fff;
}

.slider-arrow.right-arrow {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: auto;
    margin-top: 0px;
    margin-right: 9px;
    margin-bottom: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: rgba(96, 185, 203, 0.75);
    font-size: 16px;
    line-height: 15px;
    font-weight: 700;
}

.slider-arrow.right-arrow:hover {
    color: #fff;
    font-size: 20px;
}

.slider-arrow.left-arrow2 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 10px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: rgba(96, 185, 203, 0.75);
    font-size: 16px;
    line-height: 15px;
    font-weight: 700;
}

.slider-arrow.left-arrow2:hover {
    color: #fff;
    font-size: 20px;
}

.slider-arrow.left-arrow2:active {
    color: rgba(96, 185, 203, 0.65);
}

.slider-arrow.vid-rt {
    left: auto;
    top: 0%;
    right: 0%;
    bottom: 0%;
    margin-right: 0px;
    padding-right: 0px;
    text-align: center;
}

.slide {
    padding-top: 20px;
}

.slide.photos-400x600 {
    padding-top: 0px;
}

.slide.videos-360x640 {
    height: 100%;
    padding-top: 0px;
}

.spot-image {
    width: auto;
    height: 100%;
    max-width: 100%;
    margin-top: 0px;
    border: 1px none #fff;
    border-radius: 0px;
}

.surf-spot-photos {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 30%;
    height: auto;
    margin-right: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border-radius: 0px;
    text-align: center;
}

.spot-photos-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 15px;
    padding: 0px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.slide-nav-photos {
    display: none;
}

.surf-spot-characteristics-tablet {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: auto;
    height: auto;
    margin-right: 15px;
    margin-bottom: 35px;
    margin-left: 15px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1 2 67%;
    -ms-flex: 1 2 67%;
    flex: 1 2 67%;
    border-radius: 5px;
    background-image: -webkit-linear-gradient(270deg,
            hsla(0, 0%, 100%, 0.65),
            hsla(0, 0%, 100%, 0.65));
    background-image: linear-gradient(180deg,
            hsla(0, 0%, 100%, 0.65),
            hsla(0, 0%, 100%, 0.65));
    -webkit-transition: box-shadow 300ms ease;
    transition: box-shadow 300ms ease;
    text-align: center;
}

.infographic-popup {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 9999;
    display: none;
    height: 100%;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    background-image: -webkit-linear-gradient(270deg,
            rgba(0, 0, 0, 0.45),
            rgba(0, 0, 0, 0.45));
    background-image: linear-gradient(180deg,
            rgba(0, 0, 0, 0.45),
            rgba(0, 0, 0, 0.45));
    text-align: center;
}

.popup-image {
    display: block;
    width: 500px;
    height: 500px;
    margin-top: 0px;
    margin-right: auto;
    margin-left: auto;
}

.info-popup-div {
    position: absolute;
    left: 0px;
    top: 50%;
    right: 0px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 550px;
    height: 550px;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0px;
    padding-bottom: 0px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 5px;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    -webkit-transform: translate(0px, -50%);
    -ms-transform: translate(0px, -50%);
    transform: translate(0px, -50%);
}

.popup-close-link {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 0px;
    margin-right: 0px;
    padding: 10px;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-align-self: flex-end;
    -ms-flex-item-align: end;
    align-self: flex-end;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    font-family: Fontawesome, sans-serif;
    color: #a0e5ce;
    font-size: 24px;
    line-height: 24px;
    text-align: right;
    text-decoration: none;
    text-transform: uppercase;
}

.popup-close-link:hover {
    color: #98d7ec;
}

.popup-close-link.ad {
    position: relative;
    z-index: 9999;
    color: #60b9cb;
}

.popup-close-link.ad:hover {
    color: #98d7ec;
}

.inforgraphic-zoom {
    position: relative;
    z-index: 2;
    display: block;
    width: 50%;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    padding: 0px 0px 15px 20px;
    float: left;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: transparent;
    -webkit-transition: color 200ms ease;
    transition: color 200ms ease;
    font-family: Fontawesome, sans-serif;
    color: rgba(0, 153, 204, 0.55);
    font-size: 18px;
    line-height: 19px;
    font-weight: 300;
    text-align: left;
    letter-spacing: 1px;
    text-decoration: none;
}

.inforgraphic-zoom:hover {
    color: #09c;
    font-weight: 300;
}

.plug-300x250 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 250px;
    margin-bottom: 15px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    border: 1px none #09c;
    border-radius: 0px;
    background-image: -webkit-linear-gradient(270deg,
            hsla(0, 0%, 100%, 0.65),
            hsla(0, 0%, 100%, 0.65));
    background-image: linear-gradient(180deg,
            hsla(0, 0%, 100%, 0.65),
            hsla(0, 0%, 100%, 0.65));
    text-align: center;
}

.plug-300x250:hover {
    box-shadow: none;
}

.ad-300x150 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 150px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    border-radius: 5px;
    background-image: -webkit-linear-gradient(270deg,
            hsla(0, 0%, 100%, 0.65),
            hsla(0, 0%, 100%, 0.65));
    background-image: linear-gradient(180deg,
            hsla(0, 0%, 100%, 0.65),
            hsla(0, 0%, 100%, 0.65));
    text-align: center;
}

.ad-300x150:hover {
    box-shadow: none;
}

._2-ad-div-photos {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-right: 15px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.videos-photos-section {
    margin-top: 50px;
    margin-bottom: 0px;
}

.videos-photos-section.retail {
    margin-top: 20px;
}

.surf-spot-videos {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: auto;
    height: auto;
    margin-right: 0px;
    margin-left: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    border-radius: 0px;
    background-image: -webkit-linear-gradient(270deg,
            hsla(0, 0%, 100%, 0.65),
            hsla(0, 0%, 100%, 0.65));
    background-image: linear-gradient(180deg,
            hsla(0, 0%, 100%, 0.65),
            hsla(0, 0%, 100%, 0.65));
    text-align: center;
}

.ad-285x360-videos-desktop {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: auto;
    height: auto;
    margin-left: 15px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    border-radius: 5px;
    background-image: -webkit-gradient(linear,
            left top,
            left bottom,
            from(hsla(0, 0%, 100%, 0.65)),
            to(hsla(0, 0%, 100%, 0.65)));
    background-image: linear-gradient(180deg,
            hsla(0, 0%, 100%, 0.65),
            hsla(0, 0%, 100%, 0.65));
    text-align: center;
}

.ad-285x360-videos-desktop:hover {
    box-shadow: none;
}

.spot-video-slider {
    display: block;
    width: 640px;
    height: 360px;
    margin-top: 0px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    background-color: transparent;
    text-align: center;
}

.vid-arrow {
    width: 30px;
    height: 260px;
}

.spot-videos-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 15px;
    padding: 0px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.mid-page-banner {
    display: block;
    margin-right: auto;
    margin-left: auto;
}

.surf-spot-map-section {
    height: 425px;
    margin-top: 50px;
    margin-bottom: 100px;
}

.surf-spot-map-section.nomargin {
    margin-top: 5px;
    margin-bottom: 30px;
}

.sponsors-section-surf-spots {
    height: 235px;
    margin: 100px 75px;
    padding-top: 0px;
    padding-bottom: 0px;
    border-style: solid none;
    border-width: 1px;
    border-color: rgba(0, 0, 0, 0.2);
    text-align: center;
}

.sponsors-section-surf-spots.section-hosts-mobile {
    height: auto;
    margin-top: 100px;
    margin-bottom: 100px;
    border-style: none;
}

.html-embed {
    margin-bottom: 0px;
}

.html-embed.lazyload {
    margin-top: 0px;
}

.share-video-text-div {
    position: absolute;
    left: 0px;
    top: 28%;
    right: 0px;
    margin: 75px;
    padding: 0px;
    border-radius: 5px;
    background-image: -webkit-linear-gradient(270deg,
            hsla(0, 0%, 100%, 0.45),
            hsla(0, 0%, 100%, 0.45));
    background-image: linear-gradient(180deg,
            hsla(0, 0%, 100%, 0.45),
            hsla(0, 0%, 100%, 0.45));
    -webkit-transform: translate(0px, -50%);
    -ms-transform: translate(0px, -50%);
    transform: translate(0px, -50%);
}

.share-vid-text {
    display: inline-block;
    width: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 30px 35px 35px;
    float: right;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-family: Muli, sans-serif;
    color: rgba(0, 0, 0, 0.75);
    font-size: 17px;
    line-height: 22px;
    font-weight: 300;
    text-align: center;
    letter-spacing: 0.5px;
}

.ad-285x360-videos-mobile {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: auto;
    height: auto;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    border-radius: 5px;
    background-image: -webkit-linear-gradient(270deg,
            hsla(0, 0%, 100%, 0.65),
            hsla(0, 0%, 100%, 0.65));
    background-image: linear-gradient(180deg,
            hsla(0, 0%, 100%, 0.65),
            hsla(0, 0%, 100%, 0.65));
    text-align: center;
}

.ad-285x360-videos-mobile:hover {
    box-shadow: none;
}

.video-flex {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.video {
    position: relative;
    overflow: hidden;
    width: 100%;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    border-radius: 7px;
}

.video-embed {
    height: 0px;
    padding-bottom: 56.25%;
}

.video-heading {
    text-indent: 7px;
    top: 2px;
    margin-left: 2px;
    padding: 3px;
    padding-top: 6px;
    background: rgba(255, 255, 255, 0.65);
    position: absolute;
    z-index: 9999;
    margin-bottom: 0px;
    box-shadow: none;
    font-family: "Josefin Sans", sans-serif;
    color: #000000;
    font-size: 20px;
    line-height: 30px;
    font-weight: 300;
    text-align: left;
    letter-spacing: 1px;
    text-transform: uppercase;
    border-top-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.checklist-div {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 30px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.checklist-div.free {
    margin-bottom: 10px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.pro-link-plus {
    position: static;
    margin-right: 0px;
    padding-top: 0%;
    padding-bottom: 0%;
    text-align: center;
}

.drop-arrow-div {
    position: relative;
    right: 33%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    color: #fff;
    font-size: 24px;
    line-height: 24px;
    text-align: center;
    cursor: pointer;
}

.spots-tab-nav {
    background-color: transparent;
}

.spot-tab-link {
    position: static;
    width: 20%;
    height: 40px;
    padding: 11px 15px;
    border-style: solid;
    border-width: 1px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-color: rgba(0, 153, 204, 0.4) rgba(0, 153, 204, 0.4) #09c;
    background-image: -webkit-gradient(linear,
            left top,
            left bottom,
            from(#fff),
            to(#fff));
    background-image: linear-gradient(180deg, #fff, #fff);
    font-family: Muli, sans-serif;
    color: rgba(0, 153, 204, 0.4);
    font-size: 18px;
    line-height: 1em;
    font-weight: 300;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    cursor: pointer;
}

.spot-tab-link:hover {
    border-color: #09c;
    background-image: -webkit-gradient(linear,
            left top,
            left bottom,
            from(#fff),
            to(#fff));
    background-image: linear-gradient(180deg, #fff, #fff);
    color: #09c;
    font-weight: 600;
}

.spot-tab-link:focus {
    border-top-width: 1px;
    border-top-color: #09c;
    border-right-width: 1px;
    border-right-color: #09c;
    border-bottom-style: none;
    border-left-width: 1px;
    border-left-color: #09c;
    background-image: -webkit-gradient(linear,
            left top,
            left bottom,
            from(#fff),
            to(#fff));
    background-image: linear-gradient(180deg, #fff, #fff);
    color: #09c;
    font-weight: 600;
}

.spot-tab-link.w--current {
    position: static;
}

.spot-tab-link.info {
    margin-right: 25px;
    border-color: #09c;
    color: #09c;
}

.spot-tab-link.info:hover {
    border-color: #09c;
    background-image: -webkit-linear-gradient(270deg, #09c, #09c);
    background-image: linear-gradient(180deg, #09c, #09c);
    color: #fff;
}

.spot-tab-link.info:focus {
    border-bottom-style: solid;
    border-bottom-color: #09c;
    background-image: -webkit-linear-gradient(270deg, #09c, #09c);
    background-image: linear-gradient(180deg, #09c, #09c);
    color: #fff;
}

.spot-tab-link.info.last {
    margin-right: 0px;
}

.spot-tab-link.info.biz {
    width: 20%;
    height: 40px;
    margin-top: 0px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 5px;
}

.spot-tab-link.info.biz.none {
    border-color: #98d7ec;
    color: #98d7ec;
    cursor: default;
}

.spot-tab-link.info.biz.none:hover {
    background-color: transparent;
    background-image: none;
}

.spot-tab-link.info.biz.none:focus {
    background-color: transparent;
    background-image: none;
}

.spot-tab-link.info.list {
    margin-top: 0px;
    margin-right: 0px;
    border-style: none;
    font-size: 20px;
    line-height: 1.2em;
    text-transform: capitalize;
}

.spot-tab-link.info.list:hover {
    border-top-style: none;
    border-right-style: none;
    border-left-style: none;
    background-image: -webkit-gradient(linear,
            left top,
            left bottom,
            from(#fff),
            to(#fff));
    background-image: linear-gradient(180deg, #fff, #fff);
    color: #09c;
}

.spot-tab-link.info.list.bizness {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    background-image: none;
    color: #fff;
}

.spot-tab-link.info.list.none {
    color: rgba(0, 0, 0, 0.4);
}

.spot-tab-link.info.list.how-to {
    background-image: none;
    text-transform: none;
}

.spot-tab-link.info.list.how-to:hover {
    font-weight: 300;
}

.spot-tab-link.info.list.how-to:focus {
    color: #09c;
    font-weight: 300;
}

.spot-tab-link.info.list.trouble {
    width: auto;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-image: none;
    color: #333;
    font-size: 18px;
    letter-spacing: 1.5px;
}

.spot-tab-link.info.list.trouble:hover {
    font-weight: 300;
}

.spot-tab-link.biz {
    width: 33.33333333%;
}

.spot-tab-link.biz.en {
    padding-top: 10px;
    font-size: 20px;
}

.spot-menu {
    width: 100%;
    display: flex;
}

._2nd-click-close-cam-tab {
    position: absolute;
    z-index: 0;
    display: none;
    width: 100%;
    height: 100%;
}

.surf-report-flip-div {
    margin-right: 5px;
    margin-left: 15px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-perspective: 2000px;
    perspective: 2000px;
    -webkit-transition: -webkit-transform 1000ms ease;
    transition: -webkit-transform 1000ms ease;
    transition: transform 1000ms ease;
    transition: transform 1000ms ease, -webkit-transform 1000ms ease;
}

.surf-report-flip-div._2 {
    margin-right: 0px;
    margin-left: 0px;
}

.surf-spot-infographic-dt {
    display: block;
    width: auto;
    height: auto;
    max-height: 360px;
    min-height: 0px;
    padding-right: 0px;
    padding-left: 0px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-align-content: space-between;
    -ms-flex-line-pack: justify;
    align-content: space-between;
    -webkit-box-flex: 0;
    -webkit-flex: 0 33%;
    -ms-flex: 0 33%;
    flex: 0 33%;
    border-radius: 5px;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    border: solid 1px #0099cc;
    text-align: center;
}

.surf-spot-report-dt {
    position: absolute;
    left: 0px;
    top: 0px;
    right: 0px;
    display: block;
    width: auto;
    height: auto;
    max-height: none;
    min-height: 360px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-align-content: space-between;
    -ms-flex-line-pack: justify;
    align-content: space-between;
    -webkit-box-flex: 0;
    -webkit-flex: 0 33%;
    -ms-flex: 0 33%;
    flex: 0 33%;
    border-radius: 5px;
    border: 1px solid #0099cc;
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
    text-align: center;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.surf-spot-report-dt:hover {
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
}

.report-info-div {
    margin-top: -30px;
}

.report-info-link {
    position: relative;
    z-index: 2;
    display: block;
    width: 50%;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    padding-right: 25px;
    padding-bottom: 20px;
    float: right;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition: color 200ms ease;
    transition: color 200ms ease;
    font-family: Fontawesome, sans-serif;
    color: #fff;
    font-size: 18px;
    line-height: 19px;
    font-weight: 300;
    text-align: right;
    letter-spacing: 1px;
    text-decoration: none;
    cursor: pointer;
}

.report-info-link:hover {
    color: #09c;
    font-weight: 300;
}

.surf-spot-desc-cam-flip-div {
    max-height: 360px;
    max-width: 640px;
    width: 100%;
    -webkit-perspective: 2000px;
    perspective: 2000px;
    -webkit-transition: -webkit-transform 1000ms ease;
    transition: -webkit-transform 1000ms ease;
    transition: transform 1000ms ease;
    transition: transform 1000ms ease, -webkit-transform 1000ms ease;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.surf-spot-desc-cam-flip-div._2 {
    margin-left: 15px;
    margin-right: 5px;
}

.surf-spot-cam {
    position: absolute;
    left: 0px;
    top: 0px;
    right: 0px;
    z-index: -1;
    display: block;
    width: auto;
    height: auto;
    min-height: 360px;
    min-width: 640px;
    margin-right: 15px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-flex: 1;
    -webkit-flex: 1 2 67%;
    -ms-flex: 1 2 67%;
    flex: 1 2 67%;
    border-radius: 5px;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.2);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg);
    transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg);
    text-align: center;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.surf-spot-cam:hover {
    box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.1);
}

#iocloud_player,
#teacher_cs_test {
    height: 360px !important;
    width: 100%;
    overflow: hidden;
}

#iocloud_player [data-player],
#teacher_cs_test [data-player] {
    min-height: 360px !important;
    max-height: 360px !important;
    width: 100% !important;
}

#iocloud_player .container[data-container],
#teacher_cs_test .container[data-container] {
    top: 0;
}

.no-cam-div {
    display: block;
}

.no-cam-div-multispot {
    display: block;
    width: 25vw;
}

.button-host-cam {
    display: block;
    width: 50%;
    margin-top: 65px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 14px;
    padding-bottom: 12px;
    float: none;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border: 1px solid #98d7ec;
    border-radius: 2px;
    background-color: #0099cc;
    -webkit-transition: background-color 200ms ease, color 100ms ease;
    transition: background-color 200ms ease, color 100ms ease;
    font-family: "Josefin Sans", sans-serif;
    color: #fff;
    font-size: 20px;
    font-weight: 300;
    text-align: center;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.button-host-cam:hover {
    background-color: #fff;
    color: #60b9cb;
}

.button-host-cam.sub {
    text-transform: none;
}

.read-surf-report-popup {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 9999;
    display: block;
    height: 100%;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    background-image: -webkit-linear-gradient(270deg,
            rgba(0, 0, 0, 0.45),
            rgba(0, 0, 0, 0.45));
    background-image: linear-gradient(180deg,
            rgba(0, 0, 0, 0.45),
            rgba(0, 0, 0, 0.45));
    text-align: center;
}

.forecast-section {
    height: 480px;
    margin-top: 15px;
}

.forecast-section.blog {
    margin-top: 5px;
}

.forecast-section.blog._2 {
    background-image: url("/img/blog/02-cordoroys.jpg");
    background-position: 50% 65%;
    background-size: cover;
    background-repeat: no-repeat;
}

.forecast-section.blog._4 {
    background-image: url("/img/host.jpg");
    background-position: 104% 71%;
    background-size: cover;
    background-repeat: no-repeat;
}

.forecast-section.blog.giveaway {
    height: 415px;
}

.forecast-section.blog.etiquette {
    height: auto;
}

.container-forecast {
    border-radius: 5px;
    box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.2);
    border-top: none;
}

.forecast-day {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 5px;
    padding-right: 5px;
    font-size: 20px;
    font-weight: 600;
    text-align: left;
}

.forecast-tab-small-text {
    font-size: 17px;
    font-weight: 300;
    text-transform: none;
}

.desc {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 16%;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: right;
}

.desc-text {
    display: block;
    width: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 10px 5px;
    float: right;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-family: Muli, sans-serif;
    color: #666;
    font-size: 17px;
    line-height: 22px;
    font-weight: 300;
    text-align: right;
    letter-spacing: 0.5px;
}

.desc-text.multi {
    padding: 2px 3px 2px 0px;
    font-size: 15px;
    line-height: 18px;
    letter-spacing: 0px;
}

.desc-text.cell {
    text-align: left;
    flex: 0 auto;
    padding-left: 15px;
}

.hour-reading-text {
    display: block;
    width: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 10px;
    float: none;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-family: Muli, sans-serif;
    color: #666;
    font-size: 17px;
    line-height: 22px;
    font-weight: 600;
    text-align: center;
    letter-spacing: 0.5px;
}

.hour-reading-text.reading-text-white {
    padding-top: 10px;
    padding-bottom: 10px;
    color: #fff;
    font-weight: 300;
}

.hour-reading-text.reading-text-white._3-to-3-9 {
    background-image: -webkit-linear-gradient(270deg, #ccf, #ccf);
    background-image: linear-gradient(180deg, #ccf, #ccf);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

.hour-reading-text.reading-text-white._2-to-2-9 {
    background-image: -webkit-linear-gradient(270deg, #9cc, #9cc);
    background-image: linear-gradient(180deg, #9cc, #9cc);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

.hour-reading-text.reading-text-white._1-8 {
    background-image: -webkit-linear-gradient(270deg, #48ca48, #48ca48);
    background-image: linear-gradient(180deg, #48ca48, #48ca48);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

.hour-reading-text.reading-text-white._4 {
    background-image: -webkit-linear-gradient(270deg, #93d348, #93d348);
    background-image: linear-gradient(180deg, #93d348, #93d348);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

.hour-reading-text.reading-text-white._5-8 {
    background-image: -webkit-linear-gradient(270deg, #d3cc54, #d3cc54);
    background-image: linear-gradient(180deg, #d3cc54, #d3cc54);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

.hour-reading-text.reading-text-white._8 {
    background-image: -webkit-linear-gradient(270deg, #e4da2e, #e4da2e);
    background-image: linear-gradient(180deg, #e4da2e, #e4da2e);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

.hour-reading-text.reading-text-white._9-8 {
    background-image: -webkit-linear-gradient(270deg, #f2e512, #f2e512);
    background-image: linear-gradient(180deg, #f2e512, #f2e512);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

.hour-reading-text.reading-text-white.high-tide {
    background-image: -webkit-linear-gradient(270deg, #48ca48, #48ca48);
    background-image: linear-gradient(180deg, #48ca48, #48ca48);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

.hour-reading-text.reading-text-white.low-tide {
    background-image: -webkit-linear-gradient(270deg,
            rgba(255, 0, 0, 0.5),
            rgba(255, 0, 0, 0.5));
    background-image: linear-gradient(180deg,
            rgba(255, 0, 0, 0.5),
            rgba(255, 0, 0, 0.5));
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

.hour-reading-text.reading-text-white._1-to-1-4 {
    background-image: -webkit-linear-gradient(270deg, #66f, #66f);
    background-image: linear-gradient(180deg, #66f, #66f);
}

.hour-reading-text.reading-text-white._1-5-to-1-9 {
    background-image: -webkit-linear-gradient(270deg, #4dafc6, #4dafc6);
    background-image: linear-gradient(180deg, #4dafc6, #4dafc6);
}

.hour-reading-text.reading-text-black {
    padding-top: 10px;
    padding-bottom: 10px;
    color: #666;
    font-weight: 300;
}

.hour-reading-text.reading-text-black.time {
    font-weight: 600;
}

.forecast-flex-parent {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    float: none;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.forecast-reading {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 88%;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}

.metric {
    display: block;
    width: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 10px 5px;
    float: right;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    font-family: Muli, sans-serif;
    color: #09c;
    font-size: 17px;
    line-height: 22px;
    font-weight: 300;
    text-align: right;
    letter-spacing: 0.5px;
    text-decoration: underline;
    cursor: pointer;
}

.metric:hover {
    color: #98d7ec;
}

.metric.no-link {
    color: #666;
    cursor: default;
}

.arrow-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 0px 10px;
    float: none;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    font-family: Fontawesome, sans-serif;
    color: #666;
    font-size: 24px;
    line-height: 22px;
    font-weight: 600;
    text-align: center;
    letter-spacing: 0.5px;
}

.arrow-text._135 {
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

.arrow-text._180 {
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.arrow-text._90 {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.arrow-text._45 {
    -webkit-transform: rotate(190deg);
    -ms-transform: rotate(190deg);
    transform: rotate(190deg);
}

.arrow-text._70 {
    margin-top: 0px;
    -webkit-transform: rotate(200deg);
    -ms-transform: rotate(200deg);
    transform: rotate(200deg);
}

.arrow-text._120 {
    -webkit-transform: rotate(245deg);
    -ms-transform: rotate(245deg);
    transform: rotate(245deg);
}

.arrow-text._4 {
    -webkit-transform: rotate(160deg);
    -ms-transform: rotate(160deg);
    transform: rotate(160deg);
}

.arrow-text._6 {
    -webkit-transform: rotate(173deg);
    -ms-transform: rotate(173deg);
    transform: rotate(173deg);
}

.arrow-text._15 {
    -webkit-transform: rotate(185deg);
    -ms-transform: rotate(185deg);
    transform: rotate(185deg);
}

.arrow-text._16 {
    -webkit-transform: rotate(190deg);
    -ms-transform: rotate(190deg);
    transform: rotate(190deg);
}

.arrow-text._12 {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.arrow-text._3 {
    -webkit-transform: rotate(145deg);
    -ms-transform: rotate(145deg);
    transform: rotate(145deg);
}

.arrow-text._89 {
    -webkit-transform: rotate(215deg);
    -ms-transform: rotate(215deg);
    transform: rotate(215deg);
}

.arrow-text._88 {
    -webkit-transform: rotate(210deg);
    -ms-transform: rotate(210deg);
    transform: rotate(210deg);
}

.arrow-text._86 {
    -webkit-transform: rotate(205deg);
    -ms-transform: rotate(205deg);
    transform: rotate(205deg);
}

.arrow-text._82 {
    -webkit-transform: rotate(195deg);
    -ms-transform: rotate(195deg);
    transform: rotate(195deg);
}

.weather-text {
    display: block;
    width: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 10px;
    float: none;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-family: Weathericons, sans-serif;
    color: #666;
    font-size: 24px;
    line-height: 22px;
    font-weight: 400;
    text-align: center;
    letter-spacing: 0.5px;
}

.day-arrow-div {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.day-arrow {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 0px 5px 5px;
    float: none;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    font-family: Fontawesome, sans-serif;
    color: rgba(0, 153, 204, 0.4);
    font-size: 20px;
    line-height: 18px;
    font-weight: 600;
    text-align: center;
    letter-spacing: 0px;
}

.day-arrow:hover {
    color: #09c;
}

.day-arrow._70 {
    margin-top: 0px;
    -webkit-transform: rotate(200deg);
    -ms-transform: rotate(200deg);
    transform: rotate(200deg);
    color: #60b9cb;
}

.day-arrow._90 {
    -webkit-transform: rotate(205deg);
    -ms-transform: rotate(205deg);
    transform: rotate(205deg);
}

.day-arrow._92 {
    -webkit-transform: rotate(225deg);
    -ms-transform: rotate(225deg);
    transform: rotate(225deg);
}

.swipe-text.blog {
    font-family: Muli, sans-serif;
    color: #999;
}

.surf-report-char-div {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.surf-spot-characteristics-tablet-21 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: auto;
    height: auto;
    margin-right: 15px;
    margin-bottom: 35px;
    margin-left: 15px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1 2 67%;
    -ms-flex: 1 2 67%;
    flex: 1 2 67%;
    border-radius: 5px;
    background-image: -webkit-linear-gradient(270deg,
            hsla(0, 0%, 100%, 0.65),
            hsla(0, 0%, 100%, 0.65));
    background-image: linear-gradient(180deg,
            hsla(0, 0%, 100%, 0.65),
            hsla(0, 0%, 100%, 0.65));
    -webkit-transition: box-shadow 300ms ease;
    transition: box-shadow 300ms ease;
    text-align: center;
}

.report-info-link-mobile {
    position: relative;
    z-index: 2;
    display: block;
    width: 50%;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    padding-right: 15px;
    padding-bottom: 20px;
    float: right;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition: color 200ms ease;
    transition: color 200ms ease;
    font-family: Fontawesome, sans-serif;
    color: #fff;
    font-size: 18px;
    line-height: 19px;
    font-weight: 300;
    text-align: right;
    letter-spacing: 1px;
    text-decoration: none;
    cursor: pointer;
}

.report-info-link-mobile:hover {
    color: #09c;
    font-weight: 300;
}

.spot-infographic-tablet {
    display: block;
    margin: 15px auto 20px;
    cursor: pointer;
}

.plug-top-ban {
    width: 100%;
    max-width: none;
    margin-top: 2px;
    border: 2px none #fff;
    border-radius: 5px;
}

.plug-top-ban.slider {
    display: block;
    margin-right: auto;
    margin-left: auto;
}

.plug-top-ban.ph {
    display: none;
}

.text-block-7 {
    font-family: Fontawesome, sans-serif;
    font-size: 28px;
    font-weight: 400;
}

.popup-div {
    width: 100%;
}

.subscribe-button {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: auto;
    height: 43px;
    padding-top: 5px;
    padding-bottom: 5px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid #fff;
    background-color: transparent;
    -webkit-transition: color 300ms ease, background-color 300ms ease;
    transition: color 300ms ease, background-color 300ms ease;
    font-family: Muli, sans-serif;
    font-size: 15px;
    text-align: center;
    text-transform: uppercase;
}

.subscribe-button:hover {
    background-color: #fff;
    color: #a0e5ce;
}

.top-line {
    position: relative;
    left: 0px;
    top: 4px;
    right: 0px;
    display: none;
    width: 30px;
    height: 2px;
    margin-right: auto;
    margin-left: auto;
    background-image: -webkit-linear-gradient(270deg,
            hsla(0, 0%, 60%, 0.4),
            hsla(0, 0%, 60%, 0.4));
    background-image: linear-gradient(180deg,
            hsla(0, 0%, 60%, 0.4),
            hsla(0, 0%, 60%, 0.4));
}

.middle-line {
    position: relative;
    left: 0px;
    top: 13px;
    right: 0px;
    display: none;
    width: 30px;
    height: 2px;
    margin-right: auto;
    margin-left: auto;
    background-color: hsla(0, 0%, 60%, 0.4);
}

.bottom-line {
    position: relative;
    left: 0px;
    top: 23px;
    right: 0px;
    display: none;
    width: 30px;
    height: 2px;
    margin-right: auto;
    margin-left: auto;
    background-color: hsla(0, 0%, 60%, 0.4);
}

.name-banner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 60px;
    margin-top: -40px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-image: -webkit-linear-gradient(0deg, #09c, rgba(0, 153, 204, 0.5));
    background-image: linear-gradient(90deg, #09c, rgba(0, 153, 204, 0.5));
}

.name-banner.ad {
    height: 75px;
    margin-top: 15px;
    margin-bottom: 25px;
    background-image: -webkit-linear-gradient(0deg, #98d7ec, #a0e5ce);
    background-image: linear-gradient(90deg, #98d7ec, #a0e5ce);
}

.name-banner.shops {
    background-image: -webkit-linear-gradient(0deg,
            #e5b94b,
            rgba(229, 185, 75, 0.5));
    background-image: linear-gradient(90deg, #e5b94b, rgba(229, 185, 75, 0.5));
}

.name-banner.success {
    background-image: -webkit-linear-gradient(0deg,
            #60b9cb,
            rgba(0, 153, 204, 0.5));
    background-image: linear-gradient(90deg, #60b9cb, rgba(0, 153, 204, 0.5));
}

.name-banner.about {
    background-image: -webkit-linear-gradient(0deg, #98d7ec, #a0e5ce);
    background-image: linear-gradient(90deg, #98d7ec, #a0e5ce);
}

.name-banner.retail {
    background-image: -webkit-linear-gradient(0deg,
            #b46898,
            rgba(180, 104, 152, 0.5));
    background-image: linear-gradient(90deg, #b46898, rgba(180, 104, 152, 0.5));
}

.name-banner.surfboards {
    background-image: -webkit-linear-gradient(0deg,
            #acbd75,
            hsla(74, 35%, 60%, 0.5));
    background-image: linear-gradient(90deg, #acbd75, hsla(74, 35%, 60%, 0.5));
}

.name-banner.restaurants {
    background-image: -webkit-linear-gradient(0deg,
            #ed5665,
            rgba(237, 86, 101, 0.5));
    background-image: linear-gradient(90deg, #ed5665, rgba(237, 86, 101, 0.5));
}

.name-banner.blog {
    background-image: -webkit-linear-gradient(0deg, #008fff, #15c5a2);
    background-image: linear-gradient(90deg, #008fff, #15c5a2);
}

.name-banner.decathlon {
    background-image: -webkit-linear-gradient(0deg,
            #0198f1,
            rgba(0, 153, 204, 0.5));
    background-image: linear-gradient(90deg, #0198f1, rgba(0, 153, 204, 0.5));
}

.name-banner.blk {
    background-color: #000;
    background-image: -webkit-gradient(linear,
            left top,
            right top,
            from(#000),
            to(#8b8989));
    background-image: linear-gradient(90deg, #000, #8b8989);
}

.banner-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 0px;
    margin-bottom: 0px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    box-shadow: none;
    font-family: Muli, sans-serif;
    color: #fff;
    font-size: 28px;
    line-height: 34px;
    font-weight: 300;
}

.banner-title.center {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.banner-title.rt {
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.title-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 940px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
}

.title-container.pro {
    flex: 1;
    width: auto;
}

.marker-pin {
    border-style: none;
    border-width: 1px 1px 2px;
    border-color: #fff;
}

.marker-pin.header {
    height: 40px;
    cursor: pointer;
}

.marker-div {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
}

.marker-div.cog {
  position: relative;
  z-index: 4998;
}

.text-pop-parent {
    position: relative;
    display: none;
    height: 50px;
    margin-right: -30px;
    padding-right: 20px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
}

.text-pop-parent.cog {
  position: relative;
  left: 0%;
  top: auto;
  right: auto;
  bottom: 0%;
  z-index: 5000;
  display: none;
  height: auto;
  margin-top: 190px;
  margin-right: 20px;
  padding-top: 5px;
  padding-right: 0px;
  padding-bottom: 5px;
  clear: none;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-align-self: auto;
  -ms-flex-item-align: auto;
  -ms-grid-row-align: auto;
  align-self: auto;
  -webkit-box-flex: 0;
  -webkit-flex: 0 auto;
  -ms-flex: 0 auto;
  flex: 0 auto;
  border: 1px solid #09c;
  border-radius: 10px;
  background-color: hsla(0, 0%, 100%, 0.9);
}

.text-pop-child {
    position: static;
    display: block;
    margin-right: 0px;
    padding: 20px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    font-family: Muli, sans-serif;
    color: #fff;
    font-size: 18px;
    font-weight: 300;
    text-align: right;
    letter-spacing: 1.5px;
    text-decoration: none;
}

.text-pop-child.ad {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.text-pop-child.cog {
  padding-top: 5px;
  padding-bottom: 5px;
  color: #09c;
  font-size: 22px;
  line-height: 34px;
  font-weight: 400;
  text-align: left;
}

.section-payments {
    margin-top: 0px;
    margin-bottom: 50px;
}

.section-payments.margin {
    margin-top: 325px;
}

.section-payments.last {
    margin-bottom: 0px;
}

.container-payments {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 25px;
    padding-top: 0px;
    padding-bottom: 35px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid #98d7ec;
    text-align: left;
}

.container-payments.last {
    border-bottom-style: none;
}

.ad-type {
    width: 50%;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
}

.ad-type.right {
    text-align: right;
}

.ad-type.no-homepage {
    width: 100%;
}

.html-embed-ad {
    padding-top: 15px;
    padding-left: 15px;
}

.html-embed-ad.right {
    padding-right: 15px;
    float: right;
}

.view-ad-link {
    display: block;
    width: auto;
    margin-top: 5px;
    margin-bottom: 15px;
    padding: 0px;
    font-family: "Open Sans", sans-serif;
    color: #999;
    font-size: 14px;
    line-height: 1.3em;
    font-weight: 300;
    text-align: left;
    letter-spacing: 1px;
    text-decoration: none;
}

.view-ad-link:hover {
    color: #60b9cb;
}

.view-ad-link.right {
    text-align: right;
}

.header-fixed {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
}

._50-off-popup {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 9999;
    display: none;
    height: 100%;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    background-image: -webkit-linear-gradient(270deg,
            rgba(0, 0, 0, 0.45),
            rgba(0, 0, 0, 0.45));
    background-image: linear-gradient(180deg,
            rgba(0, 0, 0, 0.45),
            rgba(0, 0, 0, 0.45));
    text-align: center;
}

.discount-popup-div {
    position: absolute;
    left: 0px;
    top: 50%;
    right: 0px;
    display: block;
    width: 450px;
    height: auto;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0px;
    padding-bottom: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 5px;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    -webkit-transform: translate(0px, -50%);
    -ms-transform: translate(0px, -50%);
    transform: translate(0px, -50%);
}

.ad-size {
    display: block;
    width: auto;
    margin-top: 5px;
    margin-bottom: 5px;
    padding: 0px;
    font-family: "Open Sans", sans-serif;
    color: #000;
    font-size: 14px;
    line-height: 1.3em;
    font-weight: 300;
    text-align: left;
    letter-spacing: 1px;
    text-decoration: none;
}

.ad-size:hover {
    color: #000;
}

.ad-size.right {
    text-align: right;
}

.social-popup-div {
    position: fixed;
    left: 0px;
    right: auto;
    bottom: 5px;
    z-index: 9999;
    display: block;
    width: auto;
    height: auto;
}

.social-popup-button {
    position: fixed;
    left: 0px;
    right: auto;
    bottom: 0px;
    z-index: 9998;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 48px;
    height: 48px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-image: -webkit-linear-gradient(270deg,
            rgba(152, 215, 236, 0.4),
            rgba(152, 215, 236, 0.4));
    background-image: linear-gradient(180deg,
            rgba(152, 215, 236, 0.4),
            rgba(152, 215, 236, 0.4));
    opacity: 0.12;
    -webkit-transition: background-color 300ms ease;
    transition: background-color 300ms ease;
    cursor: pointer;
}

.social-popup-button:hover {
    background-image: -webkit-linear-gradient(270deg, #98d7ec, #98d7ec);
    background-image: linear-gradient(180deg, #98d7ec, #98d7ec);
    opacity: 1;
}

.social-text {
    display: none;
    padding: 9px 12px;
    font-family: Fontawesome, sans-serif;
    color: #fff;
    font-size: 20px;
    text-align: center;
}

.share-icon {
    padding: 10px;
    -webkit-filter: invert(100%);
    filter: invert(100%);
}

.social-share-to-top-div {
    display: block;
}

.biz-logo {
    display: block;
    width: 250px;
    height: 250px;
    cursor: default;
    border-radius: 7px;
    margin-top: 10px;
}

.biz-logo-div {
    display: block;
    width: auto;
    height: auto;
    max-height: none;
    min-height: 0px;
    padding-right: 0px;
    padding-left: 0px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-align-content: space-between;
    -ms-flex-line-pack: justify;
    align-content: space-between;
    -webkit-box-flex: 0;
    -webkit-flex: 0 33%;
    -ms-flex: 0 33%;
    flex: 0 33%;
    text-align: center;
}

.biz-desc {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 30%;
    height: auto;
    min-height: 0px;
    min-width: 0px;
    margin-left: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-flex: 1;
    -webkit-flex: 1 2 67%;
    -ms-flex: 1 2 67%;
    flex: 1 2 67%;
    text-align: center;
}

.surf-biz-hero-image {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 5px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-perspective: 2000px;
    perspective: 2000px;
}

.surf-biz-des-text {
    margin-top: 0px;
    margin-bottom: 0px;
    padding-right: 5px;
    padding-left: 5px;
    font-family: "Josefin Sans", sans-serif;
    color: #777;
    font-size: 17px;
    line-height: 22px;
    font-weight: 300;
    text-align: justify;
    letter-spacing: 0.5px;
}

.surf-biz-des-text.surf-biz-text-2 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-family: Muli, sans-serif;
    color: #666;
    text-align: left;
    margin-top: 10px;
    margin-bottom: 10px;
}

.surf-biz-des-text.surf-biz-text-2.success {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: #077397;
    text-align: center;
}

.surf-biz-des-text.surf-biz-text-2.about {
    display: block;
    padding: 20px 0px 0px;
    color: #888;
    line-height: 25px;
    text-align: left;
}

.surf-biz-des-text.surf-biz-text-2.about._34tw {
    padding-top: 5px;
    padding-bottom: 10px;
    color: #0099cc;
}

.surf-biz-des-text.surf-biz-text-2.about.bullet {
    padding-top: 5px;
    padding-left: 65px;
}

.surf-biz-des-text.surf-biz-text-2.about.bullet.tit {
    padding-top: 20px;
    padding-left: 50px;
}

.surf-biz-des-text.surf-biz-text-2.about.bullet.tit.pad {
    padding-top: 5px;
}

.surf-biz-des-text.surf-biz-text-2.about.bullet.pro {
    font-size: 14px;
}

.surf-biz-des-text.surf-biz-text-2.about.blog {
    padding-top: 0px;
    text-align: justify;
}

.surf-biz-des-text.surf-biz-text-2.about.blog.en {
    text-align: left;
}

.surf-biz-des-text.surf-biz-text-2.about.blog.en2 {
    text-align: left;
}

.surf-biz-des-text.surf-biz-text-2.about.blog.bott-pad {
    margin-bottom: 55px;
}

.surf-biz-des-text.surf-biz-text-2.about.blog.centered {
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
}

.surf-biz-des-text.surf-biz-text-2.about.center {
    text-align: center;
}

.surf-biz-des-text.surf-biz-text-2.about.indent {
    padding-left: 65px;
}

.surf-biz-des-text.surf-biz-text-2.about.indent.bott-pad {
    margin-bottom: 55px;
}

.surf-biz-des-text.surf-biz-text-2.about.indent.center.background {
    margin: 40px 110px;
    padding-top: 30px;
    padding-bottom: 30px;
    padding-left: 0px;
    border: 1px solid #09c;
    background-color: rgba(152, 215, 236, 0.05);
}

.surf-biz-des-text.surf-biz-text-2.about.indent.top-padding {
  padding-top: 10px;
}

.surf-biz-des-text.surf-biz-text-2.about.en {
    padding-left: 25px;
    color: #09c;
    font-size: 20px;
    font-weight: 700;
}

.surf-biz-des-text.surf-biz-text-2.about.scroll-text {
    overflow: auto;
}

.surf-biz-des-text.register {
    padding-right: 5px;
    font-family: Muli, sans-serif;
    color: #888;
    font-size: 16px;
    line-height: 18px;
}

.surf-biz-des-text.register.trouble {
    color: #09c;
}

.surf-biz-des-text.surf-biz-text-2.about.my-multi {
    margin-top: 20px;
    color: #888;
    font-size: 17px;
    line-height: 22px;
}

.surf-biz-des-text.surf-biz-text-2.my-multi {
    margin-top: 60px;
    padding-top: 0px;
    padding-bottom: 0px;
    color: #555;
    font-size: 17px;
    font-weight: 400;
}

.info-section {
    margin-top: 50px;
    padding-top: 5px;
}

.info-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.biz-tab-pane {
    display: block;
    border-top: 1px none #000;
}

.spot-tab-pane {
    display: block;
    border-top: 1px none #000;
}

.social-div {
    position: fixed;
    left: 0px;
    right: 0px;
    bottom: 130px;
    z-index: 9997;
    display: none;
    width: 40px;
    height: 120px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    border: 1px none #000;
}

.social-div.landing {
    position: relative;
    left: 0px;
    top: 200px;
    right: 0px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 20%;
    max-width: none;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.social-button {
    padding-right: 0px;
    text-align: center;
    text-decoration: none;
}

.feedback-popup {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 9998;
    display: none;
    height: 100%;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    text-align: center;
}

.feedback-popup-div {
    position: fixed;
    left: 0px;
    top: 50%;
    right: 0px;
    z-index: 1;
    display: block;
    overflow: scroll;
    width: 575px;
    max-height: 87%;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0px;
    padding-bottom: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 12px;
    background-image: -webkit-gradient(linear,
            left top,
            left bottom,
            from(#fff),
            to(#fff));
    background-image: linear-gradient(180deg, #fff, #fff);
    -webkit-transform: translate(0px, -50%);
    -ms-transform: translate(0px, -50%);
    transform: translate(0px, -50%);
}

.grsf-global .grsf-window {
    max-width: 575px !important;
}

.feedback-div-form {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.feedback-form-block {
    display: block;
    width: 90%;
    margin-right: auto;
    margin-bottom: 10px;
    margin-left: auto;
}

.feedback-form-block.units {
    width: 100%;
    margin-bottom: 0px;
    padding-left: 20px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
}

.feedback-field-label {
    width: 50%;
    margin-bottom: 2px;
    padding-top: 5px;
    font-family: "Open Sans", sans-serif;
    color: #09c;
    font-weight: 400;
    text-align: left;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.form-feedback {
    margin-bottom: 25px;
    float: none;
}

.feedback-paragraph {
    display: block;
    width: auto;
    margin: 9px auto 0px;
    padding: 10px 0px;
    font-family: "Open Sans", sans-serif;
    color: #666;
    font-size: 12px;
    line-height: 1.3em;
    text-align: justify;
    letter-spacing: 0px;
}

.captcha-html-embed {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-top: 25px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.captcha-html-embed.feedback-field-label.captcha {
    width: 100%;
    padding-top: 10px;
    padding-bottom: 8px;
    border: 1px solid #09c;
    text-align: center;
}

.modal-bg {
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
}

.modal-bg.help {
    background-color: #e0e0e0;
    width: 100%;
    height: 100%;
    display: block;
    position: static;
}

.modal-bg.cog {
  position: absolute;
  z-index: 4999;
  display: none;
  height: 100%;
  background-color: transparent;
  -o-object-fit: fill;
  object-fit: fill;
}

.close-button {
    position: fixed;
    top: 50px;
    right: 50px;
    z-index: 9999;
    display: block;
    width: 40px;
    height: 40px;
    padding-bottom: 0px;
    border: 2px solid #fff;
    border-radius: 5px;
    background-color: transparent;
    color: #fff;
    font-size: 19px;
    line-height: 37px;
    text-align: center;
    text-decoration: none;
}

.close-button.nav {
    position: static;
    top: 35px;
    right: 35px;
    float: right;
}

.close-button.blue {
    color: #09c;
    background-color: #fff;
    border-width: 1px;
    border-color: #09c;
    border-radius: 10px;
    padding-top: 2px;
    position: absolute;
    top: 20px;
    right: 80px;
}

.loader-parent {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 9998;
    display: none;
    width: 100%;
    height: 100%;
}

.loader {
    position: relative;
    z-index: 9998;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: auto;
    height: 100%;
    background-image: -webkit-linear-gradient(0deg, #98d7ec, #a0e5ce);
    background-image: linear-gradient(90deg, #98d7ec, #a0e5ce);
}

.loadersvg {
    display: block;
    margin-top: -50px;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}

.svg-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.preload-text {
    font-family: Muli, sans-serif;
    color: #fff;
    font-size: 18px;
    font-weight: 300;
    text-align: center;
    letter-spacing: 1px;
}

.welcome-modal {
    position: fixed;
    z-index: 9999;
    display: none;
    width: 100vw;
    height: 100vh;
    background-image: -webkit-linear-gradient(0deg, #98d7ec, #a0e5ce);
    background-image: linear-gradient(90deg, #98d7ec, #a0e5ce);
}

.modal {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100vw;
    height: 100vh;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.modal-card {
    position: fixed;
    left: 0px;
    top: 50%;
    right: 0px;
    bottom: auto;
    z-index: 1;
    display: block;
    overflow: auto;
    width: 500px;
    min-height: 500px;
    margin-right: auto;
    margin-left: auto;
    padding: 20px 12px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 5px;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    box-shadow: 4px 4px 10px 3px rgba(0, 0, 0, 0.2);
    -webkit-transform: translate(0px, -50%);
    -ms-transform: translate(0px, -50%);
    transform: translate(0px, -50%);
}

.welcome-paragraph {
    display: block;
    width: auto;
    margin: 0px auto;
    padding: 10px 25px;
    font-family: "Open Sans", sans-serif;
    color: #666;
    font-size: 1em;
    line-height: 1.5em;
    text-align: justify;
    letter-spacing: 0px;
}

.welcome-paragraph.en {
    line-height: 1.3em;
}

.left-arrow-ph {
    display: none;
    margin-top: -22px;
    margin-bottom: 54px;
    margin-left: -8px;
    padding-left: 0px;
}

.arrow-right-ph {
    display: none;
    width: 45px;
    margin-top: -22px;
    margin-bottom: 54px;
}

.forecast-embed {
    display: block;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}

.forecast-embed.ms {
    height: 470px;
}

.forecast-loader {
    position: relative;
    left: 0px;
    top: -575px;
    right: 0px;
    bottom: 0px;
    z-index: 9998;
    display: none;
    width: auto;
    height: 570px;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
}

.loader-fc {
    position: relative;
    z-index: 9998;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: auto;
    height: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    -webkit-transform: translate(0px, 225px);
    -ms-transform: translate(0px, 225px);
    transform: translate(0px, 225px);
}

.svg-fc {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.loadersvg-fc {
    display: block;
    margin-top: 0px;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}

.preload-text-fc {
    margin-top: 10px;
    font-family: Muli, sans-serif;
    color: #60b9cb;
    font-size: 18px;
    font-weight: 300;
    text-align: center;
    letter-spacing: 1px;
}

.amenities {
    margin-top: 25px;
    margin-bottom: 0px;
}

.amen-box {
    position: static;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 20%;
    height: 50px;
    margin-right: 25px;
    padding: 0px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid #98d7ec;
    border-radius: 5px;
    background-image: -webkit-gradient(linear,
            left top,
            left bottom,
            from(#fff),
            to(#fff));
    background-image: linear-gradient(180deg, #fff, #fff);
    font-family: Muli, sans-serif;
    color: #09c;
    font-size: 18px;
    line-height: 1em;
    font-weight: 300;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    cursor: default;
}

.amen-box:hover {
    border-color: #98d7ec;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    color: #09c;
}

.amen-box:focus {
    border-color: #98d7ec;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-style: none;
    border-left-width: 1px;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    color: #09c;
    font-weight: 300;
}

.amen-box.w--current {
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    color: rgba(0, 153, 204, 0.4);
}

.amen-box.lastbox {
    margin-right: 0px;
}

.amen-box.yes {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-width: 2px;
    border-color: #09c;
    color: #09c;
}

.text-amen {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: #98d7ec;
}

.text-amen.yes {
    color: #09c;
}

.amen-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 940px;
    margin-right: auto;
    margin-bottom: 25px;
    margin-left: auto;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.hidden-add {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 940px;
    margin-top: 25px;
    margin-right: auto;
    margin-left: auto;
}

.hidden-add.ios {
    display: none;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.hidden {
    position: static;
    width: 100%;
    height: 50px;
    padding: 16px 15px;
    border: 1px solid #09c;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    font-family: Fontawesome, sans-serif;
    color: #09c;
    font-size: 18px;
    line-height: 1em;
    font-weight: 300;
    text-align: center;
    text-decoration: none;
    text-transform: none;
    cursor: pointer;
    border-radius: 5px;
}

.hidden:hover {
    border-color: #09c;
    background-image: -webkit-linear-gradient(270deg, #09c, #09c);
    background-image: linear-gradient(180deg, #09c, #09c);
    color: #fff;
}

.hidden:focus {
    border-top-width: 1px;
    border-top-color: #09c;
    border-right-width: 1px;
    border-right-color: #09c;
    border-bottom-style: solid;
    border-left-width: 1px;
    border-left-color: #09c;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    color: #09c;
    font-weight: 300;
}

.hidden.w--current {
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    color: #09c;
}

.hidden.w--current:hover {
    background-color: #09c;
    color: #fff;
}

.hidden.no-pointer {
    font-weight: 100;
    cursor: default;
}

.hidden.no-pointer:hover {
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    color: #09c;
}

.hidden.success {
    display: block;
    width: 40%;
    margin-right: auto;
    margin-left: auto;
    border-color: #60b9cb;
    background-color: transparent;
    background-image: none;
    color: #60b9cb;
    font-weight: 600;
}

.hidden.success:hover {
    padding-top: 15px;
    padding-bottom: 15px;
    border-width: 2px;
    background-color: transparent;
    background-image: none;
    color: #50a5b6;
}

.hidden.ios {
    border-style: none;
    border-color: transparent;
    font-family: Muli, sans-serif;
    color: #888;
    font-size: 17px;
    line-height: 25px;
    letter-spacing: 0.5px;
}

.hidden.ios:hover {
    background-color: transparent;
    background-image: none;
}

.hidden.ios:visited {
    border-color: transparent;
}

.hidden-ph {
    display: none;
    width: 940px;
    margin-top: 25px;
    margin-right: auto;
    margin-left: auto;
}

.hidden-ph.success {
    display: block;
    margin-top: 0px;
}

.hidden-email {
    display: none;
    width: 940px;
    margin-top: 25px;
    margin-right: auto;
    margin-left: auto;
}

.success-hero {
    margin-top: 5px;
    margin-bottom: 0px;
    background-image: -webkit-gradient(linear,
            left top,
            left bottom,
            from(hsla(0, 0%, 100%, 0.5)),
            to(hsla(0, 0%, 100%, 0.5))),
        url("/img/success1.jpg");
    background-image: linear-gradient(180deg,
            hsla(0, 0%, 100%, 0.5),
            hsla(0, 0%, 100%, 0.5)),
        url("/img/success1.jpg");
    background-position: 0px 0px, 50% 50%;
    background-size: auto, cover;
    background-repeat: repeat, no-repeat;
}

.info {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: auto;
    margin-top: 25px;
    margin-bottom: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
}

.success-div {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    background-image: -webkit-linear-gradient(270deg,
            rgba(152, 215, 236, 0.69),
            rgba(152, 215, 236, 0.69));
    background-image: linear-gradient(180deg,
            rgba(152, 215, 236, 0.69),
            rgba(152, 215, 236, 0.69));
}

.success-div.success-right {
    -webkit-box-flex: 0;
    -webkit-flex: 0 50%;
    -ms-flex: 0 50%;
    flex: 0 50%;
    border-top: 1px solid #09c;
    border-right: 2px none #000;
    border-bottom: 1px solid #09c;
    background-image: url('/img/success2.jpg');
    background-position: 50% 50%;
    background-size: cover;
    background-repeat: no-repeat;
}

.success-div.success-right.sub {
    background-image: url('/img/success-sub.jpg');
    background-position: 45% 50%;
    background-size: cover;
    background-repeat: no-repeat;
}

.hidden-subscribe {
    display: none;
}

.hidden-subscribe-footer {
    display: none;
}

.about-hero {
    margin-top: 0px;
    margin-bottom: 0px;
    padding-bottom: 35px;
    border-style: none none solid;
    border-width: 0.5px;
    border-color: #09c;
    text-align: justify;
}

.about-hero.bg {
    background-image: -webkit-gradient(linear,
            left top,
            left bottom,
            from(rgba(96, 185, 203, 0.05)),
            to(rgba(96, 185, 203, 0.05)));
    background-image: linear-gradient(180deg,
            rgba(96, 185, 203, 0.05),
            rgba(96, 185, 203, 0.05));
}

.about-hero.last {
    border-bottom-style: none;
}

.host-popup {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 9998;
    display: none;
    height: 100%;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    text-align: center;
}

.host-paragraph {
    display: block;
    width: auto;
    margin: 9px auto 0px;
    padding: 10px 0px;
    font-family: "Open Sans", sans-serif;
    color: #666;
    font-size: 14px !important;
    line-height: 1.3em;
    text-align: justify;
    letter-spacing: 0px;
}

.list-popup {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 9998;
    display: none;
    height: 100%;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    text-align: center;
}

.list-popup.sms {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

.ad-popup {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 9998;
    display: none;
    height: 100%;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    text-align: center;
}

.ad-popup.cancel {
    display: none;
}

.footer-image {
    height: 400px;
    min-height: 100%;
    margin-top: 5px;
    margin-bottom: 150px;
    background-image: url("/img/about-foot.jpg");
    background-position: 50% 50%;
    background-size: cover;
    background-repeat: no-repeat;
}

.footer-image.lazyload {
    margin-bottom: 125px;
    background-position: 0px 50%;
}

.footer-image.account {
    -webkit-filter: saturate(0%);
    filter: saturate(0%);
}

.footer-image._3-percent {
  border-top: 1px solid #09c;
  border-bottom: 1px solid #09c;
  opacity: 1;
  background-image: linear-gradient(0deg, #00000059 10%, #fff3), url('/img/3-4-tw-banner.jpg');
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  border-radius: 20px;
  flex-flow: column;
  justify-content: space-between;
  margin-bottom: 15px;
  margin-left: 15px;
  margin-right: 15px;
  padding-bottom: 30px;
  padding-left: 40px;
  padding-right: 40px;
  display: flex;
}

.form-ad {
    margin-bottom: 25px;
    float: none;
}

.form-ad.units {
    margin-bottom: 0px;
}

.form-list {
    margin-bottom: 25px;
    float: none;
}

.form-host {
    margin-bottom: 25px;
    float: none;
}

.top {
    display: none;
}

.spot-tab-link-phone {
    position: static;
    width: 20%;
    height: 40px;
    padding: 11px 15px;
    border-style: solid;
    border-width: 1px;
    border-color: rgba(0, 153, 204, 0.4) rgba(0, 153, 204, 0.4) #09c;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    font-family: Muli, sans-serif;
    color: rgba(0, 153, 204, 0.4);
    font-size: 18px;
    line-height: 1em;
    font-weight: 300;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    cursor: pointer;
}

.spot-tab-link-phone:hover {
    border-color: #09c;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    color: #09c;
}

.spot-tab-link-phone:focus {
    border-top-width: 1px;
    border-top-color: #09c;
    border-right-width: 1px;
    border-right-color: #09c;
    border-bottom-style: none;
    border-left-width: 1px;
    border-left-color: #09c;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    color: #09c;
    font-weight: 300;
}

.spot-tab-link-phone.w--current {
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    color: #09c;
}

.spot-tab-link-ph {
    position: static;
    width: 20%;
    height: 40px;
    padding: 11px 15px;
    border-style: solid;
    border-width: 1px;
    border-color: rgba(0, 153, 204, 0.4) rgba(0, 153, 204, 0.4) #09c;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    font-family: Muli, sans-serif;
    color: rgba(0, 153, 204, 0.4);
    font-size: 18px;
    line-height: 1em;
    font-weight: 300;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    cursor: pointer;
}

.spot-tab-link-ph.zh {
    position: static;
    width: 20%;
    height: 40px;
    padding: 11px 15px;
    border-style: solid;
    border-width: 1px;
    border-color: rgba(0, 153, 204, 0.4) rgba(0, 153, 204, 0.4) #09c;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    font-family: Muli, sans-serif;
    color: rgba(0, 153, 204, 0.4);
    font-size: 18px;
    line-height: 1em;
    font-weight: 300;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    cursor: pointer;
    margin-top: 0px !important;
}

.spot-tab-link-ph:hover {
    border-color: #09c;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    color: #09c;
}

.spot-tab-link-ph:focus {
    border-top-width: 1px;
    border-top-color: #09c;
    border-right-width: 1px;
    border-right-color: #09c;
    border-bottom-style: none;
    border-left-width: 1px;
    border-left-color: #09c;
    background-image: -webkit-linear-gradient(270deg, #fff, #fff);
    background-image: linear-gradient(180deg, #fff, #fff);
    color: #09c;
    font-weight: 300;
}

.spot-tab-link-ph.w--current {
    border-color: #09c;
    background-image: -webkit-gradient(linear,
            left top,
            left bottom,
            from(#fff),
            to(#fff));
    background-image: linear-gradient(180deg, #fff, #fff);
    color: #09c;
    font-weight: 600;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    margin-top: 2px;
}

.surf-spot-cam-ph {
    z-index: 6;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: auto;
    width: 30%;
    height: auto;
    max-height: 360px;
    min-height: 360px;
    min-width: 640px;
    margin-right: 15px;
    margin-left: 0px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-flex: 1;
    -webkit-flex: 1 2 67%;
    -ms-flex: 1 2 67%;
    flex: 1 2 67%;
    border-radius: 5px;
    background-image: -webkit-gradient(linear,
            left top,
            left bottom,
            from(#fff),
            to(#fff));
    background-image: linear-gradient(180deg, #fff, #fff);
    text-align: center;
     -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.host-flex-parent {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 400px;
    min-height: 100%;
    margin-top: 5px;
    margin-bottom: 0px;
}

.host-div {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    background-image: -webkit-linear-gradient(270deg,
            rgba(152, 215, 236, 0.69),
            rgba(152, 215, 236, 0.69));
    background-image: linear-gradient(180deg,
            rgba(152, 215, 236, 0.69),
            rgba(152, 215, 236, 0.69));
}

.host-div.host-right {
    -webkit-box-flex: 0;
    -webkit-flex: 0 50%;
    -ms-flex: 0 50%;
    flex: 0 50%;
    background-image: url("/img/host.jpg");
    background-position: 100% 50%;
    background-size: cover;
    background-repeat: no-repeat;
}

.footer-image-ph {
    height: 400px;
    min-height: 100%;
    margin-top: 5px;
    margin-bottom: 150px;
    background-image: url("/img/about-foot.jpg");
    background-position: 50% 50%;
    background-size: cover;
    background-repeat: no-repeat;
}

.surf-report-div {
    display: block;
    overflow: visible;
    margin: 0 auto 0px 10px;
    cursor: pointer;
}

.surf-report-div.my-multi {
    width: 240px;
    height: 320px;
    margin-top: 0px;
    margin-left: auto;
}

.surf-report-div.my-multi.forecast {
  width: auto;
  height: auto;
  max-width: 940px;
}

.surf-report-embed {
    overflow: visible;
    float: none;
}

.hidden-list-1 {
    display: none;
    width: 940px;
    margin-top: 25px;
    margin-right: auto;
    margin-left: auto;
}

.hidden-list-2 {
    display: none;
    width: 940px;
    margin-top: 25px;
    margin-right: auto;
    margin-left: auto;
}

.list-section {
    margin-top: 50px;
}

.list-section.forecast {
    margin-bottom: 50px;
}

.list-section.wk-wave-vid {
    margin-top: 5px;
    border-top: 2px none #fff;
}

.list-section.wk-wave-vid.wind-model.mobile {
    display: none;
}

.list-section.blog {
    margin-top: 0px;
}

.list-section.row2 {
    margin-top: 0px;
}

.list-section.how-to {
    margin-top: 0px;
}

.list-section.vids {
    margin-top: 25px;
}

.list-section.vids-ph {
    margin-top: 25px;
}

.list-section.vids-ph.login {
    margin-top: 75px;
}

.list-section.vids-ph.pro24 {
  display: flex;
}

.list-pulldowns {
    text-align: center;
}

.list-pulldowns.biz {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-left: 2px;
    padding-right: 2px;
}

.list-pulldowns.how-to {
    line-height: 10px;
}

.list {
    width: 50%;
}

.list.biz {
    width: 100%;
}

.list.how-to {
    width: 100%;
}

.list.trouble {
    display: block;
    width: 100%;
    margin-top: 0px;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
}

.dropdown-toggle-list {
    width: 100%;
    padding-bottom: 10px;
    padding-left: 0px;
    border-bottom: 1px solid #999;
}

.dropdown-toggle-list:hover {
    padding-bottom: 9px;
    border-bottom-width: 2px;
    border-bottom-color: #09c;
}

.dropdown-toggle-list:active {
    padding-bottom: 9px;
    border-bottom-width: 2px;
    border-bottom-color: #09c;
}

.dropdown-toggle-list:focus {
    padding-bottom: 9px;
    border-bottom-width: 2px;
    border-bottom-color: #09c;
}

.dropdown-toggle-list.biz {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-top: 10px;
    padding-bottom: 9px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom-color: #fff;
    border: solid 1px #fff;
    border-radius: 5px;
}

.dropdown-toggle-list.biz:hover {
    border-bottom-width: 1px;
}

.dropdown-toggle-list.biz.shops {
    border-bottom-style: solid;
    border-bottom-color: #fff;
    background-image: -webkit-linear-gradient(270deg, #e5b94b, #e5b94b);
    background-image: linear-gradient(180deg, #e5b94b, #e5b94b);
}

.dropdown-toggle-list.biz.shops:hover {
    padding-bottom: 9px;
    border-bottom-style: solid;
    border-bottom-width: 1px;
}

.dropdown-toggle-list.biz.retail {
    background-image: -webkit-linear-gradient(270deg, #b46898, #b46898);
    background-image: linear-gradient(180deg, #b46898, #b46898);
}

.dropdown-toggle-list.biz.boards {
    background-image: -webkit-linear-gradient(270deg, #acbd75, #acbd75);
    background-image: linear-gradient(180deg, #acbd75, #acbd75);
}

.dropdown-toggle-list.biz.boards.teal {
  margin-top: 20px;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#98d7ec), to(#98d7ec));
  background-image: linear-gradient(180deg, #98d7ec, #98d7ec);
}

.dropdown-toggle-list.biz.cafe {
    background-image: -webkit-linear-gradient(270deg, #ed5665, #ed5665);
    background-image: linear-gradient(180deg, #ed5665, #ed5665);
}

.dropdown-toggle-list.biz.trouble {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-top: 8px;
    padding-right: 0px;
    padding-bottom: 7px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-align-content: space-around;
    -ms-flex-line-pack: distribute;
    align-content: space-around;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    border-style: solid;
    border-width: 1px;
    border-color: red;
}

.dropdown-toggle-list.biz.trouble:hover {
    border-color: red;
    background-color: transparent;
}

.dropdown-toggle-list.biz.trouble:active {
    border-color: red;
    background-color: transparent;
}

.dropdown-toggle-list.biz.trouble:focus {
    border-color: red;
}

.dropdown-toggle-list.none:hover {
    padding-bottom: 10px;
    border-bottom: 1px solid #999;
}

.dropdown-toggle-list.how-to {
  border-radius: 10px;
  padding-top: 15px;
  padding-bottom: 15px;
}

.dropdown-toggle-list.how-to:hover {
  background-color: #0099cc1a;
  padding-bottom: 14px;
}

.dropdown-toggle-list.how-to:focus {
  padding-bottom: 14px;
}

.dropdown-toggle-list.how-to.visited {
  background-color: #F5F5F5;
}

.footer-link-plus-list-1 {
    color: #999;
}

.footer-link-plus-list-1.biz {
    color: #fff;
}

.list-link {
    display: block;
    width: 80%;
    margin-right: auto;
    margin-left: auto;
    padding-top: 1px;
    padding-bottom: 1px;
    border-style: none none solid;
    border-width: 1px;
    border-color: #000 #000 #999;
    -webkit-transition: color 200ms ease;
    transition: color 200ms ease;
    font-family: Muli, sans-serif;
    color: #09c;
    font-size: 18px;
    line-height: 1.8em;
    font-weight: 400;
    text-align: center;
    text-decoration: none;
}

.list-link:hover {
    padding-bottom: 0px;
    border-bottom-width: 2px;
    color: #09c;
    font-weight: 400;
}

.list-link.search {
    width: auto;
    margin-right: 0px;
    margin-left: 0px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    border-bottom-style: none;
    font-family: Muli, sans-serif;
    color: #999;
    font-size: 16px;
    font-weight: 100;
    text-align: left;
    cursor: default;
}

.list-link.search.arrow {
    width: auto;
    margin-right: 0px;
    margin-left: 0px;
    padding-right: 10px;
    font-family: Fontawesome, sans-serif;
    color: #09c;
}

.list-link.search.arrow._3-4-tw {
  padding-left: 10px;
  padding-right: 0;
}

.list-link.search.arrow.rt {
    padding-right: 0px;
    padding-left: 10px;
}

.list-link.search.rt:hover {
    padding-bottom: 1px;
}

.list-link.search.blog:hover {
    padding-bottom: 1px;
}

.list-link.search.blog.center {
    padding-left: 10px;
    cursor: pointer;
}

.list-link.search.blog._3-col {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.list-link.search.blog2 {
    padding-top: 45px;
    text-align: center;
}

.list-link.search.blog2:hover {
    padding-bottom: 1px;
}

.list-link.search.blog2.center {
    padding-left: 10px;
}

.list-link.search.en {
    color: #888;
    font-size: 17px;
    line-height: 25px;
    font-weight: 300;
    letter-spacing: 0px;
}

.list-link.ad-text {
    width: auto;
    margin-right: 0px;
    margin-left: 0px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    border-bottom-style: none;
    font-family: Muli, sans-serif;
    color: rgba(0, 0, 0, 0.35);
    font-size: 12px;
    font-weight: 100;
    text-align: left;
    cursor: default;
}

.list-link.ad-text:hover {
    padding-bottom: 1px;
}

.list-link.ad-text.arrow {
    width: auto;
    margin-right: 0px;
    margin-left: 0px;
    padding-right: 10px;
    font-family: Fontawesome, sans-serif;
    color: #09c;
}

.list-link.ad-text.arrow.rt {
    padding-right: 0px;
    padding-left: 10px;
}

.list-dropdown {
    position: relative;
    display: block;
    overflow: hidden;
    height: 0px;
    background-color: transparent;
}

.list-dropdown.how-to {
    padding-left: 30px;
}

.footer-link-plus-list-2 {
    color: #999;
}

.footer-link-plus-list-3 {
    color: #999;
}

.footer-link-plus-list-4 {
    color: #999;
}

.footer-link-plus-list-5 {
    color: #999;
}

.footer-link-plus-list-dir {
    color: #999;
}

.search {
    display: block;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.search.blog {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.direction-list {
    display: block;
    width: 80%;
    margin-right: auto;
    margin-left: auto;
}

.city-list {
    display: block;
    width: 80%;
    margin-right: auto;
    margin-left: auto;
}

.footer-link-plus-list-city {
    color: #999;
}

.list-info {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 50%;
    float: left;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.list-info.right {
    float: right;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.list-info.right.blogr {
    width: 55%;
}

.list-info.right.center {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.list-info.blog {
    width: 45%;
}

.list-info.blog.center._2 {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.list-info.blog.center._2.pro {
    display: block;
    width: 100%;
    margin-top: 15px;
    padding-top: 25px;
    padding-bottom: 25px;
    float: none;
    background-image: -webkit-gradient(linear,
            left top,
            right top,
            from(#98d7ec),
            to(#a0e5ce));
    background-image: linear-gradient(90deg, #98d7ec, #a0e5ce);
    text-align: center;
    text-decoration: none;
}

.list-info.blog.rt {
    width: 100%;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.list-info.blog._3-col {
    width: 33.33333333%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
}

.cam-name-div {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    background-image: -webkit-linear-gradient(270deg, #09c, #09c);
    background-image: linear-gradient(180deg, #09c, #09c);
}

.cam-name-div.soon {
    -webkit-filter: saturate(0%);
    filter: saturate(0%);
    cursor: default;
}

.cam-name-div.related {
    border-radius: 5px;
}

.cam-name-div.vid {
    height: 45px;
    padding-bottom: 3px;
    padding-left: 15px;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.cam-name-div.blog {
    height: 50px;
}

.cs-banner {
    position: relative;
    bottom: 40px;
    height: 440px;
    margin-top: 10px;
}

.cs-container {
    height: 440px;
    margin-top: 0px;
    margin-bottom: -70px;
}

.cs-text {
    position: relative;
    bottom: 55px;
    display: block;
    width: 100%;
    margin-right: auto;
    margin-bottom: 35px;
    margin-left: auto;
    padding: 0px;
    font-family: "Open Sans", sans-serif;
    color: #0885af;
    font-size: 20px;
    line-height: 1.3em;
    text-align: center;
}

.sup-section {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 200px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.image {
    margin-right: 0px;
}

.sup-div {
    width: 20%;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
}

._404-text {
    position: relative;
    z-index: 1000;
    color: #60b9cb;
    font-size: 300px;
}

.plugspon-link {
    text-decoration: none;
}

.nav-map {
    position: static;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 37px;
    margin-top: 0px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.nav-map.rt {
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
}

.nav-map-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    margin-left: 10px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    font-family: Fontawesome, sans-serif;
    color: hsla(0, 0%, 60%, 0.4);
    font-size: 30px;
    cursor: pointer;
}

.nav-map-text:hover {
    color: #98d7ec;
}

.nav-map-text.sidemap {
    position: fixed;
    left: 0px;
    right: 0px;
    bottom: 50px;
    z-index: 9998;
    display: inline-block;
    width: 40px;
    height: auto;
    margin-left: 0px;
    padding-right: 8px;
    padding-left: 8px;
    background-color: transparent;
    opacity: 1;
    -webkit-transition: background-color 300ms ease;
    transition: background-color 300ms ease;
    color: #98d7ec;
    font-size: 20px;
    font-weight: 700;
    text-decoration: none;
}

.nav-map-text.sidemap:hover {
    border-color: #09c;
    color: #09c;
}

.nav-map-text.sidemap.scroll-to-top {
    z-index: 9997;
    display: none;
    height: 40px;
    padding-top: 8px;
    padding-bottom: 8px;
    border-color: #a0e5ce;
    opacity: 0;
    color: #a0e5ce;
}

.nav-map-text.sidemap.scroll-to-top:hover {
    border-color: #09c;
    color: #09c;
}

.nav-map-text {
    text-decoration: none;
}

.free-text {
    display: block;
    width: auto;
    margin: 25px 0px;
    padding: 0px;
    font-family: "Open Sans", sans-serif;
    color: #0885af;
    font-size: 17px;
    line-height: 1.5em;
    text-align: justify;
    letter-spacing: 0px;
}

.free-text._2 {
    margin-top: 0px;
}

.hamburger-div {
    margin-right: 10px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.nav-popup {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 9998;
    display: none;
    width: 100%;
    height: 100%;
    min-height: auto;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    opacity: 1;
    text-align: center;
}

.newnav-text {
    font-size: 30px;
    letter-spacing: 1px;
}

.newnav-text.pro {
    color: orange;
    font-weight: 400;
}

.newnav-text.multi-spot {
    color: #0099cc;
    font-weight: 400;
}

.nav-close-container {
    position: absolute;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    display: block;
    width: 960px;
    height: 0px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 35px;
}

.hamburger-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    margin-left: 10px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -webkit-text-stroke: 2px white;
    -ms-flex: 0 auto;
    flex: 0 auto;
    font-family: Fontawesome, sans-serif;
    color: hsla(0, 0%, 60%, 0.4);
    font-size: 30px;
    font-weight: 100;
    cursor: pointer;
}

.hamburger-text:hover {
    color: #a0e5ce;
}

.social-share-butt {
    width: 40px;
    height: 40px;
}

.icon-div.pro.banner {
    flex-flow: row;
    text-decoration: none;
    display: flex;
}

.scroll-to-top-ph {
    position: fixed;
    right: 0px;
    bottom: 90px;
    z-index: 9998;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 40px;
    height: 40px;
    padding: 8px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid #98d7ec;
    background-color: transparent;
    opacity: 0;
    -webkit-transition: background-color 300ms ease;
    transition: background-color 300ms ease;
    font-family: Fontawesome, sans-serif;
    color: #98d7ec;
    font-weight: 700;
}

.scroll-to-top-ph:hover {
    border-color: #09c;
    background-color: transparent;
    opacity: 1;
    color: #09c;
}

.scroll-to-top-ph.sidenav {
    bottom: 50px;
    padding-right: 8px;
    padding-left: 8px;
    font-size: 20px;
}

.scroll-to-top-ph.share {
    left: 0px;
    width: 40px;
    height: 40px;
    padding: 8px;
    border-color: #a0e5ce;
    opacity: 0;
    color: #a0e5ce;
    font-size: 22px;
}

.scroll-to-top-ph.share:hover {
    border-color: #09c;
    color: #09c;
}

.social-div-ph {
    position: fixed;
    left: 0px;
    right: 0px;
    bottom: 130px;
    z-index: 9998;
    display: none;
    width: 40px;
    height: 120px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    border: 1px none #000;
}

.social-div-ph.landing {
    position: relative;
    left: 0px;
    top: 200px;
    right: 0px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 20%;
    max-width: none;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.scroll-to-top-phone {
    position: fixed;
    right: 0px;
    bottom: 90px;
    z-index: 9998;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 40px;
    height: 40px;
    padding: 8px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid #98d7ec;
    background-color: transparent;
    opacity: 0;
    -webkit-transition: background-color 300ms ease;
    transition: background-color 300ms ease;
    font-family: Fontawesome, sans-serif;
    color: #98d7ec;
    font-weight: 700;
}

.scroll-to-top-phone:hover {
    border-color: #09c;
    background-color: transparent;
    opacity: 1;
    color: #09c;
}

.scroll-to-top-phone.sidenav {
    bottom: 50px;
    padding-right: 8px;
    padding-left: 8px;
    font-size: 20px;
}

.scroll-to-top-phone.share {
    left: 0px;
    width: 40px;
    height: 40px;
    padding: 8px;
    border-color: #a0e5ce;
    opacity: 0;
    color: #a0e5ce;
    font-size: 22px;
}

.scroll-to-top-phone.share:hover {
    border-color: #09c;
    color: #09c;
}

.scroll-to-top-phone.share.fb {
    position: static;
    border-color: #98d7ec;
    background-color: #98d7ec;
    background-image: url("/img/social-fb.png");
    background-position: 50% 50%;
    background-size: contain;
    background-repeat: no-repeat;
}

.scroll-to-top-phone.share.fb:hover {
    border-color: #09c;
}

.scroll-to-top-phone.share.twit {
    position: static;
    border-color: #98d7ec;
    background-color: #98d7ec;
    background-image: url("/img/social-twit.png");
    background-position: 50% 50%;
    background-size: contain;
    background-repeat: no-repeat;
}

.scroll-to-top-phone.share.twit:hover {
    border-color: #09c;
}

.scroll-to-top-phone.share.mail {
    position: static;
    border-color: #98d7ec;
    background-color: #98d7ec;
    background-image: url("/img/social-mail.png");
    background-position: 50% 50%;
    background-size: contain;
    background-repeat: no-repeat;
}

.scroll-to-top-phone.share.mail:hover {
    border-color: #09c;
}

.vid-player-div {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: auto;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.vid-embed {
    width: 100%;
    padding-left: 7px;
}

.vid-wrapper {
    display: block;
    width: 940px;
    margin-right: auto;
    margin-left: auto;
}

.vid-wrapper._2019 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.vid-wrapper.timer {
    width: 60%;
    margin-bottom: 50px;
}

.vid-wrapper.pro24 {
    align-self: flex-end;
    margin-bottom: 10px;
    padding-top: 20px;
}

.vid-wrapper.pro24.ph {
    display: none;
}

.comments.vid {
    margin-top: 40px;
}

.video-surf-spots {
    margin-top: 0px;
    margin-bottom: 0px;
    box-shadow: none;
    font-family: "Open Sans", sans-serif;
    color: #999;
    font-size: 20px;
    line-height: 1.4em;
    font-weight: 300;
    text-align: center;
    letter-spacing: 0px;
    text-transform: none;
}

.video-surf-spots.top-margin {
    margin-top: 45px;
    margin-bottom: 0px;
    box-shadow: none;
    font-family: "Open Sans", sans-serif;
    color: #999;
    font-size: 20px;
    line-height: 1.4em;
    font-weight: 300;
    text-align: center;
    letter-spacing: 0px;
    text-transform: none;
}

.video-surf-spots.promo {
    margin-right: 100px;
    margin-bottom: 60px;
    margin-left: 100px;
    padding-top: 10px;
    padding-bottom: 10px;
    border: 2px solid #FF8C00;
    border-radius: 10px;
}

.video-surf-spots.promo._2019 {
    margin-right: 0px;
    margin-left: 0px;
    padding-right: 60px;
    padding-left: 60px;
    border-width: 5px;
    border-color: orange;
    background-color: transparent;
    background-image: none;
}

.video-surf-spots.scroll-text-2 {
    overflow: auto;
}

.vid-link {
    display: inline;
    color: #905890;
    font-weight: 300;
    text-decoration: none;
    text-transform: none;
    cursor: pointer;
}

.slide-nav-3 {
    display: none;
}

.right-arrow-2 {
    height: 150px;
    margin-top: 20%;
    -webkit-transition: color 400ms ease;
    transition: color 400ms ease;
    color: transparent;
}

.right-arrow-2:hover {
    color: #fff;
}

.right-arrow-2.hide {
    display: none;
}

.right-arrow-2.weekly-wave-rt {
    height: 50%;
    margin-top: 57%;
    margin-bottom: 0%;
    color: #09c;
    font-size: 24px;
}

.left-arrow-2 {
    height: 150px;
    margin-top: 20%;
    -webkit-transition: color 400ms ease;
    transition: color 400ms ease;
    color: transparent;
}

.left-arrow-2:hover {
    color: #fff;
}

.left-arrow-2.hide {
    display: none;
}

.left-arrow-2.weekly-wave {
    height: 50%;
    margin-top: 57%;
    margin-bottom: 0%;
    color: #09c;
    font-size: 24px;
}

.blog-hero-image {
    height: 100%;
    background-image: url("/img/forecast-desktop.png");
    background-position: 50% 0px;
    background-size: cover;
    background-repeat: no-repeat;
}

.blog-section {
    margin-top: 0px;
    margin-bottom: 0px;
    padding-bottom: 35px;
    text-align: justify;
}

.blog-section.bg {
    background-image: -webkit-linear-gradient(270deg,
            rgba(96, 185, 203, 0.1),
            rgba(96, 185, 203, 0.1));
    background-image: linear-gradient(180deg,
            rgba(96, 185, 203, 0.1),
            rgba(96, 185, 203, 0.1));
}

.blog-section.first {
    margin-top: 35px;
}

.blog-section.first.no-bott-pad {
    padding-bottom: 0px;
}

.blog-section.no-pad {
    padding-bottom: 0px;
}

.blog-section.image {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.blog-image {
    display: block;
    margin-right: auto;
    margin-bottom: 25px;
    margin-left: auto;
}

.blog-image.no-margin {
    margin-bottom: 0px;
}

.blog-image.pad {
    margin-bottom: 15px;
}

.blog-image.pad.hdpi {
    margin-bottom: 0px;
}

.blog-text-red {
    color: red;
    font-weight: 600;
}

.blog-text-red.bl {
    color: blue;
}

.blog-text-red.pink {
    color: #eb8989;
}

.blog-text-red.green {
    color: #429d5c;
}

.blog-text-blue {
    color: #09c;
    font-size: 18px;
    font-weight: 600;
}

.blog-text-blue.center {
    display: block;
    margin-right: auto;
    margin-left: auto;
    font-weight: 300;
    text-align: center;
}

.blog-text-blue.center.pro {
    color: #fff;
    font-size: 24px;
    font-weight: 600;
    cursor: pointer;
}

.blog-text-blue.en {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-size: 17px;
}

.ad {
    display: block;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.blog-flex-parent {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.blog-flex-parent._3-col {
    margin-top: 10px;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.blog-flex-parent.legend {
    margin-top: 25px;
    margin-bottom: 25px;
    padding-left: 50px;
}

.blog-flex-parent.legend.wind {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.blog-flex-parent.mobile {
    display: none;
}

.blog-flex-left {
    width: 50%;
}

.column {
    width: 65%;
}

.column._1 {
    width: 85px;
    text-align: center;
}

.column._2 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 75px;
    margin-right: 20px;
    padding-left: 15px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    text-align: left;
}

.column._3 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 55%;
    margin-left: 80px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    text-align: right;
}

.column._3.en {
    width: 70%;
}

.image-2 {
    font-size: 150px;
}

.blog-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    font-family: Muli, sans-serif;
    color: #666;
    font-size: 17px;
    line-height: 25px;
    font-weight: 300;
    letter-spacing: 0.5px;
}

.blog-text.en {
    line-height: 20px;
    text-align: left;
    letter-spacing: 0px;
}

.blog-text.en.pro {
    position: relative;
    display: block;
    margin-top: -48px;
    font-size: 15px;
    line-height: 17px;
    text-align: center;
}

.blog-text.en.infographic {
    min-height: 125px;
}

.blog-div {
    display: block;
    width: 730px;
    margin-right: auto;
    margin-left: auto;
    box-shadow: 5px 5px 15px 5px rgba(0, 0, 0, 0.1);
}

.blog-div.wide {
    width: 100%;
    margin-top: 35px;
    margin-bottom: 35px;
}

.blog-div.vimeo {
    width: auto;
    height: auto;
    max-height: 360px;
    max-width: 640px;
    margin-top: 35px;
    margin-bottom: 0px;
    box-shadow: none;
    text-align: center;
}

.blog-div.full {
    width: auto;
    padding: 25px;
    text-align: center;
}

.blog-div.full.no-margin {
    margin-top: 10px;
}

.blog-div.en {
    padding: 15px 25px;
}

.blog-div.en.pad {
    padding-right: 15px;
    padding-left: 15px;
    text-decoration: none;
}

.blog-text-link {
    color: #09c;
    font-weight: 300;
    text-decoration: underline;
}

.blog-text-link:hover {
    color: #60b9cb;
}

.blog-lightbox {
    width: 50%;
    margin-top: 20px;
    text-align: right;
}

.blog-lightbox._2-col {
    width: 100%;
}

.blog-lightbox._3-col {
    width: 100%;
    text-align: center;
}

.spl-autofit {
    background-image: none;
    pointer-events: none;
}

.spl-title {
    opacity: 0.7;
}

.spl-header {
    background: rgba(0, 0, 0, 0);
}

.spl-footer {
    background: rgba(0, 0, 0, 0);
}

.spl-prev, .spl-next {
    background-color: rgba(0, 0, 0, .3);
}

.blog-text-col-left {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 45%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.image-3 {
    width: 100%;
    padding-top: 0px;
}

.blog-300x150 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.blog-flex-parent-2 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.blog-flex-parent-2._3-col {
    margin-top: 10px;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.blog-2-col-parent {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.blog-flex {
    width: 100%;
}

.fb-comments-contain {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 0px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 0px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-top: 1px none hsla(0, 0%, 60%, 0.5);
    text-align: left;
}

.blog-comments {
    display: block;
    width: 90%;
    margin-right: auto;
    margin-left: auto;
    padding-top: 35px;
    padding-right: 0px;
    padding-left: 0px;
    border-top: 1px solid hsla(0, 0%, 60%, 0.5);
}

.ad-slider {
    width: 940px;
    height: 100%;
}

.left-arrow-3 {
    display: none;
}

.right-arrow-3 {
    display: none;
}

.mask-ad-slider {
    height: 100%;
}

.ad-slider-slide {
    height: 100%;
}

.div-block-2 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.html-embed-2 {
    display: block;
}

.typhoon-button {
  background-color: var(--white);
  color: #09c;
  text-align: center;
  border: 3px solid #72ff00;
  border-radius: 10px;
  font-family: Muli, sans-serif;
  font-size: 15px;
  font-weight: 300;
  line-height: 25px;
  box-shadow: 0 1px 5px 1px rgba(0, 0, 0, .1);
}

.typhoon-button:active, .typhoon-button:focus {
  box-shadow: none;
  border-width: 2px;
  border-color: #6ad613;
  padding-top: 10px;
  padding-bottom: 10px;
  font-weight: 600;
}

.typhoon-button:focus-visible {
  outline-offset: 0px;
  border-width: 2px;
  outline: 3px #09c;
  padding-top: 10px;
  padding-bottom: 10px;
  font-weight: 600;
}

.typhoon-button[data-wf-focus-visible] {
  outline-offset: 0px;
  border-width: 2px;
  outline: 3px #09c;
  padding-top: 10px;
  padding-bottom: 10px;
  font-weight: 600;
}

.typhoon-button.large {
  margin-bottom: 100px;
}

.typhoon-button.now.cta {
  color: #666;
  background-color: #fff;
  padding: 5px 2px;
  font-size: 14px;
  line-height: 18px;
  box-shadow: 0 0 5px 1px rgba(0, 0, 0, .4);
}

.typhoon-button.now.cta:hover {
  border-color: red;
}

.typhoon-button.now.cta.right {
  box-shadow: 0 0 5px 1px rgba(0, 0, 0, .4);
}

.blog-text-99cccc {
    color: #9cc;
    text-decoration: none;
}

.blog-text-ccccff {
    color: #ccf;
}

.blog-legend-col-mid {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 25%;
    padding-right: 25px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.blog-legend-col-mid.ft {
    display: none;
}

.text-legend {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 75px;
    margin-top: 2px;
    margin-bottom: 3px;
    padding: 5px 25px 4px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    font-family: Muli, sans-serif;
    color: #fff;
    line-height: 15px;
    font-weight: 600;
    text-align: center;
    letter-spacing: 0.5px;
}

.text-legend.ff3333 {
    padding-top: 6px;
    background-image: -webkit-linear-gradient(270deg, #f33, #f33);
    background-image: linear-gradient(180deg, #f33, #f33);
}

.text-legend.ff9999 {
    background-image: -webkit-linear-gradient(270deg, #f99, #f99);
    background-image: linear-gradient(180deg, #f99, #f99);
}

.text-legend.c79187 {
    background-image: -webkit-linear-gradient(270deg, #c79187, #c79187);
    background-image: linear-gradient(180deg, #c79187, #c79187);
}

.text-legend.c4496f {
    background-image: -webkit-linear-gradient(270deg, #c4496f, #c4496f);
    background-image: linear-gradient(180deg, #c4496f, #c4496f);
}

.text-legend.c16ec8 {
    background-image: -webkit-linear-gradient(270deg, #c16ec8, #c16ec8);
    background-image: linear-gradient(180deg, #c16ec8, #c16ec8);
}

.text-legend.ff66ff {
    background-image: -webkit-linear-gradient(270deg, #f6f, #f6f);
    background-image: linear-gradient(180deg, #f6f, #f6f);
}

.text-legend.cccff {
    background-image: -webkit-linear-gradient(270deg, #ccf, #ccf);
    background-image: linear-gradient(180deg, #ccf, #ccf);
}

.text-legend._99cccc {
    background-image: -webkit-linear-gradient(270deg, #9cc, #9cc);
    background-image: linear-gradient(180deg, #9cc, #9cc);
}

.text-legend._4dafc6 {
    background-image: -webkit-linear-gradient(270deg, #4dafc6, #4dafc6);
    background-image: linear-gradient(180deg, #4dafc6, #4dafc6);
}

.text-legend._6666ff {
    background-image: -webkit-linear-gradient(270deg, #66f, #66f);
    background-image: linear-gradient(180deg, #66f, #66f);
}

.text-legend._467498 {
    margin-bottom: 0px;
    background-image: -webkit-linear-gradient(270deg, #467498, #467498);
    background-image: linear-gradient(180deg, #467498, #467498);
}

.text-legend.units {
    margin-bottom: 15px;
    padding: 4px 20px 5px;
    border: 1px solid #999;
    background-color: transparent;
    color: #09c;
    font-size: 18px;
    line-height: 25px;
}

.text-legend.units:hover {
    margin-top: 1px;
    margin-bottom: 14px;
    border: 2px solid #999;
}

.text-legend.units:focus {
    margin-top: 1px;
    margin-bottom: 14px;
    border-width: 2px;
}

.text-legend.units-ft {
    margin-bottom: 14px;
    padding-top: 4px;
    padding-bottom: 5px;
    color: #09c;
    font-size: 18px;
    line-height: 25px;
}

.text-legend.units-ft:hover {
    margin-top: 1px;
    border: 1px solid #999;
}

.text-legend.b75555 {
    background-image: -webkit-linear-gradient(270deg, #b75555, #b75555);
    background-image: linear-gradient(180deg, #b75555, #b75555);
    color: #fff;
}

.text-legend.dc4040 {
    background-image: -webkit-linear-gradient(270deg, #dc4040, #dc4040);
    background-image: linear-gradient(180deg, #dc4040, #dc4040);
}

.text-legend.ff0000 {
    background-image: -webkit-linear-gradient(270deg, red, red);
    background-image: linear-gradient(180deg, red, red);
}

.text-legend.ff8a00 {
    background-image: -webkit-linear-gradient(270deg, #ff8a00, #ff8a00);
    background-image: linear-gradient(180deg, #ff8a00, #ff8a00);
}

.text-legend.ec8f21 {
    background-image: -webkit-linear-gradient(270deg, #ec8f21, #ec8f21);
    background-image: linear-gradient(180deg, #ec8f21, #ec8f21);
}

.text-legend.d1a930 {
    background-image: -webkit-linear-gradient(270deg, #d1a930, #d1a930);
    background-image: linear-gradient(180deg, #d1a930, #d1a930);
}

.text-legend.e8be3e {
    background-image: -webkit-linear-gradient(270deg, #e8be3e, #e8be3e);
    background-image: linear-gradient(180deg, #e8be3e, #e8be3e);
}

.text-legend.ffc000 {
    background-image: -webkit-linear-gradient(270deg, #ffc000, #ffc000);
    background-image: linear-gradient(180deg, #ffc000, #ffc000);
}

.text-legend.ffd800 {
    background-image: -webkit-linear-gradient(270deg, #ffd800, #ffd800);
    background-image: linear-gradient(180deg, #ffd800, #ffd800);
}

.text-legend.e4da2e {
    background-image: -webkit-linear-gradient(270deg, #e4da2e, #e4da2e);
    background-image: linear-gradient(180deg, #e4da2e, #e4da2e);
}

.text-legend.d3cc54 {
    background-image: -webkit-linear-gradient(270deg, #d3cc54, #d3cc54);
    background-image: linear-gradient(180deg, #d3cc54, #d3cc54);
}

.text-legend._93d348 {
    background-image: -webkit-linear-gradient(270deg, #93d348, #93d348);
    background-image: linear-gradient(180deg, #93d348, #93d348);
}

.text-legend._48ca48 {
    background-image: -webkit-linear-gradient(270deg, #48ca48, #48ca48);
    background-image: linear-gradient(180deg, #48ca48, #48ca48);
}

.text-legend._429d5c {
    background-image: -webkit-linear-gradient(270deg, #429d5c, #429d5c);
    background-image: linear-gradient(180deg, #429d5c, #429d5c);
}

.blog-legend-col-left {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 12%;
    padding-right: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.blog-legend-col-mid-ft {
    display: none;
    width: 25%;
    padding-right: 25px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.blog-legend-col-mid-ft.ft {
    display: none;
}

.legend-units {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
}

.legend-metric {
    display: block;
    width: 35px;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 10px 5px;
    float: right;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    font-family: Muli, sans-serif;
    color: #09c;
    font-size: 17px;
    line-height: 22px;
    font-weight: 300;
    text-align: center;
    letter-spacing: 0.5px;
    text-decoration: underline;
    cursor: pointer;
}

.legend-metric:hover {
    color: #98d7ec;
}

.legend-metric.no-link {
    color: #666;
    cursor: default;
}

.legend-metric-ft {
    display: none;
    width: 35px;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 10px 5px;
    float: right;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    font-family: Muli, sans-serif;
    color: #09c;
    font-size: 17px;
    line-height: 22px;
    font-weight: 300;
    text-align: center;
    letter-spacing: 0.5px;
    text-decoration: underline;
    cursor: pointer;
}

.legend-metric-ft:hover {
    color: #98d7ec;
}

.legend-metric-ft.no-link {
    color: #666;
    cursor: default;
}

.blog-300x250 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.blog-text-93d348 {
    color: #93d348;
    text-decoration: none;
}

.blog-text-d3cc54 {
    color: #d3cc54;
}

.blog-3-col-parent {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.lightbox-link-3-col {
    width: 33%;
}

.smile {
    width: auto;
    max-width: none;
    padding-top: 0px;
}

.blog-legend-col-mid-km {
    display: none;
    width: 25%;
    padding-right: 25px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.blog-legend-col-mid-km.ft {
    display: none;
}

.blog-legend-col-mid-ms {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 25%;
    padding-right: 25px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.blog-legend-col-mid-ms.ft {
    display: none;
}

.legend-metric-ms {
    display: block;
    width: 35px;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 10px 5px;
    float: right;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    font-family: Muli, sans-serif;
    color: #09c;
    font-size: 17px;
    line-height: 22px;
    font-weight: 300;
    text-align: center;
    letter-spacing: 0.5px;
    text-decoration: underline;
    cursor: pointer;
}

.legend-metric-ms:hover {
    color: #98d7ec;
}

.legend-metric-ms.no-link {
    color: #666;
    cursor: default;
}

.legend-metric-km {
    display: none;
    width: 35px;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 10px 5px;
    float: right;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    font-family: Muli, sans-serif;
    color: #09c;
    font-size: 17px;
    line-height: 22px;
    font-weight: 300;
    text-align: center;
    letter-spacing: 0.5px;
    text-decoration: underline;
    cursor: pointer;
}

.legend-metric-km:hover {
    color: #98d7ec;
}

.legend-metric-km.no-link {
    color: #666;
    cursor: default;
}

.blog-legend-col-mid-mph {
    display: none;
    width: 25%;
    padding-right: 25px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.blog-legend-col-mid-mph.ft {
    display: none;
}

.blog-legend-col-mid-kn {
    display: none;
    width: 25%;
    padding-right: 25px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.blog-legend-col-mid-kn.ft {
    display: none;
}

.legend-metric-mph {
    display: none;
    width: 35px;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 10px 5px;
    float: right;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    font-family: Muli, sans-serif;
    color: #09c;
    font-size: 17px;
    line-height: 22px;
    font-weight: 300;
    text-align: center;
    letter-spacing: 0.5px;
    text-decoration: underline;
    cursor: pointer;
}

.legend-metric-mph:hover {
    color: #98d7ec;
}

.legend-metric-mph.no-link {
    color: #666;
    cursor: default;
}

.legend-metric-kn {
    display: none;
    width: 35px;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 10px 5px;
    float: right;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    font-family: Muli, sans-serif;
    color: #09c;
    font-size: 17px;
    line-height: 22px;
    font-weight: 300;
    text-align: center;
    letter-spacing: 0.5px;
    text-decoration: underline;
    cursor: pointer;
}

.legend-metric-kn:hover {
    color: #98d7ec;
}

.legend-metric-kn.no-link {
    color: #666;
    cursor: default;
}

.ios-image.lazyload {
    text-align: center;
}

.tips-div {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 15px;
    margin-bottom: 25px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.hidden-android {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 940px;
    margin-top: 25px;
    margin-right: auto;
    margin-left: auto;
}

.hidden-android.ios {
    display: none;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.wave-legend-img {
    width: 100%;
    padding-top: 0px;
}

.blog-285x360 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.legend-metric-ph {
    display: block;
    width: 35px;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 10px 5px;
    float: right;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    font-family: Muli, sans-serif;
    color: #09c;
    font-size: 17px;
    line-height: 22px;
    font-weight: 300;
    text-align: center;
    letter-spacing: 0.5px;
    text-decoration: underline;
    cursor: pointer;
}

.legend-metric-ph:hover {
    color: #98d7ec;
}

.legend-metric-ph.no-link {
    color: #666;
    cursor: default;
}

.legend-metric-ft-ph {
    display: none;
    width: 35px;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 10px 5px;
    float: right;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    font-family: Muli, sans-serif;
    color: #09c;
    font-size: 17px;
    line-height: 22px;
    font-weight: 300;
    text-align: center;
    letter-spacing: 0.5px;
    text-decoration: underline;
    cursor: pointer;
}

.legend-metric-ft-ph:hover {
    color: #98d7ec;
}

.legend-metric-ft-ph.no-link {
    color: #666;
    cursor: default;
}

.blog-legend-col-mid-ph {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 25%;
    padding-right: 25px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.blog-legend-col-mid-ph.ft {
    display: none;
}

.blog-legend-col-mid-ft-ph {
    display: none;
    width: 25%;
    padding-right: 25px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.blog-legend-col-mid-ft-ph.ft {
    display: none;
}

.wetsuit-image {
    width: 100%;
    margin-left: 0px;
    padding-top: 0px;
    padding-right: 10px;
    padding-left: 10px;
}

.direction-image {
    width: 100%;
    padding-top: 0px;
}

.htc-image {
    width: 100%;
    padding-top: 0px;
}

.report-div.infographic {
    border-bottom: 1px solid #9999994d;
    border-radius: 7px;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 20px;
    padding-left: 0;
    padding-right: 0;
    display: flex;
}

.report-div.infographic.last {
  border-bottom-style: none;
}

.forecast-help-link {
    position: static;
    z-index: 2;
    display: block;
    width: 15%;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    padding-right: 15px;
    padding-bottom: 15px;
    float: right;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition: color 200ms ease;
    transition: color 200ms ease;
    font-family: Fontawesome, sans-serif;
    color: rgba(0, 153, 204, 0.55);
    font-size: 18px;
    line-height: 19px;
    font-weight: 300;
    text-align: right;
    letter-spacing: 1px;
    text-decoration: none;
    cursor: pointer;
}

.forecast-help-link:hover {
    color: #09c;
    font-weight: 300;
}

.weekly-wave-arrow {
    margin-top: 50%;
    margin-bottom: 0%;
    margin-left: 0px;
    padding-left: 10px;
    text-align: left;
}

.weekly-wave-arrow.rt {
    margin-right: 0px;
    margin-left: 46px;
    padding-right: 20px;
    padding-left: 0px;
}

.vid-player-link {
    display: block;
    padding-right: 10px;
    padding-bottom: 3px;
    padding-left: 10px;
    font-family: Fontawesome, sans-serif;
    color: #98d7ec;
    font-size: 15px;
    line-height: 18px;
    font-weight: 300;
    letter-spacing: 0.5px;
    text-decoration: none;
    text-transform: none;
}

.vid-player-link-2 {
    text-decoration: none;
}

.text-low-case {
    padding-left: 10px;
    color: #98d7ec;
    text-transform: none;
}

.arrow-3-4-tw-left {
    right: 36%;
    height: 100%;
    color: #09c;
}

.arrow-3-4-tw-left.full {
    right: 60%;
}

.arrow-3-4-tw-left.below {
    height: 40%;
    margin-top: 300px;
}

.arrow-3-4-tw-right {
    left: 36%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: #09c;
}

.arrow-3-4-tw-right.full {
    left: 60%;
}

.arrow-3-4-tw-right.below {
    height: 40%;
    margin-top: 300px;
}

.event-detail {
    margin-bottom: 50px;
    padding-bottom: 0px;
    text-align: justify;
}

.event-detail.bg {
    background-image: -webkit-linear-gradient(270deg,
            rgba(96, 185, 203, 0.1),
            rgba(96, 185, 203, 0.1));
    background-image: linear-gradient(180deg,
            rgba(96, 185, 203, 0.1),
            rgba(96, 185, 203, 0.1));
}

.video-640-square {
    display: block;
    width: 65%;
    max-width: none;
    min-height: 0px;
    margin-top: 40px;
    margin-right: auto;
    margin-left: auto;
}

.background-video {
    display: block;
    max-width: 640px;
    min-height: 640px;
    margin-right: auto;
    margin-left: auto;
}

.slideshow {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-right: auto;
    margin-bottom: 150px;
    margin-left: auto;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
}

.slideshow._34tw {
    overflow: hidden;
    margin-bottom: 60px;
}

.embed-slides {
    margin-right: 20px;
    margin-left: 20px;
}

.name-banner-nav {
    display: block;
    margin-top: 10px;
    margin-bottom: 10px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.name-banner-nav.blog {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.name-banner-nav.wk-wave {
    margin-top: 30px;
}

.name-banner-nav.my-multi {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

.name-banner-link {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 25%;
    float: left;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.name-banner-link.right {
    float: right;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.name-banner-link.right.blogr {
    width: 55%;
}

.name-banner-link.blog {
    width: 45%;
}

.name-banner-link.blog.rt {
    width: 100%;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.name-banner-link.blog._3-col {
    width: 33.33333333%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
}

.name-banner-link.mid {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.name-banner-nav._34tw.mobile {
    display: none;
}

.name-banner-link.right._34tw {
    width: 20%;
}

.name-banner-link._34tw {
    width: 15%;
}

.name-banner-link._34tw2 {
    width: 35%;
    justify-content: center;
}

.name-banner-link._34tw3 {
    width: 30%;
    justify-content: center;
}

.upcoming-events {
    margin-top: 30px;
    margin-bottom: 0px;
    padding-bottom: 0px;
    text-align: justify;
}

.upcoming-events.bg {
    background-image: -webkit-linear-gradient(270deg,
            rgba(96, 185, 203, 0.1),
            rgba(96, 185, 203, 0.1));
    background-image: linear-gradient(180deg,
            rgba(96, 185, 203, 0.1),
            rgba(96, 185, 203, 0.1));
}

.past-events {
    margin-top: 65px;
    margin-bottom: 0px;
    padding-bottom: 0px;
    text-align: justify;
}

.past-events.bg {
    background-image: -webkit-linear-gradient(270deg,
            rgba(96, 185, 203, 0.1),
            rgba(96, 185, 203, 0.1));
    background-image: linear-gradient(180deg,
            rgba(96, 185, 203, 0.1),
            rgba(96, 185, 203, 0.1));
}

.slider-image {
    width: 28%;
    height: auto;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    box-shadow: 5px -5px 15px 5px rgba(0, 0, 0, 0.1);
    -webkit-transition: box-shadow 200ms ease;
    transition: box-shadow 200ms ease;
}

.section-pics {
    margin-top: 75px;
}

.slide-3-for-tw {
    width: 33.33%;
}

.slider-images {
    max-height: 97%;
    border-radius: 5px;
    box-shadow: 1px 2px 5px 2px rgba(0, 0, 0, 0.2);
}

.slider-images.rt {
    float: right;
}

.slider-images.mid {
    display: block;
    margin-right: auto;
    margin-left: auto;
}

.slider-images.mid.center {
    position: relative;
    bottom: -18%;
}

.slider-images.cover {
    display: block;
    margin: 50px auto;
}

.slider-images.cover._34tw {
    display: block;
    margin: 50px auto;
    margin-top: 15px;
    margin-bottom: 20px;
}

.slider-3 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

.slider-3-for-tw {
    z-index: 9997;
    height: 300px;
    background-color: transparent;
}

.right-arrow-4 {
    left: 37%;
    color: #09c;
}

.arrow-3-4-tw {
    top: 340px;
    right: 20px;
    width: 37px;
    height: 38px;
    color: #0099cc4a;
}

.arrow-3-4-tw:hover {
    color: #09c;
}

.arrow-3-4-tw.lt {
    left: auto;
    right: 70px;
}

.spacer-div {
    height: 15px;
}

.photo-remove {
    margin-top: -10px;
    margin-bottom: 15px;
    box-shadow: none;
    font-family: "Open Sans", sans-serif;
    color: #999;
    font-size: 12px;
    line-height: 1.4em;
    font-weight: 300;
    text-align: right;
    letter-spacing: 0px;
    text-transform: none;
}

.photo-remove.pro {
    margin-right: 30px;
    margin-left: 30px;
    text-align: center;
}

.photo-remove.pro.sub {
    margin-top: 25px;
    margin-bottom: 0px;
    color: #fff;
}

.photo-remove.pro.zh {
    font-size: 14px;
}

.nav-lang-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    margin-right: 0px;
    margin-left: 0px;
    padding: 10px 10px 10px 0px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    font-family: Fontawesome, sans-serif;
    color: #09c;
    font-size: 22px;
    font-weight: 400;
    text-decoration: none;
    text-transform: uppercase;
    cursor: pointer;
}

.nav-lang-text:hover {
    -webkit-filter: none;
    filter: none;
    color: #09c;
}

.nav-lang-text:focus {
    -webkit-filter: none;
    filter: none;
}

.nav-lang-text.en {
    color: #98d7ec;
    font-size: 24px;
}

.nav-lang-text.en:hover {
    color: #09c;
}

.nav-lang-text.zh {
    font-size: 22px;
}

.nav-lang-text.en-zh {
    color: #98d7ec;
}

.nav-lang-text.en-zh:hover {
    color: #09c;
}

.nav-lang-link-zh {
    padding: 5px 10px;
    text-decoration: none;
}

.nav-lang-link-zh:hover {
    -webkit-filter: none;
    filter: none;
}

.nav-lang-link-zh:focus {
    -webkit-filter: none;
    filter: none;
}

.nav-lang-link-zh.w--current {
    font-weight: 700;
}

.nav-lang-link-zh.w--current:hover {
    -webkit-filter: none;
    filter: none;
}

.nav-lang-link-zh.w--current:focus {
    -webkit-filter: none;
    filter: none;
}

.nav-lang-link-zh.en {
    -webkit-filter: saturate(0%);
    filter: saturate(0%);
}

.nav-lang-link-zh.en:hover {
    -webkit-filter: none;
    filter: none;
}

.nav-lang-link-zh.check {
    display: none;
}

.home-feature {
    margin-top: 100px;
    margin-bottom: 100px;
}

.cam-popup {
    display: block;
    height: auto;
    max-height: none;
    max-width: none;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.pro-button-section {
    display: block;
}

.text-span {
    padding-right: 0px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    color: #09c;
    font-size: 32px;
    text-align: left;
}

.text-span.google {
    color: red;
}

.pro-button-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-align-content: space-around;
    -ms-flex-line-pack: distribute;
    align-content: space-around;
}

.pro-button-container.login {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: left;
}

.plan-desc {
    width: 33%;
}

.pro-text {
    color: #09c;
    font-weight: 400;
}

.pro-email-signup {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 9998;
    display: none;
    height: 100%;
}

.user-icon {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-right: 0px;
    margin-left: 0px;
    padding: 10px 10px 10px 0px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    font-family: Fontawesome, sans-serif;
    color: hsla(0, 0%, 60%, 0.4);
    font-size: 24px;
    line-height: 12px;
    font-weight: 400;
    text-decoration: none;
    text-transform: uppercase;
    cursor: pointer;
}

.user-icon:hover {
    -webkit-filter: none;
    filter: none;
    color: #a0e5ce;
}

.user-icon:focus {
    -webkit-filter: none;
    filter: none;
}

.user-icon.sidemap {
    position: fixed;
    left: 0px;
    right: 0px;
    bottom: 50px;
    z-index: 9998;
    display: inline-block;
    width: 40px;
    height: auto;
    margin-left: 0px;
    padding-right: 8px;
    padding-left: 8px;
    border: 1px solid #98d7ec;
    background-color: transparent;
    opacity: 1;
    -webkit-transition: background-color 300ms ease;
    transition: background-color 300ms ease;
    color: #98d7ec;
    font-size: 20px;
    font-weight: 700;
    text-decoration: none;
}

.user-icon.sidemap:hover {
    border-color: #09c;
    color: #09c;
}

.user-icon.sidemap.scroll-to-top {
    z-index: 9997;
    height: 40px;
    padding-top: 8px;
    padding-bottom: 8px;
    border-color: #a0e5ce;
    opacity: 0;
    color: #a0e5ce;
}

.user-icon.sidemap.scroll-to-top:hover {
    border-color: #09c;
    color: #09c;
}

.user-icon.en {
    color: #98d7ec;
    font-size: 24px;
}

.user-icon.en:hover {
    color: #09c;
}

.user-icon.zh {
    font-size: 22px;
}

.user-icon.zh.user {
    color: #a0e5ce;
}

.user-icon.en-zh {
    color: #98d7ec;
}

.user-icon.en-zh:hover {
    color: #09c;
}

.user-icon.check {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    color: #09c;
    font-size: 12px;
}

.bold-text {
    font-size: 24px;
}

.pro-check {
    margin-top: 15px;
    font-family: Fontawesome, sans-serif;
    color: #60f;
    font-size: 18px;
    line-height: 18px;
    font-style: normal;
}

.pro-check.blue {
    color: rgba(0, 153, 204, 0.75);
}

.payment-banner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    background-color: #09c;
    font-family: 'Josefin Sans', sans-serif;
    font-size: 16px;
    line-height: 20px;
    font-weight: 300;
    text-transform: uppercase;
    border-radius: 5px;
}

.payment-banner.nobg {
    background-color: transparent;
}

.payment-banner.restrict {
    width: 15%;
    padding-top: 10px;
    padding-bottom: 8px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    -ms-grid-row-align: auto;
    align-self: auto;
    -webkit-box-ordinal-group: 1;
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    text-align: center;
    white-space: normal;
}

.payment-banner.ph {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    background-color: transparent;
}

.pay-history {
    overflow: scroll;
    max-height: 152px;
}

.user-logout.login {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 100px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.logout-button {
    margin-top: 5px;
    padding: 5px 10px;
    float: right;
    border: 1px solid #09c;
    border-radius: 5px;
    background-color: transparent;
    color: #09c;
    text-transform: uppercase;
}

.logout-button:hover {
    background-color: rgba(0, 0, 0, 0.1);
}

.logout-button.login {
    margin-top: 20px;
    float: none;
    text-align: left;
}

.show-no-email {
    display: none;
}

.login-section {
    margin-bottom: 35px;
}

.upgrade-popup {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 9998;
    display: none;
    height: 100%;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    text-align: center;
}

.upgrade-popup.cancel {
    display: none;
}

.upgrade-popup.year-upgrade {
    display: none;
}

.update-pay-popup {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 9998;
    display: none;
    height: 100%;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    text-align: center;
}

.update-pay-popup.cancel {
    display: none;
}

.update-pay-popup.year-upgrade {
    display: none;
}

.continue-button-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 50px;
    margin-bottom: 50px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-align-content: space-around;
    -ms-flex-line-pack: distribute;
    align-content: space-around;
    opacity: 0;
}

.continue-button {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 12px 20px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-style: solid;
    border-width: 4px;
    border-radius: 10px;
    border-color: hsla(38.82352941176471, 100%, 50%, 1);
    background-color: hsla(38.82352941176471, 100%, 50%, 1);
    font-family: Muli, sans-serif;
    color: #fff;
    font-size: 18px;
    line-height: 24px;
    font-weight: 600;
    text-align: center;
    letter-spacing: 0.5px;
    text-decoration: none;
}

.continue-button:hover {
    border-style: solid;
    border-width: 4px;
    background-color: #fff;
    color: hsla(38.82352941176471, 100%, 50%, 1);
}

.cam-sub-overlay {
    position: relative;
    left: 0px;
    top: 0px;
    right: 0px;
    z-index: 2999;
    display: block;
    width: auto;
    height: auto;
    min-height: 360px;
    min-width: 640px;
    margin-right: 15px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-flex: 1;
    -webkit-flex: 1 2 67%;
    -ms-flex: 1 2 67%;
    flex: 1 2 67%;
    border-radius: 5px;
    background-color: transparent;
    box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.2);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    text-align: center;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.cam-sub-overlay:hover {
    box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.1);
}

.cam-sub-overlay-ms {
    position: absolute;
    left: 0px;
    top: 0px;
    right: 0px;
    z-index: 2999;
    display: block;
    width: auto;
    height: auto;
    margin: auto;
    min-height: 360px;
    min-width: 640px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-flex: 1;
    -webkit-flex: 1 2 67%;
    -ms-flex: 1 2 67%;
    flex: 1 2 67%;
    border-radius: 5px;
    background-color: transparent;
    box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.2);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    text-align: center;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
}


.cam-overlay-div {
    position: static;
    display: block;
    min-height: 360px;
    min-width: 640px;
    padding-top: 50px;
    padding-bottom: 35px;
    background-color: transparent;
    background-position: 0px 0px, 50% 50%;
    background-size: auto, contain;
    background-repeat: repeat, no-repeat;
}

.try-pro-div {
  width: auto;
  clear: none;
  text-align: left;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  margin-bottom: 100px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.try-pro-div.sub {
    margin-top: 50px;
    margin-bottom: 0px;
}

.try-pro-div.sub.login {
    margin-top: 0px;
    margin-bottom: 60px;
}

.try-pro-div.sub.login.no-sponsors {
    margin-top: 0px;
    margin-bottom: 250px;
}

.pro-cta-blurb {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    clear: none;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.pro-line {
    position: static;
    left: -500px;
    overflow: visible;
    width: auto;
    min-width: 30%;
    margin-right: 0px;
    clear: none;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    border-style: solid;
    border-width: 2px 2px 1px;
    border-color: orange;
}

.pro-line.short {
    width: auto;
    min-width: 50px;
    margin-right: 0px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: left;
}

.pro-cta-contain {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.awesome-solid {
    font-family: 'Font awesome 5 free solid 900', sans-serif;
    font-weight: 400;
}

.vid-photo-ad-desktop-ad-free {
    width: 300px;
    height: 415px;
    background-color: transparent;
}

.ad-free-spacer-ph {
    display: none;
}

.plug-300x250-ph {
    display: none;
}

.slide-icon {
    display: none;
}

.slide-icon.my-multi {
    position: absolute;
    display: block;
    margin-top: 20px;
    margin-left: 47.5%;
    font-family: 'Font awesome 5 free solid 900', sans-serif;
    color: rgba(0, 153, 204, 0.25);
    font-size: 17px;
}

.slide-icon.my-multi.ph {
    display: none;
}

.navbar-ad {
    width: 100%;
    height: 36px;
    border-style: solid none;
    border-width: 1px;
    border-color: #fff;
    background-color: #d6d3be;
    text-decoration: none;
}

.navad-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 36px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    font-family: Fontawesome, sans-serif;
    color: #000000;
    font-size: 17px;
    text-align: center;
    letter-spacing: 1px;
    text-indent: 1px;
}

.fontawesome5 {
    font-family: "Font awesome solid", sans-serif;
    color: hsla(0, 0%, 0%, 0.5);
    font-size: 18px;
}

.fontawesome5.blk {
    color: rgba(144, 88, 144, 0.75);
    text-decoration: none;
}

.fontawesome5.help {
    flex: 1;
    padding-top: 35px;
    padding-bottom: 0;
    padding-left: 0;
    font-size: 36px;
    color: #38A9D2;
}

.fontawesome5.help:hover {
    color: #F8A504 !important;
}

.fontawesome5.surfcheck {
    color: rgba(12, 128, 214, 0.65);
    text-decoration: none;
}

.slider-wide {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 415px;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: #fff;
    text-align: left;
}

.slide-full {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}

.nav-wave {
    width: 100%;
    height: 36px;
    border-style: solid none;
    border-width: 1px;
    border-color: #fff;
    background-color: orange;
    text-decoration: none;
}

.login-no-trial {
    margin-top: 75px;
    margin-bottom: 150px;
}

.login-no-trial.nomargin {
    margin-top: 0px;
    margin-bottom: 150px;
}

.awesome-solid {
    font-family: "Font awesome solid";
    font-weight: 400;
}

.sms-popup {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 9998;
    display: none;
    height: 100%;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    text-align: center;
}

.forecast-units {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 25px;
    margin-bottom: 25px;
    margin-left: 0px;
    padding-left: 0px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.forecast-units.last {
    margin-top: 43px;
}

.units-image {
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
}

.pro-vid {
    width: 625px;
    height: 352px;
    margin-right: auto;
    margin-left: auto;
}

.plug-300x250-ph {
    display: none;
}

.plug-300x250-300x150-ph {
    display: none;
}

.plug-300x150-ph {
    display: none;
}

.heading-donate {
  z-index: 1998;
  box-shadow: none;
  filter: drop-shadow(1px 1px 1px #000000b3);
  color: #ffffff;
  text-align: center;
  border: 1px #000;
  margin-top: 20px;
  margin-bottom: 30px;
  font-family: Josefin Sans, sans-serif;
  font-weight: 600;
  position: static;
}

.image-blog-small {
    margin-top: 10px;
}

.blog-lightbox-2.center {
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center;
}

.blog-text-green {
    color: green;
    font-weight: 600;
}

.title-multi {
    width: 100%;
    background-color: #98d7ec;
    background-image: -webkit-gradient(linear, left top, right top, color-stop(20%, #09c), color-stop(50%, rgba(0, 153, 204, 0.5)));
    background-image: linear-gradient(90deg, #09c 20%, rgba(0, 153, 204, 0.5) 50%);
}

.grid4x4 {
    height: auto;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
}

.grid4x4.streams {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

.column-multi {
    padding-right: 0px;
    padding-left: 0px;
    border: 1px solid #09c;
}

.column-multi.report {
    border-style: solid;
    border-color: #fff;
    cursor: pointer;
}

.multi-forecast-div {
    width: 100%;
    height: auto;
    max-height: none;
    min-height: 0px;
    margin-bottom: 140px;
}

.multi-forecast-div.new {
    overflow: scroll;
    height: auto;
    padding-top: 20px;
    padding-bottom: 40px;
}

.multi-spot-welcome {
    width: 100%;
    height: 100vh;
    margin-top: 5px;
    background-color: transparent;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(55%, hsla(0, 0%, 100%, 0.1)), to(#fff)), url('/img/multi-spot/multi-spot-cover_1.jpg');
    background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0.1) 55%, #fff), url('/img/multi-spot/multi-spot-cover_1.jpg');
    background-position: 0px 0px, 50% 0%;
    background-size: auto, cover;
    background-repeat: repeat, no-repeat;
}

.multi-stream-div {
    width: auto;
    height: auto;
    max-height: none;
    min-height: 0px;
    margin-top: 40px;
    margin-bottom: 0px;
}

.link {
    text-decoration: none;
}

.slider-multi-host {
    overflow: hidden;
    width: 100vw;
    height: auto;
    background-color: transparent;
}

.mask {
    overflow: visible;
    width: 25%;
    height: 180px;
}

.link-host {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    margin-bottom: 15px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.slide-3 {
    margin: 0px;
}

.last-slide-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    width: 100vw;
    height: 185px;
    padding-right: 0%;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.host-wrap {
    width: 100%;
}

.arrow-trans {
    display: none;
    color: transparent;
}

.form-device-restrict {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 20px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.form-restrict {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.field-label {
    width: 25%;
    margin-right: 10px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    font-family: Muli, sans-serif;
    font-weight: 400;
    color: #777;
    font-size: 16px;
    line-height: 25px;
}

.field-label30 {
    width: 30%;
}

.dropdown-restrict {
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
}

.dropdown-2 {
    padding-top: 0px;
    padding-bottom: 0px;
}

.dropdown-2.center {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-top: 0px;
    padding-bottom: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
}

.dropdown-2.center.trouble {
    position: static;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    -ms-grid-row-align: auto;
    align-self: auto;
    -webkit-box-ordinal-group: 1;
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    color: red;
}

.dropdown-2.center.trouble.sub-drowdown {
    margin-top: 20px;
    margin-bottom: 20px;
}

.troubleshoot-arrow {
    color: #999;
}

.card-slide {
    width: auto;
    margin-right: auto;
    margin-bottom: 10px;
    margin-left: auto;
    padding-right: 0px;
    padding-left: 0px;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    -ms-grid-row-align: auto;
    align-self: auto;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
}

.card-slider {
    overflow: hidden;
    height: auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    -ms-grid-row-align: auto;
    align-self: auto;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    background-color: transparent;
}

.button-arrow {
    margin-left: 11px;
    padding-top: 18px;
    padding-bottom: 18px;
}

.card-slider-mask {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: visible;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.section-4 {
    padding-top: 80px;
    padding-bottom: 80px;
}

.card {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    max-height: 340px;
    max-width: 260px;
    padding-top: 18px;
    padding-bottom: 10px;
    padding-right: 4px;
    padding-left: 4px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border-radius: 5px;
    background-color: #fff;
    border: solid 1px #0099cc;
    color: #777;
    cursor: pointer;
}

.card:hover {
    box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15);
}

.text-button {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    color: #51a646;
    font-size: 17px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.text-button:hover {
    color: #79be44;
}

.multi-report-slider-div {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 0px;
    padding-top: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
}

.slide-stream {
    display: none;
    width: auto;
    margin-top: 60px;
}

.reports-streams-div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: 100vh;
  padding-top: 0px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}

.forecast-slider-mask {
    overflow: visible;
    width: 51.75%;
}

.forecast-slide {
    overflow: visible;
    height: auto;
    margin-right: 0px;
    margin-left: 0px;
}

.forecast-slide.last {
    margin-right: 10px;
}

.forecast-slider {
    height: auto;
    background-color: transparent;
}

.forecast-slider-nav {
    display: none;
    margin-bottom: -5%;
}

.stream-modal-1 {
    position: fixed;
    left: 0%;
    top: 0%;
    right: 0%;
    bottom: 0%;
    z-index: 99999;
    display: none;
    width: auto;
    height: auto;
    margin-right: 0px;
    margin-left: 0px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: transparent;
}

.stream-modal-content {
    position: fixed;
    left: 0%;
    top: 0%;
    right: 0%;
    bottom: 0%;
    display: block;
    width: 940px;
    height: 528px;
    margin: auto;
    background-color: #000;
    border: solid 0px #000;
    border-radius: 15px;
    text-align: left;
}

.stream-iframe {
    height: 100%;
}

.close-stream-modal {
    position: absolute;
    left: auto;
    top: 25px;
    right: 25px;
    bottom: auto;
    padding: 10px 15px;
    color: #fff;
    font-size: 40px;
    line-height: 40px;
    text-decoration: none;
    text-shadow: 0 1px 0 #777, 1px 0 0 #777, -1px 0 0 #777, 0 -1px 0 #777;
}

.stream-modal-back {
    display: block;
    width: 100%;
    height: 100%;
    background-color: hsla(0, 0%, 100%, 0.85);
}

.stream-modal-2 {
    position: fixed;
    left: 0%;
    top: 0%;
    right: 0%;
    bottom: 0%;
    z-index: 99999;
    display: none;
    width: auto;
    height: auto;
    margin-right: 0px;
    margin-left: 0px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: transparent;
}

.stream-modal-3 {
    position: fixed;
    left: 0%;
    top: 0%;
    right: 0%;
    bottom: 0%;
    z-index: 99999;
    display: none;
    width: auto;
    height: auto;
    margin-right: 0px;
    margin-left: 0px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: transparent;
}

.stream-modal-4 {
    position: fixed;
    left: 0%;
    top: 0%;
    right: 0%;
    bottom: 0%;
    z-index: 99999;
    display: none;
    width: auto;
    height: auto;
    margin-right: 0px;
    margin-left: 0px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: transparent;
}

.ms-title-nav-link {
  display: none;
  font-family: Fontawesome, sans-serif;
  color: #fff;
  font-style: normal;
  font-weight: 400;
  text-decoration: none;
}

.unsubscribe {
  margin-top: 60px;
  margin-bottom: 60px;
}

._30-day {
  text-align: right;
}

._30-day-contain {
  clear: none;
  text-align: left;
  flex-flow: wrap;
  flex: 0 auto;
  order: 0;
  justify-content: flex-end;
  align-self: flex-end;
  margin-top: 10px;
  margin-left: 0;
  margin-right: 0;
  display: flex;
}

._30-day-contain.zh {
  padding-right: 7%;
}

._30-day-contain.pro {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  margin-top: 0;
  margin-bottom: 60px;
}

._30-day-image {
  width: 30px;
  height: 30px;
  margin-right: 5px;
}

._30-day-image.pro {
  width: auto;
  height: auto;
  margin-bottom: 10px;
}

.search-icon {
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 2%;
  right: auto;
}

.search-filter-form-block {
  width: 100%;
}

.link-white {
  color: #ececec;
}

.nav_component {
  grid-column-gap: 0rem;
  grid-row-gap: 1rem;
  grid-template-rows: auto;
  grid-template-columns: 1fr 2fr;
  grid-auto-columns: 1fr;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.reset-text {
  color: #7c4c2f;
  text-align: right;
  cursor: pointer;
  padding: .5rem;
  text-decoration: none;
  display: inline;
}

.reset-text:hover {
  opacity: 1;
  background-color: #f8f6f6;
  border-radius: 10px;
}

.nav_link-wrap {
  justify-content: center;
  display: flex;
}

.container-large-4 {
  width: 100%;
  max-width: 80rem;
  margin-left: auto;
  margin-right: auto;
}

.padding-section-medium {
  padding-top: 20px;
  padding-bottom: 20px;
}

.search-wrapper {
  width: 100%;
  position: relative;
}

.faq-tab-pane {
  width: 100%;
  margin-top: 2rem;
  padding-top: 5rem;
}

.footer-bottom_links {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: auto auto;
  grid-auto-columns: 1fr;
  display: none;
}

.footer4_links {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  align-items: center;
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 0;
  text-decoration: none;
  list-style-type: none;
  display: flex;
}

.footer4_component {
  grid-column-gap: 4rem;
  grid-row-gap: 2rem;
  grid-template-rows: auto;
  grid-template-columns: 1fr;
  grid-auto-columns: auto;
  justify-content: space-between;
  align-items: center;
  justify-items: center;
  display: grid;
}

.heading-3.serif-font {
  text-align: center;
  font-family: Merriweather, serif;
}

.faq-form {
  width: 100%;
  flex-direction: column;
  align-items: center;
  padding-bottom: 1rem;
  padding-left: 0;
  padding-right: 0;
  display: flex;
}

.section_footer {
  background-color: #19191a;
  margin-top: 0;
}

.empty-state {
  background-color: #f7f5f5;
}

.faq_contact-section {
  height: auto;
  background-color: #fafaf4;
  border: 0 #000;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: block;
  position: relative;
  overflow: visible;
}

.background-image {
  width: 100%;
  height: 65vh;
  background-image: none;
  background-repeat: repeat;
  background-size: auto;
  background-attachment: scroll;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.background-image.not-fixed {
  height: auto;
  background-image: url('/img/help/help-background.jpg');
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.background-image.not-fixed.faq {
  width: auto;
  height: 60vh;
  opacity: .38;
  background-color: #000;
  background-image: url('/img/help/help-background.jpg');
  background-position: 0 0;
  background-size: cover;
  flex-direction: row;
  justify-content: flex-end;
  align-items: flex-end;
  display: flex;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
  overflow: hidden;
}

.faq-types-wrapper-grid {
  z-index: 3;
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: minmax(0, 1fr);
  grid-auto-columns: 1fr;
  margin-top: 20px;
  margin-bottom: -5rem;
  display: grid;
  position: relative;
}

.global-styles {
  display: block;
  position: fixed;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.image-small {
  width: 40%;
}

.reset-button-wrapper {
  justify-content: flex-end;
  display: flex;
}

.image-holder {
  width: 100%;
  height: 100%;
  clear: none;
  object-fit: fill;
  flex-direction: column;
  order: 0;
  justify-content: center;
  align-self: auto;
  align-items: center;
  display: flex;
  position: relative;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.image-holder.faq {
  justify-content: flex-end;
  align-items: flex-end;
  position: static;
}

.search-field {
  width: 100%;
  height: 3.5rem;
  border: 1px solid #a4a5a7;
  border-radius: 0;
  margin-bottom: 0;
}

.search-field.text-size-medium {
  border-color: #09c;
  border-radius: 5px;
  padding-left: 3.2rem;
  padding-right: 3.2rem;
}

.footer4_logo-link {
  color: #030013;
  text-decoration: none;
}

.margin-top {
  margin-bottom: 0;
  margin-left: 0;
  margin-right: 0;
}

.margin-top.margin-small {
  justify-content: center;
  display: flex;
}

.icon-1x1-medium-4 {
  width: 1rem;
  height: 1rem;
  color: #ececec;
}

.faq-collection-item {
  border-bottom: 1px solid #dbd7ce;
  justify-content: space-between;
  align-items: flex-end;
  margin-top: 0;
  padding: 0;
  display: flex;
}

.text-size-regular {
  font-size: 1rem;
}

.faq-radio-button {
  z-index: 1;
  width: 100%;
  height: auto;
  cursor: pointer;
  border-style: none;
  border-radius: 5%;
  margin: 0;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.faq-radio-button:hover {
  color: #09c;
  -webkit-text-stroke-width: 1px;
  border-color: #09c;
}

.faq-radio-button.w--redirected-checked {
  background-color: rgba(235, 231, 231, .46);
  border-width: 2px;
  border-color: #311a0b;
  border-radius: 8%;
}

.heading-2 {
  align-self: auto;
  margin-right: 1rem;
}

.heading-2.serif-font {
  font-family: Merriweather, serif;
  font-weight: 900;
}

.heading-2.serif-font.text-align-center {
  text-align: center;
  font-family: Josefin Sans, sans-serif;
  font-size: 38px;
  font-weight: 600;
  line-height: 40px;
}

.main-wrapper {
  padding-top: 5px;
}

.nav_logo-link {
  width: 8rem;
}

.radio-text {
  text-align: center;
  flex: 1;
  margin-top: 20px;
  margin-bottom: 0;
  font-size: 1rem;
  text-decoration: none;
}

.icon-7 {
  width: 24px;
  height: 24px;
  color: #817e7e;
  justify-content: center;
  align-items: center;
  display: flex;
}

.text-block-23 {
  color: #fff;
  font-size: 1.5rem;
  font-weight: 500;
}

.collection-list-2 {
  margin-top: 1rem;
}

.footer-bottom {
  border-top: 1px solid #000;
  justify-content: space-between;
  align-items: center;
  padding-top: 1rem;
  padding-bottom: 1rem;
  display: flex;
}

.footer-bottom.text-size-small {
  border-top-color: #fff;
}

.padding-global {
  padding-left: 2.5rem;
  padding-right: 2.5rem;
}

.padding-section-small {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.contact-block {
  background-color: #eee;
  border: 1px solid #a4a5a7;
  flex-direction: column;
  align-items: center;
  padding: 1.5rem;
  display: flex;
}

.logo-text {
  color: #fff;
  font-size: 1.5rem;
  font-weight: 500;
}

.logo-text.black {
  color: #2b2b2c;
}

.logo-text.big-orange {
  color: #f60;
  -webkit-text-stroke-color: orange;
  text-transform: none;
  font-size: 1.4rem;
  line-height: 1.3em;
}

.link-3 {
  color: #f3f3f3;
  text-decoration: none;
}

.link-3:hover {
  color: silver;
}

.icon-1x1-large {
  width: 3rem;
  height: 3rem;
}

.faq-type-item {
  width: 100%;
  height: 100%;
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  background-color: rgba(245, 245, 245, 0.3) !important;
  border: 1px solid #09c;
  border-radius: 10px;
  flex-flow: column;
  justify-content: space-between;
  align-items: center;
  margin-right: 0;
  padding: .15rem 1rem 1.5rem;
  display: flex;
  position: relative;
    transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease, color .2s ease;
}

.faq-type-item:hover {
  background-color: rgba(245, 245, 245, 0.6) !important;
  border-color: #F8A504;
  box-shadow: 0 8px 24px 0 rgba(248,165,4,0.18), 0 0 24px 8px rgba(248,165,4,0.25);
  color: #000000;
  font-weight: 700;
}

.faq-type-item.w--current {
  color: #222121;
  background-color: rgba(245, 245, 245, 0.6);
}

.faq-type-item.w--current:hover {
  background-color: rgba(245, 245, 245, 0.6);
}

.timings-grid {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  grid-template-rows: auto;
  grid-template-columns: 1fr .25fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: space-around;
  align-items: center;
  margin-bottom: 1rem;
  display: flex;
}

.margin-bottom {
  margin-top: 0;
  margin-left: 0;
  margin-right: 0;
}

.faq-form-wrapper {
  z-index: 2;
  width: 100%;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.padding-vertical {
  padding-left: 0;
  padding-right: 0;
}

.line-vertical {
  width: 1px;
  height: 5rem;
  background-color: #dbd7ce;
}

.faq_search-section {
  z-index: 2;
  position: relative;
}

.footer4_socials-wrapper {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  color: #000;
  flex-direction: row;
  grid-template-rows: auto;
  grid-template-columns: auto auto auto auto auto;
  grid-auto-columns: auto;
  grid-auto-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.container-small {
  width: 100%;
  max-width: 48rem;
  margin-left: auto;
  margin-right: auto;
}

.nav_link {
  color: #313030;
  white-space: nowrap;
  border: 1px #030013;
  border-radius: 20px;
  padding: .5rem 1rem;
  transition: all .2s;
}

.nav_link:hover {
  color: #191919;
  background-color: #f7f5f5;
  border-style: none;
  border-color: #fff;
  padding: .5rem 1.5rem;
  font-style: normal;
  text-decoration: none;
}

.text-color-white-2 {
  color: #e0e0e0;
}

.image-4 {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: inline-block;
}

.image-4.contain {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.text-block-24 {
  color: #fff;
  font-size: 1.5rem;
  font-weight: 500;
}

.link-4 {
  color: #f3f3f3;
  text-decoration: none;
}

.link-4:hover {
  color: silver;
}

.image-5 {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: inline-block;
}

.image-5.contain {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.cta-float {
  z-index: 3000;
  float: left;
  clear: none;
  text-align: center;
  width: 100px;
  margin-left: auto;
  margin-right: auto;
  position: fixed;
  bottom: 10px;
  left: 10px;
}

.cta-float.right {
  float: right;
  top: auto;
  bottom: 10px;
  left: auto;
  right: 10px;
}

.photo-rounded {
  border: 1px none var(--white);
  border-radius: 20px;
  width: 75%;
  height: 75%;
  margin-top: 30px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.blockquote {
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.h1-pro24 {
  box-shadow: none;
  color: #333;
  margin-top: 0;
  margin-bottom: 0;
  padding-right: 10px;
}

.text-pro24 {
  box-shadow: none;
  margin-top: 25px;
  margin-bottom: 20px;
  font-family: Open Sans, sans-serif;
  font-size: 20px;
  font-weight: 300;
  line-height: 1.3em;
}

.text-pro24.boldblue {
  color: #09c;
  font-weight: 400;
}

.text-pro24.right-para {
  color: #333;
  text-align: center;
  overflow-wrap: normal;
  background-color: #0000;
  border: 3px solid #7da6c7;
  border-radius: 10px;
  flex: 0 auto;
  align-self: auto;
  width: auto;
  height: 78%;
  margin: 0;
  padding: 40px 20px 20px;
  font-size: 20px;
}

.text-pro24.right-para.big {
  color: #7da6c7;
  border-style: none;
  border-radius: 0;
  font-size: 26px;
  font-weight: 700;
}

.text-pro24.right-para.big.benefit {
  justify-content: flex-start;
  min-height: 70px;
  padding: 0 10px;
}

.text-pro24.right-para.guarantee {
  padding-top: 25px;
  padding-bottom: 35px;
}

.text-pro24.center {
  text-align: center;
  min-height: 140px;
  margin-top: 10px;
  margin-bottom: 0;
}

.pro24-cta {
  background-color: #fff;
  color: #333;
  text-align: center;
  -webkit-text-stroke-color: #888;
  border: 1px solid #999;
  border-radius: 8px;
  width: 100%;
  margin-top: 10px;
  font-family: Muli, sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 25px;
}

.pro24-cta:hover {
  mix-blend-mode: darken;
  border-style: solid;
}

.pro24-cta:active, .pro24-cta:focus {
  box-shadow: none;
  border: 2px #6ad613;
  padding-top: 10px;
  padding-bottom: 10px;
  font-weight: 600;
}

.pro24-cta:focus-visible {
  outline-offset: 0px;
  border-width: 2px;
  outline: 3px #09c;
  padding-top: 10px;
  padding-bottom: 10px;
  font-weight: 600;
}

.pro24-cta[data-wf-focus-visible] {
  outline-offset: 0px;
  border-width: 2px;
  outline: 3px #09c;
  padding-top: 10px;
  padding-bottom: 10px;
  font-weight: 600;
}

.pro24-cta:visited {
  mix-blend-mode: darken;
}

.pro24-cta.large {
  margin-bottom: 100px;
}

.pro24-cta.now.cta {
  color: #666;
  padding: 5px 2px;
  font-size: 14px;
  line-height: 18px;
  box-shadow: 0 0 5px 1px #0006;
}

.pro24-cta.now.cta:hover {
  border-color: red;
}

.pro24-cta.now.cta.right {
  box-shadow: 0 0 5px 1px #0006;
}

.pro24-cta.ms {
  color: #fff;
  -webkit-text-stroke-color: #7da6c7;
  background-image: linear-gradient(#7da6c7, #7da6c7);
  border-width: 3px;
  border-color: #7da6c7;
  margin-bottom: 7px;
}

.pro24-cta.ms:hover {
  color: #7da6c7;
  background-image: linear-gradient(#fff, #fff);
  border-width: 3px;
}

.pro24-cta.ms.center {
  color: #000;
  text-align: center;
  -webkit-text-stroke-color: #73e5a1;
  background-image: linear-gradient(#73e5a1, #73e5a1);
  border-color: #73e5a1;
  width: 35%;
}

.pro24-cta.ms.center:hover {
  color: #73e5a1;
  background-image: linear-gradient(#fff, #fff);
}

.pro24-cta.ms.center.orange {
  color: #fff;
  -webkit-text-stroke-color: white;
  background-image: linear-gradient(orange, orange);
  border-color: orange;
  margin-top: 80px;
  margin-bottom: 0;
}

.pro24-cta.ms.center.orange:hover {
  color: orange;
  background-image: linear-gradient(#fff, #fff);
}

.div-block-40 {
  border: 5px solid orange;
  border-top-width: 4px;
  border-radius: 8px;
}

.pro24-section-image {
    position: relative;
    border: solid 1px #999;
    border-radius: 20px;
    margin-top: 15px;
    margin-left: 15px;
    margin-right: 15px;
    overflow: hidden;            /* clip to rounded corners */
    isolation: isolate;          /* keep negative z-index layers inside */
}

/* Background image layer (behind everything) */
.pro24-section-image::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url('/img/pro-image.jpg') center/cover no-repeat;
    z-index: -2;
}

/* White tint overlay (above image, below content) */
.pro24-section-image::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.1); /* adjust 0.3–0.8 to taste */
    z-index: -1;
}

/* Ensure inner content stays above background + overlay */
.pro24-section-image > * {
    position: relative;
    z-index: 0;
}

.pro24-section-color {
  background-color: #A8EAD3;
  border-radius: 20px;
  margin-top: -13px;
  margin-left: 15px;
  margin-right: 15px;
}

.pro24-section-color.yellow {
  background-color: #fdf4df;
  border: 1px solid #999;
  margin-top: 0;
  margin-bottom: 60px;
}

.pro24-section-color.blue {
  background-color: #7da6c73d;
  border: 1px solid #999;
  margin-top: 0;
  margin-bottom: 40px;
  padding-bottom: 50px;
}

.div-block-41 {
  clear: none;
  aspect-ratio: auto;
  object-fit: fill;
  width: 110%;
  display: flex;
  position: static;
  overflow: visible;
}

.pro24-vid-rounded {
  border: 1px solid #999;
  border-radius: 10px;
  overflow: hidden;
}

.hero-video-link-block {
  justify-content: center;
  align-items: center;
  height: 100%;
  margin-left: 20px;
  margin-right: 20px;
  display: flex;
}

.marquee-wrapper {
  width: 200%;
  display: flex;
}

.marquee-div {
  flex-direction: row;
  flex: 0 auto;
  justify-content: space-between;
  align-items: stretch;
  width: 50%;
  display: flex;
}

.card-2 {
  flex: 1;
  justify-content: center;
  align-items: center;
  height: 500px;
  margin-left: 20px;
  margin-right: 20px;
  display: block;
}

.video-slider {
  background-color: #0000;
  margin-top: 10px;
  overflow: hidden;
}

.hero-video-filter {
  opacity: .5;
  background-color: #ffbf00;
  border-radius: 30px;
  width: 100%;
  height: 100%;
  transition: opacity .2s, background-color .725s cubic-bezier(.165, .84, .44, 1);
}

.hero-video-filter:hover {
  background-color: #0000;
}

.hero-video-filter.slider-2 {
  opacity: .75;
  background-color: #b4cffb;
}

.hero-video-filter.slider-2:hover {
  opacity: 0;
}

.hero-video-filter.slider1 {
  opacity: .75;
  -webkit-text-fill-color: inherit;
  background-color: #b4cffb;
  background-clip: border-box;
}

.hero-video-filter.slider1 {
  opacity: .75;
  -webkit-text-fill-color: inherit;
  background-color: #b4cffb00;
  background-clip: border-box;
  border-radius: 10px;
  width: 320px;
  height: 180px;
}

.hero-video-filter.slider1:hover {
  opacity: 0;
}

.hero-video {
  border-radius: 30px;
  width: 100%;
  height: 437px;
  transition: height .725s cubic-bezier(.165, .84, .44, 1);
  overflow: hidden;
}

.hero-video:hover {
  height: 100%;
}

.marquee-div-2 {
  flex-direction: row;
  flex: 0 auto;
  justify-content: space-between;
  align-items: stretch;
  width: 100%;
  max-width: 2000px;
  height: 225px;
  display: flex;
}

.card-3 {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 320px;
  height: 180px;
  margin: 0 20px 20px;
  display: block;
}

.hero-video-link-block-2 {
  justify-content: center;
  align-items: center;
  width: 320px;
  height: 100%;
  margin-left: 20px;
  margin-right: 20px;
  display: flex;
}

.hero-video-2 {
  border: 1px solid #999;
  border-radius: 10px;
  width: 320px;
  height: 180px;
  transition: height .725s cubic-bezier(.165, .84, .44, 1);
  overflow: hidden;
}

.hero-video-2:hover {
  height: 100%;
}

.text-stream-name {
  margin-top: 5px;
  margin-left: 40px;
}

.image-paragraph {
  margin-top: 10px;
  margin-bottom: 60px;
  display: flex;
}

.ms-60 {
  width: 60%;
}

.ms-60._40 {
  flex-flow: column;
  order: 0;
  width: 40%;
  display: flex;
}

.ms-60.center {
  text-align: left;
  align-self: center;
  margin-bottom: 30px;
  padding-left: 60px;
}

.benefits {
  justify-content: center;
  align-items: stretch;
  display: flex;
}

.benefit {
  flex-flow: column;
  flex: 1;
  justify-content: center;
  align-self: center;
  width: 33%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
}

.benefit-icon {
  align-self: center;
  margin-top: 20px;
  margin-bottom: 10px;
}

.line-spacer {
  background-color: #7ca6c6;
  height: 1px;
  margin-bottom: 60px;
  margin-left: 40px;
  margin-right: 40px;
}

.container-center {
  text-align: center;
  margin-top: -30px;
  margin-bottom: 60px;
}

.text-page-menu.page.white {
  letter-spacing: 2px;
  margin-top: 3px;
  font-family: Open Sans, sans-serif;
  font-weight: 600;
}

.text-page-menu.page.white.zh {
  letter-spacing: 0;
}

.text-page-menu.white {
  color: #fff;
  text-align: right;
  text-transform: uppercase;
  max-width: 50px;
  padding-bottom: 0;
  font-family: Open Sans, sans-serif;
  font-size: 17px;
  font-weight: 600;
  line-height: 24px;
  text-decoration: none;
}

.text-page-menu.white.zh {
  text-align: center;
}

.page-menu.white {
  order: 1;
  align-self: center;
  margin-bottom: 2px;
  display: block;
}

.page-menu-dot.white {
  background-color: #fff;
  border-radius: 50%;
  width: 8px;
  height: 8px;
}

.page-menu-dot-div.white {
  flex-flow: column wrap;
  justify-content: space-around;
  align-items: flex-end;
  width: 10px;
  margin-top: 2px;
  margin-bottom: 1px;
  margin-right: 8px;
  padding-top: 4px;
  padding-bottom: 4px;
  display: flex;
}

.nav-popup-pro {
  z-index: 9998;
  opacity: 1;
  text-align: center;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  min-height: auto;
  padding-top: 0;
  padding-bottom: 0;
  padding-right: 0;
  display: none;
  position: fixed;
  inset: 0;
}

.pro-banner-section {
  justify-content: center;
  align-self: center;
  align-items: center;
  width: 940px;
  display: flex;
}

.cell {
  align-items: center;
}

.cell-2 {
  flex-flow: row;
  flex: 0 auto;
  order: 0;
  align-self: auto;
  align-items: center;
  min-height: 80px;
  padding-top: 20px;
  padding-left: 20px;
  display: flex;
}

.cell-2.center {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  justify-content: center;
  padding-bottom: 20px;
  padding-left: 0;
}

.column-infographic {
  flex-flow: column;
  justify-content: flex-end;
  align-items: flex-start;
  padding-top: 20px;
  display: flex;
}

.column-infographic.wave {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  text-align: center;
  object-fit: fill;
  justify-content: flex-end;
  align-items: center;
  padding-left: 60px;
  padding-right: 60px;
}

.column-infographic.tide {
  align-items: center;
}

.inforgraphic-tide {
  display: flex;
}

.help-how-pro-helps-popup, .help-how-pro-helps-popup, .help-read-forecast-popup, .help-infographic-popup, .help-read-report-popup, .help-multi-spot-popup, .help-stream-offline-popup, .help-view-streams-popup, .help-view-forecast-popup, .help-login-issue-popup, .help-logout-issue-popup, .help-purchase-pro-popup, .help-account-share-popup, .help-cancel-sub-popup, .help-guarantee-popup, .help-discount-popup, .help-referral-popup, .help-billing-popup, .help-pay-method-popup, .help-how-purchase-popup, .help-which-plan-popup, .help-travel-popup, .help-afterbuy-popup, .help-easy-popup, .help-reliable-popup, .help-why-popup, .help-how-contact-popup, .help-advertise-popup, .help-biz-popup, .help-host-popup, .help-swelleye-helps-popup, .help-cleanup-popup, .help-host-cleanup-popup, .help-protect-popup, .help-donate-popup, .help-about-popup, .help-mission-purpose-promise-popup, .help-services-popup, .help-new-cam-popup {
  z-index: 9998;
  text-align: center;
  height: 100%;
  padding-top: 0;
  padding-bottom: 0;
  padding-right: 0;
  display: none;
  position: fixed;
  inset: 0;
}

.help-page-popup-div {
  z-index: 1;
  background-image: linear-gradient(#fff, #fff);
  border: 1px solid #09c;
  border-radius: 15px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 960px;
  max-height: 98%;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 0;
  padding-left: 10px;
  padding-right: 5px;
  display: block;
  position: fixed;
  top: 50%;
  left: 0;
  right: 0;
  overflow: scroll;
  transform: translate(0, -50%);
}

.social-icons {
  clear: none;
  grid-column-gap: 50px;
  grid-row-gap: 50px;
  flex: 1;
  justify-content: center;
  align-items: center;
  padding-left: 0;
  display: flex;
}

/* Base help button: same style language as .faq-type-item, fixed 40x40 */
.help-button {
  z-index: 9998;
  position: fixed;
  inset: auto 5px 5px auto;

  /* size locked */
  width: 40px;
  height: 40px;
  min-width: 40px;
  min-height: 40px;

  /* visual styling aligned with .faq-type-item */
  background-color: rgba(245, 245, 245, 0.85) !important;
  border: 2px solid #09c;
  border-radius: 10px;

  /* subtle layout */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;

  /* transitions like .faq-type-item */
  transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease, color .2s ease;
}

.help-button:hover {
  background-color: rgba(245, 245, 245, 0.6) !important;
  border-color: #F8A504;
  box-shadow: 0 8px 24px 0 rgba(248,165,4,0.18), 0 0 24px 8px rgba(248,165,4,0.25);
  color: #000000;
  font-weight: 700; /* applies if there’s text inside */
}

/* Optional "current" state parity */
.help-button.w--current {
  color: #222121;
  background-color: rgba(245, 245, 245, 0.6);
}
.help-button.w--current:hover {
  background-color: rgba(245, 245, 245, 0.6);
}

/* Inner elements — keep readable within 40x40 */
.help-button-text {
  color: #000;
  background-color: transparent;
  border: 0;
  border-radius: 0;
  font-size: 1.5rem;       /* reduced to fit 40x40 comfortably */
  line-height: 1;        /* tighter line-height */
  text-decoration: none;
  text-align: center;
}

.help-button:hover .help-button-text {
  color: #F8A504;           /* match hover color scheme */
  font-weight: 700;
}

.help-button-question {
  color: #09c;           /* harmonize with border color */
  font-size: 1.5rem;
  line-height: 1;
  text-align: center;
}

.help-button:hover .help-button-question {
  color: #F8A504;           /* align with hover text color */
}

/* Create tooltip bubble */
.help-button::after {
  content: attr(data-tooltip);
  position: absolute;
  bottom: 100%;          /* place above the button */
  right: 0;              /* align to the right edge of the button */
  transform: translateY(-8px);
  white-space: nowrap;

  /* visual style to match .faq-type-item language */
  background: rgba(245, 245, 245, 0.95);
  color: #09c;
  border: 1px solid #09c;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 0.875rem;
  line-height: 1.2;
  box-shadow: 0 8px 24px 0 rgba(248,165,4,0.18), 0 0 24px 8px rgba(248,165,4,0.25);

  opacity: 0;
  pointer-events: none;
  transition: opacity .15s ease, transform .15s ease;
  z-index: 9999;
}

/* Small arrow */
.help-button::before {
  content: "";
  position: absolute;
  bottom: 100%;
  right: 10px;           /* arrow x-position relative to tooltip */
  transform: translateY(0);
  border-width: 6px;
  border-style: solid;
  border-color: transparent transparent rgba(245, 245, 245, 0.95) transparent;

  opacity: 0;
  transition: opacity .15s ease;
  z-index: 9999;
}

/* Show on hover/focus-visible for accessibility */
.help-button:hover::after,
.help-button:focus-visible::after,
.help-button:hover::before,
.help-button:focus-visible::before {
  opacity: 1;
  transform: translateY(-12px); /* subtle rise animation for ::after */
}

html.w-mod-js *[data-ix="dropdown-list"] {
    height: 0px;
}

html.w-mod-js *[data-ix="accordian-open-close-footer-links"] {
    display: none;
    height: 0px;
}

html.w-mod-js *[data-ix="pro-form-closed"] {
    display: none;
}

html.w-mod-js *[data-ix="infographic-popup"] {
    display: none;
    opacity: 0;
    -webkit-transform: scale(1.1, 1.1);
    -ms-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1);
}

html.w-mod-js *[data-ix="feedback-popup"] {
    display: none;
    opacity: 0;
    -webkit-transform: scale(1.1, 1.1);
    -ms-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1);
}

html.w-mod-js *[data-ix="vid-arrow-hover"] {
    display: block;
    opacity: 0.3000000000000003;
}

html.w-mod-js *[data-ix="preloader-interaction"] {
    display: block;
}

html.w-mod-js *[data-ix="forecast-preloader"] {
    display: block;
}

html.w-mod-js *[data-ix="display-none-on-load"] {
    display: none;
}

html.w-mod-js *[data-ix="pro-cta-scroll"] {
    opacity: 0;
    -webkit-transform: translate(-2000px, 0px);
    -ms-transform: translate(-2000px, 0px);
    transform: translate(-2000px, 0px);
}

html.w-mod-js [data-ix="delay-cam-sub-overlay"] {
    opacity: 0;
    display: none;
}

html.w-mod-js [data-ix="help-name-fade-in"] {
    opacity: 0;
}

html.w-mod-js [data-ix="cta-float-load"] {
    opacity: 0;
    display: block;
}

html.w-mod-js [data-ix="navad-fade-in"] {
    opacity: 0;
    display: none;
}

.stream-img {
    width: 50vw;
}


.faq-type-item {
    width: 100%;
    height: 100%;
    display: flex;
    position: relative;
    flex-flow: column;
    justify-content: space-between;
    align-items: center;

    grid-column-gap: .5rem;
    grid-row-gap: .5rem;

    margin-right: 0;
    padding: .15rem 1rem 1.5rem;

    background-color: rgba(245, 245, 245, 0.3) !important;
    border: 1px solid #0099cc;
    border-radius: 10px;

    color: inherit;
    transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease, color .2s ease;
}

.faq-type-item:hover {
    background-color: rgba(245, 245, 245, 0.6) !important;
    border-color: #F8A504;
    box-shadow: 0 8px 24px 0 rgba(248,165,4,0.18), 0 0 24px 8px rgba(248,165,4,0.25); /* outer glow */
    color: #000000;
    font-weight: 700;
}

.faq-type-item a { color: inherit; }
.faq-type-item:hover a { color: inherit; font-weight: 700; }


.faq-type-item.w--current {
    color: #222121;
    background-color: rgba(245, 245, 245, 0.6);
}
.faq-type-item.w--current:hover {
    background-color: rgba(245, 245, 245, 0.6);
    color: #0099cc;
}

.faq-type-item svg { fill: currentColor; }
.faq-type-item:hover svg { fill: currentColor; }

.search-card {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;

    background-color: rgba(245, 245, 245, 0.3);
    border: 1px solid #0099cc;
    border-radius: 10px;
    padding: .15rem 1rem .75rem;

    color: #222121;
    transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease, color .2s ease;
}

.search-card:hover {
    background-color: rgba(245, 245, 245, 0.6);
    border-color: #F8A504;
    box-shadow: 0 8px 24px 0 rgba(248,165,4,0.18), 0 0 24px 8px rgba(248,165,4,0.25);
    color: #000000;
    font-weight: 700;
}

.search-card .gsc-control-cse,
.search-card .gsc-control-wrapper-cse {
    width: 100% !important;
    max-width: 100% !important;
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding-top: 7px;
    padding-bottom: 0px;
}

/* Search box row (Google often uses a table) */
.search-card table.gsc-search-box,
.search-card table.gsc-search-box td {
  width: 100% !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
}

/* Input and its wrappers: transparent and inherit color */
.search-card input.gsc-input,
.search-card .gsc-input-box,
.search-card .gsc-input-box-hover,
.search-card .gsc-input-box-focus {
  background: transparent !important;
  border: 0 !important;
  color: inherit;
  font-size: 18px;
  padding: 8px 0;
  box-shadow: none !important;
}

/* Remove inner border Google sometimes adds */
.search-card .gsc-input-box { border: 0 !important; }

/* Button and icon follow text color */
.search-card .gsc-search-button-v2,
.search-card .gsc-search-button-v2:hover,
.search-card .gsc-search-button-v2:focus {
  background: transparent !important;
  border: 0 !important;
  color: inherit;
  padding: 6px 8px;
  box-shadow: none !important;
  cursor: pointer;
}
.search-card .gsc-search-button-v2 svg {
  width: 22px;
  height: 22px;
  fill: currentColor;
}

/* Results wrappers: keep full width and transparent if present */
.search-card .gsc-results-wrapper-overlay,
.search-card .gsc-results-wrapper-visible {
  width: 100% !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* If Google injects an extra parent around .gsc-control-cse, force it full width */
.search-card > div:has(.gsc-control-cse) {
  width: 100% !important;
  max-width: 100% !important;
}

/* Accessibility: restore clear focus outlines for keyboard users */
.search-card input.gsc-input:focus-visible,
.search-card .gsc-search-button-v2:focus-visible {
  outline: 2px solid #0099cc;
  outline-offset: 2px;
}

@media screen and (min-width: 1920px) {
    .stream-image.vids.pro24 {
        border-style: none;
        overflow: hidden;
    }

    .stream-div.tabphland.cam.vid.pro.pro24 {
        border-radius: 7px;
        align-self: flex-end;
        width: 100%;
        padding-top: 30px;
    }
    
    .premium-form-section.pro {
        margin-top: 80px;
    }
    
    .faq_contact-section {
        height: auto;
    }
    
    ._3-4-tw-text.donate {
        filter: drop-shadow(1px 1px 1px #000000b3);
        margin-bottom: 0;
    }

    .footer-image._3-percent {
        background-image: linear-gradient(0deg, #00000059 10%, #fff3), url('/img/3-4-tw-banner.jpg');
        background-position: 0 0, 50%;
        background-repeat: repeat, no-repeat;
        background-size: auto, cover;
        flex-flow: column;
        justify-content: space-between;
        align-items: center;
        padding-bottom: 30px;
        display: flex;
  }
    
    .icon-div.pro.banner {
        clear: none;
        text-align: left;
        flex-flow: row;
        flex: 0 auto;
        order: 0;
        justify-content: flex-start;
        align-self: auto;
        text-decoration: none;
        display: flex;
  }
    
    .donate3 {
        background-image: linear-gradient(#00000059 10%, #fff3), url('/img/3-4-tw-banner.jpg');
        background-position: 0 0, 50%;
        background-repeat: repeat, no-repeat;
        background-size: auto, cover;
    }

    .heading-donate {
        filter: drop-shadow(1px 1px 1px #000000b3);
    }
    
  .blockquote {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
    display: block;
  }
    
  .pro24-cta.ms.center.orange {
    color: #fff;
    -webkit-text-stroke-color: white;
    background-image: linear-gradient(orange, orange);
    border-color: orange;
    margin-top: 90px;
    margin-bottom: 0;
  }

  .pro24-cta.ms.center.orange:hover {
    color: orange;
    background-image: linear-gradient(#fff, #fff);
  }
    
  .div-block-41 {
    border-radius: 1px;
  }

  .pro24-vid-rounded {
    border: 1px solid #999;
    border-radius: 10px;
    overflow: hidden;
  }

  .hero-video-link-block {
    height: 180px;
    padding-top: 20px;
  }

  .marquee-wrapper {
    height: 210px;
  }

  .card-2 {
    height: 200px;
  }

  .video-slider {
    background-color: #fff;
  }

  .hero-video-filter.slider1 {
    opacity: 1;
    background-color: #fff0;
    border: 1px solid #999;
    border-radius: 10px;
    height: 180px;
    transition-property: none;
  }

  .hero-video {
    border-radius: 10px;
    width: 320px;
    height: 180px;
  }

  .card-3 {
    margin-top: 0;
  }

  .text-stream-name {
    margin-top: 5px;
    margin-left: 40px;
    font-family: Open Sans, sans-serif;
    font-size: 18px;
  }
    
  .text-page-menu.page.white {
    text-align: left;
    letter-spacing: 0;
    max-width: 50px;
  }

  .text-page-menu.white {
    color: #fff;
    text-align: right;
    text-transform: uppercase;
    max-width: 50px;
    font-family: Open Sans, sans-serif;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    display: block;
  }

  .page-menu.white {
    direction: ltr;
    flex: 0 auto;
    order: 1;
    align-self: center;
    text-decoration: none;
  }

  .page-menu-dot.white {
    background-color: #fff;
    border-radius: 50%;
    width: 8px;
    height: 8px;
    padding-bottom: 0;
    padding-right: 0;
  }

  .page-menu-dot-div.white {
    direction: ltr;
    flex-flow: column wrap;
    justify-content: space-around;
    align-items: flex-end;
    width: 10px;
    margin-right: 8px;
    padding-top: 4px;
    padding-bottom: 4px;
    text-decoration: none;
    display: flex;
  }
}

@media (min-width: 479px) and (max-width: 991px) {
    /* To prevent mobile landscape translate the X location */
    .card-slide.my-multi {
        transform: translateX(0px) !important; 
    }
}

@media (max-width: 991px) {

    .middle-wrapper.logo-center {
        width: 19%;
    }

    .flex-parent-plug-ban {
        padding-top: 0px;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .section-2.info {
        margin-top: 50px;
    }

    .heading-info.streaming {
        padding-top: 15px;
    }

    .heading-info.about {
        font-size: 24px;
        text-align: center;
    }

    .heading-info.about.center.my-multi {
        margin-top: 10px;
        margin-bottom: 5px;
    }

    .heading-info.pro {
        padding-right: 20px;
        padding-left: 20px;
    }

    .heading-info.pro.payment {
        padding-right: 5px;
        padding-left: 5px;
    }

    .heading-info.pro.payment.bk {
        padding-right: 5px;
        padding-left: 5px;
        text-align: center;
    }

    .heading-info.pro.payment.ref {
        width: 185px;
    }

    .text-info {
        padding-right: 20px;
        padding-left: 20px;
        color: hsla(0, 0%, 47%, 0.8);
        font-size: 20px;
        font-weight: 300;
    }

    .text-info.stream {
        cursor: pointer;
    }

    .text-info.stream.pro {
        cursor: default;
    }

    .text-info.ad.right {
        padding-right: 75px;
    }

    .text-info.ad.pro {
        padding-right: 15px;
        padding-left: 15px;
    }

    .text-info.ad.pro.border {
        margin-bottom: 15px;
    }

    .button-cta.button-map {
        font-weight: 600;
    }

    .button-cta.button-map.button-map-tablet {
        margin-bottom: 40px;
    }

    .button-cta.button-map.button-map-tablet.button-map-phone-port.cs {
        bottom: 10px;
    }

    .section-hosts.section-hosts-mobile {
        display: block;
        max-width: 85%;
        margin: 100px auto;
        text-align: center;
    }

    .section-hosts.section-hosts-mobile.multi {
        max-width: 100%;
    }

    .flex-child-plugspon {
        padding-right: 8px;
        padding-left: 8px;
        -webkit-box-flex: 33%;
        -webkit-flex: 33%;
        -ms-flex: 33%;
        flex: 33%;
    }

    .sponsor-image {
        margin-right: 0px;
        margin-left: 0px;
    }

    .heading-1.hero-text {
        font-size: 30px;
    }

    .heading-1.hero-text.cs {
        bottom: 75px;
    }

    .heading-1.blog {
        padding-left: 20px;
    }

    .container {
        margin-bottom: -195px;
    }

    .container.en {
        top: 135px;
        margin-bottom: -320px;
    }

    .container.ja {
        top: 150px;
        margin-bottom: -290px;
    }

    .container.en-home {
        margin-bottom: -225px;
    }

    .map-text-button-overlay-wrap {
        margin-top: 10px;
    }

    .video-flex-parent {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .video-flex-parent.cam.blog-related {
        width: 85%;
    }

    .video-flex-parent.pro.no-trial {
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
    }

    .button-more-vids.cancel {
        width: 50%;
    }
    
    .icon-div.pro.banner {
        margin-right: 10px;
    }

    .button-more-vids.cancel:hover {
        padding-top: 30px;
        padding-bottom: 22px;
        border-width: 1px;
    }

    .button-more-vids.cancel.sub {
        width: 33%;
    }

    .button-more-vids.cancel.sub:hover {
        width: 33%;
        border-width: 1px;
    }

    .button-more-vids.cancel.sub.try-pro {
        margin-right: 0px;
    }

    .button-more-vids.cancel.sub.try-pro:hover {
        width: auto;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        background-color: transparent;
        color: orange;
    }

    .text-tabs {
        font-weight: 600;
    }

    .slider.wk-wave-vid {
        width: 100%;
    }

    .icon.phone-land-arrow.phone-port-arrow.desktop-arrow.port-arrow {
        margin-left: 0px;
        font-size: 36px;
    }

    .icon.desktop-arrow.port-arrow {
        font-size: 36px;
    }

    .icon-2.phone-land-arrow.phone-port-arrow.desktop-arrow.port-arrow {
        font-size: 36px;
    }

    .icon-2.desktop-arrow.port-arrow {
        font-size: 36px;
    }

    .flex-parent-tabs-plug {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: auto;
        margin-right: auto;
        margin-left: auto;
        text-align: left;
    }

    .footer {
        padding-bottom: 0px;
    }

    .footer-flex {
        margin-right: 50px;
        margin-left: 50px;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .footer-col {
        padding-right: 0px;
        padding-left: 0px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .footer-col.social {
        padding-left: 0px;
    }

    .footer-links-wrap {
        margin-bottom: 0px;
    }

    .footer-title {
        font-size: 20px;
    }

    .footer-link {
        -webkit-transition-property: none;
        transition-property: none;
        font-size: 17px;
    }

    .footer-link:hover {
        color: #0885af;
        font-weight: 400;
    }

    .copyright-wrap {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        margin-right: 50px;
        margin-left: 50px;
        padding-right: 0px;
        padding-left: 0px;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .copyright-text {
        margin-top: 0px;
        margin-bottom: 25px;
        padding-top: 5px;
        padding-right: 20px;
        padding-left: 0px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        color: #0885af;
        font-size: 15px;
    }

    .copyright-text:hover {
        color: #0885af;
    }

    .copyright-text.no-margin {
        margin-bottom: 40px;
        padding-right: 0px;
    }

    .text-social {
        -webkit-transition-property: none;
        transition-property: none;
    }

    .text-social:hover {
        background-color: transparent;
        color: #fff;
    }

    .social-link {
        margin-top: 20px;
        margin-right: 50px;
        margin-left: 50px;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .email-subscribe {
        -webkit-box-flex: 0;
        -webkit-flex: 0 70%;
        -ms-flex: 0 70%;
        flex: 0 70%;
    }

    .form-wrapper {
        margin-bottom: 5px;
    }

    .form.email {
        padding-right: 0px;
    }

    .form.email.footer2 {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 75%;
        float: right;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .submit-button {
        height: 45px;
        padding-right: 20px;
        padding-left: 20px;
        -webkit-transition-property: none;
        transition-property: none;
        text-align: center;
    }

    .submit-button:hover {
        background-color: transparent;
        color: #fff;
    }

    .text-field {
        width: 100%;
        height: 45px;
        padding-right: 40px;
        padding-left: 40px;
    }

    .text-field.hidden.success {
        width: 55%;
        height: 50px;
        padding-right: 15px;
        padding-left: 15px;
    }

    .text-field.hidden.success:hover {
        padding-top: 12px;
        padding-bottom: 13px;
    }

    .text-field.hidden.contact {
        width: 50%;
        height: 50px;
        padding-top: 14px;
        padding-bottom: 14px;
    }

    .text-field.hidden.contact:hover {
        padding-top: 14px;
        padding-bottom: 14px;
        border-width: 1px;
    }

    .text-field.hidden.contact.free {
        width: 40%;
    }

    .text-field.hidden.contact.free.pro {
        font-size: 18px;
    }

    .text-field.hidden.contact.free.my-multi {
        width: 25%;
        height: auto;
    }

    .text-field.hidden.contact.free.my-multi.tab-ph-land {
        display: block;
    }

    .text-field.hidden.contact.free.my-multi.dt-ph-port {
        display: none;
    }

    .text-field.hidden.host {
        width: 50%;
        height: 50px;
        padding-top: 14px;
        padding-bottom: 14px;
    }

    .text-field.hidden.host:hover {
        padding-top: 14px;
        padding-bottom: 14px;
        border-width: 1px;
    }

    .text-field.hidden.list {
        width: 50%;
        height: 50px;
        padding-top: 14px;
        padding-bottom: 14px;
    }

    .text-field.hidden.list:hover {
        padding-top: 14px;
        padding-bottom: 14px;
        border-width: 1px;
    }

    .text-field.hidden.list.multi {
        width: 50%;
    }

    .success-message.mobile {
        width: 75%;
        margin-bottom: 0px;
        float: right;
    }

    .scroll-to-top {
        right: 0px;
        bottom: 90px;
    }

    .sponsors-flex-parent {
        padding-right: 20px;
        padding-left: 20px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        -webkit-align-content: stretch;
        -ms-flex-line-pack: stretch;
        align-content: stretch;
    }

    .text-tagline {
        padding-left: 0px;
        font-size: 20px;
        text-align: left;
    }

    .surfing-in-taiwan {
        margin-top: 100px;
    }

    .sit-link.my-multi {
        padding-right: 20px;
        padding-left: 20px;
    }

    .recommend {
        margin-top: 100px;
        margin-bottom: 100px;
    }

    .news-flex-pa {
        padding-right: 20px;
        padding-left: 20px;
    }

    .section-heading {
        padding-left: 20px;
    }

    .section-heading.sit-heading {
        width: 730px;
        padding-left: 20px;
    }

    .section-heading.pro-heading {
        width: 730px;
        padding-left: 20px;
    }

    .section-heading.ad {
        padding-left: 15px;
    }

    .section-heading.feedback-heading {
        width: 90%;
        padding-left: 20px;
    }

    .section-heading.welcome {
        padding-left: 0px;
    }

    .section-heading.tos {
        padding-left: 0px;
        font-size: 28px;
    }

    .news-div.tos {
        width: 80%;
    }

    .stream-image {
        -webkit-transition-property: none;
        transition-property: none;
    }

    .stream-image:hover {
        opacity: 1;
    }

    .stream-div {
        max-width: none;
        margin-right: 10px;
        margin-left: 10px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 47%;
        -ms-flex: 0 47%;
        flex: 0 47%;
    }

    .stream-div.tabphland {
        min-height: 385px;
    }

    .stream-div.tabphland.cam.blog {
        -webkit-flex-basis: 48%;
        -ms-flex-preferred-size: 48%;
        flex-basis: 48%;
    }
    
    .stream-div.tabphland.cam.vid.pro.pro24 {
        align-self: flex-end;
        width: 70%;
        margin-bottom: 20px;
        margin-right: 20px;
    }

    .stream-div.tabphland.ad-unit-ph-only {
        display: none;
    }

    .stream-div.pro.border.no-email {
        -webkit-flex-basis: 90%;
        -ms-flex-preferred-size: 90%;
        flex-basis: 90%;
    }

    .blog-link.back {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }

    .dropdown-toggle.nav-icon3.blue:hover {
        color: hsla(0, 0%, 60%, 0.4);
    }

    .navbar-parent {
        margin-bottom: -5px;
        padding-top: 0px;
    }

    .dropdown {
        margin-right: 10px;
    }

    .icon-3 {
        margin-top: 240px;
    }

    .icon-3.en {
        margin-top: 280px;
    }

    .icon-4 {
        margin-top: 240px;
    }

    .icon-4.en {
        margin-top: 280px;
    }

    .sit-slide {
        bottom: -230px;
    }

    .sit-slide.sit-slide-2 {
        bottom: -185px;
    }

    .sit-slide.sit-slide-2.en {
        bottom: -250px;
    }

    .sit-slide.sit-slide-3 {
        bottom: -230px;
    }

    .sit-slide.sit-slide-3.en {
        bottom: -250px;
    }

    .sit-slide.en {
        bottom: -250px;
    }

    .footer-container-tablet {
        margin-top: 20px;
        padding-bottom: 30px;
    }

    .socials {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }

    .footer-title-phone-port {
        font-size: 20px;
    }

    .footer-link-phone {
        font-size: 17px;
    }

    .button-cta-premium:hover {
        background-color: #60b9cb;
        box-shadow: none;
        color: #fff;
    }

    .form-wrapper-premium {
        margin-bottom: 5px;
    }

    .submit-button-pro.button-cta-premium.feedback {
        display: block;
        margin-right: auto;
        margin-left: auto;
    }

    .submit-button-pro.button-cta-premium.welcome {
        display: block;
        margin-right: auto;
        margin-left: auto;
    }

    .pro-checklist-paragraph {
        padding-right: 25px;
    }

    .host-text-link-top {
        display: block;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .footer-language-link {
        padding-right: 0px;
        padding-left: 0px;
        color: rgba(0, 0, 0, 0.31);
        font-size: 13px;
    }

    .footer-language-link:hover {
        color: rgba(0, 0, 0, 0.31);
    }

    ._3-4-tw-flex-parent {
        margin-bottom: 100px;
    }

    ._3-4-tw-side-divs {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    ._3-4-tw-text {
        padding-bottom: 7%;
        line-height: 1.5em;
    }

    ._3-4-tw-text.pro-cta {
        margin-left: 0px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    }

    ._3-4-tw-heading {
        padding-bottom: 10px;
        padding-left: 20px;
    }

    ._3-4-tw-link:hover {
        color: #905890;
    }

    .surf-spot-hero.surf-spot-tabs {
        margin-top: 15px;
    }

    .surf-spot-hero.surf-biz-tabs {
        margin-top: 15px;
    }

    .surf-spot-hero-image {
        padding-bottom: 0px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .surf-spot-desc {
        width: 100%;
        max-height: 100%;
        max-width: none;
        min-height: fit-content;
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    }

    .surf-spot-des-text {
        padding-right: 20px;
        padding-left: 20px;
        color: #777;
        font-size: 20px;
        font-weight: 300;
    }

    .surf-spot-des-text.surf-spot-text-2 {
        padding: 15px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        font-size: 22px;
        line-height: 26px;
        cursor: pointer;
    }

    .surf-spot-des-text.surf-spot-text-2.en-no-cam.sub {
        min-height: 0px;
        padding-top: 35px;
    }

    .surf-spot-hero-div {
        width: auto;
        max-width: 100%;
        padding-right: 15px;
        padding-left: 15px;
    }

    .surf-spot-flip-div-mobile {
        display: block;
        width: 100%;
        max-width: 640px;
        margin: 15px auto;
        margin-top: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-content: space-between;
        -ms-flex-line-pack: justify;
        align-content: space-between;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        background-image: none;
        box-shadow: none;
        -webkit-perspective: 2000px;
        perspective: 2000px;
        -webkit-transition: -webkit-transform 1000ms ease;
        transition: -webkit-transform 1000ms ease;
        transition: transform 1000ms ease;
        transition: transform 1000ms ease, -webkit-transform 1000ms ease;
    }

    .surf-spot-flip-div-mobile:hover {
        box-shadow: none;
    }

    .spot-infographic {
        max-width: none;
        margin-top: 25px;
        margin-bottom: 10px;
    }

    .spot-desc-heading {
        padding-top: 20px;
        padding-left: 20px;
        font-size: 26px;
    }

    .spot-desc-heading.sub {
        margin-top: 5px;
        padding-top: 0px;
    }

    .inforgraphic-link {
        display: block;
        width: 50%;
        margin-right: 0px;
        margin-left: 0px;
        padding-right: 0px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: center;
    }

    .inforgraphic-link:hover {
        color: rgba(0, 153, 204, 0.55);
    }

    .surf-spot-characteristics {
        display: none;
        max-width: none;
        margin-right: 25px;
        margin-left: 25px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .spot-char-text {
        padding-top: 0px;
        padding-right: 5px;
        padding-left: 5px;
        border: 1px none #000;
        font-size: 22px;
        line-height: 26px;
        text-align: left;
    }

    .spot-char-text.en {
        border-bottom-style: none;
        font-size: 18px;
        line-height: 20px;
        letter-spacing: 0px;
    }

    .spot-char-flex-parent {
        margin-top: 0px;
        margin-bottom: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-align-self: stretch;
        -ms-flex-item-align: stretch;
        align-self: stretch;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        border-right-style: none;
        text-align: left;
    }

    .spot-char-title {
        padding-right: 5px;
        padding-bottom: 0px;
        padding-left: 5px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        font-size: 22px;
        line-height: 26px;
        text-align: left;
    }

    .spot-char-title.en {
        margin-top: 10px;
        margin-bottom: 5px;
        padding-top: 5px;
        padding-bottom: 5px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.2);
        font-size: 20px;
        line-height: 22px;
        letter-spacing: 0px;
    }

    .spot-photo-slider {
        width: 625px;
        height: 415px;
        margin-top: 0px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .spot-image {
        display: block;
        max-width: none;
        margin-right: auto;
        margin-left: auto;
        text-align: left;
    }

    .surf-spot-photos {
        width: auto;
        height: auto;
        max-width: none;
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .spot-photos-wrapper {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        margin-bottom: 0px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-content: stretch;
        -ms-flex-line-pack: stretch;
        align-content: stretch;
    }

    .surf-spot-characteristics-tablet {
        width: 50%;
        max-width: none;
        margin: 10px 25px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        background-image: none;
        box-shadow: none;
    }

    .spot-infographic-div-mobile {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 50%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-content: center;
        -ms-flex-line-pack: center;
        align-content: center;
        -webkit-align-self: stretch;
        -ms-flex-item-align: stretch;
        align-self: stretch;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .infographic-popup {
        display: none;
    }

    .info-popup-div {
        border-radius: 5px;
    }

    .popup-close-link:hover {
        color: #a0e5ce;
    }

    .inforgraphic-zoom {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 50%;
        margin-right: 0px;
        margin-left: 0px;
        padding-right: 0px;
        padding-left: 0px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .inforgraphic-zoom:hover {
        color: rgba(0, 153, 204, 0.55);
    }

    .infographic-zoom-info-div {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .ad-285x360-hurley {
        width: 310px;
        height: 415px;
        max-width: none;
    }

    .plug-300x250 {
        width: auto;
        max-width: none;
        margin-right: 0px;
        margin-left: 15px;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .ad-300x150 {
        width: auto;
        max-width: none;
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    ._2-ad-div-photos {
        width: 625px;
        margin-right: 0px;
        margin-bottom: 15px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .videos-photos-section {
        margin-bottom: 50px;
    }

    .surf-spot-videos {
        width: auto;
        height: auto;
        max-width: none;
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .ad-285x360-videos-desktop {
        width: auto;
        max-width: none;
        margin-right: 10px;
        margin-left: 10px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .spot-video-slider {
        width: 625px;
        height: 353px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .spot-videos-wrapper {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        margin-bottom: 15px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-content: stretch;
        -ms-flex-line-pack: stretch;
        align-content: stretch;
    }

    .sponsors-section-surf-spots.section-hosts-mobile {
        display: block;
        max-width: 85%;
        margin: 100px auto;
        text-align: center;
    }

    .share-video-text-div {
        top: 25%;
    }

    .share-vid-text {
        padding: 20px 25px;
        border: 1px none #000;
        font-size: 20px;
        line-height: 26px;
        text-align: center;
    }

    .ad-285x360-videos-mobile {
        width: auto;
        max-width: none;
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .vid-photo-ad-mobile-div-1 {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

    .vid-photo-ad-mobile-div-2 {
        display: none;
        margin-bottom: 0px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: end;
        -webkit-align-items: flex-end;
        -ms-flex-align: end;
        align-items: flex-end;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .video-heading {
        margin-top: 0px;
        padding-left: 0px;
        padding-right: 5px;
        font-size: 20px;
    }

    .drop-arrow-div {
        right: 20%;
    }

    .spot-tab-link.info {
        padding-top: 13px;
        padding-bottom: 12px;
        border-color: #09c;
        color: #09c;
        font-size: 22px;
    }

    .spot-tab-link.info:hover {
        border-color: #09c;
        background-image: -webkit-linear-gradient(270deg, #fff, #fff);
        background-image: linear-gradient(180deg, #fff, #fff);
        color: #09c;
    }

    .spot-tab-link.info:focus {
        border-color: #09c;
        background-image: -webkit-linear-gradient(270deg, #09c, #09c);
        background-image: linear-gradient(180deg, #09c, #09c);
        color: #fff;
    }

    .spot-tab-link.info.biz:active {
        background-image: -webkit-gradient(linear,
                left top,
                left bottom,
                from(#09c),
                to(#09c));
        background-image: linear-gradient(180deg, #09c, #09c);
        color: #fff;
    }

    .spot-tab-link.info.list {
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .spot-tab-link.biz {
        padding-top: 8px;
        padding-bottom: 12px;
        font-size: 22px;
    }

    .spot-tab-link.en {
        padding-top: 7px;
        padding-bottom: 0px;
    }

    ._2nd-click-close-cam-tab {
        display: none;
    }

    .surf-report-flip-div {
        display: block;
        min-height: 345px;
        margin-top: 15px;
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .surf-spot-infographic-dt {
        display: block;
        width: 100%;
        max-width: 640px;
        margin-top: 15px;
        margin-right: auto;
        margin-left: auto;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-content: space-between;
        -ms-flex-line-pack: justify;
        align-content: space-between;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .surf-spot-report-dt {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
        max-width: 310px;
        min-height: 0px;
        margin: 0px auto 15px;
        padding-top: 0px;
        padding-bottom: 4px;
        padding-left: 25px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-content: space-between;
        -ms-flex-line-pack: justify;
        align-content: space-between;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        background-image: none;
        -webkit-backface-visibility: visible;
        backface-visibility: visible;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
    }

    .report-info-div {
        position: relative;
        z-index: 9999;
        display: none;
        width: 100%;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .report-info-link {
        display: block;
        width: 50%;
        margin-right: 0px;
        margin-left: 0px;
        padding-right: 0px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: center;
    }

    .report-info-link:hover {
        color: rgba(0, 153, 204, 0.55);
    }

    .surf-spot-desc-cam-flip-div {
        display: block;
        max-height: none;
        margin-right: auto;
        margin-left: auto;
    }
    
    .surf-spot-desc-cam-flip-div._2 {
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 5px;
    }

    .surf-spot-cam {
        width: 100%;
        height: 100%;
        max-height: 360px;
        max-width: 640px;
        min-height: 0px;
        min-width: 0px;
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        -webkit-backface-visibility: visible;
        backface-visibility: visible;
    }

    .read-surf-report-popup {
        display: block;
    }

    .container-forecast {
        max-width: 98%;
    }

    .forecast-tab-small-text {
        font-weight: 600;
    }

    .desc {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 20%;
        margin-right: 10px;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .desc-text {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: auto;
        margin-right: 0px;
        padding: 5px 0px 5px 20px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        border: 1px none #000;
        font-size: 18px;
        line-height: 22px;
        text-align: left;
        letter-spacing: 0px;
    }

    .hour-reading-text {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        padding-top: 10px;
        padding-bottom: 10px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        border: 1px none #000;
        font-size: 18px;
        line-height: 22px;
        text-align: left;
        letter-spacing: 0px;
    }

    .hour-reading-text.reading-text-white._9-8 {
        font-weight: 600;
    }

    .hour-reading-text.reading-text-black {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        padding-top: 10px;
        padding-bottom: 10px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .forecast-reading {
        width: 83%;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .metric {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: auto;
        margin-right: 0px;
        padding-top: 5px;
        padding-right: 0px;
        padding-bottom: 5px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        border: 1px none #000;
        font-size: 18px;
        line-height: 22px;
        font-weight: 600;
        text-align: right;
        letter-spacing: 0px;
    }

    .metric.no-link {
        font-weight: 300;
    }

    .arrow-text {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        padding-top: 0px;
        padding-bottom: 0px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        border: 1px none #000;
        font-size: 20px;
        line-height: 26px;
        text-align: left;
    }

    .arrow-text._225 {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .arrow-text._90 {
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .arrow-text._45 {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        padding-top: 10px;
        padding-bottom: 10px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .arrow-text._70 {
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .weather-text {
        padding-top: 10px;
        border: 1px none #000;
        font-size: 22px;
        line-height: 26px;
        text-align: left;
    }

    .day-arrow {
        padding-top: 0px;
        border: 1px none #000;
        font-size: 22px;
        line-height: 26px;
        text-align: left;
    }

    .swipe-text.blog {
        padding-left: 20px;
    }

    .swipe-text.blog.no-pad {
        padding-left: 0px;
    }

    .spot-char-div {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
        min-width: 640px;
        border-radius: 5px;
        background-image: -webkit-linear-gradient(270deg, #fff, #fff);
        background-image: linear-gradient(180deg, #fff, #fff);
        border: solid 1px #0099cc;
    }

    .surf-report-char-div {
        position: absolute;
        left: 0px;
        top: 0px;
        right: 0px;
        bottom: 0px;
        z-index: 9996;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 640px;
        height: 100%;
        min-width: 0px;
        margin-right: auto;
        margin-bottom: 15px;
        margin-left: auto;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        border-radius: 5px;
        background-image: -webkit-linear-gradient(270deg, #fff, #fff);
        background-image: linear-gradient(180deg, #fff, #fff);
        box-shadow: 0 2px 5px 1px rgba(0, 0, 0, 0.2);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg);
        transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg);
    }

    .report-div-mobile {
        position: relative;
        z-index: 9997;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 50%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-content: center;
        -ms-flex-line-pack: center;
        align-content: center;
        -webkit-align-self: stretch;
        -ms-flex-item-align: stretch;
        align-self: stretch;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .surf-spot-characteristics-tablet-21 {
        width: 50%;
        max-width: none;
        margin: 10px 25px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        background-image: none;
        box-shadow: none;
    }

    .report-info-link-mobile {
        z-index: 9999;
        display: block;
        width: 50%;
        margin-right: 0px;
        margin-left: 0px;
        padding-right: 0px;
        padding-bottom: 20px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        color: #09c;
        text-align: right;
    }

    .report-info-link-mobile:hover {
        color: #09c;
    }

    .spot-infographic-tablet {
        max-width: none;
        margin-top: 25px;
        margin-bottom: 10px;
    }

    .infographic-zoom-info-div-tablet {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .plug-top-ban {
        width: 100%;
    }

    .text-block-7 {
        padding-top: 5px;
    }

    .subscribe-button {
        height: 45px;
        padding-right: 20px;
        padding-left: 20px;
        -webkit-transition-property: none;
        transition-property: none;
        text-align: center;
    }

    .subscribe-button:hover {
        background-color: transparent;
        color: #fff;
    }

    .name-banner {
        margin-top: 20px;
    }

    .banner-title {
        padding-left: 10px;
    }

    .banner-title.rt {
        padding-right: 10px;
        padding-left: 0px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .title-container {
        width: 960px;
    }

    .marker-pin.header {
        padding-right: 0px;
    }

    .marker-div {
        margin-right: 20px;
    }
    
    .text-pop-parent.cog {
        margin-top: 190px;
    }

    .text-pop-child {
        padding-left: 0px;
        font-size: 20px;
    }
    
  .text-pop-child.cog {
    padding-left: 20px;
    font-size: 24px;
    line-height: 34px;
  }

    .container-payments {
        padding-right: 50px;
        padding-left: 50px;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .view-ad-link {
        padding-left: 15px;
        text-decoration: underline;
    }

    .view-ad-link:hover {
        color: #999;
    }

    ._50-off-popup {
        display: none;
    }

    .discount-popup-div {
        border-radius: 5px;
    }

    .ad-size {
        padding-left: 15px;
        text-decoration: none;
    }

    .ad-size:hover {
        color: #999;
    }

    .biz-logo {
        max-width: none;
        margin: 25px;
    }

    .biz-logo-div {
        display: block;
        width: 300px;
        max-height: 300px;
        max-width: 640px;
        margin-top: 0px;
        margin-right: 25px;
        margin-left: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-content: space-between;
        -ms-flex-line-pack: justify;
        align-content: space-between;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .biz-desc {
        width: 50%;
        max-width: none;
        margin-right: 5px;
        margin-left: 0px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .surf-biz-hero-image {
        margin-bottom: 15px;
        padding-bottom: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .surf-biz-des-text {
        padding-right: 20px;
        padding-left: 20px;
        color: #777;
        font-size: 20px;
        font-weight: 300;
    }

    .surf-biz-des-text.surf-biz-text-2 {
        padding-right: 25px;
        padding-bottom: 25px;
        padding-left: 25px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        font-size: 22px;
        line-height: 26px;
        cursor: pointer;
    }

    .surf-biz-des-text.surf-biz-text-2.about {
        padding-right: 20px;
        padding-left: 20px;
        line-height: 27px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.center {
        padding-right: 15px;
        padding-left: 15px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.indent.center.background {
        margin-right: 0px;
        margin-left: 0px;
        padding-right: 10px;
        padding-left: 10px;
        text-align: center;
    }

    .surf-biz-des-text.surf-biz-text-2.about.report {
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .surf-biz-des-text.surf-biz-text-2.about.en {
        padding-left: 10px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.my-multi.center {
        text-align: center;
    }

    .surf-biz-des-text.surf-biz-text-2.my-multi {
        line-height: 22px;
    }

    .social-div.landing {
        width: 40%;
    }

    .feedback-popup {
        display: none;
    }

    .feedback-popup-div {
        height: 85%;
        border-radius: 5px;
    }

    .feedback-paragraph {
        font-size: 14px;
    }

    .close-button {
        top: 20px;
    }
    
    .close-button.blue {
        top: 20px;
        right: 20px;
        border-radius: 5px;
    }

    .preload-text {
        font-size: 22px;
        line-height: 30px;
    }

    .welcome-paragraph {
        font-size: 14px;
    }

    .preload-text-fc {
        font-size: 22px;
        line-height: 30px;
    }

    .text-amen {
        font-size: 22px;
    }

    .amen-wrap {
        width: 100%;
        padding-right: 15px;
        padding-left: 15px;
    }

    .hidden-add {
        width: 100%;
        padding-right: 22px;
        padding-left: 22px;
    }

    .hidden {
        width: 100%;
        font-size: 22px;
    }

    .hidden.no-pointer {
        font-weight: 100;
    }

    .hidden.success {
        width: 55%;
        padding-top: 13px;
        padding-bottom: 13px;
    }

    .hidden.success:hover {
        padding-top: 12px;
        padding-bottom: 15px;
        background-image: none;
        color: #60b9cb;
    }

    .hidden-ph {
        display: none;
        width: 100%;
        padding-right: 22px;
        padding-left: 22px;
    }

    .hidden-ph.success {
        display: block;
    }

    .hidden-email {
        display: none;
        width: 100%;
        padding-right: 22px;
        padding-left: 22px;
    }

    .success-div.success-right.sub {
        background-position: 25% 50%;
    }

    .hidden-subscribe-footer {
        display: none;
        width: 100%;
    }

    .host-popup {
        display: none;
    }

    .list-popup {
        display: none;
    }

    .ad-popup {
        display: none;
    }

    .footer-image.lazyload {
        margin-bottom: 125px;
        background-position: -279px 0px;
    }
    
    .footer-image._3-percent {
        padding-left: 0;
        padding-right: 0;
    }

    .surf-spot-cam-ph {
        width: 100%;
        max-height: 100%;
        max-width: none;
        min-height: 360px;
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    }

    .host-flex-parent {
        margin-bottom: 100px;
    }

    .surf-report-div {
        max-width: none;
        margin-left: auto;
        margin-right: auto;
    }

    .surf-report-div.my-multi.forecast {
        overflow: visible;
    }

    .hidden-list-1 {
        width: 100%;
        padding-right: 22px;
        padding-left: 22px;
    }

    .hidden-list-2 {
        width: 100%;
        padding-right: 22px;
        padding-left: 22px;
    }

    .list {
        width: 90%;
    }

    .list.trouble {
        width: 90%;
    }

    .list-link {
        padding-top: 5px;
        padding-bottom: 5px;
        font-size: 17px;
    }
    
    .list-link.search.arrow._3-4-tw {
        padding-left: 10;
    }

    .list-link.search.rt:hover {
        padding-bottom: 5px;
    }

    .list-link.search.rt.blog:hover {
        padding-bottom: 5px;
    }

    .list-link.search.blog2:hover {
        padding-bottom: 5px;
    }
    
    .list-link.search._34tw {
        margin-right: 5px;
    }

    .list-link.ad-text {
        padding-bottom: 0px;
        font-size: 15px;
    }

    .list-link.ad-text:hover {
        padding-bottom: 0px;
    }

    .list-dropdown {
        height: 0px;
    }

    .cam-name-div.vid {
        height: 45px;
        padding-right: 10px;
        padding-left: 10px;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .cs-banner {
        margin-top: 45px;
    }

    .cs-container {
        margin-bottom: 0px;
    }

    .cs-text {
        bottom: 30px;
    }

    ._404-text {
        font-size: 250px;
    }

    .free-text {
        padding-bottom: 0px;
        line-height: 1.5em;
    }

    .nav-popup {
        display: none;
    }

    .nav-close-container {
        width: auto;
        padding-right: 35px;
    }

    .scroll-to-top-ph {
        right: 0px;
        bottom: 90px;
    }

    .social-div-ph.landing {
        width: 40%;
    }

    .scroll-to-top-phone {
        right: 0px;
        bottom: 90px;
    }

    .vid-wrapper {
        width: auto;
    }

    .vid-wrapper._2019 {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .vid-wrapper.timer {
        width: 80%;
    }
    
    .vid-wrapper.pro24 {
        margin-bottom: 20px;
        margin-left: 0;
        margin-right: 0;
    }

    .vid-wrapper.pro24.ph {
        display: none;
    }

    .vid-wrapper.pro24.all {
        margin-bottom: 15px;
    }

    .video-surf-spots.promo {
        margin-right: 30px;
        margin-left: 30px;
        padding-right: 10px;
        padding-left: 10px;
    }

    .video-surf-spots.promo._2019 {
        width: 60%;
        margin-bottom: 25px;
        padding-right: 40px;
        padding-left: 40px;
    }

    .blog-text-blue {
        font-size: 22px;
    }

    .blog-text-blue.en {
        padding-left: 5px;
        text-align: left;
    }
    
    .blog-text-blue.en.cta {
        text-align: center;
        padding-left: 0;
    }

    .blog-flex-parent {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .blog-flex-parent._3-col {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .blog-flex-parent.legend {
        padding-right: 10px;
        padding-left: 10px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .blog-flex-parent.legend.wind {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 50%;
        margin-right: auto;
        margin-left: auto;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .blog-flex-parent.direction {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .blog-flex-parent.dt-only {
        display: none;
    }

    .blog-flex-parent.mobile {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }

    .column._3 {
        width: 65%;
    }

    .column._3.en {
        width: 80%;
        margin-left: 25px;
    }

    .blog-text.en {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .blog-text.en.pro {
        margin-top: -58px;
    }

    .blog-div.wide {
        display: block;
        margin-right: auto;
        margin-left: auto;
        padding-left: 0px;
    }

    .blog-div.full {
        width: 100%;
    }

    .blog-lightbox {
        width: 100%;
        text-align: center;
    }

    .blog-text-col-left {
        width: 100%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .blog-text-col-left.dir {
        width: 80%;
        margin-left: 15px;
    }

    .blog-text-col-left.dhd {
        width: 85%;
    }

    .blog-flex-parent-2 {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .blog-flex-parent-2._3-col {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .ad-slider {
        width: 100%;
    }

    .blog-legend-col-mid {
        width: auto;
        height: auto;
        padding-right: 10px;
        padding-left: 10px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .text-legend {
        width: 50px;
        padding-top: 3px;
        padding-right: 10px;
        padding-left: 10px;
        font-size: 17px;
    }

    .text-legend.ff3333 {
        padding-top: 4px;
    }

    .blog-legend-col-left {
        width: 60%;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .blog-legend-col-mid-ft {
        display: none;
        width: auto;
        padding-right: 10px;
        padding-left: 10px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .legend-units {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 20%;
        margin-right: 10px;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .legend-metric {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: auto;
        margin-right: 0px;
        padding-top: 5px;
        padding-right: 0px;
        padding-bottom: 5px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        border: 1px none #000;
        font-size: 18px;
        line-height: 22px;
        font-weight: 600;
        text-align: right;
        letter-spacing: 0px;
    }

    .legend-metric.no-link {
        font-weight: 300;
    }

    .legend-metric-ft {
        display: none;
        width: auto;
        margin-right: 0px;
        padding-top: 5px;
        padding-right: 0px;
        padding-bottom: 5px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        border: 1px none #000;
        font-size: 18px;
        line-height: 22px;
        font-weight: 600;
        text-align: right;
        letter-spacing: 0px;
    }

    .legend-metric-ft.no-link {
        font-weight: 300;
    }

    .blog-legend-col-mid-km {
        width: 100%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .blog-legend-col-mid-ms {
        width: 100%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .legend-metric-ms {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: auto;
        margin-right: 0px;
        padding-top: 5px;
        padding-right: 0px;
        padding-bottom: 5px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        border: 1px none #000;
        font-size: 18px;
        line-height: 22px;
        font-weight: 600;
        text-align: right;
        letter-spacing: 0px;
    }

    .legend-metric-ms.no-link {
        font-weight: 300;
    }

    .legend-metric-km {
        display: none;
        width: auto;
        margin-right: 0px;
        padding-top: 5px;
        padding-right: 0px;
        padding-bottom: 5px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        border: 1px none #000;
        font-size: 18px;
        line-height: 22px;
        font-weight: 600;
        text-align: right;
        letter-spacing: 0px;
    }

    .legend-metric-km.no-link {
        font-weight: 300;
    }

    .blog-legend-col-mid-mph {
        width: 100%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .blog-legend-col-mid-kn {
        width: 100%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .legend-metric-mph {
        display: none;
        width: auto;
        margin-right: 0px;
        padding-top: 5px;
        padding-right: 0px;
        padding-bottom: 5px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        border: 1px none #000;
        font-size: 18px;
        line-height: 22px;
        font-weight: 600;
        text-align: right;
        letter-spacing: 0px;
    }

    .legend-metric-mph.no-link {
        font-weight: 300;
    }

    .legend-metric-kn {
        display: none;
        width: auto;
        margin-right: 0px;
        padding-top: 5px;
        padding-right: 0px;
        padding-bottom: 5px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        border: 1px none #000;
        font-size: 18px;
        line-height: 22px;
        font-weight: 600;
        text-align: right;
        letter-spacing: 0px;
    }

    .legend-metric-kn.no-link {
        font-weight: 300;
    }

    .hidden-android {
        width: 100%;
        padding-right: 22px;
        padding-left: 22px;
    }

    .wave-legend-img {
        width: 78%;
    }

    .blog-285x360 {
        width: 70%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .legend-metric-ph {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: auto;
        margin-right: 0px;
        padding-top: 5px;
        padding-right: 0px;
        padding-bottom: 5px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        border: 1px none #000;
        font-size: 18px;
        line-height: 22px;
        font-weight: 600;
        text-align: right;
        letter-spacing: 0px;
    }

    .legend-metric-ph.no-link {
        font-weight: 300;
    }

    .legend-metric-ft-ph {
        display: none;
        width: auto;
        margin-right: 0px;
        padding-top: 5px;
        padding-right: 0px;
        padding-bottom: 5px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        border: 1px none #000;
        font-size: 18px;
        line-height: 22px;
        font-weight: 600;
        text-align: right;
        letter-spacing: 0px;
    }

    .legend-metric-ft-ph.no-link {
        font-weight: 300;
    }

    .blog-legend-col-mid-ph {
        width: auto;
        height: auto;
        padding-right: 10px;
        padding-left: 10px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .blog-legend-col-mid-ft-ph {
        display: none;
        width: auto;
        padding-right: 10px;
        padding-left: 10px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .report-div {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .forecast-help-link {
        display: block;
        width: 15%;
        margin-right: 0px;
        margin-left: 0px;
        padding-right: 10px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: right;
    }

    .forecast-help-link:hover {
        color: rgba(0, 153, 204, 0.55);
    }

    .text-low-case {
        font-weight: 600;
    }

    .arrow-3-4-tw-left.full {
        right: auto;
    }

    .arrow-3-4-tw-right {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        margin-top: 0px;
        margin-bottom: 0px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .arrow-3-4-tw-right.full {
        left: auto;
    }

    .slideshow {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .embed-slides {
        margin-top: 20px;
    }

    .name-banner-nav {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }

    .name-banner-link {
        width: 20%;
    }

    .name-banner-link.right {
        width: 30%;
    }

    .name-banner-link.mid {
        width: 40%;
    }

    .name-banner-link.left {
        width: 30%;
    }

    .slider-div {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }

    .slide-3-for-tw {
        width: 50%;
    }

    .slider-images {
        display: block;
        max-height: 90%;
        margin-right: auto;
        margin-left: auto;
    }

    .slider-images.rt {
        float: none;
    }

    .slider-images.rt.lazyload {
        float: none;
    }

    .slider-images.mid {
        float: none;
    }

    .slider-images.mid.lazyload {
        float: none;
    }

    .slider-images.lazyload {
        float: none;
    }

    .arrow-3-4-tw {
        top: 320px;
        right: 5px;
        height: 75px;
    }

    .arrow-3-4-tw.lt {
        top: 320px;
        right: 9%;
    }

    .photo-remove {
        margin-top: 5px;
        margin-right: 51px;
        margin-left: 51px;
    }

    .photo-remove.pro.sub {
        margin-top: 40px;
    }

    .nav-lang-text.en {
        font-size: 22px;
    }

    .nav-lang-text.zh {
        font-size: 20px;
    }

    .nav-lang-text.en-zh {
        font-size: 20px;
    }

    .home-feature {
        margin-top: 100px;
        margin-bottom: 100px;
    }

    .user-icon.en {
        font-size: 22px;
    }

    .user-icon.zh {
        font-size: 20px;
    }

    .user-icon.en-zh {
        font-size: 20px;
    }

    .pro-check {
        cursor: pointer;
    }

    .logout-button {
        margin-right: -10px;
    }

    .logout-button:hover {
        background-color: transparent;
    }

    .upgrade-popup {
        display: none;
    }

    .update-pay-popup {
        display: none;
    }

    .continue-button:hover {
        border-width: 4px;
        background-color: hsla(38.82352941176471, 100%, 50%, 1);
        color: #fff;
    }

    .cam-sub-overlay {
        top: 0px;
        width: 100%;
        height: 100%;
        max-height: 360px;
        max-width: 640px;
        min-height: 0px;
        min-width: 0px;
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transform: rotateX(0deg) rotateY(0) rotateZ(0deg);
        transform: rotateX(0deg) rotateY(0) rotateZ(0deg);
    }

    .cam-sub-overlay-ms {
        top: 0px;
        width: 100%;
        height: 100%;
        max-height: 360px;
        max-width: 640px;
        min-height: 0px;
        min-width: 0px;
        /* margin-right: 0px;
        margin-left: 0px; */
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transform: rotateX(0deg) rotateY(0) rotateZ(0deg);
        transform: rotateX(0deg) rotateY(0) rotateZ(0deg);
    }

    .cam-overlay-div {
        max-height: 360px;
    }

    .try-pro-div.sub.login.no-sponsors {
        margin-bottom: 60px;
    }

    .pro-cta-blurb {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .pro-line {
        display: none;
    }

    .pro-line.short {
        display: block;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .vid-photo-ad-desktop-ad-free {
        display: none;
        width: 0px;
        height: 0px;
        margin-bottom: 0px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: end;
        -webkit-align-items: flex-end;
        -ms-flex-align: end;
        align-items: flex-end;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .slide-icon.my-multi {
        display: none;
    }

    .sms-popup {
        display: none;
    }

    .forecast-units {
        margin-right: 20px;
        margin-left: 20px;
        padding-right: 0px;
    }

    .pro-vid {
        max-width: 100%;
    }
    
    .heading-donate {
        margin-top: 30px;
    }

    .blog-lightbox-2 {
        margin-top: 20px;
        text-align: center;
    }

    .field-label {
        width: 35%;
    }

    .grid4x4.streams {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .multi-forecast-div {
        overflow: visible;
    }

    .multi-forecast-div.new {
        overflow: hidden;
        padding-top: 80px;
    }

    .multi-spot-welcome {
        height: auto;
        padding-bottom: 40px;
    }

    .multi-stream-div {
        -webkit-align-self: auto;
        -ms-flex-item-align: auto;
        -ms-grid-row-align: auto;
        align-self: auto;
        -webkit-box-ordinal-group: 1;
        -webkit-order: 0;
        -ms-flex-order: 0;
        order: 0;
    }

    .card-slide {
        width: 40%;
        height: 50%;
        padding-right: 0px;
        padding-left: 0px;
        -webkit-align-self: auto;
        -ms-flex-item-align: auto;
        -ms-grid-row-align: auto;
        align-self: auto;
        -webkit-box-ordinal-group: 1;
        -webkit-order: 0;
        -ms-flex-order: 0;
        order: 0;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .card-slider {
        overflow: hidden;
        width: auto;
        margin-right: 8%;
        margin-left: 8%;
        -webkit-align-self: center;
        -ms-flex-item-align: center;
        -ms-grid-row-align: center;
        align-self: center;
    }

    .card-slider-mask {
        overflow: visible;
        margin-bottom: 20px;
    }

    .card {
        margin-right: auto;
        margin-left: auto;
        padding-right: 10px;
        padding-left: 10px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .multi-report-slider-div {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .reports-streams-div {
        height: auto;
        margin-bottom: 20px;
        padding-top: 20px;
    }

    .columns {
        -webkit-box-ordinal-group: 1;
        -webkit-order: 0;
        -ms-flex-order: 0;
        order: 0;
    }

    .forecast-slider-mask {
        width: auto;
    }

    .forecast-slide {
        margin-right: 0px;
        margin-left: 0px;
    }

    .forecast-slider-nav {
        position: -webkit-sticky;
        position: sticky;
        display: block;
        margin-bottom: 0%;
        padding-top: 20px;
        background-color: transparent;
    }
    
    .stream-modal-1 {
        display: none;
        margin-right: auto;
        margin-left: auto;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-self: auto;
        -ms-flex-item-align: auto;
        -ms-grid-row-align: auto;
        align-self: auto;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .stream-modal-content {
        position: fixed;
        left: 0%;
        top: 50%;
        right: 0%;
        bottom: auto;
        width: 95%;
        height: auto;
        max-height: 528px;
        max-width: 940px;
        margin-top: auto;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        background-color: #000;
        -webkit-transform: translate(0px, -50%);
        -ms-transform: translate(0px, -50%);
        transform: translate(0px, -50%);
    }

    .stream-iframe {
        height: auto;
    }

    .no-cam-div-multispot {
        display: block;
        width: 50vw;
    }
    .button-host-cam {
        margin-top: 45px;
    }
    .forecast-embed.ms {
        height: 470px;
    }
    .nav_component {
    position: relative;
    }

  .nav_link-wrap {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
    flex-direction: row;
  }

  .footer4_component {
    grid-template-columns: 1fr;
    justify-items: center;
  }

  .faq_contact-section {
    height: auto;
    overflow: hidden;
  }

  .faq-types-wrapper-grid {
    grid-template-columns: 1fr 1fr 1fr;
    margin-top: 20px;
  }

  .image-holder {
    order: -1;
  }

  .margin-top {
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
  }

  .nav_menu-button {
    cursor: pointer;
    padding: 1rem;
  }

  .nav_menu-button.w--open {
    background-color: #c9c9c9;
  }

  .nav_lottie {
    width: 2rem;
    height: 2rem;
  }

  .margin-bottom {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
  }

  .padding-vertical {
    padding-left: 0;
    padding-right: 0;
  }
    
  .cta-float {
    direction: ltr;
    width: 110px;
    margin-left: 0;
    margin-right: 0;
    left: 0;
    right: 0;
  }

  .cta-float.right {
    right: 0;
  }

  .nav_link {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
  }
    
  .photo-rounded {
    margin-left: auto;
    margin-right: auto;
  }
    
  .h1-pro24 {
    padding-left: 20px;
    font-size: 31px;
    line-height: 40px;
  }

  .text-pro24 {
    margin-bottom: 0;
    padding-left: 20px;
  }

  .text-pro24.boldblue {
    padding-left: 0;
  }

  .text-pro24.right-para {
    width: 100%;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    padding: 10px 5px 5px;
  }

  .text-pro24.right-para.guarantee {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .text-pro24.center {
    min-height: 210px;
  }

  .pro24-cta.ms {
    margin-left: auto;
    margin-right: auto;
  }

  .pro24-cta.ms.center {
    width: 50%;
  }

  .pro24-section-color.blue {
    padding-bottom: 10px;
  }

  .hero-video-link-block {
    margin-left: 10px;
    margin-right: 10px;
  }

  .card-2 {
    height: 300px;
    margin-left: 10px;
    margin-right: 10px;
  }

  .video-slider {
    margin-top: 0;
  }

  .hero-video {
    height: 250px;
  }

  .card-3, .hero-video-link-block-2 {
    height: 180px;
    margin-left: 10px;
    margin-right: 10px;
  }

  .hero-video-2 {
    height: 180px;
  }

  .image-paragraph {
    max-width: none;
    margin-left: 20px;
    margin-right: 0;
  }

  .ms-60 {
    width: 50%;
  }

  .ms-60._40 {
    width: 45%;
    margin-left: 20px;
  }

  .nav-popup-pro {
    display: none;
  }
    
  .help-how-pro-helps-popup, .help-how-pro-helps-popup, .help-read-forecast-popup, .help-infographic-popup, .help-read-report-popup, .help-multi-spot-popup, .help-stream-offline-popup, .help-view-streams-popup, .help-view-forecast-popup, .help-login-issue-popup, .help-logout-issue-popup, .help-purchase-pro-popup, .help-account-share-popup, .help-cancel-sub-popup, .help-guarantee-popup, .help-discount-popup, .help-referral-popup, .help-billing-popup, .help-pay-method-popup, .help-how-purchase-popup, .help-which-plan-popup, .help-travel-popup, .help-afterbuy-popup, .help-easy-popup, .help-reliable-popup, .help-why-popup, .help-how-contact-popup, .help-advertise-popup, .help-biz-popup, .help-host-popup, .help-swelleye-helps-popup, .help-cleanup-popup, .help-host-cleanup-popup, .help-protect-popup, .help-donate-popup, .help-about-popup, .help-mission-purpose-promise-popup, .help-services-popup, .help-new-cam-popup {
    display: none;
  }

  .help-page-popup-div {
    border-radius: 5px;
    width: 98%;
    height: 98%;
  }
    
  .help-button {
    min-width: 30px;
    min-height: 30px;
  }

  .help-button-question {
    padding-top: 2px;
    font-size: 1.75em;
    line-height: 1em;
  }
}

@media (max-width: 767px) {
    .stream-img {
        width: 100vw;
    }
    
    .list-section.wk-wave-vid.wind-model {
    display: none;
    }
    
    .list-section.wk-wave-vid.wind-model.mobile {
    display: block;
    }

    .flex-logo-wrapper.banner-logo-wrapper {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        -webkit-align-content: space-around;
        -ms-flex-line-pack: distribute;
        align-content: space-around;
    }

    .middle-wrapper.logo-center {
        width: 28%;
        margin-right: -16px;
        margin-left: -16px;
        padding-left: 0px;
    }

    .text-block.coming-text.cam {
        font-size: 1.7em;
    }

    .text-block._404-text-2 {
        top: 75px;
    }

    .text-block._404-text-3 {
        top: 135px;
    }

    .flex-parent-plug-ban {
        padding-top: 0px;
    }

    .section-2.info.en {
        margin-top: 75px;
    }

    .heading-info.about.center.my-multi {
        display: block;
        margin-top: 0px;
    }

    .heading-info.about.center.my-multi.forecast {
        display: none;
    }

    .heading-info.pro {
        padding-right: 10px;
        padding-left: 10px;
    }

    .heading-info.pro.border {
        margin-top: 15px;
    }

    .heading-info.pro.payment {
        margin-right: 5px;
        margin-left: 5px;
        font-weight: 400;
    }

    .heading-info.pro.payment.bk {
        padding-right: 0px;
        padding-left: 0px;
    }

    .heading-info.pro.payment.ref {
        width: 250px;
    }

    .text-info {
        padding: 10px 25px 15px;
        text-align: justify;
    }

    .text-info.stream.pro {
        margin-top: 15px;
        margin-bottom: 15px;
    }

    .text-info.ad {
        padding-bottom: 0px;
    }

    .text-info.ad.right {
        padding-right: 70px;
        padding-left: 0px;
    }

    .text-info.ad.pro {
        padding-right: 15px;
        padding-left: 15px;
        font-size: 17px;
        letter-spacing: 0px;
    }

    .text-info.ad.pro.descrip.margin.surfcheck {
        padding-right: 50px;
        padding-left: 50px;
    }

    .text-info.ad.pro.border {
        margin-bottom: 15px;
        padding-right: 15px;
    }

    .button-cta {
        margin-right: 50px;
        margin-left: 50px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .button-cta.button-map {
        font-size: 18px;
    }

    .button-cta.button-map.button-map-tablet.button-map-phone-port {
        letter-spacing: 0px;
    }

    .button-cta.button-map.button-map-tablet.button-map-phone-port.cs._404 {
        top: 250px;
        margin-right: 0px;
        margin-left: 0px;
    }

    .section-hosts.section-hosts-mobile {
        display: block;
        height: auto;
        margin-top: 100px;
        margin-right: auto;
        margin-left: auto;
    }

    .section-hosts.section-hosts-mobile.multi {
        display: none;
    }

    .section-hosts.section-hosts-mobile.multi.ph {
        display: block;
    }

    .flex-child-sponsor {
        -webkit-box-flex: 33%;
        -webkit-flex: 33%;
        -ms-flex: 33%;
        flex: 33%;
    }

    .sponsor-image {
        width: 85%;
    }

    .button.hosts {
        background-color: transparent;
        background-image: none;
    }

    .heading-1.hero-text {
        padding-right: 25px;
        padding-bottom: 40px;
        padding-left: 25px;
        font-size: 28px;
        letter-spacing: 0px;
    }

    .heading-1.hero-text.cs {
        font-size: 30px;
    }

    .heading-1.hero-text.cs.ja {
        padding-right: 10px;
        padding-left: 10px;
        font-size: 26px;
    }

    .heading-1.blog {
        padding-left: 0px;
        font-size: 30px;
        text-align: center;
    }

    .container {
        margin-bottom: -190px;
    }

    .container.en {
        top: 155px;
        margin-bottom: -290px;
    }

    .container.ja {
        top: 165px;
        margin-bottom: -260px;
    }

    .map-text-button-overlay-wrap {
        margin-top: -10px;
    }

    .tab-link.tabs {
        padding-right: 15px;
        padding-left: 15px;
        border-right-style: solid;
        font-size: 17px;
    }

    .tab-link.forecast-tabs {
        width: 20%;
        padding-right: 5px;
        padding-left: 5px;
        border-right-style: solid;
        font-size: 17px;
    }

    .tab-link.forecast-tabs.w--current {
        border-style: solid none none;
        border-color: #09c #09c rgba(0, 0, 0, 0.1);
        border-top: solid 1px #0099cc;
    }

    .tabs-menu {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        overflow: auto;
        margin-bottom: 0px;
    }

    .video-flex-parent.cam {
        padding: 0px;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .video-flex-parent.cam.vid {
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .video-flex-parent.cam.blog-related {
        width: 95%;
        padding-right: 0px;
        padding-left: 0px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .video-flex-parent.pro {
        padding-top: 15px;
        padding-bottom: 5px;
    }

    .side-columns.see-the-surf-first.side-columns-reports.phone-land-twsr-side {
        padding-top: 0px;
    }

    .vid-container {
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .button-more-vids.cancel {
        width: 75%;
    }

    .button-more-vids.cancel.sub.try-pro {
        margin-right: 10%;
    }

    .slider {
        width: auto;
        clear: both;
    }

    .icon.phone-land-arrow {
        margin-top: 250px;
        margin-left: -5px;
    }

    .icon.phone-land-arrow.phone-port-arrow.desktop-arrow.port-arrow {
        margin-right: 0px;
        margin-left: 7px;
    }

    .icon-2.phone-land-arrow {
        margin-top: 250px;
        margin-right: -5px;
    }

    .icon-2.phone-land-arrow.phone-port-arrow.desktop-arrow.port-arrow {
        margin-right: 0px;
    }

    .footer {
        padding-top: 35px;
    }

    .footer-flex {
        margin-right: 35px;
        margin-left: 35px;
    }

    .footer-col {
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .copyright-wrap {
        margin-top: 35px;
        margin-right: 35px;
        margin-left: 35px;
        padding-bottom: 35px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .copyright-text.no-margin {
        padding-right: 50px;
        padding-left: 50px;
    }

    .link-block-2 {
        padding-right: 25px;
    }

    .social-link {
        margin-top: 20px;
        margin-right: 36px;
        margin-left: 36px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .email-subscribe {
        padding-right: 0px;
    }

    .email-subscribe.free {
        margin-bottom: 35px;
    }

    .email-subscribe.free.pro {
        margin-bottom: 15px;
        padding-top: 0px;
    }

    .form.email {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .form.email.footer2 {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .form.email.footer2.phone {
        width: 100%;
        float: none;
    }

    .submit-button.email.ph {
        font-size: 17px;
    }

    .submit-button.sub.ph {
        font-size: 17px;
    }

    .text-field.hidden.success {
        width: 70%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .text-field.hidden.success:hover {
        padding-top: 11px;
    }

    .text-field.hidden.contact {
        padding-top: 11px;
        padding-bottom: 11px;
    }

    .text-field.hidden.contact:hover {
        padding-top: 11px;
        padding-bottom: 11px;
    }

    .text-field.hidden.contact.free.pro {
        height: 50px;
        margin-right: 15px;
        margin-left: 15px;
        padding-top: 2px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .text-field.hidden.contact.free.pro.rt {
        margin-right: 15px;
        margin-left: 15px;
    }

    .text-field.hidden.contact.free.pro.zh.giveaway {
        width: 75%;
    }

    .text-field.hidden.contact.free.my-multi {
        margin-right: 35px;
        margin-left: 0px;
        padding-top: 15px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        font-weight: 700;
    }

    .text-field.hidden.contact.free.my-multi:hover {
        padding-top: 15px;
        padding-bottom: 14px;
        border-width: 1px;
    }

    .text-field.hidden.contact.free.my-multi:focus {
        padding-top: 15px;
        padding-bottom: 14px;
        border-width: 1px;
    }

    .text-field.hidden.contact.free.my-multi:visited {
        padding-top: 15px;
    }

    .text-field.hidden.contact.free.my-multi.w--current {
        letter-spacing: 0px;
    }

    .text-field.hidden.contact.free.my-multi.last {
        margin-right: 0px;
    }

    .text-field.hidden.contact.free.my-multi.tab-ph-land {
        display: none;
    }

    .text-field.hidden.contact.free.my-multi.dt-ph-port {
        display: block;
    }

    .text-field.hidden.host {
        padding-top: 11px;
        padding-bottom: 11px;
    }

    .text-field.hidden.host:hover {
        padding-top: 11px;
        padding-bottom: 11px;
    }

    .text-field.hidden.host.iphone {
        font-weight: 100;
        letter-spacing: 0px;
    }

    .text-field.hidden.host.iphone:focus {
        padding-top: 11px;
        padding-bottom: 11px;
        border-width: 1px;
    }

    .text-field.hidden.list {
        height: auto;
        padding-top: 11px;
        padding-bottom: 11px;
    }

    .text-field.hidden.list:hover {
        padding-top: 11px;
        padding-bottom: 11px;
    }

    .text-field.hidden.list.multi {
        width: 90%;
        padding-bottom: 14px;
        line-height: 1em;
        font-weight: 700;
        letter-spacing: 0px;
    }

    .text-field.hidden.list.multi:hover {
        padding-top: 15px;
        padding-right: 5px;
        padding-left: 5px;
        border-width: 1px;
    }

    .text-field.hidden.list.multi:focus {
        padding-top: 15px;
        padding-right: 5px;
        padding-left: 5px;
        border-width: 1px;
    }

    .text-field.hidden.list.multi:visited {
        padding-top: 15px;
        padding-right: 5px;
        padding-left: 5px;
        border-width: 1px;
    }

    .text-field.email.ph {
        padding-top: 12px;
    }

    .text-field.ph {
        padding-top: 12px;
        font-size: 17px;
    }

    .success-message.mobile.ph {
        width: 100%;
        float: none;
    }

    .scroll-to-top {
        right: 0px;
        bottom: 80px;
        width: 30px;
        height: 30px;
        padding: 6px 9px;
        border-style: none;
        background-image: none;
    }

    .scroll-to-top:hover {
        border-style: none;
    }

    .scroll-to-top.sidenav {
        padding-right: 7px;
        padding-left: 8px;
    }

    .scroll-to-top.share {
        bottom: 80px;
        width: 30px;
        height: 30px;
        font-size: 18px;
    }

    .sponsors-flex-parent {
        width: 100%;
        margin-right: 0px;
        margin-left: 3px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        -webkit-align-content: space-between;
        -ms-flex-line-pack: justify;
        align-content: space-between;
    }

    .text-tagline {
        margin-bottom: 0px;
        padding-right: 0px;
    }

    .surfing-in-taiwan {
        display: block;
        width: auto;
        margin-top: 50px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: end;
        -webkit-align-items: flex-end;
        -ms-flex-align: end;
        align-items: flex-end;
        background-image: url("/img/sit9.png");
        background-position: 50% 50%;
        background-size: cover;
    }

    .sit-link.my-multi {
        padding-right: 30px;
        padding-left: 30px;
        font-size: 16px;
        line-height: 24px;
    }

    .cta-button-flex {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .section-heading {
        padding-left: 20px;
        text-align: center;
    }

    .section-heading.sit-heading {
        width: auto;
        padding-left: 0px;
    }

    .section-heading.pro-heading {
        width: auto;
        padding-left: 0px;
    }

    .section-heading.ad {
        text-align: left;
    }

    .section-heading.ad.right {
        padding-left: 0px;
    }

    .section-heading.ad.popup {
        text-align: center;
    }

    .section-heading.feedback-heading {
        width: auto;
        padding-left: 0px;
    }

    .section-heading.wk-wave-vid {
        font-size: 24px;
        letter-spacing: 0px;
    }

    .section-heading.tos {
        font-size: 26px;
    }

    .stream-image.plug-unit-300x250 {
        width: 100%;
        max-width: none;
        border-bottom-left-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .stream-image.plug-unit-300x250.margin35 {
        margin-top: 35px;
    }

    .stream-image.plug-unit-300x150 {
        width: 100%;
        max-width: none;
        border-bottom-left-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .stream-image.plug-unit-300x150.margin35 {
        margin-top: 35px;
    }

    .stream-image.plug-unit-300x250 {
        width: 100%;
        max-width: none;
        border-bottom-left-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .stream-image.plug-unit-300x250.margin35 {
        margin-top: 35px;
    }

    .stream-div {
        -webkit-flex-basis: 53%;
        -ms-flex-preferred-size: 53%;
        flex-basis: 53%;
    }

    .stream-div.tabphland {
        min-height: 410px;
    }

    .stream-div.tabphland.cam {
        margin-top: 20px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .stream-div.tabphland.cam.blog {
        -webkit-flex-basis: 42%;
        -ms-flex-preferred-size: 42%;
        flex-basis: 42%;
    }

    .stream-div.tabphland.cam.blog.list-page {
        max-width: 370px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    }

    .stream-div.tabphland.cam.vid {
        margin-top: 10px;
        margin-bottom: 10px;
    }
    
    .stream-div.tabphland.cam.vid.pro.pro24 {
        flex: 1;
        width: auto;
        max-width: none;
        margin-top: 20px;
        margin-bottom: 20px;
        margin-right: 20px;
        padding-top: 0;
    }

    .stream-div.tabphland.ad-unit-ph-only {
        display: block;
        margin-top: 20px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        background-image: none;
        box-shadow: none;
        -webkit-transition-property: none;
        transition-property: none;
    }

    .stream-div.tabphland.ad-unit-ph-only.top-margin {
        margin-top: 55px;
    }

    .stream-div.tabphland.ad-unit-ph-only.top-margin-more {
        margin-top: 50px;
    }

    .stream-div.pro.border.no-email {
        -webkit-flex-basis: 95%;
        -ms-flex-preferred-size: 95%;
        flex-basis: 95%;
    }

    .ad-mid-page-banner-phone {
        width: 100%;
        max-width: none;
    }

    .dropdown-toggle.nav-icon3.green {
        width: 30px;
        height: 30px;
        padding-top: 0px;
    }

    .navbar-parent {
        margin-bottom: 10px;
        padding-top: 0px;
    }

    .dropdown {
        margin-right: 0px;
    }

    .icon-3 {
        margin-top: 285px;
        margin-right: 0px;
    }

    .icon-4 {
        margin-top: 285px;
        margin-left: 0px;
    }

    .sit-slide {
        bottom: -260px;
    }

    .sit-slide.sit-slide-2 {
        bottom: -233px;
    }

    .sit-slide.sit-slide-2.en {
        bottom: -220px;
    }

    .sit-slide.sit-slide-3 {
        bottom: -250px;
    }

    .sit-slide.sit-slide-3.en {
        bottom: -235px;
    }

    .socials {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .subscribe-div {
        padding-top: 35px;
        padding-right: 35px;
        padding-left: 35px;
    }

    .button-cta-premium {
        margin-right: 50px;
        margin-left: 50px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        line-height: 28px;
    }

    .button-cta-premium:hover {
        background-color: #60b9cb;
        box-shadow: none;
        color: #fff;
    }

    .pro-text-field.check {
        font-size: 19px;
        line-height: 24px;
        letter-spacing: 0.5px;
    }

    .submit-button-pro.button-cta-premium.welcome {
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .pro-checkbox.free {
        margin-right: 10px;
        font-size: 24px;
    }

    .pro-checklist-paragraph {
        font-size: 16px;
    }

    .host-text-link-top {
        font-size: 16px;
    }

    .footer-lang-container {
        padding-right: 50px;
        padding-left: 50px;
    }

    .footer-language-link {
        padding-left: 0px;
        font-size: 14px;
    }

    ._3-4-tw-flex-parent {
        display: block;
        height: auto;
        min-height: 0%;
    }

    ._3-4-tw-side-divs {
        display: block;
    }

    ._3-4-tw-side-divs.right {
        display: block;
        min-height: 275px;
    }

    ._3-4-tw-text.pro-cta {
        margin-right: 15px;
        margin-left: 15px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: right;
    }
    
    ._3-4-tw-text.pro-cta._30-day {
        text-align: center;
        margin-left: 0;
    }
    
    ._3-4-tw-text.pro-cta._30-day.center {
        font-weight: 600;
    }
    
    ._3-4-tw-text.donate {
        filter: drop-shadow(1px 1px 1px #000000b3);
        font-weight: 600;
        line-height: 26px;
        }

    ._3-4-tw-heading {
        padding-left: 20px;
        text-align: center;
    }

    .surf-spot-hero.surf-spot-tabs {
        margin-top: 0px;
    }

    .surf-spot-hero.surf-biz-tabs {
        margin-top: 0px;
    }

    .surf-spot-tabs {
        margin-top: 0px;
    }

    .surf-spot-hero-image {
        padding: 15px;
    }

    .surf-spot-desc {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: auto;
        height: auto;
        max-height: none;
        max-width: none;
        min-height: fit-content;
        min-width: 0px;
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        background-image: -webkit-gradient(linear,
                left top,
                left bottom,
                from(#fff),
                to(#fff));
        background-image: linear-gradient(180deg, #fff, #fff);
    }

    .surf-spot-des-text {
        padding: 10px 25px 15px;
        text-align: justify;
    }

    .surf-spot-des-text.surf-spot-text-2 {
        width: 100%;
        height: auto;
        padding: 15px;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
    }
    
    .surf-spot-des-text.surf-spot-text-2.en-no-cam {
        min-height: 260px;
    }

    .surf-spot-des-text.surf-spot-text-2.en-no-cam.sub {
        min-height: 0px;
        padding-top: 65px;
    }

    .surf-desc-slider {
        width: auto;
        clear: both;
    }

    .surf-spot-hero-div {
        padding-right: 0px;
        padding-left: 0px;
    }

    .surf-spot-flip-div-mobile {
        display: none;
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .spot-infographic {
        display: block;
        margin-top: 20px;
        margin-right: auto;
        margin-left: auto;
        cursor: pointer;
    }

    .spot-desc-heading {
        display: block;
        margin-right: auto;
        margin-left: auto;
        padding-left: 20px;
    }

    .spot-desc-heading.inforgraphic {
        padding-left: 25px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: left;
    }

    .spot-desc-heading.inforgraphic-dt {
        padding-left: 0px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: center;
    }

    .spot-desc-heading.sub {
        margin-top: 0px;
        padding-top: 15px;
    }
    
    .spot-desc-heading.sub.tide {
        margin-top: 0;
        padding-bottom: 10px;
    }

    .inforgraphic-link {
        margin-top: -20px;
        padding-right: 25px;
        font-size: 22px;
        text-align: right;
    }

    .surf-spot-characteristics {
        display: block;
        margin-top: 1px;
        margin-right: 15px;
        margin-bottom: 15px;
        margin-left: 15px;
        padding: 20px 25px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        text-align: center;
    }

    .spot-char-text {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 60%;
        padding-right: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: left;
    }

    .spot-char-text.en-ph {
        font-size: 18px;
        line-height: 20px;
        letter-spacing: 0px;
    }

    .spot-char-flex-parent {
        margin-top: 10px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-content: center;
        -ms-flex-line-pack: center;
        align-content: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    }

    .spot-char-title {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 40%;
        padding-right: 10px;
        padding-left: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-box-align: end;
        -webkit-align-items: flex-end;
        -ms-flex-align: end;
        align-items: flex-end;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: left;
    }

    .spot-char-title.en-ph {
        font-size: 20px;
        line-height: 22px;
        text-align: right;
        letter-spacing: 0px;
    }

    .spot-photo-slider {
        width: 100vw;
        height: auto;
    }

    .spot-image {
        width: 100vw;
        height: auto;
        max-height: 415px;
    }

    .surf-spot-photos {
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .spot-photos-wrapper {
        margin-top: 0px;
        margin-bottom: 0px;
        padding: 0px;
    }

    .surf-spot-characteristics-tablet {
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .spot-infographic-div-mobile {
        width: 100%;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

    .infographic-popup {
        display: none;
    }

    .popup-image {
        width: 55%;
        height: auto;
        margin-top: 0px;
        padding: 10px;
    }

    .info-popup-div {
        width: 90%;
        height: auto;
    }

    .popup-close-link {
        position: relative;
        z-index: 9999;
    }

    .inforgraphic-zoom {
        margin-top: -20px;
        padding-left: 25px;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        font-size: 22px;
    }

    .ad-285x360-hurley {
        width: auto;
        height: auto;
        max-width: 100%;
        margin-top: 15px;
        margin-bottom: 15px;
    }

    .plug-300x250 {
        height: auto;
        max-width: 75%;
        margin-right: 40px;
        margin-bottom: 15px;
        margin-left: 0px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .ad-300x150 {
        height: auto;
        max-width: 75%;
        margin-right: 40px;
        margin-left: 0px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    ._2-ad-div-photos {
        width: 100%;
        margin-bottom: 0px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .videos-photos-section {
        margin-top: 0px;
        margin-bottom: 15px;
    }

    .surf-spot-videos {
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .ad-285x360-videos-desktop {
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .spot-video-slider {
        width: 100vw;
        height: auto;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .vid-arrow {
        height: 70%;
    }

    .spot-videos-wrapper {
        margin-bottom: 0px;
        padding: 0px;
    }

    .mid-page-banner.vid {
        margin-bottom: 40px;
    }

    .sponsors-section-surf-spots.section-hosts-mobile {
        display: block;
        height: auto;
        margin-top: 100px;
        margin-right: auto;
        margin-left: auto;
    }

    .share-video-text-div {
        top: 25%;
        margin: 75px;
    }

    .share-vid-text {
        display: inline-block;
        width: auto;
        padding: 25px;
        float: none;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: center;
    }

    .ad-285x360-videos-mobile {
        margin: 15px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .vid-photo-ad-mobile-div-1 {
        height: 100%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .vid-photo-ad-mobile-div-2 {
        margin-top: 15px;
        margin-bottom: 15px;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: end;
        -webkit-align-items: flex-end;
        -ms-flex-align: end;
        align-items: flex-end;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .video {
        width: 100vw;
    }

    .video-embed {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        margin-right: auto;
        margin-left: auto;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .video-share-div {
        display: block;
        width: 100vw;
        margin-right: auto;
        margin-left: auto;
    }

    .share-video-image {
        width: 100%;
        max-width: none;
    }

    .share-photo-image {
        display: block;
        width: 100vw;
        height: auto;
        max-height: 415px;
        max-width: none;
        margin-right: auto;
        margin-left: auto;
    }

    .video-heading {
        padding-left: 0px;
    }

    .drop-arrow-div {
        right: 10%;
    }

    .spot-tab-link {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        padding-right: 5px;
        padding-left: 5px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        color: rgba(0, 153, 204, 0.7);
        margin-top: 2px;
    }

    .spot-tab-link.info {
        height: 90px;
        margin-right: 10px;
        padding-right: 20px;
        padding-left: 20px;
        line-height: 1.3em;
    }

    .spot-tab-link.info.biz {
        width: 20%;
    }

    .spot-tab-link.info.list {
        height: auto;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .spot-tab-link.info.list.how-to {
        text-align: left;
        text-transform: none;
        white-space: pre-wrap;
        object-fit: fill;
        padding-right: 10px;
        overflow: visible;
    }

    .spot-tab-link.biz.en {
        padding-top: 5px;
        font-size: 18px;
        font-weight: 600;
    }

    .spot-menu {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .surf-spot-infographic-dt {
        max-height: none;
        max-width: none;
        min-height: 345px;
        margin-top: 0px;
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .surf-spot-report-dt {
        z-index: 3;
        display: block;
        min-height: 345px;
        margin: 0px auto;
        padding-bottom: 5px;
        padding-left: 0px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        -webkit-backface-visibility: visible;
        backface-visibility: visible;
    }

    .report-info-div {
        display: block;
        width: 100%;
        height: auto;
        margin-top: -25px;
        text-align: right;
    }

    .report-info-link {
        z-index: 4;
        width: 30px;
        margin-top: 0px;
        padding-right: 0px;
        padding-bottom: 5px;
        padding-left: 0px;
        float: right;
        color: rgba(0, 153, 204, 0.55);
        font-size: 22px;
        text-align: center;
    }

    .surf-spot-desc-cam-flip-div {
        width: 100%;
        max-width: none;
        border-radius: 5px;
    }
    
    .surf-spot-desc-cam-flip-div._2 {
        margin-top: 15px;
        margin-bottom: 0px;
    }

    .surf-spot-cam {
        display: block;
        height: auto;
        min-height: 0px;
        margin-right: auto;
        margin-left: auto;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        -webkit-transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg);
        transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg);
    }

    .no-cam-div {
        display: block;
    }

    .no-cam-div-multispot {
        display: block;
    }

    .button-host-cam {
        margin-top: 0px;
        display: block;
        margin: -90px auto 34px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .read-surf-report-popup {
        display: block;
    }

    .desc {
        width: 14%;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .desc-text {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: auto;
        padding: 0px 0px 0px 10px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        text-align: left;
    }

    .hour-reading-text {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 60%;
        padding-right: 10px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: center;
    }

    .hour-reading-text.reading-text-white {
        padding: 5px;
        border-left-style: solid;
        border-left-color: rgba(0, 0, 0, 0.1);
    }

    .hour-reading-text.reading-text-white.high-tide {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        border-left-style: solid;
        border-left-color: rgba(0, 0, 0, 0.1);
    }

    .hour-reading-text.reading-text-white.low-tide {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        border-left-style: solid;
        border-left-color: rgba(0, 0, 0, 0.1);
    }

    .hour-reading-text.reading-text-black {
        padding: 5px;
        border-right-style: none;
        border-right-color: rgba(0, 0, 0, 0.1);
        border-left-style: solid;
        border-left-color: rgba(0, 0, 0, 0.1);
    }

    .hour-reading-text.reading-text-black.time {
        padding-top: 5px;
        padding-bottom: 5px;
        border-left-style: none;
    }

    .forecast-flex-parent {
        overflow: visible;
        width: 150%;
        margin-top: 0px;
        margin-left: 10px;
        padding-left: 0px;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .forecast-reading {
        width: 100%;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .metric {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: auto;
        padding-top: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: right;
    }

    .arrow-text {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 60%;
        padding: 5px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        font-size: 18px;
        line-height: 18px;
        text-align: left;
        letter-spacing: 0px;
    }

    .arrow-text._225 {
        padding-top: 5px;
        padding-bottom: 5px;
    }

    .arrow-text._90 {
        padding-top: 5px;
        padding-bottom: 5px;
    }

    .arrow-text._45 {
        padding-top: 5px;
        padding-bottom: 5px;
    }

    .arrow-text._70 {
        padding-top: 5px;
        padding-bottom: 5px;
    }

    .weather-text {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 60%;
        padding: 3px 0px 7px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        border-right-style: none;
        border-right-color: rgba(0, 0, 0, 0.1);
        border-left-style: solid;
        border-left-color: rgba(0, 0, 0, 0.1);
        font-size: 18px;
        line-height: 22px;
        text-align: left;
        letter-spacing: 0px;
    }

    .day-arrow {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 60%;
        padding-right: 5px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: left;
    }

    .tab-pane-1 {
        overflow: auto;
    }

    .tab-pane-3 {
        overflow: auto;
    }

    .swipe-div {
        position: relative;
        left: 0px;
        top: 0%;
        right: 0px;
        bottom: 0px;
        z-index: 9999;
        display: none;
        width: 100%;
        height: 100%;
        margin-top: 0px;
        float: none;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        background-image: -webkit-linear-gradient(270deg,
                rgba(0, 0, 0, 0.2),
                rgba(0, 0, 0, 0.2));
        background-image: linear-gradient(180deg,
                rgba(0, 0, 0, 0.2),
                rgba(0, 0, 0, 0.2));
        text-align: center;
        cursor: pointer;
    }

    .swipe-symbols {
        font-family: Fontawesome, sans-serif;
        color: rgba(204, 0, 255, 0.4);
        font-size: 36px;
        line-height: 36px;
        text-align: center;
    }

    .swipe-text {
        margin-top: 5px;
        font-family: "Josefin Sans", sans-serif;
        color: rgba(204, 0, 255, 0.4);
        font-size: 36px;
        line-height: 36px;
        text-align: center;
        letter-spacing: 0.5px;
        text-decoration: none;
        text-transform: uppercase;
    }

    .swipe-text.blog {
        padding-left: 0px;
        font-size: 18px;
        line-height: 24px;
        text-transform: none;
    }

    .swipe-text.blog.author {
        font-size: 13px;
        line-height: 20px;
        letter-spacing: 0px;
    }

    .report-div-mobile {
        width: 100%;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

    .surf-spot-characteristics-tablet-21 {
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .report-info-link-mobile {
        margin-top: -30px;
        padding-right: 25px;
        font-size: 22px;
        text-align: right;
    }

    .spot-infographic-tablet {
        display: block;
        margin-right: auto;
        margin-left: auto;
        cursor: default;
    }

    .top-line {
        width: 30px;
    }

    .middle-line {
        width: 30px;
    }

    .bottom-line {
        width: 30px;
    }

    .name-banner {
        margin-top: 15px;
    }

    .banner-title {
        padding-top: 0px;
        padding-left: 10px;
        font-size: 24px;
        font-weight: 400;
    }

    .banner-title.center.success {
        font-size: 26px;
    }

    .title-container {
        width: 100%;
    }

    .marker-pin {
        padding-right: 20px;
    }

    .marker-pin.header {
        height: 34px;
    }

    .marker-div {
        margin-right: 10px;
    }
    
    .text-pop-parent.cog {
        margin-top: 195px;
    }

    .text-pop-child {
        letter-spacing: 0px;
    }
    
  .text-pop-child.cog {
    font-size: 24px;
    line-height: 34px;
    font-weight: 400;
  }

    .section-payments.margin {
        margin-top: 45px;
    }

    .container-payments {
        padding-right: 10px;
        padding-left: 10px;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .ad-type {
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .ad-type.right {
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .html-embed-ad {
        padding-top: 10px;
    }

    .view-ad-link {
        font-size: 18px;
    }

    .header-fixed {
        position: static;
    }

    ._50-off-popup {
        display: none;
    }

    .discount-popup-div {
        width: 90%;
        height: auto;
    }

    .ad-size {
        font-size: 18px;
    }

    .biz-logo {
        display: block;
        margin-top: 20px;
        margin-right: auto;
        margin-left: auto;
        cursor: pointer;
    }

    .biz-logo-div {
        width: 100%;
        max-height: none;
        max-width: none;
        min-height: 0px;
        margin: 0px 0px 15px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .biz-desc {
        width: 100%;
        min-height: 0px;
        min-width: 0px;
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .surf-biz-hero-image {
        margin-bottom: 0px;
        padding: 15px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .surf-biz-des-text {
        padding: 10px 25px 15px;
        text-align: justify;
    }

    .surf-biz-des-text.surf-biz-text-2 {
        padding: 25px;
    }

    .surf-biz-des-text.surf-biz-text-2.about {
        padding-right: 5px;
        padding-left: 5px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.bullet {
        padding-left: 40px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.bullet.tit {
        padding-left: 20px;
    }
    
    .surf-biz-des-text.surf-biz-text-2.about.bullet.pro {
        line-height: 18px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.blog.en2.how-to {
        text-align: center;
    }

    .surf-biz-des-text.surf-biz-text-2.about.blog.bott-pad {
        margin-bottom: 5px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.indent.bott-pad {
        margin-bottom: 5px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.indent.center.background {
        margin-right: 10px;
        margin-left: 10px;
        padding-right: 5px;
        padding-left: 5px;
        font-size: 14px;
        letter-spacing: 0px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.tab {
        padding-right: 0px;
        padding-left: 0px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.en {
        padding-left: 25px;
    }

    .surf-biz-des-text.register {
        font-size: 22px;
        line-height: 20px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.my-multi {
        color: #555;
        font-size: 18px;
    }

    .surf-biz-des-text.surf-biz-text-2.my-multi {
        margin-top: 20px;
        font-size: 20px;
    }

    .social-div {
        bottom: 110px;
        width: 30px;
        height: 90px;
    }

    .social-div.landing {
        width: 55%;
    }

    .social-button {
        padding-right: 0px;
    }

    .feedback-popup {
        display: none;
    }

    .feedback-popup-div {
        width: 90%;
        height: 70%;
    }

    .close-button {
        top: 8px;
        right: 25px;
        width: 30px;
        height: 30px;
        font-size: 16px;
        line-height: 28px;
    }

    .close-button.nav {
        position: absolute;
        top: auto;
        right: 35px;
        bottom: 35px;
        width: 40px;
        height: 40px;
        background-color: #fff;
        color: #a0e5ce;
        font-size: 19px;
        line-height: 37px;
    }
    
    .close-button.blue {
        inset: auto 10px 10px auto;
    }

    .preload-text {
        font-size: 22px;
        line-height: 30px;
    }

    .modal-card {
        top: 54%;
        width: 90%;
        height: 68%;
        min-height: 0px;
    }

    .welcome-paragraph {
        font-size: 18px;
        line-height: 1.4em;
    }

    .preload-text-fc {
        font-size: 22px;
        line-height: 30px;
    }

    .amen-box {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        height: 90px;
        margin-right: 10px;
        padding-right: 6px;
        padding-left: 6px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .text-amen {
        padding-right: 6px;
        padding-left: 6px;
        font-size: 18px;
        line-height: 1.3em;
    }

    .text-amen.yes {
        padding-right: 6px;
        padding-left: 6px;
        line-height: 1.3em;
    }

    .hidden-add {
        padding-right: 0px;
        padding-left: 0px;
    }

    .hidden {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        padding-right: 5px;
        padding-left: 5px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        line-height: 1.3em;
        font-weight: 700;
    }

    .hidden.no-pointer {
        font-weight: 100;
    }

    .hidden.success {
        width: 70%;
        padding-top: 12px;
    }

    .hidden.success:hover {
        padding-top: 11px;
    }

    .hidden-ph {
        padding-right: 0px;
        padding-left: 0px;
    }

    .hidden-email {
        display: none;
        padding-right: 0px;
        padding-left: 0px;
    }

    .success-div {
        display: block;
    }

    .success-div.success-right {
        display: block;
        min-height: 275px;
    }

    .success-div.success-right.sub {
        background-position: 50% 50%;
    }

    .hidden-subscribe-footer {
        display: none;
    }

    .host-popup {
        display: none;
    }

    .list-popup {
        display: none;
    }

    .ad-popup {
        display: none;
    }

    .footer-image.lazyload {
        margin-bottom: 125px;
        background-position: -318px 0px;
    }
    
    .footer-image._3-percent {
        background-position: 0 0, 42%;
    }

    .spot-tab-link-phone {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        padding-right: 5px;
        padding-left: 5px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        color: rgba(0, 153, 204, 0.7);
        margin-top: 2px;
    }

    .spot-tab-link-ph {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        padding-right: 5px;
        padding-left: 5px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        color: rgba(0, 153, 204, 0.7);
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
    }

    .surf-spot-cam-ph {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: inline;
        width: auto;
        height: auto;
        max-height: none;
        max-width: none;
        min-height: 0px;
        min-width: 0px;
        margin-right: 0px;
        margin-left: 0px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        background-image: -webkit-gradient(linear,
                left top,
                left bottom,
                from(#fff),
                to(#fff));
        background-image: linear-gradient(180deg, #fff, #fff);
    }

    .host-flex-parent {
        display: block;
        height: auto;
        min-height: 0%;
    }

    .host-div {
        display: block;
    }

    .host-div.host-right {
        display: block;
        min-height: 275px;
    }

    .surf-report-div {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        margin-top: -5px;
        margin-right: auto;
        margin-left: auto;
        padding-top: 0px;
        padding-bottom: 0px;
        padding-left: 25px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        cursor: default;
    }

    .surf-report-div.my-multi {
        padding-left: 0px;
    }

    .surf-report-div.my-multi.forecast {
        display: block;
        max-width: none;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .hidden-list-1 {
        padding-right: 0px;
        padding-left: 0px;
    }

    .hidden-list-2 {
        padding-right: 0px;
        padding-left: 0px;
    }

    .list-section.vids {
        margin-top: 0px;
    }

    .list-section.vids-ph {
        margin-top: 15px;
    }

    .list-section.vids-ph.login {
        margin-top: 50px;
    }
    
    .list-section.vids-ph.pro24 {
        grid-column-gap: 0px;
        grid-row-gap: 0px;
        align-items: stretch;
        margin-top: 25px;
    }

    .list {
        width: 75%;
    }

    .list.trouble {
        width: 100%;
        padding-right: 12px;
        padding-left: 12px;
    }

    .list-link {
        padding-top: 7px;
        padding-bottom: 7px;
        font-size: 19px;
    }

    .list-link.search {
        margin-right: 10px;
        margin-left: 10px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .list-link.search.arrow {
        padding-left: 0px;
    }

    .list-link.search.rt:hover {
        padding-bottom: 7px;
    }

    .list-link.search.rt.blog {
        padding-right: 20px;
        padding-left: 0px;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        text-align: right;
    }

    .list-link.search.rt.blog:hover {
        padding-bottom: 7px;
    }

    .list-link.search.blog {
        display: block;
        padding-left: 20px;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .list-link.search.blog:hover {
        padding-bottom: 7px;
    }

    .list-link.search.blog.center {
        padding-left: 0px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        text-align: center;
    }

    .list-link.search.blog._3-col {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .list-link.search.blog._3-col.ph {
        padding-top: 5px;
        padding-bottom: 3px;
        padding-left: 0px;
        text-align: center;
    }

    .list-link.search.blog2 {
        display: block;
        padding-right: 25px;
        padding-left: 25px;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .list-link.search.blog2:hover {
        padding-bottom: 7px;
    }

    .list-link.search.blog2.center {
        padding-left: 0px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        text-align: center;
    }

    .list-link.ad-text {
        padding-bottom: 2px;
        padding-left: 0px;
        text-align: center;
    }

    .list-link.ad-text:hover {
        padding-bottom: 2px;
    }

    .list-link.ad-text.arrow {
        padding-left: 0px;
    }

    .list-dropdown {
        height: 0px;
    }

    .list-dropdown.how-to {
        padding-left: 0px;
    }

    .search.blog {
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .city-list {
        width: 90%;
    }

    .list-info {
        width: 100%;
        float: none;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .list-info.right {
        float: none;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .list-info.right.blogr {
        width: 50%;
    }

    .list-info.blog {
        width: 50%;
    }

    .list-info.blog.center {
        width: 100%;
    }

    .list-info.blog._3-col.ph {
        width: 100%;
        margin-bottom: 20px;
        text-decoration: none;
    }

    .list-info.ad {
        padding-left: 0px;
    }

    .cam-name-div.vid {
        height: auto;
    }

    .cs-banner {
        bottom: 20px;
        margin-top: 15px;
    }

    .cs-text {
        padding-right: 25px;
        padding-left: 25px;
    }

    .sup-section {
        margin-top: 50px;
    }

    .sup-section.pro {
        padding-right: 20px;
        padding-left: 20px;
    }

    ._404-text {
        font-size: 225px;
    }

    .nav-map-text.sidemap.scroll-to-top {
        display: none;
        width: 30px;
        height: 30px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        border-style: none;
        font-size: 18px;
    }

    .free-text {
        padding-right: 20px;
        padding-left: 20px;
    }

    .nav-popup {
        display: none;
    }

    .nav-close-container {
        left: 0px;
        top: 55%;
        right: 0px;
        bottom: 0px;
        padding-top: 0px;
        padding-bottom: 0px;
        -webkit-transform: translate(0px, -50%);
        -ms-transform: translate(0px, -50%);
        transform: translate(0px, -50%);
    }

    .scroll-to-top-ph {
        right: 0px;
        bottom: 80px;
        width: 30px;
        height: 30px;
        padding: 6px 9px;
        border-style: none;
        background-image: none;
    }

    .scroll-to-top-ph:hover {
        border-style: none;
    }

    .scroll-to-top-ph.sidenav {
        padding-right: 7px;
        padding-left: 8px;
    }

    .scroll-to-top-ph.share {
        bottom: 80px;
        width: 30px;
        height: 30px;
        font-size: 18px;
    }

    .social-div-ph {
        bottom: 110px;
        width: 30px;
        height: 90px;
    }
    
    .vid-wrapper.pro24 {
        width: 50%;
        margin-bottom: 23px;
        padding-top: 0;
    }

    .vid-wrapper.pro24.ph {
        margin-bottom: 20px;
        display: none;
    }

    .vid-wrapper.pro24.all.full-width {
        width: 100%;
        margin-right: 0;
    }

    .social-div-ph.landing {
        width: 55%;
    }

    .scroll-to-top-phone {
        right: 0px;
        bottom: 80px;
        width: 30px;
        height: 30px;
        padding: 6px 9px;
        border-style: none;
        background-image: none;
    }

    .scroll-to-top-phone:hover {
        border-style: none;
    }

    .scroll-to-top-phone.sidenav {
        padding-right: 7px;
        padding-left: 8px;
    }

    .scroll-to-top-phone.share {
        bottom: 80px;
        width: 30px;
        height: 30px;
        font-size: 18px;
    }

    .video-surf-spots {
        padding-right: 10px;
        padding-left: 10px;
        color: #636161;
    }

    .video-surf-spots.promo._2019 {
        width: 80%;
        padding-right: 30px;
        padding-left: 30px;
    }

    .blog-section {
        margin-bottom: 35px;
        padding-bottom: 0px;
    }

    .blog-section.no-pad.no-pad2 {
        margin-bottom: 0px;
    }

    .blog-image {
        padding-top: 25px;
    }

    .blog-image.no-margin.no-pad {
        padding-top: 0px;
    }

    .blog-image.tab {
        padding-top: 0px;
    }

    .blog-image.pad {
        padding-top: 0px;
    }

    .blog-text-blue.center {
        padding-top: 35px;
    }

    .blog-text-blue.center.pro {
        padding-top: 0px;
    }
    
    .blog-text-blue.en.cta {
        padding-left: 0;
    }

    .blog-flex-parent._3-col {
        margin-left: 45px;
        padding-right: 5px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .blog-flex-parent.legend.wind {
        width: 70%;
        max-height: 100vh;
    }

    .blog-flex-parent.direction {
        padding-right: 20px;
        padding-left: 20px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .column._1 {
        margin-left: 15px;
    }

    .column._3 {
        width: 85%;
        margin-left: 5px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .blog-text {
        margin-bottom: 0px;
    }
    
    .blog-text.en, .blog-text.en.infographic {
        min-height: 0;
    }

    .blog-div {
        width: 100%;
        box-shadow: none;
    }

    .blog-div.full {
        padding-right: 0px;
        padding-left: 0px;
    }

    .blog-div.full.no-margin {
        margin-top: 0px;
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .blog-div.en {
        padding: 5px 10px;
    }

    .blog-div.en.pad {
        padding-top: 0px;
    }

    .blog-text-col-left.dir {
        width: 100%;
        margin-left: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .image-3 {
        width: 350px;
    }

    .blog-flex-parent-2._3-col {
        margin-left: 45px;
        padding-right: 5px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .blog-2-col-parent {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .blog-comments._3-4-tw {
        padding-top: 15px;
    }

    .blog-legend-col-mid {
        margin-right: 5px;
        margin-left: 5px;
        padding-right: 0px;
        padding-left: 0px;
    }

    .blog-legend-col-left {
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .blog-legend-col-mid-ft {
        display: none;
        margin-right: 5px;
        margin-left: 5px;
        padding-right: 0px;
        padding-left: 0px;
    }

    .legend-units {
        width: 14%;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .legend-metric {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: auto;
        padding-top: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: right;
    }

    .legend-metric-ft {
        display: none;
        width: auto;
        padding-top: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: right;
    }

    .blog-300x250 {
        margin-right: 25px;
    }

    .blog-300x250.ph {
        margin-right: auto;
    }

    .blog-3-col-parent {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .lightbox-link-3-col {
        width: auto;
    }

    .lightbox-link-3-col.ph {
        width: 51%;
        text-decoration: none;
    }

    .legend-metric-ms {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: auto;
        padding-top: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: right;
    }

    .legend-metric-km {
        display: none;
        width: auto;
        padding-top: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: right;
    }

    .legend-metric-mph {
        display: none;
        width: auto;
        padding-top: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: right;
    }

    .legend-metric-kn {
        display: none;
        width: auto;
        padding-top: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: right;
    }

    .hidden-android {
        display: none;
        padding-right: 0px;
        padding-left: 0px;
    }

    .wave-legend-img {
        width: 75%;
    }

    .blog-285x360 {
        width: 50%;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

    .legend-metric-ph {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: auto;
        padding-top: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: right;
    }

    .legend-metric-ft-ph {
        display: none;
        width: auto;
        padding-top: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        text-align: right;
    }

    .blog-legend-col-mid-ph {
        margin-right: 5px;
        margin-left: 5px;
        padding-right: 0px;
        padding-left: 0px;
    }

    .blog-legend-col-mid-ft-ph {
        display: none;
        margin-right: 5px;
        margin-left: 5px;
        padding-right: 0px;
        padding-left: 0px;
    }

    .wetsuit-image {
        width: 350px;
    }

    .direction-image {
        width: 350px;
    }

    .htc-image {
        width: 350px;
    }
    
    .report-div.infographic {
        padding-left: 5px;
        padding-right: 5px;
    }

    .forecast-help-link {
        margin-top: 0px;
        padding-right: 25px;
        font-size: 22px;
        text-align: right;
    }

    .text-low-case {
        font-weight: 600;
    }

    .arrow-3-4-tw-left {
        height: 150px;
    }

    .arrow-3-4-tw-left.full {
        margin-top: 275px;
    }

    .arrow-3-4-tw-left.below {
        margin-top: 290px;
    }

    .arrow-3-4-tw-right {
        height: 150px;
    }

    .arrow-3-4-tw-right.full {
        left: auto;
        height: 150px;
        margin-top: 275px;
    }

    .arrow-3-4-tw-right.below {
        margin-top: 290px;
    }

    .video-640-square {
        width: 90%;
        margin-top: 50px;
    }

    .slideshow {
        overflow: hidden;
        margin-bottom: 50px;
    }

    .name-banner-nav {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }

    .name-banner-nav.blog {
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .name-banner-nav.my-multi {
        max-width: 90%;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
    
    .name-banner-nav._34tw {
        display: none;
    }

    .name-banner-nav._34tw.mobile {
        display: block;
    }

    .name-banner-link {
        width: 20%;
        margin-left: 10px;
        float: none;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .name-banner-link.right {
        margin-right: 10px;
        margin-left: 0px;
        float: none;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
    }

    .name-banner-link.right.blogr {
        width: 50%;
    }

    .name-banner-link.blog {
        width: 50%;
    }

    .name-banner-link.blog.center {
        width: 100%;
    }

    .name-banner-link.blog._3-col.ph {
        width: 100%;
        margin-bottom: 20px;
        text-decoration: none;
    }

    .name-banner-link.ad {
        padding-left: 0px;
    }

    .name-banner-link.mid {
        width: 45%;
        margin-left: 0px;
    }

    .name-banner-link._34tw, .slide-3-for-tw {
        width: 100%;
    }

    .slider-images {
        max-height: 97%;
        float: left;
    }

    .slider-images.rt {
        float: left;
    }

    .slider-images.rt.lazyload {
        float: left;
    }

    .slider-images.mid {
        float: left;
    }

    .slider-images.mid.lazyload {
        float: left;
    }

    .slider-images.cover {
        max-width: 90%;
        float: none;
    }

    .slider-images.lazyload {
        max-height: 100%;
        float: left;
    }

    .arrow-3-4-tw {
        top: -250px;
        right: 5px;
    }

    .arrow-3-4-tw.lt {
        top: -250px;
        right: 9%;
    }

    .photo-remove {
        margin-right: 5px;
        margin-left: 5px;
        padding-right: 0px;
        padding-left: 0px;
    }

    .photo-remove.pro {
        margin-top: 25px;
    }

    .photo-remove.pro.sub {
        margin-top: 40px;
    }

    .nav-lang-text {
        font-size: 20px;
    }

    .nav-lang-text.en {
        font-size: 20px;
    }

    .nav-lang-text.zh {
        font-size: 18px;
    }

    .nav-lang-text.en-zh {
        font-size: 18px;
    }

    .nav-lang-link-zh.w--current {
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .nav-lang-link-zh.en {
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .home-feature {
        margin-top: 50px;
        margin-bottom: 50px;
    }

    .pro-button-container {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-align: baseline;
        -webkit-align-items: baseline;
        -ms-flex-align: baseline;
        align-items: baseline;
    }

    .user-icon {
        font-size: 20px;
    }

    .user-icon.sidemap.scroll-to-top {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 30px;
        height: 30px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        border-style: none;
        font-size: 18px;
    }

    .user-icon.en {
        font-size: 20px;
    }

    .user-icon.zh {
        font-size: 18px;
    }

    .user-icon.en-zh {
        font-size: 18px;
    }

    .payment-banner {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .payment-banner.restrict {
        width: 20%;
        padding-top: 12px;
        padding-bottom: 8px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        font-size: 18px;
        font-weight: 400;
    }

    .logout-button {
        margin-right: 10px;
        padding-right: 10px;
        padding-left: 10px;
    }

    .login-section {
        margin-top: 35px;
    }

    .upgrade-popup {
        display: none;
    }

    .update-pay-popup {
        display: none;
    }

    .continue-button-container {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-align: baseline;
        -webkit-align-items: baseline;
        -ms-flex-align: baseline;
        align-items: baseline;
    }

    .cam-sub-overlay {
        top: 0px;
        bottom: 0px;
        z-index: 2999;
        display: block;
        height: auto;
        min-height: 0px;
        margin-right: auto;
        margin-left: auto;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        background-image: -webkit-gradient(linear,
                left top,
                left bottom,
                from(#555),
                to(#555));
        background-image: linear-gradient(180deg, #555, #555);
        box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.2);
        -webkit-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
        transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    }

    .cam-sub-overlay-ms {
        top: 0px;
        z-index: 2999;
        display: block;
        height: auto;
        min-height: 0px;
        margin-right: auto;
        margin-left: auto;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.2);
        -webkit-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
        transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    }

    .cam-overlay-div {
        position: static;
        display: block;
        max-height: 360px;
        max-width: 640px;
        min-height: 360px;
        min-width: 0px;
        padding-top: 0px;
        padding-bottom: 0px;
        /* background-image: -webkit-gradient(linear,
                left top,
                left bottom,
                from(rgba(0, 0, 0, 0.3)),
                to(rgba(0, 0, 0, 0.3))),
            url("/img/posters/vid-poster-dl.jpg");
        background-image: linear-gradient(180deg,
                rgba(0, 0, 0, 0.3),
                rgba(0, 0, 0, 0.3)),
            url("/img/posters/vid-poster-dl.jpg"); */
        background-position: 0px 0px, 50% 50%;
        background-size: auto, contain;
        background-repeat: repeat, no-repeat;
    }

    .try-pro-div {
        margin-top: 100px;
    }

    .vid-photo-ad-desktop-ad-free {
        display: none;
        width: 0px;
        height: 0px;
        margin-top: 15px;
        margin-bottom: 15px;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: end;
        -webkit-align-items: flex-end;
        -ms-flex-align: end;
        align-items: flex-end;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .ad-free-spacer-ph {
        display: block;
        height: 15px;
        background-color: #fff;
    }

    .plug-300x250-ph {
        display: block;
        width: 300px;
        height: 250px;
        margin-top: 20px;
        margin-right: auto;
        margin-left: auto;
    }

    .plug-300x250-ph.mar-top-50 {
        margin-top: 50px;
    }

    .slide-icon.my-multi.ph {
        position: -webkit-sticky;
        position: sticky;
        display: block;
        margin-top: 0px;
    }

    .navbar-ad {
        height: 42px;
    }

    .navad-text {
        height: 42px;
        font-size: 20px;
    }

    .nav-wave {
        height: 42px;
    }

    .login-no-trial {
        margin-bottom: 40px;
    }

    .login-no-trial.nomargin {
        margin-bottom: 40px;
    }

    .sms-popup {
        display: none;
    }

    .forecast-units {
        margin-right: 30px;
        margin-left: 30px;
    }

    .plug-300x250-ph {
        display: block;
        width: 300px;
        height: 250px;
        margin-top: 20px;
        margin-right: auto;
        margin-left: auto;
    }

    .plug-300x250-ph.mar-top-50 {
        margin-top: 50px;
    }

    .plug-300x250-300x150-ph {
        display: block;
        margin-top: 40px;
        margin-bottom: 20px;
    }

    .plug-300x150-ph {
        display: block;
        width: 300px;
        height: 150px;
        margin-top: 20px;
        margin-right: auto;
        margin-left: auto;
    }

    .plug-300x150-ph.mar-top-50 {
        margin-top: 50px;
    }

    .image-blog-small {
        margin-right: auto;
        margin-left: auto;
    }

    .multi-forecast-div.new {
        padding-top: 20px;
    }

    .multi-spot-welcome {
        height: auto;
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(40%, hsla(0, 0%, 100%, 0.1)), to(#fff)), url('/img/multi-spot/multi-spot-cover.jpg');
        background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0.1) 40%, #fff), url('/img/multi-spot/multi-spot-cover.jpg');
        background-position: 0px 0px, 50% 0%;
        background-size: auto, cover;
        background-repeat: repeat, no-repeat;
    }

    .multi-stream-div {
        display: none;
    }

    .mask {
        width: 33.3%;
    }

    .last-slide-wrapper {
        padding-right: 0%;
    }

    .host-wrap {
        margin-right: 5px;
        margin-left: 5px;
    }

    .form-device-restrict {
        margin-right: 10px;
        margin-left: 10px;
    }

    .form-restrict {
        margin-top: 5px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-content: space-between;
        -ms-flex-line-pack: justify;
        align-content: space-between;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .field-label {
        width: auto;
        margin-bottom: 0px;
        font-size: 22px;
        font-weight: 400;
    }

    .dropdown-2 {
        padding-top: 20px;
        font-size: 20px;
    }

    .bold-text-4 {
        font-size: 24px;
        font-weight: 600;
    }

    .card-slide {
        width: 49.25%;
        height: auto;
        margin-right: 2px;
        margin-left: 2px;
        padding-right: 0px;
        padding-left: 0px;
    }

    .card-slider {
        overflow: scroll;
        width: auto;
        max-width: 100vw;
        margin-right: 5px;
        margin-left: 5px;
        padding-bottom: 0px;
        padding-left: 0px;
        -webkit-align-self: center;
        -ms-flex-item-align: center;
        -ms-grid-row-align: center;
        align-self: center;
    }

    .card-slider-mask {
        display: block;
        overflow: visible;
        padding-top: 0px;
    }

    .section-4 {
        padding-top: 6%;
        padding-bottom: 6%;
    }

    .card {
        max-height: 330px;
        max-width: 250px;
        margin-right: auto;
        margin-left: auto;
        padding-top: 10px;
        padding-bottom: 10px;
        padding-right: 5px;
        padding-left: 5px;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .multi-report-slider-div {
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .slide-stream {
        display: block;
        max-width: none;
        margin-top: 20px;
        margin-right: auto;
        margin-left: auto;
    }

    .reports-streams-div {
        padding-top: 4px;
    }

    .forecast-slider-nav {
        position: -webkit-sticky;
        position: sticky;
        left: 0%;
        top: auto;
        right: 0%;
        bottom: auto;
        display: block;
        margin-top: 20px;
        margin-bottom: 0px;
        padding-top: 0px;
        padding-bottom: 0px;
        float: none;
    }
    
    .forecast-section {
        height: 430px;
    }
    
    .typhoon-button {
        border-width: 2px;
        line-height: 22px;
    }

    .typhoon-button:active {
        border-width: 1px;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .typhoon-button:focus {
        border-width: 1px;
    }
    
    .typhoon-button.now.cta {
        padding: 1px;
        font-size: 13px;
        line-height: 16px;
    }
    
    ._30-day-contain {
        clear: none;
        flex-flow: wrap;
        justify-content: flex-end;
        margin-right: 10%;
    }

    ._30-day-contain.pro {
        margin-right: 0%;
    }
    
    .host-paragraph {
        text-align: left;
    }

  .footer4_links {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
    flex-direction: column;
  }

  .footer4_component {
    grid-template-rows: auto;
    grid-template-columns: 1fr;
    justify-items: start;
    display: flex;
  }

  .faq-types-wrapper-grid {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
    flex-direction: column;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    grid-auto-flow: row;
    margin-top: 20px;
    display: grid;
  }

  .image-small {
    width: 60%;
  }

  .image-holder {
    order: -1;
  }

  .footer4_logo-link {
    padding-left: 0;
  }

  .margin-top {
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
  }

  .nav_logo-link {
    padding-left: 0;
  }

  .padding-global {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .padding-section-small {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }

  .margin-bottom {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
  }

  .padding-vertical {
    padding-left: 0;
    padding-right: 0;
  }
    
  .photo-rounded {
    border-style: none;
    border-radius: 20px;
    margin-top: 15px;
    padding-left: 0;
    padding-right: 0;
  }
    
  .h1-pro24 {
    margin-right: 0;
    padding-top: 15px;
    padding-right: 0;
    font-size: 25px;
    line-height: 27px;
  }

  .text-pro24 {
    width: 90%;
    margin-top: 10px;
    padding-left: 20px;
    font-size: 17px;
    line-height: 1.3em;
  }

  .text-pro24.right-para {
    width: 90%;
    margin-top: 20px;
    padding-bottom: 10px;
    padding-left: 0;
    padding-right: 0;
  }

  .text-pro24.right-para.big {
    font-size: 24px;
  }

  .text-pro24.right-para.big.benefit {
    min-height: 95px;
  }

  .text-pro24.right-para.guarantee {
    padding-left: 10px;
    padding-right: 10px;
  }

  .text-pro24.center {
    min-height: 200px;
  }

  .pro24-cta {
    border-width: 1px;
    margin-top: 15px;
    padding: 9px 5px;
    font-size: 17px;
    line-height: 22px;
  }

  .pro24-cta:active {
    border-width: 1px;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .pro24-cta:focus {
    border-width: 1px;
  }

  .pro24-cta.now.cta {
    padding: 1px;
    font-size: 13px;
    line-height: 16px;
  }

  .pro24-cta.ms {
    width: 90%;
  }

  .pro24-cta.ms.center {
    width: 50%;
  }

  .pro24-cta.ms.center.orange {
    margin-top: 60px;
  }

  .pro24-section-color.blue {
    padding-bottom: 0;
  }

  .image-paragraph {
    flex-flow: column;
    justify-content: center;
    margin-right: 20px;
  }

  .ms-60 {
    width: auto;
    margin-left: auto;
    margin-right: auto;
  }

  .ms-60._40 {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }

  .container-center {
    margin-top: -10px;
  }

  .nav-popup-pro {
    display: none;
  }
  .cell-2 {
    min-height: 0;
  }

  .column-infographic {
    padding-top: 0;
  }

  .column-infographic.wave {
    padding-left: 0;
    padding-right: 0;
  }

  .inforgraphic-tide {
    flex-flow: column;
  }
    
  .help-how-pro-helps-popup, .help-how-pro-helps-popup, .help-read-forecast-popup, .help-infographic-popup, .help-read-report-popup, .help-multi-spot-popup, .help-stream-offline-popup, .help-view-streams-popup, .help-view-forecast-popup, .help-login-issue-popup, .help-logout-issue-popup, .help-purchase-pro-popup, .help-account-share-popup, .help-cancel-sub-popup, .help-guarantee-popup, .help-discount-popup, .help-referral-popup, .help-billing-popup, .help-pay-method-popup, .help-how-purchase-popup, .help-which-plan-popup, .help-travel-popup, .help-afterbuy-popup, .help-easy-popup, .help-reliable-popup, .help-why-popup, .help-how-contact-popup, .help-advertise-popup, .help-biz-popup, .help-host-popup, .help-swelleye-helps-popup, .help-cleanup-popup, .help-host-cleanup-popup, .help-protect-popup, .help-donate-popup, .help-about-popup, .help-mission-purpose-promise-popup, .help-services-popup, .help-new-cam-popup {
    display: none;
  }

  .help-page-popup-div {
    border-radius: 0;
    width: 100%;
    height: 100%;
    max-height: none;
    padding-left: 5px;
  }
}

@media (max-width: 479px) {
    .left-wrapper {
        margin-left: -5px;
    }

    .jw-logo.jw-logo-bottom-left.jw-reset {
        margin-bottom: 0 !important;
        bottom: -30px;
        width: 16vw !important;
        height: 7vw !important;
    }

    .left-wrapper.logo-left {
        margin-right: -23px;
        margin-left: 0px;
    }

    .middle-wrapper {
        display: block;
        padding-left: 0px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    }

    .middle-wrapper.logo-center {
        width: 46%;
    }

    .right-wrapper {
        margin-left: -5px;
    }

    .right-wrapper.logo-right {
        margin-left: -23px;
    }

    .text-block.coming-text {
        line-height: 1.3em;
        letter-spacing: 0.1em;
    }

    .text-block._404-text-2 {
        line-height: 1.3em;
        letter-spacing: 0.1em;
    }

    .text-block._404-text-3 {
        padding-right: 15px;
        padding-left: 15px;
        line-height: 1.3em;
        letter-spacing: 0em;
    }

    .flex-parent-plug-ban {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .section-2.info {
        margin-top: 100px;
    }

    .section-2.info.en {
        margin-top: 175px;
    }

    .heading-info {
        color: #333;
    }

    .heading-info.latest {
        padding-right: 5px;
        padding-left: 5px;
        font-size: 17px;
    }

    .heading-info.streaming {
        color: #09c;
    }

    .heading-info.about {
        padding-right: 10px;
        padding-left: 10px;
        color: #09c;
        line-height: 30px;
    }

    .heading-info.about.center {
        padding-right: 5px;
        padding-left: 5px;
        font-size: 24px;
        letter-spacing: 0px;
    }

    .heading-info.pro {
        color: #09c;
    }

    .heading-info.pro.payment {
        width: 61%;
        margin: 0px;
        padding: 12px 0px 8px 5px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        background-color: #98d7ec;
    }

    .heading-info.pro.payment.bk {
        width: 62%;
        background-color: transparent;
        font-weight: 300;
    }

    .heading-info.pro.payment.bk.ph {
        width: 50%;
        margin-top: 15px;
        margin-bottom: 15px;
        margin-left: 10px;
        padding-right: 0px;
        padding-left: 0px;
        font-weight: 300;
        text-align: left;
        text-transform: uppercase;
    }

    .heading-info.pro.payment.ref {
        width: 65%;
    }

    .text-info.stream.pro {
        margin-top: 5px;
        margin-bottom: 5px;
    }

    .text-info.ad {
        padding-right: 15px;
        text-align: center;
    }

    .text-info.ad.right {
        padding-right: 15px;
        padding-left: 15px;
        text-align: center;
    }

    .text-info.ad.pro {
        letter-spacing: 0.5px;
    }

    .text-info.ad.pro.descrip {
        padding-right: 35px;
        padding-left: 35px;
        font-size: 18px;
        font-weight: 400;
        letter-spacing: 0.5px;
    }

    .text-info.ad.pro.descrip.margin {
        padding-right: 15px;
        padding-left: 15px;
        letter-spacing: 0px;
    }

    .text-info.ad.pro.descrip.margin.surfcheck {
        padding-right: 15px;
        padding-left: 15px;
        font-size: 15px;
        line-height: 18px;
    }

    .button-cta.button-map {
        font-size: 14px;
        font-weight: 600;
        letter-spacing: 0.5px;
    }

    .button-cta.button-map.button-map-tablet.button-map-phone-port {
        padding-right: 15px;
        padding-left: 15px;
        font-size: 18px;
        letter-spacing: 0px;
    }

    .button-cta.button-map.button-map-tablet.button-map-phone-port.cs._404 {
        margin-top: 100px;
        margin-left: 25px;
        padding-right: 25px;
        padding-left: 25px;
        float: left;
    }

    .button-cta.button-map.button-map-tablet.button-map-phone-port.cs._404.rt {
        margin-right: 25px;
        margin-left: 0px;
        float: right;
    }

    .button-cta.button-map.button-map-tablet.button-map-phone-port.cs.ja {
        margin-bottom: 0px;
        padding: 10px 15px 8px;
        font-size: 16px;
    }

    .section-hosts.section-hosts-mobile {
        display: block;
        width: 100%;
        height: auto;
        max-width: none;
        margin: 15px auto 0px;
        margin-top: 100px;
        padding-bottom: 15px;
    }

    .flex-child-plugspon {
        width: 33%;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .sponsor-image {
        width: 100%;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .button.sponsors {
        margin-top: 50px;
        font-size: 12px;
        cursor: default;
    }

    .heading-1.hero-text {
        padding-right: 20px;
        padding-bottom: 30px;
        padding-left: 20px;
        font-size: 30px;
    }

    .heading-1.hero-text.cs.en {
        margin-bottom: -20px;
        font-size: 26px;
    }

    .heading-1.hero-text.cs.ja {
        margin-bottom: -40px;
        color: #09c;
        font-size: 20px;
        text-shadow: none;
    }

    .heading-1.blog {
        padding-right: 5px;
        padding-left: 5px;
        font-size: 28px;
    }

    .container {
        top: 135px;
        margin-bottom: -200px;
    }

    .container.en {
        top: 145px;
        margin-bottom: -300px;
    }

    .container.ja {
        top: 175px;
        margin-bottom: -180px;
    }

    .container.en-home {
        margin-bottom: -235px;
    }

    .map-text-button-overlay-wrap {
        margin-top: -30px;
    }

    .tab-link {
        width: 33%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .tab-link.w--current {
        width: 34%;
    }

    .tab-link.tabs {
        padding-right: 5px;
        padding-left: 5px;
        -webkit-flex-basis: 33.33%;
        -ms-flex-preferred-size: 33.33%;
        flex-basis: 33.33%;
    }

    .tab-link.tabs.w--current {
        padding-right: 5px;
        padding-left: 5px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 33.33%;
        -ms-flex: 0 33.33%;
        flex: 0 33.33%;
    }

    .tab-link.forecast-tabs {
        width: 25%;
        padding-right: 5px;
        padding-left: 5px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .tab-link.forecast-tabs.w--current {
        padding-right: 5px;
        padding-left: 5px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 25%;
        -ms-flex: 0 25%;
        flex: 0 25%;
        border-right-style: none;
        border-left-style: none;
    }

    .tabs-menu {
        position: static;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        overflow: auto;
        margin-bottom: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        text-align: left;
    }

    .video-flex-parent {
        padding: 20px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-align-content: center;
        -ms-flex-line-pack: center;
        align-content: center;
    }

    .video-flex-parent.cam.last {
        margin-bottom: 35px;
    }

    .video-flex-parent.cam.vid.last {
        margin-bottom: 0px;
        padding-bottom: 0px;
    }

    .video-flex-parent.cam.blog-related {
        width: 100%;
        padding-right: 0px;
        padding-left: 0px;
    }

    .video-flex-parent.pro {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .video-flex-parent.pro.descr {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .side-columns {
        padding-top: 0px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .side-columns.see-the-surf-first {
        padding-top: 0px;
    }

    .vid-container {
        padding-right: 0px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .vid-container.right {
        padding-top: 10px;
        padding-right: 20px;
        padding-left: 20px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

    .vid-container.right.see-button {
        margin-bottom: 30px;
        padding-top: 0px;
        padding-right: 20px;
        padding-left: 20px;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-flex-basis: 100%;
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    }

    .vid-container.right.see-button.phone-port-see-butt {
        margin-bottom: 0px;
    }

    .button-more-vids {
        width: 100%;
        margin-bottom: 40px;
    }

    .button-more-vids.cancel {
        width: auto;
        margin: 40px 20px 0px;
        padding-right: 5px;
        padding-left: 5px;
    }

    .button-more-vids.cancel.sub {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 90%;
        margin-top: 30px;
        margin-right: auto;
        margin-left: auto;
    }

    .button-more-vids.cancel.sub.ms-mobile {
        margin-top: 0px;
    }

    .button-more-vids.cancel.sub:hover {
        width: 90%;
    }

    .button-more-vids.cancel.sub.try-pro {
        margin-right: 0px;
        font-size: 22px;
    }

    .text-tabs {
        font-size: 16px;
        line-height: 0.5em;
        text-align: center;
        letter-spacing: 0px;
    }

    .icon.phone-land-arrow.phone-port-arrow {
        margin-top: 210px;
        margin-left: 0px;
        font-size: 0.75em;
    }

    .icon.phone-land-arrow.phone-port-arrow.desktop-arrow.port-arrow {
        margin-top: auto;
        margin-left: 10px;
        font-size: 30px;
    }

    .icon.desktop-arrow.port-arrow {
        font-size: 0.75em;
    }

    .icon-2.phone-land-arrow {
        margin-top: 210px;
    }

    .icon-2.phone-land-arrow.phone-port-arrow {
        margin-right: 0px;
        font-size: 0.75em;
    }

    .icon-2.phone-land-arrow.phone-port-arrow.desktop-arrow.port-arrow {
        margin-top: auto;
        margin-right: 0px;
        margin-left: 10px;
        font-size: 30px;
    }

    .icon-2.desktop-arrow.port-arrow {
        font-size: 0.75em;
    }

    .section-tabs-ad {
        margin-top: 0px;
        margin-bottom: 25px;
    }

    .arrow-right {
        margin-bottom: 95px;
    }

    .left-arrow {
        margin-bottom: 95px;
    }

    .left-arrow.arrow-vimeo {
        margin-bottom: 95px;
    }

    .footer-col {
        display: none;
        padding-right: 5px;
        padding-left: 15px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .footer-col.social {
        padding-right: 0px;
    }

    .footer-links-wrap {
        padding-bottom: 0px;
    }

    .copyright-wrap {
        margin-right: 20px;
        margin-left: 20px;
    }

    .copyright-text {
        margin-bottom: 15px;
        padding-right: 0px;
        padding-left: 0px;
        color: #0885af;
        font-size: 17px;
        text-align: center;
    }

    .copyright-text.no-margin {
        padding-right: 20px;
        padding-left: 20px;
    }

    .link-block-2 {
        padding-right: 0px;
    }

    .social-link {
        margin-top: 35px;
        margin-right: 35px;
        margin-left: 35px;
    }

    .email-subscribe.success {
        margin-top: 15px;
        margin-bottom: 15px;
    }

    .email-subscribe.contact {
        margin-top: 35px;
        margin-bottom: 15px;
    }

    .email-subscribe.host {
        margin-top: 35px;
        margin-bottom: 15px;
    }

    .email-subscribe.free {
        margin-top: 0px;
        margin-bottom: 35px;
    }

    .email-subscribe.free.pro.login {
        width: 90%;
    }

    .submit-button {
        padding-right: 10px;
        padding-left: 10px;
    }

    .text-field {
        padding-right: 8px;
        padding-left: 8px;
        letter-spacing: 0px;
    }

    .text-field.hidden.success {
        width: 90%;
        padding-right: 0px;
        padding-left: 0px;
        font-size: 18px;
    }

    .text-field.hidden.success:hover {
        padding-top: 13px;
        padding-bottom: 0px;
    }

    .text-field.hidden.contact {
        width: 85%;
    }

    .text-field.hidden.contact.free {
        width: 90%;
    }

    .text-field.hidden.contact.free.pro {
        margin-right: 20px;
        margin-left: 20px;
        padding-top: 2px;
        padding-right: 10px;
        padding-left: 10px;
    }

    .text-field.hidden.contact.free.pro.rt {
        margin-right: 20px;
        margin-left: 20px;
    }

    .text-field.hidden.contact.free.pro.login {
        width: auto;
        margin-right: 10px;
        margin-left: 10px;
    }

    .text-field.hidden.contact.free.pro.zh.giveaway {
        width: 85%;
    }

    .text-field.hidden.contact.free.my-multi {
        width: 30%;
        margin-right: 20px;
        font-size: 19px;
    }

    .text-field.hidden.contact.free.my-multi:focus {
        letter-spacing: 0px;
    }

    .text-field.hidden.contact.free.my-multi.tab-ph-land {
        display: none;
    }

    .text-field.hidden.contact.free.my-multi.dt-ph-port {
        display: block;
    }

    .text-field.hidden.host {
        width: 85%;
    }

    .text-field.hidden.host.iphone {
        font-weight: 100;
    }

    .text-field.hidden.host.iphone:focus {
        padding-top: 11px;
        padding-bottom: 11px;
        border-width: 1px;
        letter-spacing: 0px;
    }

    .text-field.hidden.list {
        width: 85%;
        border-style: solid;
        border-color: #09c;
        color: #09c;
    }

    .text-field.hidden.list.multi {
        width: 95%;
        padding-right: 5px;
        padding-left: 5px;
        font-size: 19px;
    }

    .scroll-to-top {
        right: 0px;
        bottom: 80px;
        padding: 6px 9px;
    }

    .scroll-to-top:hover {
        border-style: none;
    }

    .scroll-to-top.share.ph {
        font-size: 20px;
    }

    .scroll-to-top.ph {
        position: relative;
        bottom: 0px;
        z-index: 9999;
        width: 40px;
        height: 40px;
        padding: 8px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        opacity: 1;
        color: #09c;
        font-size: 20px;
    }

    .sponsors-flex-parent {
        width: auto;
        margin-top: 15px;
        margin-bottom: 50px;
        margin-left: 0px;
        padding-right: 5px;
        padding-left: 5px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-align-content: space-between;
        -ms-flex-line-pack: justify;
        align-content: space-between;
    }

    .text-tagline {
        margin-top: 20px;
        color: #fff;
        text-align: center;
    }

    .surfing-in-taiwan {
        margin-top: 25px;
        margin-bottom: 50px;
        background-image: url("/img/sit9.png");
        background-position: 44% 50%;
        background-size: cover;
        background-repeat: no-repeat;
    }

  .sit-link.my-multi {
    display: block;
    padding-right: 10px;
    padding-left: 10px;
    font-family: Muli, sans-serif;
    line-height: 24px;
    text-align: center;
  }

    .news-flex-pa {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        -webkit-align-content: stretch;
        -ms-flex-line-pack: stretch;
        align-content: stretch;
    }

    .news-flex-pa.tos {
        padding-right: 0px;
        padding-left: 0px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .section-heading {
        padding-right: 10px;
        padding-left: 10px;
        text-align: center;
    }

    .section-heading.sit-heading {
        margin-top: 20px;
        padding-right: 0px;
    }

    .section-heading.pro-heading {
        margin-top: 20px;
        padding-right: 0px;
    }

    .section-heading.ad {
        padding-right: 5px;
        padding-left: 5px;
        text-align: center;
    }

    .section-heading.ad.right {
        margin-top: 25px;
        padding-right: 5px;
        padding-left: 5px;
        text-align: center;
    }

    .section-heading.feedback-heading {
        margin-top: 20px;
        padding-right: 0px;
    }

    .section-heading.tos {
        padding-right: 0px;
        font-size: 22px;
        letter-spacing: 0px;
    }

    .news-div.left {
        margin-right: 10px;
        margin-bottom: 20px;
        margin-left: 10px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .news-div.right {
        margin-top: 10px;
        margin-right: 10px;
        margin-left: 10px;
    }

    .news-div.tos {
        width: 90%;
    }
    
    .news-div.no-shadow.tos {
        display: none;
    }

    .news-div.no-shadow.tos.ph {
        display: block;
        width: 70%;
    }

    .stream-image.plug-unit-300x250.margin35 {
        margin-top: 0px;
    }

    .stream-image.plug-unit-300x150.margin35 {
        margin-top: 0px;
    }

    .stream-image.plug-unit-300x250.margin35 {
        margin-top: 0px;
    }

    .stream-div {
        -webkit-box-flex: 0;
        -webkit-flex: 0 84%;
        -ms-flex: 0 84%;
        flex: 0 84%;
    }

    .stream-div.ph {
        min-height: 387px;
    }

    .stream-div.tabphland.cam.blog {
        -webkit-flex-basis: 80%;
        -ms-flex-preferred-size: 80%;
        flex-basis: 80%;
    }

    .stream-div.tabphland.cam.blog.list-page {
        -webkit-flex-basis: 90%;
        -ms-flex-preferred-size: 90%;
        flex-basis: 90%;
    }
    
    .stream-div.tabphland.cam.vid.pro.pro24 {
        margin-right: 0;
        padding-left: 20px;
        padding-right: 20px;
    }

    .stream-div.tabphland.ad-unit-ph-only {
        margin-right: 0px;
        margin-left: 0px;
    }

    .stream-div.tabphland.ad-unit-ph-only.top-margin {
        margin-top: 0px;
        margin-bottom: 35px;
    }

    .stream-div.pro {
        margin-bottom: 25px;
        margin-left: 30px;
        margin-right: 30px;
    }

    .stream-div.pro.border {
        margin-right: 30px;
        margin-left: 30px;
    }

    .ad-mid-page-banner-phone {
        width: auto;
        max-width: 100%;
    }

    .dropdown-toggle.nav-icon3.blue {
        padding-left: 10px;
    }

    .dropdown-toggle.nav-icon3.green {
        margin-top: -10px;
    }

    .navbar-parent {
        margin-bottom: 5px;
    }

    .sit-wrapper {
        margin-top: 25px;
    }

    .icon-3 {
        margin-top: 260px;
        font-size: 30px;
    }

    .icon-3.en {
        margin-top: 240px;
    }

    .icon-4 {
        margin-top: 260px;
        font-size: 30px;
    }

    .icon-4.en {
        margin-top: 240px;
    }

    .sit-slide {
        bottom: -210px;
    }

    .sit-slide.sit-slide-2 {
        bottom: -140px;
    }

    .sit-slide.sit-slide-2.en {
        bottom: -105px;
    }

    .sit-slide.sit-slide-3 {
        bottom: -200px;
    }

    .sit-slide.sit-slide-3.en {
        bottom: -130px;
    }

    .sit-slide.en {
        bottom: -150px;
    }

    .slide-nav-2 {
        padding-top: 0px;
    }

    .slide-nav-2.en {
        margin-bottom: -50px;
    }

    .socials {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .subscribe-div {
        margin-right: 35px;
        margin-left: 35px;
        padding-right: 0px;
        padding-left: 0px;
    }

    .footer-links-1 {
        margin-right: 35px;
        margin-left: 35px;
    }

    .footer-title-phone-port {
        float: left;
        -webkit-transition: opacity 200ms ease;
        transition: opacity 200ms ease;
        color: #0885af;
    }

    .footer-link-plus {
        margin-right: 0px;
        float: right;
        color: #fff;
    }

    .footer-link-phone {
        position: relative;
        overflow: visible;
        padding: 5px 20px;
        text-align: center;
        cursor: pointer;
    }

    .footer-link-phone:hover {
        color: #0885af;
        font-weight: 400;
    }

    .dropdown-phone {
        display: inline-block;
        width: 100%;
        border-style: none none solid;
        border-width: 1px;
        border-color: #fff;
        color: #333;
    }

    .dropdown-list-phone {
        position: relative;
        display: block;
        overflow: hidden;
        height: 0px;
    }

    .dropdown-list-phone.w--open {
        background-color: transparent;
    }

    .dropdown-toggle-2 {
        width: 100%;
        padding: 5px 35px 5px 0px;
        text-align: left;
    }

    .try-premium-section {
        margin-top: 80px;
    }

    .button-cta-premium {
        margin-right: 30px;
        margin-left: 30px;
        padding-left: 15px;
    }

    .pro-text-field.units {
        letter-spacing: 0.5px;
    }

    .submit-button-pro.button-cta-premium.welcome {
        padding-right: 15px;
    }

    .pro-checklist-paragraph {
        padding-right: 15px;
    }

    .host-text-link-top {
        font-size: 14px;
        width: auto;
    }

    .footer-language-div {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        height: 40px;
        margin-bottom: 40px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .footer-lang-container {
        margin-top: 0px;
        padding-right: 0px;
        padding-left: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .footer-language-link {
        padding-right: 15px;
        padding-left: 0px;
        color: rgba(0, 0, 0, 0.31);
        font-size: 14px;
        text-align: center;
    }

    ._3-4-tw-text.pro-cta {
        margin-right: 25px;
        margin-bottom: 15px;
        margin-left: 25px;
        font-size: 18px;
        line-height: 20px;
        text-align: center;
    }
    
    ._3-4-tw-text.pro-cta._30-day {
        align-self: center;
        margin-bottom: 0;
    }
    
    ._3-4-tw-text.pro-cta._30-day.center {
        font-weight: 400;
    }

    ._3-4-tw-heading {
        padding-top: 50px;
        padding-right: 10px;
        padding-left: 10px;
        text-align: center;
    }

    .surf-spot-hero.surf-spot-tabs {
        margin-top: 0px;
    }

    .surf-spot-hero.surf-biz-tabs {
        margin-top: 0px;
    }

    .surf-spot-hero-image {
        padding: 15px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-align-content: center;
        -ms-flex-line-pack: center;
        align-content: center;
    }
    
    .surf-spot-hero-image.stream {
        padding: 0px;
        margin-top: 0px;
        margin-bottom: 5px;
    }

    .surf-spot-desc {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        max-height: none;
        min-height: fit-content;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .surf-spot-slide-1 {
        height: auto;
    }

    .surf-spot-des-text.surf-spot-text-2 {
        padding: 10px;
        max-height: none;
        min-height: unset;
        font-size: 13px;
        line-height: 19px;
    }

    .surf-spot-des-text.surf-spot-text-2.en-no-cam {
        min-height: 0px; 
        padding-top: 0px;
        padding-bottom: 20px;
        font-size: 14px;
        padding-left: 25px;
        padding-right: 25px;
        line-height: 16px;
        letter-spacing: 0px;
    }

    .surf-spot-flip-div-mobile {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .spot-infographic {
        margin-top: 10px;
        cursor: pointer;
    }

    .spot-desc-heading {
        margin-top: 0px;
        padding-left: 25px;
        color: #09c;
        line-height: 30px;
    }

    .spot-desc-heading.inforgraphic {
        padding-left: 15px;
        line-height: 30px;
    }

    .spot-desc-heading.inforgraphic-dt {
        padding-left: 15px;
        line-height: 30px;
    }

    .inforgraphic-link {
        padding-right: 15px;
    }

    .surf-spot-characteristics {
        margin-right: 15px;
        margin-bottom: 15px;
        margin-left: 15px;
        padding: 5px 15px 10px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .spot-photo-slider {
        width: 100vw;
        height: auto;
        margin-left: 0px;
    }

    .slider-arrow {
        z-index: 9999;
    }

    .slider-arrow.right-arrow {
        margin-top: 0px;
        margin-right: 5px;
    }

    .slider-arrow.left-arrow2 {
        margin-top: 0px;
        margin-left: 5px;
    }

    .spot-image {
        display: block;
        width: 100vw;
        height: auto;
        margin-right: auto;
        margin-left: auto;
    }

    .surf-spot-photos {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .spot-photos-wrapper {
        padding: 0px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-align-content: center;
        -ms-flex-line-pack: center;
        align-content: center;
    }

    .surf-spot-characteristics-tablet {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .infographic-popup {
        display: none;
    }

    .popup-image {
        width: auto;
    }

    .inforgraphic-zoom {
        padding-left: 15px;
    }

    .ad-285x360-hurley {
        max-width: 100%;
        margin-top: 0px;
        margin-bottom: 0px;
        text-align: left;
    }

    .plug-300x250 {
        display: block;
        width: auto;
        max-width: none;
        margin-right: 15px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .plug-300x250-quiksilver {
        max-width: 100%;
    }

    .ad-300x150-vast {
        max-width: 100%;
    }

    .ad-300x150 {
        width: auto;
        max-width: none;
        margin-right: 15px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    ._2-ad-div-photos {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        margin-bottom: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .videos-photos-section {
        margin-top: 0px;
        margin-bottom: 15px;
    }

    .surf-spot-videos {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .ad-285x360-videos-desktop {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .vid-arrow {
        width: 40px;
        height: 60%;
    }

    .spot-videos-wrapper {
        padding: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-align-content: center;
        -ms-flex-line-pack: center;
        align-content: center;
    }

    .mid-page-banner.vid {
        margin-bottom: 20px;
    }

    .surf-spot-map-section {
        margin-top: 50px;
        margin-bottom: 15px;
    }

    .sponsors-section-surf-spots.section-hosts-mobile {
        display: block;
        width: 100%;
        height: auto;
        max-width: none;
        margin: 100px auto 0px;
        padding-bottom: 15px;
    }

    .share-video-text-div {
        left: 0px;
        top: 0%;
        right: 0px;
        bottom: 0px;
        margin: 0px;
        padding-top: 0px;
        border-radius: 0px;
        background-image: none;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
    }

    .share-vid-text {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: -webkit-inline-box;
        height: 85%;
        margin-top: 0px;
        padding: 0px 35px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        font-size: 18px;
        line-height: 22px;
        text-align: center;
        text-shadow: 1px 0 17px #fff;
    }

    .ad-285x360-videos-mobile {
        display: block;
        margin: 15px 0px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .vid-photo-ad-mobile-div-1 {
        height: auto;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .vid-photo-ad-mobile-div-2 {
        width: 45%;
        margin-left: 15px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    }

    .video-flex {
        margin-top: 0px;
    }

    .video {
        width: 100%;
    }

    .video-share-div {
        width: 100%;
    }

    .share-photo-image {
        text-align: left;
    }

    .video-heading {
        text-indent: 5px;
        padding-right: 5px;
        top: 2px;
        margin-top: 0px;
        padding-left: 0px;
        font-size: 18px;
        line-height: 30px;
        letter-spacing: normal;
    }

    .pro-link-plus {
        margin-right: 0px;
        float: right;
        color: #fff;
    }

    .spot-tab-link {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        height: 50px;
        padding: 0px 1px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        font-size: 15px;
        line-height: 1em;
        font-weight: 600;
        margin-top: 2px;
    }

    .spot-tab-link.info {
        width: 28%;
        margin-top: 10px;
    }

    .spot-tab-link.info:focus {
        border-color: #09c;
        background-image: -webkit-linear-gradient(270deg, #09c, #09c);
        background-image: linear-gradient(180deg, #09c, #09c);
        color: #fff;
    }

    .spot-tab-link.info.biz {
        width: 28%;
        margin-top: 0px;
        margin-bottom: 10px;
        padding-right: 8px;
        padding-left: 8px;
        font-size: 16px;
    }

    .spot-tab-link.info.list {
        padding-left: 10px;
        text-align: left;
    }

    .spot-tab-link.info.list.bizness {
        width: 95%;
        padding-left: 10px;
        font-size: 17px;
    }

    .spot-tab-link.info.list.how-to {
        width: 100%;
        padding-right: 0px;
        padding-left: 0px;
        font-weight: 300;
    }

    .spot-tab-link.biz.en {
        font-size: 18px;
    }

    .spot-menu {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }

    .footer-link-plus-2 {
        margin-right: 0px;
        float: right;
        color: #fff;
    }

    .footer-link-plus-3 {
        margin-right: 0px;
        float: right;
        color: #fff;
    }

    .surf-spot-infographic-dt {
        position: relative;
        z-index: 5;
        display: block;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .surf-spot-report-dt {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        -webkit-backface-visibility: visible;
        backface-visibility: visible;
    }

    .report-info-link {
        z-index: 3;
        padding-right: 10px;
        padding-bottom: 0px;
    }

    .surf-spot-cam {
        height: auto;
        min-height: 0px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        -webkit-transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg);
        transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg);
    }

    .button-host-cam {
        margin-left: 25px;
        margin-right: 25px;
        width: auto;
        margin-top: 0px;
        margin-bottom: 25px;
        padding-top: 8px;
        padding-bottom: 5px;
    }

    .read-surf-report-popup {
        display: block;
    }

    .forecast-section {
        margin-top: 15px;
        margin-bottom: 30px;
        height: 680px;
    }

    .forecast-section.blog._4 {
        background-position: 100% 50%;
    }

    .forecast-section.blog.giveaway {
        height: 300px;
    }

    .desc {
        width: 100%;
        margin-top: 0px;
        margin-right: 0px;
        border-style: none none solid;
        border-width: 1px;
        border-color: #000 #000 rgba(0, 0, 0, 0.1);
        background-image: -webkit-linear-gradient(270deg, #f6f6f6, #f6f6f6);
        background-image: linear-gradient(180deg, #f6f6f6, #f6f6f6);
    }

    .desc.hour {
        border-top-style: none;
        border-top-color: rgba(0, 0, 0, 0.5);
        background-image: -webkit-linear-gradient(270deg, #fff, #fff);
        background-image: linear-gradient(180deg, #fff, #fff);
    }

    .desc-text {
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 16px;
        font-weight: 600;
        text-align: center;
    }

    .desc-text.ph {
        padding-right: 10px;
        font-size: 22px;
    }

    .hour-reading-text.reading-text-white {
        display: block;
        width: auto;
        padding: 5px 10px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        border-left-style: solid;
        border-left-color: rgba(0, 0, 0, 0.1);
    }

    .hour-reading-text.reading-text-black {
        display: block;
        width: auto;
        padding: 5px 10px;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        border-bottom-style: none;
        border-left-style: solid;
        border-left-color: rgba(0, 0, 0, 0.1);
    }

    .hour-reading-text.reading-text-black.time {
        padding-top: 5px;
        padding-bottom: 5px;
        border-left-style: solid;
    }

    .forecast-flex-parent {
        display: block;
        width: 215%;
        margin-top: 0px;
        margin-bottom: 0px;
        margin-left: 0px;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .forecast-reading {
        width: 100%;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        border-style: none;
        border-width: 1px;
        border-color: #000 #000 rgba(0, 0, 0, 0.5) rgba(0, 0, 0, 0.1);
    }

    .metric {
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 16px;
    }

    .arrow-text {
        padding-top: 5px;
        font-size: 18px;
        line-height: 15px;
        letter-spacing: 0px;
    }

    .weather-text {
        padding-top: 5px;
        padding-bottom: 5px;
        border-left-style: solid;
        border-left-color: rgba(0, 0, 0, 0.1);
    }

    .day-arrow._70 {
        display: block;
        margin-right: auto;
        margin-left: auto;
        text-align: center;
    }

    .swipe-text.blog {
        margin-right: 10px;
        margin-bottom: 25px;
        margin-left: 10px;
    }

    .surf-spot-characteristics-tablet-21 {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .report-info-link-mobile {
        padding-right: 15px;
    }

    .spot-infographic-tablet {
        cursor: pointer;
    }

    .plug-top-ban {
        display: none;
    }

    .plug-top-ban.ph {
        display: inline-block;
        margin-top: 1px;
    }

    .text-block-7 {
        margin-top: 7px;
        padding-top: 0px;
        font-size: 20px;
    }

    .subscribe-button {
        padding-right: 10px;
        padding-left: 10px;
    }

    .top-line {
        top: 9px;
    }

    .middle-line {
        top: 18px;
    }

    .bottom-line {
        top: 28px;
    }

    .name-banner {
        height: 50px;
    }

    .banner-title {
        margin-bottom: 0px;
        padding: 5px 10px;
        font-size: 22px;
        line-height: 22px;
    }

    .title-container {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .marker-pin {
        padding-right: 15px;
    }

    .marker-pin.header {
        height: 32px;
    }

    .marker-div {
        height: 32px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }
    
  .text-pop-parent.cog {
    display: none;
    width: auto;
    margin-top: 215px;
    margin-right: 7px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
  }

    .text-pop-child {
        width: 120px;
    }
    
  .text-pop-child.cog {
    width: auto;
    padding-right: 5px;
    padding-left: 5px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    font-size: 22px;
    line-height: 36px;
    text-align: center;
    letter-spacing: -0.75px;
  }

    .container-payments {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .ad-type {
        width: 100%;
    }

    .html-embed-ad {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        padding-left: 0px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .html-embed-ad.right {
        padding-right: 0px;
        float: none;
    }

    .view-ad-link {
        padding-left: 0px;
        text-align: center;
    }

    .view-ad-link.right {
        text-align: center;
    }

    ._50-off-popup {
        display: none;
    }

    .ad-size {
        padding-left: 0px;
        text-align: center;
    }

    .ad-size.right {
        text-align: center;
    }
    
    .social-share-to-top-div.pro {
        display: block;
    }

    .biz-logo {
        margin-top: 20px;
        margin-bottom: 20px;
        cursor: pointer;
    }

    .biz-logo-div {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .biz-desc {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .surf-biz-hero-image {
        padding: 15px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-align-content: center;
        -ms-flex-line-pack: center;
        align-content: center;
    }

    .surf-biz-des-text.surf-biz-text-2 {
        padding: 15px 15px 10px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.bullet {
        padding-left: 40px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.bullet.tit {
        padding-left: 20px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.blog.bott-pad {
        margin-bottom: 0px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.center {
        padding-left: 20px;
        padding-right: 20px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.indent {
        padding-right: 15px;
        padding-left: 50px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.indent.bott-pad {
        margin-bottom: 0px;
    }
    
    .surf-biz-des-text.surf-biz-text-2.about.indent.top-padding {
    padding-top: 15px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.ph {
        display: block;
        margin-right: auto;
        margin-left: auto;
        padding-right: 0px;
        padding-left: 0px;
    }

    .surf-biz-des-text.surf-biz-text-2.about.en {
        padding-right: 15px;
        padding-left: 10px;
        font-size: 19px;
        letter-spacing: 0px;
    }

    .info-section {
        margin-top: 25px;
    }

    .info-container {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .social-div {
        display: none;
    }

    .social-div.landing {
        width: 100%;
    }

    .social-button {
        padding-right: 0px;
    }

    .feedback-popup {
        display: none;
    }

    .feedback-popup-div {
        height: 75%;
    }

    .close-button {
        top: 20px;
        right: 25px;
    }

    .close-button.nav {
        right: 0px;
        bottom: 0px;
    }
    
    .close-button.blue {
        inset: 10px 10px auto auto;
    }

    .modal-card {
        position: fixed;
        left: 0px;
        top: 53%;
        right: 0px;
        bottom: auto;
        z-index: 1;
        display: block;
        width: 83%;
        height: 82%;
        min-height: 0px;
        margin-right: auto;
        margin-left: auto;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .left-arrow-ph {
        display: block;
        margin-bottom: 95px;
    }

    .arrow-right-ph {
        display: block;
        margin-bottom: 95px;
    }
    
    .forecast-embed.ms {
    height: 710px;
    }

    .amenities {
        margin-top: 0px;
    }

    .amen-box {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 33%;
        height: 50px;
        margin-top: 15px;
        margin-right: 15px;
        padding: 0px 5px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        font-size: 17px;
        line-height: 1em;
        font-weight: 600;
    }

    .amen-box.lastbox.yes {
        width: 33%;
    }

    .amen-box.yes {
        width: 28%;
    }

    .text-amen {
        font-size: 16px;
    }

    .amen-wrap {
        margin-bottom: 0px;
        padding-right: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        -webkit-align-content: stretch;
        -ms-flex-line-pack: stretch;
        align-content: stretch;
    }

    .amen-wrap.ph {
        margin-bottom: 30px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap-reverse;
        -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    }

    .hidden-add {
        display: none;
    }

    .hidden {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        height: 80px;
        padding: 0px 10px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        font-size: 22px;
        line-height: 1.3em;
        font-weight: 700;
    }

    .hidden.no-pointer {
        height: auto;
        padding-top: 5px;
        padding-bottom: 5px;
        font-weight: 100;
    }

    .hidden.success {
        width: 90%;
        height: 50px;
        padding: 14px 5px 0px;
        font-size: 18px;
    }

    .hidden.success:hover {
        padding-top: 13px;
        padding-bottom: 0px;
    }

    .hidden-ph {
        display: none;
    }

    .hidden-ph.success {
        margin-top: 15px;
        margin-bottom: 15px;
    }

    .hidden-email {
        display: none;
    }

    .success-div.success-right.sub {
        background-position: 35% 50%;
    }

    .hidden-subscribe-footer {
        display: none;
    }

    .host-popup {
        display: none;
    }

    .list-popup {
        display: none;
    }

    .ad-popup {
        display: none;
    }

    .footer-image.lazyload {
        margin-bottom: 100px;
        background-image: none;
    }
    
    .footer-image._3-percent {
        background-image: linear-gradient(0deg, #00000059 10%, #fff3), url('/img/3-4-tw-banner.jpg');
        background-position: 0 0, 46%;
        background-repeat: repeat, no-repeat;
        background-size: auto, cover;
        padding-bottom: 15px;
    }

    .spot-tab-link-phone {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        height: 50px;
        padding: 0px 1px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        font-size: 15px;
        line-height: 1em;
        font-weight: 600;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        margin-top: 2px;
    }

    .spot-tab-link-ph {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        height: 50px;
        padding: 0px 1px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        font-size: 15px;
        line-height: 1em;
        font-weight: 600;
    }
    
        .spot-tab-link-ph.zh {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        height: 50px;
        padding: 0px 1px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        font-size: 15px;
        line-height: 1em;
        font-weight: 600;
    }
    
    .surf-spot-desc-cam-flip-div {
        box-shadow: none;
        border-radius: 0px;
    }

    .surf-spot-cam-ph {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        max-height: 390px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        border-radius: 0px;
        background-image: none;
    }

    #iocloud_player,
    #iocloud_player [data-player],
    #teacher_cs_test,
    #teacher_cs_test [data-player] {
        max-height: 194px !important;
        width: 100% !important;
    }

    .footer-image-ph {
        height: auto;
        margin-bottom: 0px;
        background-image: none;
    }

    .image-about-foot-ph {
        display: block;
        margin-right: auto;
        margin-left: auto;
    }

    .surf-report-div {
        cursor: pointer;
    }

    .hidden-list-1 {
        display: none;
    }

    .hidden-list-2 {
        display: none;
    }

    .list-section {
        margin-top: 25px;
    }

    .list-section.vids-ph.login {
        margin-top: 40px;
    }
    
    .list-section.vids-ph.pro24 {
        display: block;
    }

    .list-pulldowns {
        margin-right: 20px;
        margin-left: 20px;
    }

    .list-pulldowns.biz {
        margin-right: 0px;
        margin-left: 0px;
    }

    .list {
        display: inline-block;
        width: 100%;
        border-style: none none solid;
        border-width: 1px;
        border-color: #fff;
        color: #333;
    }

    .dropdown-toggle-list {
        width: 100%;
        padding: 20px 35px 10px 0px;
        text-align: left;
    }

    .dropdown-toggle-list:hover {
        padding-bottom: 9px;
        border-bottom-width: 1px;
    }

    .dropdown-toggle-list.biz.shops {
        padding-bottom: 10px;
        border-bottom-style: none;
    }

    .dropdown-toggle-list.biz.shops:hover {
        padding-bottom: 10px;
        border-bottom-style: none;
    }

    .dropdown-toggle-list.biz.retail {
        padding-bottom: 10px;
        border-bottom-style: none;
    }

    .dropdown-toggle-list.biz.boards {
        padding-bottom: 10px;
        border-bottom-style: none;
    }

    .dropdown-toggle-list.biz.cafe {
        padding-bottom: 10px;
        border-bottom-style: none;
    }

    .footer-link-plus-list-1 {
        margin-right: 0px;
        padding-right: 20px;
        float: right;
        color: #999;
    }

    .footer-link-plus-list-1.biz {
        padding-right: 25px;
    }

    .list-link {
        position: relative;
        overflow: visible;
        width: 85%;
        padding: 7px 20px;
        line-height: 1.3em;
        text-align: center;
        cursor: pointer;
    }

    .list-link:hover {
        padding-bottom: 5px;
        border-bottom-width: 1px;
        color: #09c;
        font-weight: 400;
    }

    .list-link.search {
        padding-left: 0px;
    }

    .list-link.search.arrow {
        display: block;
        padding-left: 10px;
    }

    .list-link.search.arrow.rt {
        padding-right: 10px;
    }

    .list-link.search.arrow._3-4-tw {
        display: block;
    }

    .list-link.search.rt {
        padding-right: 0px;
        padding-left: 0px;
        text-align: right;
    }

    .list-link.search.rt:hover {
        color: #999;
    }

    .list-link.search.rt.blog {
        padding-top: 0px;
        padding-right: 0px;
        text-align: center;
    }

    .list-link.search.rt.blog:hover {
        color: #999;
        font-weight: 100;
    }

    .list-link.search.rt.en {
        padding-top: 10px;
        padding-bottom: 0px;
        padding-left: 0px;
        text-align: center;
    }

    .list-link.search.rt.subs {
        position: static;
        width: 100%;
        text-align: center;
    }

    .list-link.search.blog {
        padding-right: 10px;
        padding-left: 10px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        text-align: center;
    }

    .list-link.search.blog:hover {
        color: #999;
        font-weight: 100;
    }

    .list-link.search.blog.center {
        padding-right: 25px;
        padding-left: 25px;
    }

    .list-link.search.blog.center.subs {
        position: static;
        padding-right: 0px;
        padding-left: 0px;
    }

    .list-link.search.blog2 {
        padding-right: 10px;
        padding-left: 10px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        text-align: center;
    }

    .list-link.search.blog2:hover {
        color: #999;
        font-weight: 100;
    }

    .list-link.search.blog2.center {
        padding-right: 25px;
        padding-left: 25px;
    }

    .list-link.search.nav {
        padding-right: 0px;
    }

    .list-link.search.nav.rt {
        padding-left: 0px;
    }

    .list-link.search.en {
        padding-top: 0px;
        padding-right: 0px;
        line-height: 20px;
        text-align: center;
    }
    
    .list-link.search._34tw {
        padding-right: 0;
    }

    .list-link.ad-text {
        padding-right: 0px;
        padding-left: 0px;
    }

    .list-link.ad-text:hover {
        padding-right: 0px;
        color: rgba(0, 0, 0, 0.35);
    }

    .list-link.ad-text.arrow {
        padding-left: 10px;
    }

    .list-link.ad-text.arrow.rt {
        padding-right: 10px;
    }

    .list-link.ad-text.rt {
        padding-right: 0px;
        padding-left: 20px;
    }

    .list-dropdown {
        position: relative;
        display: block;
        overflow: hidden;
        height: 0px;
    }

    .list-dropdown.w--open {
        background-color: transparent;
    }

    .footer-link-plus-list-2 {
        margin-right: 0px;
        padding-right: 20px;
        float: right;
        color: #999;
    }

    .footer-link-plus-list-3 {
        margin-right: 0px;
        padding-right: 20px;
        float: right;
        color: #999;
    }

    .footer-link-plus-list-4 {
        margin-right: 0px;
        padding-right: 20px;
        float: right;
        color: #999;
    }

    .footer-link-plus-list-5 {
        margin-right: 0px;
        padding-right: 20px;
        float: right;
        color: #999;
    }

    .footer-link-plus-list-dir {
        margin-right: 0px;
        padding-right: 20px;
        float: right;
        color: #999;
    }

    .search.blog {
        display: block;
    }

    .footer-link-plus-list-city {
        margin-right: 0px;
        padding-right: 20px;
        float: right;
        color: #999;
    }

    .list-info {
        margin-left: 0px;
        padding-right: 10px;
        padding-left: 10px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .list-info.right {
        margin-right: 0px;
        margin-left: 0px;
        padding-right: 10px;
        padding-left: 10px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .list-info.right.center {
        display: block;
        width: 50%;
        padding-right: 0px;
        padding-left: 0px;
        float: right;
    }

    .list-info.blog {
        width: 100%;
    }

    .list-info.blog.center._2 {
        display: block;
        width: 50%;
        float: left;
    }

    .cam-name-div.blog {
        height: auto;
    }

    .cs-banner {
        bottom: 30px;
        margin-top: 0px;
        margin-bottom: 50px;
    }

    .cs-container {
        margin-bottom: 100px;
    }

    .cs-text.ja {
        font-size: 17px;
    }

    .sup-section {
        margin-top: 30px;
    }

    ._404-text {
        font-size: 135px;
    }

    .nav-popup {
        display: none;
    }

    .nav-map-text.sidemap.scroll-to-top.ph {
        width: 40px;
        height: 40px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        background-image: -webkit-linear-gradient(270deg, #98d7ec, #98d7ec);
        background-image: linear-gradient(180deg, #98d7ec, #98d7ec);
        opacity: 1;
        color: #fff;
        font-size: 24px;
    }

    .scroll-to-top-ph.sidenav.ph.home.cam {
        background-image: -webkit-linear-gradient(270deg, #ffc969, #ffa502);
        background-image: linear-gradient(180deg, #ffc969, #ffa502);
        color: #fff;
    }

    .map-popup {
        display: none;
    }

    .map-popup-div {
        height: 100%;
    }

    .nav-popup {
        display: none;
    }

    .newnav-text {
        letter-spacing: 1px;
    }

    .newnav-text.pro {
        line-height: 32px;
        letter-spacing: 0px;
    }
    
    .newnav-text.multi-spot {
        line-height: 32px;
        letter-spacing: 0px;
    }

    .nav-close-container {
        position: fixed;
        left: 0px;
        top: auto;
        right: 0px;
        bottom: 0px;
    }

    .social-share-butt.ph {
        width: 100%;
        border-top: 1px solid #fff;
    }

    .phone-nav {
        position: fixed;
        left: 0px;
        right: 0px;
        bottom: 0px;
        z-index: 1999;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        overflow: visible;
        width: 100%;
        height: 40px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        border-top: 1px solid rgba(0, 0, 0, 0.2);
        background-image: -webkit-linear-gradient(270deg, #eef2f3, #eef2f3);
        background-image: linear-gradient(180deg, #eef2f3, #eef2f3);
    }

    .icon-div {
        position: relative;
        z-index: 9998;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        overflow: visible;
        width: 20%;
        height: 40px;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
        border-right: 1px solid rgba(0, 0, 0, 0.15);
    }
    
    .icon-div.pro {
        border-left: 1px #0000001a;
        border-right-style: none;
        justify-content: center;
        width: 25%;
        text-decoration: none;
    }
    
    .icon-div.pro.banner {
        z-index: 2;
        margin-right: 0px;
    }

    .icon-div.middle {
        border-right-style: none;
        width: 50%;
    }

    .ph-icons-div {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .scroll-to-top-ph {
        right: 0px;
        bottom: 80px;
        padding: 6px 9px;
    }

    .scroll-to-top-ph:hover {
        border-style: none;
    }

    .scroll-to-top-ph.sidenav.ph {
        position: relative;
        top: 0px;
        bottom: 0px;
        z-index: 9999;
        width: 40px;
        height: 40px;
        padding-top: 8px;
        padding-right: 8px;
        padding-bottom: 8px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        opacity: 1;
        color: #09c;
    }

    .scroll-to-top-ph.sidenav.ph.home {
        font-size: 23px;
    }
    
    .scroll-to-top-ph.sidenav.ph.home.pro {
        color: #09c;
        border-right-style: none;
    }
    
    .scroll-to-top-ph.sidenav.ph.home.cam {
        color: #fff;
    }

    .scroll-to-top-ph.share.ph {
        font-size: 20px;
    }

    .scroll-to-top-ph.ph {
        position: relative;
        bottom: 0px;
        z-index: 9999;
        width: 40px;
        height: 40px;
        padding: 8px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        opacity: 1;
        color: #09c;
        font-size: 20px;
    }

    .social-div-ph {
        position: relative;
        bottom: 0px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 20%;
        height: 120px;
    }

    .social-div-ph.landing {
        width: 100%;
    }

    .social-div-ph.ph {
        position: fixed;
        left: 25%;
        right: 0px;
        bottom: 40px;
        z-index: 9999;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 30px;
        height: 90px;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .soc-ph-div {
        position: fixed;
        left: 0px;
        right: 0px;
        bottom: 40px;
        display: none;
        width: 100%;
        height: 120px;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .scroll-to-top-phone {
        right: 0px;
        bottom: 80px;
        padding: 6px 9px;
    }

    .scroll-to-top-phone:hover {
        border-style: none;
    }

    .scroll-to-top-phone.sidenav.ph {
        position: relative;
        top: 0px;
        bottom: 0px;
        z-index: 9999;
        width: 40px;
        height: 40px;
        padding-top: 8px;
        padding-right: 8px;
        padding-bottom: 8px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        opacity: 1;
        color: #09c;
    }

    .scroll-to-top-phone.sidenav.ph.home {
        font-size: 23px;
    }

    .scroll-to-top-phone.share.fb.ph {
        width: auto;
    }

    .scroll-to-top-phone.share.twit.ph {
        width: auto;
    }

    .scroll-to-top-phone.share.mail.ph {
        width: auto;
    }

    .scroll-to-top-phone.share.ph {
        font-size: 20px;
    }

    .scroll-to-top-phone.ph {
        position: relative;
        bottom: 0px;
        z-index: 9999;
        width: 40px;
        height: 40px;
        padding: 8px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        opacity: 1;
        color: #09c;
        font-size: 20px;
    }

    .vid-wrapper.timer {
        width: 95%;
    }
    
    .vid-wrapper.pro24 {
        display: none;
    }

    .vid-wrapper.pro24.ph {
        width: auto;
        display: block;
    }

    .vid-wrapper.pro24.all {
        width: 100%;
        margin-bottom: 15px;
        display: block;
    }

    .video-surf-spots.promo._2019 {
        width: 95%;
        padding-right: 5px;
        padding-left: 5px;
        border-width: 3px;
        font-size: 16px;
    }

    .vid-link {
        display: inline-block;
        color: #fff;
        font-weight: 400;
        text-decoration: underline;
        text-shadow: none;
    }

    .vid-link:hover {
        color: #fff;
        font-weight: 400;
    }

    .vid-link:focus {
        color: #fff;
        font-weight: 400;
    }

    .vid-link:visited {
        color: #fff;
    }

    .right-arrow-2 {
        height: 100px;
        margin-bottom: 377px;
    }

    .left-arrow-2 {
        height: 100px;
    }

    .blog-section.first {
        margin-top: 10px;
    }

    .blog-image.ph {
        padding-top: 0px;
    }

    .blog-text-blue.center.pro {
        line-height: 27px;
    }

    .blog-text-blue.en {
        font-weight: 400;
    }
    
    .blog-text-blue.en.cta {
        padding-right: 5px;
    }

    .blog-text-blue.subs {
        font-size: 18px;
    }

    .blog-flex-parent._3-col {
        margin-left: 5px;
    }

    .blog-flex-parent.legend {
        padding-right: 5px;
        padding-left: 5px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .blog-flex-parent.legend.wind.ph {
        width: auto;
        max-height: none;
        padding-right: 25px;
        padding-left: 15px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .column._1 {
        margin-left: 5px;
    }

    .column._2 {
        margin-right: 5px;
        padding-left: 5px;
    }

    .column._3 {
        width: 90%;
        margin-left: 0px;
    }

    .blog-text {
        text-align: left;
    }

    .blog-text.en.pro {
        margin-top: -64px;
        font-size: 11px;
        line-height: 13px;
    }

    .blog-div.vimeo {
        margin-bottom: 25px;
    }

    .blog-div.en.pad {
        padding-right: 10px;
        padding-left: 10px;
    }

    .blog-text-col-left.dhd {
        width: 100%;
    }

    .blog-300x150 {
        margin-top: 25px;
    }

    .blog-flex-parent-2._3-col {
        margin-left: 5px;
    }

    .blog-legend-col-mid {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .blog-legend-col-mid.ph {
        width: 45%;
        margin-top: 15px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .text-legend._467498 {
        background-image: -webkit-linear-gradient(270deg, #467498, #467498);
        background-image: linear-gradient(180deg, #467498, #467498);
    }

    .text-legend._467498-2 {
        background-image: -webkit-linear-gradient(270deg, #467498, #467498);
        background-image: linear-gradient(180deg, #467498, #467498);
    }

    .blog-legend-col-left.ph {
        padding-top: 20px;
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
    }

    .blog-legend-col-mid-ft.ph {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        margin-top: 15px;
    }

    .legend-units {
        width: auto;
        margin-top: 0px;
        margin-right: 0px;
        border-style: none;
        border-width: 1px;
        border-color: #000 #000 rgba(0, 0, 0, 0.1);
    }

    .legend-units.hour {
        border-top-style: none;
        border-top-color: rgba(0, 0, 0, 0.5);
        background-image: -webkit-linear-gradient(270deg, #fff, #fff);
        background-image: linear-gradient(180deg, #fff, #fff);
    }

    .legend-metric {
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 16px;
    }

    .legend-metric.ph {
        font-size: 18px;
    }

    .legend-metric-ft {
        display: none;
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 16px;
    }

    .legend-metric-ft.ph {
        font-size: 18px;
    }

    .blog-300x250 {
        margin-top: 25px;
    }

    .blog-300x250.ph {
        margin-right: auto;
    }

    .lightbox-link-3-col.ph.port {
        width: 100%;
        padding-right: 30px;
        padding-left: 30px;
    }

    .blog-legend-col-mid-km {
        display: none;
        width: 50%;
        -webkit-box-align: end;
        -webkit-align-items: flex-end;
        -ms-flex-align: end;
        align-items: flex-end;
    }

    .blog-legend-col-mid-ms.ph {
        width: 50%;
        -webkit-box-align: end;
        -webkit-align-items: flex-end;
        -ms-flex-align: end;
        align-items: flex-end;
    }

    .legend-metric-ms {
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 16px;
    }

    .legend-metric-ms.ph {
        font-size: 20px;
        letter-spacing: 1px;
    }

    .legend-metric-km {
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 16px;
    }

    .legend-metric-km.ph {
        font-size: 20px;
        letter-spacing: 1px;
    }

    .blog-legend-col-mid-mph {
        display: none;
        width: 50%;
        -webkit-box-align: end;
        -webkit-align-items: flex-end;
        -ms-flex-align: end;
        align-items: flex-end;
    }

    .blog-legend-col-mid-kn {
        display: none;
        width: 50%;
        -webkit-box-align: end;
        -webkit-align-items: flex-end;
        -ms-flex-align: end;
        align-items: flex-end;
    }

    .legend-metric-mph {
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 16px;
    }

    .legend-metric-mph.ph {
        font-size: 20px;
        letter-spacing: 1px;
    }

    .legend-metric-kn {
        display: none;
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 16px;
    }

    .legend-metric-kn.ph {
        font-size: 20px;
        letter-spacing: 1px;
    }

    .hidden-android {
        display: none;
    }

    .wave-legend-img {
        width: 100%;
    }

    .blog-285x360 {
        width: 100%;
        margin-top: 25px;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .wave-heights {
        display: block;
        margin-right: auto;
        margin-left: auto;
        padding-top: 30px;
        padding-right: 30px;
        padding-left: 30px;
    }

    .wave-legend-div {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }

    .wave-legend-div.ft {
        display: none;
    }

    .wave-legend-div-ft {
        display: none;
    }

    .wave-legend-div-ft.ft {
        display: none;
    }

    .legend-metric-ph {
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 20px;
        letter-spacing: 1px;
    }

    .legend-metric-ph.ph {
        font-size: 18px;
    }

    .legend-metric-ft-ph {
        display: none;
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 20px;
        letter-spacing: 1px;
    }

    .legend-metric-ft-ph.ph {
        font-size: 18px;
    }

    .blog-legend-col-mid-ph {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .blog-legend-col-mid-ph.ph {
        width: 45%;
        margin-top: 15px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .blog-legend-col-mid-ft-ph.ph {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        margin-top: 15px;
    }

    .forecast-help-link {
        width: 25%;
        padding-right: 30px;
    }

    .arrow-3-4-tw-left {
        height: 65px;
    }

    .arrow-3-4-tw-left.full {
        margin-top: 235px;
    }

    .arrow-3-4-tw-left.below {
        height: 30%;
        margin-top: 205px;
    }

    .arrow-3-4-tw-right {
        height: 65px;
    }

    .arrow-3-4-tw-right.full {
        height: 65px;
        margin-top: 235px;
    }

    .arrow-3-4-tw-right.below {
        height: 30%;
        margin-top: 205px;
    }

    .video-640-square {
        width: 95%;
    }

    .name-banner-nav.blog {
        display: block;
    }

    .name-banner-nav.my-multi {
        max-width: 95%;
    }

    .name-banner-link.right {
        width: 25%;
    }

    .name-banner-link.blog {
        width: 100%;
    }

    .slider-images {
        max-height: 98%;
        float: none;
    }

    .slider-images.rt {
        float: none;
    }

    .slider-images.rt.lazyload {
        float: none;
    }

    .slider-images.mid {
        float: none;
    }

    .slider-images.mid.lazyload {
        float: none;
    }

    .slider-images.lazyload {
        float: none;
    }

    .arrow-3-4-tw {
        top: 340px;
        right: 25px;
    }

    .arrow-3-4-tw.lt {
        top: 340px;
        right: 25%;
    }

    .photo-remove {
        display: block;
        margin-right: auto;
        margin-left: auto;
        text-align: center;
    }

    .photo-remove.pro.sub {
        margin-top: 30px;
        padding-bottom: 15px;
    }

    .photo-remove.pro.sub.ms-mobile {
        margin-top: 10px;
    }

    .nav-lang-text {
        width: 45px;
        padding-right: 5px;
        font-size: 20px;
    }

    .nav-lang-text.en-zh {
        width: 45px;
        font-size: 18px;
    }

    .nav-lang-link-zh.w--current {
        width: 45px;
        padding-right: 0px;
        padding-left: 5px;
    }

    .nav-lang-link-zh.en {
        width: 45px;
        padding-right: 0px;
        padding-left: 5px;
    }

    .home-feature {
        margin-top: 50px;
    }

    .pro-button-container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .plan-desc {
        width: 100%;
    }

    .user-icon {
        width: 25px;
        padding-right: 5px;
        font-size: 20px;
    }

    .user-icon.sidemap.scroll-to-top.ph {
        width: 40px;
        height: 40px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        background-image: -webkit-gradient(linear,
                left top,
                left bottom,
                from(#98d7ec),
                to(#98d7ec));
        background-image: linear-gradient(180deg, #98d7ec, #98d7ec);
        opacity: 1;
        color: #fff;
        font-size: 24px;
    }

    .user-icon.sidemap.scroll-to-top-ph.ph {
        background-image: -webkit-gradient(linear,
                left top,
                left bottom,
                from(#98d7ec),
                to(#98d7ec));
        background-image: linear-gradient(180deg, #98d7ec, #98d7ec);
        color: #fff;
    }

    .user-icon.en-zh {
        width: 45px;
        font-size: 18px;
    }

    .payment-banner {
        overflow: visible;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        background-color: transparent;
    }

    .payment-banner.restrict {
        width: 30%;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        background-color: #09c;
    }

    .pay-history {
        overflow: scroll;
        max-height: 217px;
    }

    .pay-phone {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .upgrade-popup {
        display: none;
    }

    .update-pay-popup {
        display: none;
    }

    .continue-button-container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .continue-button {
        margin-right: 20px;
        margin-left: 20px;
    }

    .cam-sub-overlay {
        height: auto;
        min-height: 0px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        -webkit-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
        transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    }

    .cam-sub-overlay-ms {
        height: auto;
        min-height: 0px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        -webkit-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
        transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    }
    
    .cam-overlay-div {
        max-height: 335px;
        min-height: auto;
    }

    .spot-desc-heading.sub.ms-mobile {
        margin-top: 0px;
        padding-top: 10px;
    }

    .surf-spot-des-text.surf-spot-text-2.en-no-cam.sub.ms-mobile {
        min-height: 0px;
        padding: 10px 0px;
    }

    .pro-cta-blurb {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .pro-line.short {
        display: none;
    }

    .vid-photo-ad-desktop-ad-free {
        display: none;
        width: 0px;
        height: 0px;
        margin-left: 15px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    }

    .slide-icon {
        display: block;
        padding-top: 12px;
        padding-right: 15px;
        font-family: "Font awesome solid";
        color: rgba(0, 153, 204, 0.7);
        font-size: 17px;
        text-align: right;
    }

    .slide-icon.my-multi.ph {
        display: none;
    }

    .navbar-ad {
        height: auto;
    }

    .navad-text {
        height: auto;
        padding: 5px 10px;
        font-size: 19px;
        line-height: 22px;
        letter-spacing: 0px;
    }

    .fontawesome5 {
        font-size: 22px;
    }
    
    .fontawesome5.help {
        min-width: 15%;
        direction: ltr;
        text-align: center;
        flex: 0 auto;
        order: 0;
        align-self: auto;
        margin-left: 10px;
        margin-right: 10px;
        padding-top: 0;
        display: block;
    }

    .slider-wide {
        height: auto;
    }

    .nav-wave {
        height: auto;
    }

    .sms-popup {
        display: none;
    }

    .mask-pics {
        max-height: none;
        margin-left: 2px;
        margin-right: 2px;
    }

    .mask-vids {
        max-height: none;
        margin-left: 2px;
        margin-right: 2px;
    }

    .multi-forecast-div.new {
        padding-top: 0px;
    }

    .multi-stream-div {
        display: none;
    }

    .last-slide-wrapper {
        overflow: hidden;
        margin-top: 3px;
        padding-right: 0%;
        -webkit-box-align: baseline;
        -webkit-align-items: baseline;
        -ms-flex-align: baseline;
        align-items: baseline;
    }

    .last-slide-wrapper {
        overflow: hidden;
        margin-top: 0px;
        padding-right: 0%;
        -webkit-box-align: baseline;
        -webkit-align-items: baseline;
        -ms-flex-align: baseline;
        align-items: baseline;
    }

    .host-wrap {
        margin-right: 0px;
        margin-left: 0px;
        padding-right: 5px;
        padding-left: 5px;
        -webkit-align-self: auto;
        -ms-flex-item-align: auto;
        -ms-grid-row-align: auto;
        align-self: auto;
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .troubleshoot-arrow {
        margin-right: 0px;
        padding-right: 20px;
        float: none;
        color: #999;
    }

    .troubleshoot-arrow.biz {
        padding-right: 30px;
    }

    .card-slide {
        width: 100%;
        margin-right: auto;
        margin-bottom: 0px;
        margin-left: auto;
    }

    .card-slider {
        overflow: hidden;
        width: 100%;
        max-width: none;
        margin-right: 0px;
        margin-left: 0px;
        padding-bottom: 30px;
        padding-left: 0px;
        -webkit-align-self: center;
        -ms-flex-item-align: center;
        -ms-grid-row-align: center;
        align-self: center;
    }

    .card-slider-mask {
        padding-top: 0px;
    }

    .card {
        max-height: 340px;
        max-width: 260px;
        margin-right: auto;
        margin-left: auto;
        padding-top: 18px;
        padding-bottom: 10px;
        padding-right: 10px;
        padding-left: 10px;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .multi-report-slider-div {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .slide-stream {
        display: block;
        max-width: none;
        margin-right: auto;
        margin-left: auto;
        /* padding-right: 10px;
        padding-left: 10px; */
    }

    .reports-streams-div {
        padding-top: 5px;
    }

    .forecast-slider-nav {
        top: 20px;
        margin-top: 20px;
    }

    .no-cam-div-multispot {
        display: block;
        width: 95vw;
    }
    
    .w-lightbox-backdrop {
        height: 100%;
    }
    
  .typhoon-button {
    padding-top: 6px;
    padding-bottom: 6px;
  }

  .typhoon-button:active, .typhoon-button:focus {
    padding-top: 7px;
    padding-bottom: 7px;
  }

  .typhoon-button:focus-visible {
    padding-top: 7px;
    padding-bottom: 7px;
  }

  .typhoon-button[data-wf-focus-visible] {
    padding-top: 7px;
    padding-bottom: 7px;
  }

  .typhoon-button.large {
    margin-bottom: 20px;
  }
    
    ._30-day-contain {
        justify-content: center;
        margin-right: 0%;
    }
    
    ._30-day-contain.zh {
        padding-right: none;
    }
    
    ._3-4-tw-text.pro-cta._30-day.black {
    padding-left: 20px;
    padding-right: 20px;
    }
    
    .search-icon {
    left: 4%;
  }

  .footer4_links {
    flex-flow: wrap;
    align-items: flex-start;
  }

  .footer4_component {
    flex-direction: column;
    align-items: flex-start;
  }

  .heading-3.serif-font {
    text-align: center;
  }

  .faq-types-wrapper-grid {
    flex-direction: column;
    margin-top: 20px;
    display: flex;
  }

  .image-small {
    width: 100%;
    height: auto;
  }

  .image-holder {
    height: 100%;
  }

  .search-field.text-size-medium {
    font-size: 1rem;
  }

  .margin-top {
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
  }

  .faq-radio-button {
    width: 10px;
  }

  .heading-2.serif-font.text-align-center {
    margin-top: 0;
    margin-right: 0;
    font-size: 21px;
  }

  .radio-text {
    width: 100%;
    text-align: left;
    flex: 0 auto;
    margin-top: 0;
    margin-left: 1rem;
  }

  .footer-bottom.text-size-small {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
    flex-direction: row;
    align-items: flex-start;
  }
    
  .logo-text.pro {
    text-align: center;
    flex: 0 auto;
    align-self: center;
    font-size: 24px;
    font-weight: 400;
    line-height: 24px;
    text-decoration: none;
  }

  .faq-type-item {
    flex-flow: row;
    justify-content: center;
    padding: 1rem;
    display: flex;
  }

  .timings-grid {
    flex-direction: column;
  }

  .margin-bottom {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
  }

  .padding-vertical {
    padding-left: 0;
    padding-right: 0;
  }

  .line-vertical {
    width: 100%;
    height: 1px;
  }

  .line-vertical.turned-horizontal {
    width: 5rem;
    height: 1px;
  }
    
  .cta-float {
    margin-left: -5px;
    padding-left: 0;
    bottom: 50px;
    left: 0;
  }

  .cta-float.right {
    margin-left: 0;
    margin-right: -5px;
    bottom: 45px;
    right: 0;
  }
    
  .photo-rounded {
    border-radius: 10px;
    width: 90%;
    height: 90%;
  }
    
  .blockquote {
    padding-left: 5px;
    padding-right: 5px;
  }
    
  .h1-pro24 {
    padding-right: 15px;
  }

  .text-pro24 {
    padding-left: 20px;
    font-size: 15px;
  }

  .text-pro24.right-para {
    width: 100%;
    margin-top: 10px;
    padding-left: 10px;
    padding-right: 10px;
  }

  .text-pro24.right-para.big.benefit {
    min-height: 0;
  }

  .text-pro24.center {
    width: 100%;
    min-height: 0;
    margin-bottom: 20px;
    padding-left: 0;
  }

  .pro24-cta {
    padding-top: 9px;
    padding-bottom: 9px;
  }

  .pro24-cta:active, .pro24-cta:focus {
    padding-top: 7px;
    padding-bottom: 7px;
  }

  .pro24-cta:focus-visible {
    padding-top: 7px;
    padding-bottom: 7px;
  }

  .pro24-cta[data-wf-focus-visible] {
    padding-top: 7px;
    padding-bottom: 7px;
  }

  .pro24-cta.large {
    margin-bottom: 20px;
  }

  .pro24-cta.ms {
    width: 100%;
  }

  .pro24-cta.ms.center {
    width: 90%;
  }

  .pro24-section-color.blue {
    padding-bottom: 10px;
  }

  .card-2 {
    height: 200px;
    margin-left: 0;
    margin-right: 0;
  }

  .hero-video-filter.slider1 {
    width: 300px;
    height: 169px;
  }

  .hero-video {
    height: 150px;
  }

  .card-3 {
    height: 200px;
    margin-left: 0;
    margin-right: 0;
  }

  .hero-video-link-block-2, .hero-video-2 {
    width: 300px;
    height: 169px;
  }

  .image-paragraph {
    margin-left: 10px;
    margin-right: 10px;
  }

  .benefits {
    flex-flow: column;
  }

  .benefit {
    width: 100%;
  }

  .line-spacer {
    display: none;
  }

  .pro-footer-button {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    background-color: orange;
    border-radius: 10px;
    flex-flow: wrap;
    flex: 1;
    justify-content: center;
    align-items: center;
    margin-top: 3px;
    margin-bottom: 4px;
    text-decoration: none;
    display: flex;
  }

  .pro-footer-button.w--current {
    border-radius: 10px;
    margin-top: 3px;
    margin-bottom: 4px;
    text-decoration: none;
  }

  .italic-text-2 {
    font-family: Fontawesome, sans-serif;
  }

  .pro-hand {
    color: #fff;
    width: 40px;
    height: 40px;
    margin-left: 10px;
    margin-right: 10px;
    font-family: Fontawesome, sans-serif;
    font-size: 20px;
  }

  .text-page-menu {
    color: #7da6c7;
    text-align: right;
    letter-spacing: 0;
    text-transform: uppercase;
    max-width: 50px;
    font-family: Open Sans, sans-serif;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
  }

  .text-page-menu.page {
    letter-spacing: 1.5px;
    line-height: 15px;
  }
    
  .text-page-menu.page.white {
    margin-top: 7px;
  }

  .text-page-menu.white {
    color: #fff;
    -webkit-text-stroke-color: #fff;
  }

  .page-menu {
    order: 1;
    align-self: center;
    text-decoration: none;
  }

  .page-menu-dot {
    background-color: #7da6c7;
    border-radius: 50%;
    width: 7px;
    height: 7px;
    margin-top: 0;
    padding-bottom: 0;
    padding-right: 0;
  }
    
  .page-menu-dot.white {
    background-color: #fff;
  }

  .page-menu-dot-div {
    text-align: left;
    border-radius: 50%;
    flex-flow: column wrap;
    justify-content: space-around;
    align-items: flex-end;
    width: 10px;
    margin-right: 3px;
    padding-top: 4px;
    padding-bottom: 4px;
    display: flex;
  }
    
  .page-menu-dot-div.white {
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 2px;
    padding-bottom: 2px;
  }

  .nav-popup-pro {
    display: none;
  }
    
  .pro-banner-section {
    width: 100%;
  }
  .cell {
    display: flex;
  }

  .column-infographic.wave {
    padding-left: 40px;
    padding-right: 40px;
  }
    
  .help-how-pro-helps-popup, .help-how-pro-helps-popup, .help-read-forecast-popup, .help-infographic-popup, .help-read-report-popup, .help-multi-spot-popup, .help-stream-offline-popup, .help-view-streams-popup, .help-view-forecast-popup, .help-login-issue-popup, .help-logout-issue-popup, .help-purchase-pro-popup, .help-account-share-popup, .help-cancel-sub-popup, .help-guarantee-popup, .help-discount-popup, .help-referral-popup, .help-billing-popup, .help-pay-method-popup, .help-how-purchase-popup, .help-which-plan-popup, .help-travel-popup, .help-afterbuy-popup, .help-easy-popup, .help-reliable-popup, .help-why-popup, .help-how-contact-popup, .help-advertise-popup, .help-biz-popup, .help-host-popup, .help-swelleye-helps-popup, .help-cleanup-popup, .help-host-cleanup-popup, .help-protect-popup, .help-donate-popup, .help-about-popup, .help-mission-purpose-promise-popup, .help-services-popup, .help-new-cam-popup {
    display: none;
  }

  .help-page-popup-div {
    border-style: none;
    height: 100%;
  }
    
  .help-button {
    display: none;
  }
}

#w-node-_11e9e2ac-2c94-2b53-eaa1-0f761822b2ef-3e0314e7 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_5007b59b-cf3c-b99a-4953-78510b93ed28-3e0314e7 {
  grid-area: span 1 / span 4 / span 1 / span 4;
}

#w-node-c4a07358-0691-9870-bfbb-a2a63190e92d-3e03156a, #w-node-d05859c6-00df-d934-482c-a8b9d7c4a7ac-3e03156a, #w-node-_361baed9-7d82-b6fa-ef7f-2615cde8d6c5-3e03156a, #w-node-_41239a23-fcb1-7962-21a7-7991e6c21921-3e03156a, #w-node-_206faf2f-a9bc-4694-5102-06f9d5a1e1c5-3e03156a, #w-node-_22b33ab6-8f0f-c2c6-1c1f-a4791d795641-3e03156a, #w-node-d70040c5-55bb-e066-20b1-3991fa0dfd0a-3e03156a, #w-node-c7e2805e-e02a-2ac8-3282-9937b30729b0-3e03156a {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

@media screen and (max-width: 767px) {
  #w-node-_5007b59b-cf3c-b99a-4953-78510b93ed28-3e0314e7 {
    grid-area: span 1 / span 2 / span 1 / span 2;
  }
}

@font-face {
    font-family: "Weathericons webfont";
    src: url("/fonts/weathericons-regular.woff") format("woff");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "Fontawesome";
    src: url("/fonts/FontAwesome.otf") format("opentype");
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: "Weathericons";
    src: url("/fonts/weathericons-regular.eot"); /* IE9 Compat Modes */
    src: url("/fonts/weathericons-regular.eot?#iefix") format("embedded-opentype"),
    url("/fonts/weathericons-regular.woff2") format("woff2"),
    url("/fonts/weathericons-regular.woff") format("woff"),
    url("/fonts/weathericons-regular.ttf") format("truetype"),
    url("/fonts/weathericons-regular.svg#Weathericons") format("svg");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "Font awesome solid";
    src: url("/fonts/FontAwesomeSolid.otf") format("opentype");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Font awesome 5 free solid 900';
    src: url('/fonts/Font-Awesome-5-Free-Solid-900.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
    font-display: auto;
}