﻿@import url('https://fonts.googleapis.com/css2?family=Unbounded:wght@200;300;400;500;600;700;800;900&display=swap');

@font-face {
  font-family: 'MyFont';
    src: url(../DancingScript-VariableFont_wght.ttf);
}

body {
    background-position: center top;
    background-repeat: no-repeat;
    background-color: white;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 14px;
    color: black;
    margin: 0px;
}

#wrapper {
    background-image:url("../images/lake.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding: 2.5rem;
    padding-top: 0rem;
}

#contentWrapper {
    max-width: 1350px!important;
    padding-right: 1.2rem;
    padding-bottom: 1.2rem;
    padding-left: 1.2rem;
    border-radius: 3px;
    min-height: 620px;
    margin: auto;
    font-family: 'Tangerine', serif;

    background: -moz-linear-gradient(top,  rgba(76,150,113,1) 0%, rgba(76,150,113,0) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(76,150,113,1) 0%,rgba(76,150,113,0) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(76,150,113,1) 0%,rgba(76,150,113,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c9671', endColorstr='#004c9671',GradientType=0 ); /* IE6-9 */

    border: solid #4c9671 1px;    
}

#contentWrapper li{
    font-family: 'GreatVibes', serif;
    color: yellow;
}

#content {
    background-color: white;
    border: 1px;
    border-color: black;
    border-radius: 3px;
    min-height: 620px;
    padding: 20px;
    border: solid #4c9671 2px;
}

#header {
    max-width: 1350px;
    margin: auto;
}

#countyLogo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 1rem 0rem;
}

#header a {
    font-size: 50px;
    width: 65%;
    text-align: center;
    margin: auto;
    padding: 50px 0;
    text-decoration: none;
    color: black;
    font-weight: 500;
}

#navBar {
    list-style: none;
    margin: auto;
}

#PageTitleContainer {
    padding: 15px;
    font-size: 30px;
    font-family: 'Roboto Condensed', sans-serif;
}

#navBar ul {
    list-style: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    padding: 0rem;
    margin-top: 10px;
    margin-bottom: 10px;
}

#navBar li {
    font-size: 2rem;
    text-decoration: none;
    cursor: pointer !important;;
}

#navBar a {
    text-decoration: none;
    color: white;
    
    font-family: Roboto, sans-serif;
    -webkit-transition: 1s ease all;
    -webkit-transition: .5s ease all;
    transition: .5s ease all;
}

#navBar a:hover {
    text-decoration: none;
    opacity: .75;
}

#rotateBox {
    position: fixed;
}

#rotateImgHolder
{
    width: 210px;
    height: 135px;
    border: #FFFFFF solid;
    float: left;
    margin-top: 15px;
    margin-right: 20px;
    margin-left: 30px;
}


#footer
{
    padding: 10px;
    background-color: Transparent;
    height: 30px;
    text-align: center;
    color: white;
}

#ModalContainer
{
    display: none;
}

/* Secondary Page Specific Elements & Classes */

.blueblocksec
{
    padding: 15px 20px 15px 20px;
    width: 904px;
    height: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: -15px;
    background: rgba(103,156,150,0.8);
    overflow: hidden;
    -webkit-box-shadow: 5px 5px 20px #313131;
    box-shadow: 5px 5px 20px #313131;
}

.content {
    width: auto;
    height: auto;
    display: block;
    color: #000000;
}

#pageTitleContainer
{
    font-size: 36px;
    line-height: 43px;
    padding: 15px  15px;
    font-family: Roboto, sans-serif;
    font-weight:300;
    text-align: center;
    color:#464A5E;
}

table 
{ 
    width:75%;
}

th
{
    text-align:left;
    padding-left:2px;
    font-size:15px;
}
td
{
    font-size:14px;
}

a
{
    color: #DCDCDC;
}

.insideblock a
{
    font-size: 14px;
    font-family: Roboto;
    font-weight: bold;
    color: #DCDCDC;
}

.insideblockTax a
{
    font-size: 14px;
    font-family: Roboto;
    font-weight: bold;
}

a:hover
{
    text-decoration: underline;
}

TD
{
    vertical-align: top;
}


.pageContent
{
    padding-left: 15px;
    padding-right: 15px;
    font-family: Roboto, sans-serif;
    font-size: 14px;
    color: #ffffff;
}

.news p
{
    vertical-align: top;
    text-align: left;
    font-family: Roboto, sans-serif;
    font-size: 14px;
    margin-right: 15px;
}

.navtabs
{
    float: right;
    margin-top: 0px;
    border-top: 0px;
    padding-top: 1px;
}

.navtabs li
{
    font-family: Roboto, sans-serif;
    font-size: 12pt;
    text-align: center;
    margin-top: 8px;
    margin-left: 0px;
}

.searchbutton
{
    margin-top: 190px;
}

img.displayed
{
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 0px;
}

/*  Styles that override Bootstrap settings */

ul.unbullet
{
    list-style-type: none;
/*    padding-bottom: 15px;*/
}

img{
    max-width: 100%;
}

.insideblockTax li
{
    color:Black;
}
h3
{
    font-size: 20px;
/*
    line-height: 25px;
    padding-bottom: 5px;
    padding-left: 10px;
    padding-right: 10px;
*/
    font-family: Roboto, sans-serif;
    text-align: center;
    color:#464A5E;
    padding: 10px;
    margin: 0px;

}

h4
{
    font-size: 17px;
    line-height: 14px;
    padding-left: 10px;
    padding-top: 15px;
    padding-bottom: 5px;
    font-family: Roboto, sans-serif;
    color:#CDCED6;
}

/* Editor Styles */
h4.mainhead
{
    font-size: 20px;
    line-height: 23px;
    padding-left: 10px;
    padding-top: 20px;
    padding-bottom: 5px;
    font-family: Roboto, sans-serif;
    font-weight:300;
    color:#ABAEBA;
}

h6.subhead
{
    font-size: 17px;
    font-family: Roboto, Sans-Serif;
    font-weight: 300;
    line-height: 20px; 
    padding: 10px 0px 10px 12px;
    color:#CDCED6;
}

.larger
{
    font-size: 16px;
}
.smaller
{
    font-size: 12px;
}


/* GridView Styles */
.gvHdr
{
    background: #575D76;
    color: #FFFFFF;
}
.gvRow
{
    background: #ffffff;
    color: #000203;
}
.gvAltRow
{
    background: #8E8D9F;
    color: #000203;
}
.gvRow:hover, .gvAltRow:hover
{
    background: #adabb8;
}

#searchTips h4 {
    color: black;
}

.modal-content li {
    color: black;
}
.modal-content h4 {
    color: black;
}

@media print
{
    #header, #footer
    {
        display: none;
    }
}



@media screen and (max-width: 940px) {

    #navBar li {
        font-size: 1.5rem;

    }

    #navBar {
        height: 3rem;
        padding-bottom: 10px;
    }
    
    #wrapper {

    padding: 1rem;

}
    
        #content {

    padding: 0px;
}
        
}



@media screen and (max-width: 767px) {
    body {
        min-height: 700px;
        background: none;
        -webkit-text-size-adjust: none;
        padding: 0;
        text-align: left;
        direction: ltr;
        margin: 0;
        color: black;
    }
    
    #viewport {
        overflow: hidden;
        position: relative;
        width: 100%;
    }
    
    #mobileMenu {
        width: 190px;
        background: rgba(76,150,113,1);
        min-height: 100%;
        position: absolute;
        overflow: hidden;
        left: -190px;
    }
    
    #mobileMenu > ul {
        padding: 0px;
        margin: 0px;
    }
    
    #mobileMenu > ul > li {
        list-style: none;
    }
    
    #mobileMenu ul li > a {
        list-style: none;
        display: block;
        padding: 0 10px 0 5px;
        line-height: 30px;
        color: white;
        text-decoration: none;
        border-bottom: solid #E1E8EF 1px;
    }
    
    #headerMenu {
        color: White;
        vertical-align: top;
        background-color: rgba(76,150,113,1); /* header bg color */
    }
    
    #btnToggleMenu {
        margin: 10px;
    }
    
    #contentWrap {
        position: relative;
        height: 100%;
        min-height: 700px;
        -webkit-box-shadow: -6px 0px 8px rgba(48, 50, 50, 0.5);
        box-shadow: -6px 0px 8px rgba(48, 50, 50, 0.5);
        -webkit-overflow-scrolling: touch;
    }
    
    #contentWrap.menuVisible, #mobileMenu.menuVisible {
        -webkit-transform: translateX(190px);
        transform: translateX(190px);
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
    }

    .mobileTitle {
        padding: 15px;
        font-size: 25px;
        font-family: 'Roboto Condensed', sans-serif;
    }

    #content {
        color: black;
        background: white;
        padding: 1rem;
        border-radius: 0;
    }
}