.main-container {
    width: 1200px;
    margin: 0 auto;
    padding: 5 20px;
    display: flex;
    flex-direction: column;
    gap: 20px; /* Space between sections */
    /*font-family: Arial, sans-serif;*/
}

article {
    min-width: 70%;
}

.section1{
    display: flex;
    align-items: flex-start;
    gap: 20px; /* Adjust spacing between elements */
}

.article1 {
    display: flex;
    align-items: flex-start;
    gap: 10px; /* Adjust spacing between elements */
    min-width: 70%;
    padding: 10px;
    border: 1px solid #ddd;
    margin-bottom: 5px;
    border-radius: 8px;
}

.sidebar1 {
  max-height:200px;
    overflow: hidden;
    border: 1px solid #ddd;
    margin-bottom: 5px;
    border-radius: 8px;
}

.section2{
    display: flex;
    align-items: flex-start;
    gap: 20px; /* Adjust spacing between elements */
}

.similar-events h3 {
    margin: 15px;
}

.similar-events {
    margin-bottom: 35px;
}

.article1 {
    min-width: 70%;
}




.event-details {
    flex: 2; /* Adjusts width dynamically */
}


.event-header {
    text-align: left;
    /* margin-bottom: 20px; */
    /* flex: 1; */
}


.event-title {
    font-size: 0.7rem;
    /*margin: 10px 0;*/
    /*visibility: hidden;*/
    /*display: none;*/
}

.title, .event-category {
    font-size: 0.1rem;
    /*visibility: hidden;*/
    /*display: none;*/
}



.event-thumbnail img {
    max-width: 70%;
    height: auto;
    border-radius: 20px;
    object-fit: cover;
    max-height: 150px; /* Limit the image height */
}

.event-details {
    padding: 15px;
    /* text-align: center;
    /* border-radius: 20px; */
    /* margin-bottom: 20px; */
    /* flex: 1; */
} */

.event-details p {
    /* margin: 5px 0;
    font-size: 1rem; */
}

.scroll-to-affiliates-btn {
    width: 150px;
    padding: 7px;
    background-color: #da8345;
}


.event-soldout {
    color: #ff0000;
    font-weight: bold;
}

.event-description {
    /* margin: 20px;
    line-height: 1.6; */
    /* font-size: 1rem;*/
} 

.event-affiliates {
    padding: 15px;
    border-radius: 8px;
    text-align: center;
}

.event-affiliates h3 {
    font-size: 1.5rem;
    margin-bottom: 10px;
}


.event-affiliates ul {
    list-style: none;
    padding: 0;
}

.event-affiliates li {
    margin: 5px 0;
}

.event-affiliates a {
    color: #0073aa;
    text-decoration: none;
    font-weight: bold;
}

.event-affiliates a:hover {
    text-decoration: underline;
}

.social-share-container,
.show-affiliates-btn {
    display: inline-block; /* Ensures both buttons are inline */
    margin: 5px; /* Adds some spacing between the buttons */
    vertical-align: middle; /* Aligns buttons vertically */
}

.event-actions {
    display: flex; /* Use flexbox for proper alignment */
    align-items: center; /* Centers the items vertically */
    gap: 10px; /* Adds spacing between items */
}

.event-faqs {
    display: none;
    margin:5px;
}



.content-area {
    display: flex;
    width:100%;
    gap: 20px;
}

.main-content {
    flex: 3;
}

.sidebar {
    flex: 1;
    /*background-color: #f9f9f9;*/
    padding: 20px;
    border: 1px solid #ddd;
}

/* Flex layout for .event-block to place .event-header and .event-details side by side */
.event-block {
    display: flex;
    flex-direction: column;
    gap: 20px;
    /*margin: 20px;*/
}



/* Adjustments for buttons and responsive design */
.affiliate-btn {
    display: inline-block;
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    color: #fff;
    font-size: 0.9rem;
    cursor: pointer;
    text-align: center;
    margin: 5px;
}

.affiliate-btn:hover {
    opacity: 0.9;
}

.show-affiliates-btn {
    background-color: #da8345;
    color: #fff;
    padding: 10px;
    border: none;
    border-radius: 20px;
    width: 200px;
    cursor: pointer;
}

/*.show-affiliates-btn:hover {*/
/*    background-color: #005a88;*/
/*}*/

/* Ensure affiliate list displays properly when toggled */
.affiliates-list {
    display: none;
}

.affiliates-list.visible {
    display: block;
    margin-top: 15px
}


@media (max-width: 768px) { 
    .sidebar, .sidebar1 {
        display: none;
    }


    .article1 { 
        min-width: 100%;
        flex-direction: column;
    } 

    .event-header {
    text-align: center;
       }

    .section1{
    justify-content: center;
    }
   

    .main-container {
    max-width: 400px;
}


}