/**/
/* fonts */
/**/
@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap');
@font-face {
    font-family: 'GT America';
    font-style: normal;
    font-weight: 400;
    src: url(../fnt/GT-America-Regular.otf);
}
@font-face {
    font-family: 'GT America';
    font-style: normal;
    font-weight: 500;
    src: url(../fnt/GT-America-Standard-Medium.ttf);
}
@font-face {
    font-family: 'GT America';
    font-style: normal;
    font-weight: 700;
    src: url(../fnt/GT-America-Standard-Bold.otf);
}


/**/
/* reset */
/**/
*,
*::after, 
*::before {
  margin: 0;
  padding: 0;
  border: none;
  outline: none;
  background-color: transparent;
  background-position: 50% 50%;
  box-sizing: border-box;
  font: inherit;
  text-align: inherit;
  text-decoration: none;
  letter-spacing: inherit;
  color: inherit;
}


/**/
/* defaults */
/**/
html, body {
  background: #F5F8FA;
  font-family: 'GT America', Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.375;
  color: #62727B;
  -webkit-font-smoothing: antialiased;
}
label, img, svg {
  display: block;
}
button {
  cursor: pointer;
}
@media screen and (max-width: 767.98px) {
  html, body {
    font-size: 14px;
  }
}


/**/
/* grid */
/**/
.grid-cont {
  max-width: 1024px;
  margin-right: auto;
  margin-left: auto;
  padding-right: 32px;
  padding-left: 32px;
}
.grid-cont--xl {
  max-width: none;
}
.grid-row {
  display: flex;
  flex-wrap: wrap;
  margin-right: -16px;
  margin-left: -16px;
}
.grid-row--aic {
  align-items: center;
}
.grid-row--aib {
  align-items: flex-end;
}
.grid-row--jcc {
  justify-content: center;
}
.grid-row--jce {
  justify-content: flex-end;
}
.grid-row--jca {
  justify-content: space-around;
}
.grid-row--jcb {
  justify-content: space-between;
}
.grid-row--smg {
  margin-right: -8px;
  margin-left: -8px;
}
.grid-row--smg > .grid-col {
  padding-right: 8px;
  padding-left: 8px;
}
.grid-row--xsg {
  margin-right: -6px;
  margin-left: -6px;
}
.grid-row--xsg > .grid-col {
  padding-right: 6px;
  padding-left: 6px;
}
.grid-row--nog {
  margin-right: 0;
  margin-left: 0;
}
.grid-row--nog > .grid-col {
  padding-right: 0;
  padding-left: 0;
}
.grid-row--nowrap {
  flex-wrap: nowrap;
}
.grid-col {
  flex-basis: 0;
  flex-grow: 1;
  max-width: 100%;
  padding-right: 16px;
  padding-left: 16px;
}
.grid-col--1 {
  flex: 0 0 8.333333%;
  max-width: 8.333333%;
}
.grid-col--2 {
  flex: 0 0 16.666667%;
  max-width: 16.666667%;
}
.grid-col--3 {
  flex: 0 0 25%;
  max-width: 25%;
}
.grid-col--4 {
  flex: 0 0 33.333%;
  max-width: 33.333%;
}
.grid-col--5 {
  flex: 0 0 41.666667%;
  max-width: 41.666667%;
}
.grid-col--6 {
  flex: 0 0 50%;
  max-width: 50%;
}
.grid-col--7 {
  flex: 0 0 58.333333%;
  max-width: 58.333333%;
}
.grid-col--8 {
  flex: 0 0 66.667%;
  max-width: 66.667%;
}
.grid-col--9 {
  flex: 0 0 75%;
  max-width: 75%;
}
.grid-col--10 {
  flex: 0 0 83.333333%;
  max-width: 83.333333%;
}
.grid-col--11 {
  flex: 0 0 91.666667%;
  max-width: 91.666667%;
}
.grid-col--12 {
  flex: 0 0 100%;
  max-width: 100%;
}
.grid-col--auto {
  flex: 0 0 auto;
  width: auto;
  max-width: none;
}
@media screen and (max-width: 1279.98px) {
  .grid-cont {
    padding-right: 24px;
    padding-left: 24px;
  }
}
@media screen and (max-width: 1023.98px) {
  .grid-row {
    margin-right: -12px;
    margin-left: -12px;
  }
  .grid-row--smg {
    margin-right: -8px;
    margin-left: -8px;
  }
  .grid-row--nog {
    margin-right: 0;
    margin-left: 0;
  }
  .grid-col {
    padding-right: 12px;
    padding-left: 12px;
  }
  .grid-col--md {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
  }
  .grid-col--md-1 {
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }
  .grid-col--md-2 {
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .grid-col--md-3 {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .grid-col--md-4 {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .grid-col--md-5 {
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }
  .grid-col--md-6 {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .grid-col--md-7 {
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }
  .grid-col--md-8 {
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .grid-col--md-9 {
    flex: 0 0 75%;
    max-width: 75%;
  }
  .grid-col--md-10 {
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }
  .grid-col--md-11 {
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }
  .grid-col--md-12 {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .grid-col--md-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: none;
  }
  .grid-col--md-order-0 {
    order: -1;
  }
  .grid-col--md-order-10 {
    order: 1;
  }
}
@media screen and (max-width: 767.98px) {
  .grid-cont {
    padding-right: 20px;
    padding-left: 20px;
  }
  .grid-row {
    margin-right: -8px;
    margin-left: -8px;
  }
  .grid-row--nog {
    margin-right: 0;
    margin-left: 0;
  }
  .grid-row--smg {
    margin-right: -6px;
    margin-left: -6px;
  }
  .grid-row--smg > .grid-col {
    padding-right: 6px;
    padding-left: 6px;
  }
  .grid-col {
    padding-right: 8px;
    padding-left: 8px;
  }
  .grid-col--sm {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
  }
  .grid-col--sm-1 {
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }
  .grid-col--sm-2 {
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .grid-col--sm-3 {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .grid-col--sm-4 {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .grid-col--sm-5 {
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }
  .grid-col--sm-6 {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .grid-col--sm-7 {
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }
  .grid-col--sm-8 {
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .grid-col--sm-9 {
    flex: 0 0 75%;
    max-width: 75%;
  }
  .grid-col--sm-10 {
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }
  .grid-col--sm-11 {
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }
  .grid-col--sm-12 {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .grid-col--sm-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: none;
  }
  .grid-col--sm-order-0 {
    order: -1;
  }
  .grid-col--sm-order-10 {
    order: 1;
  }
}
@media screen and (max-width: 599.98px) {
  .grid-col--xs {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
  }
  .grid-col--xs-1 {
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }
  .grid-col--xs-2 {
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .grid-col--xs-3 {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .grid-col--xs-4 {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .grid-col--xs-5 {
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }
  .grid-col--xs-6 {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .grid-col--xs-7 {
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }
  .grid-col--xs-8 {
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .grid-col--xs-9 {
    flex: 0 0 75%;
    max-width: 75%;
  }
  .grid-col--xs-10 {
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }
  .grid-col--xs-11 {
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }
  .grid-col--xs-12 {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .grid-col--xs-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: none;
  }
}


/**/
/* display */
/**/
.removed {
  display: none;
}
.blocked {
  display: block;
}
@media screen and (max-width: 1279.98px) {
  .removed--lg {
    display: none;
  }
  .blocked--lg {
    display: block;
  }
}
@media screen and (max-width: 1023.98px) {
  .removed--md {
    display: none;
  }
  .blocked--md {
    display: block;
  }
}
@media screen and (max-width: 767.98px) {
  .removed--sm {
    display: none;
  }
  .blocked--sm {
    display: block;
  }
}
@media screen and (max-width: 599.98px) {
  .removed--xs {
    display: none;
  }
  .blocked--xs {
    display: block;
  }
}


/**/
/* margins */
/**/
.mt--025 {
  margin-top: 4px;
}
.mt--050 {
  margin-top: 8px;
}
.mt--075 {
  margin-top: 12px;
}
.mt--100 {
  margin-top: 16px;
}
.mt--125 {
  margin-top: 20px;
}
.mt--150 {
  margin-top: 24px;
}
.mt--200 {
  margin-top: 32px;
}
.mt--250 {
  margin-top: 40px;
}
.mt--300 {
  margin-top: 48px;
}
.mt--400 {
  margin-top: 64px;
}
.mt--500 {
  margin-top: 80px;
}
.mb--025 {
  margin-bottom: 4px;
}
.mb--050 {
  margin-bottom: 8px;
}
.mb--075 {
  margin-bottom: 12px;
}
.mb--100 {
  margin-bottom: 16px;
}
.mb--125 {
  margin-bottom: 20px;
}
.mb--150 {
  margin-bottom: 24px;
}
.mb--200 {
  margin-bottom: 32px;
}
.mb--250 {
  margin-bottom: 40px;
}




/**/
/* TYPOGRAPHY */
/**/


/**/
/* headings */
/**/
h1, .h1 {
  font-size: 40px;
  line-height: 1.125;
  font-weight: 700;
  color: #23202E;
}
h2, .h2 {
  font-size: 36px;
  line-height: 1.125;
  font-weight: 700;
  color: #23202E;
}
.h2--sm {
  font-size: 32px;
}
h3, .h3 {
  font-size: 28px;
  line-height: 1.25;
  font-weight: 700;
  color: #23202E;
}
h4, .h4 {
  font-size: 24px;
  line-height: 1.25;
  font-weight: 700;
  color: #23202E;
}
.h4--sm {
  font-size: 22px;
}
h5, .h5 {
  font-size: 18px;
  line-height: 1.25;
  font-weight: 700;
  color: #23202E;
}
h6, .h6 {
  line-height: 1.25;
  font-weight: 700;
  color: #23202E;
}
@media screen and (max-width: 767.98px) {
  h1, .h1 {
    font-size: 32px;
  }
  h2, .h2 {
    font-size: 28px;
  }
  h3, .h3 {
    font-size: 24px;
  }
  h4, .h4 {
    font-size: 18px;
  }
  h5, .h5 {
    font-size: 16px;
  }
}


/**/
/* paragraphs */
/**/
p, .p {
  font-size: 18px;
}
.p--xxs {
  font-size: 12px;
}
.p--xs {
  font-size: 14px;
}
.p--sm {
  font-size: 16px;
}
.p--lg {
  font-size: 20px;
}
.p--xl {
  font-size: 22px;
}
.p--xxl {
  font-size: 24px;
}
@media screen and (max-width: 767.98px) {
  p, .p {
    font-size: 14px;
  }
  .p--xxs {
    font-size: 11px;
  }
  .p--xs {
    font-size: 12px;
  }
  .p--sm {
    font-size: 13px;
  }
  .p--lg {
    font-size: 16px;
  }
  .p--xl {
    font-size: 18px;
  }
  .p--xxl {
    font-size: 20px;
  }
}


/**/
/* dividers */
/**/
hr, .hr {
  border-top: 1px solid #DADFE4;
}


/**/
/* alignment */
/**/
.ta--left {
  text-align: left;
}
.ta--center {
  text-align: center;
}
.ta--right {
  text-align: right;
}


/**/
/* font weights */
/**/
.fw--400 {
  font-weight: 400;
}
em, .fw--500 {
  font-weight: 500;
}
strong, .fw--700 {
  font-weight: 700;
}


/**/
/* white space */
/**/
.nobr {
  white-space: nowrap;
}


/**/
/* links */
/**/
.text-link {
  text-decoration: underline;
  color: #1097E2;
}
.text-link--inh {
  color: inherit;
}
.text-link:hover {
  text-decoration: none;
}


/**/
/* icons */
/**/
.inline-icon {
  display: inline-block;
  vertical-align: top;
}


/**/
/* colors */
/**/
.tc--darkest {
  color: #000;
}
.tc--xdark {
  color: #23202E;
}
.tc--dark {
  color: #48415C;
}
.tc--body {
  color: #62727B;
}
.tc--light {
  color: #87979F;
}
.tc--xlight {
  color: #96A2A8;
}
.tc--dblue {
  color: #37474F;
}
.tc--primary {
  color: #1097E2;
}
.tc--secondary {
  color: #20C0CA;
}
.tc--tertiary {
  color: #EE2E24;
}




/**/
/* FORM ELEMENTS */
/**/


/**/
/* input */
/**/
.input {
  position: relative;
}
.input__input {
  display: block;
  width: 100%;
  padding: 12px 20px;
  border-radius: 6px;
  border: 1px solid #D0D0D0;
  background-color: #FFF;
  box-shadow: 0px 2px 2px rgba(196, 196, 235, 0.25);
  font-size: 18px;
  line-height: 26px;
  font-weight: 500;
  color: #000;
  resize: none;
  transition-duration: 0.25s;
  transition-property: border;
  -webkit-appearance: none;
}
.input__input--sm {
  padding: 9px 16px;
  font-size: 16px;
  line-height: 22px;
}
.input__input--xxs {
  padding: 5px 11px;
  font-size: 14px;
  line-height: 20px;
}
.input__input:focus {
  border-color: #1097E2;
}
.input__input[disabled] {
  background-color: #F5F8FA;
}
.input__input::placeholder {
  font-weight: 400;
  color: #96A2A8;
  transition-duration: 0.25s;
  transition-property: color;
}
.input__input:focus::placeholder {
  color: transparent;
}
.input__input--search {
  background: #FFF url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2362727B" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg>') 100% 50%/40px 20px no-repeat;
}
.input__input--datepicker {
  background: #FFF url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2362727B" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg>') 100% 50%/40px 20px no-repeat; 
}
.input__input--search.input__input--xxs,
.input__input--datepicker.input__input--xxs {
  background-size: 30px 16px;
}
.input__input--invalid {
  border-color: #EE2E24;
}


/**/
/* select */
/**/
.select {
  position: relative;
}
.select__select {
  display: block;
  width: 100%;
  padding: 12px 19px;
  border-radius: 6px;
  border: 1px solid #D0D0D0;
  background: #FFF url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="50" height="20" viewBox="0 0 24 24" stroke="%2396A2A8" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg>') 100% 50% no-repeat;
  box-shadow: 0px 2px 2px rgba(196, 196, 235, 0.25);
  font-size: 18px;
  line-height: 26px;
  font-weight: 500;
  color: #000;
  transition-duration: 0.25s;
  transition-property: border;
  -webkit-appearance: none;
}
.select__select--xxs {
  padding: 5px 30px 5px 11px;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="30" height="18" viewBox="0 0 24 24" stroke="%2396A2A8" stroke-width="3" fill="none" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg>');
  font-size: 14px;
  line-height: 20px;
}
.select__select:focus {
  border-color: #1097E2;
}
.select__select[disabled] {
  background-color: #F5F8FA;
}
.select__select--invalid {
  border-color: #EE2E24;
}


/**/
/* switcher */
/**/
.switcher {
  display: flex;
  padding: 1px;
  border-radius: 6px;
  border: 1px solid #D0D0D0;
  background-color: #FFF;
  box-shadow: 0px 2px 2px rgba(196, 196, 235, 0.25);
  font-size: 18px;
  line-height: 34px;
  font-weight: 500;
  text-align: center;
}
.switcher__item {
  flex-grow: 1;
  position: relative;
  margin: 2px;
}
.switcher__input {
  appearance: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}
.switcher__label {
  border-radius: 3px;
  transition-duration: 0.25s;
}
.switcher__input:hover ~ .switcher__label {
  color: #37474F;
}
.switcher__input:checked ~ .switcher__label {
  background-color: #37474F;
  color: #FFF;
}


/**/
/* checkbox */
/**/
.checkbox {
  position: relative;
  line-height: 20px;
}
.checkbox__input {
  appearance: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}
.checkbox__icon {
  float: left;
  width: 20px;
  height: 20px;
  border-radius: 4px;
  border: 1px solid #CAD8E0;
  background: #FFF url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" stroke="%23FFFFFF" stroke-width="3" fill="none" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"></polyline></svg>') 50% 50% no-repeat;
  transition-duration: 0.25s;
  transition-property: border, background;
}
.checkbox__label {
  margin-left: 32px;
  overflow: hidden;
  transition-duration: 0.25s;
  transition-property: color;
}
.checkbox__input:hover ~ .checkbox__icon {
  border-color: #1097E2;
}
.checkbox__input:checked ~ .checkbox__icon {
  border-color: #1097E2;
  background-color: #1097E2;
}
.checkbox__input:checked ~ .checkbox__label {
  color: #37474F;
}
.checkbox__input[disabled] {
  pointer-events: none;
}
.checkbox__input[disabled] ~ .checkbox__icon {
  background: #F5F8FA;
}
.checkboxes-group {
  border-radius: 6px;
  border: 1px solid #D0D0D0;
  background-color: #FFF;
  box-shadow: 0px 2px 2px rgba(196, 196, 235, 0.25);
}
.checkboxes-group .checkbox {
  padding: 11px 15px;
  border-top: 1px solid #D0D0D0;
}
.checkboxes-group .checkbox:first-child {
  border-top: 0;
}


/**/
/* toggle */
/**/
.toggle {
  position: relative;
  line-height: 24px;
}
.toggle__input {
  appearance: none;
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}
.toggle__icon {
  position: relative;
  float: right;
  width: 44px;
  height: 24px;
  border-radius: 12px;
  border: 1px solid #CAD8E0;
  background: #FFF;
  transition-duration: 0.25s;
  transition-property: border, background;
}
.toggle__icon::after {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #1097E2;
  transition-duration: 0.25s;
}
.toggle__label {
  margin-right: 56px;
  overflow: hidden;
  transition-duration: 0.25s;
  transition-property: color;
}
.toggle__input:hover ~ .toggle__icon {
  border-color: #1097E2;
}
.toggle__input:checked ~ .toggle__icon {
  border-color: #1097E2;
  background-color: #1097E2;
}
.toggle__input:checked ~ .toggle__icon::after {
  left: 21px;
  background-color: #FFF;
}
.toggle__input:checked ~ .toggle__label {
  color: #37474F;
}
.toggle__input[disabled] {
  pointer-events: none;
}
.toggle__input[disabled] ~ .toggle__icon {
  background: #F5F8FA;
}
.toggle__input[disabled] ~ .toggle__icon::after {
  background-color: #CAD8E0;
}
.toggles-group {
  border-radius: 6px;
  border: 1px solid #D0D0D0;
  background-color: #FFF;
  box-shadow: 0px 2px 2px rgba(196, 196, 235, 0.25);
}
.toggles-group .toggle {
  padding: 9px 15px;
  border-top: 1px solid #D0D0D0;
}
.toggles-group .toggle:first-child {
  border-top: 0;
}


/**/
/* tags select */
/**/
.tags-select__input {
  border-color: #1097E2;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.tags-select__dropdown {
  position: relative;
  height: 100px;
  overflow: auto;
  margin-top: -1px;
  border: 1px solid #1097E2;
  border-top-color: #D3DBDE;
  border-bottom-right-radius: 6px;
  border-bottom-left-radius: 6px;
  background-color: #FFF;
  font-size: 14px;
  line-height: 28px;
  color: #62727B;
}
.tags-select__option {
  padding: 0 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}
.tags-select__option:hover {
  background-color: rgba(16, 151, 226, 0.1);
}


/**/
/* button */
/**/
.button {
  display: inline-block;
  vertical-align: top;
  padding: 15px 31px;
  border: 1px solid #CED8DD;
  border-radius: 6px;
  font-size: 18px;
  line-height: 20px;
  font-weight: 700;
  text-align: center;
  color: #62727B;
  transition-duration: 0.25s;
  transition-property: border, background, color;
}
.button img,
.button svg {
  display: inline-block;
  vertical-align: top;
}
.button svg[height="24"] {
  margin-top: -2px;
  margin-bottom: -2px;
}
.button img:last-child,
.button svg:last-child {
  margin-right: -8px;
  margin-left: 12px;
}
.button img:first-child,
.button svg:first-child {
  margin-right: 12px;
  margin-left: -8px;
}
.button img:last-child:first-child,
.button svg:last-child:first-child {
  margin-right: -8px;
  margin-left: -8px;
}
.button:hover {
  border-color: #E3EBF2;
  background-color: #E3EBF2;
}
.button[disabled] {
  border-color: #CAD8E0;
  background-color: #CAD8E0;
  color: #FFF;
  pointer-events: none;
}
.button--wide {
  width: 100%;
}
.button--lg {
  padding: 17px 39px;
}
.button--sm {
  padding: 10px 19px;
  border-radius: 4px;
  font-size: 16px;
}
.button--xs {
  padding: 8px 15px;
  font-size: 15px;
  font-weight: 500;
}
.button--xs img:last-child,
.button--xs svg:last-child {
  margin-right: -4px;
  margin-left: 8px;
}
.button--xs img:first-child,
.button--xs svg:first-child {
  margin-right: 8px;
  margin-left: -4px;
}
.button--xxs {
  padding: 5px 13px;
  font-size: 15px;
  font-weight: 500;
}
.button--xxs img:last-child,
.button--xxs svg:last-child {
  margin-right: -4px;
  margin-left: 8px;
}
.button--xxs img:first-child,
.button--xxs svg:first-child {
  margin-right: 8px;
  margin-left: -4px;
}
.button--rounded {
  border-radius: 26px;
}
.button--white {
  background-color: #FFF;
}
.button--primary {
  border-color: #1097E2;
  background-color: #1097E2;
  color: #FFF;
}
.button--primary:hover {
  border-color: #157EB8;
  background-color: #157EB8;
}
.button--secondary {
  border-color: #20C0CA;
  background-color: #20C0CA;
  color: #FFF;
}
.button--secondary:hover {
  border-color: #1AA7B0;
  background-color: #1AA7B0;
}
.button--tertiary {
  border-color: #EE2E24;
  background-color: #EE2E24;
  color: #FFF;
}
.button--tertiary:hover {
  border-color: #C93730;
  background-color: #C93730;
}
.button--dark {
  border-color: #37474F;
  background-color: #37474F;
  color: #FFF;
}
.button--dark:hover {
  border-color: #37474F;
  background-color: #37474F;
}
.button--primary-light {
  border-color: transparent;
  background-color: rgba(16, 151, 226, 0.15);
  color: #1097E2;
}
.button--primary-light:hover {
  border-color: transparent;
  background-color: #1097E2;
  color: #FFF;
}
.button--tertiary-light {
  border-color: transparent;
  background-color: rgba(201, 55, 48, 0.1);
  color: #C93730;
}
.button--tertiary-light:hover {
  border-color: transparent;
  background-color: #C93730;
  color: #FFF;
}




/**/
/* PAGE LAYOUT */
/**/


/**/
/* header */
/**/
.header {
  position: fixed;
  z-index: 10;
  top: 0;
  right: 0;
  left: 0;
  padding: 14px 32px;
  background: #FFF;
  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.16);
}
.header__help {
  display: block;
  line-height: 20px;
  font-weight: 500;
  text-decoration: none;
  color: #575757;
  transition-duration: 0.25s;
  transition-property: color;
}
.header__help:hover {
  color: #1097E2;
}
.header__burger {
  display: none;
}
.header__search {
  position: absolute;
  top: 0;
  right: 136px;
  left: 136px;
}
.header__input {
  display: block;
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  padding: 14px 0 14px 32px;
  background: #FFF url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" stroke="%2362727B" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg>') 0 50% no-repeat;
  font-size: 16px;
  line-height: 20px;
  color: #000;
}
.header__input::placeholder {
  color: #62727B;
  transition-duration: 0.25s;
  transition-property: color;
}
.header__input:focus::placeholder {
  color: transparent;
}
@media screen and (max-width: 1279.98px) {
  .header {
    padding-right: 24px;
    padding-left: 24px;
  }
  .header__search {
    right: 120px;
    left: 120px;
  }
}
@media screen and (max-width: 767.98px) {
  .header {
    padding-right: 20px;
    padding-left: 20px;
  }
  .header__help {
    display: none;
  }
  .header__burger {
    display: block;
  }
  .header__search {
    right: 56px;
    left: auto;
    width: auto;
  }
  .header__input {
    width: 20px;
    padding-left: 20px;
    transition-duration: 0.25s;
    transition-property: width, padding;
  }
  .header__input:focus {
    width: calc(100vw - 76px);
    padding-left: 32px;
  }
  .rfeed-header__input::placeholder {
    color: transparent;
  }
}


/**/
/* subheader */
/**/
.subheader {
  padding: 8px 32px;
  background-color: #37474F;
  color: #FFF;
}
.subheader__title {
  padding-left: 26px;
  font-size: 20px;
  line-height: 1.2;
  font-weight: 500;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="%23FFA722" d="M542.22 32.05c-54.8 3.11-163.72 14.43-230.96 55.59-4.64 2.84-7.27 7.89-7.27 13.17v363.87c0 11.55 12.63 18.85 23.28 13.49 69.18-34.82 169.23-44.32 218.7-46.92 16.89-.89 30.02-14.43 30.02-30.66V62.75c.01-17.71-15.35-31.74-33.77-30.7zM264.73 87.64C197.5 46.48 88.58 35.17 33.78 32.05 15.36 31.01 0 45.04 0 62.75V400.6c0 16.24 13.13 29.78 30.02 30.66 49.49 2.6 149.59 12.11 218.77 46.95 10.62 5.35 23.21-1.94 23.21-13.46V100.63c0-5.29-2.62-10.14-7.27-12.99z"></path></svg>') 0 5px/auto 16px no-repeat;
}
.subheader__exit {
  display: block;
  margin-right: -12px;
  padding: 6px 12px;
  border-radius: 4px;
  line-height: 20px;
  font-weight: 500;
  color: #AEC4CE;
  transition-duration: 0.25s;
  transition-property: background, color;
}
.subheader__exit:hover {
  background-color: #2C383F;
  color: #FFF;
}
@media screen and (max-width: 1279.98px) {
  .subheader {
    padding-right: 24px;
    padding-left: 24px;
  }
}
@media screen and (max-width: 767.98px) {
  .subheader {
    padding-right: 20px;
    padding-left: 20px;
  }
  .subheader__title {
    font-size: 16px;
    line-height: 1.25;
    background-position: 0 3px;
  }
}


/**/
/* notification */
/**/
.notification {
  position: relative;
  padding: 9px 40px;
  background-color: #20C0CA;
  font-weight: 500;
  text-align: center;
  color: #FFF;
}
.notification svg {
  display: inline-block;
  vertical-align: top;
  margin-right: 4px;
}
.notification__close {
  position: absolute;
  top: 0;
  right: 0;
  width: 40px;
  height: 40px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" stroke="%23FFF" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>') 50% 50% no-repeat;
  opacity: 0.75;
  transition-duration: 0.25s;
  transition-property: opacity;
}
.notification__close:hover {
  opacity: 1;
}


/**/
/* footer */
/**/
.footer {
  border-top: 1px solid rgba(0, 0, 0, 0.05);
  padding: 20px 0;
  font-size: 14px;
  line-height: 1.5;
  font-weight: 500;
  text-align: center;
}
.footer__link {
  transition-duration: 0.25s;
  transition-property: color;
}
.footer__link:hover {
  color: #23202E;
}
.footer__divider {
  display: inline-block;
  vertical-align: top;
  margin: 0 6px;
}
.footer__divider::before {
  content: '|';
}
@media screen and (max-width: 1023.98px) {
  .footer__divider--md {
    display: block;
  }
  .footer__divider--md::before {
    content: '';
  }
}
@media screen and (max-width: 599.98px) {
  .footer__divider--xs {
    display: block;
  }
  .footer__divider--xs::before {
    content: '';
  }
}




/**/
/* CONTENT ELEMENTS */
/**/


/**/
/* section */
/**/
.section {
  min-height: 200px;
  padding: 40px 0;
  background: url(../img/section/left.svg) 0 100% no-repeat, url(../img/section/right.svg) 100% 100% no-repeat;
}


/**/
/* article */
/**/
.article__head {
  position: relative;
}
.article__head::after {
  content: '';
  position: absolute;
  top: 40px;
  right: 50%;
  bottom: 40px;
  left: 180px;
  margin-right: -100px;
  background: linear-gradient(90deg, rgba(182, 198, 215, 0), #B6C6D7);
  pointer-events: none;
  opacity: 0.4;
}
.article__cover {
  border-radius: 4px;
}
.article__meta {
  font-weight: 500;
}
.article__meta span {
  white-space: nowrap;
}
.article__meta span::after {
  content: ' •';
  padding: 0 4px;
  color: #D8D8D8;
}
.article__meta span:last-child::after {
  display: none;
}
.article__action {
  display: block;
  width: 24px;
  height: 24px;
  background-position: 50% 50%;
  background-size: 24px 24px;
  background-repeat: no-repeat;
}
.article__action--book {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2362727B" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path></svg>');
}
.article__action--book:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2323202E" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path></svg>');
}
.article__action--share {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2362727B" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"></path><polyline points="16 6 12 2 8 6"></polyline><line x1="12" y1="2" x2="12" y2="15"></line></svg>');
}
.article__action--share:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2323202E" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"></path><polyline points="16 6 12 2 8 6"></polyline><line x1="12" y1="2" x2="12" y2="15"></line></svg>');
}
.article__button {
  padding-top: 10px;
  padding-bottom: 10px;
  font-weight: 400;
}
.article__button span {
  display: inline-block;
  vertical-align: top;
  min-width: 68px;
  text-align: left;
}
.article__cont {
  margin-right: 8px;
  color: #37474F;
}
.article__cont h3 {
  margin-top: 40px;
}
.article__cont h3 + p {
  margin-top: 12px;
}
.article__cont p {
  margin-top: 24px;
  font-size: 22px;
}
.article__cont p a {
  font-weight: 500;
  text-decoration: underline;
  color: #1097E2;
}
.article__cont p a:hover {
  text-decoration: none;
}
.article__cont p:first-child {
  margin-top: 0;
}
.article__cont blockquote {
  margin-top: 40px;
  padding: 4px 0 4px 24px;
  border-left: 4px solid #EE2E24;
  color: #23202E;
}
.article__cont blockquote::before {
  content: '';
  display: block;
  width: 32px;
  height: 32px;
  margin-bottom: 16px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="32px" height="32px" viewBox="0 0 32 32"><path fill="%23EE2E24" d="M12.74302,26.15643c-2.7882,2.59242-7.53655,1.90697-9.75978-0.83799 c-2.63128-3.24192-3.15667-9.38633,1.42737-14.88268c2.27374-2.72626,5.01397-4.7933,8.21788-6.20112l1.47765,2.37989 c-4.55767,2.20856-7.96419,5.20302-8.44693,10.22346c2.05637,0,3.76249-0.07449,5.28212,0.46927 c1.73011,0.61908,2.781,1.76722,3.21229,3.0838C14.8378,22.45246,14.50614,24.5171,12.74302,26.15643z M29.26816,26.15643 c-2.7882,2.59242-7.53655,1.90697-9.75978-0.83799c-2.63128-3.24192-3.15667-9.38633,1.42738-14.88268 c2.27374-2.72626,5.01397-4.7933,8.21788-6.20112l1.47765,2.37989c-4.55767,2.20856-7.96419,5.20302-8.44693,10.22346 c2.05637,0,3.76249-0.07449,5.28212,0.46927c1.73011,0.61908,2.781,1.76722,3.21229,3.0838 C31.36294,22.45246,31.03128,24.5171,29.26816,26.15643z"></path></svg>');
  opacity: 0.3;
}
.article__cont .article-question {
  margin-top: 40px;
}
@media screen and (max-width: 1023.98px) {
  .article__title {
    font-size: 32px;
  }
  .article__cover {
    width: 65vw;
    height: auto;
  }
}
@media screen and (max-width: 767.98px) {
  .article__head::after {
    display: none;
  }
  .article__cover {
    width: 100%;
    margin-bottom: 24px;
  }
  .article__cont p {
    font-size: 18px;
  }
}


/**/
/* article share */
/**/
.article-share__item {
  position: relative;
  display: block;
}
.article-share__item img {
  display: block;
  transition-duration: 0.25s;
  transition-property: opacity;
}
.article-share__item img:last-child {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}
.article-share__item:hover img {
  opacity: 0;
}
.article-share__item:hover img:last-child {
  opacity: 1;
}
@media screen and (max-width: 599.98px) {
  .article-share__item img {
    width: 36px;
    height: 36px;
  }
}


/**/
/* article upnext */
/**/
.article-upnext {
  padding: 20px;
  border-radius: 4px;
  background-color: #EAEEF1;
}
@media screen and (max-width: 599.98px) {
  .article-upnext__button {
    margin-top: 20px;
  }
}


/**/
/* article question */
/**/
.article-question {
  position: relative;
  padding: 28px;
  border-radius: 4px;
  background-color: #EEF5F9;
  text-align: center;
}
.article-question__title {
  font-weight: 500;
  color: #37474F;
}
.article-question__button {
  display: block;
  padding: 12px 16px;
  border-radius: 4px;
  background-color: #FFF;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05);
  font-size: 17px;
  font-weight: 500;
  color: #1097E2;
  transition-duration: 0.25s;
  transition-property: background-color, color;
}
.article-question__button:hover {
  background-color: #1097E2;
  color: #FFF;
}
.article-question__close {
  position: absolute;
  top: 12px;
  right: 12px;
  color: #62727B;
  transition-duration: 0.25s;
  transition-property: color;
}
.article-question__close:hover {
  color: #23202E;
}
@media screen and (max-width: 767.98px) {
  .article-question {
    padding: 32px 20px 20px;
  }
}


/**/
/* article contents */
/**/
.article-contents {
  padding-bottom: 8px;
  border-radius: 4px;
  background-color: #F6F8FA;
  font-size: 18px;
  color: #37474F;
}
.article-contents__title {
  padding: 16px 24px;
  border-bottom: 1px solid rgba(219,219,219,0.6);
  font-weight: 500;
  color: #8A939C;
}
.article-contents__link {
  display: block;
  margin: 16px 0;
  padding: 0 24px;
  font-weight: 500;
  transition-duration: 0.25s;
  transition-property: color;
}
.article-contents__link:hover {
  color: #1097E2;
}
.article-contents__link.active {
  box-shadow: 4px 0 0 0 rgba(16, 151, 226, 0.3) inset;
  color: #1097E2;
}
@media screen and (max-width: 767.98px) {
  .article-contents {
    font-size: 16px;
  }
}


/**/
/* article tags */
/**/
.article-tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-right: -8px;
  margin-bottom: -8px;
}
.article-tags__link {
  display: block;
  margin: 0 8px 8px 0;
  padding: 0 16px;
  border-radius: 16px;
  background-color: #EDF5FA;
  font-size: 14px;
  line-height: 32px;
  font-weight: 700;
  color: #1097E2;
  transition-duration: 0.25s;
  transition-property: background, color;
}
.article-tags__link:hover {
  background-color: #1097E2;
  color: #FFF;
}


/**/
/* resource */
/**/
.resource {
  text-align: center;
}
.resource__subtitle {
  max-width: 700px;
  margin-right: auto;
  margin-left: auto;
}
.resource__meta {
  font-weight: 500;
}
.resource__meta span {
  white-space: nowrap;
}
.resource__meta span::after {
  content: ' •';
  padding: 0 4px;
  color: #D8D8D8;
}
.resource__meta span:last-child::after {
  display: none;
}
.resource__action {
  display: block;
  width: 24px;
  height: 24px;
  background-position: 50% 50%;
  background-size: 24px 24px;
  background-repeat: no-repeat;
}
.resource__action--book {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2362727B" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path></svg>');
}
.resource__action--book:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2323202E" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path></svg>');
}
.resource__action--share {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2362727B" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"></path><polyline points="16 6 12 2 8 6"></polyline><line x1="12" y1="2" x2="12" y2="15"></line></svg>');
}
.resource__action--share:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2323202E" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"></path><polyline points="16 6 12 2 8 6"></polyline><line x1="12" y1="2" x2="12" y2="15"></line></svg>');
}
.resource__button {
  padding: 10px 19px;
  font-weight: 400;
}
.resource__button span {
  display: inline-block;
  vertical-align: top;
  min-width: 52px;
  text-align: left;
}
.resource__video {
  position: relative;
  overflow: hidden;
  padding-top: 56.25%;
  border-radius: 12px;
}
.resource__cover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.resource__play {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.resource__play::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 124px;
  height: 124px;
  margin: -62px 0 0 -62px;
  border-radius: 50%;
  background: #EE2E24 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="%23FFFFFF" d="M424.4 214.7L72.4 6.6C43.8-10.3 0 6.1 0 47.9V464c0 37.5 40.7 60.1 72.4 41.3l352-208c31.4-18.5 31.5-64.1 0-82.6z"></path></svg>') 52.5% 50%/32px 32px no-repeat;
  opacity: 0.8;
  transition-duration: 0.25s;
  transition-property: opacity;
}
.resource__play:hover::after {
  opacity: 1;
}
.resource__iframe {
  display: block;
  width: 100%;
  border: none;
  background-color: rgba(0,0,0,0.1);
}
.resource__overlay {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.5));
}
.resource__upnext {
  max-width: 360px;
  padding: 40px;
  border-radius: 4px;
  background-color: #EAEEF1;
  text-align: left;
}
@media screen and (max-width: 767.98px) {
  .resource__play::after {
    width: 72px;
    height: 72px;
    margin: -36px 0 0 -36px;
    background-size: 24px 24px;
  }
}


/**/
/* interested card */
/**/
.interested-card {
  position: relative;
  padding: 20px;
  border-radius: 4px;
  background: #FFFFFF;
  box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.06);
  transition-duration: 0.25s;
  transition-property: box-shadow, transform;
}
.interested-card:hover {
  box-shadow: 0px 6px 16px rgba(0, 0, 0, 0.12);
  transform: translateY(-8px);
}
.interested-card__link {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.interested-card__figure {
  position: relative;
  overflow: hidden;
  margin: -10px -10px 0;
  border-radius: 4px;
}
.interested-card__figure img {
  width: 100%;
  height: auto;
}
.interested-card__figure--video::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 72px;
  height: 72px;
  margin: -36px 0 0 -36px;
  border-radius: 50%;
  background: #EE2E24 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="%23FFFFFF" d="M424.4 214.7L72.4 6.6C43.8-10.3 0 6.1 0 47.9V464c0 37.5 40.7 60.1 72.4 41.3l352-208c31.4-18.5 31.5-64.1 0-82.6z"></path></svg>') 55% 50%/24px 24px no-repeat;
  opacity: 0.9;
}
.interested-card__foot {
  display: flex;
  align-items: center;
}
.interested-card__badge {
  margin-right: 12px;
  padding: 0 12px;
  border-radius: 14px;
  background-color: #E9F4FB;
  line-height: 28px;
  font-weight: 700;
  color: #1097E2;
}
.interested-card__meta {
  margin-right: auto;
  font-weight: 500;
  color: #87979F;
}
.interested-card__action {
  position: relative;
  z-index: 1;
  width: 28px;
  height: 28px;
  margin-right: 12px;
  background-position: 50% 50%;
  background-size: 20px 20px;
  background-repeat: no-repeat;
}
.interested-card__action--book {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2362727B" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path></svg>');
}
.interested-card__action--book:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2323202E" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path></svg>');
}
.interested-card__action--more {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%2362727B" d="M304 256c0 26.5-21.5 48-48 48s-48-21.5-48-48 21.5-48 48-48 48 21.5 48 48zm120-48c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48zm-336 0c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48z"></path></svg>');
}
.interested-card__action--more:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%2323202E" d="M304 256c0 26.5-21.5 48-48 48s-48-21.5-48-48 21.5-48 48-48 48 21.5 48 48zm120-48c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48zm-336 0c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48z"></path></svg>');
}
.interested-card__action--share {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2362727B" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"></path><polyline points="16 6 12 2 8 6"></polyline><line x1="12" y1="2" x2="12" y2="15"></line></svg>');
}
.interested-card__action--share:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2323202E" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"></path><polyline points="16 6 12 2 8 6"></polyline><line x1="12" y1="2" x2="12" y2="15"></line></svg>');
}
.interested-card__action:last-child {
  margin-right: 0;
}
@media screen and (max-width: 767.98px) {
  .interested-card__action {
    margin-right: 8px;
  }
}


/**/
/* notepad */
/**/
.notepad {
  position: absolute;
  z-index: 100;
  right: 40px;
  bottom: 40px;
}
.notepad__toggle {
  position: relative;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: #62727B url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" fill="none"><path d="M20.1247 0H4.15245C2.04134 0 0.333008 1.70833 0.333008 3.81944V25.3472C0.333008 27.4583 2.04134 29.1667 4.15245 29.1667H14.4025L14.708 27.4583C14.8469 26.6806 15.208 25.9861 15.7636 25.4167L23.9441 17.25V3.81944C23.9441 1.70833 22.2358 0 20.1247 0V0ZM5.88856 5.55556H11.4441C12.208 5.55556 12.833 6.18056 12.833 6.94444C12.833 7.70833 12.208 8.33333 11.4441 8.33333H5.88856C5.12467 8.33333 4.49967 7.70833 4.49967 6.94444C4.49967 6.18056 5.12467 5.55556 5.88856 5.55556ZM12.833 19.4444H5.88856C5.12467 19.4444 4.49967 18.8194 4.49967 18.0556C4.49967 17.2917 5.12467 16.6667 5.88856 16.6667H12.833C13.5969 16.6667 14.2219 17.2917 14.2219 18.0556C14.2219 18.8194 13.5969 19.4444 12.833 19.4444ZM18.3886 13.8889H5.88856C5.12467 13.8889 4.49967 13.2639 4.49967 12.5C4.49967 11.7361 5.12467 11.1111 5.88856 11.1111H18.3886C19.1525 11.1111 19.7775 11.7361 19.7775 12.5C19.7775 13.2639 19.1525 13.8889 18.3886 13.8889Z" fill="white"/><path d="M17.7325 33.3333C17.4589 33.3333 17.1923 33.225 16.9964 33.0277C16.7561 32.7875 16.6478 32.4458 16.7075 32.1097L17.4436 27.9361C17.4798 27.7264 17.5825 27.5319 17.7325 27.3805L28.0451 17.0695C29.3117 15.8 30.5562 16.1431 31.2368 16.8236L32.9548 18.5417C33.9034 19.4889 33.9034 21.0306 32.9548 21.9792L22.6423 32.2916C22.4923 32.443 22.2978 32.5444 22.0867 32.5805L17.9131 33.3166C17.8534 33.3277 17.7923 33.3333 17.7325 33.3333ZM21.9062 31.5555H21.9201H21.9062Z" fill="white"/></svg>') 50% 50% no-repeat;
  box-shadow: 0px 8px 24px rgba(131, 151, 158, 0.7);
  transition-duration: 0.25s;
  transition-property: background;
}
.notepad__toggle i {
  position: absolute;
  top: 3px;
  right: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 3px solid #FFF;
  background-color: #20C0CA;
}
.notepad.active .notepad__toggle {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="32" height="32" stroke="white" stroke-width="2.25" fill="none" stroke-linecap="round" stroke-linejoin="round" class="css-i6dzq1"><polyline points="6 9 12 15 18 9"></polyline></svg>');
}
.notepad__window {
  position: absolute;
  right: 0;
  bottom: 92px;
  width: 352px;
  overflow: hidden;
  border-radius: 8px;
  background-color: #FFF;
  box-shadow: 0px 2px 5px rgba(98, 114, 123, 0.2), 0px 14px 34px rgba(98, 114, 123, 0.2);
  pointer-events: none;
  opacity: 0;
  transition-duration: 0.25s;
  transition-property: opacity;
}
.notepad.active .notepad__window {
  pointer-events: auto;
  opacity: 1;
}
.notepad__head {
  position: relative;
  padding: 10px 16px;
  background-color: #37474F;
  line-height: 1.5;
  font-weight: 700;
  color: #FFF;
}
.notepad__head span {
  margin-left: 0.25em;
  font-weight: 400;
  opacity: 0.5;
}
.notepad__format {
  display: flex;
  align-items: center;
  height: 42px;
  padding: 0 16px;
  background-color: #EDF0F5;
}
.notepad__format svg {
  height: 16px;
  margin-right: 16px;
  cursor: pointer;
}
.notepad__textarea {
  width: 100%;
  height: 280px;
  padding: 16px;
  font-size: 16px;
  line-height: 20px;
  font-weight: 500;
  color: #37474F;
  resize: none;
}
@media screen and (max-width: 767.98px) {
  .notepad {
    right: 20px;
    bottom: 20px;
  }
}


/**/
/* tutorial */
/**/
.tutorial {
  position: relative;
  max-width: 420px;
  padding: 20px;
  border-radius: 4px;
  background-color: #FFF;
  box-shadow: 0px 2px 7px rgba(68, 82, 97, 0.4), 0px 10px 34px rgba(191, 205, 219, 0.4);
}
.tutorial::after {
  content: '';
  position: absolute;
  top: 20px;
  right: 100%;
  border-top: 7px solid transparent;
  border-right: 7px solid #FFF;
  border-bottom: 7px solid transparent;
}
.tutorial__end {
  font-weight: 500;
  color: #1097E2;
}
.tutorial__end:hover {
  text-decoration: underline;
}
.tutorial__num {
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #20C0CA;
}
.tutorial--left::after {
  top: 50%;
  right: auto;
  left: 100%;
  margin-top: -7px;
  border-right: 0;
  border-left: 7px solid #FFF;
}
@media screen and (max-width: 767.98px) {
  .tutorial::after {
    top: auto;
    right: 50%;
    bottom: 100%;
    margin: 0 -7px 0 0;
    border-top: 0;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #FFF;
    border-left: 7px solid transparent;
  }
  .tutorial--left::after {
    top: 100%;
    right: 40px;
    bottom: auto;
    left: auto;
    border-top: 7px solid #FFF;
    border-bottom: 0;
  }
}




/**/
/* ON BOARDING */
/**/


/**/
/* onboard */
/**/
.onboard {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.onboard__slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: #F6F8FA;
  background-image: url(../img/onboard-quiz/bg-left.svg), url(../img/onboard-quiz/bg-right.svg);
  background-position: 0 100%, 100% 100%;
  background-repeat: no-repeat;
  transform: translateY(100%);
  transition-duration: 0.75s;
  transition-property: 
}
.onboard__slide.current {
  transform: none;
}
.onboard__slide.passed {
  transform: translateY(-100%);
}


/**/
/* onboard header */
/**/
.onboard-header {
  padding: 24px 0;
}
.onboard-header__logo {
  display: inline-block;
  vertical-align: top;
}
.onboard-header__back {
  text-align: center;
}
@media screen and (max-width: 1279.98px) {
  .onboard-header {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .onboard-header__back svg:first-child {
    margin-right: -4px;
  }
  .onboard-header__back span {
    display: none;
  }
}
@media screen and (max-width: 1023.98px) {
  .onboard-header__back {
    text-align: left;
  }
  .onboard-header__progress {
    margin: 24px 24px 0;
  }
}
@media screen and (max-width: 599.98px) {
  .onboard-header__logo {
    width: auto;
    height: 18px;
  }
}


/**/
/* onboard intro */
/**/
.onboard-intro {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  background: #FFF url(../img/onboard-intro/bg.svg) 0 100% no-repeat;
  align-items: center;
}
.onboard-intro__head {
  position: absolute;
  z-index: 1;
  top: 0;
  right: 0;
  left: 0;
  padding: 16px 32px;
  background: #FFF;
  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.16);
}
.onboard-intro__cont {
  flex-grow: 1;
  max-width: 1204px;
}
.onboard-intro__cards {
  position: relative;
  width: 341px;
  height: 436px;
}
.onboard-intro__cards::before {
  content: '';
  position: absolute;
  top: -464px;
  left: -229px;
  width: 764px;
  height: 1468px;
  background: url(../img/onboard-intro/cards@2x.png) 50% 50%/100% 100%;
}
.onboard-intro__subtitle {
  margin-top: 24px;
}
.onboard-intro__button {
  margin-top: 40px;
}
@media screen and (max-width: 1279.98px) {
  .onboard-intro__head {
    padding-right: 24px;
    padding-left: 24px;
  }
}
@media screen and (max-width: 1023.98px) {
  .onboard-intro {
    text-align: center;
  }
}


/**/
/* onboard saved */
/**/
.onboard-saved {
  position: relative;
  display: inline-block;
  vertical-align: top;
}
.onboard-saved__toggle {
  display: flex;
  align-items: center;
  border-radius: 26px;
  background-color: #FFF;
  padding: 10px 20px 10px 12px;
  font-size: 15px;
  line-height: 32px;
  font-weight: 500;
  text-align: center;
  white-space: nowrap;
  color: #23202E;
}
.onboard-saved__counter {
  width: 32px;
  height: 32px;
  margin-right: 12px;
  border-radius: 50%;
  background-color: #E4E9EE;
  font-size: 16px;
  line-height: 32px;
  font-weight: 500;
  transition-duration: 0.25s;
  transition-property: background-color, color;
}
.onboard-saved__counter.active {
  background-color: #20C0CA;
  color: #FFF;
}
.onboard-saved__item {
  position: absolute;
  z-index: 10;
  top: 100%;
  left: 50%;
  width: 160px;
  margin-top: 32px;
  margin-left: -80px;
  padding: 0 12px 12px;
  overflow: hidden;
  border-radius: 4px;
  background-color: #FFF;
  box-shadow: 0 12px 32px rgba(46,79,103,0.15);
  transform: rotate(-3deg);
}
.onboard-saved__figure {
  position: relative;
  margin: 0 -12px 12px;
}
.onboard-saved__image {
  margin-left: -68px;
}
.onboard-saved__badge {
  position: absolute;
  top: 6px;
  left: 6px;
  padding: 0 8px;
  border-radius: 7px;
  background-color: #FFF;
  font-size: 8px;
  line-height: 14px;
  font-weight: 500;
  color: #6F6F6F;
}
.onboard-saved__star {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #000 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="8" viewBox="0 0 24 24" stroke="%23FFF" stroke-width="3" fill="none" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon></svg>') 50% 50% no-repeat;
}
.onboard-saved__line {
  height: 6px;
  margin-bottom: 6px;
  background: #E4E4E4;
}
.onboard-saved__line:last-child {
  width: 50%;
  margin-bottom: 0;
}
.onboard-saved__item ~ .onboard-saved__item {
  z-index: 9;
  opacity: 0.6;
  transform: rotate(17deg);
}
.onboard-saved__item ~ .onboard-saved__item ~ .onboard-saved__item {
  z-index: 8;
  opacity: 0.4;
  transform: rotate(-13deg);
}
@media screen and (max-width: 767.98px) {
  .onboard-saved__toggle {
    padding: 4px 12px 4px 4px;
    font-size: 14px;
    line-height: 28px;
  }
  .onboard-saved__counter {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    font-size: 14px;
    line-height: 28px;
  }
}


/**/
/* onboard progress */
/**/
.onboard-progress {
  display: flex;
  align-items: center;
  font-weight: 700;
  transition-duration: 0.25s;
  transition-property: opacity;
}
.onboard-progress__bar {
  height: 6px;
  margin-top: 1px;
  border-radius: 3px;
  background-color: #E8ECF0;
  transition-duration: 0.375s;
  transition-property: width;
}
.onboard-progress__bar--left {
  margin-right: 6px;
  background: linear-gradient(270deg, #1097E2 0%, #58C1FC 100%);
}
.onboard-progress__bar--right {
  margin-left: 6px;
}
.onboard-progress__bar[style="width: 0%"] {
  margin: 0;
}


/**/
/* onboard questionnaire */
/**/
.onboard-questionnaire {
  position: relative;
  max-width: 868px;
  min-height: 0;
  margin-right: auto;
  margin-left: auto;
  border-bottom: 24px solid transparent;
  transition-duration: 0.375s;
  transition-property: min-height;
}
.onboard-questionnaire__item {
  position: absolute;
  z-index: 10;
  top: 0;
  left: 0;
  width: 100%;
  padding: 39px;
  overflow: hidden;
  border-radius: 8px;
  border: 1px solid #EBEBEB;
  background: #FFFFFF;
  box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.05);
  text-align: left;
  transform-origin: 50% 100%;
  transition-duration: 0.375s;
}
.onboard-questionnaire__item::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 50%;
  background-color: #F9FCFD;
}
.onboard-questionnaire__item:first-child {
  position: relative;
}
.onboard-questionnaire__item.active {
  pointer-events: auto;
}
.onboard-questionnaire__item.active ~ .onboard-questionnaire__item {
  z-index: 9;
  margin-top: 12px;
  pointer-events: none;
  transform: scale(0.9);
}
.onboard-questionnaire__item.active ~ .onboard-questionnaire__item ~ .onboard-questionnaire__item {
  z-index: 8;
  margin-top: 24px;
  transform: scale(0.81);
}
.onboard-questionnaire__item.passed {
  pointer-events: none;
  opacity: 0;
}
.onboard-questionnaire__overline {
  margin-bottom: 8px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #20C0CA;
}
.onboard-questionnaire__heading {
  margin-right: 40px;
}
.onboard-questionnaire__row {
  position: relative;
  height: 480px;
}
.onboard-questionnaire__answer {
  position: relative;
  min-height: 62px;
  display: flex;
  align-items: center;
  margin-top: 16px;
  margin-left: 40px;
  padding: 12px 60px 12px 16px;
  border-radius: 6px;
  border: 1px solid rgba(206, 216, 223, 0.5);
  background-color: #FFF;
  box-shadow: 0px 2px 6px rgba(194, 208, 222, 0.1), 0px 1px 2px rgba(194, 208, 222, 0.35);
  font-size: 16px;
  line-height: 1.25;
  font-weight: 500;
  color: #37474F;
  cursor: pointer;
  transition-duration: 0.25s;
  transition-property: border-color, background-color, color;
}
.onboard-questionnaire__answer:hover,
.onboard-questionnaire__answer:focus,
.onboard-questionnaire__answer.focus {
  border-color: #20C0CA;
  background-color: #20C0CA;
  color: #FFF;
}
.onboard-questionnaire__answer span {
  position: absolute;
  top: 50%;
  right: 16px;
  width: 28px;
  height: 28px;
  margin-top: -14px;
  border-radius: 2px;
  background-color: #EBEEF0;
  line-height: 28px;
  text-align: center;
  color: #62727B;
  transition-duration: 0.25s;
  transition-property: background-color, color;
}
.onboard-questionnaire__answer:hover span,
.onboard-questionnaire__answer:focus span {
  background: rgba(0,0,0,0.1);
  color: #FFF;
}
.onboard-questionnaire__answer:first-child {
  margin-top: 0;
}
@media screen and (max-width: 1023.98px) {
  .onboard-questionnaire {
    border-bottom: 0;
  }
  .onboard-questionnaire__row {
    height: auto;
  }
  .onboard-questionnaire__item::before {
    display: none;
  }
  .onboard-questionnaire__item.active ~ .onboard-questionnaire__item {
    opacity: 0;
    transform: none;
  }
  .onboard-questionnaire__item.active ~ .onboard-questionnaire__item ~ .onboard-questionnaire__item {
    opacity: 0;
    transform: none;
  }
  .onboard-questionnaire__heading {
    margin-right: 0;
  }
  .onboard-questionnaire__answers {
    margin: 40px -40px -40px;
    padding: 40px;
    background-color: #F9FCFD;
  }
  .onboard-questionnaire__answer {
    margin-left: 0;
  }
}
@media screen and (max-width: 767.98px) {
  .onboard-questionnaire__item {
    padding: 31px;
  }
  .onboard-questionnaire__answers {
    margin: 32px -32px -32px;
    padding: 32px;
  }
}
@media screen and (max-width: 599.98px) {
  .onboard-questionnaire__item {
    padding: 23px;
  }
  .onboard-questionnaire__answers {
    margin: 24px -24px -24px;
    padding: 24px;
  }
}


/**/
/* onboard interest */
/**/
.onboard-interest {
  position: relative;
  max-width: 390px;
  margin-top: 48px;
  margin-right: auto;
  margin-left: auto;
}
.onboard-interest__item {
  position: absolute;
  z-index: 10;
  top: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
  border-radius: 4px;
  border: 1px solid #EBEBEB;
  background: #FFF;
  box-shadow: 0px 9px 18px rgba(0, 0, 0, 0.04);
  text-align: left;
  transition-duration: 0.75s;
}
.onboard-interest__item:first-child {
  position: relative;
}
.onboard-interest__item.active ~ .onboard-interest__item {
  z-index: 9;
  opacity: 0.5;
  transform: rotate(3deg);
}
.onboard-interest__item.active ~ .onboard-interest__item ~ .onboard-interest__item {
  z-index: 8;
  transform: rotate(-5deg);
}
.onboard-interest__item.saved {
  margin-left: 390px;
  border-color: #20C0CA;
  box-shadow: 0px 9px 18px rgba(0, 0, 0, 0.04), 0 0 0 3px #20C0CA;
  opacity: 0;
  transform: rotate(7deg);
}
.onboard-interest__item.discard {
  margin-left: -390px;
  border-color: #EE2E24;
  box-shadow: 0px 9px 18px rgba(0, 0, 0, 0.04), 0 0 0 3px #EE2E24;
  pointer-events: none;
  opacity: 0;
  transform: rotate(-7deg);
}
.onboard-interest__image {
  display: block;
}
.onboard-interest__badge {
  position: absolute;
  top: 8px;
  left: 8px;
  padding: 0 12px;
  border-radius: 13px;
  background-color: #FFF;
  font-size: 13px;
  line-height: 26px;
  font-weight: 500;
}
.onboard-interest__cont {
  padding: 20px 19px 36px;
}
.onboard-interest__summary {
  margin-top: 20px;
}
.onboard-interest__action {
  width: 100%;
  margin-top: 56px;
}
@media screen and (max-width: 767.98px) {
  .onboard-interest__image {
    max-width: 100%;
    height: auto;
  }
  .onboard-interest__cont {
    padding: 20px 19px 19px;
  }
  .onboard-interest__summary {
    margin-top: 8px;
  }
}


/**/
/* onboard hotkeys */
/**/
.onboard-hotkeys {
  font-size: 14px;
  line-height: 20px;
}
.onboard-hotkeys__button {
  display: inline-block;
  vertical-align: top;
  min-width: 20px;
  margin: 0 2px;
  padding: 0 4px;
  border-radius: 2px;
  background: #EBEEF0;
  text-align: center;
}


/**/
/* onboard quiz */
/**/
.onboard-quiz__head {
  position: absolute;
  z-index: 10;
  top: 0;
  right: 0;
  left: 0;
  padding: 24px 32px;
}
.onboard-quiz__slide {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  align-items: center;
  pointer-events: none;
  opacity: 0;
  transition-delay: 0.5s;
  transition-duration: 0.5s;
  transition-property: opacity;
}
.onboard-quiz__slide.active {
  pointer-events: auto;
  opacity: 1;
}
.onboard-quiz__cont {
  flex-grow: 1;
  padding: 100px 0 52px;
  text-align: center;
}
.onboard-quiz__footer {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
}
.onboard-quiz__slide.active + .onboard-quiz__head .onboard-quiz__back {
  pointer-events: none;
  opacity: 0;
  transition-delay: 0.5s;
}
.onboard-quiz__slide.active + .onboard-quiz__head .onboard-progress {
  pointer-events: none;
  opacity: 0;
  transition-delay: 0.5s;
}
.onboard-quiz__slide.active + .onboard-quiz__head + .onboard-quiz__footer {
  pointer-events: none;
  opacity: 0;
  transition-delay: 0.5s;
}
@media screen and (max-width: 1279.98px) {
  .onboard-quiz__head {
    padding-right: 24px;
    padding-left: 24px;
  }
  .onboard-quiz__back svg {
    margin-right: -6px;
  }
  .onboard-quiz__back span {
    display: none;
  }
  .onboard-quiz__foot {
    padding-right: 24px;
    padding-left: 24px;
  }
}


/**/
/* onboard callout */
/**/
.onboard-callout {
  max-width: 384px;
  margin: 0 auto;
}
.onboard-callout__subtitle {
  margin-top: 20px;
}
.onboard-callout__label {
  margin-top: 20px;
}
.onboard-callout__input {
  margin-top: 32px;
  text-align: left;
}
.onboard-callout__button {
  margin-top: 32px;
}
.onboard-callout__footnote {
  margin: 120px -64px -20px;
}


/**/
/* onboard footer */
/**/
.onboard-footer {
  padding: 16px 32px;
  background-color: #EAEEF1;
  font-size: 14px;
  line-height: 20px;
  text-align: right;
  transition-duration: 0.25s;
  transition-property: opacity;
}
.onboard-footer__link {
  text-decoration: none;
  transition-duration: 0.25s;
  transition-property: color;
}
.onboard-footer__link:hover {
  color: #23202E;
}
.onboard-footer__link svg {
  display: inline-block;
  vertical-align: top;
  margin-left: 4px;
}
@media screen and (max-width: 1279.98px) {
  .onboard-footer {
    padding-right: 24px;
    padding-left: 24px;
  }
}
@media screen and (max-width: 767.98px) {
  .onboard-footer {
    padding-right: 20px;
    padding-left: 20px;
  }
}




/**/
/* RESOURCE FEED */
/**/


/**/
/* rfeed */
/**/
.rfeed {
  padding-top: 80px;
  padding-bottom: 32px;
}
@media screen and (max-width: 767.98px) {
  .rfeed {
    padding-top: 72px;
  }
}


/**/
/* rfeed welcome */
/**/
.rfeed-welcome {
  position: relative;
  overflow: hidden;
  margin-bottom: 24px;
  padding: 28px 28px 36px;
  border-radius: 4px;
  background: linear-gradient(263deg, #CFDBE7 -108.15%, #FFF4F3 102.43%);
  text-align: center;
}
.rfeed-welcome::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 228px;
  height: 164px;
  background-image: url(../img/rfeed-welcome/bg.svg);
  background-size: 100% 100%;
}
.rfeed-welcome__title {
  position: relative;
}
.rfeed-welcome__subtitle {
  position: relative;
  max-width: 416px;
  margin: 12px auto 0;
}
.rfeed-welcome__subtitle a {
  font-weight: 500;
  transition-duration: 0.25s;
  transition-property: color;
}
.rfeed-welcome__subtitle a:hover {
  color: #1097E2;
}
.rfeed-welcome__close {
  position: absolute;
  top: 12px;
  right: 12px;
  transition-duration: 0.25s;
  transition-property: color;
}
.rfeed-welcome__close:hover {
  color: #23202E;
}
@media screen and (max-width: 767.98px) {
  .rfeed-welcome {
    margin-bottom: 16px;
    padding: 24px;
  }
  .rfeed-welcome::before {
    width: 171px;
    height: 123px;
  }
}


/**/
/* rfeed lesson */
/**/
.rfeed-lesson {
  position: relative;
  margin-bottom: 24px;
  padding: 16px 24px 24px;
  border-radius: 4px;
  background-color: #37474F;
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.06);
  color: #FFF;
  transition-duration: 0.25s;
  transition-property: box-shadow, transform;
}
.rfeed-lesson:hover {
  box-shadow: 0px 6px 16px rgba(0, 0, 0, 0.12);
  transform: translateY(-8px);
}
.rfeed-lesson__link {
  position: absolute;
  z-index: 1;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.rfeed-lesson__head {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
}
.rfeed-lesson__badge {
  margin-right: 12px;
  padding: 0 14px;
  border-radius: 14px;
  background-color: #273339;
  font-size: 14px;
  line-height: 28px;
  font-weight: 500;
}
.rfeed-lesson__badge::before {
  content: '';
  display: inline-block;
  vertical-align: top;
  width: 14px;
  height: 12px;
  margin: 8px 6px 8px -4px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="%23FFA722" d="M542.22 32.05c-54.8 3.11-163.72 14.43-230.96 55.59-4.64 2.84-7.27 7.89-7.27 13.17v363.87c0 11.55 12.63 18.85 23.28 13.49 69.18-34.82 169.23-44.32 218.7-46.92 16.89-.89 30.02-14.43 30.02-30.66V62.75c.01-17.71-15.35-31.74-33.77-30.7zM264.73 87.64C197.5 46.48 88.58 35.17 33.78 32.05 15.36 31.01 0 45.04 0 62.75V400.6c0 16.24 13.13 29.78 30.02 30.66 49.49 2.6 149.59 12.11 218.77 46.95 10.62 5.35 23.21-1.94 23.21-13.46V100.63c0-5.29-2.62-10.14-7.27-12.99z"></path></svg>') 50% 50%/auto 12px no-repeat;
}
.rfeed-lesson__time {
  padding-left: 24px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" stroke="%2377D8DE" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg>') 0 50% no-repeat;
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
}
.rfeed-lesson__actions {
  position: absolute;
  z-index: 1;
  top: 16px;
  right: 24px;
  display: flex;
  margin-left: auto;
}
.rfeed-lesson__action {
  width: 28px;
  height: 28px;
  margin-left: 12px;
  background-position: 50% 50%;
  background-size: 20px 20px;
  background-repeat: no-repeat;
}
.rfeed-lesson__action--book {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%23AEC4CE" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path></svg>');
}
.rfeed-lesson__action--book:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%231097E2" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path></svg>');
}
.rfeed-lesson__action--more {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%23AEC4CE" d="M304 256c0 26.5-21.5 48-48 48s-48-21.5-48-48 21.5-48 48-48 48 21.5 48 48zm120-48c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48zm-336 0c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48z"></path></svg>');
}
.rfeed-lesson__action--more:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%231097E2" d="M304 256c0 26.5-21.5 48-48 48s-48-21.5-48-48 21.5-48 48-48 48 21.5 48 48zm120-48c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48zm-336 0c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48z"></path></svg>');
}
.rfeed-lesson__action--share {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%23AEC4CE" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"></path><polyline points="16 6 12 2 8 6"></polyline><line x1="12" y1="2" x2="12" y2="15"></line></svg>');
}
.rfeed-lesson__action--share:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%231097E2" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"></path><polyline points="16 6 12 2 8 6"></polyline><line x1="12" y1="2" x2="12" y2="15"></line></svg>');
}
.rfeed-lesson__action:first-child {
  margin-left: 0;
}
.rfeed-lesson__image {
  position: absolute;
  right: 0;
  bottom: 0;
}
.rfeed-lesson__title {
  color: #FFF;
}
.rfeed-lesson__subtitle {
  margin-top: 12px;
  margin-right: 160px;
}
.rfeed-lesson__button {
  margin-top: 24px;
}
@media screen and (max-width: 767.98px) {
  .rfeed-lesson {
    margin-right: -20px;
    margin-bottom: 16px;
    margin-left: -20px;
    padding-right: 20px;
    padding-bottom: 0;
    padding-left: 20px;
    border-radius: 0;
  }
  .rfeed-lesson__actions {
    position: relative;
    top: auto;
    right: auto;
    margin: 16px -20px 0;
    padding: 12px 16px;
    border-top: 1px solid rgba(255,255,255,0.1);
  }
  .rfeed-lesson__action:last-child {
    margin-left: auto;
  }
  .rfeed-lesson__image {
    display: none;
  }
  .rfeed-lesson__subtitle {
    margin-top: 8px;
    margin-right: 0;
  }
  .rfeed-lesson__button {
    margin-top: 16px;
  }
}


/**/
/* rfeed lesson completed */
/**/
.rfeed-lesson-completed {
  position: relative;
  padding: 28px;
  border-radius: 4px;
  background: #37474F url(../img/rfeed-lesson-completed/bg.svg) 100% 0 no-repeat;
  background-blend-mode: overlay;
  text-align: center;
  color: #FFF;
}
.rfeed-lesson-completed__title {
  color: inherit;
}
.rfeed-lesson-completed__title::before {
  content: '';
  display: inline-block;
  vertical-align: top;
  width: 30px;
  height: 30px;
  margin-right: 8px;
  margin-left: -4px;
  background: url(../img/rfeed-lesson-completed/badge.svg);
}
.rfeed-lesson-completed__subtitle {
  margin-top: 12px;
  color: #A5BECA;
}
.rfeed-lesson-completed__footnote {
  margin: 16px 0 -4px;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,0.25);
}
.rfeed-lesson-completed__close {
  position: absolute;
  top: 12px;
  right: 12px;
  transition-duration: 0.25s;
  transition-property: color;
}
@media screen and (max-width: 767.98px) {
  .rfeed-lesson-completed {
    margin-bottom: 16px;
    padding: 24px;
  }
}


/**/
/* rfeed article */
/**/
.rfeed-article {
  position: relative;
  margin-bottom: 24px;
  padding: 16px 24px 24px;
  border-radius: 4px;
  background-color: #FFF;
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.06);
  transition-duration: 0.25s;
  transition-property: box-shadow, transform;
}
.rfeed-article:hover {
  box-shadow: 0px 6px 16px rgba(0, 0, 0, 0.12);
  transform: translateY(-8px);
}
.rfeed-article__link {
  position: absolute;
  z-index: 1;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.rfeed-article__head {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
}
.rfeed-article__badge {
  margin-right: 12px;
  padding: 0 14px;
  border-radius: 14px;
  background-color: #E9F4FB;
  line-height: 28px;
  font-weight: 700;
  color: #1097E2;
}
.rfeed-article__date {
  font-weight: 500;
  color: #87979F;
}
.rfeed-article__bull {
  width: 4px;
  height: 4px;
  margin: 0 8px;
  border-radius: 50%;
  background-color: #D8D8D8;
}
.rfeed-article__subtitle {
  margin-top: 8px;
}
.rfeed-article__figure {
  position: relative;
  overflow: hidden;
  margin: 16px -12px -12px;
  border-radius: 2px;
  box-shadow: 0px 4px 14px rgba(0, 0, 0, 0.05);
}
.rfeed-article__figure--video::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 72px;
  height: 72px;
  margin: -36px 0 0 -36px;
  border-radius: 50%;
  background: #EE2E24 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="%23FFFFFF" d="M424.4 214.7L72.4 6.6C43.8-10.3 0 6.1 0 47.9V464c0 37.5 40.7 60.1 72.4 41.3l352-208c31.4-18.5 31.5-64.1 0-82.6z"></path></svg>') 55% 50%/24px 24px no-repeat;
  opacity: 0.9;
}
.rfeed-article__figure--video::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.6));
}
.rfeed-article__image {
  max-width: 100%;
}
.rfeed-article__actions {
  position: absolute;
  z-index: 1;
  top: 16px;
  right: 24px;
  display: flex;
  margin-left: auto;
}
.rfeed-article__action {
  width: 28px;
  height: 28px;
  margin-left: 12px;
  background-position: 50% 50%;
  background-size: 20px 20px;
  background-repeat: no-repeat;
}
.rfeed-article__action--book {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2362727B" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path></svg>');
}
.rfeed-article__action--book:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%231097E2" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path></svg>');
}
.rfeed-article__action--more {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%2362727B" d="M304 256c0 26.5-21.5 48-48 48s-48-21.5-48-48 21.5-48 48-48 48 21.5 48 48zm120-48c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48zm-336 0c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48z"></path></svg>');
}
.rfeed-article__action--more:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%231097E2" d="M304 256c0 26.5-21.5 48-48 48s-48-21.5-48-48 21.5-48 48-48 48 21.5 48 48zm120-48c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48zm-336 0c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48z"></path></svg>');
}
.rfeed-article__action--share {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2362727B" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"></path><polyline points="16 6 12 2 8 6"></polyline><line x1="12" y1="2" x2="12" y2="15"></line></svg>');
}
.rfeed-article__action--share:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%231097E2" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"></path><polyline points="16 6 12 2 8 6"></polyline><line x1="12" y1="2" x2="12" y2="15"></line></svg>');
}
.rfeed-article__action:first-child {
  margin-left: 0;
}
@media screen and (max-width: 767.98px) {
  .rfeed-article {
    margin-right: -20px;
    margin-bottom: 16px;
    margin-left: -20px;
    padding-right: 20px;
    padding-bottom: 0;
    padding-left: 20px;
    border-radius: 0;
  }
  .rfeed-article__head {
    margin-bottom: 12px;
  }
  .rfeed-article__subtitle {
    margin-top: 8px;
    margin-right: 0;
  }
  .rfeed-article__figure {
    margin-right: -8px;
    margin-bottom: 0;
    margin-left: -8px;
  }
  .rfeed-article__figure--video::after {
    width: 60px;
    height: 60px;
    margin: -30px 0 0 -30px;
    background-size: 20px 20px;
  }
  .rfeed-article__image {
    height: auto;
  }
  .rfeed-article__actions {
    position: relative;
    top: auto;
    right: auto;
    margin: 0 -4px;
    padding: 12px 0;
  }
  .rfeed-article__action:last-child {
    margin-left: auto;
  }
}


/**/
/* rfeed featured */
/**/
.rfeed-featured {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 460px;
  margin-bottom: 24px;
  padding: 16px 24px 24px;
  border-radius: 4px;
  background-position: 50% 50%;
  background-size: cover;
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.06);
  transition-duration: 0.25s;
  transition-property: box-shadow, transform;
}
.rfeed-featured:hover {
  box-shadow: 0px 6px 16px rgba(0, 0, 0, 0.12);
  transform: translateY(-8px);
}
.rfeed-featured__link {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.rfeed-featured__head {
  display: flex;
  align-items: center;
  margin-bottom: auto;
}
.rfeed-featured__badge {
  margin-right: 12px;
  padding: 0 14px;
  border-radius: 14px;
  background-color: rgba(0,0,0,0.6);;
  line-height: 28px;
  font-weight: 700;
  color: #FFF;
}
.rfeed-featured__badge::before {
  content: '';
  display: inline-block;
  vertical-align: top;
  width: 13px;
  height: 12px;
  margin: 8px 6px 8px -4px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="%23FFBB55" d="M259.3 17.8L194 150.2 47.9 171.5c-26.2 3.8-36.7 36.1-17.7 54.6l105.7 103-25 145.5c-4.5 26.3 23.2 46 46.4 33.7L288 439.6l130.7 68.7c23.2 12.2 50.9-7.4 46.4-33.7l-25-145.5 105.7-103c19-18.5 8.5-50.8-17.7-54.6L382 150.2 316.7 17.8c-11.7-23.6-45.6-23.9-57.4 0z"></path></svg>') 50% 50%/auto 12px no-repeat;
}
.rfeed-featured__date {
  font-weight: 500;
  text-shadow: 0px 1px 8px rgba(0, 0, 0, 0.7);
  color: #FFF;
}
.rfeed-featured__cont {
  margin: -12px;
  padding: 16px;
  border-radius: 2px;
  background: rgba(255,255,255,0.95);
}
.rfeed-featured__subtitle {
  margin-top: 8px;
}
.rfeed-featured__actions {
  position: absolute;
  top: 16px;
  right: 24px;
  display: flex;
  margin-left: auto;
}
.rfeed-featured__action {
  width: 28px;
  height: 28px;
  margin-left: 12px;
  background-position: 50% 50%;
  background-size: 20px 20px;
  background-repeat: no-repeat;
}
.rfeed-featured__action--book {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%23FFFFFF" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path></svg>');
}
.rfeed-featured__action--book:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%231097E2" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path></svg>');
}
.rfeed-featured__action--more {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%23FFFFFF" d="M304 256c0 26.5-21.5 48-48 48s-48-21.5-48-48 21.5-48 48-48 48 21.5 48 48zm120-48c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48zm-336 0c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48z"></path></svg>');
}
.rfeed-featured__action--more:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%231097E2" d="M304 256c0 26.5-21.5 48-48 48s-48-21.5-48-48 21.5-48 48-48 48 21.5 48 48zm120-48c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48zm-336 0c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48z"></path></svg>');
}
.rfeed-featured__action--share {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%23FFFFFF" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"></path><polyline points="16 6 12 2 8 6"></polyline><line x1="12" y1="2" x2="12" y2="15"></line></svg>');
}
.rfeed-featured__action--share:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%231097E2" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"></path><polyline points="16 6 12 2 8 6"></polyline><line x1="12" y1="2" x2="12" y2="15"></line></svg>');
}
.rfeed-featured__action:first-child {
  margin-left: 0;
}
@media screen and (max-width: 767.98px) {
  .rfeed-featured {
    margin-right: -20px;
    margin-bottom: 16px;
    margin-left: -20px;
    padding-right: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
    border-radius: 0;
  }
  .rfeed-featured__cont {
    margin: 0 -8px;
    padding: 16px 20px 0;
    border-radius: 2px 2px 0 0;
  }
  .rfeed-featured__actions {
    position: relative;
    top: auto;
    right: auto;
    margin: 0 -8px -8px;
    padding: 12px 16px;
    border-radius: 0 0 2px 2px;
    background: rgba(255,255,255,0.95);
  }
  .rfeed-featured__action--book {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2362727B" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path></svg>');
  }
  .rfeed-featured__action--more {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%2362727B" d="M304 256c0 26.5-21.5 48-48 48s-48-21.5-48-48 21.5-48 48-48 48 21.5 48 48zm120-48c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48zm-336 0c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48z"></path></svg>');
  }
  .rfeed-featured__action--share {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2362727B" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"></path><polyline points="16 6 12 2 8 6"></polyline><line x1="12" y1="2" x2="12" y2="15"></line></svg>');
  }
  .rfeed-featured__action:last-child {
    margin-left: auto;
  }
}


/**/
/* rfeed saved resources */
/**/
.rfeed-saved-resources__item {
  display: block;
  overflow: hidden;
  margin-bottom: 16px;
  padding: 16px 16px 24px;
  border-radius: 4px;
  background-color: #FFF;
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.06);
  transition-duration: 0.25s;
  transition-property: box-shadow, transform;
}
.rfeed-saved-resources__item:hover {
  box-shadow: 0px 6px 16px rgba(0, 0, 0, 0.12);
  transform: translateY(-8px);
}
.rfeed-saved-resources__figure {
  margin: -16px -16px 16px;
}
.rfeed-saved-resources__image {
  max-width: 100%;
}
.rfeed-saved-resources__badge {
  display: inline-block;
  vertical-align: top;
  margin-bottom: 8px;
  padding: 0 14px;
  border-radius: 14px;
  background-color: #E9F4FB;
  line-height: 28px;
  font-weight: 700;
  color: #1097E2;
}
.rfeed-saved-resources__caption {
  font-weight: 500;
  color: #23202E;
}
.rfeed-saved-resources__all {
  display: block;
  padding: 12px;
  border-radius: 4px;
  background-color: #FFF;
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.06);
  line-height: 24px;
  font-weight: 500;
  text-align: center;
  color: #1097E2;
  transition-duration: 0.25s;
  transition-property: box-shadow, transform;
}
.rfeed-saved-resources__all:hover {
  box-shadow: 0px 6px 16px rgba(0, 0, 0, 0.12);
  transform: translateY(-8px);
}
.rfeed-saved-resources__all::before {
  content: '';
  display: inline-block;
  vertical-align: top;
  width: 20px;
  height: 24px;
  margin-right: 4px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="24" viewBox="0 0 24 24" stroke="%231097E2" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path></svg>');
}
@media screen and (max-width: 767.98px) {
  .rfeed-saved-resources__image {
    height: auto;
  }
}


/**/
/* rfeed user */
/**/
.rfeed-user {
  display: block;
  padding: 17px;
  border: 1px solid #EBEBEB;
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;
  background: #FFF;
  text-decoration: none;
  transition-duration: 0.25s;
  transition-property: background-color, color;
}
.rfeed-user:hover {
  color: #1097E2;
}
.rfeed-user__avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background-color: #CBD6DE;
  font-size: 18px;
  line-height: 36px;
  font-weight: 500;
  text-align: center;
  color: #FFF;
}
.rfeed-user__name {
  font-size: 18px;
  line-height: 1;
  font-weight: 500;
  color: #23202E;
  transition-duration: 0.25s;
  transition-property: color;
}
.rfeed-user:hover .rfeed-user__name {
  color: #1097E2;
}
.rfeed-user__email {
  margin-top: 4px;
  font-size: 13px;
  line-height: 1;
  color: #62727B;
}


/**/
/* rfeed menu */
/**/
.rfeed-menu {
  margin-top: -1px;
  padding: 11px;
  border: 1px solid #EBEBEB;
  background: #FFF;
}
.rfeed-menu:last-child {
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
}
.rfeed-menu__item {
  display: flex;
  align-items: center;
  height: 48px;
  margin-bottom: 2px;
  padding: 0 12px;
  border-radius: 4px;
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
  color: #23202E;
  transition-duration: 0.25s;
  transition-property: background-color, color;
}
.rfeed-menu__item:hover {
  background-color: rgba(16,151,226,0.06);
  color: #1097E2;
}
.rfeed-menu__item:last-child {
  margin-bottom: 0;
}
.rfeed-menu__icon {
  margin-right: 16px;
  color: #62727B;
  transition-duration: 0.25s;
  transition-property: color;
}
.rfeed-menu__arrow {
  margin-left: auto;
  color: #1097E2;
  opacity: 0;
  transition-duration: 0.25s;
  transition-property: opacity;
}
.rfeed-menu__item:hover .rfeed-menu__icon {
  color: #1097E2;
}
.rfeed-menu__item:hover .rfeed-menu__arrow {
  opacity: 1;
}
.rfeed-menu__callout {
  display: block;
  margin-bottom: 8px;
  padding: 12px 16px;
  border-radius: 4px;
  background: linear-gradient(135deg, #FFFAEC, #F9EDCF); 
  text-decoration: none;
  font-size: 14px;
  line-height: 1.25;
  font-weight: 500;
  color: #8B753B;
}
.rfeed-menu__progress {
  position: relative;
  width: 60px;
  height: 60px;
  border: 4px solid #F1EAD6;
  border-radius: 50%;
  background-color: #FFF;
  font-size: 15px;
  line-height: 52px;
  font-weight: 700;
  text-align: center;
  color: #37474F;
}
.rfeed-menu__progress::before {
  content: '';
  position: absolute;
  top: -4px;
  right: -4px;
  bottom: -4px;
  left: -4px;
  border: 4px solid #EFC554;
  border-top-color: transparent;
  border-radius: 50%;
  transform: rotate(-45deg);
}
.rfeed-menu__callout span {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  text-decoration: underline;
  opacity: 0.7; 
}
.rfeed-menu__callout:hover span {
  text-decoration: none;
}


/**/
/* rfeed pers lessons */
/**/
.rfeed-pers-lessons {
  margin-top: -1px;
  padding: 11px 11px 3px;
  border: 1px solid #EBEBEB;
  background: #FFF;
}
.rfeed-pers-lessons:last-child {
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
}
.rfeed-pers-lessons__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  padding: 0 12px;
}
.rfeed-pers-lessons__title {
  font-size: 14px;
  font-weight: 500;
  color: #37474F;
}
.rfeed-pers-lessons__toggle {
  margin-top: 3px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  opacity: 0.6;
  transition-duration: 0.25s;
  transition-property: opacity;
}
.rfeed-pers-lessons__toggle:hover {
  opacity: 1;
}
.rfeed-pers-lessons__item {
  position: relative;
  margin-bottom: 8px;
  padding: 12px;
  border-radius: 4px;
  background: #F3F7F9 url(../img/rfeed-pers-lessons/bg.svg) 100% 0 no-repeat;
  text-align: center;
}
.rfeed-pers-lessons__item--completed {
  background-color: #E7F5F3;
}
.rfeed-pers-lessons__divider {
  margin-bottom: 8px;
  border-top: 1px solid rgba(219, 219, 219, 0.6);
}
.rfeed-pers-lessons__close {
  position: absolute;
  top: 0;
  right: 0;
  width: 24px;
  height: 24px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" stroke="%2337474F" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>') 50% 50% no-repeat;
}
.rfeed-pers-lessons__category {
  font-size: 11px;
  line-height: 16px;
  font-weight: 500;
  text-align: left;
  color: #95A0A6;
}
.rfeed-pers-lessons__category::before {
  content: '';
  display: inline-block;
  vertical-align: top;
  width: 16px;
  height: 16px;
  margin-right: 6px;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%23B5BEC2" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z"></path><path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"></path></svg>');
  background-size: 100% 100%;
}
.rfeed-pers-lessons__name {
  margin-top: 4px;
  font-size: 14px;
  font-weight: 500;
  text-align: left;
  color: #37474F;
}
.rfeed-pers-lessons__hr {
  margin-top: 16px;
  margin-right: -11px;
  margin-left: -11px;
  border-top: 1px solid rgba(219, 219, 219, 0.4);
}
.rfeed-pers-lessons__progress {
  overflow: hidden;
  margin-top: 16px;
  border-radius: 3px;
  background-color: #E6EBEE;
}
.rfeed-pers-lessons__progress div {
  height: 6px;
  border-radius: 3px;
  background: linear-gradient(270deg, #1097E2 0%, #58C1FC 100%);
}
.rfeed-pers-lessons__resume {
  display: block;
  margin: 12px -12px -12px;
  padding: 12px;
  border-top: 1px solid rgba(219, 219, 219, 0.4);
  font-size: 12px;
  font-weight: 500;
  text-decoration: none;
  color: #1097E2;
  transition-duration: 0.25s;
  transition-property: background;
}
.rfeed-pers-lessons__resume::after {
  content: '';
  display: inline-block;
  vertical-align: top;
  width: 12px;
  height: 12px;
  margin: 3px -4px 0 2px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" stroke="%231097E2" stroke-width="3" fill="none" stroke-linecap="round" stroke-linejoin="round"><polyline points="9 18 15 12 9 6"></polyline></svg>') 50% 50% no-repeat;
}
.rfeed-pers-lessons__resume:hover {
  background-color: #E3EEF4;
}
.rfeed-pers-lessons__completed {
  display: block;
  margin: 12px -12px -12px;
  padding: 12px;
  border-top: 1px solid rgba(219, 219, 219, 0.4);
  font-size: 12px;
  font-weight: 500;
  color: #20C0CA;
  transition-duration: 0.25s;
  transition-property: background;
}
.rfeed-pers-lessons__completed:hover {
  background-color: #D3F2ED;
}
.rfeed-pers-lessons__completed::before {
  content: '';
  display: inline-block;
  vertical-align: top;
  width: 20px;
  height: 20px;
  margin: -2px 4px -2px -2px;
  background: url(../img/rfeed-pers-lessons/badge.svg);
}
.rfeed-pers-lessons__view {
  display: block;
  margin-bottom: 8px;
  padding: 8px;
  border-radius: 4px;
  background-color: rgba(231,245,243,0.4);
  font-size: 12px;
  font-weight: 500;
  text-align: center;
  text-decoration: none;
  color: #20C0CA;
  transition-duration: 0.25s;
  transition-property: background-color;
}
.rfeed-pers-lessons__view:hover {
  background-color: #D3F2ED;
}


/**/
/* rfeed foot */
/**/
.rfeed-footer {
  margin-top: 24px;
  padding-top: 12px;
  border-top: 1px solid rgba(219, 219, 219, 0.6);
  font-size: 0;
  text-align: center;
}
.rfeed-footer__link {
  display: inline-block;
  vertical-align: top;
  margin-top: 12px;
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  text-decoration: none;
  color: #96A2A8;
  transition-duration: 0.25s;
  transition-property: color;
}
.rfeed-footer__link--alt {
  font-weight: 400;
}
.rfeed-footer__link:hover {
  color: #23202E;
}
.rfeed-footer__bull {
  display: inline-block;
  vertical-align: top;
  width: 4px;
  height: 4px;
  margin: 20px 10px 0;
  border-radius: 50%;
  background-color: #D8D8D8;
}
.rfeed-footer__logo {
  display: inline-block;
  vertical-align: top;
  margin-top: 17px;
  margin-right: 16px;
}




/**/
/* DEEP DIVE */
/**/


/**/
/* deepdive progress */
/**/
.deepdive-progress {
  background: rgb(238,46,36,0.2);
}
.deepdive-progress__bar {
  height: 4px;
  background: #EE2E24;
}


/**/
/* deepdive feedback */
/**/
.deepdive-feedback {
  padding: 40px;
  overflow: hidden;
  border-radius: 4px;
  background-color: #FFF;
  box-shadow: 0px 18px 40px rgba(0, 0, 0, 0.12);
  text-align: center;
}
.deepdive-feedback__foot {
  margin: 24px -20px -20px;
  padding: 20px;
  border-top: 1px solid rgba(219, 219, 219, 0.8);
}
.deepdive-feedback__skip {
  display: inline-block;
  vertical-align: top;
  margin: 12px 0 -24px;
  padding: 16px;
  line-height: 1;
  font-weight: 500;
  transition-duration: 0.25s;
  transition-property: color;
}
.deepdive-feedback__skip:hover {
  color: #23202E;
}
@media screen and (max-width: 599.98px) {
  .deepdive-feedback {
    margin-right: -20px;
    margin-left: -20px;
    padding: 32px;
  }
  .deepdive-feedback__skip {
    margin-bottom: -16px;
  }
}


/**/
/* deepdive rating */
/**/
.deepdive-rating {
  margin: 40px 0;
  text-align: left;
}
.deepdive-rating__item {
  position: relative;
  margin: 0 2px;
  font-weight: 500;
  text-align: center;
  color: #62727B;
}
.deepdive-rating__input {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  appearance: none;
  cursor: pointer;
  opacity: 0;
}
.deepdive-rating__figure {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 76px;
  height: 76px;
  border-radius: 50%;
  background-color: rgba(241, 200, 115, 0.15);
  box-shadow: inset 0 0 0 0 #EE2E24;
  transition-duration: 0.25s;
  transition-property: background, box-shadow;
}
.deepdive-rating__figure img {
  transition-duration: 0.25s;
  transition-property: transform;
}
.deepdive-rating__label {
  margin-top: 8px;
  transition-duration: 0.25s;
  transition-property: color;
}
.deepdive-rating__input:hover + .deepdive-rating__figure img {
  transform: scale(2);
} 
.deepdive-rating__input:checked + .deepdive-rating__figure {
  background-color: #FFF;
  box-shadow: inset 0 0 0 3px #EE2E24;
}
.deepdive-rating__input:checked + .deepdive-rating__figure img {
  transform: scale(1.5);
}
.deepdive-rating__input:hover ~ .deepdive-rating__label {
  color: #23202E;
}
.deepdive-rating__input:checked ~ .deepdive-rating__label {
  color: #EE2E24;
}
.deepdive-rating__spoiler {
  display: none;
  margin: 40px 0 -40px;
}
@media screen and (max-width: 599.98px) {
  .deepdive-rating__item {
    margin: 0;
  }
  .deepdive-rating__figure {
    width: 64px;
    height: 64px;
  }
  .deepdive-rating__input:checked + .deepdive-rating__figure img {
    transform: scale(1.375);
  }
}


/**/
/* deepdive thanks */
/**/
.deepdive-thanks {
  position: relative;
  padding: 40px;
  border-radius: 4px;
  background-color: #FFF;
  box-shadow: 0px 18px 40px rgba(0, 0, 0, 0.12);
  text-align: center;
}
.deepdive-thanks__close {
  position: absolute;
  top: 12px;
  right: 12px;
  transition-duration: 0.25s;
  transition-property: color;
}
.deepdive-thanks__close:hover {
  color: #23202E;
}
@media screen and (max-width: 599.98px) {
  .deepdive-thanks {
    margin-right: -20px;
    margin-left: -20px;
    padding: 32px;
  }
}




/**/
/* SETTINGS */
/**/

/**/
/* settings account */
/**/
.settings-account {
  border-radius: 4px;
  background-color: #FFFFFF;
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.06);
}
.settings-account__cont {
  padding: 40px;
}
.settings-account__foot {
  padding: 40px;
  border-top: 1px solid rgba(202, 216, 224, 0.25);
}
.settings-account__avatar {
  position: relative;
  width: 128px;
  height: 128px;
  overflow: hidden;
  font-size: 64px;
  line-height: 128px;
  font-weight: 500;
  text-align: center;
  color: #FFF;
}
.settings-account__avatar span {
  display: block;
  border-radius: 50%;
  background-color: #CBD6DE;
}
.settings-account__avatar input {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}
.settings-account__avatar::after {
  content: '';
  position: absolute;
  right: -4px;
  bottom: -4px;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 4px solid #FFFFFF;
  background: #20D3B3 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" stroke="%23FFF" stroke-width="3" fill="none" stroke-linecap="round" stroke-linejoin="round" class="css-i6dzq1"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg>') 50% 50% no-repeat;
}
@media screen and (max-width: 599.98px) {
  .settings-account__cont {
    padding: 24px;
  }
  .settings-account__foot {
    padding: 24px;
  }
}


/**/
/* settings search */
/**/
.settings-search__input {
  border: none;
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.06), 0px 15px 20px rgba(194, 208, 222, 0.2);
}


/**/
/* settings filter */
/**/
.settings-filter {
  position: relative;
}
.settings-filter__toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 6px;
  background: #FFF;
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.06), 0px 15px 20px rgba(194, 208, 222, 0.2);
}
.settings-filter__toggle:hover {
  color: #1097E2;
}
.settings-filter__dropdown {
  position: absolute;
  z-index: 10;
  top: 100%;
  right: 0;
  min-width: 220px;
  margin-top: 8px;
  border-radius: 6px;
  background: #FFFFFF;
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.06), 0px 15px 20px rgba(194, 208, 222, 0.4);
  pointer-events: none;
  opacity: 0;
  transition-duration: 0.25s;
  transition-property: opacity;
}
.settings-filter__head {
  padding: 8px 14px;
  background-color: rgba(196, 205, 210, 0.15);
  font-size: 18px;
  font-weight: 500;
  color: #62727B;
}
.settings-filter__cont {
  padding: 14px;
}
.settings-filter__radio,
.settings-filter__checkbox {
  display: block;
  position: relative;
  padding-left: 32px;
  font-size: 18px;
  line-height: 32px;
}
.settings-filter__radio:last-child,
.settings-filter__checkbox:last-child {
  margin-bottom: -4px;
}
.settings-filter__radio:first-child,
.settings-filter__checkbox:first-child {
  margin-top: -4px;
}
.settings-filter__radio i,
.settings-filter__checkbox i {
  position: absolute;
  top: 50%;
  left: 0;
  width: 20px;
  height: 20px;
  margin-top: -10px;
  border-radius: 50%;
  border: 2px solid #CAD8E0;
  background-color: #FFF;
  transition-duration: 0.25s;
}
.settings-filter__radio i::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  margin: -4px 0 0 -4px;
  border-radius: 50%;
  background-color: #FFF;
}
.settings-filter__checkbox i {
  border-radius: 4px;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%23FFF" d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"></path></svg>');
  background-position: 50% 50%;
  background-size: 10px 10px;
  background-repeat: no-repeat;
}
.settings-filter__radio input,
.settings-filter__checkbox input {
  position: relative;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
  appearance: none;
}
.settings-filter__radio input:hover + i,
.settings-filter__checkbox input:hover + i {
  border-color: #1097E2;
}
.settings-filter__radio input:checked + i,
.settings-filter__checkbox input:checked + i {
  border-color: #1097E2;
  background-color: #1097E2;
}
.settings-filter.active .settings-filter__toggle {
  color: #1097E2;
}
.settings-filter.active .settings-filter__dropdown {
  pointer-events: auto;
  opacity: 1;
}


/**/
/* activity card */
/**/
.activity-card {
  position: relative;
  padding: 16px;
  border-radius: 4px;
  background: #FFFFFF;
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.06);
}
.activity-card__image {
  margin-right: 8px;
  border-radius: 2px;
}
.activity-card__title {
  margin-right: 120px;
}
.activity-card__head {
  display: flex;
  align-items: center;
}
.activity-card__badge {
  margin-right: 12px;
  padding: 0 12px;
  border-radius: 14px;
  background-color: #E9F4FB;
  line-height: 28px;
  font-weight: 700;
  color: #1097E2;
}
.activity-card__bull {
  width: 4px;
  height: 4px;
  margin: 0 8px;
  border-radius: 50%;
  background-color: #D8D8D8;
}
.activity-card__meta {
  font-weight: 500;
  color: #87979F;
}
.activity-card__meta:last-of-type {
  margin-right: auto;
}
.activity-card__action {
  position: relative;
  z-index: 1;
  width: 28px;
  height: 28px;
  margin-right: 12px;
  background-position: 50% 50%;
  background-size: 24px 24px;
  background-repeat: no-repeat;
  transition-duration: 0.25s;
  transition-property: background;
}
.activity-card__action--book {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2362727B" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path></svg>');
}
.activity-card__action--book:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2323202E" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path></svg>');
}
.activity-card__action--book.active {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2362727B" stroke-width="2" fill="%2362727B" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path></svg>');
}
.activity-card__action--book.active:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%23EE2E24" stroke-width="2" fill="%23EE2E24" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"></path></svg>');
}
.activity-card__action--more {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%2362727B" d="M304 256c0 26.5-21.5 48-48 48s-48-21.5-48-48 21.5-48 48-48 48 21.5 48 48zm120-48c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48zm-336 0c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48z"></path></svg>');
}
.activity-card__action--more:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%2323202E" d="M304 256c0 26.5-21.5 48-48 48s-48-21.5-48-48 21.5-48 48-48 48 21.5 48 48zm120-48c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48zm-336 0c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48z"></path></svg>');
}
.activity-card__action--share {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 26 24" fill="none" stroke="%2362727B" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18.625 13.8125L24.25 8.1875L18.625 2.5625"></path><path d="M20.5 21.3125H2.6875C2.43886 21.3125 2.2004 21.2137 2.02459 21.0379C1.84877 20.8621 1.75 20.6236 1.75 20.375V6.3125"></path><path d="M6.79199 16.625C7.41637 14.21 8.82531 12.0709 10.7975 10.5437C12.7696 9.01649 15.1932 8.18769 17.6876 8.1875H24.2501"></path></svg>');
  background-size: 26px 24px;
}
.activity-card__action--share:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 26 24" fill="none" stroke="%2323202E" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18.625 13.8125L24.25 8.1875L18.625 2.5625"></path><path d="M20.5 21.3125H2.6875C2.43886 21.3125 2.2004 21.2137 2.02459 21.0379C1.84877 20.8621 1.75 20.6236 1.75 20.375V6.3125"></path><path d="M6.79199 16.625C7.41637 14.21 8.82531 12.0709 10.7975 10.5437C12.7696 9.01649 15.1932 8.18769 17.6876 8.1875H24.2501"></path></svg>');
}
.activity-card__action:last-child {
  margin-right: 0;
}
@media screen and (max-width: 1023.98px) {
  .activity-card__title {
    margin-right: 0;
  }
}
@media screen and (max-width: 767.98px) {
  .activity-card__image {
    width: auto;
    height: 84px;
  }
  .activity-card__action {
    background-size: 20px 20px;
  }
}
@media screen and (max-width: 599.98px) {
  .activity-card {
    padding-bottom: 52px;
  }
  .activity-card__image {
    height: 60px;
    margin-right: 0;
  }
  .activity-card__action {
    position: absolute;
    right: 12px;
    bottom: 12px;
  }
  .activity-card__action--book {
    right: auto;
    left: 12px;
  }
  .activity-card__action--share {
    left: 48px;
  }
}




/**/
/* ADMIN */
/**/


/**/
/* tooltip */
/**/
.tooltip {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1000;
  max-width: 192px;
  margin-top: -8px;
  padding: 4px 8px;
  border-radius: 4px;
  background-color: #23202E;
  font-size: 13px;
  line-height: 1.375;
  font-weight: 500;
  pointer-events: none;
  color: #FFF;
  opacity: 0;
  transform: translate(-50%, -100%);
  transition-duration: 0.125s;
  transition-property: opacity;
}
.tooltip::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-top: 5px solid #23202E;
  border-right: 5px solid transparent;
  border-left: 5px solid transparent;
}
.tooltip.active {
  pointer-events: auto;
  opacity: 1;
}


/**/
/* admin header */
/**/
.admin-header {
  position: fixed;
  z-index: 10;
  top: 0;
  right: 0;
  left: 208px;
  padding: 16px 32px;
  background-color: #FFF;
  box-shadow: 0px 2px 20px rgba(194, 208, 222, 0.4);
  transition-duration: 0.25s;
  transition-property: left;
}
.admin-header__tabs {
  display: flex;
  margin: 16px -32px -16px;
  border-top: 1px solid rgba(194, 208, 222, 0.3);
  line-height: 44px;
  font-weight: 500;
}
.admin-header__tabs a {
  margin-left: 32px;
  transition-duration: 0.25s;
  transition-property: color;
}
.admin-header__tabs a:hover {
  color: #1097E2;
}
.admin-header__tabs a.active {
  box-shadow: inset 0 -2px 0 0 #1097E2;
  color: #1097E2;
}


/**/
/* admin sidebar */
/**/
.admin-sidebar {
  position: fixed;
  z-index: 11;
  top: 0;
  bottom: 0;
  left: 0;
  width: 208px;
  overflow: hidden;
  padding: 20px 20px 92px;
  background: #323739;
  color: #FFF;
  transition-duration: 0.25s;
  transition-property: width;
}
.admin-sidebar__logo {
  position: relative;
  margin-bottom: 48px;
  transition-duration: 0.25s;
  transition-property: margin;
}
.admin-sidebar__logo img {
  transition-duration: 0.25s;
  transition-property: opacity;
}
.admin-sidebar__logo img:last-child {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}
.admin-sidebar__link {
  display: block;
  margin: 2px -4px;
  padding: 8px;
  border-radius: 6px;
  line-height: 24px;
  font-weight: 500;
  white-space: nowrap;
  color: #A4B0B6;
  transition-duration: 0.25s;
}
.admin-sidebar__link svg {
  display: inline-block;
  vertical-align: top;
  margin-right: 12px;
  transition-duration: 0.25s;
  transition-property: margin;
}
.admin-sidebar__link:hover {
  color: #FFF;
}
.admin-sidebar__link.active {
  background-color: #EE2E24;
  color: #FFF;
}
.admin-sidebar__user {
  display: block;
  line-height: 32px;
  font-weight: 500;
  white-space: nowrap;
  color: #A4B0B6;
  transition-duration: 0.25s;
}
.admin-sidebar__user em {
  display: inline-block;
  vertical-align: top;
  width: 32px;
  margin-right: 8px;
  border-radius: 50%;
  background-color: #636C70;
  text-align: center;
  color: #FFF;
  transition-duration: 0.25s;
  transition-property: margin;
}
.admin-sidebar__user:hover {
  color: #FFF;
}
.admin-sidebar__hr {
  margin: 16px 0;
  border-top: 1px solid #7A8FA5;
  opacity: 0.4;
}
.admin-sidebar__toggle {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 0 20px;
  background: #464D50;
  font-size: 14px;
  line-height: 44px;
  font-weight: 500;
  color: #A8B8C0;
  transition-duration: 0.25s;
  transition-property: color;
}
.admin-sidebar__toggle::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 20px;
  width: 16px;
  height: 16px;
  margin-top: -8px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="none"><path fill="%23A8B8C0" d="M2 1V15C2 15.5523 1.55228 16 1 16C0.447715 16 0 15.5523 0 15V1C0 0.447715 0.447715 0 1 0C1.55228 0 2 0.447715 2 1ZM10.6865 1.28664C11.0761 1.67616 11.0638 2.31135 10.6596 2.68561L6 7.0001H15C15.5523 7.0001 16 7.44781 16 8.0001C16 8.55238 15.5523 9.0001 15 9.0001H6L10.6597 13.3146C11.0638 13.6888 11.0761 14.324 10.6865 14.7136C10.3074 15.0927 9.69262 15.0927 9.31346 14.7136L3.3 8.7001C2.9 8.3001 2.9 7.7001 3.3 7.3001L9.31346 1.28664C9.69262 0.907474 10.3074 0.907474 10.6865 1.28664Z"/></svg>') 50% 50%/100% 100%;
  transition-duration: 0.25s;
  transition-property: transform;
}
.admin-sidebar__toggle:hover {
  color: #FFF;
}
.admin-sidebar__toggle:hover::after {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="none"><path fill="%23FFFFFF" d="M2 1V15C2 15.5523 1.55228 16 1 16C0.447715 16 0 15.5523 0 15V1C0 0.447715 0.447715 0 1 0C1.55228 0 2 0.447715 2 1ZM10.6865 1.28664C11.0761 1.67616 11.0638 2.31135 10.6596 2.68561L6 7.0001H15C15.5523 7.0001 16 7.44781 16 8.0001C16 8.55238 15.5523 9.0001 15 9.0001H6L10.6597 13.3146C11.0638 13.6888 11.0761 14.324 10.6865 14.7136C10.3074 15.0927 9.69262 15.0927 9.31346 14.7136L3.3 8.7001C2.9 8.3001 2.9 7.7001 3.3 7.3001L9.31346 1.28664C9.69262 0.907474 10.3074 0.907474 10.6865 1.28664Z"/></svg>')
}
.admin-sidebar.collapsed {
  width: 64px;
}
.admin-sidebar.collapsed ~ .admin-header {
  left: 64px;
}
.admin-sidebar.collapsed .admin-sidebar__logo {
  margin-left: -4px;
}
.admin-sidebar.collapsed .admin-sidebar__logo img {
  opacity: 0;
}
.admin-sidebar.collapsed .admin-sidebar__logo img:last-child {
  opacity: 1;
}
.admin-sidebar.collapsed .admin-sidebar__link {
  margin-right: -20px;
  margin-left: -20px;
  border-radius: 0;
}
.admin-sidebar.collapsed .admin-sidebar__link svg {
  margin-right: 20px;
  margin-left: 12px;
}
.admin-sidebar.collapsed .admin-sidebar__user {
  margin-left: -4px;
}
.admin-sidebar.collapsed .admin-sidebar__user em {
  margin-right: 16px;
}
.admin-sidebar.collapsed .admin-sidebar__toggle {
  color: transparent;
}
.admin-sidebar.collapsed .admin-sidebar__toggle::after {
  right: 24px;
  transform: scale(-1,1);
}


/**/
/* admin tags */
/**/
.admin-tags {
  display: flex;
  flex-wrap: wrap;
  margin: -8px -8px 0 0;
}
.admin-tags__item {
  margin: 8px 8px 0 0;
  padding: 0 16px;
  border-radius: 1em;
  background: rgba(211, 228, 237, 0.3);
  line-height: 32px;
  font-weight: 500;
  color: #618092;
}
.admin-tags__remove {
  position: relative;
  display: inline-block;
  vertical-align: top;
  width: 32px;
  height: 32px;
  margin: 0 -14px 0 0;
}
.admin-tags__remove::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 16px;
  height: 16px;
  margin: -8px 0 0 -8px;
  border-radius: 50%;
  background: #62727B url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" stroke="%23FFF" stroke-width="3" fill="none" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>') 50% 50% no-repeat;
  transition-duration: 0.25s;
  transition-property: background-color;
}
.admin-tags__remove:hover::before {
  background-color: #37474F;
}
.admin-tags--xs {
  margin-top: -4px;
  margin-right: -4px;
}
.admin-tags--xs .admin-tags__item {
  margin-top: 4px;
  margin-right: 4px;
  padding: 0 8px;
  font-size: 12px;
  line-height: 22px;
}
.admin-tags--xs .admin-tags__remove {
  width: 22px;
  height: 22px;
  margin-right: -8px;
}
.admin-tags--xs .admin-tags__remove::before {
  width: 12px;
  height: 12px;
  margin: -6px 0 0 -6px;
  background-size: 8px 8px;
}


/**/
/* admin card */
/**/
.admin-card {
  padding: 19px;
  border-radius: 6px;
  border: 1px solid #FFF;
  background: #FFF;
  box-shadow: 0px 1px 8px rgba(202, 216, 224, 0.3);
  transition-duration: 0.25s;
}
.admin-card:hover {
  border-color: #157EB8;
  box-shadow: 0px 10px 15px rgba(185, 203, 214, 0.4);
}
.admin-card__badge {
  padding: 0 8px;
  border-radius: 4px;
  font-size: 13px;
  line-height: 24px;
  font-weight: 500;
  color: #FFF;
}
.admin-card__badge::before {
  content: '';
  display: inline-block;
  vertical-align: top;
  width: 14px;
  height: 12px;
  margin: 6px 5px 6px -1px;
  background-size: auto 12px;
}
.admin-card__badge--video {
  background-color: #20D3B3;
}
.admin-card__badge--video::before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 12"><path fill="%23FFF" d="M10.5,1h-9A1.5,1.5,0,0,0,0,2.5v7A1.5,1.5,0,0,0,1.5,11h9A1.5,1.5,0,0,0,12,9.5v-7A1.5,1.5,0,0,0,10.5,1ZM4,9V3L9,6Z"></path></svg>');
}
.admin-card__badge--iframe {
  background-color: #9A9AF7;
}
.admin-card__badge--iframe::before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="%23FFF" d="M234.8 511.7L196 500.4c-4.2-1.2-6.7-5.7-5.5-9.9L331.3 5.8c1.2-4.2 5.7-6.7 9.9-5.5L380 11.6c4.2 1.2 6.7 5.7 5.5 9.9L244.7 506.2c-1.2 4.3-5.6 6.7-9.9 5.5zm-83.2-121.1l27.2-29c3.1-3.3 2.8-8.5-.5-11.5L72.2 256l106.1-94.1c3.4-3 3.6-8.2.5-11.5l-27.2-29c-3-3.2-8.1-3.4-11.3-.4L2.5 250.2c-3.4 3.2-3.4 8.5 0 11.7L140.3 391c3.2 3 8.2 2.8 11.3-.4zm284.1.4l137.7-129.1c3.4-3.2 3.4-8.5 0-11.7L435.7 121c-3.2-3-8.3-2.9-11.3.4l-27.2 29c-3.1 3.3-2.8 8.5.5 11.5L503.8 256l-106.1 94.1c-3.4 3-3.6 8.2-.5 11.5l27.2 29c3.1 3.2 8.1 3.4 11.3.4z"></path></svg>');
}
.admin-card__badge--article {
  background-color: #DC7DCD;
}
.admin-card__badge--article::before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23FFF" d="M14,0H3A1,1,0,0,0,2,1V23a1,1,0,0,0,1,1H21a1,1,0,0,0,1-1V8H15a1,1,0,0,1-1-1ZM5.5,17h13a.5.5,0,0,1,.5.5v1a.5.5,0,0,1-.5.5H5.5a.5.5,0,0,1-.5-.5v-1A.5.5,0,0,1,5.5,17Zm0-5h13a.5.5,0,0,1,.5.5v1a.5.5,0,0,1-.5.5H5.5a.5.5,0,0,1-.5-.5v-1A.5.5,0,0,1,5.5,12Zm5-3h-5A.5.5,0,0,1,5,8.5v-1A.5.5,0,0,1,5.5,7h5a.5.5,0,0,1,.5.5v1A.5.5,0,0,1,10.5,9Z"></path><polygon fill="%23FFF" points="21.414 6 16 6 16 0.586 21.414 6"></polygon></svg>');
}
.admin-card__badge--question {
  background-color: #FFCC4D;
}
.admin-card__badge--question::before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 12"><path fill="%23FFF" d="M5.926,0a7.438,7.438,0,0,0-3.7.977l.852,1.711a6.006,6.006,0,0,1,2.672-.766A1.789,1.789,0,0,1,6.8,2.188a.886.886,0,0,1,.375.773,1.383,1.383,0,0,1-.262.82,4.891,4.891,0,0,1-1.082.953A4.2,4.2,0,0,0,4.66,5.914a2.561,2.561,0,0,0-.32,1.305V7.8H6.41V7.328a1.319,1.319,0,0,1,.2-.758,4.63,4.63,0,0,1,.95-.843A5.574,5.574,0,0,0,9.043,4.32a2.746,2.746,0,0,0,.391-1.484A2.528,2.528,0,0,0,8.484.773,3.931,3.931,0,0,0,5.926,0Z"></path><circle fill="%23FFF" cx="5.5" cy="10.5" r="1.5"></circle></svg>');
}
.admin-card__image {
  display: block;
  margin-right: 20px;
  border-radius: 4px;
}
.admin-card__edit {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  margin: -4px 0;
  border-radius: 6px;
  background: #E3F3FC;
  color: #1097E2;
  transition-duration: 0.25s;
}
.admin-card__edit svg {
  width: 20px;
  height: 20px;
  margin-right: -2px;
}
.admin-card__edit:hover {
  background-color: #1097E2;
  color: #FFF;
}
.admin-card__status {
  line-height: 20px;
  font-weight: 700;
}
.admin-card__status::before {
  content: '';
  display: inline-block;
  vertical-align: top;
  width: 8px;
  height: 8px;
  margin-top: 6px;
  margin-right: 6px;
  border-radius: 50%;
  background-color: #CAD8E0;
}
.admin-card__status--active {
  color: #20C0CA;
}
.admin-card__status--active::before {
  background-color: #20C0CA;
}
.admin-card__toggle {
  display: block;
  color: #CAD8E0;
  transition-duration: 0.25s;
  transition-property: color, transform;
}
.admin-card__toggle:hover {
  color: #157EB8;
}
.admin-card__toggle.active {
  transform: scale(1,-1);
}
.admin-card__spoiler {
  display: none;
  margin: 19px -19px -4px;
  padding: 0 20px;
  border-top: 1px solid #ECF1F4;
}
.admin-card__spoiler .p {
  margin-right: 8px;
}


/**/
/* admin form */
/**/
.admin-form {
  padding: 32px;
  border-radius: 6px;
  background-color: #FFF;
}
.admin-form--alt {
  background-color: #F5F8FA;
}
.admin-form__label {
  margin-bottom: 8px;
  font-weight: 500;
}


/**/
/* admin table */
/**/
.admin-table {
  overflow: hidden;
  border-radius: 10px;
  border: 1px solid #CED8DF;
  background: #FFF;
  box-shadow: 0px 2px 6px rgba(194, 208, 222, 0.1), 0px 1px 2px rgba(194, 208, 222, 0.35);
}
.admin-table table {
  width: 100%;
  border-collapse: collapse;
}
.admin-table thead th {
  padding: 8px 20px;
  background: rgba(194, 208, 222, 0.2);
  font-size: 12px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.025em;
  color: #96A2A8;
}
.admin-table tbody td {
  padding: 10px 20px;
  border-top: 1px solid #F3F4F6;
}
.admin-table tbody tr {
  transition-duration: 0.25s;
  transition-property: background;
}
.admin-table tbody tr:hover {
  background: rgba(16, 151, 226, 0.1);
}
.admin-table__edit {
  display: block;
  margin-right: 8px;
  padding: 0 8px;
  border-radius: 4px;
  font-size: 14px;
  line-height: 26px;
  font-weight: 500;
  color: #1097E2;
  transition-duration: 0.25s;
}
.admin-table__edit svg {
  display: inline-block;
  vertical-align: top;
  width: 18px;
  height: 18px;
  margin-top: 3px;
  margin-right: 4px;
  margin-left: -2px;
}
.admin-table__edit:hover {
  background-color: #1097E2;
  color: #FFF;
}
.admin-table__more {
  position: relative;
  display: block;
  width: 32px;
  height: 26px;
  border-radius: 4px;
  transition-duration: 0.25s;
}
.admin-table__more:hover {
  background-color: rgba(16, 151, 226, 0.2);
}
.admin-table__more::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 4px;
  height: 4px;
  margin: -2px 0 0 -2px;
  border-radius: 50%;
  background-color: #97A4B0;
  box-shadow: 6px 0 0 #97A4B0, -6px 0 0 #97A4B0;
}
.admin-table__more:hover::after {
  background-color: #1097E2;
  box-shadow: 6px 0 0 #1097E2, -6px 0 0 #1097E2;
}


/**/
/* pagination */
/**/
.pagination {
  display: flex;
  align-items: center;
}
.pagination__item {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 34px;
  margin-right: 8px;
  padding: 0 4px;
  border-radius: 6px;
  border: 1px solid #CED8DF;
  box-sizing: border-box;
  background: #FFFFFF;
  box-shadow: 0px 2px 6px rgba(194, 208, 222, 0.1), 0px 1px 2px rgba(194, 208, 222, 0.35);
  font-size: 14px;
  font-weight: 700;
  transition-duration: 0.25s;
  transition-property: border-color;
}
.pagination__item:hover {
  border-color: #1097E2;
}
.pagination__item.active {
  border-color: #1097E2;
  color: #1097E2;
}
.pagination__item.disabled {
  background: none;
  box-shadow: none;
  pointer-events: none;
  opacity: 0.5;
}
.pagination__item:last-child {
  margin-right: 0;
}


/**/
/* flow drawer */
/**/
.flow-drawer {
  position: relative;
  width: 296px;
  height: calc(100vh - 155px);
  border-radius: 6px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.5) 0%, rgba(245, 248, 250, 0.125) 55.53%, rgba(255, 255, 255, 0) 55.53%), #F5F8FA;
}
.flow-drawer__head {
  position: relative;
  padding: 16px;
}
.flow-drawer__cont {
  position: absolute;
  top: 108px;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 16px;
  overflow: auto;
}
.flow-drawer__counter {
  position: absolute;
  top: 8px;
  left: 8px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid #FCFDFE;
  background-color: #EE2E24;
  font-size: 10px;
  line-height: 16px;
  font-weight: 700;
  text-align: center;
  color: #FFF;
}
.flow-drawer__topic {
  margin-top: 32px;
  margin-bottom: 8px;
  font-size: 20px;
  line-height: 1.25;
  font-weight: 700;
}
.flow-drawer__topic:first-child {
  margin-top: 0;
}
.flow-drawer__type {
  margin-top: 8px;
  margin-bottom: 8px;
  font-size: 12px;
  font-weight: 500;
}
.flow-drawer__scroll {
  position: absolute;
  top: 50%;
  width: 40px;
  height: 40px;
  margin-top: -20px;
  border-radius: 50%;
  background-color: #FFF;
  background-size: 20px 20px;
  background-repeat: no-repeat;
  box-shadow: 0px 0px 5px rgba(194, 208, 222, 0.5), 0px 9px 24px rgba(191, 205, 219, 0.8);
}
.flow-drawer__scroll--left {
  left: 16px;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2362727B" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"><line x1="19" y1="12" x2="5" y2="12"></line><polyline points="12 19 5 12 12 5"></polyline></svg>');
}
.flow-drawer__scroll--right {
  right: 16px;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="%2362727B" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg>');
}
.flow-drawer__scroll[disabled] {
  pointer-events: none;
  opacity: 0;
}
.flow-drawer__toggle {
  position: absolute;
  top: 50%;
  left: 100%;
  width: 12px;
  height: 48px;
  margin-top: -24px;
  border-radius: 0 4px 4px 0;
  background: rgba(98,114,123,0.7) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="12" height="12" stroke="%23FFF" stroke-width="3" fill="none" stroke-linecap="round" stroke-linejoin="round"><polyline points="9 18 15 12 9 6"></polyline></svg>') 50% 50% no-repeat;
  transition-duration: 0.25s;
  transition-property: background-color;
}
.flow-drawer__toggle:hover {
  background-color: rgba(98,114,123,1);
}
.flow-drawer--expanded {
  width: 566px;
}
.flow-drawer--expanded .flow-drawer__cont {
  top: 64px;
}
.flow-drawer--expanded .flow-drawer__toggle {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="12" height="12" stroke="%23FFF" stroke-width="3" fill="none" stroke-linecap="round" stroke-linejoin="round" class="css-i6dzq1"><polyline points="15 18 9 12 15 6"></polyline></svg>');
}


/**/
/* flow filter */
/**/
.flow-filter {
  position: absolute;
  top: 60px;
  bottom: 16px;
  left: 16px;
  width: 200px;
  overflow: auto;
  border-radius: 6px;
  background: #FFFFFF;
  box-shadow: 0px 4px 14px rgba(191, 205, 219, 0.8);
  pointer-events: none;
  opacity: 0;
  transition-duration: 0.25s;
  transition-property: opacity;
}
.flow-filter.active {
  pointer-events: auto;
  opacity: 1;
}
.flow-filter__head {
  padding: 6px 12px;
  background-color: rgba(196, 205, 210, 0.15);
  font-size: 14px;
  font-weight: 500;
  color: #62727B;
}
.flow-filter__clear {
  float: right;
  font-weight: 400;
  text-decoration: none;
}
.flow-filter__cont {
  padding: 12px;
}
.flow-filter__radio,
.flow-filter__checkbox {
  display: block;
  position: relative;
  padding-left: 24px;
  font-size: 14px;
  line-height: 24px;
}
.flow-filter__radio:last-child,
.flow-filter__checkbox:last-child {
  margin-bottom: -4px;
}
.flow-filter__radio:first-child,
.flow-filter__checkbox:first-child {
  margin-top: -4px;
}
.flow-filter__radio i,
.flow-filter__checkbox i {
  position: absolute;
  top: 50%;
  left: 0;
  width: 14px;
  height: 14px;
  margin-top: -7px;
  border-radius: 50%;
  border: 1px solid #CAD8E0;
  background-color: #FFF;
  transition-duration: 0.25s;
}
.flow-filter__radio i::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 6px;
  height: 6px;
  margin: -3px 0 0 -3px;
  border-radius: 50%;
  background-color: #FFF;
}
.flow-filter__checkbox i {
  border-radius: 4px;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%23FFF" d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"></path></svg>');
  background-position: 50% 50%;
  background-size: 8px 8px;
  background-repeat: no-repeat;
}
.flow-filter__radio input,
.flow-filter__checkbox input {
  position: relative;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
  appearance: none;
}
.flow-filter__radio input:hover + i,
.flow-filter__checkbox input:hover + i {
  border-color: #1097E2;
}
.flow-filter__radio input:checked + i,
.flow-filter__checkbox input:checked + i {
  border-color: #1097E2;
  background-color: #1097E2;
}


/**/
/* flow content type */
/**/
.flow-content-type {
  position: relative;
  margin-bottom: 12px;
}
.flow-content-type__toggle {
  width: 100%;
  padding: 8px;
  background-color: rgba(16, 151, 226, 0.15);
  border-radius: 6px;
  font-size: 14px;
  line-height: 16px;
  font-weight: 500;
  text-align: center;
  color: #1097E2;
  transition-duration: 0.25s;
  transition-property: border-radius;
}
.flow-content-type__toggle::after {
  content: '';
  display: inline-block;
  vertical-align: top;
  width: 16px;
  height: 16px;
  margin: 0 -2px 0 2px;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" stroke="%231097E2" stroke-width="3" fill="none" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg>');
  transition-duration: 0.25s;
  transition-property: transform;
}
.flow-content-type__dropdown {
  position: absolute;
  z-index: 1;
  top: 100%;
  right: 0;
  left: 0;
  padding: 12px;
  border-radius: 0 0 6px 6px;
  background: #FFF;
  box-shadow: 0px 14px 24px rgba(191, 205, 219, 0.6);
  pointer-events: none;
  opacity: 0;
  transform: translateY(8px);
  transition-duration: 0.25s;
  transition-property: opacity, transform;
}
.flow-content-type.active .flow-content-type__toggle {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.flow-content-type.active .flow-content-type__toggle::after {
  transform: scale(1,-1);
}
.flow-content-type.active .flow-content-type__dropdown {
  pointer-events: auto;
  opacity: 1;
  transform: none;
}


/**/
/* flow card */
/**/
.flow-card {
  position: relative;
  margin-top: 6px;
  padding: 8px 16px;
  border-radius: 6px;
  overflow: hidden;
  background: #FFFFFF;
  box-shadow: 0px 1px 2px rgba(194, 208, 222, 0.5), 0px 5px 14px rgba(182, 198, 215, 0.2), inset 0 0 0 1px #FFFFFF;
  cursor: pointer;
  transition-duration: 0.25s;
  transition-property: box-shadow;
}
.flow-card::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 3px;
  height: 100%;
}
.flow-card::before {
  content: '';
  position: absolute;
  top: 50%;
  right: 5px;
  width: 28px;
  height: 28px;
  margin-top: -14px;
  border-radius: 50%;
  background: radial-gradient(rgba(255,255,255,1) 33%, rgba(255,255,255,0));
  opacity: 0;
  transition-duration: 0.25s;
}
.flow-card:hover {
  box-shadow: 0px 1px 2px rgba(194, 208, 222, 0.5), 0px 10px 14px rgba(182, 198, 215, 0.4), inset 0 0 0 1px #A0B6CB;
}
.flow-card:hover::before {
  opacity: 1;
}
.flow-card--short {
  display: flex;
  align-items: center;
  width: 128px;
  height: 44px;
  margin-right: 6px;
}
.flow-card--short .flow-card__name {
  max-height: 28px;
  overflow: hidden;
}
.flow-card--other::after {
  background-color: #C29E84;
}
.flow-card--quest::after {
  background-color: #FFCC4D;
}
.flow-card--video::after {
  background-color: #20D3B3;
}
.flow-card--iframe::after {
  background-color: #9A9AF7;
}
.flow-card--article::after {
  background-color: #DC7DCD;
}
.flow-card__name {
  font-size: 12px;
  line-height: 14px;
  font-weight: 500;
}
.flow-card__info {
  position: absolute;
  top: 50%;
  right: 8px;
  width: 16px;
  height: 16px;
  margin-top: -8px;
  border-radius: 50%;
  border: 1px solid #D8E1E9;
  background: #FFF url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 512"><path fill="%2337474F" d="M20 424.229h20V279.771H20c-11.046 0-20-8.954-20-20V212c0-11.046 8.954-20 20-20h112c11.046 0 20 8.954 20 20v212.229h20c11.046 0 20 8.954 20 20V492c0 11.046-8.954 20-20 20H20c-11.046 0-20-8.954-20-20v-47.771c0-11.046 8.954-20 20-20zM96 0C56.235 0 24 32.235 24 72s32.235 72 72 72 72-32.235 72-72S135.764 0 96 0z"></path></svg>') 50% 50%/8px 8px no-repeat;
  box-shadow: 0px 1px 3px rgba(191, 205, 219, 0.5);
  opacity: 0;
  transition-duration: 0.25s;
}
.flow-card__info:hover {
  border-color: #D9EDFA;
  background-color: #D9EDFA;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 512"><path fill="%231097E2" d="M20 424.229h20V279.771H20c-11.046 0-20-8.954-20-20V212c0-11.046 8.954-20 20-20h112c11.046 0 20 8.954 20 20v212.229h20c11.046 0 20 8.954 20 20V492c0 11.046-8.954 20-20 20H20c-11.046 0-20-8.954-20-20v-47.771c0-11.046 8.954-20 20-20zM96 0C56.235 0 24 32.235 24 72s32.235 72 72 72 72-32.235 72-72S135.764 0 96 0z"></path></svg>');
}
.flow-card:hover .flow-card__info {
  opacity: 1;
}


/**/
/* flow popover */
/**/
.flow-popover {
  position: relative;
  width: 330px;
  padding: 20px;
  border-radius: 6px;
  background: #FFFFFF;
  box-shadow: 0px 4px 24px rgba(191, 205, 219, 0.5);
}
.flow-popover__arrow {
  content: '';
  position: absolute;
  top: 50%;
  right: 100%;
  margin-top: -4px;
  border-top: 4px solid transparent;
  border-right: 4px solid #FFF;
  border-bottom: 4px solid transparent;
}
.flow-popover__image {
  border-radius: 4px;
}
.flow-popover__list {
  padding-top: 12px;
  border-top: 1px solid #EFF3F6;
}
.flow-popover__list dt {
  float: left;
  width: 84px;
}
.flow-popover__list dd {
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid #EFF3F6;
}
.flow-popover__list dd div {
  overflow: hidden;
}
.flow-popover__list dd:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}
.flow-popover__image + .flow-popover__list {
  padding-top: 0;
  border-top: none;
}
.flow-popover .admin-card__badge {
  display: inline-block;
  vertical-align: top;
  font-size: 12px;
  line-height: 20px;
}
.flow-popover .admin-card__badge::before {
  margin-top: 4px;
  margin-bottom: 4px;
}


/**/
/* flow node */
/**/
.flow-node {
  position: relative;
  width: 84px;
  border: 1px solid #D3DBDE;
  border-radius: 4px;
  background-color: #FFF;
}
.flow-node::after {
  content: '';
  position: absolute;
  top: 50%;
  right: -3px;
  width: 6px;
  height: 6px;
  margin-top: -3px;
  border-radius: 50%;
  border: 1px solid #62727B;
  background-color: #FFF;
}
.flow-node__cover {
  height: 50px;
  background-size: cover;
  background-position: 50% 50%;
}
.flow-node__title {
  position: relative;
  overflow: hidden;
  margin-right: 6px;
  padding: 6px 0 6px 28px;
  font-size: 12px;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #37474F;
}
.flow-node__title::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 5px;
  width: 18px;
  height: 18px;
  margin-top: -9px;
  border-radius: 50%;
}
.flow-node__button {
  position: absolute;
  top: -10px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1px solid rgba(191, 205, 219, 0.5);
  background-color: #FFF;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  box-shadow: 0px 1px 3px rgba(191, 205, 219, 0.5);
  pointer-events: none;
  opacity: 0;
  transition-duration: 0.25s;
  transition-property: opacity;
}
.flow-node__button--info {
  right: 20px;
  background-image: url('data:image/svg+xml;utf8,<svg width="8" height="8" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3.91318 0C4.43517 0 4.85734 0.422172 4.85734 0.94416C4.85734 1.46615 4.43517 1.88832 3.91318 1.88832C3.3912 1.88832 2.96902 1.46615 2.96902 0.94416C2.96902 0.422172 3.3912 0 3.91318 0ZM4.77226 2.48067H4.74771H3.2292H3.17356C2.86266 2.48067 2.6123 2.73267 2.6123 3.04193C2.6123 3.35283 2.8643 3.60319 3.17356 3.60319H3.2292V6.87584H2.6123V8H5.38751V6.87584H4.77389V2.48067H4.77226Z" fill="%2337474F"/></svg>');
}
.flow-node__button--split {
  right: 0;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 10 10" fill="none"><path d="M8.80759 2.06615L7.61521 1.37769V2.29523C6.98141 2.34826 6.45859 2.52261 6.02604 2.82409C5.58484 3.13161 5.25497 3.55918 5.02158 4.12739C4.78816 3.5592 4.45827 3.13161 4.01707 2.82409C3.57477 2.51581 3.03806 2.34043 2.38481 2.2918V1.37769L1.19243 2.06615L0 2.75457L1.19241 3.443L2.38481 4.13143V3.2494C4.44328 3.4459 4.54469 5.28001 4.54469 8.62245H5.49842C5.49842 5.3033 5.59813 3.47127 7.61522 3.25347V4.13142L8.8076 3.44298L10 2.75455L8.80759 2.06615Z" fill="%2337474F" stroke="%2337474F" stroke-width="0.3"/></svg>');
}
.flow-node__button--delete {
  left: 0px;
  background-image: url('data:image/svg+xml;utf8,<svg width="8" height="8" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg"><path stroke="%23EE2E24" stroke-linecap="round" stroke-linejoin="round" d="M1 2.00008H1.66667M1.66667 2.00008H7M1.66667 2.00008L1.66666 6.66675C1.66666 6.84356 1.7369 7.01313 1.86192 7.13815C1.98695 7.26318 2.15652 7.33342 2.33333 7.33342H5.66666C5.84347 7.33342 6.01304 7.26318 6.13807 7.13815C6.26309 7.01313 6.33333 6.84356 6.33333 6.66675V2.00008L1.66667 2.00008ZM2.66666 2.00008V1.33341C2.66666 1.1566 2.7369 0.987035 2.86192 0.86201C2.98695 0.736986 3.15652 0.666748 3.33333 0.666748H4.66666C4.84347 0.666748 5.01304 0.736986 5.13807 0.86201C5.26309 0.987035 5.33333 1.1566 5.33333 1.33341V2.00008M3.33334 3.66675V5.66675M4.66666 3.66675V5.66675"/></svg>');
}
.flow-node:hover .flow-node__button {
  pointer-events: auto;
  opacity: 1;
}
.flow-node--lg {
  width: 168px;
}
.flow-node--lg .flow-node__title {
  white-space: normal;
}
.flow-node--xl {
  width: 334px;
}
.flow-node--xl .flow-node__title {
  white-space: normal;
}
.flow-node--xl .flow-node__cover {
  height: 100px;
}
.flow-node--video .flow-node__cover {
  background-image: url(../img/flow-node/video@2x.png);
}
.flow-node--video .flow-node__title::before {
  background: #20D3B3 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="%23FFF" d="M424.4 214.7L72.4 6.6C43.8-10.3 0 6.1 0 47.9V464c0 37.5 40.7 60.1 72.4 41.3l352-208c31.4-18.5 31.5-64.1 0-82.6z"></path></svg>') 55% 50%/8px 8px no-repeat;
}
.flow-node--iframe .flow-node__cover {
  background-image: url(../img/flow-node/iframe@2x.png);
}
.flow-node--iframe .flow-node__title::before {
  background: #9A9AF7 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="%23FFF" d="M234.8 511.7L196 500.4c-4.2-1.2-6.7-5.7-5.5-9.9L331.3 5.8c1.2-4.2 5.7-6.7 9.9-5.5L380 11.6c4.2 1.2 6.7 5.7 5.5 9.9L244.7 506.2c-1.2 4.3-5.6 6.7-9.9 5.5zm-83.2-121.1l27.2-29c3.1-3.3 2.8-8.5-.5-11.5L72.2 256l106.1-94.1c3.4-3 3.6-8.2.5-11.5l-27.2-29c-3-3.2-8.1-3.4-11.3-.4L2.5 250.2c-3.4 3.2-3.4 8.5 0 11.7L140.3 391c3.2 3 8.2 2.8 11.3-.4zm284.1.4l137.7-129.1c3.4-3.2 3.4-8.5 0-11.7L435.7 121c-3.2-3-8.3-2.9-11.3.4l-27.2 29c-3.1 3.3-2.8 8.5.5 11.5L503.8 256l-106.1 94.1c-3.4 3-3.6 8.2-.5 11.5l27.2 29c3.1 3.2 8.1 3.4 11.3.4z"></path></svg>') 50% 50%/12px 12px no-repeat;
}
.flow-node--article .flow-node__cover {
  background-image: url(../img/flow-node/article@2x.png);
}
.flow-node--article .flow-node__title::before {
  background: #DC7DCD url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23FFF" d="M14,0H3A1,1,0,0,0,2,1V23a1,1,0,0,0,1,1H21a1,1,0,0,0,1-1V8H15a1,1,0,0,1-1-1ZM5.5,17h13a.5.5,0,0,1,.5.5v1a.5.5,0,0,1-.5.5H5.5a.5.5,0,0,1-.5-.5v-1A.5.5,0,0,1,5.5,17Zm0-5h13a.5.5,0,0,1,.5.5v1a.5.5,0,0,1-.5.5H5.5a.5.5,0,0,1-.5-.5v-1A.5.5,0,0,1,5.5,12Zm5-3h-5A.5.5,0,0,1,5,8.5v-1A.5.5,0,0,1,5.5,7h5a.5.5,0,0,1,.5.5v1A.5.5,0,0,1,10.5,9Z"></path><polygon fill="%23FFF" points="21.414 6 16 6 16 0.586 21.414 6"></polygon></svg>') 50% 50%/10px 10px no-repeat;
}
.flow-node--question .flow-node__cover {
  background-image: url(../img/flow-node/question@2x.png);
}
.flow-node--question .flow-node__title::before {
  background: #FFCC4D url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 12"><path fill="%23FFF" d="M5.926,0a7.438,7.438,0,0,0-3.7.977l.852,1.711a6.006,6.006,0,0,1,2.672-.766A1.789,1.789,0,0,1,6.8,2.188a.886.886,0,0,1,.375.773,1.383,1.383,0,0,1-.262.82,4.891,4.891,0,0,1-1.082.953A4.2,4.2,0,0,0,4.66,5.914a2.561,2.561,0,0,0-.32,1.305V7.8H6.41V7.328a1.319,1.319,0,0,1,.2-.758,4.63,4.63,0,0,1,.95-.843A5.574,5.574,0,0,0,9.043,4.32a2.746,2.746,0,0,0,.391-1.484A2.528,2.528,0,0,0,8.484.773,3.931,3.931,0,0,0,5.926,0Z"></path><circle fill="%23FFF" cx="5.5" cy="10.5" r="1.5"></circle></svg>') 50% 50%/10px 10px no-repeat;
}


/**/
/* flow modal */
/**/
.flow-modal {
  max-height: calc(100vh - 120px);
  overflow: auto;
  padding: 20px 24px;
  border-radius: 10px;
  background-color: #FFF;
  box-shadow: 0px 1px 2px #C2D0DE, 0px 12px 46px #C2D0DE;
}
.flow-modal__head {
  margin-bottom: 20px;
}
.flow-modal__close {
  float: right;
  width: 64px;
  height: 60px;
  margin: -20px -24px -20px 0;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" stroke="%2362727B" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>') 50% 50% no-repeat;
  transition-duration: 0.25s;
  transition-property: background;
}
.flow-modal__close:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" stroke="%2337474F" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>');
}
.flow-modal__cont {
  margin-top: 16px;
  padding: 20px;
  border-radius: 10px;
  background-color: #F1F5F6;
}


/**/
/* flow logic */
/**/
.flow-logic__type {
  display: inline-block;
  vertical-align: top;
  width: 20px;
  height: 20px;
  margin: 5px 10px 5px 0;
  border-radius: 50%;
}
.flow-logic__type--video {
  background: #20D3B3 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="%23FFF" d="M424.4 214.7L72.4 6.6C43.8-10.3 0 6.1 0 47.9V464c0 37.5 40.7 60.1 72.4 41.3l352-208c31.4-18.5 31.5-64.1 0-82.6z"></path></svg>') 55% 50%/8px 8px no-repeat;
}
.flow-logic__type--iframe {
  background: #9A9AF7 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="%23FFF" d="M234.8 511.7L196 500.4c-4.2-1.2-6.7-5.7-5.5-9.9L331.3 5.8c1.2-4.2 5.7-6.7 9.9-5.5L380 11.6c4.2 1.2 6.7 5.7 5.5 9.9L244.7 506.2c-1.2 4.3-5.6 6.7-9.9 5.5zm-83.2-121.1l27.2-29c3.1-3.3 2.8-8.5-.5-11.5L72.2 256l106.1-94.1c3.4-3 3.6-8.2.5-11.5l-27.2-29c-3-3.2-8.1-3.4-11.3-.4L2.5 250.2c-3.4 3.2-3.4 8.5 0 11.7L140.3 391c3.2 3 8.2 2.8 11.3-.4zm284.1.4l137.7-129.1c3.4-3.2 3.4-8.5 0-11.7L435.7 121c-3.2-3-8.3-2.9-11.3.4l-27.2 29c-3.1 3.3-2.8 8.5.5 11.5L503.8 256l-106.1 94.1c-3.4 3-3.6 8.2-.5 11.5l27.2 29c3.1 3.2 8.1 3.4 11.3.4z"></path></svg>') 50% 50%/12px 12px no-repeat;
}
.flow-logic__type--article {
  background: #DC7DCD url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23FFF" d="M14,0H3A1,1,0,0,0,2,1V23a1,1,0,0,0,1,1H21a1,1,0,0,0,1-1V8H15a1,1,0,0,1-1-1ZM5.5,17h13a.5.5,0,0,1,.5.5v1a.5.5,0,0,1-.5.5H5.5a.5.5,0,0,1-.5-.5v-1A.5.5,0,0,1,5.5,17Zm0-5h13a.5.5,0,0,1,.5.5v1a.5.5,0,0,1-.5.5H5.5a.5.5,0,0,1-.5-.5v-1A.5.5,0,0,1,5.5,12Zm5-3h-5A.5.5,0,0,1,5,8.5v-1A.5.5,0,0,1,5.5,7h5a.5.5,0,0,1,.5.5v1A.5.5,0,0,1,10.5,9Z"></path><polygon fill="%23FFF" points="21.414 6 16 6 16 0.586 21.414 6"></polygon></svg>') 50% 50%/10px 10px no-repeat;
}
.flow-logic__type--question {
  background: #FFCC4D url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 12"><path fill="%23FFF" d="M5.926,0a7.438,7.438,0,0,0-3.7.977l.852,1.711a6.006,6.006,0,0,1,2.672-.766A1.789,1.789,0,0,1,6.8,2.188a.886.886,0,0,1,.375.773,1.383,1.383,0,0,1-.262.82,4.891,4.891,0,0,1-1.082.953A4.2,4.2,0,0,0,4.66,5.914a2.561,2.561,0,0,0-.32,1.305V7.8H6.41V7.328a1.319,1.319,0,0,1,.2-.758,4.63,4.63,0,0,1,.95-.843A5.574,5.574,0,0,0,9.043,4.32a2.746,2.746,0,0,0,.391-1.484A2.528,2.528,0,0,0,8.484.773,3.931,3.931,0,0,0,5.926,0Z"></path><circle fill="%23FFF" cx="5.5" cy="10.5" r="1.5"></circle></svg>') 50% 50%/10px 10px no-repeat;
}
.flow-logic__group {
  margin-top: 16px;
  border-radius: 10px;
  border: 1px solid #CED8DF;
  background: #FFF;
  box-shadow: 0px 2px 6px rgba(194, 208, 222, 0.2), 0px 1px 2px rgba(194, 208, 222, 0.45);
}
.flow-logic__group--inner {
  margin-left: 40px;
}
.flow-logic__group--nested {
  position: relative;
}
.flow-logic__group--nested::after {
  content: '';
  position: absolute;
  top: -16px;
  right: 100%;
  bottom: 50%;
  width: 2px;
  margin-right: 19px;
  margin-bottom: 1px;
  background-color: #62727B;
  opacity: 0.25;
}
.flow-logic__group--nested::before {
  content: '';
  position: absolute;
  top: 50%;
  right: 100%;
  width: 21px;
  height: 2px;
  margin-top: -1px;
  background-color: #62727B;
  opacity: 0.25;
}
.flow-logic__item {
  padding: 19px;
}
.flow-logic__text {
  line-height: 32px;
  color: #37474F;
}
.flow-logic__select {
  display: inline-block;
  vertical-align: top;
  margin: 0 4px;
}
.flow-logic__item-divider {
  position: relative;
  height: 1px;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-left: 19px;
  background-color: #D8DDE0;
}
.flow-logic__item-divider span {
  position: absolute;
  top: -13px;
  left: 0;
  padding: 1px 10px 0;
  border-radius: 13px;
  background-color: #83979E;
  font-size: 12px;
  line-height: 24px;
  font-weight: 700;
  text-transform: uppercase;
  color: #FFF;
}
.flow-logic__group-divider {
  position: relative;
  margin-bottom: -16px;
  margin-left: 20px;
  padding: 12px 0;
}
.flow-logic__group-divider span {
  position: relative;
  display: inline-block;
  vertical-align: top;
  padding: 1px 10px 0;
  border-radius: 13px;
  background-color: #83979E;
  font-size: 12px;
  line-height: 24px;
  font-weight: 700;
  text-transform: uppercase;
  color: #FFF;
}
.flow-logic__group-divider span::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  width: 2px;
  height: 12px;
  margin-left: -1px;
  background-color: #62727B;
  opacity: 0.25;
}
.flow-logic__group-divider span::before {
  content: '';
  position: absolute;
  bottom: 100%;
  left: 50%;
  width: 2px;
  height: 12px;
  margin-left: -1px;
  background-color: #62727B;
  opacity: 0.25;
}
.flow-logic__group--inner + .flow-logic__group-divider {
  margin-left: 60px;
}