@import url('https://fonts.googleapis.com/css2?family=Azeret+Mono&family=Fahkwang:ital,wght@0,500;1,300&family=Kanit:wght@300;500&family=Roboto+Condensed:wght@300&family=Roboto+Slab:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Azeret+Mono&family=Fahkwang:ital,wght@1,300&family=Kanit:wght@300;500&family=Roboto+Condensed:wght@300&family=Roboto+Slab:wght@500&display=swap');

* {
    margin: 0%;
    padding: 0%;
    box-sizing: border-box;
}


body {
    background-color: #902c0c;

}

/* navbaar start */

.just {
    background-color: #902c0c;
    padding-bottom: 3px;
}

a {
    text-decoration: none;
}

.just h1,
.just i {

    font-family: 'Azeret Mono', monospace;
    font-style: normal;
    font-weight: 500;
    font-size: 15px;
    line-height: 18px;
    padding: 4px;
    color: #d6d1d0;

}

.bi-dot::before {
    color: #FFFFFF;
    font-size: 39px;
}

.must {
    background-color: #D6D1D0;

}

.must button {
    padding: 18px !important;
}

.must h1 {
    color: #1F415D;
}

.canwe a {

    font-family: 'Fahkwang', sans-serif;
    font-weight: 400;
    font-size: 37px;
    color: #902c0c;
    line-height: 47px;
    transition: transform 300ms ease-out;


}



.canwe a:hover {
    transform: translate(-21px, 0px)  scale(1.4, 1.3);
}

/* navbar-end */

.sec-pg {
    padding-top: 20rem;
}

.h-1 , .h-2 {
    color: #D6D1D0;
    font-family: 'Fahkwang', sans-serif;
    font-weight: 500;
    font-size: 75px;
    line-height: 72px;
    text-align: center;
    font-style: normal;
    padding-bottom: 60px;

}

.h-2{
    padding-top: 200px ;
    padding-bottom: 200px ;
}

.im-1 img {
    height: 49rem;
    width: 100% ;
    object-fit: cover;
}


.fim img {
    height: 49rem;
    width: 100%;
    object-fit: cover;
}

.fap {
    height: 49rem ;
    width: 100%;

}


@media (min-width: 1923px) {

    .fim img {
        height: 82.1vh;
        width: 100%;
        object-fit: cover;
    }

    .im-1 img {
        width: 100%;
        height: 82.1vh;
        object-fit: cover;
    }

    .fap {
        height: 82.1vh !important;
        width: 100% !important;
    }


}
@media (max-width: 1200px) {
    .fim img {

        height: 35rem;
        width:100%;

    }

    .im-1 img{
        width: 100%;
        height: 35rem;



    }

    .fap {
        height: 35rem !important;
    }


}



.fap {
    width: 49rem;
    width: 100%;
    background-color: #902c0c;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    overflow: hidden;


}

.fap h4 {
    font-family: 'Azeret Mono', monospace;
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    color: #d6d1d0;
    cursor: pointer;
    transition: transform 484ms ease-in-out;


}

.fap h4:hover {
    transform: translate(0px, 24px);
    color: white;
}



.eff {
    transition: transform 484ms ease-in-out !important;
    text-align: center;
    padding: 0px  60px 20px;
}

.eff:hover {
    transform: translate(0px, -24px) !important;
}

.m-sec {
    color: #D6D1D0;
    font-weight: 600;
    font-size: 10vw;
    letter-spacing: 20px;
    font-style: bold;
    font-family: 'Fahkwang', sans-serif;
    text-align: center;
    width: 100%;
}


.flll {
    padding: 8px 3px 0px 8px;

}

.fll {
    padding: 8px 8px 0px 3px;
}


.fr-1{
    padding: 0px 8px 0px 8px;
}

.fr-2{
    padding: 8px 8px 0px 8px;
}

.fr-3{
    padding:8px 8px 0px 8px ;
}


@media (max-width: 550px) {
    .fim img {

        height: 30rem;
        width: 59rem;

    }

    .im-1 img {
        width: 59rem;
        height: 30rem;



    }

    .fap{
        height: 30rem !important;
    }

    .h-1 , .h-2{
        font-size: 40px;
        line-height: 1.3;
    }

    .sope , .eff{
        font-size: 13px !important; 
    }
    

}
@media (max-width : 991px) {

  .flll{
    padding-right: 8px;
  }
  .fll{
    padding-left: 8px;
  }




}

.sope{
    font-family: 'Azeret Mono', monospace;
    text-align: center;
    line-height: 30px;
    font-style: normal;
    font-weight: 400;
    color: #d6d1d0;
    font-size: 16px;

}