
        /*Hero Section*/
        .hero{
            padding:0;
            margin:0 0 2rem 0;
            height: fit-content;
        }
        .hero-content{
            display:flex;
            flex-direction:column;
        }
        .hero-left{
            display:flex;
            flex-direction:column;
            align-items: center;
            justify-content: center;
            background-color: black;
            padding:4rem 0;
        }
        .hero-left h1{
            font-family: 'Futura-Medium', sans-serif;
            color:white;
            font-size: 2rem;
            width: 90%;
            margin:0 0 2rem 0;
            text-align: center;
        }
        .hero-left p{
            font-family: 'Futura-Light', sans-serif;
            color: white;
            width: 80%;
            margin:0 0 2rem 0;
            text-align: justify;
        }
        .hero-see-more{
            text-decoration: none;
            color: white;
            border: 2px solid white;
            padding: 10px 20px;
            margin: 20px 0;
            font-family: 'Futura-Medium', sans-serif;
        }
        .hero-right{
            display:flex;
            flex-direction:column;
        }
        .hero-right img{
            width:100%;
        }
        @media(min-width:768px){
            .hero{
                height: fit-content;
            }
            .hero-content{
                height: 100%;
            }
            .hero-left{
                padding:2rem 0 0 0;
            }
            .hero-right{
                height: 100%;
                overflow:hidden;
            }
            .hero-right img{
                height:100%;
                width:100%;
                object-fit: cover;
            }
            .hero-left h1{
                font-size: 4rem;
            }
            .hero-left p{
                font-size: 1.5rem;
            }
        }
        @media(min-width:1023px){
            .hero{
                height: 100vh;
            }
            .hero-content{
                height: 100%;
                display: grid; 
                grid-template-columns: 1fr 1fr;
            }
        }
        @media(min-width:1439px){
            .hero-right img{
                object-fit: cover;
                object-position: top;
            }
        }