.login-modal {

    padding: 100px 0px;

    @media(min-width: 992px) {

        padding: 134px 0px;

    }

}

.close {

    background-image: url('../images/circle-xmark.svg');

    background-repeat: no-repeat;

    background-position: 100% 100%;

    font-size: 9px;

    text-shadow: 0 1px 0 black;

    opacity: unset;
    
    width: 40px;

    height: 40px;

}

.email-phone, .password, .units {

    color: #000;

    font: normal 400 18px/26px DMSans-Regular;

    text-transform: capitalize;

    margin-bottom: 9px;

}

.login-modal .form-group {

    margin-bottom: 16px;

}

.login-modal .form-control, #forgotpassword .form-control {

    color: #666;

    font: normal 400 14px/26px DMSans-Regular;

    text-transform: capitalize;

    max-width: 440px;

    min-height: 55px;

    padding-left: 23px;

}

.login-modal .form-control:focus, #forgotpassword .form-control:focus{

    color: #666;

    font: normal 400 14px/26px DMSans-Regular;

    text-transform: capitalize;

    padding-left: 23px;

}

.forgot {

    color: #6A6A6A;

    font: normal 400 14px/normal DMSans-Regular;

    margin-bottom: 16px;

    cursor: pointer;

}

.forgot-heading {

    color:#000;

    font: normal 500 20px/normal DMSans-medium;

    margin-bottom: 20px;

}

.signin {

    background: #F45500;

    padding: 8px 71px;

    max-width: 440px;

    margin-bottom: 23px;

}

.signin-btn {

    color: #FFF;

    font: normal 500 18px/normal DMSans-medium;

    text-transform: capitalize;

}

.signin-btn:hover, .signin-btn:focus {

    color: #FFF;

    outline: 0;

    box-shadow: none;

}

.account {

    color: #6A6A6A;

    font: normal 400 16px/normal DMSans-Regular;

}

.signup {

    color: #1B2767;

    font: normal 500 16px/normal DMSans-medium;

    text-decoration: none;

}

.signup:hover {

    text-decoration: underline;

}

.come-from-modal.left .modal-dialog,

.come-from-modal.right .modal-dialog {

    position: fixed;

    margin: auto 0px;

    width: 100%;

    height: 100%;

    -webkit-transform: translate3d(0%, 0, 0);

    -ms-transform: translate3d(0%, 0, 0);

    -o-transform: translate3d(0%, 0, 0);

    transform: translate3d(0%, 0, 0);

    @media (min-width: 992px) {

        width: 730px;

        margin: auto;

    }

}

.come-from-modal.left .modal-content,

.come-from-modal.right .modal-content {

    overflow-y: auto;

    border-radius: 0px;
    height: 100%;

}

.come-from-modal.left .modal-body,

.come-from-modal.right .modal-body {

    padding: 15px 15px 80px 20px;

}

.come-from-modal.right.fade .modal-dialog {

    right: 0px;

    -webkit-transition: opacity 0.3s linear, right 0.3s ease-out;

    -moz-transition: opacity 0.3s linear, right 0.3s ease-out;

    -o-transition: opacity 0.3s linear, right 0.3s ease-out;

    transition: opacity 0.3s linear, right 0.3s ease-out;

}



.come-from-modal.right.fade.in .modal-dialog {

    right: 0;

}

.modal-dialog {

    overflow-x: hidden;

    overflow-y: auto;

    @media (min-width: 992px) {

        max-width: 900px;

    }

}

  .modal-content {

    border: none;

    border-radius: 2px;

    box-shadow: 0 16px 28px 0 rgba(0,0,0,0.22),0 25px 55px 0 rgba(0,0,0,0.21);

  }

  .modal-header{

    border-bottom: 0;

    padding: 48px 48px 0px 26px;

  }

.modal-body{

    border-bottom: 0;

    padding: 5px 26px 10px 26px;

    max-width: 440px;

}

.modal-footer {

    border-top:0;

    padding: 0px 26px 26px 26px;

}