body, html {
    font-size: 16px;
    font-family: Quicksand,sans-serif
}

.site {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    min-height: 100vh
}

    .site .content {
        -webkit-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1
    }

.skip-link {
    background: #fff;
    color: #000;
    font-size: 1.25rem;
    display: block;
    position: absolute;
    left: -9999px;
    padding: 20px 30px
}

    .skip-link:focus {
        left: 0;
        color: #000;
        text-decoration: none
    }

h1, h2, h3, h4, h5, h6 {
    color: #000;
    font-family: Quicksand,sans-serif;
    font-weight: 400
}

h1 {
    font-size: 1.875rem;
    font-weight: 300;
    line-height: 1.2;
    margin: 0 0 10px
}

@media screen and (min-width:640px) {
    h1 {
        font-size: 2.5rem;
        margin: 0 0 20px
    }
}

@media screen and (min-width:1024px) {
    h1 {
        font-size: 3.75rem
    }
}

h2 {
    font-size: 1.375rem;
    line-height: 1.2;
    margin: 0 0 20px
}

@media screen and (min-width:640px) {
    h2 {
        font-size: 1.5625rem
    }
}

@media screen and (min-width:1024px) {
    h2 {
        font-size: 1.875rem
    }
}

h3 {
    font-family: Open Sans,sans-serif;
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.5;
    font-weight: 800;
    margin: 0 0 20px
}

@media screen and (min-width:640px) {
    h3 {
        font-size: 1.25rem
    }
}

@media screen and (min-width:1024px) {
    h3 {
        font-size: 1.25rem
    }
}

a {
    color: #037c76;
    -webkit-transition: color .5s;
    transition: color .5s;
    text-decoration: underline
}

    a:focus, a:hover {
        color: #02635e;
        text-decoration: none
    }

p {
    font-family: Open Sans,sans-serif;
    font-size: 1.125rem;
    margin-bottom: 20px
}

    p.large-txt {
        font-size: 1.5rem
    }

.tooltip-icon {
    cursor: pointer
}

.icon {
    max-width: 25px
}

.header {
    background-color: #006d68
}

.header__content {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px
}

.branding {
    margin: 15px 0
}

.branding__logo {
    width: 150px;
    height: 31px;
    display: block
}

@media screen and (min-width:640px) {
    .branding__logo {
        width: 255px;
        height: 50px;
        padding-bottom: 5px;
    }
}

.navigation-toggle {
    background-color: transparent;
    border: none;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-weight: 800;
    line-height: 1;
    padding: 15px 0
}

@media screen and (min-width:640px) {
    .navigation-toggle {
        display: none
    }
}

.navigation-toggle__icon {
    width: 30px;
    height: auto;
    margin-right: 5px
}

.navigation {
    display: none
}

@media screen and (min-width:640px) {
    .navigation {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

.navigation a {
    color: #fff;
    display: block;
    font-weight: 800;
    padding: 30px 15px 26px;
    -webkit-transition: background-color .5s;
    transition: background-color .5s;
    text-decoration: none
}

    .navigation a:focus, .navigation a:hover {
        background-color: #005e59;
        color: #e6e6e6;
        text-decoration: none
    }

.navigation button {
    background-color: transparent;
    border: none;
    color: #fff;
    display: block;
    font-weight: 800;
    padding: 30px 15px;
    -webkit-transition: background-color .5s;
    transition: background-color .5s
}

    .navigation button:focus, .navigation button:hover {
        background-color: #005e59;
        color: #e6e6e6
    }

.content {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;
    padding-bottom: 30px;
}

    .content.content--bg10 {
        min-height: 100vh;
    }

@media screen and (min-width:640px) {
    .content {
        padding-top: 25px;
        padding-bottom: 80px
    }
}

.content__header {
    margin: 0 15px 20px;
    text-align: center
}

    .content__header :last-child {
        margin-bottom: 0
    }

@media screen and (min-width:640px) {
    .content__header {
        margin-bottom: 45px
    }
}

.content--bg01 {
    background-color: #037c76
}

@media screen and (min-width:1024px) {
    .content--bg01 {
        background-image: url(../images/bg-01.jpg)
    }

    .content--bg10 {
        background-image: url(../images/lingit-background@2x.png)
    }
}

.content--bg01 h1, .content--bg01 h2, .content--bg01 h3, .content--bg01 h4, .content--bg01 h5, .content--bg01 h6 {
    color: #fff
}

@media screen and (min-width:1024px) {
    .content--bg01 h1, .content--bg01 h2, .content--bg01 h3, .content--bg01 h4, .content--bg01 h5, .content--bg01 h6 {
        color: #000
    }
}

.content--bg02 {
    background-color: #037c76
}

@media screen and (min-width:1024px) {
    .content--bg02 {
        background-image: url(../images/bg-02.jpg)
    }
}

.content--bg02 h1, .content--bg02 h2, .content--bg02 h3, .content--bg02 h4, .content--bg02 h5, .content--bg02 h6 {
    color: #fff
}

@media screen and (min-width:1024px) {
    .content--bg02 h1, .content--bg02 h2, .content--bg02 h3, .content--bg02 h4, .content--bg02 h5, .content--bg02 h6 {
        color: #000
    }
}

.content--bg03 {
    background-color: #037c76
}

@media screen and (min-width:1024px) {
    .content--bg03 {
        background-image: url(../images/bg-03.jpg)
    }
}

.content--bg03 h1, .content--bg03 h2, .content--bg03 h3, .content--bg03 h4, .content--bg03 h5, .content--bg03 h6 {
    color: #fff
}

@media screen and (min-width:1024px) {
    .content--bg03 h1, .content--bg03 h2, .content--bg03 h3, .content--bg03 h4, .content--bg03 h5, .content--bg03 h6 {
        color: #000
    }
}

.section {
    border-bottom: 1px solid #707070;
    margin: 0 15px 30px;
    max-width: 1024px;
    padding-bottom: 30px
}

@media screen and (min-width:640px) {
    .section {
        margin-bottom: 50px;
        padding-bottom: 50px
    }
}

@media screen and (min-width:1024px) {
    .section {
        margin-left: auto;
        margin-right: auto
    }
}

.section:last-of-type {
    border-bottom: none
}

.section--center {
    text-align: center
}

.panel {
    background-color: #037c76;
    border: none;
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 auto;
    max-width: 640px;
    min-height: 400px;
    width: 100%
}

    .panel a {
        color: #f3ff00
    }

        .panel a:focus, .panel a:hover {
            color: #dbe600
        }

.panel__content {
    margin: 0 15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0;
    width: 100%
}

@media screen and (min-width:1024px) {
    .panel__content {
        padding: 70px 50px
    }
}

.panel__content--center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.panel__content h1, .panel__content h2, .panel__content h3, .panel__content h4, .panel__content h5, .panel__content h6 {
    color: #fff
}

.panel__sidebar {
    background-color: #006d68;
    padding: 30px;
    display: none;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 0%;
    flex: 1 1 0%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media screen and (min-width:1024px) {
    .panel__sidebar {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

.panel__illustration {
    display: block;
    width: 140%;
    height: auto;
    margin-left: -30%
}

.login .panel__illustration,
.activation .panel__illustration{
    display: block;
    width: 110%;
    margin-left: -7%
}

.login .panel__illustration{
    height: 75%;
}

.activation .panel__illustration {
    height: 85%;
}

.panel--wide {
    max-width: 1005px
}

    .panel--wide .panel__content {
        -webkit-box-flex: 1.45;
        -ms-flex: 1.45;
        flex: 1.45
    }

.form {
    font-family: Open Sans,sans-serif;
    width: 100%
}

.form__header {
    margin-bottom: 40px;
    text-align: center
}

.form__title {
    color: #fff;
    margin-bottom: 10px
}

.form__description {
    color: #fff;
    font-size: 1.125rem;
    font-family: Open Sans,sans-serif;
    font-weight: 400;
    margin-bottom: 20px
}

.form__description--center {
    text-align: center
}

.form__illustration {
    display: block;
    height: auto;
    max-width: 125px;
    margin: 0 auto 20px
}

.form__separator {
    border: 1px solid #5cb8b2;
    margin: 40px 0
}

.form__spacer {
    display: inline-block;
    width: 15px
}

.form__footer {
    text-align: center
}

    .form__footer h1, .form__footer h2, .form__footer h3, .form__footer h4, .form__footer h5, .form__footer h6 {
        color: #fff
    }

.form__row {
    display: block;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media screen and (min-width:640px) {
    .form__row {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

.form__row--center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

@supports (justify-content:flex-end) {
    .form__row--right {
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end
    }
}

.form__row--submit {
    margin: 20px 0
}

.form__row--space-between {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.form__row--inline {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

    .form__row--inline .label {
        margin: 0 15px 0 0;
        -webkit-box-flex: 0;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto
    }

    .form__row--inline input:not([type=checkbox]):not([type=submit]) {
        margin: 0 15px 0 0;
        max-width: 360px
    }

input:not([type=checkbox]):not([type=submit]) {
    background-color: #fff;
    border: 1px solid #006d68;
    border-radius: 4px;
    color: #000;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 0%;
    flex: 1 1 0%;
    font-size: 1.125rem;
    line-height: 1;
    margin-bottom: 20px;
    padding: 11px 15px;
    width: 100%
}

@media screen and (min-width:640px) {
    input:not([type=checkbox]):not([type=submit]) {
        margin-bottom: 10px
    }
}

input:not([type=checkbox]):not([type=submit])::-webkit-input-placeholder {
    color: #707070
}

input:not([type=checkbox]):not([type=submit])::-moz-placeholder {
    color: #707070
}

input:not([type=checkbox]):not([type=submit]):-ms-input-placeholder {
    color: #707070
}

input:not([type=checkbox]):not([type=submit]):-moz-placeholder {
    color: #707070
}

input:not([type=checkbox]):not([type=submit]).input--readonly, input[readonly=readonly]:not([type=checkbox]):not([type=submit]) {
    background-color: transparent;
    border-color: transparent;
    color: #fff;
    padding-left: 0;
    padding-right: 0
}


input[type=checkbox] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0
}

    input[type=checkbox] ~ label:after {
        content: none
    }

    input[type=checkbox]:checked ~ label:after {
        content: ""
    }

    input[type=checkbox]:focus ~ label:before {
        outline: 5px auto #3b99fc
    }

.label {
    display: block;
    font-size: 1.125rem;
    font-weight: 400;
    margin: 0 5px 10px 0;
    padding: 0;
    text-align: left;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 150px;
    flex: 0 0 150px;
    white-space: inherit
}

.label--checkbox {
    cursor: pointer;
    margin: 10px 0 3px 40px;
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 0%;
    flex: 1 1 0%
}

@media screen and (min-width:640px) {
    .label--checkbox {
        margin: 10px 0 3px 195px
    }
}

.label--checkbox:after, .label--checkbox:before {
    position: absolute
}

.label--checkbox:before {
    content: "";
    background-color: #fff;
    border: 1px solid #006d68;
    border-radius: 6px;
    display: inline-block;
    height: 30px;
    width: 30px;
    top: 6px;
    left: -40px
}

.label--checkbox:after {
    border-bottom: 4px solid #037c76;
    border-right: 4px solid #037c76;
    display: inline-block;
    height: 16px;
    width: 11px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    cursor: pointer;
    top: 11px;
    left: -30px
}

.label--hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0
}

/*
.input-validation-error:not([type=checkbox]):not([type=submit]), .input-validation-error[type=checkbox] + label:before {
    background-color: #ffc2a4
}
*/

.validation-msg {
    display: block;
    font-size: .8125rem;
    text-align: left;
    width: 100%
}

    .validation-msg span {
        display: inline-block;
        background-color: #d61814;
        color: #fff;
        margin-bottom: 10px;
        padding: 6px 15px;
        width: 100%;
        border-radius: 2px
    }

.validation-summary {
    background-color: #d61814;
    color: #fff;
    padding: 30px 30px 25px;
    margin: 20px 0
}

.validation {
    display: none;
    text-align: center;
    margin: 40px 0
}

.validation--has-errors {
    display: block
}

.validation__illustration {
    margin-bottom: 25px;
    max-width: 500px
}

.validation__header {
    font-size: 1.375rem;
    font-family: Quicksand,sans-serif;
    text-transform: uppercase;
    margin-bottom: 10px
}

.validation-summary-errors ul li {
    list-style-type: none;
}

@media screen and (min-width:1024px) {
    .validation__header {
        font-size: 1.875rem
    }
}

.validation__content {
    font-size: 1.125rem
}

.success {
    color: #ff621a;
    margin: 20px 0;
    width: 100%;
    text-align: center;
    max-width: 520px
}

@media screen and (min-width:640px) {
    .success {
        margin: 40px 0
    }
}

.success__icon {
    margin-bottom: 10px
}

@media screen and (min-width:640px) {
    .success__icon {
        margin-bottom: 25px
    }
}

.success__message {
    color: #ff621a;
    font-size: 1.375rem;
    font-family: Quicksand,sans-serif;
    margin-bottom: 10px
}

@media screen and (min-width:640px) {
    .success__message {
        font-size: 1.875rem
    }
}

.button {
    background-color: transparent;
    border: 3px solid #5cb8b2;
    border-radius: 4px;
    color: inherit;
    display: inline-block;
    font-size: 1rem;
    line-height: 1;
    margin: 0;
    padding: 12px 56px;
    text-transform: uppercase;
    text-decoration: none;
    -webkit-transition: background-color .5s,color .5s;
    transition: background-color .5s,color .5s;
}

.button--brand {
    width: 170px;
    height: 48px;
    color: #000000;
    background-color: #FFFFFF;
    border-radius: 4px;
    display: inline-block;
    line-height: 1;
    margin: 0;
    padding: 12px 36px;
}

.button-a-before-b {
    margin-right: 15px;
}

#button--brand-feide, #button--brand-apple, #button--brand-google {
    width: 140px;
    text-decoration: none;
    color: #000000;
}

@media screen and (min-width:640px) {
    .button {
        font-size: 1.125rem
    }
}

.button:not(:last-of-type) {
    margin-right: 15px
}

.button--brand:not(:last-of-type) {
    margin-right: 15px
}

.button:active, .button:hover {
    -webkit-box-shadow: 0 0 0 1px #5cb8b2;
    box-shadow: 0 0 0 1px #5cb8b2;
    text-decoration: none;
    color: inherit
}

.button--button-dark, .button:active, .button:hover {
    background-color: rgba(0,0,0,.2)
}

    .button--button-dark:hover {
        background-color: rgba(0,0,0,.5)
    }


.button--wide {
    padding-left: 70px;
    padding-right: 70px
}

.button--xtra-wide {
    padding-left: 96px;
    padding-right: 96px
}

.button--submit {
    margin-top: 20px;
    margin-bottom: 20px
}


.button--google {
    font-family: Roboto, serif; 
}

.button--rounded {
    border-radius: 999px;
    font-size: .75rem;
    padding: 10px 28px
}

@media screen and (min-width:1024px) {
    .button--rounded {
        font-size: .9375rem
    }
}

.button--fixed {
    padding: 15px;
    min-width: 200px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.brand--icon {
    display: inline-flex;
    flex-wrap: nowrap;
    margin-left: -32px;
    margin-right: 8px;
    margin-top: -7px;
}

.footer {
    background-color: #006d68;
    color: #fff;
    font-family: Open Sans,sans-serif;
    font-size: .875rem;
    padding: 40px 0
}

@media screen and (min-width:1024px) {
    .footer {
        border-top: 8px solid #5cb8b2
    }
}

.footer a {
    color: #f3ff00;
    font-weight: 700
}

    .footer a:focus, .footer a:hover {
        color: #dbe600
    }

.footer__content {
    text-align: center;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px
}

    .footer__content div {
        margin: 20px 0
    }

@media screen and (min-width:640px) {
    .footer__content {
        text-align: left;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

        .footer__content div {
            margin: 0
        }
}

.product-panel {
    background-color: #f7f7f7;
    margin-bottom: 40px;
    padding: 15px
}

@media screen and (min-width:1024px) {
    .product-panel {
        padding: 40px;
        margin-bottom: 50px
    }
}

.product-activation {
    background-color: #006d68;
    padding: 15px;
    margin: 0 15px 20px
}

@media screen and (min-width:1024px) {
    .product-activation {
        padding: 40px;
        margin: 0 40px 40px
    }
}

.product-activation__content {
    color: #fff;
    max-width: 1024px;
    margin: 0 auto;
    text-align: center
}

.product-activation__title {
    color: #fff;
    text-transform: uppercase;
    margin-bottom: 40px
}

.active-products {
    width: 100%;
    margin-bottom: 40px
}

@media screen and (min-width:1024px) {
    .active-products {
        margin-bottom: 70px
    }
}

.active-products__title {
    text-align: center
}

.active-products__no-products {
    font-size: 1.25rem;
    text-align: center;
    margin: 40px auto
}

.available-products {
    width: 100%;
    margin-bottom: 40px
}

@media screen and (min-width:1024px) {
    .available-products {
        margin-bottom: 70px
    }
}

.expired-products {
    width: 100%;
    margin-bottom: 70px
}

.expired-products__title {
    text-align: center
}

.product-table {
    font-family: Open Sans,sans-serif;
    font-size: .875rem;
    margin-bottom: 20px
}

@media screen and (min-width:1024px) {
    .product-table {
        font-size: 1.125rem;
        margin-bottom: 40px
    }
}

.product-table__header {
    font-size: 1rem;
    font-weight: 700;
    display: block
}

@media screen and (min-width:640px) {
    .product-table__header {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

@media screen and (min-width:1024px) {
    .product-table__header {
        font-size: 1.25rem
    }
}

.product-table__row {
    display: block;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-top: 1px solid #c9c9c9
}

@media screen and (min-width:640px) {
    .product-table__row {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        word-break: break-word;
    }
}

.product-table__row:last-of-type {
    border-bottom: 1px solid #c9c9c9
}

.product-table__row--parent {
    background-color: #e2e2e2;
    cursor: pointer
}

    .product-table__row--parent > :first-child {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

        .product-table__row--parent > :first-child:before {
            content: "";
            background-image: url(../images/icon-chevron-right.svg);
            background-repeat: no-repeat;
            background-size: 10px;
            background-position: 50%;
            display: block;
            margin-right: 10px;
            height: 20px;
            width: 20px;
            -webkit-transition: -webkit-transform ease-in-nnout 1s;
            transition: -webkit-transform ease-in-nnout 1s;
            transition: transform ease-in-nnout 1s;
            transition: transform ease-in-nnout 1s,-webkit-transform ease-in-nnout 1s
        }

    .product-table__row--parent.active > :first-child:before {
        -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        transform: rotate(90deg)
    }

.product-table__row--child > :first-child {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

    .product-table__row--child > :first-child:before {
        content: "\2014";
        color: #707070;
        margin: 0 10px 0 20px
    }

.product-table__row--white-bg {
    background-color: #fff
}

.product-table__row--disabled {
    color: #a3a3a3
}

.product-table__column {
    padding: 10px 5px;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 0px;
    flex: 1 1 0;
    text-align: center
}

@media screen and (min-width:1024px) {
    .product-table__column {
        padding: 15px 20px
    }
}

@media screen and (min-width:640px) {
    .product-table__column:first-of-type {
        text-align: left;
        -webkit-box-flex: 1.5;
        -ms-flex: 1.5 1 0px;
        flex: 1.5 1 0
    }
}

.product-table__column--bold {
    font-weight: 700
}

.link-accounts {
    text-align: center;
    margin: 0 15px
}

.connected-accounts {
    background-color: #f7f7f7;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 45px;
    padding: 30px 15px 0px;
    width: 100%
}

.connected-accounts__title {
    font-family: Quicksand,sans-serif;
    font-weight: 400
}

.connected-accounts__list {
    background-color: #fff;
    font-family: Open Sans,sans-serif;
    font-size: 1.125rem;
    list-style: none;
    margin-top: 10px;
    margin-bottom: 20px;
    max-width: 640px;
    padding: 0;
    width: 100%
}

@media screen and (min-width:640px) {
    .connected-accounts__list {
        margin-bottom: 60px
    }
}

.connected-accounts__list-item {
    border-top: 1px solid #707070;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 10px 20px
}

    .connected-accounts__list-item:last-of-type {
        border-bottom: 1px solid #707070
    }

.connected-accounts__provider {
    font-weight: 700;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 0%;
    flex: 1 1 0%
}

.manage-account {
    font-size: 1.125rem;
    margin: 0 15px 150px;
    width: 100%
}

.manage-account__list {
    list-style: none;
    margin: 0 auto;
    max-width: 640px;
    padding: 0;
    width: 100%
}

.manage-account__list-item {
    background-color: #f7f7f7;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 10px;
    padding: 13px 25px
}

.manage-account__label {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 0%;
    flex: 1 1 0%;
    font-family: Open Sans,sans-serif;
    font-weight: 700
}

.manage-account__amount {
    font-weight: 400
}


/*     !!!  NB !!!         */
/*                         */
/*     Lingit adjustments           */
/*     Add changes to design below  */

.product-table__row--standalone {
    background-color: #e2e2e2;
}

.active-products img.validation__illustration {
    max-height: 40px;
}

.validation {
    display: block;
}

.validation-summary-valid {
    display: none;
}

.success {
    display: none;
}

    .success.active {
        display: block;
    }
/*
h1 {
    white-space: nowrap;
}
*/
.section .section__ingress p {
    font-weight: bold;
}


.success__message__info {
    font-size: 1.375rem;
    color: #333;
}

    .success__message__info .email {
        font-style: italic;
    }

/* -- Spinner -- */
/* -- Overlay and spinner img on submit -- */

.overlayRelative {
    position: relative;
}

.overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    min-height: 130px;
    max-height: 240px;
    background: url("../images/Spinner-3s-150px.svg") no-repeat center;
    top: 8px;
}

.product-table .overlay {
    min-height: 0;
    top: 0;
    background: url("../images/Spinner-3s-100px.svg") no-repeat center;
}

.infoMessage {
    padding: 7px 0;
    margin: 0 10px 40px;
}

.infoMessage__center {
    padding: 7px 0;
    margin: 40px 10px;
}

.infoMessage__left {
    padding: 7px 0;
    margin: 20px 100px;
    text-align: left;
}

.infoMessage .validation {
        margin: 5px 0;
        max-width: 1024px;
        margin-left: auto;
        margin-right: auto;
    }

    .infoMessage .validation__illustration {
        margin-bottom: 10px;
    }

.panel a.inheritColor {
    color: inherit;
    text-decoration: none;
}

#validationSummary.validation ul li {
    list-style-type: none;
}


/* Flags for demo selections */
div.DemoSelection div.flag.NOR {
    background-image: url('../images/flags/no.svg')
}

div.DemoSelection div.flag.ENG {
    background-image: url('../images/flags/gb.svg')
}

div.DemoSelection div.flag.PROGRAMPAKKETYSK,
div.DemoSelection div.flag.TEXTPILOTTYSKSPRKPAKKE,
div.DemoSelection div.flag.LINGDYSTYSK,
div.DemoSelection div.flag.LINGDYSFORMACTYSK,
div.DemoSelection div.flag.LINGDYSCHROMETYSK {
    background-image: url('../images/flags/de.svg')
}

div.DemoSelection div.flag.PROGRAMPAKKESPANSK,
div.DemoSelection div.flag.TEXTPILOTSPANSKSPRKPAKKE,
div.DemoSelection div.flag.LINGDYSSPANSK,
div.DemoSelection div.flag.LINGDYSFORMACSPANSK,
div.DemoSelection div.flag.LINGDYSCHROMESPANSK {
    background-image: url('../images/flags/es.svg')
}

div.DemoSelection div.flag.PROGRAMPAKKEFRANSKSPRKPAKKE,
div.DemoSelection div.flag.TEXTPILOTFRANSKSPRKPAKKE,
div.DemoSelection div.flag.LINGDYSFRANSK,
div.DemoSelection div.flag.LINGDYSFORMACFRANSK,
div.DemoSelection div.flag.LINGDYSCHROMEFRANSK {
    background-image: url('../images/flags/fr.svg')
}

/* -- CSS from Smart Media regarding startupwizard in browser -- */
/* -- 20200401  -- */


#StartupWizardWrapper {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

    #StartupWizardWrapper h2 {
        font-family: "Quicksand", sans-serif;
        width: 100%;
        text-align: center;
        margin-bottom: 50px;
    }

    #StartupWizardWrapper a {
        color: #F3FF00;
    }

#DemoStep2 #DemoStep2Form {
    width: 100%;
    font-family: "Quicksand", sans-serif;
}

    #DemoStep2 #DemoStep2Form select {
        height: 48px;
        max-width: 100%;
        width: 100%;
        font-size: 18px;
    }

        #DemoStep2 #DemoStep2Form select::-webkit-input-placeholder {
            text-align: center;
        }

        #DemoStep2 #DemoStep2Form select::-moz-placeholder {
            text-align: center;
        }

        #DemoStep2 #DemoStep2Form select:-ms-input-placeholder {
            text-align: center;
        }

        #DemoStep2 #DemoStep2Form select::-ms-input-placeholder {
            text-align: center;
        }

        #DemoStep2 #DemoStep2Form select::placeholder {
            text-align: center;
        }

    #DemoStep2 #DemoStep2Form label {
        padding: 0;
    }

        #DemoStep2 #DemoStep2Form label:first-child {
            padding-left: 15px;
        }

#DemoStep2Form {
    background-color: #037C76;
    padding: 0;
    box-sizing: border-box;
    max-width: 1182px;
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
}

    #DemoStep2Form .text-danger,
    #SchemaFormID .text-danger {
        padding: 0;
    }

        #DemoStep2Form .text-danger *,
        #SchemaFormID .text-danger * {
            padding: 0;
            width: 100%;
            flex: 0 0 100%;
            color: white;
        }

    #DemoStep2Form select,
    #SchemaFormID select {
        height: 48px;
    }

    #DemoStep2Form input input-validation-error {
        background-color: white;
        border-color: red;
    }

    #DemoStep2Form .DemoSelection {
        flex: 0 0 25%;
        background-color: #006D68;
        padding: 20px;
        box-sizing: border-box;
    }

        #DemoStep2Form .DemoSelection label:first-child {
            margin: 0 auto;
            margin-bottom: 25px;
            font-size: 18px;
            text-align: center;
        }

        #DemoStep2Form .DemoSelection input {
            display: none;
        }

        #DemoStep2Form .DemoSelection .label.label--checkbox {
            margin: 0 0 30px 45px;
        }

            #DemoStep2Form .DemoSelection .label.label--checkbox::before {
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                display: inline-block;
            }

            #DemoStep2Form .DemoSelection .label.label--checkbox::after {
                position: absolute;
                top: auto;
                bottom: 19px;
            }


    #DemoStep2Form .DemoSelection_Inputs {
        flex: 0 0 75%;
        padding-left: 15px;
    }

        #DemoStep2Form .DemoSelection_Inputs .checkbox {
            text-align: right;
        }

    #DemoStep2Form .form-group:nth-child(odd) {
        margin-bottom: 0;
    }

    #DemoStep2Form .DemoSelection .form-group * {
        flex: 0 0 100%;
    }

    #DemoStep2Form .DemoSelection .form-group label {
        padding: 0;
    }

        #DemoStep2Form .DemoSelection .form-group label:first-child {
            padding-left: 0;
            max-width: 146px;
            margin: 0 auto;
            margin-bottom: 20px;
        }

    #DemoStep2Form .DemoSelection .flag {
        background-size: cover;
        background-position: center;
        width: 50px;
        height: 50px;
        border-radius: 50%;
        display: inline-block;
    }

    #DemoStep2Form .DemoSelection ul li {
        width: 100%;
    }

    #DemoStep2Form .DemoSelection ul {
        padding: 0;
        list-style: none
    }


        #DemoStep2Form .DemoSelection ul li label {
            display: flex;
            vertical-align: middle;
            align-items: center;
            margin-bottom: 20px;
            border: none;
        }

    #DemoStep2Form .DemoSelection span {
        display: inline-block;
        font-size: 18px;
        margin-left: 15px;
    }

.form-group {
    display: flex;
}

    .form-group * {
        flex: 0 0 50%;
        padding: 0 30px;
    }

#StartupWizardWrapper .form-group {
    margin: 0;
    font-size: 18px;
}

    #StartupWizardWrapper .form-group:nth-child(odd) {
        margin-bottom: 5px;
    }

    #StartupWizardWrapper .form-group:nth-child(even) {
        margin-bottom: 20px;
    }

#DemoStep2Form .DemoSelection_Inputs .form-submit-container {
    width: auto;
    font-size: 18px;
    vertical-align: middle;
    align-items: center;
    text-align: right;
}

#StartupWizardWrapper .form-submit-container :checked + label:before {
    flex: 30px 0 0;
    content: " ";
    background-image: url("images/checked.png");
    background-size: cover;
    background-position: center;
    background-color: transparent;
    width: 30px;
    height: 30px;
    border-radius: 0;
    border: none;
    position: relative;
    display: inline-block;
    transform: none;
    margin-right: 15px;
    margin-top: 5px;
}

#StartupWizardWrapper .form-submit-container label {
    display: flex;
    vertical-align: middle;
    align-items: center;
    flex: 1 0 0;
    text-align: right;
    cursor: pointer;
}

    #StartupWizardWrapper .form-submit-container label a {
        margin-left: 5px;
    }

.form-submit-container .label--checkbox {
    margin: 0 0 0 45px;
    display: inline;
    padding-right: 20px;
}



#StartupWizardWrapper .form-submit-container label:before {
    flex: 30px 0 0;
    content: " ";
    background-image: url("images/unchecked.png");
    background-size: cover;
    background-position: center;
    background-color: transparent;
    width: 30px;
    height: 30px;
    border-radius: 0;
    border: none;
    position: relative;
    display: inline-block;
    transform: none;
    margin-right: 15px;
    margin-top: 5px;
    margin-left: auto;
}

#StartupWizardWrapper .form-submit-container input[type=checkbox] {
    visibility: hidden;
}

#StartupWizardWrapper .form-submit-container button {
    background-color: #02635E;
    padding: 12px 35px;
    font-size: 18px;
    border: solid 3px #5cb8b2;
    margin-left: 15px;
    transition: all 0.2s;
}

    #StartupWizardWrapper .form-submit-container button:hover {
        background-color: #054b47;
    }

.form-group input {
    height: 48px;
    max-width: 100%;
    width: 100%;
    padding: 0 15px;
    font-size: 18px;
}

#DemoDiv {
    width: 330px;
    float: right;
    padding: 50px 40px 190px 45px;
}

    #DemoDiv:before {
        display: block;
        content: " ";
        width: 200px;
        height: 200px;
        margin: 0 auto 20px;
        background-image: url("../images/texthelper_download.svg");
        background-size: auto;
        background-position: center center;
        background-repeat: no-repeat;
    }

    #DemoDiv .button--submit {
        margin-top: 61px;
        margin-bottom: 20px
    }

@media screen and (max-width:1000px) {
    #DemoStep2Form .DemoSelection {
        flex: 0 0 100%;
        text-align: center;
    }

        #DemoStep2Form .DemoSelection ul li {
            max-width: 200px;
            margin: 0 auto;
        }

    #DemoStep2Form .DemoSelection_Inputs {
        flex: 0 0 100%;
        padding-left: 0;
        padding: 40px 0 0 0;
    }

    .content {
        padding: 0;
    }

        .content .panel.panel--wide {
            padding: 0;
            padding-top: 40px;
        }

    .form-group input:nth-child(odd) {
        margin-bottom: 10px;
    }

    .form-group * {
        padding: 0 5px;
    }

    #DemoStep2Form .DemoSelection_Inputs .form-submit-container {
        text-align: center;
    }

    .form-submit-container button {
        margin: 20px auto 40px;
        display: block;
    }

    .textpilot_1 .panel,
    .lingdys_1 .panel,
    .LINGDYSCHROME .panel {
        flex-wrap: wrap;
    }

    .textpilot_1 .panel__sidebar,
    .lingdys_1 .panel__sidebar,
    .LINGDYSCHROME .panel__sidebar {
        display: block;
        flex: 0 0 100%;
    }

    .textpilot_1 #DemoDiv,
    .lingdys_1 #DemoDiv,
    .LINGDYSCHROME #DemoDiv {
        margin: 0 auto;
        width: 100%;
    }
}

.textpilot_1 #DemoDiv #demoBtn,
.lingdys_1 #DemoDiv #demoBtn,
.LINGDYSCHROME #DemoDiv #demoBtn {
    padding: 12px;
    margin-bottom: 5px;
}

/* -- tooltips -- */

.lingit-tooltip + .tooltip > div {
    background-color: #006d68;
}

.lingit-tooltip + .tooltip > div {
    border: 2px solid #5cb8b2;
    border-radius: 10px;
}
/* -- Hide FEIDE for demo -- */
.externalProvider[provider="FEIDE"],
.externalProvider[provider="FEIDE2"],
.externalProvider[provider="FEIDE2-SKOLE"] {
    display: none;
}

/* -- Misc -- */

input#postNumber[type=number] {
    -moz-appearance: textfield;
}

    input#postNumber[type=number]::-webkit-outer-spin-button,
    input#postNumber[type=number]::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

.missingEmail,
.infoMessageRenewal {
    margin: 0 40px 40px;
}

    .missingEmail img,
    .infoMessageRenewal img {
        max-width: 250px;
        margin-bottom: 10px;
    }

    .missingEmail .validation,
    .infoMessageRenewal .validation {
        margin: 10px 0;
    }

    .missingEmail .validation__header,
    .infoMessageRenewal .validation__header {
        font-size: 1.25rem;
    }

    .missingEmail .validation__content,
    .infoMessageRenewal .validation__content {
        font-size: 1.00rem;
    }

.connected-accounts .connected-accounts__list-item .button {
    min-width: 190px;
    margin-right: 0px;
    margin-left: 25px;
    padding-left: 10px;
    padding-right: 10px;
    text-align: center;
}

.connected-accounts__list-item {
    min-height: 65px;
}

.connected-accounts__list {
    max-width: 840px;
}

input#postNumber[type=number]::-webkit-outer-spin-button,
input#postNumber[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}


/* Adjustment popup / width > 1024 */

@media screen and (min-width:1024px) {
    .popup .panel__sidebar {
        display: none
    }

    .popup {
        max-width: 900px;
    }

        .popup .panel__content .input {
            max-width: 500px;
            margin: 0 auto;
        }

        .popup .panel__content {
            padding-top: 10px;
            padding-bottom: 10px;
        }

        .popup #demoMessage2.validation {
            margin-top: 20px;
            margin-bottom: 20px;
        }

        .popup .form__separator {
            margin-top: 15px;
            margin-bottom: 30px;
        }
}

h2.connected-acounts__title + p {
    max-width: 1000px;
    text-align: center;
}

.errorpage {
    max-width: 1000px;
    text-align: center;
    margin: auto;
}

    .errorpage .validation__illustration {
        margin-bottom: 25px;
    }

    .errorpage hr {
        margin: 50px;
    }

/* Renewal tutor license */

@media screen and (min-width:1024px) {
    .product-table__column.renewalLicense {
        padding: 4px 20px
    }
}

.renewalLicense .button {
    padding: 9px 45px;
    text-transform: none;
    color: #333;
}

#renewalOfLicense .panel--wide {
    max-width: 1025px;
}

#renewalOfLicense .form-group * {
    padding: 0 20px;
}

#renewalOfLicense .form-group select {
    margin-bottom: 15px;
}

#renewalOfLicense .form-group div {
    padding-right: 50px;
}

#renewalOfLicense .panel__content {
    padding-top: 40px;
}


#renewalOfLicense .form-group.oneLine * {
    flex: 0 0 100%;
}

/* School server in the cloud */

@media screen and (min-width:640px) {
    .user-table .product-table__column {
        -webkit-box-flex: 1.0;
        -ms-flex: 1.0 1 0px;
        flex: 1.0 1 0;
        min-height: 0;
        min-width: 0;
    }

    .product-panel.schoolOrg,
    .product-panel.availableProducts {
        margin-left: auto;
        margin-right: auto;
    }

    .product-panel.schoolOrg {
        max-width: 1000px;
    }

        .product-panel.schoolOrg .button,
        .product-panel.availableProducts .button {
            min-width: 150px;
            padding-left: 5px;
            padding-right: 5px;
        }
}

@media screen and (min-width:1024px) {

    .schoolOrg .product-table__column.actionColumn {
        -webkit-box-flex: 0.7;
        -ms-flex: 0.7 1 0px;
        flex: 0.7 1 0;
        text-align: center
    }
}

.defaultSchoolDomain {
    font-style: italic;
    font-weight: bold;
}

.schoolOrg .actionColumn .button {
    text-align: center;
}

.button[type=submit]:disabled {
    color: #a3a3a3;
}

.button[type=submit]:hover:disabled {
    background-color: #f7f7f7;
    -webkit-box-shadow: 0 0 0 0;
    box-shadow: 0 0 0 0;
}

.product-activation.subscription .form__row--inline input:not([type=checkbox]):not([type=submit]),
.product-activation.subscription .form__row--inline select {
    min-width: 250px;
    height: 49px;
    margin: 0 25px 0 0;
}

.product-activation.subscription .form__row.form__row--center {
    margin-top: 20px;
}

.product-table__column.triple-column {
    flex: 3.45;
}
/* adjustment terms and cond */
a.termsAndConditions {
    line-height: 1.4;
}

.oldFeide button,
.oldFeide a {
    background: none;
    border: none;
    font-size: 85%;
    text-decoration: underline;
    color: #d9dd8c;
    padding: 20px 0 0 0;
}

.oldFeide .lingit-tooltip {
    background: none;
    border: none;
    font-size: 85%;
    padding: 20px 0 0 5px;
    color: #d9dd8c;
}

.no-product-panel {
    background-color: #f7f7f7;
    padding: 3px;
    margin: 0px 15px 20px;
}

@media screen and (min-width:1024px) {
    .no-product-panel {
        padding: 5px;
        margin: 0px 40px 50px 40px;
    }
}

.navigation .activeTab {
    background-color: #005e59;
    border-bottom: 4px solid #5cb8b2;
}

/* Subscription adm stuff*/

.subscriptionAdmin {
    background-color: #f7f7f7;
    color: #333
}

.subscriptionAdmin {
    max-width: 800px;
    min-height: 400px;
}

    .subscriptionAdmin h1,
    .subscriptionAdmin h2,
    .subscriptionAdmin h3,
    .subscriptionAdmin h4,
    .subscriptionAdmin h5,
    .subscriptionAdmin h6,
    .subscriptionAdmin label,
    .panel.subscriptionAdmin a {
        color: #333
    }



    .subscriptionAdmin .panel__content {
        padding-bottom: 40px;
        padding-top: 30px;
    }

    .subscriptionAdmin label {
        flex: 0 0 200px;
    }

        .subscriptionAdmin label.schoolOrgName {
            flex: 0 0 300px;
        }

        .subscriptionAdmin label.label--checkbox {
            flex: 0 0 30px;
        }

    .subscriptionAdmin button {
        margin-left: 20px;
    }


    .subscriptionAdmin input[type="checkbox"] {
        position: inherit;
        height: 25px;
        width: 25px;
        margin-bottom: 10px;
    }

    .subscriptionAdmin .form__row_buttons {
        padding-top: 20px;
    }

    .subscriptionAdmin label span {
        padding-left: 25px;
    }

    .subscriptionAdmin .validation__illustration {
        margin-bottom: 10px;
        max-width: 60%;
    }

    .subscriptionAdmin .validation {
        margin-top: 0px;
        margin-bottom: 10px;
    }

.user-table .product-table__column {
    width: 16%;
}
    .user-table .product-table__column.actionColumn .button {
        padding-left: 10px;
        padding-right: 10px;
        min-width: 110px;
    }

.form_activationcode {
    margin: auto;
    min-width: 300px;
    font-size: 0.9em;
}

form.form_activationcode input[type=text] {
    float: left;
    width: 85%;
    font-size: 1.1em;
    border-radius: 6px 0 0 6px;
    border: 3px solid #5cb8b2;
    border-right: none;
}

    /*form.form_activationcode input[type=text]:focus {
        border: 3px solid #3b99fc;
        border-right: none;
    }

        form.form_activationcode input[type=text]:focus ~ button {
            border: 3px solid #3b99fc;
            border-left: none;
        }*/

    form.form_activationcode input[type=text]:focus + button {
        outline: 2px auto #0060DF;
        outline: 1px auto -webkit-focus-ring-color;
    }
form.form_activationcode button[type=submit] {
    float: left;
    width: 15%;
    padding: 7px 8px 10px 9px;
    background: #005e59;
    color: #fff;
    font-size: 17px;
    border: 3px solid #5cb8b2;
    border-left: none;
    cursor: pointer;
    border-radius: 0 6px 6px 0;
    font-weight: bold;
}

form.form_activationcode button:hover {
    background: #5cb8b2;
}

form.form_activationcode #validationSummary,
form.form_activationcode #infoSummary {
    position: fixed;
    top: 5%;
    left: 35%;
    background-color: #5cb8b2;
    border: 2px solid #005e59;
    border-radius: 5px;
    padding: 20px 40px 30px 40px;
    min-width: 30%;
    min-height: 250px;
}

    form.form_activationcode #validationSummary button,
    form.form_activationcode #infoSummary a {
        position: absolute;
        bottom: 10px;
        right: 10px;
        max-width: 75px;
        border: 3px solid #005e59;
        border-radius: 3px;
        float: left;
        width: 15%;
        padding: 8px 8px 10px 8px;
        background: #005e59;
        color: #fff;
        font-size: 17px;
        text-transform: none;
    }

.hideActivationValidationSummary {
    display: none;
}

/* RadioButton */
/* The radioButtoncontainer */
.radioButtonContainer {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default radio button */
.radioButtonContainer input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
    }

/* Create a custom radio button */
    .radioButtonContainer .checkmark {
        position: absolute;
        top: 0;
        left: -3px;
        height: 26px;
        width: 26px;
        background-color: white;
        border: 2px solid #8f8f9d;
        border-radius: 50%;
    }

/* On mouse-over, add a grey background color */
.radioButtonContainer:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
    .radioButtonContainer input:checked ~ .checkmark {
        background-color: #5cb8b2;
    }

/* Create the indicator (the dot/circle - hidden when not checked) */
.radioButtonContainer .checkmark:after {
        content: "";
        position: absolute;
        display: none;
    }

/* Show the indicator (dot/circle) when checked */
.radioButtonContainer input:checked ~ .checkmark:after {
    display: block;
}

/* Style the indicator (dot/circle) */
    .radioButtonContainer .checkmark:after {
        top: 7px;
        left: 8px;
        width: 9px;
        height: 8px;
        border-radius: 50%;
        background: white;
    }

/* Style of span label */
    .radioButtonContainer span.label {
        color: #333;
        margin-top: 3px;
        margin-bottom: 3px;
        padding-left: 13px;
    }

    /* Some extra space for role radiobutton div*/
.extraMarginDiv {
    margin-top: 10px;
}

/* Skriverammer / document templates*/



@media screen and (min-width:640px) {
    .document-Templates .product-table__column {
        text-align: left;
    }

    .document-Templates .product-table__column {
        text-align: left;
    }

    .document-Templates .product-table__row div:first-of-type {
        max-width: 20%;
    }
    .document-Templates .product-table__column.smallFlex {
        -webkit-box-flex: 0.2;
        -ms-flex: 0.2 1 0;
        flex: 0.2 1 0;
        max-width: 75px;
    }
        .document-Templates .product-table__column.smallFlex:last-child {
            padding-right: 100px;
        }
  }

img.wordDoc {
    content: url(../images/microsoft-office-word.png);
    width: 25px;
    max-width: 25px;
}

img.googleDoc {
    content: url(../images/google-docs.png);
    width: 25px;
    max-width: 25px;
}

.document-Templates .chooseLanguage select {
    margin-left: 20px;
    max-width: 250px;
    display: inline;
    border: 1px solid #5cb8b2;
    border-radius: 6px;
    min-height: 40px;
    font-size: 18px;
}

.document-Templates div.category {
    margin-top: 15px;
}

.document-Templates .product-table__row--standalone.category > :first-child:before {
    content: "";
    background-image: url(../images/icon-chevron-right.svg);
    height: 20px;
    width: 20px;
    margin-right: 10px;
    background-repeat: no-repeat;
    display: inline-flex;
}

.document-Templates .product-table__row--standalone.category > :first-child:before {
    content: "";
    background-image: url(../images/icon-chevron-right.svg);
    height: 20px;
    width: 20px;
    margin-right: 10px;
    background-repeat: no-repeat;
    display: inline-flex;
    padding-bottom: 2px;
}

.document-Templates .product-table__row--standalone.category.active > :first-child:before {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    padding-bottom: 9px;
}

.document-Templates .product-table__row.categoryChild {
    margin-left: 30px;
}

.document-Templates .categoryChilds div.categoryChild:first-child{
    border-top: none;
}

.document-Templates .categoryChilds div.categoryChild:last-child {
    border-bottom: none;
    padding-bottom: 20px;
}

.document-Templates .hideCategoryChild {
    display: none;
}

.validation.lessMarginOnMoreInfo {
    margin: 15px 0;
}

    .validation.lessMarginOnMoreInfo.moreInfoActivation {
        margin-bottom: 40px;
    }

/* iPad / LOSILINGDYS */

.LOSILINGDYS .button {
    text-transform: lowercase;
    height: 55px;
    padding-left: 45px;
    padding-right: 45px;
}

    .LOSILINGDYS .button:first-letter {
        text-transform: uppercase;
    }

    .LOSILINGDYS .button[value="Apple"] {
        color: transparent;
        background-image: url("../images/appleid_button@1x.png");
        background-repeat: no-repeat;
        -webkit-filter: brightness(90%);
        filter: brightness(90%);
    }

.LOSILINGDYS .label--checkbox::before {
    top: -7px;
}

.LOSILINGDYS .label--checkbox:after {
    top: -1px;
}