:root {
    /* Primary Color */
    --primary-color: #332C54;
  
    /* Secondary Colors (Adjust as needed) */
    --secondary-color-1: #47587E; /* Slightly darker shade for variation */
    --secondary-color-2: #D3D0CB; /* Light neutral color for contrast */
    --secondary-color-3: #FFA500; 
    --secondary-color-light: #e0e0e0; /* Light neutral color for contrast */

  }
  
 .btn-primary{
    background-color: var(--primary-color);
 }

 .text-primary{
    color: var(--primary-color) !important;
 }


 .btn-primary:hover{
    background-color: var(--secondary-color-1);
 }
 .bg-primary
 {
    background: var(--primary-color) !important;
 }

 .fs-1
 {
    font-size: 50px !important;
 }

 .bt-shadow
 {
    box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
 }
 .bg-light-blue
 {
    background : var(--secondary-color-light);
 }

.banner {
    background: linear-gradient( rgba(10, 0, 53, 0.5), rgba(10, 0, 53, 0.5) ), url('../images/banner.jpg');
    background-size: cover;
    background-position: center;
    height: 80vh; 
    text-align: center; 
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .search-filter
  {
    background: rgba(255, 255, 255, 0.829);
    border-radius:30px;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
    padding-right: 10px;
  }


  .bg-lg-theme
  {
    background: linear-gradient(var(--primary-color),var(--secondary-color-1));
  }
  .banner-stack
  {
    height: 200px;
    width:100%;
    border-radius: 30px;
  }