

#SiteHead2 h1.logo {

	background-image: url(Images/bst_rektangular_vanster_dimma_korall.png) !important;

	width: 193px !important;

  position: relative;

    left: 13px;

}

#BuyingHead {

	background-image: none !important;

  	background-color: #F8E6DE !important;

  color: #2B1E24 !important;

  	padding: 50px 0;

}

#BuyingSteps div .text {

	text-transform: uppercase !important;

}

#BuyingSteps {

	margin-top: 60px !important;

  

  }

#FooterSocial {

	display: none;

}

#SiteHead2 .headbackbutt {

	display: none;

   font-weight: center !important;

}

/* Other logo dimensions on mobile */

@media only screen and (max-width: 480px) {

  #SiteHead2 h1.logo 

  {

    width: 145px !important;

    height:45px !important;

  }

}

#SpecialOfferTitle, #SpecialOfferInfo {

  padding-left: 0px !important;

}

@media only screen and (max-width: 480px) {

.special-offer-content {

    padding-left: 10px !important;

    padding-right: 10px !important;

  }  

}

input[type='checkbox'] {

    border: 1px solid #000000 !important;

}

/*Main Header*/

#SiteHead2 {

    display: grid;

    grid-template-columns: 1fr 2fr 1fr;

    grid-template-rows: auto auto;

    column-gap: 1rem;

    row-gap: 0.625rem;

    border: none;

    padding-bottom: 0.625rem;

    height: auto;

    background: #621937;

    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.35);

    z-index: 11;

}

#SiteHead2 > * {

    display: block;

    box-sizing: border-box;

}

#SiteHead2 .profile-language-bar {

    position: relative;

    grid-column: 1 / span 3;

    grid-row: 1;

    display: flex;

    justify-content: flex-end;

    margin: 0;

    padding: 0 1.5rem;

    height: 2.5rem;

    background: #621937;

}

#SiteHead2 .profile-language-bar a {

    color: #ffffff !important;

    background: transparent !important;

}

#SiteHead2 .profile-language-bar .profile-link svg {

    fill: #ffffff !important;

}

#SiteHead2 a[href="https://www.konserthuset.se/"], #SiteHead2 a[href="https://www.konserthuset.se/en"] {

    grid-row: 2;

    grid-column: 1;

    align-self: center;

    justify-self: flex-start;

    padding-left: 1.5rem;

}

#SiteHead2 h1.logo {

    display: block;

    float: none;

    margin: 0;

    height: auto;

    color: transparent;

    background-image: url(Images/bst_rektangular_vanster_dimma_korall.png) !important;

    background-position: top left;

    background-size: cover;

    font-size: 0.01;

}

#SiteHead2 .headtexttitle {

    grid-row: 2;

    grid-column: 2;

    align-self: center;

    justify-self: center;

    margin: 0;

    padding: 0;

    width: 100%;

    height: auto;

    font-size: 1.75rem;

    text-align: center;

    text-overflow: ellipsis;

    text-transform: uppercase;

    white-space: nowrap;

    color: var(--font-color);

    overflow: hidden;

}

@media only screen and (max-width: 1035px) {

    #SiteHead2 .headtexttitle {

        display: block;

        font-size: 1rem !important;

    }

}

#SiteHead2 .headtexttotal {

    position: relative;

    flex-direction: row;

    align-items: center;

    align-self: center;

    justify-self: flex-end;

    column-gap: 1rem;

    grid-row: 2;

    grid-column: 3;

    margin: 0;

    padding: 0 1.5rem 0 0;

    height: auto;

    font-size: 1rem;

    font-weight: 400;

}

#SiteHead2 .headtexttotal .tickets {

    display: flex;

    align-items: center;

    column-gap: 0.3rem;

    font-size: inherit;

}

#SiteHead2 .headtexttotal .tickets .basket-items {

    white-space: nowrap;

}

#SiteHead2 .headtexttotal .total {

    margin: 0;

    white-space: nowrap;

    font-size: inherit;

}

#SiteHead2 .headtexttotal .expires {

    margin: 0;

    padding: 0;

    column-gap: 0.3rem;

    height: auto;

    min-width: 0;

    font-size: inherit;

    color: var(--font-color);

    background: none;

}

#SiteHead2 .headtexttotal .expires svg {

    display: block;

    width: 1.5rem;

    height: auto;

    aspect-ratio: 18 / 17;

}

@media only screen and (max-width: 1034px) {

    #SiteHead2 .headtexttotal {

        font-size: 1rem;

        column-gap: 0.5rem;

    }

}

.header-bg-c {

    color: #fff !important;

    background: #621937 !important;

}

.tertiary-border-c {

    border-color: var(--color-primary-black);

}

/*Header on mobile*/

@media only screen and (max-width: 660px) {

  #SiteHead2 .profile-language-bar {

      top: 0px !important;

      padding: 3px 1.5rem !important;

      right: 0px !important;

  }

  .seatpicker-show #SiteHead2 .headtexttotal {

    grid-row: 2 !important;

}

  #SiteHead2 .headtexttitle {

    top: 0px !important;

    text-align: left !important;

    left: 0% !important;

  }

  

}

@media only screen and (max-width: 660px) {

    body:not(:has(#BasketContainer)) #SiteHead2 .headtexttotal {

      grid-row: 3;

      grid-column: 2;

    }

  }

@media screen and (min-device-width: 481px) and (max-device-width: 660px) { 

    #BuyingHead {

        margin-top: 50px;

      }

    }

    @media only screen and (max-width: 480px) {

      #SiteHead2 .headtexttitle {

          border-bottom-width: 0px;

      } 

  }


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