@font-face {
    font-family: "Weisenhoff Grotesk Light";
    src: url("/Oceanside/fonts/WeissenhofGrotesk-Light.woff2");
    src:  url("/Oceanside/fonts/WeissenhofGrotesk-Light.woff2") format("woff2"), url("/Oceanside/fonts/WeissenhofGrotesk-Light.woff") format("woff");
    font-weight: normal;
    font-style: normal;
  }
  
  @font-face {
    font-family: "Weisenhoff Grotesk Medium";
    src: url("/Oceanside/fonts/WeissenhofGrotesk-Medium.woff2");
    src:  url("/Oceanside/fonts/WeissenhofGrotesk-Medium.woff2") format("woff2"), url("/Oceanside/fonts/WeissenhofGrotesk-Medium.woff") format("woff");
    font-weight: normal;
    font-style: normal;
  }

  @font-face {
    font-family: "stratos semibold";
    src: url("fonts/stratosweb-semibold.woff");
    src: url("fonts/stratosweb-semibold.woff") format("woff");
    font-weight: normal;
    font-style: normal;
  }



/* ! ------------------- HERO IMAGE ------------------------- */


@media (min-width: 768px) {
    .content-wrapper {
        padding-left: 32px;
        padding-right: 32px;
        background-color: #F1F1F2;
    }}
    
    .content-wrapper {
        padding-left: 24px;
        padding-right: 24px;
        background-color: #F1F1F2
    }
    
    .component-page-title .hero-heading {
        -webkit-animation-name:title-block-heading;
        animation-name:title-block-heading;
        -webkit-animation-duration:1.5s;
        animation-duration:1.5s;
    }
    
    .component-page-title > .page-sumamry {
        -webkit-animation-name:title-block-text;
        animation-name:title-block-text;
        -webkit-animation-duration:1s;
        animation-duration:1s;
    }
    
    
    
    

    *,*:before,*:after{box-sizing:inherit;}
    h1,p{margin:0;padding:0;}
    h1{font-size:inherit;}
    a{color:inherit;transition:.3s;}
    a{text-decoration:none;}
    ::-moz-focus-inner{padding:0;border:0;}
    :focus{outline:0;}
    img{max-width:100%;height:auto;border:0;}
    section{display:block;}
    img{border-style:none;}
    h1{margin-top:0;color:black;-webkit-font-smoothing:antialiased;font-size:2rem;line-height:1.25;margin-bottom:0;font-family:"Weisenhoff Grotesk Light", "Helvetica Neue", Helvetica, Arial, sans-serif;font-weight:300;}
    @media screen and (min-width: 768px){
    h1{font-size:2.8125rem;line-height:1.24444;margin-bottom:0; text-align: left !important;}
    }
    p{margin-top:0;font-size:1rem;line-height:1.5;margin-bottom:24px;}
    a{text-decoration:none;color:#4c4c4e;;cursor:pointer;}
    a:hover{color:#7397c5;text-decoration:none;}
    .bg-theme-3{background-color:#F1F1F2;}
    .bg-theme-3.page-header-section.has-image .component-page-title{background-color:#F1F1F2;}
    .bg-theme-3.page-header-section .component-breadcrumbs a{color:#000;}
    .bg-theme-3.page-header-section .page-summary{color:#4c4c4e}
    .container{margin-right:auto;margin-left:auto;padding:0 16px;max-width:calc(1200px + (16px * 2));}
    .page-header-section-container{margin-right:auto;margin-left:auto;padding:30px 16px;max-width:calc(1200px + (16px * 2));}
    @media (min-width: 1024px){
    .page-header-section-container{padding:0px 16px;}
    }
    .component-breadcrumbs a,.component-breadcrumbs span{font-size:.8125rem;line-height:1.84615;margin-left:8px;}
    .component-breadcrumbs a:first-child{margin-left:0;}
    .component-breadcrumbs a:hover{text-decoration:underline;}
    .breadcrumb-separator::before{content:"|";color:#7ca6ba;}
    .CMSBreadCrumbsLink{color:#50748a;}
    .component-page-title .page-summary{font-size:20px;line-height:1.33333;margin-bottom:24px;margin:0;margin-top:24px; font-family: "Weisenhoff Grotesk Light";}
    .section{padding:16px 0;}
    @media (min-width: 768px){
    .section{padding:24px 0;}
    }
    @media (min-width: 1024px){
    .section{padding:24px 0;}
    }
    .page-header-section{position:relative;padding:16px 0 40px;}
    .page-header-section.has-image{padding-bottom:0!important;}
    .page-header-section.has-image > .container{background-color:inherit;}
    
    .page-header-section.has-image .page-summary{margin-bottom:0;
        -webkit-animation-name:title-block-text;
        animation-name:title-block-text;
        -webkit-animation-duration:1.5s;
        animation-duration:1.5s;}
    
    .page-header-section .component-page-title,.page-header-section .page-header-image-container{position:relative;z-index:2;}
    .page-header-section .page-header-image-container{background-color:inherit;}
    .page-header-section .page-header-image{position:relative;display:block;height:0;width:100%;background:#edecea;padding-bottom:42.85714%;background-color:inherit;}
    .page-header-section .page-header-image::before{position:absolute;top:-1px;left:0;content:"";width:66%;height:16px;background-color:inherit;z-index:10;}
    .page-header-section .page-header-image img{position:absolute;top:0;left:0;width:100%;height:100%;}
    .page-controls-wrapper{width:calc(100% + 16px);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:0;-ms-flex:0 1 auto;flex:0 1 auto;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-bottom:16px;}
    @media (min-width: 768px){
    .page-controls-wrapper{width:calc(100% + 24px);}
    }
    @media (min-width: 1024px){
    .page-controls-wrapper{width:calc(100% + 24px);}
    }
    .page-controls-wrapper .component-breadcrumbs{-ms-flex-preferred-size:calc((100% / 6 * 6) - 16px - 0.1px);flex-basis:calc((100% / 6 * 6) - 16px - 0.1px);max-width:calc((100% / 6 * 6) - 16px - 0.1px);margin-right:16px;}
    @media (min-width: 768px){
    .page-header-section{padding-top:24px;}
    .page-header-section.has-image .component-page-title{width:66%;padding-right:64px;}
    .page-header-section .page-header-image::before{height:32px;}
    .page-controls-wrapper{margin-bottom:24px;}
    .page-controls-wrapper .component-breadcrumbs{-ms-flex-preferred-size:calc((100% / 12 * 6) - 24px - 0.1px);flex-basis:calc((100% / 12 * 6) - 24px - 0.1px);max-width:calc((100% / 12 * 6) - 24px - 0.1px);margin-right:24px;}
    .page-controls-wrapper{margin-bottom:24px;}
    .page-controls-wrapper .component-breadcrumbs{-ms-flex-preferred-size:calc((100% / 12 * 6) - 24px - 0.1px);flex-basis:calc((100% / 12 * 6) - 24px - 0.1px);max-width:calc((100% / 12 * 6) - 24px - 0.1px);margin-right:24px;}
    .page-header-section::after{position:absolute;top:80px;right:40px;z-index:1;width:250px;height:682px;content:"";background-image:url(img/pattern-dark.png);background-size: 300px 300px;opacity: 0.35;}
}
    @media (min-width: 1024px){
    .page-header-section.has-image .component-page-title{padding-right:112px;}
    .page-header-section .page-header-image::before{height:56px;}
    .page-controls-wrapper .component-breadcrumbs{-ms-flex-preferred-size:calc((100% / 12 * 6) - 24px - 0.1px);flex-basis:calc((100% / 12 * 6) - 24px - 0.1px);max-width:calc((100% / 12 * 6) - 24px - 0.1px);margin-right:24px;}
    .page-header-section::after{position:absolute;top:80px;right:40px;z-index:1;width:250px;height:682px;content:"";background-image:url("img/pattern-dark.png");background-size: 300px 300px;opacity: 0.35;}
    .page-header-section{padding:40px 0 40px;}
}
    @media (min-width: 1220px){
    .page-header-section{padding:40px 0 40px;}
    }
    @media (min-width: 1600px){
    .page-header-section::after{right:47px;}
    }
  


    .back-to-home {
        position: absolute;
        background: transparent;
        text-align: right;;
        z-index: 100;
        right: 40px;
        top: 30px;
    }
    
    .back-to-home .back-to-home-link {
        text-decoration: none;
        color: #4c4c4e;;
        font-family: "Arimo", sans-serif;
        font-size: 16px !important;
        font-weight: 400;
        -webkit-transition: color .1s, background .1s, border-color .1s;
        transition: color .1s, background .1s, border-color .1s;
        text-decoration: none;
        -webkit-transition: opacity .1s;
        transition: opacity .1s;
        opacity: 1;
    }
    
    .back-to-home .back-to-home-link:hover {
        color:#6e9bc7;
    }
    
    .breadcrumb-separator::before {
        content: "|";
        color: #6e9bc7;
        max-width: 800px;
        padding-left: 2px;
        padding-right: 2px;
    }
    
    
    svg {
        will-change: transform, fill, stroke;
        transition: all 150ms ease-in-out;
    }
    
    .fa-arrow-left:before {
        content: "\f060";
    }
    
    @media (min-width: 768px){
    .ducks {
        position: absolute !important;
        top: 50%;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 0;
    }

    .ducks img {
            bottom: 34% !important;
            width: 100%;
            height: 123.750px !important;
            display: block !important;
            position: absolute !important;
    }}

    @media (max-width: 767.99px){
    .ducks {
        display: none;
    }

    .ducks img {
        display: none;
    }}

    .para {
        display: block;
        max-width: 1000px;
        width: 80%;
        position: relative;
        margin: 0 auto;
        margin-top: 10px;
        font-family: "Weisenhoff Grotesk Medium";
        font-size: 18px;
        line-height: 1.5;
        margin-bottom: 47px;
        color: #434343;
      }

      .date {
        font-family: "Weisenhoff Grotesk Light";
        font-size: 11px;
        color: #434343;
        display: block;
        text-transform: uppercase;
        margin: 0 auto;
        
    }

 .slider-caption  {
        font-family: "Sabon";
        color: #6e9bc7;
        font-size: 16px;
        padding: 13px 0 15px 0;
        display: block;
        border: 0;
        text-decoration: none;
        width: 288px;
        margin: 0 auto;
    }
  
    @media (min-width: 768px){
        .horizontal-dotted-bar {
          display: block !important;
          height: 70px;
          position: relative;
          top: 0px;
          max-width: 1170px;
          display: none;
          background: url(img/dots-black.png) repeat;
          margin: 0 auto;
        }



    /*! CSS Used Keyframes */
@-webkit-keyframes title-block-heading{0%,40%{-webkit-transform:translateY(20px);transform:translateY(20px);opacity:0;}80%,100%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1;}}
@keyframes title-block-heading{0%,40%{-webkit-transform:translateY(20px);transform:translateY(20px);opacity:0;}80%,100%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1;}}
@-webkit-keyframes title-block-text{0%,60%{-webkit-transform:translateY(20px);transform:translateY(20px);opacity:0;}100%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1;}}
@keyframes title-block-text{0%,60%{-webkit-transform:translateY(20px);transform:translateY(20px);opacity:0;}100%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1;}}