@media only screen and (max-width: 1919px) and (min-width: 1440px) {

    .overview-card-content {
        margin: 0;
        margin-top: 15px;
    }

    .datepicker .ui-datepicker-header {
        font-size: 12px;
    }

    .table:not(.table-sm):not(.table-md):not(.dataTable) td,
    .table:not(.table-sm):not(.table-md):not(.dataTable) th {
        padding: 0 15px;
        font-size: 12px;
    }

    .pricing .pricing-price div:first-child {
        font-size: 36px;
    }

    .activities .activity .activity-icon {
        margin-right: 5px;
    }

    .course-box .course-content h1 {
        font-size: 12px;
    }

    .pricing {
        height: 700px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        flex-wrap: wrap;
    }

    .pricing .pricing-details .pricing-item .pricing-item-icon {
        max-width: 10%;
    }

    .pricing .pricing-details .pricing-item .pricing-item-label {
        width: 90%;
    }
}

@media only screen and (max-width: 1440px) and (min-width: 1280px) {

    body {
        font-size: 12px;
    }

    p {
        line-height: 20px;
    }

    .login-logo {
        width: 150px !important;
    }

    .unf-font-family {
        font-size: 24px;
    }

    .title-box h1 {
        font-size: 18px;
    }

    .overview-card-content {
        font-size: 12px;
        margin: 0;
    }

    .datepicker .ui-datepicker-header {
        font-size: 10px;
    }

    .datepicker .ui-datepicker-calendar a {
        width: 20px;
        height: 20px;
        font-size: 11px;
        line-height: 20px;
    }

    .table:not(.table-sm):not(.table-md):not(.dataTable) td,
    .table:not(.table-sm):not(.table-md):not(.dataTable) th {
        padding: 0 8px;
        font-size: 11px;
    }

    .pricing .pricing-price div:first-child {
        font-size: 32px;
    }

    .pricing .pricing-cta a {
        font-size: 10px;
        padding: 15px 40px;
    }

    .pricing .pricing-details .pricing-item .pricing-item-icon {
        width: 15px;
        height: 15px;
        line-height: 15px;
    }

    .pricing .pricing-details .pricing-item .pricing-item-icon i {
        font-size: 8px;
    }

    .pricing .pricing-cta i {
        font-size: 10px;
    }

    .image-box img {
        height: 200px;
    }

    .image-box h1 {
        font-size: 21px;
    }

    .image-box p {
        font-size: 12px;
        line-height: 15px;
    }

    .tution-box h2,
    .lesson-box h2 {
        font-size: 21px;
    }

    .lesson-box {
        padding: 20px 10px !important;
    }

    .activities .activity .activity-icon {
        width: 20px !important;
        height: 20px !important;
        margin-right: 10px;
    }

    .activities .activity:before {
        left: 10px !important;
    }

    .course-box .course-content h1 {
        font-size: 12px;
    }

    .btn {
        padding: 0.3rem 0.5rem;
    }

    .btn .fas {
        font-size: 12px;
    }

    .profile-widget .profile-widget-picture {
        width: 75px;
        height: 75px;
    }

    .image-wrapper {
        height: 35px;
    }

    label.edit {
        font-size: 12px;
    }

    label.edit i.fas {
        font-size: 12px;
    }

    .sidebar-brand img {
        width: 150px;
    }
    .sidebar-brand-sm img{
        width: 30px;
    }

    .nav-link {
        padding: 5px 8px;
    }

    .datepicker-card-body {
        padding: 20px 10px !important;
    }

    .product-info {
        width: 40% !important;
    }

    .card-body.row.justify-content-between {
        padding: 20px 10px !important;
    }
    .pricing .pricing-details .pricing-item .pricing-item-icon {
        max-width: 10%;
    }

    .pricing .pricing-details .pricing-item .pricing-item-label {
        width: 90%;
    }
}



@media only screen and (max-width: 1280px) and (min-width: 1024px) {

    body {
        font-size: 12px;
    }

    p {
        line-height: 20px;
    }

    .unf-font-family {
        font-size: 21px;
    }

    .bg-primary-black video {
        object-fit: contain;
    }

    .title-box h1 {
        font-size: 15px;
    }

    .overview-card-content {
        font-size: 11px;
        margin: 0;
    }

    .icon-box {
        padding: 10px 0;
        border-radius: 50%;
        height: 50px;
        max-width: 50px;
    }

    .datepicker-card-body {
        padding: 20px 10px !important;
    }

    .datepicker .ui-datepicker-header {
        font-size: 10px;
    }

    .datepicker .ui-datepicker-calendar a {
        width: 20px;
        height: 20px;
        font-size: 11px;
        line-height: 20px;
    }

    .table:not(.table-sm):not(.table-md):not(.dataTable) td,
    .table:not(.table-sm):not(.table-md):not(.dataTable) th {
        padding: 0 8px;
        font-size: 11px;
    }

    .btn {
        padding: 0.3rem 0.5rem;
    }

    .btn .fas {
        font-size: 12px;
    }

    .profile-widget .profile-widget-picture {
        width: 75px;
        height: 75px;
    }

    .image-wrapper {
        height: 35px;
    }

    label.edit {
        font-size: 12px;
    }

    label.edit i.fas {
        font-size: 12px;
    }

    .nav-link {
        padding: 5px 8px;
    }

    .pricing .pricing-price div:first-child {
        font-size: 28px;
    }

    .pricing .pricing-title {
        font-size: 8px;
    }

    .pricing .pricing-cta a {
        font-size: 10px;
    }

    .activities .activity .activity-icon {
        display: none;
    }

    .activities .activity:before {
        display: none;
    }

    .course-box .course-content h1 {
        font-size: 12px;
    }

    .lesson-box {
        padding: 20px 15px !important;
    }
    .pricing .pricing-details .pricing-item .pricing-item-icon {
        max-width: 10%;
    }

    .pricing .pricing-details .pricing-item .pricing-item-label {
        width: 90%;
    }
}

@media only screen and (max-width: 1024px) and (min-width: 768px) {
    body {
        font-size: 12px;
    }

    p {
        line-height: 20px;
    }

    section {
        padding: 0;
    }

    .login-box {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100%;
    }

    .icon-box {
        padding: 10px 0;
        border-radius: 50%;
        height: 50px;
        max-width: 50px;
    }

    .title-box h1 {
        font-size: 16px;
    }

    .overview-card-content {
        font-size: 12px;
        margin: 0;
    }

    .datepicker-box {
        width: 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }

    .table:not(.table-sm):not(.table-md):not(.dataTable) td,
    .table:not(.table-sm):not(.table-md):not(.dataTable) th {
        padding: 0 8px;
        font-size: 11px;
    }

    .nav-link {
        padding: 5px 8px;
    }

    .nav-link .fas {
        font-size: 12px;
    }

    .pricing .pricing-price div:first-child {
        font-size: 21px;
    }

    .pricing .pricing-cta a {
        font-size: 10px;
        padding: 15px 40px;
    }

    .pricing-cta a .fas {
        font-size: 10px;
    }

    .pricing .pricing-title {
        font-size: 8px;
    }

    .image-box p {
        font-size: 12px;
    }

    .activities .activity .activity-icon {
        display: none;
    }

    .activities .activity:before {
        display: none;
    }

    .lesson-box {
        padding: 20px 10px !important;
    }

    .tution-box h2,
    .lesson-box h2 {
        font-size: 18px;
    }

    .course-box .course-content h1 {
        font-size: 10px;
    }
    .pricing .pricing-details .pricing-item .pricing-item-icon {
        max-width: 10%;
    }

    .pricing .pricing-details .pricing-item .pricing-item-label {
        width: 90%;
    }
}


@media only screen and (max-width: 768px) {

    body {
        font-size: 12px;
    }

    p {
        line-height: 20px;
    }

    section {
        padding: 0;
    }

    .overview-card-content {
        margin: 0;
        font-size: 14px;
    }

    .card-header-action {
        width: 50% !important;
        text-align: right;
    }

    .panel {
        width: 100% !important;
        padding: 0 !important;
    }

    .panel .panel-heading .card-body {
        padding: 20px !important;
    }

    .product-info {
        text-align: right;
    }

    .price-info {
        width: 100% !important;
        margin-top: 15px;
    }

    .image-box img {
        width: 100%;
        margin-bottom: 25px;
    }

    .course-box .course-content h1 {
        font-size: 14px;
    }
    .pricing .pricing-details .pricing-item .pricing-item-icon {
        max-width: 10%;
    }

    .pricing .pricing-details .pricing-item .pricing-item-label {
        width: 90%;
    }

}