:root {
  --primary-50: #f4f8ff;
  --primary-100: #e9f1ff;
  --primary-200: #c8dcff;
  --primary-300: #a7c6ff;
  --primary-400: #659cff;
  --primary-500: #2371FF;
  --primary-600: #1a68f8;
  --primary-700: #1a55bf;
  --primary-800: #154499;
  --primary-900: #11377d;

  --text-color-0: #FFFFFF;
  --text-color-100: #a7abb6;
  --text-color-200: #7b8091;
  --text-color-300: #4f566d;
  --text-color-400: #232c48;
  --text-color-500: #1c233a;
  --text-color-600: #151a2b;
  --text-color-700: #0e121d;
  --text-color-800: #030407;

  --secondary-200: #FFFFFF;
  --secondary-300: #FFFFFF;
  --secondary-400: #F8F9FB;
  --secondary-500: #f1f1f1;
  --secondary-600: #EAECF0;
  --secondary-700: #e6e8ed;


  --red-50: #fef2f2;
  --red-100: #fee2e2;
  --red-200: #fecaca;
  --red-300: #fca5a5;
  --red-400: #f87171;
  --red-500: #ef4444;
  --red-600: #dc2626;
  --red-700: #b91c1c;
  --red-800: #991b1b;
  --red-900: #7f1d1d;

  --green-50: #f0fdf4;
  --green-100: #dcfce7;
  --green-200: #bbf7d0;
  --green-300: #86efac;
  --green-400: #4ade80;
  --green-500: #22c55e;
  --green-600: #16a34a;
  --green-700: #15803d;
  --green-800: #166534;
  --green-900: #14532d;

  --purple-50: #faf5ff;
  --purple-100: #f3e8ff;
  --purple-200: #e9d5ff;
  --purple-300: #d8b4fe;
  --purple-400: #c084fc;
  --purple-500: #a855f7;
  --purple-600: #9333ea;
  --purple-700: #7e22ce;
  --purple-800: #6b21a8;
  --purple-900: #581c87;
}

.Dark {
  --text-color-0: #121212;
  --text-color-100: #5b5b5b;
  --text-color-200: #6d6d6d;
  --text-color-300: #a3a3a3;
  --text-color-400: #b5b5b5;
  --text-color-500: #c4c4c4;
  --text-color-600: #d3d3d3;
  --text-color-700: #e9e9e9;
  --text-color-800: #FFFFFF;

  --secondary-200: #1f2a34;
  --secondary-300: #1c2532;
  --secondary-400: #172029;
  --secondary-500: #131e28;
  --secondary-600: #141c24;
  --secondary-700: #131c23;
}

@font-face {
    font-family: Inter;
    src: url('https://cdn.selly.io/s/common/t/fonts/Inter.woff2') format("woff2"), url('https://cdn.selly.io/s/common/t/fonts/Inter.ttf') format("ttf");
}

body, button, input, select, textarea {
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}

body {
    background: var(--secondary-400);
}

* {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline
}

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

html {
    box-sizing: border-box;
    -ms-overflow-style: scrollbar;
}

body, html {
    color: var(--text-color-400);
}

*,::after,::before {
    box-sizing: inherit;
}

.image, .row {
    display: flex
}

body {
    line-height: 1
}

ol, ul {
    list-style: none
}

blockquote, q {
    quotes: none
}

blockquote:after, blockquote:before, q:after, q:before {
    content: '';
    content: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

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


.container {
  max-width: 750px;
  margin-left: auto;
  margin-right: auto;
  height: 100vh;
  display: flex;
  justify-content: center;
  flex-direction: column;
  padding: 20px;
}

.wrapper {
  padding-bottom: 50px;
  text-align: center;
}

.icon-container {
  text-align: center;
}

.title {
  font-size: 34px;
  font-weight: bold;
  padding-top: 40px;
  position: relative;
}

.sub-title {
  color: var(--text-color-300);
  padding-top: 14px;
  padding-bottom: 20px;
}

.button-container {
  margin-top: 10px;
}

.button {
	 box-sizing: border-box;
	 outline: none;
	 box-shadow: 0 1px 2px rgba(20, 22, 26, 0.06);
	 border-radius: 8px;
	 font-weight: 500;
	 font-size: 15px;
	 line-height: 15px;
	 text-align: center;
	 padding: 12px 20px;
	 transition: background-color 0.3s;
	 position: relative;
	 vertical-align: middle;
	 cursor: pointer;
	 display: inline-flex;
	 flex-direction: row;
	 align-items: center;
	 text-decoration: none;
	 background: var(--secondary-300);
	 color: var(--text-color-300);
	 border: 1px solid var(--secondary-600);
}
 .button:hover, .button:focus {
	 background: #fafafa;
	 color: var(--text-color-400);
}
 