/********************
	Part - Style global
********************/
html,
body {
    height : 100%;
}

@-ms-viewport {
    width : device-width;
}

html {
    box-sizing                  : border-box;
    font-size                   : 16px;
    -ms-overflow-style          : scrollbar;
    -webkit-tap-highlight-color : transparent;
    font-family                 : sans-serif;
    -ms-text-size-adjust        : 100%;
}

body {
    font-family             : var(--typo-primary);
    -webkit-font-smoothing  : antialiased;
    -moz-osx-font-smoothing : grayscale;
    line-height             : 1.25em;
    font-size               : 16px;
}

[tabindex="-1"]:focus {
    outline : none !important
}

p {
    margin : 0;
}

abbr[data-original-title], abbr[title] {
    cursor        : help;
    border-bottom : 1px dotted var(--color-grey-default)
}

address {
    font-style  : normal;
    line-height : inherit
}

address, dl, ol, ul {
    margin-bottom : 1rem
}

dl, ol, ul {
    margin-top : 0
}

ol ol, ol ul, ul ol, ul ul {
    margin-bottom : 0
}

ul {
    list-style : none;
    padding    : 0;
    margin     : 0;
}

dt {
    font-weight : 700
}

dd {
    margin-bottom : .5rem;
    margin-left   : 0
}

blockquote {
    margin : 0 0 1rem
}

a {
    color           : #2fb5d2;
    text-decoration : none
}

a:hover {
    color           : var(--link-color-on-hover);
    text-decoration : none;
}

a:focus {
    color           : #208094;
    text-decoration : underline;
    outline         : 5px auto -webkit-focus-ring-color;
    outline-offset  : -2px
}

a:not([href]):not([tabindex]),
a:not([href]):not([tabindex]):focus,
a:not([href]):not([tabindex]):hover {
    color           : inherit;
    text-decoration : none
}

a:not([href]):not([tabindex]):focus {
    outline : none
}

figure {
    margin : 0 0 1rem
}

img {
    vertical-align : middle;
    max-width      : 100%;
    object-fit     : contain;
}

[role=button] {
    cursor : pointer
}

[role=button], a, area, button, input, label, select, summary, textarea {
    -ms-touch-action : manipulation;
    touch-action     : manipulation
}

table {
    border-collapse  : collapse;
    background-color : transparent
}

caption {
    padding-top    : .75rem;
    padding-bottom : .75rem;
    color          : var(--color-grey-font-default);
    caption-side   : bottom
}

caption, th {
    text-align : left
}

label {
    display       : inline-block;
    margin-bottom : .5rem
}

button:focus {
    outline : 1px dotted;
    outline : 5px auto -webkit-focus-ring-color
}

button, input, select, textarea {
    line-height : inherit
}

input[type=checkbox]:disabled,
input[type=radio]:disabled {
    cursor : not-allowed
}

input[type=date],
input[type=datetime-local],
input[type=month],
input[type=time] {
    -webkit-appearance : listbox
}

textarea {
    resize : vertical
}

fieldset {
    min-width : 0;
    padding   : 0;
    margin    : 0;
    border    : 0
}

legend {
    display       : block;
    width         : 100%;
    padding       : 0;
    margin-bottom : .5rem;
    font-size     : 1.5rem;
    line-height   : inherit
}

input[type=search] {
    -webkit-appearance : none
}

output {
    display : inline-block
}

[hidden] {
    display : none !important
}

.clearfix:after {
    content : "";
    display : table;
    clear   : both
}

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

.sr-only-focusable:active,
.sr-only-focusable:focus {
    position : static;
    width    : auto;
    height   : auto;
    margin   : 0;
    overflow : visible;
    clip     : auto
}

.color,
.custom-checkbox input[type=checkbox] + span.color {
    width           : 1.25rem;
    height          : 1.25rem;
    display         : inline-block;
    margin          : .3125rem;
    box-shadow      : 2px 2px 4px 0 rgba(0, 0, 0, .2);
    border          : 1px solid rgba(0, 0, 0, .05);
    cursor          : pointer;
    background-size : contain
}

.color.active, .color:hover,
.custom-checkbox input[type=checkbox] + span.color.active,
.custom-checkbox input[type=checkbox] + span.color:hover,
.facet-label.active .custom-checkbox span.color,
.facet-label:hover .custom-checkbox span.color {
    border : 2px solid var(--color-black-default)
}

.h1, .h2, .h3 {
    text-transform : uppercase;
    color          : var(--color-black-default)
}

.h4 {
    font-weight : 700;
    color       : var(--color-black-default)
}

.label, label {
    color      : var(--color-black-default);
    text-align : right;
    font-size  : .875rem
}

small.label, small.value {
    font-size : .8125rem
}

@media (max-width : 767px) {
    .bold {
        font-weight : 700
    }
}

.text-muted {
    font-size : .875rem
}

.done {
    color        : #4cbb6c;
    display      : inline-block;
    padding      : 0 .8125rem;
    margin-right : 1.563rem
}

@media (max-width : 991px) {
    .done {
        margin  : 0;
        padding : 0
    }
}

.group-span-filestyle label {
    margin : 0
}

.popover.bs-tether-element-attached-top {
    margin-top : 0
}

/********************
	Part - Style payment-confirmation
********************/
@media (max-width : 575px) {
    #payment-confirmation button {
        font-size : .875rem
    }

    #payment-confirmation button.btn {
        white-space : normal
    }
}

/********************
	Part - Style payment-binary
********************/
.js-payment-binary,
.js-payment-binary .accept-cgv {
    display : none
}

.js-payment-binary.disabled {
    opacity : .6;
    cursor  : not-allowed
}

.js-payment-binary.disabled:before {
    content        : "";
    position       : absolute;
    top            : 0;
    right          : 0;
    bottom         : 0;
    left           : 0;
    pointer-events : none
}

.js-payment-binary.disabled .accept-cgv {
    display : block
}

/********************
	Part - Style table-labeled
********************/
.table-labeled td, .table-labeled th {
    vertical-align : middle
}

.table-labeled .label {
    font-weight   : 400;
    border-radius : 3px;
    font-size     : inherit;
    padding       : .25rem .375rem;
    margin        : .125rem;
    color         : #fff;
    white-space   : nowrap
}

/********************
	Part - Style definition-list
********************/
.definition-list dl {
    display       : -webkit-box;
    display       : -ms-flexbox;
    display       : flex;
    -ms-flex-wrap : wrap;
    flex-wrap     : wrap
}

.definition-list dl dt {
    font-weight : 400
}

.definition-list dl dd, .definition-list dl dt {
    -webkit-box-flex : 0;
    -ms-flex         : 0 0 45%;
    flex             : 0 0 45%;
    background       : var(--color-grey-default);
    padding          : .625rem;
    margin           : .125rem
}

.definition-list dl dd:nth-of-type(2n), .definition-list dl dt:nth-of-type(2n) {
    background : #f6f6f6
}

/********************
	Part - nav-item
********************/
.nav-item .nav-link, .nav-item .nav-separtor {
    color       : var(--color-grey-font-default);
    font-weight : 700
}

.nav-item .nav-link.active, .nav-item .nav-separtor.active {
    color : var(--color-black-default)
}

/********************
	Part -separator
********************/
.separator {
    margin       : 0;
    border-color : rgba(0, 0, 0, .25)
}

/********************
	Part - page authentication
********************/
#authentication .tooltip.tooltip-bottom {
    padding : 0;
    margin  : 0
}

#authentication .custom-checkbox {
    display : -webkit-box;
    display : -ms-flexbox;
    display : flex
}

#authentication .custom-checkbox span {
    -webkit-box-flex : 0;
    -ms-flex         : 0 0 0.9375rem;
    flex             : 0 0 0.9375rem
}

#authentication .custom-checkbox label {
    padding-left : .625rem
}

#authentication .radio-inline, #identity .radio-inline {
    padding : 0
}

#authentication .radio-inline .custom-radio, #identity .radio-inline .custom-radio {
    margin-right : 0
}

/********************
	Part - order-confirmation
********************/
#order-confirmation #registration-form {
    width  : 50%;
    margin : 0 auto 1rem
}

@media (max-width : 991px) {
    #order-confirmation #registration-form {
        width : 100%
    }
}

/********************
	Part - order-items
********************/
#order-items {
    border-right : 1px solid var(--color-grey-default)
}

#order-items hr {
    border-top-color : var(--color-black-default)
}

#order-items table {
    width : 100%
}

#order-items table tr {
    height : 1.875rem
}

#order-items table tr td:last-child {
    text-align : right
}

#order-items .order-line {
    margin-top : 1rem
}

#order-items .image img {
    width         : 100%;
    border        : 1px solid gray-lighter;
    margin-bottom : 1rem
}

#order-items .details {
    margin-bottom : 1rem
}

#order-items .details .customizations {
    margin-top : .625rem
}

#order-items .qty {
    margin-bottom : 1rem
}

@media (max-width : 767px) {
    #order-items {
        border-right  : 0;
        margin-bottom : 2.5rem
    }

    #order-items .card-title {
        border-bottom  : 1px solid var(--color-grey-default);
        margin-bottom  : 1rem;
        padding-bottom : 1rem
    }

    #order-items hr {
        border-top-color : var(--color-grey-default)
    }
}

/********************
	Part - order-details
********************/
#order-details {
    padding-left : 1.875rem
}

#order-details > .card-title {
    margin-bottom : 1.875rem
}

#order-details ul {
    margin-bottom : 1.25rem
}

#order-details ul li {
    margin-bottom : .625rem
}

@media (max-width : 767px) {
    #order-details {
        padding-left : .9375rem
    }

    #order-details .card-title {
        border-bottom  : 1px solid var(--color-grey-default);
        margin-bottom  : 1rem;
        padding-bottom : 1rem
    }
}

/********************
	Part - page page-order
********************/
.page-order .table {
    margin-bottom : 0
}

.page-order table td, .page-order table th {
    padding : .5rem
}

.page-order table thead th {
    text-align : center
}

/********************
	Part - page-order-detail
********************/
.page-order-detail {
    font-size : .875rem;
    color     : var(--color-grey-font-default)
}

.page-order-detail .box {
    box-shadow    : 2px 2px 8px 0 rgba(0, 0, 0, .2);
    background    : #fff;
    padding       : 1rem;
    margin-bottom : 1rem
}

.page-order-detail h3 {
    font-size      : 1rem;
    font-weight    : 700;
    text-transform : uppercase;
    color          : var(--color-black-default);
    margin-bottom  : 1rem
}

.page-order-detail #order-infos ul {
    margin : 0
}

.page-order-detail #order-history .history-lines .history-line {
    padding       : .5rem 0;
    border-bottom : 1px solid #f6f6f6
}

.page-order-detail #order-history .history-lines .history-line:last-child {
    border-bottom : 0
}

.page-order-detail #order-history .history-lines .history-line .label {
    display       : inline-block;
    margin        : .25rem 0;
    padding       : .25rem .375rem;
    color         : #fff;
    border-radius : 3px
}

.page-order-detail .addresses {
    margin : 0 -.9375rem
}

.page-order-detail .addresses h4 {
    font-size   : 1rem;
    font-weight : 700
}

.page-order-detail #order-products.return {
    margin-bottom : 1rem
}

.page-order-detail #order-products.return th.head-checkbox {
    width : 30px
}

.page-order-detail #order-products.return td {
    padding : 1.375rem .75rem
}

.page-order-detail #order-products.return td.qty {
    min-width : 125px
}

.page-order-detail #order-products.return td.qty .current {
    width         : 30%;
    float         : left;
    text-align    : right;
    padding-right : .5rem
}

.page-order-detail #order-products.return td.qty .select {
    width        : 70%;
    float        : left;
    margin       : -.625rem 0;
    padding-left : .25rem
}

.page-order-detail #order-products.return td.qty .select select {
    text-align : center
}

.page-order-detail .order-items {
    padding : 0 !important
}

.page-order-detail .order-items .order-item {
    padding       : 1rem 1rem 0;
    border-bottom : 1px solid #f6f6f6
}

.page-order-detail .order-items .order-item .checkbox {
    width   : 30px;
    float   : left;
    padding : 0 .9375rem
}

.page-order-detail .order-items .order-item .content {
    width   : calc(100% - 30px);
    float   : left;
    padding : 0 .9375rem
}

.page-order-detail .order-items .order-item .desc {
    margin-bottom : 1rem
}

.page-order-detail .order-items .order-item .desc .name {
    font-weight : 700
}

.page-order-detail .order-items .order-item .qty {
    margin-bottom : 1rem
}

.page-order-detail .order-items .order-item .qty .q,
.page-order-detail .order-items .order-item .qty .s {
    margin-bottom : .25rem
}

.page-order-detail .messages .message {
    margin-top    : .5rem;
    border-bottom : 1px solid #f6f6f6
}

.page-order-detail .messages .message:last-child {
    border-bottom : 0
}

.page-order-detail .messages .message > div {
    margin-bottom : .5rem
}

.page-order-detail .customization {
    margin-top : .75rem
}

/********************
	Part - order-return-infos
********************/
#order-return-infos .thead-default th {
    color : var(--color-black-default)
}

#order-return-infos .customization {
    margin-top : .75rem
}

/********************
	Part - login
********************/
.login-form {
    margin-top : 15px
}

/********************
	Part - renew password
********************/
.send-renew-password-link {
    padding-left  : 10px;
    padding-right : 10px
}

.renew-password {
    margin-left : 10px
}

.renew-password .email {
    padding-bottom : 30px
}

.renew-password [type=submit] {
    margin-left : 50px
}

/********************
	Part - ???
********************/
.comments_note {
    text-align : center;
    color      : var(--color-grey-font-default)
}

.count {
    color       : var(--color-grey-font-default);
    font-weight : 700;
    position    : relative;
    bottom      : .5rem
}

/********************
	Part - #products
********************/
#products .products-select {
    display           : -webkit-box;
    display           : -ms-flexbox;
    display           : flex;
    -webkit-box-align : baseline;
    -ms-flex-align    : baseline;
    align-items       : baseline;
    -webkit-box-pack  : justify;
    -ms-flex-pack     : justify;
    justify-content   : space-between
}

#products .up {
    margin-bottom : 1rem
}

#products .up .btn-secondary,
#products .up .btn-tertiary {
    color          : var(--color-grey-font-default);
    text-transform : inherit
}

#products .up .btn-secondary .material-icons, #products .up .btn-tertiary .material-icons {
    margin-right : 0
}

/********************
	Part - advertising-block
********************/
.advertising-block {
    margin-bottom : 1.563rem
}

.advertising-block img {
    width : 100%
}

/********************
	Part - content wrapper
********************/
@media (max-width : 767px) {
    #best-sales #content-wrapper,
    #new-products #content-wrapper,
    #prices-drop #content-wrapper {
        width : 100%
    }
}

/********************
	Part - card
********************/
@media screen and (max-width : 767px) {
    .card-block {
        padding : 0
    }

    .card {
        box-shadow       : none;
        background-color : inherit;
        border           : none
    }
}

.input-color {
    position : absolute;
    opacity  : 0;
    cursor   : pointer;
    height   : 1.25rem;
    width    : 1.25rem
}

.input-container {
    position : relative
}

.input-radio {
    position : absolute;
    top      : 0;
    cursor   : pointer;
    opacity  : 0;
    width    : 100%;
    height   : 100%
}

.input-color:checked + span, .input-color:hover + span, .input-radio:checked + span, .input-radio:hover + span {
    border : 2px solid var(--color-black-default)
}

.radio-label {
    box-shadow  : 2px 2px 8px 0 rgba(0, 0, 0, .2);
    background  : #fff;
    display     : inline-block;
    padding     : .125rem .625rem;
    font-weight : 600;
    border      : 2px solid #fff
}


#main .page-content h6 {
    margin-bottom : 1.125rem
}

@media (max-width : 991px) {
    .container {
        max-width : 100%
    }
}

@media (max-width : 767px) {
    #checkout-cart-summary {
        float      : none;
        width      : 100%;
        margin-top : 1rem
    }

    .default-input {
        min-width : 100%
    }

    label {
        clear : both
    }

    .dropdown-item,
    .menu {
        padding-left : 0
    }
}