#row-1 #step-1 {
    background: url(/template/images/webshop/sprite_ordering.png) no-repeat -145px -65px;
    height: 30px;
    width: 40px;

}

#row-1 .form-type-radio {
    float: left;
    font-size: 1rem;
}

.form-type-radio label {
    font-size: 1rem;
}

#row-2 #step-2 {
    background: url(/template/images/webshop/sprite_ordering.png) no-repeat -145px -104px;
    height: 30px;
    width: 40px;

}

#box-1 {
    width: 198px;
    background: #f1f5f8;
    text-align: center;
    border-radius: 5px;
}

#box-header {
    font: 400 24px/48px 'Source Sans Pro', sans-serif;
    color: white;
    background-color: #5496bf;
    height: 50px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;

}

#box-amount {
    font: 200 40px/42px 'Source Sans Pro', sans-serif;
    color: #337aab;
    padding: 5px 0px 8px;
}

#box-amount-small {
    vertical-align: super;
    font-size: 22px;
}

.support {
    font: 600 16px/20px 'Source Sans Pro', sans-serif;
    color: #337aab;
    padding: 0;
}

.all-plans-link a {
    text-decoration: underline;
    font-size: 0.875rem;
}

h2.subscriptions-header {
    font-size: 2.25rem;
    line-height: 2.6rem;
}

.subscriptions-table td {
    padding: 0 !important;
}

.best-value {
    color: #FF6600;
    font-weight: 700;
}

.duration-radio {
    margin-right: 0.6rem;
}

.subscriptions-logo-columns {
    background-color: #F5F9FB;
    padding: 10px 20px 10px 20px;
    text-align: center;
}

.package-select {
    background-color: #ffffff;
}

.JE-home .package-select {
    background-color: #FFFFFFF;
}

.orderform h2 {
    font-size: 1.3rem;
    font-weight: 500;
}

div.orderform {
    padding-bottom: 12rem;
}

.steps {
    display: inline-block;
    width: 30px;
    margin: 0.5rem 0 0.2rem 0;
    color: #377aab;
    font-size: 1.3rem;
    font-weight: 500;
}


/* Tweede pakketkiezer */

.steps-round {
    display: inline-block;
    width: 30px;
    height: 30px;
    border-radius: 15px;
    background-color: #59aedd;
    text-align: center;
    color: #fff;
    font-weight: 900;
    font-size: 1.3rem;
    margin-right: 0.5rem;


}

.steps-round-label {
    display: inline-block;
    height: 30px;
    padding-top: 5px;
    font-weight: 600;
    color: #64B7E1;
    font-size: 1.3rem;
}

.runtime-select-box {
    background: url(/template/images/subscriptions/runtime-select-bg.svg) no-repeat;
    background-size: 669px 433px;
    border-radius: 8px;
    height: 165px;
    text-align: center;
    display: block;
    position: relative;
    padding-top: 7px;
    margin-right: 1rem;
    /* border: 1px dotted #64B7E1; */
}

.subscription-select-box {
    background-color: #c5e1f0;
    border-radius: 8px;
    position: relative;
    margin-bottom: 1rem;
    color: #5D5D5D;
    font-size: 18px;
    padding: 0.5rem;
    transition: background-color 0.3s ease;
}

.subscription-select-box:hover {
    cursor: pointer;
}

.subscription-select-box:before {
    content: '';
    position: absolute;
    top: 0.5rem;
    left: 0.5rem;
    width: 25px;
    height: 25px;
    background-color: white;
    border-radius: 4px;
}

.subscription-select-box:after {
    content: '';
    background-image: url('../images/frontpage/tick-cross-sprite.svg');
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: 50px 125px;
    position: absolute;
    width: 25px;
    height: 25px;
    top: 0.5rem;
    left: 0.5rem;
    transform: scale(0);
    transition: transform 0.4s ease;
}

.subscription-options {
    margin-top: 1rem;
}

.subscription-select-box.active {
    color: white;
    background-color: #78b4d0;
}

.subscription-select-box.active:after {
    transform: scale(0.8);
    transition: transform 0.4s ease;
}

.subscription-select-box:last-of-type {
    margin-bottom: 0;
}

.subscription-select-box .measure {
    font-size: 18px;
    font-weight: bold;
    padding-left: 0.5rem;
    transition: color 0.2s ease;
}

.subscription-select-box .maxklug_pricing_amount {
    font-size: 18px;
    color: #66727a;
    font-weight: bold;
    transition: color 0.2s ease;
}

.subscription-select-box span {
    font-size: 16px;
    transition: color 0.2s ease;
}

.subscription-select-box.active .measure,
.subscription-select-box.active .maxklug_pricing_amount,
.subscription-select-box.active span {
    color: white;
}

.subscription-support-box {
    background-color: #88BCD8;
    border-radius: 10px;
    padding: 1rem;
    margin-bottom: 1rem;
}

.subscription-support-box b {
    color: white;
    margin-bottom: 1rem;
    display: block;
    font-size: 18px;
}

.subscription-support-box p {
    margin-bottom: 1rem;
    font-size: 16px;
}

.subscription-support-box a {
    color: white;
    font-weight: bold;
    font-size: 18px;
}

.subscription-payment-methods {
    border: 1px dashed #96C4DF;
    border-radius: 10px;
    padding: 3rem;
}

.subscription-support-box-holder {
    margin-top: 0;
}

.subscription-unlimited-access {
    margin: 1rem 0;
    font-weight: 600;
    color: #5D5D5D;
    font-size: 18px;
}

.subscription-remove-child-account {
    padding: 1rem 0;
}

.subscription-remove-child-account ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

@media print, screen and (max-width: 64rem) {
    .subscription-support-box-holder {
        margin-top: 2rem;
    }

    .subscription-payment-methods {
        padding: 1rem;
    }

    .pmethods.home img {
        margin-bottom: 0;
    }
}

@media screen and (max-width: 39.9375em) {
    .button.small-only-expanded {
        display: block;
        width: 100%;
        margin-right: 0;
        margin-left: 0;
    }
}


.runtime-select-box.one-year {
    background: url(/template/images/subscriptions/runtime-select-1year-bg.svg) no-repeat;
    background-size: 669px 433px;

}

.runtime-select-box.one-year.active {
    background: url(/template/images/subscriptions/runtime-select-1year-active-bg.svg) no-repeat;
    background-size: 669px 433px;

}


.runtime-select-box .best-choice {
    color: #FFF;
    font-size: 1rem;
    margin-bottom: 1.3rem;
    font-weight: 600;
    margin-top: 4px;
    letter-spacing: 0.4px;

}

.runtime-select-box.active {
    background: url(/template/images/subscriptions/runtime-select-active-bg.svg) no-repeat;
    background-size: 669px 433px;
    border-radius: 8px;
}

.runtime-select-box.active .measure, .runtime-select-box.active .monthly-price, .runtime-select-box.active .price-explanation {
    color: #FFF;
}

.runtime-select-box.number-of-children {
    height: 122px;
}

.runtime-select-box:hover {

    filter: brightness(105%) grayscale(10%);
    cursor: pointer;
}

.runtime-select-box.active:hover {

    filter: none;
    cursor: auto;
}


.measure {
    font-size: 1.5rem;
    color: #66727a;
    font-weight: 600;
}

.monthly-price {
    font-weight: 600;
    color: #377aab;
    font-size: 2rem;
    margin: 1.5rem 0 1.5rem 0;
}


#monthly-price-monthly.monthly-price{
    margin: 1.5rem 0  0.125rem 0;
}

.one-year .monthly-price {
    margin: 0;
}

.discount-box {
    background-color: #64B7E1;
    border-radius: 5px;
    margin: 8px;
    height: 65px;
    padding: 0.5rem;
}


.active .discount-box {
    background-color: #d4ebc7;
}

.discount {
    color: #ffffff;
    font-size: 1.125rem;
}

.active .discount {
    color: #508f2f;
}

.one-child .measure {
    margin-top: 2rem;
}

.order-box {
    border:1px dotted #92cfed;
    border-radius: 8px;
    margin-top: 53px;
    padding: 7px 1rem 1rem 1rem;
}

.your-order{
    font-size: 1.5rem;
    color: #377aab;
    font-weight: 600;
    border-bottom: 1px solid #64B7E1;
    padding-bottom: 0.5rem;
}


.order-contents {
    margin: 0.5rem 0;
    padding-bottom: 1rem;
    border-bottom: 1px solid #64B7E1;
}

.amount-total {
    font-size: 1.25rem;
    margin-bottom: 1.5rem;
}


.highlight {
    position:relative;
    display: inline-block;
    background: url(/template/images/frontpage/tick-cross-sprite.svg) no-repeat 0 0;
    background-size: 50px 125px;
    font-size: 1.05rem;
    padding: 3px 0 0 1.75rem;
    height:20px;
    margin:0.375rem;
    line-height: 1;

}


.faq-subscriptions h3{
    color: #66a9cb !important;
    font-weight: 600;
    font-size: 1.25rem;
    border-top: 1px solid #C9E2EE;
    padding: 1rem 2rem 1rem 0;
    margin-bottom: 0 !important;
    background: url(/template/images/subscriptions/faq-arrow-down.svg) no-repeat;
    background-position: top 15px right 5px;
    background-size: 24px 24px;
}

.faq-subscriptions h3.ui-accordion-header-active{
    background: url(/template/images/subscriptions/faq-arrow-up.svg) no-repeat;
    background-position: top 15px right 5px;
    background-size: 24px 24px;

}

.faq-subscriptions h3:hover {
    cursor:pointer;
    -webkit-filter: brightness(90%);
}



.faq-subscriptions p{
    margin-top: 0;
    max-width: 750px;
}

div.faq-subscriptions {
    margin-bottom: 2rem;
    border-bottom: 1px solid #C9E2EE;
}

h4.faq-subscriptions {
    font-weight: 600;
    font-size: 1.5rem;
}


/* Small only */
@media screen and (max-width: 39.9375em) {
    .algemene-voorwaarden {
        font-size: 14px;
    }

    .select-payment-method {
        display: block;
        margin: 0 2rem 2rem 0 !important;
    }

    .registration-block {
        margin-bottom: 30px;
    }

    h2.subscriptions-header {
        font-size: 1.6rem;
        line-height: 2rem;
    }
    .measure {
        font-size: 1rem !important;
    }
    .runtime-select-box .best-choice {
        display: none;
    }

    .runtime-select-box.one-year {
        background: #c7e1f1;
    }

    .runtime-select-box {
        background: #c7e1f1;
    }

    .runtime-select-box.one-year.active {
        background: #63b43c;
    }

    .monthly-price {
        font-size: 1.25rem;
        margin:0;
    }

    #monthly-price-monthly.monthly-price{
        margin: 0;
    }


    .steps-round-label {
        font-size: 1rem;
    }

    .steps-round {
        width:24px;
        height:24px;
        border-radius: 12px;
        font-size: 1rem;
    }

    .price-explanation, .discount, .discount-explanation {
        font-size: 0.85rem;
        line-height: 1;
        margin-top: 4px;
    }

    .price-explanation {
        padding: 0 4px;
    }



    .runtime-select-box.active {
        background: #63b43c;
    }

    .runtime-select-box {
        height: 110px;
    }

    .runtime-select-box.number-of-children {
        min-height: 100px;
        height:auto;
    }

    .discount-box {
        margin: 8px 0 0 0;
        border-radius: 0 0 8px 8px;
        height:auto;
        min-height: 65px;
    }

    .your-order {
        font-size: 1rem;
    }

    .order-box {
        margin-top: 1rem;
    }

    .amount-total {
        font-size: 1rem;
    }
    .faq-subscriptions h3{
        font-size: 1rem;
        padding: 1rem 2rem 1rem 0;
        margin-bottom: 0 !important;
        background-position: top 15px right 5px;
        background-size: 16px 16px;
    }
}




/* Medium up */
@media screen and (min-width: 40em) {
    .payment-block {
        padding-left: 30px;
    }

    button.subscriptions {
        margin: 10px 0 0 30px;
    }

    .select-payment-method {
        float: left;
        margin: 0 2rem 1rem 0;
    }

    .algemene-voorwaarden {
        font-size: 16px;
        color: black;
    }

    .registration-block {
        margin-top: 1rem;
        margin-left: 34px;
    }

    .orderform {
        border-left: 1px solid #c5e0ea;
    }

}

.logo-subscriptions {
    width: 60px;
}

/* Medium only */
@media screen and (min-width: 40em) and (max-width: 53.9375em) {
    .logo-subscriptions {
        width: 100%
    }
}

/* xMedium only */
@media screen and (min-width: 54em) and (max-width: 63.9375em) {
    .logo-subscriptions {
        width: 80%
    }
}

/* Large and up */
@media screen and (min-width: 64em) {
}

/* Large only */
@media screen and (min-width: 64em) and (max-width: 74.9375em) {
    .logo-subscriptions {
        width: 70%
    }
}

/* Xlarge and up */
@media screen and (min-width: 74em) {
    .logo-subscriptions {
        width: 60%
    }
}


/* Disable jQuery UI focus glow */

*:focus {
    outline: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

/*only max klug  */
.maxklug_pricing_container {
    background-color: #f0f4fc;
}

.maxklug_pricing_amount {
    font-size: 2rem;
    color: steelblue;
}


.subscription-reorderform {
    display: flex;
    flex-direction: column;
    margin: 3rem 0;
}

.subscription-reorderform .button {
    margin-bottom: 0;
}

.subscription-reorderform .subscription-overview-bar {
    border: 1px solid #E0E0E0;
    padding: .75rem 1.5rem;
    justify-content: space-between;
    margin-bottom: 2rem;
}

.subscription-reorderform .subscription-additional-box {
    background-color: #E0E0E0;
    padding: .75rem 1.5rem;
    margin-bottom: 2rem;
}

.subscription-reorderform .subscription-additional-box b {
    display: inline-block;
    margin-bottom: 1rem;
}

.subscription-reorderform .subscription-order-box {
    border: 1px solid #e0e0e0;
    padding: 1rem 1.5rem 1.5rem;
    margin-bottom: 2rem;
}

.subscription-reorderform .subscription-order-box_explain_paypal {
    background-color: #fffccc;
    padding: 1rem 1.5rem 1.5rem;
    margin-bottom: 2rem;
}

.subscription-reorderform .subscription-order-box .subscription-order-price-holder {
    text-align: right;
}

.subscription-reorderform .subscription-order-box b {
    display: inline-block;
    margin-bottom: 1rem;
}

.subscription-reorderform #extra-licenses-tos, .subscription-reorderform #extra-licenses-tos_new {
    display: none;
    font-size: 12px;
    color: #707070;
    letter-spacing: 0;
    font-family: 'Source Sans Pro';
    margin-top: 1rem;
}

.table-subscription {
    border: 1px solid #e0e0e0;
    border-spacing: 0;
    border-collapse: collapse;
}

.table-subscription td {
    padding: 1rem;
}

.table-subscription tr td:nth-child(odd) {
    width: 35%;
}

.table-subscription-automaticrenewal tr:nth-child(even) {
    border-top: 1px solid #e0e0e0;
    background-color: transparent;
}

.mandate-content {
    padding: 2rem 0;
}

.mandate-content-title {
    /*margin-bottom: 1rem;*/
}

.mandate-content-payment {
    margin: 2rem 0;
}

p.mandate-explanation {
    color: #707070;
    font-size: 14px;
}