/* Higher than 1200 (desktop devices), Large Devices, Wide Screens
====================================================================== */

@media only screen and (min-width: 1200px) {
    .df-particular-topic .reply-container {
        position: relative;
    }
    .container-fluid-full {
        overflow: hidden;
        position: relative;
        height: 100%;
    }

    #content.slidetoggle {
        margin-left: 55px !important;
    }
    .page-sidebar-fixed .sidebarOverlay, .page-sidebar-fixed .tab-sidebarOverlay {
        display: none;
    }
    .sidebar-nav > ul {
        margin: 0;
    }
    footer {
        margin: 0;
        padding: 10px 20px;
    }

    #tabs {
        display: flex;
    }

    .page-sidebar-fixed .sidebar.collapse {
        display: block;
    }

    .tiles-view .thumbnail > .img-sec {
        width: 100%;
    }

    .tiles-view .thumbnail > .img-sec img {
        width: 100%;
    }

    /*CourseContents.html CSS*/
    .embed-responsive-16by9 {
        padding-bottom: 55.25%;
    }
    .toggled .embed-responsive-16by9 {
        padding-bottom: 37.25%;
    }
    /*Common*/
    .d-lg-none {
        display: none!important
    }
    .d-lg-inline {
        display: inline!important
    }
    .d-lg-inline-block {
        display: inline-block!important
    }
    .d-lg-block {
        display: block!important
    }
    .d-lg-table {
        display: table!important
    }
    .d-lg-table-row {
        display: table-row!important
    }
    .d-lg-table-cell {
        display: table-cell!important
    }
    .d-lg-flex {
        display: -webkit-box!important;
        display: -ms-flexbox!important;
        display: flex!important
    }
    .d-lg-inline-flex {
        display: -webkit-inline-box!important;
        display: -ms-inline-flexbox!important;
        display: inline-flex!important
    }
    .m-lg-0 {
        margin: 0!important
    }
    .mt-lg-0,
    .my-lg-0 {
        margin-top: 0!important
    }
    .mr-lg-0,
    .mx-lg-0 {
        margin-right: 0!important
    }
    .mb-lg-0,
    .my-lg-0 {
        margin-bottom: 0!important
    }
    .ml-lg-0,
    .mx-lg-0 {
        margin-left: 0!important
    }
    .m-lg-1 {
        margin: .25rem!important
    }
    .mt-lg-1,
    .my-lg-1 {
        margin-top: .25rem!important
    }
    .mr-lg-1,
    .mx-lg-1 {
        margin-right: .25rem!important
    }
    .mb-lg-1,
    .my-lg-1 {
        margin-bottom: .25rem!important
    }
    .ml-lg-1,
    .mx-lg-1 {
        margin-left: .25rem!important
    }
    .m-lg-2 {
        margin: .5rem!important
    }
    .mt-lg-2,
    .my-lg-2 {
        margin-top: .5rem!important
    }
    .mr-lg-2,
    .mx-lg-2 {
        margin-right: .5rem!important
    }
    .mb-lg-2,
    .my-lg-2 {
        margin-bottom: .5rem!important
    }
    .ml-lg-2,
    .mx-lg-2 {
        margin-left: .5rem!important
    }
    .m-lg-3 {
        margin: 1rem!important
    }
    .mt-lg-3,
    .my-lg-3 {
        margin-top: 1rem!important
    }
    .mr-lg-3,
    .mx-lg-3 {
        margin-right: 1rem!important
    }
    .mb-lg-3,
    .my-lg-3 {
        margin-bottom: 1rem!important
    }
    .ml-lg-3,
    .mx-lg-3 {
        margin-left: 1rem!important
    }
    .m-lg-4 {
        margin: 1.5rem!important
    }
    .mt-lg-4,
    .my-lg-4 {
        margin-top: 1.5rem!important
    }
    .mr-lg-4,
    .mx-lg-4 {
        margin-right: 1.5rem!important
    }
    .mb-lg-4,
    .my-lg-4 {
        margin-bottom: 1.5rem!important
    }
    .ml-lg-4,
    .mx-lg-4 {
        margin-left: 1.5rem!important
    }
    .m-lg-5 {
        margin: 3rem!important
    }
    .mt-lg-5,
    .my-lg-5 {
        margin-top: 3rem!important
    }
    .mr-lg-5,
    .mx-lg-5 {
        margin-right: 3rem!important
    }
    .mb-lg-5,
    .my-lg-5 {
        margin-bottom: 3rem!important
    }
    .ml-lg-5,
    .mx-lg-5 {
        margin-left: 3rem!important
    }
    .p-lg-0 {
        padding: 0!important
    }
    .pt-lg-0,
    .py-lg-0 {
        padding-top: 0!important
    }
    .pr-lg-0,
    .px-lg-0 {
        padding-right: 0!important
    }
    .pb-lg-0,
    .py-lg-0 {
        padding-bottom: 0!important
    }
    .pl-lg-0,
    .px-lg-0 {
        padding-left: 0!important
    }
    .p-lg-1 {
        padding: .25rem!important
    }
    .pt-lg-1,
    .py-lg-1 {
        padding-top: .25rem!important
    }
    .pr-lg-1,
    .px-lg-1 {
        padding-right: .25rem!important
    }
    .pb-lg-1,
    .py-lg-1 {
        padding-bottom: .25rem!important
    }
    .pl-lg-1,
    .px-lg-1 {
        padding-left: .25rem!important
    }
    .p-lg-2 {
        padding: .5rem!important
    }
    .pt-lg-2,
    .py-lg-2 {
        padding-top: .5rem!important
    }
    .pr-lg-2,
    .px-lg-2 {
        padding-right: .5rem!important
    }
    .pb-lg-2,
    .py-lg-2 {
        padding-bottom: .5rem!important
    }
    .pl-lg-2,
    .px-lg-2 {
        padding-left: .5rem!important
    }
    .p-lg-3 {
        padding: 1rem!important
    }
    .pt-lg-3,
    .py-lg-3 {
        padding-top: 1rem!important
    }
    .pr-lg-3,
    .px-lg-3 {
        padding-right: 1rem!important
    }
    .pb-lg-3,
    .py-lg-3 {
        padding-bottom: 1rem!important
    }
    .pl-lg-3,
    .px-lg-3 {
        padding-left: 1rem!important
    }
    .p-lg-4 {
        padding: 1.5rem!important
    }
    .pt-lg-4,
    .py-lg-4 {
        padding-top: 1.5rem!important
    }
    .pr-lg-4,
    .px-lg-4 {
        padding-right: 1.5rem!important
    }
    .pb-lg-4,
    .py-lg-4 {
        padding-bottom: 1.5rem!important
    }
    .pl-lg-4,
    .px-lg-4 {
        padding-left: 1.5rem!important
    }
    .p-lg-5 {
        padding: 3rem!important
    }
    .pt-lg-5,
    .py-lg-5 {
        padding-top: 3rem!important
    }
    .pr-lg-5,
    .px-lg-5 {
        padding-right: 3rem!important
    }
    .pb-lg-5,
    .py-lg-5 {
        padding-bottom: 3rem!important
    }
    .pl-lg-5,
    .px-lg-5 {
        padding-left: 3rem!important
    }
    .m-lg-auto {
        margin: auto!important
    }
    .mt-lg-auto,
    .my-lg-auto {
        margin-top: auto!important
    }
    .mr-lg-auto,
    .mx-lg-auto {
        margin-right: auto!important
    }
    .mb-lg-auto,
    .my-lg-auto {
        margin-bottom: auto!important
    }
    .ml-lg-auto,
    .mx-lg-auto {
        margin-left: auto!important
    }
}

/* Higher than 960 (desktop devices)
====================================================================== */
@media only screen and (min-width: 980px) and (max-width: 1199px) {

    .container-fluid-full {
        overflow: hidden;
        position: relative;
        height: 100%;
    }

    #wrapper .question-display-cont {
        min-height: 600px;
    }

    #page-container #content.slidetoggle {
        margin-left: 55px; /*14.422%*/
    }

    .box_border {
        min-height: 140px;
    }

    .dark {
        padding: 20px;
        top: -20px;
        right: -12px;
        margin-bottom: -56px;
        margin-right: -30px;
    }

    .page-sidebar-fixed .sidebar.collapse {
        display: block;
    }

    .sidebar-nav > ul {
        margin: 0;
    }

    .widget,
    .box {
        margin-bottom: 20px;
    }

    .recommend-course {
        padding-right: 0 !important;
    }

    footer {
        margin: 0;
        padding: 10px 20px;
    }
    /*SolutionDesigner Dashboard page dbinit.html*/
    .gridster-item .panel .panel-body {
        height: auto !important;
    }
}

/* Tablet Portrait (devices and browsers)
====================================================================== */
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .container-fluid-full {
        overflow: hidden;
        position: relative;
        height: 100%;
    }

    .review-ans video {
        width: 100%;
    }
     .xs-m-b-20 {
        margin-bottom: 20px !important;
    }
    .nav-pills > li > a {
        padding: 7px 15px !important;
    }

    .course_right {
        padding: 5px !important;
    }

    .hr-0 {
        margin-top: 7px;
        margin-bottom: 7px;
        border-top: 1px solid #eee !important;
    }
    .recommend-course {
        padding-right: 0 !important;
    }

    #content.slidetoggle {
        margin: 0 0 0 55px !important;
    }

    #content.slidetoggle .spinner {
        left: 0;
    }

    #content.slidetoggle .spinner:before {
        left: 50%;
    }

    .dark {
        padding: 20px;
        top: -22px;
        right: -15px;
        margin-bottom: -56px;
        margin-right: -30px;
    }

    .widget,
    .box {
        margin-bottom: 22px;
    }

    .page-sidebar-fixed .sidebar.collapse {
        display: block;
    }

    .sidebar-nav > ul {
        margin: 0;
    }

    .navbar-nav.side-nav, .side-nav.ui-widget {
        padding-bottom: 0;
    }

    .btn-navbar {
        display: none !important;
    }

    .nav-collapse,
    .nav-collapse.collapse {
        height: auto !important;
        overflow: visible !important;
        margin-left: 0 !important;
    }

    .stats-date .range {
        font-size: 16px;
        font-weight: 300;
    }


    .stat .left .number {
        font-size: 16px;
        font-weight: 300;
    }

    .stat .left .title {
        font-size: 9px;
    }

    .stat .right .percent {
        text-align: center;
        font-size: 12px;
        line-height: 16px;
    }

    .box-small-link {
        font-size: 20px;
    }

    footer {
        margin: 0;
        padding: 10px 20px;
    }
    /*CourseContents.html*/
    .slide-trigger-left.toggle-btn-xs {
        top: 8px !important;
        left: 70px !important;
    }
    /*UMS User Managment > Add new User Form lmsUserEdit.html Page*/
    .setup-content .m-t-10 {
        min-height: 560px;
    }

    .setup-content .m-t-10 .col-md-12:last-child {
        right: 0;
    }

    /*SolutionDesigner Dashboard page dbinit.html*/
    .gridster-item .panel .panel-body {
        height: auto !important;
    }

   /* Quiz attend page*/
    .type-main.show_sidebar #wrapper {
        margin-right: 0;
        width: 100%;
    }

    #pushSidebarLeft.timer-pane {
        margin: 15px;
    }

    .dadimag-responsive {
        width: 995px;
        height: 515px;
        overflow: scroll;
    }
    /*common*/
    .d-sm-none {
        display: none!important
    }
    .d-sm-inline {
        display: inline!important
    }
    .d-sm-inline-block {
        display: inline-block!important
    }
    .d-sm-block {
        display: block!important
    }
    .d-sm-table {
        display: table!important
    }
    .d-sm-table-row {
        display: table-row!important
    }
    .d-sm-table-cell {
        display: table-cell!important
    }
    .d-sm-flex {
        display: -webkit-box!important;
        display: -ms-flexbox!important;
        display: flex!important
    }
    .d-sm-inline-flex {
        display: -webkit-inline-box!important;
        display: -ms-inline-flexbox!important;
        display: inline-flex!important
    }
    .m-sm-0 {
        margin: 0!important
    }
    .mt-sm-0,
    .my-sm-0 {
        margin-top: 0!important
    }
    .mr-sm-0,
    .mx-sm-0 {
        margin-right: 0!important
    }
    .mb-sm-0,
    .my-sm-0 {
        margin-bottom: 0!important
    }
    .ml-sm-0,
    .mx-sm-0 {
        margin-left: 0!important
    }
    .m-sm-1 {
        margin: .25rem!important
    }
    .mt-sm-1,
    .my-sm-1 {
        margin-top: .25rem!important
    }
    .mr-sm-1,
    .mx-sm-1 {
        margin-right: .25rem!important
    }
    .mb-sm-1,
    .my-sm-1 {
        margin-bottom: .25rem!important
    }
    .ml-sm-1,
    .mx-sm-1 {
        margin-left: .25rem!important
    }
    .m-sm-2 {
        margin: .5rem!important
    }
    .mt-sm-2,
    .my-sm-2 {
        margin-top: .5rem!important
    }
    .mr-sm-2,
    .mx-sm-2 {
        margin-right: .5rem!important
    }
    .mb-sm-2,
    .my-sm-2 {
        margin-bottom: .5rem!important
    }
    .ml-sm-2,
    .mx-sm-2 {
        margin-left: .5rem!important
    }
    .m-sm-3 {
        margin: 1rem!important
    }
    .mt-sm-3,
    .my-sm-3 {
        margin-top: 1rem!important
    }
    .mr-sm-3,
    .mx-sm-3 {
        margin-right: 1rem!important
    }
    .mb-sm-3,
    .my-sm-3 {
        margin-bottom: 1rem!important
    }
    .ml-sm-3,
    .mx-sm-3 {
        margin-left: 1rem!important
    }
    .m-sm-4 {
        margin: 1.5rem!important
    }
    .mt-sm-4,
    .my-sm-4 {
        margin-top: 1.5rem!important
    }
    .mr-sm-4,
    .mx-sm-4 {
        margin-right: 1.5rem!important
    }
    .mb-sm-4,
    .my-sm-4 {
        margin-bottom: 1.5rem!important
    }
    .ml-sm-4,
    .mx-sm-4 {
        margin-left: 1.5rem!important
    }
    .m-sm-5 {
        margin: 3rem!important
    }
    .mt-sm-5,
    .my-sm-5 {
        margin-top: 3rem!important
    }
    .mr-sm-5,
    .mx-sm-5 {
        margin-right: 3rem!important
    }
    .mb-sm-5,
    .my-sm-5 {
        margin-bottom: 3rem!important
    }
    .ml-sm-5,
    .mx-sm-5 {
        margin-left: 3rem!important
    }
    .p-sm-0 {
        padding: 0!important
    }
    .pt-sm-0,
    .py-sm-0 {
        padding-top: 0!important
    }
    .pr-sm-0,
    .px-sm-0 {
        padding-right: 0!important
    }
    .pb-sm-0,
    .py-sm-0 {
        padding-bottom: 0!important
    }
    .pl-sm-0,
    .px-sm-0 {
        padding-left: 0!important
    }
    .p-sm-1 {
        padding: .25rem!important
    }
    .pt-sm-1,
    .py-sm-1 {
        padding-top: .25rem!important
    }
    .pr-sm-1,
    .px-sm-1 {
        padding-right: .25rem!important
    }
    .pb-sm-1,
    .py-sm-1 {
        padding-bottom: .25rem!important
    }
    .pl-sm-1,
    .px-sm-1 {
        padding-left: .25rem!important
    }
    .p-sm-2 {
        padding: .5rem!important
    }
    .pt-sm-2,
    .py-sm-2 {
        padding-top: .5rem!important
    }
    .pr-sm-2,
    .px-sm-2 {
        padding-right: .5rem!important
    }
    .pb-sm-2,
    .py-sm-2 {
        padding-bottom: .5rem!important
    }
    .pl-sm-2,
    .px-sm-2 {
        padding-left: .5rem!important
    }
    .p-sm-3 {
        padding: 1rem!important
    }
    .pt-sm-3,
    .py-sm-3 {
        padding-top: 1rem!important
    }
    .pr-sm-3,
    .px-sm-3 {
        padding-right: 1rem!important
    }
    .pb-sm-3,
    .py-sm-3 {
        padding-bottom: 1rem!important
    }
    .pl-sm-3,
    .px-sm-3 {
        padding-left: 1rem!important
    }
    .p-sm-4 {
        padding: 1.5rem!important
    }
    .pt-sm-4,
    .py-sm-4 {
        padding-top: 1.5rem!important
    }
    .pr-sm-4,
    .px-sm-4 {
        padding-right: 1.5rem!important
    }
    .pb-sm-4,
    .py-sm-4 {
        padding-bottom: 1.5rem!important
    }
    .pl-sm-4,
    .px-sm-4 {
        padding-left: 1.5rem!important
    }
    .p-sm-5 {
        padding: 3rem!important
    }
    .pt-sm-5,
    .py-sm-5 {
        padding-top: 3rem!important
    }
    .pr-sm-5,
    .px-sm-5 {
        padding-right: 3rem!important
    }
    .pb-sm-5,
    .py-sm-5 {
        padding-bottom: 3rem!important
    }
    .pl-sm-5,
    .px-sm-5 {
        padding-left: 3rem!important
    }
    .m-sm-auto {
        margin: auto!important
    }
    .mt-sm-auto,
    .my-sm-auto {
        margin-top: auto!important
    }
    .mr-sm-auto,
    .mx-sm-auto {
        margin-right: auto!important
    }
    .mb-sm-auto,
    .my-sm-auto {
        margin-bottom: auto!important
    }
    .ml-sm-auto,
    .mx-sm-auto {
        margin-left: auto!important
    }
}
/* Tablet Portrait and Higher then 960 (desktop devices)
====================================================================== */
@media only screen and (min-width: 768px) and (max-width: 1199px) {
    #content {
        padding: 0;
        margin-left: 55px;
    }
    .tab-sidebarOverlay {
        display: block;
    }
    .sidebarOverlay, .page-sidebar-toggled .sidebar ~ .tab-sidebarOverlay {
        display: none;
    }
    /*Chat Box*/
    .form-control.IndividualChatInput, .form-control.GroupChatSend {
        height: 38px !important;
    }
    .btn.btn-sm.IndividualChatSend, .btn.btn-sm.GroupChatSend {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }
}
/*Medium Devices Portrait (Desktop Devices)
  =========================================*/
@media (min-width: 991px) and (max-width: 1199px) {
    /*Common*/
    .d-md-none {
        display: none!important
    }
    .d-md-inline {
        display: inline!important
    }
    .d-md-inline-block {
        display: inline-block!important
    }
    .d-md-block {
        display: block!important
    }
    .d-md-table {
        display: table!important
    }
    .d-md-table-row {
        display: table-row!important
    }
    .d-md-table-cell {
        display: table-cell!important
    }
    .d-md-flex {
        display: -webkit-box!important;
        display: -ms-flexbox!important;
        display: flex!important
    }
    .d-md-inline-flex {
        display: -webkit-inline-box!important;
        display: -ms-inline-flexbox!important;
        display: inline-flex!important
    }
    .m-md-0 {
        margin: 0!important
    }
    .mt-md-0,
    .my-md-0 {
        margin-top: 0!important
    }
    .mr-md-0,
    .mx-md-0 {
        margin-right: 0!important
    }
    .mb-md-0,
    .my-md-0 {
        margin-bottom: 0!important
    }
    .ml-md-0,
    .mx-md-0 {
        margin-left: 0!important
    }
    .m-md-1 {
        margin: .25rem!important
    }
    .mt-md-1,
    .my-md-1 {
        margin-top: .25rem!important
    }
    .mr-md-1,
    .mx-md-1 {
        margin-right: .25rem!important
    }
    .mb-md-1,
    .my-md-1 {
        margin-bottom: .25rem!important
    }
    .ml-md-1,
    .mx-md-1 {
        margin-left: .25rem!important
    }
    .m-md-2 {
        margin: .5rem!important
    }
    .mt-md-2,
    .my-md-2 {
        margin-top: .5rem!important
    }
    .mr-md-2,
    .mx-md-2 {
        margin-right: .5rem!important
    }
    .mb-md-2,
    .my-md-2 {
        margin-bottom: .5rem!important
    }
    .ml-md-2,
    .mx-md-2 {
        margin-left: .5rem!important
    }
    .m-md-3 {
        margin: 1rem!important
    }
    .mt-md-3,
    .my-md-3 {
        margin-top: 1rem!important
    }
    .mr-md-3,
    .mx-md-3 {
        margin-right: 1rem!important
    }
    .mb-md-3,
    .my-md-3 {
        margin-bottom: 1rem!important
    }
    .ml-md-3,
    .mx-md-3 {
        margin-left: 1rem!important
    }
    .m-md-4 {
        margin: 1.5rem!important
    }
    .mt-md-4,
    .my-md-4 {
        margin-top: 1.5rem!important
    }
    .mr-md-4,
    .mx-md-4 {
        margin-right: 1.5rem!important
    }
    .mb-md-4,
    .my-md-4 {
        margin-bottom: 1.5rem!important
    }
    .ml-md-4,
    .mx-md-4 {
        margin-left: 1.5rem!important
    }
    .m-md-5 {
        margin: 3rem!important
    }
    .mt-md-5,
    .my-md-5 {
        margin-top: 3rem!important
    }
    .mr-md-5,
    .mx-md-5 {
        margin-right: 3rem!important
    }
    .mb-md-5,
    .my-md-5 {
        margin-bottom: 3rem!important
    }
    .ml-md-5,
    .mx-md-5 {
        margin-left: 3rem!important
    }
    .p-md-0 {
        padding: 0!important
    }
    .pt-md-0,
    .py-md-0 {
        padding-top: 0!important
    }
    .pr-md-0,
    .px-md-0 {
        padding-right: 0!important
    }
    .pb-md-0,
    .py-md-0 {
        padding-bottom: 0!important
    }
    .pl-md-0,
    .px-md-0 {
        padding-left: 0!important
    }
    .p-md-1 {
        padding: .25rem!important
    }
    .pt-md-1,
    .py-md-1 {
        padding-top: .25rem!important
    }
    .pr-md-1,
    .px-md-1 {
        padding-right: .25rem!important
    }
    .pb-md-1,
    .py-md-1 {
        padding-bottom: .25rem!important
    }
    .pl-md-1,
    .px-md-1 {
        padding-left: .25rem!important
    }
    .p-md-2 {
        padding: .5rem!important
    }
    .pt-md-2,
    .py-md-2 {
        padding-top: .5rem!important
    }
    .pr-md-2,
    .px-md-2 {
        padding-right: .5rem!important
    }
    .pb-md-2,
    .py-md-2 {
        padding-bottom: .5rem!important
    }
    .pl-md-2,
    .px-md-2 {
        padding-left: .5rem!important
    }
    .p-md-3 {
        padding: 1rem!important
    }
    .pt-md-3,
    .py-md-3 {
        padding-top: 1rem!important
    }
    .pr-md-3,
    .px-md-3 {
        padding-right: 1rem!important
    }
    .pb-md-3,
    .py-md-3 {
        padding-bottom: 1rem!important
    }
    .pl-md-3,
    .px-md-3 {
        padding-left: 1rem!important
    }
    .p-md-4 {
        padding: 1.5rem!important
    }
    .pt-md-4,
    .py-md-4 {
        padding-top: 1.5rem!important
    }
    .pr-md-4,
    .px-md-4 {
        padding-right: 1.5rem!important
    }
    .pb-md-4,
    .py-md-4 {
        padding-bottom: 1.5rem!important
    }
    .pl-md-4,
    .px-md-4 {
        padding-left: 1.5rem!important
    }
    .p-md-5 {
        padding: 3rem!important
    }
    .pt-md-5,
    .py-md-5 {
        padding-top: 3rem!important
    }
    .pr-md-5,
    .px-md-5 {
        padding-right: 3rem!important
    }
    .pb-md-5,
    .py-md-5 {
        padding-bottom: 3rem!important
    }
    .pl-md-5,
    .px-md-5 {
        padding-left: 3rem!important
    }
    .m-md-auto {
        margin: auto!important
    }
    .mt-md-auto,
    .my-md-auto {
        margin-top: auto!important
    }
    .mr-md-auto,
    .mx-md-auto {
        margin-right: auto!important
    }
    .mb-md-auto,
    .my-md-auto {
        margin-bottom: auto!important
    }
    .ml-md-auto,
    .mx-md-auto {
        margin-left: auto!important
    }
}
/* Mobile Landscape Size to Tablet Portrait (devices and browsers)
====================================================================== */
@media only screen and (min-width: 480px) and (max-width: 767px) {
    .stat {
        width: 50%;
        margin: 10px 0 0 0;
        float: left;
    }

    .quick-button,
    .quick-button-small {
        margin-bottom: 20px;
    }

    .fc-button-today,
    .fc-button-month,
    .fc-button-agendaWeek,
    .fc-button-agendaDay {
        display: none;
    }

    footer {
        padding: 10px 20px;
    }

}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers)
=================================================================== */
@media only screen and (max-width: 479px) {
    .stat {
        width: 100%;
        margin: 1% 0 0 0;
        float: left;
    }

    .quick-button,
    .quick-button-small {
        margin-bottom: 20px;
    }

    .fc-button-today,
    .fc-button-month,
    .fc-button-agendaWeek,
    .fc-button-agendaDay {
        display: none;
    }

    table,
    .pagination {
        font-size: 10px;
    }

    .pagination {
        padding: 5px;
    }

    .ui-slider-handle {
        margin-top: 1px !important;
    }

    footer {
        padding: 10px 20px;
    }

    .tabs-hr-scroll::-webkit-scrollbar {
    height: 5px !important;
    background-color:#fafafa !important;

    }

    .tabs-hr-scroll::-webkit-scrollbar-thumb {
      background-color:#ccc !important;
    }
    .tabs-hr-scroll {
        display: flex !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        height: 40px !important;
        padding-top: 7px;
    }
    .tabs-hr-scroll li a {
        text-align:center;
        display:flex;
    }
    .nav-pills > li > a {
        color: #a7a7a7;
    }
    .p-xs-0 {
        padding: 0 !important;
    }
    .p-xs-t-15 {
        padding-top:15px !important;
    }
    .panel-title {
        font-size: 16px !important;
    }
    .box-header .panel-title {
        font-size: 18px !important;
        font-weight: 600;
        text-transform: uppercase;
    }
    .nav-pills > li.active > a::after {
        /*background:none;*/
    }
    .list-group-item.active > .badge, .nav-pills.Navtabs_li > li.active > a > .badge {
        padding: 3px 6px;
    }
    .left-sec.sidemenu-hide {
        display:none !important;
    }
    .right-sec.sidemenu-removed {
        margin-left: 0 !important;
    }
    .navbar > .container-fluid .navbar-brand.navbrand {
        width:unset !important;
    }
   
}

/*==================================================
=            Bootstrap 3 Media Queries             =
==================================================*/

/*==========  Mobile First Method  ==========*/

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
    /*Common style's*/
    .navbar-header .navbar-brand img.logo, .navbar-header .navbar-brand img.small-logo {
        margin: 0 auto;
    }
    .slidetoggle .navbar-header .navbar-brand img.logo {
        display: none;
    }
    .page-sidebar-toggled .sidebar {
        top: 50px;
        -moz-transition: left 0.2s ease-out;
        -o-transition: left 0.2s ease-out;
        -webkit-transition: left 0.2s ease-out;
        transition: left 0.2s ease-out;
    }

    /*Sidebar_left New Design Begain*/
    .slidetoggle #header .navbar-header .navbar-brand {
        width: 55px !important;
    }

    .slidetoggle .navbar-header .navbar-brand img.logo, .navbar-header .navbar-brand img.small-logo {
        display: none;
    }

    .slidetoggle .navbar-header .navbar-brand img.small-logo {
        display: block;
        margin: 0 auto;
        outline: none;
    }

    .page-sidebar-fixed.page-sidebar-toggled .sidebar {
        width: 55px;
        overflow-y: visible;
        z-index: 1000;
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul li.user-panel,
    .page-sidebar-toggled .sidebar .navbar-static-side ul li a span.menu-title,
    .page-sidebar-toggled .sidebar .navbar-static-side ul li .nav-second-level li a span.submenu-title,
    .page-sidebar-toggled .sidebar .navbar-static-side ul li a span.fa.arrow {
        display: none;
    }

    .page-sidebar-toggled .sidebar .navbar-nav.side-nav > li.has-sub > a {
        padding: 8px 12px;
        border-width: 1px 0 1px 4px;
        border-style: solid;
        border-color: transparent;
    }

    .page-sidebar-toggled .sidebar .navbar-nav.side-nav > li.has-sub.active > a,
    .page-sidebar-toggled .sidebar .navbar-nav.side-nav > li.has-sub.active > a:hover,
    .page-sidebar-toggled .sidebar .navbar-nav.side-nav > li.has-sub.active > a:focus {
        padding-left: 9px;
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul li:hover a span.submenu-title {
        display: block !important;
        margin-left: 0;
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul li.has-sub:hover ul.nav-second-level {
        display: block !important;
        position: absolute;
        top: 48px;
        left: 55px;
        min-width: inherit;
        width: 195px;
        border-width: 0 1px 1px 1px;
        border-style: solid;
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul li.has-sub:hover ul.nav-second-level:before {
        width: 0;
        background-color: transparent;
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul li:hover ul.nav-second-level li a {
        padding: 10px;
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul li ul.nav-second-level {
        display: none !important; /*Sprint-1 Bud ID: 1181 -this is resolved*/
        position: absolute;
        top: 50px;
        left: 55px;
        width: 195px;
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul li ul.nav-second-level li a i {
        display: none;
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul li ul.nav-second-level li a span.label {
        position: absolute;
        top: 15px;
        right: 10px;
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul > li > a span.label {
        display: block !important;
        position: absolute;
        right: -10px;
        top: 0;
        padding: 2px 4px;
    }
    /* --Sidebar_left New Design END-- */

    /*CourseContents.html*/
    .cours-contents .left-sec {
        top: 50px;
    }
}

/*Large Devices, Wide Screens*/
@media only screen and (min-width : 1392px) {
    #tilesView {
        width: 1170px;
        padding-left: 15px;
        padding-right: 15px;
        margin-left: auto;
        margin-right: auto;
    }
    .tiles-view .thumbnail > .img-sec {
        width: 100%;
    }

    .tiles-view .thumbnail > .img-sec img {
        width: 100%;
    }
}

/*==========  Non-Mobile First Method  ==========*/
@media screen and (min-width: 1392px) and (max-width: 1920px) {
    .tiles-view .thumbnail > .img-sec {
        width: 100%;
    }

    .tiles-view .thumbnail > .img-sec img {
        width: 100%;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
    .tiles-view .thumbnail > .img-sec {
        width: 100%;
    }

    .tiles-view .thumbnail > .img-sec img {
        width: 100%;
    }
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {
      .left-sec.sidemenu-hide {
        display:none !important;
    }
    .right-sec.sidemenu-removed {
    margin-left: 0 !important;
}
    .tiles-large {
        width: 50% !important;
    }

    .tiles-large-learner {
        width: 50% !important;
    }

    .tiles-view .thumbnail > .img-sec {
        width: 100%;
    }

    .tiles-view .thumbnail > .img-sec img {
        width: 100%;
    }
    .timeline-hide-xs > li > .timeline-item {
        padding-bottom: 15px;
    }
    .progress-with-tp .tooltip {
        display: none !important;
    }
    .progress-with-tp .progress-bar {
        min-width: 2em;
        height: 18px !important;
    }
}

/* All Mobile Sizes (devices and browser) *** Small Devices, Tablets ***
====================================================================== */
@media only screen and (max-width: 767px) {
     body {
        padding-top: 50px;
    }
    #content .spinner, #content.slidetoggle .spinner {
        left: 0;
    }
    #page-container #content {
        margin-left: 0;
    }
    .navbar-collapse, .navbar-default .navbar-form {
        border-top: none;
    }

    .xs-row {
        margin-right: -15px;
        margin-left: -15px;
    }

    .quiz-result .QuizResultContainer label.control-label {
        margin-left: 10px !important;
        text-align: right !important;
        width: 51% !important;
    }

    /*.slidetoggle #header .navbar-header, .slidetoggle #header .navbar-header .navbar-brand {
        width: auto !important;
    }*/

    .navbar-header .navbar-brand img.logo {
        display: none;
    }
    .slidetoggle .navbar-header .navbar-brand img.logo {
        display: none;
        margin: 0 auto;
    }
    .slidetoggle .navbar-header .navbar-brand img.small-logo, .navbar-header .navbar-brand img.small-logo {
        display: block;
        margin: 0;
    }

    #header.navbar-default .navbar-toggle:hover, #header.navbar-default .navbar-toggle:focus {
        background-color: #ffffff;
    }

    #header.navbar-default .topbar-main .navbar-right {
        margin-bottom: 0;
        margin-top: 0;
        /*padding-right: 15px;*/
        float: right;
    }

    #header.navbar-default .topbar-main .navbar-right > li {
        display: inline-block;
    }
    .navbar-default .navbar-nav > li.navbar-user > a, .navbar-default .navbar-nav > li.navbar-user > a:hover,
    .navbar-default .navbar-nav > li.navbar-user > a:focus {
        padding: 15px 15px 13px;
    }

    #header.navbar-default .navbar-nav > .navbar-user > a img {
        width: 24px;
        height: 24px;
        outline: none;
        padding: 0;
        border: none;
    }

    #header.navbar-default .navbar-nav > .navbar-user > a img, #header.navbar-default .navbar-nav > .navbar-user > a .caret {
        margin-top: -4px;
        line-height: 10;
    }

    #header.navbar-default .topbar-main .navbar-nav .navbar-user.open .dropdown-menu {
        min-width: 200px !important;
    }
    #header .searchForm {
        position: fixed;
        top: 0;
        width: 50%;
        left: 25%;
    }
    /* --Sidebar-- All Mobile Sizes (devices and browser) *** Small Devices, Tablets *** Begain */
    .page-sidebar-fixed.page-sidebar-toggled .sidebar {
        width: 17em;
        overflow-y: auto;
    }
    .sidebarOverlay, .tab-sidebarOverlay {
        display: none;
    }
    .page-sidebar-toggled.page-sidebar-fixed .sidebar.collapse, .page-sidebar-toggled.page-sidebar-fixed .sidebar.collapse + .sidebarOverlay {
        left: 0 /*-230px*/;
        display: block;
    }

    .navbar-nav.side-nav, .side-nav.ui-widget {
        padding-bottom: 24px !important;
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul li.user-panel,
    .page-sidebar-toggled .sidebar .navbar-static-side ul li a span.menu-title,
    .page-sidebar-toggled .sidebar .navbar-static-side ul li .nav-second-level li a span.submenu-title,
    .page-sidebar-toggled .sidebar .navbar-static-side ul li a span.fa.arrow {
        display: inline-block;
    }

    .page-sidebar-toggled .sidebar .navbar-nav.side-nav > li.has-sub > a {
        padding: 8px 12px;
    }

    .page-sidebar-toggled .sidebar .navbar-nav.side-nav > li.has-sub.active > a,
    .page-sidebar-toggled .sidebar .navbar-nav.side-nav > li.has-sub.active > a:hover,
    .page-sidebar-toggled .sidebar .navbar-nav.side-nav > li.has-sub.active > a:focus {
        padding-left: 9px;
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul li:hover a span.menu-title,
    .page-sidebar-toggled .sidebar .navbar-static-side ul li a:hover span.menu-title {
        position: relative;
        top: 0;
        left: 0 !important;
        padding: 0;
        margin-left: 0;
        width: auto;
        height: auto;
        display: inline-block !important;
        border: none;
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul li:hover a span.submenu-title,
    .page-sidebar-fixed .sidebar, .page-sidebar-fixed .sidebar.collapse {
        display: block;
        height: auto !important;
        margin-left: 0;
        top: 50px;
        left: -230px;
        -moz-transition: left 0.2s ease-out;
        -o-transition: left 0.2s ease-out;
        -webkit-transition: left 0.2s ease-out;
        transition: left 0.2s ease-out;
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul li.has-sub:hover ul.nav-second-level {
        position: relative;
        top: 0;
        left: 0;
        width: 100%;
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul li.has-sub:hover ul.nav-second-level:before {
        width: 0;
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul li:hover ul.nav-second-level li a {
        padding: 8px;
    }


    .page-sidebar-toggled .sidebar .navbar-static-side ul li ul.nav-second-level {
        /*display: none !important;*/ /*Sprint-1 Bud ID: 1181 -this is resolved*/
        /*position: absolute;
        top: 50px;
        left: 55px;
        width: 195px;*/
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul li ul.nav-second-level li a i {
        display: none;
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul li ul.nav-second-level li a span.label {
        position: absolute;
        top: 15px;
        right: 10px;
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul > li > a span.label {
        display: block !important;
        position: absolute;
        right: -10px;
        top: 0;
        padding: 2px 4px;
    }

    .page-sidebar-toggled .sidebar .navbar-static-side ul li:hover a span.menu-title {
        border: none !important;
    }
    /* /--Sidebar--/ All Mobile Sizes (devices and browser) *** Small Devices, Tablets *** End ///// */
    /*Chat Box*/
    .form-control.IndividualChatInput, .form-control.GroupChatSend {
        height: 38px !important;
    }
    .btn.btn-sm.IndividualChatSend, .btn.btn-sm.GroupChatSend {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    .xs-b-t-1 {
        border-top: 1px solid #cccccc;
    }
    .breadcrumb {
        margin: 0;
    }
    .welcome-bg, .dashboard_mine {
        top: 20px;
    }
    .recommend-course {
        padding: 0 !important;
    }

    .current-plan {
        float: none !important;
        min-height: inherit !important;
    }


    .Chat-wrapper .nav.nav-tabs > li {
        width: 90% !important;
    }
    .dark {
        padding: 5px;
        top: 5px;
        right: 0;
        margin-bottom: 0;
        margin-right: 0;
        position: relative;
        border: 0;
    }

    .widget,
    .box {
        margin-bottom: 20px !important;
    }

    /*UMS User Managment lmsUsers.html Page*/
    .box-header .col-xs-12 {
        margin-top: 10px;
        text-align: left !important;
    }
    /*UMS User Managment > Add new User Form lmsUserEdit.html Page*/
    .container_box {
        margin-bottom: 20px;
    }

    .setup-content .m-t-10 {
        min-height: 560px;
    }

    .setup-content .m-t-10 .col-md-12:last-child {
        right: 0;
    }

    .setup-content .form-group .control-label {
        text-align: left !important;
    }

    .form-group label {
        width: 100% !important;
        text-align: left !important;
    }

    .form-group:last-child label {
        width: 100% !important;
        text-align: left !important;
    }

    .setup-content#step-4 .form-group .start-date, .setup-content#step-4 .form-group .end-date {
        width: 100% !important;
    }

    .setup-content#step-4 .form-group .start-date-box, .setup-content#step-4 .form-group .end-date-box {
        padding: 0 15px !important;
    }
    /*SolutionDesigner Dashboard page dbinit.html*/
    .gridster-mobile .gridster-item {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .gridster-item .panel .panel-body {
        height: auto !important;
    }

    /*Quiz module dataTable's*/
    .panel-body div.dataTables_filter label, .panel-body div.dataTables_length label {
        float: left;
    }

    #tabs {
        overflow: hidden;
        width: 100%;
        margin: 0;
        padding: 0;
        list-style: none;
        color: black;
        display: block;
    }

    .nav.nav-pills.Navtabs_li > li {
        padding: 5px;
        float: none;
        display: block;
        text-align: center;
    }

    .nav-pills > li.active > a::after {
        left: 10%;
        width: 5em;
        bottom: -10px;
    }

    .nav-pills > li > a {
        padding: 0 5px !important;
        border-right: 0 solid #ccc;
    }

    /*Stepwizard start*/
    .stepwizard-step > p {
        width: 50%;
    }

    .wizard .nav-tabs {
        margin-left: 2%;
    }

    .wizard > div.wizard-inner {
        padding-left: 15px !important;
    }

    .tiles-large {
        width: 33.33% !important;
        float:left;
    }

    .tiles-large-learner {
        width: 50% !important;
        float:left;
    }

    .tiles-view .thumbnail > .img-sec {
        width: 100% !important;
    }

    .tiles-view .thumbnail > .img-sec img {
        width: 100% !important;
    }
    .xs-pull-none {
        float: none !important;
    }
    .xs-width-auto {
        width: auto;
    }
    .timeline-hide-xs > li > .timeline-item {
        margin-left: 0;
    }
    .lp-details .LPCourseDetails .timeline > li:before, .lp-details .LPCourseDetails .timeline > li:after {
        display: none;
    }
    .lp-details .LPCourseDetails .timeline-item .media-left {
        display: block;
        padding-right: 0;
    }
    #LPcourseoverview .timeline .timeline-item {
        margin-left: 0;
        margin-right: 0;
    }
    /*Course contents page*/
    .cours-contents .left-sec {
        width: 320px !important;
        top: 50px !important;
    }

    /*Common*/
    .d-xs-none {
        display: none!important
    }
    .d-xs-inline {
        display: inline!important
    }
    .d-xs-inline-block {
        display: inline-block!important
    }
    .d-xs-block {
        display: block!important
    }
    .d-xs-table {
        display: table!important
    }
    .d-xs-table-row {
        display: table-row!important
    }
    .d-xs-table-cell {
        display: table-cell!important
    }
    .d-xs-flex {
        display: -webkit-box!important;
        display: -ms-flexbox!important;
        display: flex!important
    }
    .d-xs-inline-flex {
        display: -webkit-inline-box!important;
        display: -ms-inline-flexbox!important;
        display: inline-flex!important
    }
    .pt-xs-15 {
        padding-top: 15px !important;
    }
    .pl-xs-0 {
        padding-left: 0 !important;
    }
    .pl-xs-15 {
        padding-left: 15px !important;
    }
    .mr-xs-0 {
        margin-right: 0 !important;
    }
    .center-block-xs {
        margin: 0 auto;
    }
    .m-xs-0 {
        margin: 0!important
    }
    .mt-xs-0,
    .my-xs-0 {
        margin-top: 0!important
    }
    .mr-xs-0,
    .mx-xs-0 {
        margin-right: 0!important
    }
    .mb-xs-0,
    .my-xs-0 {
        margin-bottom: 0!important
    }
    .ml-xs-0,
    .mx-xs-0 {
        margin-left: 0!important
    }
    .m-xs-1 {
        margin: .25rem!important
    }
    .mt-xs-1,
    .my-xs-1 {
        margin-top: .25rem!important
    }
    .mr-xs-1,
    .mx-xs-1 {
        margin-right: .25rem!important
    }
    .mb-xs-1,
    .my-xs-1 {
        margin-bottom: .25rem!important
    }
    .ml-xs-1,
    .mx-xs-1 {
        margin-left: .25rem!important
    }
    .m-xs-2 {
        margin: .5rem!important
    }
    .mt-xs-2,
    .my-xs-2 {
        margin-top: .5rem!important
    }
    .mr-xs-2,
    .mx-xs-2 {
        margin-right: .5rem!important
    }
    .mb-xs-2,
    .my-xs-2 {
        margin-bottom: .5rem!important
    }
    .ml-xs-2,
    .mx-xs-2 {
        margin-left: .5rem!important
    }
    .m-xs-3 {
        margin: 1rem!important
    }
    .mt-xs-3,
    .my-xs-3 {
        margin-top: 1rem!important
    }
    .mr-xs-3,
    .mx-xs-3 {
        margin-right: 1rem!important
    }
    .mb-xs-3,
    .my-xs-3 {
        margin-bottom: 1rem!important
    }
    .ml-xs-3,
    .mx-xs-3 {
        margin-left: 1rem!important
    }
    .m-xs-4 {
        margin: 1.5rem!important
    }
    .mt-xs-4,
    .my-xs-4 {
        margin-top: 1.5rem!important
    }
    .mr-xs-4,
    .mx-xs-4 {
        margin-right: 1.5rem!important
    }
    .mb-xs-4,
    .my-xs-4 {
        margin-bottom: 1.5rem!important
    }
    .ml-xs-4,
    .mx-xs-4 {
        margin-left: 1.5rem!important
    }
    .m-xs-5 {
        margin: 3rem!important
    }
    .mt-xs-5,
    .my-xs-5 {
        margin-top: 3rem!important
    }
    .mr-xs-5,
    .mx-xs-5 {
        margin-right: 3rem!important
    }
    .mb-xs-5,
    .my-xs-5 {
        margin-bottom: 3rem!important
    }
    .ml-xs-5,
    .mx-xs-5 {
        margin-left: 3rem!important
    }
    .p-xs-0 {
        padding: 0!important
    }
    .pt-xs-0,
    .py-xs-0 {
        padding-top: 0!important
    }
    .pr-xs-0,
    .px-xs-0 {
        padding-right: 0!important
    }
    .pb-xs-0,
    .py-xs-0 {
        padding-bottom: 0!important
    }
    .pl-xs-0,
    .px-xs-0 {
        padding-left: 0!important
    }
    .p-xs-1 {
        padding: .25rem!important
    }
    .pt-xs-1,
    .py-xs-1 {
        padding-top: .25rem!important
    }
    .pr-xs-1,
    .px-xs-1 {
        padding-right: .25rem!important
    }
    .pb-xs-1,
    .py-xs-1 {
        padding-bottom: .25rem!important
    }
    .pl-xs-1,
    .px-xs-1 {
        padding-left: .25rem!important
    }
    .p-xs-2 {
        padding: .5rem!important
    }
    .pt-xs-2,
    .py-xs-2 {
        padding-top: .5rem!important
    }
    .pr-xs-2,
    .px-xs-2 {
        padding-right: .5rem!important
    }
    .pb-xs-2,
    .py-xs-2 {
        padding-bottom: .5rem!important
    }
    .pl-xs-2,
    .px-xs-2 {
        padding-left: .5rem!important
    }
    .p-xs-3 {
        padding: 1rem!important
    }
    .pt-xs-3,
    .py-xs-3 {
        padding-top: 1rem!important
    }
    .pr-xs-3,
    .px-xs-3 {
        padding-right: 1rem!important
    }
    .pb-xs-3,
    .py-xs-3 {
        padding-bottom: 1rem!important
    }
    .pl-xs-3,
    .px-xs-3 {
        padding-left: 1rem!important
    }
    .p-xs-4 {
        padding: 1.5rem!important
    }
    .pt-xs-4,
    .py-xs-4 {
        padding-top: 1.5rem!important
    }
    .pr-xs-4,
    .px-xs-4 {
        padding-right: 1.5rem!important
    }
    .pb-xs-4,
    .py-xs-4 {
        padding-bottom: 1.5rem!important
    }
    .pl-xs-4,
    .px-xs-4 {
        padding-left: 1.5rem!important
    }
    .p-xs-5 {
        padding: 3rem!important
    }
    .pt-xs-5,
    .py-xs-5 {
        padding-top: 3rem!important
    }
    .pr-xs-5,
    .px-xs-5 {
        padding-right: 3rem!important
    }
    .pb-xs-5,
    .py-xs-5 {
        padding-bottom: 3rem!important
    }
    .pl-xs-5,
    .px-xs-5 {
        padding-left: 3rem!important
    }
    .m-xs-auto {
        margin: auto!important
    }
    .mt-xs-auto,
    .my-xs-auto {
        margin-top: auto!important
    }
    .mr-xs-auto,
    .mx-xs-auto {
        margin-right: auto!important
    }
    .mb-xs-auto,
    .my-xs-auto {
        margin-bottom: auto!important
    }
    .ml-xs-auto,
    .mx-xs-auto {
        margin-left: auto!important
    }
}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
    .tiles-large {
        width: 100% !important;
        float:left;
    }

    .tiles-large-learner {
        width: 100% !important;
    }

    .tiles-view .thumbnail > .img-sec {
        width: 100%;
    }

    .m-xs-0 {
        margin:0 !important;
    }
    .quiz-instruction .Note_instruction {
        padding-left: 8%;
    }
    .tiles-view .thumbnail > .img-sec img {
        width: 100%;
        border-radius: 15px 15px 0 0 !important;
    }
    select, select.form-control, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input {
        border-radius:6px !important;
    }
    .input-group .input-group-addon, .btn {
        border-radius: 6px !important;
    }
    /*Course contents page*/
    /*.right-sec > div[ng-switch="type"] > div[ng-switch-when],*/
    .cours-contents .right-sec iframe, .cours-contents .right-sec object,
    .cours-contents .right-sec audio,
    .right-sec [ng-switch-default] {
        height: 70vh !important;
    }
    .cours-contents .right-sec video, .cours-contents .right-sec img {
        height: auto !important;
    }
    .cours-contents .right-sec .embed-responsive.embed-responsive-16by9 {
        padding-bottom: 0;
        height: 70vh;
    }
    .cours-contents .right-sec img.ImgContent {
        width: 100%;
        height: auto !important;
    }
}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {
    .tiles-large {
        width: 100% !important;
    }

    .tiles-large-learner {
        width: 100% !important;
    }

    .tiles-view .thumbnail > .img-sec {
        width: 100%;
    }
    .tiles-view .thumbnail > .img-sec img {
       width: 100%;
     }
     body {
        padding-top: 100px !important;
    }

    .cours-contents .left-sec {
        top: 100px;
    }
}