@charset "UTF-8";

/* -------------------------

This is the main CSS file for Landing page of 

------------------------- */
:root{
    --white:#FFFFFF;--black_pearl:#041325;--tory_blue:#1547AC;--grey_blue:#7382AA;--black:#000000;
    --ghost_white:#F5F9FF;--bright_red:#FD0707;--thunder:#303030;--artyClickCoolMageneta:#BC00FF;--darkOrange:#FF8A00;
}

/* ===========Colors used =============== */
.white{color: var(--white);}
.blackPearl{color:var(--black_pearl);}
.toryBlue{color:var(--tory_blue);}
.greyBlue{color:var(--grey_blue);}
.black{color:var(--black);}
.ghostWhite{color:var(--ghost_white);}
.brightRed{color:var(--bright_red);}
.thunder{color:var(--thunder);}
.artyClickCoolMagneta{color:var(--artyClickCoolMageneta);}
.darkOrange{color:var(--darkOrange);}

/* ==========font size variants========== */
.f40{font-size:40px;line-height:1.4;}
.f30{font-size:30px;line-height:1.4;}
.f20{font-size:20px;line-height:1.4;}
.f16{font-size:16px;line-height:1.4;}
.f12{font-size:12px;line-height:1.4;}

/* ===========font weihght varients============= */
.fn{font-weight: normal;}
.f300{font-weight: 300;}
.f400{font-weight: 400;}
.f500{font-weight: 500;}
.f600{font-weight: 600;}
.f700{font-weight: 700;}
.fb{font-weight: bold;}


@media (max-width:1200px){
    .f40{font-size:36px;line-height:1.4;}
    .f30{font-size:26px;line-height:1.4;}
    .f20{font-size:19px;line-height:1.4;}
    .f12{font-size:12px;line-height:1.4;}
  }

@media (max-width:992px){
    .f40{font-size:34px;line-height:1.4;}
    .f30{font-size:24px;line-height:1.4;}
    .f20{font-size:18px;line-height:1.4;}
    .f16{font-size:15px;line-height:1.4;}
    .f12{font-size:12px;line-height:1.4;}
}

@media (max-width:768px){
    .f40{font-size:30px;line-height:1.4;}
    .f30{font-size:22px;line-height:1.4;}
    .f20{font-size:16px;line-height:1.4;}
    .f16{font-size:14px;line-height:1.4;}
    .f12{font-size:12px;line-height:1.4;}
}

@media (max-width:575px){
    .f40{font-size:26px;line-height:1.4;}
    .f30{font-size:20px;line-height:1.4;}
    .f20{font-size:14px;line-height:1.4;}
    .f16{font-size:13px;line-height:1.4;}
    .f12{font-size:12px;line-height:1.4;}
}

.br768{
    display: none;
}
@media all and (min-width:768px){
    .br768{
        display: block;
    }
}
.br992{
    display: none;
}
@media all and (min-width:992px){
    .br992{
        display: block;
    }
}
.br1200{
    display: none;
}
@media all and (min-width:1200px){
    .br1200{
        display: block;
    }
}