@import url('https://fonts.googleapis.com/css2?family=DM+Sans&display=swap');

.field-icon {
    float: right;
    top: 50px;
    right: 50px;
    position: relative;
    color: #61CE70;
    z-index: 2;
}
body
 {
    height: 100%;
    background-color: #EDF2F5;
    font-family: DM Sans;
}
.rubik14 {
    font-family: DM Sans;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: -0.331034px;
}

.control-label {
    margin-left: -140px !important;
  }


.rubik20 {
    font-family: DM Sans;
    font-style: normal;
    font-size: 20px;
    letter-spacing: 0;
    line-height: 24px;
}

.rubik18 {
    font-family: DM Sans;
    font-style: normal;
    font-size: 18px;
    letter-spacing: 0;
    line-height: 22px;
}

.rubik16 {
    font-family: DM Sans;
    font-style: normal;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 22px;
}

.rubik12 {
    font-family: DM Sans;
    font-style: normal;
    font-size: 12px;
    letter-spacing: 0;
    line-height: 21px;
}

.fontlight {
    font-weight: 300;
}

.fontregular {
    font-weight: 400;
}

.fontmedium {
    font-weight: 500;
}

.fontbold {
    font-weight: 700;
}

.form-control::placeholder {
    color: #9b9b9b;
    opacity: 1;
}

.form-control::-ms-input-placeholder,
.form-control:-ms-input-placeholder {
    color: #9b9b9b;
}

.primary-button {
    width: 206px;
    height: 46px;
    /* color: #FFFFFF; */
    background: #61CE70;
    /* font-family: DM Sans;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 17px;
    text-align: center; */
    margin: 0px;
}

.primary-button:hover {
    /* color: #FFFFFF; */
    background: #61CE70;
    /* font-family: Rubik;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 17px;
    text-align: center;
    margin: 0px 4px; */
}

.alert {
    border: none;
}

.secondary-button {
    width: 206px;
    height: 46px;
    background: #FFFFFF;
    color: #61CE70;
    font-family: Rubik;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 17px;
    text-align: center;
    margin: 2px 4px;
}




.no-btn {
    background: none;
    color: inherit;
    border: none;
    padding: 0;
    font: inherit;
    cursor: pointer;
    outline: inherit;
}

.back {
    height: 24px;
    width: 46px;
    color: #FFFFFF;
    font-family: Rubik;
    font-size: 20px;
    letter-spacing: 0;
    line-height: 24px;
}

.sector-regist {
    height: 61px;
    /*width: 210px;*/
    color: #252631;
    font-family: Rubik;
    font-size: 24px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 30px;
}




.border-bottom-ash {
    border-bottom: 1px solid #C4CDD5;
}

.dashboard_box {
    height: 168px;
    width: 305px;
    margin: 5px;
    box-shadow: 0px 2px 4px rgba(63, 63, 68, 0.25);
     border-radius: 0px;
    padding: 5px 10px;
    border-left: 3px solid #0CC492;
    background: #FFFFFF;
}




.login_container {
    height: 195px;
    width: 365px;
}




.container2 {
    font-family: rubik;
    padding: 40px 50px 50px 50px;
}

.lefttview {
    background: #E8FEf8;
    padding-left: 55px;
    padding-bottom: 55px;
    padding-top: 40px;
}

.table-responsive {
    display: table;
}




@media (min-width: 768px) {

    .login_box {
        /* height: 542px; */
        height: auto;
        width: 542px;
        margin: 5px;
        padding: 5px 90px;
        box-shadow: 0 1px 8px 0 rgba(63, 63, 68, 0.1);
        border-radius: 0px;
    }

}







 @media (min-width: 1200px) {
    .container2 {
        width: 1110px;
        font-family: DM Sans;
        padding: 40px 60px 70px 60px;
    }
    .container3 {
        font-family: DM Sans;
        padding: 40px 50px 70px 60px;
    }
    .content-padding {
        padding-left: 53px;
        padding-right: 53px;
    }
    .login-container {
        /* height: 434px; */
        /* width: 400px; */
        font-family: DM Sans;
        /* padding: 50px 95px 70px 95px;  */
    }
}

/* Update this CSS block in your existing CSS */

@media (max-width: 767px) {
    .login_box {
        width: 100%;
        padding: 5px 20px;
        margin-left: 10px; /* Adjust margin to push the login_box to the right */
        margin-right: 10px; /* Adjust margin to reduce space on the right */
    }

    .login-container {
        width: 100%;
        padding: 0 20px;
    }

    .control-label {
        margin-left: 0 !important;
    }
}

@media (max-width: 575px) {
    .logo img {
        height: 80px; /* Adjust height for smaller screens */
    }

    .login_box {
        padding: 5px 10px;
    }

    .login-container {
        padding: 0 10px;
    }

    .field-icon {
        top: 30px; /* Adjust position of password toggle icon */
        right: 30px;
    }
}