/* =========================

   HEADER / LOGO

   ========================= */

#SiteHead2 h1.logo {

  background-image: url(https://cdn.tixly.com/fi/tix/Skin/20210915/52/Images/fuuga_tunnus_vasen_rgb.png) !important;

  background-repeat: no-repeat;

  background-position: left center;

  background-size: contain;

  width: 450px !important;

  height: 113px !important;

  text-indent: -9999px;

  overflow: hidden;

  margin-top: -5px;

}

#SiteHead2 {

  height: 120px;

}

#BuyingHead {

  background-image: url(Images/bg.jpg);

  padding: 50px 0;

  color: #141414 !important;

}

#FooterSocial {

  display: none;

}

#SiteHead2 .headbackbutt {

  display: none;

}

/* =========================

   TYPOGRAPHY

   ========================= */

.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,

.fnt-sbold h3,

.fnt-sbold h2 {

  font-family: Helvetica !important;

}

.fnt-sbold,

.fnt-sbold h1,

.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: Helvetica !important;

}

.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,

.item-list .results-header .title .sub-title {

  font-family: Helvetica !important;

}

.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: Helvetica !important;

}

/* =========================

   SEAT MAP – NO BLACK FILL GUARANTEED

   ========================= */

/* UNSOLD seats: force NO fill (prevents default black), keep section colour via stroke */

#tix-seatpicker .s-s:not(.occ):not(.your-seat) circle,

#tix-seatpicker .s-s:not(.occ):not(.your-seat) path,

#tix-seatpicker .s-s:not(.occ):not(.your-seat) rect,

#tix-seatpicker .s-s:not(.occ):not(.your-seat) polygon {

  fill: none !important;          /* key line: stops black fill */

  fill-opacity: 0 !important;

  opacity: 1 !important;

}

/* SOLD / unavailable seats → light */

#tix-seatpicker .s-s.occ circle,
#tix-seatpicker .s-s.occ path,
#tix-seatpicker .s-s.occ rect,
#tix-seatpicker .s-s.occ polygon {

  fill: #d4d4d4 !important;
  stroke: none !important;
  opacity: 1 !important;

}

/* SELECTED seat → brand coral */

#tix-seatpicker .s-s.your-seat circle,

#tix-seatpicker .s-s.your-seat path,

#tix-seatpicker .s-s.your-seat rect,

#tix-seatpicker .s-s.your-seat polygon {

  fill: #f86242 !important;

  stroke: #f86242 !important;

  stroke-width: 2 !important;

  animation: none !important;

}

/* Hover feedback */

#tix-seatpicker .s-s:not(.occ):hover circle,

#tix-seatpicker .s-s:not(.occ):hover path,

#tix-seatpicker .s-s:not(.occ):hover rect,

#tix-seatpicker .s-s:not(.occ):hover polygon {

  filter: brightness(0.9);

}

/* Make unsold seat outlines a bit stronger (optional) */

#tix-seatpicker .s-s:not(.occ):not(.your-seat) circle,

#tix-seatpicker .s-s:not(.occ):not(.your-seat) path,

#tix-seatpicker .s-s:not(.occ):not(.your-seat) rect,

#tix-seatpicker .s-s:not(.occ):not(.your-seat) polygon {

  stroke-width: 2 !important;

}


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