body{
    margin: 0;
    font-family: 'Poppins',sans-serif;
}

section{
    position: relative;
    width: 100%;
    height: 97vh;
    display:flex;
}

section .imgBx{
    position: relative;
    width: 90%;
    height: 100%;
}



section .imgBx:before{
   content : '';
   position : absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   /*background: linear-gradient(225deg,#e91e63,#03a9f4);*/
   z-index: 1;
   mix-blend-mode:screen;
}

section .imgBx img{
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section .contentBx{
    display:flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    height:100%;
}

section .contentBx .formBx{
   width: 50%; 
}

section .contentBx .formBx h2{
   color: #607d8b;
   font-weight: 600;
   font-size: 1.5em;
   text-transform: uppercase;
   margin-bottom:20px;
   border-bottom:4px solid #01b7c5;
   display: inline-block;
   letter-spacing: 1px;
}

section .contentBx .formBx .inputBx{
   margin-bottom: 20px;
}

section .contentBx .formBx .inputBx span{
   font-size: 16px;
   margin-bottom: 5px;
   display: inline-block;
   color: #607db8;
   font-weight: 300;
   font-size: 16px;
   letter-spacing:1px;
}

section .contentBx .formBx .inputBx .ValidationSummary{
   font-size: 16px;
   margin-bottom: 5px;
   display: inline-block;
   color: red;
   font-weight: 300;
   font-size: 16px;
   letter-spacing:1px;
}

section .contentBx .formBx .inputBx input{
    width: 100%;
    padding: 10px 20px;
    outline: none;
    font-weight: 400;
    border: 1px solid #607d8b;
    font-size: 16px;
    letter-spacing:1px;
    color: #607d8b;
    background: transparent;
    border-radius: 30px;
}


    section .contentBx .formBx .inputBx .input-box {
        background: #fff;
        width: 90%;
        max-width: 500px;
        border-radius: 5px;
        padding: 10px 20px;
        margin: 0px auto;
        display: flex;
    }



        section .contentBx .formBx .inputBx .input-box input[id="Password"] {
            width: 100%;
            padding: 10px 0;
            border: 0;
            outline: 0;
            font-size: 16px;
            color: #607d8b;
        }

        section .contentBx .formBx .inputBx .input-box img {
            width: 27px;
            cursor: pointer;
        }

section .contentBx .formBx .inputBx textarea {
    width: 100%;
    padding: 10px 20px;
    outline: none;
    font-weight: 400;
    border: 1px solid #607d8b;
    font-size: 16px;
    letter-spacing: 1px;
    color: #607d8b;
    background: transparent;
    border-radius: 10px;
}

    section .contentBx .formBx .inputBx input[type="submit"]  {
        background: #01b7c5;
        color: #fff;
        outline: none;
        border: none;
        font-weight: 500;
        cursor: pointer;
    }

        section .contentBx .formBx .inputBx input[type="submit"]:hover {
            background: #08c7d8;
        }

    section .contentBx .formBx .inputBx input[type="button"] {
        background: #01b7c5;
        color: #fff;
        outline: none;
        border: none;
        font-weight: 500;
        cursor: pointer;
    }

        section .contentBx .formBx .inputBx input[type="button"]:hover {
            background: #08c7d8;
        }

section .contentBx .formBx .inputBx input[name="forget"] {
    background: #01b7c5;
    color: #fff;
    outline: none;
    border: none;
    font-weight: 500;
    cursor: pointer;
}

section .contentBx .formBx .inputBx input[name="forget"]:hover {
    background: #08c7d8;
}

section .contentBx .formBx .inputBx input[name="submitbtn"] {
    background: #01b7c5;
    color: #fff;
    outline: none;
    border: none;
    font-weight: 500;
    cursor: pointer;
    text-align:center;
}

section .contentBx .formBx .inputBx input[name="submitbtn"]:hover {
    background: #08c7d8;
}

    section .contentBx .formBx .inputBx input[name="sendanswer"] {
        background: #01b7c5;
        color: #fff;
        outline: none;
        border: none;
        font-weight: 500;
        cursor: pointer;
        text-align: center;
    }

        section .contentBx .formBx .inputBx input[name="sendanswer"]:hover {
            background: #08c7d8;
        }

section .contentBx .formBx .inputBx input[name="createbtn"] {
    background: #42b72a;
    color: #fff;
    outline: none;
    border: none;
    font-weight: 500;
    cursor: pointer;
    text-align:center;
}

    section .contentBx .formBx .inputBx input[name="createbtn"]:hover {
        background: #00ed4f;
    }

    section .contentBx .formBx .inputBx input[name="cancelOTP"] {
        background: #42b72a;
        color: #fff;
        outline: none;
        border: none;
        font-weight: 500;
        cursor: pointer;
        text-align: center;
    }

        section .contentBx .formBx .inputBx input[name="cancelOTP"]:hover {
            background: #00ed4f;
        }





    @media screen and (max-width: 1024px) {
        section .imgBx {
        display: none;
    }

    section .contentBx {
        width: 100%;
    }
}