:root {

  --black-primary: #000000;

  --black-secondary: rgb(26, 26, 27);

  --grey-primary: #636466;

  --grey-secondary: #9d9fa2;

  --cyan-primary: #007c97;

  --orange-primary: #f26522;

  --red-primary: #ed1c24;



  --font-heading: "Klavika", "Noto Sans", Sans-serif;

  --font-body: "Noto Sans", Sans-serif;

}



/* http://meyerweb.com/eric/tools/css/reset/

   v2.0 | 20110126

   License: none (public domain)

--------------------------------- */

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,

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 {

  margin: 0;

  padding: 0;

  border: 0;

  vertical-align: baseline;

}

article,

aside,

details,

figcaption,

figure,

footer,

header,

hgroup,

menu,

nav,

section {

  display: block;

}

body {

  line-height: 1;

}

ol,

ul {

  list-style: none;

}

blockquote,

q {

  quotes: none;

}

blockquote:before,

blockquote:after,

q:before,

q:after {

  content: "";

  content: none;

}

table {

  border-collapse: collapse;

  border-spacing: 0;

}

sup {

  position: relative;

  font-size: 65%;

  line-height: 0;

  vertical-align: baseline;

  top: -0.4em;

}

strong,

b {

  font-weight: bold;

}

em {

  font-style: italic;

}

figure {

  margin: 0;

  padding: 0;

}

p {

  margin-bottom: 1.875rem;

}

a,

a:visited {

  color: var(--black-primary);

  transition: all 0.2s;

  text-decoration: underline;

}

a:hover {

  color: var(--black-primary);

}



/* Background color

--------------------------------- */

.ci-bg-black {

  background-color: var(--black-primary);

  color: var(--grey-secondary);

}

.ci-bg-black a,

.ci-bg-black h1,

.ci-bg-black h2,

.ci-bg-black h3,

.ci-bg-black h2,

.ci-bg-black h3,

.ci-bg-black h4 {

  color: #ffffff;

}

.ci-bg-black .ci-btn.ci-btn-secondary {

  color: #fff !important;

  border-color: #fff !important;

}

.ci-bg-biyangrey {

  background-color: #f2f3f4;

}



/* Text Color

--------------------------------- */

.ci-text-black {

  color: var(--black-primary) !important;

}

.ci-text-white {

  color: #ffffff !important;

}



/* Fonts

---------------------------------------------- */

.ci-font-heading {

  font-family: var(--font-heading);

}

.ci-font-body {

  font-family: var(--font-body);

}



/*  Basic

--------------------------------- */

.ci-clearfix:after {

  content: ".";

  visibility: hidden;

  display: block;

  height: 0;

  clear: both;

}

.ci-img-full {

  max-width: 100%;

  height: auto;

}

.ci-text-uppercase {

  text-transform: uppercase;

}

.ci-text-center {

  text-align: center;

}

.ci-text-right {

  text-align: right;

}



/* Footnote

--------------------------------- */

details.footnote {

  font-size: 0.75rem;

  line-height: 150%;

}

details.footnote summary {

  text-transform: uppercase;

  font: normal bold 0.875rem/150% var(--font-heading);

  cursor: pointer;

  margin: 5px 0;

  color: var(--black-primary);

}

details.footnote ol {

  list-style-type: decimal;

  margin: 1rem 0 0 0.9rem !important;

}

details.footnote ol li:not(:last-child) {

  margin-bottom: 0.75rem;

}



/* List group

--------------------------------- */

ul.ci-list-empty {

  list-style-type: none !important;

  margin-left: 0;

}

ul.ci-list-square {

  list-style-type: square !important;

}

ul.ci-list-disc {

  list-style-type: disc !important;

  margin-left: 15px !important;

}

ul.ci-list-decimal {

  list-style-type: decimal !important;

  margin-left: 15px !important;

}

ul.ci-list-disc li:not(:last-child),

ul.ci-list-empty li:not(:last-child),

ul.ci-list-square li:not(:last-child) {

  margin-bottom: 0.6em !important;

}



/*  Font-sizes ~24px | ~22px | ~18px | ~14px | ~12px

--------------------------------- */

.ci-font-xl {

  font-size: 1.5rem !important;

  line-height: 135% !important;

}

.ci-font-l {

  font-size: 1.375rem !important;

  line-height: 135% !important;

}

.ci-font-m {

  font-size: 1.125rem !important;

  line-height: 135% !important;

}

.ci-font-s {

  font-size: 0.875rem !important;

  line-height: 120% !important;

}

.ci-font-xs {

  font-size: 0.75rem !important;

  line-height: 150% !important;

}

.ci-font-900 {

  font-weight: 900;

}

.ci-font-500 {

  font-weight: 500;

}

.ci-font-400 {

  font-weight: 400;

}

.ci-font-300 {

  font-weight: 300;

}



/*  Spacing

--------------------------------- */

.ci-px-xl {

  padding-left: 100px !important;

  padding-right: 100px !important;

}

.ci-py-xl {

  padding-top: 100px !important;

  padding-bottom: 100px !important;

}

.ci-pt-xl {

  padding-top: 100px !important;

}

.ci-pb-xl {

  padding-bottom: 100px !important;

}

.ci-pl-xl {

  padding-left: 100px !important;

}

.ci-pr-xl {

  padding-right: 100px !important;

}

.ci-px-l {

  padding-left: 80px !important;

  padding-right: 80px !important;

}

.ci-py-l {

  padding-top: 80px !important;

  padding-bottom: 80px !important;

}

.ci-pt-l {

  padding-top: 80px !important;

}

.ci-pb-l {

  padding-bottom: 80px !important;

}

.ci-pl-l {

  padding-left: 80px !important;

}

.ci-pr-l {

  padding-right: 80px !important;

}

.ci-px-m {

  padding-left: 60px !important;

  padding-right: 60px !important;

}

.ci-py-m {

  padding-top: 60px !important;

  padding-bottom: 60px !important;

}

.ci-pt-m {

  padding-top: 60px !important;

}

.ci-pb-m {

  padding-bottom: 60px !important;

}

.ci-pl-m {

  padding-left: 60px !important;

}

.ci-pr-m {

  padding-right: 60px !important;

}

.ci-px-s {

  padding-left: 30px !important;

  padding-right: 30px !important;

}

.ci-py-s {

  padding-top: 30px !important;

  padding-bottom: 30px !important;

}

.ci-pt-s {

  padding-top: 30px !important;

}

.ci-pb-s {

  padding-bottom: 30px !important;

}

.ci-pl-s {

  padding-left: 30px !important;

}

.ci-pr-s {

  padding-right: 30px !important;

}

.ci-px-xs {

  padding-left: 15px !important;

  padding-right: 15px !important;

}

.ci-py-xs {

  padding-top: 15px !important;

  padding-bottom: 15px !important;

}

.ci-pt-xs {

  padding-top: 15px !important;

}

.ci-pb-xs {

  padding-bottom: 15px !important;

}

.ci-pl-xs {

  padding-left: 15px !important;

}

.ci-pr-xs {

  padding-right: 15px !important;

}

.ci-pb-0 {

  padding-bottom: 0 !important;

}

.ci-pt-0 {

  padding-top: 0 !important;

}

.ci-pl-0 {

  padding-left: 0 !important;

}

.ci-pr-0 {

  padding-right: 0 !important;

}

@media (max-width: 1100px) {

  .ci-px-xl,

  .ci-px-l {

    padding-left: 60px !important;

    padding-right: 60px !important;

  }

  .ci-py-xl,

  .ci-py-l {

    padding-top: 60px !important;

    padding-bottom: 60px !important;

  }

  .ci-pt-xl,

  .ci-pt-l {

    padding-top: 60px !important;

  }

  .ci-pb-xl,

  .ci-pb-l {

    padding-bottom: 60px !important;

  }

  .ci-pl-xl,

  .ci-pl-l {

    padding-left: 60px !important;

  }

  .ci-pr-xl,

  .ci-pr-l {

    padding-right: 60px !important;

  }

}

@media (max-width: 980px) {

  .ci-px-xl,

  .ci-px-l,

  .ci-px-m {

    padding-left: 30px !important;

    padding-right: 30px !important;

  }

  .ci-py-xl,

  .ci-py-l,

  .ci-py-m {

    padding-top: 30px !important;

    padding-bottom: 30px !important;

  }

  .ci-pt-xl,

  .ci-pt-l,

  .ci-pt-m {

    padding-top: 30px !important;

  }

  .ci-pb-xl,

  .ci-pb-l,

  .ci-pb-m {

    padding-bottom: 30px !important;

  }

  .ci-pl-xl,

  .ci-pl-l,

  .ci-pl-m {

    padding-left: 30px !important;

  }

  .ci-pr-xl,

  .ci-pr-l,

  .ci-pr-m {

    padding-right: 30px !important;

  }

}



.ci-mx-xl {

  margin-left: 100px;

  margin-right: 100px !important;

}

.ci-my-xl {

  margin-top: 100px;

  margin-bottom: 100px !important;

}

.ci-mt-xl {

  margin-top: 100px !important;

}

.ci-mb-xl {

  margin-bottom: 100px !important;

}

.ci-ml-xl {

  margin-left: 100px !important;

}

.ci-mr-xl {

  margin-right: 100px !important;

}

.ci-mx-l {

  margin-left: 80px !important;

  margin-right: 80px !important;

}

.ci-my-l {

  margin-top: 80px !important;

  margin-bottom: 80px !important;

}

.ci-mt-l {

  margin-top: 80px !important;

}

.ci-mb-l {

  margin-bottom: 80px !important;

}

.ci-ml-l {

  margin-left: 80px !important;

}

.ci-mr-l {

  margin-right: 80px !important;

}

.ci-mx-m {

  margin-left: 60px !important;

  margin-right: 60px !important;

}

.ci-my-m {

  margin-top: 60px !important;

  margin-bottom: 60px !important;

}

.ci-mt-m {

  margin-top: 60px !important;

}

.ci-mb-m {

  margin-bottom: 60px !important;

}

.ci-ml-m {

  margin-left: 60px !important;

}

.ci-mr-m {

  margin-right: 60px !important;

}

.ci-mx-s {

  margin-left: 30px !important;

  margin-right: 30px !important;

}

.ci-my-s {

  margin-top: 30px !important;

  margin-bottom: 30px !important;

}

.ci-mt-s {

  margin-top: 30px !important;

}

.ci-mb-s {

  margin-bottom: 30px !important;

}

.ci-ml-s {

  margin-left: 30px !important;

}

.ci-mr-s {

  margin-right: 30px !important;

}

.ci-mx-xs {

  margin-left: 15px !important;

  margin-right: 15px !important;

}

.ci-my-xs {

  margin-top: 15px !important;

  margin-bottom: 15px !important;

}

.ci-mt-xs {

  margin-top: 15px !important;

}

.ci-mb-xs {

  margin-bottom: 15px !important;

}

.ci-ml-xs {

  margin-left: 15px !important;

}

.ci-mr-xs {

  margin-right: 15px !important;

}

.ci-mb-0 {

  margin-bottom: 0 !important;

}

@media (max-width: 1100px) {

  .ci-mx-xl,

  .ci-mx-l {

    margin-left: 60px !important;

    margin-right: 60px !important;

  }

  .ci-my-xl,

  .ci-my-l {

    margin-top: 60px !important;

    margin-bottom: 60px !important;

  }

  .ci-mt-xl,

  .ci-mt-l {

    margin-top: 60px !important;

  }

  .ci-mb-xl,

  .ci-mb-l {

    margin-bottom: 60px !important;

  }

  .ci-ml-xl,

  .ci-ml-l {

    margin-left: 60px !important;

  }

  .ci-mr-xl,

  .ci-mr-l {

    margin-right: 60px !important;

  }

}

@media (max-width: 980px) {

  .ci-mx-xl,

  .ci-mx-l,

  .ci-mx-m {

    margin-left: 30px !important;

    margin-right: 30px !important;

  }

  .ci-my-xl,

  .ci-my-l,

  .ci-my-m {

    margin-top: 30px !important;

    margin-bottom: 30px !important;

  }

  .ci-mt-xl,

  .ci-mt-l,

  .ci-mt-m {

    margin-top: 30px !important;

  }

  .ci-mb-xl,

  .ci-mb-l,

  .ci-mb-m {

    margin-bottom: 30px !important;

  }

  .ci-ml-xl,

  .ci-ml-l,

  .ci-ml-m {

    margin-left: 30px !important;

  }

  .ci-mr-xl,

  .ci-mr-l,

  .ci-mr-m {

    margin-right: 30px !important;

  }

}



/* Display

--------------------------------- */

.ci-d-block {

  display: block;

}

.ci-d-inline-block {

  display: inline-block;

}

.ci-d-flex {

  display: flex;

}

.ci-d-none {

  display: none !important;

}

@media (max-width: 768px) {

  .ci-d-mhide {

    display: none;

  }

}



/* Flex item

--------------------------------- */

.ci-d-flex.ci-flex-align-end {

  align-items: flex-end;

}

.ci-d-flex.ci-flex-align-start {

  align-items: flex-start;

}

.ci-d-flex.ci-flex-align-center {

  align-items: center;

}

.ci-d-flex.ci-flex-justify-between {

  justify-content: space-between;

}

.ci-d-flex.flex-justify-around {

  justify-content: space-around;

}

.ci-d-flex.flex-justify-center {

  justify-content: center;

}

.ci-d-flex.flex-justify-end {

  justify-content: flex-end;

}

.ci-d-flex .ci-order-1 {

  order: 1;

}

.ci-d-flex .ci-order-2 {

  order: 2;

}



/* Flex item

--------------------------------- */

.ci-grid {

  display: flex;

  margin-left: -15px;

  margin-right: -15px;

  flex-wrap: wrap;

}

.ci-grid.no-gutters {

  margin-left: 0;

  margin-right: 0;

}

.ci-grid > .grid-item {

  padding-left: 15px;

  padding-right: 15px;

  box-sizing: border-box;

}

.ci-grid.no-gutters > .grid-item {

  margin-left: 0;

  margin-right: 0;

}

.ci-grid-onehalf > .grid-item {

  width: 50%;

}

.ci-grid-onethird > .grid-item {

  width: 33.3%;

}

.ci-grid-oneforth > .grid-item {

  width: 25%;

}

.ci-grid-onefifth > .grid-item {

  width: 20%;

}

.ci-grid-onesixth > .grid-item {

  width: 16.6%;

}



/* Container wrapper

--------------------------------- */

.ci-wrap-mid {

  margin-left: auto !important;

  margin-right: auto !important;

}

.ci-wrap-xl {

  width: 90%;

  max-width: 1405px;

  margin-left: auto;

  margin-right: auto;

}

.ci-wrap-l {

  width: 90%;

  max-width: 1080px;

  margin-left: auto;

  margin-right: auto;

}

.ci-wrap-m {

  width: 90%;

  max-width: 980px;

}

.ci-wrap-s {

  width: 90%;

  max-width: 767px;

}

.ci-wrap-xs {

  width: 90%;

  max-width: 560px;

}

.ci-wrap-xxs {

  width: 90%;

  max-width: 479px;

}



/* Buttons

--------------------------------- */

.ci-btn {

  background: var(--orange-primary) !important;

  border: 2px solid var(--orange-primary) !important;

  color: #ffffff !important;

  text-align: left;

  text-transform: uppercase !important;

  font-weight: bold;

  padding: 5px 10px !important;

  display: inline-flex;

  align-items: center;

  line-height: 150% !important;

  font-size: 0.85rem;

  font-family: inherit;

  cursor: pointer;

  text-decoration: none;

  position: relative;

  overflow-x: hidden;

}

.ci-btn strong {

  display: block;

  margin-right: 10px !important;

}

.ci-btn .material-icons-outlined {

  transition: all 0.3s cubic-bezier(0.59, 0.73, 0.17, 1) !important;

}

.ci-btn > * {

  position: relative;

  z-index: 2;

}

.ci-btn:hover {

  box-shadow: 0 10px 10px rgb(0 0 0 / 10%);

  background-image: linear-gradient(rgb(0 0 0/30%) 0 0);

}

.ci-btn:hover .material-icons-outlined {

  transform: translateX(5px);

}



/* -- Secondary button -- */

.ci-btn.ci-btn-secondary {

  background: none !important;

  color: var(--black-primary) !important;

  border-color: var(--black-primary) !important;

}