@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap');


@media screen and (min-width: 1024px){
    body{
        font: 16px "Lato", sans-serif;
        display: flex;
        background: #00041D;
        margin: 0px;
    }
    body::before{
        margin-top: 120px;
        content: '';
        position: absolute;
        inset: 0;
        z-index: -1;
        background: linear-gradient(180deg, #00041D, rgb(193, 0, 170));
        height: 350px;
    }
}

@media screen and (min-width: 1024px){
    .mb-3{
        font-size: 20px;
        margin: 20px;
    }
    .login_body{
        display: block;
      }
}

@media screen and (min-width: 1024px){
    .form_bk_login{
        width: 25%;
    }

    .form{
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 60vh;
    }

    .form_bk_login:hover{
        box-shadow: 0px 0px 80px 20px rgba(255, 255, 255, 0.106);
        scale: 1.007;
        border: 2px solid rgba(255, 255, 255, 0.336);
    }
}

@media screen and (min-width: 1024px){
    .logo_img{
        width: 150px;
    }
}

@media screen and (min-width: 1024px){

    .headline{
        font-size: 18px;
        padding-top: 20px;
    }
    .headline_login{
        font-size: 30px;
        padding-top: 160px;
    }
}

@media screen and (min-width: 1024px){
    .mb-3 .form-control{
        border: 2px solid #ffffff32;
        margin-top: 8px;
        margin-bottom: 5px;
        font-size: 20px;
        padding: 5px;
    }

    .mb-3 input[type=text]:focus {
        border: 2px solid #FFFFFFB3;
    }
    .mb-3 input[type=password]:focus {
        border: 2px solid #FFFFFFB3;
    }
    .mb-3 input[type=tel]:focus {
        border: 2px solid #FFFFFFB3;
    }
    .mb-3 textarea[type=text]:focus {
        border: 2px solid #FFFFFFB3;
    }
    .mb-3 .us[type="text"]:focus{
        border: 2px solid #ffffff11;
    }
}

@media screen and (min-width: 1024px){
    .chek{
        width: 18px;
        height: 18px;
        margin: 10px;
        cursor: pointer;
    }
}

@media screen and (min-width: 1024px){
    .showps label{
        font-size: 18px;
    }
}

@media screen and (min-width: 1024px){
    .btn{
        font-size: 20px;
        margin-left: 10px;
        margin-right: 10px;
        margin-top: 20px;
        margin-bottom: 20px;
        cursor: pointer;
    }
    .btn:hover{
        background-color: #000000;
        color: rgb(255, 255, 255);
        box-shadow: #ffffff 0px 0px 5px;
    }
}

@media screen and (min-width: 1024px){
    .fail{
        font-size: 18px;
    }
    .success{
        font-size: 18px;
    }
}

@media screen and (min-width: 1024px){
    .main_top_menu{
        width: 100%;
        height: 120px;
        display: flex;
        align-items: center;
    }

    .menu_logo{
        width: 25%;
        height: 110px;
        display: flex;
        align-items: center;
        justify-content: end;
        cursor: pointer;
    }
    .menu_logo img{
        width: 110px;
        height: 110px;
        margin-right: 80px;
    }

    .menu_items{
        width: 75%;
        height: 110px;
        display: flex;
        align-items: center;
        justify-content: end;
        padding-right: 30px;
    }
    .menu_items lable{
        color: rgb(255, 255, 255);
        font-family: arial,Sans-serif;
        font-size: 16px;
        cursor: pointer;
        transition: 0.4s;
        padding: 26px;
        border-bottom: 2px solid #ceaa5b00;
        padding-bottom: 20px;
    }
    .menu_items lable:hover{
        color: #CEAA5B;
        border-bottom: 2px solid #CEAA5B;
        padding-bottom: 26px;
    }
    .menu_items a{
        text-decoration: none;
    }
}