/* ===WEBSITE COLORS=== */
/*
#687A7F     #76A6BF
#99E2FF     #4F6F7F
#D0F4FF     #9EDEFF
#42717F     #273740
#A7C3CC     #8EC7E5
*/

/* ===WEBSITE FONTS=== */
/*
Header:
font-family: 'Cinzel Decorative', cursive;
Main Text:
font-family: 'Forum', cursive;
H1
font-family: 'Merienda', cursive;
H2
font-family: 'Mirza', cursive;
*/

/* ===GLOBAL STYLES=== */
html {
    background-color: white;
    background-image: url(../images/fresno_BG.JPG);
}

body {
    width: 90%;
    margin: auto;
    font-size: 100%;
    background-color: white;
}

header {
    height: 5em;
    background-color: #42717F;
    background-image: url(../images/header_BG.png);
    background-size: cover;
}

header h1 {
    font-family: 'Cinzel Decorative', cursive;
    font-size: 2em;
    padding-left: 2%;
    float: left;
    padding-top: 1.2em;
    font-weight: bold;
    text-shadow: 1px 1px 1px white;
}

header h2 {
    font-family: 'Cinzel Decorative', cursive;
    float: left;
    font-size: 1.3em;
    padding-top: 1.3em;
    padding-left: 10px;
    font-weight: bold;
    text-shadow: 1px 1px 1px white;
}

nav {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e1ffff+0,e1ffff+7,e1ffff+12,fdffff+12,e6f8fd+30,c8eefb+54,bee4f8+75,b1d8f5+100;Blue+Pipe+%232 */
    background: rgb(225,255,255); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(225,255,255,1) 0%, rgba(225,255,255,1) 7%, rgba(225,255,255,1) 12%, rgba(253,255,255,1) 12%, rgba(230,248,253,1) 30%, rgba(200,238,251,1) 54%, rgba(190,228,248,1) 75%, rgba(177,216,245,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(225,255,255,1) 0%,rgba(225,255,255,1) 7%,rgba(225,255,255,1) 12%,rgba(253,255,255,1) 12%,rgba(230,248,253,1) 30%,rgba(200,238,251,1) 54%,rgba(190,228,248,1) 75%,rgba(177,216,245,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(225,255,255,1) 0%,rgba(225,255,255,1) 7%,rgba(225,255,255,1) 12%,rgba(253,255,255,1) 12%,rgba(230,248,253,1) 30%,rgba(200,238,251,1) 54%,rgba(190,228,248,1) 75%,rgba(177,216,245,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e1ffff', endColorstr='#b1d8f5',GradientType=0 ); /* IE6-9 */
}

nav ul li {
    display: inline;
}

#banner {
    background-color: #42717F;
    height: 100%;
}

.bannerWrapper {
    padding: 2% 0px;
}

.bannerBox {
    background-color: white;
    margin: auto;
    border-radius: 20px;
    margin-bottom: 2%;
    padding-bottom: 10px;
}

.bannerBox h1 {
    font-size: 1.2em;
    text-align: center;
    padding: 5px 0px;
}

.botLink {
    margin-top: 10px;
    margin-bottom: 10px;
}

.bannerBox hr {
    width: 50%;
}

.bannerBox img {
    display: block;
    margin: auto;
    padding: 10px 0px;
}

h1 {
    font-family: 'Merienda', cursive;
    font-size: 2.0em;
    text-align: center;
}

h2 {
    font-family: 'Mirza', cursive;
    font-size: 1.4em;
    text-align: center;
}

p {
    font-family: 'Forum', cursive;
}

.clearFix:after {
    content: "";
    display: block;
    clear: both;
}

.globalLinkCenter {
    display: block;
    text-align: center;
}

.globalCenter {
    display: block;
    margin: auto;
}

#twoCol {
}

#twoCol section {
    padding: 2%;
}

#twoCol section h1 {
    padding: 2% 0%;
}

#oneCol section {
    padding: 2%;
}

#oneCol section h1 {
    padding: 2% 0%;
}

#twoCol section p {
    line-height: 1.5em;
    font-size: 1.1em;
}

#oneCol section p {
    line-height: 1.5em;
    font-size: 1.1em;
}

.specialists {
    width: 60%;
    height: 100%;
    line-height: 1.5em;
    background-color: #A7C3CC;
    padding: 10px;
    border-radius: 10px;
    margin-bottom: 10%;
}

.specialists p {
    font-family: cursive;
    font-size: 1em;
    padding-top: 7px;
    text-align: center;
    font-style: italic;
}

aside a {
    display: block;
    text-align: center;
    line-height: 1.5em;
}

.specialists h2{
    font-size: 1.2em;
    text-align: center;
    text-decoration: underline;
}

#twoCol blockquote {
            text-align: center;
            font-family: font-family: 'Cinzel Decorative', cursive;
            font-weight: bold;
            font-size: 2em;
            font-style: italic;
            letter-spacing: 3px;
            color: gray;
            text-shadow: 1px 1px 1px skyblue;
            padding: 2% 0%;
}

footer {
    background-color: #76A6BF;
    height: 100%;
}

footer p {
    text-align: center;
    padding: 1em 0em;
    line-height: 1.5em;
}

.lisaPic {
    width: 100%;
}

/* Prevents slides from flashing */
    #slides {
      display:none;
    }
    
            .text {
            	text-align: right;
            	font-size: 3em;
            	width: 300px;
            	height: 100%;
            }

/* ===MEDIA BREAKS=== */

/* Desktops and laptops ----------- */
@media only screen  and (min-width : 1025px) {
    body {
        width: 90%;
        max-width: 1000px;
        margin: auto;
    }
    nav {
        height: 2em;
        line-height: 2em;
    }
        nav ul li {
            padding-left: 2%;
            font-size: 1.2em;
        }
            .bannerBox {
            width: 20%;
            margin: 2%;
            float: left;
        }
        .bannerWrapper {
            width: auto;
            margin: auto;
        }
        #twoCol section {
            float: left;
            width: 58%;
        }
        #twoCol aside {
            float: left;
            width: 38%;
        }
    .specialists {
        margin: auto;
        margin-top: 4%;
    }
    .mainText {
        margin: 0% 10%;
    }
}

/*Tablets ----------------*/
@media only screen and 
    (min-width : 768px) and (max-width : 1024px) {
        body {
        }
        nav {
        height: 2em;
        line-height: 2em;
    }
        nav ul li {
            padding-left: 2%;
            font-size: 1.2em;
        }
        .bannerBox {
            width: 28%;
            margin: 2%;
            float: left;
        }
        .bannerWrapper {
            width: auto;
            margin: auto;
        }
        #twoCol section {
            float: left;
            width: 58%;
        }
        #twoCol aside {
            float: left;
            width: 38%;
        }
        .specialists {
        margin: auto;
        margin-top: 4%;
        }
        .mainText {
        margin: 0% 10%;
        }
}

/* Smartphones (portrait and landscape) ----------- */
@media only screen and 
    (min-width : 320px) and (max-width : 767px) {
        body {
            min-width: 320px;
        }
        nav {
            height: 3em;
            line-height: 3em;
        }
        nav ul li {
            padding-left: 2%;
            font-size: 1em;
            overflow: visible;
            font-weight: bold;
        }
        .bannerBox {
            display: none;
        }
        #banner {
            display: none;
        }
        #twoCol {
            padding: 2%;
        }
        
        #twoCol h1 {
            padding-bottom: 10px;
        }
        
        #twoCol hr {
            width: 50%;
            box-shadow: 2px 2px 5px black;
        }
        
        #twoCol p {
            line-height: 1.5em;
            padding-bottom: 1em;
        }

        #twoCol section {

        }

        #twoCol aside {
            text-align: center;
            margin: auto;
            width: 40%;
        }
        .mainText {
        margin: 0% 5%;
        }
}