.content-login-regit {
    width: 100%;
    height: 800px;
    margin: 88px 0 0 0;
    background-color: #f8f8f8;
}

.content-login-regit .space-content{
    width: 100%;
    height: 100%;
}

.heder-is h3 {
    margin-bottom: 10px;
}

.container .body-content {
    display: grid;
    grid-template-columns: 50% 50%;
    height: 800px;
    
}

.body-content .logo-login{
    width: 100%;
    height: 100%;
}

.logo-login .contentlogo {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.contentlogo img{
    max-width: 50%;
}

.body-content .form-logregit {
    width: 60%;
    max-height: 80%;
    margin: auto;
    background-color: #ffffff;
    box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
    border-radius: 8px;
    padding: 20px;
}
.form-logregit form {
    width: 100%;
    height: 70%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    /* margin: auto; */
}

form .content-form {
    width: 100%;
    height: 80%;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
    /* gap: 30px; */
}

.content-form .forminput {
    width: 90%;
    height: 90px;

}

.isinput {
    width: 100%;
    height: 55px;
    border: 1px solid #ccc;
    border-radius: 6px;
    /* margin: auto; */
}

.isinput input{
    width: 100%;
    height: 100%;
    border: 0;
    padding: 15px;
    font-size: 1rem;
    border-radius: 6px;
    /* margin: 0 0 10px 0; */

}

.isinput input:focus,
.forminput-pass-detail input:focus{
    outline: none;
}

.content-form .forminput-password {
    width: 90%;
    height: 90px;   
}

.forminput-password .forminput-pass-detail{
    border-radius: 6px;
    border: 1px solid #ccc;
    width: 100%;
    height:55px;
    /* border: none; */
    display: flex;
}

.forminput-pass-detail.danger,
.forminput.danger .isinput{
    border: 1px solid rgb(255, 46, 46);
}

.forminput-pass-detail ~ .intextalert-pass,
.forminput .isinput .intextalert{
    visibility: hidden;
}

.forminput-pass-detail.danger ~ .intextalert-pass,
.forminput.danger .isinput .intextalert {
    visibility: visible;
    font-size: .9rem !important;
    color: rgb(255, 46, 46);
}

.forminput-pass-detail input{
    width: 85%;
    height: 100%;
    border: none;
    padding: 15px;
    border-radius: 6px 0 0 6px;
}

.forminput-pass-detail .eye-close {
    width: 15%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none !important;
    background-color: transparent !important;;
}

form .content-btn {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.content-btn .btn-sub{
    width: 90%;
    
}

.btn-sub button{
    width: 100%;
    height:45px;
    border: none;
    color: #fff;
    background-color: #1f80ff;
    border-radius: 6px;
}

.btn-sub .dis {
    opacity: 0.8;
}

/* .btn-sub button:hover{
    background-color: #183a66;
} */

.btn-sub button:disabled{
    cursor: not-allowed ;
}

.content-btn .text-is-alert {
    width: 90%;
    font-size: .9rem;
}

.text-is-alert .remember{
    cursor: pointer;
    color: #1f80ff;
}

.form-logregit .text-regitandlogin {
    width: 100%;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.text-regitandlogin .link-pages {
    color: #1f80ff;
    cursor: pointer;
}

.content-form .form-input-regis {
    width: 90%;
    height: 90px;
}

.content-form .form-input-regis.pass {
    height: 110px;
}

.form-input-regis .u_nameinput,
.form-input-regis .e_mailinput,
.form-input-regis .u_pass,
.form-input-regis .u_passsec{
    border-radius: 6px;
    border: 1px solid #ccc;
    width: 100%;
    height:55px;
    position: relative;
}

.u_nameinput.alerts,
.e_mailinput.alerts ,
.u_pass.alerts ,
.u_passsec.alerts {
    border: 1px solid rgb(255, 46, 46);
}

.u_nameinput .check-alert-uname,
.e_mailinput .check-alert-mail{
    position:absolute;
    right: 15px;
    top: 15px;
}

.u_nameinput input,
.e_mailinput input  {
    width: 100%;
    height: 100%;
    border-radius: 6px;
    border: none;
    padding: 15px;
}

.u_pass  input[type="password"],
.u_passsec input[type="password"]{
    width: 85%;
    height: 100%;
    border-radius: 6px 0 0 6px;
    border: none;
    padding: 15px;
}

.u_nameinput  input:focus,
.e_mailinput input:focus,
.u_pass input:focus,
.u_passsec input:focus{
    outline: none ;
}

.alert-passf {
    display: flex;
    flex-direction: column;
    /* align-items: center; */
    font-size: .78rem;
    padding: 0 0 0 10px;
    color: #858585;
    margin-top: 5px;
}

.alert-passsec,
.alert-email,
.alert-uname {
    font-size: .9rem;
    padding: 0 0 0 10px;
}

.check-alert-uname.suc ,
.check-alert-mail.suc ,
.text-p-alert.suc {
    color: #21d858;
}

.check-alert-uname.err ,
.check-alert-mail.err ,
.text-p-alert.err {

    color: #e42828;
}

.u_nameinput.alerts ~ .alert-uname ,
.e_mailinput.alerts ~ .alert-email ,
.u_passsec.alerts ~ .alert-passsec {
    color: #e42828;
}

@media (max-width:1024px) {
    .content-login-regit {
        margin: 65px 0 0 0;
    }
    .container .body-content {
        /* display: grid; */
        grid-template-columns: 100%;
        /* height: 800px;1 */
        
    }
    
    .body-content .logo-login{
        width: 100%;
        height: 100%;
        display: none;
    }
    .body-content .form-logregit {
        width: 100%;
        box-shadow: none;
        background-color: transparent;
    }
}