* {
    margin: 0;
    box-sizing: border-box;
}

.login_area {
    height: 100vh;
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Chrome */
    display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
    justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -webkit-box-align: center;
    background-image: url('../../img/investors-bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
}

.top_brand {
    position: absolute;
    top: 32px;
    right: 32px;
}

.left_top_brand {
    position: absolute;
    top: 32px;
    left: 32px;
}

.inner_login_area {
    position: relative;
}

.login_content {
    width: 350px;
    max-width: 100%;
    border-radius: 20px;
    padding: 10px 10px 50px;
    box-shadow: 1px 1px 7px #f1f2f3;
    position: relative;
    background: #fff;
    font-family: 'Montserrat', sans-serif;
    /*margin-top: 100px;*/
}

.login_form {
    padding: 20px 30px 50px;
    background: #fff;
    z-index: 1;
}

.login_form .brand img{
max-width: 200px;
}


.title {
    margin-bottom: 30px;
    text-align: center;
    font-size: 24px;
    font-weight: 400;
}

.fa-envelope, .fa-key {
  position: absolute;
  top: 50%;
  transform: translateY(-50%) !important;
  left: 4%;
  border-right: 1px solid #7f2a85;
  padding-right: 10px;
  color: #696969;
  font-size: 28px;
}

.fa-sign-in {
    font-size: 22px;
    color: #fff;
    font-weight: 600;
    position: absolute;
    left: 28%;
    top: 50%;
    transform: translateY(-50%) !important;
}

.email_area, .password_area {
    position: relative;
    margin-bottom: 20px;
}

  .email_area input, .password_area input {
    width: 100%;
    height: 50px;
    box-shadow: 2px 2px 5px #e9e8e8, -2px -2px 5px #e9e8e8;
    border-radius: 10px;
    background: #fff;
    border: none;
    padding-left: 50px;
    border-left: 3.5px solid #7f2a85;
  }

        .email_area input:focus, .password_area input:focus {
            outline: none;
        }

.login_btn {
    text-align: center;
}


    .login_btn a {
        text-decoration: none;
        background: linear-gradient(320deg, rgba(220,159,61,0.8), rgba(165,96,116,1));
        color: #fff;
        font-weight: 500;
        display: inline-block;
        width: 100%;
        padding: 12px 0;
        border-radius: 12px;
        position: relative;
        cursor: pointer;
        border: 1px solid #eeb21e;
        font-weight: 600;
        font-size: 20px;
    }
        .login_btn a:hover {
            background: #a56074;
            transition:0.5s ease-in-out;
        }

        .login_logo_area {
            display: none;
            position: absolute;
            top: -15%;
            left: 0%;
            transform: translate(-50%, 5%);
            z-index: 0;
        }

.errorMsg {
    color: red;
    font-size: 12px;
    padding-top: 5px;
    padding-bottom: 5px;
    display: block;
}

.brand {
    text-align: center;
    margin-bottom: 25px;
    /* position: absolute;
            top: 20px;
            left: 20px; */
}

.left_top_brand img, .top_brand img {
    max-width: 200px;
}

@media (max-width: 1680px) {
    /* .login_logo_area{
                top: 0;
            } */
}

@media (max-width: 1039px) {
    /* .login_logo_area{
                top: 0;
            } */

    .top_brand {
        left: unset;
        right: 32px;
    }
}

@media (max-width: 991px) {
    /* .login_logo_area{
                left: 33%;
            } */
}

@media (max-width: 767px) {
    .top_brand {
        left: 50%;
        right: unset;
        top: 16px;
        transform: translateX(-50%);
    }

        .top_brand img {
            max-width: 130px;
        }

    .login_content {
        margin-top: 100px;
    }

    .login_logo_area {
        left: 50%;
        transform: translateX(-50%);
        top: -15px;
    }

        .login_logo_area img {
            max-width: 150px;
        }

    .login_form {
        padding: 20px 16px 50px;
    }
}

@media (max-width: 360px) {
    .login_content {
        width: 310px;
    }
}