/* .createAccount__navbar {
    position: fixed;
}

.first__child {
    background-color: tomato;
    border-radius: 3px;
    padding: 2px 0px;
}

.section__main {
    width: 100%;
    height: 120vh;
    background-color: teal;
}
 */
    /* Background */
    
    #background__area {
        position: relative;
    }
    
    .main__back__div {
        display: flex;
        flex-direction: row;
    }
    
    .main__back__div .div__one {
        background-color: #F4F6F9;
        width: 50%;
        height: 100vh;
    }
    
    .main__back__div .div__two {
        background-color: #1C3B68;
        width: 50%;
        height: 100vh;
    }
    
    #create__page {
        width: 80%;
        height: 80vh;
        background-color: white;
        position: absolute;
        top: 10vh;
        left: 10%;
    }
    
    .main__create__area {
        display: flex;
        flex-direction: row;
        height: 100%;
    }
    
    .main__create__area .div__one__account {
        box-shadow: 0px 0px 30px #8b8a8a;
        background-color: #F4F6F9;
        width: 50%;
    }
    
    .main__create__area .div__two__account {
        box-shadow: 0px 0px 30px #131212;
        background-color: #1C3B68;
        background-image: url(../Images/signup_bagg.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        width: 50%;
    }
    
    .signup__content__background {
        background-color: white;
        position: absolute;
        top: 10vh;
        left: 10vw;
        padding: 30px;
    }
    
    .signup-heading {
        text-align: center;
        /* font-family: 'Roboto', sans-serif; */
        font-family: 'Baloo 2', cursive;
        margin-bottom: 2vh;
    }
    
    label {
        font-family: 'Baloo 2', cursive;
        font-size: 90%;
    }
    
    input {
        margin-bottom: 1vh;
        border: 1px solid rgb(209, 208, 208);
        border-radius: 3px;
        font-family: 'Baloo 2', cursive;
        padding-left: 5px;
        color: rgb(85, 84, 84);
    }
    
    input::placeholder {
        font-family: 'Baloo 2', cursive;
        font-size: 70%;
        padding: 0 0 0 20px;
        color: rgb(180, 179, 179);
    }
    
    .btn {
        margin-top: 2vh;
    }
    
    button {
        width: 48%;
        /* background-color: rgb(27, 27, 82); */
        border: none;
        border-radius: 3px;
        height: 30px;
    }
    
    .signup__confirm {
        background-color: rgb(204, 12, 44);
        color: white;
        cursor: pointer;
        font-size: 80%;
    }
    
    .signup__confirm:hover {
        background-color: rgb(116, 7, 25);
    }
    
    .signup__cancel {
        border: 2px solid rgb(204, 12, 44);
    }
    
    .signup__cancel a {
        text-decoration: none;
        color: rgb(204, 12, 44);
        background-color: npn;
        border-radius: 3px;
        height: 30px;
        font-size: 80%;
    }
    
    .signup__cancel:hover {
        background-color: rgb(204, 12, 44);
    }
    
    .signup__cancel a:hover {
        color: rgb(247, 245, 245);
    }
    /* img {
        width: 100%;
    } */
    
    .section__two__content {
        margin: 16vh 5vw 0 5vw;
        color: #c7c9ca;
        font-family: 'Baloo 2', cursive;
    }
    
    .section__two__content h2 {
        font-size: 120%;
        color: rgb(204, 202, 202);
        width: 90%;
        border-bottom: 2px solid gray;
        padding-bottom: 1vh;
        margin-bottom: 3vh;
    }
    
    .section__two__content p {
        font-size: 70%;
    }
    
    .section__two__content p a {
        font-size: 110%;
        margin: 0 5px;
        color: white;
        text-decoration: none;
    }
    
    .section__two__content p a:hover {
        color: rgb(204, 202, 202);
    }
    /* RESPONSIVE */
    
    @media screen and (max-width: 1100px) {
        .signup__content__background {
            background-color: white;
            position: absolute;
            top: 5vh;
            left: 5vw;
            padding: 30px;
        }
    }
    
    @media screen and (max-width: 901px) {
        .signup__content__background {
            background-color: white;
            position: absolute;
            top: 5vh;
            left: 2vw;
            padding: 30px;
        }
    }
    
    @media screen and (max-width:800px) {
        .main__create__area {
            display: flex;
            flex-direction: row;
            height: 100%;
        }
    }