/home/bdqbpbxa/demo-subdomains/billine.goodface.com.ua/css/general.css
/* Root */

:root {
  --window-inner-height: 100vh;
  --scrollbar-width: 17px;

  --shades-50: #f7f9fa;
  --shades-150: #e8ebed;
  --shades-200: #dcdee0;
  --shades-250: #bec1c4;
  --shades-300: #999c9e;
  --shades-400: #717375;
  --shades-600: #1f2021;

  --danger-500: #e04f5b;
  --success-500: #7ac668;

  --primary-blue-50: #e1f0ff;
  --primary-blue-100: #c3e1fe;
  --primary-blue-400: #1989fa;
  --primary-blue-500: #0268ce;

  --white: #ffffff;

  --default-border-radius: 24px;
  --default-gradient: linear-gradient(45deg, #0268ce 0%, #9681ff 100%);
}

/* Reset */

html,
body,
body * {
  box-sizing: border-box;
}

body {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
}

body * {
  margin: 0;
  padding: 0;
  outline: 0;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-overflow-scrolling: touch;
  -webkit-tap-highlight-color: transparent;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

li {
  list-style-type: none;
}

a {
  text-decoration: none;
}

img {
  border: none;
  user-select: none;
  -webkit-user-select: none;
  -webkit-user-drag: none;
}

input,
textarea {
  border-radius: 0;
}

input[type="number"] {
  -moz-appearance: textfield;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input::-ms-reveal,
input::-ms-clear {
  display: none;
}

textarea {
  resize: none;
}

/* Scroll lock */

html.-scroll-lock,
html.-scroll-lock body {
  height: calc(var(--window-inner-height) - 1px);
  overflow: hidden;
}

html.-scroll-lock body {
  position: relative;
}

body.-scroll-lock {
  padding-right: var(--scrollbar-width);
}

body.-scroll-lock .header {
  right: var(--scrollbar-width);
}

/* Global (Global css and params) */

.--pc-display {
  display: block;
}

.--tablet-display,
.--mobile-display {
  display: none;
}

body {
  display: grid;
  grid-template-rows: 1fr auto;
  min-height: 100vh;
  background-color: var(--shades-50);
}

.container {
  max-width: 1600px;
  margin: 0 30px;
}

main {
  margin-top: 172px;
}

@media screen and (min-width: 1660px) {
  .container {
    margin: 0 auto;
  }
}

@media screen and (max-width: 1200px) {
  main {
    margin-top: 120px;
  }
}

@media screen and (max-width: 1024px) {
  /* Global (Global css and params) */
  br {
    display: none;
  }

  .--pc-display {
    display: none;
  }

  .--tablet-display {
    display: block;
  }

  :root {
    --default-border-radius: 14px;
  }
}

@media screen and (max-width: 759px) {
  /* Global (Global css and params) */

  .--tablet-display {
    display: none;
  }

  .--mobile-display {
    display: block;
  }

  .container {
    margin: 0 12px;
  }
}