/* typography */
.font {
    font-family: 'Outfit',
        sans-serif;
}

.f-light {
    font-family: 'Outfit',
        sans-serif;
    font-weight: lighter;
}

.text-1 {
    font-size: 80px;
    font-family: 'Outfit',
        sans-serif;
    font-weight: lighter;

}
.text-1bold {
    font-size: 80px;
    font-family: 'Outfit',
        sans-serif;
    font-weight: 500;

}
.text-2 {
    font-size: 60px;
    font-family: "outfit", sans-serif;
    font-weight: lighter;
}

.text-3 {
    font-family: 'Outfit',
        sans-serif;
    font-size: 12px;
}
.text-4 {
    font-size: 35px;
    font-family:'Outfit',
        sans-serif; ;
}

.text-btn {
    font-family: 'Outfit',
        sans-serif;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 500;
}
.text-color {
    color: grey;
}

.text-rotate {
    rotate: -90deg;
    position: fixed;
    bottom: 60px;
    left: 30px;
    font-size: 12px;
    color: white;
    text-transform: uppercase;
    mix-blend-mode: difference;
    z-index: 170;
}

.mix-blend-mode {
    mix-blend-mode: difference;
}


/*header and  burger menu */
.header-h {
    height: 100px;
}

.logo {
    font-size: 50px;
    position: fixed;
    font-family: "outfit", sans-serif;
    font: weight 200px;
    left: 30px;
    z-index: 200;
}

.burger-menu {
    position: fixed;
    right: 30px;
    transition: .3s;
    z-index: 170;
    mix-blend-mode: difference;
}

.b-span {
    width: 25px;
    height: 2px;
    margin-bottom: 5px;
    background-color: white;
    display: block;
    transition: .3s;
}

.b-span2 {
    width: 20px;
    height: 2px;
    margin-bottom: 5px;
    background-color: white;
    display: block;
    transition: .3s;
    position: sticky;
    transition: block .3s;
}

.burger-menu-nav {
    width: 100%;
    height: 100%;
    position: fixed;
    font-size: 35px;
    font-weight: bold;
    line-height: 60px;
    font-family: 'Outfit',
        sans-serif;
    color: hsla(0, 0%, 100%, .8);
    padding: 130px 200px 0px 200px;
    top: 0%;
    left: -200%;
    transition: left .4s;
    right: 0%;
    bottom: 0%;
    background-color: black;
    z-index: -10;
}