@import url("https://fonts.googleapis.com/css?family=Oswald:300,400,700|Roboto:300,300i,400,400i,500,500i,700,700i");

/*#region Master*/

:root {
    --bg-gray: #eaeaea;
    --blue: #234f7d;
    --teal: #008690;
    --black-text: #353535;
}

html, body, form, .container-fluid {
    height: 100%;
}

.brainwave-logo {
    max-width: 200px;
}

body {
    background-color: var(--bg-gray);
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-weight: 400;
}

a, input {
    outline: 0;
    text-decoration: none;
    transition: all 200ms linear 0s;
}

    a:hover {
        text-decoration: none;
    }

    /* Change Autocomplete styles in Chrome*/
    input:-webkit-autofill,
    input:-webkit-autofill:hover,
    input:-webkit-autofill:focus,
    textarea:-webkit-autofill,
    textarea:-webkit-autofill:hover,
    textarea:-webkit-autofill:focus,
    select:-webkit-autofill,
    select:-webkit-autofill:hover,
    select:-webkit-autofill:focus {       
        -webkit-text-fill-color: var(--black-text);
        -webkit-box-shadow: 0 0 0px 1000px #000 inset;
        transition: background-color 5000s ease-in-out 0s;
    }

.form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-select ~ label {
    opacity: 1;
    color: var(--blue);
}

.form-floating > .form-control-plaintext ~ label, .form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-select ~ label {
    transform: scale(.85) translateY(-.5rem) translateX(-.15rem);
}

.modal-loading {
    position: fixed;
    z-index: 1020;
    height: 100%;
    width: 100%;
    top: 0;
    background-color: Black;
    opacity: 0.85;
    -moz-opacity: 0.85;
}


#Progress {
    position: fixed;
    width: 64px;
    height: 64px;
    text-align: center;
    z-index: 1021;
    top: 40%;
    margin: 0 auto;
    display: flex;
    left: 0;
    right: 0;
    color: #fff;
}

.form-control:focus, .form-select:focus {
    box-shadow: unset;
}

.form-floating > label {
    color: var(--black-text);
    padding-top: 1.8rem;
}

.form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-select ~ label {
    color: var(--blue);
}

.form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-select ~ label {
    opacity: 1;
}

.text-interPOS-Black
{
    color:var(--black-text)!important;
}

/*#endregion*/

/*#region Header */

.header {
    padding: 20px 12px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    color: #fff;
}

    .header a, .header label {
        font: 400 14px "Roboto", sans-serif;
        color: var(--black-text);
        padding: 0;
        display: inline-block;
    }

        .header a:hover, .header a:focus {
            color: var(--blue);
        }

    .header .sign-up-btn {
        display: inline-block;
        border: 1px solid var(--black-text);
        border-radius: 5px;
        padding: 10px 15px 10px 15px;
        position: relative;
        margin-left: 10px;
    }

        .header .sign-up-btn:hover {
            border: 1px solid var(--blue);
        }

/*#endregion */

/*#region Login*/

.login {
    font-family: "Roboto", sans-serif;
    padding: 40px 0;
    min-height: calc(100% - 136px);
}

    .login .form-floating .form-control {
        background-color: transparent;
        border: none;
        color: var(--black-text);
        border-bottom: 1px solid var(--black-text);
        border-radius: 0px;
        height: calc(4.2rem + calc(var(--bs-border-width) * 2));
        padding-top: 2.5rem;
        padding-bottom: .625rem;
        box-shadow: unset;
    }

        .login .form-floating .form-control:focus {
            background-color: transparent;
            color: var(--black-text);
        }

    .login .form-select {
        background-color: transparent;
        border: unset;
        border-radius: 0;
        border-bottom: 1px solid var(--black-text);
    }

    .login .form-floating .form-select {
        height: calc(4.2rem + calc(var(--bs-border-width) * 2));
        padding-top: 2.5rem;
        padding-bottom: .625rem;
    }

    .login .form-floating .form-control.is-invalid {
        border-bottom-color: #dc3545;
        background-position: right calc(.375em + .1875rem) bottom calc(0.95em);
    }

    .login .invalid-feedback {
        color: #dc3545;
    }

    .login .login-btn {
        background-color: var(--blue);
        color: #fff;
        font-size: 16px;
        text-align: center;
        text-decoration: none;
        display: block;
        position: relative;
        padding: 10px;
        margin-top: 20px;
        border-radius: 5px;
        width: 100%;
        border: unset;
        margin-bottom: 30px;
    }

        .login .login-btn:hover {
            background-color: var(--teal);
            color: white;
            transition: all 0.3s ease-in-out;
        }


/*#endregion*/

/*#region Manager Login Page*/

.authorization-label {
    text-align: center;
}

    .authorization-label label {
        font-size: 20px;
        font-weight: bold;
        color: #353535;
    }

/*#endregion*/

/*#region  Footer */

#footer .copyright_area {
    background: var(--bg-gray);
    font: 400 14px/40px "Roboto", sans-serif;
    color: var(--black-text);
    text-align: center;
    padding: 8px 15px;
    border-top: 1px solid var(--black-text);
}

    #footer .copyright_area a {
        font-weight: 700;
        font-size: 14px;
        text-transform: uppercase;
        color: var(--blue);
    }

        #footer .copyright_area a:hover, .footer .copyright_area a:focus {
            color: var(--teal);
            text-decoration: none;
        }

/*#endregion */










/* MD Breakpoint (tablets, 768px and up) */
@media (min-width: 768px) {

    /*#region Login */

    .login {
        padding: 35px 0;
    }

    /*#endregion*/

}

/* LG Breakpoint (tablets, 992px and up) */
@media (min-width: 992px) {
}

/* Normal Screen 17 Inch Square ( (Resolution 1280x1024 ) 1263px and up) */
@media (min-width: 1263px) {

    /*#region Master */

    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 940px;
    }

    /*#endregion */

}

/* Normal Screen 18 Inch - 19 Inch ( (Resolution 1366x768 ) 1349px and up) */
@media (min-width: 1349px) {

    /*#region Master */

    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 980px;
    }

    /*#endregion */

}

/*Adelia laptop small screen size high resolution ( (Resolution 1920x1080), 1500px and up) */
@media (min-width: 1440px) {
}

/*22inch ( (Resolution 1600x900), 1600px and up) */
@media (min-width: 1600px) {

    /*#region Master */

    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1150px;
    }

    /*#endregion */

}

/*Extra Large Screen 23 Inch ( (Resolution 1920x1080 ) 1800px and up) */
@media (min-width: 1800px) {

    /*#region Master */

    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1320px;
    }

    /*#endregion */

}

/*Extra Large Screen 27 Inch ( (Resolution 2560x1440 ) 2560px and up) */
@media (min-width: 2560px) {

    /*#region Master */

    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1620px;
    }

    /*#endregion */

}