body#checkout { .cart-container { .btn.btn-primary { width:100%; } } #block-reassurance li { border:none; } .login-tabs { a { font-weight: 600; &:after { content: ""; position: absolute; left: 0; bottom: -4px; width: 0; height: 2px; background-color: #323232; transition: all .4s cubic-bezier(.36,.76,0,.88); } &.active { &:after { width: 100%; } } } } .create_acc { margin-top:40px; .title { font-weight: 600; } .text-muted { font-size: smaller; } } section#content { margin-bottom: 1.563rem; } .container { min-height: 100%; } section.checkout-step { padding: 0 0 2.5rem; @include trans-fast; &:last-child { border: 0; } .step-title { display: flex; align-items: center; font-size: 26px; cursor: pointer; margin-bottom: 0; padding: 0.625rem 0; border-bottom: 2px solid #f2f2f2; } .content { padding: 0; margin-top:32px; } .step-edit { margin-left:auto; text-transform: lowercase; font-weight: normal; @include trans-fast; } &:hover { .step-edit { opacity:1; transform: translateX(-30%) rotate(-12deg); } } .not-allowed { cursor: not-allowed; opacity: 0.5; } .content, .done, .step-edit { display: none; } &.-current { .content { display: block; } } &.-current.-reachable.-complete { .done, .step-edit { display: none; } .step-number { display: inline-block; } .content { display: block; } } &.-reachable.-complete { opacity: 0.5; &:hover { opacity: 1; } h3 { .done { display: flex; height: 48px; align-items: center; margin-right:8px; } .step-number { display: none; } .step-edit { cursor: pointer; display: block; float: right; margin-right: 0.125rem; } } .content { display: none; } } small { } .default-input { min-width: 40%; &[name=address1], &[name=address2] { min-width: 60%; } } .radio-field { margin-top: 1.875rem; label { display: inline; } } .checkbox-field div { margin-top: 3.75rem; } .checkbox-field + .checkbox-field div { margin-top: 0; } .select-field div { padding: 0.625rem 3.125rem; } .form-footer { text-align: center; } #conditions-to-approve { padding-top: 1rem; } .payment-options { label { display: table-cell; cursor:pointer; } .custom-radio { margin-right: $medium-space; } .payment-option { margin-bottom: 0.5rem; } } .step-number { display: inline-block; padding: 0.625rem; &:after { content:' .'; } } .address-selector { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; } .address-item { flex: 0 0 49%; margin-bottom: $small-space; border: 2px solid $input-border; &.selected { border: 2px solid $input-border-focus; box-shadow: 0 18px 80px 0px rgba(0, 0, 0, 0.11); } } .address-alias { display: inline-block; font-weight: 500; margin-left:10px; } .address { margin-left: 36px; font-weight: normal; line-height: 22px; font-size: 14px; margin-top: 18px; } .radio-block { padding: 2rem; text-align: left; cursor: pointer; } .custom-radio { margin-right: 0; input[type="radio"] { height: 1.25rem; width: 1.25rem; } } .delete-address, .edit-address { color: $gray; display: inline-block; margin: 0 0.3125rem; .delete, .edit { font-size: $base-font-size; } } hr { margin: 0; } .address-footer { text-align: center; padding: 0.625rem; } #delivery-addresses, #invoice-addresses { margin-top: 1.25rem; } .add-address { margin-top: 1.25rem; a { i { font-size: $font-size-lg; } } } .delivery-options { margin-bottom:32px; } .delivery_message { font-size:14px; text-align: left; } .delivery-option { padding: 0; border: 2px solid $input-border; margin: 0 0 16px; display: flex; align-items: center; justify-content: center; @include trans-fast; &.active { } .row { display: flex; align-items: center; width: 100%; .delname { flex:1 1 auto; } .delprice { margin-left:auto; text-align: right; } } img { max-width:40px; margin-right:16px; } label { padding:2rem 1.5rem; text-align: inherit; margin:0; cursor:pointer; display: flex; min-height: 110px; } } .carrier-delay { font-size:0.875rem; } .carrier-delay, .carrier-name { display: inline-block; word-break: break-word; text-align: left; margin:0; } #customer-form, #delivery-address, #invoice-address, #login-form { margin-left: 0.3125rem; margin-top: 1.563rem; .form-control-label { text-align: left; } .radio-inline { padding: 0; margin-right:14px; } } .sign-in { font-size: $font-size-sm; } .forgot-password { // margin-left: 26%; font-size: 14px; font-weight: 600; margin-top: -20px; margin-bottom: 20px; float: right; } } .additional-information { font-size: $font-size-sm; margin-left: 2.875rem; margin-top: 1.25rem; } .condition-label { margin-left: 2.5rem; margin-top: 0.625rem; label { text-align: inherit; } } .cancel-address { margin: 0.625rem; display: block; color: $body-text; text-decoration: underline; } .modal-content { padding: $medium-space; } #cart-summary-product-list { font-size: $font-size-sm; img { // border: $body-border 1px solid; width: 3.125rem; } .media-left { img { border-radius: 4px; } } .media-body { vertical-align: middle; .product-price { font-size: 16px !important; margin-bottom: 0; float: none!important; display: block; line-height: 1.2; margin-bottom: 30px; } .product-quantity { display: inline-block; } } } #order-summary-content { padding-top: 0.9375rem; h4.h4 { margin-top: 0.625rem; margin-bottom: 1.25rem; } h4.black { } h4.addresshead { margin-top: 0.1875rem; } .noshadow { box-shadow: none; } #order-items { border-right: 0; h3.h3 { margin-top: 1.25rem; } table { tr { &:first-child { td { border-top: 0; } } } } } .order-confirmation-table { padding: 1rem; margin-bottom: 2rem; background-color: $content-bg; border: 3px solid $body-border; border-radius: 0; } .summary-selected-carrier { margin-bottom: 0.75rem; background-color: $content-bg; border: 1px solid $body-border; border-radius: 0; padding: 1rem; } .step-edit { display: inline; } .step-edit:hover { cursor: pointer; } a { .step-edit { } } } #gift_message, #delivery{ max-width: 100%; textarea { max-width: 100%; margin-bottom: 10px; } } } /**** ORDER CONFIRMATION *****/ #order-details { padding-left: 54px; em { font-style: normal; } > .card-title { margin-bottom: $large-space; } ul { margin-bottom: $medium-space; li { margin-bottom: $small-space; } } } #content-hook_payment_return { margin-bottom:44px; } #order-items { border-right: $body-border 2px solid; padding-right: 54px; table { width: 100%; tr { height: 1rem; td { &:last-child { text-align: right; } } } } .order-line { margin-top: 1rem; } .image { img { width: 100%; max-width: 60px!important; border-radius: 4px; margin-bottom: 1rem; } } .details { margin-bottom: 1rem; .customizations { margin-top: 0.625rem; } } .qty { margin-bottom: 1rem; } } #order-confirmation { #registration-form { width: 50%; margin: 0 auto 1rem; } } @include media-breakpoint-down(md) { #order-items { display: none; } body#checkout section.checkout-step .step-title { font-size:20px; } .done { margin: 0; padding: 0; } body#checkout section.checkout-step .address-item { flex-grow: 1; } body#checkout section.checkout-step .delivery-option-2 { flex-direction: column; } .delivery-option { display: flex; margin: auto; .custom-radio { flex: 0 0 auto; } } .condition-label { label[for="conditions_to_approve[terms-and-conditions]"] { text-align: left; } } #order-confirmation { #registration-form { width: 100%; } } } @include media-breakpoint-down(sm) { footer .btn { width:100%; } .login-tabs { .nav-item+.nav-item { float: right; } } #order-confirmation { .card { padding:0; font-size: 14px; p { font-size: 14px; } } .card-block { padding:0 0 10px 0; } .card-title { font-size: 1.125rem; margin-bottom: 30px; padding-bottom: 30px; border-bottom: 2px solid #f2f2f2; i { margin-right: 5px; margin-top: -3px; } } .card.definition-list dl { border:2px solid; padding:15px; strong { font-weight: 600; font-size: 15px; margin:20px 0 30px; display: inline-block; } } } body#checkout section.checkout-step .delivery-option label > .row { flex-direction: column; align-items: flex-start; .delname > .row { margin:0 0 10px 0; } .delprice { text-align: left; } } body#checkout section.checkout-step .delivery-option label { flex:1 1 auto; padding-right: 0; padding-left:0.5rem; } body#checkout { #header .header-nav { max-height: none; padding: 0; } section.checkout-step { .content { padding: 0.9375rem; } } .form-group { margin-bottom: 0.5rem; } } #order-items { border-right: 0; margin-bottom: 2.5rem; padding:15px; .card-title { border-bottom: 1px solid $body-border; margin-bottom: 1rem; padding-bottom: 1rem; } hr { border-top-color: $body-border; } } .bold { font-weight: bold; } #order-details { padding-left: 0.9375rem; .card-title { border-bottom: 2px solid $body-border; margin-bottom: 1rem; padding-bottom: 1rem; display: none; } } body#checkout section.checkout-step .forgot-password { margin-left: 0; margin-bottom: 20px; text-align: right; } } @include media-breakpoint-down(xs) { body#checkout { section.checkout-step { .content { padding: 0.9375rem 0; } } } #payment-confirmation { button { font-size: 0.875rem; &.btn { white-space: normal; } } } } #payment-confirmation { margin-bottom:32px; } .cart-empty { .cart-summary { } } .js-payment-binary { display: none; .accept-cgv { display: none; } &.disabled { opacity: 0.6; cursor: not-allowed; &::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; pointer-events: none; } .accept-cgv { display: block; } } }