:root{
  --main-color: var(--primary_color);
  --contrast-color: var(--awb-color4);
  --fugo-gray: #f2f2f2;
}

@media screen and (min-width: 641px){
  main#main{
    padding-top: 120px;
    padding-bottom: 120px;
  }
}


/* HEADER */
.fusion-tb-header .menu-wrapper{
  background-color: rgb(239 239 239);
  box-shadow: 0 0 10px #0000005e;
  z-index: 100;
  width: calc(100% - 200px);
  margin: 0 100px;
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  justify-content: space-between;
  padding: 0 20px 0 0px;
  align-items: center;
  border-radius: 0 0 10px 10px;

}

.fusion-tb-header .menu-wrapper > a:hover{
  background: transparent;
}

body.scrolled .fusion-tb-header .menu-wrapper{
  transition: all .5s;
  border-radius: 0 0 10px 10px;

}

/*LOGO */
.fusion-tb-header .menu-wrapper .logo{
  display: flex;
  position: relative;
  overflow: hidden;
}

.fusion-tb-header .menu-wrapper .logo:before, .fusion-tb-header .menu-wrapper .logo:after {
  content: "";
  mix-blend-mode: lighten;
  display: block;
  position: absolute;
  background: var(--contrast-color);
  width: 51%;
  z-index: 1;
  height: 200%;
  opacity: 0;
  transition: all .5s;
}


.fusion-tb-header .menu-wrapper .logo:before{
  top: 0;
  left: 0;
  border-radius: 0 0 200px 200px;
  transform: rotate(-45deg) translate(0, -100%);
}

.fusion-tb-header .menu-wrapper .logo:after{
    bottom: 0;
    right: 0;
    border-radius: 200px 200px 0 0;
    transform: translate(0, 100%);
    transform: rotate(-45deg) translate(0, 100%);
    transition-delay: 0.1s;
  }

  .fusion-tb-header .menu-wrapper .logo:hover:after, .fusion-tb-header .menu-wrapper .logo:hover:before{
    transform:  translate(0, 0);
    opacity: 1;
    border-radius: 0;
  }

  .fusion-tb-header .menu-wrapper .logo .logo-img{
  height: var(--default-height);
  transition: all .5s;

}

  .fusion-tb-header .menu-wrapper .logo:hover .logo-img{
  filter: grayscale(1);
}

body.scrolled   .fusion-tb-header .menu-wrapper .logo .logo-img{
  max-height: 40px;
}

.fusion-tb-header .menu-wrapper .text-logo{
  font-size: 40px;
}

@media only screen and (max-width: 700px){
  .fusion-tb-header .menu-wrapper{
    flex-wrap: wrap;
    width: 100px;
    left: auto;
    justify-content: center;
    right: 0;
    margin: 0 5vw;
    padding: 0;
  }

  .fusion-tb-header .menu-wrapper > *{
    flex-basis: 100%;
  }
  .fusion-tb-header .menu-wrapper .logo {
    justify-content: center;
    width: 100%;
  }
  .fusion-tb-header .menu-wrapper .logo .logo-img{
    width: 100%;
    height: auto;
  }

  body.admin-bar .menu-wrapper {
    margin-top: 46px;
  }

  body.scrolled.admin-bar .menu-wrapper {
    margin-top: 0;
  }
  .fusion-tb-header .menu-wrapper #navwrap {
      display: flex;
      justify-content: center;
      padding: 10px 0;
  }

  body.scrolled .fusion-tb-header .menu-wrapper {
    width: 60px;
  }
}

/*
* POPUP
*/
.fads-popup{
  position: fixed;
  background: white;
  min-height: 100px;
  max-height: 90vh;
  min-width: 100px;
  max-width: 90vw;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 3000000 !important;
  display: none;
  box-shadow: 0 0 0 100vh #6512d88f;
  padding: 50px;
}

.fads-popup:before{
  content: "";
  position: fixed;
  top: 50%;
  left: 50%;
  width: 100vw;
  height: 100vh;
  transform: translate(-50%, -50%);
  z-index: 10000;
}

.fads-popup-content{
  z-index: 1;
}

.fads-popup-close{
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
  z-index: 10001;
}

.fads-popup p{
  margin: 0;
}

/*
*
* LOADERS
*
*/

/* CUBE */
.sk-cube-grid {
  width: 80px;
  height: 80px;
  margin: auto;
  padding: 20px;
}

.sk-cube-grid .sk-cube {
  width: 33%;
  height: 33%;
  background-color: #333;
  float: left;
  -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
          animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
}
.sk-cube-grid .sk-cube1 {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s; }
.sk-cube-grid .sk-cube2 {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s; }
.sk-cube-grid .sk-cube3 {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s; }
.sk-cube-grid .sk-cube4 {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s; }
.sk-cube-grid .sk-cube5 {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s; }
.sk-cube-grid .sk-cube6 {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s; }
.sk-cube-grid .sk-cube7 {
  -webkit-animation-delay: 0s;
          animation-delay: 0s; }
.sk-cube-grid .sk-cube8 {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s; }
.sk-cube-grid .sk-cube9 {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s; }

@-webkit-keyframes sk-cubeGridScaleDelay {
  0%, 70%, 100% {
    -webkit-transform: scale3D(1, 1, 1);
            transform: scale3D(1, 1, 1);
  } 35% {
    -webkit-transform: scale3D(0, 0, 1);
            transform: scale3D(0, 0, 1);
  }
}

@keyframes sk-cubeGridScaleDelay {
  0%, 70%, 100% {
    -webkit-transform: scale3D(1, 1, 1);
            transform: scale3D(1, 1, 1);
  } 35% {
    -webkit-transform: scale3D(0, 0, 1);
            transform: scale3D(0, 0, 1);
  }
}