/* body 
{
background-image: url('https://i.imgur.com/MFUT1yB.png'), url('https://i.imgur.com/bUD6bnQ.png');
background-repeat: no-repeat, no-repeat;
background-size: auto, auto;
background-position: left top, right top;
} */

* {
    box-sizing:border-box;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

body {
    margin: 0px;
}

.container {
    position:absolute;
    height:100%;
    width:100%;
    top:0px;
    left:0px;
}

.bg-left {
    position:absolute;
    height:100%;
    right:65%;
    z-index:5;
}

.bg-right {
    position:absolute;
    top:0px;
    right:0px;
    z-index:5;
}

.bg-bottom-right {
    position: absolute;
    bottom: 0px;
    right: 0px;
    width: 360px;
    z-index: 5;
}

.login-container {
    position:absolute;
    height:800px;
    width:650px;
    z-index:10;
    margin-left:-325px;
    left:50%;
    margin-top:-400px;
    top:50%;
    border-radius: 30px;
    /* box-shadow: 0px 0px 25px #8c0c32; */
}

.bboss-logo {
    top: 50px;
    width: 100%;
    height: 200px;
    position: absolute;
    display:flex;
    justify-content:center;
    align-items:center;
}

.bboss-logo img {
    max-height: 130px;
}

.logo-text {
    width: 100%;
    height: 25px;
    top: 230px;
    position: absolute;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size: 24px;
    color: #1b2b69;
}

.line-break {
    left: 30%;
    height: 5px;
    width: 40%;
    background-color:#d8082c;
    position: absolute;
    top: 270px;
    border-radius: 5px;
}

.input-container {
    top: 325px;
    left: 20%;
    width: 60%;
    height: 90px;
    position: absolute;
}

.input-container:last-of-type {
    top:450px;
}

.input-label {
    position: relative;
    font-size: 18px;
    padding-bottom: 15px;
}

.input-container input {
    width: 100%;
    border-radius: 15px;
    height: 50px;
    background-color: #f7f7f7;
    border: 1px solid  grey;
    outline:none;
    padding-left: 25px;
    font-size: 26px;
    color: #1b2b69;
}

.input-container input:focus {
/* border: 1px solid grey; */
}

.button {
    top: 600px;
    color: white;
    font-size: 20px;
    background-color: #1b2b69;
    position:absolute;
    height: 50px;
    width: 200px;
    left: 50%;
    margin-left: -100px;
    border-radius: 15px;
    display:flex;
    justify-content:center;
    align-items:center;
}

.forgot {
    top: 655px;
    color: #d8082c;
    font-size: 14px;
    position:absolute;
    height: 50px;
    width: 400px;
    left: 50%;
    margin-left: -200px;
    border-radius: 15px;
    display:flex;
    justify-content:center;
    align-items:center;

}

@media only screen and (max-width: 600px) {
    body {
        overflow: hidden;
        height: 100%;
    }
    .bg-left {
        display: none;
    }
    .bg-right {
        display: none;
    }
    .bg-bottom-right {
        width: 100px;
        display:flex;
        justify-content:center;
        left: 50%;
        margin-left: -50px;
    }
  }

/* .logo {
    width: 50%;
    margin: 0 auto;
    margin-top: 40px;
}

.logo img {
    height: 150px;
}

.logoTitle {
    margin-top: 20px;

}

.bBossLogo img {
    height: 40px;
    width: 40px; */
/* } */
/* * {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 24px;
}
.loginBody {
    position:absolute;
    height:100%;
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
}
.loginContainer {
	width: 450px;
    height: 700px;
    background: rgb(36,34,195);
    background: linear-gradient(180deg, rgba(36,34,195,0.3701855742296919) 19%, rgba(253,45,45,0.3701855742296919) 100%);
	border-radius: 15px;
	position: absolute;
    -webkit-box-shadow: 0px 0px 35px  black;
    -webkit-padding: 3px;
}

.logoContainer {
    margin-top: 50px;
    height: 250px;
    position: relative;
    text-align: center;
    vertical-align: middle;
    line-height: 90px;  
    
}

.logoContainer img {
    margin-top: 25px;
    position: relative;
    height: 200px;
    width: 200px;
}

.logoHeader {
    color: white;
    text-align: center;
    position: relative;
    letter-spacing: 2px;
}

.emailLogin {
    display: inherit;
    margin-top: 75px;
    width: 100%;
    position: relative;
    text-align: center;

}

.emailLogin input {
    top: 25px;
    width: 66%;
    padding: 10px;
    margin: 0 auto;
    font-size:18px;
    outline: none;

}

.emailLogin input:focus {
    background-color:#dae8d8;
    outline: none;
    box-shadow:0px 0px 5px #6192D1;
    -webkit-box-shadow: 0px 0px 5px  #6192D1;
    -webkit-padding: 3px;
     
     border-width: 2px;
     border-color: transparent;
     border-style: inset;
   
    outline: 0;
}

.passwordLogin {
    margin-top: 25px;
    width: 100%;
    position: relative;
    text-align: center;

}

.passwordLogin input {
    top: 25px;
    width: 66%;
    padding: 10px;
    margin: 0 auto;
    font-size:18px;
    outline: none;
}

.passwordLogin input:focus {
    background-color: #dae8d8;
    outline: none;
    box-shadow:0px 0px 5px #6192D1;
    -webkit-box-shadow: 0px 0px 5px  #6192D1;
    -webkit-padding: 3px;
     
    border-width: 2px;
    border-color: transparent;
    border-style: inset;
}

.loginButton {
    width: 150px;
    height:50px;
    background-color:white;
    position: relative;
    float:left;
    margin-top:60px;
    display:flex;
    justify-content:center;
    align-items:center;
    border: 1px solid rgb(118, 118, 118);
    margin-left:-75px;
    left:50%;
    box-sizing:border-box;
    cursor:pointer;
}

.loginButton:hover {
    background-color: #bbf9bb;
}

.loginButton button {
    margin-top: 25px;
    padding: 12px;
} */