body {font-family: Arial, Helvetica, sans-serif;}

/* The Modal (background) */
.modalE {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 0px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opty */
  box-shadow: 11px -8px 10px -9px rgba(0,0,0,0.49);
-webkit-box-shadow: 11px -8px 10px -9px rgba(0,0,0,0.49);
-moz-box-shadow: 11px -8px 10px -9px rgba(0,0,0,0.49);
}

/* Modal Content */
.modal-contentE {
  background-color: #fefefe;
  margin: auto;
  padding: 10px;
  border: 1px solid #888;
  width: 95%;
}

/* The Close Button */
.closE {
  color: red;
  float: right;
  font-size: 3vw;
  font-weight: bold;
}

.closE:hover,
.closE:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

#myBtnE{
  margin-top:0px;
  border-style:none;
  background-color:  #04014A;
  border-radius: 16px;
  color: white;
  font-size: 1.3vw;
  padding: 5px 20px 5px 20px;
}

#myBtnE:hover {
  background-color:green;
  /*width: 45px;
  height: 45px;
  border-radius: 50px;*/
  color: white;
}

#ticket{color:black;}
#ticket:hover{color:black;}

.dnLod{
	background: white;
	border-style: solid !important;
	border-width: 1px !important;
	border-color:#660099 !important;
	border-radius: 12px !important;
}

.dnLod:hover{
	background-color:mediumorchid;
   border-radius: 12px !important;
   color: white !important;
}

	
	
.hide{
  display: none;
}

#alat{
	 width: 100% !important;
	 margin:0px auto !important;
	 display:block;
	 color:red;
	 font-size:3vw !important;
}
  	

#message{
	 width: 100% !important;
	 margin:0px auto !important;
	 display:block;
	 font-size:3vw ! important;
   }
  
.loader {
  margin:50px auto !important;
  border: 16px solid #87bdd8;
  border-radius: 50%;
  border-top: 16px solid #b7d7e8;
  border-right: 16px solid #daebe8;
  border-bottom: 16px solid #87bdd8;
  border-left: 16px solid #b7d7e8;
  width: 80px;
  height: 80px;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}


	
.note{
	margin-top:-40px;
	display: none;
}
	
	
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
	
	

.appBtn{
     background: #04014A !important;
     width:100% !important;
     color:white ! important;
     border-radius: 16px !important;
}	


.appBtn:hover{
    background:green !important;
    color:white ! important;
}		


#store{
	width: 10%;	
}



.wan{
    color:red ! important;
    font-size:3vw ! important;
}


#strong{
 color:black ! important;
}

#em{
 color:green ! important;
 font-style:normal ! important;
}

#formE{
     width: 80%;
     margin: 0px auto !important;
  }

#formtext, #payOption{
  font-size: 1vw;
  max-width: 100% !important;
  margin: 0px auto !important;
}


@media screen and (min-device-width: 1025px){
	
#myBtnE{
  margin-top:15px;
  font-size: 1vw !important;
  padding: 10px;
  margin-right: 0px;
  
}

.closE {
  font-size: 2vw;
  font-weight: bold;
  margin-top: 0px !important;
  margin-left: 15px !important;
}

.login{font-size:0.5vw;}

.logbtn{margin-left:25px;}

	
.modal-contentE{width: 40%; background-color:white; border-radius:12px; margin-top: 65px ! important; margin-bottom:20px;}

#formE{
     width: 100% !important;
     margin: 0px auto !important;
  }

#formtext{
  font-size: 1vw;
  max-width: 100% !important;
  margin: 0px auto !important;
}

#payOption, #payPlan{
  font-size: 1vw !important;
  margin-left: 50px !important;
}

.appBtn{
    width:82% !important;
    margin-left:50px;   
    margin-top: -50px !important;  
}	


#hedd{
  font-size: 2vw !important;
  margin-top: -45px !important;
}

::placeholder, .btn-lg{font-size: 1vw;}

#hedd{font-size:1.4vw !important; margin: 0 auto;}

.lab{margin-left: 140px; font-size: 1vw;}

#ticket{font-size:1.4vw;}

.fa-user-circle, #env{font-size:1.6vw;}


#regL{
  margin-left:25px;  
}



#alat{
	
font-size:1vw !important;
}
  	

#message{
	font-size:1vw ! important;
   }
  



.wan{
    font-size:1vw ! important;
}


}


/* For Tablet View */
@media screen and (min-device-width: 641px)
and (max-device-width: 1024px) {
	
    
#myBtnE{
  font-size: 1.6vw !important;
  margin-top: 0px;
}

.closE {
  font-size: 2.5vw !important;
  font-weight: bold;
}

.login{font-size:2.2vw;}

.logbtn{margin-left:18px;}


.modal-contentE{width: 60%; background-color:white; border-radius:12px; margin-top:50px ! important; margin-bottom:80px;}


#formtext{font-size:1.4vw; width: 80%; margin-left: 35px;}

#payOption, #payPlan{
  font-size: 1.5vw !important;
  margin-left: 0px !important;
}

.appBtn{
    width:85% !important;
    margin-top: -50px !important;
    margin-left:37px !important;  

}	


#hedd{font-size:1.4vw !important;}

::placeholder, .btn-lg{font-size: 1.4vw;}

#hedd{
  font-size:2.3vw !important;
  margin-top: -55px !important;
}

.lab{margin-left: 140px; font-size: 1.4vw;}

#ticket{font-size:1.4vw;}

.fa-user-circle, #env{font-size:4vw;}

#logbt{
   margin-left:30px; 
   width:80% ! important;
}

#regL{
  margin-left:35px;  
}

#sel{
  font-size: 1.2vw !important;
  width:80% ! important;
  margin-left:35px ! important;
}

#alat{
	
font-size:1.1vw !important;
}
  	

#message{
	font-size:1.1vw ! important;
   }
  
.wan{
    font-size:1vw ! important;
}


}

	

/* For Tablet Portrait View */
@media only screen and (min-device-width: 421px)
and (max-device-width: 640px) {
	
    
#myBtnE{
  margin-top:0px;
  font-size: 2vw;
}

.closE {
  font-size: 3.5vw !important;
  font-weight: bold;
}

.login{font-size:2.2vw;}

.logbtn{margin-left:18px;}


.modal-contentE{width: 70%; background-color:white; border-radius:12px; margin-top:65px ! important; margin-bottom:80px;}

#formE{
     width: 100% !important;
     margin: 0px auto !important;
  }

#formtext{
  font-size: 2vw !important;
  max-width: 100% !important;
  margin: 0px auto !important;
}

#payOption, #payPlan{
   font-size: 1.8vw !important;
   margin-left: 7px !important;
}

.appBtn{
    width:82% !important;
    margin-left:50px;     
}	


#hedd{
  font-size:2.5vw !important;
  margin-top: -60px !important;
}

::placeholder, .btn-lg{ 
     font-size: 2vw !important;
}

.lab{margin-left: 140px; font-size: 1.4vw;}

#ticket{font-size:1.4vw;}

.fa-user-circle, #env{font-size:4vw;}

#logbt{
   margin-left:35px; 
}

#regL{
  margin-left:35px;  
}

#sel{
  font-size: 2.2vw !important;
}

#alat{
	
font-size:1.8vw !important;
}
  	

#message{
	font-size:1.8vw ! important;
   }
  
.wan{
    font-size:2.3vw ! important;
}

strong{
    color:black ! important;
}	
	
}
	


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


.closE {
    font-size:6vw;
}

#myBtnE{
  font-size: 4vw;
  margin-top: 0px;
}

.modal-contentE{width: 90%; margin-top:50px; background-color:white; border-radius:12px; margin-bottom:50px;}


#formE{
     width: 100% !important;
     margin: 0px auto !important;
     margin-bottom:50px;
     
  }

#formtext{
  font-size: 3vw !important;
  max-width: 100% !important;
  margin: 0px auto !important;
}


#payOption, #payPlan{
   font-size: 3vw !important;
   margin-left: 2px !important;
}

.appBtn{
     font-size:4vw !important;
     margin-top: -50px !important;
  }

::placeholder{font-size: 3vw;}

#hedd{
  font-size:4.5vw !important;
  margin-top: -45px !important;
}

#hedd{font-size:4vw !important;}

.lab{margin-left: 10px; font-size:3vw;}

#ticket{font-size:6vw;}

.fa-user-circle{}

	
.loader {
  margin:100px auto !important;
  
}

	
.note{
	margin-top:-40px;
	display: none;
}

#sel{
  font-size: 3vw !important;
}

#alat{
	
font-size:3vw !important;
}
  	

#message{
	font-size:3vw ! important;
   }
  
 .wan{
    font-size:3vw ! important;
}


}