/*
Theme Name: Replay Stix Child
Template: replay
Author: Stix Digital
*/

/*New CSS*/


.insta-icon {
    width: 24px;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 3px;
}

.bottom-box .pull-right .btn {
    border-color: #00bff9 !important;
    background: #00bff9 !important;
    border-radius: 0;
    font-weight: 700;
    color: #fff;
    font-size: 17px;
}

#fb-root.fb_reset .fb_iframe_widget span iframe[style] {
    max-width: 384px !important;
}

.social-links a.instagram {
    background: url(insta25.png) no-repeat !important;
    background-position: -204px 0;
}

.social-links a.instagram:hover {
    background-position: -102px -25px;
}

.container-fluid.stix {

    max-width: 1319px;
    margin: 0 auto;

}

#mc_embed_signup{
    background: none!important;
    width: 100%!important;
}
#mc_embed_signup #mc-embedded-subscribe-form{
    display: flex;
    justify-content: center;
    width: 100%!important;
}
#mc_embed_signup_scroll,#mc_embed_signup_scroll .mc-field-group input  {
    width: 100%!important;
}

.cta_widget {
    position: relative;
}

.column.release-event_sidebar {
    margin-right: 0;
    margin-left: 20px;
}

.cta_widget img {
    width: 100%;
    height: auto;
}

@media all and (max-width: 767px) {
    .column.release-event_sidebar {
        margin-left: 0;
    }
}

/** Release Event template **/
.page-template-template-event .content.wrapper {
    padding-top: 0;
}

.page-template-template-event .content .container {
    width: 100%;
    box-sizing: border-box;
    padding: 0;
}

.event-landing {
    max-width: 780px;
    margin: 0 auto;
    background: #fff;
}

.landing-header {
    background: #46fa96;
}

.landing-header .header-content {
    padding: 50px 40px;
    font-size: 16px;
    line-height: 1.4em;
    border-bottom: 5px solid #000;
}

.page-template-template-event .page-title,
.landing-header #socialButtonOnPage {
    display: none;
}

.landing-content {
    padding: 50px 20px 0 20px;
}

.landing-content .block {
    display: flex;
    flex-direction: column;
}


.landing-content .block .image img {
    width: 100%;
    border-bottom: 5px solid #46fa96;
}

.landing-content h3 {
    font-weight: 900;
    font-size: 26px;
    margin-top: 0;
}

.landing-content .cta1 {
    color: #000;
    background: #46fa96;
    font-weight: 900;
    font-family: Open Sans Condensed, Arial, Helvetica, sans-serif;
    padding: 10px;
    border-bottom: 3px solid #000;
    display: inline-block;
}

.landing-content .cta2 {
    background: #000;
    padding: 10px;
    color: #fff;
    border-bottom: 3px solid #aaa;
    font-weight: 900;
    font-family: Open Sans Condensed, Arial, Helvetica, sans-serif;
    margin-left: 10px;
    display: inline-block;
}

.landing-content .cta1:hover,
.landing-content .cta2:hover {
    opacity: 0.8;
}

.landing-footer {
    padding: 0 20px 20px 20px;
    font-size: 14px;
    line-height: 1.4em;
}

.custom_event_image {
    width: 100%;
    height: auto;
}

.small-padding-bottom {
    padding-bottom: 10px !important;
}

.footer-logo {
    width: 100%;
    text-align: center;
    display: block;
    margin-bottom: 20px;
}

.footer-logo img {
    max-width: 100px;
}

@media all and (min-width: 640px) {
    .landing-content .block {
        flex-direction: row;
        margin-bottom: 20px;

    }

    .landing-content .block .image {
        width: 50%;
        padding-right: 20px;
    }

    .landing-content .block .content {
        width: 50%;
        padding: 0;

    }

    .landing-content .block:nth-child(even) .image {
        order: 2;
    }

    .landing-content .block:nth-child(even) .content {
        padding-right: 20px;
        text-align: right;
    }

    .landing-content .block:nth-child(even) h3 {
        text-align: right;
    }

    .landing-footer {
        padding: 40px 40px 40px 20px;
    }
}
.stix-container
{
	padding:0;
	max-width:996px;
	margin:0 auto;
}
.stix-container .survey-con{
	height:auto;
}
.stix-container .survey-con > p div{
	width:100%!important;
	max-width:100%!important;
	overflow:hidden!important;
}
.stix-container .survey-con iframe{
	overflow:hidden!important;
}
.stix-full-width{
	width:100%!important;
}
@media only screen and (max-width: 764px) {
	.stix-container{
		padding:0 10px;
	}
}
@media only screen and (max-width: 564px) {
	.stix-container{
        padding:0;
    }
}
.tickets-banner-header{
    display:inline-block;
    width:100%;
    margin: 0 0 1em 0;
}
.tickets-banner-header  img{
    margin:0;
    padding:0;
    width:100%;
    min-width:100%;
    max-width:100%;
    height:auto;
}
.tickets-banner-header > a{
    display:block;
    margin:0;
    padding:0;
}
.tickets-en-body-style{
    font-size:14px;
    text-align:center;
}
.tickets-en-body-style iframe{
    width:100%;
    margin:0 auto;
}

/* General styles for third layout */
.third-layout-content {
    display: flex;
    gap: 20px;
    margin-bottom: 40px;
}

/* Text Left, Image Right */
.third-layout-content.text_left_image_right {
    flex-direction: row;
}

/* Image Left, Text Right */
.third-layout-content.image_left_text_right {
    flex-direction: row-reverse;
}

/* Styling for text and image blocks */
.third-layout-text {
    flex: 1;
    padding: 10px;
}

/* Image container styles */
.third-layout-image {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Image styling */
.third-layout-image img {
    max-width: 100%; /* Ensure images fit within their container */
    height: auto; /* Maintain natural proportions */
}

/* Full-Width Layout Styles */
.third-layout-content.full-width-layout {
    flex-direction: column; /* Ensure a vertical stack */
    align-items: center;    /* Center the content */
    text-align: center;     /* Center align text */
    width: 100%;            /* Span full width */
    padding: 20px;          /* Add some spacing */
}

/* Full-width layout for text, images, or videos */
.third-layout-full {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center; /* Center content vertically */
    text-align: center;
    width: 100%; /* Make sure it spans the full width */
    height: 100vh; /* Full viewport height */
    padding: 0; /* Remove unnecessary padding */
    margin: 0; /* Remove unnecessary margins */
}

/* Media container styles for full width and height */
.third-layout-media {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

.third-layout-media iframe {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Responsive Styles */
@media (max-width: 1024px) {
    /* Reduce padding for medium screens */
    .third-layout-content.full-width-layout,
    .third-layout-full {
        height: auto; /* Allow height to adjust to content on smaller screens */
        padding: 15px;
    }

    .third-layout-text {
        padding: 8px;
    }
}

@media (max-width: 768px) {
    /* Stack text and image vertically for smaller screens */
    .third-layout-content {
        flex-direction: column;
    }

    .third-layout-text,
    .third-layout-image {
        width: 100%; /* Full width for individual elements */
        padding: 10px;
    }

    .third-layout-image {
        margin-bottom: 15px; /* Add space between stacked elements */
    }

    .third-layout-full {
        height: auto; /* Adjust height to content for smaller screens */
    }
}

@media (max-width: 480px) {
    /* Adjust text size and padding for very small screens */
    .third-layout-text {
        font-size: 14px; /* Reduce text size */
        padding: 5px;
    }

    .third-layout-content.full-width-layout,
    .third-layout-full {
        padding: 10px;
        height: auto; /* Adjust height to content for smaller screens */
    }

    .third-layout-image img {
        max-width: 100%;
        height: auto;
    }
}

/* Responsive adjustments for mobile */
@media (max-width: 768px) {
    .button.viva-button {
        font-size: 12px; /* Adjust font size */
        padding: 10px 14px; /* Ensure sufficient spacing */
        width: 100%; /* Make the button take the full width of its container */
        max-width: 100%; /* Prevent the button from exceeding its container */
        text-align: center; /* Center the text */
        box-sizing: border-box; /* Prevent padding from affecting width */
        word-wrap: break-word; /* Break long text into multiple lines */
        white-space: normal; /* Allow text wrapping for long titles */
        line-height: 1.5; /* Add spacing between lines of text */
    }
	
	.viva-button span {
		line-height:1.5em;
		
	}
}