body{
  font-family: 'Open Sans', sans-serif;
  /*background:#3498db;*/
  background:#262524;
  /* background:#0000a0; */
  margin: 0 auto 0 auto;  
  width:100%; 
  text-align:center;
  margin: 20px 0px 20px 0px;   
}

p{
  font-size:12px;
  text-decoration: none;
  color:#ffffff;
}

h1{
  font-size:1.5em;
  color:#525252;
}

.box{
  background:white;
  width:500px;
  height:300px;
  border-radius:6px;
  margin: 0 auto 0 auto;
  padding:0px 0px 70px 0px;
  border: #2980b9 4px solid;
  background-image: url('../images/BackgroundLogin.png');
  background-repeat: no-repeat;
  background-position-y: 61px;
  position: relative;
}
h1.bulkPaymentTxt {
	background-image:url('../images/bulkPayment.png');
	background-repeat: no-repeat;
	margin-left: 15px;
	margin-top: 0 !important;
	height: 61px;
}
h1.bulkPaymentTxtNew {
	background-image:url('../images/bulkPaymentNew.png');
	background-repeat: no-repeat;
	margin-left: 15px;
	margin-top: 0 !important;
	height: 61px;
}
.btnBox {
	text-align: center;
	box-sizing: border-box;
	display: block;
	margin: auto;
	width: 60%;
	
}
.forgotLink {
	text-align: center;
	box-sizing: border-box;
	display: block;
	margin: auto;
	width: 100%;
	position: absolute;
	bottom: 0;
	height:35px
}
.clearfix {
	clear:both;
}
.error{
	margin-bottom: 10px;
	margin-top: 25px;
}
.email{
  background:#ecf0f1;
  border: #ccc 1px solid;
  border-bottom: #ccc 2px solid;
  padding: 6px;
  width:250px;
  color:#AAAAAA;
  margin-top:10px;
  font-size:1em;
  border-radius:4px;
}

.password{
  border-radius:4px;
  background:#ecf0f1;
  border: #ccc 1px solid;
  padding: 8px;
  width:250px;
  font-size:1em;
}

.btn{
  background:#2ecc71;
  width:125px;
  padding-top:5px;
  padding-bottom:5px;
  color:white;
  border-radius:4px;
  border: #27ae60 1px solid;
  
  margin-top:20px;
  margin-bottom:20px;
  float:left;
  margin-left:16px;
  font-weight:800;
  font-size:0.8em;
}

.btn:hover{
  background:#2CC06B; 
}

#btn-small{
  background:#2ecc71;
  width:85px;
  padding-top:5px;
  padding-bottom:5px;
  color:white;
  border-radius:4px;
  border: #27ae60 1px solid;
  
  margin-top:20px;
  margin-bottom:20px;
  float:left;
  margin-left:16px;
  font-weight:800;
  font-size:0.8em;
}

#btn-small:hover{
  background:#2CC06B; 
}

#btn2{
  float:left;
  background:#3498db;
  width:125px;  padding-top:5px;
  padding-bottom:5px;
  color:white;
  border-radius:4px;
  border: #2980b9 1px solid;
  
  margin-top:20px;
  margin-bottom:20px;
  margin-left:10px;
  font-weight:800;
  font-size:0.8em;
}

#btn2:hover{ 
background:#3594D2; 
}
#btn2-small{
  float:left;
  background:#3498db;
  width:85px;  padding-top:5px;
  padding-bottom:5px;
  color:white;
  border-radius:4px;
  border: #2980b9 1px solid;
  
  margin-top:20px;
  margin-bottom:20px;
  margin-left:10px;
  font-weight:800;
  font-size:0.8em;
}

#btn2-small:hover{ 
background:#3594D2; 
}

/* Start by setting display:none to make this hidden.
   Then we position it in relation to the viewport window
   with position:fixed. Width, height, top and left speak
   for themselves. Background we set to 80% white with
   our animation centered, and no-repeating */
.modal {
    display:    none;
    position:   fixed;
    z-index:    1000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    
    background: rgba( 255, 255, 255, .8 )                 
                url('../images/loading-tmbulk.gif')
				50% 50% 
                no-repeat;
                
    /* background-size: 120px 120px; */ /* Resize the background image */
}

/* When the body has the loading class, we turn
   the scrollbar off with overflow:hidden */
body.loading .modal {
    overflow: hidden;   
}

/* Anytime the body has the loading class, our
   modal element will be visible */
body.loading .modal {
    display: block;
}

  .center-page {
    display: flex;
    justify-content: center;
    align-items: center;
   /*  height: 100vh; Full viewport height */
  }
  .center-box {
  width: 50vw;
  height: 50vh;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /* Optional styles 
  background-color: #f0f0f0;
  border: 0px solid #ccc;
  */
  padding: 1rem;
}