@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;700;900&display=swap');


*{

  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
body{
    font-family: 'lato', sans-serif;
     background-color: #fff;
     overflow-y: hidden; /* Hide vertical scrollbar */
     overflow-x: hidden; /* Hide horizontal scrollbar */
    
    }

    ::-webkit-scrollbar {
      display: none;
    }
    

.row{

  --bs-gutter-x: 0rem !important;

}




.custom-fw1{

  font-weight: 700 !important;
}



/*------------ Login container ------------*/

/* .box-area{
    width: 100%;
} */

/*------------ Right box ------------*/

.right-box{
    padding: 40px 30px 30px 30px;
    
}



.carousel-item {
    height: 100vh;
    min-height: 450px;
    background: repeat center center scroll;
    /* -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover; */
    background-size: 500px;
    background-repeat: no-repeat;
    top: 10%;
    

  }



  .carousel-item h5,p{

    line-height: 1 rem !important;

  }

  
  .input-div {

    position: relative;
    margin-block: 23px;
  

  }

  .app-div{

    width: 85%;
  }


  .textbox {

    border: 1px solid grey;
    border-radius: 5px;
    outline: none;
    background: none;
    padding: 10px 15px;
    font-weight: 700;


  }

  .text-div a::after {
      display: block;
        content: '';
       width: 100%;
       height: 3px;
       position: absolute;
       bottom: 1;
       left: 0;
       background-color: rgb(204, 200, 200);
     }
     
     .text-div a {
     position: relative; 
     text-decoration: none; 
     font-size: 1.5rem;
     color: black;
     
     }
  

  .textbox:focus {

    border: 1px solid #c21010;

  }

  label {

    position: absolute;
    top: 0.6rem;
    left: 1.4rem;
    cursor: text;
    transition: top 300ms ease-in, left 300ms ease-in, font-size 250ms ease-in;
    line-height: 1.5rem !important;

  }

  .textbox:focus ~ label,
  .textbox:not(:placeholder-shown).textbox:not(:focus)~label {

    top: -0.7rem;
    left: 0.5rem;
    font-size: 15px;
    background-color: #fff;
    color: #c21010;
    
   }


  form {

    width: 100%;
    /* height: 100%; */

  }

  input {

    width: 85%;
    -webkit-appearance: none;
    -moz-appearance: textfield;
  }

  .btn1 {

    background-color: #c21010 !important;
    width: 85% !important;
    
  }

  .cursor-pointer{

    cursor: pointer;
  }





  /* modal css */


  
  .modal-content {
    left: -30px;
    top: 100px;
    width: 75%;
  }

  input[type=number]::-webkit-inner-spin-button,
  input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
  }

  

  .card {
    width: 100%;
    border: none;
    height: 300px;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .card h6, span{

    line-height: 1.5rem !important;

  }

  .card h6 {
    color: #c21010;
    font-size: 20px

  }

  .inputs input {
    -webkit-appearance: none;
    -moz-appearance: textfield;
    width: 40px;
    height: 40px
    
  }



  .form-control:focus {
    box-shadow: none;
    border: 1px solid black;
  }

  .validate {
    border-radius: 20px;
    height: 40px;
    background-color: #c21010;
    border: 1px solid #c21010;
    width: 140px
  }


  .carousel-indicators [data-bs-target]{
    background-color: #c21010;

  }


  


/*------------ For small screens------------*/

@media only screen and (max-width: 768px){

     
     .left-box{
       display: none;
     }

     
     .right-box{
        padding: 40px 0px 0px 0px;
        
       
        
     }

     .modal-content {
      left: 0;
      top: 230px;
      width: 100%;
    }


    .logo-div{
       display: flex;
      justify-content: center !important;
      padding-left: 0 !important;
      padding-bottom: 2rem !important;
    }

    .app-div img{

      width: 120px;
    }

    

     
}