/* hero section */
.training-hero {
    background-image: url('https://www.infosecinstitute.com/siteassets/Theme/Marketing/images/assets/homepage-bg.png');
    background-size: cover;
    background-position: center;
    height: 70vh;
}

.training-container {
    max-width: 87%;
    margin: 0 auto;
    padding: 50px;
    padding-top: 100px;
}

.training-heading {
    font-size: 2.8em;
}

.training-description {
    font-size: 1.2em;
}

.training-buttons{
    padding-top: 50px;
}

.training-buttons .button-1{
    background-color: #007EA8;
}

.training-buttons .button-1:hover{
    background-color: #005A7C;
}

.training-buttons .button-2{
    background-color: #A23F97;
}

.training-buttons .button-2:hover{
    background-color: #6B2A64;
}

.training-button {
    background-color: #4CAF50;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    font-size: 1.1em;
}

  /* cyber section */
.cyber-container {
  padding-top: 50px;
  text-align: center;
  max-width: 1200px; /* Limit container width for larger screens */
  margin: 0 auto; /* Center the container */
  margin-bottom: 2%;
}

.fortune-red{
  margin: 70px auto;
}

.fortune-red h1{
  color: #004965;
  margin-bottom: 70px;
}

.fortune-child{
  gap: 100px;
}

.cyber-container h1 {
  font-size: 1.8rem;
  color: #005A7C;
}

.cyber-title {
  padding-top: 25px;
  padding-bottom: 15px;
}

.cyber-card-cont {
  display: flex;
  justify-content: center;
  flex-wrap: wrap; /* Allow cards to wrap on smaller screens */
  gap: 50px; /* Add spacing between cards */
  padding-bottom: 50px; /* Reduce padding for smaller screens */
}

.cyber-card {
  width: calc(25% - 40px); /* 4 cards per row with spacing */
  max-width: 289px; /* Limit card width */
  text-align: center;
}

.cyber-card-logo {
  max-width: 100%; /* Make logo responsive */
  height: auto;
  margin-bottom: 15px;
}

.cyber-card-title {
  padding-top: 20px;
  font-size: 1.4rem;
  color: #005A7C;
}

.cyber-card-description {
  font-size: 1rem; /* Use relative units */
  color: #444;
  margin: 10px 0; /* Add spacing */
}

.cyber-card-button {
  background-color: white;
  border: 2px solid purple;
  color: purple;
  padding: 10px 20px;
  border-radius: 10px;
  font-size: 1rem; /* Use relative units */
  cursor: pointer;
  margin-top: 25px;
  transition: all 0.3s ease;
}

.cyber-card-button:hover {
  background-color: purple;
  color: white;
}

/* upskill section */
.upskill-container {
  padding-top: 58px;
  background-color: #004965;
  text-align: center;
}

.upskill-container h1 {
  font-size: 1.8rem;
  color: #fff;
  margin: 0 auto; /* Center the heading */
  max-width: 90%; /* Limit width for better readability */
}

.cyber-para {
  font-size: 1rem;
  color: #99C5C6;
  margin-bottom: 10px; /* Add spacing */
}

.upskill-card-cont {
  display: flex;
  justify-content: center;
  flex-wrap: wrap; /* Allow cards to wrap on smaller screens */
  gap: 50px; /* Reduce gap for smaller screens */
  padding-bottom: 50px;
  padding-top: 50px;
}

.upskill-card {
  width: 350px; /* Fixed width for cards */
  padding: 20px;
  text-align: center;
}

.upskill-card-logo {
  max-width: 100%; /* Make logo responsive */
  height: auto;
}

.upskill-card-title {
  font-size: 1.3rem;
  color: #fff;
  padding-top: 10px;
  margin-bottom: 10px; /* Add spacing */
}

.upskill-card-description {
  font-size: 1rem; /* Use relative units */
  color: #fff;
  padding-top: 10px;
  margin: 5px 0;
}

.upskill-card-button {
  border: 2px solid #D9E2E5;
  color: #fff;
  padding: 10px 20px;
  border-radius: 10px;
  font-size: 1rem; /* Use relative units */
  cursor: pointer;
  transition: all 0.3s ease;
  margin-top: 20px; /* Add spacing */
}

.upskill-card-button:hover {
  border: 2px solid #fafafa;
  background-color: rgba(255, 255, 255, 0.1); /* Add hover effect */
}
/* course section */
  .course-container {
    padding-top: 40px;
}

.indivi-container, .unique-indivi-container {
    display: flex;
    justify-content: center;
    gap: 30px;
    padding: 20px;
    padding-top: 40px;
    flex-wrap: wrap; /* Allow items to wrap to the next line on smaller screens */
}

.indivi-container1 {
    display: flex;
    justify-content: center;
}

.indivi-nav {
  display: flex;
  justify-content: center;
  color: #004965;
  gap: 50px;
  overflow-x: auto;
  white-space: nowrap;
  padding-bottom: 10px;
  /* border-bottom: 1.4px solid #999; */
  width: 100%;
  scroll-behavior: smooth;
}

.indivi-nav::-webkit-scrollbar {
  display: none;
}


.divider {
    height: 2px;
    border-bottom: 1px solid #888;
}

.indivi-nav-item, .unique-indivi-nav-item {
    cursor: pointer;
}

.indivi-nav .upere {
    font-size: .93rem;
}

.indivi-nav-item:hover {
    color: #007EA8;
}

.indivi-course-tile {
    width: 26%;
    border: 1.7px solid #fafafa;
    border-radius: 10px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.17);
    text-align: center;
    border-radius: 10px;
    margin-bottom: 20px; /* Add margin to separate tiles on smaller screens */
}

.indivi-course-tile:hover {
    border: 1.7px solid #007EA8;
}

.unique-tile {
    border: 1.7px solid #fafafa;
}

.unique-tile:hover {
    border: 1.7px solid #A23F97;
}

.tile-header {
    height: 45px;
    border-top-right-radius: 7px;
    border-top-left-radius: 7px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    background-color: #005A7C;
    padding: 10px;
    padding-top: 5px;
    box-sizing: border-box;
}

.tile-header img {
    padding-top: 8px;
    padding-bottom: 5px;
    max-width: 26%;
    height: auto;
}

.indivi-course-tile .imagen {
    width: 100%;
    margin-bottom: 15px;
}

.indivi-course-title {
    color: #005A7C;
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 6px;
}

.togo {
    margin-top: 13px;
}

.indivi-course-description {
    padding-left: 9px;
    padding-right: 9px;
    margin-bottom: 15px;
    color: #444;
}

.indivi-view-pricing-btn {
    background-color: #007EA8;
    width: 90%;
    color: #fff;
    padding: 10px 20px;
    margin-bottom: 16px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

.unique-indivi-view-pricing-btn {
    background-color: #A23F97;
}

/* .indivi-view-pricing-btn.btn-1 {
    margin-top: 60px;
} */

.indivi-container, .unique-indivi-container {
    display: none;
}

.indivi-nav-item.active {
    color: #007EA8;
}

.unique-indivi-nav-item.active {
    color: #A23F97;
}

.indivi-g {
    padding-top: 20px;
    font-size: 1.9rem;
    color: #007EA8;
    padding-bottom: 30px;
    text-align: center; /* Center text on smaller screens */
}

.indivi-g span {
    color: #005A7C;
}

.indivi-buttons {
    display: flex;
    padding-top: 40px;
    padding-left: 2.3%;
    padding-right: 2.3%;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap; /* Allow buttons to wrap to the next line on smaller screens */
}

.bot-1, .bot-2 {
    color: #007EA8;
    padding: 10px 20px;
    font-size: 16px;
    border: 2px solid #007EA8;
    border-radius: 9px;
    margin-bottom: 10px; /* Add margin to separate buttons on smaller screens */
}

.browse-first{
  margin-top: -6px;
}

.unique-bot {
    color: #A23F97;
    border: 2px solid #A23F97;
}
  
  /* award section */
  .fortune-2{
    gap: 150px;
  }

  /* awareness */
  .upskill-2{
    background-color: #7D3075;
  }

  .picachu{
    color: #E9CDE9;
  }


  /* organizations */
  .close-call{
    color: #A23F97;
  }

.unique-indivi-nav-item:hover{
  color: #A23F97;

}
  
  .unique-indivi-buttons{
    padding-bottom: 70px;
  }