.gtreat {
  display: grid;
  grid-template-columns: auto auto auto;
  grid-gap: 10px;
  background-color: #6411ff;
  padding: 5px 10px;
  position: absolute;
  top: 20; 
  width: 191px;  
  border-radius: 10px;
}
.gtreat > div {
    text-align: center;
    font-size: 10px;
}
.item1 {
  grid-row: 1 / 2;
}
.noupdown{
    margin-top:1px;
    margin-bottom:1px;
}
/*===grid class===*/
.grid_container {
  display: grid;
  grid-template-columns: auto auto;
}
div#scrollable {
    overflow-y: scroll;
    height: 250px;
} 
/*=== cards class ===*/
.cards {
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
  transition: 0.3s;
  width: 95%;
  max-width:200px;
  border-radius: 5px;
  background-color: #6411ff;
  margin-top: 25px;
}

.cards:hover {
  box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}
.imgse {
  border-radius: 5px 5px 0 0;
  width:100%;
}
@media (min-width: 576px) {
    .grid_container {
      display: grid;
      grid-template-columns: auto auto auto;
    } 
    .faq-link{
        width:300px;
    }
    .courses{
        width:300px;
    }     
}
@media (min-width: 768px) {
    .grid_container {
      display: grid;
      grid-template-columns: auto auto auto;
    }  
    .faq-link{
        width:400px;
    }
    .courses{
        width:400px;
    }    
}  
@media (min-width: 1024px) {
     .section .titles {
        padding-bottom: 10vh;
    }
    .grid_container {
      display: grid;
      grid-template-columns: auto auto auto auto;
    }  
    .faq-link{
        width:550px;
    }
    .courses{
        width:550px;
    }
}
/*=== Loader class ===*/
.preloader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background-color: black;
}
.preloader .loading {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  font: 14px arial;
}