﻿/*custom theme test*/

body {
    
}

.sfPublicWrapper {
    
    
    
}

#main a{
    
}

.olf8banner {
    max-width: 1366px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    background-color: #944199;
    font-family: 'Montserrat';
    font-size:18px;
    padding:10px;
    color:white;
}

.olf8banner a{
    color:white;
}

.olf8banner .fa{
    padding-right:6px;
}
.banner{
    display:none;
}

.base_content {
    background: url('/images/default-source/ui/2021/home/home-page-background-graphic.jpg') !important;
    background-position-y: -400px !important;
    background-size: 100% !important;
}

.base_content_in{
    max-width:100%;
    padding:0;
}
.head_top_1_in, .notification-window > div,.head_top_2_in{
    max-width:1366px;
}



        #featured-programs-widget{
    
            position:relative;
            width:100%;

        }


        #featured-programs{
            position:relative;

            
            max-width:254px;
            text-align:center;
            border-style:solid;
            border-width:1px;
            border-color:#cccccc;
            border-radius:8px;
            overflow:hidden;
            margin-top:4px;
            border-radius:8px;

            
        }

        #featured-programs .header{
            color:white;

            font-size:18px;
            font-weight:bold;
            padding:4px;
            position:relative;
            right:0px;
            left:0px;
            
            max-height:42px;
        }

        #featured-programs .title{
            
            padding:0px;
            background:rgba(0,0,0,.8);
            color:white;
            font-size:14px;
            position:absolute;
            top:0px;
            right:0px;
            left:0px;


        }

        #featured-programs .title a{
            color:white;
        }

        #featured-programs .link{
            

        }

        #featured-programs img{

            margin-top:34px !important;
            height:258px !important;
            width:254px !important;
        }

#featured-programs #arrowleft, #featured-programs #arrowright{
    top:121px !important;

    display:inline-block !important;
    position:absolute !important;
    
}

#featured-programs #arrowleft{
    left:-14px !important;
    
}

#featured-programs #arrowright{
    right:-14px !important;
    
}

#featured-programs #navigator{
            position:absolute;
            left:0 !important;
            right:0 !important;

            width:100% !important;
            bottom:0 !important;
            text-align:center;
            border-radius:0 0 8px 8px;
        }

#featured-programs #navigator div{
            position:relative !important;
            display:inline-block;
            left:auto !important;
            margin-left:5px;
            margin-right:5px;
            
        }


/*featured news - top slideshow*/
.homesplash{
    display:none;
}

.slideshow {

    /*
    background: url('/images/default-source/ui/2021/home/gui-background.jpg') !important;
    background-attachment: fixed !important;
    */
}


#featured-news-home {
    display: none;
    
}

#featured-news {
    background: none !important;
    padding:0;

}

.featured-news-inside {
    max-width: 1366px;
    margin-left: auto;
    margin-right: auto;
    position:relative;
    overflow:hidden;

}

    .featured-news-inside .slides {
        margin-left: auto;
        margin-right: auto;
        border-style: solid;
        border-width:0px 1px 0px 1px;
        border-color:#BBB;
    }

#featured-news .caption {
    background: white !important;
    padding: 3px !important;
    padding-right:8px !important;
    padding-left:8px !important;
    border-radius: 6px 0 0 0 !important;
    text-align: right !important;
    display: table !important;
    width: auto !important;
    position: absolute;
    right: 1px;
    bottom: 0px;
    font-weight: 500;
    color: #222 !important;
}

    #featured-news .caption a {
        color: #105CB6 !important;
    }


h1.header-newscenter {
    background: #0147ba;
    text-transform:uppercase;
    padding: 8px 5px 7px 5px;
    width: 100%;
    text-align: center;
    font-size: 28px !important;
    color: white !important;
    width: 100% !important;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600 !important;
    line-height: 30px !important;
    margin-bottom: 0px !important;
    margin-top: 0px !important;
    margin-left: 0px !important;
}



.newscenter,.buttons, .blocks{
    padding-top:20px;
    padding-bottom:20px;
}

.buttons {
    
    padding-top: 20px;
    padding-bottom: 60px;

}



.topicons {

    margin-top:0px;
    
}

.topicons a{
    font-weight:normal !important;
}

.newscenter {

    
}

.blocks {
    
}

.newscenter > div, .topicons > div, .buttons > div, .blocks > div{
    max-width:1366px;
    margin-left:auto;
    margin-right:auto;
}

.newscenter {
    padding:20px 0;
    border-style: none;
    border-width:1px 0 1px 0;
    border-color: #aaa;
}

#news-slider {
    border-style: none;
    border-width: 0 1px 0px 1px;
    border-color: #4b9e46;
    background:none;
}



#news-slider .sly-slides{
    margin-top:5px;
}

.sly-slide{
    box-shadow:none !important;
    border-style:solid;
    border-width:1px;
    border-color:#ccc;
}


.bottom-buttons {
    display: table;
    margin-left: auto;
    margin-right: auto;
    padding-left:25px;
    padding-right:25px;
    width: 100%;
    border-collapse: separate;
    border-spacing: 23px 0px;

}

    .bottom-buttons a {
        display: table-cell;
        padding: 7px;
        background: #4d4d4f;
        border-radius: 20px;
        color: white;
        font-size: 18px;
        width: 25%;
        text-align: center;
        font-weight: 500;
        vertical-align: middle;
        line-height: 20px;

    }

    .bottom-buttons.news {
        
        padding-top:5px;
        padding-bottom: 0px;
    }

        .bottom-buttons.news a {
            background: none;
            padding:0px;
            
        }

        .bottom-buttons.news img{
            width:60px;
            margin-bottom:10px;
        }

        .bottom-buttons.news span {
            background: #0147ba;
            display: block;
            padding: 7px;
            border-radius: 20px;
        }



.home-nav-icons {
    background: #0147ba;
    padding:5px 0 10px 0;
}

.home-nav-icons ul{
    list-style:none;
    display:table;
    margin-left:auto;
    margin-right:auto;
    text-align:center;
    
}

    .home-nav-icons ul li {
        display: inline-block;
        padding: 10px;
        width:calc(100% / 7.2);
        text-align:center;
        vertical-align:middle;
    }

.home-nav-icons a{
    color:white;
    font-size:16px;
}

.home-nav-icons img{
    height:50px;
    margin-bottom:6px;
    margin-top:6px;
}

.home-nav-icons span{
    display:block;
}

/*2021 four blocks*/
#home-blocks{
    display:table;
    width:100%;
    margin-left:-15px;
    width:calc(100% + 30px);
    position:relative;
    border-collapse:separate;
    border-spacing:15px 0;
    padding-top:20px;
}

    #home-blocks > div {
        display: table-cell;
        width: 20%;
        vertical-align: top;
        height: 450px;
        border-style: solid;
        border-width: 1px;
        border-color: #ccc;
        background: white;
    }

    #home-blocks h1 {
        height: auto !important;
        background: #0147ba;
        padding: 10px !important;
        width: 100%;
        text-align: center;
        font-size: 22px;
        color: white !important;
        font-family: 'Montserrat', sans-serif !important;
        font-weight: 600 !important;
        line-height: 30px !important;
        margin-bottom: 0px !important;
        margin-left: 0px !important;
    }

#home-blocks .moreinfo{
    display:block;
    text-align:center;
}

#home-blocks .homebutton{
    text-align:center;
}

    #home-blocks .homebutton a {
        border-radius: 20px;
        font-size: 18px;
        background: #0047bb;
        color:white;
        min-width:200px;
        display:inline-block;
        margin-left:auto;
        margin-right:auto;
        padding-top:5px;
        padding-bottom:5px;
        margin:5px;
    }

#home-blocks .moreinfo a{
    color:white;
    font-size:16px;
    font-weight:400;
}

/*events*/

#home-blocks #events-widget{
    width: 35%;
    border-radius:0px;
}

#events-widget #data-window, #events-widget #filters, #eventsControl{
    border-radius:0px;
    border-style:none;
    margin-top:0px;
    height:450px;
    background:white !important;
}

    #events-widget #data, #events-widget{
        max-height:450px !important;
        min-height:450px !important;
    }

        

#events-widget #filters{
    background:white !important;
    color:#444 !important;
}
    #events-widget #filters input, #events-widget #filters select{
        border-style:solid !important;
        border-radius:0px !important;
        border-color:#ccc !important;
        border-width:1px !important;
    }

#eventsControl .row .date-info {
    background: none !important;
    box-shadow: none !important;
    color: #4D7F29 !important;
    vertical-align: top !important;
    padding-top: 3px !important;
}

    #eventsControl .no-events{
        position:absolute;
        top:20px;
    }

/*beach conditions*/
#widget-beach-conditions {
    border-radius: 0px !important;
    max-width: 100% !important;
}

#widget-beach-conditions .image-beach{
    position:absolute;
    display:block;
    bottom:200px;
    left:0;
    right:0;
    top:32px;
    height:auto !important;
    background-size: 100% 100%;
}

#widget-beach-conditions .homebutton{
    position:absolute;
    left:0;
    right:0;
    text-align:center;
}



    #widget-beach-conditions .bc-footer {
        position: absolute;
        bottom: 0px;
        width: 100%;
    }

/*pet of the week*/

#widget-pet-of-the-week{
    position:relative;
}

#widget-pet-of-the-week .backgroundimage{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:200px;
    background-size:cover;
    background-position:top;
}

#widget-pet-of-the-week .link{
    cursor:pointer;
}

#widget-pet-of-the-week .petinfo{
    position:absolute;
    left:0;
    right:0;
    text-align:center;
    font-size:14px;
    padding:0 15px 0 15px;
}

    #widget-pet-of-the-week .petname {
        font-size: 26px;
        font-weight: bold;
        color: #4b9e46;
    }

/*beready block*/

#beready-block{
    position:relative;
}

    #beready-block h1 {
        background: #D63840;
    }

    #beready-block .backgroundimage {
        position: absolute;
        left: 0px;
        right: 0px;
        /*background-image: url(/images/default-source/ui/2021/home/bereadybackground.jpg);*/
        background-image: url(/images/default-source/default-album/BOCC_BeReady-cold-weather-image3a9134ac-93d3-4931-be9e-277101f0c0e4.jpg);
        background-size: cover;
        bottom: 200px;
        cursor: pointer;
    }

    #beready-block .homebutton{
        position:absolute;
        left:0;
        right:0;
    }

    /*ie*/
.backgroundimage, #widget-beach-conditions .image-beach {
    height: 250px !important;
}



/*media queries*/
@media (max-width:1366px) {

    .blocks{
        padding-top:20px;
        padding-bottom:20px;
    }

    #home-blocks{
        display:block;
        text-align:center;
    }

    #home-blocks > div{
        text-align:left;
        display:inline-block !important;
        width:calc(50% - 10px) !important;
        max-width:450px !important;
        height:600px;
        margin:10px;
    }

    #events-widget{
        height:auto !important;
        max-height:none !important;
        min-height:0 !important;
    }

    #events-widget #data-window, #events-widget #filters, #eventsControl, #events-widget #data{
        height: 518px !important;
        min-height: 518px !important;
        max-height: 518px !important;
    }

    #featured-news,.slideshow{
        padding:0;
    }

    .featured-news-inside{
        border-radius:0px;
    }

    .backgroundimage, #widget-beach-conditions .image-beach {
        height: 300px !important;
    }


}

@media (max-width: 1200px) {
  
    .home_row1 .title, .home_row1 .green,.home_row2 .title, .home_row2 .green{
        font-size:30px;
    }
}

@media (max-width: 1150px) {
  
    .home_row1 .title, .home_row1 .green,.home_row2 .title, .home_row2 .green{
        font-size:28px;
    }
}

@media (max-width: 1125px) {
  
    .home_row1 .title, .home_row1 .green,.home_row2 .title, .home_row2 .green{
        font-size:25px;
    }
}

@media (max-width: 1075px) {
  
    .home_row1 .title, .home_row1 .green,.home_row2 .title, .home_row2 .green{
        font-size:22px;
    }
}

@media (max-width: 1034px) {
  
    .home_row1 .title, .home_row1 .green,.home_row2 .title, .home_row2 .green{
        font-size:18px;
    }
}

@media (max-width: 991px) {

    #home-blocks {
        width: 100%;
        margin: 0px;
    }

        #home-blocks > div {
            width: 100% !important;
        }
}

@media (max-width: 919px) {

    .home-nav-icons ul{
        max-width:600px;
    }

    .home-nav-icons ul li {
        width: calc(100% / 2);

    }

    .base_foot .sitelinks{
        text-align:center;
    }

    .base_foot .sitelinks a{
        display:table;
        margin-left:auto;
        margin-right:auto;
    }
    
}

@media(max-width:695px) {
    #featured-news .caption {
        display: block !important;
        position: relative !important;
        width:100% !important;
        text-align:center !important;
    }
}

@media(max-width:650px){

}

/*media queries*/
@media (max-width: 500px) {

    .topicons{
        margin-top:0;
    }

    .newscenter{
        padding-top:0px;

    }

    .newscenter > div{
        padding-bottom:0px;
    }

    .bottom-buttons.news, .header-newscenter.h1,#news-slider{
        border-left-width:0;
        border-right-width:0;
    }

    .buttons {
        padding-top: 20px;
        padding-bottom: 10px;
    }

    .bottom-buttons {
        border-spacing: 0 0;
        margin-top: 0px;
        margin-bottom: 0px;
        padding-left:12px;
        padding-right:12px;
        padding-bottom:12px;
    }

    .bottom-buttons.news{
        margin-bottom:0px;
    }

        .bottom-buttons a {
            display: table;
            width: calc(100% - 40px);
            margin-left:20px;
            margin-top: 10px;
            margin-bottom: 10px;
            border-spacing: unset;
        }

        .bottom-buttons.news a{
            margin-bottom:30px;
        }

    .home-nav-icons ul li {
        width: calc(100% / 2);
    }

    #events-widget{
        margin-top:0px;
    }

    #eventsControl{
        height:auto !important;
        min-height:0 !important;
        max-height:unset !important;
    }
  
    #eventsControl #filters{
        height:auto !important;
        max-height:initial !important;
        min-height:0 !important;
    }

    #eventsControl #data, #eventsControl #data-window {
        height: 300px !important;
        min-height: 0 !important;
    }

    .blocks{
        padding:0px;
    }

    #home-blocks{
        display:block;
        width:100%;
        margin:0;
        padding:10px 0 0 0;
    }

    #home-blocks > div{
        margin:0 0 10px 0;
        height:480px;
        width:100% !important;
        display:block;
        border-width: 1px 0 1px 0;
    }

    #widget-beach-conditions .image-beach, #widget-pet-of-the-week .backgroundimage, #beready-block .backgroundimage{
        bottom:160px;
    }

    #widget-beach-conditions .image-beach{
        bottom:110px;
    }

    .backgroundimage, #widget-beach-conditions .image-beach {
        height: 260px !important;
    }

    #home-blocks > div#widget-pet-of-the-week {
        height: 530px;
    }

}


.base_content_in > div{
    padding-left: 0 !important;
    padding-right: 0 !important;
}
