﻿
/* Redondo VB Site Styles
======================================================================= */
html, body {
    margin:0px;

    width:100%;
    height:100%;
    font-family: 'Droid Sans', 'Open Sans', Helvetica, Arial, Freesans, sans-serif;
    background-color:#e7e7e7;
}
#MainHeaderNavArea {
    height: 40px;
    background-color: rgba(0,0,0,0.75);
    color: #ffffff;
    max-width: 1434px;
    margin: 0px auto;
}
#navSearchBg {
    max-width: 1050px;
    margin: 0px auto;
    height:28px;
}
#MainNav {
    width: auto;
    float: left;
}
.wsite-search, .wsite-editor .wsite-search {
    display: block;
    white-space: inherit;
    /* width: 20%; */
    float: right;
}

/* Global Styles
======================================================================= */
img {
    border:none;
}

a{cursor:pointer;}

input[type=button] {cursor:pointer;}


.clearfix{
    clear:both;
}

.centerContent{
    text-align:center;
}

/* Button Styles
-------------------------------------------------- */
.wsite-search-button, .wsite-editor .wsite-search-button {
    display: inline-block;
    vertical-align: middle;
    width: 13px;
    height: 13px;
    background: none;
    cursor: pointer;
    -moz-transition: background-color .3s linear;
    -webkit-transition: background-color .3s linear;
    transition: background-color .3s linear;
}
.wsite-button-large, .wsite-editor .wsite-button-large, .wsite-button-large:hover, .wsite-editor .wsite-button-large:hover {
    background:none;
    border-radius: 6px;
}
.RedBlockButton,
.wsite-button-inner, 
.wsite-editor .wsite-button-inner {
    color:#ffffff;
    padding: 10px !important;
    background:#bf0335 !important;
    background-image: none !important;
    text-decoration:none;
    text-transform:uppercase;
}
.RedBlockButton:hover,
.wsite-button-inner:hover, 
.wsite-editor .wsite-button-inner:hover {
        background:#7b0625 !important;
        background-image: none !important;
        -moz-transition: background-color .3s linear;
        -webkit-transition: background-color .3s linear;
        transition: background-color .3s linear;
        border-radius: 6px;
    }
        .wsite-button-large.wsite-button-highlight, 
        .wsite-editor .wsite-button-large.wsite-button-highlight, 
        .wsite-button-large.wsite-button-highlight:hover, 
        .wsite-editor .wsite-button-large.wsite-button-highlight:hover {
            background:transparent;
            background-image: none !important;
        }

/* Redondo Layout Styles
======================================================================= */
.innerPageContainer{
    max-width:1050px;
    width:100%;
    margin: 0px auto;
}
#HeaderImage > img {
    max-width: 100%;
    margin: 0px auto;
    text-align: center;
    display: block;
}
#MainHeader{
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    z-index:1000;
}

#MainHeaderItemsArea{
    height:148px;
    background-color:#999;
    background-color:rgba(0,0,0,0.25);
}

#MainHeaderItems{
    position:relative;
}

#MainHeaderNavArea{
    height:28px;
    background-color:#666;
    background-color:rgba(0,0,0,0.75);
    color:#ffffff;
}

/* Redondo Header Object Styles
======================================================================= */

#HeaderLogo{
    position:absolute;
    top:10px;
    left:-50px;
}
.hdrphone {color:#ffffff;}

/* ---------------------  Main Nav Styles-------------------------------------- */
#navSearchBg {
    max-width: 1050px;
    margin: 0px auto;
    height:28px;
}
    #MainNav {
        width: auto;
        float: left;
        max-width:850px;
        height:26px;
    }
        #MainNav ul, .wsite-menu-default {
            margin:0px;
            padding:0px;
            list-style:none;
            font-size:.95em;
            text-transform:uppercase;
            display: block;
            list-style-type: none;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            text-transform: uppercase;
            width: 100%;
            max-width: 60em;
        }
            #MainNav ul li {
                float:left;
                border-right:solid 1px #333333;
                padding: 5px 15px;
            }
            #MainNav ul li:last-child {
                border-right:none;
            }
                #MainNav ul li a {
                    color:#ffffff;
                    text-decoration:none;
                }
    .wsite-menu-default:after {
       display: block;
       clear: both;
       visibility: hidden;
       content: ".";
       height: 0;
    }
    /*  L2/L3 Menu Styles */
    #wsite-menus .wsite-menu li {
        background-color: #013165;
    }
        #wsite-menus .wsite-menu li a {
        background-color: #013165;
        color: white;
        text-decoration: none;
        border-left: none;
        border-right: none;
        border-bottom: solid thin white;
        -moz-transition: background-color 0.3s ease;
        -webkit-transition: background-color 0.3s ease;
        transition: background-color 0.3s ease;
    }
        #wsite-menus > .wsite-menu-wrap > .wsite-menu li:hover > a {
            background-color: #bf0335;
        }
            #wsite-menus .wsite-menu > li:last-child > a {
            border-bottom: none;
        }
        #wli-MobileMenuToggle {
            display: none;
        }

/* Small Nav Styles
-------------------------------------------------- */
#SmallNav{
    position:absolute;
    top:120px;
    left:320px;
}

    #SmallNav ul {
        margin:0px;
        padding:0px;
        list-style:none;
        font-size:.7em;
    }
        #SmallNav ul li{
            float:left;
            border-right:solid 1px #ffffff;
            padding:0px 10px;
        }
        #SmallNav ul li:last-child{
            border-right:none;
        }
            #SmallNav ul li a{
                color:#ffffff;
                text-decoration:none;
            }
            #SmallNav ul li a:hover{
                text-decoration:underline;
            }

/* SocialIcons Styles
-------------------------------------------------- */
#SocialIcons{
    position:absolute;
    top:10px;
    right:0px;
    width:370px;
    text-align:right;
}
#SocialIcons > div {
    text-align: right !important;
}

/* Join Now Styles
-------------------------------------------------- */
#JoinNowButton{
    position:absolute;
    top: 55px; /* NBA 100px; */
    right:0px;
}


/* Google Search Area Styles
-------------------------------------------------- */
#GoogleToolsArea{
    position:absolute;
    top:55px;
    right:15px; /* NBA 380px */
    width:300px;
    height:60px;
}



/* Redondo Content Object Styles
======================================================================= */

#Content {
    padding: 20px 50px 30px;
    box-shadow: 0px 0px 8px rgba(0,0,0,0.1);
    margin: -4px auto;
    box-sizing: border-box;
    background: #f1f1f1;
    max-width: 1434px;
}
#HomePageMain{
    padding:0px 0px;
}

.homePageInfoBox {
    position:relative;
    display:inline-block;
    width:30%;
    padding: 1%;
    text-align:center;
}
.homePageInfoBox img {
    width: 100%;
}
    .homePageInfoBox .titleArea {
        position:absolute;
        top:45px;
        left:0px;
        width:100%;
        text-align:center;
    }
        .homePageInfoBox .titleArea {
            color:#ffffff;
            font-size:1.2em;
            font-weight:normal;
            width:80%;
            margin:0px auto;
        }

    .homePageInfoBox .learnMore {
        position:absolute;
        bottom:35px;
        left:0px;
        width:100%;
    }

.centeredAdSpace {
    text-align: center;
    padding: 2% 0px;
    height: 90px;
}
#DynamicContent {
    border-top: solid 1px #999999;
    border-bottom: solid 1px #999999;
    padding: 10px 0px;
    min-height: 190px;
    margin: 0px;
    box-sizing: border-box;
}

html, body{
    margin:0px;
    padding:0px;
}

/* Interior Styles
-------------------------------------------------- */
#AdArea{
    text-align:center;
    padding:10px 0px;
}

#MainContent{
    float:left;
    width:67%;
    margin-right:1%;
    padding-bottom:20px;
}
#MainContentWide {
    float:left;
    width:100%;
    margin-right:1%;
    padding-bottom:20px;
}

#SideItems{
    float:right;
    width:30%;    
}
#Quicklinks {
    margin-bottom: 20px;
    width:100%;
}
#Quicklinks > div.wli-quicklinks-container > ul, #Quicklinks > div.wc-quicklinks-container > ul {
    display: block;
    list-style-type: none;
    -webkit-margin-before: 0em;
    -webkit-margin-after: 0em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-start: 0px;
    padding-left:0px;
}
#Quicklinks > div.wli-quicklinks-container > ul > li, #Quicklinks > div.wc-quicklinks-container > ul > li {
    background: #666;
    list-style-type: none;
    padding: 8px;
    margin: 3px auto;
    -moz-transition: background-color .2s linear;
    -webkit-transition: background-color .2s linear;
    transition: background-color .2s linear;
}
#Quicklinks > div.wli-quicklinks-container > ul > li:hover, #Quicklinks > div.wc-quicklinks-container > ul > li:hover {
    background: #bf0335;
}
#Quicklinks > div.wli-quicklinks-container > ul > li a, #Quicklinks > div.wc-quicklinks-container > ul > li a{
    color:#fff;
    display: block;
    text-decoration:none;
}
#Quicklinks > h4 {
    text-align: center;
    letter-spacing: 1px;
    font-weight: 400;
    font-size: 1.3em;
    margin: 0px auto;
}
#SidebarItems {
    width: 315px;
    text-align: right;
    height: 250px;
}
#share {
    text-align: center;
    padding-top: 15px;
}
#PageHeader h2 {
    margin: 0px;
    text-transform: uppercase;
}

#Breadcrumbs ul{
    list-style:none;
    margin:0px;
    padding:0px;
}
    #Breadcrumbs ul li{
        float:left;
        margin:0px;
        padding:0px;
    }

    #Breadcrumbs ul li:after{
        content:">";
    }
    #Breadcrumbs ul li.first a{
        padding:5px 10px 5px 0px;
    }

    #Breadcrumbs ul li.last:after{
        content:"";
    }
        #Breadcrumbs ul li a{
            padding:5px 10px;
            color:#16399f;
            text-decoration:none;
        }
        #Breadcrumbs ul li a:hover{
            text-decoration:underline;
        }

/* Redondo Footer Object Styles
======================================================================= */
#FooterTop{

    background: #333333; /* Old browsers */
    background: -moz-linear-gradient(top,  #333333 0%, #4d4d4d 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#333333), color-stop(100%,#4d4d4d)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #333333 0%, #4d4d4d 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #333333, 0%, #4d4d4d 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #333333, 0%, #4d4d4d 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #333333, 0%, #4d4d4d 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#333333', endColorstr='#4d4d4d',GradientType=0 ); /* IE6-9 */
    /*height: 130px; */
    padding-bottom: 5px;
}

#FooterMid{
    background-color:#000000;
    height: 85px;
}

#FooterBottom{
    background: #333333; /* Old browsers */
    background: -moz-linear-gradient(top,  #616161 0%, #666666 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#616161), color-stop(100%,#666666)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #616161 0%, #666666 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #616161, 0%, #666666 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #616161, 0%, #666666 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #616161, 0%, #666666 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#616161', endColorstr='#666666',GradientType=0 ); /* IE6-9 */
    height:105px;
}

/* Footer Area Top Styles
-------------------------------------------------- */
#ThanksTextArea {
    padding: 10px 0px 0px;
    color:#999999;
    font-size:.8em;
}

#SponsorsArea{
    padding: 0px;
}
#SponsorsArea > img {
    max-width:100%;
}

.tab-pane {
    min-height: 250px !important;
}
/* Footer Area Mid Styles
-------------------------------------------------- */


#VisitorNewsletterTextBlock {
    position:absolute;
    top:15px;
    left:10px;
}

#VisitorNewsletterTextBlock h3{
    margin:0px;
    color:#ffffff;
}

#VisitorNewsletterTextBlock p{
    margin:0px;
    color:#999999;
    font-size:.7em;
}

#VisitorNewsletterFormBlock {
    position:absolute;
    top:18px;
    right:10px;
}
#VisitorNewsletterFormBlock input[type=button]{
    color:#ffffff;
    padding:8px 15px;
    background-color:#bf0335;
    text-decoration:none;
    text-transform:uppercase;
    border:none;
    
}

    #VisitorNewsletterFormBlock input[type=button]:hover {
        background-color:#7b0625;
    }
#VisitorNewsletterFormBlock input[type=text]{
        width:500px;
        height:30px;
        border:solid 1px #000000;
}

/* Footer Area Bottom Styles
-------------------------------------------------- */

#FooterBottomContainer {
    position:relative;
}
#WeatherWidget > div:nth-child(2) > strong > a {
    font-size: 9px;
    font-family: open sans, sans-serif;
    font-weight: 300;
    text-decoration: none;
}
#WeatherWidget > div:nth-child(2) > center > table > tbody > tr > td:nth-child(2) > center {
    font-size: 10px;
}
#WeatherWidget {
    position: relative;
    top: 20px;
    left: 0px;
}
#FooterCopyrightText{
    position:absolute;
    top:35px;
    left:180px;
    color:#999999;
    font-size:.6em;
}
#FooterCopyrightText a{
    color:#999;
}
#WeblinkCredits{
    position:absolute;
    top:40px;
    right:0;
    color:#999999;
    font-size:.6em;
}

#WeblinkCredits img{
    vertical-align:middle;
}

/* ======================================================================
        HOMEPAGE Slideshow
======================================================================= */
/* --- Slider Structure --- */
    #SlideshowContainer {
        height:626px;
        max-width: 1434px;
        margin: 0px auto;
        overflow:hidden;
    }
        #Slideshow {
            position:relative;
        }
            #Slideshow .slide {
                position: absolute;
                top: 0px;
                left: 0px;
                background: #f1f1f1;
                width: 100%;
                text-align: center;
            }
             .slide img {
                border: none;
                margin-top: 0px;
                margin-bottom: 0px;
            }
        #Slideshow .slide.foreground{
            z-index:100;
        }
        #Slideshow .slide.background{
            z-index:80;
        }
    /* --- Overlay for Slide Title Header & Captions --- */
                #Slideshow .slideOverlay {
                    position: absolute;
                    top: 57%;
                    float: right;
                    width: 85%;
                    text-align: right;
                    z-index: 180;
                    right: 10%;
                    padding-left: 5%;
                    max-width: 450px;
                }
                #Slideshow .sliderCaptionHdr > h2 {
                    display: block;
                    padding: 5px 10px;
                    background: rgb(191,3,53);
                    background: rgba(191, 3, 53, 0.85);
                    color: white;
                    margin:0px;
                    text-transform: uppercase;
                    min-height: 40px;
                    min-width: 40px;
                }
                .sliderCaption .paragraph {
                    max-width: 300px;
                }
                #Slideshow .sliderCaption {
                    margin: 10px 0px 0px 0px;
                    color: white;
                    display: block;
                    background:#000;
                    background: url(https://RedondoCACOC.wliinc23.com/CWT/External/WCPages2/images/SliderImages/arrow.png) no-repeat scroll right center rgba(0, 0, 0, 0.85);
                    width: 100%;
                    right: 0;
                    background-repeat: no-repeat;
                    min-height: 90px;
                    min-width: 90px;
                }
                #Slideshow .sliderCaption div.paragraph {
                    font-size: small;
                    font-weight: lighter;
                    font-family: arial;
                    font-style: italic;
                    margin: 0px;
                    text-align: justify;
                    padding: 10px;
                }
    /* ----  Slider Arrows  -------- */
               .sliderArrows{
                    width:40px;
                    height:54px;
                    background-image:url(https://RedondoCACOC.wliinc23.com/CWT/External/WCPages2/images/SliderArrows.png);
                    background-repeat: no-repeat;
                    background-position: right;
                    z-index:300;
                }
                .sliderNav {
                    max-width: 1434px;
                    display: block;
                    margin: 0px auto;
                    position: absolute;
                    width: 100%;
                    float: none;
                    top: 300px;
                }
                .sliderArrowRight {
                    position: relative;
                    top: 0;
                    right: 0;
                    background-position: -40px 0px;
                    display: block;
                    float: right;
                }               
                    .sliderArrowRight:hover{
                        background-position: -40px -54px;
                        cursor: pointer;
                    }
                .sliderArrowLeft {
                    position: relative;
                    background-position: 0px 0px;
                    display: block;
                    float: left;
                    top:0;
                    left:0;
                }
                    .sliderArrowLeft:hover{
                        background-position: 0px -54px;
                        cursor: pointer;
                    }
/* ====== END SLIDER ======== */



/*** === HOME PAGE STYLES === ***/

    #hpBlogPost > h1 {
        font-size: 2em;
        font-weight: normal;
        color: white;
        background: #14379E;
        width: 40%;
        padding: 3px;
        margin-top: 0px;
        text-transform: uppercase;
    }
    #hpBlogContent > h3 {
        margin: 0px;
        padding: 0px;
        color: #14379E;
        font-weight: 200;
    }
    #hpBlogContent > p {
        margin-top: 0px;
        font-size: 1em;
    }
    #hpBlogPost, #hpEventNewsVid {
        width: 47%;
        padding: 5px 10px;
        display: inline-block;
        vertical-align: top;
    }
    #hpEventNewsVid {
        /* float: right; */
    }


    #hpEventNewsVid > div.nav-events > ul {
        margin: 0px;
        list-style-type: none;
        display: block;
        padding: 0px;
    }
    #hpEventNewsVid > div.nav-events > ul > li {
        display: inline-block;
        text-align: center;
        width: 30%;
        text-decoration: none;
        text-transform: uppercase;
        font-size: 2em;
    }
    #hpEventNewsVid > div.nav-events > ul > li.active {
        background: #14379E;
        padding: 5px;
    }
    #hpEventNewsVid > div.nav-events > ul > li.active > a {
        color: white;
    }
    #hpEventNewsVid > div.nav-events > ul > li a {
        text-decoration: none;
        color:black;
    }
    #hpEventNewsVid > div.tab-content > ul {
        display: block;
        float: none !important;
        width: 100% !important;
        margin-bottom: 0px;
    }
    #hpEventNewsVid > div.tab-content > ul > li {
        list-style-type: none;
        margin-bottom: 0px;
    }
    #hpEventNewsVid > div.tab-content > a {
        clear: both;
        display: block;
        width: 100%;
        text-align: left;
        margin: auto;
        font-size: 1.2em;
    }
    /* NEW! */
    #hpEventNewsVid ul.events-list {
        padding: 0;
        margin: 0;
        list-style: none;
    }
    #hpEventNewsVid ul.events-list li {
        padding: 5px 0;
        margin: 0;
        list-style: none;
    }
    #hpEventNewsVid ul.events-list li:before,
    #hpEventNewsVid ul.events-list li:after {
        content: " ";
        display: table;
    }
    #hpEventNewsVid ul.events-list li:after {
        clear: both;
    }
    
/*=======  Backpage Sidebar  ===========*/
    /* Back Page Sidebar Structure */
        #bpBlogPost, #bpEventNewsVid {
            display: inline-block;
            /*padding: 5px 0;*/
            width: 100%;
            margin-top:15px;
        }
        #bpEventNewsVid #hpEventNewsVid > div.tab-content > ul {
            display: block;
            float: right;
            margin-bottom: 0;
            margin-left: 0;
            padding-left: 0;
            width: 80%;
        }
        #bpBlogPost > h1 {
            font-size: 1.1em;
            font-weight: normal;
            color: white;
            background: #14379E;
            width: 40%;
            padding: 3px;
            margin-top: 0px;
            text-transform: capitalize;
        }
        #bpBlogContent > h3 {
            margin: 0px;
            padding: 0px;
            color: #14379E;
            font-weight: 200;
        }
        #bpBlogContent > p {
            margin-top: 0px;
            font-size: 1em;
        }
        #bpBlogPost, #bpEventNewsVid {
            width: 100%;
            padding: 5px 10px;
            display: inline-block;
        }
        #bpEventNewsVid {
            float: right;
        }
        #bpEventNewsVid > div.nav-events > ul {
            margin: 0px;
            list-style-type: none;
            display: block;
            padding: 0px;
        }
        #bpEventNewsVid > div.nav-events > ul > li {
            display: inline-block;
            text-align: center;
            text-decoration: none;
            text-transform: uppercase;
            width: 28%;
        }
        #bpEventNewsVid > div.nav-events > ul > li a {
            text-decoration: none;
            color:black;
        }
        #bpEventNewsVid > div.nav-events > ul > li.active {
            background: #14379E;
            padding: 5px;
        }
        #bpEventNewsVid > div.nav-events > ul > li.active > a {
            color: white;
        }
        #bpEventNewsVid #eventImg {
            display: block;
            float: left;
            max-width: 20%;
            text-align: center;
        }
        #bpEventNewsVid > div.tab-content > ul {
            display: block;
            float: right;
            width: 65%;
            margin-bottom: 0px;
        }
        #bpEventNewsVid > div.tab-content > ul > li {
            list-style-type: none;
            margin-bottom: 20px;
        }
/* ----end backpage structure styles */

    /* ----Blog / News Widget styles ------*/
    .eventStartDate {
        width: 40px;
        display: block;
        float: left;
        padding: 7px 5px;
        background-color: #B8B6B6;
        color: white;
        text-align: center;
        border-radius: 40px;
        height: 40px;
        margin-right: 5px;
        line-height: 1.2;
        font-weight: 300;
        margin-top: -3px;
    }
    .eventLink {
        color: #14379E;
        text-decoration: underline;
    }
    .eventRunDates {
        font-family: tahoma, sans-serif;
        font-style: italic;
        font-size: .8em;
        font-weight: lighter;
        color: #070707;
    }
    .eventImg {
        display: block;
        float: left;
    }
    .eventImg > img {
        max-width: 100px;
        margin: 10px;
        border: 1px solid gray;
        display: block;
        float:left;
    }

    

/* Redondo Responsive: Tablet
====================================================================================================== */
@media only screen and (max-width: 1027px){
    #HomePageMain{
        text-align: center;
    }
}

@media only screen and (max-width: 1018px){

    #bpEventNewsVid > div.tab-content > ul > li {
        margin-bottom: 40px !important;
    }
}

@media only screen and (max-width: 1018px){
        #DynamicContent {
            border-top: 1px solid #999;
            border-bottom: 1px solid #999;
            padding: 10px 0px;
            min-height: 225px;
            margin: 0px;
        }
}
}
@media only screen and (min-width:650px) and (max-width: 1000px){
    
    /* */

    .innerPageContainer{
       /* width: auto;  NBA 800px; */
    }
    
    /*
    .homePageInfoBox {
        width:395px;
        padding-bottom:1%;
    }*/
    
    .homePageInfoBox {
        width: 30%;
        padding:1%;
    }
    
    .centeredAdSpace {
        padding-bottom:1%;
    }

    .centeredAdSpace img{
        width:95%;
        height:auto;
    }

    #MainContent{
        float:none;
        width:100%;
        margin:0px;
    }

    #SideItems{
        float:none;
        width:100%;
        margin:0px;
    }

    #Quicklinks{    
        float:left;
        width:49%;
    }
    #SidebarItems{
        float:right;
        width:49%;
    }
    iframe {border:none !important;}
    #VisitorNewsletterFormBlock {
        position:absolute;
        top:18px;
        right:80px;
    }

    #VisitorNewsletterFormBlock input[type=text]{
        width:250px;
        height:30px;
        border:solid 1px #000000;
    }
    
    #FooterCopyrightText{
        width:300px;
    }
}

@media only screen and (max-width: 950px){
    /* Tablet Header Styles */
    #MainNav {
        max-width: none;
        float:none;
        width:100%;
    }
    .wsite-search {
        width: 30%;
        position: relative;
        top: -13px;
    }
    .wsite-search-input {
        width: 90%;
    }

    #wli-MobileMenuToggle {
        display: block;
        background-color: rgba(1, 49, 101, 0.75);
        background-image: url("http://redondocacoc2.weblinkconnect.com/external/wcpages2/images/mobile-menu-icon.png");
        background-repeat: no-repeat;
        background-position: top .5em right 33%;
        color: white;
        font-size: 1.25em;
        text-align: center;
        text-decoration: none;
        text-transform: uppercase;
        padding: .75em 1.45em;
    }
    #MainHeaderNavArea {
        background-color: transparent;
    }
    #MainNav ul, .wsite-menu-default {
        max-width:none;
    }
    .wsite-menu-default {
        overflow: hidden;
        height: 0;
        max-height: 0;
        top: -60em;
        -moz-transition: top 0.5s ease;
        -webkit-transition: top 0.5s ease;
        transition: top 0.5s ease;
    }
        .wsite-menu-default li {
            float: none !important;
            text-align: center;
            border-bottom: solid thin white;
        }
    /*#wsite-menus > .wsite-menu-wrap {
        display: none;
    }
    #wsite-menus { 
        display: none;
    }*/
    #MainNav ul li {
        background:#bf0335;
        background:rgba(191, 3, 53, 0.9);
        border-bottom: 1px solid #fff;
        display: block;
        float: left;
        padding: 10px 0px;
        text-align: center;
        width: 100%;
    }
    #MainNav ul li:hover {
        background: #7b0625;
        -moz-transition: background-color .3s linear;
        -webkit-transition: background-color .3s linear;
        transition: background-color .3s linear;
    }
    .mobNav {
        overflow: visible;
        top:0em;
    }

    #hpBlogPost, #hpEventNewsVid {
        width: 95%;
        padding: 1% 1%;
        display: inline-block;
    }
}

    @media only screen and (min-width:1px) and (max-width: 909px){    
        /*#VisitorNewsletterArea {
            position: relative;
            height: 105px;
        }*/
    }

@media only screen and (min-width:1px) and (max-width: 767px){    
    .desktop {display:none !important;}
    .phones {display:block !important;}
}

/* Redondo Responsive: Smartphone
=============================================================================================================== */
@media only screen and (min-width:1px) and (max-width: 650px){    
    
    .innerPageContainer{
        width:375px;
    }

    #GoogleToolsArea{
        top:5px;
        left:0px;
    }

    .homePageInfoBox {
        width: 96%;
    }
    
    #HeaderLogo img{
        width:60%;
        height:60%;
    }

    #HeaderLogo{
        left:-30px;
        top:60px;
    }

    #SmallNav {
        display:none;
    }

    #SocialIcons {
        display:none;    
    }

    .homePageInfoBox{
        width: ;
        margin:0px auto;
        padding-bottom:1%;
    }
    
    .centeredAdSpace img{
        width:95%;
        height:auto;
    }
        
    #MainContent{
        float:none;
        width:100%;
        margin:0px;
    }

    #SideItems{
        float:none;
        width:100%;
        margin:0px;
    }

    #Quicklinks{    
        float:none;
        width:100%;
    }

    #SidebarItems{
        float:none;
        width:100%;
    }
    #WeatherWidget{
        position:static;
        padding:5px 0px;
        text-align:center;
    }

    #FooterCopyrightText{
        position:static;
        text-align:center;
        padding:5px 0px;
    }

    #WeblinkCredits{
        position:static;
        text-align:center;
    }

    #FooterBottom {
        height:130px;
    }
}

/* Custom */

    /* ----Blog / News Widget styles ------*/
    .eventStartDate {
        width: 40px;
        display: block;
        float: left;
        padding: 7px 5px;
        background-color: #B8B6B6;
        color: white;
        text-align: center;
        border-radius: 40px;
        height: 40px;
        margin-right: 5px;
        line-height: 1.2;
        font-weight: 300;
        margin-top: -3px;
    }
    .eventLink {
        color: navy;
        text-decoration: underline;
    }
    .eventRunDates {
        font-family: tahoma, sans-serif;
        font-style: italic;
        font-size: .8em;
        font-weight: lighter;
        color: #070707;
    }
    #eventImg {
        display: block;
        float: left;
    }
    #eventImg > img {
        max-width: 100px;
        margin: 10px;
        border: 1px solid gray;
        display: block;
        float:left;
    }
    .directory_container {
        padding: 0px;
    }
    .directory_container a{
        color: #15389F;
    }   
    .directory_navigation {
        margin: 0 0 2px 0 !important;
        padding: 5px 15px !important;
        border: none !important;
        background: #15389F !important;
        text-align: center !important;
        color: white !important;
    }
    .directory_navigation a {
        color: white;
        text-decoration:none;
    }
    .directory_navigation a:hover {
        color: white;
        text-shadow: 0px 0px 4px rgba(255,255,255,0.9);
    }
    .directory_search_title {
        color: #000;
        font-weight: bold;
    }
    #mdiv_DirectoryContentRight {
        margin-top: 10px;
    }
    .directory_search {
        border: none;
        background-color: #fdc919;
        margin: 7px 0 5px 0;
        padding: 10px 0px 1px 10px;
    }
    .directory_container > h2 {
        margin: 10px;
    }
    .directory_container h3 a {
        margin-bottom: 5px;
        background: #15389F;
        color: white !important;
        display: block;
        padding: 5px;
        width: 80%;
    }
    .directory_container h3 a:hover {
        border-radius: 5px;
    }
    .ListingResults_Level5_HEADER, .ListingDetails_Level5_HEADERBOX {
        background-color: #bf0335;
        border-color: #bf0335;
    }
    .ListingForm_Container_box {
        border: 5px solid #999;
        padding: 10px;
        background-color: white;
        margin-top: 25px;
    }
    .ListingForm_Container_box {
        border: none !important;
        padding: 0 5px !important;
        background-color: transparent !important;
    }
    .ListingCategories_AllCategories_CATEGORY {
        margin: 4px 0;
        text-transform: uppercase;
        padding-top: 10px;
    }
    .ListingCategories_AllCategories_SUBCATEGORY {
        list-style-type: disc;
        color: #bf0335;
    }
/*---- COUPONS ----*/
    #content1_content_PublicCouponList_gvCoupons > tbody > tr:nth-child(1) {
        border-top: 3px solid #bf0335 !important;
        border-bottom: 3px solid #bf0335 !important;
    }
    #public > .GeneralBody {
        background: white;
        padding: 10px;
        border: 2px solid #BF0335;
    }
    #public th {
        margin-top: 12px !important;
        padding: 3px 0;
        background-color: #bf0335 !important;
        color: white !important;
        margin-bottom: 12px !important;
    }
/*---- EVENTS CALENDAR----*/
    #eventCalendarSmallContainer table {
        margin: 0px auto;
        padding: 0px 20px;
        border-radius: 8px;
    }
    #TABLE1 > tbody > tr:nth-child(2) > td > table:nth-child(1) {
        border-bottom: none !important;
        border-top: none !important;
    }
    .tablecontainer, table#EventHeader, table#newsheader, #eventCalendarSmallContainer table table{
        margin-top:20px !important;
        border-top: 1px solid #013165 !important;
        border-bottom: 1px solid #013165 !important;
        background:transparent;
    }
    #eventCalendarSmallContainer div table {
        margin-top:-4em;
        }

    #eventCalendarSmallContainer div table tr:last-of-type table{
        margin-left: 80px;
        border:none !important;
        }
    #eventCalendarSmallContainer div table#content1_content_EventCalendarSmall1_calSmall{
        width:320px !important;
        }
    .CalendarOtherMonthDayStyle {
        background: #DBDBDB;
        color: #FFFFFF;
        }
    .CalendarDayStyle,.CalendarWeekendDayStyle,.CalendarTodayDayStyle{
        background: #6685A3;
        color: #FFFFFF;
        font-size: 1em;
        }
        .CalendarWeekendDayStyle {
            background: #eee;
            border-style: dotted !important;
            border-color: black;
            border: 1px dotted black !important;
        }
    .CalendarTodayDayStyle {
        background: #bf0335 !important;
        color:white !important;
        font-weight:bold !important;
    }
    .CalendarDayHeaderStyle {
        background: #013165;
        color: #FFFFFF;
    }
    #EventListContainer table,#content1_content_EventList1_dgEvents {
        width:100%;
        max-width:30em;
    }
    
    
    
/* Redondo Responsive Media Hooks
=============================================================================================================== */
/* Desktop */
.homePageInfoBox {
    width: 30%;
    padding: 1%;
}

.homePageInfoBox .titleArea {
    position: absolute;
    top: 1.5em;
    left: 8%;
    width: 83%;
    text-align: center;
}
.homePageInfoBox .titleArea h2 {
    text-align: center;
}

.homePageInfoBox .learnMore {
    position: absolute;
    bottom: 2em;
    left: 0;
    width: 100%;
}
/* .wli-tabs */
.tab-pane {
    position: static;
    display: none;
}
.tab-content {}
.wli-tab-show {
    display: block;
}
.wli-event-icon a {
    text-decoration: none;
}

/* Smartphone */
/*  */
@media only screen and (max-width: 1027px) { }

/*  */
#FooterMid {
    position:relative;
    height:90px;
}
@media only screen and (max-width: 716px) { } 
/*      #FooterMid {
        position:static;
        height:145px;
    }
*/
@media only screen and (max-width: 950px) { 
    #hpEventNewsVid {
        float: none;
    }
}

/* Tablet */
@media only screen and (min-width:1px) and (max-width: 767px) { 
        
    .homePageInfoBox {
        width: 85%;
        padding: 1em;
    }
    .homePageInfoBox .titleArea {
        position: absolute;
        top: 1.5em;
        left: 8%;
        width: 83%;
        text-align: center;
    }
    .homePageInfoBox .titleArea h2 {
        text-align: center;
        font-size: 2em;
    }
    .homePageInfoBox .learnMore {
        position: absolute;
        bottom: 3em;
        left: 0;
        width: 100%;
    }
    #FooterBottom {
        height: auto;
    }
    #WeatherWidget > div:nth-child(2) {
        width: 100% !important;
    }
    #WeblinkCredits {
        position: relative;
        top: 10px;
        color: #999999;
        font-size: .6em;
        text-align: center;
    }
    #FooterCopyrightText {
        position: relative;
        top: 0px;
        left: auto;
        color: #999999;
        font-size: .6em;
        width: 100% !important;
        display: block;
        margin: 0px auto;
        text-align: center;
        float: left;
    }
    html {
    background-color: #666;
    }
    
}

@media only screen and (min-width:1px) and (max-width: 650px) { 
    .innerPageContainer {
        width: auto;
    }
    .homePageInfoBox {
        width: 85%;
        padding: 1em;
    }
    .homePageInfoBox .titleArea {
        position: absolute;
        top: 1.5em;
        left: 8%;
        width: 83%;
        text-align: center;
    }
    .homePageInfoBox .titleArea h2 {
        text-align: center;
        font-size: 1.5em;
    }
    .homePageInfoBox .learnMore {
        position: absolute;
        bottom: 3em;
        left: 0;
        width: 100%;
    }
}

    
     iframe {
        width: 100%;
        border: none !important;
    }

.sliderHR {
    color: magenta;
    border: 2px dashed magenta;
    margin:15px 0px;
}
/* Homepage Blog Widget */
#hpBlogPost > div > div {
    margin-top: 0px !important;
}

p.rss-title {
    text-decoration: none;
    font-family: inherit;
    text-transform: uppercase;
    line-height: auto !important;
    color: #FFF !important;
    font-weight: normal !important;
    text-align: left;
    height: 35px;
    margin: 0;
    background: #14379E;
    padding: 13px 0px 0px !important;
}
p.rss-title a {
    color:white !important;
    font-size:1em;
}
.rss-item {
    font-family: verdana, arial, sans-serif;
    font-size: 14px;
    font-weight: normal;
    background: #FFF !important;
    list-style: none;
    line-height: 16px;
    border-bottom: 1px solid #C5D7EF;
    padding: 8px;
}
.rss-item a {
    text-decoration: none;
    color: #000 !important;
    font-size: 12px;
    font-weight: 700;
    font-family: arial, sans-serif;
    border: none;
    padding: 0;
}
.rss-item a:hover, .rss-item a:visited {
    text-decoration: underline;
    color: #333 !important;
}

li.wli-quicklink-sibling {
    padding-left: 45px !important;
}

.CalendarTodayDayStyle a {color:white;}
.CalendarDayStyle a {color:#BF0335;}

/* END OF FILE
=============================================================================================================== */