body, html {
  width: 100%;
  height: 100%;
  font-family: 'Montserrat', sans-serif;
  background: url('CCMI.png') no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

#h11 {
  font-size: 3em;
  border-bottom: 2px solid purple;
  border-right: 2px purple;
  width: 800px;
  text-align: center;
  box-shadow: 4px 4px 5px grey;
  margin-top: 10px; 
  font-family: monospace;
  color: #FDD835; /* Yellow text color */
}

.navbar-dark .navbar-nav .nav-link {
  background-color: black; 
  color: white !important;
}

hr {
  margin: 20px auto;
  color: #FDD835; /* Yellow color for the horizontal rule */
  border: 3px solid #FDD835; /* Yellow color for the border */
  max-width: 65px;
  opacity: 1;  
}

.buffer {
  height: 10rem;
}

.btn {
  color: black; 
  font-weight: 700;
  border-radius: 300px;
  text-transform: uppercase;
}

.btn-primary {  
  background-color: #FDD835; /* Yellow background for the primary button */
  border-color: #FDD835;   
  --bs-btn-hover-bg: #FDD835; 
  --bs-btn-hover-border-color: #FDD835;
}

.btn-primary:hover {
  background-color: #FFEB3B; /* Lighter yellow background on hover */
  border-color: #FFEB3B;
  border-width: 4px;
}

.btn-xl {
  padding: 1rem 2rem;
}

.logo-img {
  max-width: 200px; /* Adjust the maximum width as needed */
  height: auto;
}

/* Services section styles */
#Services .container-fluid {
  padding-top: 25px; /* Adds top padding to the container-fluid element */
  color: #000000; /* Black text color for the Services section */
  background-color: ghostwhite; /* White background color for the Services section */
}

#h12 {
  margin-left: auto; /* Automatically evenly distributes the l and r margins */
  margin-right: auto;
  font-size: 3em;
  border-bottom: 2px solid purple;
  border-right: 2px purple;
  width: 1000px;
  text-align: center;
  box-shadow: 5px 5px 5px black; /* Adjust the horizontal and vertical offsets as needed */
  margin-top: 10px;
  font-family: monospace;
  color: #FDD835; /* Yellow text color */
}

#Services .container {
  /* Styles for the container element */
  max-width: 800px;
  margin: 0 auto; /* Centers the container horizontally */
}

#Services .text-center {
  /* Styles for center-aligning the text */
  text-align: center;
}

#Services .row {
  /* Styles for the row element */
  display: flex;
  justify-content: center; /* Centers the row items horizontally */
  margin-bottom: 75px; /* Adds bottom margin to the row element */
}

#Services .col {
  /* Styles for the column elements */
  padding: 10px;
  background-color: #FFFFCC; /* Light yellow background for the column elements */
  border: 1px solid #CCCC99; /* Light yellow border for the column elements */
}

footer {
  padding: 2px;
}