/* main css */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap');
body{ background:url(../img/bg.png) no-repeat center; background-size:100% auto;width: 100vw;
  height: 100vh;overflow:hidden; position:relative; font-family:'Montserrat', Geneva, sans-serif}
  
.p-login .page-login {width: 100vw; position:relative;height: 100vh;overflow: hidden;}
.p-login .box-login {width: 900px; position:relative;height: 500px;overflow: hidden;top: 50%;border-radius: 25px;
transform: translate(0, -50%);margin: 0 auto;  box-shadow: 0 2px 18px 0 rgba(0,0,0,.3);}

.p-login .slideshow {
  position: absolute;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  max-width:100%;
  max-height:500px;
}
body .left_col,
body .top_nav {display:none!important;}
.p-login .main_container{position:relative; width:100%; height:100vh;}
.p-login .login_content h1 span{letter-spacing:1px;font-size: 24px;}
.p-login .login_content h1{line-height: 35px; letter-spacing: 0.1em;font-size: 20px;margin-bottom: 50px;}
.p-login .separator {border-top: 1px solid #fff; padding-top:10px; margin-top:0;}
.p-login .separator p{color:#787878;font-size: 8px;}
.p-login .btn{margin:20px auto!important; float:none!important;}
.p-login .login_content form input.form-control,.p-login .login_content form input[type="text"],.p-login .login_content form input[type="email"],.p-login .login_content form input[type="password"] {background:rgba(255, 255, 255, 1); color:#272727;border-radius: 0;height: 45px;font-size: 18px;box-shadow:none!important; margin-top:10px;}
.p-login .login_content form input[type="text"]:focus,.p-login .login_content form input[type="email"]:focus,.p-login .login_content form input[type="password"]:focus { color:#272727;}
.p-login .login_content form input.form-control:focus{background:rgba(0, 0, 0, 0.45);color:#fff; border-color:#FAF3C9;}
.p-login .btn-default{background:none; color:#e2e2e2;border-radius: 0;height: 45px;font-size: 18px; width:100%; line-height:35px;background:#272727; font-weight:normal; text-transform:uppercase;}
.p-login .btn-default:hover,.btn-default:focus,.btn-default:active{background:#000!important; color:#fff!important;}
.p-login .login_content{max-width:500px; padding:0 25px 0; margin:0 auto; position: relative;}
.p-login .login_content h1::before,.p-login .login_content h1::after {height: 0;}
.p-login .slideshow-image {
  position: absolute;
  width: 100%;
  height: 100%;
  background: no-repeat 50% 50%;
  background-size: cover;
  -webkit-animation-name: kenburns;
  animation-name: kenburns;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 16s;
  animation-duration: 16s;
  opacity: 1;
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
}
.p-login footer {display:none;}


.p-login .alert-danger{ color:#fff;background-color: rgba(231,76,60,0.28);
border-color: rgba(231,76,60,0.48);padding: 13px 25px 8px 15px;border-radius: 0;font-size: 12px; margin-top:-40px;}

.p-login .login{background:#393b92;}
.p-login .login .nav_menu{background:rgba(26, 26, 26, 0.75); border:0;}
.p-login .login .left_col,
.p-login .nav-sm.p-login .container.body .col-md-3.left_col{display:none!important;}
.p-login .login .main_container .top_nav {margin-left: 0;}
.p-login .login h1{font-family: 'thaisans_neuesemi_bold'; font-size:22px; line-height:36px; font-weight:normal; letter-spacing:0; text-transform:uppercase; margin-bottom:30px; letter-spacing:5px; text-align:center;}
.p-login .login h1 span{font-size:39px; display:inline-block; letter-spacing:0;}
.p-login .login .nav_menu{min-height:55px;}
.p-login .logo_login{width:125px; margin:10px auto 13px;}
.p-login .login_content{text-shadow:none; text-align:left;}
.p-login .login_content form{ margin:0;}
.p-login .login_wrapper { margin:0; padding:0; top:auto; bottom:auto; max-width:100%;  width: 100%;  height: 100vh;position: absolute;z-index: 99;background:rgba(0, 0, 0, 0.15);}
.p-login .registration_form,.p-login .login_form { position:relative; top:inherit;right:0;}
.p-login .login_form{float: right;width: 44%;height:100%;border-left:1px solid rgb(255, 255, 255);background:#F7F6F1;z-index:999;}
.p-login .login .separator{color:#ccc;}
.p-login .login .separator p{font-size:12px; color:#6c6c6c;}
.p-login .login .pull-right{display:none;}
.p-login .login_content{padding:30px 50px; }
.p-login .login .logo_site{width:60px; margin:auto;}


.slideshow-image:nth-child(1) {
  -webkit-animation-name: kenburns-1;
  animation-name: kenburns-1;
  z-index: 3;
}

.slideshow-image:nth-child(2) {
  -webkit-animation-name: kenburns-2;
  animation-name: kenburns-2;
  z-index: 2;
}

.slideshow-image:nth-child(3) {
  -webkit-animation-name: kenburns-3;
  animation-name: kenburns-3;
  z-index: 1;
}

.slideshow-image:nth-child(4) {
  -webkit-animation-name: kenburns-4;
  animation-name: kenburns-4;
  z-index: 0;
}
 @-webkit-keyframes 
kenburns-1 {  0% {
 opacity: 1;
 -webkit-transform: scale(1.2);
 transform: scale(1.2);
}
 1.5625% {
 opacity: 1;
}
 23.4375% {
 opacity: 1;
}
 26.5625% {
 opacity: 0;
 -webkit-transform: scale(1);
 transform: scale(1);
}
 100% {
 opacity: 0;
 -webkit-transform: scale(1.2);
 transform: scale(1.2);
}
 98.4375% {
 opacity: 0;
 -webkit-transform: scale(1.21176);
 transform: scale(1.21176);
}
 100% {
 opacity: 1;
}
}
 @keyframes 
kenburns-1 {  0% {
 opacity: 1;
 -webkit-transform: scale(1.2);
 transform: scale(1.2);
}
 1.5625% {
 opacity: 1;
}
 23.4375% {
 opacity: 1;
}
 26.5625% {
 opacity: 0;
 -webkit-transform: scale(1);
 transform: scale(1);
}
 100% {
 opacity: 0;
 -webkit-transform: scale(1.2);
 transform: scale(1.2);
}
 98.4375% {
 opacity: 0;
 -webkit-transform: scale(1.21176);
 transform: scale(1.21176);
}
 100% {
 opacity: 1;
}
}
@-webkit-keyframes 
kenburns-2 {  23.4375% {
 opacity: 1;
 -webkit-transform: scale(1.2);
 transform: scale(1.2);
}
 26.5625% {
 opacity: 1;
}
 48.4375% {
 opacity: 1;
}
 51.5625% {
 opacity: 0;
 -webkit-transform: scale(1);
 transform: scale(1);
}
 100% {
 opacity: 0;
 -webkit-transform: scale(1.2);
 transform: scale(1.2);
}
}
@keyframes 
kenburns-2 {  23.4375% {
 opacity: 1;
 -webkit-transform: scale(1.2);
 transform: scale(1.2);
}
 26.5625% {
 opacity: 1;
}
 48.4375% {
 opacity: 1;
}
 51.5625% {
 opacity: 0;
 -webkit-transform: scale(1);
 transform: scale(1);
}
 100% {
 opacity: 0;
 -webkit-transform: scale(1.2);
 transform: scale(1.2);
}
}
@-webkit-keyframes 
kenburns-3 {  48.4375% {
 opacity: 1;
 -webkit-transform: scale(1.2);
 transform: scale(1.2);
}
 51.5625% {
 opacity: 1;
}
 73.4375% {
 opacity: 1;
}
 76.5625% {
 opacity: 0;
 -webkit-transform: scale(1);
 transform: scale(1);
}
 100% {
 opacity: 0;
 -webkit-transform: scale(1.2);
 transform: scale(1.2);
}
}
@keyframes 
kenburns-3 {  48.4375% {
 opacity: 1;
 -webkit-transform: scale(1.2);
 transform: scale(1.2);
}
 51.5625% {
 opacity: 1;
}
 73.4375% {
 opacity: 1;
}
 76.5625% {
 opacity: 0;
 -webkit-transform: scale(1);
 transform: scale(1);
}
 100% {
 opacity: 0;
 -webkit-transform: scale(1.2);
 transform: scale(1.2);
}
}
@-webkit-keyframes 
kenburns-4 {  73.4375% {
 opacity: 1;
 -webkit-transform: scale(1.2);
 transform: scale(1.2);
}
 76.5625% {
 opacity: 1;
}
 98.4375% {
 opacity: 1;
}
 100% {
 opacity: 0;
 -webkit-transform: scale(1);
 transform: scale(1);
}
}
@keyframes 
kenburns-4 {  73.4375% {
 opacity: 1;
 -webkit-transform: scale(1.2);
 transform: scale(1.2);
}
 76.5625% {
 opacity: 1;
}
 98.4375% {
 opacity: 1;
}
 100% {
 opacity: 0;
 -webkit-transform: scale(1);
 transform: scale(1);
}
}
@media (max-width:991px){
.p-login .login_content{ max-width:100%;}
.p-login .login_form{width:100%;}
.p-login .box-login{width:95%; max-width:400px; min-height:380px; height:auto; margin:auto;}
.p-login .slideshow{display:none;}
.p-login{ background-size: auto 100%;}
.p-login .login_content h1{margin-bottom:15px;}
.p-login .btn {margin: 10px auto !important;}
.p-login .alert-danger{margin-top:-50px;background-color: rgba(231,76,60,1);}
}
@media (max-width:560px){
.p-login .box-login{width:95%; max-width:300px;}
.p-login .login_content{padding: 30px 15px;}
}
