:root {
    --main-bg-color: #f00a0f;
}
body.login {
    background: #f2f2f2;
    
}
.log_bck {
    position: relative;
    width: 50%;
    height: 100vh;
    /*height:auto;*/
    overflow: hidden;
}

.xtu {
    position: absolute;
    width: 80%;
    top: 50%;
    left: 50%;
    text-align: right;
    transform: translate(-50%,-50%);
}
.log_bck img{
    width: 100%;
}
.ca_img img {
    width: 50%;
}
.log_bck:before {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #023E62;
    z-index: 0;
    content: "";
    opacity: 0.5;
}
.log_p p {
    color: #fff;
}
.ca_img {
    border-bottom: 2px solid #fff;
    margin-bottom: 20px;
    padding-bottom: 10px;
}
.ca_login {
    display: flex;
    /*align-items: center;*/
    justify-content: flex-start;
}


.sec_batrt {
    border: 0px solid;
    width: 50%;
    margin: auto;
    padding: 100px;
    /*height:100vh;*/
    height:auto;
    overflow:scroll;
}
.register .sec_batrt{
    padding: 80px 100px;
}
.sec_batrt p {
    text-align: left;
        color: #b5b5b5;
}
.forgot .bt-frm {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.btn-submit {
        background: var(--main-bg-color);
        color: #fff;
        border-radius: 0;
        padding: 14px 12px;
        border: 0;
        width: 130px;
        font-size: 18px;
        font-weight: 600;
        border-radius: 5px;
        box-shadow: 0 0 6px 2px #b5b5b5;
}
.forgot .btn-submit{
    margin-left:10px;
}
button.btn.btn-go {
    background: #b5b5b5;
    color: #454545;
    border-radius: 0;
    padding: 10px 12px;
    border: 0;
    width: 100px;
    font-size: 14px;
    font-weight: 600;
    margin-right:10px;
}
.frm_cnt img {
    position: relative;
    left: 12px;
    top: 0px;
}
.frm_cnt .spe_img{
    top: -4px;
}
.frm_cnt {
    margin: 20px 0px;
    box-shadow: 0 0 7px 2px #b5b5b5;
    width: 80%;
    position:relative;
    border-radius: 5px;
}

.frm_cnt input {
    width: 80%;
    padding: 17px;
    background: transparent;
    border-width: 0;
    height: 65px;
}
.frm_cnt select {
    border: 0;
    background: transparent;
    width: 100%;
    padding: 17px;
}
p.frgt {
    margin: 30px 0px;
    color: #00B7CC;
    font-size: 15px;
}

.sgnup {
    margin: 30px 0px;
}

.sgnup p {
    color: #b5b5b5;
}

span.clor {
    color: #00B7CC;
    font-weight: 600;
    position: relative;
    left: 14px;
    font-size: 15px;
}
input:focus{
    outline:none;
}
select:focus{
    outline:none;
}
.bay_img h2{
        margin: 0;
}

.frm_cnt:before {
    content: "";
    position: absolute;
    width: 6px;
    height: 100%;
    background: #fff;
    left: -25px;
    opacity: 0;
    animation:dfd1 600ms;
}
.frm_cnt.change:before{
    opacity: 1;
    animation:dfd 600ms;
    left:0;
     background: #FFC107;
}
@keyframes dfd{
    0%{opacity:0;left:-25px;}
    100%{opacity:1;left:0;}
}
@keyframes dfd1{
    0%{opacity:1;left:0px;background: #FFC107;}
    100%{opacity:0;left:-25px;}
}
.bt-frm {
    text-align: right;
    width: 80%;
}
@media(max-width:768px){
    .ca_login {
    flex-direction: column;
}
.ca_login {
    flex-direction: column;
}
.log_bck{
    width: 100%;
    height: auto;
}
.sec_batrt {
    width: 100%;
    padding: 10px !important;
}
.frm_cnt{
    width:100%;
}
}