.main_menu {
  z-index: 99999 !important;
}

.wpcf7 {
    width: 100%;
    display: flex;
    justify-content: left;
}

.wpcf7 form {
    width: auto; /* Adjust this width as needed */
}

body {
    overflow-x: hidden;
    margin: 0;
    padding: 0;
}

img {
    max-width: 100%;
    height: auto;
}

.blog-posts-container {
    width: 80%; /* Ensures the container takes 80% of its parent width */
    max-width: 1200px; /* Adjust this value to fit your design needs */
    margin: 0 auto; /* Centers the container horizontally */
    padding: 20px; /* Adds padding inside the container */
    box-sizing: border-box; /* Includes padding in the width calculation */
}

.blog-post {
    margin-bottom: 40px; /* Adds space between posts */
    /* additional styling for individual posts can go here */
}

.collapsible, .nested-collapsible {
  background-color: transparent; /* Ensures no background color at all times */
  color: #e60100; /* Red text color always */
  font-weight: bold; /* Make text bold */
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid #ccc; /* Subtle separation line */
}

.collapsible:hover, .collapsible.active,
.nested-collapsible:hover, .nested-collapsible.active {
  background-color: transparent; /* Remains transparent on hover and active */
  color: #e60100; /* Keep red color even when active or hovered */
  border-color: #e60100; /* Border color to indicate active/hover state */
}

.content, .nested-content {
  padding: 0 18px;
  display: block; /* Always display content */
  overflow: hidden;
  background-color: transparent; /* Content background is also transparent */
}

.triangle {
  border-style: solid;
  border-width: 5px 0 5px 10px;
  border-color: transparent transparent transparent #e60100; /* Initial triangle color */
  margin-right: 10px;
  transition: transform 0.2s, border-color 0.2s; /* Smooth transition for transformations */
}

.collapsible.active .triangle, .nested-collapsible.active .triangle {
  border-color: transparent transparent transparent #6B6B6B; /* Triangle color when active */
  transform: rotate(90deg); /* Rotate triangle to point downwards */
}

/* Styling for list item markers to ensure bullet points are red */
.nested-content li::marker {
    color: #e60100; /* Red bullet points */
}

/* Styling for list item text to keep it gray */
.nested-content li {
    color: #777; /* Keep text gray */
}

/* Increased indentation for bullet points */
.nested-content ul, .nested-content li {
  margin-left: 60px;
}

/* Consistent indentation for paragraphs */
.nested-content p {
  padding-left: 40px;
}

#mobile-menu-toggle { display: none; }

/* Ensure the title is centered on small screens */
@media only screen and (max-width: 600px) {
    #top #wrap_all .all_colors h3.av-magazine-title {
        font-size: 18px;
        text-align: center; /* Center-align the text */
        padding-left: 10%; /* Add padding to prevent the text from touching the edges */
        padding-right: 10%; /* Add padding to prevent the text from touching the edges */
    }

    .blog-posts-container {
        width: 80%; /* Ensures the container takes 80% of the viewport width */
        margin: 0 auto; /* Centers the container horizontally */
        padding-left: 10%; /* Ensures padding on the left side */
        padding-right: 10%; /* Ensures padding on the right side */
        box-sizing: border-box; /* Includes padding in the width calculation */
    }

    /* Adjustments for mobile devices */
    .nested-content ul, .nested-content li {
        margin-left: 0; /* Remove indentation for bullet points */
        padding-left: 0; /* Remove padding for bullet points */
    }

    .nested-content p {
        padding-left: 0; /* Remove padding for paragraphs */
    }

    .collapsible, .nested-collapsible {
        padding: 15px; /* Adjust padding for mobile devices */
        width: 100%; /* Ensure full width */
        margin-left: 0; /* Remove left margin */
    }

    .content, .nested-content {
        padding: 0 15px; /* Adjust padding for mobile devices */
    }
}

/* Hide the default WordPress mobile menu icon */
#mobile-menu-toggle,
.mobile-menu-toggle,
#nav-toggle,
.menu-toggle,
#masthead .menu-toggle,
#main-navigation .menu-toggle,
.site-header .menu-toggle,
.header-main .menu-toggle,
#primary-menu-toggle,
.menu-toggle-button,
.mobile-menu-button,
.hamburger-menu,
.mobile-menu-icon {
    display: none !important; /* Hide the element */
    visibility: hidden !important; /* Hide visibility */
    opacity: 0 !important; /* Make it fully transparent */
}

/* Hide the specific mobile menu icon */
.site-navigation-toggle {
    display: none !important; /* Hide the element */
    visibility: hidden !important; /* Hide visibility */
    opacity: 0 !important; /* Make it fully transparent */
}
