  

    <style>

        * {

            margin: 0;

            padding: 0;

            box-sizing: border-box;

        }


        body {

            font-family: Arial, sans-serif;

            line-height: 1.6;

            background-color: #f8f9fa;

            color: #333;

        }


        /* Root Variables for Theme */

        :root {

            --primary-color: #1664ff;

            --secondary-color: #004aad;

            --hover-color: #002f6c;

            --text-light: #ffffff;

            --text-dark: #333333;

            --font-size-base: 16px;

            --font-size-large: 2.5rem;

            --font-size-medium: 1.25rem;

            --font-size-small: 0.875rem;

        }

        #no-dots {
    list-style-type: none; /* This removes the bullet points */
    padding-left: 0; /* Optional: This removes the default left padding */
  }

.how-to-reach-container {
            width: 100%;
            /* background-color: #fff; */
            border-radius: 8px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            overflow: hidden; /* Ensures the border-radius is applied to children */
        }
        

        /* Style for the tab buttons container */
        .tab {
            display: flex;
            overflow: hidden;
            border-bottom: 1px solid #ccc;
            /* background-color: #f1f1f1; */
        }

        /* Style for the buttons inside the tab */
        .tab button {
            background-color: inherit;
            flex: 1; /* Makes all buttons take equal width */
            border: none;
            outline: none;
            cursor: pointer;
            padding: 14px 16px;
            transition: background-color 0.3s;
            font-size: 17px;
        }

        /* Change background color of buttons on hover */
        .tab button:hover {
            background-color: #ddd;
        }

        /* Style for the active/current tab button */
        .tab button.active {
            background-color: #ccc;
            font-weight: bold;
        }

        /* Style for the tab content */
        .tabcontent {
            display: none; /* Hide all tab content by default */
            padding: 20px;
            border-top: none;
            line-height: 1.6;
        }
		.paper-button {
            /* === Button Shape & Spacing === */
            display: inline-block; /* Allows us to set padding and margins */
            padding: 2px 4px; /* Vertical and horizontal padding */
            border-radius: 8px;   /* Rounded corners */
            
            /* === Button Colors & Text === */
            background-color: #007BFF; /* A clean blue background */
            color: #ffffff;           /* White text */
            text-decoration: none;    /* Removes the default link underline */
            font-family: Arial, sans-serif; /* A clean, modern font */
            font-size: 16px;
            font-weight: bold;
            text-align: center;
            
            /* === Effects === */
            cursor: pointer; /* Shows the 'hand' cursor on hover */
            transition: background-color 0.3s ease, transform 0.1s ease; /* Smooth animations */
        }
         /* === Hover Effect === */
        .paper-button:hover {
            background-color: #0056b3; /* A darker blue on hover */
        }

        /* === Active/Click Effect === */
        .paper-button:active {
            transform: scale(0.98); /* Makes the button 'press down' */
        }
		
        .navbar-toggler {

            border: none; /* Remove border */

        }


        .navbar-toggler-icon {

            background-color: var(--text-light);

        }


        /* Header */
		.header-content-area {
	    /* 1. Ensure the background image covers the entire element */
	    background-size: cover; 
	    
	    /* 2. Fix the image in place so it doesn't scroll with the content (Optional, but common for hero sections) */
	    background-attachment: fixed;
	    min-height: 400px;
	    
	    /* 3. Center the image both horizontally and vertically */
	    background-position: center center;
	    
	    /* 4. Do not repeat the image if the container is larger than the image itself */
	    background-repeat: no-repeat;
	    height: 100%;
	    }

        .header-title {

            font-size: var(--font-size-large);

            color: var(--text-light);

            text-align: center;

            padding: 60px 20px 20px;

        }
        .col-md-4, .col-md-8 {
            padding: 15px;
        }
        .profile-img {
            max-width: 100%;
            height: auto;
            border-radius: 8px; /* Slightly rounded corners for the image */
        }
    
        .custom-tabs {
        color: white; /* Lighter background on active/hover */
        
        /* transition: all 0.2s ease-in-out; Smooth transition for hover effects */
        margin-bottom: 5px; /* Corrects overlap with ul's bottom border */
        position: relative; /* Needed for z-index if you add more complex shadows/highlights */
        z-index: 1;
        border-color: transparent;
        
        }
        
        .custom-tabs {
        color: white; /* Lighter background on active/hover */
        
        /* transition: all 0.2s ease-in-out; Smooth transition for hover effects */
        margin-bottom: 5px; /* Corrects overlap with ul's bottom border */
        position: relative; /* Needed for z-index if you add more complex shadows/highlights */
        z-index: 1;
        border-color: transparent;
        }
        
        .sub-title {

            font-size: var(--font-size-medium);

            color: var(--text-dark);

            text-align: center;

        }
		
		.schedule-button {
            /* Basic Button Properties (Kept the same) */
            padding: 15px 30px; 
            font-size: 18px;
            font-weight: bold;
            color: #333; 
            text-decoration: none; 
            border: none;
            border-radius: 50px; 
            cursor: pointer;
            transition: all 0.3s ease; 
            display: inline-block; 
            
            /* Gradient Background - Changed to Light Green */
            background: linear-gradient(
                45deg,
                #A8E6CF, /* Light Mint Green */
                #DCF3D5, /* Pale Green/Honeydew */
                #FAFAFA  /* Off-White/Very Light Gray */
            );

            /* Optional: Add a subtle box shadow for depth (Kept the same) */
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
            pointer-events: auto;
            position: relative;
            z-index: 20;
			margin: 10px 30px 20px 10px;
        }

        /* Hover Effect for visual feedback */
        .schedule-button:hover {
            /* Changes the gradient position slightly on hover */
            background: linear-gradient(
                45deg,
                #DCF3D5, /* Start slightly lighter */
                #A8E6CF, /* End slightly greener */
                #FAFAFA
            );
            /* Lifts the button slightly (Kept the same) */
            box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
            transform: translateY(-2px);
            color: #000; /* Darker text on hover */
        }

		.register-button {
            /* Basic Button Properties */
            padding: 15px 30px; /* Vertical and horizontal padding */
            font-size: 18px;
            font-weight: bold;
            color: #333; /* Darker text color for contrast */
            text-decoration: none; /* Removes underline if using an <a> tag */
            border: none;
            border-radius: 50px; /* Rounded corners */
            cursor: pointer;
            transition: all 0.3s ease; /* Smooth transition for hover effects */
            display: inline-block; /* Allows padding and width/height settings */

            /* Gradient Background - The Key Styling */
            /* Linear gradient from a light pink/rose to an off-white */
            background: linear-gradient(
                45deg,
                #FFC0CB, /* Light Pink (e.g., a soft rose tone) */
                #FFE4E1, /* Misted Rose/Blush (middle color for a smoother transition) */
                #FAFAFA  /* Off-White/Very Light Gray */
            );

            /* Optional: Add a subtle box shadow for depth */
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
            pointer-events: auto;
            position: relative;
            z-index: 20;
			margin: 10px 30px 20px 10px;
        }

        /* Hover Effect for visual feedback */
        .register-button:hover {
            /* Changes the gradient position slightly on hover */
            background: linear-gradient(
                45deg,
                #FFE4E1, /* Start slightly lighter */
                #FFC0CB, /* End slightly pinker */
                #FAFAFA
            );
            /* Lifts the button slightly */
            box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
            transform: translateY(-2px);
            color: #000; /* Darker text on hover */
        }

		.guide-button {
            /* Basic Button Properties */
            padding: 15px 30px; /* Vertical and horizontal padding */
            font-size: 18px;
            font-weight: bold;
            color: #333; /* Darker text color for contrast */
            text-decoration: none; /* Removes underline if using an <a> tag */
            border: none;
            border-radius: 50px; /* Rounded corners */
            cursor: pointer;
            transition: all 0.3s ease; /* Smooth transition for hover effects */
            display: inline-block; /* Allows padding and width/height settings */

            /* Gradient Background - The Key Styling */
            /* Linear gradient from a light pink/rose to an off-white */
            background: linear-gradient(
                    45deg,
                    #e6e0ff, /* Very Light Lavender/Almost White */
                    #d1c4e9, /* Light Mauve/Soft Purple */
                    #b39ddb  /* Medium Lavender/Lilac */
                );

            /* Optional: Add a subtle box shadow for depth */
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
            pointer-events: auto;
            position: relative;
            z-index: 20;
			margin: 10px 30px 20px 10px;
        }

        /* Hover Effect for visual feedback */
        .guide-button:hover {
            /* Changes the gradient position slightly on hover */
            background: linear-gradient(
                45deg,
                #bbdbf6, /* Start slightly lighter */
                #e1eff0, /* End slightly pinker */
                #f7effe
            );
            /* Lifts the button slightly */
            box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
            transform: translateY(-2px);
            color: #000; /* Darker text on hover */
        }

		.awards-button {
    /* Fixed Width & Overflow Control */

    /* Basic Button Properties */
    padding: 15px 10px;
    font-size: 18px;
    font-weight: bold;
    color: #333; 
    text-decoration: none; 
    border: none;
    border-radius: 50px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-block; 
    
    /* Gradient Background (Light Blue) */
    background: linear-gradient(
        45deg,
        #ecd355, /* Light Blue */
        #cebe79, /* Light Cyan/Aqua */
        #c0d976  /* Off-White/Very Light Gray */
    );

    /* Optional: Add a subtle box shadow for depth */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    pointer-events: auto;
    position: relative;
    z-index: 20;
    margin: 10px 30px 20px 10px;
    
    /* Adjust padding to account for fixed width. 
       Note: With a fixed width, the horizontal padding (30px) pushes the content 
       in, potentially reducing the space available for text. 
       Consider reducing padding to maximize text space if needed. */
}

/* Hover Effect for visual feedback */
.awards-button:hover {
    /* Changes the gradient position slightly on hover */
    background: linear-gradient(
        45deg,
        #ebda55, 
        #d8b54c,
        #FAFAFA
    );
    /* Lifts the button slightly */
    box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
    color: #000; 
}

        p.text-white {

            font-size: var(--font-size-small);

            color: var(--text-light);

            text-align: center;

            padding: 0 20px;

        }


        /* Buttons */

        .btn {

            display: inline-block;

            background-color: var(--primary-color);

            color: var(--text-light);

            padding: 10px 20px;

            font-size: var(--font-size-medium);

            border: none;

            border-radius: 4px;

            cursor: pointer;

            transition: all 0.3s ease-in-out;

            box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);

        }

        table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 20px;
        }
        th, td {
            border: 1px solid #ddd;
            padding: 12px;
            text-align: center; /* Centered text for rates */
        }
        td:first-child {
            text-align: left; /* Align category name to the left */
        }
		 th {
            background-color: #7eaafa;
            font-weight: bold;
        }
        
        .btn:hover {

            background-color: var(--hover-color);

        }
.button-link {
            display: inline-block; /* Makes the anchor behave like a block for padding/margin, but still inline for flow */
            padding: 10px 20px; /* Adjust padding to control button size */
            background-color: #AECAD6; /* Light blue-grayish background color */
            color: #333; /* Darker text color for contrast */
            text-decoration: none; /* Removes the default underline */
            border: 1px solid #8FAAB8; /* Slightly darker border for definition */
            border-radius: 5px; /* Rounded corners */
            font-family: Arial, sans-serif; /* Choose a suitable font */
            font-size: 16px; /* Adjust font size */
            cursor: pointer; /* Indicates it's clickable */
            transition: background-color 0.3s ease, border-color 0.3s ease; /* Smooth transition on hover */
        }

        .button-link:hover {
            background-color: #9EC0CD; /* Slightly darker on hover */
            border-color: #7A95A6; /* Slightly darker border on hover */
        }

        .button-link:active {
            background-color: #8CAAB9; /* Even darker when clicked */
            border-color: #6B808F; /* Even darker border when clicked */
        }
        .rounded-table {
            border-collapse: collapse;
            width: 100%;
            margin: 25px auto;
            border-radius: 15px;
            overflow: hidden;
            box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
            font-family: sans-serif;
        }

        /* Style for the table header */
        .rounded-table thead tr {
            background-color: #a1c9f3;
            color: #080606;
            text-align: center; 
            font-weight: bold;
            font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
            font-size: large;
        }

        /* Style for all cells (header and data) */
        .rounded-table th, .rounded-table td {
            padding: 12px 15px;
        }
        
        /* Data cells remain left-aligned for readability */
        .rounded-table td {
            text-align: center;
            font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
            font-size: large;
        }

        /* UPDATED: Style for data rows */
        .rounded-table tbody tr {
            background-color: #ffffff; /* Explicitly set to white */
            border-bottom: 1px solid #dddddd;
        }

        /* REMOVED the zebra-striping rule that was here */

        /* Style for the last row to prevent a double border */
        .rounded-table tbody tr:last-of-type {
            border-bottom: 2px solid #ddf0ec;
        }

        /* Style for the links within the table */
        .rounded-table td a {
            color: black;
            font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
            text-decoration: none;
            /* font-weight: bold; */
        }
		 .rounded-table td a::after {
            content: ' \2197'; /* Unicode for a North-East arrow */
            font-size: 1em;
            margin-left: 4px;
            display: inline-block;
            transition: transform 0.2s ease-out; /* Smooth transition for hover */
        }

        /* NEW: Adding a hover effect to move the arrow */
        .rounded-table td a:hover::after {
            transform: translateX(4px) translateY(-4px);
        }

        .rounded-table td a:hover {
            text-decoration: underline;
        }
        .bg-gold {
    background: linear-gradient(45deg, #bf953f, #fcf6ba, #b38728, #fbf5b7, #aa771c) !important;
    color: #44340d !important;
  }
  .border-gold { border: 2px solid #bf953f !important; }

  /* New Contrasting Runner-up Gradient (Cool Blue Steel) */
  .bg-runner-up {
    background: linear-gradient(45deg, #1e3c72, #2a5298, #7199d3, #2a5298, #1e3c72) !important;
    color: #ffffff !important;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
  }
  .border-runner-up { border: 2px solid #1e3c72 !important; }
  
  /* Arrow Styling */
  .carousel-control-prev-icon, .carousel-control-next-icon {
    filter: invert(1);
    width: 2.5rem;
    height: 2.5rem;
  }
        /* Main Button */

        .main-btn {

            background-color: var(--secondary-color);

            color: var(--text-light);

            padding: 10px 20px;

            border: none;

            border-radius: 4px;

            cursor: pointer;

        }


        .main-btn:hover {

            background-color: var(--hover-color);

        }
                /* Responsive logo sizing */
                .responsive-logo {
            max-height: 80px;
            width: auto;
            margin: 20px;
        }

        @media (min-width: 768px) and (max-width: 991px) {
        .navbar-brand img {
            height: 100px; /* Adjusted size for tablets */
            margin: 10px 0;
        }
        
        .header-title {
            font-size: 2rem; /* Smaller header title for tablets */
        }
        
        /* Better spacing for navigation on tablets */
        .navbar-nav {
            padding: 10px;
        }
        
        .nav-item {
            margin-bottom: 5px;
        }
        
        /* Ensure dropdown appears properly on tablets */
        .dropdown-menu {
            position: absolute;
            width: 200px;
        }
    }
    
    /* Fix for dropdown on tablet and mobile */
    @media (max-width: 991px) {
        .navbar-nav .dropdown-menu {
            position: static;
            float: none;
            width: 100%;
            padding: 10px 15px;
            margin: 0;
            border: none;
            display: none; /* Hidden by default */
        }
        
        .navbar-nav .dropdown-menu.show {
            display: block; /* Shown when toggled */
        }
        
        .nav-item.dropdown .dropdown-toggle::after {
            float: right;
            margin-top: 8px;
        }
    }
    
    /* Additional responsive tweaks */
    .card {
        margin-bottom: 20px;
    }
    
    .tab-content {
        overflow-x: auto; /* For tables in tabs */
    }
    
    /* Touch-friendly buttons on smaller screens */
    @media (max-width: 991px) {
        .nav-link, .dropdown-item, button {
            padding: 10px 15px; /* Larger touch targets */
        }
    }

        /* Media queries for different screen sizes */
        @media (max-width: 768px) {
            .responsive-logo {
                max-height: 40px;
                margin: 20px;
            }
        }

        @media (max-width: 576px) {
            .responsive-logo {
                max-height: 30px;
                margin: 20px;
            }
        }

        /* Add padding for logo container on different screens */
        @media (min-width: 992px) {
            .header-content .d-flex {
                padding-left: 100px;
                padding-right: 100px;
                margin: 20px;
            }
        }

        /* Table */

        .table {

            width: 100%;

            border-collapse: collapse;

            margin: 20px 0;

            border-radius: 8px;

            overflow: hidden;

        }
        .updates-container {
            width: 100%;
            overflow: hidden; /* Hides content outside the div */
            white-space: nowrap; /* Keeps text on a single line */
            background-color: #f0f0f0;
            padding: 10px;
            border: 1px solid #ccc;
            box-sizing: border-box;
            line-height: 1.5; /* Improve text readability */
        }

        .moving-text {
            display: inline-block;
            animation: scroll-left 20s linear infinite; /* Adjust time for speed */
            padding-left: 100%; /* Starts the text off-screen to the right */
        }

        /* Define the scrolling animation */
        @keyframes scroll-left {
            0% {
                transform: translateX(0%);
            }
            100% {
                transform: translateX(-100%);
            }
        }

        .update-item {
            margin-right: 30px; /* Space between individual updates */
            display: inline-block;
            position: relative; /* Needed for positioning the ::before pseudo-element */
            padding-left: 20px; /* Make space for the bullet */
            color: #333;
            font-weight: bold;
        }

        .update-item span {
            font-weight: normal;
            color: #555;
        }

        /* Diamond Bullet Styling */
        .update-item::before {
            content: ''; /* Essential for pseudo-elements */
            position: absolute;
            left: 0; /* Position at the start of the item */
            top: 50%; /* Vertically center */
            transform: translateY(-50%) rotate(45deg); /* Rotate for diamond shape */
            width: 8px; /* Size of the diamond */
            height: 8px; /* Size of the diamond */
            background-color: #021120; /* Color of the diamond */
            border: 1px solid #041425; /* Optional border */
            box-sizing: border-box; /* Ensure border is included in width/height */
        }

        .table th, .table td {

            text-align: center;

            padding: 10px 15px;

        }


        .table-hover tbody tr:hover {

            background-color: #f0f8ff;

        }

        .text_container {
    background-color: white; /* White background for the div */
    padding: 20px; /* Some padding around the textbox */
    border: 1px solid #ccc; /* Optional: a light border for the div */
    border-radius: 15px;
    /*width: 400px; /* Set a width for the div */
    margin: 50px auto; /* Center the div on the page */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Optional: a subtle shadow */
  }

  textarea {
    width: 100%; /* Make the textarea fill the width of its parent div */
    height: 150px; /* Set a height for the textarea */
    padding: 10px; /* Padding inside the textarea */
    border: 1px solid #ddd; /* Light border for the textarea */
    border-radius: 15px; /* Slightly rounded corners for the textarea */
    box-sizing: border-box; /* Include padding and border in the element's total width and height */
    font-family: Arial, sans-serif; /* Set a common font */
    font-size: 16px; /* Set font size */
    resize: vertical; /* Allow vertical resizing only */
  }

        .table-primary {

            background-color: var(--secondary-color);

            color: var(--text-light);

        }


        .table-bordered th, .table-bordered td {

            border: 1px solid #dee2e6;

        }
   

        /* Dropdown Menu */

        .nav-item.dropdown {

            position: relative;

        }


        .nav-item.dropdown .dropdown-menu {

            display: none;

            position: absolute;

            top: 100%;

            left: 0;

            background-color: var(--primary-color);

            color: var(--text-light);

            min-width: 200px;

            padding: 10px 10px 10px 10px;

            z-index: 1000;

            transition: opacity 0.3s ease, visibility 0.3s ease;

        }

		.dropdown-toggle {
			white-space: normal;
		}
		
        .nav-item.dropdown:hover .dropdown-menu,

        .nav-item.dropdown:focus-within .dropdown-menu {

            display: block;

            opacity: 1;

            visibility: visible;

        }
            /* Ensure the dropdown items have a consistent background color */
    .dropdown-menu {
        background-color: var(--primary-color);
    }

    .dropdown-item {
        color: var(--text-light);
    }

    .dropdown-item:hover {
        background-color: var(--hover-color);
    }


        .custom-text-color {
                color: #300ac8;
                }
        .circle-img {

            width: 150px;

            height: 150px;

            object-fit: cover;

            border-radius: 50%;

            margin: 0 auto;

            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);

        }

        .navbar-brand img {
            height: 180px; /* adjust as needed */
            max-height: 15vh;
            width: auto;
            margin: 10;
        }

        @media (max-width: 768px) {
            .navbar-brand img {
                height: 60px;
            }
        }
        /* Contact Map */

        .contact-map iframe {

            width: 100%;

            height: 300px;

            border: 10;

        }
         /* Mobile Navigation Styles */
         @media (max-width: 991px) {
           
            .navbar-nav {
                background-color: var(--primary-color);
            }

            /* Fix for dropdown in mobile */
             .nav-item.dropdown .dropdown-menu {
                display: none;
                position: static;
                background-color: var(--secondary-color);
                padding: 10;
                margin: 10;
                border: navy;
                width: 100%;
            }

            .nav-item.dropdown.show .dropdown-menu {
                display: inline-block;
            }

            img {
                height: 60;
				max-width: 380px;
            }

        }
		.plus-symbol {
        /* Make the text larger */
        font-size: 2.2em; 
        /* Change the color to a bright blue */
        color: #9dafc2; 
        /* Optionally, make it heavier */
        font-weight: 900; 
        /* Adjust its position slightly to center it vertically */
        vertical-align: middle; 
        font-style: italic;
        text-shadow: 
      /* Extruded depth effect (dark layers) */
      1px 1px 0 #999,
      2px 2px 0 #888,
      3px 3px 0 #777,
      4px 4px 0 #666,
      0 0 10px rgba(255, 255, 255, 0.5);
      padding-right: 10px;
    }
    .btn-award-gold {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: 12px 28px;
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #44340d;
    background: linear-gradient(45deg, #bf953f, #fcf6ba, #b38728, #fbf5b7, #aa771c);
    background-size: 400% 400%;
    border: none;
    border-radius: 50px;
    cursor: pointer;
    transition: all 0.4s ease;
    box-shadow: 0 4px 15px rgba(181, 140, 44, 0.4);
    overflow: hidden;
    text-decoration: none;
  }

  /* Shimmer effect animation */
  .btn-award-gold::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 50%;
    height: 100%;
    background: linear-gradient(
      to right,
      rgba(255, 255, 255, 0) 0%,
      rgba(255, 255, 255, 0.6) 50%,
      rgba(255, 255, 255, 0) 100%
    );
    transform: skewX(-25deg);
    transition: none;
  }

  .btn-award-gold:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(181, 140, 44, 0.6);
    color: #2a2008;
    background-position: 100% 50%;
  }

  /* Trigger shimmer on hover */
  .btn-award-gold:hover::before {
    animation: shimmer 1.2s infinite;
  }

  @keyframes shimmer {
    100% {
      left: 200%;
    }
  }

  /* Icon spacing */
  .btn-award-gold i, .btn-award-gold span.icon {
    margin-right: 10px;
    font-size: 1.2rem;
  }

    </style>