@font-face {
  font-family: Avenir;
  src: url("fonts/avenir-next-regular.woff"); }

@font-face {
  font-family: Heaters;
  src: url("fonts/Heaters.otf"); }

@font-face {
  font-family: Orchide;
  src: url("fonts/Orchide.ttf"); }

@font-face {
  font-family: Vogue;
  src: url("fonts/Vogue.ttf"); }

@keyframes wander {
  0% {
    transform: translate(-8%, -8%); }
  25% {
    transform: translate(-16%, 0%); }
  50% {
    transform: translate(-8%, 8%); }
  75% {
    transform: translate(0%, 8%); }
  100% {
    transform: translate(0%, 0%); } }

@keyframes wander2 {
  0% {
    transform: translate(8%, 8%); }
  25% {
    transform: translate(16%, 0%); }
  50% {
    transform: translate(8%, -8%); }
  75% {
    transform: translate(0%, -8%); }
  100% {
    transform: translate(0%, 0%); } }

body {
  overflow-x: hidden !important; }
  body #home {
    filter: invert(100%); }
  body .section-change {
    background-color: white;
    z-index: 2;
    width: 100%;
    height: 100%;
    position: fixed;
    bottom: -100%;
    left: 0; }
  body #sect-second {
    display: none; }
  body .sectionne {
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: whitesmoke;
    /*#hanger-icon{
            position: fixed;
            width: 4%;
            transform: translate(-50%,0);
            left: 50%;
            top: 20%;
            z-index: 1;
        }*/ }
    body .sectionne #videyo {
      height: 100%;
      filter: blur(4px) brightness(50%);
      margin-left: 50%;
      transform: translate(-50%, 0); }
      @media (min-aspect-ratio: 8 / 5) {
        body .sectionne #videyo div {
          background: #9af;
          /* blue */ } }
    body .sectionne h1 {
      color: white;
      font-family: Heaters;
      margin-top: -35%;
      transform: scale(1);
      width: 100%;
      font-size: 3.6vw;
      font-weight: normal;
      text-align: center;
      float: left; }
      @media screen and (max-width: 767px) {
        body .sectionne h1 {
          margin-top: -150%;
          font-size: 8vw; } }
      body .sectionne h1 img {
        width: 3%;
        margin-bottom: 1%; }
        @media screen and (max-width: 767px) {
          body .sectionne h1 img {
            width: 10%; } }
    body .sectionne #iniciar {
      background-color: white;
      color: black;
      border-radius: 8px;
      padding: 4px 12px 4px 12px;
      z-index: 1;
      position: fixed;
      bottom: 10%;
      left: 50%;
      transform: translate(-50%, 0);
      text-decoration: none;
      font-family: Avenir;
      font-size: 26px; }
      @media screen and (max-width: 767px) {
        body .sectionne #iniciar {
          font-weight: bold; } }
    body .sectionne .wandering-circle {
      width: 17vw;
      height: 17vw;
      background-color: #943241;
      border-radius: 50%;
      position: absolute;
      transform: translate(-10%, 2%);
      animation: wander 10s linear infinite alternate;
      top: -15%;
      right: 10%; }
      @media screen and (max-width: 767px) {
        body .sectionne .wandering-circle {
          width: 80vw;
          height: 80vw; } }
    body .sectionne .wandering-circle2 {
      width: 15vw;
      height: 15vw;
      background-color: #943241;
      border-radius: 50%;
      position: absolute;
      transform: translate(-10%, 2%);
      animation: wander2 10s linear infinite alternate;
      top: 20%;
      left: 40%; }
      @media screen and (max-width: 767px) {
        body .sectionne .wandering-circle2 {
          width: 60vw;
          height: 60vw;
          left: 30%; } }
    body .sectionne .wandering-circle3 {
      width: 16vw;
      height: 16vw;
      background-color: #943241;
      border-radius: 50%;
      position: absolute;
      transform: translate(-10%, 2%);
      animation: wander2 10s linear infinite alternate-reverse;
      bottom: 4%;
      right: 4%; }
      @media screen and (max-width: 767px) {
        body .sectionne .wandering-circle3 {
          width: 50vw;
          height: 50vw;
          right: 10%; } }
    body .sectionne .wandering-circle4 {
      width: 15vw;
      height: 15vw;
      background-color: #943241;
      border-radius: 50%;
      position: absolute;
      transform: translate(-10%, 2%);
      animation: wander 10s linear infinite alternate-reverse;
      left: -5%;
      bottom: 4%; }
      @media screen and (max-width: 767px) {
        body .sectionne .wandering-circle4 {
          width: 70vw;
          height: 70vw; } }
    body .sectionne .contentodawa {
      position: absolute;
      width: 36%;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      background-color: rgba(32, 32, 32, 0.6);
      padding: 1%;
      float: left;
      display: none; }
      @media screen and (max-width: 767px) {
        body .sectionne .contentodawa {
          width: 95%; } }
      body .sectionne .contentodawa h2 {
        font-family: Heaters;
        text-align: center;
        color: white;
        float: left;
        width: 100%;
        font-size: 32px; }
        @media screen and (max-width: 767px) {
          body .sectionne .contentodawa h2 {
            font-size: 9vw; } }
      body .sectionne .contentodawa p {
        width: 100%;
        float: left;
        font-family: Avenir;
        color: white;
        font-size: 24px; }
        @media screen and (max-width: 767px) {
          body .sectionne .contentodawa p {
            display: none; } }
      body .sectionne .contentodawa ul {
        float: left;
        list-style-type: disc;
        font-family: Avenir;
        color: white;
        font-size: 24px; }
        body .sectionne .contentodawa ul a {
          color: #943241; }
        @media screen and (max-width: 767px) {
          body .sectionne .contentodawa ul {
            font-size: 6vw; } }
      body .sectionne .contentodawa .llevadmedeshoppingtioquenovequequierovestiralamodaconomarico {
        width: fit-content;
        margin-left: 50%;
        transform: translate(-50%, 0);
        font-family: Avenir;
        color: black;
        font-weight: bold;
        text-decoration: none;
        background-color: white;
        border-radius: 5px;
        float: left;
        padding: 1%;
        text-align: center; }
        @media screen and (max-width: 767px) {
          body .sectionne .contentodawa .llevadmedeshoppingtioquenovequequierovestiralamodaconomarico {
            font-size: 6vw; } }
    body .sectionne .contentodaze {
      width: 100%;
      float: left;
      height: 100%;
      position: absolute; }
      body .sectionne .contentodaze h1 {
        font-family: Vogue;
        color: black;
        float: left;
        font-size: 3vw;
        margin-top: 17%;
        width: 40%;
        margin-left: 40%;
        text-align: left;
        margin-right: 20%; }
        @media screen and (max-width: 767px) {
          body .sectionne .contentodaze h1 {
            font-size: 12vw;
            width: 95%;
            margin-left: 2.5%;
            margin-right: 2.5%;
            margin-top: 128px;
            text-align: justify; } }
        body .sectionne .contentodaze h1 a {
          font-family: avenir;
          color: white;
          text-decoration: none;
          background-color: black;
          font-size: 2vw;
          padding: 0 2% 0 2%;
          border: 2px solid black;
          border-radius: 6px;
          transition: 0.2s ease-in-out; }
          @media screen and (max-width: 767px) {
            body .sectionne .contentodaze h1 a {
              width: 50%;
              margin-left: 25%;
              float: left;
              padding: 0;
              font-size: 5vw;
              font-weight: bold;
              text-align: center;
              margin-bottom: 64px; } }
          body .sectionne .contentodaze h1 a:hover {
            background-color: white;
            color: black; }
          body .sectionne .contentodaze h1 a:last-child {
            background-color: transparent;
            border: none;
            border-bottom: 2px solid black;
            color: black;
            border-radius: 0;
            margin-left: 5%; }
            @media screen and (max-width: 767px) {
              body .sectionne .contentodaze h1 a:last-child {
                width: 50%;
                margin-left: 25%; } }
            body .sectionne .contentodaze h1 a:last-child:hover {
              margin-left: 6%; }
      body .sectionne .contentodaze #potnahs {
        width: 20%;
        margin-top: -16%; }
        @media screen and (max-width: 767px) {
          body .sectionne .contentodaze #potnahs {
            width: 80%;
            margin-left: 10%; } }
  body .footer {
    transform: scale(1);
    float: left;
    margin-top: -5%;
    width: 100%;
    border-top: 1px solid rgba(96, 96, 96, 0.2);
    display: none; }
    body .footer p {
      float: left;
      padding: 1%;
      width: 25%;
      font-family: Avenir;
      text-align: left;
      font-weight: bold;
      font-size: 16px; }
      @media screen and (max-width: 767px) {
        body .footer p {
          width: 100%;
          padding: 0; } }
      body .footer p a {
        color: #943241;
        text-decoration: none;
        text-shadow: -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white; }
      @media screen and (max-width: 767px) {
        body .footer p:nth-child(2) {
          display: none; } }
      @media screen and (max-width: 767px) {
        body .footer p:nth-child(3) {
          display: none; } }
      body .footer p:last-child {
        width: 17%; }
        @media screen and (max-width: 767px) {
          body .footer p:last-child {
            width: 100%;
            text-align: center; } }