html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, main,
menu, nav, output, ruby, section, summary,
time, mark, audio {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/**
 * HTML5 display-role reset for older browsers
 */
article, aside, details, figcaption, figure,
footer, header, menu, nav, section,
main, summary {
  display: block; }

input {
  border: none; }

body {
  line-height: 1; }

blockquote, q {
  quotes: none; }

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

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

a {
  color: inherit;
  text-decoration: none; }

body, html {
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

video {
  box-sizing: content-box !important; }

*, *:before, *:after {
  box-sizing: inherit;
  outline: none !important; }

@font-face {
  font-family: "AvenirNext";
  src: url(../fonts/../fonts/AvenirNext-Regular.woff2) format("woff2"), url(../fonts/../fonts/AvenirNext-Regular.woff) format("woff");
  font-weight: 400; }

@font-face {
  font-family: "AvenirNext";
  src: url(../fonts/../fonts/AvenirNext-Italic.woff2) format("woff2"), url(../fonts/../fonts/AvenirNext-Italic.woff) format("woff");
  font-weight: 400;
  font-style: italic; }

@font-face {
  font-family: "AvenirNext";
  src: url(../fonts/../fonts/AvenirNext-MediumItalic.woff2) format("woff2"), url(../fonts/../fonts/AvenirNext-MediumItalic.woff) format("woff");
  font-weight: 500;
  font-style: italic; }

@font-face {
  font-family: "AvenirNext";
  src: url(../fonts/../fonts/AvenirNext-DemiBoldItalic.woff2) format("woff2"), url(../fonts/../fonts/AvenirNext-DemiBoldItalic.woff) format("woff");
  font-weight: 600;
  font-style: italic; }

@font-face {
  font-family: "AvenirNext";
  src: url(../fonts/../fonts/AvenirNext-Medium.woff2) format("woff2"), url(../fonts/../fonts/AvenirNext-Medium.woff) format("woff");
  font-weight: 500; }

@font-face {
  font-family: "AvenirNext";
  src: url(../fonts/../fonts/AvenirNext-DemiBold.woff2) format("woff2"), url(../fonts/../fonts/AvenirNext-DemiBold.woff) format("woff");
  font-weight: 600; }

@font-face {
  font-family: "AvenirNext";
  src: url(../fonts/../fonts/AvenirNext-Bold.woff2) format("woff2"), url(../fonts/../fonts/AvenirNext-Bold.woff) format("woff");
  font-weight: 700; }

@font-face {
  font-family: "AvenirNext";
  src: url(../fonts/../fonts/AvenirNext-Heavy.woff2) format("woff2"), url(../fonts/../fonts/AvenirNext-Heavy.woff) format("woff");
  font-weight: 800; }

@font-face {
  font-family: "AvenirNext";
  src: url(../fonts/../fonts/AvenirNextLTPro-Regular.woff2) format("woff2"), url(../fonts/../fonts/AvenirNextLTPro-Regular.woff) format("woff");
  font-weight: 400; }

@font-face {
  font-family: "Muggsy";
  src: url(../fonts/../fonts/MuggsyHeavy.woff2) format("woff2"), url(../fonts/../fonts/MuggsyHeavy.woff) format("woff"); }

@font-face {
  font-family: "ToJapan";
  src: url(../fonts/../fonts/ToJapan-Italic.woff2) format("woff2"), url(../fonts/../fonts/ToJapan-Italic.woff) format("woff"); }

html, body {
  font-family: "AvenirNext";
  font-size: 10px;
  font-weight: 400;
  color: #030212;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility !important;
  -moz-osx-font-smoothing: grayscale !important; }

a {
  display: inline;
  clear: none; }

.slack {
  max-width: 60rem;
  display: flex;
  margin: 0 auto;
  padding: 2rem 2rem 2rem 2rem;
  flex-direction: column;
  justify-content: center; }

.slacka {
  color: #4742DE; }

* {
  -webkit-overflow-scrolling: touch; }

.noScroll {
  height: 100%;
  overflow: hidden; }

.mailNoScroll {
  overflow: hidden;
  position: fixed;
  height: 100%;
  width: 100%; }

.postNoScroll {
  position: fixed;
  height: 100%; }

input, div, p {
  font-family: "AvenirNext"; }

h1 {
  font-size: 2.6rem;
  font-weight: 600; }
  @media (max-width: 1180px) {
    h1 {
      font-size: 2.6rem; } }

p {
  font-size: 1.9rem;
  line-height: 1.8; }
  @media (max-width: 1180px) {
    p {
      font-size: 1.7rem; } }

.randomSVG {
  position: relative;
  top: 5px;
  left: 5px;
  display: inline; }
  @media (max-width: 1180px) {
    .randomSVG {
      display: none; } }

.popupLoader {
  position: absolute;
  background-color: white;
  z-index: 5;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  display: none; }

.outerLoader {
  height: 8rem;
  width: 100%;
  margin-top: 4rem;
  display: none; }

.loader {
  display: block;
  margin: 0 auto;
  width: 6rem;
  height: 6rem;
  border-radius: 50%;
  background: #4742de;
  background: linear-gradient(to right, #4742de 10%, rgba(71, 66, 222, 0) 42%);
  position: relative;
  animation: load3 1s infinite linear;
  transform: translateZ(0); }

.loader:before {
  width: 50%;
  height: 50%;
  background: #4742de;
  border-radius: 100% 0 0 0;
  position: absolute;
  top: 0;
  left: 0;
  content: ''; }

.loader:after {
  background: #ffffff;
  width: 75%;
  height: 75%;
  border-radius: 50%;
  content: '';
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0; }

@keyframes load3 {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }

.filterH1 {
  padding: 3rem 0rem 0.8rem 3rem; }

.harry {
  position: fixed;
  background: #fff;
  z-index: 3;
  right: 0;
  bottom: 0;
  border-top-left-radius: 3px;
  padding: 0.8rem;
  border-top: 1px solid #e6e6e6;
  border-left: 1px solid #e6e6e6;
  display: flex;
  align-items: center; }
  @media screen and (max-width: 940px) {
    .harry {
      display: none; } }
  .harry__img {
    border-radius: 100px;
    width: 2.4rem;
    height: 2.4rem;
    margin-right: 0.8rem; }
  .harry__text {
    font-size: 1.5rem;
    color: #030212;
    opacity: 0.9; }

.fillSVG > * {
  fill: #030212; }

.strokeSVG > * {
  stroke: #030212; }

.gmLogoSmallSVG {
  width: 4.4rem; }
  @media screen and (max-width: 768px) {
    .gmLogoSmallSVG {
      width: 4.4rem; } }

.gmLogoSmallSVGCEG {
  width: 4rem; }
  @media screen and (max-width: 768px) {
    .gmLogoSmallSVGCEG {
      width: 4rem; } }

.linkedinSVGCEG {
  height: 2.8rem; }
  @media screen and (max-width: 768px) {
    .linkedinSVGCEG {
      height: 2.4rem; } }
  .linkedinSVGCEG > * {
    fill: #212121; }

.ytSVGCEG {
  height: 2.6rem; }
  @media screen and (max-width: 768px) {
    .ytSVGCEG {
      height: 2.6rem; } }
  .ytSVGCEG > * {
    fill: #212121; }

.twitterSVGCEG {
  height: 2.3rem; }
  @media screen and (max-width: 768px) {
    .twitterSVGCEG {
      height: 2.3rem; } }
  .twitterSVGCEG > * {
    fill: #212121; }

.twitterSVG {
  height: 2.1rem; }
  @media screen and (max-width: 768px) {
    .twitterSVG {
      height: 2.1rem; } }
  .twitterSVG > * {
    fill: #4742DE; }

.facebookSVG {
  height: 2.2rem; }
  @media screen and (max-width: 768px) {
    .facebookSVG {
      height: 2.2rem; } }
  .facebookSVG > * {
    fill: #4742DE; }

.linkedinSVG {
  height: 2.4rem; }
  @media screen and (max-width: 768px) {
    .linkedinSVG {
      height: 2.4rem; } }
  .linkedinSVG > * {
    fill: #4742DE; }

.gif__inner-header-tweet .twitterSVG {
  height: 2.1rem; }
  @media screen and (max-width: 768px) {
    .gif__inner-header-tweet .twitterSVG {
      height: 2.1rem; } }
  .gif__inner-header-tweet .twitterSVG > * {
    fill: #fff; }

.slackSVG {
  height: 2.5rem; }
  @media screen and (max-width: 768px) {
    .slackSVG {
      height: 2.3rem; } }
  .slackSVG > * {
    fill: #333; }

.newmail__icon .crossSVG {
  width: 1.7rem; }
  .newmail__icon .crossSVG > * {
    fill: #030212; }

.cegm__bottom-cross {
  position: absolute;
  top: 0;
  right: 0;
  padding: 1.2rem;
  z-index: 1; }
  .cegm__bottom-cross .crossSVG {
    width: 1.7rem; }
    .cegm__bottom-cross .crossSVG > * {
      fill: #090A0F; }

.outerPost__close .crossSVG {
  width: 2.2rem; }
  .outerPost__close .crossSVG > * {
    fill: #030212; }

@media screen and (max-width: 768px) {
  .outerPost__close .crossSVG {
    width: 1.7rem; }
    .outerPost__close .crossSVG > * {
      fill: #fff; } }

.harryGIF__inner-logo-down > * {
  width: 4.4rem; }

.gif__inner-header-logo-me > * {
  width: 4rem; }

@media screen and (max-width: 768px) {
  .gif__inner-header-logo-me > * {
    width: 3.7rem; } }

.home {
  display: flex; }
  .home__left {
    border-right: 1px solid #e1e1e1;
    height: 100%;
    position: fixed; }
    @media screen and (max-width: 940px) {
      .home__left {
        display: none; } }
    .home__left-logo {
      padding: 1.5rem 1.6rem;
      display: block; }
  .home__right {
    display: flex;
    flex-direction: column;
    flex: 1;
    margin-left: 25rem; }
    @media screen and (max-width: 940px) {
      .home__right {
        margin: 0; } }
    .home__right-header {
      border-bottom: 1px solid #e1e1e1;
      position: fixed;
      border-left: 1px solid #e1e1e1;
      z-index: 3;
      background-color: white;
      position: sticky;
      top: 0; }
      @media screen and (max-width: 940px) {
        .home__right-header {
          width: calc(100%); } }
      @media screen and (max-width: 768px) {
        .home__right-header {
          border-left: none; } }
      .home__right-header-icons {
        display: flex;
        align-items: center;
        height: 5rem; }
        .home__right-header-icons-gnt {
          display: none; }
          @media screen and (max-width: 940px) {
            .home__right-header-icons-gnt {
              display: block; } }
        @media screen and (max-width: 768px) {
          .home__right-header-icons {
            height: 4.6rem; } }
        .home__right-header-icons a {
          margin-left: 1.6rem;
          font-size: 1.5rem;
          text-transform: uppercase;
          font-weight: 600;
          color: #4742DE; }
          @media screen and (max-width: 768px) {
            .home__right-header-icons a {
              margin-left: 1rem;
              font-size: 1.4rem; } }
      .home__right-header-wrap {
        padding: 1rem 2.6rem 1rem 2.2rem;
        display: flex;
        align-items: center;
        justify-content: space-between; }
        @media screen and (max-width: 768px) {
          .home__right-header-wrap {
            padding: 1rem 2rem 1rem 2rem; } }
        @media screen and (max-width: 360px) {
          .home__right-header-wrap {
            padding: 1rem 1.8rem 1rem 1.8rem; } }
        .home__right-header-wrap-logoSmall {
          display: none; }
          @media screen and (max-width: 940px) {
            .home__right-header-wrap-logoSmall {
              display: block;
              margin-right: 1.8rem; } }

.filters {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-auto-rows: 10.9rem;
  width: 25rem;
  background: #fff; }
  @media screen and (max-width: 768px) {
    .filters {
      grid-template-columns: 1fr 1fr 1fr;
      width: 100%;
      height: 100%; } }
  .filters__spec {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    transition: all 0.2s; }
    .filters__spec:hover {
      transition: all 0.2s;
      background: #F0F7FB; }
    .filters__spec-inner {
      height: 4.3rem;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      width: 100%; }
      .filters__spec-inner-icon {
        text-align: center; }
      .filters__spec-inner-text {
        font-size: 1.3rem;
        margin-top: 0.9rem;
        text-align: center;
        font-weight: 500; }

.filters__active {
  transition: all 0.2s;
  background: #F0F7FB; }
  .filters__active .filters__spec-inner-text {
    font-weight: 600;
    color: #4742DE; }
  .filters__active .fillSVG > * {
    fill: #4742DE; }
  .filters__active .strokeSVG > * {
    stroke: #4742DE; }

.search {
  display: flex;
  align-items: center; }
  @media screen and (max-width: 940px) {
    .search {
      margin-right: 0rem;
      max-width: none;
      display: none; } }
  @media screen and (max-width: 768px) {
    .search {
      height: 4.6rem; } }
  .search__text {
    font-size: 1.3rem;
    display: inline-flex;
    background-color: #4742DE;
    padding: 0rem 1.5rem;
    height: 5rem;
    font-size: 1.3rem;
    color: white;
    align-items: center;
    font-weight: 600;
    border-radius: 5px;
    cursor: pointer; }
    .search__text:hover {
      opacity: 0.8;
      transition: all 0.2s; }
    .search__text-info {
      font-size: 1.3rem;
      margin-left: 2rem; }
  .search__left {
    background: #F1F5F8;
    max-width: none;
    margin-right: 2.2rem;
    border-radius: 5px;
    height: 5rem;
    width: 43rem;
    display: flex;
    align-items: center;
    position: relative;
    flex: 1; }
  .search__icon {
    position: absolute;
    left: 2rem;
    transform: translateY(1px); }
    @media screen and (max-width: 768px) {
      .search__icon {
        left: 1.6rem; } }
  .search input {
    background: #F1F5F8;
    padding-left: 5rem;
    padding-right: 2.2rem;
    width: 100%;
    font-weight: 500;
    font-size: 1.5rem; }
    @media screen and (max-width: 768px) {
      .search input {
        font-size: 1.4rem;
        padding-left: 4.2rem;
        padding-right: 2rem; } }
    .search input::placeholder {
      color: #8795A1; }

.hm__button {
  display: none;
  bottom: 0;
  height: 6rem;
  position: fixed;
  z-index: 2;
  background: #4742DE;
  width: 100%;
  font-size: 1.8rem;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-weight: 600; }
  @media screen and (max-width: 940px) {
    .hm__button {
      display: flex; } }
  @media screen and (max-width: 768px) {
    .hm__button {
      font-size: 1.6rem;
      height: 5.6rem; } }

.hm__filters {
  display: none;
  width: 100%;
  position: fixed;
  overflow-y: scroll;
  top: 0;
  bottom: 0;
  margin-bottom: 5.6rem;
  left: 0;
  z-index: 4; }
  .hm__filters-active {
    display: block; }

.outerCard {
  padding: 2.2rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 2.2rem; }
  @media screen and (max-width: 1240px) {
    .outerCard {
      grid-template-columns: repeat(2, 1fr); } }
  @media screen and (max-width: 940px) {
    .outerCard {
      margin-bottom: 6rem; } }
  @media screen and (max-width: 768px) {
    .outerCard {
      grid-gap: 2rem;
      padding: 2rem; } }
  @media screen and (max-width: 360px) {
    .outerCard {
      grid-gap: 1.8rem;
      padding: 1.8rem; } }
  @media screen and (max-width: 660px) {
    .outerCard {
      grid-template-columns: 1fr; } }

.sponsor1 {
  grid-row-start: 1;
  grid-column-start: 3; }
  @media screen and (max-width: 1240px) {
    .sponsor1 {
      grid-column-start: 2; } }
  @media screen and (max-width: 768px) {
    .sponsor1 {
      height: 22rem;
      grid-row-start: 3;
      grid-column-start: auto; } }

.sponsor2 {
  grid-row-start: 3;
  grid-column-start: 3; }
  @media screen and (max-width: 1240px) {
    .sponsor2 {
      grid-column-start: 2; } }
  @media screen and (max-width: 768px) {
    .sponsor2 {
      height: 22rem;
      grid-row-start: 6;
      grid-column-start: auto; } }

.sponsor3 {
  grid-row-start: 5;
  grid-column-start: 3; }
  @media screen and (max-width: 1240px) {
    .sponsor3 {
      grid-column-start: 2; } }
  @media screen and (max-width: 768px) {
    .sponsor3 {
      height: 22rem;
      grid-row-start: 9;
      grid-column-start: auto; } }

.sponsor4 {
  grid-row-start: 7;
  grid-column-start: 3; }
  @media screen and (max-width: 1240px) {
    .sponsor4 {
      grid-column-start: 2; } }
  @media screen and (max-width: 768px) {
    .sponsor4 {
      height: 22rem;
      grid-row-start: 12;
      grid-column-start: auto; } }

.sponsor {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  text-align: center;
  width: 100%; }
  .sponsor__inner-center {
    border-radius: 40px; }
  .sponsor__inner {
    max-width: 30rem; }
    .sponsor__inner-p {
      font-size: 1.5rem;
      line-height: 1.3;
      font-weight: 600;
      margin-top: 1rem;
      margin-bottom: 1.6rem; }
    .sponsor__inner-button {
      display: inline-flex;
      background-color: #054ada;
      padding: 1rem;
      font-size: 1.2rem;
      color: white;
      font-weight: 700;
      border-radius: 5px; }
  .sponsor img, .sponsor picture {
    width: 6rem;
    border-radius: 100%; }

.card {
  padding: 0.9rem;
  height: 23.9rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-radius: 8px;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  z-index: 2; }
  @media screen and (max-width: 768px) {
    .card {
      height: 22rem; } }
  .card img, .card picture {
    position: absolute;
    object-fit: cover;
    width: 100%;
    height: 100%;
    top: 0%;
    left: 0%;
    z-index: 0; }
  .card h4 {
    font-size: 2.1rem;
    padding: 1.2rem;
    color: #fff;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
    line-height: 1.3;
    font-weight: 700;
    position: relative;
    z-index: 1; }
    @media screen and (max-width: 768px) {
      .card h4 {
        font-size: 2rem;
        padding: 1rem; } }
  .card__bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 1;
    position: relative; }
    .card__bottom-link {
      display: flex;
      align-items: center;
      margin-left: 0.4rem; }
      .card__bottom-link-text {
        font-size: 1.4rem;
        text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
        color: #fff;
        margin-left: 0.7rem;
        font-weight: 500; }
    .card__bottom-tag {
      width: 10.1rem;
      padding: 0.8rem 0;
      display: flex;
      justify-content: center;
      font-size: 1.2rem;
      font-weight: 500;
      border-radius: 100px; }

.ct__referral {
  background: #C7E9BA; }

.ct__pricing {
  background: #DCDBF4; }

.ct__giveaway {
  background: #FDAFC4; }

.ct__coldemail {
  background: #e3b9e9; }

.ct__viral {
  background: #b0d9f2; }

.ct__content {
  background: #f4f7b6; }

.ct__seo {
  background: #bff8ef; }

.ct__conversion {
  background: #eacdcd; }

.ct__sales {
  background: #ffd6f1; }

.ct__brand {
  background: #f3e2f3; }

.ct__sideproject {
  background: #38f0c5; }

.ct__email {
  background: #f3e2f3; }

.ct__copywriting {
  background: #38f0c5; }

.ct__socialmedia {
  background: #ffd6f1; }

.ct__ppc {
  background: #ffd6f1; }

.ct__customers {
  background: #c6ece7; }

.ct__ads {
  background: #edfcb6; }

.ct__misc {
  background: #edfcb6; }

.ph {
  background: #4742DE;
  display: flex;
  align-items: center;
  height: 5.2rem;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s; }
  .ph:hover {
    opacity: 0.94;
    transition: all 0.2s; }
  .ph__sticker {
    font-size: 2.6rem; }
    .ph__sticker__right {
      margin-left: 2rem; }
      @media screen and (max-width: 768px) {
        .ph__sticker__right {
          margin-left: 1.4rem; } }
    .ph__sticker__left {
      margin-right: 2rem; }
      @media screen and (max-width: 768px) {
        .ph__sticker__left {
          display: none; } }
  .ph__text {
    color: #fff;
    font-weight: 600;
    font-size: 1.4rem; }
    .ph__text span {
      border-bottom: 2px solid white; }
  .ph__text-mobile {
    display: none; }
    @media screen and (max-width: 768px) {
      .ph__text-mobile {
        color: #fff;
        font-weight: 600;
        font-size: 1.4rem; } }

.gif {
  background-color: #0e2439;
  width: 100%; }
  .gif__video {
    width: 100%;
    height: 100%;
    object-fit: fill; }
  .gif__inner {
    max-width: 109.2rem;
    padding: 0 2.2rem;
    margin: 0 auto; }
    .gif__inner-mobile {
      font-size: 1.5rem;
      color: white;
      font-weight: 500;
      text-align: center;
      margin-top: 2.2rem;
      display: none; }
      @media screen and (max-width: 768px) {
        .gif__inner-mobile {
          display: block; } }
    .gif__inner-header {
      border-bottom: 1px solid #1f364d;
      display: flex;
      align-items: center;
      justify-content: space-between; }
      .gif__inner-header-logo {
        display: flex;
        align-items: center;
        padding: 2rem 0;
        color: white; }
        @media screen and (max-width: 768px) {
          .gif__inner-header-logo {
            padding: 1.6rem 0; } }
        .gif__inner-header-logo-logo {
          font-size: 2.6rem; }
          @media screen and (max-width: 768px) {
            .gif__inner-header-logo-logo {
              font-size: 2.2rem; } }
        .gif__inner-header-logo-by {
          font-size: 1.2rem;
          font-weight: 600;
          margin: 0 1rem;
          color: white; }
    .gif__inner-gif {
      padding: 2.2rem 0;
      display: grid;
      grid-gap: 2rem;
      grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
      grid-auto-rows: 1rem;
      grid-auto-flow: row; }
  .gif__footer {
    height: 30rem;
    background: white;
    width: 100%; }

.gif__item {
  position: relative;
  cursor: pointer;
  border: 5px solid #1f364d; }
  .gif__item-special {
    border: 5px solid #4742DE; }
    .gif__item-special:hover {
      border: 5px solid #ffffff;
      transition: all 0.2s; }
  .gif__item-overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    opacity: 0;
    transition: all 0.2s;
    display: flex;
    justify-content: center;
    align-items: center; }
    .gif__item-overlay-text {
      color: #fff;
      font-size: 1.6rem;
      font-weight: 600; }
  .gif__item-special-overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    opacity: 0;
    transition: all 0.2s;
    display: flex;
    justify-content: center;
    align-items: center; }
    .gif__item-special-overlay-text {
      color: #fff;
      font-size: 1.6rem;
      font-weight: 600; }
  .gif__item:hover .gif__item-overlay {
    background-color: rgba(0, 0, 0, 0.7);
    opacity: 1;
    transition: all 0.2s; }
  .gif__item:hover .gif__item-special-overlay {
    background-color: #4742DE;
    opacity: 1;
    transition: all 0.2s; }

.harryGIF {
  grid-column: span 1;
  grid-row: span 10;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  text-align: center;
  width: 100%; }
  .harryGIF__video {
    height: 100%;
    width: 100%;
    object-fit: fill; }
  .harryGIF__inner {
    max-width: 32rem; }
    .harryGIF__inner-img {
      background-image: url("https://harrydry.s3.amazonaws.com/gdmarketing/harry.jpg");
      margin: 0 auto;
      width: 4.2rem;
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      height: 4.4rem;
      border-radius: 100%; }
    .harryGIF__inner-p {
      color: white;
      text-align: center;
      font-size: 1.5rem;
      line-height: 1.3;
      font-weight: 600;
      margin-top: 1.2rem;
      margin-bottom: 2rem; }
    .harryGIF__inner-button {
      display: inline-flex;
      background-color: #4742DE;
      padding: 1rem;
      font-size: 1.2rem;
      color: white;
      font-weight: 600;
      border-radius: 5px; }

.outerMail {
  justify-content: center;
  align-items: center;
  position: fixed;
  display: none;
  z-index: 5;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.5); }

.newmail {
  box-shadow: 0 15px 35px 0 rgba(50, 50, 93, 0.1), 0 5px 15px 0 rgba(0, 0, 0, 0.07);
  background: #fff;
  width: 42.4rem;
  padding: 0rem;
  display: flex;
  position: relative;
  flex-direction: column;
  border-radius: 2px;
  height: 80%;
  overflow-y: scroll; }
  @media screen and (max-width: 450px) {
    .newmail {
      width: 100%;
      height: 100%; } }
  .newmail__icon {
    position: absolute;
    top: 0px;
    right: 0px;
    padding: 2rem;
    cursor: pointer; }
    @media screen and (max-width: 700px) {
      .newmail__icon {
        padding: 1.4rem; } }
  .newmail__text {
    padding: 2rem 2rem 0rem 2rem; }
    @media screen and (max-width: 376px) {
      .newmail__text {
        padding: 2rem 1.8rem 0rem 1.8rem; } }
    .newmail__text-p {
      font-size: 1.7rem;
      line-height: 2.4rem;
      margin-top: 1.4rem;
      font-weight: 400; }
      .newmail__text-p span {
        font-weight: 600; }
  .newmail__harry {
    display: flex;
    align-items: center; }
    .newmail__harry-p {
      font-size: 1.6rem;
      background-color: #4742DE;
      padding: 1rem;
      display: inline-flex;
      transform: rotate(-1deg);
      color: white;
      font-weight: 500; }
    .newmail__harry img {
      margin-left: 12px;
      width: 59px;
      height: 59px;
      border-radius: 100px;
      padding: 5px;
      border: 2px solid rgba(69, 64, 221, 0.4); }
  .newmail__test {
    overflow-y: scroll; }
  .newmail__input {
    background-color: white;
    z-index: 4;
    width: calc(100%);
    padding: 1rem 2rem 1rem 2rem;
    margin: .9rem 0 1.3rem 0; }
    @media screen and (max-width: 376px) {
      .newmail__input {
        padding: 1rem 1.8rem 1rem 1.8rem; } }
    .newmail__input-red {
      display: none;
      font-size: 1.5rem;
      text-align: center;
      margin-top: 2.2rem; }
    .newmail__input-input {
      height: 5.5rem;
      display: flex;
      justify-content: space-between;
      padding: 0.6rem;
      background-color: #F1F5F8; }
      .newmail__input-input input {
        width: 82%;
        background-color: #F1F5F8;
        font-size: 1.6rem;
        font-weight: 600;
        color: #030212; }
        .newmail__input-input input::placeholder {
          color: #8795A1; }
      .newmail__input-input-button {
        background-color: #4742DE;
        color: #fff;
        font-size: 1.4rem;
        font-weight: 600;
        border: none;
        display: flex;
        align-items: center;
        border-radius: 4px;
        justify-content: center;
        width: 6.9rem;
        cursor: pointer; }
  .newmail__bc-red {
    display: none;
    font-size: 1.5rem;
    text-align: center;
    margin-top: 2.2rem; }

.testy {
  height: 7.1rem;
  display: flex;
  align-items: center;
  position: relative; }
  .testy__img {
    border-radius: 100px;
    margin-left: 1.6rem;
    width: 5.5rem;
    height: 5.5rem;
    display: flex;
    justify-content: center;
    align-items: center; }
    @media screen and (max-width: 376px) {
      .testy__img {
        margin-left: 1rem; } }
    .testy__img img {
      width: 4.5rem;
      height: 4.5rem;
      border-radius: 100px; }
  .testy__text {
    font-size: 1.6rem;
    margin-left: 1.1rem;
    width: 32rem;
    font-style: italic;
    line-height: 2rem;
    font-weight: 400;
    z-index: 2; }
    @media screen and (max-width: 376px) {
      .testy__text {
        margin-left: 1rem;
        width: 27.8rem; } }
    @media screen and (max-width: 350px) {
      .testy__text {
        margin-left: 1rem;
        width: 22rem; } }
    .testy__text .bold {
      font-weight: 600; }
  .testy__num {
    font-size: 4.8rem;
    line-height: 1.4;
    position: absolute;
    letter-spacing: -5px;
    right: 2rem;
    font-family: "ToJapan";
    transform: translateY(-3px); }
    @media screen and (max-width: 376px) {
      .testy__num {
        right: 1.7rem; } }

.testy1 {
  background-color: #F2F2FD; }
  .testy1 img {
    border: 2px solid rgba(69, 64, 221, 0.1); }
  .testy1 .testy__img {
    border: 2px solid rgba(69, 64, 221, 0.1); }
  .testy1 .testy__num {
    color: rgba(69, 64, 221, 0.05); }

.testy2 {
  background-color: rgba(19, 216, 196, 0.12); }
  .testy2 img {
    border: 2px solid rgba(19, 216, 196, 0.12); }
  .testy2 .testy__img {
    border: 2px solid rgba(19, 216, 196, 0.12); }
  .testy2 .testy__num {
    color: rgba(19, 216, 196, 0.1); }

.testy3 {
  background-color: rgba(255, 56, 56, 0.09); }
  .testy3 img {
    border: 2px solid rgba(255, 56, 56, 0.1); }
  .testy3 .testy__img {
    border: 2px solid rgba(255, 56, 56, 0.1); }
  .testy3 .testy__num {
    color: rgba(255, 56, 56, 0.05); }

.testy4 {
  background-color: rgba(98, 203, 161, 0.18); }
  .testy4 img {
    border: 2px solid rgba(98, 203, 161, 0.17); }
  .testy4 .testy__img {
    border: 2px solid rgba(98, 203, 161, 0.17); }
  .testy4 .testy__num {
    color: rgba(98, 203, 161, 0.12); }

.testy5 {
  background-color: rgba(255, 241, 138, 0.21); }
  .testy5 img {
    border: 2px solid rgba(255, 241, 138, 0.5); }
  .testy5 .testy__img {
    border: 2px solid rgba(255, 241, 138, 0.5); }
  .testy5 .testy__num {
    color: rgba(255, 241, 138, 0.34); }

.mail__bc-red {
  display: none;
  font-size: 1.4rem;
  text-align: center;
  margin-top: 2rem; }

.mail__input {
  background: #F1F5F8;
  margin-right: 6rem;
  border-radius: 4px;
  display: flex;
  align-items: center;
  position: relative;
  width: 100%;
  flex: 1; }
  .mail__input-icon {
    position: absolute;
    left: 1.8rem;
    transform: translateY(1px); }
  .mail__input input {
    background: #F1F5F8;
    padding: 1.8rem 2rem 1.8rem 5.4rem;
    width: 100%;
    font-weight: 500;
    font-size: 1.6rem;
    color: #030212; }
    .mail__input input::placeholder {
      color: #8795A1; }

.mail__button {
  height: 5.6rem;
  background: #4742DE;
  width: 100%;
  font-size: 1.6rem;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-weight: 600;
  margin-top: 2rem;
  cursor: pointer;
  transition: all 0.3s; }
  .mail__button:hover {
    opacity: 0.9;
    transition: all 0.3s; }

.addOnEmail, .postEmail {
  width: 32.8rem;
  margin: 5rem auto 6.4rem auto; }
  .addOnEmail__header .bold, .postEmail__header .bold {
    font-weight: 600; }
  @media screen and (max-width: 424px) {
    .addOnEmail, .postEmail {
      width: 100%;
      padding: 0 2rem; } }

.postEmail__header {
  font-size: 1.5rem;
  margin-bottom: 3rem;
  text-align: center;
  line-height: 1.4; }

.outerPost {
  justify-content: center;
  align-items: center;
  position: fixed;
  display: flex;
  z-index: 4;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(255, 255, 255, 0.8); }
  .outerPost__fh {
    display: none; }
  .outerPost__close {
    position: absolute;
    top: 1.6rem;
    right: 1.6rem;
    cursor: pointer;
    z-index: 10;
    padding: 1rem; }
    @media screen and (max-width: 768px) {
      .outerPost__close {
        top: .7rem;
        right: .7rem; } }

.post {
  box-shadow: 0 15px 35px 0 rgba(50, 50, 93, 0.1), 0 5px 15px 0 rgba(0, 0, 0, 0.07);
  background: #fff;
  width: 80rem;
  height: 90%;
  display: block;
  position: relative;
  border-radius: 6px;
  overflow-y: scroll; }
  @media (max-width: 768px) {
    .post {
      width: 100%;
      height: 100%;
      border-radius: 0px; } }
  .post__top {
    height: 24rem;
    width: 100%;
    overflow: hidden;
    position: relative;
    display: flex;
    justify-content: center; }
    @media screen and (max-width: 375px) {
      .post__top {
        height: 22.4rem; } }
    .post__top-img {
      filter: blur(10px);
      width: 100%;
      height: 100%;
      object-fit: cover;
      position: absolute;
      transform: scale(1.1); }

.monial {
  display: flex;
  margin-bottom: 3.5rem;
  width: 100%;
  justify-content: space-between; }
  @media (max-width: 768px) {
    .monial {
      flex-direction: column;
      align-items: center; } }
  .monial__inner {
    position: relative;
    width: 23.8rem; }
    @media (max-width: 768px) {
      .monial__inner:last-child {
        display: none; } }
    .monial__inner-quote {
      font-size: 16rem;
      position: absolute;
      left: -2.6rem;
      top: 0;
      color: #808D9A;
      opacity: 0.08;
      line-height: 0.5;
      z-index: 0; }
    .monial__inner-text {
      font-size: 1.5rem;
      line-height: 1.4;
      position: relative; }
      .monial__inner-text-bold {
        font-weight: 600; }
      @media (max-width: 768px) {
        .monial__inner-text {
          text-align: center; } }
    .monial__inner-bottom {
      margin-top: 1.4rem;
      display: flex; }
      @media (max-width: 768px) {
        .monial__inner-bottom {
          justify-content: center; } }
      .monial__inner-bottom-pic {
        width: 3.8rem !important;
        height: 3.8rem !important;
        border-radius: 100px !important;
        margin: 0 !important;
        border: none !important; }
      .monial__inner-bottom-text {
        margin-left: 1.4rem;
        display: flex;
        flex-direction: column;
        justify-content: space-around; }
        .monial__inner-bottom-text-top {
          font-size: 1.5rem;
          font-weight: 600; }
        .monial__inner-bottom-text-bottom {
          font-size: 1.4rem; }
  .monial a {
    padding-bottom: 0rem !important;
    border: none !important;
    z-index: 2; }

.pCard {
  padding: 0.9rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  overflow: hidden;
  z-index: 2;
  height: 100%;
  width: 44rem;
  border-radius: 0px;
  justify-content: center;
  align-items: center; }
  @media screen and (max-width: 550px) {
    .pCard {
      width: 100%; } }
  .pCard img, .pCard picture, .pCard source {
    position: absolute;
    object-fit: cover;
    width: 100%;
    height: 100%;
    top: 0%;
    left: 0%;
    z-index: 0; }
  .pCard h1, .pCard h2 {
    font-size: 2.3rem;
    color: #fff;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
    line-height: 1.3;
    font-weight: 700;
    position: relative;
    z-index: 1;
    width: 33.9rem;
    text-align: center; }
    @media screen and (max-width: 768px) {
      .pCard h1, .pCard h2 {
        font-size: 2.2rem;
        padding: 1rem; } }
    @media screen and (max-width: 357px) {
      .pCard h1, .pCard h2 {
        width: 30.4rem; } }
  .pCard__bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 1;
    position: absolute;
    bottom: 0.9rem;
    left: 0.9rem;
    right: 0.9rem; }
    .pCard__bottom-link {
      display: flex;
      align-items: center;
      margin-left: 0.4rem; }
      .pCard__bottom-link-text {
        font-size: 1.4rem;
        text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
        color: #fff;
        margin-left: 0.7rem;
        font-weight: 500; }
    .pCard__bottom-tag {
      width: 10.1rem;
      padding: 0.8rem 0;
      display: flex;
      justify-content: center;
      font-size: 1.2rem;
      font-weight: 500;
      border-radius: 100px; }

.content {
  width: 100%;
  background: #fff;
  padding: 4rem 9rem; }
  @media screen and (max-width: 550px) {
    .content {
      padding: 2rem 0rem; } }
  .content h2 {
    font-size: 1.6rem;
    font-weight: 600;
    padding: 2rem 0.76rem;
    text-transform: uppercase;
    line-height: 1.4;
    color: #4742DE; }
    @media screen and (max-width: 550px) {
      .content h2 {
        padding: 1.6rem 2rem; } }
    .content h2 a {
      border-bottom: 1px solid #4742DE; }
  .content h2.under {
    font-size: 1.7rem;
    text-transform: none; }
  .content .h2start {
    padding: 0.76rem 0.76rem 2rem 0.76rem; }
    @media screen and (max-width: 550px) {
      .content .h2start {
        padding: 1.6rem 2rem; } }
  .content h3 {
    font-size: 1.6rem;
    font-weight: 600;
    text-transform: uppercase;
    line-height: 1.4;
    color: #4742DE;
    padding: 1.5rem 0.76rem 1.5rem 2rem; }
  .content p {
    font-size: 1.7rem;
    line-height: 1.8;
    padding: 0.76rem 0.76rem 0.76rem 0.76rem; }
    @media screen and (max-width: 550px) {
      .content p {
        padding: .7rem 2rem; } }
    .content p .bold {
      font-weight: 600; }
    .content p .italic {
      font-style: italic; }
  .content .asterix {
    text-align: center;
    padding: 2rem 0 1rem 0; }
  .content .caption {
    padding: 2rem .76rem 4rem .76rem !important;
    font-style: italic;
    text-align: center; }
    @media screen and (max-width: 550px) {
      .content .caption {
        padding: 2rem 2rem 3rem 2rem !important; } }
  .content .footnote {
    font-size: 1.5rem;
    padding: 0.76rem 0.76rem 0.76rem 0.76rem; }
    @media screen and (max-width: 550px) {
      .content .footnote {
        padding: .7rem 2rem; } }
  .content .point1 {
    padding: 0.76rem 0.76rem 0.76rem 2rem; }
  .content .speech {
    line-height: 1.8;
    padding: 0rem 5rem; }
    @media screen and (max-width: 550px) {
      .content .speech {
        padding: .7rem 2rem; } }
  .content .inwardSpeech {
    font-style: italic;
    padding: 1.2rem 4.5rem; }
    @media screen and (max-width: 550px) {
      .content .inwardSpeech {
        padding: 1rem 3.4rem; } }
  .content .isBreak {
    display: block;
    margin-bottom: -0.9rem; }
    @media screen and (max-width: 550px) {
      .content .isBreak {
        margin-bottom: -0.6rem; } }
  .content .letter {
    padding: 0.76rem 5rem; }
    @media screen and (max-width: 550px) {
      .content .letter {
        padding: .7rem 3.4rem; } }
  .content .list {
    padding: 0.1rem 0.76rem 0.1rem 2rem;
    display: block; }
    @media screen and (max-width: 550px) {
      .content .list {
        padding: 0.1rem 2rem 0.1rem 3.4rem; } }
    .content .list__top {
      padding-top: 0.76rem; }
    .content .list__bottom {
      padding-bottom: 0.76rem; }
  .content a {
    border-bottom: 1px solid #030212; }
  .content img {
    border: none;
    margin: 4rem auto;
    display: block; }
    @media screen and (max-width: 550px) {
      .content img {
        margin: 3rem auto;
        width: 100%; } }
  .content video {
    margin: 4rem auto;
    display: block;
    cursor: pointer; }
    @media screen and (max-width: 550px) {
      .content video {
        margin: 3rem auto;
        width: 100%; } }

.sesquon {
  margin: 3rem auto 4rem auto !important; }
  @media screen and (max-width: 550px) {
    .sesquon {
      margin: 2rem auto 3rem auto !important; } }

.ni {
  font-style: normal !important; }

mark {
  padding: 0rem 0.2rem; }

span {
  line-height: initial; }

h2.slab {
  font-size: 1.7rem;
  text-transform: none;
  margin: 2rem 0.4rem;
  font-weight: 700;
  color: #030212;
  padding: .9rem 1rem .7rem 1rem;
  display: inline-flex;
  justify-content: center;
  transform: rotate(-1deg); }
  @media screen and (max-width: 550px) {
    h2.slab {
      margin: 2rem; } }

.dashed {
  width: 80rem;
  border-top: 4px dashed #030212;
  padding: 4rem 0 2rem 0;
  position: relative;
  left: -9rem; }

.bg1 {
  background-color: #FADCED; }

.bg2 {
  background-color: #CBF6F2; }

.bg3 {
  background-color: #FFD5D5; }

.bg4 {
  background-color: #D9F4E2; }

.bg5 {
  background-color: #E4E2FA; }

.norm {
  font-style: normal; }

.ss1 {
  background-color: rgba(19, 217, 198, 0.25); }

.ss2 {
  background-color: rgba(84, 74, 225, 0.22); }

.ss3 {
  background-color: rgba(251, 77, 123, 0.3); }

.ss4 {
  background-color: rgba(78, 204, 121, 0.3); }

.ss5 {
  background-color: rgba(225, 37, 103, 0.3); }

.yt {
  border: 8px solid #ffdddd;
  margin: 4rem auto;
  width: 100%;
  overflow: hidden;
  position: relative; }
  @media screen and (max-width: 550px) {
    .yt {
      margin: 3rem auto;
      border: none;
      border-top: 5px solid #ffdddd;
      border-bottom: 5px solid #ffdddd; } }
  .yt::after {
    padding-top: 56.25%;
    display: block;
    content: ''; }
  .yt iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }

.img__caption {
  margin: 4rem auto 0 auto !important; }
  @media screen and (max-width: 550px) {
    .img__caption {
      margin: 3rem auto 0 auto !important; } }

.img__70 {
  width: 70%; }

.img__100 {
  width: 100%; }

.img__95 {
  width: 95%; }

.img__90 {
  width: 90%; }

.img__85 {
  width: 85%; }

.img__80 {
  width: 80%; }

.img__75 {
  width: 75%; }

.img__70 {
  width: 70%; }

.img__65 {
  width: 65%; }

.img__60 {
  width: 60%; }

.img__55 {
  width: 55%; }

.img__50 {
  width: 50%; }
  @media screen and (max-width: 550px) {
    .img__50 {
      margin: 3rem auto !important;
      width: 60% !important;
      border: 5px solid #ffdddd !important; } }

.img__45 {
  width: 45%; }

.img__40 {
  width: 40%; }

.img__35 {
  width: 35%; }
  @media screen and (max-width: 550px) {
    .img__35 {
      margin: 3rem auto !important;
      width: 60% !important;
      border: 5px solid #ffdddd !important; } }

.img__30 {
  width: 30%; }

.img__25 {
  width: 25%; }

.img__20 {
  width: 20%; }
  @media screen and (max-width: 550px) {
    .img__20 {
      margin: 3rem auto !important;
      width: 30% !important;
      border: 5px solid #ffdddd !important; } }

.img__15 {
  width: 15%; }
  @media screen and (max-width: 550px) {
    .img__15 {
      margin: 3rem auto !important;
      width: 25% !important;
      border: 5px solid #ffdddd !important; } }

.undera {
  width: 100%;
  margin-top: 7rem;
  position: relative;
  display: flex;
  justify-content: center; }
  .undera:before {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    background: #e1e1e1;
    content: '';
    width: 100%;
    height: 2px; }
  .undera__center {
    display: inline-flex;
    align-items: center;
    position: relative;
    z-index: 6;
    background: #fff;
    padding: 0 4rem; }
    @media screen and (max-width: 550px) {
      .undera__center {
        padding: 0 2.4rem; } }
    .undera__center-text {
      font-size: 1.4rem;
      text-transform: uppercase;
      font-weight: 600;
      letter-spacing: 0.6px;
      margin-right: 1.6rem; }
    .undera__center-twitter {
      border-bottom: none !important;
      padding: 0 0.7rem !important; }

.menu {
  position: sticky;
  top: 0;
  display: flex;
  height: 6.6rem;
  width: 100%;
  border-bottom: 1px solid #e1e1e1;
  background: #fff;
  z-index: 2; }
  .menu__twitter {
    margin-left: 1.6rem; }
  .menu__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 80rem;
    margin: 0 auto; }
    @media screen and (max-width: 768px) {
      .menu__inner {
        padding: 0 1.8rem;
        width: 100%; } }
    .menu__inner-right {
      display: flex;
      align-items: center; }
      .menu__inner-right-text {
        font-size: 1.5rem;
        font-weight: 600;
        color: #4742DE; }
  .menu__logo {
    display: block; }
    @media screen and (max-width: 768px) {
      .menu__logo {
        display: none; } }
  .menu__logoSmall {
    display: none; }
    @media screen and (max-width: 768px) {
      .menu__logoSmall {
        display: block; } }

.podcastTop {
  width: 50rem;
  margin: 5rem auto 9rem auto; }
  .podcastTop__header {
    font-size: 2.4rem;
    font-weight: 600; }
  .podcastTop__p {
    font-size: 1.7rem;
    font-weight: 400;
    line-height: 1.6;
    margin-top: 1.2rem; }
    .podcastTop__p-fc {
      margin-top: 2.3rem; }
  .podcastTop__ss {
    margin-top: 3.1rem;
    display: flex; }
    .podcastTop__ss input {
      width: 32rem;
      background-color: #F5F5F5;
      padding: 1.7rem;
      font-weight: 400;
      font-size: 1.6rem;
      margin-right: 2rem; }
      .podcastTop__ss input::placeholder {
        color: #8095A3;
        font-size: 1.6rem; }
    .podcastTop__ss button {
      background-color: #F5F5F5;
      font-size: 1.6rem;
      font-weight: 600;
      color: #4742DE;
      border: none;
      border-radius: 40px;
      padding: 1.7rem;
      width: 16rem; }

.podcastBottom {
  background-color: #0D1626;
  position: relative; }
  .podcastBottom__alt {
    position: absolute;
    width: 27rem;
    height: 11rem;
    background-color: #0D1626;
    left: calc(50% - 13.5rem);
    top: -3.2rem;
    border-radius: 20rem; }
    .podcastBottom__alt-inner {
      display: flex;
      justify-content: center;
      margin-top: 1.3rem;
      align-items: center; }
      .podcastBottom__alt-inner > * {
        background-position: center;
        background-size: cover;
        display: block;
        margin-right: 1.4rem; }
      .podcastBottom__alt-inner-iTunes {
        height: 3.3rem;
        width: 3.3rem;
        background-image: URL("https://storage.googleapis.com/indie-hackers.appspot.com/miscellaneous-images/podcast-subscribe-icons__itunes.png"); }
      .podcastBottom__alt-inner-Spotify {
        background-image: URL("https://storage.googleapis.com/indie-hackers.appspot.com/miscellaneous-images/podcast-subscribe-icons__spotify.png");
        height: 3rem;
        width: 3rem; }
      .podcastBottom__alt-inner-Breaker {
        background-image: URL("https://storage.googleapis.com/indie-hackers.appspot.com/miscellaneous-images/podcast-subscribe-icons__breaker-logo.svg");
        height: 3.1rem;
        width: 3.1rem;
        margin-right: 0; }
  .podcastBottom__section {
    padding: 13rem 0 13rem 0; }

.pe {
  display: flex;
  width: 88rem;
  margin: 10rem auto 0 auto;
  cursor: pointer; }
  .pe:first-child {
    margin-top: 0rem; }
  .pe__left {
    position: relative; }
    .pe__left-ep {
      color: #fff;
      position: absolute;
      left: 50%; }
    .pe__left img {
      width: 33rem;
      border-radius: 100%;
      transform-origin: center center; }
    .pe__left-tape {
      width: 4.7rem;
      height: 5.4rem;
      background: #BE2F22;
      position: absolute;
      right: 0rem;
      top: calc(50% - 2.7rem);
      border-top-right-radius: 0.2rem;
      border-bottom-right-radius: 0.2rem; }
  .pe__right {
    margin-left: 5rem;
    display: flex;
    flex-direction: column;
    justify-content: center; }
    .pe__right-title {
      font-size: 2.4rem;
      color: #fff;
      font-weight: 600;
      text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.35);
      line-height: 1.3; }
    .pe__right-para {
      font-size: 1.8rem;
      color: #fff;
      line-height: 1.4;
      opacity: 0.8;
      text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.35);
      margin-top: 2rem; }
    .pe__right-dt {
      font-size: 1.8rem;
      font-weight: 600;
      color: #fff;
      text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.35);
      margin-top: 2rem;
      display: flex;
      align-items: center; }
      .pe__right-dt span {
        font-size: 1rem;
        margin: 0 0.6rem;
        opacity: 0.9; }

@keyframes spinning {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }

.pe:hover .pe__right-title {
  transition: all 0.2s; }

.pe:hover .pe__right-para {
  opacity: 1;
  transition: all 0.2s; }

.pe:hover .pe__left img {
  animation: spinning 14s infinite linear;
  animation-fill-mode: forwards !important; }

.thTop {
  width: 60rem;
  margin: 8rem auto 0rem auto; }
  @media screen and (max-width: 768px) {
    .thTop {
      width: 100%;
      margin: 6rem auto 0rem auto; } }
  .thTop h1 {
    font-size: 2.4rem;
    font-weight: 700;
    color: #030212;
    margin-bottom: 1.8rem;
    line-height: 3rem; }
    @media screen and (max-width: 768px) {
      .thTop h1 {
        display: none;
        padding: 0 1.8rem;
        text-align: center; } }
  .thTop .small {
    display: none; }
    @media screen and (max-width: 768px) {
      .thTop .small {
        display: block; } }
  .thTop p {
    font-weight: 400;
    font-size: 1.8rem;
    color: #030212;
    padding: 0.7rem 0; }
    @media screen and (max-width: 768px) {
      .thTop p {
        padding: 0.7rem 2rem; } }

.thUnderline {
  border-bottom: 1px solid #030212; }

.thTags {
  padding: 4rem 0 2.2rem 0;
  background-color: white; }
  @media screen and (max-width: 768px) {
    .thTags {
      padding: 2rem 0 2.2rem 0; } }
  .thTags__inner {
    margin: 0 auto;
    width: 81rem;
    display: flex;
    justify-content: center;
    flex-wrap: wrap; }
    @media screen and (max-width: 768px) {
      .thTags__inner {
        width: 100%; } }
  .thTags__tag {
    padding: 0.8rem 1.5rem;
    display: flex;
    justify-content: center;
    font-size: 1.4rem;
    font-weight: 500;
    border-radius: 100px;
    color: #030212;
    margin: 0.4rem; }
    .thTags__tag:hover {
      opacity: 0.9;
      cursor: pointer;
      transition: all 0.2s; }

.thArrow {
  margin: 2rem auto;
  display: flex;
  width: 5rem;
  transform: rotate(5deg); }
  @media screen and (max-width: 768px) {
    .thArrow {
      width: 4rem; } }

.thc1 {
  background-color: rgba(225, 35, 143, 0.16); }

.thc2 {
  background-color: rgba(19, 216, 196, 0.22); }

.thc3 {
  background-color: rgba(255, 56, 56, 0.21); }

.thc4 {
  background-color: rgba(77, 203, 119, 0.21); }

.thc5 {
  background-color: rgba(85, 75, 226, 0.16); }

.thLay {
  margin: 0 auto; }
  .thLay__section {
    padding: 4rem 0 3.6rem 0; }
    @media screen and (max-width: 768px) {
      .thLay__section {
        padding: 3rem 0 2.6rem 0; } }
  .thLay__top {
    width: 60rem;
    margin: 0 auto; }
    @media screen and (max-width: 768px) {
      .thLay__top {
        width: 100%; } }
  .thLay h1 {
    margin-bottom: 2rem;
    font-weight: 700;
    color: #030212;
    padding: 1.1rem 1.4rem .9rem 1.4rem;
    display: inline-flex;
    justify-content: center;
    font-size: 1.8rem;
    transform: rotate(-1deg); }
    @media screen and (max-width: 768px) {
      .thLay h1 {
        margin-left: 1.8rem; } }
  .thLay p {
    font-size: 1.8rem;
    font-weight: 400;
    padding: 0.7rem 0;
    color: #030212; }
    @media screen and (max-width: 768px) {
      .thLay p {
        padding: 0.7rem 1.8rem; } }
    .thLay p .italic {
      font-style: italic; }

.flowBreaker {
  background-color: #14233C;
  width: 100%;
  padding: 8rem 0;
  margin: 4rem 0; }
  @media screen and (max-width: 768px) {
    .flowBreaker {
      padding: 5rem 0; } }
  .flowBreaker__inner {
    width: 60rem;
    margin: 0 auto; }
    @media screen and (max-width: 768px) {
      .flowBreaker__inner {
        width: 100%; } }
    .flowBreaker__inner__harry {
      display: flex;
      align-items: center;
      margin-bottom: 1rem; }
      .flowBreaker__inner__harry-p {
        font-size: 1.6rem;
        background-color: #4742DE;
        padding: 1rem;
        display: inline-flex;
        transform: rotate(-1deg);
        color: white;
        font-weight: 500; }
      .flowBreaker__inner__harry img {
        margin-left: 12px;
        width: 5.3rem;
        height: 5.3rem;
        border-radius: 100px;
        padding: 5px;
        border: 2px solid #fafafa; }
    .flowBreaker__inner-mail {
      width: 100%;
      margin-top: 2.6rem; }
      @media screen and (max-width: 768px) {
        .flowBreaker__inner-mail {
          padding: 0 1.8rem; } }
    .flowBreaker__inner .mail__bc-red {
      font-size: 1.7rem;
      margin-top: 2rem;
      text-align: center; }
  .flowBreaker p {
    color: #ffffff; }
    .flowBreaker p span.bold {
      font-weight: 600; }
    .flowBreaker p a {
      border-bottom: 1px solid #ffffff; }

.fbSocialProof__testy {
  margin-top: 2rem;
  display: flex;
  align-items: center;
  position: relative;
  text-align: center;
  justify-content: center; }
  @media screen and (max-width: 768px) {
    .fbSocialProof__testy {
      text-align: left; } }
  .fbSocialProof__testy-img {
    border-radius: 100px;
    width: 5.3rem;
    height: 5.3rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 2px solid white; }
    @media screen and (max-width: 376px) {
      .fbSocialProof__testy-img {
        margin-left: 1rem; } }
    .fbSocialProof__testy-img img {
      width: 4.3rem;
      height: 4.3rem;
      border-radius: 100px; }
  .fbSocialProof__testy-text {
    font-size: 1.6rem;
    margin-left: 1.1rem;
    width: 34rem;
    font-style: italic;
    line-height: 2rem;
    font-weight: 400;
    z-index: 2;
    color: #F2F2F2; }
    @media screen and (max-width: 376px) {
      .fbSocialProof__testy-text {
        margin-left: 1.6rem;
        width: 26rem; } }
    @media screen and (max-width: 350px) {
      .fbSocialProof__testy-text {
        margin-left: 1rem;
        width: 22rem; } }
    .fbSocialProof__testy-text .bold {
      font-weight: 600; }

.thSection {
  display: flex;
  padding-top: 3.1rem;
  width: 80rem;
  margin: 0 auto; }
  @media screen and (max-width: 768px) {
    .thSection {
      width: 100%; } }
  .thSection img, .thSection picture {
    width: 100%; }
  .thSection video {
    width: 80%;
    margin: 0 auto; }
    @media screen and (max-width: 768px) {
      .thSection video {
        width: 100%; } }

.fed__outer {
  display: flex;
  justify-content: center; }
  .fed__outer-side {
    width: calc((100vw - 1440px) / 2);
    margin: 0 auto;
    height: 100%;
    overflow: hidden;
    position: fixed;
    background: radial-gradient(ellipse at bottom, #1B2735 0%, #090A0F 100%); }
    @media (max-width: 1440px) {
      .fed__outer-side {
        display: none; } }
    .fed__outer-side-right {
      right: 0; }
    .fed__outer-side-left {
      left: 0; }

.fed {
  width: 144rem;
  margin: 0 auto; }

.stars-left {
  box-shadow: 67vh 11vh #FFF , 148px 58vh #FFF , 31px 79vh #FFF , 7px 86vh #FFF , 73px 50vh #FFF , 72px 52vh #FFF , 75px 17vh #FFF , 45px 56vh #FFF , 172px 8vh #FFF , 100px 85vh #FFF , 148px 55vh #FFF , 32px 16vh #FFF , 47px 46vh #FFF , 115px 45vh #FFF , 96px 9vh #FFF , 56px 70vh #FFF , 86px 92vh #FFF , 147px 29vh #FFF , 108px 43vh #FFF , 41px 15vh #FFF , 23px 68vh #FFF , 80px 41vh #FFF , 8px 68vh #FFF , 89px 8vh #FFF , 14px 1vh #FFF , 75px 26vh #FFF , 55px 2vh #FFF , 95px 80vh #FFF , 43px 50vh #FFF , 176px 43vh #FFF , 7px 67vh #FFF , 81px 44vh #FFF , 118px 89vh #FFF , 146px 48vh #FFF , 55px 62vh #FFF , 86px 38vh #FFF , 148px 93vh #FFF , 158px 73vh #FFF , 59px 67vh #FFF , 130px 68vh #FFF , 113px 33vh #FFF , 11px 40vh #FFF , 42px 92vh #FFF , 20px 34vh #FFF , 51px 29vh #FFF , 66px 38vh #FFF , 129px 32vh #FFF , 168px 30vh #FFF , 106px 58vh #FFF , 30px 71vh #FFF , 76px 90vh #FFF , 32px 24vh #FFF , 75px 34vh #FFF , 111px 80vh #FFF , 23px 33vh #FFF , 57px 87vh #FFF , 12px 73vh #FFF , 44px 76vh #FFF , 83px 7vh #FFF , 42px 21vh #FFF , 85px 52vh #FFF , 44px 46vh #FFF , 135px 86vh #FFF , 47px 30vh #FFF , 78px 22vh #FFF , 39px 73vh #FFF , 67px 80vh #FFF , 68px 18vh #FFF , 27px 14vh #FFF , 137px 9vh #FFF , 170px 82vh #FFF , 78px 41vh #FFF , 145px 66vh #FFF , 97px 98vh #FFF , 168px 41vh #FFF , 17px 92vh #FFF , 67px 57vh #FFF , 40px 85vh #FFF , 13px 37vh #FFF , 172px 57vh #FFF , 27px 92vh #FFF , 129px 68vh #FFF , 35px 78vh #FFF , 180px 72vh #FFF , 81px 37vh #FFF , 42px 18vh #FFF , 90px 11vh #FFF , 101px 51vh #FFF , 48px 38vh #FFF , 13px 57vh #FFF , 71px 63vh #FFF , 14px 46vh #FFF , 18px 80vh #FFF , 26px 53vh #FFF , 118px 74vh #FFF , 2px 13vh #FFF , 170px 70vh #FFF , 111px 18vh #FFF , 170px 83vh #FFF , 126px 44vh #FFF; }
  .stars-left:after {
    box-shadow: 67vh 11vh #FFF , 148px 58vh #FFF , 31px 79vh #FFF , 7px 86vh #FFF , 73px 50vh #FFF , 72px 52vh #FFF , 75px 17vh #FFF , 45px 56vh #FFF , 172px 8vh #FFF , 100px 85vh #FFF , 148px 55vh #FFF , 32px 16vh #FFF , 47px 46vh #FFF , 115px 45vh #FFF , 96px 9vh #FFF , 56px 70vh #FFF , 86px 92vh #FFF , 147px 29vh #FFF , 108px 43vh #FFF , 41px 15vh #FFF , 23px 68vh #FFF , 80px 41vh #FFF , 8px 68vh #FFF , 89px 8vh #FFF , 14px 1vh #FFF , 75px 26vh #FFF , 55px 2vh #FFF , 95px 80vh #FFF , 43px 50vh #FFF , 176px 43vh #FFF , 7px 67vh #FFF , 81px 44vh #FFF , 118px 89vh #FFF , 146px 48vh #FFF , 55px 62vh #FFF , 86px 38vh #FFF , 148px 93vh #FFF , 158px 73vh #FFF , 59px 67vh #FFF , 130px 68vh #FFF , 113px 33vh #FFF , 11px 40vh #FFF , 42px 92vh #FFF , 20px 34vh #FFF , 51px 29vh #FFF , 66px 38vh #FFF , 129px 32vh #FFF , 168px 30vh #FFF , 106px 58vh #FFF , 30px 71vh #FFF , 76px 90vh #FFF , 32px 24vh #FFF , 75px 34vh #FFF , 111px 80vh #FFF , 23px 33vh #FFF , 57px 87vh #FFF , 12px 73vh #FFF , 44px 76vh #FFF , 83px 7vh #FFF , 42px 21vh #FFF , 85px 52vh #FFF , 44px 46vh #FFF , 135px 86vh #FFF , 47px 30vh #FFF , 78px 22vh #FFF , 39px 73vh #FFF , 67px 80vh #FFF , 68px 18vh #FFF , 27px 14vh #FFF , 137px 9vh #FFF , 170px 82vh #FFF , 78px 41vh #FFF , 145px 66vh #FFF , 97px 98vh #FFF , 168px 41vh #FFF , 17px 92vh #FFF , 67px 57vh #FFF , 40px 85vh #FFF , 13px 37vh #FFF , 172px 57vh #FFF , 27px 92vh #FFF , 129px 68vh #FFF , 35px 78vh #FFF , 180px 72vh #FFF , 81px 37vh #FFF , 42px 18vh #FFF , 90px 11vh #FFF , 101px 51vh #FFF , 48px 38vh #FFF , 13px 57vh #FFF , 71px 63vh #FFF , 14px 46vh #FFF , 18px 80vh #FFF , 26px 53vh #FFF , 118px 74vh #FFF , 2px 13vh #FFF , 170px 70vh #FFF , 111px 18vh #FFF , 170px 83vh #FFF , 126px 44vh #FFF; }

.stars2-left {
  box-shadow: 72vh 11vh #FFF , 142px 20vh #FFF , 52px 75vh #FFF , 121px 5vh #FFF , 179px 32vh #FFF , 56px 21vh #FFF , 23px 27vh #FFF , 12px 53vh #FFF , 107px 86vh #FFF , 68px 72vh #FFF , 177px 14vh #FFF , 88px 71vh #FFF , 157px 55vh #FFF , 166px 48vh #FFF , 82px 79vh #FFF , 126px 38vh #FFF , 71px 25vh #FFF , 40px 51vh #FFF , 68px 12vh #FFF , 91px 13vh #FFF; }
  .stars2-left:after {
    box-shadow: 72vh 11vh #FFF , 142px 20vh #FFF , 52px 75vh #FFF , 121px 5vh #FFF , 179px 32vh #FFF , 56px 21vh #FFF , 23px 27vh #FFF , 12px 53vh #FFF , 107px 86vh #FFF , 68px 72vh #FFF , 177px 14vh #FFF , 88px 71vh #FFF , 157px 55vh #FFF , 166px 48vh #FFF , 82px 79vh #FFF , 126px 38vh #FFF , 71px 25vh #FFF , 40px 51vh #FFF , 68px 12vh #FFF , 91px 13vh #FFF; }

.stars-right {
  box-shadow: 31vh 48vh #FFF , 156px 4vh #FFF , 98px 28vh #FFF , 131px 3vh #FFF , 120px 55vh #FFF , 166px 14vh #FFF , 88px 43vh #FFF , 155px 48vh #FFF , 13px 60vh #FFF , 176px 76vh #FFF , 48px 53vh #FFF , 37px 59vh #FFF , 134px 33vh #FFF , 52px 61vh #FFF , 23px 51vh #FFF , 118px 40vh #FFF , 111px 55vh #FFF , 154px 1vh #FFF , 51px 17vh #FFF , 164px 49vh #FFF , 115px 16vh #FFF , 92px 72vh #FFF , 121px 11vh #FFF , 23px 49vh #FFF , 51px 87vh #FFF , 70px 47vh #FFF , 163px 91vh #FFF , 99px 30vh #FFF , 136px 53vh #FFF , 117px 82vh #FFF , 135px 36vh #FFF , 126px 100vh #FFF , 147px 64vh #FFF , 11px 99vh #FFF , 179px 12vh #FFF , 6px 9vh #FFF , 74px 19vh #FFF , 112px 14vh #FFF , 95px 91vh #FFF , 95px 91vh #FFF , 138px 79vh #FFF , 63px 91vh #FFF , 132px 76vh #FFF , 46px 99vh #FFF , 89px 74vh #FFF , 58px 11vh #FFF , 121px 97vh #FFF , 123px 86vh #FFF , 75px 80vh #FFF , 49px 95vh #FFF , 145px 63vh #FFF , 75px 35vh #FFF , 171px 45vh #FFF , 105px 75vh #FFF , 108px 81vh #FFF , 106px 56vh #FFF , 64px 4vh #FFF , 59px 77vh #FFF , 58px 69vh #FFF , 13px 59vh #FFF , 94px 40vh #FFF , 47px 16vh #FFF , 91px 9vh #FFF , 11px 5vh #FFF , 139px 39vh #FFF , 53px 56vh #FFF , 112px 18vh #FFF , 33px 41vh #FFF , 140px 22vh #FFF , 167px 93vh #FFF , 85px 35vh #FFF , 159px 29vh #FFF , 128px 84vh #FFF , 120px 14vh #FFF , 64px 62vh #FFF , 179px 70vh #FFF , 5px 5vh #FFF , 125px 27vh #FFF , 113px 90vh #FFF , 90px 4vh #FFF , 78px 23vh #FFF , 155px 7vh #FFF , 162px 60vh #FFF , 94px 99vh #FFF , 50px 73vh #FFF , 89px 52vh #FFF , 1px 88vh #FFF , 29px 34vh #FFF , 164px 86vh #FFF , 177px 81vh #FFF , 2px 51vh #FFF , 160px 76vh #FFF , 24px 99vh #FFF , 179px 52vh #FFF , 127px 62vh #FFF , 43px 23vh #FFF , 68px 78vh #FFF , 131px 93vh #FFF , 161px 51vh #FFF , 101px 39vh #FFF; }
  .stars-right:after {
    box-shadow: 31vh 48vh #FFF , 156px 4vh #FFF , 98px 28vh #FFF , 131px 3vh #FFF , 120px 55vh #FFF , 166px 14vh #FFF , 88px 43vh #FFF , 155px 48vh #FFF , 13px 60vh #FFF , 176px 76vh #FFF , 48px 53vh #FFF , 37px 59vh #FFF , 134px 33vh #FFF , 52px 61vh #FFF , 23px 51vh #FFF , 118px 40vh #FFF , 111px 55vh #FFF , 154px 1vh #FFF , 51px 17vh #FFF , 164px 49vh #FFF , 115px 16vh #FFF , 92px 72vh #FFF , 121px 11vh #FFF , 23px 49vh #FFF , 51px 87vh #FFF , 70px 47vh #FFF , 163px 91vh #FFF , 99px 30vh #FFF , 136px 53vh #FFF , 117px 82vh #FFF , 135px 36vh #FFF , 126px 100vh #FFF , 147px 64vh #FFF , 11px 99vh #FFF , 179px 12vh #FFF , 6px 9vh #FFF , 74px 19vh #FFF , 112px 14vh #FFF , 95px 91vh #FFF , 95px 91vh #FFF , 138px 79vh #FFF , 63px 91vh #FFF , 132px 76vh #FFF , 46px 99vh #FFF , 89px 74vh #FFF , 58px 11vh #FFF , 121px 97vh #FFF , 123px 86vh #FFF , 75px 80vh #FFF , 49px 95vh #FFF , 145px 63vh #FFF , 75px 35vh #FFF , 171px 45vh #FFF , 105px 75vh #FFF , 108px 81vh #FFF , 106px 56vh #FFF , 64px 4vh #FFF , 59px 77vh #FFF , 58px 69vh #FFF , 13px 59vh #FFF , 94px 40vh #FFF , 47px 16vh #FFF , 91px 9vh #FFF , 11px 5vh #FFF , 139px 39vh #FFF , 53px 56vh #FFF , 112px 18vh #FFF , 33px 41vh #FFF , 140px 22vh #FFF , 167px 93vh #FFF , 85px 35vh #FFF , 159px 29vh #FFF , 128px 84vh #FFF , 120px 14vh #FFF , 64px 62vh #FFF , 179px 70vh #FFF , 5px 5vh #FFF , 125px 27vh #FFF , 113px 90vh #FFF , 90px 4vh #FFF , 78px 23vh #FFF , 155px 7vh #FFF , 162px 60vh #FFF , 94px 99vh #FFF , 50px 73vh #FFF , 89px 52vh #FFF , 1px 88vh #FFF , 29px 34vh #FFF , 164px 86vh #FFF , 177px 81vh #FFF , 2px 51vh #FFF , 160px 76vh #FFF , 24px 99vh #FFF , 179px 52vh #FFF , 127px 62vh #FFF , 43px 23vh #FFF , 68px 78vh #FFF , 131px 93vh #FFF , 161px 51vh #FFF , 101px 39vh #FFF; }

.stars2-right {
  box-shadow: 66vh 78vh #FFF , 46px 45vh #FFF , 127px 6vh #FFF , 125px 22vh #FFF , 53px 85vh #FFF , 132px 59vh #FFF , 47px 48vh #FFF , 90px 62vh #FFF , 173px 97vh #FFF , 84px 10vh #FFF , 9px 71vh #FFF , 111px 41vh #FFF , 179px 51vh #FFF , 12px 5vh #FFF , 9px 56vh #FFF , 58px 1vh #FFF , 70px 84vh #FFF , 66px 55vh #FFF , 17px 23vh #FFF , 61px 8vh #FFF; }
  .stars2-right:after {
    box-shadow: 66vh 78vh #FFF , 46px 45vh #FFF , 127px 6vh #FFF , 125px 22vh #FFF , 53px 85vh #FFF , 132px 59vh #FFF , 47px 48vh #FFF , 90px 62vh #FFF , 173px 97vh #FFF , 84px 10vh #FFF , 9px 71vh #FFF , 111px 41vh #FFF , 179px 51vh #FFF , 12px 5vh #FFF , 9px 56vh #FFF , 58px 1vh #FFF , 70px 84vh #FFF , 66px 55vh #FFF , 17px 23vh #FFF , 61px 8vh #FFF; }

#stars {
  width: 1px;
  height: 1px;
  background: transparent;
  animation: animStar 100s linear infinite;
  position: absolute; }
  #stars:after {
    content: "";
    position: absolute;
    top: 100vh;
    width: 1px;
    height: 1px;
    background: transparent; }

#stars2 {
  width: 2px;
  height: 2px;
  background: transparent;
  animation: animStar 100s linear infinite;
  position: absolute; }
  #stars2:after {
    content: "";
    position: absolute;
    top: 100vh;
    width: 2px;
    height: 2px;
    background: transparent; }

@keyframes animStar {
  from {
    transform: translateY(-100vh); }
  to {
    transform: translateY(0px); } }

.ceg {
  display: flex;
  justify-content: space-between; }
  @media (max-width: 1026px) {
    .ceg {
      display: block; } }

.cegm__top {
  justify-content: space-between;
  border-bottom: 2px solid #f7f7f7;
  padding: 1.2rem 1.2rem 1.2rem 1.8rem;
  align-items: center;
  position: fixed;
  width: 100%;
  top: 0;
  background-color: white;
  z-index: 101;
  display: none; }
  @media (max-width: 1026px) {
    .cegm__top {
      display: flex; } }
  .cegm__top img {
    height: 2.9rem;
    transform: translateY(1px); }
  .cegm__top-right {
    display: flex;
    align-items: center; }
    .cegm__top-right-menu {
      padding: 0.6rem; }
    .cegm__top-right-plus {
      padding: 0.6rem;
      display: none; }
    .cegm__top-right-minus {
      padding: 0.6rem;
      display: none; }

.cegm__notice {
  display: none;
  text-align: center;
  font-weight: 500;
  font-style: italic;
  color: #090A0F;
  font-size: 1.6rem;
  margin-top: 8.6rem; }
  @media (max-width: 1026px) {
    .cegm__notice {
      display: block; } }

.cegm__bottom {
  background-color: #fff;
  z-index: 103;
  position: fixed;
  bottom: 0;
  display: none; }
  .cegm__bottom-sep {
    height: 4rem;
    background-color: #fafafa;
    width: 100%; }
  .cegm__bottom-inner {
    width: 100%;
    background-color: #ffffff;
    display: flex;
    flex-wrap: wrap;
    padding: 2.2rem 0rem 1.1rem 0rem;
    position: relative; }
  .cegm__bottom-title {
    position: absolute;
    left: 0;
    height: 2.7rem;
    top: 0;
    transform: translateY(-50%);
    padding: .7rem 1rem .7rem .9rem;
    display: inline-block;
    margin: 0 auto;
    background-color: #090A0F; }
  .cegm__bottom-tab {
    padding: 0.7rem 1rem;
    font-size: 1.5rem;
    display: inline-block;
    border: 2px solid #f7f7f7;
    cursor: pointer;
    color: #212121;
    transition: all 0.4s ease;
    margin-top: 1rem;
    margin-left: .9rem;
    font-weight: 400; }

.cegmtr__active {
  display: block; }

.cegl {
  height: 100%;
  width: 21.1rem;
  background-color: white;
  height: 100vh;
  position: fixed; }
  @media (max-width: 1026px) {
    .cegl {
      display: none; } }
  .cegl img {
    padding: 2.4rem 0 0 0;
    width: 15rem;
    transform: translateY(3px);
    margin: 0 auto;
    display: flex; }
  .cegl__filter {
    width: 21.1rem;
    background-color: #ffffff;
    display: flex;
    position: relative;
    flex-wrap: wrap;
    margin-top: 3.5rem;
    padding: 1.8rem 0rem 1.4rem 0.1rem;
    border-radius: 2rem;
    border: 4px solid #f7f7f7;
    border-left: 0rem; }
    @media (max-width: 1320px) {
      .cegl__filter {
        width: 20rem; } }
    .cegl__filter-title {
      position: absolute;
      left: 0;
      top: 0;
      transform: translateY(-50%);
      padding: .7rem 1rem;
      display: inline-block;
      margin: 0 auto;
      background-color: #090A0F; }
    .cegl__filter-tab {
      padding: 0.7rem 1rem;
      font-size: 1.5rem;
      display: inline-block;
      border: 2px solid #f7f7f7;
      cursor: pointer;
      color: #090A0F;
      transition: all 0.4s ease;
      font-family: Avenir;
      margin-top: 1rem;
      margin-left: .9rem;
      font-weight: 500; }
      @media (max-width: 1320px) {
        .cegl__filter-tab {
          font-size: 1.4rem;
          margin-top: .9rem;
          margin-left: .8rem; } }

.cegtagSVG1 {
  transform: translateY(2px);
  width: 3.5rem; }
  @media (max-width: 1026px) {
    .cegtagSVG1 {
      width: 3.5rem; } }

.cegtagSVG2 {
  transform: translateY(1px);
  width: 4.2rem; }
  @media (max-width: 1026px) {
    .cegtagSVG2 {
      width: 4.1rem;
      transform: translateY(0.7px); } }

.ceRight {
  width: calc(100% - 21.1rem);
  margin-left: 21.1rem;
  padding: 0 1.6rem 1.6rem 1.6rem;
  background: white; }
  @media (max-width: 1320px) {
    .ceRight {
      width: calc(100% - 20rem);
      margin-left: 20rem; } }
  @media (max-width: 1026px) {
    .ceRight {
      margin-left: 0rem;
      width: calc(100%);
      padding: 1.4rem; } }

.ceTop {
  height: 8.8rem;
  background-color: white;
  display: flex;
  align-items: center;
  justify-content: space-between;
  z-index: 4;
  position: sticky;
  top: 0; }
  @media (max-width: 1026px) {
    .ceTop {
      display: none; } }
  .ceTop-mail {
    width: 51rem;
    margin: 0 auto;
    background-color: white;
    height: 5.8rem;
    display: flex;
    justify-content: space-between;
    padding: 0.8rem 0.8rem 0.8rem 1.7rem;
    border-radius: 2rem;
    border: 4px solid #f7f7f7; }
    .ceTop-mail-left {
      display: flex;
      justify-content: flex-start; }
      .ceTop-mail-left-icon {
        display: flex;
        align-items: center; }
      .ceTop-mail-left input {
        margin-left: 1.2rem;
        font-size: 1.5rem;
        font-weight: 500;
        width: 33rem;
        color: #8795A1; }
    .ceTop-mail button {
      border-radius: 4px;
      background-color: #090A0F;
      border: none;
      color: #fff;
      padding: 0 1rem;
      font-size: 1.4rem;
      font-weight: 600;
      font-family: "AvenirNext";
      cursor: pointer; }
  .ceTop__right {
    display: flex;
    align-items: center;
    height: 5rem;
    padding-right: 0.8rem; }
    .ceTop__right-sign {
      font-size: 1.55rem;
      font-weight: 500;
      font-style: italic;
      transform: rotateZ(-1deg);
      margin-right: .2rem; }
    .ceTop__right img {
      width: 3.2rem;
      transform: rotateZ(387deg); }
    .ceTop__right a {
      margin-left: 1.4rem;
      font-size: 1.5rem;
      text-transform: uppercase;
      font-weight: 600; }
      .ceTop__right a > * {
        fill: #090A0F !important; }

.cegrid {
  display: grid;
  grid-gap: 1.5rem;
  grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
  grid-auto-rows: 1rem;
  grid-auto-flow: row; }

.cegio {
  width: calc((100% - 30px) / 3);
  margin-bottom: 1.6rem;
  transition: all 0.2s; }
  .cegio__notyetloaded {
    opacity: 0;
    transition: all 0.2s; }
  @media (max-width: 1026px) {
    .cegio {
      width: calc((100% - 15px) / 2); } }
  @media (max-width: 767px) {
    .cegio {
      width: calc(100%);
      margin-bottom: 1.5rem; } }

.cegi {
  position: relative;
  cursor: pointer;
  overflow: hidden; }
  @media (min-width: 1026px) {
    .cegi:hover .cegi__left {
      transform: translateX(0rem);
      transition: all 0.4s ease; }
    .cegi:hover .cegi__right {
      transform: translateX(0rem);
      transition: all 0.4s ease; }
    .cegi:hover .cegi__center {
      transition: all 0.4s ease;
      opacity: 1; }
    .cegi:hover p {
      margin-top: 0rem; }
    .cegi:hover img {
      filter: blur(2px);
      transition: all 0.4s ease; } }
  .cegi__left {
    position: absolute;
    bottom: 0;
    left: 0;
    transform: translateX(-100%);
    background: #f7f7f7;
    padding: 1rem 1rem .7rem .7rem;
    border-top-right-radius: 100px;
    transition: all 0.4s ease;
    z-index: 3; }
    @media (max-width: 1320px) {
      .cegi__left {
        padding: .95rem .9rem .65rem .6rem; } }
    @media (max-width: 1026px) {
      .cegi__left {
        padding: 1rem 1rem .7rem .7rem; } }
    @media (max-width: 380px) {
      .cegi__left {
        padding: .95rem .9rem .65rem .6rem; } }
  .cegi__right {
    background: #f7f7f7;
    right: 0;
    bottom: 0;
    position: absolute;
    padding: 0.6rem;
    border-top-left-radius: 20px;
    display: flex;
    transform: translateX(100%);
    transition: all 0.4s ease;
    z-index: 3; }
    @media (max-width: 1320px) {
      .cegi__right {
        padding: 0.55rem; } }
    @media (max-width: 1026px) {
      .cegi__right {
        padding: 0.6rem; } }
    @media (max-width: 380px) {
      .cegi__right {
        padding: 0.55rem; } }
    .cegi__right-pill {
      padding: 0.6rem 0.8rem;
      font-size: 1.4rem;
      display: flex;
      justify-content: center;
      font-weight: 400;
      border-radius: 20px; }
      @media (max-width: 1320px) {
        .cegi__right-pill {
          font-size: 1.35rem;
          padding: 0.55rem 0.7rem; } }
      @media (max-width: 1026px) {
        .cegi__right-pill {
          padding: 0.6rem 0.8rem;
          font-size: 1.4rem; } }
      @media (max-width: 380px) {
        .cegi__right-pill {
          font-size: 1.35rem;
          padding: 0.55rem 0.7rem; } }
      .cegi__right-pill:not(:last-child) {
        margin-right: 0.4rem; }
  .cegi__center {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    padding: 1.8rem 1.8rem;
    background-color: rgba(0, 0, 0, 0.8);
    font-size: 1.6rem;
    line-height: 1.4;
    text-align: center;
    color: white;
    border-radius: 2rem;
    transition: all 0.4s ease;
    z-index: 3;
    border: 4px solid #f7f7f7; }
    @media (max-width: 1320px) {
      .cegi__center {
        font-size: 1.5rem; } }
    @media (max-width: 1026px) {
      .cegi__center {
        font-size: 1.6rem; } }
    @media (max-width: 380px) {
      .cegi__center {
        font-size: 1.5rem; } }
    .cegi__center-inner p {
      font-size: .5rem; }
      @media (max-width: 1320px) {
        .cegi__center-inner p {
          font-size: .4rem; } }
      @media (max-width: 1026px) {
        .cegi__center-inner p {
          font-size: .5rem; } }
      @media (max-width: 380px) {
        .cegi__center-inner p {
          font-size: .4rem; } }
    .cegi__center-inner .ptitle {
      font-size: .7rem !important; }
      @media (max-width: 1320px) {
        .cegi__center-inner .ptitle {
          font-size: .6rem !important; } }
      @media (max-width: 1026px) {
        .cegi__center-inner .ptitle {
          font-size: .7rem !important; } }
      @media (max-width: 380px) {
        .cegi__center-inner .ptitle {
          font-size: .6rem !important; } }
  .cegi__img {
    border-radius: 2rem;
    border: 4px solid #f7f7f7;
    overflow: hidden;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    display: grid;
    align-items: start; }
    .cegi__img-wrapper {
      display: flex;
      width: 100%;
      height: 100%; }
  .cegi img {
    width: 100%;
    height: 100%;
    object-fit: fill;
    will-change: opacity;
    opacity: 0;
    transition: all .3s linear; }

.fed__loaded {
  opacity: 1 !important;
  transition: all .3s linear; }

.fedgrid {
  opacity: 0; }

.cegimobtap .cegi__left {
  transform: translateX(0rem);
  transition: all 0.4s ease; }

.cegimobtap .cegi__right {
  transform: translateX(0rem);
  transition: all 0.4s ease; }

.cegimobtap .cegi__center {
  transition: all 0.4s ease;
  opacity: 1; }

.cegimobtap .cegi__img img {
  filter: blur(2px);
  transition: all 0.4s ease; }

.cegi-shade1 {
  background: rgba(98, 203, 157, 0.24); }
  .cegi-shade1:hover {
    background: rgba(98, 203, 157, 0.3);
    transition: all 0.4s; }

.cegi-shade2 {
  background: rgba(255, 56, 56, 0.2); }
  .cegi-shade2:hover {
    background: rgba(255, 56, 56, 0.2);
    transition: all 0.4s; }

.cegi-shade3 {
  background: rgba(69, 96, 232, 0.18); }
  .cegi-shade3:hover {
    background: rgba(69, 96, 232, 0.24);
    transition: all 0.4s; }

.cegi-shade4 {
  background: rgba(255, 5, 93, 0.15); }
  .cegi-shade4:hover {
    background: rgba(255, 5, 93, 0.21);
    transition: all 0.4s; }

.cegi-shade5 {
  background: rgba(19, 216, 196, 0.22); }
  .cegi-shade5:hover {
    background: rgba(19, 216, 196, 0.25);
    transition: all 0.4s; }

.cegi-shade6 {
  background: rgba(242, 238, 13, 0.23); }
  .cegi-shade6:hover {
    background: rgba(242, 238, 13, 0.3);
    transition: all 0.4s; }

.cegi-shade7 {
  background: rgba(98, 203, 157, 0.24); }
  .cegi-shade7:hover {
    background: rgba(98, 203, 157, 0.3);
    transition: all 0.4s; }

.cegi-shade8 {
  background: rgba(255, 56, 56, 0.2); }
  .cegi-shade8:hover {
    background: rgba(255, 56, 56, 0.2);
    transition: all 0.4s; }

.cegi-shade9 {
  background: rgba(69, 96, 232, 0.18); }
  .cegi-shade9:hover {
    background: rgba(69, 96, 232, 0.24);
    transition: all 0.4s; }

.cegi-shade10 {
  background: rgba(255, 5, 93, 0.15); }
  .cegi-shade10:hover {
    background: rgba(255, 5, 93, 0.21);
    transition: all 0.4s; }

.cegi-shade11 {
  background: rgba(19, 216, 196, 0.22); }
  .cegi-shade11:hover {
    background: rgba(19, 216, 196, 0.25);
    transition: all 0.4s; }

.cegi-shade12 {
  background: rgba(242, 238, 13, 0.23); }
  .cegi-shade12:hover {
    background: rgba(242, 238, 13, 0.3);
    transition: all 0.4s; }

.cegi-shade13 {
  background: rgba(0, 158, 250, 0.19); }
  .cegi-shade13:hover {
    background: rgba(0, 158, 250, 0.24);
    transition: all 0.4s; }

.cegfilters__active1 .cegi-shade1 {
  border: 2px solid rgba(98, 203, 157, 0.8); }

.cegfilters__active2 .cegi-shade2 {
  border: 2px solid rgba(255, 56, 56, 0.5); }

.cegfilters__active3 .cegi-shade3 {
  border: 2px solid rgba(69, 96, 232, 0.5); }

.cegfilters__active4 .cegi-shade4 {
  border: 2px solid rgba(255, 5, 93, 0.4); }

.cegfilters__active5 .cegi-shade5 {
  border: 2px solid rgba(19, 216, 196, 0.6); }

.cegfilters__active6 .cegi-shade6 {
  border: 2px solid rgba(242, 238, 13, 0.7); }

.cegfilters__active7 .cegi-shade7 {
  border: 2px solid rgba(98, 203, 157, 0.8); }

.cegfilters__active8 .cegi-shade8 {
  border: 2px solid rgba(255, 56, 56, 0.5); }

.cegfilters__active9 .cegi-shade9 {
  border: 2px solid rgba(69, 96, 232, 0.5); }

.cegfilters__active10 .cegi-shade10 {
  border: 2px solid rgba(255, 5, 93, 0.4); }

.cegfilters__active11 .cegi-shade11 {
  border: 2px solid rgba(19, 216, 196, 0.6); }

.cegfilters__active12 .cegi-shade12 {
  border: 2px solid rgba(242, 238, 13, 0.7); }

.cegfilters__active13 .cegi-shade13 {
  border: 2px solid rgba(0, 158, 250, 0.5); }

.cegx1 {
  background: rgba(98, 203, 157, 0.24); }

.cegx2 {
  background: rgba(255, 56, 56, 0.2); }

.cegx3 {
  background: rgba(69, 96, 232, 0.3); }

.cegx4 {
  background: rgba(225, 35, 193, 0.18); }

.cegx5 {
  background: rgba(19, 216, 196, 0.2); }

.cegx6 {
  background: rgba(242, 238, 13, 0.16); }

.cegx7 {
  background: rgba(0, 158, 250, 0.19); }

.cegxbold {
  font-weight: 500; }

.cegxitalic {
  font-style: italic; }

.cegxtitle {
  font-style: italic;
  margin-bottom: 2px;
  text-decoration: underline;
  text-underline-offset: 0.4rem; }

.left__menu {
  position: fixed;
  left: 0;
  top: 50%;
  transform: translate(0, -50%);
  z-index: 2;
  transition: all 0.4s;
  background-color: #FAFAFA;
  padding: 2rem;
  transition: all 0.4s;
  opacity: 0;
  box-shadow: 0.2rem 0.2rem 4rem rgba(0, 0, 0, 0.1); }
  @media (max-width: 1023px) {
    .left__menu {
      display: none; } }
  .left__menu-active {
    transition: all 0.4s;
    opacity: 1; }
  .left__menu-text {
    margin-bottom: 1.1rem;
    font-size: 1.6rem;
    text-align: left;
    cursor: pointer;
    position: relative;
    width: -webkit-max-content;
    width: max-content;
    opacity: 0.5;
    font-weight: 400; }
    .left__menu-text::before {
      content: "";
      width: 0%;
      height: 1px;
      background: #030212;
      position: absolute;
      top: 48%;
      transform: translateY(-40%);
      left: -2%;
      transition: all 0.4s; }
    .left__menu-text:hover {
      opacity: 0.8;
      transition: all 0.2s; }
    .left__menu-text:last-child {
      margin-bottom: 0rem; }

.strike::before {
  width: 104%; }

.strike__active {
  opacity: 1;
  font-weight: 500;
  transition: all 0.4s; }

.ccc {
  position: relative;
  font-family: "AvenirNext";
  text-align: center;
  width: 100%;
  overflow: hidden;
  padding-bottom: 7rem;
  z-index: 3;
  background-color: white; }
  .ccc__inner {
    width: 61rem;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    position: relative;
    z-index: 1; }
    @media (max-width: 540px) {
      .ccc__inner {
        width: calc(100% - 4rem);
        margin: 0 2rem; } }
  .ccc__tl {
    top: -28rem;
    left: -28rem;
    width: 62rem;
    height: 50rem; }
    @media (max-width: 1500px) {
      .ccc__tl {
        top: -28rem;
        left: -28rem;
        width: 48.5rem;
        height: 48.5rem; } }
    @media (max-width: 700px) {
      .ccc__tl {
        top: -21vw;
        left: -21vw;
        width: 42.4vw;
        height: 42.4vw; } }
  .ccc__tr {
    top: -36rem;
    right: -25rem;
    width: 64rem;
    height: 58rem; }
    @media (max-width: 1500px) {
      .ccc__tr {
        top: -36rem;
        right: -36rem;
        width: 59rem;
        height: 59rem; } }
    @media (max-width: 700px) {
      .ccc__tr {
        top: -19vw;
        right: -22vw;
        width: 43vw;
        height: 43vw; } }
  .ccc__bl {
    bottom: -28rem;
    left: -26rem;
    width: 63rem;
    height: 47rem; }
    @media (max-width: 1500px) {
      .ccc__bl {
        bottom: -28rem;
        left: -26rem;
        width: 46rem;
        height: 46rem; } }
    @media (max-width: 700px) {
      .ccc__bl {
        bottom: -21vw;
        left: -20vw;
        width: 41vw;
        height: 41vw; } }
  .ccc__br {
    bottom: -22rem;
    right: -16rem;
    width: 56rem;
    height: 43rem; }
    @media (max-width: 1500px) {
      .ccc__br {
        bottom: -22rem;
        right: -24rem;
        width: 43rem;
        height: 43rem; } }
    @media (max-width: 700px) {
      .ccc__br {
        bottom: -20vw;
        right: -20vw;
        width: 39vw;
        height: 39vw; } }
  .ccc h1 {
    font-size: 4rem;
    font-weight: 800;
    line-height: 1.2;
    margin-top: 1.2rem;
    letter-spacing: -1px; }
    @media (max-width: 540px) {
      .ccc h1 {
        font-size: 2.8rem; } }
  .ccc h2 {
    font-size: 2rem;
    margin-top: 2.4rem;
    line-height: 1.5; }
    .ccc h2 span {
      line-height: 1;
      font-weight: 700; }
    @media (max-width: 400px) {
      .ccc h2 {
        font-size: 1.8rem;
        margin-top: 1.8rem; } }
    @media (max-width: 540px) {
      .ccc h2 br {
        display: none; } }
  .ccc p {
    font-size: 2rem;
    font-family: Muggsy;
    color: #4742DE;
    margin-top: 1.8rem; }
    @media (max-width: 540px) {
      .ccc p {
        font-size: 1.8rem;
        text-align: center; } }
  .ccc .underText {
    margin: 1.7rem auto 0 auto;
    display: flex;
    align-items: center;
    transform: rotate(-0.3deg); }
    @media (max-width: 540px) {
      .ccc .underText {
        margin: 1.7rem auto 0 auto; } }
    .ccc .underText__text {
      font-size: 1.8rem;
      font-style: italic;
      font-family: "AvenirNext";
      color: #030212;
      width: 22rem;
      line-height: 1.2; }
      @media (max-width: 540px) {
        .ccc .underText__text {
          font-size: 1.6rem;
          text-align: center; } }
    .ccc .underText img {
      width: 3.1rem;
      margin-left: 1rem;
      transform: rotate(-5deg) translate(0px, -9px); }
      @media (max-width: 540px) {
        .ccc .underText img {
          transform: rotate(-7deg) translate(-5px, -10px); } }
  .ccc-logo {
    position: relative;
    margin: 6rem auto 0 auto; }
    @media (max-width: 540px) {
      .ccc-logo {
        margin: 3rem auto 0 auto; } }
    .ccc-logo > * {
      width: 5.4rem; }
      @media (max-width: 540px) {
        .ccc-logo > * {
          width: 5rem; } }
  .ccc-mail {
    width: 46rem;
    margin: 0 auto;
    background-color: #F1F5F8;
    height: 5.8rem;
    margin-top: 3rem;
    display: flex;
    justify-content: space-between;
    padding: 0.8rem 0.8rem 0.8rem 1.7rem;
    border-radius: 4px; }
    @media (max-width: 540px) {
      .ccc-mail {
        width: 100%;
        padding: 0.8rem;
        margin-top: 2.2rem; } }
    .ccc-mail-info {
      font-size: 1.8rem;
      margin-top: 1.6rem;
      font-style: italic;
      font-weight: 500;
      display: none; }
      @media (max-width: 540px) {
        .ccc-mail-info {
          text-align: center;
          font-size: 1.6rem; } }
    .ccc-mail-left {
      display: flex;
      justify-content: flex-start; }
      @media (max-width: 540px) {
        .ccc-mail-left {
          width: 65%; } }
      .ccc-mail-left-icon {
        display: flex;
        align-items: center; }
        @media (max-width: 540px) {
          .ccc-mail-left-icon {
            display: none; } }
        .ccc-mail-left-icon > * {
          width: 2.2rem; }
      .ccc-mail-left input {
        background-color: #F1F5F8;
        margin-left: 1.2rem;
        font-size: 1.7rem;
        font-weight: 600;
        width: 25rem;
        color: #8795A1; }
        @media (max-width: 540px) {
          .ccc-mail-left input {
            width: 100%;
            margin-left: 0;
            font-size: 1.6rem; } }
    .ccc-mail button {
      border-radius: 4px;
      background-color: #4742DE;
      border: none;
      color: #fff;
      width: 11.6rem;
      font-size: 1.4rem;
      font-weight: 600;
      font-family: "AvenirNext";
      cursor: pointer; }
      @media (max-width: 540px) {
        .ccc-mail button {
          padding: 0 1rem;
          width: auto; } }

.ccGreen {
  background-color: #62cba1; }

.ccPink {
  background-color: #f2badc; }

.ccOrange {
  background-color: #f99976; }

.ccPurple {
  background-color: #b9abfc; }

.ccBlue {
  background-color: rgba(19, 216, 196, 0.6); }

.ccYellow {
  background-color: #fcdf69; }

.circle {
  border-radius: 100%;
  position: absolute;
  z-index: 0;
  animation-name: cad;
  animation-duration: 1.1s;
  animation-timing-function: ease;
  animation-delay: 0.2s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
  animation-play-state: running;
  opacity: 0;
  transform: scale(0);
  z-index: -1; }

@keyframes cad {
  0% {
    opacity: 0;
    transform: scale(0); }
  100% {
    opacity: 1;
    transform: scale(1); } }

.ccc__img {
  width: 5rem;
  margin: 10rem auto;
  display: flex; }
  @media (max-width: 540px) {
    .ccc__img {
      position: static;
      margin: 4rem auto 0 auto;
      transform: rotate(0deg);
      width: 4.2rem; } }

.cmt6 {
  text-align: center;
  margin-top: 1rem; }

.tom {
  width: 5rem;
  transform: rotate(-2deg); }
  @media (max-width: 540px) {
    .tom {
      width: 4.4rem; } }

.dave {
  width: 6rem; }
  @media (max-width: 540px) {
    .dave {
      width: 5.2rem; } }

.medal {
  width: 4.6rem; }
  @media (max-width: 540px) {
    .medal {
      width: 4rem; } }

.spm {
  display: block;
  background-color: #061019;
  padding: 0rem 0 3rem 0;
  z-index: 5;
  position: relative; }
  .spm .quotes {
    width: 8rem;
    transform: translateY(-52%);
    display: flex;
    margin: 0 auto; }
  .spm__outer {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 2.5rem; }
    .spm__outer:first-of-type {
      margin-top: 0rem; }
    .spm__outer-rm {
      margin-right: 1.8rem; }
      @media (max-width: 540px) {
        .spm__outer-rm {
          font-size: 1.6rem; } }
    .spm__outer-rotX {
      transform: rotate(0.7deg); }
    .spm__outer-rotY {
      transform: rotate(-0.7deg); }
    .spm__outer-line {
      letter-spacing: -1px;
      color: #fff;
      font-weight: 700;
      font-size: 2rem; }
      @media (max-width: 540px) {
        .spm__outer-line {
          font-size: 1.8rem; } }
    .spm__outer-pos {
      font-size: 1.6rem;
      color: rgba(255, 255, 255, 0.6);
      font-weight: 600;
      margin-top: 0.8rem;
      text-align: center; }
      @media (max-width: 540px) {
        .spm__outer-pos {
          font-size: 1.4rem;
          margin-top: 0.5rem; } }
      .spm__outer-pos a:hover {
        text-decoration: underline; }

.rightBucket {
  border: 2px solid blue; }

@media (max-width: 540px) {
  .cccLeftBr {
    display: none; } }

.tweets {
  max-width: 128rem;
  margin: 10rem auto 0 auto; }
  @media (max-width: 540px) {
    .tweets {
      margin: 6rem auto 0 auto; } }
  .tweets__text {
    font-size: 2rem;
    margin: 0 auto;
    text-align: center;
    font-family: Muggsy;
    line-height: 1.3;
    width: 32.5rem; }
    @media (max-width: 540px) {
      .tweets__text {
        font-size: 1.8rem; } }
  .tweets__container {
    display: none;
    align-items: center;
    justify-content: center;
    height: 100rem;
    grid-gap: 1.8rem;
    margin: 10rem 2rem 6rem 2rem;
    z-index: 4;
    grid-template-columns: 1fr 1fr 1fr !important; }
    @media (max-width: 1300px) {
      .tweets__container {
        grid-template-columns: repeat(auto-fill, 36rem) !important; } }
    @media (max-width: 1150px) {
      .tweets__container {
        grid-template-columns: repeat(auto-fill, 32rem) !important; } }
    @media (max-width: 1000px) {
      .tweets__container {
        grid-template-columns: repeat(auto-fill, 36rem) !important; } }
    @media (max-width: 540px) {
      .tweets__container {
        grid-template-columns: repeat(auto-fill, 100%) !important;
        margin: 6rem 2rem 6rem 2rem; } }
    .tweets__container .twitter-tweet {
      margin: 0rem !important;
      max-width: 55rem;
      display: none; }

.mail__as {
  margin: 4rem auto 0.2rem auto;
  width: 50rem; }
  @media (max-width: 540px) {
    .mail__as {
      width: 100%;
      margin: 3rem auto 0.2rem auto; } }

.mailEnd {
  margin-top: 3.8rem !important; }
  @media (max-width: 540px) {
    .mailEnd {
      margin-top: 2.8rem !important; } }

.taf {
  margin: 10rem auto 0rem auto;
  transform: rotate(-1deg);
  display: flex;
  width: 50rem; }
  @media (max-width: 540px) {
    .taf {
      margin: 0rem 2rem 0rem 2rem;
      width: calc(100% - 4rem); } }
  .taf__text {
    font-size: 1.6rem;
    margin: 2rem auto 10rem auto;
    text-align: center;
    transform: rotate(-1deg); }
    @media (max-width: 540px) {
      .taf__text {
        margin: 2rem auto 6rem auto; } }
    .taf__text a {
      border-bottom: 1px solid #030212;
      padding-bottom: 0.2rem;
      transform: rotate(-1deg); }

.ccLetter {
  margin: 10rem auto 0rem auto;
  width: 68rem;
  padding: 4rem;
  box-shadow: 0.2rem 0.2rem 4rem rgba(0, 0, 0, 0.1);
  z-index: 4;
  border-radius: .4rem;
  position: relative;
  background-color: white; }
  @media (max-width: 540px) {
    .ccLetter {
      width: calc(100%);
      margin: 5rem 0rem 0rem 0rem;
      padding: 2rem; } }
  .ccLetter p {
    font-size: 1.9rem;
    line-height: 1.6;
    margin: 2.1rem 0; }
    @media (max-width: 540px) {
      .ccLetter p {
        font-size: 1.7rem;
        line-height: 1.6;
        margin: 1.7rem 0; } }
    .ccLetter p a {
      border-bottom: 1px solid #030212; }
  .ccLetter .list {
    padding: 0.1rem 0.76rem 0.1rem 2rem;
    margin: 0;
    display: block; }
    @media screen and (max-width: 550px) {
      .ccLetter .list {
        padding: 0.1rem 2rem 0.1rem 3.4rem; } }
    .ccLetter .list__top {
      padding-top: 0.76rem; }
    .ccLetter .list__bottom {
      padding-bottom: 0.76rem; }
  .ccLetter .first {
    margin-top: 1rem; }
  .ccLetter .last {
    margin-bottom: 1rem; }
  .ccLetter .freshFirst {
    margin: 0rem 0rem 2rem 0rem; }
  .ccLetter .ccHigh {
    padding: 0 .2rem; }
  .ccLetter .bold {
    font-weight: 600; }
  .ccLetter .italic {
    font-style: italic; }
  .ccLetter .inwardSpeech {
    font-style: italic;
    padding: .8rem 2.2rem; }
    @media (max-width: 540px) {
      .ccLetter .inwardSpeech {
        padding: .4rem 1.6rem; } }
  .ccLetter .header {
    font-weight: 700;
    padding: 1.1rem 1.4rem .9rem 1.4rem;
    display: inline-flex;
    justify-content: center;
    font-size: 1.9rem;
    transform: rotate(-1deg);
    line-height: 1;
    margin: 1.3rem 0 1.2rem 0; }
    @media (max-width: 540px) {
      .ccLetter .header {
        font-size: 1.7rem;
        margin: 1rem 0 .9rem 0; } }
  .ccLetter .asterix {
    text-align: center;
    margin: 3rem auto 2rem auto; }
  .ccLetter .thc1 {
    background-color: rgba(98, 203, 161, 0.34); }
  .ccLetter .thc2 {
    background-color: rgba(242, 186, 220, 0.54); }
  .ccLetter .thc3 {
    background-color: rgba(249, 153, 118, 0.4); }
  .ccLetter .thc4 {
    background-color: rgba(185, 171, 252, 0.5); }
  .ccLetter .thc5 {
    background-color: rgba(19, 216, 196, 0.22); }

.ccLetterImg {
  width: 100rem;
  margin: 10rem auto 0 auto;
  display: flex; }
  @media (max-width: 540px) {
    .ccLetterImg {
      display: none; } }

.ccLetterImgMob {
  display: none; }
  @media (max-width: 540px) {
    .ccLetterImgMob {
      display: block;
      width: calc(100% - 2rem);
      margin: 5rem 1rem 0rem 1rem; } }

.ccLetterArrow {
  width: 7.6rem;
  margin: 10rem auto 0 auto;
  display: flex; }
  @media (max-width: 540px) {
    .ccLetterArrow {
      width: 6rem;
      margin: 5rem auto 0 auto; } }

.sig {
  display: flex;
  margin-bottom: 1.6rem; }
  @media (max-width: 540px) {
    .sig {
      margin-bottom: 2.6rem; } }
  .sig__left {
    position: relative; }
    .sig__left-me {
      border: 100px;
      width: 8.8rem; }
      @media (max-width: 540px) {
        .sig__left-me {
          width: 8rem; } }
    .sig__left-mes {
      width: 10rem;
      position: absolute;
      bottom: -3rem;
      left: -.3rem; }
      @media (max-width: 540px) {
        .sig__left-mes {
          width: 8rem;
          left: .4rem;
          bottom: -2.6rem; } }
  .sig__right {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-left: 2.4rem; }
    @media (max-width: 540px) {
      .sig__right {
        margin-left: 2rem; } }
    .sig__right-name {
      font-size: 1.9rem;
      font-weight: 600; }
      @media (max-width: 540px) {
        .sig__right-name {
          font-size: 1.7rem; } }
    .sig__right-founder {
      font-size: 1.9rem;
      font-weight: 400;
      margin-top: .8rem; }
      @media (max-width: 540px) {
        .sig__right-founder {
          font-size: 1.7rem; } }

.mobileCourse {
  line-height: 1; }
  @media (max-width: 540px) {
    .mobileCourse {
      display: none; } }

.ccBody {
  position: relative;
  overflow: hidden; }

.circle1 {
  top: -28rem;
  left: -28rem;
  width: 52rem;
  height: 52rem; }
  @media (max-width: 1500px) {
    .circle1 {
      width: 48.5rem;
      height: 48.5rem; } }
  @media (max-width: 540px) {
    .circle1 {
      top: -28rem;
      left: -32rem;
      width: 42rem;
      height: 42rem; } }

.circle2 {
  top: -18rem;
  right: -24.6rem;
  width: 52rem;
  height: 52rem; }
  @media (max-width: 1500px) {
    .circle2 {
      width: 46rem;
      height: 49rem; } }
  @media (max-width: 540px) {
    .circle2 {
      top: 7rem;
      right: -27rem;
      width: 41rem;
      height: 41rem; } }

.circle3 {
  top: 62rem;
  left: -37rem;
  width: 52rem;
  height: 52rem; }
  @media (max-width: 1500px) {
    .circle3 {
      width: 48rem;
      height: 48rem; } }
  @media (max-width: 540px) {
    .circle3 {
      left: -29rem;
      width: 39rem;
      height: 26rem;
      top: auto;
      bottom: 23.4rem; } }
  @media (max-width: 400px) {
    .circle3 {
      bottom: 21.4rem; } }

.circle4 {
  top: 0rem;
  right: -33rem;
  width: 52rem;
  height: 52rem; }
  @media (max-width: 1500px) {
    .circle4 {
      width: 48rem;
      height: 48rem; } }
  @media (max-width: 540px) {
    .circle4 {
      top: 0rem;
      right: -11rem;
      width: 25rem;
      height: 25rem; } }

.circle5 {
  top: 90rem;
  left: 20%;
  width: 46rem;
  height: 57rem; }
  @media (max-width: 1500px) {
    .circle5 {
      left: 16%; } }
  @media (max-width: 1220px) {
    .circle5 {
      left: 10%; } }
  @media (max-width: 540px) {
    .circle5 {
      display: none; } }

.circle6 {
  bottom: 0rem;
  right: -34rem;
  width: 52rem;
  height: 52rem; }
  @media (max-width: 1500px) {
    .circle6 {
      width: 48rem;
      height: 48rem; } }
  @media (max-width: 540px) {
    .circle6 {
      background-color: #b9abfc; } }

.circle7 {
  top: 45rem;
  left: -32rem;
  width: 52rem;
  height: 52rem; }
  @media (max-width: 1500px) {
    .circle7 {
      width: 46rem;
      height: 46rem; } }
  @media (max-width: 540px) {
    .circle7 {
      top: 0rem;
      left: -20rem;
      background-color: #fcdf69; } }

.circle8 {
  top: 120rem;
  right: -37rem;
  width: 52rem;
  height: 52rem; }
  @media (max-width: 540px) {
    .circle8 {
      top: 73rem;
      width: 55rem; } }
  @media (max-width: 400px) {
    .circle8 {
      top: 81rem; } }
  @media (max-width: 340px) {
    .circle8 {
      top: 73rem; } }

.circle9 {
  top: 220rem;
  left: -37rem;
  width: 52rem;
  height: 52rem; }
  @media (max-width: 1500px) {
    .circle9 {
      width: 52rem;
      height: 52rem; } }
  @media (max-width: 540px) {
    .circle9 {
      top: 115rem; } }
  @media (max-width: 400px) {
    .circle9 {
      top: 125rem; } }

.circle10 {
  top: 40rem;
  right: -35rem;
  width: 52rem;
  height: 52rem; }
  @media (max-width: 1500px) {
    .circle10 {
      width: 50rem;
      height: 50rem; } }

.circle11 {
  top: 120rem;
  left: -35rem;
  width: 52rem;
  height: 52rem; }
  @media (max-width: 1500px) {
    .circle11 {
      width: 50rem;
      height: 50rem; } }

.circle12 {
  top: 200rem;
  right: -35rem;
  width: 52rem;
  height: 52rem; }
  @media (max-width: 1500px) {
    .circle12 {
      width: 50rem;
      height: 50rem; } }

.bestof {
  display: flex;
  height: 100vh;
  flex-direction: column;
  justify-content: center;
  align-items: center; }
  @media screen and (max-width: 550px) {
    .bestof {
      width: calc(100% - 4rem);
      margin: 0 2rem 0 2rem; } }
  .bestof-logo {
    margin-top: 0rem; }
  .bestof p {
    font-size: 2rem;
    line-height: 2;
    text-align: center;
    margin-top: 2rem; }
    @media screen and (max-width: 550px) {
      .bestof p {
        font-size: 1.6rem;
        line-height: 1.2; } }
    .bestof p a {
      border-bottom: 1px solid;
      padding: 0.1rem; }
    .bestof p span {
      font-style: italic; }