.loginLogo {
    padding-top: 100px;
    padding-left: 150px;
    height: 80vh;
}

/* Hide logo on screens smaller than 1000px */
@media (max-width: 999px) {
    .loginLogo {
        display: none;
    }

    .LogoContent {
        display: none; /* don't reserve empty space */
    }
}

/* Show logo on screens larger than or equal to 600px */
@media (min-width: 1000px) {
    .loginLogo {
        display: block; /* or use visibility: visible; */
    }

    .LogoContent {
        visibility: visible; /* or use visibility: hidden; */
    }
}
body, html {
    height: 100%;
    font-family: Arial, Helvetica, sans-serif;
    margin: 0px;
    /*overflow-y:hidden;*/
}

* {
    box-sizing: border-box;
}

.bg-img {
    /* The image used */
    background-image: url('Images/Login.jpg');
    /*background-image: url("Webpage.png");*/
    min-height: 100%;
    /* Center and scale the image nicely */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    /*position: relative;*/
}

.formbg1 {
    /* The image used */
    background-image: url("LGBG1.png");
    /* background-color: #BAD3E1; */
    /* Center and scale the image nicely */
    background-position: center;
    background-repeat: no-repeat;
    /*size: 100% 100%;*/
    /* background-size: cover; */
    /* position: relative; */
}
/* Add styles to the form container */
.container {
    position: absolute;
    background-image: url("loginform2.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    right: 0;
    /* margin: 10px; */
    max-width: 422px;
    max-height: 434px;
    padding: 180px 0px;
    /* background-color: white; */
}
/* Full-width input fields */
input[type=text], input[type=password] {
    width: 100%;
    padding: 10px;
    margin: 5px 0 10px 0;
    border: none;
    background: #f1f1f1;
}

    input[type=text]:focus, input[type=password]:focus {
        background-color: #ddd;
        outline: none;
    }

/* Set a style for the submit button */
.btn {
    background-color: #32A6DE;
    color: white;
    padding: 16px 20px;
    border: none;
    cursor: pointer;
    width: 100%;
    opacity: 0.9;
}

    .btn:hover {
        opacity: 1;
    }

#pic {
    background: url(pass.png) no-repeat scroll 7px 7px;
    padding-left: 50px;
}

#pic1 {
    background: url(user.png) no-repeat scroll 7px 7px;
    padding-left: 50px;
}

.loginContent1 {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 800px;
}

/* === Mobile sign-in (≤767px) === */
@media (max-width: 767px) {
    html, body {
        overflow-x: hidden;
        max-width: 100vw;
    }

    .bg-img {
        min-height: 100vh;
        padding: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: rgba(0,0,0,0.25);
        background-blend-mode: darken;
    }

    .loginContent {
        width: 100%;
        max-width: 100%;
        padding: 0;
    }

    /* Reset the absolute-positioned form for mobile so it sits naturally */
    form.container {
        position: static !important;
        right: auto !important;
        margin: 0 !important;
        max-width: 100% !important;
        max-height: none !important;
        padding: 24px 20px !important;
        background-image: none !important;
        background-color: rgba(255,255,255,0.95);
        border-radius: 14px;
        box-shadow: 0 12px 32px rgba(0,0,0,0.18);
    }

    form.container input[type=text],
    form.container input[type=password] {
        width: 100%;
        height: 48px;
        padding: 10px 14px 10px 50px;
        margin: 8px 0;
        border-radius: 10px;
        border: 1px solid #e5e7eb;
        background-color: #f7fafc;
        font-size: 16px; /* iOS no-zoom */
    }

    form.container input[type=text]:focus,
    form.container input[type=password]:focus {
        border-color: #32A6DE;
        background-color: #fff;
        box-shadow: 0 0 0 3px rgba(50,166,222,0.18);
    }

    form.container .btn {
        height: 48px;
        padding: 12px 20px;
        font-size: 16px;
        font-weight: 600;
        border-radius: 10px;
        margin-top: 14px !important;
    }
}