:root {
  --color-default: #2b180d;
  --color-primary: #56b8e6;
  --color-secondary: #1b2f45;
  /* --color-marroon: #880000; */
  --color-marroon: #84C026;
  --color-banner: #113b59;
  --color-darkred: #7E2420;
  /* --color-banner: #f6a100; */
}


@media (max-width: 568px) {
    .top .mail{
      font-size: 12px;
    }
    .welcome-section h1{
      font-size: 16px;
    }
    .welcome-section p{
      font-size: 13px;
    }
    /* .facuty-section .card img{
      width: 100%;
      height: 70vh;
       
    } */

  

  }

  @media (max-width:768px){
    .slider-section .carousel .carousel-inner .carousel-item img{
        width: 100%;
        /* height: 30vh; */
      }
      .explor .activities-collage {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 6px;
  }
}
  
  @media (max-width: 1200px) {
    .header {
      padding: 12px 0;
    }
    .explor {
      padding: 0px;
     }


   
  }

  
/*--------------------------------------------------------------
# Desktop Navigation
--------------------------------------------------------------*/
@media (min-width: 1280px) {
    .navbar {
      padding: 0;
    }
  
    .navbar ul {
      margin: 0;
      padding: 0;
      display: flex;
      list-style: none;
      align-items: center;
    }
  
    .navbar li {
      position: relative;
    }
  
    .navbar a,
    .navbar a:focus {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 15px 0 15px 30px;
      font-family: var(--font-default);
      font-size: 15px;
      font-weight: 600;
      /* color: rgba(255, 255, 255, 0.6); */
      color: var(--color-darkred) !important;

      white-space: nowrap;
      transition: 0.3s;
    }
  
    .navbar a i,
    .navbar a:focus i {
      font-size: 12px;
      line-height: 0;
      margin-left: 5px;
    }
  
    .navbar a:hover,
    .navbar .active,
    .navbar .active:focus,
    .navbar li:hover>a {
      /* color: red; */
    }
  
    .navbar .dropdown ul {
      display: block;
      position: absolute;
      left: 14px;
      top: calc(100% + 30px);
      margin: 0;
      padding: 10px 0;
      z-index: 99;
      opacity: 0;
      visibility: hidden;
      background: #fff;
      box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
      transition: 0.2s;
    }
  
    .navbar .dropdown ul li {
      min-width: 200px;
    }
  
    .navbar .dropdown ul a {
      padding: 10px 20px;
      font-size: 15px;
      text-transform: none;
      color: var(--color-secondary);
    }
  
    .navbar .dropdown ul a i {
      font-size: 12px;
    }
  
    .navbar .dropdown ul a:hover,
    .navbar .dropdown ul .active:hover,
    .navbar .dropdown ul li:hover>a {
      color: #880000;
    }
  
    .navbar .dropdown:hover>ul {
      opacity: 1;
      top: 100%;
      visibility: visible;
    }
  
    .navbar .dropdown .dropdown ul {
      top: 0;
      left: calc(100% - 30px);
      visibility: hidden;
    }
  
    .navbar .dropdown .dropdown:hover>ul {
      opacity: 1;
      top: 0;
      left: 100%;
      visibility: visible;
    }
  

  }
  
  
  @media (min-width: 1280px) and (max-width: 1366px) {
    .navbar .dropdown .dropdown ul {
      left: -90%;
    }
  
    .navbar .dropdown .dropdown:hover>ul {
      left: -100%;
    }
  }
  
  @media (min-width: 1280px) {
  
    .mobile-nav-show,
    .mobile-nav-hide {
      display: none;
    }
  }
  
  /*--------------------------------------------------------------
  # Mobile Navigation
  --------------------------------------------------------------*/
  @media (max-width: 1279px) {
    .navbar {
      position: fixed;
      top: 0;
      right: -100%;
      width: 100%;
      max-width: 400px;
      bottom: 0;
      transition: 0.3s;
      z-index: 9997;
    }
  
    .navbar ul {
      position: absolute;
      inset: 0;
      padding: 50px 0 10px 0;
      margin: 0;
      background: #632b2b;
      /* background: #880000; */
      overflow-y: auto;
      transition: 0.3s;
      z-index: 9998;
    }
  
    .navbar a,
    .navbar a:focus {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 10px 20px;
      font-family: var(--font-default);
      font-size: 15px;
      font-weight: 600;
      color: #fff;
      white-space: nowrap;
      transition: 0.3s;
    }
  
    .navbar a i,
    .navbar a:focus i {
      font-size: 12px;
      line-height: 0;
      margin-left: 5px;
    }
  
    .navbar a:hover,
    .navbar .active,
    .navbar .active:focus,
    .navbar li:hover>a {
      color: #fff;
    }
  
    .navbar .dropdown ul,
    .navbar .dropdown .dropdown ul {
      position: static;
      display: none;
      padding: 10px 0;
      margin: 10px 20px;
      background-color: var(--color-default)
      /* background-color: var(--color-marroon); */
    }
    
  
    .navbar .dropdown>.dropdown-active,
    .navbar .dropdown .dropdown>.dropdown-active {
      display: block;
    }
  
    .mobile-nav-show {
      /* color: rgba(255, 255, 255, 0.9); */
      color: var(--color-darkred);
      font-size: 50px !important;
      cursor: pointer;
      line-height: 0;
      transition: 0.5s;
    }
  
    .mobile-nav-hide {
      color: rgba(255, 255, 255, 0.9);
      font-size: 32px;
      cursor: pointer;
      line-height: 0;
      transition: 0.5s;
      position: fixed;
      right: 15px;
      top: 15px;
      z-index: 9999;
    }
  
    .mobile-nav-active {
      overflow: hidden;
    }
  
    .mobile-nav-active .navbar {
      right: 0;
    }
  
    .mobile-nav-active .navbar:before {
      content: "";
      position: fixed;
      inset: 0;
      background: rgba(27, 47, 69, 0.7);
      z-index: 9996;
    }
  }