/* CSS - Cascading Style Sheet */
/* Palette color codes */
/* Palette URL: http://paletton.com/#uid=15u0u0kvOmWtVsvuFpfz-kMD7iu */

/* Feel free to copy&paste color codes to your application */


/* As hex codes */

.red-primary {
    color: #A90125
}
/* Main Primary color */
.red-primary-bright {
    color: #D20E38
}

.red-primary-brighter {
    color: #BA082E
}

.red-primary-darker {
    color: #990021
}

.red-primary-dark {
    color: #88001D
}

/* As hex codes */

.gray-primary {
    color: #858585
}
/* Main Primary color */
.gray-primary-bright {
    color: #B2B2B2
}

.gray-primary-brighter {
    color: #9B9B9B
}

.gray-primary-darker {
    color: #6D6D6D
}

.gray-primary-dark {
    color: #535353
}



/* Generated by Paletton.com © 2002-2014 */
/* http://paletton.com */

body {
    background-color: whitesmoke
}

.navimage {
    width: 72px;
    height: 72px;
}



.sidenav {
    height: 500px;
    width: auto;
    padding: 10px;
    position: fixed;
    z-index: 1;
    top: 20px;
    left: 20px;
    background: rgba(0, 0, 0, 0.41);
    /*border-width: 1px;*/
    /*border-color: whitesmoke;*/
    /*border-style: solid;*/
    box-shadow: 0 0 20px rgba(0, 0, 0, .5);
}

a.sidenav-header {
    font-size: x-large;
    color: whitesmoke;
    text-decoration: none;
}

.sidenav-item {
    color: transparent;
    display: block;
    padding: 1rem
}

.topnav {
    width: 1000px;
    height: auto;
    border-bottom-width: 2px;
    border-bottom-color: #A90125;
    /*display: -ms-flexbox;*/
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    /*justify-content: center;*/
}

.topnav-title, .topnav-title:hover {
    font-size: x-large;
    color: black;
    text-decoration: none;
    width: 200px;
    text-wrap: normal;
    float: left;
}

.topnav-image {
    width: 84px;
    height: 84px;
    margin: 5px;
}

.topnav-item, .topnav-item:hover {
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    /*float: right;
    justify-self: end;*/
    font-size: large;
    color: black;
    text-decoration: none;
}

.verticalLine {
    width: 1px;
    background-color: black;
    height: 100%;
    float: left;
    margin-left: 5px;
    margin-right: 5px;
}

.socialMedia {
    display: flex;
    text-align: center;
    margin: 5px;
    color: black;
    text-decoration: none;
    opacity: 1.0;
}


    .socialMedia:hover {
        opacity: 0.75;
    }

.galleryItem {
    text-decoration: none;
    color: black;
    align-content: center;
    padding: 10px;
    text-align:center;
}

    .galleryItem:hover {
        box-shadow: 0 5px 10px rgba(0, 0, 0, .5);
        text-decoration: none;
        color: black;
    }

.placeholder200 {
    width: 100%;
    height: 200px;
    background-color: gray;
}