@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700&family=Poppins:wght@400;500;600;700&display=swap");
/* fonts import */
@import url("../fonts/octin_sports_rg.ttf");
body {
  font-family: "Poppins", sans-serif;
  color: #0c0c0c;
  background-color: black;
  overflow-x: hidden;
}







/* Download Our App Text */
.download_app_text {
  text-align: center;
  margin-top: 20px;
}

.download_app_text h4 {
  font-size: 20px;
  color: #ffffff;
  margin-bottom: 20px;
}

/* General Styling for App Links */
.app_links {
  display: flex;
  justify-content: center; /* Centers items horizontally */
  align-items: center; /* Aligns items vertically */
  gap: 20px; /* Equal spacing between images */
  margin: 20px 0;
  flex-wrap: wrap; /* Allows wrapping in smaller screens */
}

/* App Store Images */
.app_links a img {
  max-width: 100px; /* Adjusts image size */
  height: auto; /* Maintains aspect ratio */
  transition: transform 0.3s ease; /* Hover effect */
}

.app_links a img:hover {
  transform: scale(1.1); /* Slight zoom effect on hover */
}

/* Responsive Styling for Mobile View */
@media (max-width: 768px) {
  .app_links {
      gap: 0px; /* Reduces gap for smaller screens */
  }
  .app_links a img {
      max-width: 80px; /* Smaller size for images in mobile view */
  }
}


/* Social media icons styling */
.social_box {
  display: flex;
  justify-content: center;
  gap: 15px;
  margin-top: 20px;
}

.social_box i {
  font-size: 24px;
  color: #333;
  transition: color 0.3s ease;
}

.social_box i:hover {
  color: #007bff;
}

/* For More Section Styling */
.for_more_section {
  text-align: center;
  margin-top: 30px;
}

.for_more_section h5 {
  font-size: 18px;
  color: #333;
  margin-bottom: 10px;
}

.for_more_section .info_links_menu a {
  display: inline-block;
  margin: 5px 15px;
  text-decoration: none;
  color: #333;
}

.for_more_section .info_links_menu a:hover {
  color: #007bff;
}

/* Responsive Styling */
@media (max-width: 768px) {
  .download_app_text h4 {
      font-size: 18px;
  }

  .app_links {
      flex-direction: column;
      align-items: center;
  }

  .social_box {
      flex-direction: column;
  }

  .for_more_section .info_links_menu a {
      display: block;
      margin: 5px 0;
  }
}


/* For More Section Styling */
.social_box {
  text-align: center;
  margin-top: 30px;
}

.social_box h5 {
  font-size: 18px;
  color: #333;
  margin-bottom: 15px;
}

.social_icons {
  display: flex;
  justify-content: center;
  gap: 15px;
}

.social_icons a {
  font-size: 24px;
  color: #333;
  transition: color 0.3s ease;
}

.social_icons a:hover {
  color: #007bff;
}

/* Responsive Styling */
@media (max-width: 768px) {
  .social_icons {
      flex-direction: column;
      align-items: center;
  }
}


/* Social Box Styling */
.social_box {
  text-align: center;
  margin: 20px 0;
}

/* Title Above Social Icons */
.social_title {
  font-size: 18px;
  color: #ffffff;
  font-weight: 600;
  margin-bottom: 15px;
  text-transform: uppercase;
}

/* Social Icons Container */
.social_icons {
  display: flex;
  justify-content: center;
  gap: 20px;
}

/* Social Icons Links */
.social_icons a {
  font-size: 24px;
  color: antiquewhite;
  text-decoration: none;
  transition: color 0.3s ease;
}

.social_icons a:hover {
  color: #007bff; /* Change to your desired hover color */
}

/* Responsive Styling for Social Icons */
@media (max-width: 768px) {
  .social_icons {
      flex-direction: row; /* Keeps icons in a row for small screens */
      gap: 15px;
  }
}


/* Footer Logo Styling */
.footer_logo {
  display: flex;
  justify-content: center; /* Horizontally centers the content */
  align-items: center; /* Vertically centers the content */
  margin: 20px 0; /* Adds some vertical spacing */
  text-align: center; /* Ensures text alignment if needed */
}

/* Footer Logo Image */
.footer_logo img {
  max-width: 150px; /* Adjust the size of the logo as needed */
  height: auto; /* Maintains aspect ratio */
}


body, html {
    margin: 0;
    padding: 0;
}

.container {
    margin-bottom: 0;
    padding-bottom: 0;
}


section.info_section.layout_padding2 {
  background: black;
}


/* General section styling */
.info_section {
  padding: 80px 20px; /* Add larger padding for a more spacious layout */
  text-align: center; /* Center-align all elements */
  background-color: #f9f9f9; /* Optional: Light background for better visibility */
}

/* Footer logo adjustments */
.footer_logo img {
  max-width: 280px;
  margin: 0 auto 30px;
}

/* Download app text */

  .download_app_text h4 {
    font-size: 3rem;
    font-weight: 500;
    margin-bottom: 30px;
    color: #ffffff;
}

/* App store links */
.app_links {
  display: flex;
  justify-content: center; /* Center the links */
  gap: 30px; /* Add equal spacing between icons */
  margin-bottom: 40px; /* Add spacing below the app links */
}

.app_links a img {
  max-width: 140px; /* Larger app store icons */
  height: auto; /* Maintain aspect ratio */
  transition: transform 0.3s ease; /* Add hover effect */
}

.app_links a img:hover {
  transform: scale(1.1); /* Slightly enlarge on hover */
}

/* Social title */
.social_box .social_title {
  font-size: 2.8rem;
  font-weight: 500;
  margin-bottom: 20px;
  color: #ffffff;
}

/* Social icons */
.social_icons {
  display: flex;
  justify-content: center; /* Center the icons */
  gap: 20px; /* Add spacing between icons */
}

.social_icons a {
  font-size: 2rem; /* Larger icon size */
  color: #ffffff; /* Default icon color */
  transition: color 0.3s ease, transform 0.3s ease; /* Add hover effects */
}

.social_icons a:hover {
  color: #007bff; /* Change color on hover */
  transform: scale(1.2); /* Slightly enlarge on hover */
}

/* Responsive adjustments for smaller screens */
@media (max-width: 768px) {
  .info_section {
    padding: 60px 15px; /* Adjust padding for smaller screens */
  }

  .footer_logo img {
    max-width: 280px; /* Reduce logo size */
  }

  .download_app_text h4 {
    font-size: 2.5rem; /* Adjust font size */
  }

  .app_links a img {
    max-width: 120px; /* Smaller app icons */
  }

  .social_box .social_title {
    font-size: 2.5rem; /* Adjust title size */
  }

  .social_icons a {
    font-size: 1.8rem; /* Adjust icon size */
  }
}


/* App store links */
.app_links {
  display: flex;
  justify-content: center; /* Center the links */
  gap: 30px; /* Add equal spacing between icons */
  margin-bottom: 40px; /* Add spacing below the app links */
}

.app_links a img {
  max-width: 250px; /* Increase the width of the app store icons */
  height: auto; /* Maintain the aspect ratio of the icons */
  transition: transform 0.3s ease; /* Add hover effect */
}

.app_links a img:hover {
  transform: scale(1.1); /* Slightly enlarge on hover */
}