:root {

  --primary-navy: #1B2A41;

  --teal-accent: #2E9EAA;

  --dark-teal: #257F8A;

  --paper-white: #F8F9FA;

  --soft-grey: #4A4A4A;

  --light-grey: #EDEDED;

  --dark-grey: #2C3E50;

  --footer-navy: #17202A;

  --footer-text: #CCCCCC;

  --amber: #FFB300;

  --orange-accent: #FF6F00;

  --deep-amber: #FB8C00;

} 



body {

	background-color: var(--paper-white);

	color: var(--soft-grey);

	font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

}



.link, .link:visited, .link:active, 

.mailto, .mailto:visited, .mailto:active

{

	color: var(--teal-accent);

	font-weight: bold;

}

.link:hover, .mailto:hover {

	color: var(--dark-teal);

	font-weight: bold;

}



.contact_icon{

	font-size: 2.4rem;

	color: var(--teal-accent);

}



.navbar, .dropdown-menu {

	background-color: var(--primary-navy);

}



.navbar-brand, .nav-link, .dropdown-item {

	color: white !important;

}

 

.nav-link, .nav-link-login{

	margin-left: 10px;

}



.dropdown-item {

	margin-bottom: 10px;

}





.nav-link-login{

	color: var(--teal-accent) !important;

	font-weight: bold;

}



.dropdown-item:hover, .nav-link:hover {

	background-color: var(--teal-accent);

	color: var(--paper-white) !important;

}

.nav-link-login:hover {

	background-color: var(--teal-accent);

	color: var(--paper-white) !important;

}



h1, h2, h3, h4, h5, h6 {

	color: var(--primary-navy);

	margin-bottom: 18px;

}



.section {

	background-color: var(--light-grey);

	padding: 2rem;

	border-radius: 8px;

	margin-bottom: 2rem;

}



.section-card {

  background-color: white;

  border-left: 5px solid var(--teal-accent);

  box-shadow: 0 4px 8px rgba(0,0,0,0.05);

  padding: 2rem;

  margin-bottom: 2rem;

  border-radius: 10px;

  transition: transform 0.3s ease, box-shadow 0.3s ease;

  animation: fadeInUp 1s ease;

}



.section-card:hover {

  transform: translateY(-5px);

  box-shadow: 0 6px 16px rgba(0,0,0,0.1);

}



.badge {

  margin-right: 0.5rem;

  margin-top: 0.5rem;



}



footer {

  background-color: var(--footer-navy);

  color: var(--footer-text);

  padding: 2rem 0;

}



.btn-primary {

	background-color: var(--primary-navy);

	border-color: var(--primary-navy);

}



.btn-primary:hover {

	background-color: var(--teal-accent);

	border-color: var(--teal-accent);

}



.btn-secondary {

	background-color: var(--teal-accent);

	border-color: var(--teal-accent);

}



footer {

	background-color: var(--footer-navy);

	color: var(--footer-text);

	padding: 2rem 0;

}



html, body {

  height: 100%;

}

#page-content {

  flex: 1 0 auto;

}

#sticky-footer {

  flex-shrink: none;

}







/* Back to Top */

#backtotop{z-index:999; display:inline-block; position:fixed; visibility:hidden; bottom:20px; right:20px; width:36px; height:36px; line-height:36px; font-size:16px; text-align:center; opacity:.2;}

#backtotop i{display:block; width:100%; height:100%; line-height:inherit;}

#backtotop.visible{visibility:visible; opacity:.5;}

#backtotop:hover{opacity:1;}



#backtotop{color:#FFFFFF; background-color:#FF3F4A;}











/* adj-- */

.bold {		font-weight: bold; }

.italic {	font-style : italic !important; }



.center { 	text-align: center; }

.right 	{	text-align: right; 	}



/* COLOURS */

.txt_navy		{ 	color: var(--primary-navy); }

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





.txt_soft_grey	{ color: var(--soft-grey); }

.bg_soft_grey	{ 	background-color: var(--dark-grey); }



.txt_dark_grey	{ color: var(--dark-grey); }

.bg_dark_grey	{ 	background-color: var(--dark-grey); }



.txt_teal		{ 	color: var(--teal-accent); }

.bg_teal		{ 	background-color: var(--teal-accent); }



.txt_dark_teal	{	color: var(--dark-teal);	}

.bg_dark_teal	{	background-color: var(--dark-teal);	}



.txt_active		{	color: var(--orange-accent);	}

.bg_active 		{	background-color: var(--orange-accent);	}



.txt_danger		{	color: var(--bs-danger);	}

.bg_danger		{	background-color: var(--bs-danger);	}



.txt_amber		{	color: var(--amber);	}

.bg_amber		{	background-color: var(--amber);	}



.txt_deep_amber	{	color: var(--deep-amber);	}

.bg_deep_amber	{	background-color: var(--deep-amber);	}





.bi{

	margin-right: 10px;

}

.h40{

	min-height: 120px;

	border: 1px solid red;

}



.icon-title {

  display: flex;

  align-items: center;

  gap: 0.5rem;

  color: var(--primary-navy);

}



.icon-title i {

  color: var(--teal-accent);

}



@keyframes fadeInUp {

  from {

	opacity: 0;

	transform: translateY(30px);

  }

  to {

	opacity: 1;

	transform: translateY(0);

  }

}