@import url("https://use.typekit.net/hzj6pxq.css");

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap');

#SiteHead2 a.brandLogo {

	display: none !important;

}

#SiteHead2 h1.logo {

	background-image: url(Images/logogul.svg) !important;

	width:275px !important;

  	height:50px !important;

}

#BuyingHead {

	padding: 85px 0;  

   	background-color: #fff0ce !important;

	color: #360c35 !important;

    font-family: obviously-condensed, sans-serif !important;

}

#FooterSocial {

	display: none;

}

#SiteHead2 .headbackbutt {

	display: none;

}

/********FILIP ADDED CSS BELOW**********/

/**Font replacement**/

.fnt-bold, .fnt-bold h1, .fnt-bold h2, .fnt-bold h3, .fnt-bold h4, .fnt-bold h5, h1.fnt-bold, h2.fnt-bold, h3.fnt-bold, h4.fnt-bold, h5.fnt-bold, .fnt-bold input, .fnt-bold select, .fnt-bold textarea, strong, b, #EventSelector .selection-heading th.name, #EventSelector .event-select td.name, #EventSelector .selection-heading th {

	font-family: obviously-narrow, sans-serif;

  	font-weight: 700;

	font-style: normal;

}

.fnt-sbold, .fnt-sbold h1, .fnt-sbold h2, .fnt-sbold h3, .fnt-sbold h4, .fnt-sbold h5, h1.fnt-sbold, h2.fnt-sbold, h3.fnt-sbold, h4.fnt-sbold, h5.fnt-sbold, .fnt-sbold input, .fnt-sbold select, .fnt-sbold textarea {

	font-family: obviously-narrow, sans-serif;

	font-weight: 700;

	font-style: normal;

}

.fnt-normal, .fnt-normal h1, .fnt-normal h2, .fnt-normal h3, .fnt-normal h4, .fnt-normal h5, h1.fnt-normal, h2.fnt-normal, h3.fnt-normal, h4.fnt-normal, h5.fnt-normal, .fnt-normal input, .fnt-normal select, .fnt-normal textarea {

	font-family: obviously-narrow, sans-serif !important;

	font-style: normal;

}

.fnt-light, .fnt-light h1, .fnt-light h2, .fnt-light h3, .fnt-light h4, .fnt-light h5, h1.fnt-light, h2.fnt-light, h3.fnt-light, h4.fnt-light, h5.fnt-light, .fnt-light input, .fnt-light select, .fnt-light textarea {

	font-family: obviously-narrow, sans-serif !important;

	font-weight: 500;

	font-style: normal;

}

.button, .button-small {

	font-family: obviously-narrow, sans-serif !important;

	font-weight: 700;

	font-style: normal;

}

/*Background color changed to yellow on various places*/

#wrapper, #BuyingSteps .steps.active {

	background-color: #fff0ce !important;

}

/*Unselected Event in Event List*/

#EventSelector tr.event-select:not(.selected) {

	background-color: #fff0ce !important;

}

@media (min-width: 481px) {

  #EventSelector .event-select td {

      border-top: 2px solid #000;

      border-bottom: 2px solid #000;

  }

  #EventSelector .event-select td:first-child {

      border-left: 2px solid #000;

      border-top-left-radius: 50px !important;

      border-bottom-left-radius: 50px !important;

  }

  #EventSelector .event-select td:last-child {

      border-right: 2px solid #000;

      border-top-right-radius: 50px !important;

      border-bottom-right-radius: 50px !important;

  }

  #BuyingHead {

  	font-size: 75px !important;

}

}

/*Selected Event in Event List*/

#EventSelector .selected {

	background-color: #fff !important;

  	color: #000 !important;

} 

#EventSelector .selected td {

	border: none !important;

}

/*Toggle arro on selected event*/

.toggle .secondary-bg-c {

	background-color: #fff !important;

  	color: #000 !important;

}

/*Buying steps*/

#BuyingSteps .icon {

	background-color: #fff0ce !important;

}

#BuyingSteps div .text {

	color: #360b36 !important;

}

/*Active icon*/

#BuyingSteps .steps.active div.icon {

	background-color: #ffcbff !important;

}

#BuyingSteps .steps.active div.icon {

	color: #360b36 !important;

}

/*Header Color in Event List*/

#EventSelector .selection-heading th {

	color: #360b36 !important;

}

/*Ticket selector Box to White*/

#TicketSelector li {

	background: #fff !important;

}

/*Social Logins Buttons Background to White*/

#ProfileFields #SignInSocial button.social-button {

	background-color: #fff0ce !important;

}

/*Fix color bottom border on selected menu item in My Pages*/

#ProfileBar ul li a.active {

  	box-shadow: 0 3px 0 0 #360b36 !important;  

}

.event-group-note, .results-summary-container {

	background-color: #ffffff !important;

}

#TicketTypeSelect .button {

	border: 0px !important;

}

#SiteHead2 .profile-language-bar li a, #ProfileFields #SignInLocal .profile-input-line .forgot-password, #TermsInfo .terms-and-conditions {

  	color: #360b36 !important;

}

#CardType li.active svg path, #CardType li.active svg rect {

	fill: #360b36 !important;	

}

/*Border color for filter buttons*/

#EventFilter>div>a,#EventFilter .ticket-types-inline-picker {

	border: 1px solid #000;

}


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