/* XL Device :1200px. */

@media (min-width: 1200px) and (max-width: 1600px) {
    .check__login__bg {
        width: 50%;
    }

    .login__area::before {
        width: 36%;
    }

    .profile-image-container {
        width: 20%;
    }

    .profile-tags-container {
        width: 80%;
    }

    .profile-content-area .filter-area {
        width: 20%;
        padding-left: 30px;
        padding-top: 136px;
    }

    .profile-content {
        width: 80%;
        margin-top: 31px;
    }
}

@media (min-width: 1200px) and (max-width: 1400px) {
    .train-cards .col-xl-6 .train-card-thumb {
        width: 242px;
        margin-right: 15px;
    }

    .login__check__content h1 {
        font-size: 70px;
        padding-bottom: 12px;
    }

    .train-modal .modal-dialog {
        max-width: 1100px;
    }
}

/* LG Device :992px. */

@media (max-width: 1200px) {
    .profile-header-content {
        position: relative;
        top: 0;
    }

    .profile-content-area {
        display: flex;
        flex-direction: column;
    }

    .profile-content {
        width: 100%;
    }

    .profile-content-area .filter-area {
        width: 100%;
        padding-left: 0;
        padding-top: 40px;
    }

    .profile-content-area .filter-area ul {
        display: flex;
        gap: 20px;
    }
}

@media (min-width: 992px) and (max-width: 1200px) {
    .header__menu ul li a {
        font-size: 12px;
        padding: 13px;
    }

    .train-modal .modal-dialog {
        max-width: 950px;
    }

    .login__check__content h1 {
        font-size: 60px;
        padding-bottom: 16px;
    }

    .header__dropdown button {
        font-size: 13px;
    }

    .dropdown-toggle::after {
        border-top: 8px solid;
        border-right: 6px solid transparent;
        border-left: 6px solid transparent;
    }

    .login__area::before {
        width: 36%;
    }

    .check__login__bg {
        width: 50%;
    }

    .profile-image-container {
        width: 25%;
    }

    .profile-tags-container {
        width: 75%;
    }

    .profile-tags ul li span {
        padding-right: 30px;
        color: #fff;
    }
}

/* MD Device :768px. */

@media (max-width: 991px) {
    .profile-header {
        background-color: transparent;
        height: auto;
    }

    .profile-image-container {
        width: 128px;
    }

    .profile-image {
        margin-left: 0;
    }

    .profile-tags-container {
        width: auto;
        margin-top: 15px;
    }

    .profile-tags ul li span {
        padding-right: 10px;
        color: #fff;
    }

    .profile-header-content {
        position: relative;
        top: 0;
        flex-direction: column;
    }

    .profile-content-area {
        display: flex;
        flex-direction: column;
    }

    .profile-content {
        width: 100%;
    }

    .profile-content-area .filter-area {
        width: 100%;
        padding-left: 0;
        padding-top: 25px;
    }

    .profile-content-area .filter-area ul {
        display: flex;
        gap: 20px;
    }

    .available__table table {
        width: 1120px;
    }

    .available__table {
        overflow-x: scroll;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .train-question-box-item {
        padding: 14px 16px;
    }

    .train-modal .modal-dialog {
        max-width: 720px;
    }

    .login__left__bottom__blk p {
        text-align: center;
    }

    .ready-to-start {
        font-size: 19px;
    }

    .desk__none {
        display: block;
    }

    .header__menu ul li a {
        font-size: 12px;
        padding: 13px;
    }

    .header__dropdown button {
        font-size: 13px;
    }

    .dropdown-toggle::after {
        border-top: 8px solid;
        border-right: 6px solid transparent;
        border-left: 6px solid transparent;
    }

    .dashboard__area .container,
    .dashboard__area .dashboard__inner__blk,
    .dashboard__area .row,
    .dashboard__area .col-xxl-2,
    .dashboard__area .sodebar__blk {
        height: auto;
    }

    .dashboard__tab__content__area {
        padding-top: 0;
    }

    .copyright__area {
        position: unset;
    }

    .dashboard__area {
        height: auto;
        padding-bottom: 50px;
    }

    .header__left__blk {
        position: fixed;
        left: -100%;
        top: 0;
        height: 100%;
        width: 330px;
        padding: 20px;
        z-index: 999;
        background: #000000;
        transition: 0.3s all;
        flex-direction: column;
        padding-top: 90px;
    }

    .close__menu {
        position: absolute;
        top: 20px;
        right: 20px;
        line-height: 1;
        color: #fff;
        font-size: 21px;
        cursor: pointer;
    }

    .header__menu ul li {
        display: block;
    }

    .header__menu {
        width: 100%;
        padding-top: 30px;
    }

    .overlay {
        position: fixed;
        left: -100%;
        top: 0;
        height: 100%;
        width: 100%;
        z-index: 444;
        background: #dddddd96;
        transition: 0.5s all;
    }

    .header__area {
        padding: 10px 0;
    }

    .open__menu {
        font-size: 20px;
        color: #fff;
        cursor: pointer;
    }

    .header__left__blk.active {
        left: 0;
    }

    .overlay.desk__none.active {
        left: 0;
    }

    .header__right__blk.mt-40 {
        display: flex !important;
    }

    .login__area::before {
        width: 100%;
        height: 550px;
    }

    .check__login__bg {
        width: 50%;
        display: none;
    }

    .login__check__area {
        padding-left: 0;
        padding: 40px 0;
        padding-bottom: 25px;
    }

    .login__logo {
        margin-left: -15px;
        margin-bottom: 25px;
        text-align: center;
    }

    .login__left__wrapper {
        height: auto;
        padding: 48px 0;
        padding-bottom: 24px;
    }

    .login__form form {
        text-align: center;
    }

    .login__form form .single__form {
        margin: 0 auto;
        margin-bottom: 15px;
    }

    .login__form form .update_pass {
        justify-content: center;
    }

    .login__left__bottom__blk {
        margin-top: 40px;
    }

    .login__check__content p {
        font-size: 16px;
        line-height: 26px;
    }

    .security__area {
        padding-top: 40px;
        padding-bottom: 60px;
        height: auto;
    }

    .security__thumb {
        max-width: 230px;
        padding-top: 0;
        margin-left: 0;
        margin: 0 auto;
        text-align: center;
    }

    .security__thumb img {
        height: 160px;
    }

    .to_factor_success {
        padding: 16px;
        top: 26px;
        width: 516px;
    }

    .standard__inner__wrapper {
        flex-direction: column;
    }

    .standard__left__blk {
        width: 100%;
    }

    .standard__right__blk {
        width: 100%;
        display: none;
    }
}

/* SM Small Device :320px. */

@media (max-width: 991px) {
    .profile-tags ul {
        flex-direction: column;
    }

    .profile-tags ul li {
        display: flex;
        justify-content: space-between;
    }

    .profile-contact-details .contact-details .contact {
        font-size: 14px;
    }

    #profileAccordion .asr-form {
        width: 100%;
    }
}

@media only screen and (min-width: 320px) and (max-width: 767px) {
    .train-card {
        flex-direction: column;
    }

    .login__left__bottom__blk p {
        text-align: center;
    }

    .train-action-card-left {
        display: block;
    }

    .train-card-content {
        width: 100%;
        padding-top: 15px;
    }

    .train-action-card {
        padding: 16px 20px;
    }
    .view_profile_text h4 {
        font-size: 18px;
        line-height: 31px;
    }.view_profile_text p {
         font-size: 12px;
         line-height: 19px;
     }
    .train-modal .modal-dialog {
        max-width: 550px;
    }

    .train-card-thumb {
        margin-right: 0;
        margin-bottom: 20px;
        width: 100%;
    }

    .train-card {
        padding: 19px;
        margin-bottom: 18px;
    }

    .single-train-card-title h4 {
        font-size: 19px;
        margin-bottom: 8px;
    }

    .tranining__nav a {
        font-size: 14px;
        line-height: 19px;
        padding: 7px 16px;
    }

    .qc-title {
        padding: 12px 17px;
        margin-bottom: 14px;
        font-size: 15px;
        line-height: 20px;
    }

    .alert-close {
        font-size: 19px;
        margin-left: 12px;
    }

    .desk__none {
        display: block;
    }

    .form-check-label {
        font-size: 14px;
        padding-left: 4px;
    }

    .header__menu ul li a {
        font-size: 12px;
        padding: 13px;
    }

    .header__dropdown button {
        font-size: 13px;
    }

    .dropdown-toggle::after {
        border-top: 8px solid;
        border-right: 6px solid transparent;
        border-left: 6px solid transparent;
    }

    .dashboard__area .container,
    .dashboard__area .dashboard__inner__blk,
    .dashboard__area .row,
    .dashboard__area .col-xxl-2,
    .dashboard__area .sodebar__blk {
        height: auto;
    }

    .dashboard__tab__content__area {
        padding-top: 0;
    }

    .copyright__area {
        position: unset;
    }

    .dashboard__area {
        height: auto;
        padding-bottom: 38px;
        min-height: calc(100vh - 80px);
    }

    .header__left__blk {
        position: fixed;
        left: -100%;
        top: 0;
        height: 100%;
        width: 330px;
        padding: 20px;
        z-index: 999;
        background: #000000;
        transition: 0.3s all;
        flex-direction: column;
        padding-top: 90px;
    }

    .close__menu {
        position: absolute;
        top: 20px;
        right: 20px;
        line-height: 1;
        color: #fff;
        font-size: 21px;
        cursor: pointer;
    }

    .header__menu ul li {
        display: block;
    }

    .header__menu {
        width: 100%;
        padding-top: 30px;
    }

    .overlay {
        position: fixed;
        left: -100%;
        top: 0;
        height: 100%;
        width: 100%;
        z-index: 444;
        background: #dddddd96;
        transition: 0.5s all;
    }

    .header__area {
        padding: 10px 0;
    }

    .open__menu {
        font-size: 20px;
        color: #fff;
        cursor: pointer;
    }

    .header__left__blk.active {
        left: 0;
    }

    .overlay.desk__none.active {
        left: 0;
    }

    .header__right__blk.mt-40 {
        display: flex !important;
    }

    .login__area::before {
        width: 100%;
        height: 490px;
        display: none;
    }

    .check__login__bg {
        width: 50%;
        display: none;
    }

    .login__check__area {
        padding-left: 0;
        padding: 40px 0;
        padding-bottom: 25px;
    }

    .login__logo {
        margin-left: -15px;
        margin-bottom: 25px;
        text-align: center;
    }

    .login__left__wrapper {
        height: auto;
        padding: 48px 0;
        padding-top: 20px;
        background: #fff;
        padding-bottom: 15px;
    }

    .login__form form {
        text-align: center;
    }

    .login__form form .single__form {
        margin: 0 auto;
        margin-bottom: 15px;
    }

    .login__form form .update_pass {
        justify-content: center;
    }

    .login__left__bottom__blk {
        margin-top: 40px;
    }

    .login__check__content p {
        font-size: 14px;
        line-height: 18px;
    }

    .security__area {
        padding-top: 40px;
        padding-bottom: 60px;
        height: auto;
    }

    .security__thumb {
        max-width: 230px;
        padding-top: 0;
        margin-left: 0;
        margin: 0 auto;
        text-align: center;
    }

    .security__thumb img {
        height: 99px;
    }

    .to_factor_success {
        padding: 9px;
        top: 26px;
        width: 300px;
    }

    .phone_none {
        display: none;
    }

    .profile__dropdown {
        padding: 15px;
        width: 235px;
        margin-top: 8px !important;
    }

    .drop__profile__link ul li a {
        font-size: 12px;
        padding: 6px 0;
    }

    .profile__keft__blk h4 {
        font-size: 19px;
        line-height: 32px;
    }

    .back_to_dash a {
        font-size: 12px;
        line-height: 18px;
        padding: 7px 20px;
    }

    .single__form>input {
        font-size: 12px;
        line-height: 18px;
        padding: 6px 16px;
    }

    .check__box__area label {
        font-size: 12px;
        line-height: 18px;
        display: inline;
    }

    .account__factor {
        flex-direction: column;
    }

    .factor__ico {
        margin-bottom: 10px;
    }

    .to_factor_success p {
        font-size: 10px;
        line-height: 13px;
    }

    .account__factor {
        flex-direction: column;
    }

    .factor__ico {
        margin-bottom: 10px;
    }

    .to_factor_success p span {
        flex: 0 0 auto;
    }

    .to_factor_success p span img {
        height: 20px;
    }

    .to_factor_success>span img {
        height: 20px;
    }

    .copyright__text p {
        text-align: center;
        line-height: 18px;
        font-size: 12px;
    }

    .modal-header h5 {
        font-size: 14px;
        line-height: 12px;
    }

    .siderbar__tab__btn #nav-tab button p {
        font-size: 12px;
        margin-top: 8px;
    }

    .security__content {
        max-width: 447px;
        margin-left: 0;
        position: relative;
    }

    .profile__information__content p {
        font-size: 13px;
        line-height: 20px;
    }

    .security__thumb p {
        font-size: 20px;
        line-height: 26px;
    }

    .configure__content h4 {
        font-size: 20px;
        line-height: 26px;
    }

    .configure__ico img {
        height: 50px;
    }

    .login__logo img {
        height: 65px;
    }

    .verifi__area h2 {
        font-size: 20px;
    }

    .verify__top__blk span {
        font-size: 12px;
        line-height: 20px;
        letter-spacing: 0.2px;
    }

    .verify__top__blk a {
        font-size: 12px;
        line-height: 20px;
        letter-spacing: 0.2px;
    }

    .single__form label {
        text-align: left;
    }

    .verify__top__blk {
        padding: 7px;
    }

    .form-check .form-check-input {
        float: unset;
    }

    .step_2 {
        display: none;
    }

    .under__thunb {
        text-align: center;
    }

    .under__inner__blk {
        padding: 13px;
        margin-top: 40px;
    }

    .standard__inner__wrapper {
        flex-direction: column;
    }

    .standard__left__blk {
        width: 100%;
    }

    .standard__right__blk {
        width: 100%;
        display: none;
    }
}

/* SM Small Device :550px. */

@media only screen and (min-width: 300px) and (max-width: 575px) {
    .ready-to-start {
        font-size: 17px;
        padding: 16px 0;
    }

    .train-action-card {
        padding: 13px 15px;
        margin-bottom: 15px;
    }

    .train-action-card-thumb {
        width: 135px;
        height: 76px;
        margin-right: 2px;
    }

    .train-card {
        padding: 16px;
    }

    .ready-to-start span {
        margin-right: 15px;
    }

    .update_pass {
        flex-wrap: wrap !important;
    }

    .train-question-box-item {
        padding: 14px 17px;
    }

    .single-train-card-title h4 {
        font-size: 18px;
        margin-bottom: 9px;
    }

    .filter-area ul {
        font-size: 12px !important;
        gap: 5px !important;
    }

    .profile-contact-details .contact-details {
        border-right: none;
        align-items: center;
    }
}