@charset "UTF-8";
/* CSS Document */


html, body{
    padding:0;
    margin:0;
}
.padtop
{
    margin-top:10vh;
    padding-top:10vh;
}

body {
    font-family: 'Nunito', sans-serif;
    padding: 0px;
    margin: 0px;
}

p {
    font-size: 18px;
    padding: 12px;
    margin-top: 10%;
    padding: 5%;
}

a {
    font-style: bold;
    color: white;
    text-decoration: none;
}

.fixedbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    width: 100%;
    height: 10vh;
    background-color: #FFFFFFDD;

}

.logo {
    float: left;
    display: block;
    margin-left: 5%;
    width:10vh;
}


.topnav {
    display: block;
    font-family: 'Nunito', sans-serif;
    padding-right: 2%;
}

.topnav li {
    float: right;
    padding-top:1vh;
    margin-top:none;
    font-size: 115%;
    display: inline;
}

.topnav ul li {
    display: inline-block;
    margin-right: 20%;
    margin-top: 3%;
    width: 100%;
}

.topnav ul li a {
    content: '';
    position: absolute;
    left: 50%;
    transform: translate(-50%);
}


.sliding {
    font-family: 'Nunito', sans-serif;
    text-decoration: none;
    display: inline-block;
    color: black;
    margin-left: 2%;
    font-size: 100%;
    font-style: bold;
    margin-left: auto;
    margin-right: auto;
}

.sliding:after {
    content: '';
    display: block;
    height: 2px;
    width: 0;
    background: transparent;
    transition: width .3s ease, background-color .3s ease;
    -webkit-transition: width .3s ease, background-color .3s ease;
    -moz-transition: width .3s ease, background-color .3s ease;
    margin: auto;
}

/* Change the width and background on hover, aka sliding from the middle to the left and right */

.sliding:hover:after {
    width: 90%;
    background: black;
}

.dropbtn {
    color: black;
    top:0;
    font-size: 40px;
    border: none;
    cursor: pointer;
    font-style: bold;

}

/* The container <div> - needed to position the dropdown content */

.dropdown {
    font-family: 'Nunito', sans-serif;
    position: sticky;
    display: none;
    float: right;
    margin-right: 4%;
    width: 100px;
}

/* Dropdown Content (Hidden by Default) */

.dropdown-content {
    display: none;
    padding-top: 80%;
    background: none;
    width: 100px;

}

/* Links inside the dropdown */

.dropdown-content a {
    color: black;
    padding: 12px 10px;
    text-decoration: none;
    display: block;
    text-align: center;
    font-size: 115%;
    background-color: #FFFFFFEE;

}

/* Change color of dropdown links on hover */

.dropdown-content a:hover {

    background-color: #FFFFFFDD;

}

/* Show the dropdown menu on hover */

.dropdown:hover .dropdown-content {
    display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */

.dropdown .dropbtn {
    -webkit-transform: rotate(0deg);
    transition: transform .2s ease;
    background: none;
    float: right;
}

.dropdown:hover .dropbtn {
    background: none;
    float: right;
    display: block;

    -webkit-transform: rotate(90deg);
    transition: transform .2s ease;
}

.dropdown:hover:after .dropbtn {
    background: none;
    display: block;
    position: absolute;
}



.daily1 {
    margin-left:5%;
    overflow: hidden;
    height: 50vh;
    margin-bottom: 10vh;

}

.daily1 img {
    width: 35%;
    float: left;
}

.daily1 p {
    font-family: 'Nunito', sans-serif;
    align-content: right;
    text-align: left;
    margin: 4%;
    margin-left: 38%;
}

.daily1 h2 {
    font-family: 'Playfair Display', serif;
    text-align: center;
    margin-left: 20%;
    font-size: 200%;
    color: #134074;


}

.daily2 {
    margin-right:5%;
    overflow: hidden;
    height: 50vh;
    margin-bottom: 10vh;

}

.daily2 img {
    width: 35%;
    float: right;

}

.daily2 p {
    font-family: 'Nunito', sans-serif;
    align-content: left;
    text-align: left;
    margin: 4%;
    margin-right: 38%;
}

.daily2 h2 {
    font-family: 'Playfair Display', serif;
    text-align: center;
    margin-right: 20%;
    padding-bottom: 0%;
    font-size: 200%;
    color: #134074;
}

.daily1 a {
    color: #134074;
    text-decoration: underline;    
}

.daily2 a {
    color: #134074;
    text-decoration: underline;
}

.daily1 a:hover {
    color: #f05423;
}
.daily2 a:hover {
    color: #f05423;
}


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

    .logo {
        width: 10vh
    }

    .dropdown {
        display: block;
    }

    .topnav {
        display: none;
    }

    .daily1 {
        height: 41vh;
        margin-bottom: 1vh;
    }

    .daily2 {
        height: 41vh;
        margin-bottom: 1vh;
    }

    .daily1 p {
        font-size: 100%
    }

    .daily1 h2 {
        font-size: 150%
    }

    .daily2 p {
        font-size: 100%
    }

    .daily2 h2 {
        font-size: 150%
    }

    .bottomlink {
        font-size: 70%
    }

    .footer {
        font-size: 70%
    }

    .icon {
        font-size: 180%
    }

    .daily1 {
        border-width: 3px
    }

    .daily2 {
        border-width: 3px
    }
}

@media only screen and (max-width: 600px) {
    
    .logo {
        width: 10vh;
    }

    .fixedbar {
        height: 10vh;
    }

    .dropdown {
        display: block;
    }

    .topnav {
        display: none;
    }

    .daily1 {
        height: 35vh;
        margin-top:1vh;
        margin-bottom: 0;
        border-width: 2px;
        
    }
    
   

    .daily2 {
        height: 35vh;
        margin-bottom: 0;
        border-width: 2px;
    }

    .daily1 p {
        margin-top:0;
        font-size: 90%;
    }

    .daily1 h2 {
        font-size: 100%;
        margin-bottom: 0;
            
    }

    .daily2 p {
        margin-top:0;
        font-size: 90%
    }

    .daily2 h2 {
        font-size: 100%;
        margin-bottom: 0;
            
    }

    .bottomlink {
        font-size: 60%
    }

    .icon {
        font-size: 160%
    }

}








.jssorl-009-spin img {
    animation-name: jssorl-009-spin;
    animation-duration: 1.6s;
    animation-iteration-count: infinite;
    animation-timing-function: linear
}

@keyframes jssorl-009-spin {
    from {
        transform: rotate(0);
    }

    to {
        transform: rotate(360deg);
    }
}

.jssorb031 {
    position: absolute
}

.jssorb031 .i {
    position: absolute;
    cursor: pointer
}

.jssorb031 .i .b {
    fill: #000;
    fill-opacity: .5;
    stroke: #fff;
    stroke-width: 1200;
    stroke-miterlimit: 10;
    stroke-opacity: .3
}

.jssorb031 .i:hover .b {
    fill: #fff;
    fill-opacity: .7;
    stroke: #000;
    stroke-opacity: .5
}

.jssorb031 .iav .b {
    fill: #fff;
    stroke: #000;
    fill-opacity: 1
}

.jssorb031 .i.idn {
    opacity: .3
}

.jssora051 {
    display: block;
    position: absolute;
    cursor: pointer
}

.jssora051 .a {
    fill: none;
    stroke: #fff;
    stroke-width: 360;
    stroke-miterlimit: 10
}

.jssora051:hover {
    opacity: .8
}

.jssora051.jssora051dn {
    opacity: .5
}

.jssora051.jssora051ds {
    opacity: .3;
    pointer-events: none
}