* {
    padding:0;
    margin:0;
    font-family: trebuchet ms; arial; calibri; gill sans; helvetica neue; candara; geneva; verdana; sans-serif;
    background-color: black;
}

a {
    text-decoration: none;
}
.centered {
    text-align: center;
}
#poltics {
    height: auto;
    width: 100%;

}
.nav-grid img {
    height: 100%;
    width: 100%;
}

.grid {
    height: 95vh;
    width: 100vw;
    display: grid;
    grid-template-columns: 1fr 60% 1fr;
    grid-template-rows: 5% 15% 60% 20%;
    grid-column-gap: 0px;
    grid-row-gap: 0px;
}

.top-row { 
    grid-area: 1 / 1 / 2 / 4; 
    display: flex;
    flex-direction:column;
    justify-content:center;
    align-items: center;
}
.nav-row { 
    grid-area: 2 / 1 / 3 / 4; 
}
.content-row {
    grid-area: 3 / 1 / 4 / 4; 
}
.latest-row { 
    grid-area: 4 / 1 / 5 / 4; 
}
.nav-grid { 
    grid-area: 2 / 2 / 3 / 3;  
    display: flex;
    flex-direction: row;
    display: grid;
    grid-template-columns: minmax(0%,10%) repeat(5, 1fr) minmax(0%,10%);
    grid-column-gap: 0px;
    grid-row-gap: 0px; 
    justify-items: center;
    text-align: center;
    color: red;
}
    .nav-left { 
        grid-area: 1 / 1 / 2 / 2;
    } 
    .nav-right { 
        grid-area: 1 / 7 / 2 / 8;
    }
    .nav-home { 
        grid-area: 1 / 2 / 2 / 3;
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 80% 20%;
        grid-column-gap: 0px;
        grid-row-gap: 0px; 
        flex-direction: column;
    }
    .nav-blessfrey { 
        grid-area: 1 / 3 / 2 / 4;
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 80% 20%;
        grid-column-gap: 0px;
        grid-row-gap: 0px; 
        flex-direction: column;
    }
    .nav-lemonland { grid-area: 1 / 4 / 2 / 5;
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 80% 20%;
        grid-column-gap: 0px;
        grid-row-gap: 0px; 
        flex-direction: column;
    }
    .nav-diary { grid-area: 1 / 5 / 2 / 6;
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 80% 20%;
        grid-column-gap: 0px;
        grid-row-gap: 0px; 
        flex-direction: column;
    }
    .nav-about { grid-area: 1 / 6 / 2/ 7;
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 80% 20%;
        grid-column-gap: 0px;
        grid-row-gap: 0px; 
        flex-direction: column;
    }
    .navlink {
        font-size: 110%;
        font-weight: bold;
    }
    .navlink a:link {
        color: #E6E8EF;
    }
    .navlink a:visited {
        color: #E6E8EF;
    }
    .navlink a:hover {
        color: #f463ad;
    }
    .navlink a:active {
        color: #f463ad;
    }

.content-grid { 
    grid-area: 3 / 2 / 4 / 3;
    display: grid;
    grid-template-columns: 25% 75%;
    grid-template-rows: auto;
    grid-column-gap: 0px;
    grid-row-gap: 0px; 
}
    .content-left {
        grid-area: 1 / 1 / 2 / 2;
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: repeat(3, 1fr);
        grid-column-gap: 0px;
        grid-row-gap: 0px; 
    }
        .contentlogo { 
            grid-area: 2 / 1 / 3 / 2; 
            background-image: url(../img/prom/BlessFREY_logo.png);
            background-size: 100%;
            background-repeat: no-repeat;
            background-position: center;
        }
    .content-right { 
        grid-area: 1 / 2 / 2 / 3;
        background-image: url(../img/prom/runebless.png);
        background-size: 80% auto;
        background-repeat: no-repeat;
        background-position: center;
    }
        /*display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(2, 1fr);
        grid-column-gap: 0px;
        grid-row-gap: 0px; 
    } 
        .weaponmaster { 
            grid-area: 1 / 1 / 2 / 2; 
            background-color: red;
            background-image: url(../img/prom/w_thumb.png);
        }
        .tamer { 
            grid-area: 1 / 2 / 2 / 3; 
            background-color: yellow;
            background-image: url(../img/prom/t_thumb.png);
        }
        .disciple { 
            grid-area: 1 / 3 / 2 / 4; 
            background-color: orange;
            background-image: url(../img/prom/d_thumb.png);
        }
        .streetfighter { 
            grid-area: 2 / 1 / 3 / 2; 
            background-color: green;
            background-image: url(../img/prom/s_thumb.png);
        }
        .hacker { 
            grid-area: 2 / 2 / 3 / 3; 
            background-color: blue;
            background-image: url(../img/prom/h_thumb.png);
        }
        .chemist { 
            grid-area: 2 / 3 / 3 / 4; 
            background-color: purple;
            background-image: url(../img/prom/c_thumb.png);
        } */
.latest {
    background-color: #bd97a4; 
    color: black;
}
.latest-grid { 
    width: 50%;
    background-color: #bd97a4; 
    grid-area: 4 / 2 / 5 / 3; 
    overflow-y: scroll; 
    margin-right: 0px;
    margin-left: 5%;
    margin-top: 3%;
    margin-bottom: 0px; 
    padding-top: 4%;
    padding-right: 1%;
    padding-bottom: 1%;
    padding-left: 2%;
} 
    .latest-grid a:link {
        color: black;
    background-color: #bd97a4; 
    }
    .latest-grid a:visited {
        color: black;
    background-color: #bd97a4; 
    }
    .latest-grid a:hover {
        color: #F9B3D7;
    background-color: #bd97a4; 
    }
    .latest-grid a:active {
        color: #f463ad;
    background-color: #bd97a4; 
    }
    .latest-grid ul {
        background-color: #bd97a4; 
        list-style-type: none;
    }
    .latest-grid li {
        background-color: #bd97a4; 
        padding-left: 5%;
    }
    .latest-grid b {
        background-color: #bd97a4; 
    }
.footer-content {
    color: white;
    padding-top: 5px;
    text-align: right;
    overflow: hidden;
    box-shadow: 0 100vh 0 100vh black;  
}