html{scroll-behavior: smooth;}
	
body {
    font-family: 'Poppins';
    margin:0px ! important;
   
}

main{
  padding-top: env(safe-area-inset-top);
  padding-bottom: env(safe-area-inset-bottom);
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right); 
  width:100% ! important;
}

  
  .container-fluid{
      margin-top:0px ! important;
      width: 100% ! important;
      
  }
  
   
  .row{
      width: 100% ! important;
  }
  
  a{color: black !important;}
    
 h1{
    padding-top:80px ! important;
    font-weight: bold !important;
  }
  
  h1, h2{
    font-weight: bold !important;
  }
  
  b{
      color: red ! important;
  }
  

  #placeOrder{
    background: white;
    transition: box-shadow 0.5s;
    box-shadow: 5px 0px 40px rgba(0,0,0, .1); 
    transition: transform .2s; /* Animation */ 
  }
  
  ::placeholder{
    font-size: 3vw !important;
  }
  
  address{
    font-size: 3vw !important;
    margin-left: 20px !important;
    margin-bottom: -5px !important;
  }
  
  select{
    font-size: 3.2vw !important;
  }
  
  option{
    font-size: 3.1vw !important;
  }
  
  h5, h6{
    font-size: 12px !important;
  }
  
  .addItemBtn{
    background: aliceblue !important;
    width: 50% !important;
    height:100% ! important;
    color: black !important;
    border: 1px solid grey !important;
    border-radius: 28px !important;
    text-transform: capitalize !important;
    margin-left: 20px !important;
    padding:10px ! important;
  }
  
  .addItemBtn:hover{
    background: black !important;
    color:white!important;
    border: 1px solid grey !important;
    border-radius: 28px !important;
    text-transform: capitalize !important;
  }
  

  .selectPaymentMode{
    display: none !important;
  }

  .payBtn{
   /* background: red !important;*/
     width: 50% !important;
     height:100% ! important;
     margin: 10px auto !important;
     border:none !important;
     border-radius: 28px !important;
     text-transform: capitalize !important;
     margin-left: 20px !important;
     padding:10px ! important;
  }
  
  .payBtn:hover{
    color:white!important;
    border: none !important;
    border-radius: 28px !important;
    text-transform: capitalize !important;
  }


  
  #pimg{
    width: 40px !important;
    height: 40px !important;
    border-radius: 50px !important;
  }
 
  .hide{
    display: none;
  }


  #message, #alat, #modAlat{
    color: red !important;
  }
  
  .godisabo{
    /*background-color: blue !important;*/
  }

  /*For Desktop View*/
  
  @media screen and (min-device-width: 1025px){
      
      
    .container-fluid{
        width:80% ! important;
    }
  
      
  b{
    font-size: 1.5vw !important;
  }
  
       
  #myB{
    font-size: 1.1vw !important;
  }
  
  
    #message{
      font-size: 1.4vw !important;
      margin-left: 0px !important;
    }
    
    #alat, #modAlat{
      font-size:1vw ! important;
      margin-left:15px ! important;
    }
    
    h1{
      font-size: 1.6vw !important;
      padding-top:80px ! important;
    }

    h2{
      font-size: 1vw !important;
    }
     
      h3, h4{
      font-size: 1vw !important;
    }
    
    .table{
        margin-top:83px ! important;
    }
    
    .cart{
     width: 100% !important;
     height: 455px !important;
     overflow-y: scroll !important;
     margin-top: 0px !important;
     
  }
  
  #placeOrder{
     width: 100% !important;
  }
  
  .form-control{
    width: 95% !important;
    margin: 5px auto !important;
  }

    
  #pimg{
    width: 30px !important;
    height: 30px !important;
    border-radius: 50px !important;
  }
 
  .itemQty{
    width: 100% !important;
    font-size: 1vw !important;
  }
  
  .addItemBtn{
    font-size: 1vw !important;
    margin-left: 18px !important;
  }

 
  ::placeholder{
    font-size: 1vw !important;
  }
  
  select{
    font-size: 1vw !important;
  }
  
  option{
    font-size: 1vw !important;
  }
  address{
    font-size: 1vw !important;
  }
  
  #area{
    width: 95% !important;
  }
  
  
  th{
    font-size: 1vw !important;
  }
  
  td{
    font-size: 1vw !important;
  }
  
  .cc{
      
     width:100px ! important;
    font-size: 1vw !important;
    text-transform: capitalize !important;
  }
  
  .del{
      width:100% ! important;
    font-size: 1vw !important;
  }

  }
  
  
  
  
  /* For Tablet Landscape View */
  @media only screen and (min-device-width: 641px)
  and (max-device-width: 1024px) {
  
    
    h1{
      font-size: 2vw !important;
    }

    h2{
      font-size: 1.4vw !important;
    }
     
      h3, h4{
      font-size: 1.2vw !important;
    }
   
.checkFluid{
    width: 100% !important;
} 

.shopperInfoDiv{
     width: 100% !important;
     height: auto !important;
     overflow-y: scroll !important;
 
  }
  
    #myB{
    font-size: 1vw !important;
  }
  
  
  #placeOrder, #myCart{
     width: 100% !important;
  }
  
  .form-control{
    width: 95% !important;
    margin: 5px auto !important;
  }

    
  #pimg{
    width: 30px !important;
    height: 30px !important;
    border-radius: 50px !important;
  }
 
  .itemQty{
    width: 100% !important;
    font-size: 1.1vw !important;
  }
  
  .addItemBtn{
    font-size: 1.3vw !important;
    margin-left: 10px !important;
    height:100% ! important;
  }

  {
    font-size: 2vw !important;
    margin-top: 20px !important;
  }
  
 
  ::placeholder{
    font-size: 1.1vw !important;
  }
  
  select{
    font-size: 1.4vw !important;
  }
  
  option{
    font-size: 1.4vw !important;
  }
  address{
    font-size: 1.1vw !important;
  }
  
  #area{
    width: 95% !important;
  }
  
  
  th{
    font-size: 1vw !important;
  }
  
  td{
    font-size: 1vw !important;
  }
  
  .cc{
    font-size: 1.1vw !important;
    text-transform: capitalize !important;
  }
  
  .del{
    font-size: 1vw !important;
  }
  
  
  }
  
  /* For Tablet Portrait View */
  @media only screen and (min-device-width: 421px)
  and (max-device-width: 640px) {
  
  .form-control{
    width: 95% !important;
    margin: 5px auto !important;
  }
  
  .btn-block{
    font-size: 2.6vw !important;
  }
  
  h1{
    font-size: 5vw !important;
  }
  
  h2{
    font-size: 2.8vw !important;
    }
  
    #myB{
    font-size: 2vw !important;
  }
  
    h3, h4{
    font-size: 3.5vw !important;
  }
  
  ::placeholder{
    font-size: 2vw !important;
  }
  address{
    font-size: 2vw !important;
  }
  
  select{
    font-size: 2vw !important;
  }
  
  option{
    font-size: 2.2vw !important;
  }
  
  .cart{
    margin-top: 60px !important;
    margin-bottom: 100px !important;
  }
  
  th{
    font-size: 2.5vw !important;
  }
  
  td{
    font-size: 2.5vw !important;
  }
  
  .cc{
    font-size: 2.5vw !important;
    text-transform: capitalize !important;
  }
  
  .del{
    font-size: 2.2vw !important;
  }
  
  }
  
  
  
  @media screen and (max-width:420px){
 
.container-fluid{
  margin-bottom: 100px ! important;
}
  
 .container-fluid, .row{
     width: 100% ! important;
 }  
 
 .row{
     margin-left:0px ! important;
 }
    #checkLogo{
      width: 30px !important;
    }
  
  .form-control{
    width: 95% !important;
    margin: 5px auto !important;
  }
  
  .btn-block{
    font-size: 4vw !important;
  }

  #message{
    margin-top: 0px !important;
    font-size: 5vw !important;
  }
  
 
 #alat, #modAlat{
    font-size:3vw ! important;
    margin-left:15px ! important;
 }
    
  b{
    font-size: 5vw !important;
  }
  
    #myB{
    font-size: 3vw !important;
  }
  
  h1{
    font-size: 5vw !important;
  }
  
  h2{
    font-size: 4.5vw !important;
    }
  
    h3, h4{
    font-size: 3.5vw !important;
  }
  
  ::placeholder{
    font-size: 3vw !important;
  }
  address{
    font-size: 3vw !important;
  }
  
  select{
    font-size: 3vw !important;
  }
  
  option{
    font-size: 3.2vw !important;
  }
  
  .cart{
    margin-top: 60px !important;
    margin-bottom: 100px !important;
  }
  
  .addItemBtn{
    font-size: 3vw !important;
    margin-left: 10px !important;
  }
  
  .payBtn{
     margin-left: 10px !important;
  }
  
  th{
    font-size: 3vw !important;
  }
  
  td{
    font-size: 3vw !important;
  }
  
  .cc{
    font-size: 3vw !important;
    text-transform: capitalize !important;
  }
  
  .del{
    font-size: 3.2vw !important;
  }
  
  }