@font-face {
    font-family: National2-Bold;
    src: url(fonts/National2-Bold.woff) format("woff"),
         url(fonts/National2-Bold.ttf) format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: National2Condensed-Bold;
    src: url(fonts/National2Condensed-Bold.woff) format("woff"),
         url(fonts/National2Condensed-Bold.ttf) format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: National2Condensed-Regular;
    src: url(fonts/National2Condensed-Regular.woff2) format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

*,:after,:before {
    box-sizing: border-box
}

html {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -ms-overflow-style: scrollbar;
    -webkit-tap-highlight-color: transparent;
    font-size: 14px
}

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

article,aside,dialog,figcaption,figure,footer,header,main,nav,section {
    display: block
}

body,dl,h1,h2,h3,h4,h5,h6,li,ol,p,ul {
    margin: 0;
    padding: 0
}

h1,h2,h3,h4,h5,h6 {
    letter-spacing: normal
}

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

body {
    font-family: National2Condensed-Regular;
    font-size: 1.1428571429rem;
    line-height: 18px;
    color: #202124;
    background: #fff;
    letter-spacing: .4px
}

@media (min-width: 1200px) {
    body {
        font-size:1.2857142857rem;
        line-height: 20px
    }
}

.mb-0 {
    margin-bottom: 0!important
}

.mr-1 {
    margin-right: .25rem!important
}

.mb-1 {
    margin-bottom: .25rem!important
}

.mb-2 {
    margin-bottom: .5rem!important
}

.mb-3 {
    margin-bottom: 1rem!important
}

.mb-4 {
    margin-bottom: 1.5rem!important
}

.mb-5 {
    margin-bottom: 2rem!important
}

.mb-6 {
    margin-bottom: 3rem!important
}

.mt-0 {
    margin-top: 0!important
}

.mt-1 {
    margin-top: .25rem!important
}

.mt-2 {
    margin-top: .5rem!important
}

.mt-4 {
    margin-top: 1.5rem!important
}

.pb-0 {
    padding-bottom: 0!important
}

.pl-0 {
    padding-left: 0!important
}

.pt-4 {
    padding-top: 1.5rem!important
}

.text-bold,strong {
    font-weight: 700!important
}

.justify-content-center {
    -ms-flex-pack: center!important;
    justify-content: center!important
}

.justify-content-space-between {
    -ms-flex-pack: justify;
    justify-content: space-between
}

.align-items-center {
    -ms-flex-align: center!important;
    align-items: center!important
}

.align-items-end {
    -ms-flex-align: end!important;
    align-items: flex-end!important
}

.display-flex {
    display: -ms-flexbox;
    display: flex
}

.position-relative {
    position: relative
}

.text-uppercase {
    text-transform: uppercase
}

.text-lowercase {
    text-transform: lowercase
}

.d-none,.hidden {
    display: none!important
}

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

.text-left {
    text-align: left!important
}

.text-right {
    text-align: right!important
}

.text-center {
    text-align: center!important
}

img {
    vertical-align: middle
}

.img-fluid {
    width: 100%
}

.img-full-width {
    max-width: 100%
}

.custom-width {
    width: 9.2857142857rem
}

.img-half-width {
    max-width: 45%
}

@media (max-width: 767px) {
    .img-half-width {
        max-width:65%!important
    }
}

.custom-img-size {
    max-width: 45%
}

@media (max-width: 767px) {
    .custom-img-size {
        max-width:100%!important
    }
}

.custom-description-img {
    width: 8.5714285714rem;
    position: absolute;
    top: 4.6428571429rem;
    bottom: 0
}

@media (max-width: 768px) {
    .custom-description-img {
        width:5.3571428571rem;
        top: 5rem
    }
}

@media (min-width: 768px) {
    .custom-padding {
        padding:0 12%
    }
}

hr {
    margin-top: 1.2857142857rem;
    margin-bottom: 1.2857142857rem;
    border: 0;
    border-top: 1px solid rgba(0,0,0,.1)
}

a {
    color: #202124;
    text-decoration: none;
    cursor: pointer;
    transition: color .2s linear
}

a:active,a:focus,a:hover {
    outline: 0;
    text-decoration: none
}

h1,h2,h3,h4,h5,h6 {
    font-family: National2Condensed-Bold;
    font-weight: 700;
    margin-bottom: 1.4285714286rem
}

h1 {
    text-transform: uppercase;
    font-size: 2.5714285714rem;
    line-height: 36px
}

h2 {
    font-size: 2.2857142857rem;
    line-height: 32px
}

h3 {
    font-size: 2.1428571429rem;
    line-height: 30px
}

h4 {
    font-size: 1.8571428571rem;
    line-height: 1.8571428571rem;
    text-transform: uppercase
}

h5 {
    font-size: 1.4285714286rem
}

h6 {
    font-size: 1.2857142857rem
}

p {
    margin-bottom: 1.7857142857rem
}

.float-right {
    float: right!important
}

dl,li,ol,ul {
    list-style-type: none
}

ul ul {
    margin-left: .5714285714rem
}

.row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -.7142857143rem;
    margin-left: -.7142857143rem
}

.container {
    width: 100%;
    padding: 0 1.0714285714rem;
    margin: 0 auto
}

@media (max-width: 767px) {
    .d-sm-none {
        display:none!important
    }

    .d-sm-block {
        display: block!important
    }
}

@media (min-width: 768px) {
    .d-md-none {
        display:none!important
    }

    .d-md-block {
        display: block!important
    }

    .order-md-2 {
        -ms-flex-order: 2;
        order: 2
    }

    .order-md-1 {
        -ms-flex-order: 1;
        order: 1
    }
}

@media (min-width: 992px) {
    .d-lg-none {
        display:none!important
    }

    .d-lg-block {
        display: block!important
    }
}

@media (min-width: 1200px) {
    .container {
        max-width:1200px
    }

    ::-webkit-scrollbar {
        -webkit-appearance: none
    }

    ::-webkit-scrollbar:vertical {
        width: 12px
    }

    ::-webkit-scrollbar:horizontal {
        height: 12px
    }

    ::-webkit-scrollbar-thumb {
        background-color: rgba(0,0,0,.4);
        border-radius: 10px;
        border: 2px solid rgba(0,0,0,.1)
    }

    ::-webkit-scrollbar-track {
        border-radius: 10px;
        background-color: rgba(0,0,0,0)
    }
}

@media (min-width: 1580px) {
    .container {
        max-width:1440px
    }
}

.text-captalize {
    text-transform: capitalize
}

.mat-ripple {
    overflow: hidden;
    position: relative
}

.mat-ripple:not(:empty) {
    transform: translateZ(0)
}

.mat-ripple.mat-ripple-unbounded {
    overflow: visible
}

.mat-ripple-element {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    transition: opacity,transform 0ms cubic-bezier(0,0,.2,1);
    -ms-transform: scale(0);
    transform: scale(0)
}

.cdk-high-contrast-active .mat-ripple-element {
    display: none
}

.cdk-visually-hidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    outline: 0;
    -webkit-appearance: none;
    -moz-appearance: none
}

.cdk-global-overlay-wrapper,.cdk-overlay-container {
    pointer-events: none;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%
}

.cdk-overlay-container {
    position: fixed;
    z-index: 1000
}

.cdk-overlay-container:empty {
    display: none
}

.cdk-global-overlay-wrapper,.cdk-overlay-pane {
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    z-index: 1000
}

.cdk-overlay-pane {
    pointer-events: auto;
    box-sizing: border-box;
    max-width: 100%;
    max-height: 100%
}

.cdk-overlay-backdrop {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    pointer-events: auto;
    -webkit-tap-highlight-color: transparent;
    transition: opacity .4s cubic-bezier(.25,.8,.25,1);
    opacity: 0
}

.cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
    opacity: 1
}

@media screen and (-ms-high-contrast:active) {
    .cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
        opacity: .6
    }
}

.cdk-overlay-dark-backdrop {
    background: rgba(0,0,0,.32)
}

.cdk-overlay-transparent-backdrop,.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing {
    opacity: 0
}

.cdk-overlay-connected-position-bounding-box {
    position: absolute;
    z-index: 1000;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 1px;
    min-height: 1px
}

.cdk-global-scrollblock {
    position: fixed;
    width: 100%;
    overflow-y: scroll
}

.mat-form-field {
    font-size: inherit;
    font-weight: 400;
    line-height: 1.125;
    font-family: Roboto,Helvetica Neue,sans-serif;
    letter-spacing: normal
}

.mat-form-field-wrapper {
    padding-bottom: 1.34375em
}

.mat-form-field-prefix .mat-icon,.mat-form-field-suffix .mat-icon {
    font-size: 150%;
    line-height: 1.125
}

.mat-form-field-prefix .mat-icon-button,.mat-form-field-suffix .mat-icon-button {
    height: 1.5em;
    width: 1.5em
}

.mat-form-field-prefix .mat-icon-button .mat-icon,.mat-form-field-suffix .mat-icon-button .mat-icon {
    height: 1.125em;
    line-height: 1.125
}

.mat-form-field-infix {
    padding: .5em 0;
    border-top: .84375em solid rgba(0,0,0,0)
}

.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label {
    -ms-transform: translateY(-1.34375em) scale(.75);
    transform: translateY(-1.34375em) scale(.75);
    width: 133.3333333333%
}

.mat-form-field-can-float .mat-input-server[label]:not(:label-shown)+.mat-form-field-label-wrapper .mat-form-field-label {
    -ms-transform: translateY(-1.34374em) scale(.75);
    transform: translateY(-1.34374em) scale(.75);
    width: 133.3333433333%
}

.mat-form-field-label-wrapper {
    top: -.84375em;
    padding-top: .84375em
}

.mat-form-field-label {
    top: 1.34375em
}

.mat-form-field-underline {
    bottom: 1.34375em
}

.mat-form-field-subscript-wrapper {
    font-size: 75%;
    margin-top: .6666666667em;
    top: calc(100% - 1.79167em)
}

.mat-form-field-appearance-legacy .mat-form-field-wrapper {
    padding-bottom: 1.25em
}

.mat-form-field-appearance-legacy .mat-form-field-infix {
    padding: .4375em 0
}

.mat-form-field-appearance-legacy.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label {
    transform: translateY(-1.28125em) scale(.75) perspective(100px) translateZ(.001px);
    -ms-transform: translateY(-1.28125em) scale(.75);
    width: 133.3333333333%
}

.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-form-field-autofill-control:-webkit-autofill+.mat-form-field-label-wrapper .mat-form-field-label {
    transform: translateY(-1.28125em) scale(.75) perspective(100px) translateZ(.00101px);
    -ms-transform: translateY(-1.28124em) scale(.75);
    width: 133.3333433333%
}

.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server[label]:not(:label-shown)+.mat-form-field-label-wrapper .mat-form-field-label {
    transform: translateY(-1.28125em) scale(.75) perspective(100px) translateZ(.00102px);
    -ms-transform: translateY(-1.28123em) scale(.75);
    width: 133.3333533333%
}

.mat-form-field-appearance-legacy .mat-form-field-label {
    top: 1.28125em
}

.mat-form-field-appearance-legacy .mat-form-field-underline {
    bottom: 1.25em
}

.mat-form-field-appearance-legacy .mat-form-field-subscript-wrapper {
    margin-top: .5416666667em;
    top: calc(100% - 1.66667em)
}

@media print {
    .mat-form-field-appearance-legacy.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label {
        -ms-transform: translateY(-1.28122em) scale(.75);
        transform: translateY(-1.28122em) scale(.75)
    }

    .mat-form-field-appearance-legacy.mat-form-field-can-float .mat-form-field-autofill-control:-webkit-autofill+.mat-form-field-label-wrapper .mat-form-field-label {
        transform: translateY(-1.28121em) scale(.75)
    }

    .mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server[label]:not(:label-shown)+.mat-form-field-label-wrapper .mat-form-field-label {
        -ms-transform: translateY(-1.2812em) scale(.75);
        transform: translateY(-1.2812em) scale(.75)
    }
}

.mat-form-field-appearance-fill .mat-form-field-infix {
    padding: .25em 0 .75em
}

.mat-form-field-appearance-fill .mat-form-field-label {
    top: 1.09375em;
    margin-top: -.5em
}

.mat-form-field-appearance-fill.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,.mat-form-field-appearance-fill.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label {
    -ms-transform: translateY(-.59375em) scale(.75);
    transform: translateY(-.59375em) scale(.75);
    width: 133.3333333333%
}

.mat-form-field-appearance-fill.mat-form-field-can-float .mat-input-server[label]:not(:label-shown)+.mat-form-field-label-wrapper .mat-form-field-label {
    -ms-transform: translateY(-.59374em) scale(.75);
    transform: translateY(-.59374em) scale(.75);
    width: 133.3333433333%
}

.mat-form-field-appearance-outline .mat-form-field-infix {
    padding: 1em 0
}

.mat-form-field-appearance-outline .mat-form-field-label {
    top: 1.84375em;
    margin-top: -.25em
}

.mat-form-field-appearance-outline.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,.mat-form-field-appearance-outline.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label {
    -ms-transform: translateY(-1.59375em) scale(.75);
    transform: translateY(-1.59375em) scale(.75);
    width: 133.3333333333%
}

.mat-form-field-appearance-outline.mat-form-field-can-float .mat-input-server[label]:not(:label-shown)+.mat-form-field-label-wrapper .mat-form-field-label {
    -ms-transform: translateY(-1.59374em) scale(.75);
    transform: translateY(-1.59374em) scale(.75);
    width: 133.3333433333%
}

.mat-ripple-element {
    background-color: rgba(0,0,0,.1)
}

.mat-option {
    color: rgba(0,0,0,.87)
}

.mat-option.mat-active,.mat-option.mat-selected:not(.mat-option-multiple):not(.mat-option-disabled),.mat-option:focus:not(.mat-option-disabled),.mat-option:hover:not(.mat-option-disabled) {
    background: rgba(0,0,0,.04)
}

.mat-option.mat-active {
    color: rgba(0,0,0,.87)
}

.mat-option.mat-option-disabled {
    color: rgba(0,0,0,.38)
}

.mat-primary .mat-option.mat-selected:not(.mat-option-disabled) {
    color: #3f51b5
}

.mat-accent .mat-option.mat-selected:not(.mat-option-disabled) {
    color: #ff4081
}

.mat-warn .mat-option.mat-selected:not(.mat-option-disabled) {
    color: #f44336
}

.mat-optgroup-label {
    color: rgba(0,0,0,.54)
}

.mat-optgroup-disabled .mat-optgroup-label {
    color: rgba(0,0,0,.38)
}

.mat-pseudo-checkbox {
    color: rgba(0,0,0,.54)
}

.mat-pseudo-checkbox:after {
    color: #fafafa
}

.mat-pseudo-checkbox-disabled {
    color: #b0b0b0
}

.mat-primary .mat-pseudo-checkbox-checked,.mat-primary .mat-pseudo-checkbox-indeterminate {
    background: #3f51b5
}

.mat-accent .mat-pseudo-checkbox-checked,.mat-accent .mat-pseudo-checkbox-indeterminate,.mat-pseudo-checkbox-checked,.mat-pseudo-checkbox-indeterminate {
    background: #ff4081
}

.mat-warn .mat-pseudo-checkbox-checked,.mat-warn .mat-pseudo-checkbox-indeterminate {
    background: #f44336
}

.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled,.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled {
    background: #b0b0b0
}

.mat-elevation-z0 {
    box-shadow: 0 0 0 0 rgba(0,0,0,.2),0 0 0 0 rgba(0,0,0,.14),0 0 0 0 rgba(0,0,0,.12)
}

.mat-elevation-z1 {
    box-shadow: 0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12)
}

.mat-elevation-z2 {
    box-shadow: 0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12)
}

.mat-elevation-z3 {
    box-shadow: 0 3px 3px -2px rgba(0,0,0,.2),0 3px 4px 0 rgba(0,0,0,.14),0 1px 8px 0 rgba(0,0,0,.12)
}

.mat-elevation-z4 {
    box-shadow: 0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12)
}

.mat-elevation-z5 {
    box-shadow: 0 3px 5px -1px rgba(0,0,0,.2),0 5px 8px 0 rgba(0,0,0,.14),0 1px 14px 0 rgba(0,0,0,.12)
}

.mat-elevation-z6 {
    box-shadow: 0 3px 5px -1px rgba(0,0,0,.2),0 6px 10px 0 rgba(0,0,0,.14),0 1px 18px 0 rgba(0,0,0,.12)
}

.mat-elevation-z7 {
    box-shadow: 0 4px 5px -2px rgba(0,0,0,.2),0 7px 10px 1px rgba(0,0,0,.14),0 2px 16px 1px rgba(0,0,0,.12)
}

.mat-elevation-z8 {
    box-shadow: 0 5px 5px -3px rgba(0,0,0,.2),0 8px 10px 1px rgba(0,0,0,.14),0 3px 14px 2px rgba(0,0,0,.12)
}

.mat-elevation-z9 {
    box-shadow: 0 5px 6px -3px rgba(0,0,0,.2),0 9px 12px 1px rgba(0,0,0,.14),0 3px 16px 2px rgba(0,0,0,.12)
}

.mat-elevation-z10 {
    box-shadow: 0 6px 6px -3px rgba(0,0,0,.2),0 10px 14px 1px rgba(0,0,0,.14),0 4px 18px 3px rgba(0,0,0,.12)
}

.mat-elevation-z11 {
    box-shadow: 0 6px 7px -4px rgba(0,0,0,.2),0 11px 15px 1px rgba(0,0,0,.14),0 4px 20px 3px rgba(0,0,0,.12)
}

.mat-elevation-z12 {
    box-shadow: 0 7px 8px -4px rgba(0,0,0,.2),0 12px 17px 2px rgba(0,0,0,.14),0 5px 22px 4px rgba(0,0,0,.12)
}

.mat-elevation-z13 {
    box-shadow: 0 7px 8px -4px rgba(0,0,0,.2),0 13px 19px 2px rgba(0,0,0,.14),0 5px 24px 4px rgba(0,0,0,.12)
}

.mat-elevation-z14 {
    box-shadow: 0 7px 9px -4px rgba(0,0,0,.2),0 14px 21px 2px rgba(0,0,0,.14),0 5px 26px 4px rgba(0,0,0,.12)
}

.mat-elevation-z15 {
    box-shadow: 0 8px 9px -5px rgba(0,0,0,.2),0 15px 22px 2px rgba(0,0,0,.14),0 6px 28px 5px rgba(0,0,0,.12)
}

.mat-elevation-z16 {
    box-shadow: 0 8px 10px -5px rgba(0,0,0,.2),0 16px 24px 2px rgba(0,0,0,.14),0 6px 30px 5px rgba(0,0,0,.12)
}

.mat-elevation-z17 {
    box-shadow: 0 8px 11px -5px rgba(0,0,0,.2),0 17px 26px 2px rgba(0,0,0,.14),0 6px 32px 5px rgba(0,0,0,.12)
}

.mat-elevation-z18 {
    box-shadow: 0 9px 11px -5px rgba(0,0,0,.2),0 18px 28px 2px rgba(0,0,0,.14),0 7px 34px 6px rgba(0,0,0,.12)
}

.mat-elevation-z19 {
    box-shadow: 0 9px 12px -6px rgba(0,0,0,.2),0 19px 29px 2px rgba(0,0,0,.14),0 7px 36px 6px rgba(0,0,0,.12)
}

.mat-elevation-z20 {
    box-shadow: 0 10px 13px -6px rgba(0,0,0,.2),0 20px 31px 3px rgba(0,0,0,.14),0 8px 38px 7px rgba(0,0,0,.12)
}

.mat-elevation-z21 {
    box-shadow: 0 10px 13px -6px rgba(0,0,0,.2),0 21px 33px 3px rgba(0,0,0,.14),0 8px 40px 7px rgba(0,0,0,.12)
}

.mat-elevation-z22 {
    box-shadow: 0 10px 14px -6px rgba(0,0,0,.2),0 22px 35px 3px rgba(0,0,0,.14),0 8px 42px 7px rgba(0,0,0,.12)
}

.mat-elevation-z23 {
    box-shadow: 0 11px 14px -7px rgba(0,0,0,.2),0 23px 36px 3px rgba(0,0,0,.14),0 9px 44px 8px rgba(0,0,0,.12)
}

.mat-elevation-z24 {
    box-shadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14),0 9px 46px 8px rgba(0,0,0,.12)
}

.mat-app-background {
    background-color: #fafafa;
    color: rgba(0,0,0,.87)
}

.mat-theme-loaded-marker {
    display: none
}

.mat-select-value {
    color: rgba(0,0,0,.87)
}

.mat-select-placeholder {
    color: rgba(0,0,0,.42)
}

.mat-select-disabled .mat-select-value {
    color: rgba(0,0,0,.38)
}

.mat-select-arrow {
    color: rgba(0,0,0,.54)
}

.mat-select-panel {
    background: #fff
}

.mat-select-panel:not([class*=mat-elevation-z]) {
    box-shadow: 0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12)
}

.mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple) {
    background: rgba(0,0,0,.12)
}

.mat-form-field.mat-focused.mat-primary .mat-select-arrow {
    color: #3f51b5
}

.mat-form-field.mat-focused.mat-accent .mat-select-arrow {
    color: #ff4081
}

.mat-form-field.mat-focused.mat-warn .mat-select-arrow,.mat-form-field .mat-select.mat-select-invalid .mat-select-arrow {
    color: #f44336
}

.mat-form-field .mat-select.mat-select-disabled .mat-select-arrow {
    color: rgba(0,0,0,.38)
}

.mat-button,.mat-icon-button,.mat-stroked-button {
    color: inherit;
    background: rgba(0,0,0,0)
}

.mat-button.mat-primary,.mat-icon-button.mat-primary,.mat-stroked-button.mat-primary {
    color: #3f51b5
}

.mat-button.mat-accent,.mat-icon-button.mat-accent,.mat-stroked-button.mat-accent {
    color: #ff4081
}

.mat-button.mat-warn,.mat-icon-button.mat-warn,.mat-stroked-button.mat-warn {
    color: #f44336
}

.mat-button.mat-accent[disabled],.mat-button.mat-primary[disabled],.mat-button.mat-warn[disabled],.mat-button[disabled][disabled],.mat-icon-button.mat-accent[disabled],.mat-icon-button.mat-primary[disabled],.mat-icon-button.mat-warn[disabled],.mat-icon-button[disabled][disabled],.mat-stroked-button.mat-accent[disabled],.mat-stroked-button.mat-primary[disabled],.mat-stroked-button.mat-warn[disabled],.mat-stroked-button[disabled][disabled] {
    color: rgba(0,0,0,.26)
}

.mat-button.mat-primary .mat-button-focus-overlay,.mat-icon-button.mat-primary .mat-button-focus-overlay,.mat-stroked-button.mat-primary .mat-button-focus-overlay {
    background-color: #3f51b5
}

.mat-button.mat-accent .mat-button-focus-overlay,.mat-icon-button.mat-accent .mat-button-focus-overlay,.mat-stroked-button.mat-accent .mat-button-focus-overlay {
    background-color: #ff4081
}

.mat-button.mat-warn .mat-button-focus-overlay,.mat-icon-button.mat-warn .mat-button-focus-overlay,.mat-stroked-button.mat-warn .mat-button-focus-overlay {
    background-color: #f44336
}

.mat-button[disabled] .mat-button-focus-overlay,.mat-icon-button[disabled] .mat-button-focus-overlay,.mat-stroked-button[disabled] .mat-button-focus-overlay {
    background-color: rgba(0,0,0,0)
}

.mat-button .mat-ripple-element,.mat-icon-button .mat-ripple-element,.mat-stroked-button .mat-ripple-element {
    opacity: .1;
    background-color: currentColor
}

.mat-button-focus-overlay {
    background: #000
}

.mat-stroked-button:not([disabled]) {
    border-color: rgba(0,0,0,.12)
}

.mat-fab,.mat-flat-button,.mat-mini-fab,.mat-raised-button {
    color: rgba(0,0,0,.87);
    background-color: #fff
}

.mat-fab.mat-accent,.mat-fab.mat-primary,.mat-fab.mat-warn,.mat-flat-button.mat-accent,.mat-flat-button.mat-primary,.mat-flat-button.mat-warn,.mat-mini-fab.mat-accent,.mat-mini-fab.mat-primary,.mat-mini-fab.mat-warn,.mat-raised-button.mat-accent,.mat-raised-button.mat-primary,.mat-raised-button.mat-warn {
    color: #fff
}

.mat-fab.mat-accent[disabled],.mat-fab.mat-primary[disabled],.mat-fab.mat-warn[disabled],.mat-fab[disabled][disabled],.mat-flat-button.mat-accent[disabled],.mat-flat-button.mat-primary[disabled],.mat-flat-button.mat-warn[disabled],.mat-flat-button[disabled][disabled],.mat-mini-fab.mat-accent[disabled],.mat-mini-fab.mat-primary[disabled],.mat-mini-fab.mat-warn[disabled],.mat-mini-fab[disabled][disabled],.mat-raised-button.mat-accent[disabled],.mat-raised-button.mat-primary[disabled],.mat-raised-button.mat-warn[disabled],.mat-raised-button[disabled][disabled] {
    color: rgba(0,0,0,.26)
}

.mat-fab.mat-primary,.mat-flat-button.mat-primary,.mat-mini-fab.mat-primary,.mat-raised-button.mat-primary {
    background-color: #3f51b5
}

.mat-fab.mat-accent,.mat-flat-button.mat-accent,.mat-mini-fab.mat-accent,.mat-raised-button.mat-accent {
    background-color: #ff4081
}

.mat-fab.mat-warn,.mat-flat-button.mat-warn,.mat-mini-fab.mat-warn,.mat-raised-button.mat-warn {
    background-color: #f44336
}

.mat-fab.mat-accent[disabled],.mat-fab.mat-primary[disabled],.mat-fab.mat-warn[disabled],.mat-fab[disabled][disabled],.mat-flat-button.mat-accent[disabled],.mat-flat-button.mat-primary[disabled],.mat-flat-button.mat-warn[disabled],.mat-flat-button[disabled][disabled],.mat-mini-fab.mat-accent[disabled],.mat-mini-fab.mat-primary[disabled],.mat-mini-fab.mat-warn[disabled],.mat-mini-fab[disabled][disabled],.mat-raised-button.mat-accent[disabled],.mat-raised-button.mat-primary[disabled],.mat-raised-button.mat-warn[disabled],.mat-raised-button[disabled][disabled] {
    background-color: rgba(0,0,0,.12)
}

.mat-fab.mat-accent .mat-ripple-element,.mat-fab.mat-primary .mat-ripple-element,.mat-fab.mat-warn .mat-ripple-element,.mat-flat-button.mat-accent .mat-ripple-element,.mat-flat-button.mat-primary .mat-ripple-element,.mat-flat-button.mat-warn .mat-ripple-element,.mat-mini-fab.mat-accent .mat-ripple-element,.mat-mini-fab.mat-primary .mat-ripple-element,.mat-mini-fab.mat-warn .mat-ripple-element,.mat-raised-button.mat-accent .mat-ripple-element,.mat-raised-button.mat-primary .mat-ripple-element,.mat-raised-button.mat-warn .mat-ripple-element {
    background-color: hsla(0,0%,100%,.1)
}

.mat-flat-button:not([class*=mat-elevation-z]),.mat-stroked-button:not([class*=mat-elevation-z]) {
    box-shadow: 0 0 0 0 rgba(0,0,0,.2),0 0 0 0 rgba(0,0,0,.14),0 0 0 0 rgba(0,0,0,.12)
}

.mat-raised-button:not([class*=mat-elevation-z]) {
    box-shadow: 0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12)
}

.mat-raised-button:not([disabled]):active:not([class*=mat-elevation-z]) {
    box-shadow: 0 5px 5px -3px rgba(0,0,0,.2),0 8px 10px 1px rgba(0,0,0,.14),0 3px 14px 2px rgba(0,0,0,.12)
}

.mat-raised-button[disabled]:not([class*=mat-elevation-z]) {
    box-shadow: 0 0 0 0 rgba(0,0,0,.2),0 0 0 0 rgba(0,0,0,.14),0 0 0 0 rgba(0,0,0,.12)
}

.mat-fab:not([class*=mat-elevation-z]),.mat-mini-fab:not([class*=mat-elevation-z]) {
    box-shadow: 0 3px 5px -1px rgba(0,0,0,.2),0 6px 10px 0 rgba(0,0,0,.14),0 1px 18px 0 rgba(0,0,0,.12)
}

.mat-fab:not([disabled]):active:not([class*=mat-elevation-z]),.mat-mini-fab:not([disabled]):active:not([class*=mat-elevation-z]) {
    box-shadow: 0 7px 8px -4px rgba(0,0,0,.2),0 12px 17px 2px rgba(0,0,0,.14),0 5px 22px 4px rgba(0,0,0,.12)
}

.mat-fab[disabled]:not([class*=mat-elevation-z]),.mat-mini-fab[disabled]:not([class*=mat-elevation-z]) {
    box-shadow: 0 0 0 0 rgba(0,0,0,.2),0 0 0 0 rgba(0,0,0,.14),0 0 0 0 rgba(0,0,0,.12)
}

.mat-form-field-label,.mat-hint {
    color: rgba(0,0,0,.6)
}

.mat-form-field.mat-focused .mat-form-field-label {
    color: #3f51b5
}

.mat-form-field.mat-focused .mat-form-field-label.mat-accent {
    color: #ff4081
}

.mat-form-field.mat-focused .mat-form-field-label.mat-warn {
    color: #f44336
}

.mat-focused .mat-form-field-required-marker {
    color: #ff4081
}

.mat-form-field-ripple {
    background-color: rgba(0,0,0,.87)
}

.mat-form-field.mat-focused .mat-form-field-ripple {
    background-color: #3f51b5
}

.mat-form-field.mat-focused .mat-form-field-ripple.mat-accent {
    background-color: #ff4081
}

.mat-form-field.mat-focused .mat-form-field-ripple.mat-warn {
    background-color: #f44336
}

.mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid) .mat-form-field-infix:after {
    color: #3f51b5
}

.mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid).mat-accent .mat-form-field-infix:after {
    color: #ff4081
}

.mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid).mat-warn .mat-form-field-infix:after,.mat-form-field.mat-form-field-invalid .mat-form-field-label,.mat-form-field.mat-form-field-invalid .mat-form-field-label.mat-accent,.mat-form-field.mat-form-field-invalid .mat-form-field-label .mat-form-field-required-marker {
    color: #f44336
}

.mat-form-field.mat-form-field-invalid .mat-form-field-ripple,.mat-form-field.mat-form-field-invalid .mat-form-field-ripple.mat-accent {
    background-color: #f44336
}

.mat-error {
    color: #f44336
}

.mat-form-field-appearance-legacy .mat-form-field-label,.mat-form-field-appearance-legacy .mat-hint {
    color: rgba(0,0,0,.54)
}

.mat-form-field-appearance-legacy .mat-form-field-underline {
    background-color: rgba(0,0,0,.42)
}

.mat-form-field-appearance-legacy.mat-form-field-disabled .mat-form-field-underline {
    background-image: linear-gradient(90deg,rgba(0,0,0,.42) 0,rgba(0,0,0,.42) 33%,rgba(0,0,0,0) 0);
    background-size: 4px 100%;
    background-repeat: repeat-x
}

.mat-form-field-appearance-standard .mat-form-field-underline {
    background-color: rgba(0,0,0,.42)
}

.mat-form-field-appearance-standard.mat-form-field-disabled .mat-form-field-underline {
    background-image: linear-gradient(90deg,rgba(0,0,0,.42) 0,rgba(0,0,0,.42) 33%,rgba(0,0,0,0) 0);
    background-size: 4px 100%;
    background-repeat: repeat-x
}

.mat-form-field-appearance-fill .mat-form-field-flex {
    background-color: rgba(0,0,0,.04)
}

.mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-flex {
    background-color: rgba(0,0,0,.02)
}

.mat-form-field-appearance-fill .mat-form-field-underline:before {
    background-color: rgba(0,0,0,.42)
}

.mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-label {
    color: rgba(0,0,0,.38)
}

.mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-underline:before {
    background-color: rgba(0,0,0,0)
}

.mat-form-field-appearance-outline .mat-form-field-outline {
    color: rgba(0,0,0,.12)
}

.mat-form-field-appearance-outline .mat-form-field-outline-thick {
    color: rgba(0,0,0,.87)
}

.mat-form-field-appearance-outline.mat-focused .mat-form-field-outline-thick {
    color: #3f51b5
}

.mat-form-field-appearance-outline.mat-focused.mat-accent .mat-form-field-outline-thick {
    color: #ff4081
}

.mat-form-field-appearance-outline.mat-focused.mat-warn .mat-form-field-outline-thick,.mat-form-field-appearance-outline.mat-form-field-invalid.mat-form-field-invalid .mat-form-field-outline-thick {
    color: #f44336
}

.mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-label {
    color: rgba(0,0,0,.38)
}

.mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-outline {
    color: rgba(0,0,0,.06)
}

.mat-checkbox-frame {
    border-color: rgba(0,0,0,.54)
}

.mat-checkbox-checkmark {
    fill: #fafafa
}

.mat-checkbox-checkmark-path {
    stroke: #fafafa!important
}

.mat-checkbox-mixedmark {
    background-color: #fafafa
}

.mat-checkbox-checked.mat-primary .mat-checkbox-background,.mat-checkbox-indeterminate.mat-primary .mat-checkbox-background {
    background-color: #3f51b5
}

.mat-checkbox-checked.mat-accent .mat-checkbox-background,.mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
    background-color: #ff4081
}

.mat-checkbox-checked.mat-warn .mat-checkbox-background,.mat-checkbox-indeterminate.mat-warn .mat-checkbox-background {
    background-color: #f44336
}

.mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background,.mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background {
    background-color: #b0b0b0
}

.mat-checkbox-disabled:not(.mat-checkbox-checked) .mat-checkbox-frame {
    border-color: #b0b0b0
}

.mat-checkbox-disabled .mat-checkbox-label {
    color: rgba(0,0,0,.54)
}

.mat-checkbox .mat-ripple-element {
    background-color: #000
}

.mat-checkbox-checked:not(.mat-checkbox-disabled).mat-primary .mat-ripple-element,.mat-checkbox:active:not(.mat-checkbox-disabled).mat-primary .mat-ripple-element {
    background: #3f51b5
}

.mat-checkbox-checked:not(.mat-checkbox-disabled).mat-accent .mat-ripple-element,.mat-checkbox:active:not(.mat-checkbox-disabled).mat-accent .mat-ripple-element {
    background: #ff4081
}

.mat-checkbox-checked:not(.mat-checkbox-disabled).mat-warn .mat-ripple-element,.mat-checkbox:active:not(.mat-checkbox-disabled).mat-warn .mat-ripple-element {
    background: #f44336
}

.mat-calendar-arrow {
    border-top-color: rgba(0,0,0,.54)
}

.mat-datepicker-content .mat-calendar-next-button,.mat-datepicker-content .mat-calendar-previous-button,.mat-datepicker-toggle {
    color: rgba(0,0,0,.54)
}

.mat-calendar-table-header {
    color: rgba(0,0,0,.38)
}

.mat-calendar-table-header-divider:after {
    background: rgba(0,0,0,.12)
}

.mat-calendar-body-label {
    color: rgba(0,0,0,.54)
}

.mat-calendar-body-cell-content {
    color: rgba(0,0,0,.87);
    border-color: rgba(0,0,0,0)
}

.mat-calendar-body-disabled>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected) {
    color: rgba(0,0,0,.38)
}

.cdk-keyboard-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected),.cdk-program-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected),.mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected) {
    background-color: rgba(0,0,0,.04)
}

.mat-calendar-body-today:not(.mat-calendar-body-selected) {
    border-color: rgba(0,0,0,.38)
}

.mat-calendar-body-disabled>.mat-calendar-body-today:not(.mat-calendar-body-selected) {
    border-color: rgba(0,0,0,.18)
}

.mat-calendar-body-selected {
    background-color: #3f51b5;
    color: #fff
}

.mat-calendar-body-disabled>.mat-calendar-body-selected {
    background-color: rgba(63,81,181,.4)
}

.mat-calendar-body-today.mat-calendar-body-selected {
    box-shadow: inset 0 0 0 1px #fff
}

.mat-datepicker-content {
    box-shadow: 0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12);
    background-color: #fff;
    color: rgba(0,0,0,.87)
}

.mat-datepicker-content.mat-accent .mat-calendar-body-selected {
    background-color: #ff4081;
    color: #fff
}

.mat-datepicker-content.mat-accent .mat-calendar-body-disabled>.mat-calendar-body-selected {
    background-color: rgba(255,64,129,.4)
}

.mat-datepicker-content.mat-accent .mat-calendar-body-today.mat-calendar-body-selected {
    box-shadow: inset 0 0 0 1px #fff
}

.mat-datepicker-content.mat-warn .mat-calendar-body-selected {
    background-color: #f44336;
    color: #fff
}

.mat-datepicker-content.mat-warn .mat-calendar-body-disabled>.mat-calendar-body-selected {
    background-color: rgba(244,67,54,.4)
}

.mat-datepicker-content.mat-warn .mat-calendar-body-today.mat-calendar-body-selected {
    box-shadow: inset 0 0 0 1px #fff
}

.mat-datepicker-content-touch {
    box-shadow: 0 0 0 0 rgba(0,0,0,.2),0 0 0 0 rgba(0,0,0,.14),0 0 0 0 rgba(0,0,0,.12)
}

.mat-datepicker-toggle-active {
    color: #3f51b5
}

.mat-datepicker-toggle-active.mat-accent {
    color: #ff4081
}

.mat-datepicker-toggle-active.mat-warn {
    color: #f44336
}

@keyframes appearInRight {
    0% {
        transform: translate3d(20px,0,0);
        opacity: 0
    }

    to {
        transform: translateZ(0);
        opacity: 1
    }
}

@keyframes appearInLeft {
    0% {
        transform: translate3d(-20px,0,0);
        opacity: 0
    }

    to {
        transform: translateZ(0);
        opacity: 1
    }
}

@media (min-width: 768px) {
    .appear-right {
        animation:appearInRight 2s;
        -moz-animation: appearInRight 2s;
        -webkit-animation: appearInRight 2s;
        -o-animation: appearInRight 2s
    }

    .appear-left {
        animation: appearInLeft 2s;
        -moz-animation: appearInLeft 2s;
        -webkit-animation: appearInLeft 2s;
        -o-animation: appearInLeft 2s
    }
}

@keyframes linearrowanimate {
    0%,to {
        transform: translate(0)
    }

    50% {
        transform: translate(10px)
    }
}

.bar-spinner {
    background: linear-gradient(90deg,#eee 8%,#e1e1e1 18%,#eee 33%);
    background-size: 200% 50px;
    animation: preloadAnimation 2s infinite;
    min-height: 30px;
    margin-bottom: 1.0714285714rem
}

.item-details-title .bar-spinner {
    -ms-flex: 0 0 48%;
    flex: 0 0 48%;
    margin-bottom: .3571428571rem
}

.spinner-btn {
    min-height: 50px
}

@keyframes preloadAnimation {
    0% {
        background-position: -280px 0
    }

    to {
        background-position: 300px 0
    }
}

[class^=icon-] {
    background: url(https://static.kfc.fr/images/loyalty/sprite2.png?v=22.0) no-repeat;
    width: 25px;
    display: inline-block;
    height: 25px;
    vertical-align: middle
}

.icon-backToProduct {
    background-position: -171px -1388px;
    position: relative;
    z-index: 2
}

.icon-backToProductWhite {
    background-position: -193px -1388px;
    position: relative;
    z-index: 2
}

.header-image-div {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    letter-spacing: -.3px;
    -ms-flex-align: center;
    align-items: center;
    text-align: center
}

.header-image-div .icon-coupon-active-text,.header-image-div .logged-in-text {
    color: #e4002b
}

.header-image-div h2 {
    font-size: 14px!important;
    margin-bottom: -10px;
    margin-top: -5px;
    text-transform: none
}

.icon-login {
    background: none;
    background: url(https://static.kfc.fr/images/web/loyalty_login.svg) no-repeat 0 5px!important;
    width: 25px;
    height: 35px;
    background-size: 100%!important
}

.icon-login.logged-in {
    background: url(https://static.kfc.fr/images/web/loyalty_logged-in.svg) no-repeat 0 5px!important;
    width: 25px!important;
    height: 35px!important;
    background-size: 100%!important
}

.icon-map-marker {
    background-position: -178px -57px;
    width: 26px;
    height: 37px
}

.icon-my-location {
    background-position: -222px -55px;
    width: 40px;
    height: 40px
}

.icon-lock {
    position: relative;
    vertical-align: baseline;
    margin-right: .2142857143rem
}

.icon-lock:after,.icon-lock:before {
    content: "";
    position: absolute;
    height: 15px
}

.icon-lock:before {
    border: 3px solid #000;
    border-radius: 37%;
    width: 15px;
    left: 2px
}

.icon-lock:after {
    width: 19px;
    left: 0;
    bottom: 0;
    background-color: #000;
    border-radius: 15%
}

.icon-close,.icon-decrement,.icon-home-close,.icon-increment {
    background: none;
    position: relative
}

.icon-close:after,.icon-close:before,.icon-decrement:after,.icon-decrement:before,.icon-home-close:after,.icon-home-close:before,.icon-increment:after,.icon-increment:before {
    position: absolute;
    left: 50%;
    top: 50%;
    content: "";
    width: 17px;
    height: 2px;
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    box-shadow: inset 0 0 0 32px
}

.icon-close:after,.icon-decrement:after,.icon-home-close:after,.icon-increment:after {
    height: 17px;
    width: 2px
}

.icon-decrement,.icon-increment {
    border-radius: 50%;
    border: 2px solid #e4002b;
    width: 34px;
    height: 34px;
    color: #e4002b
}

.icon-decrement:after {
    display: none
}

.icon-my-location-tick {
    background-position: -90px -457px;
    width: 15px;
    height: 15px
}

.icon-tick-green {
    background-position: -10px -462px;
    width: 15px;
    height: 10px;
    vertical-align: text-top
}

.icon-tick-cross {
    background-position: -109px -462px;
    width: 15px;
    height: 10px
}

.icon-map-small {
    background-position: -33px -458px;
    height: 18px
}

.icon-list-view,.icon-map-small {
    width: 20px;
    vertical-align: bottom
}

.icon-list-view {
    background-position: -60px -457px;
    height: 20px
}

.icon-close {
    width: 20px;
    height: 20px
}

.icon-close,.icon-home-close {
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.icon-home-close {
    background: #000;
    border-radius: 50%;
    color: #fff;
    width: 16px;
    height: 16px
}

.icon-home-close:before {
    width: 8px
}

.icon-home-close:after {
    height: 8px
}

.icon-password,.icon-password-slash {
    width: 20px;
    height: 20px;
    background-position: -128px -165px
}

.icon-password {
    background-position: -85px -165px
}

.icon-info,.icon-information,.icon-tick {
    border-radius: 50%;
    text-align: center;
    font-style: normal;
    font-weight: 700;
    color: #fff
}

.icon-info {
    background: none;
    border: 2px solid #fff
}

.icon-info.icon-red {
    background-color: #e52e2d;
    color: #fff;
    margin-right: .3571428571rem
}

.icon-information {
    background: #5d9c68;
    border: 2px solid #5d9c68
}

.icon-save-fav {
    background-color: #e4002b;
    border-radius: 50%;
    background-position: -160px -195px;
    width: 56px;
    height: 56px
}

.icon-black-info {
    border-radius: 50%;
    background: none;
    width: 16px;
    background: #fff;
    height: 16px;
    border: 1px solid #000
}

.icon-black-info:after {
    content: "";
    width: 2px;
    height: 3px;
    left: 8px;
    position: absolute;
    box-shadow: inset 0 0 0 29px,0 2px,0 0,0 6px;
    top: 11px;
    -ms-transform: rotate(179deg);
    transform: rotate(179deg)
}

@media (min-width: 768px) {
    .icon-black-info:after {
        top:13px
    }
}

.icon-facebook {
    background-position: -108px -7px
}

.icon-store-pickup {
    background-position: -225px -445px;
    width: 36px;
    height: 56px
}

.icon-store-delivery {
    background-position: -149px -462px;
    width: 40px;
    height: 30px
}

.footer [class^=icon-] {
    width: 29px
}

.footer .icon-youtube {
    background-position: -9px -7px
}

.footer .icon-instagram {
    background-position: -63px -7px
}

.footer .icon-linkedin {
    background-position: -241px -7px
}

.footer .icon-twitter {
    background: url(https://static.kfc.fr/images/web/X_logo_2023.svg?v=22.0) no-repeat;
    width: 19px;
    margin-top: 6px
}

.footer .icon-app-store,.footer .icon-google-play {
    background-position: -11px -662px;
    width: 120px;
    height: 36px
}

.footer .icon-app-store {
    background-position: -154px -662px
}

.icon-geolocator {
    background-position: -250px -773px;
    width: 30px;
    height: 40px
}

.icon-submit {
    background-position: -249px -111px;
    width: 36px;
    height: 36px
}

.icon-filters {
    background-position: -243px -834px
}

.icon-area,.icon-birthday,.icon-delivery,.icon-drive,.icon-eatin,.icon-filters,.icon-midnight,.icon-mobile,.icon-open,.icon-takeaway,.icon-wifi {
    width: 40px;
    height: 40px
}

.icon-open {
    background-position: -6px -114px
}

.icon-mobile {
    background-position: 2px -717px
}

.icon-delivery {
    background-position: -6px -774px
}

.icon-wifi {
    background-position: -184px -716px
}

.icon-drive {
    background-position: -126px -114px
}

.icon-midnight {
    background-position: -80px -717px
}

.icon-birthday {
    background-position: -2px -830px
}

.icon-area {
    background-position: -115px -830px
}

.icon-takeaway {
    background-position: -166px -279px
}

.icon-eatin {
    background-position: -127px -773px
}

.icon-map {
    background: url(https://static.kfc.fr/images/loyalty/sprite2.png?v=22.0) no-repeat;
    background-position: -228px -204px
}

.icon-list,.icon-map {
    width: 40px;
    height: 40px;
    display: inline-block
}

.icon-list {
    background: url(https://static.kfc.fr/images/loyalty/sprite2.png?v=22.0) no-repeat;
    background-position: -223px -592px
}

.icon-phone {
    width: 25px;
    height: 25px;
    background-position: -115px -972px
}

.icon-star {
    width: 20px;
    height: 20px;
    background-position: -159px -976px
}

.icon-uber-eats {
    width: 60px;
    height: 60px;
    background: url(https://static.kfc.fr/images/find-a-kfc/uber-eats.svg) 50% no-repeat
}

.icon-deliveroo {
    width: 60px;
    height: 60px;
    background: url(https://static.kfc.fr/images/find-a-kfc/deliveroo.svg) 50% no-repeat
}

.icon-just-eats {
    width: 60px;
    height: 60px;
    background: url(https://static.kfc.fr/images/find-a-kfc/just-eats.svg) 50% no-repeat
}

.active-icon-scroll-top {
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s linear .3s,opacity .5s;
    width: 56px;
    height: 56px;
    position: fixed;
    right: 4%;
    top: 76%
}

@media (min-width: 992px) {
    .active-icon-scroll-top {
        right:4%;
        top: 86%
    }
}

.inactive-icon-scroll-top {
    visibility: visible;
    opacity: 1;
    transition: visibility 0s linear 0s,opacity .5s;
    position: fixed;
    right: 4%;
    top: 76%
}

@media (min-width: 992px) {
    .inactive-icon-scroll-top {
        right:4%;
        top: 86%
    }
}

.icon-scroll-top {
    background-position: -222px -976px;
    width: 56px;
    height: 56px
}

.icon-mode {
    width: 60px;
    height: 60px;
    background: url(https://static.kfc.fr/images/web/colonel-club-logo.svg?v=22.0) no-repeat;
    background-size: contain;
    margin-left: -15px
}

.icon-deactive {
    background-position: -106px -1170px;
    width: 37px;
    height: 54px
}

.icon-coupon {
    background: url(https://static.kfc.fr/images/web/coupon.svg) no-repeat 0 1px!important;
    width: 31px;
    height: 35px;
    background-size: cover!important
}

.icon-coupon-active {
    background: url(https://static.kfc.fr/images/web/coupon_active.svg) 0 1px!important;
    width: 31px;
    height: 35px;
    background-size: cover!important
}

.icon-restaurants {
    background: url(https://static.kfc.fr/images/web/rest.svg) no-repeat;
    width: 84px;
    height: 84px;
    background-size: contain
}

@media (min-width: 768px) {
    .icon-restaurants {
        width:84px;
        height: 84px
    }
}

.icon-drive-coupon {
    background: url(https://static.kfc.fr/images/coupon/drive-icon.png) no-repeat;
    width: 80px;
    height: 80px;
    background-size: contain;
    margin-bottom: 15px
}

@media (min-width: 768px) {
    .icon-drive-coupon {
        width:100px;
        height: 100px;
        margin-bottom: 15px
    }
}

.icon-kfc-fry-january {
    background: url(https://static.kfc.fr/images/coupon/kfc-icon-january.png) no-repeat;
    width: 80px;
    height: 80px;
    background-size: contain;
    margin-bottom: 15px
}

@media (min-width: 768px) {
    .icon-kfc-fry-january {
        margin-bottom:15px
    }
}

.icon-persent-coupon {
    background: url(https://static.kfc.fr/images/coupon/persent-icon-january.png) no-repeat;
    width: 80px;
    height: 80px;
    background-size: contain;
    margin-bottom: 15px;
    background-position: 0 15px
}

@media (min-width: 768px) {
    .icon-persent-coupon {
        margin-bottom:15px
    }
}

.icon-qr-fry-january {
    background: url(https://static.kfc.fr/images/coupon/qr-icon-january.png) no-repeat;
    width: 80px;
    height: 80px;
    background-size: contain;
    margin-bottom: 15px
}

@media (min-width: 768px) {
    .icon-qr-fry-january {
        margin-bottom:15px
    }
}

.icon-borne {
    background: url(https://static.kfc.fr/images/web/borne-icon.png) no-repeat;
    height: 112px;
    background-size: inherit;
    background-position: 30% 15px;
    width: 80%
}

@media (min-width: 768px) {
    .icon-borne {
        height:112px;
        background-size: inherit;
        background-position: 50% 15px;
        width: 80px
    }
}

.icon-clickcollect {
    background: url(https://static.kfc.fr/images/web/collect.svg) no-repeat;
    width: 80px;
    height: 80px;
    background-size: contain
}

@media (min-width: 768px) {
    .icon-clickcollect {
        width:100px;
        height: 100px
    }
}

.icon-drive-car {
    background: url(https://static.kfc.fr/images/coupon/drive-icon.svg) no-repeat;
    width: 80%;
    height: 89px;
    background-size: contain;
    background-position: 30% 7px
}

@media (min-width: 768px) {
    .icon-drive-car {
        height:112px;
        background-size: inherit;
        background-position: 50% 15px;
        width: 80px
    }
}

.icon-halal {
    background: url(https://static.kfc.fr/images/mapcluster/Halal.png) no-repeat;
    height: 68px;
    background-size: cover;
    width: 68px;
    background-position: 50%
}

.icon-halal_list {
    height: 50px;
    width: 50px
}

.icon-halal-filter,.icon-halal_list {
    background: url(https://static.kfc.fr/images/mapcluster/Halal.png) no-repeat;
    background-size: cover
}

.icon-halal-filter {
    height: 40px;
    width: 40px;
    margin-top: -2px
}

.halal-items {
    -ms-flex-direction: column;
    flex-direction: column;
    font-style: normal;
    text-align: center;
    font-size: .7142857143rem;
    line-height: .7142857143rem;
    display: -ms-inline-flexbox;
    display: inline-flex;
    position: relative;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.halal-text-list {
    font-family: National2Condensed-Regular!important;
    text-transform: none!important;
    position: absolute;
    bottom: -5px;
    margin-left: -6px
}

.red-hightlighted-text {
    color: #e4002b
}

.item-list {
    margin-bottom: 1.4285714286rem;
    color: #78838c
}

.item-list li {
    padding-left: .7142857143rem
}

.list-disc {
    padding-left: 1.0714285714rem;
    padding-bottom: 1.0714285714rem
}

.list-disc li {
    list-style: disc;
    margin-bottom: .7142857143rem
}

.list-inline li {
    display: inline-block;
    margin-right: .7142857143rem
}

.list-inline.list-link-underline a {
    border-bottom: 1px solid #000
}

.list-inline.list-link-underline a:hover {
    border-bottom-color: rgba(0,0,0,0)
}

.light-font {
    color: #78838c
}

.big-font {
    font-size: 1.5714285714rem
}

.medium-font {
    font-size: 1.1428571429rem
}

.main-banner {
    padding-bottom: .8571428571rem
}

.link-underline,.link-underline-bold {
    border-bottom: 1px solid #000
}

.link-underline-bold {
    font-size: 1.1428571429rem;
    font-weight: 700
}

.link-underline-bold:hover,.link-underline:hover {
    border-bottom-color: rgba(0,0,0,0)
}

.link-underline-red {
    text-decoration: underline;
    color: #e4002b;
    font-weight: 700
}

.link-arrow {
    display: inline-block;
    position: relative;
    padding-right: 2.5rem;
    font-weight: 700
}

.link-arrow a {
    font-family: National2Condensed-Regular
}

.link-arrow:after {
    content: "";
    position: absolute;
    right: 0;
    top: 7px;
    width: 20px;
    height: 6px;
    background: url(https://static.kfc.fr/images/loyalty/sprite2.png?v=22.0) no-repeat -242px -171px
}

.link-arrow:hover:after {
    animation: linearrowanimate 1s ease-in-out 2
}

.red-link {
    color: #e4002b
}

.loader-bg:not(.remove-loader) {
    background: url(https://static.kfc.fr/images/web/loading.gif?v=22.0) no-repeat 50%;
    background-size: 24px
}

.loader-bg img {
    min-height: 50px
}

.item-details-title {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-family: National2-Bold;
    margin-bottom: .7142857143rem
}

.page-wrapper {
    padding: 1.0714285714rem
}

@media (min-width: 992px) {
    .page-wrapper {
        padding:2.8571428571rem 1.0714285714rem
    }
}

.block-btn {
    margin: 0 auto
}

@media (min-width: 768px) {
    .block-btn {
        width:40%
    }
}

@media (min-width: 992px) {
    .page-block {
        display:-ms-flexbox;
        display: flex;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .page-block .block-left {
        -ms-flex: 0 0 66%;
        flex: 0 0 66%
    }

    .page-block .block-right {
        -ms-flex: 0 0 31%;
        flex: 0 0 31%
    }
}

@media (min-width: 1200px) {
    .page-block .block-left {
        -ms-flex:0 0 65%;
        flex: 0 0 65%
    }
}

@media (min-width: 992px) {
    .page-block .block-left .block-btn {
        width:70%
    }
}

.my-account-page {
    background: #fbfbfb
}

@media (min-width: 992px) {
    .my-account-page {
        background:inherit
    }
}

.group-item {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.group-item .image {
    -ms-flex: 0 0 24%;
    flex: 0 0 24%
}

.group-item .details {
    padding-left: 1.0714285714rem;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%
}

@media (max-width: 560px) {
    .group-item .details {
        padding-left:.3571428571rem
    }
}

.price {
    font-family: National2-Bold
}

.truncate {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-block
}

.text-or {
    text-align: center;
    font-family: National2-Bold;
    text-transform: uppercase;
    margin: 1.0714285714rem 0 0
}

.cart-title {
    margin-bottom: .7142857143rem;
    font-weight: 700
}

@media (min-width: 768px) {
    .cart-title {
        font-size:1.2142857143rem
    }
}

.app-block {
    padding: .5714285714rem 1.0714285714rem;
    display: -ms-flexbox;
    display: flex;
    background: #fff;
    box-shadow: 0 0 8px 0 rgba(0,0,0,.2);
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-align: center;
    align-items: center;
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 100
}

.app-block .app-text a {
    color: #0b6ee9
}

.app-block .app-text:before {
    content: "";
    width: 40px;
    height: 40px;
    display: inline-block;
    background: url(https://static.kfc.fr/images/web/kfc-logo.svg?v=22.0) no-repeat;
    background-size: cover;
    margin-right: .7142857143rem;
    vertical-align: middle
}

.grey-block {
    background: #f8f7f5;
    border-radius: 3px;
    margin-bottom: .7142857143rem
}

.added {
    position: relative
}

.added:before {
    right: 10px;
    width: 5px;
    border-bottom: 2px solid #fff;
    height: 10px;
    border-right: 2px solid #fff;
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    z-index: 1;
    top: 7px
}

.added:after,.added:before {
    content: "";
    position: absolute
}

.added:after {
    right: 3px;
    width: 20px;
    height: 20px;
    top: 3px;
    border-radius: 50%;
    background: #36c40f
}

.item-card picture,.menu-item-block picture {
    display: block;
    overflow: hidden
}

.item-card picture img,.menu-item-block picture img {
    transition: all .7s;
    -webkit-transition: all .7s
}

.item-card picture img:hover,.menu-item-block picture img:hover {
    -ms-transform: scale(1.1);
    transform: scale(1.1)
}

.item-added-img,.vertical-combo-img {
    text-align: center;
    margin-bottom: 1.0714285714rem
}

.item-added-img img,.vertical-combo-img img {
    min-height: 140px;
    max-width: 200px
}

@media (min-width: 768px) {
    .item-added-img img,.vertical-combo-img img {
        max-width:250px
    }
}

@media (min-width: 1200px) {
    .item-added-img img,.vertical-combo-img img {
        max-width:100%;
        min-height: 300px
    }
}

@media (min-width: 1200px) {
    .item-added-img img {
        min-height:240px
    }
}

.vertical-combo-wrapper .combo-block .group-item img {
    min-height: 50px
}

@media (min-width: 992px) {
    .vertical-combo-wrapper .combo-block img {
        min-height:120px
    }
}

.item-out-of-stock img {
    filter: grayscale(100%)
}

.item-card img {
    min-height: 100px
}

@media (min-width: 560px) {
    .item-card img {
        min-height:250px
    }
}

@media (min-width: 768px) {
    .item-card img {
        min-height:180px
    }
}

@media (min-width: 992px) {
    .item-card img {
        min-height:218px
    }
}

@media (max-width: 767px) {
    .add-item-modal .item-card img {
        min-height:120px
    }
}

.item-wrapper img {
    min-height: 100px
}

@media (min-width: 560px) {
    .item-wrapper img {
        min-height:250px
    }
}

@media (min-width: 768px) {
    .item-wrapper img {
        min-height:187px
    }
}

@media (min-width: 1200px) {
    .item-wrapper img {
        min-height:223px
    }
}

@media (min-width: 1580px) {
    .item-wrapper img {
        min-height:272px
    }
}

.product-details-modal .product-img img {
    height: 200px;
    display: block;
    margin: 0 auto
}

.recent-order-block img {
    width: 100%;
    min-height: 58px;
    display: block
}

.kfc-upper-section img {
    min-height: 370px
}

@media (min-width: 768px) {
    .kfc-upper-section img {
        min-height:240px
    }
}

@media (min-width: 992px) {
    .kfc-upper-section img {
        min-height:320px
    }
}

@media (min-width: 1200px) {
    .kfc-upper-section img {
        min-height:400px
    }
}

@media (min-width: 1580px) {
    .kfc-upper-section img {
        min-height:600px
    }
}

.kfc-small-img-wrapper img {
    min-height: 150px
}

.category-wrapper ul li a img {
    display: block;
    height: 60px;
    border-radius: 50%;
    margin: 0 auto .4285714286rem
}

@media (max-width: 991px) {
    .nutrition-image img {
        width:230px
    }
}

.page-with-bar {
    position: relative;
    padding-top: 2.5rem
}

.page-with-bar:before {
    content: "";
    position: absolute;
    top: 0;
    left: 32px;
    width: 8px;
    height: 22px;
    box-shadow: inset 0 0 0 32px #e4002b,-16px 0 #e4002b,16px 0 #e4002b
}

.page-with-bar.medium-bar:before {
    left: 52px;
    width: 12px;
    height: 30px;
    box-shadow: inset 0 0 0 32px #e4002b,-22px 0 #e4002b,22px 0 #e4002b
}

.page-with-bar.big-bar:before {
    width: 23px;
    height: 57px;
    box-shadow: inset 0 0 0 32px #e4002b,-44px 0 #e4002b,44px 0 #e4002b
}

.switch:after,.with-arrow:after,.with-left-arrow:before {
    padding: .2142857143rem;
    display: inline-block;
    content: ""
}

.switch:after,.with-arrow:after {
    border: solid #000;
    border-width: 0 2px 2px 0;
    margin-left: .4285714286rem;
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.white-arrow.switch:after,.with-arrow.white-arrow:after {
    border-color: #fff
}

.with-left-arrow:before {
    margin-right: .4285714286rem;
    border: solid #fff;
    border-width: 2px 2px 0 0;
    -ms-transform: rotate(-135deg);
    transform: rotate(-135deg)
}

.change-link {
    font-weight: 700;
    font-size: 1.1428571429rem
}

.change-link.switch:after,.change-link.with-arrow:after {
    padding: .1428571429rem;
    margin-left: 0
}

@media (min-width: 768px) {
    .change-link.switch:after,.change-link.with-arrow:after {
        margin-left:.1428571429rem
    }
}

.switch {
    position: relative;
    padding-right: 1.0714285714rem;
    display: inline-block
}

.switch:after {
    -ms-transform: rotate(43deg);
    transform: rotate(43deg);
    position: absolute;
    right: 0;
    top: 4px
}

.switch.active:after {
    -ms-transform: rotate(224deg);
    transform: rotate(224deg);
    top: 7px
}

.message-block ul li {
    margin-bottom: .4285714286rem;
    word-break: break-word
}

.message-block ul li:last-child {
    margin-bottom: 0
}

.message-block.error a {
    color: #fff
}

.message-block.error a.link-underline {
    border-color: #fff
}

@media (max-width: 767px) {
    .in-store-page .item-card .loader-bg img {
        height:160px
    }
}

.grecaptcha-badge {
    visibility: hidden
}

body.recaptcha .grecaptcha-badge {
    visibility: visible
}

.kfc-static-logo {
    background: url(https://static.kfc.fr/images/static-page/kfc-static-logo.png?v=22.0) no-repeat;
    width: 165px;
    height: 32px;
    margin: 0 auto 1.4285714286rem
}

.seo-content-area {
    margin-top: 1.4285714286rem;
    padding: 1.7857142857rem 1.0714285714rem;
    background-size: cover;
    background: url(https://static.kfc.fr/images/static-page/bg-seo.jpg?v=22.0) no-repeat top
}

.seo-content-area .seo-content {
    overflow: hidden;
    height: 11.4285714286rem
}

.seo-content-area .seo-content.expand {
    height: auto
}

@media (min-width: 992px) {
    .seo-content-area .seo-content {
        height:auto
    }
}

.seo-content-area .expand-link {
    display: none
}

@media (min-width: 992px) {
    .seo-content-area .expand-link {
        display:block
    }
}

.seo-content-area .expand-arrow {
    display: block;
    margin: 0 auto;
    width: 30px;
    height: 30px;
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.seo-content-area .expand-arrow:after {
    content: "";
    border-color: #202124;
    border-style: solid;
    border-width: 0 2px 2px 0;
    width: 0;
    height: 0;
    padding: .0714285714rem .6428571429rem
}

@media (min-width: 992px) {
    .seo-content-area .expand-arrow {
        display:none
    }
}

.contact-restaurent-names {
    position: relative;
    padding: 40px 0 0!important
}

.contact-restaurent-names mat-form-field {
    position: absolute;
    top: 0;
    width: 100%
}

.contact-restaurent-names mat-form-field .mat-form-field-flex {
    padding: 0 .3571428571rem
}

mat-month-view .mat-calendar-body-selected {
    background-color: #e4002b
}

.account-text {
    display: none
}

#onetrust-consent-sdk {
    font-family: National2-Bold
}

.points-area {
    display: inline-block;
    margin: -17px 0 0 10px
}

@media (min-width: 768px) {
    .points-area {
        display:block;
        margin: 0 0 0 20px
    }
}

.points-area .points {
    font-weight: 700;
    font-size: 17px;
    vertical-align: bottom;
    color: #e4002b
}

@media (min-width: 768px) {
    .points-area .points {
        font-size:20px
    }
}

.points-area .pts {
    background: #000;
    border-radius: 50%;
    display: inline-block;
    width: 20px;
    height: 20px;
    font-size: 10px;
    color: #fff;
    text-align: center;
    line-height: 20px;
    vertical-align: super;
    margin-bottom: 5px;
    margin-left: 2px
}

app-common-header,app-header {
    position: sticky;
    top: 0;
    z-index: 99;
    background: #fff;
    display: block
}

header {
    border-bottom: 1px solid #ccc
}

header .container {
    padding-top: .5rem;
    padding-bottom: .5rem;
    display: -ms-flexbox;
    display: flex;
    min-height: 43px;
    -ms-flex-pack: justify;
    justify-content: space-between;
    position: relative
}

header .container .header-left {
    -ms-flex: 0 0 30%;
    flex: 0 0 30%
}

header .container .header-left .points-area {
    display: inline-block!important
}

@media (min-width: 768px) {
    header .container .header-left {
        -ms-flex:0 0 19%;
        flex: 0 0 19%
    }
}

@media (min-width: 768px) {
    header .container .header-left.align_logo {
        -ms-flex:0 0 23%;
        flex: 0 0 23%
    }
}

header .container .header-right {
    text-align: right;
    -ms-flex: 0 0 30%;
    flex: 0 0 30%
}

header .container .header-right a {
    cursor: pointer;
    font-family: National2-Bold
}

@media (min-width: 768px) {
    header .container .header-right {
        -ms-flex:0 0 17%;
        flex: 0 0 17%
    }
}

header .container .header-right ul {
    display: -ms-flexbox;
    display: flex;
    line-height: 19px;
    -ms-flex-align: center;
    align-items: center
}

header .container .header-right ul li {
    margin-left: .3571428571rem
}

@media (min-width: 768px) {
    header .container .header-right ul li {
        margin-left:1.0714285714rem
    }
}

header .container .header-right ul li span {
    display: block;
    width: 1px;
    border-right: 1px solid #000;
    height: 28px
}

@media (min-width: 768px) {
    header .container .header-right ul li span {
        height:34px
    }
}

header .container .header-menu-link {
    -ms-flex-pack: end;
    justify-content: flex-end
}

header .container .header-menu-link,header .container .header-nav {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

header .container .header-nav span {
    font-weight: 700
}

header .container .logo {
    width: 70px;
    background: url(https://static.kfc.fr/images/web/kfc-logo-mobile.svg?v=22.0) no-repeat;
    height: 23px;
    text-indent: -9999px;
    background-size: cover;
    overflow: hidden
}

@media (min-width: 768px) {
    header .container .logo {
        width:90px;
        height: 30px
    }
}

@media (min-width: 768px) {
    header .container {
        padding-top:.8571428571rem;
        padding-bottom: .8571428571rem
    }
}

.hamburger {
    height: 38px;
    width: 30px;
    background: url(https://static.kfc.fr/images/web/app-icons/hamb-menu-icon.svg) no-repeat;
    background-position: -22px -10px
}

.hamburger span {
    display: block;
    margin: .2142857143rem 0;
    background: #000;
    height: 2px
}

.hamburger.ham-desktop-menu {
    height: 45px;
    width: 40px;
    background: url(https://kfcfr-static.cognizantorderserv.com/images/web/app-icons/hamb-menu-icon.svg) no-repeat;
    background-position: -19px -16px;
    background-size: 230%
}

.hamburger.ham-desktop-menu span {
    margin: .4285714286rem 0;
    height: 3px
}

.open .hamburger-desktop-menu,.open .hamburger-menu {
    left: 0!important
}

.open .hamburger-desktop-menu:before {
    display: block!important
}

@media (max-width: 991px) {
    .wrapper:not(.footer-without-link) main {
        min-height:470px
    }
}

body,html {
    height: 100%
}

.wrapper.footer-without-link main {
    min-height: calc(100vh - 153px)
}

.wrapper.footer-without-link footer {
    min-height: 153px
}

@media (min-width: 992px) {
    .wrapper:not(.footer-without-link) main {
        min-height:calc(100vh - 430px)
    }

    .wrapper:not(.footer-without-link) footer {
        min-height: 430px
    }
}

.footer {
    background: #202124;
    position: relative
}

.footer,.footer a {
    color: #ababab
}

.footer a:hover {
    color: #fff
}

.footer:before {
    position: absolute;
    content: "";
    bottom: 0;
    left: calc(50% - 9px);
    width: 12px;
    height: 30px;
    box-shadow: inset 0 0 0 32px #e4002b,-22px 0 #e4002b,22px 0 #e4002b
}

.footer>.container {
    padding-bottom: 6.0714285714rem;
    padding-top: 3.5714285714rem
}

@media (min-width: 992px) {
    .footer>.container {
        padding-bottom:2.8571428571rem
    }
}

.footer p {
    font-size: 1.0714285714rem;
    text-align: center;
    margin-top: 1.4285714286rem;
    margin-bottom: 0
}

.footer .accordian .card .card-header,.footer .accordian .card .card-header a {
    color: #fff
}

@media (max-width: 991px) {
    .footer .accordian .card .card-header:after {
        border-color:#fff;
        opacity: .8
    }
}

.footer .accordian .card .card-body ul {
    font-size: 1.1428571429rem
}

.footer .accordian .card .card-body ul li {
    margin-bottom: .3571428571rem
}

@media (min-width: 992px) {
    .footer .accordian .card .card-body ul li {
        margin-bottom:.5714285714rem;
        line-height: 16px
    }
}

@media (max-width: 767px) {
    .footer .accordian .card .card-body ul {
        font-size:1.0714285714rem
    }
}

@media (max-width: 991px) {
    .footer .accordian .card {
        border-bottom-color:#494949
    }
}

@media (min-width: 992px) {
    .footer .accordian app-accordian-group {
        display:-ms-flexbox;
        display: flex
    }

    .footer .accordian .card {
        border: 0
    }

    .footer .accordian .card .card-header {
        cursor: default;
        font-size: 1.0714285714rem;
        padding-left: 0;
        padding-bottom: .7142857143rem;
        padding-top: 1.0714285714rem
    }

    .footer .accordian .card .card-header:after {
        display: none
    }

    .footer .accordian .card .card-body {
        opacity: 1;
        height: auto
    }

    .footer .accordian .card .card-body .accordian-body {
        padding-left: 0;
        padding-right: .3571428571rem
    }
}

@media (min-width: 992px) {
    .footer .accordian .card {
        -ms-flex:0 0 16%;
        flex: 0 0 16%
    }
}

@media (min-width: 1200px) {
    .footer .accordian .card {
        -ms-flex:0 0 14%;
        flex: 0 0 14%
    }
}

@media (min-width: 1580px) {
    .footer .accordian .card {
        -ms-flex:0 0 16%;
        flex: 0 0 16%;
        margin-right: .3571428571rem
    }
}

.footer h6 {
    color: #fff;
    font-family: National2Condensed-Regular;
    font-size: 1.0714285714rem
}

@media (max-width: 991px) {
    .footer h6 {
        font-weight:400
    }
}

@media (min-width: 1200px) {
    .footer h6 {
        font-size:1.1428571429rem;
        letter-spacing: 1.5px;
        margin-bottom: .7142857143rem
    }
}

.footer .footer-bottom-wrap .footer-text {
    font-size: 1.0714285714rem
}

.footer .footer-bottom-wrap .footer-text a {
    text-decoration: underline
}

.footer .footer-bottom-wrap .footer-text-small {
    font-size: .8571428571rem
}

.footer .footer-bottom-wrap .footer-bottom-block {
    display: -ms-flexbox;
    display: flex
}

.footer .footer-bottom-wrap .footer-bottom-block a {
    display: inline-block;
    margin-right: 1.2857142857rem
}

.footer .footer-bottom-wrap .footer-bottom-block a:last-child {
    margin: 0
}

.footer .footer-bottom-wrap .footer-bottom-block a.footer-icon {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%;
    text-align: center;
    position: relative;
    border: 1px solid #494949;
    width: 55px;
    height: 55px;
    transition: all .4s
}

.footer .footer-bottom-wrap .footer-bottom-block a.footer-icon:hover {
    opacity: .8;
    box-shadow: 0 0 8px #fff
}

.footer .footer-bottom-wrap .footer-bottom-block a.footer-icon:hover i {
    -ms-transform: rotate(1turn);
    transform: rotate(1turn);
    transition: all .4s
}

.footer .footer-bottom-wrap .footer-bottom-block a.footer-icon:after,.footer .footer-bottom-wrap .footer-bottom-block a.footer-icon:before {
    top: 0;
    left: 0;
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%
}

.footer .footer-bottom-wrap .footer-bottom-block a.footer-icon:before {
    border: 1px solid rgba(0,0,0,0)
}

.footer .footer-bottom-wrap .footer-bottom-block a.footer-icon:hover:before {
    border-top-color: #fff;
    border-right-color: #fff;
    border-bottom-color: #fff;
    transition: border-top-color .15s linear,border-right-color .15s linear .1s,border-bottom-color .15s linear .2s
}

.footer .footer-bottom-wrap .footer-bottom-block a.footer-icon:after {
    border: 0 solid rgba(0,0,0,0)
}

.footer .footer-bottom-wrap .footer-bottom-block a.footer-icon:hover:after {
    border-top: 1px solid #fff;
    border-left-width: 1px;
    border-right-width: 1px;
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
    transition: transform .4s linear 0s,border-left-width 0s linear .35s
}

@media (max-width: 991px) {
    .footer .footer-bottom-wrap {
        border-bottom:1px solid #494949;
        padding: 1.7857142857rem 0;
        text-align: center
    }

    .footer .footer-bottom-wrap h6 {
        font-family: National2Condensed-Bold;
        color: #dadada;
        font-size: 1.5714285714rem;
        text-transform: uppercase
    }

    .footer .footer-bottom-wrap div {
        -ms-flex-pack: center;
        justify-content: center
    }
}

@media (min-width: 992px) {
    .footer .footer-bottom-wrap {
        border-left:3px solid #fff;
        padding-left: 1.0714285714rem
    }

    .footer .footer-bottom-wrap:first-child {
        margin-top: 1.0714285714rem
    }
}

@media (min-width: 1200px) {
    .footer .footer-bottom-wrap {
        padding-left:1.7857142857rem;
        padding-bottom: 3.9285714286rem
    }
}

@media (max-width: 991px) {
    .footer .footer-bottom-link ul {
        margin-bottom:2.5rem
    }
}

.footer-without-link footer p {
    margin-top: 0
}

.hamburger-desktop-menu .footer-bottom-wrap {
    text-transform: uppercase;
    border-bottom: 1px solid #494949;
    text-align: center;
    border-left: 0;
    padding: 1.7857142857rem 0
}

.hamburger-desktop-menu .footer-bottom-wrap h6 {
    font-family: National2Condensed-Bold;
    color: #dadada;
    font-size: 1.3571428571rem
}

.hamburger-desktop-menu .footer-bottom-wrap div {
    -ms-flex-pack: center;
    justify-content: center
}

.hamburger-desktop-menu .footer-bottom-wrap:first-child {
    margin-top: 0
}

.accordian .card {
    border-bottom: 1px solid rgba(0,0,0,.1);
    display: block
}

.accordian .card .card-header h6 {
    margin: 0
}

.accordian .card .card-body .accordian-body {
    padding: 0 1.0714285714rem 1.0714285714rem
}

.my-account-page .accordian {
    margin-bottom: 1.7857142857rem
}

.my-account-page .accordian .card {
    margin-bottom: .7142857143rem;
    background: #fff;
    box-shadow: 0 0 8px 0 rgba(0,0,0,.2);
    border-radius: 5px;
    border: 0
}

@media (min-width: 1200px) {
    .my-account-page .accordian .card .card-header {
        padding:1.7857142857rem 5rem 1.7857142857rem 2.5rem
    }

    .my-account-page .accordian .card .card-header:after {
        right: 35px
    }
}

.my-account-page .accordian .card .card-body {
    border-top: 1px solid rgba(0,0,0,.1)
}

.my-account-page .accordian .card .card-body .accordian-body {
    padding: 0
}

.pickup-restaurant-chooser .accordian .card .card-header {
    padding: 1rem 1.7857142857rem 1rem 1.0714285714rem
}

.pickup-restaurant-chooser .accordian .card .card-header:after {
    top: 17px;
    right: 18px
}

.container .product-detail-allergen .card-header {
    padding: .5714285714rem 0;
    display: inline-block
}

.container .product-detail-allergen .card-header:after {
    right: auto;
    margin-left: .8571428571rem
}

.accordian.faq-wrapper .card-body .accordian-body,.accordian.faq-wrapper .card-header {
    padding-left: 0
}

.owl-carousel {
    display: none;
    width: 100%;
    -webkit-tap-highlight-color: transparent;
    z-index: 1
}

.owl-carousel .owl-stage {
    position: relative;
    -ms-touch-action: pan-Y;
    touch-action: manipulation;
    -moz-backface-visibility: hidden
}

.owl-carousel .owl-stage:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0
}

.owl-carousel .owl-stage-outer {
    position: relative;
    overflow: hidden;
    -webkit-transform: translateZ(0)
}

.owl-carousel .owl-item,.owl-carousel .owl-wrapper {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0)
}

.owl-carousel .owl-item {
    position: relative;
    min-height: 1px;
    float: left;
    -webkit-backface-visibility: hidden;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none
}

.owl-carousel .owl-item img {
    display: block;
    width: 100%
}

.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled {
    display: none
}

.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev {
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.owl-carousel .owl-nav button.owl-next,.owl-carousel .owl-nav button.owl-prev,.owl-carousel button.owl-dot {
    background: none;
    color: inherit;
    border: none;
    padding: 0!important;
    font: inherit
}

.owl-carousel.owl-loaded {
    display: block
}

.owl-carousel.owl-loading {
    opacity: 0;
    display: block
}

.owl-carousel.owl-hidden {
    opacity: 0
}

.owl-carousel.owl-refresh .owl-item {
    visibility: hidden
}

.owl-carousel.owl-drag .owl-item {
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.owl-carousel.owl-grab {
    cursor: move;
    cursor: grab
}

.owl-carousel.owl-rtl {
    direction: rtl
}

.owl-carousel.owl-rtl .owl-item {
    float: right
}

.no-js .owl-carousel {
    display: block
}

.owl-carousel .animated {
    animation-duration: 1s;
    animation-fill-mode: both
}

.owl-carousel .owl-animated-in {
    z-index: 0
}

.owl-carousel .owl-animated-out {
    z-index: 1
}

.owl-carousel .fadeOut {
    animation-name: fadeOut
}

@keyframes fadeOut {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.owl-height {
    transition: height .5s ease-in-out
}

.owl-carousel .owl-item .owl-lazy {
    transition: opacity .4s ease
}

.owl-carousel .owl-item .owl-lazy:not([src]),.owl-carousel .owl-item .owl-lazy[src^=""] {
    max-height: 0
}

.owl-carousel .owl-item img.owl-lazy {
    transform-style: preserve-3d
}

.owl-carousel {
    position: relative
}

.owl-carousel .owl-item {
    background: url(https://static.kfc.fr/images/web/loading.gif?v=22.0) no-repeat 50%;
    background-size: 24px
}

.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev {
    position: absolute;
    top: calc(50% - 28px);
    background-color: rgba(0,0,0,.6);
    padding: 1.0714285714rem;
    border-radius: 4px 0 0 4px
}

.owl-carousel .owl-nav .owl-next:after,.owl-carousel .owl-nav .owl-prev:after {
    border: solid #fff;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: .2857142857rem;
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    content: ""
}

.owl-carousel .owl-nav .owl-prev {
    left: 0;
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.owl-carousel .owl-nav .owl-next {
    right: 0
}

.owl-carousel .owl-dots {
    text-align: center;
    position: absolute;
    bottom: 0;
    width: 100%
}

.owl-carousel .owl-dots .owl-dot {
    display: inline-block
}

.owl-carousel .owl-dots .owl-dot span {
    width: 12px;
    height: 12px;
    margin: .3571428571rem;
    background: #fff;
    display: block;
    transition: opacity .2s ease;
    border-radius: 50%
}

.owl-carousel .owl-dots .owl-dot.active span,.owl-carousel .owl-dots .owl-dot:hover span {
    background: #e4002b
}

@media (min-width: 768px) {
    .owl-carousel .owl-dots {
        bottom:10px
    }
}

.main-banner .owl-carousel {
    background: url(https://static.kfc.fr/images/web/loading.gif?v=22.0) no-repeat 50%;
    background-size: 24px
}

.main-banner .owl-carousel .owl-item {
    min-height: 300px;
    background: none
}

@media (min-width: 768px) {
    .main-banner .owl-carousel .owl-item {
        min-height:160px
    }
}

@media (min-width: 992px) {
    .main-banner .owl-carousel .owl-item {
        min-height:315px
    }
}

@media (min-width: 1200px) {
    .main-banner .owl-carousel .owl-item {
        min-height:400px
    }
}

@media (min-width: 1580px) {
    .main-banner .owl-carousel .owl-item {
        min-height:610px
    }
}

[hidden] {
    display: none!important
}

@media (min-width: 1200px) {
    .form-area {
        width:550px
    }
}

@media (min-width: 1200px) {
    .checkout-content .login-section.form-area {
        width:inherit
    }
}

.text-error {
    color: #e4002b;
    padding-top: .3571428571rem;
    font-size: .9285714286rem
}

.form-group {
    position: relative;
    padding-bottom: .3571428571rem
}

.form-group:not(.form-group-without-height) {
    min-height: 78px
}

.form-group input[type=email],.form-group input[type=password],.form-group input[type=tel],.form-group input[type=text],.form-group select,.form-group textarea {
    font-size: 1.2857142857rem
}

.form-group input[type=email]:-moz-read-only,.form-group input[type=password]:-moz-read-only,.form-group input[type=tel]:-moz-read-only,.form-group input[type=text]:-moz-read-only,.form-group select:-moz-read-only,.form-group textarea:-moz-read-only {
    color: #a9a9a9;
    cursor: not-allowed
}

.form-group input[type=email]:disabled,.form-group input[type=email]:read-only,.form-group input[type=password]:disabled,.form-group input[type=password]:read-only,.form-group input[type=tel]:disabled,.form-group input[type=tel]:read-only,.form-group input[type=text]:disabled,.form-group input[type=text]:read-only,.form-group select:disabled,.form-group select:read-only,.form-group textarea:disabled,.form-group textarea:read-only {
    color: #a9a9a9;
    cursor: not-allowed
}

.form-group .select-readonly {
    cursor: not-allowed
}

.form-group .select-readonly .mat-form-field-wrapper {
    pointer-events: none
}

.form-group .select-readonly .mat-select-arrow {
    color: rgba(0,0,0,.38)
}

.form-group .select-readonly .mat-select-value {
    color: #a9a9a9
}

.form-group.with-option .span-option {
    position: absolute;
    right: 0;
    top: 17px;
    color: #78838c
}

.form-group.with-option input {
    padding-right: 2.8571428571rem
}

.form-group.input-with-icon a {
    margin-right: .4285714286rem;
    position: absolute;
    right: 0;
    top: 14px
}

.form-group.input-with-icon input {
    padding-right: 2.1428571429rem
}

.form-group .form-sub-group {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: stretch;
    align-items: stretch
}

.form-group .form-sub-group>div {
    margin-right: 1.0714285714rem
}

.form-group .form-sub-group>div:last-child {
    margin-right: 0
}

.form-group .form-sub-group.input-with-btn>div:first-child {
    -ms-flex-positive: 1;
    flex-grow: 1;
    margin: 0
}

.form-group .form-sub-group.input-with-mobile>div {
    width: 30%
}

.form-group .form-sub-group.input-with-mobile>div:last-child {
    width: 70%
}

.form-group .form-sub-group.multi-field-group {
    -ms-flex-pack: justify;
    justify-content: space-between
}

.form-group .form-sub-group.multi-field-group>div {
    -ms-flex: 0 0 30%;
    flex: 0 0 30%
}

.form-group .form-sub-group.multi-field-group .mat-form-field-infix {
    width: 100%
}

.form-group .mat-form-field-appearance-legacy .mat-form-field-wrapper {
    padding-bottom: 0
}

.form-group .mat-form-field-appearance-legacy .mat-form-field-underline {
    bottom: 0
}

.form-group .mat-form-field {
    display: block;
    font-family: National2Condensed-Regular
}

.form-group .mat-form-field-appearance-legacy .mat-form-field-infix {
    padding: .5714285714rem 0
}

.form-group .mat-form-field-appearance-legacy .mat-form-field-label {
    color: #000
}

.form-group .mat-form-field-appearance-legacy .mat-form-field-label.mat-form-field-empty {
    color: #202124;
    font-size: 1.1428571429rem
}

.form-group .mat-form-field-ripple {
    background-color: #e4002b!important
}

.form-group .mat-checkbox-layout {
    white-space: inherit;
    -ms-flex-align: normal;
    align-items: normal
}

.form-group .mat-checkbox-frame {
    z-index: 1;
    border-color: #000
}

.form-group .mat-checkbox-inner-container {
    height: 20px;
    width: 20px;
    margin: .2142857143rem .8571428571rem 0 0
}

.form-group .mat-checkbox {
    font-family: National2Condensed-Regular
}

.form-group .mat-checkbox-checked.mat-accent .mat-checkbox-background {
    background: #fff;
    margin: .1428571429rem
}

.form-group .mat-checkbox-layout .mat-checkbox-label {
    line-height: 28px;
    margin-right: 2.1428571429rem
}

.form-group .mat-checkbox-checkmark-path {
    stroke: #202124!important
}

.form-group .mat-radio-button {
    margin-right: 1.0714285714rem;
    margin-bottom: 1.0714285714rem
}

.form-group .mat-radio-button.mat-accent.mat-radio-checked:not(.mat-radio-disabled) .mat-radio-outer-circle {
    border-color: #e4002b
}

.form-group .mat-radio-button.mat-accent.mat-radio-checked:not(.mat-radio-disabled) .mat-radio-persistent-ripple,.form-group .mat-radio-button.mat-accent:active .mat-radio-persistent-ripple,.form-group .mat-radio-button.mat-accent:not(.mat-radio-disabled) .mat-radio-inner-circle,.form-group .mat-radio-button.mat-accent:not(.mat-radio-disabled) .mat-radio-ripple .mat-ripple-element:not(.mat-radio-persistent-ripple) {
    background-color: #e4002b
}

.map-block .form-group .mat-form-field-appearance-legacy .mat-form-field-wrapper {
    margin: 0
}

.address-input .mat-form-field-appearance-outline .mat-form-field-outline {
    color: #000
}

.coupon-input .mat-form-field-appearance-outline .mat-form-field-wrapper {
    margin: 0
}

.coupon-input .mat-form-field-appearance-outline .mat-form-field-outline-end {
    border-radius: 0!important
}

.coupon-input .mat-form-field-appearance-outline .mat-form-field-infix {
    padding: 8px 0
}

.coupon-input .mat-form-field-label-wrapper {
    top: -1em
}

.disabled {
    opacity: .5;
    pointer-events: none;
    cursor: not-allowed
}

.pac-container .pac-item {
    padding: .7142857143rem .7142857143rem .7142857143rem 1.8571428571rem;
    position: relative;
    line-height: 18px;
    color: #000;
    cursor: pointer
}

.pac-container .pac-item .pac-icon {
    position: absolute;
    left: 5px;
    top: 6px
}

.pac-container .pac-item .pac-matched {
    color: #e4002b
}

.pac-container .pac-item .pac-item-query {
    display: block;
    font-weight: 700
}

.custom-snackbar button {
    color: red
}

.custom-snackbar.mat-snack-bar-container {
    background: #000
}

.custom-snackbar .mat-simple-snackbar {
    color: #fff
}

.coupon-wrapper .mat-form-field-appearance-outline .mat-form-field-wrapper {
    margin-top: 0
}

.address-input.form-group .mat-form-field-label {
    color: #000
}

@media (max-width: 560px) {
    .vertical-combo-wrapper .combo-burger .form-group .mat-checkbox-layout .mat-checkbox-label {
        margin-right:0;
        margin-top: .1428571429rem;
        line-height: 19px
    }
}

.vertical-combo-wrapper .combo-block .customize-section .mat-checkbox-inner-container,.vertical-combo-wrapper .combo-block .customize-section .mat-radio-container {
    right: 9px
}

.vertical-combo-wrapper .combo-block .customize-section .mat-checkbox-inner-container {
    right: 6px
}

.vertical-combo-wrapper .combo-block .mat-radio-label-content {
    padding-left: 0
}

.vertical-combo-wrapper .combo-block .mat-checkbox-layout {
    display: block
}

.vertical-combo-wrapper .combo-block .mat-checkbox-inner-container,.vertical-combo-wrapper .combo-block .mat-radio-container {
    position: absolute;
    right: 12px;
    top: 1px;
    margin: 0
}

.vertical-combo-wrapper .combo-block .mat-checkbox-inner-container {
    right: 10px
}

.vertical-combo-wrapper .combo-block .mat-checkbox-inner-container,.vertical-combo-wrapper .combo-block .mat-radio-outer-circle {
    width: 24px;
    height: 24px;
    background: #fff;
    border-radius: 50%
}

.vertical-combo-wrapper .combo-block .mat-radio-button.mat-accent:not(.mat-radio-disabled) .mat-radio-inner-circle {
    left: 2px;
    top: 2px;
    background-color: #36c40f
}

.vertical-combo-wrapper .combo-block .mat-checkbox-frame,.vertical-combo-wrapper .combo-block .mat-radio-button.mat-accent.mat-radio-checked:not(.mat-radio-disabled) .mat-radio-outer-circle,.vertical-combo-wrapper .combo-block .mat-radio-outer-circle {
    border-radius: 50%;
    border: 1px solid #b6b5b5
}

.vertical-combo-wrapper .combo-block .mat-checkbox-checked.mat-accent .mat-checkbox-background {
    width: 17px;
    top: 2px;
    left: 2px
}

.vertical-combo-wrapper .combo-block .mat-checkbox-checkmark-path {
    stroke: #36c40f!important;
    stroke-width: 4px!important
}

.cdk-global-overlay-wrapper,.cdk-overlay-container {
    z-index: 99999!important
}

.sub-btn {
    margin: 0 auto!important
}

.sub-btn .btn.btn-block {
    width: 100%;
    padding: 15px!important
}

.sub-btn .btn-black {
    background: #202124!important;
    color: #fff!important
}

.button-spinner:after {
    content: "";
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    margin-top: -.7142857143rem;
    margin-left: -.7142857143rem;
    border-radius: 50%;
    border: 2px solid #fff;
    border-top-color: #000;
    animation: button-spinner .8s linear infinite
}

@keyframes button-spinner {
    to {
        transform: rotate(1turn)
    }
}