﻿


@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 667px) {
    .nav>li{
            /*display: inline-block !important;*/

    }


    .navbar-header .form-control {
    height: 32px !important;
}
    .navbar-form .input-group {
       margin-left: 0px;
    width: 100%;
    margin-right: 0px;
}

    .textclipp5 {
    width: 215px  !important; 
}
    .navbar-nav .panel {
  
    padding: 20px;
}

    .dashboardmeter2 {
   
    height: 180px !important; 
}

}


@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 667px) 
and (orientation : landscape) {

    .modal .close {
       
    text-align: center;
    margin: 0 auto !important;
    width: 500px!important;
}
    .textclipp5 {
    width: 500px  !important; 
}

    .dashboardmeter{

 height: 350px !important; 
}

    .dashboardmeter2 {
   
   width:60% !important; height: 200px !important;  margin:0 auto;
}

    .count-info .label {
    
    right: 45px !important;
    top: 3px !important;
}


    .profilepic {
        width: 667px !important;
    }
    .file_icon{

        padding: 0px 0px 0px 10px !important;

    }
    .admin_icon {
        padding: 0px 0px 0px 0px  !important;
    }

    .card {
        margin-top: 5px;
        margin-bottom: 5px;
    }
    
    #app-menu-inner {
    
    width: 677px;
}
.adminmenufull {
    
    position: static;
    height:230vh !important;
        width: 100% !important;
}

.pagemaintitle {
   
    margin-top: 50px;
}

}

/*#myNavbar .menu{display: block}
#myNavbar .menu:after, .menu:before{content: '';display: table;clear: both}
#myNavbar .menu>li{display: inline-block;float: left}
#myNavbar .menu a{display: block;text-decoration: none;padding: 6px 10px;}
#myNavbar .menu a:hover{  }
#myNavbar .dropdown-menu{max-height: 0;overflow: hidden;transition: max-height 1s ease}
#myNavbar .open .dropdown-menu{max-height: 30rem}*/

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 767px) {

    .file-actions .dropdown-menu{

        top:30px !important;
    }


    .GOrght {
    margin-left: 0px !important;
}

    .nav-second-level li a{
        padding-left:10px !important

    }

   /* .wrapper-content{

        padding-top:50px;
    }*/


    .navbar-right{
        /*width:420px;*/
    /*width:50px;
    float:right;
        margin-left: 80px;*/
        background:#fff;
    }
    


    .usernameclip{
        margin: 0 auto;

    }


    .responsive-tabs .dropdown-menu > li > a{
    color:#fff

}
    .catalogdrop .dropdown-menu > li > a{
    color:#000

}
    .padd-top{

        margin-top:50px
    }

    .mselecter4{
    margin-right: 10px !important;

    }
     .logo-wrapper > a > img{

            margin-top: 2px;

    }
#app-menu-inner .app-name {
   
    padding: 10px;
}

.adminmenufull {
    
    position: static;
    height: 210vh !important;
        width: 100% !important;
}
    .mselecter2 {
        width: 45% !important;
    }

    .mselecter3 {
        width: 100% !important;
    }
    .greenheader {
        padding: 10px 10px 37px 10px !important;
    }
    .greenheader3 {
        padding: 10px 10px 10px 10px !important;
    }
    
     /*#monthlyregisteredusers{

            margin-top: 600px  !important;
    }*/


    .overalladmin {

        height:130px !important;
    }
    
    
    .admin_icon .fa {
   
    margin-bottom: 12px;
}
    .myprofilemenutext{

        width: 100%;
        text-align: center;
        padding: 15px 0px;
           /*border-top: 1px solid #fff;*/
    }
    
    .navbar-nav .open .dropdown-menu>li>a, .navbar-nav .open .dropdown-menu .dropdown-header .myprofiletext{
    text-align:center;
    padding: 5px 0px 5px 0px;


}
    

    .profile-header-inner{

            margin-top: 20px;
            margin-bottom: 20px;
    }
    
   
    .input-group {
    /*width: 300px;*/
    margin: 0 auto;
}
.navbar-nav {
    margin: 0px 0px;
    width: 100vw;
        background-image: linear-gradient(to bottom,#ab1111 0%,#841400 100%);
}
    /*#app-menu-inner .app-name {
    width: 356px !important;
}*/

    ul, menu, dir {
    -webkit-padding-start: 0px;
    padding-inline-start: 0px;
}

#app-menu-inner > .panel {
   
    border-bottom: 1px solid #fff2f2;
        text-align: center;
        margin:0px;
}
    .navbar-nav > li > .dropdown-menu {
        width: 100%;
       
        margin-top: 1px;
       
    }

    #app-menu-inner>.panel>ul li {
   
    border-bottom: 1px solid #fff2f2;
}
    .dropdown-menu li>a{

            padding-right: 0px;
    padding-right: 0rem;

    }

    .admin_icon {
        padding: 0px 0px 0px 0px;
    }

    .file_icon{

        padding: 0px 0px 0px 25px !important;

    }

}

@media only screen 
and (min-device-width : 414px) 
and (max-device-width : 736px) { 

   .textclipp5 {
    width: 245px !important;
}
}

@media (max-width: 812px) {
    #mainmenubar>.panel>ul li{

        text-align: center;
    }


    .textclipp5 {
    width: 380px;
}


     .border-left2 {
    border-left: 0px solid #d8d6d6 !important;
}
    .userstats{
    margin-top: 15px;

    }

    .slick-next {
    margin-right: -10px!important;
}

    .slick-prev {
        left: -11px !important; 
    }


    .adaptiveduration p{

            font-size: 14px !important;
    }
    .dropdown-content .jstree-default-large .jstree-node{
            width: 150px !important;

    }

    .jstree-default-large .jstree-node{
            width: 300px;

    }

    .adaptiveimage {
        height: auto !important;
        width: 100% !important;
    }



    .navbar-nav .panel {
        padding: 10px 30px;
            text-align: center;
}
    #mainmenubar .dropdown-menu li > a{
            text-align: center;

    }

    #userCourseWizard .nav > li > a {
    
    margin-bottom: 10px;
}


    .progress {
            margin-top: 10px;
    }

    .newbie2{
        text-align:left !important;

    }


    .modified-home .two-columns-wide-outer .two-columns-wide-wrapper{
            padding: 0px 20px !important;

    }

    .myprofileimg2{
    height: 50px!important;
    margin-top: 20px!important;
        width: 50px !important;

    }

    .myrecent2{
        margin-right: 0px !important;
}

    .language-bar option{
        font-size:13px;
    }
    .myrecentcourses a {
        white-space: nowrap;
    }

    #recentProgressDetails{

            padding-right: 15px !important;
             padding-left: 15px !important;
    }
    #gam-userstat{

    margin-left:0px !important; margin-right:0px !important;
}
    .recentemodules{

         margin-left:0px !important; margin-right:0px !important;
    }
    .dashboardmargleft {
        margin-left: 0px !important;
    }
    .dashboardmargleft2 {
        margin-left: 15px !important;
    }
    .dashboardmargright {
        margin-right: 15px !important;
        margin-left: 15px !important;
    }
}
.profile-header .profile-name-role .user-name{
    color: #fff;
        font-size: 33px;
    

}
.profile-header .profile-name-role .user-role {
    font-size: 22px;
    font-size: 2.2rem;
        color: #fff;
}
@media (min-width: 768px) {
    .files .file .file-actions:not(.actions-dropdown) .dropdown-menu li > a:hover, .files .file .file-actions:not(.actions-dropdown) .dropdown-menu li > a:focus, .files .file .file-actions:not(.actions-dropdown) .dropdown-menu li > a:active {
        text-decoration: none;
    }
     .files .file .file-actions:not(.actions-dropdown) .dropdown-menu li > a {
        color: #000;width: 150px;
    text-align: center;
    }
    .profile-header .profile-header-inner .profile-info-wrapper>* {
    display: inline-block;
        color: #282826;
}
    .sale-active #search-holder #search .wrapper .search-filters {
        top: 149px;
        height: calc(100% - 149px)
    }
    .container-fluid > .navbar-collapse, .container-fluid > .navbar-header, .container > .navbar-collapse, .container > .navbar-header {
        margin-right: 0;
        margin-left: 0;
    }
     .files .file {
        padding: 0px;
        padding: 0rem;
    }
      .padded-responsive {
        padding: 10px 0px;
        padding: 1rem 0rem;
    }
      .course-block:hover .course-block-intro {
        opacity: 1;
        pointer-events: all
    }
}
@media(max-width:768px) {
    .modal .close {
       
    text-align: center;
    margin: 0 auto !important;
    width: auto !important;
}


    .course-block .course-block-content .mobile-read-more {
        text-align: center
    }
    .course-block .course-block-content .mobile-read-more .mobile-read-more-button {
        border-radius: 23px;
        display: inline-block
    }
    .course-block .course-block-content h4 {
        margin-bottom: 40px
    }
    .our-courses .x-wide-course-layout>ul li {
        height: auto;
        vertical-align: top
    }
    .our-courses .x-wide-course-layout>ul .course-block {
        position: relative;
        min-height: 380px
    }
    .our-courses .x-wide-course-layout>ul .course-block .course-block-info {
        display: none
    }
    .our-courses .x-wide-course-layout>ul .course-block .course-block-content .mobile-read-more {
        position: absolute;
        top: 66px;
        left: 50%;
        transform: translate(-50%);
        opacity: 1
    }
    .our-courses .x-wide-course-layout>ul .course-block .course-block-content .mobile-read-more .mobile-read-more-button {
        background-color: rgba(0, 145, 199, .75)
    }
}

@media (min-width: 767px) {
    .yamm .navbar-nav > li.active > a {
        border-bottom: 2px solid #fff;
    }
    .yamm .navbar-nav > li > a {
        padding-top: 10px;
        padding-bottom: 10px;
        line-height: 33px;
    }
}

@media (min-width: 992px) {
    /*.movetoheader{

             margin-top: -82px;
     }
     #page-content{
          margin-top: 82px;

     }*/

    #app-header .logo-wrapper {
        width: 100%;
    }
    #btn-toggle-search {
     display:inline
}
    
}

@media only screen and (min-width:768px) {
     

     ul.support-menu li.support-menu-item {
        margin-top: 0
    }
     .listing-results-tabs {
        padding: 0 40px
    }
     ul.horizontal_share+a,
    ul.horizontal_share+a+a {
        display: inline-block
    }
    ul.horizontal_share {
        position: relative;
        top: 35px;
        text-align: left;
        margin-bottom: 0
    }
    .our-courses .buttons-container {
        background-color: #fff;
        padding: 10px 20px 0
    }
    .our-courses .buttons-container .buttons-container-inner .course-tab {
        width: calc(16.77777% - 10px);
        display: inline-block;
        margin: 0 5px 0 0
    }
    .cards {
        padding: 0 10px
    }
    .cards li {
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
        height: 320px;
        width: 25%;
        transition: all .6s cubic-bezier(.08, .96, .17, 1.43)
    }
    .cards li:first-child {
        top: 40px
    }
    .cards li:nth-child(2) {
        top: 45px
    }
    .cards li:nth-child(3) {
        top: 50px
    }
    .cards li:nth-child(4) {
        top: 55px
    }
    .cards li.active,
    .cards li:hover {
        top: 5px!important
    }
    .cards h3 {
        font-size: 1.5625em
    }
    .course {
        display: inline-block;
        margin: 10px;
        vertical-align: top
    }
    .course.active {
        display: block;
        left: 0;
        margin: 10px 10px 20px;
        position: absolute;
        right: 0;
        top: 0;
        width: 100%;
        z-index: 5
    }
    .course.active .course-holder {
        display: block
    }
    .course.active .course-info {
        opacity: 1;
        z-index: 10
    }
    .course.active .course-info .course-title {
        font: 400 1.25em Roboto, Helvetica Neue, Helvetica, Arial, sans-serif
    }
    .course.active .section-shadow {
        display: none
    }
    .course .course-features,
    .course .course-learning-paths,
    .course .course-reviews,
    .course .course-tags {
        padding: 70px 15px 95px
    }
    .course .course-features .description-text.scrollbar {
        height: 200px;
        margin-bottom: 5px;
        overflow-y: auto
    }
    .course .course-features .description-text.scrollbar p {
        margin: 0;
        padding: 0 15px 0 0
    }
    .course .course-features .description-text a {
        color: #fff;
        text-decoration: underline
    }
    .course .course-learning-paths {
        padding: 70px 15px 20px
    }
    .course .course-learning-paths .learning-path-holder {
        max-height: 280px;
        overflow-y: auto;
        width: 100%
    }
    .course .course-reviews {
        padding: 70px 15px 5px
    }
    .course .course-reviews .reviews-group {
        max-height: 305px;
        overflow-y: auto
    }
    .course .course-reviews .info-box {
        margin: 0 auto 15px
    }
    .course .course-reviews .info-box:nth-child(2) {
        margin: 0 auto
    }
    .course .course-reviews .info-box .header .round-image {
        height: 100px;
        left: 10px;
        width: 100px
    }
    .course .course-reviews .info-box.post .content .body .cols-container .col-name {
        padding: 75px 0 10px
    }
    .course .course-holder {
        width: 250px
    }
    .course .course-info {
        display: block;
        left: 3e3px;
        position: absolute;
        opacity: 0;
        top: 0;
        width: calc(100% - 280px)
    }
    .course .course-info .course-tabs {
        width: calc(100% - 80px)
    }
    .course .course-info .course-tabs a {
        width: calc(25% - 8px)
    }
    .course .course-info h3,
    .course .course-info h5 {
        font-size: 14px;
        margin: 0 0 15px
    }
    .course .course-info p {
        font-size: 13px
    }
    .course .course-info .btn {
        float: right;
        margin: 10px 10px 5px;
        top: -5px;
        position: relative
    }
    .course .course-info .spotlight-group {
        bottom: 0;
        left: 0;
        margin: 0;
        position: absolute;
        width: 100%
    }
    .course .course-info .spotlight {
        margin: 0;
        width: 19%
    }
    .course .course-info .spotlight span {
        font-size: 12px
    }
    .course .course-info .spotlight [class*=icon] {
        font-size: 20px;
        margin-bottom: 5px
    }
    .course .course-info .spotlight .icon-filled-star,
    .course .course-info .spotlight .icon-star {
        font-size: 1em
    }
    .course .course-learning-paths .head .btn,
    .course .course-learning-paths .head h5 {
        display: inline-block;
        margin: 0;
        vertical-align: middle;
        width: auto
    }
    .course .course-learning-paths .learningPath {
        margin: 0 10px 15px
    }
    .course .course-learning-paths .learningPath .btn {
        float: none;
        display: inline-block
    }
}

@media only screen and (min-width:1020px) {
     .our-courses .buttons-container {
        padding: 10px 0 0
    }
    .our-courses .buttons-container .buttons-container-inner .course-tab {
        padding: 20px 10px 5px;
        font-size: 18px
    }
     .cards {
        margin: 30px auto 0
    }
    .cards li {
        height: 380px
    }
    .cards h3 {
        font-size: 2.1875em
    }
    .course {
        margin: 10px 30px
    }
    .course.active .section-shadow {
        display: none
    }
    .course .course-info h5 {
        font-size: 17px
    }
    .course .course-info p {
        font-size: 14px
    }
    .course .course-info .course-tabs {
        width: 70px
    }
    .course .course-info .course-tabs a {
        display: block;
        height: 50px;
        width: 100%
    }
    .course .course-info .course-tabs a span {
        line-height: 50px
    }
    .course .course-info .course-tabs a:hover .title {
        color: #fff;
        display: block;
        background-color: #0094c9
    }
    .course .course-info .course-tabs .title {
        background-color: #2d3942;
        color: #fff;
        font-size: .875em;
        height: 100%;
        left: 100%;
        padding: 0 5px;
        position: absolute;
        text-align: center;
        top: 0;
        width: 130px;
        z-index: 10
    }
    .course .course-learning-paths,
    .course .course-reviews,
    .course .course-tags {
        padding: 30px 20px 20px 100px
    }
    .course .course-features {
        padding: 20px 20px 20px 100px
    }
    .course .course-reviews .info-box {
        margin: 0 auto 25px
    }
    .course .course-reviews .info-box.post .content .body .cols-container .col-name {
        padding: 50px 0 10px
    }
    .course .course-reviews .info-box .header .round-image {
        top: -40px
    }
}

@media only screen and (min-width:1140px) {
    .courses-list .courses-list-inner .course-info {
        width: 983px
    }
    .course {
        margin: 10px 5px
    }
    .course .course-info {
        width: calc(100% - 280px)
    }
    .course .course-features,
    .course .course-learning-paths,
    .course .course-reviews,
    .course .course-tags {
        padding: 30px 60px 20px 100px
    }
    .course .course-features {
        padding: 20px 60px 20px 100px
    }
}

@media only screen and (min-width:1500px) {
    .course-listing {
        padding: 0 15px
    }
    .dashboardmeter2{
        width:65% !important; height:180px !important; margin:0 auto !important;
    }
     .dashboardmeter{

 width:60% !important; height:200px !important; margin:0 auto !important;
}

     .dashboardmeter3{

 width:60% !important; height:200px !important; margin:0 auto !important;
}
}
@media(max-width:1150px) {
    .my-courses {
        width: 100%
    }
}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
    .navbar-form .input-group {
    width: 200px !important;
}
    .textclipp5 {
    width: 371px !important;
}

    .recentemodules ul li{

         width: 571px !important;
         text-align:center;
         margin:0 auto !important
    }
    /*.adminmenufull {
       
        left: -234px !important;
    }*/

}

@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 812px) 
and (-webkit-device-pixel-ratio : 3)
and (orientation : landscape) { 

    .textclipp5 {
    width: 637px !important;
}

    .navbar-nav .panel {
    padding: 0px !important;
}
 .nav {
        font-size: 12px !important;
    }
    .admin_icon{
         font-size: 12px !important;

    }

    .language-bar .bootstrap-select button.btn{
         font-size: 12px !important;

    }

}



@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
    .nav {
        font-size: 12px !important;
    }
    .admin_icon{
         font-size: 12px !important;

    }

    .language-bar .bootstrap-select button.btn{
         font-size: 12px !important;

    }
     .navbar-nav .panel {
    padding: 0px;
}

    /*.adminmenufull {
       
        left: -247px !important;
    }*/
    .dashboardmeter{

    width: 100%; height:420px !important;
}
.dashboardmeter3{

 height: 250px !important;
}
.dashboardmeter2{
        height:420px !important;
    }
    #app-menu-inner > .panel {
        margin-right: 0px !important;
    }

    #navbar-collapse-1 {
       
        width: 520px !important;
    }
    #app-menu-inner a {
        font-size: 10px !important;
    }
    .navbar-collapse {
        padding-right: 0px;
        padding-left: 0px;
    }
    /*#monthlyregisteredusers{
        margin-top: 320px
    }*/
      /*.nav {
        display: block !important;
}*/

}
@media (min-width: 768px) {
    .form-horizontal .control-label {
        
        text-align: left;
    }
}


@media (min-width: 1281px) {
    .input-group2 {
            width: 69% !important;
    }


     .input-group3 {
            width: 150px !important;
    }
}

@media only screen and (min-device-width: 360px) and (max-device-height: 640px) {
    .textclipp5 {
    width: 198px !important;
}
    #intro .carousel-item{
        height: 120vh !important;

    }

}


@media only screen and (min-device-width: 360px) and (max-device-height: 640px)and (orientation : landscape) {
    .textclipp5 {
    width: 468px !important;
}
   

}



/*iphone x landscape*/

@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 812px) 
and (-webkit-device-pixel-ratio : 3)
and (orientation : landscape) { 


    .dashboardmeter{

    width: 100%; height:420px !important;
}

}


@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px)and (device-aspect-ratio: 40/71)  { 

    .navbar-brand img {
    width: 127px !important;
}

}


@media only screen and (min-device-width: 320px) 
and (max-device-width: 480px) 
and (-webkit-device-pixel-ratio: 2) 
and (device-aspect-ratio: 2/3)
{
    .table-wrapper td {
        max-width: 10px;
        max-width: 1rem;
    }

    .input-group {
        width: 272px;
    }
}

/*new styleS:4/39/19*/

@media only screen 
and (min-device-width : 786px){
    body.mini-navbar .textclipp5{
    width: 430px;

}
}
.col-xs-11 {
    width: 88.666667%;
}

@media (min-width: 768px){
    .files .file .file-actions:not(.actions-dropdown) .dropdown-menu li>a {
  
    width: 120px !important;
    
}

}

@media (min-width: 768px){
.files .file .file-actions:not(.actions-dropdown) {
   
    width: 37% !important;
}
}




