/**/
/* fonts */
/**/
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,300;0,400;0,600;0,700;1,400;1,700&display=swap');
/*@font-face {*/
/*    font-family: 'GT America';*/
/*    font-style: normal;*/
/*    font-weight: 400;*/
/*    src: url(../fnt/GT-America-Standard-Regular.woff2);*/
/*}*/
/*@font-face {*/
/*    font-family: 'GT America';*/
/*    font-style: normal;*/
/*    font-weight: 500;*/
/*    src: url(../fnt/GT-America-Standard-Medium.woff2);*/
/*}*/
/*@font-face {*/
/*    font-family: 'GT America';*/
/*    font-style: normal;*/
/*    font-weight: 700;*/
/*    src: url(../fnt/GT-America-Standard-Bold.woff2);*/
/*}*/


/**/
/* 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: 'Lato', Helvetica, Arial, sans-serif!important;
  font-size: 16px;
  line-height: 1.375;
  /* color: #62727B; // moving this to wrapper div
  @todo: move all cascading rules from here to the wrapper div so we don't accidentally mess up vendor wrapper headers
  */

  -webkit-font-smoothing: antialiased;
}

.wrap-everything-but-aarp {
  color: #62727B;
}

/*@TODO have CTT svgs checked, using display block*/
label, img {
  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;
  margin-bottom: 50px;
}
.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--25 {
  flex: 0 0 20.833333%;
  max-width: 20.833333%;
}
.grid-col--3 {
  flex: 0 0 25%;
  max-width: 25%;
}
.grid-col--4 {
  flex: 0 0 33.333%;
  max-width: 33.333%;
}
.grid-col--45 {
  flex: 0 0 37.5%;
  max-width: 37.5%;
}
.grid-col--5 {
  flex: 0 0 41.666667%;
  max-width: 41.666667%;
}
.grid-col--6 {
  flex: 0 0 50%;
  max-width: 50%;
}
.grid-col--65 {
  flex: 0 0 54.1666667%;
  max-width: 54.1666667%;
}
.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;
}
.grid-col--asc {
  align-self: center;
}
@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: 1279px) {
  .removed--lg {
    display: none;
  }
  .blocked--lg {
    display: block;
  }
}
@media screen and (max-width: 1023px) {
  .removed--md {
    display: none;
  }
  .blocked--md {
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .removed--sm {
    display: none;
  }
  .blocked--sm {
    display: block;
  }
}
@media screen and (max-width: 599px) {
  .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;
}

.mr-auto {
  margin-right: auto;
}

.ml-auto {
  margin-left: auto;
}


/**/
/* 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: 26px;
}
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;
  }
}

/*@TODO make p, .p have font size 18px*/

/**/
/* 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;
}
textarea.input__input {
  font-weight: 400;
}


/**/
/* 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--ghost {
  border-color: transparent;
}
.button--blocked {
  display: block;
  width: 100%;
}
.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-ctt {
  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-ctt {
    padding-right: 24px;
    padding-left: 24px;
  }
  .header__search {
    right: 120px;
    left: 120px;
  }
}
@media screen and (max-width: 767.98px) {
  .header-ctt {
    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 */
/**/

/*@TODO make any changes to footer if needed*/

.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-ctt {
  min-height: 200px;
  padding: 40px 0;
  background: url(../img/ctt-content/ctt_left.svg) 0 100% no-repeat fixed, url(../img/ctt-content/ctt_right.svg) 100% 100% no-repeat fixed;
  background-color: #fff;
  background-size: 25%, 25%;
}


/**/
/* 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 {
  width: 100%;
  height: 100%;
  border-radius: 11px;
  overflow: hidden;
}
.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__end--alt {
  color: #48415C;
}
.tutorial__num {
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #676767;
}
.tutorial--top:after {
  top: 100%;
  right: auto;
  left: 20px;
  border-top: 7px solid #FFF;
  border-right: 7px solid transparent;
  border-bottom: 0;
  border-left: 7px solid transparent;
}
.tutorial--left::after {
  top: 20px;
  right: auto;
  left: 100%;
  border-right: 0;
  border-left: 7px solid #FFF;
}
.tutorial--bottom::after {
  top: auto;
  right: auto;
  bottom: 100%;
  left: 20px;
  border-top: 0;
  border-right: 7px solid transparent;
  border-bottom: 7px solid #FFF;
  border-left: 7px solid transparent;
}
@media screen and (max-width: 767.98px) {
  .tutorial::after {
    top: auto;
    right: 50%;
    bottom: 100%;
    left: auto;
    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: url(../img/ctt-content/ctt_left.svg) 0 100% no-repeat fixed, url(../img/ctt-content/ctt_right.svg) 100% 100% no-repeat fixed;
  background-color: #fff;
  background-size: 25%, 25%;
  /*background-image: url(../img/onboard-quiz/bg-left.svg), url(../img/onboard-quiz/bg-right.svg);*/
  /*background-image: url(../img/ctt-content/left.png), url(../img/ctt-content/right.png);*/
  /*background-position: 0 100%, 100% 100%;*/
  /*background-repeat: no-repeat;*/
  /*background: url(../img/ctt-content/left.png) 0 100% no-repeat, url(../img/ctt-content/right.png) 100% 100% no-repeat;*/
  transform: translateY(100%);
  transition-duration: 0.75s;
}
.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;
  }
  .onboard-intro {
    overflow-y:auto;
  }
}
@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;*/
  background-image: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 65%, rgba(249,248,246,1) 65%, rgba(249,248,246,1) 100%);
  /* note - due to scrolling quirk when content is taller than container, can't use "center" below as you would normally (some content cut off, even with overflow:auto)
  using margin-top and margin-bottom of auto on .onboard-intro__cont instead, works and fixes scrolling quirk. */
  align-items: flex-start;
}

.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;
  z-index: 2;
  margin-top:auto;
  margin-bottom:auto;
}
.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%;
  /*background: url(../img/onboard-intro/care_cards2@2x.png) 50% 50%/100% 100%;*/
}

.onboard-intro__cards2 {
    position: relative;
    width: 480px;
    height: 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: 20px;
  border: 1px solid #E8EBED;
  background: #FFFFFF;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  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: #F9F8F6;
}
.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: 27px;
  font-size: 1.125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.10rem;
  line-height: 21px;
  color: #676767;
}
.onboard-questionnaire__heading {
  margin-right: 40px;
  font-size: 2.25rem;
  font-weight: bold;
  color: #37383D;
}
.onboard-questionnaire__row {
  position: relative;
  height: 480px;
}
.onboard-questionnaire__answer {
  position: relative;
  min-height: 62px;
  display: flex;
  align-items: center;
  margin-top: 18px;
  margin-left: 40px;
  padding: 21px 30px 18px 30px;
  border-radius: 50px;
  border: 1px solid #E8EBED;
  background-color: #FFF;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  font-size: 1.125rem;
  line-height: 1.25;
  font-weight: 600;
  color: #37383D;
  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: #EC1300;
  background-color: #EC1300;
  color: #FFF;
  text-decoration: none;
}
.onboard-questionnaire__answer span {
  position: absolute;
  top: 50%;
  right: 16px;
  width: 28px;
  height: 28px;
  margin-top: -14px;
  border-radius: 50px;
  background-color: #ECEEF0;
  line-height: 28px;
  text-align: center;
  color: #62727B;
  transition-duration: 0.25s;
  transition-property: background-color, color;
  font-size: 16px;
}
.onboard-questionnaire__answer:hover span,
.onboard-questionnaire__answer:focus span {
  background: #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: 1;
  transform: rotate(5deg);
  border: 1px solid transparent;
  background: transparent;
}
.onboard-interest__item.active ~ .onboard-interest__item ~ .onboard-interest__item {
  z-index: 8;
  transform: rotate(-7deg);
  border: 1px solid transparent;
  background: transparent;
}
.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(10deg);
}
.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: 25px;
  border-radius: 50px;
  background-color: white;
  color: #050504;
  border: 1px solid #050504;
  transition: all 0.3s ease-out;
}

.onboard-interest__action--yes {
  background-color: #EC1300;
  color: #fff;
  border: 1px solid #EC1300;
}

.onboard-interest__action--yes:hover, .onboard-interest__action--yes:focus {
  background-color: #AB2125;
  color: #fff;
  border: 1px solid #AB2125;
}

.onboard-interest__action--no:hover, .onboard-interest__action--no:focus {
  background: #37383D;
  color:white;
}

@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;
  font-size: 24px;
  line-height: 1.25;
  font-weight: 700;
  color: #23202E;
}
.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, .deepdive-thanks__close:focus {
  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;
}




/**/
/* Care To Talk */
/**/


/**/
/* ctt header */
/**/
.ctt-header {
  position: absolute;
  z-index: 10;
  top: 0;
  right: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 50px;
  padding: 0 32px;
  background: #FFF;
  box-shadow: 0px 1px 0px rgba(182, 198, 215, 0.3);
}
.ctt-header__back {
  margin-left: -8px;
  padding: 0 8px;
  border-radius: 4px;
  font-size: 15px;
  line-height: 28px;
  transition-duration: 0.25s;
  transition-property: background-color, color;
}
.ctt-header__back svg {
  display: inline-block;
  vertical-align: top;
  height: 28px;
  margin-right: 8px;
}
.ctt-header__back:hover {
  background-color: #F6F8FA;
  color: #23202E;
}
/*.ctt-header__logo {*/
/*  position: absolute;*/
/*  top: 50%;*/
/*  left: 50%;*/
/*  transform: translate(-50%, -50%);*/
/*}*/
.ctt-header__slogan {
  display: none;
  margin: 0 auto 0 10px;
  font-size: 20px;
  line-height: 1;
  font-weight: 500;
  color: #48415C;
}
.ctt-header__burger {
  position: relative;
  display: none;
  width: 20px;
  height: 14px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="14" viewBox="0 0 20 14" fill="none" stroke="%2362727B" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M1 7H19"/><path d="M1 1H19"/><path d="M1 13H19"/></svg>');
}
.ctt-header__burger::after {
  content: 'MENU';
  position: absolute;
  top: 0;
  right: 100%;
  padding-right: 5px;
  font-size: 12px;
  line-height: 14px;
  font-weight: 500;
}
@media screen and (max-width: 1023.98px) {
  .ctt-header {
    height: 48px;
    padding: 0 20px;
  }
  .ctt-header__back {
    display: none;
  }
  .ctt-header__logo {
    position: static;
    transform: none;
  }
  /*.ctt-header__slogan {*/
  /*  display: block;*/
  /*}*/
  .ctt-header__burger {
    display: block;
  }
  .ctt-header .profile-nav {
    display: none;
  }
}


/**/
/* profile nav */
/**/
.profile-nav {
  position: relative;
  display: flex;
  align-items: center;
}

.profile-nav .ctt-logout {
    margin-left: 10px;
    border-left: 1px solid #ccc;
    padding-left: 10px;
}
.profile-nav__toggle {
  display: flex;
  align-items: center;
  font-size: 15px;
  transition-duration: 0.25s;
  transition-property: color;
}
.profile-nav__toggle img {
  margin-right: 8px;
  border-radius: 50%;
}
.profile-nav__toggle:hover {
  color: #23202E;
}


/**/
/* ctt subheader */
/**/
.ctt-subheader {
  position: absolute;
  z-index: 10;
  top: 0;
  right: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 32px;
  background: #FFF;
  box-shadow: 0 2px 20px #fff, 0 1px 3px #fff;
  border-bottom: 1px solid #EAEEF3;
}
@media screen and (max-width: 1023.98px) {
  .ctt-subheader {
    display: block;
    padding: 0;
  }
  .ctt-subheader .deck-nav,
  .ctt-subheader .ctt-switcher {
    display: none;
  }
}


/**/
/* ctt tabs */
/**/
.ctt-tabs {
  display: flex;
  text-align: center;
}
.ctt-tabs__item {
  font-size: 18px;
  line-height: 48px;
  font-weight: 300;
  transition-duration: 0.25s;
  transition-property: color;
  color: #37383D;
  padding-left: 30px;
  padding-right: 30px;
  margin-bottom: -5px;
  width:100%;
  text-align:center;
}

.ctt-tabs__item.active, .ctt-tabs__item:focus, .ctt-tabs__item:hover {
  box-shadow: inset 0 -3px 0 0 #DF502B;
  font-weight: 700;
  letter-spacing: -0.1px;
  text-decoration: none;
  color: #37383D !important;
}

@media screen and (max-width: 1023.98px) {
  .ctt-tabs__item.active {
    box-shadow: inset 0 -3px 0 0 #EE2E24;
  }
  .ctt-tabs__item:not(:first-child) {
    margin-left: 0;
  }
  .ctt-tabs__item {
    padding-left: 0px;
    padding-right: 0px;
  }
}


/**/
/* ctt switcher */
/**/
.ctt-switcher {
  display: flex;
  align-items: center;
  width: 240px;
  overflow: hidden;
  border-radius: 20px;
  background-color: #FFF;
  border: 1px solid #A0A0A0;
  text-align: center;
  position: absolute;
  left: 50%;
  transform: translateX(-100%);
}
.ctt-switcher__item {
  flex-grow: 1;
  width: 50%;
  font-size: 14px;
  font-weight: 400;
  line-height: 28px;
  transition: all 0.25s ease-out;
  color: #272727;
  display: flex;
  justify-content: center;
}

.ctt-switcher__item svg {
  display: inline-block;
  vertical-align: top;
  height: 28px;
  margin-right: 8px;
}

.ctt-switcher__item:hover, .ctt-switcher__item:focus {
  background-color: #37383D;
  color: #fff;
}

.ctt-switcher__item.active {
  background-color: #37383D;
  color: #fff;
}


/**/
/* deck nav */
/**/
.deck-nav {
  position: relative;
  display: flex;
  align-items: center;
  margin-right: -20px;
}
.deck-nav__item {
  margin-left: 4px;
  padding: 0 10px;
  border-radius: 4px;
  font-size: 15px;
  line-height: 28px;
  font-weight: 400;
  transition-duration: 0.25s;
  transition-property: background-color, color;
  color: #37383D;
}
.deck-nav__item svg {
  display: inline-block;
  vertical-align: top;
  height: 28px;
  margin-right: 0;
}
.deck-nav__item:hover,
.deck-nav__item:focus,
.deck-nav__item.active {
  background-color: #F6F8FA;
  color: #23202E;
}
.deck-nav__item--new {
  color: #1097E2;
}
.deck-nav__item--new:hover {
  color: #1097E2;
}
.deck-nav__dropdown {
  position: absolute;
  z-index: 11;
  top: 100%;
  right: 0;
  min-width: 143px;
  margin-top: 4px;
  padding: 10px 5px;
  border-radius: 4px;
  border: 1px solid #EBEBEB;
  background-color: #FFF;
  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;
}
.deck-nav__dropdown.active {
  pointer-events: auto;
  opacity: 1;
}
.deck-nav__option {
  display: block;
  padding: 0 16px 0 12px;
  font-size: 15px;
  line-height: 32px;
  font-weight: 500;
  color: #6F6F6F;
  transition-duration: 0.25s;
  transition-property: background-color, color;
}
.deck-nav__option svg {
  display: inline-block;
  vertical-align: top;
  height: 32px;
  margin-right: 8px;
}
.deck-nav__option:hover {
  background-color: #F6F8FA;
  color: #23202E;
}


/**/
/* ctt banner */
/**/
.ctt-banner {
  padding: 6px 30px;
  background-color: #23AD8C;
  font-weight: 500;
  text-align: center;
  color: #FFF;
}
.ctt-banner::before {
  content: '';
  display: inline-block;
  vertical-align: top;
  width: 17px;
  height: 22px;
  margin-right: 8px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 17 12" fill="white"><path d="M16.5907 0.335206C16.1437 -0.111735 15.4191 -0.111735 14.9721 0.335204L6.07041 9.23694L2.02372 5.19026C1.57678 4.74332 0.852144 4.74332 0.405205 5.19026C-0.0417354 5.6372 -0.0417345 6.36183 0.405205 6.80877L5.24948 11.653C5.25331 11.657 5.25717 11.6609 5.26107 11.6648C5.70801 12.1117 6.43264 12.1117 6.87958 11.6648L16.5907 1.95372C17.0376 1.50678 17.0376 0.782145 16.5907 0.335206Z"/></svg>') 50% 50%/17px 12px no-repeat;
}


/**/
/* ctt content */
/**/
.ctt-content {
  min-height: calc(100vh - 99px);
  background: url(../img/ctt-content/ctt_left.svg) 0 100% no-repeat fixed, url(../img/ctt-content/ctt_right.svg) 100% 100% no-repeat fixed;
  background-size: 25%, 25%;
  background-color: #fff;
}


/**/
/* ctt categories */
/**/
.button--red {
  background: #EC1300;
  color: #fff;
  font-size: 18px;
  border-radius: 25px;
}

.button--red:hover {
  background: #AB2125;
}

.ctt-categories {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  align-items: center;
  margin-bottom: 0;
  position: relative;
}

.category-item-holder {
  height: 100%;
  display: flex;
  left: 50%;
  position: absolute;
  transform: translateX(-50%);
}

.ctt-categories__item {
  margin-right: 10px;
  margin-bottom: 10px;
  padding: 0 16px;
  border: 1px solid #37383D;
  border-radius: 15px;
  background-color: #FFF;
  font-size: 14px;
  line-height: 28px;
  font-weight: 500;
  color: #272727;
  transition: all 0.4s ease-out;
}
.ctt-categories__item span {
  margin-left: 2px;
  font-weight: 400;
}
.ctt-categories__item:hover {
  box-shadow: 0 0 0 1px #37383D;
  color: #272727;
}

.ctt-categories__item:focus, .ctt-categories__item.active:focus, .ctt-categories__item.active {
  background-color: #37383D;
  color: #fff!important;
}
.ctt-categories__item.disabled {
  pointer-events: none;
  opacity: 0.5;
}
.ctt-categories__item--fav, .ctt-categories__item--fav:hover  {
  color: #EC1300!important;
}

.ctt-categories__item--help {
  margin-left: auto;
  margin-right: 50px!important;
}

.ctt-categories__item--fav::before {
  width: 14px;
  height: 14px;
  margin-top: 7px;
  margin-right: 4px;
}
.ctt-categories__item--loves::before {
  background-color: #5771CC;
}
/*.ctt-categories__item--memories::before {*/
/*  background-color: #3A99F1;*/
/*}*/
.ctt-categories__item--relationships::before {
  background-color: #E55488;
}
.ctt-categories__item--reflections::before {
  background-color: #5DBFA2;
}
.ctt-categories__item--roadmap::before {
  background-color: #F1631E;
}
.ctt-categories__item--wishes::before {
  background-color: #945DBF;
}
.ctt-categories__item--legacy::before {
  background-color: #F5C242;
}
/*.ctt-categories__item--favorites::before {*/
/*    background-color: #daa11a;*/
/*}*/
.ctt-categories__space {
  width: 2px;
  height: 20px;
  margin: 5px 10px 0 0;
  background-color: #DCE2E8;
}
@media screen and (max-width: 1023px) {
  .ctt-categories {
    margin-right: -12px;
  }

  .category-item-holder {
    position: relative;
    transform: translateX(0);
    left: 0;
  }

  .ctt-categories__item--help {
    margin-right: 10px!important;
  }

  .ctt-categories__item {
    margin-right: 8px;
    margin-bottom: 6px;
    border-radius: 20px;
    line-height: 32px;
    padding: 0 14px;
  }
  .ctt-categories__item span {
    float: right;
    margin-left: 6px;
  }
  .ctt-categories__item::before {
    margin-top: 16px;
  }

  .ctt-categories__item--fav::before {
    margin-top: 12px;
  }
  .ctt-categories__space {
    width: calc(100% - 12px);
    height: 2px;
    margin-bottom: 12px;
  }
}


/**/
/* ctt sorting */
/**/
.ctt-sorting {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.ctt-sorting__label {
  margin-right: 12px;
  font-size: 15px;
  font-weight: 500;
  color: #272727;
  width: 90px;
}
.ctt-sorting__toggle {
  padding: 5px 24px 5px 14px;
  border-radius: 4px;
  border: 1px solid #A0A0A0;
  background: #FFF url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11.13' height='5.732' viewBox='0 0 11.13 5.732'%3E%3Cpath id='Path_8' data-name='Path 8' d='M-12199.812-1328.115l4.682,4.525,5.035-4.525' transform='translate(12200.519 1328.822)' fill='none' stroke='%235f5f5f' stroke-linecap='round' stroke-linejoin='round' stroke-width='1'/%3E%3C/svg%3E%0A") 95% 50% no-repeat;
  box-shadow: 0 2px 2px rgba(196, 196, 235, 0.15);
  font-size: 14px;
  line-height: 25px;
  font-weight: 500;
  color: #48415C;
  transition-duration: 0.25s;
  transition-property: border-color, color;
  width: 100%;
}
.ctt-sorting__dropdown {
  position: absolute;
  z-index: 11;
  top: 100%;
  right: 0;
  min-width: 143px;
  margin-top: 4px;
  padding: 10px 5px;
  border-radius: 4px;
  border: 1px solid #EBEBEB;
  background-color: #FFF;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.06), 0px 15px 20px rgba(194, 208, 222, 0.4);
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition-duration: 0.25s;
  transition-property: opacity;
}
.ctt-sorting__dropdown.active {
  pointer-events: auto;
  opacity: 1;
}
.ctt-sorting__option {
  display: block;
  padding: 0 16px 0 12px;
  font-size: 15px;
  line-height: 32px;
  font-weight: 500;
  color: #6F6F6F;
  transition-duration: 0.25s;
  transition-property: background-color, color;
}
.ctt-sorting__option svg {
  display: inline-block;
  vertical-align: top;
  height: 32px;
  margin-right: 8px;
}
.ctt-sorting__option:hover {
  background-color: #F6F8FA;
  color: #23202E;
}
@media screen and (max-width: 1023.98px) {
  .ctt-sorting {
    display: flex;
  }
  .ctt-sorting__toggle {
    line-height: 25px;
  }
  .ctt-sorting__dropdown {
    left: 0;
  }
}


/**/
/* ctt card */
/**/
.ctt-card-wrap {
  position: relative;
  max-width: 340px;
  margin-right: auto;
  margin-left: auto;
}
.ctt-card-wrap--stack::after,
.ctt-card-wrap--stack::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border: 1px solid #EBEBEB;
  background-color: #FFFFFF;
  box-shadow: 0px 9px 18px rgba(87, 105, 114, 0.05);
  opacity: 0.5;
  border-radius: 10px;
}
.ctt-card-wrap--stack::after {
  transform: rotate(5deg);
}
.ctt-card-wrap--stack::before {
  transform: rotate(-5deg);
}
.ctt-card {
  position: relative;
  z-index: 1;
  padding: 19px 29px;
  border-radius: 10px;
  background-color: #FFFFFF;
  border: 2px solid #575757;
  min-height: 350px;
  height: 100%;
}
.ctt-card__cont {
  min-height: 220px;
  margin-top: 40px;
}
.ctt-card__foot {
  display: flex;
  align-items: center;
  margin-top: 20px;
}
.ctt-card__category {
  color: #EC1300;
  position: relative;
  margin-bottom: 20px;
  font-size: 12px;
  line-height: 26px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.ctt-card__category::after {
  content: '';
  position: absolute;
  left: 0;
  width: 26px;
  height: 26px;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}
.ctt-card__category::before {
  content: '';
  display: inline-block;
  vertical-align: middle;
  width: 26px;
  height: 26px;
  margin-right: 5px;
}
.ctt-card__category--loves {
  color: #5771CC;
}
.ctt-card__category--loves::after {
  background-image: url('data:image/svg+xml;utf8,<svg width="14" height="12" viewBox="0 0 14 12" fill="%235771CC" xmlns="http://www.w3.org/2000/svg"><path d="M12.1566 1.68913C11.8586 1.39105 11.5049 1.15459 11.1155 0.993265C10.7262 0.831937 10.3089 0.748901 9.88741 0.748901C9.46596 0.748901 9.04863 0.831937 8.65928 0.993265C8.26993 1.15459 7.91618 1.39105 7.61824 1.68913L6.99991 2.30747L6.38157 1.68913C5.77975 1.08731 4.96351 0.749213 4.11241 0.749213C3.2613 0.749213 2.44506 1.08731 1.84324 1.68913C1.24142 2.29095 0.90332 3.1072 0.90332 3.9583C0.90332 4.8094 1.24142 5.62565 1.84324 6.22747L2.46157 6.8458L6.99991 11.3841L11.5382 6.8458L12.1566 6.22747C12.4547 5.92953 12.6911 5.57577 12.8524 5.18642C13.0138 4.79707 13.0968 4.37975 13.0968 3.9583C13.0968 3.53685 13.0138 3.11953 12.8524 2.73018C12.6911 2.34082 12.4547 1.98707 12.1566 1.68913Z"/></svg>');
}
.ctt-card__category--loves {
  color: #5771CC;
}
.ctt-card__category--loves::after {
  background-image: url('data:image/svg+xml;utf8,<svg width="14" height="12" viewBox="0 0 14 12" fill="%235771CC" xmlns="http://www.w3.org/2000/svg"><path d="M12.1566 1.68913C11.8586 1.39105 11.5049 1.15459 11.1155 0.993265C10.7262 0.831937 10.3089 0.748901 9.88741 0.748901C9.46596 0.748901 9.04863 0.831937 8.65928 0.993265C8.26993 1.15459 7.91618 1.39105 7.61824 1.68913L6.99991 2.30747L6.38157 1.68913C5.77975 1.08731 4.96351 0.749213 4.11241 0.749213C3.2613 0.749213 2.44506 1.08731 1.84324 1.68913C1.24142 2.29095 0.90332 3.1072 0.90332 3.9583C0.90332 4.8094 1.24142 5.62565 1.84324 6.22747L2.46157 6.8458L6.99991 11.3841L11.5382 6.8458L12.1566 6.22747C12.4547 5.92953 12.6911 5.57577 12.8524 5.18642C13.0138 4.79707 13.0968 4.37975 13.0968 3.9583C13.0968 3.53685 13.0138 3.11953 12.8524 2.73018C12.6911 2.34082 12.4547 1.98707 12.1566 1.68913Z"/></svg>');
}
.ctt-card__category--memories::after {
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 27.15 27.2' style='enable-background:new 0 0 27.15 27.2;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23EC1300;enable-background:new ;%7D .st1%7Bfill:%23FFFFFF;enable-background:new ;%7D%0A%3C/style%3E%3Cg%3E%3Ccircle class='st0' cx='13.58' cy='13.6' r='13'/%3E%3Cg%3E%3Cpath class='st1' d='M13.39,20.06c-1.31-2.78-6.64-2.19-6.64-2.19v-9.6h4.87c0.98,0,1.77,0.93,1.77,2.08 C13.39,10.35,13.39,17.81,13.39,20.06z'/%3E%3Cpath class='st1' d='M14.61,20.06c1.31-2.78,6.64-2.19,6.64-2.19v-9.6h-4.87c-0.98,0-1.77,0.93-1.77,2.08 C14.61,10.35,14.61,17.81,14.61,20.06z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
}

.ctt-card__category--relationships::after {
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 27.15 27.2' style='enable-background:new 0 0 27.15 27.2;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23EC1300;enable-background:new ;%7D .st1%7Bfill:%23FFFFFF;enable-background:new ;%7D%0A%3C/style%3E%3Cg%3E%3Ccircle class='st0' cx='13.58' cy='13.6' r='13'/%3E%3Cg%3E%3Ccircle class='st1' cx='11.77' cy='10.9' r='3.17'/%3E%3Cpath class='st1' d='M11.83,15.09c-2.21,0-4.12,1.28-5.04,3.14c-0.19,0.39,0.1,0.85,0.54,0.85h9c0.43,0,0.73-0.46,0.54-0.85 C15.95,16.37,14.04,15.09,11.83,15.09z'/%3E%3Cpath class='st1' d='M16.39,7.55c-0.6,0-1.15,0.19-1.6,0.52c0.7,0.74,1.13,1.73,1.13,2.83c0,0.73-0.2,1.4-0.54,2 c0.31,0.12,0.65,0.2,1.01,0.2c1.53,0,2.77-1.24,2.77-2.77S17.92,7.55,16.39,7.55z'/%3E%3Cpath class='st1' d='M17.54,17.46h3.05c0.28,0,0.45-0.29,0.34-0.55c-0.75-1.73-2.48-2.94-4.49-2.94c-0.83,0-1.62,0.21-2.3,0.58 C15.56,15.1,16.77,16.13,17.54,17.46z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
}
.ctt-card__category--reflections::after {
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 27.15 27.2' style='enable-background:new 0 0 27.15 27.2;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23EC1300;enable-background:new ;%7D .st1%7Bfill:%23FFFFFF;enable-background:new ;%7D%0A%3C/style%3E%3Cg%3E%3Ccircle class='st0' cx='13.58' cy='13.6' r='13'/%3E%3Cg%3E%3Cpolygon class='st1' points='13.24,15.92 7.66,19.84 7.66,7.37 13.24,11.17 '/%3E%3Cpolygon class='st1' points='14.76,15.92 20.34,19.84 20.34,7.37 14.76,11.17 '/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
}
.ctt-card__category--roadmap::after {
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 27.15 27.2' style='enable-background:new 0 0 27.15 27.2;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23EC1300;enable-background:new ;%7D .st1%7Benable-background:new ;%7D .st2%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Cg%3E%3Ccircle class='st0' cx='13.58' cy='13.6' r='13'/%3E%3Cg%3E%3Cg class='st1'%3E%3Cpath class='st2' d='M10.7,17.65l-3.76,1.73c-0.1,0.05-0.21-0.03-0.21-0.14L6.7,9.65c0-0.06,0.03-0.11,0.09-0.14l3.79-1.73 c0.1-0.05,0.21,0.03,0.21,0.14l0,9.59C10.79,17.57,10.75,17.62,10.7,17.65z'/%3E%3C/g%3E%3Cg class='st1'%3E%3Cpath class='st2' d='M20.37,17.69l-3.79,1.73c-0.1,0.05-0.21-0.03-0.21-0.14l0-9.6c0-0.06,0.03-0.11,0.09-0.14l3.77-1.72 c0.1-0.05,0.21,0.03,0.21,0.14l0.03,9.59C20.45,17.61,20.42,17.66,20.37,17.69z'/%3E%3C/g%3E%3Cg class='st1'%3E%3Cpath class='st2' d='M11.57,17.66l3.82,1.75c0.1,0.05,0.21-0.03,0.21-0.14l0.01-9.59c0-0.06-0.03-0.11-0.09-0.14L11.7,7.78 c-0.1-0.05-0.21,0.03-0.21,0.14l-0.01,9.6C11.48,17.58,11.51,17.63,11.57,17.66z'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
}
.ctt-card__category--link::after {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 26.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 100 100' style='enable-background:new 0 0 100 100;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%237A0049;%7D%0A%3C/style%3E%3Cg%3E%3Cg%3E%3Cpath class='st0' d='M75.4,58.1l12.7-12.7c9.2-9.2,9.2-24.3,0-33.5c-9.2-9.2-24.3-9.2-33.5,0L36.2,30.2c-9.2,9.2-9.2,24.3,0,33.5 c1.4,1.4,2.9,2.5,4.4,3.5l9.8-9.8c-1.9-0.4-3.6-1.4-5.1-2.8c-4.2-4.2-4.2-11,0-15.2l18.3-18.3c4.2-4.2,11-4.2,15.2,0 c4.2,4.2,4.2,11,0,15.2l-5.4,5.4C75.8,46.9,76.4,52.6,75.4,58.1z'/%3E%3C/g%3E%3Cg%3E%3Cpath class='st0' d='M24.6,41.9L11.9,54.5c-9.2,9.2-9.2,24.3,0,33.5c9.2,9.2,24.3,9.2,33.5,0l18.3-18.3c9.2-9.2,9.2-24.3,0-33.5 c-1.4-1.4-2.9-2.5-4.4-3.5l-9.8,9.8c1.9,0.4,3.6,1.4,5.1,2.8c4.2,4.2,4.2,11,0,15.2L36.3,78.9c-4.2,4.2-11,4.2-15.2,0 s-4.2-11,0-15.2l5.4-5.4C24.2,53.1,23.6,47.4,24.6,41.9z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
}
.ctt-card__category--video::after {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 26.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns:cc='http://creativecommons.org/ns%23' xmlns:dc='http://purl.org/dc/elements/1.1/' xmlns:inkscape='http://www.inkscape.org/namespaces/inkscape' xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns%23' xmlns:sodipodi='http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd' xmlns:svg='http://www.w3.org/2000/svg' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 100 100' style='enable-background:new 0 0 100 100;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23F16B65;%7D%0A%3C/style%3E%3Cpath class='st0' d='M75.4,45.5L29.8,19.1c-3.5-2-7.8,0.5-7.8,4.5v52.7c0,4,4.4,6.5,7.8,4.5l45.6-26.3 C78.9,52.5,78.9,47.5,75.4,45.5z'/%3E%3C/svg%3E%0A");
}

.ctt-card__category--wishes::after {
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 27.15 27.2' style='enable-background:new 0 0 27.15 27.2;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Benable-background:new ;%7D .st1%7Bfill:%23EC1300;%7D .st2%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Cg%3E%3Cg class='st0'%3E%3Ccircle class='st1' cx='13.58' cy='13.6' r='13'/%3E%3C/g%3E%3Cg%3E%3Cg class='st0'%3E%3Cpath class='st2' d='M8.93,19.65c-0.28,0-0.56-0.1-0.77-0.32c-0.43-0.43-0.44-1.12-0.01-1.55l5.33-5.41 c0.43-0.43,1.12-0.44,1.56-0.01c0.43,0.43,0.44,1.12,0.01,1.55l-5.33,5.41C9.5,19.54,9.21,19.65,8.93,19.65z'/%3E%3C/g%3E%3Cg class='st0'%3E%3Cpath class='st2' d='M17.18,11.31c-0.22,0-0.45-0.08-0.62-0.25c-0.36-0.34-0.37-0.91-0.03-1.27l1.57-1.66 c0.34-0.36,0.91-0.37,1.27-0.03c0.36,0.34,0.37,0.91,0.03,1.27l-1.57,1.66C17.65,11.21,17.42,11.31,17.18,11.31z'/%3E%3C/g%3E%3Cg class='st0'%3E%3Cpath class='st2' d='M14.45,10.34c-0.01,0-0.02,0-0.03,0c-0.5-0.02-0.88-0.44-0.87-0.93l0.08-2.12c0.02-0.5,0.41-0.86,0.93-0.87 c0.5,0.02,0.88,0.44,0.87,0.93l-0.08,2.12C15.34,9.96,14.94,10.34,14.45,10.34z'/%3E%3C/g%3E%3Cg class='st0'%3E%3Cpath class='st2' d='M20.45,13.98c-0.01,0-0.03,0-0.04,0l-2.12-0.09c-0.5-0.02-0.88-0.44-0.86-0.94s0.43-0.86,0.94-0.86 l2.12,0.09c0.5,0.02,0.88,0.44,0.86,0.94C21.32,13.6,20.93,13.98,20.45,13.98z'/%3E%3C/g%3E%3Cg class='st0'%3E%3Cpath class='st2' d='M11.42,11.21c-0.31,0-0.62-0.16-0.78-0.46L9.64,9C9.39,8.56,9.55,8.02,9.98,7.77 c0.43-0.25,0.98-0.09,1.23,0.34l1,1.76c0.25,0.43,0.09,0.98-0.34,1.23C11.73,11.17,11.57,11.21,11.42,11.21z'/%3E%3C/g%3E%3Cg class='st0'%3E%3Cpath class='st2' d='M19,17.68c-0.17,0-0.34-0.05-0.49-0.15l-1.74-1.14c-0.42-0.27-0.53-0.83-0.26-1.25 c0.27-0.42,0.83-0.53,1.25-0.26l1.74,1.14c0.42,0.27,0.53,0.83,0.26,1.25C19.58,17.53,19.29,17.68,19,17.68z'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
}
.ctt-card__category--legacy::after {
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 27.15 27.2' style='enable-background:new 0 0 27.15 27.2;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23EC1300;enable-background:new ;%7D .st1%7Bfill:%23FFFFFF;enable-background:new ;%7D%0A%3C/style%3E%3Cg%3E%3Ccircle class='st0' cx='13.58' cy='13.6' r='13'/%3E%3Cpath class='st1' d='M19.73,8.21h-1.87V8.15c0-0.5-0.47-0.9-1.05-0.9h-5.9c-0.58,0-1.05,0.4-1.05,0.9v0.1 C9.77,8.22,9.68,8.21,9.58,8.21H7.42c-0.58,0-1.05,0.4-1.05,0.9v1.25c0,1.24,1.17,2.25,2.62,2.25h0.59c0.1,0,0.2-0.02,0.29-0.04 v0.56c0,1.46,1.17,2.73,2.79,3.1v1.87h-1.76c-0.44,0-0.8,0.31-0.8,0.69v1.03c0,0.38,0.36,0.69,0.8,0.69h5.94 c0.44,0,0.8-0.31,0.8-0.69V18.8c0-0.38-0.36-0.69-0.8-0.69h-1.76v-1.88c1.62-0.37,2.79-1.64,2.79-3.1v-0.52h0.3 c1.44,0,2.62-1.01,2.62-2.25V9.11C20.78,8.61,20.31,8.21,19.73,8.21z M9.82,11.42H9.37c-0.67,0-1.22-0.47-1.22-1.05V9.4h1.68V11.42 z M16.09,13.13c0,0.7-0.71,1.3-1.66,1.4c-0.05,0.01-0.1,0.01-0.15,0.02h-0.81c-0.05-0.01-0.1-0.02-0.15-0.02 c-0.95-0.1-1.66-0.7-1.66-1.4V9.05h4.43V13.13z M19.18,10.37c0,0.58-0.55,1.05-1.22,1.05h-0.23V9.4h1.45V10.37z'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.ctt-card__submitted {
  margin-top: 20px;
  font-size: 13px;
}
.ctt-card__favourite {
  width: 30px;
  height: 30px;
  margin-right: 8px;
  background: #FFF url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24.051' height='21.601' viewBox='0 0 24.051 21.601'%3E%3Cg id='Group_389' data-name='Group 389' transform='translate(-5.809 -261.584)'%3E%3Cpath id='Path' d='M14.1,17.4h0c-.75.622-1.5,1.243-2.225,1.878a1.3,1.3,0,0,1-1.7,0C9.446,18.646,8.7,18.026,7.95,17.4a42.8,42.8,0,0,1-5.763-5.415A8.2,8.2,0,0,1,0,6.621a6.883,6.883,0,0,1,1.749-4.7A5.932,5.932,0,0,1,6.16,0c1.981,0,3.9,1.526,4.711,2.3.057.055.109.106.155.152.046-.046.1-.1.155-.152.807-.772,2.73-2.3,4.711-2.3A5.932,5.932,0,0,1,20.3,1.918a6.882,6.882,0,0,1,1.749,4.7,8.2,8.2,0,0,1-2.187,5.368A42.757,42.757,0,0,1,14.1,17.4Z' transform='translate(6.809 262.584)' fill='none' stroke='%23707070' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E%0A") 50% 50%/25px 22px no-repeat;
  transition-duration: 0.25s;
  transition-property: border-color, background;
}
.ctt-card__favourite:hover, .ctt-card__favourite:focus, .ctt-card__favourite.active:focus {
  border-color: #929EA6;
}
.ctt-card__favourite.active {
  border-color: rgb(238, 52, 43);
  /*background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 18 18" fill="%23ECB33E" xmlns="http://www.w3.org/2000/svg"><path d="M11.6053 6.74999C11.3926 6.74999 11.2031 6.61534 11.1332 6.41441L9.47219 1.64414C9.3164 1.19669 8.6836 1.19669 8.52781 1.64414L6.86685 6.41441C6.79688 6.61534 6.60742 6.74999 6.39465 6.74999H1.44986C0.974571 6.74999 0.7674 7.35073 1.14165 7.64371L5.22586 10.8409C5.39123 10.9704 5.45808 11.1894 5.39319 11.3891L3.81445 16.2485C3.6648 16.7092 4.19203 17.0922 4.58388 16.8075L8.70611 13.8125C8.88135 13.6852 9.11865 13.6852 9.29389 13.8125L13.4161 16.8075C13.808 17.0922 14.3352 16.7092 14.1855 16.2485L12.6068 11.3891C12.5419 11.1894 12.6088 10.9704 12.7741 10.8409L16.8583 7.64371C17.2326 7.35073 17.0254 6.74999 16.5501 6.74999H11.6053Z"/></svg>');*/
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="%23EE342B" viewBox="0 0 24 24"><path d="M12 4.435c-1.989-5.399-12-4.597-12 3.568 0 4.068 3.06 9.481 12 14.997 8.94-5.516 12-10.929 12-14.997 0-8.118-10-8.999-12-3.568z" fill="%23EE342B"/></svg>');
}
.ctt-card__count {
  font-size: 12px;
}
/*.ctt-card__count span {*/
/*  font-weight: 700;*/
/*  color: #23202E;*/
/*}*/
.ctt-card__add-to-deck {
  flex-basis: 100%;
  border-radius: 25px;
  border: 1px solid #EC1300;
  background-color: #FFF;
  box-shadow: 0 2px 2px rgba(196, 196, 235, 0.15);
  font-size: 18px;
  line-height: 38px;
  font-weight: 500;
  text-align: center;
  color: #EC1300;
  transition-duration: 0.25s;
  transition-property: border-color, color;
}

.ctt-card__add-to-deck:hover {
  border-color: #AB2125;
  color: #AB2125;
}
.ctt-card__added-to-deck {
  flex-grow: 1;
  border-radius: 25px;
  background-color: #ECEFF2;
  color: #4D4D4D;
  font-size: 16px;
  line-height: 40px;
  text-align: center;
}
.ctt-card__remove-from-deck {
  border-radius: 25px;
  border: 1px solid #37383D;
  transition-duration: 0.25s;
  transition-property: background;
  padding: 8px 25px;
  margin-left: 10px;
}
.ctt-card__remove-from-deck:hover {
  box-shadow: 0 0 0 1px #37383D;
}
@media screen and (max-width: 767.98px) {
  .ctt-card--inlist {
    padding: 19px;
  }
  .ctt-card--inlist .ctt-card__category {
    margin-bottom: 10px;
  }
  .ctt-card--inlist .ctt-card__cont {
    /*min-height: 0;*/
  }
  .ctt-card--inlist .ctt-card__title {
    font-size: 18px;
    line-height: 1.334;
    font-weight: 500;
  }
  .ctt-card--inlist .ctt-card__foot {
    margin-top: 10px;
  }
  .ctt-card--inlist .ctt-card__submitted {
    margin-top: 10px;
    padding-bottom: 5px;
  }
}


/**/
/* ctt modal */
/**/
.ctt-modal {
  max-width: 500px;
  padding: 20px 40px;
  border-radius: 4px;
  background-color: #FFF;
  box-shadow: 0px 18px 40px rgba(0, 0, 0, 0.12);
}
.ctt-modal__close {
  display: block;
  width: 30px;
  height: 30px;
  margin: -4px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22" fill="none" stroke="%2337474F" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M17.1875 4.8125L4.8125 17.1875"/><path d="M17.1875 17.1875L4.8125 4.8125"/></svg>') 50% 50%/22px 22px no-repeat;
}
.ctt-modal__close:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22" fill="none" stroke="%2323202E" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M17.1875 4.8125L4.8125 17.1875"/><path d="M17.1875 17.1875L4.8125 4.8125"/></svg>');
}
.ctt-modal__cont {
  margin-right: -20px;
  margin-left: -20px;
  padding: 20px;
  border-radius: 4px;
  background-color: #F6F8FA;
}
.ctt-modal__tabs {
  display: flex;
  margin: -20px -20px 20px;
  padding: 0 20px;
  border-bottom: 2px solid #E6EFF3;
  font-size: 18px;
  font-weight: 500;
  text-align: center;
}
.ctt-modal__tabs a {
  margin-right: 24px;
  padding: 16px 0 12px;
  color: #37383D;
}
.ctt-modal__tabs a:hover {
  color: #37383D;
}
.ctt-modal__tabs a.active {
  box-shadow: 0 2px 0 0 #EE2E24;
  font-weight: 700;
}
.ctt-modal__pane {
  display: none;
}
.ctt-modal__pane.active {
  display: block;
}
@media screen and (max-width: 767.98px) {
  .ctt-modal {
    padding: 20px;
    border-radius: 20px 20px 0 0;
  }
  .ctt-modal__cont {
    border-radius: 0;
    border-bottom: 1px solid #E5ECF0;
    background-color: transparent;
  }
  .ctt-modal__tabs a {
    width: 50%;
    margin: 0;
  }
  .ctt-modal__leading {
    font-size: 16px;
  }
}


/**/
/* ctt filter */
/**/
.ctt-filter {
  position: fixed;
  z-index: 10000;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(55, 71, 79, 0.4);
  pointer-events: none;
  opacity: 0;
  transition-duration: 0.25s;
  transition-property: opacity;
}
.ctt-filter.active {
  pointer-events: all;
  opacity: 1;
}
.ctt-filter.active .ctt-filter__cont {
  transform: none;
}
.ctt-filter__cont {
  position: absolute;
  right: 0;
  top: 210px;
  left: 0;
  padding: 20px 20px;
  border-radius: 0;
  background-color: #FFF;
  transform: translateY(-100%);
  transition-duration: 0.25s;
  transition-property: transform;
}
.ctt-filter__close {
  position: absolute;
  top: 20px;
  right: 15px;
  width: 22px;
  height: 22px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13.828' height='13.828' viewBox='0 0 13.828 13.828'%3E%3Cg id='Group_345' data-name='Group 345' transform='translate(-708.086 -328.086)'%3E%3Cline id='Line_12' data-name='Line 12' x2='11' y2='11' transform='translate(709.5 329.5)' fill='none' stroke='%23575757' stroke-linecap='round' stroke-width='2'/%3E%3Cline id='Line_13' data-name='Line 13' y1='11' x2='11' transform='translate(709.5 329.5)' fill='none' stroke='%23575757' stroke-linecap='round' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
}
.ctt-filter__label {
  margin-bottom: 10px;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #37383D;
}
.ctt-filter__label:not(:first-child) {
  margin-top: 18px;
}


/**/
/* ctt deck nav */
/**/
.ctt-deck-nav {
  display: flex;
  align-items: center;
}
.ctt-deck-nav__button {
  color: #1097E2;
}
.ctt-deck-nav__button svg {
  display: block;
}
.ctt-deck-nav__progress {
  flex-grow: 1;
  margin: 0 15px;
  border-radius: 2px;
  background: rgba(160, 177, 189, 0.3);
}
.ctt-deck-nav__progress-handle {
  position: relative;
  width: 10%;
  height: 4px;
  border-radius: 2px;
  background-color: #1097E2;
}


/**/
/* ctt mobile nav */
/**/
.ctt-mobile-nav {
  position: fixed;
  z-index: 10000;
  top: 0;
  right: 0;
  bottom: 0;
  width: 300px;
  overflow: auto;
  padding: 15px 20px;
  background-color: #FFF;
  box-shadow: 0px 18px 40px 0 rgba(0, 0, 0, 0.12), -300px 0 0 0 rgba(55, 71, 79, 0.4), -600px 0 0 0 rgba(55, 71, 79, 0.4), -900px 0 0 0 rgba(55, 71, 79, 0.4);
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transform: translateX(100%);
  transition-duration: 0.25s;
  transition-property: opacity, transform;
}
.ctt-mobile-nav.active {
  pointer-events: auto;
  opacity: 1;
  visibility: visible;
  transform: none;
}
.ctt-mobile-nav__hr {
  margin: 20px 0;
  border-top: 1px solid #E5ECF0;
}
.ctt-mobile-nav__close {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 28px;
  height: 28px;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 22 22" fill="none" stroke="%2362727B" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M17.1875 4.8125L4.8125 17.1875"/><path d="M17.1875 17.1875L4.8125 4.8125"/></svg>');
  background-repeat: no-repeat;
}
.ctt-mobile-nav__back {
  display: inline-block;
  vertical-align: top;
  margin-bottom: 20px;
  padding: 0 8px;
  border-radius: 4px;
  background-color: #F6F8FA;
  font-size: 15px;
  line-height: 28px;
  white-space: nowrap;
  color: #23202E;
}
.ctt-mobile-nav__back svg {
  display: inline-block;
  vertical-align: top;
  height: 28px;
  margin-right: 8px;
}
.ctt-mobile-nav__link {
  display: block;
  margin-top: 20px;
  font-size: 16px;
  line-height: 20px;
  font-weight: 500;
}
.ctt-mobile-nav__link svg {
  display: inline-block;
  vertical-align: top;
  margin-right: 10px;
}
.ctt-mobile-nav__label {
  margin-bottom: -5px;
  font-size: 15px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #B2B2B2;
}
.ctt-mobile-nav__foot {
  position: absolute;
  right: 20px;
  bottom: 20px;
  left: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 20px;
  border-top: 1px solid #E5ECF0;
}
.ctt-mobile-nav__logout {
  font-size: 15px;
  font-weight: 500;
  color: #23202E;
}