.btn_check_out{
float:left;
border-radius:.25rem;
width:100%;
height:2.25rem;
margin:0;
padding:.5rem 0 0 0;
font-weight:bold;
cursor:pointer;
text-align:center;
font-size:var(--fs-p);
border:var(--brd-accent-300) 1px solid;
background:var(--bgr-accent-300);
color:var(--clr-primary-300);

&:hover{
background:var(--bgr-accent-400);
background:var(--bgr-accent-400);
color:var(--clr-primary-400);
}

}

.btn_check_out[type="submit"]{
margin:0;
padding:0;
}

.btn_check_out_back{
float:left;
border:none;
border-radius:.25rem;
width:100%;
height:2.25rem;
margin:0 0 1.5rem 0;
padding:.5rem 0 0 0;
font-weight:bold;
font-size:var(--fs-p);
color:var(--clr-primary-300);
background:var(--bgr-gray-300);
cursor:pointer;
text-align:center;
}

.btn_check_out_back[type="submit"]{
margin:0;
padding:0;
}


.check_out_wrapper{
float:left;
width:100%;
background:var(--bgr-gray-100);
border:var(--brd-primary-50) 1px solid;
border-radius:.25rem;
margin:.5rem 0;
padding:.5rem;
}

.check_out_wrapper p{
margin:.25rem 0;
}


/* Mobile View > till Tablet */
@media screen and (max-width: 45rem), screen and (min-width: 45rem) and (max-width: 79.5rem){

.check_out_step_1_wrapper{
display:flex;
justify-content:center;
align-items:center;
flex-direction:column;
width:100%;
margin:0;
padding:0;
}

.check_out_step_1{
min-height:20rem;
}

}

/* Mobile View > Tablet */
@media screen and (min-width: 45rem) and (max-width: 79.5rem) and (orientation: portrait){

.check_out_step_1{
min-height:22rem;
}

}

/* Tablet && Desktop View */
@media screen and (min-width: 79.5rem), screen and (min-width: 45rem) and (max-width: 79.5rem) and (orientation: landscape){

.check_out_step_1_wrapper{
display:flex;
justify-content:center;
align-items:center;
flex-direction:row;
width:100%;
margin:.5rem 0;
}

.check_out_step_1{
min-height:20rem;
margin:.5rem;
padding:.5rem;
}

}

.check_out_step_1{
display:flex;
justify-content:space-between;
align-items:start;
flex-direction:column;

& header{
float:left;
width:100%;
height:2rem;
}

}

.check_out_step_1 main{
float:left;
width:100%;
height:auto;
margin:0;
padding:0;
min-height:15.5rem;
}

.check_out_step_1 main .list{
float:left;
width:100%;
}

.check_out_step_1 main .list li{
clear:both;
float:left;
width:100%;
}

.check_out_step_1 main .list li .radio{
margin:0 .25rem 0 .5rem;
padding:0;
width:.75rem;
}

.check_out_step_1 main .list li label{
width:calc(100% - 1.5rem);
}


.check_out_step_1 footer{
float:left;
width:100%;
margin:0;
padding:0;
height:2.5rem;

& button{
float:left;
width:100%;
margin:0;
padding:0;
height:2.5rem;
}

}


.check_out_step_4{
float:left;
width:100%;
}

#check_out_pp_wrapper{
float:left;
width:100%;
height:12rem;
display:flex;
justify-content:center;
align-items:center;
}

#check_out_pp{
margin:.5rem auto;
min-width:26rem;
min-height:12rem;
}

#check_out_pp_info{
float:left;
width:100%;
text-align:center;
}


#form_delivery_wrapper .card{
float:left;
width:100%;
margin:0 0 .5rem 0;
padding:.25rem;
background:var(--bgr-gray-200);
border:var(--brd-primary-50) 1px solid;
border-radius:.25rem;
}

#form_delivery_wrapper .card:last-child{
margin:0;
}

#form_delivery_wrapper .card #delivery_timestamp_wrapper{
display:none;
}

#form_elements_wrapper{
display:flex;
justify-content:flex-start;
align-items:start;
}

#user_open{
float:left;
width:100%;
margin:0;
padding:0;
}

#delivery_open{
float:left;
width:100%;
margin:0;
padding:0;
}

#message_open{
float:left;
width:100%;
margin:0;
padding:0;
}


/* Desktop View && Tablet */
@media screen and (min-width: 79.5rem), screen and (min-width: 45rem) and (max-width: 79.5rem){

#form_delivery_wrapper{
display:flex;
justify-content:flex-start;
align-items:start;
gap:.5rem
}

#form_delivery_wrapper .card{
float:left;
width:100%;
min-height:4rem;
margin:0;
padding:.25rem;
background:var(--bgr-gray-200);
border:var(--brd-primary-50) 1px solid;
border-radius:.25rem;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}

#form_delivery_wrapper .card #delivery_timestamp_wrapper{
display:none;
}

}


#form_delivery_wrapper .card.delivery_type.type_1{
background-image:url('/assets/img/eshop/delivery/type/1.svg');
background-position:98% .75rem;
background-repeat:no-repeat;
background-size:2.75rem;
}

#form_delivery_wrapper .card.delivery_type.type_2{
background-image:url('/assets/img/eshop/delivery/type/2.svg');
background-position:98% .75rem;
background-repeat:no-repeat;
background-size:2.75rem;
}

#form_delivery_wrapper .card.delivery_area{
background-image:url('/assets/img/eshop/delivery/area.svg');
background-position:98% .75rem;
background-repeat:no-repeat;
background-size:2.75rem;
}

#form_delivery_wrapper .card.delivery_timestamp{
background-image:url('/assets/img/eshop/delivery/timestamp.svg');
background-position:98% .75rem;
background-repeat:no-repeat;
background-size:2.75rem;
}

/* Desktop View && Tablet */
@media screen and (min-width: 79.5rem), screen and (min-width: 45rem) and (max-width: 79.5rem) and (orientation: landscape){

#form_elements_wrapper{
display:flex;
justify-content:flex-start;
align-items:start;
}

#user_open{
float:left;
width:50%;
margin:0;
padding:0 .5rem 0 0;
}

#delivery_open{
float:left;
width:50%;
margin:0;
padding:0 0 0 .5rem;
}

#message_open{
float:left;
width:50%;
margin:0;
padding:0
}

}

.customer{
float:left;
width:100%;
}

.customer_membership,
.customer_billing,
.customer_delivery,
.customer_email,
.customer_url,
.customer_newsletter,
.customer_message,
.customer_payment,
.customer_shipping{
float:left;
width:100%;
}

.customer_billing ul.display{
float:left;
width:100%;
padding:0;
margin:.25rem 0;
list-style:none;
}

.customer_billing ul.display li{
font-size:var(--fs-p);
}

.customer_payment ul.display{
float:left;
width:100%;
padding:0;
margin:.25rem 0;
list-style:none;
}

.customer_payment ul.display li{
float:left;
width:100%;
margin:0;
padding:.25rem .25rem;
background:var(--bgr-gray-200);
border:var(--brd-primary-50) 1px solid;
border-radius:.25rem;
}

.customer_payment ul.display li .label{
float:left;
width:auto;
margin:0;
padding:0;
font-size:var(--fs-s);
}

.customer_payment ul.display li .label.bold{
font-weight:bold;
}

.customer_payment ul.display li .value{
float:right;
width:auto;
margin:0;
padding:0;
font-size:var(--fs-s);
text-align:right;
}

.customer_payment ul.display li .value.bold{
font-weight:bold;
}


/* Mobile View only */
@media screen and (max-width: 45rem){

#user_payment,
#user_shipping{
float:left;
width:100%;
margin:.25rem 0;
display:flex;
flex-direction:column;
justify-content:center;
}

#delivery_type,
#delivery_type_response,
#delivery_area,
#delivery_timestamp{
float:left;
width:100%;
margin:.25rem 0;
display:flex;
flex-direction:column;
justify-content:start;
align-items:center;
gap:.5rem;
}

#delivery_type_response p{
margin:.25rem 0;
}

}

/* Mobile View -> Tablet && Landscape */
@media screen and (min-width: 45rem) and (max-width: 79.5rem){

#user_payment,
#user_shipping{
float:left;
width:100%;
margin:.25rem 0;
display:flex;
flex-direction:column;
justify-content:center;
}

#delivery_type,
#delivery_type_response,
#delivery_area,
#delivery_timestamp{
float:left;
width:100%;
margin:.25rem 0;
display:flex;
flex-direction:column;
justify-content:start;
align-items:center;
gap:.5rem;
}

#delivery_type_response p{
margin:.25rem 0;
}


}

/* Desktop View */
@media screen and (min-width: 79.5rem){

#delivery_type,
#user_payment,
#user_shipping{
float:left;
width:100%;
margin:.25rem 0;
display:flex;
justify-content:space-between;
}

#delivery_type_response{
text-align:center;
}

#delivery_type_response p{
margin:.25rem 0;
}


#delivery_area,
#delivery_timestamp{
float:left;
width:100%;
margin:.5rem 0 !important;
padding:0 !important;
display:flex;
flex-direction:column;
justify-content:start;
align-items:center;
gap:.5rem;
}

#user_payment li:last-of-type,
#user_shipping li:last-of-type,
#delivery_type li:last-of-type{
margin:.25rem 0 .25rem .25rem;
}

#user_payment li:first-of-type,
#user_shipping li:first-of-type,
#delivery_type li:first-of-type{
margin:.25rem .25rem .25rem 0;
}

}

#user_payment li:only-of-type,
#user_shipping li:only-of-type,
#delivery_type li:only-of-type{
margin:.25rem 0;
}

#user_payment li,
#user_shipping li,
#delivery_type li,
#delivery_area li,
#delivery_timestamp li{
margin:.25rem 0;
}

#user_payment li,
#user_shipping li,
#delivery_type li,
#delivery_area li,
#delivery_timestamp li{
float:left;
width:100%;
flex: 1 50%;
color:var(--form-btn-clr-default);
border:var(--form-btn-bgr-default) 1px solid;
background:var(--form-btn-bgr-default);
border-radius:.25rem;
}

#delivery_timestamp li{
width:calc(100% - .5rem);
}

#user_payment li.on,
#user_shipping li.on,
#delivery_type li.on,
#delivery_area li.on,
#delivery_timestamp li.on{
font-weight:bold;
color:var(--form-btn-clr-active);
border:var(--form-btn-bgr-active) 1px solid;
background:var(--form-btn-bgr-active);
}


#user_payment li input,
#user_shipping li input,
#delivery_type li input,
#delivery_area li input,
#delivery_timestamp li input{
display:none;
}

#user_payment li label,
#user_shipping li label,
#delivery_type li label,
#delivery_area li label,
#delivery_timestamp li label{
float:left;
width:100%;
margin:0;
padding:.5rem 0;
text-align:center;
font-size:var(--fs-p);
}


#delivery_type_wrapper,
#delivery_area_wrapper,
#delivery_timestamp_wrapper{
float:left;
width:100%;
}

/* Mobile View > till Tablet */
@media screen and (max-width: 45rem){

#delivery_min_value{
text-align:center;
}

#delivery_min_value .check_out_wrapper.alert{
background:var(--status-alert-background-color);
}

#delivery_min_value .check_out_wrapper.alert p{
color:var(--status-alert-font-color);
}

}

/* Mobile View > Tablet only */
@media screen and (min-width: 45rem) and (max-width: 79.5rem){

#delivery_type_wrapper,
#delivery_response_wrapper,
#delivery_area_wrapper,
#delivery_timestamp_wrapper{
width:calc(100% - 2rem);
margin:.5rem 1rem;
}

#delivery_min_value{
width:calc(100% - 2rem);
margin:.5rem 1rem;
text-align:center;
}

#delivery_min_value .check_out_wrapper.alert{
background:var(--status-alert-background-color);
}

#delivery_min_value .check_out_wrapper.alert p{
color:var(--status-alert-font-color);
}

}

/* Desktop View */
@media screen and (min-width: 79.5rem){

#delivery_min_value{
text-align:center;
}

#delivery_min_value .check_out_wrapper.alert{
background:var(--status-alert-background-color);
}

#delivery_min_value .check_out_wrapper.alert p{
color:var(--status-alert-font-color)
}

}



#delivery_timestamp_wrapper .list{
float:left;
width:100%;
height:20rem;
padding:.5rem 0;
overflow:auto;
scrollbar-width:thin;
}

#delivery_timestamp_response .main .content .icon{
float:left;
display:block;
width:100%;
height:4rem;
margin:.5rem 0;
background:url('/assets/img/eshop/delivery/timestamp.svg') no-repeat center center;
animation: tilt-shaking .5s ease-out forwards;
}



#eshop_terms_wrapper{
float:left;
width:100%;
height:22rem;
overflow:auto;
scrollbar-width:thin;
}

#eshop_terms_wrapper .text{
float:left;
width:100%;
margin:0;
padding:0;
}

#eshop_terms_response_wrapper{
float:left;
width:100%;
margin:.25rem 0 0 0;
padding:0;
min-height:2rem;
}

#eshop_terms_response_wrapper p{
float:left;
width:100%;
margin:0;
padding:0;
}


#eshop_terms{
float:left;
width:100%;
padding:0 .5rem;
background:var(--bgr-gray-100);
border:var(--brd-primary-50) 1px solid;
border-radius:.25rem;
}

#eshop_terms li{
display:inline-block;
padding:.25rem .25rem .45rem .25rem;
}