body {

    background-color: rgb(242, 242, 242);

}

* {

    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;

}

.header_1 {

    position: sticky;
    top: 0;
    background-color: #fff;
    z-index: 100;

}

nav {

    height: 64px;
    background: white;

}

nav img {

    width: 300px;
    position: absolute;
    left: 4%;

}

nav ul {

    float: right;
    margin-right: 100px;
    z-index: 9;

}

nav ul li {

    display: inline-block;
    line-height: 64px;
    margin: 0 45px;
    font-family: D-DinCondensed;
    font-size: 30px;

}

nav ul li a {

    position: relative;
    color: black;
    font-size: 30px;
    text-transform: uppercase;


}

nav ul li a:before {

    position: absolute;
    content: '';
    left: 0;
    bottom: 0;
    width: 100%;
    background: white;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform .4s linear;

}

nav ul li a:hover:before {

    transform: scaleX(1);
    transform-origin: left;

}

label #btn, label #cancel {

    color: black;
    font-size: 30px;
    float: right;
    line-height: 64px;
    margin-right: 40px;
    cursor: pointer;
    display: none;

}

#check {

    display: none;

}

.mainImage {

    display: grid;
    margin: auto;
    width: 98%;

}

.no-scroll {

    overflow: hidden;
    
}

@media screen and (max-width: 1290px){
    
    label #btn {

        display: block;

    }

    ul {

        position: fixed;
        width: 100%;
        height: 100vh;
        background: rgb(222, 222, 222);
        top: 64px;
        left: -100%;
        text-align: center;
        transition: all .5s;

    }

    nav ul li {

        display: block;
        margin: 50px 0;
        line-height: 30px;

    }

    #check:checked ~ ul {

        left: 0;

    }

    #check:checked ~ label #btn {

        display: none;

    }

    #check:checked ~ label #cancel {

        display: block;

    }

}

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

    nav img {
        
        width: 201px;

    }

    nav ul {

        margin-top: -20px;

    }

    nav ul li {

        display: flex;
        justify-content: center;
        font-family: D-DinCondensed;
        font-size: 30px;
    
    }

    label #btn {

        display: block;
        position: absolute;
        right: -10px;

    }

    nav {

        height: 43px;
        background: white;
    
    }

    label #btn, label #cancel {

        line-height: 44px;
    
    }
 
}

.alert-danger {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
}
.alert-success {
    color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb
}