@import url("https://use.typekit.net/sqv4yhl.css");

#SiteHead2 h1.logo {

	background-image: url(https://cdn.tixly.com/nl/tix/Skin/20190411/80/Images/musis-liggend-final-rgb-diepzwart.jpeg) !important;

	width: 130px !important;

}

#BuyingHead {

    padding-top: 20px;

    padding-bottom: 20px;

    background-color: white;

}

#FooterSocial {

	display: none;

}

#SiteHead2 .headbackbutt {

	display: none;

}

/* Custom font Europa for normal text */

html, div, span,body, .donation-field, .donate-info-text, #tix-seatpicker main aside div h3, .total-line h2, .delivery-type-card .card-content .description p, .delivery-type-card .card-content .title h3, #SiteHead2, #BuyingHead, #BuyingSteps div .text, .event-select .location,  #EventSelector .selection-heading th, #TicketSelectTitle, #TicketSelector .name, #TicketSelector .select-zone, #TicketResultText, #TicketResults th, #DeliveryTypeTitle, #DeliverySelect li label, #DeliverySelect li label span.description, #ProductSelect h2, #ProductSelect ul.tiles li.product .info h1, .product-popup-description p, .product-popup-title h2, .basket-title, .basket-line, #InsuranceTitle, .profile-title, #TicketResults .sum .text, #TicketResults .sum td, .profile-heading, .form-control, .headtexttotal li,#PurchaseLogin h2, #EventSelector td.name, #EventSelector td.date, #EventSelector td.time,.item-list .results-items .item-details,.item-list .results-header .title h2,.item-list .results-header .total .prices .total-price, .headtexttitle, #BuyingHead, .button, .button span, div.icon, #BasketContainer h3, .donate-button, .button-small, h3 .purchase-info-heading, .suggestion-container h3

{

font-family: europa, sans-serif !important;

}

/* Custom font Futura PT Condensed for main headers */

.headtexttitle h1, #BuyingHead, #BasketContainer h3, h3.purchase-info-heading

{

font-family: futura-pt-condensed, sans-serif !important;

font-weight: 800 !important;

font-style: italic !important;

text-transform: uppercase;

color: #00a983 !important;

}

/* Hide Powered by Tixly */

#footer .left-foot.bottom{

 display: none !important;

}

/* Hide social logins */

#SignInSocial, #ProfileFields h5 {

display: none !important;

}

#SiteHead2 .headtexttitle 

{

    border-bottom-width: 0px;

}

/*Remove Cookie banner */

body > div.cc-window.secondary-bg-c.cc-banner.cc-type-info.cc-theme-edgeless.cc-bottom {

display:none;

}

body > div.cc-window.secondary-bg-c.cc-floating.cc-type-info.cc-theme-edgeless.cc-bottom {

display:none;

}

/* Hide alternative delivery address */

input.different-delivery, label[for=DeliveryAddress_UseDifferentDeliveryAddress] {

    display: none !important;

}

/* Change subscription ticket selection text */

#SeasonCardSelect .heading h1 {

	visibility: hidden;

  	position: relative; 

}

#SeasonCardSelect .heading h1:after {

	visibility: visible; 

    position: absolute; 

    top: 0; 

	left: 0; 

	content: "Kies aantal personen"; 

}

/* Change occupied seat color */

.s-s.occ circle {

    fill: lightgrey !important;

    stroke: lightgrey !important;

}

/* color fixes update august 

button.select-show span:link {

    color: #4bb166 !important;

}

button.select-show.selected span, button.select-show.selected span:hover{

    color: white !important;

}

div#BuyingSteps .icon {

    color: white !important;

  

} */

/* Better alignment of hallname in subscription buying flow

#CardSearchResults div.results-header{

  margin-bottom: 50px !important;

}

#CardSearchResults div.results-items {

  border-top: 0px !important;

  margin-top: 0px !important;

  margin-bottom: 20px !important;

  padding-bottom: 20px !important;

  border-bottom: 1px solid #f0f0f0 !important;

}

 */

/* Correct position 'Continue button' in seat picker on iPad */

/* iPad 1, 2, Mini and Air */

@media only screen 

  and (min-device-width: 768px) 

  and (max-device-width: 1024px) 

  and (-webkit-min-device-pixel-ratio: 1) {

    #tix-seatpicker main aside .cart-total-and-submit {

      padding-bottom: 50px;

    }

}

/* iPad 3, 4 and Pro 9.7" */

@media only screen 

  and (min-device-width: 768px) 

  and (max-device-width: 1024px) 

  and (-webkit-min-device-pixel-ratio: 2) {

    #tix-seatpicker main aside .cart-total-and-submit {

      padding-bottom: 50px;

    }

}

#tix-seatpicker overlay>div {

    min-height: 356px  !important;

    height:40%  !important;

}

/* Aanpassen naam cadeaukaart in klant account */

button[data-link="#ProfileGiftCards"] {

    font-size: 0px !important;

}

html[lang="nl"] button[data-link="#ProfileGiftCards"]:after {

    content: 'Cadeaukaarten/tegoedbonnen';

    font-size: 16px;

}

html[lang="en"] button[data-link="#ProfileGiftCards"]:after {

    content: 'Gift cards/credit vouchers';

    font-size: 16px;

}

div#ProfileGiftCards h2.profile-content-heading{

    font-size: 0px;

}

html[lang="nl"] div#ProfileGiftCards h2.profile-content-heading:after{

    content: 'Cadeaukaarten/tegoedbonnen';

    font-size: 30px;

}

html[lang="en"] div#ProfileGiftCards h2.profile-content-heading:after{

    content: 'Gift cards/credit vouchers';

    font-size: 30px;

}

/* Aanpassen tekst cadeaukaart op betaaldetails pagina */

div#GiftCardTitle {

    font-size: 0px !important; 

}

html[lang="nl"] #GiftCardTitle::before {

  font-size: 26px;

  content: "Cadeaukaart/tegoedbon" !important;

}

html[lang="en"] #GiftCardTitle::before {

  font-size 26px;

  content: "Gift card/credit voucher" !important;

}

/*Footer show info */

#FooterPhoneOpening {

Display:Unset;

}

#footer .phone-icon{

Display:None;

}

#footer .opening-hours,#footer .phone-number,#footer .copyright,#footer .copyright-text,#FooterInfo {

 

    font-size: 14px;

    line-height: 24px;

  	white-space: nowrap;

  

  	padding-left: 50px;

}

#footer .left-foot.bottom{

 display: none !important;

}

@media only screen and (max-width: 820px) {

    #FooterPhoneOpening, #FooterSocial, #bottom-foot {

        display: none !important;

    }

}


/* Color definitions */
/* Primary */
.primary-c {
    color: #00a983;
}
.primary-bg-c {
    background-color: #00a983;
	color: #ffffff;
}
/* Border color as font for primary background */
.primary-bg-font-border-c {
    border-color: #ffffff;
}
.primary-border-c {
    border-color: #00a983;
}
.primary-c-button {
	background-color: #00a983;
    color: #ffffff;
    border-color: #00a983;
}
.primary-c-button:hover {
	border-color: #008063;
    background-color: #008063;
}
.primary-c-button-secondary {
	background-color: #00a983;
    color: #ffffff;
    border-color: #00a983;
}
.primary-c-button-secondary:hover {
    background-color: #373737;
    color: #ffffff;
    border-color: #373737;
}
.primary-c-button-2 {
    background-color: #ffffff;
    border-color: #00a983;
    color: #00a983;
}
.primary-c-button-2:hover {
    background-color: #00a983;
    color: #ffffff;
}
.primary-c-button-2-secondary {
    background-color: #ffffff;
    border-color: #00a983;
    color: #00a983;
}
.primary-c-button-2-secondary:hover {
    background-color: #373737;
    border-color: #373737;
    color: #ffffff;
}
.primary-c-svg svg path, svg.primary-c-svg path {
    fill: #00a983;
}
/* Special for header */
.header-c-gradient-right::before {
    background: rgba(255,255,255,0);
    background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(255,255,255,0)), color-stop(100%, rgba(255,255,255,1)));
    background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
    background: -o-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
    background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff', GradientType=1 );
}
.header-bg-c {
    background-color: #ffffff;
    color: #00a983;
}
#skipToContent {
    background-color: #ffffff;
    color: #00a983;
    border: 1px solid #00a983;
}
.ms-options li > label {
    color: #00a983;
}

.header-border-text-c {
    border-color: #00a983;
}
.header-c-hover-before {
    background-color: #212121;
}
.header-c-hover-before::before {
    border-color: transparent #00a983 transparent transparent;
}
.header-c-hover-before:hover {
    background-color: #00a983;
}
.header-c-hover-before:hover::before {
    border-color: transparent #00a983 transparent transparent;
}
#header .ticket-list .ticket-table::-webkit-scrollbar {
    background-color: #ffffff;
}
#header .ticket-list .ticket-table::-webkit-scrollbar-thumb {
    background-color: #212121;
    border-color: #ffffff;
}
#header .ticket-list .ticket-table table tbody td {
    border-color: #ffffff;
}
#header .ticket-list .ticket-table table td.event span.dash {
    color: #ffffff;
}
.footer-highlight-c {
    color: #aaaaaa;
}
.content-inline-heading, .content-table-heading th {
     color: #aaaaaa;
}
/* Secondary */
.secondary-c {
    color: #373737;
}
.secondary-bg-c {
    background-color: #373737;
    color: #ffffff;
}
/* Border color as font for secondary background */
.secondary-bg-font-border-c-before:before {
    border-color: #ffffff;
}
/* Border color as font for secondary background */
.secondary-bg-font-border-c-hover:hover {
    border-color: #ffffff;
}
.secondary-bg-c-hover:hover {
    background-color: #373737;
    color: #ffffff;
}
.secondary-c-button {
    background-color: #ffffff;
    color: #373737;
    border-color: #373737;
}
.secondary-c-button:hover {
    background-color: #373737;
    border-color: #373737;
    color: #ffffff;
}
/* Tertiary */
.tertiary-c {
    color: #212121;
}
.tertiary-bg-c {
    background-color: #212121;
    color: #aaaaaa;
}
.tertiary-border-c {
    border-color: #212121;
}
.tertiary-c-button-secondary {
	background-color: #212121;
    color: #00a983;
    border-color: #212121;
}
.tertiary-c-button-secondary:hover {
    background-color: #212121;
    color: #373737;
    border-color: #212121;
}
.tertiary-bg-c-hover:hover {
    background-color: #212121;
    color: #aaaaaa;
}
/* Special cases that we can't put classes on */
#BuyingHead {
    color: #fff;
    border-color: #858687;
}

#SiteHead2 {
    border-bottom: 1px solid #212121;
}

#BuyingSteps div.icon {
    background: rgba(170,170,170,.15);
}
#BuyingSteps .steps.active div.icon {
    background: #00a983;
}
#SectionGroups li.selected-group a {
    background: #00a983;
    color: #ffffff;
}
#ProfileBar ul li button.active {
    color: #00a983;
    box-shadow: 0 3px 0px 0px #00a983;
}
#CardType > li.active, #GiftCardDescription p a {
    color: #00a983;
}
#CardType li.active svg path, #CardType li.active svg rect {
    fill: #00a983;
}
#SiteHead2 .headtexttotal .tickets > a > span > svg path {
    stroke: #00a983;
}
#ProfileOrders .order-receipt-link a > span > svg path {
    stroke: #00a983;
}
#ProfileContainer .profile-content .order-receipt-link a > span > svg path {
    stroke: #00a983;
}
#BuyingSteps.profile-steps .steps.active .text {
    color: #00a983;
}
#SiteHead2 .profile-language-bar > a > span > svg path,
#SiteHead2 .profile-language-bar > a > span > svg circle {
    stroke: #00a983;
}
#GiftCardDescription p a:hover {
    color: #008063;
}
#EventSelector .selected td.toggle a {
    border-color: transparent transparent #00a983 transparent;
}
input[type='checkbox']:checked {
    background-color: #00a983;
}
.clndr-grid .day.selected, .calendar-event.selected, .month-dropdown button.selected {
    background-color: #ffffff;
    color: #00a983;
}

/* Nice little special block for validation colors */
input[type='text'].input-validation-error,
input[type='email'].input-validation-error,
input[type='tel'].input-validation-error,
input[type='date'].input-validation-error,
input[type='password'].input-validation-error,
textarea.input-validation-error,
.field-validation-error > span {
    border-color: #fa4517;
    background-image: url(Images/alert.svg);
    background-repeat: no-repeat;
}
input[type='checkbox'].input-validation-error:before{
    border-color: #fa4517 !important;
}
#div-terms.validation-error {
    background-image: url(Images/alert.svg);
}
.validation-summary-errors, .field-validation-error, a.terms-and-conditions.validation-error {
    color: #fa4517;
}
