﻿
/* vision n mission  */
:root { --primary-color: #004c8f; } 
.bg-primary-custom { background-color: var(--primary-color); } 
.text-primary-custom { color: var(--primary-color); } 
.section-title { font-weight: 700; font-size: 2rem; margin-bottom: 1rem; } 
.card-custom { border: none; border-radius: 12px; box-shadow: 0 4px 12px rgba(0,0,0,0.1); transition: transform 0.3s ease; } 
.card-custom:hover { transform: translateY(-5px); } 
.icon-circle { width: 70px; height: 70px; border-radius: 50%; background-color: var(--primary-color); display: flex; align-items: center; justify-content: center; margin-bottom: 1rem; color: #fff; font-size: 2rem; } 
.icon-circle { width: 70px; height: 70px; border-radius: 50%; background-color: var(--primary-color); display: flex; align-items: center; /* vertical centering */ justify-content: center; /* horizontal centering */ margin: 0 auto 1rem; /* centers the circle itself in the card */ color: #fff; font-size: 2rem; line-height: 1; /* ensures icon sits in the middle */ }
/* ---------  */

/* Organisation structure */
.structure-image 
{
      max-width: 100%;
      height: auto;
}

.center-div 
{
      display: flex;
      justify-content: center;
      align-items: center;
      min-height: 60vh;
      background-color: #f8f9fa;
      padding: 2rem;
}
/* --------  */

/* Social Responsibilities */
/* Hover animation effect */ 
.list-group-item 
{ transition: transform 0.3s ease, box-shadow 0.3s ease; } 
.list-group-item:hover 
{ transform: scale(1.05); box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); background-color: #f1f9ff; } 
.list-icon 
{ color: #0d6efd; /* Bootstrap primary blue */ margin-right: 10px; } 
/* ------------ */


/* Deposits */

 /* Fixed Deposit Table with Gradient Header, Animations & Hover Effects*/ 
     /* Card-like container and entrance animation */ 
    .custom-table 
    { 
        border-radius: 12px; 
        overflow: hidden; 
        box-shadow: 0 4px 14px rgba(0,0,0,0.12); 
        transform-origin: top; 

    } 
    
    .animate-in 
    { 
        animation: fadeSlideUp 500ms ease-out both; 

    }
     @keyframes fadeSlideUp 
     { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } } 
     /* Staggered row animation for a subtle progressive reveal */ 
     tbody tr 
     { 
        opacity: 0; transform: translateY(10px); 
        animation: rowIn 450ms ease-out forwards; 

     }
      tbody tr:nth-child(1) 
      { animation-delay: 120ms; } 
      tbody tr:nth-child(2) 
      { animation-delay: 220ms; } 
      tbody tr:nth-child(3) 
      { animation-delay: 320ms; } 
      tbody tr:nth-child(4) 
      { animation-delay: 420ms; } 
      @keyframes rowIn { to { opacity: 1; transform: translateY(0); } 

      }
      
       /* Gradient header applied to each TH for reliable coverage */ 
       thead.table-header th 
       { 
           /*background: linear-gradient(90deg, #004c8f, #0073e6) !important; */
           background: #004c8f ; /*, #0073e6) !important; */
           color: #fff !important; 
           border-color: rgba(255,255,255,0.25) !important; 
           transition: background 250ms ease; 

       } 
       /* Header hover: reverse gradient */ 
       thead.table-header:hover th 
       {
            /*background: linear-gradient(90deg, #0073e6, #004c8f) !important; */
            background:  #0073e6 ; /*, #004c8f) !important;*/
       } 


       .rounded-h4 
       { 
        border: 1px solid #b2b2b2; /* add a visible border */ 
        border-top-left-radius: 12px; 
        border-top-right-radius: 12px; 
        border-bottom-right-radius: 0px;
        border-bottom-left-radius: 0; /* sharp bottom-left */ 
        display: inline-block;
        width:100%; 
        padding: 3px 5px;
        background-color :#e5e5e5;
        color:#343434;
        text-align :center;

       }

       .rounded-h4:hover
       { 
        border: 1px solid #b2b2b2; /* add a visible border */ 
        border-top-left-radius: 12px; 
        border-top-right-radius: 12px; 
        border-bottom-right-radius: 0px;
        border-bottom-left-radius: 0; /* sharp bottom-left */ 
        display: inline-block;
        width:100%; 
        padding: 3px 5px;
        background-color :#e5e5e5;
        color:#343434;
        text-align :center;

       }

        .rounded-h4:hover
       { 
        color:#004c8f;
       }


       /* Alternating row colors (ensure this overrides Bootstrap) */ 
       .custom-table tbody tr:nth-child(odd) 
       { 
           background-color: #f2f6fa !important;

       } 
       
       .custom-table tbody tr:nth-child(even) 
       {
            background-color: #e6eef5 !important; 

       } 
            /* Row hover effect with pointer cursor */ 
       .custom-table tbody tr:hover 
       { 
           background-color: #d9e6f2 !important; 
           cursor: pointer; 

       } 

/* ------------ */




/*  */

.content {
    margin-top: 20px;
}
.row {
    margin-right: -15px;
    margin-left: -15px;
}
.frame-style-projects {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
    -moz-box-shadow: 0 0 10px rgba(0,0,0,0.6);
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
    -o-box-shadow: 0 0 10px rgba(0,0,0,0.6);
    margin: 2px;
    padding: 1px;
    /* border: 1px solid rgba(0, 0, 0, 0.6);*/
}

        img {
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
        }

        .div-centered {
    display: flex;
    justify-content: center;
    align-items: center;
}

        .text-center {
    text-align: center;
}
.welheading2 {
    font-size: 15px;
    font-weight: 600;
    color: #004c8f; /*#D7524B; */
    font-family: "Roboto", sans-serif, Alegreya Sans, arial;
    line-height: 1.42857143;
    margin-top: 0px;
    margin-bottom: 2px;
    padding: 4px;
}

.newcontent {
    margin-top: 1px;
}

.welheading {
    font-family: "Roboto", sans-serif,'Noto Sans', sans-serif;
    font-size: 26px;
    color: #000000;
    text-transform: uppercase;
    font-weight: bold;
}

.welheading-gallery {
    color: #004c8f;/*#d9534f;*/
    font-weight: normal;
    font-family: "Roboto", sans-serif,'Aldrich', sans-serif !important;
    font-size: 21px;
}
.text-upper
{
    text-transform:uppercase;
}

.text-left
{
    text-align:left;
}

.text-right
{
    text-align:right;
}

.text-center
{
    text-align:center;
}


hr {
  height: 4px;
  margin-left: 15px;
  margin-bottom:-3px;
  border:0;
  opacity:1;
}

.hr-danger{
  background-image: -webkit-linear-gradient(left, rgba(244,67,54,.8), rgba(244,67,54,.6), rgba(0,0,0,0));
}




.hr-seprator
{
  height: 4px;
  margin-left: 0px;
  margin-bottom:-3px;
  
  background-image: -webkit-linear-gradient(left, rgba(255,0,0,.8), rgba(255,0,0,.6), rgba(0,0,0,0));

}

/* ------------ */







