/* Use hosted font*/

@font-face {

font-family: "GT Flexa Hamar";

src: url("https://www.hamar-kulturhus.no/wp-content/themes/hamar-kulturhus/assets/fonts/GT-Flexa-Hamar/GT-Flexa-Hamar-Standard-Light.woff2") format("woff");

  font-weight: 400;

}

@font-face {

font-family: "GT Flexa Hamar";

src: url("https://www.hamar-kulturhus.no/wp-content/themes/hamar-kulturhus/assets/fonts/GT-Flexa-Hamar/GT-Flexa-Hamar-Standard-Light-italic.woff2") format("woff");

 font-weight: 400;

  font-style: italic;

  font-display: swap;

}

@font-face {

font-family: "GT Flexa Hamar";

src: url("https://www.hamar-kulturhus.no/wp-content/themes/hamar-kulturhus/assets/fonts/GT-Flexa-Hamar/GT-Flexa-Hamar-Standard-Medium.woff2") format("woff");

 font-weight: 700;

}

@font-face {

font-family: "GT Flexa Hamar";

src: url("https://www.hamar-kulturhus.no/wp-content/themes/hamar-kulturhus/assets/fonts/GT-Flexa-Hamar/GT-Flexa-Hamar-Standard-Bold.woff2") format("woff");

 font-weight: 800;

}

@font-face {

font-family: "GT Flexa Hamar";

src: url("https://www.hamar-kulturhus.no/wp-content/themes/hamar-kulturhus/assets/fonts/GT-Flexa-Hamar/GT-Flexa-Hamar-Expanded.woff2") format("woff");

 font-weight: 900;

}

/* use star "*" to style all selectors, the !important could interfere with style cascade */

* { 

  font-family: "GT Flexa Hamar", sans-serif !important; 

}

#SiteHead2 h1.logo {

	background-image: url(Images/hamarredigert.jpeg) !important;

	width: 232px;

    height: 44px;

   margin: 27px 5px 5px 30px !important;

}

#SiteHead2 div.logo {

	background-image: url(Images/hamarredigert.jpeg) !important;

	width: 232px;

    height: 44px;

   margin: 20px 5px 5px 50px !important;

}

#BuyingHead {

	background-image: url(Images/bg.jpg);

	padding: 50px 0;

    text-transform: uppercase;

}

#BasketContainer h1 {

  text-transform: uppercase;

}

#FooterSocial {

	display: none;

}

#SiteHead2 .headbackbutt {

	display: none;

}

/* Adjust logo size - smaller screeens */

@media only screen and (max-width: 1034px) {

#SiteHead2 h1.logo {

    width: 126px;

    height: 17px;

  margin: 24px 0 0 24px;

}}

#FooterSocial {

	display: none;

}

#SiteHead2 .headbackbutt {

	display: none;

}

#SiteHead2 .headtexttotal {

  padding-left: 0px;

}

.headtexttitle {

  text-transform: uppercase;

  padding-left: 15px;

}

/* Make required fields more visible */

label.required-field {

  color: #cf0a0b !important;

  font-weight: 400 !important;

}

/* Hide social logins */

#SignInSocial {

display: none !important;

}

/* Also hide text "Or log in with" */

#ProfileFields h5 {

    display: none;

}

/* Change occupied seat color */

.s-s.occ circle {

fill: lightgrey !important;

stroke: #636363 !important;

}

/*Highlight terms and conditions*/

#TermsInfo {

    background-color: #F2BFBF;

    padding-top: 8px !important;

  	padding-bottom: 8px !important;

    padding-left: 18px !important;

    margin-bottom: 24px;

}

/* Square buttons*/

.button, .button-small {

  border-radius: 0px !important;

}

.button-icon {

  border-radius: 0px;

}

/* More square boxes */

#TicketSelector li, #TicketSelector .select-zone, .plus-button, .minus-button, .delete-button, .item-list .results-container, .item-list .results-summary-container, .view-seats-button, .headtexttotal .expires, #EventFilter>div>a, #EventFilter .ticket-types-inline-picker {

  border-radius: 0px;

}

.add-product-button {

border-radius: 0px;

  background-color: #000000;

}

/* Square event selector */

#EventSelector .event-select td:first-child,

#EventSelector .event-select td:last-child {

  border-radius: 0;

}

/* Square corners - subsription event selct cards + buttons */

#SeasonCardSelect .shows ul.tiles li.show, .button-icon, #SeasonCardSelect .heading .number-of-cards .ticket-type-row {

  border-radius: 0px;

}

/* Square box, pick date in subscription */

#SeasonCardSelect .shows ul.tiles li.show .select-options select {

  border-radius: 0px;

}

/* Square Giftcard plus /minus buttons */

#GiftCardSelector .plus, #GiftCardSelector .minus, #GiftCardSelector li:not(.selected) .gift-card-count .minus.zero, #GiftCardSelector li:not(.selected) .gift-card-count .plus.zero, #GiftCardSelector li, #GiftCardSelector .gift-card-count {

  border-radius: 0;

}

#EventSelector tr.event-select:not(.selected) {

  background-color: #ffffff;

  color: #000000;

    outline-color: #000000;

    outline-width: 1px;

    outline-style: solid;

}

#EventSelector tr.event-select:not(.selected):hover {

  background-color: #9c9d9e !important;

  border-color: #000000 !important;

}    

/* White background when listing the things customer is buying */

.item-list .results-container:not(.error-border) {

  background-color: #ffffff;

  border-color: #000000;

}

/* Steps 1 - 4 */

#BuyingSteps div.icon {

  background: #9c9d9e !important;

  color: #000000;

}

#BuyingSteps .steps.active div.icon {

  background: #000000 !important;

}  

/* Change color Tixly in footer */

#footer .copyright-text a {

  color: #ffffff;

}

/* buttons background color change when hovered over */

.primary-c-button-2:hover, .primary-c-button:hover {

  background-color: #9c9d9e !important;

  color: #000000 !important;

  

}

/* Smalere sirkel - seter */

.s-s circle {

  stroke-width: 1.2 !important;

}

/* Chosen seats yellow fill + black text */

.s-s.your-seat circle.p-1, .s-s.your-seat circle.p-2, .s-s.your-seat circle.p-3, .s-s.your-seat circle.p-4, .s-s.your-seat circle.p-5, .s-s.your-seat circle.p-6, .s-s.your-seat circle.p-7, .s-s.your-seat circle.p-8, .s-s.your-seat circle.p-9, .s-s.your-seat circle.p-10, .s-s.your-seat circle.p-11, .s-s.your-seat circle.p-12 {

  fill: yellow !important;

}

.s-s.your-seat text, .s-s.original-seat text {

  fill: black !important;

}

/* Hide suggestions in basket */

.event-group-suggestion {

display: none;

}

div#BasketContainer > h2:first-child{

display: none;

} 

/* Other logo dimensions on mobile */

@media only screen and (max-width: 480px) {

  #SiteHead2 h1.logo 

  {

    height: 40px !important;

    width: 75px !important;

  }

  /* This also hides the horizontal line */

  #SiteHead2 .headtexttitle 

  {

    border-bottom-width: 0px;

  }

 }

#BuyingHead {

  color: #000000 !important;

}

/* Underline link, giftcard description */

#GiftCardDescription p a {

  text-decoration: underline;

}

/* Basket visible in header */

.headtexttotal .tickets a svg:first-child, .headtexttotal .tickets a svg:last-child, .headtexttotal .tickets a span {

  color: white;

}


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