/* OVERRIDES */

#zonefestival-root {
    width: calc(100vw - 240px);
}

@media (max-width: 921px) {
    #zonefestival-root {
        width: 90% !important;
    }
}

#zonefestival-root .App,
#zonefestival-root input[type='text'].search.form-control {
    /* Override Roboto Condensed here
      Roboto Condensed is use to fit more words into small space */
    font-family: "Nunito Sans", sans-serif;
}

#zonefestival-root .SchedulePage .left-date-menu form label,
#zonefestival-root .ProgramOeuvres .program-detail-title,
#zonefestival-root .ProgramOeuvres .program-group-meta,
#zonefestival-root .Ticket a,
#zonefestival-root .ProgramHeader,

#zonefestival-root .Detail .title {
    /* Override Roboto here
      Roboto is use when there is more space available */
    font-family: 'Bebas Neue', sans-serif;
    color: #FFFFFF !important;
}

#zonefestival-root .OeuvreList .title span,
#zonefestival-root .OeuvreList .synopsis,
#zonefestival-root .OeuvreSchedule .venue {
    color: white !important;
}

#zonefestival-root .ProgramOeuvres .program-detail-description,
#zonefestival-root .ProgramOeuvres .title,
#zonefestival-root .ProgramOeuvres .bodyContainer,

#zonefestival-root .Detail .Meta,
#zonefestival-root .Detail .synopsis,
#zonefestival-root .ProgramOeuvres a {
    color: #FFFFFF !important;
    font-family: "Nunito Sans", sans-serif;
}

#zonefestival-root .ProgramOeuvres a:hover .title,
#zonefestival-root .ProgramOeuvres a:hover .bodyContainer,
#zonefestival-root .ProgramOeuvres a:hover .program-detail-description,

#zonefestival-root .App .Casts .group-name,
#zonefestival-root .ProgramOeuvres a:hover {
    color: #000000 !important;
    font-family: "Nunito Sans", sans-serif;
}

/* #zonefestival-root .navbar-default,
#zonefestival-root .navbar-collapse, */
#zonefestival-root .navbar {
    background-color: inherit !important;
    border: 0 !important;
    padding: 0 !important;

}

#zonefestival-root .navbar-collapse.collapse {
    display: flex !important;
    flex-direction: column;
}

/* #zonefestival-root .SchedulePage .filters-wrapper {
    width: 20% !important;
}

#zonefestival-root .SchedulePage .schedule-content-wrapper {
    width: 80% !important;
} */

/* @media (max-width: 921px) { */

#zonefestival-root .SchedulePage .filters-wrapper,
#zonefestival-root .SchedulePage .schedule-content-wrapper {
    width: 100% !important;
}

/* } */

#zonefestival-root .SchedulePage .left-date-menu {
    border: 0 !important;
}

#zonefestival-root .navbar-form {
    border: 0 !important;
}

#zonefestival-root .navbar-form .search.form-control,
#zonefestival-root .schedule-filter-section select {
    /* position: absolute;
    top: 0;
    right: 0; */

    color: white !important;
    border: 0 solid !important;
    border-bottom: 5px solid !important;
    padding: 10px 16px !important;
    font-size: 20px !important;
    border-radius: 0 !important;
    background-color: black !important;
    height: auto !important;
    min-width: 250px;

    box-shadow: none !important;
}

#zonefestival-root .SchedulePage .filters-wrapper {
    position: relative !important;
    top: auto !important;
}

#zonefestival-root .schedule-filter-section select {
    max-width: 400px;
    /* padding: 6px 12px !important; */
}

#zonefestival-root .schedule-filter-section select option {
    color: white !important;
    padding: 6px 12px !important;
}

#zonefestival-root .navbar-nav {
    display: flex;
    flex-direction: row-reverse;
}

#zonefestival-root .navbar .language,
#zonefestival-root .navbar-header {
    display: none !important;
}

#zonefestival-root #date-nav-dropdown,
#zonefestival-root #section-nav-dropdown {
    display: none !important;
}

#zonefestival-root .container {
    padding: 0 !important;
    /* margin-top: 60px; */
}

#zonefestival-root .dropdown-menu {
    display: flex !important;
    justify-content: flex-start;
    /* align items to the left edge */
    align-items: stretch;
    /* make all items equal height (match tallest) */
    gap: 1rem;

    background-color: inherit !important;
    flex-direction: row !important;
    flex-wrap: wrap;
    position: relative !important;
    top: auto !important;
    left: auto !important;
}

#zonefestival-root .dropdown-menu li {
    border: 0 !important;

}

@media (max-width: 600px) {
    #zonefestival-root .dropdown-menu li:first-child {
        flex: 1 0 100%;
    }

    #zonefestival-root .dropdown-menu li:not(:first-child) {
        flex: 1 0 5%;
    }
}

#zonefestival-root .dropdown-menu a {
    height: 100% !important;
    width: 100% !important;
    background-color: #ffffff !important;
    color: #000000 !important;
    font-family: 'Bebas Neue', sans-serif;
    font-weight: 400 !important;
    letter-spacing: 3px;
    font-size: 20px;
    /* min-width: 100px; */

}

#zonefestival-root .Filters .form-group,
#zonefestival-root .SchedulePage .left-date-menu {
    padding: 0 !important;
    margin: 0 !important;
}

#zonefestival-root .dropdown-menu a .subtitle {
    font-weight: normal;
    color: #000000;
    font-family: "Nunito Sans", sans-serif;
    font-size: 16px;
}

#zonefestival-root .dropdown-menu a:hover,
#zonefestival-root .dropdown-menu .active a {
    background-color: #135a6d !important;
    color: #ffffff !important;
    cursor: pointer !important;
}

#zonefestival-root .dropdown-menu a:hover .subtitle,
#zonefestival-root .dropdown-menu .active a .subtitle {
    background-color: transparent !important;
    color: #ffffff !important;
}

#zonefestival-root .dropdown-menu>li>a {
    white-space: normal !important;
}

#zonefestival-root .Ticket .ticketIcon {
    display: none !important;
}

#zonefestival-root .Ticket a:hover,
#zonefestival-root .ProgramOeuvres .program-group-meta a:hover {
    color: #ffffff !important;
}