@font-face {
  font-family: "roboto-bold";
  src: url(/public/fonts/Roboto/Roboto-medium.ttf) format("opentype"); }

@font-face {
  font-family: "roboto";
  src: url(/public/fonts/Roboto/Roboto-Regular.ttf) format("opentype"); }

@font-face {
  font-family: "roboto-bold";
  src: url(/public/fonts/Roboto/Roboto-medium.ttf) format("opentype"); }

@font-face {
  font-family: "roboto";
  src: url(/public/fonts/Roboto/Roboto-Regular.ttf) format("opentype"); }

.app {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  overflow: hidden; }
  .app_is-arabic {
    direction: rtl; }
    .app_is-arabic .input,
    .app_is-arabic .form-item select {
      font-family: "Cairo", sans-serif; }
    .app_is-arabic .alert-modal__message {
      font-family: "Cairo", sans-serif; }
    .app_is-arabic .breadcrumbs__item:after {
      transform: rotateY(180deg); }
    .app_is-arabic .custom-checkbox__check-mark {
      right: 0;
      left: auto; }
    .app_is-arabic .custom-checkbox {
      padding-left: 0;
      padding-right: 35px; }
    .app_is-arabic .custom-radio__check-mark {
      right: 0;
      left: auto; }
    .app_is-arabic .custom-radio {
      padding-left: auto;
      padding-right: 35px; }
    .app_is-arabic select {
      background-position: left 0.7em top 50%, 0 0 !important; }
    .app_is-arabic .counter-item {
      flex-direction: row-reverse; }
    .app_is-arabic html,
    .app_is-arabic body,
    .app_is-arabic a,
    .app_is-arabic abbr,
    .app_is-arabic acronym,
    .app_is-arabic address,
    .app_is-arabic applet,
    .app_is-arabic article,
    .app_is-arabic aside,
    .app_is-arabic audio,
    .app_is-arabic b,
    .app_is-arabic big,
    .app_is-arabic blockquote,
    .app_is-arabic body,
    .app_is-arabic button,
    .app_is-arabic canvas,
    .app_is-arabic caption,
    .app_is-arabic center,
    .app_is-arabic cite,
    .app_is-arabic code,
    .app_is-arabic dd,
    .app_is-arabic del,
    .app_is-arabic details,
    .app_is-arabic dfn,
    .app_is-arabic div,
    .app_is-arabic dl,
    .app_is-arabic dt,
    .app_is-arabic em,
    .app_is-arabic embed,
    .app_is-arabic fieldset,
    .app_is-arabic figcaption,
    .app_is-arabic figure,
    .app_is-arabic footer,
    .app_is-arabic form,
    .app_is-arabic h1,
    .app_is-arabic h2,
    .app_is-arabic h3,
    .app_is-arabic h4,
    .app_is-arabic h5,
    .app_is-arabic h6,
    .app_is-arabic header,
    .app_is-arabic hgroup,
    .app_is-arabic html,
    .app_is-arabic i,
    .app_is-arabic iframe,
    .app_is-arabic img,
    .app_is-arabic ins,
    .app_is-arabic kbd,
    .app_is-arabic label,
    .app_is-arabic legend,
    .app_is-arabic li,
    .app_is-arabic mark,
    .app_is-arabic menu,
    .app_is-arabic nav,
    .app_is-arabic object,
    .app_is-arabic ol,
    .app_is-arabic output,
    .app_is-arabic p,
    .app_is-arabic pre,
    .app_is-arabic q,
    .app_is-arabic ruby,
    .app_is-arabic s,
    .app_is-arabic samp,
    .app_is-arabic section,
    .app_is-arabic small,
    .app_is-arabic span,
    .app_is-arabic strike,
    .app_is-arabic strong,
    .app_is-arabic sub,
    .app_is-arabic summary,
    .app_is-arabic sup,
    .app_is-arabic table,
    .app_is-arabic tbody,
    .app_is-arabic td,
    .app_is-arabic tfoot,
    .app_is-arabic th,
    .app_is-arabic thead,
    .app_is-arabic time,
    .app_is-arabic tr,
    .app_is-arabic tt,
    .app_is-arabic u,
    .app_is-arabic ul,
    .app_is-arabic var,
    .app_is-arabic video {
      font-family: "Cairo", sans-serif; }
    .app_is-arabic label.error {
      top: auto; }
  @media only screen and (max-device-width: 1024px) {
    .app_is-fixed {
      overflow: hidden;
      position: fixed;
      width: 100%;
      height: 100%; }
      .app_is-fixed .app__overlay {
        background: rgba(0, 0, 0, 0.8);
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        z-index: 9; } }

.app__container {
  flex: 1;
  display: flex;
  flex-direction: column;
  position: relative; }
  @media all and (-ms-high-contrast: none) {
    .app__container *::-ms-backdrop, .app__container {
      flex: none;
      min-height: calc(100vh - 200px); } }

.app__how-it-works {
  margin-bottom: 50px;
  z-index: 9; }
  .app__how-it-works_is-catalogue {
    margin-bottom: 0; }
  @media only screen and (max-width: 600px) {
    .app__how-it-works {
      margin-bottom: 0; } }

.app__body {
  overflow-x: hidden; }
  .app__body_is-fixed {
    overflow: hidden;
    position: fixed;
    width: 100%; }