@charset "utf-8";
/* CSS Document */




/* COURSE ARCHIVE BODY BODY */

.cat-card {
  border-radius:var(--border-radius-10);
  box-shadow:none;
}

.cat-titleimg {
  border-radius:var(--border-radius-10);
  opacity:1;
}

.cat-titlebar {
  background-color:rgba(255, 255, 255, 0);
}

.cat-titlebar h2 {
  text-shadow: 0 0 0 rgba(0,0,0,0) !important;
  font-size:var(--font-size-6) !important;
  margin:0;
  margin-top:-30px;
}

.course-search {
  position:relative;
  z-index:1000;
  margin-top:-100px;
  margin-bottom:45px;
  padding:0;
  background-color: transparent !important;
  box-shadow: none !important;
}

#searchForm.form-inline {
  padding:var(--padding-2) var(--padding-2) 10px var(--padding-2);
  min-height:auto;
  border-radius:var(--border-radius-10);
  background-color:var(--base-color);
  max-width:auto;
  margin-left:auto;
  margin-right:auto;
  margin-bottom:0;
}

#searchForm .form-group, #searchForm a, #searchForm button, #searchForm select {
  margin:0;
}

#searchForm .fa-filter {
  margin-left:10px !important;
  margin-right:10px !important;
}

#block-container {
  background-color:transparent;
  margin-top:0 !important;
}

.course-search select#cat, .course-search select.form-control {
  padding-top:8px !important;
}


div.block-grid.course-card, #board_container .block-grid {
  border-radius:var(--border-radius-10);
  box-shadow:var(--box-shadow-2);
  font-size:var(--font-size-1);
  -webkit-transition: all .15s ease-in-out;
  -moz-transition: all .15s ease-in-out;
  -ms-transition: all .15s ease-in-out;
  -o-transition: all .15s ease-in-out;
  transition: all .15s ease-in-out;
}

div.block-grid.course-card:hover {
  -webkit-box-shadow: 0 15px 35px 0 rgba(0,0,0,.15);
  box-shadow: 0 15px 35px 0 rgba(0,0,0,.15);
  margin-top:-5px;
  -webkit-transition: all .15s ease-in-out;
  -moz-transition: all .15s ease-in-out;
  -ms-transition: all .15s ease-in-out;
  -o-transition: all .15s ease-in-out;
  transition: all .15s ease-in-out;
}

div.block-grid .course-topbar {
  border-radius:var(--border-radius-10) var(--border-radius-10) 0 0 !important;
  background-color:var(--primary-color);
}

div.block-grid .course-wishlist {
  top:20px;
  left:15px;
  z-index:100;
  background-color:var(--base-color);
  box-shadow:var(--box-shadow-2);
  border-radius:var(--border-radius-10);
  height:35px;
  width:35px;
  padding:0 !important;
  font-size:var(--font-size-1);
  color:var(--accent-color);
}

div.block-grid .course-wishlist span {
  color:var(--color-red) !important;
}

div.block-grid .topbar-wrap {
  top:20px;
  background-color:var(--base-color);
  box-shadow:var(--box-shadow-2);
  border-radius:var(--border-radius-10);
  z-index:100;
  color:var(--font-color);
  font-size:var(--font-size-1) !important;
  line-height:35px;
  padding:0 var(--padding-2) 0 var(--padding-2);
}

div.block-grid .topbar-wrap .fa-clock-o {
  color:var(--accent-color);
}

div.block-grid .rating_container {
  background-color:var(--primary-color);
  padding:var(--padding-2);
  border-radius:var(--border-radius-10);
  position:relative;
  color:var(--base-color);
  box-shadow:var(--box-shadow-2);
  left:10px;
  bottom:10px;
  /* transform: rotate(-90deg); */
}

div.block-grid .rating_container .rating_container { 
  bottom:auto !important;
  left:auto !important;
  padding:0 !important;
}

.course-card .rating_container .topic_rating_user, .rating_container .topic_rating_user:hover {
    padding:0 !important;
}

div.block-grid .course-titlebox {
  /* min-height:auto; */
  min-height:90px !important;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: visible;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

div.block-grid.course-card h2 {
  font-size:var(--font-size-2) !important;
  line-height:var(--font-line-2) !important;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}

div.block-grid div.course .btn {
  display:inline-block;
  width:100% !important;
  border:0;
  border-radius:var(--border-radius-5) !important;
}

/* END COURSE ARCHIVE BODY */


@media (max-width: 1022px) {
     
    .topbar-wrap span {
   font-size:5px;
}

.cat-card .cat-titlebar {
   min-height:auto !important;
   height:200px !important;
}

.cat-card .cat-titlebar.cat-titlebar h2 {
   margin-top:0 !important;
}
 
.course-search .form-group .fa-filter {
    display:none;
}
  
   .course-search {
       margin-bottom:0 !important;
       bottom:0 !important;
       margin-top:0 !important;
       border:0 !important;
   }
   
   
  .cat-card .cat-titlebar.cat-titlebar h2 {
      margin:0 !important;
  }
   
}

 
@media (max-width: 886px) { 
   
div.block-grid.course-card {
   width: 100% !important;
   min-width: 100% !important;
 }

.block-grid.course-card .topbar-wrap {
    display:none;
}

.block-grid.course-card .rating_container {
    display:none !important;
}

.cat-card .cat-titlebar.cat-titlebar h2 {
   margin-top:0 !important;
}
 
 .course-search form {
     width:100%;
     border:0 !important;
 }

.cat-card .cat-titlebar {
   min-height:auto !important;
   height:100px !important;
}
 .course-search {
     margin-top:0 !important;
 }
 
     .form-inline {
     border-radius:0 !important;
 }
 
 #searchForm .form-group .form-control {
     margin-bottom:5px !important;
 }

}

 @media (max-width: 749px) {
  
div.block-grid.course-card {
   width: 100% !important;
   min-width: 100% !important;
 }
  
 }

@media (max-width: 600px) { 
   
   #page-content-wrapper > .container-fluid {
       padding:0 !important;
   }

}