@charset "UTF-8";
/* stylelint-disable */
.icon {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-family: "iconfont" !important;
  font-style: normal;
  font-variant: normal;
  font-weight: normal !important;
  vertical-align: middle;
}

.icon-account::before {
  content: "\EA01";
}

.icon-address::before {
  content: "\EA02";
}

.icon-alert-done::before {
  content: "\EA03";
}

.icon-alert-error::before {
  content: "\EA04";
}

.icon-alert-success::before {
  content: "\EA05";
}

.icon-amber-card::before {
  content: "\EA06";
}

.icon-apple::before {
  content: "\EA07";
}

.icon-arrow-down::before {
  content: "\EA08";
}

.icon-arrow-left::before {
  content: "\EA09";
}

.icon-arrow-right::before {
  content: "\EA0A";
}

.icon-arrow-up::before {
  content: "\EA0B";
}

.icon-back::before {
  content: "\EA0C";
}

.icon-calendar::before {
  content: "\EA0D";
}

.icon-cart::before {
  content: "\EA0E";
}

.icon-cash-on-delivery::before {
  content: "\EA0F";
}

.icon-check::before {
  content: "\EA10";
}

.icon-check-circle::before {
  content: "\EA11";
}

.icon-check-circle-white::before {
  content: "\EA12";
}

.icon-chevron-down::before {
  content: "\EA13";
}

.icon-chevron-left::before {
  content: "\EA14";
}

.icon-chevron-right::before {
  content: "\EA15";
}

.icon-chevron-up::before {
  content: "\EA16";
}

.icon-clear::before {
  content: "\EA17";
}

.icon-close::before {
  content: "\EA18";
}

.icon-credit-card::before {
  content: "\EA19";
}

.icon-delivery::before {
  content: "\EA1A";
}

.icon-edit::before {
  content: "\EA1B";
}

.icon-export::before {
  content: "\EA1C";
}

.icon-eye::before {
  content: "\EA1D";
}

.icon-facebook::before {
  content: "\EA1E";
}

.icon-gift::before {
  content: "\EA1F";
}

.icon-giftcard::before {
  content: "\EA20";
}

.icon-giftregistry::before {
  content: "\EA21";
}

.icon-heart::before {
  content: "\EA22";
}

.icon-heart-full::before {
  content: "\EA23";
}

.icon-home-smile::before {
  content: "\EA24";
}

.icon-info::before {
  content: "\EA25";
}

.icon-instagram::before {
  content: "\EA26";
}

.icon-location::before {
  content: "\EA27";
}

.icon-location-1::before {
  content: "\EA28";
}

.icon-lock::before {
  content: "\EA29";
}

.icon-magnify::before {
  content: "\EA2A";
}

.icon-magnify-minus::before {
  content: "\EA2B";
}

.icon-mail::before {
  content: "\EA2C";
}

.icon-map-pin::before {
  content: "\EA2D";
}

.icon-menu::before {
  content: "\EA2E";
}

.icon-minus::before {
  content: "\EA2F";
}

.icon-package::before {
  content: "\EA30";
}

.icon-payment-apple::before {
  content: "\EA31";
}

.icon-payment-paypal::before {
  content: "\EA32";
}

.icon-paypal::before {
  content: "\EA33";
}

.icon-pencil::before {
  content: "\EA34";
}

.icon-phone::before {
  content: "\EA35";
}

.icon-pinterest::before {
  content: "\EA36";
}

.icon-play::before {
  content: "\EA37";
}

.icon-plus::before {
  content: "\EA38";
}

.icon-question::before {
  content: "\EA39";
}

.icon-remove::before {
  content: "\EA3A";
}

.icon-return::before {
  content: "\EA3B";
}

.icon-search::before {
  content: "\EA3C";
}

.icon-search-dismiss::before {
  content: "\EA3D";
}

.icon-service::before {
  content: "\EA3E";
}

.icon-share::before {
  content: "\EA3F";
}

.icon-shopping-bag::before {
  content: "\EA40";
}

.icon-signout::before {
  content: "\EA41";
}

.icon-star::before {
  content: "\EA42";
}

.icon-star-filled::before {
  content: "\EA43";
}

.icon-store::before {
  content: "\EA44";
}

.icon-support::before {
  content: "\EA45";
}

.icon-translate::before {
  content: "\EA46";
}

.icon-trash::before {
  content: "\EA47";
}

.icon-twitter::before {
  content: "\EA48";
}

.icon-user::before {
  content: "\EA49";
}

.icon-whatsapp::before {
  content: "\EA4A";
}

.icon-youtube::before {
  content: "\EA4B";
}

.m-icon--flip {
  -webkit-transform: scaleX(-1);
      -ms-transform: scaleX(-1);
          transform: scaleX(-1);
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
button,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  border: 0;
  font: inherit;
  font-size: 100%;
  margin: 0;
  padding: 0;
  outline: 0;
  vertical-align: baseline;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

html {
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

a {
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

img {
  border: none;
  height: auto;
  max-width: 100%;
  outline: none;
  vertical-align: top;
}

* {
  word-wrap: break-word;
}

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

::-ms-clear {
  display: none;
}

input,
select,
textarea {
  border-radius: 0;
  margin: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  -webkit-box-shadow: none;
          box-shadow: none;
  outline: none;
  resize: none;
}

input[type=button],
input[type=submit],
input[type=reset],
button {
  -webkit-appearance: none;
  background: none;
  cursor: pointer;
  outline: 0;
}
input[type=button]::-moz-focus-inner,
input[type=submit]::-moz-focus-inner,
input[type=reset]::-moz-focus-inner,
button::-moz-focus-inner {
  border: 0;
  padding: 0;
}

input[type=search]::-webkit-search-cancel-button {
  display: none;
}

ul,
li {
  list-style-type: none;
}

b,
strong {
  font-weight: 700;
}

i,
em {
  font-style: italic;
}

@font-face {
  font-family: "Poppins-Regular";
  src: url("../fonts/Poppins/Poppins-Regular.woff2") format("woff2"), url("../fonts/Poppins/Poppins-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Tajawal";
  src: url("../fonts/Tajawal/Tajawal-Regular.woff2") format("woff2"), url("../fonts/Tajawal/Tajawal-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
}
.m-font-base--normal {
  font-family: "Tajawal", sans-serif !important;
  font-weight: 400 !important;
}

/*
    <div class="font-info-container m-font-base--normal" style="border: 1px solid #000; margin: 10px 0; padding: 15px; white-space: nowrap;">
         <div class="font-info">
            <span class="font-info-label">FONT TYPE: </span>
            <span class="font-info-value">base</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">FONT CLASS NAME: </span>
            <span class="font-info-value">m-font-base--normal</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">FONT WEIGHT: </span>
            <span class="font-info-value"> NAME - normal; Value - 400</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">CSS FONT FAMILY: </span>
            <span class="font-info-value">"Poppins-Regular", sans-serif</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">FONT FAMILY NAME: </span>
            <span class="font-info-value">Poppins-Regular, Tajawal-Regular, </span>
         </div>
         <div class="font-info" style="border-top: 1px solid #000; border-bottom: 1px solid #000; margin: 5px 0; padding: 5px 0;">
            Lorem ipsum dolor sit amet
         </div>
         <div class="font-info" style="border-top: 1px solid #000; border-bottom: 1px solid #000; margin: 5px 0; padding: 5px 0;">
             وصيل خلال ساعتين في دبي
         </div>
    </div>
 */
@font-face {
  font-family: "Poppins-Regular";
  src: url("../fonts/Poppins/Poppins-Medium.woff2") format("woff2"), url("../fonts/Poppins/Poppins-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: "Tajawal";
  src: url("../fonts/Tajawal/Tajawal-Medium.woff2") format("woff2"), url("../fonts/Tajawal/Tajawal-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
}
.m-font-base--medium {
  font-family: "Tajawal", sans-serif !important;
  font-weight: 500 !important;
}

/*
    <div class="font-info-container m-font-base--medium" style="border: 1px solid #000; margin: 10px 0; padding: 15px; white-space: nowrap;">
         <div class="font-info">
            <span class="font-info-label">FONT TYPE: </span>
            <span class="font-info-value">base</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">FONT CLASS NAME: </span>
            <span class="font-info-value">m-font-base--medium</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">FONT WEIGHT: </span>
            <span class="font-info-value"> NAME - medium; Value - 500</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">CSS FONT FAMILY: </span>
            <span class="font-info-value">"Poppins-Regular", sans-serif</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">FONT FAMILY NAME: </span>
            <span class="font-info-value">Poppins-Medium, Tajawal-Medium, </span>
         </div>
         <div class="font-info" style="border-top: 1px solid #000; border-bottom: 1px solid #000; margin: 5px 0; padding: 5px 0;">
            Lorem ipsum dolor sit amet
         </div>
         <div class="font-info" style="border-top: 1px solid #000; border-bottom: 1px solid #000; margin: 5px 0; padding: 5px 0;">
             وصيل خلال ساعتين في دبي
         </div>
    </div>
 */
@font-face {
  font-family: "Poppins-Regular";
  src: url("../fonts/Poppins/Poppins-Medium.woff2") format("woff2"), url("../fonts/Poppins/Poppins-Medium.woff") format("woff");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: "Tajawal";
  src: url("../fonts/Tajawal/Tajawal-Bold.woff2") format("woff2"), url("../fonts/Tajawal/Tajawal-Bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
}
.m-font-base--bold {
  font-family: "Tajawal", sans-serif !important;
  font-weight: 700 !important;
}

/*
    <div class="font-info-container m-font-base--bold" style="border: 1px solid #000; margin: 10px 0; padding: 15px; white-space: nowrap;">
         <div class="font-info">
            <span class="font-info-label">FONT TYPE: </span>
            <span class="font-info-value">base</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">FONT CLASS NAME: </span>
            <span class="font-info-value">m-font-base--bold</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">FONT WEIGHT: </span>
            <span class="font-info-value"> NAME - bold; Value - 700</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">CSS FONT FAMILY: </span>
            <span class="font-info-value">"Poppins-Regular", sans-serif</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">FONT FAMILY NAME: </span>
            <span class="font-info-value">Poppins-Medium, Tajawal-Bold, </span>
         </div>
         <div class="font-info" style="border-top: 1px solid #000; border-bottom: 1px solid #000; margin: 5px 0; padding: 5px 0;">
            Lorem ipsum dolor sit amet
         </div>
         <div class="font-info" style="border-top: 1px solid #000; border-bottom: 1px solid #000; margin: 5px 0; padding: 5px 0;">
             وصيل خلال ساعتين في دبي
         </div>
    </div>
 */
@font-face {
  font-family: "iconfont";
  src: url("../fonts/icons/iconfont.woff2") format("woff2"), url("../fonts/icons/iconfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
.m-font-iconfont--normal {
  font-family: "iconfont" !important;
  font-weight: normal !important;
}

/*
    <div class="font-info-container m-font-iconfont--normal" style="border: 1px solid #000; margin: 10px 0; padding: 15px; white-space: nowrap;">
         <div class="font-info">
            <span class="font-info-label">FONT TYPE: </span>
            <span class="font-info-value">iconfont</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">FONT CLASS NAME: </span>
            <span class="font-info-value">m-font-iconfont--normal</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">FONT WEIGHT: </span>
            <span class="font-info-value"> NAME - normal; Value - normal</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">CSS FONT FAMILY: </span>
            <span class="font-info-value">iconfont</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">FONT FAMILY NAME: </span>
            <span class="font-info-value">iconfont,</span>
         </div>
         <div class="font-info" style="border-top: 1px solid #000; border-bottom: 1px solid #000; margin: 5px 0; padding: 5px 0;">
            Lorem ipsum dolor sit amet
         </div>
         <div class="font-info" style="border-top: 1px solid #000; border-bottom: 1px solid #000; margin: 5px 0; padding: 5px 0;">

         </div>
    </div>
 */
@font-face {
  font-family: "VivaBeautifulPro-Regular";
  src: url("../fonts/viva/VivaBeautifulPro-Regular.woff2") format("woff2"), url("../fonts/viva/VivaBeautifulPro-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Tajawal-Regular";
  src: url("../fonts/Tajawal/Tajawal-Regular.woff2") format("woff2"), url("../fonts/Tajawal/Tajawal-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
}
.m-font-secondary--normal {
  font-family: Tajawal-Regular !important;
  font-weight: 400 !important;
}

/*
    <div class="font-info-container m-font-secondary--normal" style="border: 1px solid #000; margin: 10px 0; padding: 15px; white-space: nowrap;">
         <div class="font-info">
            <span class="font-info-label">FONT TYPE: </span>
            <span class="font-info-value">secondary</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">FONT CLASS NAME: </span>
            <span class="font-info-value">m-font-secondary--normal</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">FONT WEIGHT: </span>
            <span class="font-info-value"> NAME - normal; Value - 400</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">CSS FONT FAMILY: </span>
            <span class="font-info-value">VivaBeautifulPro-Regular</span>
         </div>
         <div class="font-info">
            <span class="font-info-label">FONT FAMILY NAME: </span>
            <span class="font-info-value">VivaBeautifulPro-Regular, Tajawal-Regular, </span>
         </div>
         <div class="font-info" style="border-top: 1px solid #000; border-bottom: 1px solid #000; margin: 5px 0; padding: 5px 0;">
            Lorem ipsum dolor sit amet
         </div>
         <div class="font-info" style="border-top: 1px solid #000; border-bottom: 1px solid #000; margin: 5px 0; padding: 5px 0;">

         </div>
    </div>
 */
html {
  font-size: 16px;
  direction: rtl;
}
html.m-disable-scroll,
html.m-disable-scroll body {
  overflow: hidden;
  height: 100%;
}
html.m-disable-scroll .l-page {
  overflow: hidden;
  height: 100%;
  position: fixed;
}
html body.m-page-hold-height .l-page__main {
  min-height: auto;
}

body,
.atlas-playground {
  font-size: 16px;
  line-height: 24px;
  font-family: "Tajawal", sans-serif;
  color: #323232;
}

body {
  overflow-x: hidden;
  overflow-y: scroll;
  position: relative;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
}

a,
button {
  color: #323232;
}
a:hover,
button:hover {
  text-decoration: none;
}
.non-touch a:hover,
.non-touch button:hover {
  text-decoration: none;
}

p {
  margin-bottom: 16px;
}

.l-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  min-height: 100vh;
  width: 100%;
}

.m-page-minheight .l-page__main {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.m-page-hold-height .l-page__main {
  min-height: 300px;
}

.container,
.container-fluid {
  padding-right: 20px;
  padding-left: 20px;
}

.l-pagecontent--type-1 .l-pagecontent__bottom {
  margin-top: 48px;
}
.l-pagecontent--cart .l-pagecontent__inner {
  padding-top: 8px;
  padding-bottom: 32px;
}
.l-pagecontent__inner {
  padding-top: 16px;
  padding-bottom: 32px;
}
.l-pagecontent__confirmation {
  padding-top: 24px;
}

.l-actions {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.l-actions__item {
  padding: 0 10px;
  min-width: 130px;
}
.l-actions__btn {
  width: 100%;
}

.b-maintenance-page__header {
  -webkit-box-shadow: inset 0 -1px 0 #d5d5d5;
          box-shadow: inset 0 -1px 0 #d5d5d5;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: 56px;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 12px 0;
}
.b-maintenance-page__logo {
  display: none;
  height: 100%;
}
.b-maintenance-page__logo--small {
  display: block;
}
.b-maintenance-page__container {
  margin: 0 auto;
  max-width: 1240px;
  width: 100%;
}
.b-maintenance-page__content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
}
.b-maintenance-page__column {
  -webkit-box-flex: 0;
  -webkit-flex: 0 1 50%;
      -ms-flex: 0 1 50%;
          flex: 0 1 50%;
}
.b-maintenance-page__image {
  width: 100%;
}
.b-maintenance-page__social {
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 32px 0 16px;
}
.b-maintenance-page__social-title {
  letter-spacing: 1px;
  margin-bottom: 16px;
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
}
.b-maintenance-page__social-items {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
}
.b-maintenance-page__social-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  font-size: 24px;
  line-height: 24px;
  margin-right: 24px;
}
.b-maintenance-page__footer {
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: 0 0 24px;
  font-size: 14px;
  line-height: 20px;
}
.b-maintenance-page__footer > :last-child {
  width: 140px;
}
.b-maintenance-page__footer > * {
  margin-bottom: 8px;
}
.b-maintenance-page__footer-phone {
  font-size: 14px;
  line-height: 20px;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-weight: 500;
}
.b-maintenance-page__footer-phone :last-child {
  margin-right: 4px;
}
@media (min-width: 768px) {
  .b-maintenance-page__header {
    -webkit-box-shadow: none;
            box-shadow: none;
    height: 84px;
    padding: 21px 0;
  }
  .b-maintenance-page__logo {
    display: block;
  }
  .b-maintenance-page__logo--small {
    display: none;
  }
  .b-maintenance-page__container {
    padding: 0 20px;
  }
  .b-maintenance-page__content {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
  }
  .b-maintenance-page__social {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
    padding: 16px 0;
  }
  .b-maintenance-page__social-title {
    margin-bottom: 0;
  }
  .b-maintenance-page__social-items {
    margin-right: 8px;
  }
  .b-maintenance-page__footer {
    -webkit-box-shadow: inset 0 1px 0 #e6e6e6;
            box-shadow: inset 0 1px 0 #e6e6e6;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
    padding: 28px 0;
  }
}
@media (min-width: 992px) {
  .m-page-hold-height .l-page__main {
    min-height: 600px;
  }
  .container-fluid {
    padding-left: 32px;
    padding-right: 32px;
  }
  .l-pagecontent--cart .l-pagecontent__inner {
    padding-top: 32px;
    padding-bottom: 40px;
  }
  .l-pagecontent__inner {
    padding-bottom: 32px;
    padding-top: 32px;
  }
  .l-pagecontent__inner--new-password, .l-pagecontent__inner--reset-password {
    margin-bottom: 40px;
  }
  .l-pagecontent__confirmation {
    max-width: 788px !important;
  }
  .l-pagecontent__innermini {
    max-width: 640px;
    margin-right: auto;
    margin-left: auto;
  }
}
@media (max-width: 991.98px) {
  .l-page[data-action=Cart-Show] {
    margin-bottom: 175px;
  }
}
@media (max-width: 767.98px) {
  .b-maintenance-page__social-items > :first-child .b-maintenance-page__social-item {
    margin-right: 0;
  }
  .b-maintenance-page__footer-phone {
    -webkit-box-ordinal-group: 0;
    -webkit-order: -1;
        -ms-flex-order: -1;
            order: -1;
  }
}