body{background: #000000; padding: 0; margin: 0; font-family: "poppins", sans-serif; font-size: 15px}
*{padding: 0; margin: 0; letter-spacing: .12rem;}
header{position: fixed; top: 0; left: 0; width: 100%; z-index: 99; height: 130px; backdrop-filter: blur(36px); padding: 0px max(5vw,15px); gap: 70px;}
header .logo{height: 100%; position: relative; top: 20%; margin-right: auto;}
header .logo-mini{height: 75%; margin-right: auto;}
header a{color: #FFF; cursor: pointer; transition: all .15s ease-in-out; font-weight: 300; font-size: 15px;}
header a:hover{opacity: .7;}
header .contact{gap: 10px 70px;}
header .contact a{text-align: right; text-decoration: underline;}
header .contact-icons{display: none; gap: 20px;}
header .contact-icons a{flex: 0 0 30px; width: 30px; max-width: 30px; height: 30px;}
header .contact-icons a.phone{background: url('icon-tel.svg') no-repeat center/contain;}
header .contact-icons a.mail{background: url('icon-mail.svg') no-repeat center/contain;}
header .booking{border: 1px solid #FFF; height: 70px; padding: 0 max(3vw,30px); text-decoration: none; text-transform: uppercase;}

main .container-fluid{padding-left: unset; padding-right: unset;}
main .container-fluid .row{margin-left: unset; margin-right: unset;}
main .container-fluid .row .left{color: #FFF; min-height: calc(100vh - 70px); min-height: calc(100svh - 70px); padding-top: 200px; padding-bottom: 70px;}
main .container-fluid .row .left .content{max-width: 450px;}
main .container-fluid .row .left .content .fakeH1{font-size: 82px; line-height: 1; font-weight: 300; font-family: "quinn-text", sans-serif;}
main .container-fluid .row .left .content h1{font-weight: 300; color: #FFFFFF; margin-top: 50px; margin-bottom: 30px; font-size: 22px; text-transform: uppercase; line-height: 1.5;}
main .container-fluid .row .left .content p{color: #FFFFFF; font-weight: 300; line-height: 1.7; font-size: 15px;}
main .container-fluid .row .left .content .button{display: block; width: fit-content; transition: all .15s ease-in-out; color: #FFFFFF; margin-top: 30px; text-decoration: none; text-transform: uppercase; font-weight: 300; font-size: 15px; padding-left: 65px; position: relative;}
main .container-fluid .row .left .content .button::before{content: ''; display: block; height: 1px; width: 50px; background: #FFFFFF; position: absolute; top: 50%; left: 0; transform: translate(0,calc(-50% - 2px)); transition: all .15s ease-in-out;}
main .container-fluid .row .left .content .button:hover{padding-left: 80px;}
main .container-fluid .row .left .content .button:hover::before{width: 70px;}
main .container-fluid .row .right{background: url('rene-victoire.jpg') no-repeat center/cover;}
main .container-fluid .row .right::after{content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to right, #000000 0%, #343434 100%); opacity: 43%;}

footer{background: #FFF; padding: 0px 15px; height: 70px;}
footer a{text-align: center; color: #000000; letter-spacing: .05rem; font-size: 15px;}


@media screen and (max-width: 1199px){
    header{height: 100px; gap: 40px;}
    header a{font-size: 12px;}
    header .contact{gap: 10px 40px;}
    header .booking{height: 50px;}

    main .container-fluid .row .left{min-height: calc(100vh - 50px); min-height: calc(100svh - 50px); padding-top: 170px; padding-bottom: 40px;}
    main .container-fluid .row .left .content .fakeH1{font-size: 64px;}

    footer{height: 50px;}
}

@media screen and (max-width: 991px){
    main .container-fluid .row .left{min-height: calc(100vh - (50px + 50vw)); min-height: calc(100svh - (50px + 50vw)); padding-top: 170px; padding-bottom: 40px;}
    main .container-fluid .row .right{height: 50vw;}
}

@media screen and (max-width: 767px){
    header{gap: 30px;}

    main .container-fluid .row .left{padding-top: 120px; padding-bottom: 30px;}
    main .container-fluid .row .left .content .fakeH1{font-size: 48px;}
    main .container-fluid .row .left .content h1{font-size: 18px; margin-top: 30px; margin-bottom: 15px;}
    main .container-fluid .row .left .content p{font-size: 12px;}
    main .container-fluid .row .left .content .button{font-size: 12px;}

    footer a{font-size: 12px;}
}

@media screen and (max-width: 575px){
    header{gap: 20px;}
    header .contact-icons{gap: 10px;}
}