:root {
    --main-menu-computed-height: 120px;
    --main-menu-min-width: 900px;
    --drawer-menu-width: 150px;
    --drawer-menu-min-height: 400px;
    --landscape-ticket-width: 820px;
    --portrait-ticket-width: 340px;
    --payment-container-width: 360px;
}

/*@media (orientation: landscape)*/
/* when viewport width is less then 900px footer element is overflowing from rest of the page*/
/*viewport width greater then 900px*/
@media only screen and (min-width : 900px) {
    #header {
        padding: 10px 40px;
        
    }

    #landscape_menu {
        display: block;
    }

    #portrait_menu {
        display: none;
    }

    .flex-direction-01 {
        flex-direction: row;
    }

    .flex-direction-02 {
        flex-direction: row;
    }

    [data-role=footer-content] {
        padding: 0 3% 5% 3%;
    }

    [data-role=newsletter-container] {
        width: 400px;
    }

    [data-role=footer-middle-area] {
        margin: 0 20px;
        
    }

    .portrait-ticket-overlay {
        display: none;
    }

    .challenge {
        bottom: 20px;
        left: 20px;
    }

    .circle {        
        padding: 30px;        
    }

    .challenge span {        
        font-size: 20px;        
    }

    .challenge-form button {        
        font-size: 18px;        
    }

    .challenge-btn, .embed-challenge-btn {
        font-size: 18px;
    }
}

/*@media (orientation: portrait)*/
/*viewport width smaller then 900px*/
@media only screen and (max-width : 900px) {
    #header {
        padding: 10px 20px;       
    }

    #landscape_menu {
        display: none;
    }

    #portrait_menu {
        display: block;
    }

    .flex-direction-01 {
        flex-direction: column;
    }

    .flex-direction-02 {
        flex-direction: column-reverse;
    }

    [data-role=footer-content] {
        padding: 0 5% 5% 5%;
    }

    [data-role=newsletter-container] {
        width: auto;
    }

    [data-role=footer-middle-area] {
        margin: 20px 0;        
    }

    .portrait-ticket-overlay {
        display: block;
    }

    .challenge {
        bottom: 10px;
        left: 10px;
    }

    .circle {
        padding: 25px;
    }

    .challenge span {
        font-size: 18px;
    }

    .challenge-form button {
        font-size: 16px;
    }

    .challenge-btn, .embed-challenge-btn {
        font-size: 16px;
    }
}

/*****************************************/
/********** element level style **********/
/*****************************************/

/*html, body {
    width: 100%;
    margin: 0;
}*/

textarea:focus, input:focus, button:focus {
    outline: none;
}

input[type="text"]::placeholder, input[type="tel"]::placeholder, input[type="email"]::placeholder {
    text-align: right;
}

/*******************************************************/
/********** measurement and color definitions **********/
/*******************************************************/

.text-white {
    color: white;
}

.text-green-007F0E {
    color: #007F0E;
}

.text-red-EB5457 {
    color: #EB5457;
}

.background-black {
    background-color: black;
}

.background-red-EB5457 {
    background-color: #EB5457;
}

.background-orange-FBCC62 {
    background-color: #FBCC62;
}

.background-green-007F0E {
    background-color: #007F0E;
}

.background-green-E0EECA {
    background-color: #E0EECA;
}

.background-green-E8F3D8 {
    background-color: #E8F3D8;
}

.background-green-04AA6D {
    background-color: #04AA6D;
}

.background-lightgray {
    background-color: lightgray;
}

.weight-bold {
    font-weight: bold;
}

.weight-500 {
    font-weight: 500;
}

.text-size-1d5rem {
    font-size: 1.5rem;
}

.width-100 {
    width: 100%;
}

.width-50 {
    width: 50%;
}

.width-auto {
    width: auto;
}

.height-100{
    height:100%;
}

.h1-title {
    
    /*font-size: 2em;*/
    font-size:40px;
    font-weight: bold;
}

.h2-title {
    font-size: 32px;
    font-weight: bold;
}

.h3-title {
    
    font-size: 28px;
    font-weight: bold;
}

.h4-title {
    font-size: 24px;
    font-weight:500;
}

.h5-title {
    font-size: 20px;
    font-weight: bold;
}

.vertical-margin-20{
    margin:20px 0;
}

/*************************************/
/********** general display **********/
/*************************************/

.no-padding {
    padding: 0;
}

.no-margin {
    margin: 0;
}

.no-border {
    border: none;
}

.no-shadow {
    box-shadow: none;
}

.no-decoration {
    text-decoration: none;
}

.margin-overlap{
    margin:-1px;
}

.absolute-bottom-overlap{
    bottom:-2px;
}

.fade-in-top {
    transform: translateY(-100px);
    opacity: 0;
    transition: 1s all ease;
}

.fade-in-top.active {
    transform: translateY(0);
    opacity: 1;
}

.fade-in-bottom {
    position: relative;
    transform: translateY(100px);
    opacity: 0;
    transition: 1s all ease;
}

.fade-in-bottom.active {
    transform: translateY(0);
    opacity: 1;
}

.center-absolute-X {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.center-absolute-Y {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.center-absolute {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.box-main-axis-center {
    /*display: flex;*/
    justify-content: center;
}

.box-cross-axis-center {
    /*display: flex;*/
    align-items: center;
}

.box-all-axis-center {
    /*display: flex;*/
    align-items: center;
    justify-content: center;
}

.box-cross-axis-start {
    /*display: flex;*/
    align-items: start;
}

.box-cross-axis-stretch {
    /*display: flex;*/
    align-items: stretch;
}

.center-margin {
    margin: 0 auto;
}

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

.right-text {
    text-align: right;
}

.left-text {
    text-align: left;
}

.flip-horizontal {
    transform: scaleX(-1);
}

.flip-vertical {
    transform: scaleY(-1);
}

.pointer {
    cursor: pointer;
}

.relative {
    position: relative;
}

.absolute {
    position: absolute;
}

.fixed{
    position:fixed;
}

.stick-bottom{
    bottom:0;
}

.hide {
    display: none;
    /*display: none !important;*/
}

.non-visible{
    visibility:hidden;
}

.visible {
    visibility: visible;
}

.block{
    display:block;
}

.inline-block {
    display: inline-block;
}

.flex-box{
    display:flex;
}

.column-flex-box {
    display: flex;
    flex-direction: column;
}

.flex-direction-column {    
    flex-direction: column;
}

.flex-item-grow {
    flex-grow: 1;
}

.flex-item-shrink {
    flex-grow: 0;
}

.item-cross-axis-center {
    align-self: center;
}

.item-cross-axis-top {
    align-self: start;
}

/*::placeholder {
    opacity: 0.3 !important;
    color: white !important;
}*/

.preserve-sentence {
    white-space: nowrap;
}

.align-top{
    vertical-align:top;
}

.full-grid-row {
    grid-column: 1 / -1;
}

.fit-content{
    width:fit-content;
}

.hide-overflow{
    overflow:hidden;
}

.auto-overflow {
    overflow: auto;
}

.blending-mode {
    /*mix-blend-mode: color-burn;*/
    /*mix-blend-mode:luminosity;*/
    /*mix-blend-mode: difference;*/
    
    
}

/*******************************/
/********** bootstrap **********/
/*******************************/

/*.form-control {
    border: none;
}*/

[data-role=quantity-container] input-group-btn,
[data-role=quantity-container] [data-input=quantity] {
    margin-left: 0 !important;
}

/******************************************/
/********** page global elements **********/
/******************************************/

.shape-divider {
    width: calc(100% + 1.3px);
    height: 130px;
    margin: -1px;
}

/*.inner-custom-shape-divider-bottom {
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    overflow: hidden;
    line-height: 0;
    z-index: 10;
}

.outer-custom-shape-divider {
    position: relative;
    overflow: hidden;
    line-height: 0;    
}

[data-role=top-shape-divider].outer-custom-shape-divider {
    top: -1px;
}

[data-role=bottom-shape-divider].outer-custom-shape-divider {
    bottom: -1px;
}*/

/*.outer-custom-shape-divider-top {
    position:relative;
    overflow: hidden;
    line-height: 0;
    top:-1px;
}

.outer-custom-shape-divider-bottom {
    position: relative;
    overflow: hidden;
    line-height: 0;
    bottom: -1px;
}*/

/*.outer-custom-shape-divider-bottom svg {
    position: relative;
    display: block;
    width: calc(100% + 1.3px);
    height: 150px;
}*/

/*.outer-custom-shape-divider svg, .inner-custom-shape-divider-bottom svg {
    position: relative;
    display: block;
    width: calc(100% + 1.3px);
    height: 130px;
}*/

/*.btn-buy-tickets {
    background-color: #EB5457;
    border-radius: 0 50rem 50rem 0;
    left: 0;
    bottom: 70px;
    color: white;
    padding: 0 80px;

    z-index: 998;
}*/

.anchor-point {
    position: relative;
    bottom: var(--main-menu-computed-height);
}

.elliptical-background {
    background-color: #E0EECA;
    padding: 100px 0;
    border-bottom-left-radius: 100% 70%;
    border-bottom-right-radius: 100% 70%;
}

.message-page-header {
    /*color: white;*/
    color: #007F0E;
    font-weight:bold;
    text-align: center;
}

.message-page-content {
    color: green;
    margin-bottom: 70px;
}

/*.portrait-ticket-overlay {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    position: fixed;
    left: 45px;
    bottom: 235px;
    padding: 10px 20px;
    text-decoration: none;
    z-index: 12;
}*/

.portrait-ticket-overlay {
    font-size: 20px;
    font-weight: bold;
    text-align: center;    
    padding: 10px 20px;
    text-decoration: none;
    z-index: 12;
}

.green-button {
    background-color: #007F0E;
    color: white;
    width: fit-content;
}

.block-layer {
    display: none;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.7);
    /*overflow: auto hidden;*/
    overflow: auto;
    border-radius: 0.5rem;
}

.challenge {
    display:flex;    
    flex-direction:column;
    align-items:center;
    position: fixed;    
    z-index: 11;
}

.leaf-rapper {
    display: flex;
    justify-content: center;
    transform: scale(-1, -1);
    margin:10px 0 5px 0;
}

.left-leaf {
    width: 70px;
    height: 20px;
    border-radius: 0 100px;
    background-color: #4CA556;
}

.right-leaf {
    width: 70px;
    height: 20px;
    border-radius: 100px 0;
    background-color: #4CA556;
}

.circle {
    position:relative;
    border-radius: 50%;    
    background-color: #EF7679;
    display: flex;
    align-items: center;
    justify-content: center;
    /*padding: 30px;*/
    aspect-ratio: 1 / 1;
    flex-direction: column;
}

.challenge span {
    text-align: center;
    /*font-size: 20px;*/
    font-weight: bold;    
    color: #FFFDAF;
    margin-bottom: 5px;
}

.challenge-form button {
    background-color: #FFFDAF;
    padding: 5px 10px;
    border-radius: 2rem;
    color: #EF7679;
    /*font-size: 18px;*/
    font-weight: bold;
}

    .challenge-form button:active:focus {
        background-color: rgba(255, 253, 175, .7) !important;
        
    }

.challenge-btn, .embed-challenge-btn {
    background-color: #FFFDAF;
    padding: 5px 10px;
    border-radius: 2rem;
    color: #EF7679;
    /*font-size: 18px;*/
    font-weight: bold;
}

    .challenge-btn:active:focus, .embed-challenge-btn:active:focus {
        background-color: rgba(255, 253, 175, .7) !important;
    }

.challenge-block-layer {    
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.7);    
    overflow: auto;
    border-radius: 50%;
}

.challenge-block-layer label {
    color:white;
    font-size:20px;
    font-weight:bold;
}

/*******************************/
/********** main menu **********/
/*******************************/
#header {
    background: linear-gradient(180deg,rgba(0,0,0,.7) 0,rgba(231,56,39,0));
    display: flex;
    flex-direction: row;
    z-index: 998;
    align-items: center;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
}

#header.scrolled {
    background: white !important;
    border-bottom: 1px solid rgba(80,80,80,.1);
    transition: background 200ms linear;
}

#header ul {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    justify-content: space-between;
    width: 100%;
}

#header a {
    white-space: nowrap;
    text-align: center;
    color: white;
}

.portrait-menu-icon.scrolled, #header .nav-link:not([data-role=btn-tickets-overlay]).scrolled {
    color: #EB5457;
}

#header a:hover {
    color: #E0EECA;
}

#landscape_menu {
    padding-right: 30px;
}

.portrait-menu-icon {
    color: white;
}

#logo {
    width: 200px;
}

/*, .nav-link > li > a:focus*/
/*a.nav-link:hover {
    color: #E0EECA;
}*/

/*.ticket-link {
    background-color: #EB5457;
    border-radius: 50px;
    color: white;
    
}*/

/*.rounded-pill-button {
    background-color: #EB5457;
    border-radius: 50px;
    color: white;
}*/

[data-role=btn-tickets-overlay] {
    background-color: #EB5457;
    border-radius: 50px;
    color: white;
}

    [data-role=btn-tickets-overlay]:hover {
        color: #E8F3D8;
    }

/*********************************/
/********** drawer menu **********/
/*********************************/

.drawer-menu {
    -webkit-overflow-scrolling: touch;
    background-color: white;
    /*background-color: rgba(240,240,240,.9);*/
    overflow-x: hidden;
    /*overflow-y: auto;*/
    overflow-y: hidden;
    position: fixed;
    /*position:sticky;*/
    left: calc(var(--drawer-menu-width) * -1);
    top: 10px;
    bottom: 10px;
    width: var(--drawer-menu-width);
    z-index: 1040;
    border-radius: 0 0.5rem 0.5rem 0;
    padding-right: 1rem;
    min-height: var(--drawer-menu-min-height);
}

.drawer-menu a:hover {
    color: #E0EECA;
}

.show-drawer-menu {
    transform: translateX(var(--drawer-menu-width));
    transition: transform .2s;
}

.hide-drawer-menu {
    transform: translateX(0);
    transition: transform .2s;
}

.drawer-menu [data-role=close-icon] {
    padding: 1rem 0;
}

.drawer-menu [data-role=close-icon] i {
    color: #EB5457;
}

.drawer-menu ul {
    display: flex;
    flex-direction: column;
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
}

/*.drawer-menu .nav-link:not([data-role=btn-tickets-overlay]) {
    color: #EB5457 !important;
    padding: 0;
}*/

/*.drawer-menu [data-role=btn-tickets-overlay] {
    bottom:20px;
    
}*/

.drawer-menu .nav-link {
    /*color: #EB5457 !important;*/
    color: #EB5457;
    padding: 0;
}

.drawer-menu svg {
    margin-bottom: 10px;
}

/****************************/
/********** footer **********/
/****************************/

#footer {
    /*light green: #E0EECA*/
    /*dark green: #007F0E*/
    /*dark orange: #FBCC62*/
    /*light orange: #FFE5B4*/


    /*background-color: #FBCC62;*/
    /*background-color: #FBE4A7;*/
    background-color: #FCEFC5;
    
}

#frm_newsletter_registration {
    margin-top: 10px;
}

/*[data-role=btn-newsletter-container] {
    margin-bottom: 10px;
}

[data-role=btn-newsletter-container] button {
    border-radius: 0.3rem 0 0 0.3rem;
}*/

[data-role=btn-submit-newsletter] {
    border-radius: 0.3rem 0 0 0.3rem;
    margin-bottom: 10px;
}

#inpt_txt_newsletter_mail {
    border-radius: 0 0.3rem 0.3rem 0;
    
}

[data-role=tbl-contact-info] tr td:last-child {
    padding-right: 10px;
}

[data-role=link-map-container] {
    padding-right: 30px;
}

[data-role=link-map-container] {
    display: flex;
    flex-direction: column;
    /*color: #EB5457;*/
    /*color: white;*/
    /*text-align:right;*/
}

[data-role=link-map-container] a {
    text-decoration: none;
    /*color: #EB5457;*/
    color: #007F0E;
}

/*.follow-us-title {
    margin-top: 20px;
}*/

.contact-media-icon {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 30px;
    border-radius: 15px;
}

.fb-icon {
    background-color: #3b5998;
}

.instagram-icon {
    background-color: #921313;
}

.waze-icon {
    background-color: #31CDFE;
}

.whatsapp-icon {
    background-color: #32D851;
}

.credits {
    background-color: #007F0E;
    color: white;
    text-align: center;
    font-weight: bold;
    padding: 10px 0;
}

#footer a:hover {
    color: #EB5457;
}

/*[data-role=footer-content] {
    font-weight:bold;
    font-size:19px;
}*/

/*.form-control {
    box-shadow: none !important;
}*/

/*.fixed-top {
    z-index: 990;
}*/

/*#btnShowDrawerMenu, #btnHideDrawerMenu {
    display: none;
}

    #btnShowDrawerMenu:checked + label > i {
        transform: translateX(var(--drawer-width));
        transition: transform .2s;
    }

.drawer-menu #btnHideDrawerMenu:checked {
    transform: translateX(0);
    transition: transform .2s;
}*/

/*.hide-overflow {
    overflow: hidden;
}

.show-overflow {
    overflow: hidden;
}*/