/******************************************************************************
* Startbox Autcomplete Fields
*/
.startbox_adress_long{
    display: inline !important;
    width: 78% !important;
    margin-bottom: 0 !important;
}
.startbox_adress_short {
    display: inline !important;
    width: 20% !important;
}


/*******************************************************************************
 * Form setup
 */

/* Umziehen lassen move detail form */
#form-order-move-row,
/* Umziehen lassen contact form */
#form-letting-move {
    display: none;
}

.overview-loan {
    display:  flex;
    padding:  0 !important;
    margin-top: 1em;
}

.loan-picture {
    flex: 1;
    background-image: url(https://mymovingpartner.com/wp-content/uploads/2021/12/iStock-1148970849-1.jpg);
    background-size: cover;
    background-position: center right;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.loan-main {
    flex: 2;
    padding: 1em;
}


#loan-sidebar {
    margin-top: 1em;
    background: white;
    border-radius: 5px;
    padding: 1em;
    text-align: center;
}
#loan-sidebar h5 {
    margin-bottom: 0;
}

.width-loan, .loan-rate-sum {
    display:  inline;
}

.loan-select {
    width: 250px;
    display: inline;
}

.loan-rate-sum {
    font-size: 18px;
    padding-left: 1em;
}

.loan-description{
    margin-bottom:  0.66em;
    margin-top:  0.66em;
}

.recommendation-energy {
    color: black;
    border-radius: 10px;
    min-height: 200px;
    padding: 1em;
    background-image: url(https://mymovingpartner.com/wp-content/uploads/2021/12/Strom-MMP.jpg);
    background-size: cover;
    background-position: bottom center;
}

.energy-title {
    font-weight: bold;
    margin-bottom: 15px;
}

.energy-explanation, .energy-usps {
    margin-bottom: 15px;
}

.energy-usps {
line-height:  2em;
}

.recommendation-energy select {
    width:  250px;
    border-radius:  5px;
}

.energy-checkbox span {
    font-weight:  bold;
}

.input-energy {
    display: flex;
    flex-direction: row;
    background: rgba(245, 245, 245, 0.9);
    margin-top: 1em;
    padding: 1em;
    border-radius: 10px;
}

.people-energy, .energy-count {
    flex: 2;
}

.people-energy select, .energy-count input {
    margin-bottom: 10px !important;
}

.energy-or {
    flex: 1;
    text-align: center;
    padding-top: 30px;
}


/*******************************************************************************
 * Small calculator
 */

.clickable {
    cursor: pointer !important;
}

.calculator.ui-tabs,
.calculator {
    box-sizing: border-box;
    background: #e5e5e5 !important;
    border-radius: 0 !important;
    border: 1px solid gray;
    box-shadow: 0px 0px 20px 5px rgba(0, 0, 0, 0.3);
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    z-index: 1;
}

/* Small calculator vertical */

#calculator-small-vertical {
    background: rgba(240, 241, 242, 1) !important;
    width: 355px;
    max-width: 100% !important;
    border: solid 2px var(--CI);
    border-radius:  5px;
    box-shadow: 0 2px 6px rgba(0,0,0,.25);
}

#calculator-small-vertical .calculator-tab__body {
    display: inline !important;
    flex-wrap: unset !important;
}

#calculator-small-vertical #address-private-new,
#calculator-small-vertical #address-private-old, 
.private_old_addr_wrapper #address-private-new,
.private_new_addr_wrapper #address-private-old, 
{
    max-width: unset;
    width: 100%;
    border-radius:  5px;
}

#calculator-small-vertical .calculator-tab__inputs-group {
    margin-bottom: 1rem !important;
    margin-left: 0rem;
    width: 100%;
}

#calculator-small-vertical #tab-private {
    border: unset !important;
    padding: 25px 20px 25px;
}

#calculator-small-vertical .calculator-tab__input {
    background-color: white !important;
}

.js-start-order-move, .js-next-step, .js-process-next-step, .js-start-self-move {
    background-color: #6cc04a !important;
    color: white !important;
    border-radius: 5px !important;
}

.js-start-order-move:hover, .js-next-step:hover, .js-process-next-step:hover, .js-start-self-move:hover {
    background-color: #5ba93b !important;
    color: white !important;
}

/* Self move */

.calculator--small {
    border-radius: 10px;
    background-color: rgba(255, 255, 255, 0.9);
}

.calculator--small .calculator-tab__inputs {
    width:  100% !important;
}


/* Form order move vertical */

.intro-title {
    margin: 0 !important;
    padding: 0.66rem;
    border-bottom: 1px solid var(--CI);
}

.intro-title h3 {
    text-transform: uppercase;
    text-align: center;
    color: var(--CI);
}

#full-start {
    margin-left: 3%;
    max-width: 420px;
    border: 2.5px solid var(--CI);
    height: -webkit-fit-content;
}

#form-order-move-vertical {
    margin-bottom: 0px;
}


.form-order-vertical {
    width: calc(100% - 2em);
    margin-left:1em;
    text-transform: uppercase;
    font-size: 1.1rem;
    padding: 12px 0;
    font-weight: bold;
    margin-bottom: 1em;
}



/* Hide some elements */

#form-order-move-vertical .width-distance, #form-order-move-vertical .noparking, #form-order-move-vertical .flexible_date, .address__no-streetnum-disclaimer {
    display: none !important;
}

#form-order-move-vertical .width-address, #form-order-move-vertical .width-address input {
    width: 100%;
    margin-right: 0;
    border-radius:  5px;
}

#form-order-move-vertical .input-box label {
    font-size: 92%;
}

/* Define width for desktop */
@media screen and (min-width: 478px) {
#form-order-move-vertical .width-story {
    width: 43%;
}

#form-order-move-vertical .intro_date {
        width: 50%;
}

#form-order-move-vertical .elevator,#form-order-move-vertical .flexible_date {
    margin-top: 32px;
}
}

/* Besichtigungstermin */

.page-id-4953 .gform_wrapper .gform_page_footer {
margin: 24px 0;
padding: 24px 0 0 0;
}

#popmake-10760 .gform_wrapper {
    padding:  0 !important;
    margin-top:  0 !important;
}

.page-id-4953 .gform_previous_button {
    background-color: gray;
}

.page-id-4953 .gfield_label {
    color: var(--CI) !important;
}

input[type="email"], textarea {
    background:  unset !important;
    border-radius: 5px !important;
}

.page-id-4953 .gf_progressbar_wrapper {
    display: none;
}

.page-id-4953 .gform_next_button,.page-id-4953 #gform_submit_button_17, .page-id-4953 #gform_submit_button_18 {
    float: right;
}

.gform_footer .button {
    width: 100% !important;
    font-weight: bold;
    font-size: 16px;
    background-color: #6cc04a !important;
    min-width: 150px !important;
    padding: 1.2em 1.5em !important;
    border-radius: 5px !important;
    text-transform: uppercase;
}

.datenschutz-checkbox {
    font-size:  14px !important;
    font-weight:  normal !important;
}

.gform_wrapper .datepicker, .gfield_select {
background-size: 38px !important;
}

#gform_submit_button_18, #gform_submit_button_20 {
    width:  100%;
}

@media screen and (max-width: 478px) {
.page-id-4953 .gform_page_footer {
display: flex;
flex-direction: column-reverse;
}
}



/* Iframed calculator */

.start-calculator-iframe {
    width: 375px !important;
}

.start-calculator-iframe .calculator-tab__inputs-group {
margin-right: 0 !important;
}

.start-calculator-iframe p {
    font-size: 15px !important;
}

.start-calculator-iframe h4 {
    font-size: 18px !important;
    line-height: 28px !important;
}

/* Headers*/

.calculator__header {
    display: flex !important;
}

.calculator__header a {
    padding: 0.9rem;
    text-transform: uppercase;
    text-align: center;
    font-size: 1.3rem !important;
    cursor: pointer;
}

.calculator__header .calculator__header-button {
    flex: 1 1 auto;
}

.calculator__header .calculator__header-button:nth-child(2) {
    background-color: #ffffff;
}

.calculator__header.ui-tabs-nav .calculator__header-button a {
    color: #000000;
}

#move-calc-small .calculator__header li.calculator__header-button {
    border-bottom: 1px solid #808080;
}

#move-calc-small
    .calculator__header
    li.calculator__header-button.ui-tabs-active {
    border-top: 1px solid #808080;
    border-left: 1px solid #808080;
    border-right: 1px solid #808080;
}

.calculator__header .calculator__header-button.ui-tabs-active a {
    cursor: default !important;
}

.calculator__header .calculator__header-button:not(.ui-tabs-active):hover {
    background: #e0e0e0;
}

.calculator__header
    .calculator__header-button:nth-child(2):not(.ui-tabs-active):hover {
    background-color: #fafafa;
}

.calculator__header .calculator__header-button:first-child {
    border-left: none;
}

.positive-message {
    text-align: left;
    color: var(--CI);
}


/* Hallo page */

.options-saas .vc_custom_heading {
    margin-left: 1em;
}
.options-saas ul {
    margin-left: 30px !important;
    list-style: none !important;
}

.options-saas ul li::before {
content: "";
font-family: "Font Awesome 5 Pro";
font-size: 1em;
color: var(--CI);
font-weight: bold;
display: inline-block;
width: 1em;
margin-left: 0em;
margin-right: 10px;
}

.options-saas img {
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}

.options-saas a {
font-size: 16px !important;
}

.ribbon {
    padding: 3px 8px;
    background: #69b540;
    border-radius: 5px 5px 5px 0px;
    box-shadow: box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.3);
    color: white;
    font-weight: bold;
    height: auto;
    left: 5px;
    position: absolute;
    text-align: center;
    top: 20px;
    width: auto;
    z-index: 5;
}

.ribbon:before {
    border: 4px solid #69b540;
    border-bottom-color: transparent;
    border-left-color: transparent;
    bottom: -8px;
    content: "";
    height: 0;
    left: 0;
    position: absolute;
    width: 0;
    z-index: -1;
}

@media screen and (max-width: 477px) {
.iframe-code-calendly, .calendly-inline-widget, .iframe-code-calendly iframe {
min-height: 1400px !important;
overflow: hidden !important;
}
}
@media screen and (min-width: 477px) {
.iframe-code-calendly iframe {
    margin-top: -60px;
}
}

/* Speicher popup */


#customer_login {
    flex-direction: row-reverse;
}

@media screen and (min-width: 477px) {
	#customer_login {
    display: flex;
}
}


#customer_login .col-2 {
    margin-right: 1em;
}

#customer_login h2 {
    font-size: 130% !important;
}

#sign-in-popup .woocommerce {
    margin-bottom: 0px !important;
}

#privacy_policy_reg_field label {
    font-weight: inherit !important;
    font-size: 90%;
}


#popmake-12100 .div-login, .popmake-content .div-login {
    display: none !important;
    font-size: 14px;
    color: rgb(50, 50, 50);
}



/* Schnellanfrage popups */

.pum-container .wpb_wrapper > div {
    margin-bottom: 10px !important;
}


/* Tab Body */
#tab-private,
#tab-company {
    height: auto;
    /*
    border-left: 1px solid #808080;
    border-right: 1px solid #808080;
    border-bottom: 1px solid #808080;
    */
}

.calculator-tab__headline h4 {
    color: #000000;
    font-weight: bold;
    text-align: center;
}

#tab-company .calculator-tab__headline h4 {
    margin: 0 0 10px 0;
}

.calculator.calculator .calculator-tab:nth-child(3) {
    background-color: #ffffff;
}

.calculator-tab__body {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.calculator-tab__inputs {
    display: flex;
    flex: 1 1 75%;
    flex-wrap: wrap;
}

.calculator-tab__inputs-group {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    margin-right: 0.666rem;
}

.calculator-tab__inputs-group label {
    margin-left: 0.05rem;
    color: #626262;
}

.calculator-tab__input {
    font-size: 0.9rem !important;
}

.calculator__input-icon {
    width: 25px;
    height: 35px;
    background-image: url('../images/arrow_white_right.svg');
    background-repeat: no-repeat;
    background-position: center left;
}

.calculator__input-icon-mmp {
    width: 25px;
    height: 35px;
    background-image: url('../images/arrow_white_right_mmp.svg');
    background-repeat: no-repeat;
    background-position: center left;
}

.calculator__input-icon-info {
    width: 28px;
    background-image: url('../images/icon_info.svg');
}

.calculator-tab__buttons {
    display: flex;
    flex: 1 1 25%;
    flex-direction: column;
}

#tab-company .calculator-tab__buttons {
    display: flex;
    flex: 1 1 30%;
    flex-direction: column;
}

.calculator-tab__buttons .calculator-button {
    color: #ffffff;
    border: 1px solid #ea6538 !important;
    padding: 4px 4px 5px;
    margin: 0;
    font-size: 0.95rem;
    background-color: #ea6538;
    cursor: pointer;
}

.calculator.calculator .calculator-tab:nth-child(3) .calculator-button {
    margin: 29px 0 0;
}

.calculator-tab__buttons .calculator-button:nth-child(2) {
    color: #ea6538;
    background-color: #ffffff;
}

.calculator-tab__buttons .calculator-button:hover::after {
    filter: alpha(opacity=1);
    opacity: 1;
    background: rgba(0, 0, 0, 0);
    transition: all 0s;
}

.calculator-button {
    display: block;
    width: 100%;
    text-align: center;
}

.calculator-button:hover {
    text-decoration: none;
}

.calculator-button:first-child {
    margin: 25px 0 10px;
}

.calculator-button__title {
    font-weight: bold;
    text-transform: uppercase;
}

.process_secondary {
    background: white;
    text-align: center !important;
    width: 100%;
    margin-top: 1rem;
    border-radius:  5px !important;
    border:  1px solid var(--CI) !important;
}

.process_secondary .span {
    text-decoration: none !important;
    color: var(--CI) !important;
}

.button_save_sidebar {
    text-align: center !important;
    background-color: #ffffff !important;

    border: 1px solid black;
    border: 1px solid var(--CI);
    color: black;
    color: var(--CI);
    width: auto;
}

.volume-info-sidebar {
    background: white;
    margin-top: 2em;
    margin-bottom: 2em;
    padding: 0.666rem;
    border: 1px solid #e6e6e6 !important;
    border-radius: 5px;
}

body.admin-bar .volume-info-sidebar {
display: block !important;
}

.woocommerce-checkout .spinner_saving {
    display: none;
}

.price-claim-price-box-1 {
    margin-top: 1em;
    border-top: 1px solid rgb(205, 205, 205);
    padding-top: 1em;
}

.checkout_success {
    padding: 1em;
    margin-bottom: 2em;
    background: #ea6538;
    color: white;
    border-radius: 5px;
    font-size: 15px;
    text-align: center;
}

.download-pdf {
    width:  60%;
    left: 20%;
    min-width:  300px;
    background: var(--CI);
    color: white;
}


.woocommerce-order-received .woocommerce-order-details, .woocommerce-order-received .woocommerce-customer-details,.woocommerce-order-received #order-progress,.woocommerce-order-received .order-process__side {
    display: none;
}

.woocommerce-order-received .order-success {
    margin-top:4vh;
    color: rgb(70, 220, 82);
    background: white;
    padding: 2em;
    text-align:  center;
}

.order-success .js-process-next-step a {
    color: white !important;
}


.comments_box {
    background: white;
    padding: 1em;
    margin-top: 1em;
    border: 1px solid #e6e6e6 !important;
    border-radius: 5px;
}

.process-note-container {
    margin: 1em 0em;
    padding: 1em;
    background:  white;
    box-shadow: 0 2px 6px rgba(0,0,0,.25);
    border-radius: 5px;

}

.process-note__input {
    border-color: whitesmoke;
    width: 100%;
    background: white;
    font-size: inherit;
    line-height: 1.4em;
    margin-bottom: 0 !important;
}


/* Changes for sales */

body.admin-bar .process_explanation, body.admin-bar .faq-prozess, body.admin-bar  .button_besichtigung, body.admin-bar .advantages_checkout {
display: none;
}

body.admin-bar .kartonrechner-info {
    display:  inline-block !important;
    text-align: center;
}

/* Specific styling for fields */

#calculator-small input[type='text'] {
    padding: 16px 5px !important;
    box-shadow: none;
    border-color: #bbbbbb !important;
    border-radius:  5px !important;
}

#calculator-small select {
    padding: 6px 5px;
    box-shadow: none;
}

@media only screen and (min-width: 767px) {
    #address-private-new,
    #address-private-old,
    #address-company-new,
    #address-company-old {
        min-width: 315px;
        max-width: 100%;
    }
}

#date-private,
#date-company,
.date-picker-w-icon,
.date-picker-w-icon-nojs {
    background-image: url(https://mymovingpartner.com/wp-content/uploads/2020/11/icon_date_picker-2.svg);
    background-repeat: no-repeat;
    background-position: right -1px center;
}

.date-picker-w-icon,
.date-picker-w-icon-nojs {
    background-size: contain;
}

#move_date_alternative {
    display:inline-block;
    position: relative;
    border: 1px solid #bbbbbb;
    border-radius: 5px;
    box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.02);
}

#move_date_alternative:after {
    font-family: 'Font Awesome 6 Pro';
    content: '';
    position: absolute;
    right: 6px;
    color:  var(--CI);
}

#rooms,
#employees {
    max-width: 95px;
    -moz-appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
    background-image: url('../images/icon_dropdown_arrow.svg');
    background-repeat: no-repeat;
    background-position: 102% 0;
}

.select-w-icon {
    -moz-appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
    background-image: url('../images/icon_dropdown_arrow.svg');
    background-repeat: no-repeat;
    background-position: right -1px center;
    background-size: 39px;
}

#square-meters,
#office-number {
    max-width: 50px;
}

@media only screen and (max-width: 1239px) {
    .calculator.ui-tabs {
        max-width: 922px;
        width: 100%;
    }

    .calculator.calculator .calculator-tab {
        padding: 1.666rem;
    }

    .calculator-tab__body {
    }

    .calculator-tab__inputs {
        flex: 1 1 100%;
        justify-content: center;
    }

    .calculator-tab__buttons {
        flex: 1 1 100%;
        flex-direction: row;
        justify-content: space-around;
        margin-top: 1rem;
    }

    .calculator-tab__buttons .calculator-button {
        flex: 0 0 auto;
        width: 42.5%;
    }

    .calculator.calculator .calculator-tab:nth-child(3) .calculator-button,
    .calculator-tab__buttons .calculator-button:nth-child(2),
    .calculator-button:first-child,
    .calculator-button {
        margin: 5px 0;
    }

    /* Tab Body */
    #tab-private,
    #tab-company {
        height: auto;
    }

    #tab-private .calculator-tab__headline h4,
    #tab-company .calculator-tab__headline h4 {
        margin: 0 0 20px 0;
    }
}

@media only screen and (max-width: 959px) {
    .calculator-tab__inputs {
        margin-top: -10px;
    }

    .calculator-tab__inputs label {
        margin-top: 10px;
    }

    #tab-private,
    #tab-company {
        height: auto;
    }
}

@media only screen and (max-width: 767px) {
    .ui-tabs .ui-tabs-nav li.calculator__header-button a {
        padding: 12px 10px !important;
    }

    .calculator-tab__inputs {
        flex-wrap: wrap;
    }

    .calculator-tab__buttons {
        flex-direction: column;
        justify-content: center;
    }

    .calculator-tab__buttons .calculator-button {
        width: 100%;
    }

    .calculator-tab__buttons .calculator-button:first-child {
        margin-right: 0;
        margin-bottom: 0.25rem;
    }

    #tab-private,
    #tab-company {
        height: auto;
    }

    #move-calc-small .calculator .calculator__input-icon-arrow {
        display: none;
    }

    /* Input fields in move-calc-small to full width for tablets and phones */
    .calculator #company_old_addr_wrapper,
    .calculator #company_old_addr_wrapper input,
    .calculator #company_new_addr_wrapper,
    .calculator #company_new_addr_wrapper input,
    .calculator #private_old_addr_wrapper,
    .calculator #private_old_addr_wrapper input,
    .calculator #private_new_addr_wrapper,
    .calculator #private_new_addr_wrapper input {
        max-width: none;
        width: 100%;
        margin-right: 0;
    }
}

@media only screen and (max-width: 479px) {

    .room__tab {
        padding: 0.66rem 1rem !important;
    }

    .room__tab--product-list .room__tab-title {
        padding-left: 1em;
    }
    .calculator.ui-tabs,
    .calculator {
        box-shadow: 0px 0px 20px 3px rgba(0, 0, 0, 0.3);
    }

    .calculator__header {
        flex-direction: column;
    }

    .calculator__header a {
        font-size: 1.2rem !important;
    }

    #move-calc-small
        .calculator__header
        li.calculator__header-button.ui-tabs-active {
        border: 0;
    }

    #tab-private,
    #tab-company {
        height: 100%;
    }
}

/*******************************************************************************
 * New start box
 */

 @media screen and (min-width: 676px) {
 .start-box-container {
    padding-right: 50px !important;
 }
 .start-box {
    margin-right: 0;
    margin-left: auto; 
    
}
}

.start-box {
    background-color: rgba(255, 255, 255, 0.85);
    box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.3);

    /*border: 2px solid var(--CI);*/

    border-radius: 5px !important;

    display: flex;
    flex-direction: column;

    max-width: 400px;

    padding: 0.5em 1em 0.2em 1em;

    margin-left: auto;
    margin-right: auto;


}

.start-options {
    display: flex;
    flex-direction: row;
}

.start-box__header {
    align-self: stretch;

    padding: 0.5em 0em;

    border-bottom: 2px solid var(--CI);

    color: var(--CI);
    text-align: center;
    font-weight: bold;
    font-size: 18px;
    line-height: 28px;
    text-transform: none;
}

.start-box__body {
    padding: 1em 0em;

    display: flex;
    flex-direction: column;
}


/*
#moveoutAddress, #moveinAddress {
    border: none !important;
}

*/


.start-box .start-login a {
    color: var(--CI);
    font-weight: bold;
}

.start-box__body .start-select, .start-box-row  {
    margin-bottom: 1em;
}

.start-box-row input[type="text"] {
    margin-bottom: 0 !important;
}

.start-box__body label {
margin-left: 0.05rem;
color: #626262;
}

.start-box > .start-box__body input[type='text'],
.start-box > .start-box__body select,
.start-box > .start-box__body button {
    border-radius: 5px;
    width: 100%;
    margin-top: 0;
}

.start-box > .start-box__body input[type='text'], .start-box-row input , .private_new_addr_wrapper input {
    padding: 15px 10px !important;
}

.start-box .start-select {
    display: inline;
    width: 65%;
}

.start-box .start-login {
    margin-top: 4px;
    display: inline;
    width: 35%;
    text-align: right;
}

.start-box > .start-box__body input[type='radio'] {
    display: inline-block;
    width: auto;
}

.start-box > .start-box__body input[type='radio'] + label {
    display: inline;
}

.start-box > .start-box__body input.start-box__area {
    display: inline-block;
    width: 80px;
    margin: 0 !important;
}

.start-box-options-store {
    margin-bottom: 1em;
}

.start-box__submit, .js-start-self-move {
    padding: 15px 10px !important;
    font-size: 16px;
    margin-top: 1rem;
    background-color: #69b540;
    font-weight: bold;
}

.start-box__radio-opt label {
    font-size: 95%;
    font-weight: normal;

}


.start-box .advantages ul  {
    margin-bottom: 4px;
    position: relative;
    list-style: none !important;
    margin-left: 0em !important;
    padding-left: 25px !important;
}

.start-box .advantages_mmp ul, .boxes-advantages ul  {
    margin-bottom: 4px;
    position: relative;
    list-style: none !important;
    margin-left: 0em !important;
    padding-left: 5px !important;
    font-size: 90%;
}
.start-box .advantages li, .start-box .advantages_mmp li, .boxes-advantages li {
    margin-bottom: 0px;
}

.start-box .advantages li:before, .start-box .advantages_mmp li:before, .boxes-advantages li:before {
color: var(--CI);
content: '✓';
position: absolute;
left: 0;
}

.start-box .powered {
    width: auto;
    padding-top: 0.66em;
    text-align: right;
    float: right;
    margin-left: auto;
}

/* Hide on extended start box */

.hero-section-saas-new .start-box__body .international-checkbox {
 display: none;
}

/* Datepicker styling */

.ui-datepicker-next {
    position: absolute;
    right: 5px;
    top: 5px;
}

.ui-datepicker-prev {
    position: absolute;
    left: 5px;
    top: 5px;
}

.ui-datepicker-title {
    text-align: center;
}

/*******************************************************************************
 * Simplifications done on the process on July 2020.
 */

 /*Hide Overview fields in overview */

.page-id-4138 #loan-sidebar {
    display: none;
}

.page-id-2651 .order-notes-date {
    display: none;
}

.page-id-4138 .order-notes-date {
    width: 100%;
}

.page-id-2651 .save-move-button {
    display: none !important;
}

.save-move-button a {
    background: var(--CI) !important;
}

body.logged-in .save-move-button {
    display:  none !important;
}

body:not(.logged-in) .success-login {
    display:  none !important;
}


/* 






/*Hide Details in checkout page (but not payment page) */


@media only screen and (max-width: 959px) {
.page-id-2890 .order-process__container {
flex-direction: column-reverse !important;
}
}

.page-id-2890 .woocommerce-checkout-review-order-table, .page-id-2890 #order_review_heading  {
    display: none;
}

.woocommerce-order-received .order-process__nav {
    display: none;
}


.woocommerce-order-pay .order-process__container {
    margin-top: 2em;
}

.advantages_checkout, .pay-order-details, #payment {
    margin-top: 1em;
    padding: 1em;
    background: white !important;
    border: 1px solid #e6e6e6;
}

.pay-order-details {
   color: #404040 
}

.pay-order-title {
    padding: 0.66em 1em;
    background: white !important;
    border-radius:  5px;
    border: 1px solid #e6e6e6;
}

.pay-order-title h3 {
    margin-bottom: 0;
}


.alternative_dates li {
    margin-top:  0 !important;
}

.woocommerce-order-pay .order-list__price .wgm-tax {
    display:  none;
}

.advantages_checkout ul {
    list-style: none !important;
}

.page-id-2890 .woocommerce-checkout #payment {
    display:none;
}


.admin-bar .woocommerce-checkout #payment {
    display:block;
}

/* Sidebar in checkout */

.page-id-2890 .process_secondary,.page-id-2890 #order-status-save {
    display: none;
}


/* General changes in Umziehen lassen page*/

.move-content-box__content {
padding:  0;
border-radius: 5px;
margin-bottom:  1em;
}

.form_old_address, .form_new_address {
    margin-top:  5px;
}

.form_move_dates textarea {
    min-height: unset !important;
    height:  34px;
}

.page-id-2651 #move_date_alternative {
    border-radius: 5px;
    background: white;
}

.page-id-2651 .header-pricing,.page-id-2651 #order-list-order {
    display: none;
}

.page-id-2651 #order-status-info {
	display: none;
}


.helper-conditions {
    padding-left:  1em;
}

.page-id-2651 .group_address_old,.page-id-2651 .group_address_new, .moving-material-section, .div-storageDuration, .book-move-helpers, .helper-intro, .move-content-box_self-details, .move-content-box_helpers {
    background: white;
    padding: 1.25em 1em 0.75em 1em;
    border-radius: 5px;
    /* box-shadow: 2px 2px 10px 0 rgba(0,0,0,.25);*/
    box-shadow: 0 2px 6px rgba(0,0,0,.25);
}

.width-address {
    border:none;
    width: 100% !important;
    background: transparent;
}

/*
.width-address input {
    background: transparent !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border:none;
    border-bottom: 1px solid #DDDDDD;
    box-shadow: none;
    padding: 5px 0px !important;
}
*/

.width-address input {
    border: 1px solid #e1e1e1;
    padding: 8px 6px;
}

.group_address_old {
    margin-bottom: 1em;
}

.width-address h4 {
    margin-bottom: 10px;
}

.width-address {
    margin-bottom: 5px;
}

@media screen and (min-width: 478px) {
.width-story,.width-distance, .elevator {
    width: calc(50% - 0.5rem);
}
}

.inline-checkbox {
    font-weight: normal;
}

#form-order-move label {
    font-size: 100% !important;
}

/* Modifications for overview site */


.page-id-4138 .group_address_old {
    border-bottom: 1px solid rgb(207, 206, 206);
    border-radius: 0 !important;
    margin-bottom: 1em;
    padding-bottom: 1em;
}


/* New descriptions on the steps */

.process_explanation {
    padding: 1em;
    margin: 1em 0em 2em 0em;
    color: #333;
    font-weight: bold;
    border-radius: 5px;
    border: 1px solid #97e59c !important;
    background: #f1fef2;
}

.process_explanation i {
    font-size: 20px;
    color: #006607;
    margin-right: 5px;
}

.explanation-services-1, .explanation-services-2 {
    margin-top:  0 !important;
}



/*******************************************************************************
 * Order process page
 */

.order-process__page-title {
    color: var(--CI);
    font-size: 18px;
    font-weight: 700;
}

.order-process__container {
    display: flex;
}

.order-process__main {
    flex: 5;
}

.order-process__side {
    padding: 0px 0 0 20px;
    flex: 2;
}

.faq-prozess {
    background: white;
    padding: 1em;
    border: 1px solid #e6e6e6 !important;
    border-radius:  5px;
}

#order-status-save {
    border: 1px solid #e6e6e6 !important;
    background: white;
    border-radius:  5px;
}

#order-status-info #order-list-order {
    border: 1px solid #e6e6e6 !important;
    border-radius: 5px;
}

#order-status-info h3 {
    border-bottom: 2px solid whitesmoke;
    font-size: 20px;
    background: white;
    color: var(--CI);
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}

#order-status-info h3 i {
    font-size: 30px;
}

#order-status-info .order-status-info__misc > div {
    margin: 10px 0 0 0;
}

#order-status-info .order-status-info__misc > div:nth-of-type(1) {
    margin: 20px 0 0 0;
}

.order-status-info__misc i {
    width: 32px;
    font-size: 22px;
}

/* Hide price from volume / storage in all instances */

.page-id-3427 #order-status-info, .page-id-99000 #order-status-info{
display: none;
}

.offer-storage {
    margin-top: 1em;
    margin-left: -0.66em;
    margin-right: -0.66em;
}
.offer-storage .order-list__price{
    margin-top: 2em;
    margin-left: 0.66em;
    margin-right: 0.66em;

}

/* Checkout */


.woocommerce-checkout .sign-in-popup, .woocommerce-checkout .faq-prozess {
    display: none;
}

.woocommerce-order-pay .shop_table,.woocommerce-order-pay .advantages_checkout {
    display: none;
}

.woocommerce-checkout #fake-order-button {
    min-width: 300px !important;
    width:  auto !important;
    padding: 20px;
}

.woocommerce-order-pay .js-process-prev-step {
    visibility:  hidden;
}



/* Other */ 

#order-status-info .icon-phone::before {
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: 'FlipH';
}

#order-status-info a {
    font-size: 16px;
    color: #000000;
    margin-right: 0px;
}

#order-status-info .small {
    margin: 0 0 0 35px;
    font-size: 13px;
}

#order-status-info .checkout-infobox-umziehenlassen {
    width: 80%;
    margin: 30px auto 0;
}

.woocommerce-order-pay .woocommerce-error {
    display: none;
}

#order-status-info .checkout-infobox-umziehenlassen p {
    margin: 0 0 15px 0;
    font-size: 0.9rem;
    line-height: 1.2rem;
    text-align: center;
}

#order-status-info .checkout-infobox-umziehenlassen p span.osi-image-round {
    display: inline-block;
    width: 150px;
    height: 150px;
    -webkit-border-radius: 90px;
    -moz-border-radius: 90px;
    border-radius: 90px;
    border: 3px solid var(--CI);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

#order-status-info .checkout-infobox-umziehenlassen p a {
    margin: 0;
    padding: 11px 14px;
    font-size: 0.9rem;
    line-height: 1.8rem;
    color: #ffffff;
}

#order-status-info .checkout-infobox-umziehenlassen p a i {
    width: 10px;
    padding: 0 0 0 0.5rem;
    position: relative;
    top: 0.05rem;
    font-size: 1rem;
}

.order-process__nav {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
    margin-bottom: 50px;
    width: 100%;
}

.order-process__nav a,
.order-process__nav .button {
    margin-right: 0;
}

.price-box {
    background: white;
    padding: 0.666rem;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.price-box hr {
    background-color: gray;
    color: ;
    height: 2px;
    margin: 0.4rem auto;
}

.price-box__loader {
    text-align: right;
    color: gray;
}

.order-list__price {
    display: flex;
    justify-content: space-between;
}

.order-list__major {
    font-weight: bold;
    margin-top: 0.5em;
}

.order-list__minor {
    margin-left: 0.666rem;
    line-height: 1.3;
}

@media only screen and (min-width: 960px) and (max-width: 1238px) {
    .order-process__side {
        flex: 2;
    }
}

@media only screen and (max-width: 959px) {
    .order-process__side {
        flex: 2;
    }

    .order-process__container {
        flex-direction: column;
    }

    .order-status-info__misc {
        display: none;
    }
}

@media only screen and (max-width: 767px) {
    .order-process__side {
        flex: 2;
        /* margin-top: 80px; */
        padding: 20px 0px;
    }

    .order-process__side .js-process-next-step {
        display:  none;
    }

    #order-progress {
        margin-top: 0rem;
    }

    #order-progress .step-label .fa-solid {
        display:  none;
    }

    #helper-move-out {
        margin-right: 15px;
    }

    input-box-self {
        box-sizing: border-box;
        width: 100%;
    }

    .button-self {
        width: 100%;
    }

    .flex-row-self {
        flex: 1 1 100%;
        display: block !important;
        align-items: flex-start;
        flex-wrap: wrap;
    }
}

@media only screen and (max-width: 479px) {
    #fake-order-button {
        margin-bottom: 2rem;
    }

    .form-order {
        width: 100% !important;
        margin-bottom: 1rem !important;
    }

    .order-process__side {
        margin-top: 0;
    }

    input-box-self {
        box-sizing: border-box;
        width: 100%;
    }

    .button-self {
        width: 100%;
    }
}

.gform_wrapper ul li select,
.gform_wrapper .datepicker {
    background-size: 32px;
}

/*******************************************************************************
 * Order progress Mobile - no changes
 *
 */

#order-progress {
    width: 100%;
    max-width: 840px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    background: url('../images/line-steps.gif');
    background-repeat: no-repeat;
    background-size: 85% 2px;
    background-position: center 40px;

    padding-bottom: 1.5rem;
    margin-bottom: 1rem;
    border-bottom: 2px solid var(--CI);
}

#order-progress .col {
    width: 140px;
}

#order-progress a {
    display: block;
    text-decoration: none;
}

#order-progress .step {
    width: 50px;
    height: 50px;
    margin: 0 auto;
    color: #ffffff;
    font-size: 1.5rem;
    line-height: 3rem;
    text-align: center;
    background-color: #808080;
    border: 15px solid transparent;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box;
}

#order-progress .step.active {
    background-color: var(--CI);
}

#order-progress .step.done {
    background: url('../images/icon_checked.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-color: #03bd5b;
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box;
}

#order-progress .step-label {
    color: #333;
    text-align: center;
}

@media only screen and (max-width: 900px) {
    #order-progress {
        justify-content: space-evenly;
        background-position: center 29px;
    }

    #order-progress .step {
        width: 40px;
        height: 40px;
        font-size: 1rem;
        line-height: 40px;
        border: 7px solid white;
    }

    #order-progress .step-label {
        font-size: 0.7rem;
    }
}


/*******************************************************************************
 * Order progress > Mobile - Changes introduced in July 2020
 *
 */

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

#order-progress .col {
    width: auto !important;
}
#order-progress .col .step-label {
    color: gray;
    margin-left: 15px;
    margin-right: 10px;
}
#order-progress .step {
    display: none;
}
#order-progress {
    border-bottom: 2px solid var(--CI) !important;
    
    margin-top: 20px;
    margin-bottom: 20px;
    padding-bottom: 10px;

    text-align: left;
    font-weight: bold;
    font-size: 1.2em;
    background: none !important;
}
#order-progress .active {
color: var(--CI) !important;
}
#order-progress .done {
    color: #62c05c !important;
}

#order-progress div.col:first-child .step-label {
    margin-left: 0px !important;
}
}



/*******************************************************************************
 * Order overview
 */

.order-overview-header {
    text-align: center;
    padding: 1em;
    background: whitesmoke;
    margin-bottom: 0 !important;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
}

.order-overview__section-header {
    padding: 1em;
    text-align: left;
}

.order-overview__section-header i {
    color:  var(--CI);
}

/* OLD

.order-overview__section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: white;
    padding: 0em;
}
*/

.order-overview__section-header h4 {
    font-weight:  bold;
    margin-bottom: 0;
    width: 100%;
    text-align: left;
}

.overview-edit-button {
    background: whitesmoke;
    border-radius: 5px;
    padding: 0.33em 0.66em;
    float: right;
    margin-top: -26px;
}

.order-overview label {
    margin-bottom: 0;
}

.order-overview__item {
    display: flex;
    justify-content: space-between;
}

.order-overview__group, .order-overview .form_move_dates, .order-overview .overview-loan {
    margin-bottom: 1rem;
    border-radius: 5px;
}

.order-overview__group {
    text-align: left;
}

.overview-furniture, .overview-services, .overview-adresses, .overview-partner {
    padding: 0em;
    padding-bottom: 0.1em;
    border-bottom: 1px solid #cdcdcd;
}

.overview-furniture .order-overview__group , .overview-services .order-overview__group {
    padding: 0em 1em;
}

.overview-edit {
    text-align:  center;
}

.overview-edit a {
    padding:  0.5em 1em;
    background:  lightgray;
}

.order-overview-partner-details {
    display: flex;
}

.order-overview-partner-details-image {
    flex: 1;
    padding-left: 1em;
    padding-bottom: 1em;
}

.order-overview-partner-details-text {
    flex: 3;
    padding-left: 1em;
}


.order-overview .form_move_dates, .order-overview .overview_adressdetails, .order-overview .overview-loan, .form_move_dates {
    padding: 1em;
    border-radius: 5px;
    background: white;
    box-shadow: 0 2px 6px rgba(0,0,0,.25);
}

.transport-insurance {
    border-radius: 5px;
}

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

.overview-furniture-all, .overview-services-all {
    column-count: 2;
}

.overview-furniture-all {
    padding-bottom: 1em;
}

.order-overview .order-overview__group {
    break-inside: avoid-column;
}
}

/* Hide addresses on overview page */


.page-id-4138 .overview_adressdetails {
    display:  none !important;
}




/*******************************************************************************
 * Order overview Insurance
 */

 .transport-insurance {
    box-shadow: 0 2px 6px rgba(0,0,0,.25);
    background: white;
    margin-top: 1em;
    padding: 1em;
 }

.transport-insurance__header {
    display: flex;
    flex-direction: row;
}

#insuranceValue {
    display: inline-flex !important;
    width: 250px !important;
    margin-right: 5px !important;
}

.transport-insurance__logo-wrapper {
    float: right;
    margin-left: auto;
}

.insurance_cost_info {
    font-size:  18px;
    padding-top: 30px;
    padding-left: 15px;
}

.transport-insurance__text-value, .transport-insurance-reference__text-value {
    font-weight:  bold;
}

/*******************************************************************************
 * Rounding elements in the volume calculator
 *
 */

 




/*******************************************************************************
 * Full volume calculator
 *
 */

.volume-calc {
    margin: 0 0 2rem 0;
    min-height: 50vh;
}

.page-id-2665 .volume-calc {
    margin-top: 0;
}

.order-overview .volume-calc {
    margin-bottom: 1rem;
    border-radius: 10px;
}

/* Margins for the three blocks on the volume calc page */

.rooms,
.product-sel__footer {
    margin-bottom: 2rem;
}

.product-sel__header {
    background: var(--CI);
    padding: 0.4rem 1rem;
}

.product-sel__header.product-sel__header h3 {
    color: white;
    margin: 0;
    font-size: 16px;
    font-weight: 700;
}

.product-sel {
    display: flex;
    justify-content: stretch;
}

.product-sel__categories,
.product-sel__products {
    flex: 1;
    border: 2px;
    border-top-width: 0;
    border-bottom: 2px solid #e0e0e0;
}

.product-sel__categories {
    border-right-width: 1px;
}

.product-sel__products {
    border-left-width: 1px;
    position: relative;
}

.product-sel__category {
    padding: 0.333rem 0.666rem;
    cursor: pointer;
    background: white;
}

.product-sel__category:hover {
    background: #e0e0e0;
}

.product-sel__category--selected,
.product-sel__category--selected:hover {
    background: var(--CI);
    color: white;
}

.product-sel__categories-header,
.product-sel__products-header {
    color: black;
    background: #e0e0e0;
    font-weight: 700;
    padding: 0.4rem 0.7rem;
    text-align: center;
}

.product-sel__products-header {
    padding: 3.25px 2.5px 3.25px 0rem;
    margin: 0;
}

.product-sel .product-sel__products-header input {
    margin: 0;
    padding: 6px 0.7rem;
    font-size: 15px;
    width: 100%;
    border: 1px solid gray;
    /* Needed because Firefox renders the input with 2 more pixels in height */
    height: 32px;
    background: white;
    color: black;
}

.product-sel__category-list,
.product-sel__product-list {
    border-right: 1px solid #e0e0e0;
    height: 435px;
    overflow: auto;
    background: white;
}

.product-sel__product {
    min-height: 36px;
    padding: 0.333rem 0.666rem;
    display: flex;
    flex: 0 0 auto;
}

.product__text {
    flex: 1;
    align-self: center;
    line-height: 1.2;
}

.product__desc {
    color: #999;
}

.cat-packaging .product__desc {
    display: none;
}

.product__controls {
    display: flex;
    align-self: center;
    margin-right: 6px;
}

.product__add-controls {
    display: flex;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
}

.product__qty.product__qty {
    width: 42px;
    margin: 0;
    padding: 0 0.1rem;
    text-align: center;
    border: 0;
    background: transparent;
    font-size: 18px;
}

.product__qty:focus {
    border-color: #e0e0e0;
}

.product__increment,
.product__decrement {
    background: transparent;
    padding: 0.133rem 0.233rem;
    font-size: 18px;
}

.product__increment:hover,
.product__decrement:hover {
    background-color: #efefef;
}

.product__increment.product__increment {
    color: #07be5d;
    border-left: 1px solid #e0e0e0;
}

.product__decrement.product__decrement {
    color: red;
    border-right: 1px solid #e0e0e0;
}

.product__confirm {
    background: transparent;
    padding: 0;
    padding-left: 0.5rem;
    color: #07be5d;
    font-size: 24px;
}

.product__confirm:hover {
    transform: scale(1.1);
}

.product__confirm:active {
    transform: scale(0.95);
}

.product__icon {
    width: 30px;
    margin-right: 12px;

    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}

.room__product-selection .product__add,
.product-sel .product__add {
    background: transparent;
    color: var(--CI);
    padding: 0px 1px;
    font-size: 20px;
    border:none;
}

.room__product-selection .product__add:hover,
.product-sel .product__add:hover {
    transform: scale(1.1);
}

.room__product-selection .product__add:active,
.product-sel .product__add:active {
    transform: scale(0.9);
}

#angle-down {
    color: var(--CI);
}

#expand-here {
    font-size: 20px;
    padding: 8px 8px 8px 0;
}

.button-sixt {
    background: var(--CI);
    color: white;
    text-align: center;
    width: 30%;
    padding: 0.5rem 0.5rem;
    margin: 0.5rem 0.5rem;
}


.separator-div {
z-index: 9999;
transform: translate(0%, -2px);
background: whitesmoke;
top: 0px;
position: sticky;
text-align: center;
margin-bottom: 0;
padding: 0.2em;
font-size: 15px;
line-height: 26px;
max-height: 36px;
}

.separator-list {
    margin-bottom: 15px !important;
    background: #404040;
    height: 1px;
    margin-top: 15px;
}

.separator-title {
    font-size: 15px;
    padding-bottom: 0 !important;
    padding-top: 0 !important;
    background: whitesmoke;
    padding: 10px;
    position: relative;
    top: -15px;
}

.product-selection__product-list {
transform: translate(0%, 2px);
}

.product-search-bar {
    display:  inline-flex;
    flex-direction: row;
    padding: 0em;
    width: 100%;
}

.product-search-bar input {
    padding-right: 0;
    background-color: white !important;
}


@media only screen and (max-width: 959px) {
    .product-sel__categories {
        flex: 2;
    }

    .product-sel__products {
        flex: 3;
    }
}

@media only screen and (max-width: 479px) {
    .product-sel {
        flex-direction: column;
    }

    .product-sel__category-list {
        display: none;
    }

    .product-sel__categories-header {
        display: none;
    }

    /** Categories hidden from 12.12.18 for simplicity and increase in height in product lists from 240px t0 400ox */

    .product-sel__product-list {
        height: 350px;
    }

    .generic-product__form-name .generic-product__form-name {
        width: 100% !important;
    }
}

.boxen_formular .gform_footer {
    display: none !important;
}

/** Order Side Bar. FAQ and Misc. */

.header-pricing {
    text-align: center;
    padding: 10px;
    margin: 0px;
}

ul.faq-list {
    position: relative;
    list-style: none !important;
    margin-left: 0px !important;
    padding-left: 21px !important;
    margin-bottom: 10px !important;
}

ul.faq-list li:before {
    color: #626262;
    content: '➤';
    position: absolute;
    left: 0;
}

.faq-prozess p, .contact-options-sidebar p {
    color: #626262;
    text-align: left;
    font-size: 0.9rem;
    margin: 0 0 12px !important;
    line-height: 1.4rem;
    box-shadow: 2px 2px 10px 0 rgba(0,0,0,.15);
}

.contact-options-sidebar {
    margin-top: 1em;
    background: white;
    padding: 1em;
    border: 1px solid #e6e6e6 !important;
}

.contact-options-sidebar i {
    font-size: 1.15em;
    color: var(--CI);
    margin-right: 6px;
}

.contact-options-sidebar p {
    margin-bottom: 10px !important;
}

.faq-prozess a, .contact-options-sidebar a {
    color: #626262 !important;
}

.order-list__price .fa-trash {
    display: none;
}

.fa-ul {
    list-style-type: none !important;
    margin-left: var(--fa-li-margin,2.5em) !important;
}

.advantages-pricebox {
    margin-top: 2em;
}

.advantages-pricebox ul li {
    margin-bottom: 5px;
}

/** Popup Styles for FAQ-Sidebar*/

.vc_tta-title-text {
    font-size: 16px;
    color: black;
}

.vc_active .vc_tta-title-text {
    color: var(--CI);
}

.vc_tta-panel-body p {
    font-size: 15px;
    color: black;
}

/**
 * Rooms
 */

.volume-cal .rooms {
    min-height: 400px;

    position: relative;
}

.rooms__list {
    /*border-bottom: 2px solid #e0e0e0;*/
}

.room__contents-header-info-height{
    font-size: 0.9em;
}

.room__tabs {
    display: none;
    flex-direction: row;
}

.room--active .room__tabs {
    display: flex;
}

@media only screen and (min-width: 768px) {
    .room__tabs.room__tabs {
        display: none;
    }
}

.room__tab {
    flex: 1;
    padding: 1rem;
    border-bottom: 1px solid #cdcdcd;
    background-color: #efefef;

    color: #666;

    display: flex;
    justify-content: center;
    align-items: center;

    cursor: pointer;

    position: relative;
}

.room__tab:before,
.room__tab:after {
    content: '';
    background: inherit;
    height: 100%;
    width: 10px;

    top: 0;

    position: absolute;
}

.room__tab:before {
    left: -6px;
    transform: skew(-12deg);
    border-left: 1px solid #cdcdcd;
}

.room__tab:after {
    right: -6px;
    transform: skew(12deg);
    border-right: 1px solid #cdcdcd;
}

.room__tab:not(.room__tab--active):hover {
    color: black;
}

.room__tab:first-child:before {
    display: none;
}

.room__tab:last-child:after {
    display: none;
}

.room__tab--active {
    background-color: white;
    color: black;
    z-index: 100;
}

.room__tab--active:before,
.room__tab--active:after {
    background: white;
}

.room__tab-title {
    margin-right: 0.666rem;
}

.room__tab-extra {
    margin-left: 5px;
    font-weight: bold;
    color: var(--CI);
}

.rooms__control-group {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    margin-bottom: 1rem;
}

.volume-calc .rooms__room-options {
    list-style: none;
    margin: 0;
    width: 250px;

    background-color: white;
    border: 1px solid #cdcdcd;

    position: absolute;
    top: 50px;

    z-index: 110;
}

.volume-calc .rooms__room-option {
    margin: 0;
    padding: 0.333rem;
}

.volume-calc .rooms__room-option:hover {
    background-color: var(--CI);
    color: white;
    cursor: pointer;
}

.room-option__check {
    visibility: hidden;
    margin-right: 0.333rem;
}

.volume-calc .rooms__room-option:hover .room-option__check {
    visibility: visible;
}

.rooms__add-button {
    background: var(--CI);
    color: white;
    font-weight: bold;
    font-size: 15px;

    width: 228px;

    border-radius: 5px;

    cursor: pointer;

    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem;
    margin: 0;

    right: 0;
}

.rooms__add-button i {
    font-size: 20px;
    margin-left: 6px;
}

.rooms__add-button:hover {
    transform: scale(1.05);
}

.rooms__add-button:active i {
    transform: scale(0.9);
}

.room__title {
    cursor: pointer;
    padding: 0.333rem 1rem 0.333rem 0;
    display: flex;
    align-items: center;
    border-left: 4px solid white;
    background: #e0e0e0;
    border-bottom: 1px solid rgb(192, 192, 192);
}

.room-full-name {
    border-bottom: 1px solid #cdcdcd;
    width: 100%;
}

.room-full-name  input[type="text"] {
    margin-bottom: 0px !important;
}

.room__title-immutable {
    display: inline;
    padding: 0.15rem 0.333rem;
    pointer-events: none;
}

.room__indicator {
    padding: 1rem;
    pointer-events: none;
}

/* Open room */
.room--active .room__indicator {
    transform: rotate(90deg);
}

/* Selected room (can be closed, too!) */
.room--selected .room__title {
    border-left: 4px solid var(--CI);
    border-top-right-radius: 5px;
}

.room--selected {
    box-shadow: 2px 2px 10px 0px rgba(0, 0, 0, 0.25);
    background: white;
    border-radius:  10px;
}

.room__remove {
    font-size: 20px;
    padding: 1rem;
    color: var(--CI);
}

.room .room__title input.room__suffix {
    display: inline;
    font-size: 100%;
    padding: 0.133rem 0rem;
    margin: 0;
    max-width: 165px;
    width: auto;
    color: black;
    background-color: transparent !important;
    border: none;
    box-shadow: none;
}

.room .room__title input.room__suffix:focus {
    border-color: #a0a0a0;
}

.room:not(.room--active) .room__body {
    display: none;
}

.room__body {
    display: flex;
    flex-direction: row;

    border-radius: 5px;

    background: white;
}

.room__contents-header {

    flex: 1;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;

    font-weight: bold;
    color: var(--CI);

    text-align: center;

    border-bottom: 1px solid #cdcdcd;

    min-height:  50px;
    height: 50px;
    background:  whitesmoke;
}

.room__contents-header-title {
    color: var(--CI);
}

.room__product-selection {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.product-selection__tabs {
    display: flex;
    flex-direction: row;
    min-height: 50px;
}

.product-selection__tab {
    cursor: pointer;
    flex: 1;

    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;

    padding: 0.5rem 0.1rem;
    text-align: center;

    color: var(--CI);

    background: whitesmoke;
}

.product-selection__tab i {
    margin-bottom: 0px;
    margin-right:  10px;
}

.product-selection__tab:not(.product-selection__tab--active):hover {
    color: black;
}

.product-selection__tab--active {
    background-color: whitesmoke;
    color: var(--CI);
    font-weight: bold;
}

.product-selection__product-list {
    height: 400px;
    overflow: auto;
}

.product-selection__search {
    background-color: white !important;
    box-shadow: none;

    border: none !important;
    
    display: inline;
    
    width:  auto !important;
    border-top-right-radius: 20px !important;
    border-bottom-right-radius: 20px !important;
    margin-bottom:  0px !important;
}

.product-search-bar .fa-search {
  padding: 0.2em 0.4em 0.1em 0.5em;  
  line-height: 2;
  color:  var(--CI);
}


.room__contents {
    flex: 1;
}

@media screen and (min-width: 768px) {
    .room__contents {
        border-left: 1px solid #cdcdcd;
    }
}

.room__items {
    height: 100%;
    max-height: 530px;
    overflow: auto;
}

.product-selection__generic {
    border-top: 1px solid #cdcdcd;
    padding: 0rem 1rem;
}

.product-selection__generic.product-selection__generic input {
    margin-bottom: 0.66em !important;
    background-color: #efefef !important;
    box-shadow: none;
    border-radius: 4px;
    border: none;
    width: 140px;
    margin-right: 5px !important;
    border-radius:  5px !important;
}

.generic-product-form__title {
    margin-top: 10px;
    font-weight:  bold;
    color: var(--CI);
}

.generic-product-form__name.generic-product-form__name {
    width: 100% !important;
    margin: 0;
}

.generic-product-form__dimensions {

    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-end;
}

.generic-product-form__dimensions img {
    flex: 0 0 100%;
    align-self: flex-start;

    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.generic-product-form__num {
    flex:  1;
    max-width: 110px !important;
    margin-bottom: 0px !important;
}

.generic-product-form__submit.generic-product-form__submit {
    background: transparent;
    color:  var(--CI);
    padding: 0 !important;
    float: right;
    margin: auto;
    margin-right: 0;
}

.product-card {
    display: flex;
    flex-direction: column;
    align-items: center;

    position: relative;

    width: 150px;
    min-width: 130px;

    margin: 0 0.50em;

    margin-bottom: 1.5rem !important;
}

.product-card__control-group input[type="text"] {
    margin-bottom: 0 !important;
} 

.page-id-3571 .product-card {
	flex:  1;
}

.price-card.price-card {
    width: 160px;
}

.moving-material-section .price-card.price-card {
    width: 22%;
}

.product-card__icon {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    background-color: white;

    border-radius: 6px;

    width: 50px;
    height: 54px;

    position: relative;
}

.page-id-2665 .product-card__icon {

    width: 120px;
    height: 120px;

}

.product-card__info {
    position: absolute;
    right: 0;
    color: #01528b;
    cursor: pointer;
    font-size: 1.333rem;
}

.product-row {
    min-height: 36px;
    display: flex;
    flex: 0 0 auto;
    flex-direction: row;
    align-items: center;

    padding: 0.333rem 0.666rem;

    position: relative;
}

.product-row__icon {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    background-color: white;

    width: 30px;
    height: 27px;

    margin-right: 12px;
}

.product-row__title {
    line-height: 1.2;
    flex: 1;
}

.product-row__dimensions {
    color: #999;
    font-size: 0.8em;
    margin-left: 0.333rem;
}

.product-row__control-group {
    display: flex;
    border: 1px solid grey !important;
    border-radius: 6px;
    padding: 0;
    background: white;
    align-self: center;
    min-width: 60px;

    font-size: 0.75em;
}

.product-row__control-group span {
    display: inline-block;
    flex: 0 0 auto;
    padding: 0.444rem 0.5rem;
    margin: 0;
    background: transparent;
    text-align: center;
    font-size: 14px;
    line-height: 14px;
    cursor: pointer;
}

.product-row__control-group.product-row__control-group input {
    display: inline-block;
    width: 36px !important;
    margin: 0 !important;
    padding: 0 0.333rem !important;

    border: none !important;

    background: transparent;

    font-size: 14px;
    text-align: center;
}

.info-icon-blue {
    color: var(--CI);
    cursor: pointer;
    font-size: 1rem;
}

.info-icon-blue-margin {
    color: var(--CI);
    cursor: pointer;
    font-size: 1rem;
    margin-right: 5px;
}

.product-card__title {
    text-align: center;
    cursor: default;
    font-size: 100%;
    margin: 0.333rem 0;
    min-height: 25px;
    max-width: 100%;
    flex: 1;
}

.price-card__title {
    text-align: center;
    cursor: default;
    font-size: 110%;
    margin: 0.333rem 0;
    color: var(--CI);
    font-weight: bold;
    flex: 1 1 auto;
    max-width: 100%;
}

.price-card__prices {
    text-align: center;
    cursor: default;
    margin-bottom: 0.333rem;
    font-size: 90%;
}

.product-card__control-group,
.product-card__control-group-x {
    display: flex;
    border: 1px solid grey;
    border-radius: 6px;
    padding: 0;
    background: white;
    align-self: center;
    min-width: 60px;
}

.product-card__plus.product-card__plus {
    border-left: 1px solid grey;
    color: var(--CI);
    opacity: 0.8;
    /*
    color: #07be5d; 
    */
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;

    flex: 0 0 auto;
}

.product-card__plus.product-card__plus:hover {
    background: rgba(0, 0, 0, 0.05);
}

.product-card__minus.product-card__minus {
    border-right: 1px solid grey;
    color: var(--CI);
    opacity: 0.8;
    /*
    color: red;
    */
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;

    flex: 0 0 auto;
}

.product-card__minus.product-card__minus:hover {
    background: rgba(0, 0, 0, 0.05);
}

.product-card__edit.product-card__edit {
    border-left: 1px solid grey;
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
}

.product-card__edit.product-card__edit:hover {
    background: rgba(0, 0, 0, 0.05);
}

.product-card__control-group-x span,
.product-card__control-group span {
    display: inline-block;
    flex: 0 0 auto;
    padding: 0.444rem 0.5rem;
    margin: 0;
    background: transparent;
    text-align: center;
    font-size: 18px;
    line-height: 18px;
    cursor: pointer;
}

.product-card .product-card__control-group-x input,
.product-card .product-card__control-group input,
.product-card__control-group.product-card__control-group input {
    display: inline-block;
    width: 50px;
    margin: 0;
    padding: 0 0.666rem;

    border: 0;

    background: transparent;

    font-size: 15px;
    text-align: center;
}

.service-group .product-card__control-group {
    border:none;
    min-widht: unset;
}

.service-group .product-card__control-group .product-card__minus, .service-group .product-card__control-group .product-card__plus {
    display: none;
}

.service-group .product-card__control-group input {
    padding: 0 !important;
    width: 30px !important;
    box-shadow: none !important;
}

.service-group .product-card__control-group::before {
    content: "Menge:";
}


.mini-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: stretch;

    width: 150px;

    flex: 0 0 auto;
}

.mini-card__icon {
    flex: 1;
    height: 100px;
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
}

.mini-card__title {
    font-weight: bold;
    text-align: center;
    margin-bottom: 0.333rem;
}

.mini-card__price-desc {
    margin-top: 0.333rem;
    text-align: center;
    font-size: 75%;
    line-height: 1.5;
}

.mini-card--row {
    display: flex;
    flex-direction: row;
}

.mini-row__body {
    display: flex;
    flex: 2;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-top: 1rem;
}

.mini-card--row .mini-card__icon {
    height: 80px;
    width: 80px;
}

.product-container
    .product-card__control-group.product-card__control-group
    input {
    width: 50px;
}

@media only screen and (max-width: 767px) {
    .rooms__add-button {
        position: static;
        margin-top: 5px;
    }

    .rooms__control-group {
        justify-content: flex-start;
    }

    .price-card.price-card {
        width: 150px;
    }

    .mini-card--row {
        flex-direction: column;
        align-items: center;
    }
}


/** Storage **/

.page-id-99000 .shutzmaterial, .page-id-99000 .rent_box_clothes ,.page-id-99000 .kartonrechner-infobox{
    display:  none;
}

/*******************************************************************************
 * Box selection
 */

.boxes.boxes input {
    margin: 0;
}

.boxes__edit {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    padding: 0rem 1rem;
}



.boxes__items {
    display: flex;
    flex-wrap: wrap;
}

.boxes {
    background: white;
}

.boxes__box {
    padding: 1rem 0rem;
    display: flex;
    flex-direction: column;
    align-items: center;

    flex: 1;
}

#boxes__buy-box {
    border-left: 1px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
}

.boxes__desc {
    max-width: 100%;
}

.boxes__desc h4 {
    text-align: center;
    margin-bottom: 0.333rem;
}

.boxes .mini-card {
    margin-top: 1em;
    width: auto;
}

.boxes .boxes__edit .boxes__box .product-card__control-group {
    min-width: 32px;
}

.boxes .boxes__edit .boxes__box .product-card__control-group span,
.boxes .boxes__edit .boxes__box .product-card__control-group input {
    font-size: 16px;
}

.boxes .boxes__edit .boxes__box .product-card__control-group span {
    padding: 0.3rem 0.44rem;
}

.boxes .boxes__edit .boxes__box .product-card__control-group input {
    width: 36px;
    padding: 0 0.133rem;
    margin: 0 0.333rem;
}

#roompack {
    width: 95%;
    max-width: 330px;
    padding: 10px 10px 7px 10px;
    -moz-appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
    background-image: url('../images/icon_dropdown_arrow.svg');
    background-repeat: no-repeat;
    background-position: 100.5% 0;
    margin-bottom: 10px;
}

#rentalduration {
    width: 95%;
    max-width: 330px;
}

#roompack,
#rentalduration {
    background-color: white;
    font-weight: 800;
}

#delivery-timeslot,
#retrieval-timeslot,
#rentalduration,
#moveout-time,
#moveout-duration,
#movein-time,
#movein-duration {
    padding: 10px 10px 7px 10px;
    -moz-appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
    background-image: url('../images/icon_dropdown_arrow.svg');
    background-repeat: no-repeat;
    background-position: 100.5% 0;
}

@media only screen and (max-width: 767px) {
    .boxes__edit {
        padding: 0.666rem 0.333rem;
    }

    .boxes__rent-dates {
        flex-wrap: wrap;
    }

    .boxes__rent-dates label {
        min-width: 100px;
    }

    #boxes__buy-box > .boxes__desc {
        width: 100%;
    }

    #boxes__buy-box .boxes__desc span {
        margin-bottom: 10px;
    }
}

@media only screen and (max-width: 479px) {
    .boxes__rent-dates > div,
    .box__rent-dates {
        flex-wrap: wrap;
    }

    .boxes__rent-dates input {
        width: 100% !important;
    }

    .boxes h4 {
        font-size: 15px;
    }
}

/*******************************************************************************
 * Service selection.
 */

.service-selection h4 {
    font-size: 18px;
    line-height: 100%;
}

.service-selection h5 {
    font-size: 18px;
    font-weight: 400;
}

.service-selection {
    color: #808080;

    position: relative;

    min-height: 350px;
    margin-bottom: 2rem;
}

.service-cat {
    border-radius: 5px;
}

.service-cat__header {
    background: #e0e0e0;
    display: flex;
    padding: 1rem;
    box-shadow: 2px 2px 10px 0px rgba(0, 0, 0, 0.15);
}

.service-cat__room-title {
    color: var(--CI);
}

.service-cat__room {
    padding: 1rem;

    /* Reset the service-item counter.
       See .service-item__title
    */
    counter-reset: service-item-counter;
}

.service-cat__room > * {
    max-width: 100%;
}

.service-group .product-card {
    width: 200px;
    min-width: 150px;
}

.service-group__container {
  flex:  2;
}

.service-group__container .service__input {
    width: 100%;
}

/**
 * The following rules show a 'No services available for this room' text.
 *
 * Because of the current noodle-like structure of some of the Vue code it will
 * just place an element in the HTML (.service-cat__empty). This element will be
 * hidden by default.
 *
 * The service containers of rooms are <div> elements. That means the
 * `div:first-of-type` selector will only apply to the 'No services' text if no
 * service containers exist.
 *
 * With services:
 *     <room>
 *         <div service>
 *         <div service>
 *         ...
 *         <div no-services-text>
 *     </room>
 *
 * Without services:
 *     <room>
 *         <div no-services-text>
 *     </room>
 */

 /* Hide some services for packaging */
 .cat-packaging .Eigene, .cat-packaging .Kleiderkarton,.cat-packaging .Kleiderbox {
    display: none;
 }

/* Hide text by default. */
.service-cat__empty .service-cat__empty-text {
    display: none;
}

.service-cat__empty {
    padding: 1em;
}

/* Show text if no services are available. */
.service-cat__room > div:first-of-type > .service-cat__empty-text {
    display: inline-block;
}

.service-cat__content > div:first-of-type > .service-cat__empty-text {
    display: inline-block;
}

.service-cat__room:not(:first-child) {
    border-top: 2px solid #e0e0e0;
}

.service-cat__button {
    background: white;
    color: var(--CI);
    font-size: 16px;
    font-weight: 700;
    border:  none !important;

    border-radius:  5px !important;

    flex: 1;
    height: 3rem;

    padding: 11px 20px;

    border-radius: 5px;

    margin: 0;
    margin-right: 1rem;

    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: left;
}

.service-cat__button i {
    font-size: 24px;
}

.service-cat__desc {
    color: black;
    flex: 2;
}

.service-cat__content {
    background: white;
    padding: 0rem;
}

.service-cat__content.service-cat__content input {
    margin: 0;
    border-top-right-radius: 20px !important;
    border-bottom-right-radius: 20px !important;
}

.service-group {
    display: flex;
    align-items: center;
}

.service-group-services {
    align-items: flex-start;
    display: flex;
    flex: 2;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    padding-left: 1em;
}

.service-cat__room .service-group {
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}

.service-cat__room .service-group:not(:first-of-type) {
    border-top: 1px solid #e0e0e0;
}

.service-cat__room .product-card {
    margin-bottom: 0em !important;
}

.service-cat__room .service-group input[type="text"] {
	font-size: inherit !important;
}

.service-group-services .service {
    flex-direction: column-reverse;
}

.service-group-services .service .service__desc {
margin-bottom: 5px;
}

.service-group.service-group--individual {
    flex-direction: column;
    align-items: stretch;
}

.service {
    width: calc(48% - 1.6em);
    display: flex;
    margin-left: 1.5rem;
}

div.service:nth-of-type(3), div.service:nth-of-type(4) {
    margin-top: 1em !important;
}

.service-group .product-card__icon {
    width: 50px;
    height: 50px;
}

.service-group .product-card__control-group input {
    padding: 0.333rem;
    width: 60px;
}

.service-group__heading {
    margin-left: 3rem;
    color: var(--CI);
    font-weight: 700;
}

.service__title {
    font-weight: bold;
    display: block;
}

.service__desc {
}

.service .service__input.service__input {
    width: 100px;
    min-width: 100px;
    margin: 0;
    margin-right: 1rem;
    padding: 0.333rem 0.666rem;
    font-size: 16px;

    border: 1px solid grey;
    border-radius: 6px;
    background-color: white;
}

.service .servce__input.service__input > option {
    text-align: center;
}

.service-item {
    /*flex: 0 0 100%;*/
    margin-bottom: 0.333rem;
}

.service-item--selected {
}

.service-item__header {
    display: flex;
    align-items: center;

    background: #e0e0e0;
    color: #444;

    cursor: pointer;
}

.service-item__header i {
    font-size: 20px;
    padding: 0.666rem;
}

.service-item__title:before {
    content: counter(service-item-counter) '.';
    counter-increment: service-item-counter;
}

.service-item__title {
    flex: 1 0 60%;
}

.service-item__header-icon {
    width: 40px;
    height: 40px;

    margin: 0.333rem;

    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
}

.service-item__controls {
    align-self: flex-start;
    display: flex;
    flex: 1;
    justify-content: flex-end;
    padding-top: 0.333rem;
}

.service-item__controls .service-item__remove {
    margin-right: 12px;
}

.remove-service__selection input[type='text'],
.generic-product__form input[type='text'] {
    width: auto;
}

.service-item__remove {
    color: var(--CI);
    cursor: pointer;
    font-size: 20px;
}

.service-item__content {
    display: flex;
}

.remove-service__content {
    display: flex;
    box-shadow: 2px 2px 10px 0px rgba(0, 0, 0, 0.25);
}

.remove-service__left-side {
    flex: 1;
}

.remove-service__selection {
    display: flex;
    flex-direction: column;
    overflow: auto;
    max-height: 400px;
    padding-right: 0.33em !important;
}

.remove-service__label {
    display: flex;
    padding: 1em;
}

.remove-service__label h5,.remove-service__label .product-search-bar {
    flex:  1;
}

.remove-service__right-side {
    flex: 1;
    border-left: 1px solid #cdcdcd;
}

.remove-service__items {
    max-height: 300px;
    overflow: auto;
    padding-right: 5px;
}

.remove-service__item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.1rem 0.5rem;
}

.remove-service__item i {
    cursor: pointer;
}

@media only screen and (max-width: 1239px) {
    .service-cat__button {
        font-size: 14px;
    }

    .service-cat__button .fa {
        font-size: 16px;
    }
}

@media only screen and (max-width: 959px) {
    .generic-product__form-image {
        display: none;
    }
}

@media only screen and (max-width: 767px) {
    .service-cat__header {
        flex-wrap: wrap;
    }

    .service-cat__button {
        flex: none;
        width: 100%;
    }

    .service-cat__desc {
        flex: none;
        max-width: 100%;
        padding: 1rem 0 0 0;
    }

    .service-group {
        flex-wrap: wrap;
    }

    .service-group__heading {
        margin-left: 1rem;
    }

    .service-cat__room-title {
        text-align: center;
    }

    .service-cat__room .service-group:not(:first-of-type) {
        margin-top: 2rem;
        padding-top: 1rem;
        border-top: 1px solid #e6e6e6;
    }

    .service-selection .product-card {
        width: 100%;
        justify-content: center;
        flex: none;
    }

    .service-selection .service {
        align-items: left;
        width: 47%;
    }

    .service {
        flex-direction: column-reverse;
        margin-left: 1rem;
        margin-top: 1rem;
    }

    .service-group__container {
        width: 100%;
    }

    .service-group__container .service-group {
        flex-wrap: nowrap;
    }

    .service-group__container .service__input {
        width: 100%;
    }

    .remove-service__content {
        flex-direction: column;
    }

    .remove-service__left-side {
        margin-bottom: 1rem;
    }

    .remove-service__selection {
        max-height: 270px;
    }

    .remove-service__generic {
        padding: 1rem 0;
    }

    .generic-product__form-image {
        display: block;
    }

    .remove-service__label {
        display:  flex;
        padding: 1em;
        min-height: 1px !important;
        background: whitesmoke;
    }

    .remove-service__label label {
        margin-bottom: 10px;
    }
}

@media only screen and (max-width: 479px) {
    .service-selection .service {
        max-width: 42%;
    }
}

/*******************************************************************************
 * Generic product controls.
 */

.room__generic-edit {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    background: white;
    padding: 1rem;
}

.generic-product__body {
    display: flex;
    align-items: stretch;
}

.generic-product__list {
    width: 100%;
    column-count: 2;
    overflow: auto;
    border-top: 1px solid #e0e0e0;
}

.generic-product__list-item {
    display: flex;
    align-items: center;

    /* background-color: #e0e0e0; */
    padding: 0.333rem 0.666rem;
    border-bottom: 1px solid white;

    cursor: pointer;
}

.generic-product__list-item:last-child {
    border-bottom: none;
}

.generic-product__toggle.generic-product__toggle {
    font-size: 26px;
    line-height: 26px;
    color: #808080;
}

.generic-product__title {
    flex: 1;
    margin: 0 1rem;
}

.remove-service__selection .product__title {
    color: black;
}

.generic-product__delete.generic-product__delete,
.custom_item {
    font-size: 22px;
    line-height: 22px;
    color: #808080;
}

.generic-product__delete:hover {
    color: red;
}

.generic-product__delete:active {
    transform: scale(0.85);
}

.generic-product__form {
    flex: 3;

    display: flex;
    flex-direction: column;
    align-items: stretch;

    margin-bottom: 1em;
}

.generic-product__form-image {
    flex: 1;
    width: 100%;
    margin-top: 20px;
    align-self: center;
}

.generic-product__form-dimensions {
    display: flex;
}

.generic-product__form-dimensions.generic-product__form-dimensions input {
    display: inline-block;
    min-width: 80px;
    width: 20%;
    margin: 0;
}

.generic-product__form-dimensions.generic-product__form-dimensions button {
    font-size: 100%;
    padding: 11px 0px;
    margin: 0;
    min-width: 100px;
    color: white;
    background: var(--CI);
}

.generic-product__form-dimensions i {
    margin-left: 4px;
    font-size: 20px;
}

.generic-product__form-dimensions * {
    font-size: 100%;
    flex: 49%;
    vertical-align: middle;
}

.generic-product__form-name.generic-product__form-name {
    margin: 0;
}


@media only screen and (max-width: 767px) {
    .generic-product__list {
        column-count: 1;
    }

    .generic-product__body {
        flex-direction: column-reverse;
    }

    .generic-product__form {
        margin-bottom: 2em;
    }

    .generic-product__form-dimensions {
        flex-wrap: wrap;
    }
}

@media only screen and (min-width: 767px) {
    .generic-product__form-body {
        display: flex;
    }

    .generic-product__form-dimensions.generic-product__form-dimensions button {
        margin-left: 1rem;
    }

    /*
    .page-id-3571 .service {
        min-width: 280px;
    }
    */
}

/*******************************************************************************
 * Volume calculator global block.
 */

.volume-calc__global {
    background:  white;
    margin-top: 2rem;
    box-shadow: 2px 2px 10px 0px rgba(0, 0, 0, 0.25);
    border-radius: 5px;
}

.volume-calc__global .heading--orange {
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}

.info-packaging-small {
    font-size: 80% !important;
    text-align: center;
}

.global__header {
    padding: 0 1rem 1rem;
}

.volume-calc__global .global__content {
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}


.kartonrechner-info {
    margin: 0 !important;
}

.kartonrechner {
    text-align: center;
}

.kartonrechner-info i {
    color:  white !important;
}

.kartonrechner a {
    margin:  1em 1em 0em 1em;
    color: white;
    padding: 1em 3em;
    border-radius: 5px !important;
    background:  var(--CI);
    font-size:  15px;
    font-weight:  bold;
}

.kartonrechner a:hover {
    color: black;
}

/*******************************************************************************
 * Rent box page.
 */

/*
.product-container {
    border-bottom: 2px solid #e0e0e0;
}



.product-container__header {
    cursor: pointer;
    background: #e0e0e0;
    padding: 0.666rem;
}

 */

.boxes-package {
    flex-direction: row !important;
}

.boxes-package div {
    flex:  1;
}

.product-container__header h3,
.product-container__header h4 {
    margin: 0;

    color: var(--CI);
}

.product-container__content {
    display: flex;
    flex-wrap: wrap;
}

.product-container__boxes,
.product-container__boxes-desc {
    flex: 1;
}

.product-container__boxes {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.product-container__boxes .box-set {
    margin-bottom: 20px;
}

.product-container__boxes .box-set .product-card__control-group {
    margin-top: 10px;
}

.product-container__boxes-desc h5,
.the_content_wrapper .product-container__boxes-desc ul li {
    margin-bottom: 0;
    font-size: 90%;
    line-height: 24px;
    color: var(--CI);
}

.the_content_wrapper .product-container__boxes-desc ul {
    margin-left: 0;
    list-style: disc inside;
}

.product-container__boxes label {
    color: var(--CI);
    font-size: 90%;
    margin-bottom: 0;
}

.box-set {
    display: flex;
    flex-direction: column;
    align-items: center;

    width: 180px;
    /* margin: 0 1rem; */

    text-align: center;
}

.box-set__title {
    text-align: center;
}

.box-set__title span span {
    display: block;
    color: var(--CI);
    font-size: 90%;
    font-weight: 800;
}

.box-set__desc {
    color: var(--CI);
    font-size: 90%;
    font-weight: 800;
}

#Content .product-container__boxes-desc img {
    max-width: 85%;
}

@media only screen and (max-width: 959px) {
    .product-container__boxes .box-set {
        width: 200px;
    }

    .product-container__boxes-desc {
        text-align: center;
    }

    #roompack,
    #rentalduration {
        max-width: 100%;
    }
}

@media only screen and (max-width: 479px) {
    .product-container__boxes {
        max-width: 100%;
    }

    #roompack,
    #rentalduration {
        font-size: 10px;
        font-weight: 400;
    }

    .product-container
        .product-container__boxes
        .product-card__control-group
        input {
        width: 25px;
    }

    .product-container__boxes .box-set__title {
        font-size: 75%;
    }
}

/*******************************************************************************
 * Transporter volume calculator.
 */

.rent-transporter {
    display: flex;
    flex-wrap: wrap;
    background: #e0e0e0;
    padding: 1rem;
}

.rent-transporter-desc {
    background: #e0e0e0;
    padding: 1rem;
}

.transporter__items {
    padding: 0.5rem;
    flex: 1;
}

.transporter__car {
    padding: 0.5rem;
    flex: 1;

    display: flex;
    flex-direction: column;
    align-items: center;
}

.transporter__car > * {
    max-width: 100%;
}

.progress-bar {
    border-radius: 6px;
    border: 1px solid #808080;
    background: white;

    height: 36px;
    width: 100%;
}

.progress-bar__fill {
    background: var(--CI);
    height: 36px;
}

/*******************************************************************************
 * Misc
 */

/* Navigation buttons on private self move form */
.button.js-process-prev-step,
.button.js-process-next-step,
.button.js-back,
.button.process-save {
    width: 32%;
    text-align: center;
    font-size: inherit;
    font-weight: bold;
}

/* Navigation buttons on top */
.order-process__side .js-process-next-step {
width: 88% !important;
}

.button.js-process-prev-step,
.back_history {
    background-color: white !important;
    color: #4e4e4e !important;
    border: 1px solid #9c9c9c !important;
    box-shadow: 2px 2px 10px 0px rgba(0,0,0,0.1) !important;
    border-radius: 5px !important;
}


a.js-process-next-step,
a.js-process-prev-step,
a.process-save,
button.js-process-next-step {
    text-align: center;
}

.js-process-prev-step .fa-chevron-left,
.js-back .fa-chevron-left {
    position: absolute;
    left: 20px;
    top: 17px;
}

.js-process-next-step .fa-chevron-right {
    position: absolute;
    right: 20px;
    top: 17px;
}

.js-back {
    font-size: 100%;
}

.small-print {
    color: #666;
    font-weight: 400;
}

:not(.site-mmp) .heading--orange {
    color: white;
    background: gray;
    margin-bottom: 0px;
    padding: 8px 10px 8px 10px;
    text-align: center;
}

.site-mmp .heading--orange {
    color: white;
    background: gray;
    margin-bottom: 0px;
    padding: 8px 10px 8px 10px;
    text-align: center;
}

.woocommerce-checkout .save_nav {
    display: none;
}

.woocommerce-checkout .col-2 {
    width: 100% !important;
}

/* heading orange: Changed uppercase 12.12.18 for simplification and unification. Later deleted styles.

.move-content-box__header {
    color: var(--CI);
    padding: 0.5rem;
}

*/

/* heading orange, move-content-box__header: Changed uppercase 12.12.18 for simplification and unification */

.move-content-box__header h2,
.move-content-box__header h3,
.move-content-box__header h4,
.move-content-box__header h5,
.move-content-box__header h6 {
    color: var(--CI);
    margin: 0;
}

.move-content-box_self-details .input-box {
    flex-basis: 30%;
    flex-grow: 1;
}

.move-content-box_self-details .input-box:first-child {
    padding-right: 1em;
}

.move-content-box_self-details .input-box input,
.move-content-box_self-details .input-box select {
    width: 100%;
}

.move-content-box_boxes .input-box {
    flex-basis: 47%;
    flex-grow: 1;
}

.move-content-box_helpers .input-box {
    flex-basis: 30%;
    flex-grow: 1;
}

.move-content-box_helpers .date-picker-w-icon {
    max-width: unset !important;
    width: 100%;
}
/*******************************************************************************
 * Forms
 */


#form-order-move #address-moveout,
#form-order-move #address-movein,
#form-self-move #address-moveout,
#form-self-move #address-movein {
    width: 100%;
}


#form-order-move #address-moveout,
#form-order-move #address-movein {
    display: inline;
    padding: 8px 6px !important;
    width: 100%;
    margin-bottom: 5px;
    border-radius:  5px;

}
/*
#moveout_address:after,#movein_address:after {
    position: relative;
    font-family: 'Font Awesome 5 Pro';
    content: "\f304";
    font-size:14px;
    top: 0;
    left: 10px;
    color: var(--CI);
    display: inline;
}

*/

#form-order-move #moveout-story,
#form-order-move #moveout-distance,
#form-order-move #movein-story,
#form-order-move #movein-distance {
    width: 100%;
    margin-bottom: 5px;
}
/*
.width-address {
    width: 46%;
}
.width-story {
    width: 18%;
}
.width-distance {
    width: 29%;
}

#moveout_address {
    width: auto !important;
}

*/

#form-order-move .inline-checkbox {
    display: inline;
}

#configure-booking button#next-step {
    display: block;
}

#configure-booking .input-box {
    flex-basis: 30%;
    flex-grow: 1;
}

#configure-booking .input-box:last-child {
    margin-right: 0;
    flex-basis: 30%;
}

@media only screen and (max-width: 479px) {
    #form-order-move .inline-checkbox {
        white-space: nowrap;
    }
}

#form-order-move .inline-checkbox input[type='checkbox'] {
    position: relative;
    top: 3px;
    margin: 0;
}

#form-order-move label {
    font-size: 90%;
}

#form-order-move input {
    font-size: 100%;
    padding: 8px 5px;
}

#form-order-move select {
    font-size: 100%;
    height: 34px;
    padding: 7px 5px;
}

#form-order-move .input-box.flexible_date {
    display: flex;
    margin-right: 0;
    width: 100%;
}

#form-order-move span[class^='calculator__info-button'] {
    postion: relative;
    padding: 2px;
}

#form-order-move span[class^='calculator__info-button'] i {
    margin: 0;
}

.address__no-streetnum-disclaimer {
    color: red;
    margin-left: 10px;
}

.div-storageDuration {
    margin-left:  1em;
}

/*******************************************************************************
 * Misc
 */

.width-story, .elevator {
    margin-right: 1rem;

}

.input-box label {
    color: #808080;
    font-size: 82%;
    font-weight:  normal;
}

.input-box.input-box input,
.input-box.input-box select {
    margin-bottom: 0.333rem;
    margin-right: 0;
    border-radius: 5px;
}

.flex-row {
    flex: 1 1 100%;
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
}

.flex-col {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.mt-1 {
    margin-top: 1rem;
}

.mb-03 {
    margin-bottom: 0.333rem;
}

.mb-06 {
    margin-bottom: 0.666rem;
}

.mb-1 {
    margin-bottom: 1rem;
}

[v-cloak] {
    display: none;
}

.btn-reset {
    margin: 0;
}

.btn-reset::after {
    display: none;
}

.pum-close {
    letter-spacing: -0.5px !important;
}

/*******************************************************************************
 * Rent extension
 */

.order-extension__date.order-extension__date {
    width: 130px;
    margin: 0;
}

.order-extension__timeslot.order-extension__timeslot {
    margin: 0;
    width: 130px;
}

/*******************************************************************************
 * Order checkout
 */

#order-checkout-login,
#order-login-box {
    padding: 10px 15px;
    background-color: #e0e0e0;
    margin-bottom: 25px;
}

#order-login-box h3 {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: bold;
    color: #000000;
}

#order-checkout-login ul,
#order-login-box ul {
    margin: 0 0 15px 38px;
    color: #808080;
    list-style-type: none;
}

#order-checkout-login ul .check-icon,
#order-login-box ul .check-icon {
    position: relative;
    top: 10px;
    display: inline-block;
    width: 24px;
    height: 24px;
    margin: 0 8px 0 -38px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
    background-color: #03db5b;
    background-image: url('../images/icon_checked.svg');
    background-repeat: no-repeat;
    background-position: center center;
}

#order-checkout-login h4,
#order-login-box h4 {
    font-size: 1rem;
    color: #808080;
    font-weight: bold;
}

#order-checkout-login h4 {
    margin: 0;
}

#order-checkout-login h4 i::before,
#order-login-box h4 i::before {
    font-size: 1.4rem;
    color: var(--CI);
}

#order-login-box h4 a {
    text-decoration: underline;
}

#order-checkout-login p,
#order-login-box p {
    margin: 0 0 8px;
}

#order-checkout-login label,
#order-login-box label {
    margin: 0;
    color: #808080;
}

.woocommerce #order-checkout-login form.login {
    margin: 0 0 0.1em 0;
    padding: 0;
    border: 0;
}

#order-checkout-login .new-account {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

#order-checkout-login .new-account h4 {
    width: 100%;
    margin: 0 0 10px 0;
}

#order-checkout-login .new-account div {
    flex: 0 1 auto;
    width: 50%;
}


.woocommerce-checkout .woocommerce-form-coupon .button {
    padding: 7px 20px;
    border-radius: 5px !important;
}

input[type='text'],
.input[type='email'],
input[type='tel'],
input[type='number'],
select {
    background-color: white !important;
}

@media only screen and (max-width: 1239px) {
    .service-cat__button {
        font-size: 14px;
    }

    .service-cat__button .fa {
        font-size: 16px;
    }

    .input-box {
        margin-right: 1rem;
        width: 46%;
    }

    .button.js-process-prev-step,
    .button.js-process-next-step,
    .button.js-back,
    .process-save {
        width: 33%;
    }
}

@media only screen and (max-width: 959px) {
    #form-order-move .input-box.flexible_date {
        padding: 0;
    }

    .js-process-prev-step .fa-chevron-left,
    .js-back .fa-chevron-left {
        left: 10px;
        top: 15px;
    }

    .js-process-next-step .fa-chevron-right {
        right: 10px;
        top: 15px;
    }

    #form-order-move .input-box {
        width: 100%;
    }

    #form-order-move label {
        margin-top: 10px;
    }

    #form-order-move .input-box input,
    #form-order-move .input-box select {
        width: 100%;
    }

    #form-order-move .input-box.noparking {
        width: 100%;
    }

    #form-order-move .input-box.noparking span {
        margin-bottom: 0;
    }

    .input-box.elevator {
        margin-top: 5px;
    }
}

@media only screen and (max-width: 767px) {
    .move-content-box_helpers .input-box {
        flex-basis: 100%;
    }

    .move-content-box_self-details .input-box {
        flex-basis: 100%;
    }

    .input-box.section-start {
        margin-top: 35px;
    }
}

@media only screen and (max-width: 479px) {
    .page .section_wrapper {
        padding: 0 5px !important;
    }

    #order-checkout-login .new-account div {
        width: 100%;
    }

    .js-process-prev-step {
        margin-top: 1em;
    }

    .input-box {
        width: 100%;
    }

    .order-process__nav {
        flex-wrap: wrap-reverse;
        margin-bottom: 40px;
    }

    .button.js-process-prev-step,
    .button.js-process-next-step,
    .button.js-back,
    .button.process-save {
        width: 100%;
    }

    .flex-row.order-move_nav {
        margin: 0 1rem;
    }

    .flex-row.order-move_nav button.js-next-step {
        margin-right: 1rem;
    }

    .flex-row-self {
        flex: 1 1 100%;
        display: block;
        align-items: flex-start;
        flex-wrap: wrap;
    }

    #customer_details #billing_email_field label {
        white-space: nowrap;
    }

    .page .woocommerce-error.alert,
    .page .woocommerce-info.alert,
    .page .woocommerce-message.alert {
        padding: 10px 35px 10px 10px !important;
    }

    .page .alert .alert_icon {
        display: none;
    }

    .page .alert a.close {
        right: 10px;
        top: 10px;
    }
}

@media only screen and (max-width: 339px) {
    .page.woocommerce-checkout table.shop_table {
        margin: 0 0 0 -16px;
    }

    .page table.shop_table th,
    .page table.shop_table td {
        padding: 5px !important;
    }

    .flex-row-self {
        flex: 1 1 100%;
        display: inline-block !important;
        align-items: flex-start;
        flex-wrap: wrap;
    }
}



/*******************************************************************************
 * Woocommerce
 */

.woocommerce a.remove.remove.remove {
    color: var(--CI) !important;
    width: 26px !important;
    height: 26px !important;
}

.woocommerce a.remove.remove.remove:hover {
    color: white !important;
}

.woocommerce-MyAccount-content {
    padding: 1rem;
    box-sizing: border-box;
}

.woocommerce-checkout .shop_table .product-name {
    text-align: center !important;
}

.woocommerce-checkout-review-order-table > tr .order-total {
    border-top-width: 2px;
}

/*******************************************************************************
 * Woocommerce Checkout Logged in
 */

.checkout_coupon,
#Content .woocommerce-checkout {
    padding: 1rem;
    background-color: white;
    border-radius: 5px;
    box-shadow: 0 2px 6px rgba(0,0,0,.25);
}

.woocommerce-checkout form .form-row label,
.woocommerce-checkout form .form-row .required {
    color: #808080;
    line-height: 1.4rem;
    text-decoration: none;
}

.woocommerce-checkout > #order_review_heading {
    margin: 25px 0 0 0;
    padding: 1em 0 0.5em 0;
    border-top: 1px solid #d3ced2;
}

#order_review_heading {
    padding: 1em 0 0.5em 0;
}

.woocommerce-checkout > #order_payment_heading {
    margin: 0px 0 0 0;
    padding: 1rem 0 0 0;
    border-top: 1px solid #d3ced2;
}

.woocommerce-checkout #payment div.payment_box {
    color: #404040;
    background-color: white;
    margin: 0 1em 1em 0em;
}

@media only screen and (max-width: 768px) {
    .woocommerce-checkout #payment div.payment_box {
        margin: 0;
    }
}

.woocommerce .payment_methods li label {
    color: #444;
}

#payment div.form-row {
    padding: 0 !important;
    margin: 0 !important;
}

.woocommerce-checkout #payment div.payment_box::before {
    border-bottom-color: var(--CI);
    display:none;
}

.woocommerce-checkout #novalnet_cc_payment_form {
    padding: 1rem;
    background-color: #e0e0e0;
}

.woocommerce-checkout .terms label {
    line-height: 1.5;
    font-size: 0.875em;
    font-weight: 400;
}

.woocommerce-checkout .terms input[type='checkbox']:checked + label {
    font-weight: 700;
}

.woocommerce-checkout .woocommerce-shipping-fields {
    display: none;
}

.woocommerce-checkout
    #privacy_checkbox_field.woocommerce-invalid.woocommerce-invalid-required-field
    label,
.woocommerce-checkout
    #privacy_checkbox_field.woocommerce-validated.woocommerce-invalid-required-field
    label {
    color: #808080;
    font-weight: 400;
}

.woocommerce-checkout #privacy_checkbox_field.woocommerce-validated label {
    font-weight: 700;
}

.woocommerce-checkout #privacy_checkbox_field label abbr {
    display: none;
}

.alert_success a,
.alert_success a:hover {
    color: #38e7ea !important;
}

/*******************************************************************************
* WooCommerce Checkout Logged out
*/

.order-checkout-login-reasons {
    width: 47% !important;
}

#order_comments_field .form-row notes {
    display: none !important;
}

#customer_details .col-1 {
    width: 100%;
}

.woocommerce-column--shipping-address {
    display: none;
}

@media only screen and (min-width: 768px) {
    .order-checkout-login-reasons {
        margin-top: -100px;
    }
}


/*******************************************************************************
 * Compatibility
 */

select::-ms-expand {
    display: none;
}

/*******************************************************************************
 * Loader
 * https://projects.lukehaas.me/css-loaders/
 */

input[disabled] {
    cursor: default;
}

.loader-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    background-color: rgba(255, 255, 255, 0.3);
}

.loader,
.loader:before,
.loader:after {
    border-radius: 50%;
    width: 2.5em;
    height: 2.5em;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation: calc-load 1.8s infinite ease-in-out;
    animation: calc-load 1.8s infinite ease-in-out;
}
.loader {
    color: #666;
    font-size: 6px;
    margin: 80px auto;
    position: relative;
    text-indent: -9999em;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
}
.loader:before,
.loader:after {
    content: '';
    position: absolute;
    top: 0;
}
.loader:before {
    left: -3.5em;
    -webkit-animation-delay: -0.32s;
    animation-delay: -0.32s;
}
.loader:after {
    left: 3.5em;
}
@-webkit-keyframes calc-load {
    0%,
    80%,
    100% {
        box-shadow: 0 2.5em 0 -1.3em;
    }
    40% {
        box-shadow: 0 2.5em 0 0;
    }
}
@keyframes calc-load {
    0%,
    80%,
    100% {
        box-shadow: 0 2.5em 0 -1.3em;
    }
    40% {
        box-shadow: 0 2.5em 0 0;
    }
}
