@charset "UTF-8";

.root {
  --big-blue-40: #56A1EB;
  --big-blue-50: #2887E6;
  --big-blue-60: #066CD2;
  --big-blue-gray-5: #F5F7F8;
  --big-blue-gray-30: #CBD3DB;
  --big-chart-blue: #3d6ad6;
  --big-gray-10: #F3F4F4;
  --big-gray-20: rgb(233, 234, 235);
  --big-gray-30: #DADCDE;
  --big-gray-40: #C6C9CC;
  --big-gray-50: #ADB0B3;
  --big-gray-60: #929598;
  --big-red-70: #A00024;
  --fds-active-icon: #3578E5;
  --fds-black-alpha-05: rgba(0, 0, 0, 0.05);
  --fds-black-alpha-10: rgba(0, 0, 0, 0.1);
  --fds-black-alpha-15: rgba(0, 0, 0, 0.15);
  --fds-black-alpha-20: rgba(0, 0, 0, 0.2);
  --fds-black-alpha-30: rgba(0, 0, 0, 0.3);
  --fds-black-alpha-40: rgba(0, 0, 0, 0.4);
  --fds-black-alpha-50: rgba(0, 0, 0, 0.5);
  --fds-black-alpha-60: rgba(0, 0, 0, 0.6);
  --fds-black-alpha-80: rgba(0, 0, 0, 0.8);
  --fds-black: #000000;
  --fds-blue-05: #ECF3FF;
  --fds-blue-30: #AAC9FF;
  --fds-blue-40: #77A7FF;
  --fds-blue-60: #3578E5;
  --fds-blue-70: #2851A3;
  --fds-blue-80: #1D3C78;
  --fds-blue-95: #E7F3FF;
  --fds-blue-badge: #3578E5;
  --fds-blue-link: #385898;
  --fds-button-icon: #444950;
  --fds-button-text: #444950;
  --fds-comment-background: #F2F3F5;
  --fds-dark-mode-gray-100: #1C1C1C;
  --fds-dark-mode-gray-35: #CCCCCC;
  --fds-dark-mode-gray-50: #828282;
  --fds-dark-mode-gray-80: #373737;
  --fds-dark-mode-gray-90: #282828;
  --fds-dark-ui-card-border: #282828;
  --fds-dark-ui-divider: #282828;
  --fds-dark-ui-medium-text: #828282;
  --fds-dark-ui-primary-text: #CCCCCC;
  --fds-dark-ui-secondary-text: #4A4A4A;
  --fds-dark-ui-wash: #000000;
  --fds-data-eggplant: #5C3BBF;
  --fds-data-grass: #63BE09;
  --fds-data-mango: #FFBA00;
  --fds-data-periwinkle: #80AAFF;
  --fds-data-periwinkle-dark: #4D7DDD;
  --fds-data-periwinkle-light: #B3CCFF;
  --fds-data-pine: #308360;
  --fds-data-plum: #9E43DF;
  --fds-data-redwood: #D45C43;
  --fds-data-rose-light: #D693C0;
  --fds-data-sea-dark: #06A0A0;
  --fds-data-sea: #32CDCD;
  --fds-data-sky: #8CD9FF;
  --fds-data-walnut: #7A563C;
  --fds-disabled-text: #BEC3C9;
  --fds-divider-on-wash: #CCD0D5;
  --fds-divider-on-white: #DADDE1;
  --fds-fast: 200ms;
  --fds-fb-blue-70: #4267B2;
  --fds-fb-blue-75: #385898;
  --fds-gray-00: #F5F6F7;
  --fds-gray-05: #F2F3F5;
  --fds-gray-10: #EBEDF0;
  --fds-gray-100: #1C1E21;
  --fds-gray-20: #DADDE1;
  --fds-gray-25: #CCD0D5;
  --fds-gray-30: #BEC3C9;
  --fds-gray-45: #8D949E;
  --fds-gray-70: #606770;
  --fds-gray-80: #444950;
  --fds-green-30: #86DF81;
  --fds-green-55: #00A400;
  --fds-green-60: #008C00;
  --fds-green-70: #006900;
  --fds-highlight-cell-background: #ECF3FF;
  --fds-highlight: #3578E5;
  --fds-nav-bar-background: #4267B2;
  --fds-negative: #FA383E;
  --fds-notification-badge: #FA383E;
  --fds-placeholder-text: #65676B;
  --fds-positive: #00A400;
  --fds-primary-text: #1C1E21;
  --fds-purple-40: #763EE6;
  --fds-red-55: #FA383E;
  --fds-red-90: #FFD9E7;
  --fds-red-95: #FFE6EF;
  --fds-secondary-button-pressed: rgba(0, 0, 0, 0.05);
  --fds-secondary-text: #606770;
  --fds-sidebar-nav-gutter-dense: 4px;
  --fds-sidebar-nav-gutter: 12px;
  --fds-sidebar-nav-width-collapsed: 72px;
  --fds-sidebar-nav-width-dense-collapsed: 52px;
  --fds-sidebar-nav-width-dense-expanded: 240px;
  --fds-sidebar-nav-width-expanded: 300px;
  --fds-soft: cubic-bezier(0.08, 0.52, 0.52, 1);
  --fds-spectrum-aluminum-dark-2: #6CA0B6;
  --fds-spectrum-aluminum-tint-50: #D1E7F0;
  --fds-spectrum-aluminum-tint-70: #E4F0F6;
  --fds-spectrum-aluminum-tint-90: #F6FAFC;
  --fds-spectrum-blue-gray-dark-1: #4F5766;
  --fds-spectrum-blue-gray-dark-2: #303846;
  --fds-spectrum-blue-gray-dark-3: #23272F;
  --fds-spectrum-blue-gray-tint-15: #777D88;
  --fds-spectrum-blue-gray-tint-30: #8F949D;
  --fds-spectrum-blue-gray-tint-50: #AFB3B9;
  --fds-spectrum-blue-gray-tint-90: #EFF0F1;
  --fds-spectrum-blue-gray: #5F6673;
  --fds-spectrum-cherry-dark-1: #E04C60;
  --fds-spectrum-cherry-tint-50: #F8A9B4;
  --fds-spectrum-cherry-tint-70: #FBCCD2;
  --fds-spectrum-cherry-tint-90: #FEEEF0;
  --fds-spectrum-cherry: #F35369;
  --fds-spectrum-grape-dark-1: #7B64C0;
  --fds-spectrum-grape-tint-15: #9D87D2;
  --fds-spectrum-grape-tint-30: #AF9CDA;
  --fds-spectrum-grape-tint-70: #DDD5F0;
  --fds-spectrum-grape: #8C72CB;
  --fds-spectrum-lemon-dark-1: #F5C33B;
  --fds-spectrum-lemon-tint-30: #FFE8A8;
  --fds-spectrum-lemon-tint-70: #FEF2D1;
  --fds-spectrum-lemon-tint-90: #FFFBF0;
  --fds-spectrum-lime-dark-1: #89BE4C;
  --fds-spectrum-lime-dark-2: #71A830;
  --fds-spectrum-lime-tint-50: #D1E6B9;
  --fds-spectrum-lime-tint-70: #E4F0D5;
  --fds-spectrum-lime: #A3CE71;
  --fds-spectrum-orange-dark-1: #E07A2E;
  --fds-spectrum-orange-tint-15: #F9A159;
  --fds-spectrum-orange-tint-50: #FBC89F;
  --fds-spectrum-orange: #F7923B;
  --fds-spectrum-pink-dark-1: #EC6FB5;
  --fds-spectrum-pink-dark-2: #D4539B;
  --fds-spectrum-pink: #EC7EBD;
  --fds-spectrum-seafoam-dark-1: #39AFD5;
  --fds-spectrum-seafoam-tint-70: #CAEEF9;
  --fds-spectrum-seafoam-tint-90: #EEFAFD;
  --fds-spectrum-seafoam: #54C7EC;
  --fds-spectrum-skin-3-tint-30: #E5C29E;
  --fds-spectrum-slate: #B9CAD2;
  --fds-spectrum-slate-dark-2: #89A1AC;
  --fds-spectrum-slate-tint-30: #CEDAE0;
  --fds-spectrum-slate-tint-50: #DCE5E9;
  --fds-spectrum-slate-tint-90: #F8FAFB;
  --fds-spectrum-teal-dark-1: #4DBBA6;
  --fds-spectrum-teal-dark-2: #31A38D;
  --fds-spectrum-teal-tint-30: #97DCCF;
  --fds-spectrum-teal-tint-50: #B4E6DD;
  --fds-spectrum-teal-tint-70: #D2F0EA;
  --fds-spectrum-teal-tint-90: #F0FAF8;
  --fds-spectrum-teal: #6BCEBB;
  --fds-spectrum-tomato-dark-1: #EF6632;
  --fds-spectrum-tomato-dark-2: #DB4123;
  --fds-spectrum-tomato-tint-30: #F38E7B;
  --fds-spectrum-tomato: #FB724B;
  --fds-strong: cubic-bezier(0.12, 0.8, 0.32, 1);
  --fds-tertiary-icon: #8D949E;
  --fds-unified-black-alpha-15: rgba(0, 0, 0, 0.15);
  --fds-unified-gray-00: #050505;
  --fds-unified-gray-05: #0E0F0F;
  --fds-unified-gray-10: #18191A;
  --fds-unified-gray-15: #242526;
  --fds-unified-gray-20: #323436;
  --fds-unified-gray-25: #3E4042;
  --fds-unified-gray-30: #4B4C4F;
  --fds-unified-gray-35: #56585C;
  --fds-unified-gray-40: #65676B;
  --fds-unified-gray-45: #6E7175;
  --fds-unified-gray-50: #7A7D82;
  --fds-unified-gray-55: #8A8D91;
  --fds-unified-gray-60: #96999E;
  --fds-unified-gray-65: #A4A7AB;
  --fds-unified-gray-70: #B0B3B8;
  --fds-unified-gray-75: #BCC0C4;
  --fds-unified-gray-80: #C9CCD1;
  --fds-unified-gray-90: #E4E6EB;
  --fds-unified-gray-95: #F0F2F5;
  --fds-unified-gray-100: #F7F8FA;
  --fds-unified-blue-00: #000B1B;
  --fds-unified-blue-05: #011330;
  --fds-unified-blue-10: #00193D;
  --fds-unified-blue-15: #05214D;
  --fds-unified-blue-20: #07316D;
  --fds-unified-blue-25: #083E89;
  --fds-unified-blue-30: #0E499C;
  --fds-unified-blue-35: #1455B0;
  --fds-unified-blue-40: #1763CF;
  --fds-unified-blue-45: #216FDB;
  --fds-unified-blue-50: #1877F2;
  --fds-unified-blue-55: #2D88FF;
  --fds-unified-blue-60: #4599FF;
  --fds-unified-blue-65: #5FAAFF;
  --fds-unified-blue-70: #76B6FF;
  --fds-unified-blue-75: #91C3FF;
  --fds-unified-blue-80: #A8D1FF;
  --fds-unified-blue-85: #BADAFF;
  --fds-unified-blue-90: #CDE5FF;
  --fds-unified-blue-95: #E7F3FF;
  --fds-unified-blue-100: #F4FAFF;
  --fds-white-alpha-05: rgba(255, 255, 255, 0.05);
  --fds-white-alpha-10: rgba(255, 255, 255, 0.1);
  --fds-white-alpha-30: rgba(255, 255, 255, 0.3);
  --fds-white-alpha-40: rgba(255, 255, 255, 0.4);
  --fds-white-alpha-50: rgba(255, 255, 255, 0.5);
  --fds-white-alpha-60: rgba(255, 255, 255, 0.6);
  --fds-white-alpha-80: rgba(255, 255, 255, 0.8);
  --fds-white-text: #FFFFFF;
  --fds-white: #FFFFFF;
  --fds-www-wash: #EBEDF0;
  --fds-x-border-default: 1px solid #DADDE1;
  --fds-x-border-error: 1px solid #FA383E;
  --fds-x-border-focus: 1px solid #3578E5;
  --fds-x-border-radius: 4px;
  --fds-x-border-valid: 1px solid #00A400;
  --fds-x-border-warning: 1px solid #FFBA00;
  --fds-x-box-shadow-error: inset 0 0 0 3px rgba(250, 56, 62, 0.3);
  --fds-x-box-shadow-focus: inset 0 0 0 3px rgba(53, 120, 229, 0.2);
  --fds-x-box-shadow-valid: inset 0 0 0 3px rgba(0, 164, 0, 0.1);
  --fds-x-box-shadow-warning: inset 0 0 0 3px rgba(255, 186, 0, 0.3);
  --fds-x-large: 36px;
  --fds-x-transition-speed: 0.25s;
  --fds-x-transition-timing-function: cubic-bezier(0.5, 0, 0.1, 1.15);
  --fds-yellow-20: #FFBA00;
  --fds-unified-yellow-95: #FFF9D1;
  --fig-red: #fa3e3e;
  --fds-cyan-95: #E0F7FF;
  --fds-green-95: #DDFBE5;
  --accent: rgb(27, 116, 228);
  --accent-deemphasized: rgb(231, 243, 255);
  --always-transparent: rgba(0, 0, 0, 0);
  --always-white: rgb(255, 255, 255);
  --attachment-footer-background: rgb(240, 242, 245);
  --background-deemphasized: rgb(240, 242, 245);
  --black-solidarity-primary-button-background: rgb(5, 5, 5);
  --black-solidarity-primary-button-text: rgb(255, 255, 255);
  --blue-link: rgb(23, 99, 207);
  --border-persistent-ui: rgba(0, 0, 0, 0.05);
  --border-responsive-ui: rgba(0, 0, 0, 0.1);
  --border-ui-emphasis: rgb(228, 230, 235);
  --bottom-sheet-background-deemphasized: rgb(240, 242, 245);
  --bottom-sheet-handle: rgb(201, 204, 209);
  --card-background: rgb(255, 255, 255);
  --card-background-flat: rgb(247, 248, 250);
  --card-border: rgba(0, 0, 0, 0);
  --card-shadow-light: rgba(0, 0, 0, 0.05);
  --card-shadow-medium: rgba(0, 0, 0, 0.05);
  --card-shadow-strong: rgba(0, 0, 0, 0.1);
  --client-bottom-sheet-pressed: rgb(228, 230, 235);
  --comment-background: rgb(240, 242, 245);
  --comment-threading-lines: rgb(228, 230, 235);
  --content-liquidity-ig: rgb(0, 153, 230);
  --decorative-chat-blue: rgb(5, 33, 77);
  --decorative-icon-blue: rgb(27, 116, 228);
  --decorative-icon-green: rgb(69, 189, 98);
  --decorative-icon-pink: rgb(255, 102, 191);
  --decorative-icon-purple: rgb(147, 96, 247);
  --decorative-icon-red: rgb(243, 66, 95);
  --decorative-icon-reels: rgb(252, 87, 118);
  --decorative-icon-teal: rgb(42, 187, 167);
  --decorative-icon-whatsapp: rgb(37, 211, 102);
  --decorative-icon-yellow: rgb(247, 185, 40);
  --disabled-button-background: rgb(228, 230, 235);
  --disabled-button-background-growth: rgb(118, 182, 255);
  --disabled-icon: rgb(188, 192, 196);
  --disabled-text: rgb(188, 192, 196);
  --divider: rgb(201, 204, 209);
  --event-date: rgb(240, 40, 73);
  --fb-wordmark: rgb(24, 119, 242);
  --fblite-rtc-answer-background: rgb(69, 189, 98);
  --fblite-rtc-dismiss-background: rgba(255, 255, 255, 0.3);
  --fblite-strong-secondary: rgb(62, 64, 66);
  --fblite-wash: rgb(188, 192, 196);
  --glimmer-base-opaque: rgb(164, 167, 171);
  --glimmer-index-0: rgba(110, 113, 117, 0.17);
  --glimmer-index-1: rgba(110, 113, 117, 0.14);
  --glimmer-index-2: rgba(110, 113, 117, 0.1);
  --glimmer-index-3: rgba(110, 113, 117, 0.07);
  --glimmer-index-4: rgba(110, 113, 117, 0.04);
  --hidden-comment-overlay: rgba(255, 255, 255, 0.6);
  --high-contrast-button-pressed: rgba(201, 204, 209, 0.15);
  --hosted-view-selected-state: rgb(231, 243, 255);
  --instant-feedback-border: rgba(0, 0, 0, 0);
  --instant-feedback-shadow: rgba(0, 0, 0, 0.05);
  --last-active-state-background: rgb(239, 255, 243);
  --last-active-state-text: rgb(29, 99, 46);
  --media-inner-border: rgba(0, 0, 0, 0.1);
  --media-pressed: rgba(75, 76, 79, 0.35);
  --nav-bar-background: rgb(255, 255, 255);
  --negative: rgb(240, 40, 73);
  --negative-deemphasized: rgb(255, 230, 239);
  --new-notification-background: rgb(231, 243, 255);
  --non-media-pressed: rgba(75, 76, 79, 0.15);
  --non-media-pressed-on-dark: rgba(255, 255, 255, 0.3);
  --notification-badge: rgb(228, 30, 63);
  --optimistic-post-tint: rgba(255, 255, 255, 0.6);
  --overlay-on-media: rgba(0, 0, 0, 0.8);
  --overlay-on-surface: rgba(0, 0, 0, 0.4);
  --persistent-cta-shadow: rgba(0, 0, 0, 0.1);
  --placeholder-icon: rgb(101, 103, 107);
  --placeholder-image: rgb(164, 167, 171);
  --placeholder-text: rgb(101, 103, 107);
  --placeholder-text-on-media: rgba(255, 255, 255, 0.5);
  --popover-background: rgb(255, 255, 255);
  --positive: rgb(49, 162, 76);
  --primary-button-background: rgb(27, 116, 228);
  --primary-button-background-on-media: rgb(255, 255, 255);
  --primary-button-icon: rgb(255, 255, 255);
  --primary-button-icon-on-media: rgb(5, 5, 5);
  --primary-button-text: rgb(255, 255, 255);
  --primary-button-text-on-media: rgb(5, 5, 5);
  --primary-deemphasized-button-background: rgb(231, 243, 255);
  --primary-deemphasized-button-icon: rgb(23, 99, 207);
  --primary-deemphasized-button-text: rgb(23, 99, 207);
  --primary-icon: rgb(5, 5, 5);
  --primary-icon-on-media: rgb(255, 255, 255);
  --primary-text: rgb(5, 5, 5);
  --primary-text-on-media: rgb(255, 255, 255);
  --progress-ring-blue-background: rgba(24, 119, 242, 0.2);
  --progress-ring-blue-foreground: rgb(24, 119, 242);
  --progress-ring-disabled-background: rgba(188, 192, 196, 0.2);
  --progress-ring-disabled-foreground: rgb(188, 192, 196);
  --progress-ring-neutral-background: rgba(0, 0, 0, 0.2);
  --progress-ring-neutral-foreground: rgb(0, 0, 0);
  --progress-ring-on-media-background: rgba(255, 255, 255, 0.2);
  --progress-ring-on-media-foreground: rgb(255, 255, 255);
  --rating-star-active: rgb(235, 102, 13);
  --secondary-button-background: rgb(228, 230, 235);
  --secondary-button-background-on-color: rgba(0, 0, 0, 0.05);
  --secondary-button-background-on-media: rgba(0, 0, 0, 0.6);
  --secondary-button-icon: rgb(5, 5, 5);
  --secondary-button-icon-on-media: rgb(255, 255, 255);
  --secondary-button-pressed: rgba(0, 0, 0, 0.05);
  --secondary-button-text: rgb(5, 5, 5);
  --secondary-button-text-on-media: rgb(255, 255, 255);
  --secondary-icon: rgb(101, 103, 107);
  --secondary-text: rgb(101, 103, 107);
  --secondary-text-on-media: rgba(255, 255, 255, 0.8);
  --see-less-selected-subtopic: rgb(209, 111, 20);
  --see-more-selected-subtopic: rgb(42, 145, 66);
  --shadow-persistent-ui: rgba(0, 0, 0, 0.1);
  --shadow-responsive-ui: rgba(0, 0, 0, 0.1);
  --shadow-text-and-icon-on-media: rgba(0, 0, 0, 0.3);
  --shadow-ui-emphasis: rgba(0, 0, 0, 0.1);
  --stepper-active: rgb(24, 119, 242);
  --stepper-inactive: rgb(228, 230, 235);
  --surface-background: rgb(255, 255, 255);
  --text-highlight: rgba(24, 119, 242, 0.2);
  --text-input-active-inner-border: rgb(24, 119, 242);
  --text-input-active-outer-border: rgb(231, 243, 255);
  --text-input-active-text: rgb(27, 116, 228);
  --text-input-bar-background: rgb(240, 242, 245);
  --text-input-inactive-inner-border: rgb(201, 204, 209);
  --text-input-inactive-outer-border: rgba(0, 0, 0, 0);
  --toggle-active-background: rgb(231, 243, 255);
  --toggle-active-icon: rgb(27, 116, 228);
  --toggle-active-text: rgb(27, 116, 228);
  --tooltip-shadow: rgba(0, 0, 0, 0.05);
  --warning: rgb(241, 168, 23);
  --wash: rgb(240, 242, 245);
  --web-wash: rgb(240, 242, 245);
  --dataviz-primary-1: rgb(48, 200, 180);
  --dataviz-primary-2: rgb(134, 218, 255);
  --dataviz-primary-3: rgb(95, 170, 255);
  --dataviz-secondary-1: rgb(118, 62, 230);
  --dataviz-secondary-2: rgb(147, 96, 247);
  --dataviz-secondary-3: rgb(219, 26, 139);
  --dataviz-supplementary-1: rgb(255, 122, 105);
  --dataviz-supplementary-2: rgb(241, 168, 23);
  --dataviz-supplementary-3: rgb(49, 162, 76);
  --dataviz-supplementary-4: rgb(50, 52, 54);
}

:root {
  --color-white: #fff;
  --color-black: #000;
  --color-text: rgba(0, 0, 0, .75);
  --color-bold-text: rgba(0, 0, 0, .85);
  --bg-color: #f2f2f2;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

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

ul, li {
  list-style: none;
}

html,
body {
  height: 100%;
}

body {
  overflow-x: hidden;
  font-family: "Poppins", "Anek Bangla", Verdana, Geneva, Tahoma, sans-serif;
  background: var(--bg-color);
}

.navbar {
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 9;
  background-color: rgba(24, 24, 24, 0.8);
  box-shadow: inset 0 1px 0 0 rgba(0, 0, 0, 0.6);
  -webkit-user-select: none;
  margin-bottom: 80px;
  padding: 12px 0;
}

.navbar .menu {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: auto;
  padding: 0 80px;
}

.navbar .logo img {
  height: 30px;
  width: 100px;
}

.items {
  display: flex;
  align-items: center;
  margin-right: 80px;
}

.items ul li {
  display: inline-block;
  margin-left: 25px;
}

/* .items ul li:first-child {
	margin-left: 0;
} */
.items ul li a {
  font-size: 17px;
  font-weight: 500;
  color: var(--color-white);
  transition: color 0.2s ease;
}

.items ul li a:hover {
  color: #babdbf;
}

.navbar .menu-btn {
  display: none;
  color: var(--color-white);
  font-size: 23px;
  cursor: pointer;
}

.container {
  width: 100%;
  margin: 80px auto;
}

.container .header {
  padding: 12px;
  margin: 30px auto;
}

.container .header h1 {
  background-image: linear-gradient(310deg, #7928ca, #ff0080);
  border-image-repeat: repeat-x;
  font-size: 38px;
  line-height: 1.2;
  font-weight: 600;
}

.text-gradient {
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  position: relative;
  z-index: 1;
}

.headline--gradient {
  -webkit-text-fill-color: transparent;
  background: -webkit-linear-gradient(90deg, #239aff, #1976f0);
  -webkit-background-clip: text;
  color: #239aff;
}

.contents {
  width: 100%;
  margin: 30px auto;
}

.how-to-work {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 12px;
}

.how-to-work .hsw-title {
  color: #48494a;
  font-size: 28px;
  text-align: center;
  margin-bottom: 20px;
}

.how-to-work .cards {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  /* justify-content: center; */
  padding: 15px 0;
  margin: 0 auto;
}

.cards .item {
  position: relative;
  width: 300px;
  margin-right: 30px;
  margin-bottom: 30px;
  /* border-radius: 8px; */
  /* box-shadow: 0 0 4px 0 rgba(0, 0, 0, .1), 0 0 4px 0 rgba(0, 0, 0, .1); */
  /* padding: 12px; */
}

.cards .item:last-child {
  margin-right: 0;
}

.cards .item .title {
  margin: 20px auto;
  font-size: 17px;
  font-weight: 500;
}

.cards .item .content {
  font-size: 16px;
  line-height: 1.5;
}

.page-like-widget {}

.contact-recommend {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 12px;
}

.contact-recommend h2 {
  color: #48494a;
  font-size: 28px;
  text-align: center;
  margin-bottom: 12px;
}

.about-content {
	margin-top: 30px;
	line-height: 1.5;
}

.header-contact {
	position: relative;
	width: 500px;
	text-align: center;
	margin: 0 auto;
}

.header-contact h1 {
	margin: 0 10px 20px 0;
}

.header-contact h4 {
	margin: 0 10px 20px 0;
}

.contact-form {
	position: relative;
	margin: 0 auto;
	width: 400px;
}

.contact-form .field {
	margin: 10px auto;
	width: 100%;
}

.contact-form .field input,
.contact-form .field textarea {
	width: 100%;
	font-size: 16px;
	outline: none;
	border: 1px solid #bfbfbf;
	border-radius: 5px;
	padding: 8px 15px;
	line-height: 1.2;
	transition: border 0.3s ease;
}

.contact-form .field button {
	width: 100%;
	font-size: 17px;
	outline: none;
	border: none;
	background: #1877F2;
	border-radius: 5px;
	padding: 10px 12px;
	color: #eee6e8;
	font-weight: bold;
	cursor: pointer;
	transition: background 0.2s ease;
}

.contact-form .field input:focus,
.contact-form .field textarea:focus {
	border: 1px solid #AF9CDA;
	outline: none;
}

.contact-form .field button:hover {
	background: #1455B0;
}

.terms, .policy {
	margin: 0 auto;
	margin-top: 70px;
	width: 100%;
	max-width: 680px;
	padding: 10px;
}

.about {
	margin: 0 auto;
	margin-top: 70px;
	width: 100%;
	max-width: 820px;
	padding: 10px;
}

.terms h1,
.policy h1,
.about h1,
.update-time {
	text-align: center;
}

.terms .content,
.policy .content {
	width: 100%;
	line-height: 2
}

.terms .part,
.policy .part {
	margin:  15px auto;
}

.terms .part ul,
.policy .part ul {
	margin: 10px auto;
	margin-left: 30px;
}

.terms .part ul li,
.policy .part ul li {
	list-style: disc;
}

.footer {
  width: 100%;
  background: #ececec;
  margin: 0 auto;
  position: relative;
  text-align: center;
  padding: 12px;
}

.footer .social-media {
  margin: 15px;
}

.social-media a {
  margin: 0 5px;
}

.footer .copyright {
  margin: 15px;
  word-spacing: 2;
}

@media (min-width: 576px) {
  .container {
    max-width: 540px;
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 720px;
  }
}

@media (min-width: 992px) {
  .container {
    max-width: 960px;
  }
}

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

@media (max-width: 720px) {
  .navbar .menu {
    padding: 0 30px;
  }
}

@media (max-width: 940px) {
  .navbar .menu {
    padding: 0 50px;
  }

  .navbar .menu-btn {
    display: block;
    z-index: 10;
  }

  .items ul {
    position: fixed;
    left: -100%;
    top: 0;
    height: 100vh;
    width: 100%;
    background: #111;
    text-align: center;
    padding-top: 80px;
  }

  .items ul.active {
    left: 0;
  }

  .items ul li {
    display: block;
  }

  .items ul li a {
    display: inline-block;
    margin: 15px 0;
    font-size: 21px;
  }
}


@media (max-width: 480px) {
	.header-contact {
		width: 400px;
	}
	.contact-form {
		width: 340px;
	}
}

@media (max-width: 420px) {
	.header-contact {
		width: 350px;
	}
	.contact-form {
		width: 340px;
	}
}