@import url('https://fonts.googleapis.com/css?family=Roboto:400,500,700&display=swap');

html, body {
  min-height: 100%;
  height: 100%;
  position: relative;
  margin: 0; padding: 0;
  font-family: 'Roboto', sans-serif;
}
* {box-sizing: border-box;}
#container {
width: 100%;
height: 100%;
left: 0;
top: 0;
  position: absolute;
 /*background: url('../images/background-01.svg') no-repeat left center / cover;*/
  background: url('../images/background.png') no-repeat left center / cover;
  z-index: 1;
}

.bottom{width: 100%;position:absolute;bottom: 0;left: 0;right: 0; z-index: 2}
.bottom .bottom_img{width: 100%;}
.login{margin: auto; width:38.4%;top: 298px;position: inherit;}
.login_input{position: relative;margin-bottom: 5px;}
.login_input img{position: absolute;width:25px;left:4px;top: 8px;}
.login_input input{background: rgb(235,235,235);border: none;height: 35px;box-shadow: 2px 1px 2px -1px rgba(0,0,0,0.2);border-bottom:1px solid rgba(0,0,0,0.2);border-radius: 3px;padding:4px 4px 4px 36px;font-size: 14px;color:rgba(0,0,0,0.7);width: 100%;}
.login_input select{background: rgb(235,235,235);border: none;height: 35px;box-shadow: 2px 1px 2px -1px rgba(0,0,0,0.2);border-bottom:1px solid rgba(0,0,0,0.2);border-radius: 3px;padding:4px 4px 4px 36px;font-size: 14px;color:rgba(0,0,0,0.7);width: 100%;}

.login_input input:-internal-autofill-selected{font-size: 14px;background: rgb(235,235,235);}
.login_input input:focus{outline: none;}
.login_btn{position: relative;text-align: center;padding-top: 15px;}
.login_btn button{background: #FC7700;font-size: 15px;border: none;box-shadow: 2px 1px 2px -1px rgba(0,0,0,0.2);padding:10px 16px 10px 50px;color: #fff;position: relative;border-radius: 4px;}
.login_btn button:hover{cursor: pointer;}
.login_btn button span{padding: 12px 8px;background: rgba(255,255,255,0.1);font-size: 8px;top: 0;left: 0;position: absolute;bottom: 0;}
.login_btn img{width: 14px;}
.brnad_logo{text-align: center;margin-bottom: 15px;}
.brnad_logo img{width: 50%;}
.form-group{clear: both;height: 20px;font-size: 13px;}
.error{color: red;font-size: 10px;}
.forget{font-size: 12px; color: rgba(0,0,0,0.5);}

@media screen and (max-width: 1028px) {
	.bottom{position: relative;}
	.bottom_img{display: none;}
	.login{top:0px;width:100%;}
	.login{padding: 0 0 30px; min-height: 510px;}
	.forget{color: rgba(0,0,0,0.5);}
#flip-container {/*height: 470px !important;*/}	

.fl {
    flex: 0 0 100% !important;
    max-width: 100% !important;
}

.login_input {
    margin-bottom:0px !important;
}


#flip-container {
    position: relative;
    height: 280px;
    z-index: 1;
    perspective: 800px;
    text-align: center;
    /*outline: #1d1d1b solid 10px;
	background-color:#e1dcbe;*/
}

.back {
    background-color: #e1dcbe;
    /*outline: #1d1d1b solid 10px;*/
	height: 460px !important;
}

#container {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    position: absolute;
    /* background: url(../images/background-01.svg) no-repeat left center / cover; */
    background: url(../images/background.png) no-repeat left center / cover;
    z-index: 1;
	display:none;
}

label.wrap:after {
    width: 10% !important;
}

.registered_mob{width:100% !important;}

body {
    background-color: #e1dcbe!important;
}
	
}
@media screen and (max-width:1080px) and (min-width: 1000px){
	.login_btn{padding-top: 5px;}
.login_input{margin-bottom: 6px;}
.login{top:0px; }
.login_input input{height: 30px;}
.login_input img{left: 9px;top: 7px;}
.login_btn button span{padding: 9px 8px;}
.brnad_logo{margin-bottom: 3px;}
}
@media screen and (max-width:1100px) and (min-width: 1024px) {
.login_btn{padding-top: 5px;}
.login_input{margin-bottom: 0px !important;}
.login{top:0px; width:100%;}
.login_input input{height: 30px;}
.login_input img{left: 9px;top: 7px;}
.login_btn button span{padding: 9px 8px;}
.brnad_logo{margin-bottom: 3px;}
.heading_logo {margin: 0 0 15px 0px !important;}
.form-group {margin-bottom:17px !important;}
#flip-container {
    height: 235px !important;
}
h4.heading {margin: 0 0 6px 0px !important; color: #fff; font-size: 18px; background-color: #fc7700; padding: 7px !important;}

.entry-group {padding-bottom: 0!important; padding-top: 0!important;}

.fp {margin: 0px 0 10px 0px!important;}

.form-horizontal{margin:0 0 10px 0px;}

#container {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    position: absolute;
    /* background: url(../images/background-01.svg) no-repeat left center / cover; */
    background: url(../images/background.png) no-repeat left center / cover;
    z-index: 1;
	display:none;
}

.bottom_img{display:none;}

.bottom {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 2;
}

}

}
@media screen and (max-width:1200px) and (min-width: 1101px) {
	.login{top: 298px; width:38.5%;}
	.login_btn{padding-top: 0px;}
.login_input{margin-bottom: 6px;}
}
@media screen and (max-width:1500px) and (min-width: 1400px) {
	.login{top: 302px; width: 38.5%;}
}



@media screen and (max-width:1920px) and (min-width: 1500px) {
	.login{top:304px; width: 38.5%;}
	
}

@media screen and (max-width:10000px) and (min-width: 2200px){
	.login{top: 308px ;width:38.5%;}
}