@media only screen and (max-width: 1000px) {
    .Games-main img, .Novels-main img, .logo {
        float: none !important;
        width: 20em !important;
        padding: 2em 29% !important;
    }

    .GamesCont, .NovelsCont, .home-text, .mail, .whatsapp, .right, .left, .center {
        float: none !important;
        width: 90% !important;
        padding: 2em !important;
    }

    .nav-urls a {
        padding: 0.8em 11%!important;
    }
}

@media only screen and (max-width: 600px) {
    .Games-main img, .Novels-main img, .logo {
        float: none !important;
        width: 10em !important;
        padding: 2em 36% !important;
    }

    .GamesCont, .NovelsCont, .home-text, .mail, .whatsapp {
        float: none !important;
        width: 90% !important;
        padding: 2em !important;
    }

    .nav-urls a {
        padding: 0.8em 9% !important;
    }
}

/* Keyframes Animations */
@keyframes navbar-open {
    from { height: 4.4em; }
    to { height: 8.8em; }
}

@keyframes navbar-close {
    from { height: 8.8em;  } 
    to { height: 4.4em; }
}

/* Navbar */
nav {
    position: fixed;
    width: 100%;
    background-color: black;
    height: 4.4em;
    margin: 0;
}

nav .name-div {
    float: left;
    padding: 0.8em;
}

nav .name-div img {
    height: 2.5em;
    width: 1.5em;
}

nav h1 {
    font-family: "Cabin Sketch", sans-serif;
    color: #578FCA;
    font-size: 2em;
    display: inline;
    padding: 0 1em;
    float: right;
    margin: 0;
}

nav .name-div a {
    text-decoration: none;
}

.nav-urls a {
    color: darkcyan;
    text-decoration: none;
    padding: 0.8em 13.9%;
}

nav ul {
    margin: 0;
    padding: 5em 0 0 1%;
}

nav li {
    list-style: none;
    display: inline;
    font-size: 1.5em;
}

.nav-urls a:hover {
    background-color: #A0C878;
    color: #143D60;
}

.nav-btns {
    float: right;
    padding: 0.75em;
}

nav button {
    background-color: transparent;
    border: 0;
}

nav button img {
    height: 2em;
    padding: 0.5em;
}

.btn-clicked-open {
    height: 8.8em;
    animation-name: navbar-open;
    animation-duration: 1s;
}

.btn-clicked-close {
    height: 4.4em;
    animation-name: navbar-close;
    animation-duration: 1s;
}

#close {
    padding: 0 1em;
}

.show {
    display: block;
}

.hide {
    display: none;
}

/* Header */
.header {
    min-height: 15em;
    background-image: linear-gradient(to bottom right, #034C53, #3F7D58);
}

.header h1 {
    font-size: 5em;
    font-family: "Cabin Sketch", sans-serif;
    color: white;
    text-align: center;
    margin: 0;
    padding: 10% 20% 5%;
}

/* Content Body */
body {
    margin: 0;
    font-family: "Delius", cursive;
    background-color: #ACD3A8;
}

/* Home Page */
.logo {
    width: 10%;
    padding: 2em;
}

.home-text {
    width: 80%;
    float: right;
}

.home-text h1 {
    color: #27445D;
    font-family: "Cabin Sketch", sans-serif;
    font-size: 3em;
    text-align: center;
}

.about-div {
    padding: 2em;
}

.about-div h1 {
    font-family: "Cabin Sketch", sans-serif;
    font-size: 3em;
    color: #27445D;
}

.contacts-div {
    padding: 2em;
}

.contacts-div h1 {
    font-family: "Cabin Sketch", sans-serif;
    font-size: 3em;
    color: #27445D;
}

.contacts-div h3{
    font-family: "Cabin Sketch", sans-serif;
    font-size: 1.5em;
    color: #123458;
}

.mail {
    width: 46%;
    float: left;
}

.whatsapp {
    width: 46%;
    float: right;
}

.mail li, .whatsapp li {
    list-style: none;
    padding: 0.5em;
    font-size: 1.25em;
}

/* Footer */
footer {
    background-color: #3E3F5B;
    color: #ACD3A8;
    padding: 0.5em;
    margin: 10em 0 0 0;
    text-align: center;
}

/*Novels*/
.Novels-main{
    padding: 2em;
}

.Novels {
    padding: 15em 2em 0;
}

.Novels ul {
    list-style-type: none;
}

.Novels a {
    text-decoration: none;
    font-size: 1.5em;
}

.Novels h2, .Novels-main h2 {
    color: #27445D;
    font-family: "Cabin Sketch", sans-serif;
    font-size: 3em;
    text-align: center;
}

.Novels-main img {
    width: 20%;
    float: right;
    padding: 2em;
}

.NovelsCont {
    width: 70%;
    float: left;
    padding: 2em;
}

.story-body {
    padding: 2em;
}

.story-body hr {
    border-top: 2px solid #333;
}

.left {
    padding: 2em;
    width: 45%;
    float: left;
}

.right {
    padding: 2em;
    float: right;
    width: 45%;
}

.center {
    padding: 1em 33%;
}

/* Games */
.Games-main {
    padding: 2em;
    min-height: 8em;
}

.Games-main h2 {
    color: #27445D;
    font-family: "Cabin Sketch", sans-serif;
    font-size: 3em;
    text-align: center;
}

.Games-main img {
    width: 20%;
    float: right;
    padding: 2em;
}

.GamesCont {
    width: 60%;
    float: left;
    padding: 2em;
}