/* Custom CSS
-------------------------*/
.mb2slider-caption1 {
    max-width: 100%;
    height: 100%;
    padding-left: 15px;
    padding-right: 15px;
}

.mb2slider-caption2 {
    display: table;
    height: 100%;
    width: 100%;
}

.mb2slider-caption3 {
    display: table-cell;
}

.mb2slider-title {
    color: #fff;
    margin: 0 15px 15px 15px;
}
.mb2slider-description {
    margin: 0 15px;
}

.mb2slider-caption-content {
    padding: 15px 0;
    position: relative;
}
div.logo {
    background: url([[setting:logo]]) 0 0 no-repeat;
    display: block;
    float: left;
    height: 75px;
    margin: 0;
    padding: 0;
    width: 100%;
}

img.small-logo {
    float: left;
    height: 35px;
    margin: 3px 10px 3px 0;
}
/*@media (max-width: 979px) and (min-width: 768px)*/
/*{*/
/*   #translate{*/
/*        margin:0px 0px 10px 1px!important;*/
/*      }*/

/*}*/

@media (max-width: 768px) {
    img.small-logo {
        margin: 3px;
    }
    div .header {
        height: unset!important;
    }
    .usergallery{
        margin-top:40px!important;
    }
    .divvideo {
        margin-top:40px!important;
    }
    .coursesection{
        margin: auto!important;
        margin-left:15px!important;
        margin-right:unset!important;
        margin-top:40px!important;
    }


}



/* Custom CSS Settings
-------------------------*/
[[setting:customcss]]



html{
        height:100%;
    }
    
    body{
        padding-top: 10px!important;
       /* background: #f4f4f4 !important;*/
        height: 100%
    }
    .tab_header{
        border-radius: 27px;
      background: #f4f4f4;

     /* padding: 20px; */
     display:block;
     padding:28px 0px 0px 10px;
     text-align:left;
      
      height: 78px; 
      border-right:4px solid #ddd;
      border-bottom:4px solid #ddd;
    }
    .shadow{
/**/
        font-weight:bold;
            font-size: 13px;
            color:black;
            text-align:left;
            width:210px;
            margin:6px  auto;
           /* padding:28px;*/
            
           
            /*box-shadow: 0 9px 18px 9px #fff;*/
            box-shadow: -2px 0px 27px 0px #ddd

           
        
    }
    .headerhome div > a {
        color:white;
    }
    .active > a {
        color:blue!important;
    }
    .headerhome{
        /*background-image: -webkit-linear-gradient(bottom,#0000b3,#000099 16%, transparent 41%, transparent 100%);*/
           background-image: -webkit-linear-gradient(bottom,#2F2D74,#574EE1 );
            padding-top:13px;
            padding-bottom:13px;
            margin-left:-16px!important;
            margin-right:14px!important;
            /* width:100%;*/
             height:60px;
             border-radius: 18px; 
             /*background-image: -webkit-linear-gradient(bottom,#0000b3,#000080 1%, transparent 31%, transparent 100%);*/
             /*box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5); */
            box-shadow: 0px 5px 18px rgba(0, 0, 0, 0.5);


    }
    div[role="main"]{

     /*   display:none; */

    }
    .course_slide .slick-slide{
        width:650px !important;
        
    }
    .slick-prev{
        background-image:url('<i class="fa fa-chevron-left" aria-hidden="true"></i>');
    }
    .coursesection {
        /*margin-right:20px;
        margin-left:15px!important;*/
        margin-right: 0px;
        margin-left:0px!important;
    }

    /* added by yogesh (start) */
    .m10{
        margin-top: 10px;
    }
    .p30{
        padding-top: 30px;
    }
    .plf15{
        padding-left: 15px;
        padding-right: 15px;
    }
    .p5{
        padding: 5px;
    }
    .graybk{
      margin-top: 10px;
        background: #f3f3f3 !important;
        border-radius: 10px;
    }
    .whitebk{
        padding: 5px;
        background: white;
        border-radius: 10px;
    }

    /* Header slider */
    .headermenu {
        padding-left:20px!important;
    }
    .headermenu div{
        margin:auto;
        color:white;
        border:0px solid #ddd; 
         font-size: 13px;
        border-radius:13px;
        height:42px;
        text-align:center;
        padding:8px;

    }
   
    .headermenu .active{
        margin:auto;
        color:blue!important;
        border:1px solid #ddd; 
        background: #f4f4f4;
        border-radius:13px;
        height:37px;
        text-align:center;
        padding:8px
    }
    /*div.tab_header:hover a{
        color:darkblue!important;
        text-decoration:underline;
    }*/
     a.tab_header:hover {
       border-right:7px solid #ddd;
       border-bottom:6px solid #ddd;
       /*box-shadow: 0 9px 18px 9px #fff;using this*/
       /*box-shadow: -2px 3px 9px 10px #ddd;*/
       /*box-shadow: --3px 3px 21px 7px #ddd*/

        /*box-shadow: 2px 8px 18px 18px #fff;*/
        /*box-shadow: 1px 1px 1px 1px #ddd;*/
    }
    
    div.headerdiv.active:hover a{
        color:blue!important;
        text-decoration: none !important;   
        
    }
    div.tab:hover{
      margin:auto;
        color:blue!important;
        border:1px solid #ddd; 
        background: #f4f4f4;
        border-radius:13px;
        height:37px;
        text-align:center;
        padding:8px

    }
    div.tab:hover a{
      color:blue!important;
    }
    div.active:hover{
        color:blue!important;
        /*text-decoration:underline;*/
    }
   a.tab_header  {
    text-decoration: none !important;
    }
    #image-gallery li{
        /*line-height:48px!important;*/
    }
    

    .sliderdiv{
        padding-left: 0;
        padding-right: 0;
        border-radius: 10px;

    }
    .sliderdiv .lSSlideOuter {
        border-radius: 10px;
    }
    .sliderdiv img{
        opacity: 0.7;
         border-radius: 10px;
    }
    .sliderdiv .lSPager,.usergallery .lSPager,.usergallery .lSPrev,.usergallery .lSNext,.courseimages .lSPager{
        display: none;
    }
    .sliderdiv .lslide {
        position: relative;
    }
    .sliderdiv .text{
        position: absolute;
        z-index: 999;
        /*margin-left: 10px;*/
        left: 0;
        right: 0;        
       
        bottom: 2%; /* Adjust this value to move the positioned div up and down */
        display:inline-block;
        font-family: Arial,sans-serif;
        color: #fff;
        /*width: 80%;  Set the width of the positioned div */
    }

    

    #user-gallery{
        width: 100% !important;
        height: 253px;
        min-height: 253px;
    }
    #user-gallery li{
        width: 100% !important;
        display:none;
    }
    /* Video slider */
    .divvideo h3{
        font-size: 13px;
        text-align: center;
        color: rebeccapurple;
        padding: 0;
        margin-top: 0;
    }

    /* Course */
    .coursenav{
        height: 300px;
        padding-left: 0;
        padding-right: 0;
        border-radius: 10px;
        padding: 5px;
        background: white;
    }
    .courseimagecontent{
        overflow: hidden;
    }
    .prevcourse{
        border: 0px solid black;
        float: left;
        height: 100%;
        width: 5%;
        background: #f4f4f4;
        border-radius: 10px;
    }
    .prevcourse span{
        position: relative;
        float: left;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 30px;
        font-weight: none;
        color: rebeccapurple;
    }
    .prevnext{

        border: 0px solid black;
        right: 0;
        float: right;
        height: 100%;
        width: 5%;
        background: lightgray;
        background: #f4f4f4;
        border-radius: 10px;
    }
    .prevnext span{
        position: relative;
        float: right;
        top: 50%;
        right: 0%;
        transform: translate(-50%, -50%);
        font-size: 30px;
        font-weight: none;
        color: rebeccapurple;
    }
    .courseimages{
        display: inline-block;
        width: 100%;
        border: 0px solid black;
        height: 100%;
        text-align: center;
        padding-top: 15px;
        background: #FAFAFA;
        border-radius:10px;
        position:relative;
    }
    .courseimages h3{
        color: rebeccapurple;
        font-size: 20px;
    }

    .sectiongap{
        margin-top: 20px;
    }

    /* Footer */
    .footerhome{
        position: absolute;
        left: 0;
        right: 0;
/*        width:97%;
        margin:0 auto;
*/
    }
    .footermenu{
        /*background: rebeccapurple;*/
        /*background:#0000b3;*/
         background-image: -webkit-linear-gradient(bottom,#3B3694,#6D66C6 );

        height: 59px;padding-top: 10px;padding-bottom: 10px;
    }
    .footermenu div{
        position: absolute;
        z-index: 999;
        width: 95%;
        padding-top: 10px;
        padding-left: 16px;
    }
    .footermenu ul{
        list-style: none;
        position: absolute;
        list-style: none;
        float: left;
        width: 80%;
    }
    .footermenu ul li{
        float: left;
        margin-right: 15px;
        font-size: 17px;
        font-weight: bold;
    }
    .footermenu ul li a{
      font-size:14px;
        color: #BBB7FF;
    }
    .copywrite{
        clear: both;
        margin-top: 59px;
        padding-top: 5px;
        padding-bottom: 25px;
    }
    .copywrite p{
        font-size: 12px;
        padding-left: 37px;
        color: gray;
    }
    #textdiv >p > a{
        color:greenyellow!important;
    }


    /* added by yogesh (end) */


  headerhome > nav> div > a.brand { /* title on page "moodle without login "*/
      color:#fff !important;
      text-shadow: unset!important;
  }
  headerhome > nav> div > div>  a.brand {/* title on page "moodle with login "*/
      color:#fff !important;
      text-shadow: unset!important;
  }
  .usertext{
      color:#fff !important;
  }

  div.usermenu > .login {    /*text to show login on headerhome when not logged in */
      color:#fff!important;
  }
  div.usermenu > .login > a {
      color:#fff!important;
  }
  #page-footer{
      border-top:unset!important;
  }
  footer {
      
      /*background:#1034A6;*/
       background-image: -webkit-linear-gradient(bottom,#3B3694,#6D66C6 );
  }
  footer > p > a{
      color:#fff!important;
  }

  footer > div{
      color:#e0dbdb!important;
  }

  footer > div > a{
      color:#fff!important;
  }
  nav[role="navigation"] { /*header css */
      background:#1034A6;  background-image: -webkit-linear-gradient(bottom,#1034A6,#000080 1%, transparent 31%, transparent 100%);
  }



  /* added by Deepak (start)*/
  .schooltitle {
      line-height: 60px!important;
      margin-left:80px!important;
  }
  .navbar .brand {
      font-size: 24px!important;
      font-weight: bold!important;
      color:#fff;
      line-height:62px;
  }
  .usermenu {
      line-height:83px!important;
  }
  .navbar .popover-region-toggle
  {
      line-height:83px!important;
  }


  .header {
      background:#0000b3;
      padding-top:5px;
      height:35px;
      background-image: -webkit-linear-gradient(left,#0000b3, #234880 1%, transparent 31%, transparent 0%);
      box-shadow: 0px 5px 18px rgba(0, 0, 0, 0.5);
      color:#fff;
  }

  #dockeditempanel .dockeditempanel_hd {
      background:#0000b3;
      height:25px;
      background-image: -webkit-linear-gradient(left,#0000b3, #234880 1%, transparent 31%, transparent 0%);
      box-shadow: 0px 5px 18px rgba(0, 0, 0, 0.5);
      color:#fff;
      border-bottom:none!important;
  }

  #dockeditempanel .dockeditempanel_hd h2 {
      color:#fff;
  }

  .block .header h2 {
      color:#fff;
  }

  .helplink {
      display:none;
  }


  .jsenabled .moodle-actionmenu[data-enhance] .toggle-display.textmenu .caret {
      margin-top: 8px;
      margin-left: 2px;
      border-top-color: #fff!important;
  }

  .jsenabled .usermenu .moodle-actionmenu.show {
      background-color: #2f96b4!important;
  }

  .navbar .count-container {
      line-height:45px!important;
  }

  .slidercoursename {
      line-height:13px;
      /*font-size: 16px;*/
      font-size: 12px;
      font-weight: bold;
      color: #648094;
      /*margin-top: 5px*/
      margin-top: 2px
      
  }

  #page-header {
      /*margin-top: 85px;*/
  }
  #header-slider li {
      display:none;
  }
  #first_row #google_translate_element{
    margin:10px 10px 10px 18px;
  }

  @media only screen and (max-width: 1024px) {
      .schooltitle {
          line-height: 60px!important;
          margin-left:90px!important;
      }

      #translate{
          margin: 85px 0px 10px 0px!important;
      }

      .navbar .brand {
          line-height:62px;
          padding-left:5px;
      }
      #header-slider{
      margin-left:37px!important;
      }

      #page-header {
          margin-top: unset!important;
      }

      .header {
          padding-top:0px;
          height:auto;
      }
      .headerhome { 
        height: unset!important;
        margin-left: 2px!important;
        padding-right:10px!important;
       }

  }
  /* added by Deepak (end)*/

.topnav .active .icon {
 margin-top:4px;
  margin-right:6px; 
  top: 0;
}
.topnav .icon {
  display: none;
      position: absolute;
    float: right;
    /* left: 689px; */
    right: 0px;
    top: 8px;
    z-index: 18;
  
}
/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
@media screen and (max-width: 1024px) {
  /*.topnav div:not(:first-child) {display: none;}*/
  .topnav div:nth-of-type(1n+4){display: none;}
  .topnav div {
    text-align: left;
  }
  .topnav .active{
    text-align: left;
  }

  .topnav div.icontab{
    color:#fff;
     position: absolute;
    float: right;
    /* left: 689px; */
    right: 25px;
    top: 8px;
    z-index: 18;
    display: block;
  }
  .topnav a.icon {
    /*float: right;
    right: 0;
    top: 0;*/
    color:#fff;
     position: absolute;
    float: right;
    /* left: 689px; */
    right: 15px;
    top: 14px;
    z-index: 18;
    display: block;
  }
}

/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 1024px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive div > a.icon {
    position: absolute;
    right: 1px !important;

  }
  .topnav.responsive div {
    float: none;
    display: block;
    /*text-align: left;*/
  }
  .headermenu div{
      text-align: left!important;
    }
  .shadow{
    width:100%!important;
        border-left: 4px solid #ddd;
  }
  #intro {
    height:250px!important;
  }
/*#translate{*/
/*        margin:0px 0px 10px 0px!important;*/
/*      }*/
}

@media (max-width: 480px) {

    .navbar img.small-logo {
        max-width: 150px;
    }
    /* Applying accesshide styles */
    .navbar .small-logo-container + .brand {
        position: absolute;
        left: -10000px;
        font-size: 1em;
        font-weight: normal;
    }
    #header-slider{
      margin-left:unset!important;
      }
      #translate{
        margin:unset!important;
      }
    
   .headermenu div{
      text-align: left!important;
    }
    .navbar .brand {
      display:none!important;

    }
    .headerhome{
      margin-left:unset!important;
    }
    .page-header-headings h1{
        font-size:13px!important;
    }
    .sliderdiv .text{
            bottom: -11%;
    }
    .image-gallery li img{
        height:125px!important;
    }
    .slidercoursename{
               margin-top: 1px;
       margin-right:47px;
       margin-left:47px;
       line-height:13px;
         word-wrap: break-word;
    }
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)  {
    .navbar .brand{
        font-size:19px!important;
    }
    #intro{
        height:190px!important;
    }
   

}
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) { 
     #translate{
            margin: 85px 0px 10px 0px!important;
      }
    
}