body {
        margin: 0;
        font-family: athelas regular;
        font-size: 200%
}

    .topnav {
        overflow: hidden;
        background-color: rgb(65,57,61);
        }

    .topnav a {
        float: right;
        color: white;
        text-align: center;
        padding: 10px 50px;
        text-decoration: none;
        font-size: 15px;
        }

    .topnav a:hover {
        background-color: rgb(138,140,143);
        color: white;
        }

    .topnav a.active {
        background-color: rgb(190,30,45);
        color: white;
        }
        
    .topnav {box-sizing: border-box;}
    body {font-family: Majesti Banner;}
    .mySlides {display: none;}
    img {vertical-align: middle;}

    /* slideshow container */
    .slideshow-container {
        max-width: none;
        padding-left: 30px;
        padding-right: 30px;
        padding-top: 15px;
        position: relative;
        margin: auto;
    }

    /* dots/bullets/indicators */
    .dot {
        height: 15px;
        width: 15px;
        margin: 0 2px;
        background-color: rgb(138,140,143);
        border-radius: 50%;
        display: inline-block;
        transition: background-color 0.6s ease;
    }

    .active {
        background-color: rgb(65,57,61);
    }

    /* fading animation */
    .fade {
        -webkit-animation-name: fade;
        -webkit-animation-duration: .5s;
        animation-name: fade;
        animation-duration: .5s;
    }

    @-webkit-keyframes fade {
        from {opacity: .4} 
        to {opacity: 1}
    }

    @keyframes fade {
        from {opacity: .4} 
        to {opacity: 1}
    }
     #link-container {
    position: static;
    bottom: 0;
    width: 100%;
    text-align: center;
}
    #link{
        color: white;
}
    /* for smaller sizes, lower text size */
    @media only screen and (max-width: 300px) {
        .text {font-size: 11px}
    }