.page-content {width: 100%;height:100vh;margin:  0 auto;background-image: -moz-linear-gradient( 136deg, rgb(0,158,253) 0%, rgb(42,245,152) 100%);background-image: -webkit-linear-gradient( 136deg, rgb(0,158,253) 0%, rgb(42,245,152) 100%);background-image: -ms-linear-gradient( 136deg, rgb(0,158,253) 0%, rgb(42,245,152) 100%);display: flex;display: -webkit-flex;justify-content: center;-o-justify-content: center;-ms-justify-content: center;-moz-justify-content: center;-webkit-justify-content: center;align-items: center;-o-align-items: center;-ms-align-items: center;-moz-align-items: center;-webkit-align-items: center;}
.form-area {margin: auto;display: flex;background: #fff;border-radius: 20px;box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);-webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);-moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);-ms-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);-o-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);}
.form-left {display: flex;flex-direction: column;align-items: center;justify-content: center;background: #0594c0;padding: 20px;}
.form-left img {border-top-left-radius: 8px;border-bottom-left-radius: 8px;}
.form-left .img-frame img{max-height:50px; margin-bottom: 40px;}
.form-right {min-height: 540px;padding:30px 30px 30px 20px;position: relative;border-top-right-radius: 8px;border-bottom-right-radius: 8px;}
.form-right .tab {margin: 15px 0 48px;width: 100%;display: flex;display: -webkit-flex;justify-content: space-between;-o-justify-content: space-between;-ms-justify-content: space-between;-moz-justify-content: space-between;-webkit-justify-content: space-between;}
.form-right .tab .tab-inner {width: 100%;}
.form-right .tab .tablinks {background: transparent;border: none;outline: none;-o-outline: none;-ms-outline: none;-moz-outline: none;-webkit-outline: none;font-size: 22px;font-weight: 600;color: #000;padding-bottom: 22px;border-bottom: 3px solid #ccc;width: 100%;}
.form-right .tab .tablinks.active {font-weight: 600;color: #0594c0;border-bottom: 3px solid #0594c0;}
.form-right .form-detail {padding:  0 0px;}
.form-right .form-row {width: 100%;position: relative;}
.form-right .form-row .form-row-inner {position: relative;width: 100%;}
.form-right .form-row .form-row-inner .label {position: absolute;top: -2px;left: 10px;font-size: 18px;color: #000;font-weight: 400;transform-origin: 0 0;transition: all .2s ease;-moz-transition: all .2s ease;-webkit-transition: all .2s ease;-o-transition: all .2s ease;-ms-transition: all .2s ease;}
.form-right .form-row .form-row-inner .border {position: absolute;bottom: 31px;left: 0;height: 1px;width: 100%;background: #53c83c;transform: scaleX(0);-moz-transform: scaleX(0);-webkit-transform: scaleX(0);-o-transform: scaleX(0);-ms-transform: scaleX(0);transform-origin: 0 0;transition: all .15s ease;-moz-transition: all .15s ease;-webkit-transition: all .15s ease;-o-transition: all .15s ease;-ms-transition: all .15s ease;}
.form-right .form-detail .input-text {margin-bottom: 31px;}
.form-right .form-detail input {width: 100%;padding: 0px 10px 15px 10px;border: 1px solid transparent;border-bottom: 1px solid;border-bottom-color: rgba(0, 0, 0, 0.2);background: transparent;appearance: unset;-moz-appearance: unset;-webkit-appearance: unset;-o-appearance: unset;-ms-appearance: unset;outline: none;-moz-outline: none;-webkit-outline: none;-o-outline: none;-ms-outline: none;font-size: 16px;color: #000;font-weight: 300;box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;-o-box-sizing: border-box;-ms-box-sizing: border-box;}
.form-right .form-detail .form-row .input-text:focus{border-bottom: 1px solid #0594c0;background: transparent;}
.form-right .form-detail .form-row .input-text:focus + .label, 
.form-right .form-detail .form-row .input-text:valid + .label {transform: translateY(-26px) scale(1);-moz-transform: translateY(-26px) scale(1);-webkit-transform: translateY(-26px) scale(1);-o-transform: translateY(-26px) scale(1);-ms-transform: translateY(-26px) scale(1);}
.form-right .form-detail .form-row .input-text:focus  + .border, 
.form-right .form-detail .form-row .input-text:valid  + .border {transform: scaleX(1);-moz-transform: scaleX(1);-webkit-transform: scaleX(1);-o-transform: scaleX(1);-ms-transform: scaleX(1);}
.form-right .form-detail .register {background: #0594c0;border-radius: 5px;-o-border-radius: 5px;-ms-border-radius: 5px;-moz-border-radius: 5px;-webkit-border-radius: 5px;width:100%;border: none;margin: 5px 0 10px 0px;cursor: pointer;color: #fff;font-weight: 600;font-size: 18px;}
.form-right .form-detail .register:hover {background: #ea4458;}
.form-right.form-detail .form-row-last input {padding: 11px;}
.fg-pswd{color: #8c8c8c;}
.fg-pswd:hover{color: #0594c0;}
.or-separator{margin-bottom: 20px;font-size: 16px;display: flex;align-items: center;text-align: center;}
.or-separator::before, .or-separator::after {width: 67px;flex: 1;content: "";border: 1px solid rgba(0, 0, 0, 0.2);}
.or-separator span {padding: 0 20px;color: #21121f;}
.btn-google{font-size: 16px; color: #000; border:1px solid #ccc; border-radius: 5px; padding: 10px 40px; width: 100%;}
.btn-google:hover{color: #0594c0;}
.btn-google img{width: 20px; margin-right: 10px;}
.register-account{margin: 30px 0 0;font-size: 12px;}
.register-account span{font-size: 12px;}
.register-account a{text-decoration: none; color: #ea4458;}
.form-right h2{font-size: 22px; font-weight: 600;}
.form-right h5{color:#0594c0;}

/* Responsive */
@media screen and (max-width: 991px) {
.form-area {transform: translateY(100px);margin: 180px 20px;flex-direction:  column;-o-flex-direction:  column;-ms-flex-direction:  column;-moz-flex-direction:  column;-webkit-flex-direction:  column;}
/*.form-area .form-left {width: 100%;}*/
.form-area .form-left img {width: 100%;border-bottom-left-radius: 0px;border-top-right-radius: 8px;}
.form-area .form-left .img-frame img{width: 100%;}
.form-right .form-right {width: auto;border-top-right-radius: 0;border-bottom-left-radius: 8px;}
.form-right .tab {margin-top: 45px;}
.form-right .form-detail .register {margin-bottom: 20px;}
.btn-google{padding: 10px 24px;}
}

@media screen and (max-width: 767px) {
.bnr-img{display: none;}
.form-area .form-left .img-frame img{margin-bottom: 0;}
.form-right {padding: 30px;}
}

@media screen and (max-width: 325px) {
.form-right .tab {flex-direction: column;-o-flex-direction: column;-ms-flex-direction: column;-moz-flex-direction: column;-webkit-flex-direction: column;}
}