body {
    font-family: 'Bitter', serif;
}

.login_page_bg {
    min-height: 100%;
    width: 100%;
}

.mein_back_login {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.main-content {
    border-radius: 0px;
    margin: 5em auto;
    display: flex;
}

/* ///// */

/* left-box-start */

.company__info {
    background-color: #425A50;
    border-radius: 0px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #fff;
    padding: 40px;
}

.company__info h1 {
    font-size: 40px;
    font-weight: 600;
    color: #BEC869;
    text-align: left;
    font-family: 'Bitter', serif
}

.company__info .title_text {
    font-size: 22px;
    font-weight: 400;
}

.company__info p {
    font-size: 18px;
    color: #f7eff2;
    font-weight: 300;
    text-align: left;
}

.company__info .title-link p {
    font-size: 20px;
    margin: 0 10px 0 0;
}

.company__info .title-link span {
    font-size: 20px;
}

.company__info .title-link a {
    font-weight: 500;
    color: #BEC869;
    text-decoration: underline;
}

.company__info .title-link a:hover {
    color: #fff;
}

.title-link .dropdown.tasks-menu {
    background: #425A50;
    border: solid 1px #fff;
    width: 30%;
    margin: 0 auto;
    padding: 3px;
}

.tasks-menu a {
    color:  #425A50 !important;
}

.title-link .dropdown.tasks-menu a {
    color: #fff;
}

.company__info .open>.dropdown-menu {
    background: #BEC869;
}

.company__info .dropdown-menu-right {
    left: 0;
}

.company__info ul.dropdown-menu.dropdown-menu-right.icons-right {
    overflow: auto;
}

.company__info .dropdown-menu {
    min-width: 121px;
    padding: 2px 0;
    border-radius: 0;
}

.company__info .dropdown-menu>li>a:hover {
    background-color: #425A50;
}

/* left-box-end */

/* right-box-start */

.login_form h2 {
    font-size: 22px;
    font-weight: 500;
    color: #463e30;
    font-family: 'Bitter', serif;
    padding: 0 15px;
}

.login_form {
    padding: 35px;
    background-color: #fff;
    border-radius: 0px;
    border: 1px solid #ccc;
}

form {
    padding: 0 2em;
}

.form__input {
    width: 100%;
    border: 0px solid transparent;
    border-radius: 0;
    border-bottom: 3px solid #aaa;
    padding: 1em .5em .5em;
    outline: none;
    margin: 1.5em auto;
    transition: all .5s ease;
}

.form__input:focus {
    border-bottom-color: #425A50;
}

.form__input::placeholder {
    font-size: 18px;
    color: #425A50;
    opacity: 65%;
}

.check_content {
    text-align: left;
}

.check_content input[type="checkbox"] {
    margin: 0 4px;
}

.check_content label {
    font-size: 18px;
    color: #161212;
    font-weight: 400;
}

.form-group .anmelden {
    text-align: left;
}

.anmelden .btn {
    padding: 14px 30px;
    transition: all .5s ease;
    border-radius: 0px;
    color: #fff;
    font-size: 22px;
    font-weight: 400;
    background-color: #425A50;
    margin-top: 1.5em;
    margin-bottom: 1em;
    border-color: #425A50;
}

input::-ms-reveal, input::-ms-clear {        
    display: none;
}

.anmelden .btn:hover,
.anmelden .btn:focus {
    background-color: #425A50;
    color: #fff;
}

.pink_text {
    color: #463e30;
    font-size: 18px;
    font-weight: 400;
    text-align: left;
    padding: 0 2rem;
    display: inline-block;
    word-break: break-word;
}

.pink_text:hover {
    color: #425A50;
}

.forgotpass {
    padding: 0 !important;
    margin-top: 10px;
}

.colPadding {
    padding: 0 !important;
    color: #557D69 !important;
}

/* right-box-end */

/* responisve-css */

@media screen and (max-width: 640px) {
    .company__info {
        display: none;
    }

    .check_content label {
        font-size: 16px;
    }

    .login_form h2 {
        font-size: 20px;
    }

    .login_form {
        padding: 15px;
    }
}

@media screen and (min-width: 642px) and (max-width:800px) {
    .company__info h4 {
        font-size: 20px;
    }

    .title-link .dropdown.tasks-menu {
        width: 55%;
    }

}

@media screen and (min-width: 800px) and (max-width: 1200px) {
    .company__info {
        padding: 60px 40px;
    }

    .company__info .dropdown-menu {
        min-width: 101px;
    }

    .title-link .dropdown.tasks-menu {
        width: 26%;
    }

    .title-link .dropdown-menu>li>a {
        padding: 3px 16px;
    }

    .anmelden .btn {
        font-size: 16px;
    }
}

@media screen and (max-width: 800px) {
    .anmelden .btn {
        font-size: 12px;
    }
}