/*
 * Temporary hacks
 */
 .textfield.is-filled .textfield__label,
 .textarea.is-filled .textarea__label {
    -webkit-transform: translateY(-40%) scale(.775);
    -ms-transform: translateY(-40%) scale(.775);
    transform: translateY(-40%) scale(.775);
}

input[type="submit"].button {
	cursor: pointer;
}


/* 
 * Custom styling 
 */
.margin-top-0-25 { margin-top: .444444rem !important; }
.margin-left-0-25 { margin-left: .444444rem !important; }
.margin-top-0-33 { margin-top: .666666rem !important; }
.margin-top-0-5 { margin-top: .888888rem !important; }
.margin-left-0-5 { margin-left: .888888rem !important; }
.margin-right-0-5 { margin-right: .888888rem !important; }
.margin-bottom-0-5 { margin-bottom: .888888rem !important; }

@media only screen and (min-width: 62em) {
    .navigation-bar__container,
    .application-bar__container,
    .container {
        padding-left: 1.833333em;
        padding-right: 1.833333em;
    }
}
.modal-dialog__container {
    overflow: inherit;
}
.modal-dialog__container #modal_desc div {
    margin-bottom: 4px;
}

.border-color-gray-tint-5 {
    border: 1px solid #ededed !important;
}

.bg-color-transparent {
    background-color: transparent!important;
}

.alert-margin:not([hidden]) {
    margin-top: 59.999px!important;
    margin-top: 3.333333332rem!important;
}

.card__body {
    margin: 20px 0;
    padding: 0 20px;
}

.no-shadow {
    box-shadow: 0 0 0;
}

.callout--info:before {
    font-family: "SH Icon";
    font-weight: normal !important;
    font-style: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-align: center;
    vertical-align: baseline;
    content: "";
    display: flex;
    background-color: #3abfed;
    align-items: center;
    justify-content: center;
    font-size: 1em;
    width: 1.66667rem;
    height: 1.66667rem;
    line-height: 1.7;
    border-radius: 50%;
    color: #000000;
    margin-right: 10px;
}
.alert__title {
    margin-top: .1rem;
}

/* Country selection */
#country-selection-label i:before {
    background-size: 12.955rem 10.61rem;
    width: 1.698333rem;
    height: 1.1rem;
}
.country-selection__list {
    columns: 265px 4;
}
.country-selection__item {
    max-width: 100%;
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
}
@media only screen and (max-width:36em) {
    .country-selection__item {
        margin-left: 1rem;
    }
}


.round {
    border-radius: 50%;
}

.tooltip {
    z-index: 9999;
}
.tooltip-container {
    position: absolute;
    background: rgba(26,26,26,.3);
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9998;
    display: none;
}
.tooltip-container.is-visible {
    display: block;
}
.tooltip__close-button:hover {
    cursor: pointer;
}

.inpage-navigation__panel {
    justify-content: space-around;
}

.media__body {
    width: 80%;
}

.width--auto {
    width: auto !important;
}

.dropdown__panel--right {
    left: auto !important;
    right: 0;
}

.dropdown__panel--bottom {
    top: auto;
    bottom: 80%;
}

.footer__social {
    position: relative;
    top: -1rem;
}
.msc-button {
    border: none;
    margin: 0 5px 0 0;
}
.msc-button i:before {
    color: #929292;
    margin-left: -6px;
    font-size: 50px;
}
.msc-button:hover i:before {
    color: #ec6602;
}
.msc-button:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.hiddenCard,
.filteredCard {
    display: none !important;
}

.meta-menu * {
    font-size: 16px;
}
.meta-menu i:before {
    font-size: 25px;
    top: 1px;
}

.user-identifier__name.loggedout {
    font-size: 16px;
    font-weight: normal;
}
.user-identifier__avatar {
    position: relative;
    overflow: hidden;
    width: 39.999px;
    width: 2.2222222222rem;
    height: 39.999px;
    height: 2.2222222222rem;
    margin-left: .25rem;
    margin-right: .5rem;
    border-radius: 99rem;
}
.user-identifier__avatar img {
    object-fit: cover;
    position: absolute;
    width: 100%;
    height: auto;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
      -ms-transform: translate(-50%,-50%);
          transform: translate(-50%,-50%);
    margin: 0;
}
.user-identifier__avatar i.icon-user {
    margin: 0 .25rem;
}
.user-identifier__initials {
    margin: 0;
}

.selected-service-tag {
    font-weight: 600;
    background-color: #ededed;
    color: #1a1a1a;
    border: 1px solid #ccc;
    display: inline-block;
    font-size: 14px;
    font-size: .7777777778rem;
    padding: 5px 10px;
    padding: .2777777778rem .5555555556rem;
    margin: 1px 7.499px 7.499px 0;
    margin: .0555555556rem .4166666665rem .4166666665rem 0;
    margin-left: 0;
    border-radius: 3px;
    vertical-align: top;
    line-height: 19.999px;
    line-height: 1.11111rem;
}
.selected-service-tag__close-button {
    color: #666;
    width: auto;
    height: auto;
    margin-left: 5px;
}
.selected-service-tag__close-button:before {
    font-size: .7rem;
}
.js-additional-data {
    display: none;
}

.textarea__hint {
    margin-top: -2rem;
}


/* 
 * file input 
 */
.inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}
.inputfile + label {
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    display: inline;
    overflow: hidden;
    padding: 0;
}
.inputfile + label span {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    padding: 0 1rem 0 0;
}

/* 
 * card 
 */
.card-16px {
    font-size: 16px;
    line-height: 25px;
}

/* 
 * card search-classes 
 */
.card--element mark {
    background: yellow;
}
.card--element.is-hidden {
    display: none;
}
.js-search-noresults {
    display: none;
    width: 100%;
    text-align: center;
}
.js-search-noresults.no-results {
    display: block;
}

/* 
 * card teaser 
 */
.card__teaser>label {
    width: 4rem;
    margin-right: .7rem;
    height: 1rem;
    overflow: visible;
}
.icon-arrow-down-medium:hover,
.icon-arrow-up-medium:hover {
    cursor: pointer;
}
.card__teaser input[type=checkbox],
#showCustomerNumbers {
    position: absolute;
    top: auto;
    left: -9999px;
    width: 1;
    height: 1;
    opacity: 0;
}
.card__teaser>div {
    /* Default State */
    overflow: hidden;
    height: 3em;
}
.card__teaser.short label.button--control {
    display: none;
}
.card__teaser.short div {
    overflow: visible;
}
.card__footer {
    pointer-events: none;
}
.card__footer>button {
    pointer-events: all;
}
.card__teaser>div {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.card__teaser input[type=checkbox]:checked~label:before {
    content: '\e837';
}
.card__teaser input[type=checkbox]:checked~div {
    /* Toggled State */
    height: auto;
}
.card__teaser input[type=checkbox]:checked~div {
    display: block;
    -webkit-line-clamp: auto;
    -webkit-box-orient: auto;
}
.card__teaser input[type=checkbox]:checked~div:after {
    display: none;
}
.card__teaser .card__teaser-text dl,
.card__teaser .card__teaser-text dt {
    font-size: 14px!important;
    line-height: 1.3;
}

#showCustomerNumbers~.customerNumbers__list {
    height: 1.5rem;
    overflow: hidden;
    margin: 0;
    padding: 0;
    list-style-type: none;
    line-height: 1.5rem;
}

#showCustomerNumbers~.customerNumbers__list .customerNumbers__wrap  {
    position: relative;
    word-wrap: break-word;
    white-space: normal;  
}
#showCustomerNumbers~.customerNumbers__list .customerNumbers__wrap span:not(:first-child) {
    display: none;
}
#showCustomerNumbers:checked~.customerNumbers__list .customerNumbers__wrap span {
    margin: 0;
    display: inline;
    white-space: normal;
    margin-left: 10px;
}
#showCustomerNumbers:checked~.customerNumbers__list {
    height: auto;
    line-height: 1.2;
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    background: #fff;
    margin: 2.2rem 1.11111111rem 0 1.11111111rem;
    padding: 0 2rem 1rem 4rem;
    z-index: 10;
    border-bottom: 1px solid #b3b2b2;
    background-color: #fff;
}
table tr:hover #showCustomerNumbers:checked~.customerNumbers__list {
    background-color: #f2f2f2;
}
label[for="showCustomerNumbers"] {
    margin: 0;
}
label[for="showCustomerNumbers"]:before {
    font-size: 12px;
    text-decoration: underline;
    cursor: pointer;
    content: "show more";
}
#showCustomerNumbers:checked~label:before {
    content: "show less";
}



/* 
 * Pending subscription/ passive card 
 */
.collection__item-passive .media-object__image,
.collection__item-passive .media-object__body h5,
.collection__item-passive .media-object__body p,
.grid__item-passive .card__image,
.grid__item-passive h5,
.grid__item-passive span,
.grid__item-passive p {
    opacity: .3;
}

.label__requested {
    opacity: 1;
    background-color: #111;
    color: #fff;
}


/* 
 * Breakpoints 
 */
 @media only screen and (max-width:36em) {
    .msc-button {
        margin: 0 -5px 0 0 !important;
    }
    .msc-button i:before {
        margin-left: -6px !important;
        font-size: 35px !important;
    }
    .card__teaser>label {
        width: 5rem;
        margin: 0 .8rem !important;
        height: 1rem;
    }
}

/* 
 * Zip-field autocomplete 
 */
.zip-field__autocomplete {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin-top: 0;
    padding: 0 0.8em;
    border: 1px solid #e0e0e0;
    border-top: none;
    background: white;
    z-index: 1; }
    .zip-field__autocomplete.has-results {
      display: block; }
    .zip-field__autocomplete-item {
      color: #686868;
      cursor: pointer; }
      .zip-field__autocomplete-item:hover {
        color: inherit; }

/* 
 * IE10+ CSS style for unfold-card-button in manage-services
 */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .ie-unfold-card {
        overflow: visible;
    }
}

.underline-link {
    text-decoration: underline;
}
