/* Custom fonts */

@font-face {

    font-family: Noah;

    font-weight: 700;

    font-style: bold;

    font-display: fallback;

    src: url("https://fonts.tixly.io/nl/rpho/Noah-Bold.woff") format("woff")

}

@font-face {

    font-family: Noah;

    font-weight: 400;

    font-style: normal;

    font-display: fallback;

    src: url("https://fonts.tixly.io/nl/rpho/Noah-Regular.woff") format("woff")

}

@font-face {

    font-family: rpho;

    font-weight: 400;

    font-style: normal;

    font-display: fallback;

    src: url("https://fonts.tixly.io/nl/rpho/rpho.woff") format("woff")

}

/* Basic settings */ 

#SiteHead2 a.brandLogo {

	display: none !important;

}

#SiteHead2 h1.logo {

	background-image: url(https://cdn.tixly.com/nl/tix/Skin/20190411/84/Images/rpho-logo-wit.svg) !important;

	width: 190px !important;

}

#BuyingHead {

	background-image: url(Images/bg.jpg);

  	color: #66296b !important;

	padding: 25px 0;

}

#FooterSocial {

	display: none;

}

#SiteHead2 .headbackbutt {

	display: none;

}

/*Custom font most elements*/

/* html, div, span,body, .donation-field, .donate-info-text, .results-sub-header .title h2, #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, #BuyerTitle, #CardTitle, #GiftCardTitle, #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 */

* {

font-family: Noah, Arial, Sans-Serif !important;

}

.headtexttitle, h1, #BuyingHead, .button, .button span, div.icon, #BasketContainer h3, .donate-button, .button-small {

    font-family: rpho !important;

}

/*Custom font, bigger in heads*/

.headtexttitle 

{

font-family: rpho, Arial, Tahoma,sans-serif !important;

font-weight: 400;

}

/* Buttons */

.primary-c-button {

    font-size: 18px;

    font-family: rpho, sans-serif;

    text-transform: uppercase;

    color: rgb(255, 255, 255);

    border-radius: 0px 23.5px 23.5px 0px;

    line-height: 1.2;

    background: linear-gradient(94.25deg, rgb(230, 0, 126) 0%, rgb(228, 5, 33) 200%);

}

.primary-c-button:hover {

    background: linear-gradient(85.68deg, rgb(230, 0, 126) 0%, rgb(122, 33, 130) 100%);

}

.primary-c-button-2 {

    font-size: 18px;

    font-family: rpho, sans-serif;

    text-transform: uppercase;

    color: rgb(255, 255, 255) !important;

    border-radius: 23.5px 0px 0px 23.5px;

    line-height: 1.2;

   background: linear-gradient(94.25deg, rgb(230, 0, 126) 0%, rgb(228, 5, 33) 200%);

  

}

.primary-c-button-2:hover {

 background: linear-gradient(85.68deg, rgb(122, 33, 130) 0%, rgb(230, 0, 126) 100%);

  

}

/* Change occupied seat color */

.s-s.occ circle {

fill: lightgrey !important;

stroke: lightgrey !important;

}

/* Hide social logins */

#SignInSocial {

display: none !important;

}

/* Also hide text "Or log in with" */

#ProfileFields h5 {

    display: none;

}

/* Hide order without account */

#SkipLogin {

display: none !important;

}

/* Hide social buttons */

.order-container .social {

    display: none !important;

}

/* Hide memberships menu in profile */

a[href="#ProfileMemberships"] {

    display: none !important;

}

/* Hide only second language option in menu */

.language-currency-selector ul:nth-child(1) li:nth-child(2) {

display: none;

}

/* Hide only second currency option in menu */

.language-currency-selector ul:nth-child(2) li:nth-child(2) {

display: none;

}

/* Tekst onder vraagteken aanpassen*/

li.pick-type-3 {
  font-size: 0 !important;
  line-height: 0 !important;
}

/* De nieuwe tekst toevoegen en weer zichtbaar maken */
li.pick-type-3:before {
  font-size: 13px !important;
  line-height: 1.4 !important;
  visibility: visible !important;

}

html[lang="nl"] li.pick-type-3:before {

 content: 'Je kunt op een stoel klikken om één voor één je stoelen te kiezen. Nadat je een stoel hebt gekozen, kun je de prijs aanpassen door erop te klikken in het winkelmandje. Voor sommige prijzen dien je meer dan één stoel te selecteren om ze te kunnen gebruiken.';

}

html[lang="en"] li.pick-type-3:before {

 content: 'You click on a seat to select your seats one by one. After a seat is chosen you can change the price by clicking on it in the basket and selecting a new one. Some prices require you to select more than one seat.';

}

/* Aanpassen tekst Donatie op betaaldetail pagina */

#DonateTitle {

    font-size: 0px !important; 

}

html[lang="nl"] #DonateTitle::before {

  font-size: 26px;

  content: "Steun het orkest" !important;

}

html[lang="en"] #DonateTitle::before {

  font-size: 26px;

  content: "Support the orchestra" !important;

}

.donate-info-text {

font-size: 0px !important;

}

/* Hide suggestions in basket */

.receipt-suggestion-header, .event-group-suggestion-wrapper {

    display: none;

}


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