/*.......Right-Image.......*/

.logo-hero {
    width: 60%;
    margin-top: -2rem;
}

.img-hero {
    width: 115%;
    margin-left: -2rem;
}

@media (max-width: 1023px) {
    .hero {
        width: 100vw;
    }
}

@media screen and (max-width: 320px) and (orientation: portrait) {}

@media screen and (min-width: 480px) and (orientation: landscape) {
    .logo-hero {
        width: 80%;
        margin-top: -2rem;
    }
    .img-hero {
        width: 100%;
        margin-left: -2rem;
    }
}

@media screen and (min-width: 768px) and (orientation: portrait) {}

@media screen and (min-width: 1024px) and (orientation: landscape) {}

@media screen and (min-width: 1112px) {
    .logo-hero {
        width: 80%;
        margin-left: 30%;
        margin-top: 3rem;
    }
    .img-hero {
        width: 80%;
        margin-left: 10%;
        margin-top: 3rem;
    }
}