/* Body Styles */
body {
    background-color: black;
	color: #ffffff;
	font-weight: 300;
	font-family: 'Ubuntu', serif;
	font-size: 1.4rem;
	font-style: normal;
}

h1 {
	background-color:#248408;
	text-align: center;
	font-weight: 500;
	font-family: 'Playfair', serif;
	font-size: 1.8rem;
	font-style: normal;
}

h2 {
	background-color: #248408;
	text-align: center;
	font-weight: 500;
	font-family: 'Playfair', serif;
	font-size: 1.6rem;
	font-style: normal;
}

h3 {
	background-color: #248408;
	text-align: center;
	font-weight: 500;
	font-family: 'Playfair', serif;
	font-size: 1.5rem;
	font-style: normal;
}

h5 {
	background-color: #248408;
	text-align: center;
	font-weight: 500;
	font-family: 'Playfair', serif;
	font-size: 1.5rem;
	font-style: normal;
}

h1.title {
	background-color: transparent;
	text-align: center;
}

a {
    color: navajowhite; /* Darker text color on hover for readability */
}

a:hover {
    background-color: #32CD32; /* Lighter green on hover */
    color: white; /* Darker text color on hover for readability */
}

/* Header Styles */
.header {
    color: #F0F0F0;
    text-shadow: 
        1px 1px 0 #555, /* Dark grey shadow for depth */
        2px 2px 0 rgba(255, 255, 255, 0.3), /* Light shadow for smoother effect */
        3px 3px 5px rgba(50, 205, 50, 0.6); /* More pronounced green glow shadow */
    font-size: 1.3rem;
    font-weight: bold;
    width: 100%; /* Full width */
    padding: 0 20px; /* Padding for left and right */
}

.about-section {
    background: linear-gradient(135deg, #333, #2B2B2B);
	border: 0.1px solid #32CD32 !important; /* Green border with !important */
    border-radius: 8px; /* Slightly rounded corners */
	color: #F0F0F0;
	text-align: left;
    padding: 30px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

.contact-section {
    background: linear-gradient(135deg, #333, #2B2B2B);
	border: 0.1px solid #32CD32 !important; /* Green border with !important */
    border-radius: 8px; /* Slightly rounded corners */
	color: #F0F0F0; 
	text-align: center;
    padding: 30px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
}



.header .header-text:hover {
    color: #A6E3A6; 
}

.fa-shield-alt {
    text-shadow: 
        1px 1px 0 #555, /* Dark grey shadow for depth */
        2px 2px 0 rgba(255, 255, 255, 0.3), /* Light shadow for smoother effect */
        3px 3px 5px rgba(50, 205, 50, 0.2); /* More pronounced green glow shadow */
    color: #A6E3A6; /* Match the color scheme */
    font-size: 1.2em; /* Adjust size if needed */
    filter: drop-shadow(0 0 10px rgba(50, 205, 50, 0.6)); /* Additional green glow */
}

.navbar-brand {
    margin-bottom: 0; /* Align the brand with the header */
}


.custom-select {
    background: linear-gradient(135deg, #2B2B2B, #444);
    color: #F0F0F0; 
    border: 1px solid #F0F0F0; 
	font-weight: bold;
    width: auto;
    min-width: 80px;
}






.custom-select:hover {
    background: linear-gradient(135deg, #32CD32, #444);
    color: #F0F0F0; /* Light text color for contrast */
    border: 1px solid #32CD32; 
}

.custom-select option {
    background-color: #2B2B2B; /* Dark background for options */
    color: #F0F0F0; /* Light text color for options */
	border: 1px solid #F0F0F0; 
}

/* Navigation Bar Styles */
/* Additional Navigation Bar Styles for 3D Effect */
.navbar {
    justify-content: center; /* Keep the navbar centered */
    position: relative; /* Ensure relative positioning for pseudo-elements */
	text-shadow: 
        1px 1px 0 #555, /* Dark grey shadow for depth */
        2px 2px 0 rgba(255, 255, 255, 0.2), /* Light shadow for smoother effect */
}

.navbar::after {
    content: '';
    position: absolute;
    left: 50%; /* Center the pseudo-element */
    transform: translateX(-50%); /* Adjust to keep it centered */
    bottom: -10px; /* Adjust based on desired depth */
    width: 100%; 
    height: 10px; /* Height for the 3D effect */
    background: linear-gradient(180deg, rgba(0,0,0,0.3), rgba(0,0,0,0.1)); /* Simulate shadow for depth */
    border-top: 1px solid #444; /* Top border for a more pronounced edge */
    z-index: -1; /* Position behind the navbar */
}


.navbar-nav {
    display: flex;
    justify-content: center; /* Center the items within the navigation bar */
}

.navbar-nav .nav-item {
    margin: 0 5px; /* Adjust margin as needed */
}

.navbar-nav .separator {
    display: flex;
    align-items: center;
    margin: 0 10px; /* Adjust margin to your preference */
}

.navbar-nav .separator i {
    color: #ddd; /* Change color to match your design */
}



.navbar-nav .nav-link:hover {
    color: #A6E3A6; /* Change color on hover */
	font-size: 1.1rem;
}

.navbar-nav .nav-link {
    color: #F0F0F0; /* Cybersecurity green */
    text-shadow: 
        1px 1px 0 #555, /* Dark grey shadow for depth */
        2px 1px 0 rgba(255, 255, 255, 0.3); /* Light shadow for smoother effect */
    font-weight: normal;
    font-size: 1.1rem;
    text-transform: uppercase;
    padding: 0.5rem 1rem;
	
        
}

.navbar-nav .nav-item:last-child {
    margin-right: 0; /* Remove margin for the last item */
}

.navbar-nav .nav-link.active {
	font-weight: bold;
}

/* Dropdown Menu Styles */
.dropdown-menu {
    background-color: #2B2B2B; /* Dark background for dropdown */
    color: #F0F0F0; /* Light text color for dropdown items */
    border: 1px solid #32CD32; /* Green border for dropdown */
}

/* Dropdown Item Styles */
.dropdown-menu .dropdown-item {
    color: #F0F0F0; /* Light text color for dropdown items */
    padding: 10px 20px; /* Adjust padding as needed */
}

/* Dropdown Item Hover Styles */
.dropdown-menu .dropdown-item:hover {
    background-color: #32CD32; /* Green background on hover */
    color: #000000; /* Dark text color on hover for readability */
}

/* Active Dropdown Item Styles */
.dropdown-menu .dropdown-item.active {
    background-color: #32CD32; /* Green background for active item */
    color: #000000; /* Dark text color for active item */
}


/* Defender Intro Section */
.defenderIntro {
    background: url('path/to/your/image.jpg') no-repeat center center;
    background-size: cover;
    color: #F0F0F0;
    height: 90vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* Text Shadow for 3D Effect */
.defenderIntro h1, .defenderIntro h2, .defenderIntro p {
    text-shadow: 
        2px 2px 0 #555, /* Dark grey shadow for depth */
        4px 4px 0 rgba(255, 255, 255, 0.3), /* Light shadow for smoother effect */
        6px 6px 0 rgba(255, 255, 255, 0.1); /* Lighter shadow for extended depth */
    font-size: 2.5rem; /* Adjust font size as needed */
    font-weight: bold; /* Ensure text stands out */
}

/* Specific 3D and Glow Effect for .defenderColor1 within h1 */
.defenderIntro h1 .defenderColor1 {
    text-shadow: 
        2px 2px 0 #555, /* Dark grey shadow for depth */
        4px 4px 0 rgba(255, 255, 255, 0.3), /* Light shadow for smoother effect */
        6px 6px 0 rgba(255, 255, 255, 0.1), /* Lighter shadow for extended depth */
        8px 8px 10px rgba(0, 255, 0, 0.2); /* Green glow shadow */
    filter: drop-shadow(0 0 5px rgba(50, 205, 50, 0.5)); /* Additional green glow */
}




/* Subtle 3D and Glow Effect for Slogan */
.slogan {
    text-shadow: 
        1px 1px 0 #555, /* Dark grey shadow for depth */
        2px 2px 0 rgba(255, 255, 255, 0.3), /* Light shadow for smoother effect */
        3px 3px 5px rgba(50, 205, 50, 0.2); /* More pronounced green glow shadow */
    color: #F0F0F0;
    filter: drop-shadow(0 0 10px rgba(50, 205, 50, 0.3)); /* Additional green glow */
}

/* Subtle 3D and Glow Effect for Shield Icon in Slogan */
.slogan .fa-shield-alt {
    text-shadow: 
        1px 1px 0 #555, /* Dark grey shadow for depth */
        2px 2px 0 rgba(255, 255, 255, 0.3), /* Light shadow for smoother effect */
        3px 3px 5px rgba(50, 205, 50, 0.2); /* More pronounced green glow shadow */
    color: #A6E3A6; /* Match the color scheme */
    font-size: 1.2em; /* Adjust size if needed */
    filter: drop-shadow(0 0 10px rgba(50, 205, 50, 0.6)); /* Additional green glow */
}






/* Container Styles */
.container-navbar {
    padding: 10px;
}

.container {
    padding: 20px;
}

/* Logo Styles */
.logo {
    max-width: 200px;
    margin-top: 20px;
}

/* Title Styles */
.title {
    font-weight: bold;
    margin: 20px 0;
}

/* First Letter Styles */
.first-letter {
    font-size: 2.5rem;
    font-weight: bold;
}

/* Defender Color Styles */
.defenderColor1 {
    font-family: 'Orbitron', sans-serif;
    font-size: 2.3rem;
    font-weight: bold;
    color: #F0F0F0;
    text-shadow: 0 0 15px rgba(120, 157, 203, 1), 0 0 20px rgba(120, 157, 203, 0.8);
    letter-spacing: 8px;
}

/* Slogan Styles */
.slogan {
    font-style: italic;
    font-weight: bold;
    color: #F0F0F0;
    text-shadow: 0 0 3px rgba(120, 157, 203, 0.6), 0 0 10px rgba(120, 157, 203, 0.4);
    margin-bottom: 10px;
	letter-spacing: 1px;
}

/* Intro Styles */
.intro {
    color: #F0F0F0;
    /*margin-bottom: 20px;*/
}

/* Read More Button Styles */
.btn-custom {
    /*background-color: #32CD32; */
	background: linear-gradient(135deg, #2B2B2B, #444);
	border-color: #32CD32;
    color: #F0F0F0; /* Light text color for contrast */
    padding: 10px 20px;
    text-transform: uppercase;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.btn-custom:hover {
	background: linear-gradient(135deg, #32CD32, #444);
    background-color: #32CD32; /* Lighter green on hover */
    color: #F0F0F0; /* Darker text color on hover for readability */
}

.btn-custom-outline {
    color: #F0F0F0; /* Cybersecurity green */
    border-color: #32CD32; /* Cybersecurity green border */
	transition: background-color 0.3s ease, color 0.3s ease;
	font-weight: 400;
	font-family: 'Ubuntu', serif;
	font-size: 1.3rem;
	font-style: normal;
}

.btn-custom-outline:hover {
	background: linear-gradient(135deg, #32CD32, #444);
    background-color: #32CD32; /* Matching background color on hover */
    color: #F0F0F0; /* Light text color on hover */
	font-weight: 500;
	font-family: 'Ubuntu', serif;
	font-size: 1.3rem;
	font-style: normal;
}

/* Text Styles */
.text-custom {
    color: #F0F0F0;
}


/* Card Styles */
.custom-card {
    background: linear-gradient(135deg, #2B2B2B, #444); /* Subtle gradient for depth */
    border: 0.1px solid #32CD32 !important; /* Green border with !important */
    border-radius: 8px; /* Slightly rounded corners */
    transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease; /* Added box-shadow transition */
	text-align: left;
    text-shadow: 
        1px 1px 0 #555, /* Dark grey shadow for depth */
        2px 2px 0 rgba(255, 255, 255, 0.2), /* Light shadow for smoother effect */
        3px 3px 5px rgba(50, 205, 50, 0.4); /* More pronounced green glow shadow */
    box-shadow: 
        2px 2px 0 rgba(255, 255, 255, 0.2),   /* Outer shadow for depth */
        3px 3px 5px rgba(50, 205, 50, 0.4) !important;  /* Subtle shadow for added depth */
}

.custom-card:hover {
    transform: scale(1.05); /* Slightly enlarge on hover */
    border-color: #66FF66 !important; /* Lighter green border on hover with !important */
    box-shadow: 
        0 10px 15px rgba(0, 0, 0, 0.2),   /* Larger shadow for more depth on hover */
        0 4px 6px rgba(0, 0, 0, 0.1);  /* Additional shadow for hover effect */
}

.custom-card .card-body {
    color: #F0F0F0; /* Consistent text color */
	text-align: center;
}

.custom-card .card-title {
    color: #F0F0F0; /* White text color for contrast */
}





/* Card Button Styles */
.custom-card .btn-custom {
    background-color: #32CD32; /* Cybersecurity green background */
    color: #F0F0F0; /* Light text color for contrast */
    border: none;
    padding: 10px 20px;
    text-transform: uppercase;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.custom-card .btn-custom:hover {
    background-color: #66FF66; /* Lighter green on hover */
    color: #000000; /* Darker text color on hover for readability */
}

.card-text {
    color: #F0F0F0; /* Consistent text color */
    text-shadow: 
        0px 1px 0 #555, /* Dark grey shadow for depth */
        0px 0.1px 0 rgba(255, 255, 255, 0.2); /* Light shadow for smoother effect */
	text-align: left;
}

.card-title {
    color: #F0F0F0 !important; /* Consistent text color */
    text-shadow: 
        1px 1px 0 #555, /* Dark grey shadow for depth */
        2px 1px 0 rgba(255, 255, 255, 0.2); /* Light shadow for smoother effect */
	font-weight: 500;
	font-family: 'Playfair', serif;
	font-size: 1.5rem;
	font-style: normal;
}



/* Accordion Styles */
.accordion-button {
    background-color: #2B2B2B; /* Dark background for accordion headers */
    color: #F0F0F0; /* Light text color for contrast */
    text-shadow: 
        0px 1px 0 #555, /* Dark grey shadow for depth */
        0px 1px 0 rgba(255, 255, 255, 0.2); /* Light shadow for smoother effect */
    font-weight: bold; /* Ensure text stands out */
    border: 1px solid #32CD32; /* Green border for accordion header */
    border-radius: 0; /* Reset border radius */
    transition: background-color 0.3s ease, color 0.3s ease, border-radius 0.3s ease;
    font-size: 1.3rem; /* Increase text size for better readability */
    line-height: 1.4; /* Improve readability with line height */
    display: flex; /* Use flexbox for icon alignment */
    align-items: center; /* Center items vertically */
}

.accordion-button::after {
    content: "\f078"; /* Font Awesome down arrow icon (chevron) */
    font-family: "FontAwesome";
    margin-left: auto; /* Align icon to the right */
    transition: transform 0.3s ease;
}

.accordion-button:not(.collapsed)::after {
    transform: rotate(180deg); /* Rotate icon when expanded */
}

.accordion-button:hover {
    background-color: #32CD32; /* Lighter green background on hover */
    color: #000; /* Dark text color on hover for readability */
    border-radius: 5px; /* Add slight rounding on hover */
}

.accordion-button:focus {
    box-shadow: none; /* Remove default focus outline */
}

.accordion-button:not(.collapsed) {
    background-color: #444; /* Slightly lighter background when accordion is open */
    color: #FFF; /* Brighter white text color when open */
    border-bottom: none; /* Remove duplicate border property */
}

.accordion-body {
    background: linear-gradient(135deg, #333, #2B2B2B); /* Gradient background */
    color: #F0F0F0; /* Light text color for contrast */
    border: 1px solid #32CD32; /* Green border for accordion body */
    padding: 15px; /* Padding for content */
    border-top: none; /* Remove top border to merge with header */
    transition: background-color 0.3s ease, color 0.3s ease;
    font-weight: 300;
	font-family: 'Ubuntu', serif;
	font-size: 1.3rem;
	font-style: normal;
    line-height: 1.5; /* Improve readability with line height */
}



pre {
	tab-size: 1;
	background-color: black;
	width: 100%; 
	box-sizing: border-box;
	padding: 10px;
	margin-top: 20px;
	border: 2px solid green !important;
	border-radius: 10px !important;
	text-align: left;
	overflow-x: auto;
}

.table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 1rem;
    background-color: #2b2b2b;
    border-collapse: collapse;
    color: #ffffff;
}

.table th, .table td {
    padding: 0.75rem;
    vertical-align: top;
    border-top: 1px solid #444444;
}

.table thead th {
    vertical-align: bottom;
    border-bottom: 2px solid #444444;
}

.table tbody + tbody {
    border-top: 2px solid #444444;
}

.table-dark {
    color: #ffffff;
    background-color: #2b2b2b;
}

.table-dark th, .table-dark td, .table-dark thead th {
    border-color: #444444;
}

.table-dark.table-bordered {
    border: 0;
}

.table-dark.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.1);
}

.table-dark.table-hover tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.2);
}





/* Footer Styles */
.footer {
    background-color: #2B2B2B; /* Dark background */
    color: #F0F0F0; /* Light text color for contrast */
    text-align: center; /* Centered text */
    padding: 20px 0; /* Padding for top and bottom */
    border-top: 1px solid #32CD32; /* Cybersecurity green border at the top */
    font-size: 1.0rem; /* Slightly smaller font size for footer text */
}

.footer p {
    margin: 0; /* Remove default margin */
    padding: 0; /* Remove default padding */
}

/* Hyperlink Styles in Footer */
.footer a {
    color: #32CD32; /* Cybersecurity green for links */
    text-decoration: none; /* Remove underline */
}

.footer a:hover {
    color: #66FF66; /* Lighter green on hover */
    text-decoration: underline; /* Underline on hover for clarity */
}








/* Media Queries */

@media (max-width: 575.98px) {
    .custom-select {
    background: linear-gradient(135deg, #2B2B2B, #444);
    color: #F0F0F0; 
    border: 1px solid #F0F0F0; 
	font-weight: bold;
    max-width: 110px;
    min-width: 110px;
}
	 
}





