.card p, .card p span, .hidetooltip {
    text-align: center
}

    .card p span, select {
        display: inline-block
    }

        select.classic, select.classic:focus {
            background-size: 5px 5px,5px 5px,2.5em 2.5em;
            background-repeat: no-repeat
        }

            select.classic, select.classic:focus, select.round {
                background-repeat: no-repeat
            }

.alert-warning {
    color: #000 !important
}

.Sbanner p {
    animation: 15s infinite mymove;
    position: relative;
    font-weight: 700;
    font-size: 1.2em;
    margin-bottom: 0
}

    .Sbanner a {
        color: #83a1d7 !important;
    }

        .Sbanner a:hover {
            color: #fff !important;
        }

.Sbanner {
    background-color: red
}

img[usemap] {
    border: none;
    height: auto;
    max-width: 100%;
    width: auto
}

.hidetooltip, .showMapMouseOver {
    border-radius: 4px;
    position: absolute
}

.card {
    background-color: #002960;
    padding: 30px 0
}

    .card p {
        margin-left: auto;
        margin-right: auto;
        width: 20em
    }

        .card p span {
            font-size: 1.5em;
            color: #fff;
            line-height: 20px
        }

        .card p img {
            width: 200px;
            height: 200px;
            padding: 15px
        }

@media (max-width:780px) {
    .Sbanner p {
        font-size: 1em;
        font-weight: 700
    }
}

.carousel-control-next-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E")
}

.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E")
}

.carousel-control-next, .carousel-control-prev {
    opacity: 1
}

area {
    cursor: url("~/HarrisCounty/img/marker_map_icon.png"),default;
    display: block
}

.hidetooltip {
    visibility: hidden;
    width: 20%;
    background-color: #856;
    color: #fff;
    padding: 9px;
    top: 60%;
    left: 40%;
    margin-left: -85px
}

.showMapMouseOver {
    visibility: visible;
    background-color: #bee8ff;
    color: #000;
    text-align: left;
    padding: 1px;
    cursor: pointer;
    z-index: 1
}

div.branchinfoselect {
    display: none
}

select {
    background-color: #fff;
    border: thin solid #00f;
    border-radius: 4px;
    font: inherit;
    line-height: 1.5em;
    padding: .5em 3.5em .5em 1em;
    margin: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none
}

    select.classic {
        background-image: linear-gradient(45deg,transparent 50%,#00f 50%),linear-gradient(135deg,#00f 50%,transparent 50%),linear-gradient(to right,#87ceeb,#87ceeb);
        background-position: calc(100% - 20px) calc(1em + 2px),calc(100% - 15px) calc(1em + 2px),100% 0
    }

        select.classic:focus {
            background-image: linear-gradient(45deg,#fff 50%,transparent 50%),linear-gradient(135deg,transparent 50%,#fff 50%),linear-gradient(to right,gray,gray);
            background-position: calc(100% - 15px) 1em,calc(100% - 20px) 1em,100% 0;
            border-color: grey;
            outline: 0
        }

    select.round, select.round:focus {
        background-size: 5px 5px,5px 5px,1.5em 1.5em
    }

    select.round {
        background-image: linear-gradient(45deg,transparent 50%,gray 50%),linear-gradient(135deg,gray 50%,transparent 50%),radial-gradient(#ddd 70%,transparent 72%);
        background-position: calc(100% - 20px) calc(1em + 2px),calc(100% - 15px) calc(1em + 2px),calc(100% - .5em) .5em
    }

        select.round:focus {
            background-image: linear-gradient(45deg,#fff 50%,transparent 50%),linear-gradient(135deg,transparent 50%,#fff 50%),radial-gradient(gray 70%,transparent 72%);
            background-position: calc(100% - 15px) 1em,calc(100% - 20px) 1em,calc(100% - .5em) .5em;
            background-repeat: no-repeat;
            border-color: green;
            outline: 0
        }

    select.minimal, select.minimal:focus {
        background-size: 5px 5px,5px 5px,1px 1.5em;
        background-repeat: no-repeat
    }

    select.minimal {
        background-image: linear-gradient(45deg,transparent 50%,gray 50%),linear-gradient(135deg,gray 50%,transparent 50%),linear-gradient(to right,#ccc,#ccc);
        background-position: calc(100% - 20px) calc(1em + 2px),calc(100% - 15px) calc(1em + 2px),calc(100% - 2.5em) .5em
    }

        select.minimal:focus {
            background-image: linear-gradient(45deg,green 50%,transparent 50%),linear-gradient(135deg,transparent 50%,green 50%),linear-gradient(to right,#ccc,#ccc);
            background-position: calc(100% - 15px) 1em,calc(100% - 20px) 1em,calc(100% - 2.5em) .5em;
            border-color: green;
            outline: 0
        }

    select:-moz-focusring {
        color: transparent;
        text-shadow: 0 0 0 #000
    }

#branchinfo img {
    width: 100%;
    height: 100%
}

#branchinfo ul {
    list-style-type: none;
    padding: 3px !important
}

    #branchinfo ul li h9 {
        text-align: center !important
    }

@media only screen and (max-width:500px) {
    .newsItem {
        padding-right: 3rem !important;
        padding-left: 3rem !important
    }

    div.branchinfoselect {
        display: block;
        background-color: #fff;
        color: #000;
        text-align: left;
        border-radius: 4px;
        padding: 1px;
        cursor: pointer;
        z-index: 1
    }

    .showtomball {
        width: 36%;
        left: 28%;
        top: 18%;
        font-size: 10px
    }

    .showcypresshill {
        width: 31%;
        left: 43%;
        top: 27%;
        font-size: 10px
    }

    .showbayarea, .showbaytown, .showbellaire, .showclay, .showdowntown, .showhumble, .showjimfonteno, .showjohnphelps, .showkylechapman, .showmickeyleland, .showpalmcenter, .showraulmartinez, .showscarsdale, .showspringbranch {
        width: 36%;
        font-size: 10px
    }

    .showhumble {
        left: 59%;
        top: 33%
    }

    .showmickeyleland {
        left: 46%;
        top: 48%
    }

    .showclay {
        left: 26%;
        top: 53%
    }

    .showspringbranch {
        left: 38%;
        top: 57%
    }

    .showjimfonteno {
        left: 66%;
        top: 55%
    }

    .showbaytown {
        left: 82%;
        top: 60%
    }

    .showdowntown {
        left: 51%;
        top: 62%
    }

    .showraulmartinez {
        left: 56%;
        top: 64%
    }

    .showpalmcenter {
        left: 52%;
        top: 70%
    }

    .showjohnphelps {
        left: 62%;
        top: 68%
    }

    .showscarsdale {
        left: 63%;
        top: 85%
    }

    .showbayarea {
        left: 72%;
        top: 88%
    }

    .showbellaire {
        left: 41%;
        top: 68%
    }

    .showkylechapman {
        left: 71%;
        top: 75%
    }
}

@media only screen and (min-width:500px) {
    .showtomball {
        width: 37%;
        left: 28%;
        top: 18%;
        font-size: 10px
    }

    .showcypresshill {
        width: 31%;
        left: 43%;
        top: 27%;
        font-size: 10px
    }

    .showbayarea, .showbaytown, .showbellaire, .showclay, .showdowntown, .showhumble, .showjimfonteno, .showjohnphelps, .showkylechapman, .showmickeyleland, .showpalmcenter, .showraulmartinez, .showscarsdale, .showspringbranch {
        width: 37%;
        font-size: 10px
    }

    .showhumble {
        left: 59%;
        top: 33%
    }

    .showmickeyleland {
        left: 46%;
        top: 48%
    }

    .showclay {
        left: 26%;
        top: 53%
    }

    .showspringbranch {
        left: 38%;
        top: 57%
    }

    .showjimfonteno {
        left: 66%;
        top: 55%
    }

    .showbaytown {
        left: 82%;
        top: 60%
    }

    .showdowntown {
        left: 51%;
        top: 62%
    }

    .showraulmartinez {
        left: 56%;
        top: 64%
    }

    .showpalmcenter {
        left: 52%;
        top: 70%
    }

    .showjohnphelps {
        left: 62%;
        top: 68%
    }

    .showscarsdale {
        left: 63%;
        top: 85%
    }

    .showbayarea {
        left: 72%;
        top: 88%
    }

    .showbellaire {
        left: 41%;
        top: 68%
    }

    .showkylechapman {
        left: 71%;
        top: 75%
    }
}

@media only screen and (min-width:600px) {
    .showtomball {
        width: 36%;
        left: 28%;
        top: 18%;
        font-size: 10px
    }

    .showcypresshill {
        width: 31%;
        left: 43%;
        top: 27%;
        font-size: 10px
    }

    .showbayarea, .showbaytown, .showbellaire, .showclay, .showdowntown, .showhumble, .showjimfonteno, .showjohnphelps, .showkylechapman, .showmickeyleland, .showpalmcenter, .showraulmartinez, .showscarsdale, .showspringbranch {
        width: 36%;
        font-size: 10px
    }

    .showhumble {
        left: 59%;
        top: 33%
    }

    .showmickeyleland {
        left: 46%;
        top: 48%
    }

    .showclay {
        left: 26%;
        top: 53%
    }

    .showspringbranch {
        left: 38%;
        top: 57%
    }

    .showjimfonteno {
        left: 66%;
        top: 55%
    }

    .showbaytown {
        left: 82%;
        top: 60%
    }

    .showdowntown {
        left: 51%;
        top: 62%
    }

    .showraulmartinez {
        left: 56%;
        top: 64%
    }

    .showpalmcenter {
        left: 52%;
        top: 70%
    }

    .showjohnphelps {
        left: 62%;
        top: 68%
    }

    .showscarsdale {
        left: 63%;
        top: 85%
    }

    .showbayarea {
        left: 72%;
        top: 88%
    }

    .showbellaire {
        left: 41%;
        top: 68%
    }

    .showkylechapman {
        left: 71%;
        top: 75%
    }
}

@media only screen and (max-width:768px) {
    .newsItem {
        padding-right: 3rem !important;
        padding-left: 3rem !important
    }

    div.branchinfoselect {
        display: block;
        background-color: #fff;
        color: #000;
        text-align: left;
        border-radius: 4px;
        padding: 1px;
        cursor: pointer;
        z-index: 1
    }

    #branchinfo img {
        display: none
    }
}

@media only screen and (min-width:700px) {
    .showbayarea, .showbaytown, .showbellaire, .showclay, .showcypresshill, .showdowntown, .showhumble, .showjimfonteno, .showjohnphelps, .showkylechapman, .showmickeyleland, .showpalmcenter, .showraulmartinez, .showscarsdale, .showspringbranch, .showtomball {
        width: 16%;
        font-size: 10px
    }

    .showtomball {
        left: 28%;
        top: 18%
    }

    .showcypresshill {
        left: 43%;
        top: 27%
    }

    .showhumble {
        left: 59%;
        top: 33%
    }

    .showmickeyleland {
        left: 46%;
        top: 48%
    }

    .showclay {
        left: 26%;
        top: 53%
    }

    .showspringbranch {
        left: 38%;
        top: 57%
    }

    .showjimfonteno {
        left: 66%;
        top: 55%
    }

    .showbaytown {
        left: 82%;
        top: 60%
    }

    .showdowntown {
        left: 51%;
        top: 62%
    }

    .showraulmartinez {
        left: 56%;
        top: 64%
    }

    .showpalmcenter {
        left: 52%;
        top: 70%
    }

    .showjohnphelps {
        left: 62%;
        top: 68%
    }

    .showscarsdale {
        left: 63%;
        top: 85%
    }

    .showbayarea {
        left: 72%;
        top: 88%
    }

    .showbellaire {
        left: 41%;
        top: 68%
    }

    .showkylechapman {
        left: 71%;
        top: 75%
    }
}

@media only screen and (max-width:880px) {
    div.branchinfoselect {
        display: block;
        background-color: #fff;
        color: #000;
        text-align: left;
        border-radius: 4px;
        padding: 1px;
        cursor: pointer;
        z-index: 1
    }

    #branchinfo img {
        display: none
    }
}

@media only screen and (min-width:400px) {
    .card {
        background-color: #002960;
        padding: 15px 0
    }

        .card p {
            margin-left: auto;
            margin-right: auto;
            width: 18em;
            text-align: center
        }

            .card p span {
                font-size: 1.5em;
                display: inline-block;
                text-align: center;
                color: #fff;
                line-height: 30px
            }

            .card p img {
                width: 150px;
                height: 150px;
                padding: 5px
            }
}

@media only screen and (min-width:500px) {
    .card {
        background-color: #002960;
        padding: 10px 0
    }

        .card p {
            margin-left: auto;
            margin-right: auto;
            width: 18em;
            text-align: center
        }

            .card p span {
                font-size: 1.5em;
                display: inline-block;
                text-align: center;
                color: #fff;
                line-height: 30px
            }

            .card p img {
                width: 200px;
                height: 200px;
                padding: 1px
            }
}

@media only screen and (max-width:600px) {
    div.branchinfoselect {
        display: block;
        background-color: #fff;
        color: #000;
        text-align: left;
        border-radius: 4px;
        padding: 1px;
        cursor: pointer;
        z-index: 1
    }

    .fancybox-wrap {
        width: 80% !important
    }
}

@media only screen and (min-width:600px) {
    .card {
        background-color: #002960;
        padding: 15px 0
    }

        .card p {
            margin-left: auto;
            margin-right: auto;
            width: 20em;
            text-align: center
        }

            .card p span {
                font-size: 1.5em;
                display: inline-block;
                text-align: center;
                color: #fff;
                line-height: 30px
            }

            .card p img {
                width: 200px;
                height: 200px;
                padding: 1px
            }

    .fancybox-wrap {
        width: 70% !important
    }
}

@media only screen and (min-width:768px) {
    .showbayarea, .showbaytown, .showbellaire, .showclay, .showcypresshill, .showdowntown, .showhumble, .showjimfonteno, .showjohnphelps, .showkylechapman, .showmickeyleland, .showpalmcenter, .showraulmartinez, .showscarsdale, .showspringbranch, .showtomball {
        width: 15%;
        font-size: 13px
    }

    .showtomball {
        left: 38%;
        top: 18%
    }

    .showcypresshill {
        left: 50%;
        top: 27%
    }

    .showhumble {
        left: 68%;
        top: 33%
    }

    .showmickeyleland {
        left: 56%;
        top: 48%
    }

    .showclay {
        left: 36%;
        top: 53%
    }

    .showspringbranch {
        left: 48%;
        top: 57%
    }

    .showjimfonteno {
        left: 75%;
        top: 55%
    }

    .showbaytown {
        left: 94%;
        top: 60%
    }

    .showdowntown {
        left: 61%;
        top: 62%
    }

    .showraulmartinez {
        left: 66%;
        top: 64%
    }

    .showpalmcenter {
        left: 63%;
        top: 70%
    }

    .showjohnphelps {
        left: 73%;
        top: 68%
    }

    .showscarsdale {
        left: 74%;
        top: 85%
    }

    .showbayarea {
        left: 82%;
        top: 88%
    }

    .showbellaire {
        left: 51%;
        top: 68%
    }

    .showkylechapman {
        left: 81%;
        top: 75%
    }

    .fancybox-wrap {
        width: 70% !important
    }
}

@media only screen and (min-width:850px) {
    .fancybox-wrap {
        width: 70% !important
    }
}

@media only screen and (min-width:900px) {
    .fancybox-wrap {
        width: 70% !important
    }

    .card {
        background-color: #002960;
        padding: 10px 0
    }

        .card p {
            margin-left: auto;
            margin-right: auto;
            width: 20em;
            text-align: center
        }

            .card p span {
                font-size: 1.5em;
                display: inline-block;
                text-align: center;
                color: #fff;
                line-height: 30px
            }

            .card p img {
                width: 150px;
                height: 150px;
                padding: 1px
            }
}

@media only screen and (min-width:992px) {
    .showbayarea, .showbaytown, .showbellaire, .showclay, .showcypresshill, .showdowntown, .showhumble, .showjimfonteno, .showjohnphelps, .showkylechapman, .showmickeyleland, .showpalmcenter, .showraulmartinez, .showscarsdale, .showspringbranch, .showtomball {
        width: 18%;
        font-size: 13px
    }

    .showtomball {
        left: 34%;
        top: 18%
    }

    .showcypresshill {
        left: 46%;
        top: 27%
    }

    .showhumble {
        left: 64%;
        top: 33%
    }

    .showmickeyleland {
        left: 52%;
        top: 48%
    }

    .showclay {
        left: 31%;
        top: 53%
    }

    .showspringbranch {
        left: 45%;
        top: 57%
    }

    .showjimfonteno {
        left: 71%;
        top: 55%
    }

    .showbaytown {
        left: 90%;
        top: 60%
    }

    .showdowntown {
        left: 57%;
        top: 62%
    }

    .showraulmartinez {
        left: 62%;
        top: 64%
    }

    .showpalmcenter {
        left: 59%;
        top: 70%
    }

    .showjohnphelps {
        left: 69%;
        top: 68%
    }

    .showscarsdale {
        left: 70%;
        top: 85%
    }

    .showbayarea {
        left: 78%;
        top: 89%
    }

    .showbellaire {
        left: 47%;
        top: 68%
    }

    .showkylechapman {
        left: 77%;
        top: 75%
    }

    .fancybox-wrap {
        width: 70% !important
    }

    .card {
        background-color: #002960;
        padding: 10px 0
    }

        .card p {
            margin-left: auto;
            margin-right: auto;
            width: 15em;
            text-align: center
        }

            .card p span {
                font-size: 1.1em;
                display: inline-block;
                text-align: center;
                color: #fff;
                line-height: 30px
            }

            .card p img {
                width: 150px;
                height: 150px;
                padding: 1px
            }
}

@media only screen and (min-width:1200px) {
    .showbaytown, .showclay, .showcypresshill, .showdowntown, .showhumble, .showjimfonteno, .showmickeyleland, .showraulmartinez, .showspringbranch, .showtomball {
        font-size: 13px;
        width: 18%
    }

    .showtomball {
        left: 36%;
        top: 18%
    }

    .showcypresshill {
        left: 45%;
        top: 27%
    }

    .showhumble {
        left: 55%;
        top: 33%
    }

    .showmickeyleland {
        left: 48%;
        top: 48%
    }

    .showclay {
        left: 35%;
        top: 53%
    }

    .showspringbranch {
        left: 42%;
        top: 58%
    }

    .showjimfonteno {
        left: 60%;
        top: 55%
    }

    .showbaytown {
        left: 70%;
        top: 60%
    }

    .showdowntown {
        left: 50%;
        top: 62%
    }

    .showraulmartinez {
        left: 55%;
        top: 65%
    }

    .showpalmcenter {
        width: 18%;
        left: 50%;
        top: 70%;
        font-size: 13px
    }

    .showjohnphelps, .showscarsdale {
        left: 57%;
        width: 18%;
        font-size: 13px
    }

    .showjohnphelps {
        top: 68%
    }

    .showscarsdale {
        top: 85%
    }

    .showbayarea {
        width: 18%;
        left: 64%;
        top: 88%;
        font-size: 13px
    }

    .showbellaire {
        width: 18%;
        left: 45%;
        top: 68%;
        font-size: 13px
    }

    .showkylechapman {
        width: 18%;
        left: 62%;
        top: 75%;
        font-size: 13px
    }

    .fancybox-wrap {
        width: 60% !important
    }

    .card p span {
        font-size: 1.4em;
        line-height: 33px
    }

    .card p {
        margin-left: auto;
        margin-right: auto;
        width: 18em;
        text-align: center
    }
}

@media only screen and (min-width:1250px) {
    .fancybox-wrap {
        width: 60% !important
    }

    .card p span {
        font-size: 1.4em;
        line-height: 33px
    }

    .card p {
        margin-left: auto;
        margin-right: auto;
        width: 18em;
        text-align: center
    }
}

@media only screen and (min-width:1300px) {
    .fancybox-wrap {
        width: 50% !important
    }

    .card p span {
        font-size: 1.5em;
        line-height: 34px
    }

    .card p {
        margin-left: auto;
        margin-right: auto;
        width: 18em;
        text-align: center
    }
}

@media only screen and (min-width:1350px) {
    .fancybox-wrap {
        width: 50% !important
    }

    .card p span {
        font-size: 1.5em;
        line-height: 34px
    }

    .card p {
        margin-left: auto;
        margin-right: auto;
        width: 20em;
        text-align: center
    }
}

@media only screen and (min-width:1400px) {
    .fancybox-wrap {
        width: 50% !important
    }

    .card p span {
        font-size: 1.6em;
        line-height: 34px
    }

    .card p {
        margin-left: auto;
        margin-right: auto;
        width: 20em;
        text-align: center
    }
}

@media only screen and (min-width:1450px) {
    .fancybox-wrap {
        width: 50% !important
    }

    .card p span {
        font-size: 1.6em;
        line-height: 34px
    }

    .card p {
        margin-left: auto;
        margin-right: auto;
        width: 20em;
        text-align: center
    }
}

@media only screen and (min-width:1500px) {
    .fancybox-wrap {
        width: 50% !important
    }

    .card p span {
        font-size: 1.7em;
        line-height: 35px
    }

    .card p {
        margin-left: auto;
        margin-right: auto;
        width: 20em;
        text-align: center
    }
}

@media only screen and (min-width:1550px) {
    .fancybox-wrap {
        width: 35% !important
    }

    .card p span {
        font-size: 1.7em;
        line-height: 35px
    }

    .card p {
        margin-left: auto;
        margin-right: auto;
        width: 20em;
        text-align: center
    }
}

@media only screen and (min-width:1600px) {
    .fancybox-wrap {
        width: 35% !important
    }

    .card p span {
        font-size: 1.7em;
        line-height: 35px
    }

    .card p {
        margin-left: auto;
        margin-right: auto;
        width: 20em;
        text-align: center
    }
}

@media only screen and (min-width:1650px) {
    .card p span {
        font-size: 1.7em;
        line-height: 35px
    }

    .card p {
        margin-left: auto;
        margin-right: auto;
        width: 20em;
        text-align: center
    }
}

@media only screen and (min-width:1700px) {
    .card p span {
        font-size: 1.7em;
        line-height: 35px
    }

    .card p {
        margin-left: auto;
        margin-right: auto;
        width: 20em;
        text-align: center
    }
}

@media only screen and (min-width:1750px) {
    .fancybox-wrap {
        width: 35% !important
    }

    .card p span {
        font-size: 1.7em;
        line-height: 35px
    }

    .card p {
        margin-left: auto;
        margin-right: auto;
        width: 20em;
        text-align: center
    }
}