/***********GOOGLE FONT***********/

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');



/***********CUSTOM CSS STARTS***********/

h1, h2, h3, h4, h5, h6, p, a, span{

    font-family: 'Poppins', sans-serif;

}

html, body{height : 100%; min-height:100%; }

/***********CUSTOM CSS ENDS***********/





/***********BOOTSTRAP FIX STARTS***********/

@media (min-width: 576px){

    .container {max-width: none;}

    .modal-dialo {max-width: 700px;}

    .modal-sm {max-width: 400px;}

}

@media (min-width: 768px){

    .container {max-width: 740px;}

}

@media (min-width: 992px){

    .container { max-width: 960px;}

}

@media (min-width: 1200px){

    .container {max-width: 1170px;}

}

@media (min-width: 1440px){

    .container {max-width :1340px;}

}

@media (min-width: 1600px){

    .container {max-width: 1400px;}

}

@media (min-width: 1900px){

    .container {max-width: 1540px;}

}

/***********BOOTSTRAP FIX ENDS***********/





/***********BANNER STARTS***********/

.p-70 {
    padding-bottom: 70px;
}

.banner{height : 100%; min-height:100%; height:auto;

    /* width: 100vw;

    height: 100vh; */

    position: relative;
    /* overflow: hidden; */
    background:url(../img/banner.jpg) no-repeat center center #fff;
    background-size: cover;

} 

/* .banner :after{

    position: absolute;

    content: '';

    /* width: 100vw;

    height: 100vh; 

    bottom: 0px;
    background: #fff;*/

    /* background-image: url(../img/wave.png);

    background-position: center; */

   /*  top: 0;

    left: 0;

    background-size: cover;

    background-repeat: no-repeat;

} 

.banner:before{

    position: absolute;

    content: '';

    width: 100vw;

    height: 100vh;

    bottom: 0px;

    background: #fff;

    top: 0;

    left: 0;

}  */

.banner .brand .logo{
    display: flex;
    justify-content: center;
    padding-top: 30px;
    padding-bottom: 20px;
}

.banner .banner-form{

    background-color: var(--trirdColor);

    padding: 30px;

    margin: 0px;

    z-index: 999;

    border-radius: 6px;

    box-shadow: 0px 2px 9px 0px rgb(0 0 0 / 35%); 

}

.banner .banner-form .form-title{

    color: var(--primaryColor);

    font-family: 'Poppins', sans-serif;

    font-size: 18px;

    font-weight: 500;

    letter-spacing: 0.3px;

    padding-bottom: 20px;

}

.banner .banner-form .form-control{

    min-height: 41px;

    border-radius: 6px;

    border: 1px solid #e1e1e1;

    background-color: #f8f8f8;

    transition: all 0.3s ease;

}

.banner .banner-form .form-control:hover{

    border: 1px solid var(--primaryColor);

}

.form-control:focus {

    box-shadow: none;

}

.banner .banner-form .form-action .sign-btn{

    background-color: var(--secondaryColor);

    color: var(--trirdColor);

    font-size: 16px;

    font-weight: 500;

    letter-spacing: 0.3px;

    padding: 10px 15px;

    border: 1px solid var(--secondaryColor);

    border-radius: 6px;

    display: flex;

    align-items: center;

    text-transform: uppercase;

    font-family: 'Poppins', sans-serif;

    transition: all 0.3s ease;

}
.banner .banner-form .form-action .sign-btn.cancelBtn{
    background-color: var(--primaryColor);
    border: 1px solid var(--primaryColor);
}
.banner .banner-form .form-action .sign-btn.cancelBtn:hover{
    background-color: transparent;

    color: var(--primaryColor);

    border: 1px solid var(--primaryColor);
}
.banner .banner-form .form-action .sign-btn:hover{
    background-color: transparent;
    color: var(--secondaryColor);
    border: 1px solid var(--secondaryColor);
}

.banner .banner-form .form-action .sign-btn i{

    font-size: 30px;

    padding-right: 10px;

}

.banner .banner-form .form-action{

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 10px 0px;

}

.banner .banner-form .form-action .forget{

    color: #0c509d;

    font-size: 16px;

    font-weight: 500;

    letter-spacing: 0.3px;

    text-decoration: none;

    font-family: 'Poppins', sans-serif;

}

.banner .banner-form .form-trems .trems-info{

    color: #7e7e7e;

    font-size: 16px;

    font-weight: 500;

    letter-spacing: 0.3px;

    font-family: 'Poppins', sans-serif;

    text-decoration: underline;

}

.banner .celex-inner{

z-index: 10;

}

.banner .celex-inner .celex-title{

    color: var(--textColor);

    font-size: 18px;

    font-weight: 600;

    letter-spacing: 0.3px;

    font-family: 'Poppins', sans-serif;

    text-transform: uppercase;

    padding-top: 20px;

}

.banner .celex-inner .celex-title span{

    font-weight: 400;

}

.banner .celex-inner .celex-content{

    color: var(--textColor);

    font-size: 16px;

    font-weight: 400;

    letter-spacing: 0.3px;

    font-family: 'Poppins', sans-serif;

}

.banner .coppy-content{

    color: var(--secondaryColor);

    font-size: 16px;

    font-weight: 500;

    letter-spacing: 0.3px;

    font-family: 'Poppins', sans-serif;

    text-transform: capitalize;

    z-index: 10;

}

.banner .copy-inner{

    display: flex;

    justify-content: space-between;

    align-items: flex-end;

}

.banner .banner-style{

    position: relative;

}



/***********BANNER ENDS***********/

.flip-container {
    perspective: 1000px;
    -webkit-perspective: 1000px;
    -moz-perspective: 1000px;
    -o-perspective: 1000px;
  }
  
  .flip-container.hover .flipper {
    transform: rotateY(180deg);
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
  }
  .flip-container,
  .front,
  .back {
    /* width: 320px; */
    height: 320px;
    padding: 0 20px;
  }
  .celex-img > img {
    width: 20%;
}
  .flipper {
    transition: 0.6s;
    -webkit-transition: 0.6s;
    -moz-transition: 0.6s;
    -o-transition: 0.6s;
    -ms-transition: 0.6s;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    position: relative;
  }
  .front,
  .back {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
  }
  .front {
    z-index: 2;
    transform: rotateY(0deg);
    -webkit-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    /* background: tomato; */
  }
  .back {
    transform: rotateY(180deg);
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
  }
  .container.arnab {
    min-height: 100%;
    height: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-bottom: 20px;
    box-sizing: border-box;
}