
@media screen and (max-width: 600px) {
  .topnav a:not(:first-child), .dropdown .dropbtn {
    display: none;
  }
  .topnav a.icon {
    float: right;
    display: block;
  }
  .dispaly{
    display: none;
  }
  .logo {
    margin-left: -42px;  
}
.borderleft, .borderright {
    border-left: none;
}
.container1 {
    position: relative;
    width: 100%;
    height: auto;
    border-radius: 20px;
    padding: 40px;}
.h1heading {
  font-size: 23px;
  text-shadow: 1px 1px 1px;
  color: black;
  margin-left: -4px;
  letter-spacing: 1px;
  margin-top: 19px;
  font-family: 'Lora', serif;
}
.console-container {
  font-family: Khula;
  font-size: 3rem;
  text-align: center;
  height: 100%;
  width: 100%;
  display: block;
  position: absolute;
  color: white;
  top: 0;
  bottom: 250px;
  left: 0;
  right: 0;
  margin: auto;
}
.card{
    width: 100%;
    height:100%;
    margin-bottom: 20px;
    background: hsl(0deg 16% 93%);
    color: hsl(0deg 23% 94%);
    padding: 2 rem 3rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-image: linear-gradient( 
90deg, hsl(198deg 94% 42%), hsl(198deg 56% 32%), hsla(0, 0%, 10%, 0)), url(https://cdn1.aglasem.com/admission/wp-content/uploads/2019/08/pearl-adm-min-750x375.png);
    background-size: cover;
    border-radius: 10px;
    padding-left: 27px;
    text-align: justify;
}
#text{
  font-size: 20px!important;
}
.footer1{
  display: block !important;
}
.topnav a {
  border: none!important;
}
#myTopnav {
  padding-left: 3px;
}
}
@media screen and (max-width: 600px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  .topnav.responsive .dropdown {float: none;}
  .topnav.responsive .dropdown-content {position: relative;}
  .topnav.responsive .dropdown .dropbtn {
    display: block;
    width: 100%;
    text-align: left;
  }
}




/* // Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) { 
  .display{
      display: block !important;
  }
 
}

/* // Small devices (landscape phones, 576px and up) */
@media (min-width: 360px) and (max-width: 767.98px) { 
  .topnav a:not(:first-child), .dropdown .dropbtn {
      display: none;
    }
    .dispaly{
      display: none;
    }
    .topnav a.icon {
      float: right;
      display: block;
    }
    .logo {
      margin-left: -41px;
      height: 5rem;
  }
  .topnav a {
    border: none!important;
  }
  #myTopnav {
    padding-left: 2rem;
    border-bottom: 10px solid #780000;
}
.container1 {
    position: relative;
    width: 100%;
    height: auto;
    border-radius: 20px;
    padding: 40px;}

.h1heading {
  margin-left: 17px;
}



    .topnav.responsive {position: relative;}
    .topnav.responsive .icon {
      position: absolute;
      right: 0;
      top: 0;
   
    }
    .icon{
      font-size: 36px !important;
      color: white;
    }
    
    .active:hover{
      background-color:#0f4271 !important;
    }
    .topnav.responsive a {
      float: none;
      display: block;
      text-align: left;
    }
    .topnav.responsive .dropdown {float: none;}
    .topnav.responsive .dropdown-content {position: relative;}
    .topnav.responsive .dropdown .dropbtn {
      display: block;
      width: 100%;
      text-align: left;
    }
    .display{
      display: block !important;
  }
  .bannerimg{
    width:100%; height:auto !important; opacity: 0.8;
  }
  .margin20 {
    margin-top: -26px;
}
.sideimg {
 margin: 0px !important;
}
#padding120 {
padding:19px;
}
.marginleft{
  margin: 0px;
}
}

/* // Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) { 
  .topnav a:not(:first-child), .dropdown .dropbtn {
      display: none;
    }
    .topnav a.icon {
      float: right;
      display: block;
    }

    .topnav.responsive {position: relative;}
    .topnav.responsive .icon {
      position: absolute;
      right: 0;
      top: 0;
    }
    .topnav.responsive a {
      float: none;
      display: block;
      text-align: left;
    }
    .topnav.responsive .dropdown {float: none;}
    .topnav.responsive .dropdown-content {position: relative;}
    .topnav.responsive .dropdown .dropbtn {
      display: block;
      width: 100%;
      text-align: left;
    }


}

/* // Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.98px) { 


}

/* // Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 

  
}