/* -------------------------
   Styles for department page
   Save this as styles.css
   ------------------------- */

:root{
  --max-w:1200px;
  --accent:#0b56a6;    /* deep blue */
  --accent-2:#2a9bd8;  /* light blue */
  --orange:#ff4500;    /* orange */
  --muted:#6d7780;
  --bg:#ffffff;
  --dot:#e9e9e9;
}

/* Basic reset */
/**{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial;
  background:var(--bg);
  color:#17202a;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.5;
}

/* dotted pattern (full page, subtle) */
/*.page-pattern{
  position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-image: radial-gradient(var(--dot) 1px, transparent 1px);
  background-size: 12px 12px;opacity:0.42;
}*/

/* layout wrapper */
.wrapper{max-width:var(--max-w);margin:18px auto;padding:0 18px}

/* header */
/*.site-header{padding-bottom:10px}*/
.site-title{
  font-family: "Merriweather", serif;
  font-size:36px;
  color:#0b2540;
  font-weight:700;
  letter-spacing:0.2px;
  padding-bottom:12px;
  border-bottom:1px dotted rgba(0,0,0,0.06);
}
a
{
    text-decoration: none !important;
}
p a
{
    text-decoration: none !important;
}
table a
{
    text-decoration: none !important;
}


/* main grid */
.layout{display:grid;grid-template-columns:1fr 340px;gap:28px;margin-top:18px;align-items:start}

/* LEFT column */
.left-col{min-height:360px}

/* Hero card */
.hero-card{position:relative;border-radius:4px;overflow:hidden;border:6px solid rgba(0,0,0,0.02);background:#fff}
.hero-img{display:block;width:100%;height:420px;object-fit:cover;transition: transform .6s cubic-bezier(.2,.9,.2,1);will-change:transform}
.hero-caption{position:absolute;left:28px;bottom:18px;color:#fff;text-shadow:0 10px 30px rgba(0,0,0,0.5)}
.hero-caption h2{font-size:22px;margin-bottom:6px}
.hero-caption p{font-size:14px;color:rgba(255,255,255,0.92)}
.hero-card h2 {
	color:orangered;
}
/* intro section */
.intro{margin-top:18px;background:white;padding:8px 2px}
.intro h3{color:var(--accent);font-size:18px;margin-bottom:8px}
.intro p{color:#333;max-width:900px;line-height:1.7}

/* RIGHT sidebar */
.right-col .side-box{padding:12px;border-top:1px dotted rgba(0,0,0,0.08);background:white;}
.side-title{font-size:18px;color:#0b2540;}

/* make the right card sticky on wide screens */
.sticky{position:sticky;top:24px}

/* side menu */
.side-menu1 ul{list-style:none;margin-top:6px;padding:0}
.side-menu1 li{border-bottom:1px dotted rgba(0,0,0,0.08)}
.side-menu1 a{
  display:flex;align-items:center;gap:12px;padding:12px 8px;text-decoration:none;color:#333;font-weight:600;
  transition: background .18s, transform .12s;
}
.side-menu1 a:hover{background:linear-gradient(90deg, rgba(42,155,216,0.06), rgba(11,86,166,0.02));transform:translateX(6px)}
.side-menu1 a.active{background:linear-gradient(90deg, rgba(11,86,166,0.08), rgba(42,155,216,0.02));color:var(--accent)}

/* colored badge */
.badge{
  width:28px;height:28px;border-radius:6px;display:inline-grid;place-items:center;color:#fff;font-weight:800;font-size:12px;
  box-shadow:0 6px 18px rgba(11,37,64,0.06);
}
.badge.blue{background:var(--primary-blue)}
.badge.orange{background:var(--orange)}
.badge{background:var(--accent-2)} /* default */



/* scroll to top */
.to-top{
  position:fixed;right:22px;bottom:92px;width:46px;height:46px;border-radius:6px;background:orangered;color:#fff;border:0;
  display:grid;place-items:center;font-size:18px;box-shadow:0 10px 30px rgba(11,37,64,0.12);opacity:0;transition:opacity .18s;
}

/* small text helpers */
.muted{color:var(--muted);font-size:14px}

/* responsive */
@media (max-width:1024px){
  .layout{grid-template-columns:1fr 300px}
  .hero-img{height:360px}
}
@media (max-width:800px){
  .layout{grid-template-columns:1fr}
  .right-col{order:2}
  .left-col{order:1}
  .hero-img{height:260px}
  .to-top{right:12px}
  .whatsapp{left:12px}
}

/* small touch: active state for keyboard navigation */
.side-menu1 a:focus{outline:2px solid rgba(11,86,166,0.14);outline-offset:2px}

/* ------------------------------
   Mobile Responsive Styles
   ------------------------------ */

/* General improvements for mobile touch */
@media (max-width: 768px) {

  /* Make the menu full-width and nicely separated */
  .side-menu1 {
    width: 100%;
    background: #fff;
    border: 1px solid rgba(0,0,0,0.05);
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    margin-top: 10px;
    overflow: hidden;
  }

  /* Stack items vertically, increase tap area */
  .side-menu1 ul {
    margin: 0;
    padding: 0;
  }

  .side-menu1 li {
    border-bottom: 1px solid rgba(0,0,0,0.05);
  }

  .side-menu1 a {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    padding: 14px 16px;
    font-size: 15px;
    font-weight: 600;
    color: #222;
  }

  .side-menu1 a:hover {
    background: rgba(11,86,166,0.06);
    transform: none; /* no slide for touch screens */
  }

  .side-menu1 a.active {
    background: rgba(11,86,166,0.1);
    color: var(--accent);
  }

  /* Optional: make it collapsible below the heading */
  .side-menu1.collapsed ul {
    display: none;
  }

  /* Optional toggle button for mobile */
  .menu-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--accent);
    color: #fff;
    font-weight: 600;
    padding: 12px 16px;
    border-radius: 6px 6px 0 0;
    cursor: pointer;
  }

  .menu-toggle i {
    transition: transform 0.2s ease;
  }

  .side-menu1.open .menu-toggle i {
    transform: rotate(180deg);
  }
}
.chairmanmsg
{
	float: right;
  width: 50%;
  padding: 5px;
}


/*Deans Page*/
.product_list {
	min-height: 365px;
	transition: ease all 0.5s;
	
}

.cleaning .product_list {
	min-height: 340px;
	transition: ease all 0.5s;
}

.product_list:hover,
.product_list:focus {
	box-shadow: 0 0 25px -17px #000;
	border-bottom: solid #17a5e9 5px;
}

.product_img {
	overflow: hidden;
	background: transparent;
	
	width: 100%;
	
}

.product_img img {
	padding: 22px;
	padding-left:20%;
	display: flex;
	justify-content: center;
}

.cleaning .product_img img {
	padding: 0;
}

.product_detail_btm h4 {
	margin: 20px 0 10px 0;
	text-align: center;
}

.product_list .starratin {
	height: 0;
	overflow: hidden;
	transition: ease all 0.5s;
}

.product_list:hover .starratin,
.product_list:focus .starratin {
	height: 15px;
	margin-bottom: 6px;
}

.product_list:hover div.product_img img,
.product_list:focus div.product_img img {
	transform: scale(1.2);
	transition: ease all 0.5s;
}

.starratin {
	color: #ffcc00;
}

.starratin .fa {
	margin: 0 0.5px;
}

.product_price p {
	margin: 0;
	text-align: center;
}

.old_price {
	font-size: 14px;
	color: #737373;
	text-decoration: line-through;
}

.new_price {
	font-size: 18px;
	font-weight: 600;
	color: #000;
}

.recent_item {
	color: #000;
	font-weight: 600;
	margin: 0;
}

.price_recent_item {
	margin: 0;
	color: #000;
}

.adress_cont {
	float: left;
	width: 100%;
}

.contact_us_2 .adress_cont {
	float: left;
	width: 100%;
	display: flex;
	justify-content: center;
}


/*GB Table style*/


    /* ===== Container for horizontal scroll on narrow viewports ===== */
    .table-responsive {
      width: 100%;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
      border-radius: 8px;
      background: transparent;
      padding: 6px 0; /* breathing room on mobile */
    }

    /* ---------- Faculty table (desktop) ---------- */
    .faculty-table {
      width: 100%;
      max-width: 1100px;
	  font-family: "Merriweather", serif;
      margin: 1.25rem auto;
      border-collapse: collapse;      
      background: var(--bg);
      color: var(--text);
      box-shadow: 0 1px 6px rgba(0,0,0,0.04);
      overflow: hidden;
      border-radius: 8px;
      min-width: 700px; /* help trigger horizontal scroll on small devices if needed */
    }

    /* Header */
    .faculty-table thead th {
      text-align: left;
      font-weight: 700;
      padding: 12px 16px;
      background: linear-gradient(262deg, var(--primary-blue) 0%, var(--primary-blue-600) 100%);
      color: #fff;
      letter-spacing: 0.2px;
      font-size: 1.25rem;
      border-bottom: 2px solid rgba(255,255,255,0.06);
      position: relative;
    }

    /* Body cells */
    .faculty-table tbody td {
      padding: 12px 16px;
      vertical-align: middle;
      font-size: 1.25rem;
	  border: 1px solid rgba(0,0,0,0.10);
      white-space: normal;
      word-break: break-word;
    }
	
    /* Zebra rows & hover/focus */
    .faculty-table tbody tr:nth-child(odd) {
      background: rgba(15,87,153,0.02);
    }
    .faculty-table tbody tr:hover,
    .faculty-table tbody tr:focus-within {
      background: rgba(11,85,168,0.04);
    }

    /* Column width hints (desktop) */
    .faculty-table th.sno { width: 5%; }
    .faculty-table th.name { width: 30%; }
    .faculty-table th.qual { width: 60%; }
   /* .faculty-table th.desig { width: 20%; }
    .faculty-table th.dept { width: 10%; }*/

    /* Links and badges */
    .faculty-table a {
      color: var(--primary-blue);
      text-decoration: none;
    }
    .faculty-table a:hover { text-decoration: underline; }

   

    /* small meta text under name */
    .meta {
      display:block;
      margin-top:6px;
      font-size:0.88rem;
      color:#444;
      font-weight:500;
    }

    /* action buttons (email/phone) */
    .actions a {
      display:inline-block;
      padding:6px 10px;
      margin-right:6px;
      border-radius:6px;
      background:rgba(11,85,168,0.06);
      color:var(--primary-blue);
      text-decoration:none;
      font-weight:600;
      font-size:0.88rem;
    }

    /* Focus outlines for keyboard users */
    .faculty-table a:focus, .faculty-table button:focus {
      outline: 3px solid rgba(11,85,168,0.18);
      outline-offset: 2px;
    }

    /* ===== MOBILE: keep table layout but tighten spacing & enable sticky header ===== */
    @media (max-width: 720px) {
      .faculty-table {
        max-width: 100%;
        margin: 0.6rem auto;
        border-radius: 6px;
        min-width: 0; /* avoid forcing too-wide min */
      }

      .faculty-table thead th {
        padding: 10px 8px;
        font-size: 0.85rem;
      }

      .faculty-table tbody td {
        padding: 8px 8px;
        font-size: 0.88rem;
      }

      /* Narrow the S.No column */
      .faculty-table th.sno,
      .faculty-table td.sno {
        white-space: nowrap;
        width: 4%;
      }

      /* Make header sticky to help when table is long / scrolled horizontally */
      .table-responsive {
        position: relative;
      }
      .faculty-table thead th {
        position: sticky;
        top: 0;
        z-index: 4;
      }
    }

    /* Optional: small screens very narrow — slightly reduce font */
    @media (max-width: 420px) {
      .faculty-table thead th { font-size:0.82rem; padding:8px 6px; }
      .faculty-table tbody td { font-size:0.82rem; padding:6px 6px; }
      .actions a { font-size:0.8rem; padding:5px 8px; }
    }
	
	/*FY statements Table*/
    /* ===== Container for horizontal scroll on narrow viewports ===== */
    .faculty-table1 {
      width: 50%;    
	  font-family: "Merriweather", serif;
      margin: 1.25rem auto;
      border-collapse: collapse;      
      background: var(--bg);
      color: var(--text);
      box-shadow: 0 1px 6px rgba(0,0,0,0.04);
      overflow: hidden;   
      min-width: 700px; /* help trigger horizontal scroll on small devices if needed */
    }
.table-responsive1 {
      width: 100%;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
      border-radius: 8px;
      background: transparent;
      padding: 6px 0; /* breathing room on mobile */
    }
    /* Header */
    .faculty-table1 thead th {
      text-align: center;
      font-weight: 700;
      padding: 12px 16px;
      background: linear-gradient(262deg, var(--primary-blue) 0%, var(--primary-blue-600) 100%);
      color: #fff;
      letter-spacing: 0.2px;
      font-size: 1.25rem;
      /*border-bottom: 2px solid rgba(255,255,255,0.06);*/
      position: relative;
    }

    /* Body cells */
    .faculty-table1 tbody td {
      padding: 12px 16px;
	  text-align: center;
      vertical-align: middle;
      font-size: 1.25rem;
	 /* border: 1px solid rgba(0,0,0,0.10);*/
      white-space: normal;
      word-break: break-word;
    }
	
    /* Zebra rows & hover/focus */
    .faculty-table1 tbody tr:nth-child(odd) {
      background: rgba(15,87,153,0.02);
    }
    .faculty-table1 tbody tr:hover,
    .faculty-table1 tbody tr:focus-within {
      background: rgba(11,85,168,0.04);
    }

    /* Column width hints (desktop) */
    .faculty-table1 th.sno { width: 20%; }
    

    /* Links and badges */
    .faculty-table1 a {
      color: var(--primary-blue);
      text-decoration: none;
    }
    .faculty-table1 a:hover { text-decoration: underline; }

   

    /* small meta text under name */
    .meta {
      display:block;
      margin-top:6px;
      font-size:0.88rem;
      color:#444;
      font-weight:500;
    }

    /* action buttons (email/phone) */
    .actions a {
      display:inline-block;
      padding:6px 10px;
      margin-right:6px;
      border-radius:6px;
      background:rgba(11,85,168,0.06);
      color:var(--primary-blue);
      text-decoration:none;
      font-weight:600;
      font-size:0.88rem;
    }

    /* Focus outlines for keyboard users */
    .faculty-table1 a:focus, .faculty-table1 button:focus {
      outline: 3px solid rgba(11,85,168,0.18);
      outline-offset: 2px;
    }

    /* ===== MOBILE: keep table layout but tighten spacing & enable sticky header ===== */
    @media (max-width: 720px) {
      .faculty-table1 {
        max-width: 100%;
        margin: 0.6rem auto;
        border-radius: 6px;
        min-width: 0; /* avoid forcing too-wide min */
      }

      .faculty-table1 thead th {
        padding: 10px 8px;
        font-size: 1.25rem;
      }

      .faculty-table1 tbody td {
        padding: 8px 8px;
        font-size: 1.25rem;
      }

      /* Narrow the S.No column */
      .faculty-table1 th.sno,
      .faculty-table1 td.sno {
        white-space: nowrap;
        width: 4%;
      }

      /* Make header sticky to help when table is long / scrolled horizontally */
      .table-responsive {
        position: relative;
      }
      .faculty-table thead th {
        position: sticky;
        top: 0;
        z-index: 4;
      }
    }

    /* Optional: small screens very narrow — slightly reduce font */
    @media (max-width: 420px) {
      .faculty-table1 thead th { font-size:0.82rem; padding:8px 6px; }
      .faculty-table1 tbody td { font-size:0.82rem; padding:6px 6px; }
      .actions a { font-size:0.8rem; padding:5px 8px; }
    }