body {
    margin: 0;
    padding: 0;
}

.hero__section {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;

    height: 100vh;
    background: #151515;
}

.hero__section h1 {
    color: white;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 50px;

    padding: 0% 10% 0% 10%;
}

.hero__section div {
    width: 100%;
    margin: auto;

    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

@media screen and (max-width:1000px) {
    .hero__section {
        flex-direction: column;
    }

    .hero__section img {
        width: 400px;
        height: 400px;
    }
}

@media screen and (max-width:450px) {
    .hero__section img {
        width: 300px;
        height: 300px;
    }
}

.content {
    height: 100vh;
    background: white;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.top__content {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;

    
}

.top__content div {
    width: 100%;
    margin: auto;

    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.top__content h1 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 50px;
    padding: 0% 5% 0% 5%;
}

.top__content p {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 20px;
    padding: 0% 5% 0% 5%;
}

#description__frame {
    display: block;
}

#order__button {
    color: white;
    text-decoration: none;
    font-family: Arial, Helvetica, sans-serif;

    background: #151515;
    padding: 15px 30px 15px 30px;
    margin: 0 0 50px 0;
    
    border-radius: 30px;
}

#order__button:hover {
    text-decoration: underline;
    background: rgb(118, 118, 118);
}

@media screen and (max-width:1000px) {
    .top__content {
        flex-direction: column-reverse;

    }

    .top__content img {
        width: 400px;
        height: 261px;
    }

    #description__frame {
        justify-content: center;
    }
}

@media screen and (max-width:450px) {
    .top__content img {
        width: 300px;
        height: 196px;
    }
}