/* vaso */
.mvx-home-phone + div img {width:200px;height:200px;}

[x-cloak] {
    display: none !important;
}

body {
    font-family: 'Quicksand', sans-serif;
    color: #1C3646;
    background-color: #F6F6F3;
}

/*************************** HOME PAGE ***************************/

.mvx-white-wawy-bg {
    background: url(../images/bg/bg-top.svg) top center no-repeat, url(../images/bg/bg-bottom.svg) bottom center no-repeat;
    background-color: white;
}

@keyframes main-home-animation {
    from {
        background: url(../images/bg/blob-dark-blue.svg) left calc(50% - 900px) top -30px no-repeat, url(../images/bg/blob-light-blue.svg) right calc(50% - 620px) top -50px no-repeat;
    }
    to {
        background: url(../images/bg/blob-dark-blue.svg) left calc(50% - 900px) top -50px no-repeat, url(../images/bg/blob-light-blue.svg) right calc(50% - 620px) top -30px no-repeat;
    }
}


@media only screen and (min-width: 1200px) {
    .mvx-home-bg {
      animation: main-home-animation 2s infinite;
      animation-direction: alternate;
    }
}

@media only screen and (min-width: 1024px) {
    .mvx-home-guide {
        background: url(../images/home-guide-line.svg) left top no-repeat;
        background-size: 863px;
        background-position: center 40px;
        position:relative;
        height:1800px;
    }
    .mvx-home-guide div:nth-child(5){
       height:0px;
    }


     .mvx-home-guide div:nth-child(1) img:nth-child(1){
        position:relative;
        top:0px;
        left:0px;
      }



     .mvx-home-guide div:nth-child(1) img:nth-child(3){
        position:relative;
        top:-110px;
        left:36%;

      }



      .mvx-home-guide div:nth-child(2) img:nth-child(1){
        position:relative;
        top:-100px;

      }
      .mvx-home-guide div:nth-child(2) :nth-child(2){
        position:relative;
        top:-100px;

      }


     .mvx-home-guide div:nth-child(2) img:nth-child(3){
        position:relative;
        top:-170px;
        right:36%;

      }



      .mvx-home-guide div:nth-child(3) img:nth-child(1){
        position:relative;
        top:-210px;
      }
      .mvx-home-guide div:nth-child(3) :nth-child(2){
        position:relative;
        top:-210px;
      }

     .mvx-home-guide div:nth-child(3) img:nth-child(3){
        position:relative;
        top:-400px;
        left:36%;

      }



      .mvx-home-guide div:nth-child(4) img:nth-child(1){
        position:relative;
        top:-410px;
      }
      .mvx-home-guide div:nth-child(4) :nth-child(2){
        position:relative;
        top:-410px;
      }


     .mvx-home-guide div:nth-child(4) img:nth-child(3){
        position:relative;
        top:-610px;
        right:36%;

      }



      .mvx-home-guide div:nth-child(5) img:nth-child(1){
        position:relative;
        top:-418px;
      }
      .mvx-home-guide div:nth-child(5) :nth-child(2){
        position:relative;
        width:40%;
        top:-418px;
      }

     .mvx-home-guide div:nth-child(5) img:nth-child(3){
        position:relative;
        top:-598px;
        left:36%;

      }

}




/*************************** ABOUT PAGE ***************************/

.mvx-bg-about {
    background: url(../images/bg/blob-orange.svg) left calc(50% - 700px) top 200px no-repeat, url(../images/bg/blob-light-blue.svg) right calc(50% - 750px) top -50px no-repeat
}

.mvx-facebook-banner {
    bottom: -53px;
    left: 22px;
}

.mvx-facebook-banner {
    bottom: -53px;
    left: 22px;
}

/*************************** AJAX SPINNER ***************************/

.loader {
    border: 16px solid #f3f3f3;
    border-radius: 50%;
    border-top: 16px solid #9ABDD4;
    border-bottom: 16px solid #427BA0;
    border-right: 16px solid #EF7751;
    border-left:16px solid #ffffff;
    width: 120px;
    height: 120px;
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
  }

  /* Safari */
  @-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
  }

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

/*************************** BUTTONS ***************************/

.mvx-button-login {
    font-weight: 700;
    background-image: url(../images/buttons/button-login-stretch.svg);
    background-repeat: no-repeat;
    background-size: 100% 98%;
    background-position: center;
    margin: 0 0.75rem;
}

.mvx-button-primary {
    font-weight: 700;
    background-image: url(../images/buttons/button-primary-standard.svg);
    background-repeat: no-repeat;
    width: 200px;
    height:44px;
    background-size: 100% 100%;
}

.mvx-button-primary-loading {
      font-weight: 700;
      background-image: url(../images/buttons/button-primary-standard.svg);
      background-repeat: no-repeat;
      width: 200px;
      height:44px;
      display: flex;
      justify-content: center;
      align-items: center;
      background-size: 100% 100%;
}

  .mvx-button-primary:hover {
     background-image: url(../images/buttons/button-primary-standard-hover.svg);
}

  .mvx-button-primary-small {
    font-weight: 700;
    background-image: url(../images/buttons/button-primary-small.svg);
    background-repeat: no-repeat;
    width: 117px;
    height:48px;
  }

.mvx-button-primary-small:hover {
     background-image: url(../images/buttons/button-primary-small-hover.svg);
}

.mvx-button-primary-responsive {
  font-weight: 700;
  background-image: url(../images/buttons/button-primary-small.svg);
  background-repeat: no-repeat;
  background-size: cover;
  background-size: 100% 100%;
  padding: 1rem;
}

.mvx-button-primary-responsive:hover {
   background-image: url(../images/buttons/button-primary-small-hover.svg);
}

 .mvx-button-secondary {
    font-weight: 700;
    background-image: url(../images/buttons/button-secondary-standard.svg);
    background-repeat: no-repeat;
    width: 200px;
    height:44px;
    background-size: 100% 100%;
}
.mvx-button-secondary:hover {
    background-image: url(../images/buttons/button-secondary-standard-hover.svg);
}

 .mvx-button-secondary-big {
    font-weight: 700;
    background-image: url(../images/buttons/button-secondary-big.svg);
    background-repeat: no-repeat;
    width: 264px;
    height:44px;
}
.mvx-button-secondary-big:hover {
    background-image: url(../images/buttons/button-secondary-big-hover.svg);
}

 .mvx-button-secondary-small {
    font-weight: 700;
    background-image: url(../images/buttons/button-secondary-small.svg);
    background-repeat: no-repeat;
    width: 117px;
    height:48px;
}
.mvx-button-secondary-small:hover {
    background-image: url(../images/buttons/button-secondary-small-hover.svg);
}

/*************************** BANNER DASHBOARD ***************************/

.mvx-free-impressions-alert {
    background: url(../images/marvax.svg);
    background-position: right bottom -7rem;
    background-repeat: no-repeat;
    background-size: 13rem;
    background-color: #BFD4E0;
    border-radius: 1.5rem;
}

.mvx-active-menu-link {
    background: url(../images/menu-link-active-underline.svg);
    background-position: bottom;
    background-repeat: no-repeat;
}

.mvx-active-submenu-link {
    background: url(../images/submenu-link-active-underline.svg);
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: auto;
}

.mvx-pulse-button {
    animation: jump-shaking 0.83s infinite;
}

@keyframes jump-shaking {
  0% { transform: translateX(0) }
  25% { transform: translateY(-5px) }
  35% { transform: translateY(-5px) rotate(17deg) }
  55% { transform: translateY(-5px) rotate(-17deg) }
  65% { transform: translateY(-5px) rotate(17deg) }
  75% { transform: translateY(-5px) rotate(-17deg) }
  100% { transform: translateY(0) rotate(0) }
}

/*loading icon in button*/
.mvx-rotate-animation {
  animation: rotation 2s infinite linear;
}

@keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
}

.mvx-article a {
  text-decoration:underline;
}

.mvx-article a:hover {
  text-decoration:none;
}