﻿@charset "UTF-8";
/*=======================================
  =
  Update: 4/18/2025
     1.  Made "Learn more" button 508 complaint.  Change height to 44px; to meet standard"  Adivied by siteimprove.
     2.  Made "US Search Bar 508 complaint.  Change height to 44px;  Adivied by siteimprove.
  Update 03/21/2025
     1.  Add google search bar styles
  
   Update 12/10/2024  
     1. Changed h1, h2, h3, h4 tags to color: #50535a;
    
  =======================================*/
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700&display=swap');

/*========================================================================================================================================
                                                                             Media Queries                            
 =========================================================================================================================================
/* Small screens (Phones generally) */

@media (max-width: 600)
{
    .usa-search__submit-text {
        display: none;
      }

      .usa-search__submit-icon {
        display: inline-block;
      }

     .subscribe-button{
		padding: 10px 20px;
		font-size: 0.9rem;
	}
    
html, body {
        overflow-x: hidden;
    }

    body {
        background: url('../img/bg-sidenav.png') repeat-y top left;
    }
	.container {
		width: 100%;
	}

}


} 


/* Medium screens (Tables generally) */
@media (min-width: 601px) and (max-width: 992px){

/* Large screens (desktops generally */
@media (min-width: 993px) {

}




	
	/* ==============================
				   HEADER 
	   ============================== */
	
	.header-util {
        margin-top: auto;
		width: auto;
	}
	
	/* ==============================
			LINKS & NAVIGATION
	   ============================== */

	#navMain .nav > li > a {
		padding: 10px 15px;
	}
	
		#navMain .nav > li > a:hover {
			padding: 10px 15px 8px;
		}

	#navbtnSide {
        background: #eee;
        border-radius: 0px 4px 4px 0px;
        -webkit-border-radius: 0px 4px 4px 0px;
    }

        #navbtnSide > span {
            background-color: #007eac;
        }

        #navbtnSide > span:nth-child(2) {
            width: 10px;
        }

	.lside {
		position: absolute;
		top: 160px;
		width: 245px;
		z-index: 0;
	}

    #navbtnSide {
        padding-left: 0px;
    }
	
	.content-util .navbar-default {
		position: relative;
		z-index: 2;
	}
	
	.content-util .navbar-toggle {
		position: absolute;
	}
	
	/* ==============================
				   CONTENT 
	   ============================== */
          .row.contains(W) {
                 display: none;
          }
               
	.content-util .breadcrumb {
		margin-left: 30px;
	}
	
	.content-util .col-mobile {
        margin-bottom: 0px;
        padding: 0px;
		position: relative;
		z-index: 1;
	}
	
	.content-main, .content-util {
		background: #fff;
	}
	
	.content-main, .content-util, footer {
        border-left: 1px solid #ccc\9;
        *border-left: 1px solid #ccc;
		margin-bottom: 0;
		position: relative;
		z-index: 2;
	}

	.content-util {
		border-bottom: none;
	}

	.lside .item-module {
		position: relative;
		bottom: 0;
	}
	
	#navbtnSide.navbar-toggle {
	    display: block;
	}
	
	.flex-link {
		margin: -80px auto 20px;
	}
	
	header .list-social {
		margin-top: 40px;
	}
	
	.highlight {
		margin: auto;
	}
	
		.highlight .row > div, .spotlight .row > div {
			margin-bottom: 25px;
		}
	
}

  /*=================================================== Max-width:  768px ================================================ */)


    @media (max-width: 768px) {
       /* Show image and hide text on smaller screens */
	

     

	/* ==============================
				   HEADER 
	   ============================== */
	header {
		padding: 10px;
	}
	
		header .container {
			padding: 0px 0px 0px 10px;
		}
	
	.header-logo {
		width: 15%;
	}
	
		.header-logo h1 a {	/*Nirmala .header-logo h1*/ 
			background-size: cover;
                        backgound-repeat: no-repeat;
                        background-position: center;
			width:  80%;
                        height: 75px;
			
		}
	
	header .header-util {
        margin-top: 10px;
		width: auto;
	}
	
	header .list-social {
		display: none;
	}
	
	/*  ==============================
			LINKS & NAVIGATION
   		============================== */
	
	/* ----- Mobile Navigation ----- */
	header .navbar-toggle.collapsed {
		margin-right: 17px;
	}
	
	.collapse.in {
		display: block;
	}
	
	.navbar-collapse {
		border-top: 0px;
	}	
	
	.navbar-default .navbar-toggle {
		background: transparent;
		-webkit-box-shadow: 0 0 3px 3px rgba(0,0,0,0.15) inset;
		box-shadow: 0 0 3px 3px rgba(0,0,0,0.15) inset;
        transition: box-shadow 0.2s ease 0s;
	}
	
		.navbar-default .navbar-toggle .icon-bar {
			background-color: #007eac;
		}
		
	.navbar-default .navbar-toggle.collapsed {
		background: none;
		border: none;
		-webkit-box-shadow: none;
		box-shadow: none;
	}
	
		.navbar-default .navbar-toggle.collapsed:hover {
			background: none;
			-webkit-box-shadow: 0 0 3px 3px rgba(0,0,0,0.15);
			box-shadow: 0 0 3px 3px rgba(0,0,0,0.15);
		}
	
		.navbar-default .navbar-toggle.collapsed .icon-bar {
			background-color: #5f457d;
		}

        header .navbar-toggle {
            margin-top: 20px;
        }
		
	/* ----- Main Navigation ----- */
	
	#navMain {
		-webkit-box-shadow: 0 3px 3px 3px rgba(0,0,0,0.25);
		box-shadow: 0 3px 3px 3px rgba(0,0,0,0.25);
		padding: 0px;
		position: absolute;
		width: 100%;
		z-index: 12;
	}
	
	nav {
		margin: 0px;
	}
	
	#navMain .container, 
	#navMain .nav {
		margin: 0px;
		padding: 0px;
	}
	

    #navMain .nav > li {
        display: block;
        text-align: left;
    }

		#navMain .nav > li {
			position: relative;
		}
		
            #navMain .nav > li > a,
			#navMain .nav > li > a:hover,
			#navMain .nav > li > a:focus,
			#navMain .nav > li:hover > a {
				border-bottom: 1px solid #000;
                background: none;
				padding: 18px;
                transition: background-color 0.3s ease 0s;
			}
            
			#navMain .nav > li > a:hover,
            #navMain .nav > li > a.btn-collapse:focus {
                background: #1d2328;
                }

		    /*#navMain li.panel > a.collapsed:after {
                content: "> ";
                position: absolute;
                right: 20px;
            }

            
		    #navMain li.panel > a:after {
                content: "> ";
                position: absolute;
                right: 20px;
            }
                */

	/* ----- Collapsible Sub Navigation ----- 
	
	.subnav {
		font-size: 0.9em;
		padding: 0px; 
	    position: relative;
	}
	
	.subnav .container, 
	.subnav .row, 
	.subnav li {
		margin: 0px;
		padding: 0px;
		text-align: left;
	}
	
	.subnav li div {
		margin: 0px;
	}
	
	.subnav .item-img, 
	.subnav .item-desc {
		display: none;
	}
	
	.subnav .item-title a {
        border-bottom: 1px solid #eee;
		display: block;
		padding: 18px 24px;
		text-decoration: none;
		width: 100%;
	}
	
		.subnav .item-title a:hover {
			background: #eee;
		}
	*/

    /* ----- Dropdown Sub Navigation ----- */

    #navMain .collapse {
        display: none;
    }

    #navMain .collapse.in {
        display: block;
    }

    #navMain .btn-collapse {
        display: block;
    }

    #navMain .nav > li:hover {
        background: none;
    }

    #navMain li > a.btn-collapse,
    #navMain li > a.btn-collapse.collapsed {
        background: #2c353b;
        border-left: 1px solid #000;
        height: 57px;
        position: absolute;
        top: 0;
        right: 0;
        width: 54px;
    }

    #navMain li > a.btn-collapse:hover,
    #navMain li > a.btn-collapse.collapsed:hover {
        background: #1d2328;
    }

    #navMain li > a.btn-collapse.collapsed:after {
        content: "> ";
        position: absolute;
        right: 20px;
    }

    #navMain li > a.btn-collapse:after {
        content: "> ";
        position: absolute;
        right: 20px;
    }

    .subnav {
	    border-top: 2px solid #24b0e8;
		font-size: 0.9em;
		padding: 0px; 
	    position: relative;
        display: block;
    }

    #navMain .nav > li:hover .subnav.collapse {
        display: none;
    }
    
    #navMain .nav > li:hover .subnav.collapse.in,
    #navMain .nav > li:hover .subnav.collapsing {
        display: block;
    }

    #navMain .nav > li .subnav > ul,
    #navMain .nav > li:hover .subnav > ul {
        border: none;
        display: block;
        margin-top:0;
    }

    #navMain .subnav > ul > li {
        padding: 0px;
    }

	#navMain .nav > li .subnav a {
        border-bottom: 1px solid #eee;
		display: block;
		padding: 18px 24px;
		text-decoration: none;
		width: 100%;
        transition: background-color 0.3s ease 0s;
	}
	
		#navMain .nav > li:hover .subnav a:hover {
			background: #eee;
		}

	.lside {
		top: 100px;
	} 
	
	/* ==============================
				   CONTENT 
	   ============================== */
	  
	.content-main .item-banner img {
		width: 100%;
		height: auto;
	}
	 
	.flex-link {
		margin: auto;
		width: 100%;
	}
	
	.highlight .item-img {
		float: left;
		width: 30%;
	}
	
	.highlight .item-content {
		float: left;
		width: 70%;
	}

    .content-util .breadcrumb {
        margin-top: 5px;
    }

    .footer-contact .row > div:first-child {
        border: none;
    }

	
}

 

   
/* ==============================
          	   GENERAL 
   ============================== */
   
html, body {
    background: #fff;
    color: #50535a;
	line-height: 22px;
    margin: 0;
    padding: 0;
      font-family: 'Roboto', sans-serif !Important;
    font-size: 1em;
}

h1 {
    color: #003976;
    font-size: 2em;
    font-weight: 200;
    line-height: 36px;
    text-transform: uppercase;
}

h2 {
    color: #003976;
    font-size: 1.75em;
    font-weight: bold;
    line-height: 23px;
    text-transform: none;
}

h3 {
    color: #003976 
    font-size: 1.5em;
    font-weight: bold;
    line-height: 22px;
}

h4 {
    color: #003976
}

/* ----- Homepage ----- */
#homepage h2 {
    color: #595188;
    font-size: 1.75em;
    font-weight: 500;
    line-height: 35px;
	margin: 10px auto 5px;
    text-transform: uppercase;
}

#homepage h3 {
    color: #4d4d4d;
    font-size: 1.5em;
    font-weight: 400;
    line-height: 22px;
	margin: 10px auto 5px;
}

#homepage h4 {
    color: #595188;
    font-size: 1.25em;
    font-weight: 400;
    line-height: 20px;
    margin: 0;
    text-transform: uppercase;
}

.rside h2 {
    color: #3d4a53;
    font-size: 1.75em;
	font-weight: 200;
    line-height: 40px;
    text-transform: uppercase;
}

.rside h3 {
    color: #595188;
    font-size: 1.5em;
    font-weight: 200;
    line-height: 20px;
    text-transform: uppercase;
}

.wrapper {
	margin: 0 auto;
}

.container {
             width:95%;
	     max-width: 100%; 
}

/* ==============================
          	   HEADER 
   ============================== */
   
header::before {
    background: url('../img/bg-header.jpg') no-repeat top center;
    background: #f5f5f5; /* Old browsers */
    background: -moz-linear-gradient(left, #f5f5f5 0%, #e0e0e0 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#f5f5f5), color-stop(100%,#e0e0e0)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left, #f5f5f5 0%,#e0e0e0 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, #f5f5f5 0%,#e0e0e0 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left, #f5f5f5 0%,#e0e0e0 100%); /* IE10+ */
    background: linear-gradient(to right, #f5f5f5 0%,#e0e0e0 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e0e0e0',GradientType=1 ); /* IE6-9 */
    -webkit-box-shadow: 0 0px 4px 2px rgba(0, 0, 0, 0.2);
    box-shadow: 0 0px 4px 2px rgba(0, 0, 0, 0.2);
   
    position: relative;
    z-index: 11;
}

.header-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 80px;
}

.header-logo {
    width: 150px; /* Removed unnecessary space */
}
.header-logo h1 a { /* Changed selector to match HTML */
    /* Set the seal as a background image */
    background-image: url('../img/disa_seal.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain; /* Ensure the image scales appropriately */

    /* Responsive behavior */
    width: 100%;
    height: auto;

    /* Provide space for the image */
    min-height: 70px; /* Adjust the height based on requirements */

    /* Optional padding */
    padding: 0px 0; /* Adjust padding if needed for text inside the h1 */

    text-indent: -9999px;

    display: block;

    /* Removed unnecessary comments */
}


.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.sr-only:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  white-space: normal;
  width: auto;
  z-index: 100000; /* Above WP toolbar */
}
.header-utils {
  display: flex;
  align-items: center;
}

.nav-search {
  margin-right: 10px;
}

.social-media {
  margin-left: 10px;
  padding-right: 20px;
}

.list-social {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.list-social li {
  margin-right: 10px;
}

.list-social li:last-child {
  margin-right: 0;
}

/*   Google Search Bar */
       .usa-button {
      background-color: #007bff; 
      color: white;
      border: none;
      padding: 8px 16px; 
      cursor: pointer;
      font-size: 1rem;   
      display: flex;      
      align-items: center; 
      height: 44px;
    }

    .usa-button:hover {
      background-color: #0056b3; 
    }

    .usa-search__submit-icon {
      margin-left: 8px;  
      display: none;         /* Hide image by default */
    }

    .usa-search {
      display: flex;          /* Make the search form a flex container */
    }

    .usa-input {
      flex: 1;                /* Allow input to grow and fill available space */
    }

    
/* ==============================
		LINKS & NAVIGATION
   ============================== */

a {
	color: #007eac;
}

.navbar-default {
	background: transparent;
	border: none;
}

/* ----- Toggle - Search ----- */
.nav-search {
	display:none; 
}

/* ----- Main Navigation ----- */
#navMain .nav {
    float: none;
    float: left\9;
    *float: left;
	margin: auto;
    text-align: center;
    width: 810px\9;
    width:95%;
}

#navMain, 
#navMain .nav > li > a.collapsed {
	background: #2c353b;
}

#navMain .nav > li {
	position: relative;
    display: inline-block;
    float: none;
    float: left\9;
    *float: left;
}

	#navMain .nav > li > a {
		color: #fff;
		padding: 10px 50px 12px; /* AL : padding:  10px 16px 12px;  */ 
                min-height: 44px;
	}
	
		#navMain .nav > li:hover > a,
        #navMain .nav > li > a:hover,
        #navMain .nav > li > a:focus {
			background: url(../img/menu-caret.png) no-repeat center bottom #1d2328;
			border-bottom: 2px solid #24b0e8;
			padding:  10px 50px 10px;/* AL : padding:  10px 44px 12px;  */ 
		}		
		#navMain .nav > li > a.active { 
			background: #1d2328; 
		}
		/*#navMain .nav > li > a, 
		#navMain .nav > li > a.active,
		#navMain .nav > li > a:focus {
			background: #1d2328;
		}*/

/* ----- Collapsible Sub Navigation ----- 

.subnav {
    background: #fff;
	border-top: 2px solid #2c353b;
	border-bottom: 4px solid #2c353b;
	font-size: 0.9em;
    height: auto;
    left: 0;
	padding: 0px 20px; 
    position: absolute;
    *position: relative;
    text-align: left;
    width: 100%;
    z-index: 13;
}

.subnav .container { 
	padding: 10px;
}

	.subnav li {
		margin-bottom: 10px;
	}
	
		.subnav li div {
			margin: 5px;	
		}

        .subnav .item-title a
        {
            font-size: 1.1em;
        }
		*/
.panel, .panel-group .panel + .panel {
	background: none;
	border: 0;
	border-radius: 0;
	-webkit-border-radius: 0;
	box-shadow: none;
	-webkit-box-shadow: none;
	margin: 0;
}    

/* ----- Dropdown Sub Navigation with Main Navigation Updates ----- */
/*#navMain .collapse {
    display: block;
}*/

#navMain .btn-collapse {
    display: none;
}

        #navMain .nav > li:hover {
			background: #1d2328;
        }

.subnav {
    background: #fff;
	font-size: 0.9em;
    height: auto;
    display: none;
    min-width: 200px;
    position: absolute;
    *position: relative;
    text-align: left;
    z-index: 13;
}

#navMain .nav > li .subnav > ul {
	border-top: 2px solid #24b0e8;
	border-bottom: 2px solid #2c353b;
    box-shadow: 0 0 5px 0 rgba(0,0,0,0.2);
    margin-top: -2px;
    display: block;
}

#navMain .nav > li:hover .subnav {
    display: block;
}

	#navMain .nav > li .subnav a {
		display: block;
		padding: 8px 15px;
		text-decoration: none;
		width: 100%;
        transition: background-color 0.3s ease 0s;
	}
	
		#navMain .nav > li:hover .subnav a:hover {
			background: #eee;
		}


/* ----- Left Side Navigation ----- */
.sidenav > .nav > li > a {
	border-bottom: 1px solid #ccc;
	color: #3d4a53;
	font-size:0.9em;;
	font-weight: 400;
    padding: 10px 15px 10px 0; /* AL : padding: 10px 30px 10px 5px; */ 
	text-transform: uppercase;
}

.sidenav > .nav > li > a:hover {
	background: none;
    color: #007eac;
}

.sidenav-lvl1 > ul > li.panel > a.btn-collapse.collapsed:before {
    content: "\25be  ";
	margin-left: 0px;
    margin-right: 0;
}

.sidenav-lvl1 > ul > li.panel > a.btn-collapse:before {
    content: "\25be ";
	margin-left: 0px;
    margin-right: 0;
}

.sidenav-lvl1 > ul > li.panel > a.btn-collapse,
.sidenav-lvl1 > ul > li.panel > a.btn-collapse:hover {
    background: none;
    border-bottom: medium none;
    height: 44px;
    right: 0;
    padding: 10px 0; /* AL : padding: 10px */ 
    position: relative\9\0;
    position: absolute;
    top: -44px\9\0;
    top: 0px;
    width: 20px; /* AL : width: 34px */ 
    float: right;
    z-index: 3;
	text-align: right; /* AL : NEW */ 
}

#navSide li.active a {
    color: #007eac;
}
#navSide li.active:first a {
    font-weight: bold;
}

.sidenav-lvl2 {
}

.sidenav-lvl2 > ul {
    background: #f0eff4;
    border-top: 3px solid #595188;
    padding: 10px;
}

.sidenav-lvl2 > .nav > li > a {
    color: #3d4a53;
    font-size: 0.9em;
    padding: 5px 5px 5px 0; /* AL : padding: 5px 5px 5px 20px; */ 
}

.sidenav-lvl2 > .nav > li > a:hover {
    background: none;
    color: #007eac;
}
/* ==============================
          	  Start Nirmala-Three tier drop down menu
   ============================== */


.subsidenav-lvl2 > a {
    
    color: #3d4a53;
    font-size: .95em;
    font-weight: 200;
    padding: 5px 5px 5px 0;
    text-transform: uppercase;
    text-decoration:none;
    background:none;
    line-height: 1.4285;
}

 .subsidenav-lvl2 > a.btn-collapse.collapsed:before {
       content: " ";
	margin-left: 0px;
    margin-right: 0;
     font-size:1.10em !important;
     float: right;
    }

   .subsidenav-lvl2 > a.btn-collapse:before {
         content: " ";
	margin-left: 0px;
    margin-right: 0;
     font-size: 1.00em !important;
     float: right !important;
    }

   .sidenav-lvl2 > a.btn-collapse,
.sidenav-lvl2 > a.btn-collapse:hover {
    background: none;
    border-bottom: medium none;
    height: 44px;
    right: 0;
    padding: 10px 0; /* AL : padding: 10px */ 
    position: relative\9\0;
    position: absolute;
    top: -44px\9\0;
    top: 0px;
    width: 20px; /* AL : width: 34px */ 
    float: right;
    z-index: 5;
	text-align: right; /* AL : NEW */ 
}

.subsidenav-lvl2 > .nav > li > a:hover {
    background: none;
    color: #007eac;
}

.subsidenav-lvl2 > .nav > li > a {
    color: #3d4a53;
    font-size: 1.15em;
    padding: 5px 5px 5px 15px; 
   
}


.sidenav-lvl3 {
}

.sidenav-lvl3 > ul {
    background: #e6e2e7;
    border-top: 2px solid #595188;
    padding: 10px;
}

.sidenav-lvl3 > .nav > li > a {
    
    font-size: 0.90em;
    padding: 5px 5px 5px 15px; 
     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #3d4a53;
}

.sidenav-lvl3 > .nav > li > a:hover {
    background: none;
    color: #007eac;
}

/* ==============================
          	   End Nirmala -three tier drop down
   ============================== */


/* ==============================
          	   CONTENT 
   ============================== */
#homepage .content {
    background: #fff;
}

.content-main {
    background: #fff;
    padding-bottom: 40px;
}


/* ----- Banner Slider ----- */
.flexslider {
	border: 0px;
	box-shadow: none;
	-webkit-box-shadow: none;
	margin: 0px;
}

.flex-control-nav {
	top: 10px;
	bottom: auto;
}

.flex-direction-nav a {
	height: 50px;
	width: 50px;
}

	.flex-direction-nav .flex-prev, 
	.flexslider:hover .flex-prev {
		background: url(../img/carousel-left.png) no-repeat;
		opacity: 0.5;
		left: 20px;
		text-indent: -9999px;
		text-align: inherit;
	}

	.flex-direction-nav .flex-next, 
	.flexslider:hover .flex-next {
		background: url(../img/carousel-right.png) no-repeat;
		opacity: 0.5;
		right: 20px;
		text-indent: -9999px;
		text-align: inherit;
	}

	.flex-direction-nav a:before, 
	.flex-direction-nav a.flex-next:before {
		content:"";
	}

.flex-control-paging li a {
	background: rgba(223, 223, 223, 0.5);
}

	.flex-control-paging li a.flex-active, 
	.flex-control-paging li a:hover {
		background: #fff;
	}

.flex-link {
    background: #003976;
    color: #fff;
	display: block;
    margin: -100px auto 50px;
    padding: 10px;
    position: relative;
    text-align: center;
	text-decoration: none;
    text-transform: uppercase;
    transition: background-color 0.3s ease 0s;
	top: -1px;
    width: 180px;
    height: 44px;
}

	.flex-link:hover {
		background: #007eac;
		color: #fff;
		text-decoration: none;
	}

/* ----- Highlight ----- */
.highlight {
	margin-top: -20px;
}

.highlight .container {
        
	border-bottom: 1px solid #999;
	
	margin-bottom: 20px;
}

.highlight .item-img {
	display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
}
.highlight .item-img img {
	border: 10px solid #fff;
	height:250px; 
        width: 100%;
        object-fit: cover;
        flex-basis: calc(33.33% - 20px);
        margin: 10px

       /* padding: 0px;
	height: auto;
	width: 100%;  */
} 


.highlight .item-content {
	padding: 0px 10px;
}

.item-wrap {
	min-height: 44px;
        min-width: 44px;
        display: flex;
        align-items: center;
        justify-center;
}
.highlight .item-link a {
	text-transform: uppercase;
	color: #007eac;
       
       
}

/*	.highlight .item-link a:after {
		content: " \f0d7";
	}
*/

.item-link .material-icons {

     font-size: 1.2em;
     color: black;
     vertical-align: middle;
}

/* ----- Spotlight ----- */
.spotlight {
	margin: 30px auto;
}

.spotlight .row > div {
	border-right: 1px solid #999;
}

	.spotlight .row > div:last-child {
		border-right: none;
	}

.spotlight .item-content {
	padding: 0px 5px;		/* AL: padding: 0px 10px; */
}

.spotlight .item-content h4 {
	padding-bottom: 5px		/* AL: new addition */
}

.spotlight .item-link a {
	color: #007eac;
}

/* ----- Breadcrumbs ----- */
.breadcrumb {
	background: none;
	margin: 5px; 
        font-size:1em;
}

.breadcrumb > li + li:before {
	color: #000;
	content: " »";
    padding: 0 5px;
}

    .breadcrumb a {
        color: #50535a;
    }

    .breadcrumb .active {
	    font-weight: bold;
    }

        .breadcrumb .active a {
            color: #007eac;
        }
   
/* ----- Content Utility ----- */

.content-util {
	border-bottom: 1px solid #ccc;
	font-size: 0.85em;
	margin-bottom: 15px; 
} 

.list-util {
	margin: 5px;
    padding: 8px;
	text-align: right;
}

    .list-util .icn {
	    padding-left: 24px;
    }

    .icn-print {
	    background: url(../img/icn-print.png) no-repeat left center;
    }

    .icn-share {
	    background: url(../img/icn-share.png) no-repeat left center;
    }

    .icn-subscribe {
	    background: url(../img/icn-subscribe.png) no-repeat left center;
    }

/* ----- Right Side Content ----- */
.rside {
	font-size: 0.9em;
}

.rside .media-heading {
	font-weight: bold;
}

.rside .item-link {
	border-bottom: 1px solid #ccc;
	margin: 10px 0 50px;
	padding-bottom: 10px;
}

.rside .item-link a {
	text-transform: uppercase;
	color: #007eac;
}

	.rside .item-link a:after {
		content: " >";
	}

.rside p {
	margin-bottom: 0px;
}

/* ----- Left Side Content ----- */
.lside {width: 15%;}
.lside .item-module {
	background: rgba(200,200,200, 0.25);
	margin: 40px 0;
}

.lside .item-module > div {
	padding: 15px;
}

.lside .item-heading {
   border-bottom: 1px solid #c3c4c2;
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
}

.lside .item-module a {
	color: #50535a;
	text-decoration: underline;
}
	
	
/* ----- Collapsible Content ----- */

.content-main .panel-default > .panel-heading {
	background: transparent;
}

.content-main .panel-title a {
	color: #007eac;
    font-size: 16px;
    font-weight: bold;
    line-height: 22px;
}

.content-main .panel-title a:hover,
.content-main .panel-title a:focus {
	text-decoration: none;
}

.content-main .panel,
.content-main .panel-group .panel + .panel {
	border-bottom: 1px solid #ccc;
}

.content-main .panel-collapse {
	border-top: 2px solid #007eac;
}

.content-main .panel-body {
	background: #f6f6f6;
	padding: 20px 30px;
}

.content-main .panel-title a.collapsed:before {
    color: #007eac;
    content: "> ";
	margin-right: 5px;
}

.content-main .panel-title a:before {
    color: #007eac;
    content: "> ";
	margin-right: 5px;
}

/* ----- Content - Banner ----- */
.content-banner {
    position: relative;
    max-width: 715px; /* AL : 687px; */ 
}

.content-banner .item-desc {
    background: rgba(10, 10, 10, 0.4);
    color: #fff;
    float: left;
    height: 100%;
    padding: 10px 20px; /* AL : padding: 20px; */
    position: absolute;
    right: 20px;
    top: 0;
    width: 30%;
}

    .content-banner .media-heading h3 {
        color: #fff;   
        font-size: 18px !important;
        font-weight: bold;
        margin: 10px 0; 	/* AL : margin-bottom: 10px; */
        text-transform: uppercase;
    }

    .content-banner .item-link {
        text-transform: uppercase;
    }

    .content-banner .item-link a {
        background: #5f457d;
        color: #fff;
        padding: 10px 15px;
	    text-decoration: none;
        text-transform: uppercase;
        transition: background-color 0.3s ease 0s;
    }

	    .content-banner .item-link a:hover {
		    background: #007eac;
		    color: #fff;
		    text-decoration: none;
	    }
	
/* ==============================
          	   FOOTER 
   ============================== */
   
footer {
	background: #2c353b;
	color: #fff;
	font-size: 0.9em;
}

	footer a,
    footer a:hover {
		color: #fff;
	}

footer #nav-footer, 
.footer-newsletter {
	padding: 20px;
}

#nav-footer ul li:first-child {
    font-size: 1em;
    font-weight: bold;
    padding: 2px 0;
}

.footer-contact {
	background: #1d2429;
}

.footer-contact .row > div {
	padding: 20px;
}

.footer-contact .row > div:first-child {
	border-bottom: 1px solid #636c71;
}

span.footer-logo {
	background: url('../img/logo-DISA-footer.png') no-repeat;
	display: block;
	margin: 0;
	padding: 0;
	height: 60px;
	width: 150px;
}

/* ==============================
				FORMS
   ============================== */

.btn-purple {
    background: #5f457d;
    color: #fff;
}

.form-control {
	 padding: 6px;
 }
   
.form-control, .btn {
	border-radius: 0;
	-webkit-border-radius: 0;
}

/* ----- Header Search & Footer Newsletter ----- */

header .form-search .form-control, 
footer .form-newsletter .form-control {
	font-size: 1em;
    height: 27px;
    margin: 1px;
    padding: 2px 6px;
    position: absolute;
}

header .form-search .form-group {
	position: relative;
	width: 250px;
}

header .form-search .form-control {
    width: 217px;
}

footer .form-newsletter .form-group {
	height: 30px;
	position: relative;
	width: 208px;	/* AL width: 168px; */ 
}

footer .form-newsletter .form-control {
    width: 200px;	/* width: 140px; */ 
}

header .form-search .btn-search,
footer .form-newsletter .btn-submit {
	margin: 0;
    padding: 3px 5px;
    position: absolute;
    right: 0;
    text-indent: -9999px;
}

header .form-search .btn-search {
	background: url(../img/icn-search.png) no-repeat;
    width: 35px;
}

footer .form-newsletter .btn-submit {
	background: url(../img/icn-submitarrow.jpg) no-repeat;
    width: 28px;
}


/* ==============================
			MISCELLANEOUS
   ============================== */
   
/* ----- Social Media ----- */

.list-social li {
    display: inline-block;
    *float: left;
    *margin: 2px;
}

    .list-social a {
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center; /* Corrected typo: background-positon -> background-position */
        display: block;
        text-indent: -9999px;
        margin: 0;
        padding: 0;
        min-height: 44px;
        min-width: 44px;
    }
    
    .list-social .icn-fb {
        background-image: url('../img/icn-fb-blk.png'); 
       
    }
    
    .list-social .icn-twitter {
        background-image: url('../img/icn-X-blk.png'); /* Updated image URL: icn-X-blk.png -> icn-twitter-blk.png */
    }
    
    .list-social .icn-youtube {
        background-image: url('../img/icn-youtube-blk.png');
    }
    
    .list-social .icn-linkedin {
        background-image: url('../img/icn-linkedin-blk.png');
    } 
    
    .list-social a:hover {
        background-color: #2c353b;
    }




@media(max-width:767px) {

	/* ==============================
				   HEADER 
	   ============================== */
	header {
		padding: 10px;
	}
	
		header .container {
			padding: 0px 0px 0px 10px;
		}
	
	.header-logo {
		width: 15%;
	}
	
		.header-logo h1 a {	/*Nirmala .header-logo h1*/ 
			background-size: cover;
                        backgound-repeat: no-repeat;
                        background-position: center;
			width:  80%;
                        height: 75px;
			
		}
	
	header .header-util {
        margin-top: 10px;
		width: auto;
	}
	
	header .list-social {
		display: none;
	}
	
	/*  ==============================
			LINKS & NAVIGATION
   		============================== */
	
	/* ----- Mobile Navigation ----- */
	header .navbar-toggle.collapsed {
		margin-right: 17px;
	}
	
	.collapse.in {
		display: block;
	}
	
	.navbar-collapse {
		border-top: 0px;
	}	
	
	.navbar-default .navbar-toggle {
		background: transparent;
		-webkit-box-shadow: 0 0 3px 3px rgba(0,0,0,0.15) inset;
		box-shadow: 0 0 3px 3px rgba(0,0,0,0.15) inset;
        transition: box-shadow 0.2s ease 0s;
	}
	
		.navbar-default .navbar-toggle .icon-bar {
			background-color: #007eac;
		}
		
	.navbar-default .navbar-toggle.collapsed {
		background: none;
		border: none;
		-webkit-box-shadow: none;
		box-shadow: none;
	}
	
		.navbar-default .navbar-toggle.collapsed:hover {
			background: none;
			-webkit-box-shadow: 0 0 3px 3px rgba(0,0,0,0.15);
			box-shadow: 0 0 3px 3px rgba(0,0,0,0.15);
		}
	
		.navbar-default .navbar-toggle.collapsed .icon-bar {
			background-color: #5f457d;
		}

        header .navbar-toggle {
            margin-top: 20px;
        }
		
	/* ----- Main Navigation ----- */
	
	#navMain {
		-webkit-box-shadow: 0 3px 3px 3px rgba(0,0,0,0.25);
		box-shadow: 0 3px 3px 3px rgba(0,0,0,0.25);
		padding: 0px;
		position: absolute;
		width: 100%;
		z-index: 12;
	}
	
	nav {
		margin: 0px;
	}
	
	#navMain .container, 
	#navMain .nav {
		margin: 0px;
		padding: 0px;
	}
	

    #navMain .nav > li {
        display: block;
        text-align: left;
    }

		#navMain .nav > li {
			position: relative;
		}
		
            #navMain .nav > li > a,
			#navMain .nav > li > a:hover,
			#navMain .nav > li > a:focus,
			#navMain .nav > li:hover > a {
				border-bottom: 1px solid #000;
                background: none;
				padding: 18px;
                transition: background-color 0.3s ease 0s;
			}
            
			#navMain .nav > li > a:hover,
            #navMain .nav > li > a.btn-collapse:focus {
                background: #1d2328;
                }

		    /*#navMain li.panel > a.collapsed:after {
                content: "> ";
                position: absolute;
                right: 20px;
            }

            
		    #navMain li.panel > a:after {
                content: "> ";
                position: absolute;
                right: 20px;
            }
                */

	/* ----- Collapsible Sub Navigation ----- 
	
	.subnav {
		font-size: 0.9em;
		padding: 0px; 
	    position: relative;
	}
	
	.subnav .container, 
	.subnav .row, 
	.subnav li {
		margin: 0px;
		padding: 0px;
		text-align: left;
	}
	
	.subnav li div {
		margin: 0px;
	}
	
	.subnav .item-img, 
	.subnav .item-desc {
		display: none;
	}
	
	.subnav .item-title a {
        border-bottom: 1px solid #eee;
		display: block;
		padding: 18px 24px;
		text-decoration: none;
		width: 100%;
	}
	
		.subnav .item-title a:hover {
			background: #eee;
		}
	*/

    /* ----- Dropdown Sub Navigation ----- */

    #navMain .collapse {
        display: none;
    }

    #navMain .collapse.in {
        display: block;
    }

    #navMain .btn-collapse {
        display: block;
    }

    #navMain .nav > li:hover {
        background: none;
    }

    #navMain li > a.btn-collapse,
    #navMain li > a.btn-collapse.collapsed {
        background: #2c353b;
        border-left: 1px solid #000;
        height: 57px;
        position: absolute;
        top: 0;
        right: 0;
        width: 54px;
    }

    #navMain li > a.btn-collapse:hover,
    #navMain li > a.btn-collapse.collapsed:hover {
        background: #1d2328;
    }

    #navMain li > a.btn-collapse.collapsed:after {
        content: "> ";
        position: absolute;
        right: 20px;
    }

    #navMain li > a.btn-collapse:after {
        content: "> ";
        position: absolute;
        right: 20px;
    }

    .subnav {
	    border-top: 2px solid #24b0e8;
		font-size: 0.9em;
		padding: 0px; 
	    position: relative;
        display: block;
    }

    #navMain .nav > li:hover .subnav.collapse {
        display: none;
    }
    
    #navMain .nav > li:hover .subnav.collapse.in,
    #navMain .nav > li:hover .subnav.collapsing {
        display: block;
    }

    #navMain .nav > li .subnav > ul,
    #navMain .nav > li:hover .subnav > ul {
        border: none;
        display: block;
        margin-top:0;
    }

    #navMain .subnav > ul > li {
        padding: 0px;
    }

	#navMain .nav > li .subnav a {
        border-bottom: 1px solid #eee;
		display: block;
		padding: 18px 24px;
		text-decoration: none;
		width: 100%;
        transition: background-color 0.3s ease 0s;
	}
	
		#navMain .nav > li:hover .subnav a:hover {
			background: #eee;
		}

	.lside {
		top: 100px;
	} 
	
	/* ==============================
				   CONTENT 
	   ============================== */
	  
	.content-main .item-banner img {
		width: 100%;
		height: auto;
	}
	 
	.flex-link {
		margin: auto;
		width: 100%;
	}
	
	.highlight .item-img {
		float: left;
		width: 30%;
	}
	
	.highlight .item-content {
		float: left;
		width: 70%;
	}

    .content-util .breadcrumb {
        margin-top: 5px;
    }

    .footer-contact .row > div:first-child {
        border: none;
    }

	
}

@media(max-width: 640px) {
    
	/* ==============================
				   HEADER 
	   ============================== */
	.header-logo h1 {
		margin-bottom: 0px;
	}
	
	/*  ==============================
			LINKS & NAVIGATION
   		============================== */
		
	.header-util .collapse {
		display: none;
	}
	
	.header-util .collapse.in {
        box-shadow: 0 5px 3px 0px rgba(0,0,0,0.15);
        -webkit-box-shadow: 0 5px 3px 0px rgba(0,0,0,0.15);
		display: block;
	}
	
	.navbar {
		margin-bottom: 0px;
	}
	
	.nav-search {
		display: block;
		margin: 10px;
		position: relative;
	}
	
	.nav-search .btn-search {
		background: url(../img/icn-search.png) no-repeat;
		margin: 0;
		padding: 3px 5px;
		position: absolute;
		right: 0;
		text-indent: -9999px;
		width: 35px;
	}
	
	header .search-collapse {
		left: 0;
		top: 70px;
		position: absolute;
		width: 100%;
	}

    .nav-search .btn-search {
        margin-top: 10px;
    }

    /* ----- Left Side Navigation ----- */
     
    

    .sidenav > .nav > li > a,
    .sidenav > .nav > li.panel > a {
        padding-left: 10px;
        padding-right: 34px;
    }

        .sidenav > .nav > li > a:hover {
            background: #eee;
        }

    .sidenav-lvl1 > ul > li.panel > a.btn-collapse.collapsed:before {
        content: "\f0d7 ";
    }

    .sidenav-lvl1 > ul > li.panel > a.btn-collapse:before {
        content: "> ";
        margin-left: -8px;
        margin-right: 0;
        position: absolute;
        right: 10px;
    }

	/* ==============================
					FORMS
	   ============================== */
	
	.form-search {
        background: #ccc;
		height: 70px;
		padding: 20px;
        margin-top: 20px;
	}
	
	header .form-search .form-group, 
	header .form-search .form-control,
	footer .form-newsletter {
		width: 100%;
	}
	
	footer .form-newsletter .btn-submit {
		width: 28px;
	}
	
}

@media(max-width:639px) {
    .content-banner .item-desc {
        background: #f0f0f0;
        margin: 20px;
        position: relative;
        color: #50535a;
        width: 100%;
    }

    .content-banner .media-heading h3 {
        color: #50535a;
        margin-top: 0;
    }


.header-logo {
		width: 15%;
               
	}
	
		.header-logo h1 a {	/*Nirmala .header-logo h1*/ 
			background-size: cover;
                        backgound-repeat: no-repeat;
                        background-position: center;
			width: 100%;
                        height:90px;

			
		}
	
}

@media(max-width:480px) {
	
	.col-mobile {
		margin-bottom: 20px;
		width: 100%;
	}
	.header-logo {
		width: 20%;
               
	}
	
		.header-logo h1 a {	/*Nirmala .header-logo h1*/ 
			background-size: cover;
                        backgound-repeat: no-repeat;
                        background-position: center;
			width: 100%;
                        height: 70px;

			
		}
	
	header .header-util {
        margin-top: 10px;
		width: auto;
	}
	/* ==============================
				   HEADER 
	   ============================== */
	   
	header .container {
		padding-left: 0px;
	}
	
	

    .navbar-default .navbar-toggle {
        margin-top: 8px;
}

    header .search-collapse {
            top: 50px;
        }

    .nav-search .btn-search {
        margin-top: 0;
    }

	/* ==============================
				   CONTENT 
	   ============================== */

	.lside {
		top: 80px;
        padding: 0 0 0 10px;
        width: 230px;
	} 
	    
	.content-util .list-util {
		margin: 0;
	}
	
	.content-util .breadcrumb {
		margin-left: 30px;
	}
    
    .list-util {
	    text-align: center;
    }
	
	.highlight .item-img, 
	.highlight .item-content {
		float: none;
		width: auto;
	}

    .spotlight .row > div {
        border: none;
    }

    .content-main .panel-title a.collapsed:before {
    color: #007eac;
    content: "> ";
	margin-right: 5px;
    }

    .content-main .panel-title a:before {
        color: #007eac;
        content: "> ";
	    margin-right: 5px;
    }

	/* ==============================
				   FOOTER 
	   ============================== */
	
	footer {
		font-size: 1em;
	}

        footer .form-newsletter .form-group
        {
            width: 200px;
        }

        footer .form-newsletter .form-control
        {
            width: 172px;
        }
}

/* IE Fixes */
div[class*="col-"], 
li[class*="col"] { 
    float: left\9;
    *float: left;
}

  .col-sm-12 {
    width: 100%\9;
    *width: 100%;
  }
  .col-sm-11 {
    width: 91.66666667%\9;
    *width: 91.66666667%;
  }
  .col-sm-10 {
    width: 83.33333333%\9;
    *width: 83.33333333%;
  }
  .col-sm-9 {
    width: 75%\9;
    *width: 75%;
  }
  .col-sm-8 {
    width: 66.66666667%\9;
    *width: 66.66666667%;
  }
  .col-sm-7 {
    width: 58.33333333%\9;
    *width: 58.33333333%;
  }
  .col-sm-6 {
    width: 50%\9;
    *width: 50%;
  }
  .col-sm-5 {
    width: 41.66666667%\9;
    *width: 41.66666667%;
  }
  .col-sm-4 {
    width: 33.33333333%\9;
    *width: 33.33333333%;
  }
  .col-sm-3 {
    width: 25%\9;
    *width: 25%;
  }
  .col-sm-2 {
    width: 16.66666667%\9;
    *width: 16.66666667%;
  }
  .col-sm-1 {
    width: 8.33333333%\9;
    *width: 8.33333333%;
  }

.col-md-12 {
    width: 100%\9;
    *width: 100%;
  }
  .col-md-11 {
    width: 91.66666667%\9;
    *width: 91.66666667%;
  }
  .col-md-10 {
    width: 83.33333333%\9;
    *width: 83.33333333%;
  }
  .col-md-9 {
    width: 75%\9;
    *width: 75%;
  }
  .col-md-8 {
    width: 66.66666667%\9;
    *width: 66.66666667%;
  }
  .col-md-7 {
    width: 58.33333333%\9;
    *width: 58.33333333%;
  }
  .col-md-6 {
    width: 50%\9;
    *width: 50%;
  }
  .col-md-5 {
    width: 41.66666667%\9;
    *width: 41.66666667%;
  }
  .col-md-4 {
    width: 33.33333333%\9;
    *width: 33.33333333%;
  }
  .col-md-3 {
    width: 25%\9;
    *width: 25%;
  }
  .col-md-2 {
    width: 16.66666667%\9;
    *width: 16.66666667%;
  }
  .col-md-1 {
    width: 8.33333333%\9;
    *width: 8.33333333%;
  }



/*#navMain .nav li {
    float: left\9;
    *float: left;
}*/

#navMain.collapse {
    display: block\9;
    *display: block;
}

#navbtnMain.navbar-toggle {
    display: none\9;
    *display: none;
}

/* Footer Styles */

#footer {
	background-color: #003976;
    color: #fff;
	padding: 2rem;
	border-radius: 0.5rem;
	font-size: 1rem;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	display: inline-flex;
	height: 250px;
	padding-top: 2%;
	padding-bottom: 2%;
}

.col1 {
	width: 75%;
	
}
.col2 {width: 30%;
       padding-left: 5%;
       padding-right: 5%;
	   margin-top: 0;
	    
}

#learn-more a{color: #8dc2e9;}
 

.footer .footer-content {
  max-width: 1240px;
  margin: 0 auto;
}



.footer-header {
  font-size: 2rem ;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 0.5em;
  letter-spacing: 0.1em;
  border-bottom: 1px solid #ccc;
  padding-bottom: 0.2em;
}

.footer .footer-text {
  font-size: 1rem;

}

.footer .footer-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.footer .footer-links .link {
  font-size: 1rem;
  margin: 0 0.5em;
  color: var(--link-color);
  text-decoration: none;
}

.footer .footer-links .link:hover {
  color: var(--link-hover-color);
}
.col2  h2{
	width: auto;
	height: 275px;
	background: no-repeat;
	background-image: url("../img/CTA.png");
	background-size: cover;
	
	
}

.centered { 
 position: top;  
 top: 50%;  
 left: 60%;  
 margin-top: -30px; 
	
 margin-left: 100px;
}



.jumbotron {
       background-color:#f7f7f7; /* light gray background color */
       border-radius: 10px;
	padding: 20px;
        margin-bottom: 20px;
        box-shadow: 0 2px 4px rgba (0, 0, 0, 0.1)
}

.jumbotron h1 {
   color: #1f497d;
   font-size: 24px;
   font-weight: bold;
}

/**************************************
           Buttons 
***************************************/

/* Crest_blue: #003976 */
.crest_blue{
  background-color: #003976;
  color: #ffffff; /* White font color for sufficient contrast */
}
.crest_blue:hover {
  background-color: #002b55;
  color: #ffffff;
}
.crest_blue:active {
  background-color: #002b55;
  color: #ffffff;
}

/* medium_blue: #299cd7 */
.medium_blue {
  background-color: #299cd7;
  color: #000000; /* Black font color for sufficient contrast */
}
.medium_blue:hover {
  background-color: #2385c3;
  color: #000000;
}
.medium_blue:active {
  background-color: #2385c3;
  color: #000000;
}

/* electric bule: #8dc239 */
.electric_blue {
  background-color: #8dc2e9;
  color: #000000; /* Black font color for sufficient contrast */
}
.electric_blue:hover {
  background-color: #7bb72c;
  color: #000000;
}
.electric_blue:active {
  background-color: #7bb72c;
  color: #000000;
}

/* Gold: #ffd520 */
.gold {
  background-color: #ffd520;
  color: #000000; /* Black font color for sufficient contrast */
}
.gold:hover {
  background-color: #ffca2b;
  color: #000000;
}
.gold:active {
  background-color: #ffca2b;
  color: #000000;
}

/* Brown: #5f4d3b   */
.brown {
  background-color: #5f4d3b;
  color: #ffffff; /* White font color for sufficient contrast */
}
.brown:hover {
  background-color: #664b3c;
  color: #ffffff;
}
.brown:active {
  background-color: #664b3c;
  color: #ffffff;
}

/* Black: #000000 */
.black {
  background-color: #000000;
  color: #ffffff; /* White font color for sufficient contrast */
}
.black:hover {
  background-color: #333333;
  color: #ffffff;
}
.black:active {
  background-color: #333333;
  color: #ffffff;
}

/* Grey: #65646e */
.grey {
  background-color: #65646e;
  color: #ffffff; /* White font color for sufficient contrast */
}
.grey:hover {
  background-color: #54555f;
  color: #ffffff;
}
.grey:active {
  background-color: #54555f;
  color: #ffffff;
}
 
.button-container {
       margin-left: auto;
        margin-right: auto;
}
.subscribe-button {
	display: inline-block;
	padding: 15px 30px;
	background-color: #fff;
	color: black;
	text-decoration: none;
	border: 2px; solid white;
	border-radius: 8px;
	font-size: 1rem;
	font-weight: 600;
	transition: all 0.3s ease;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
       cursor: pointer;	
	text-align: center;
        
}

.subscribe-button:hover{
	background-color: #f0f0f0;  /* light grey on hover */
	color: black; /* ensures text stay black on hover */
	border-color: #f0f0f0;
	transform: translateY(-2px);
	box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15)
}

.subscribe-button:focus {
	outline: none;
	box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.5); /* White focuse ring against black */
}


