@charset "UTF-8";
/* CSS Document */
/**
   Coded by /u/j0be in scss.
   See scss source here -> https://codepen.io/j0be/pen/MKRVyN
*/

#customMenu {
     font-family: "Gilroy ExtraBold",
      system-ui,
       sans-serif;
        font-style: normal;
         font-weight: normal;
          -webkit-font-smoothing: antialiased;
     -webkit-font-kerning: normal;
     -webkit-text-size-adjust: 100%;
    }
      #customMenu { width: 100%; height: 100vh; }
      #customMenu { background: linear-gradient(45deg, #02001F, #1F1B4E);
    /* transform-style: preserve-3d;  */
    z-index: 9999;
    transform: perspective(60rem);
     position: fixed;
      display: flex;
      align-items: center;
      justify-content: center;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      width: 100%;
      height: 100%;
    }
    .spinEffect{
        transform: rotate(360deg);
        -webkit-transition: -webkit-transform 0.3 ease-in;
        -webkit-transform: rotate(360deg);
        -ms-transform: rotate(360deg);

     }
     .Menu{
margin-left:-60%;
     }
       .Menu-list {
            font-size: 4.25rem;
             line-height: 1.2;
             font-weight:bolder;
              text-transform: uppercase;
               text-align: left; display: flex;
               flex-direction: column;
               align-items: left;
               transform: rotateX(-1deg) rotateY(20deg); }
               .Menu-list-item { position: relative; color: transparent; cursor: pointer; }
               .Menu-list-item::before { content: ''; display: block; position: absolute; top: 49%; left: -10%; right: -10%; height: 4px; border-radius: 4px; margin-top: -2px; background: #FF2C75; transform: scale(0); transition: transform 0.8s cubic-bezier(0.16, 1.08, 0.38, 0.98); z-index: 1; }
                .Mask { display: block; position: absolute; overflow: hidden; color: #FF2C75; top: 0; height: 49%; transition: all 0.8s cubic-bezier(0.16, 1.08, 0.38, 0.98); } .Mask span { display: block; } .Mask + .Mask { top: 48.9%; height: 51.1%; }
                 .Mask + .Mask span { transform: translateY(-49%); }
                .Menu-list-item:hover .Mask, .Menu-list-item:active .Mask { color: #FFF; transform: skewX(12deg) translateX(5px); }
                .Menu-list-item:hover .Mask + .Mask, .Menu-list-item:active .Mask + .Mask { transform: skewX(12deg) translateX(-5px); }
                .Menu-list-item:hover::before, .Menu-list-item:active::before { transform: scale(1); }
.menu-white
{
    Cursor:pointer;color: #FF2C75;font-size:18px;margin-top:10px;text-transform:capitalize;
}
.menu-white:hover
{
color: white;
}
#meu_div
{
  position: absolute;
  float: right;
  top: 6%;
  right: 10%;
  font-size: 30px;
  font-weight: 200;color:white;cursor:pointer
}

.tran3s:hover{

  color:rgb(255, 51, 102) !important;
}