
.bounce-in-top {
   height: 100%;
      -webkit-animation: bounce-in-top 1.7s both;
            animation: bounce-in-top 1.7s both;
            padding-top: 20px;

            -webkit-box-shadow: 0px 0px 300px 200px rgba(0,0,0,0.68);
            -moz-box-shadow: 0px 0px 300px 200px rgba(0,0,0,0.68);
            box-shadow: 0px 0px 300px 200px rgba(0,0,0,0.68);
  top:70px;
  }
  
  
  
  
  .scale-out-center {
      -webkit-animation: slide-out-elliptic-top-bck 0.7s ease-in both;
              animation: slide-out-elliptic-top-bck 0.7s ease-in both;
  }
  
  
  
  
  @-webkit-keyframes slide-out-elliptic-top-bck {
   0% {
     -webkit-transform: translateY(0) rotateX(0) scale(1);
             transform: translateY(0) rotateX(0) scale(1);
     -webkit-transform-origin: 50% 1400px;
             transform-origin: 50% 1400px;
     opacity: 1;
   }
   100% {
     -webkit-transform: translateY(-600px) rotateX(-30deg) scale(0);
             transform: translateY(-600px) rotateX(-30deg) scale(0);
     -webkit-transform-origin: 50% 100%;
             transform-origin: 50% 100%;
     opacity: 1;
   }
  }
  @keyframes slide-out-elliptic-top-bck {
   0% {
     -webkit-transform: translateY(0) rotateX(0) scale(1);
             transform: translateY(0) rotateX(0) scale(1);
     -webkit-transform-origin: 50% 1400px;
             transform-origin: 50% 1400px;
     opacity: 1;
   }
   100% {
     -webkit-transform: translateY(-600px) rotateX(-30deg) scale(0);
             transform: translateY(-600px) rotateX(-30deg) scale(0);
     -webkit-transform-origin: 50% 100%;
             transform-origin: 50% 100%;
     opacity: 1;
   }
  }
  
  
  
  
  
  /**
   * ----------------------------------------
   * animation bounce-in-top
   * ----------------------------------------
   */
   @-webkit-keyframes bounce-in-top {
    0% {
      -webkit-transform: translateY(-90px);
              transform: translateY(-90px);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
      opacity: 0;
    }
    38% {
      -webkit-transform: translateY(0);
              transform: translateY(0);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
      opacity: 1;
    }
    55% {
      -webkit-transform: translateY(-65px);
              transform: translateY(-65px);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
    }
    72% {
      -webkit-transform: translateY(0);
              transform: translateY(0);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
    }
    81% {
      -webkit-transform: translateY(-28px);
              transform: translateY(-28px);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
    }
    90% {
      -webkit-transform: translateY(0);
              transform: translateY(0);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
    }
    95% {
      -webkit-transform: translateY(-8px);
              transform: translateY(-8px);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
    }
    100% {
      -webkit-transform: translateY(0);
              transform: translateY(0);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
    }
  }
  @keyframes bounce-in-top {
    0% {
      -webkit-transform: translateY(-500px);
              transform: translateY(-500px);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
      opacity: 0;
    }
    38% {
      -webkit-transform: translateY(0);
              transform: translateY(0);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
      opacity: 1;
    }
    55% {
      -webkit-transform: translateY(-25px);
              transform: translateY(-25px);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
    }
    72% {
      -webkit-transform: translateY(0);
              transform: translateY(0);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
    }
    81% {
      -webkit-transform: translateY(-10px);
              transform: translateY(-10px);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
    }
    90% {
      -webkit-transform: translateY(0);
              transform: translateY(0);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
    }
    95% {
      -webkit-transform: translateY(-8px);
              transform: translateY(-8px);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
    }
    100% {
      -webkit-transform: translateY(0);
              transform: translateY(0);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
    }
  }
  
  /** SPINNER CREATION **/

.lds-ring {
    display: inline-block;
    position: relative;
    width: 33px;
    height: 33px;
  }
  .lds-ring div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 30px;
    height: 30px;
    margin: 6px;
    border: 3px solid #3366cc;
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: #3366cc transparent transparent transparent;
  }
  .lds-ring div:nth-child(1) {
    animation-delay: -0.45s;
  }
  .lds-ring div:nth-child(2) {
    animation-delay: -0.3s;
  }
  .lds-ring div:nth-child(3) {
    animation-delay: -0.15s;
  }
  @keyframes lds-ring {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
  /* Add Zoom Animation */
.animate {
        -webkit-animation: animatezoom 0.6s;
        animation: animatezoom 0.6s
      }
      
      @-webkit-keyframes animatezoom {
        from {-webkit-transform: scale(0)} 
        to {-webkit-transform: scale(1)}
      }
        
      @keyframes animatezoom {
        from {transform: scale(0)} 
        to {transform: scale(1)}
      }
      
/* user permitions panel */
      .slide-top {
	-webkit-animation: slide-top 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: slide-top 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
                 position: fixed;
                 z-index: 600 !important;
                 top:90px;
                 overflow-y: scroll;
                 min-height: 500px;
                 right:0;
                 -webkit-box-shadow: 10px 10px 232px 125px rgba(0,0,0,0.23);
                -moz-box-shadow: 10px 10px 232px 125px rgba(0,0,0,0.23);
                 box-shadow: 10px 10px 232px 125px rgba(0,0,0,0.23);
        }


/**
 * ----------------------------------------
 * animation slide-top
 * ----------------------------------------
 */
 @-webkit-keyframes slide-top {
        0% {
          -webkit-transform: translateY(0);
                  transform: translateY(0);
        }
        100% {
          -webkit-transform: translateY(-100px);
                  transform: translateY(-100px);
        }
      }
      @keyframes slide-top {
        0% {
          -webkit-transform: translateY(0);
                  transform: translateY(0);
        }
        100% {
          -webkit-transform: translateY(-100px);
                  transform: translateY(-100px);
        }
      }
      
      .btn-default:focus {
        outline: none !important;
        }


/* 
        #tabanimations */

.classic-tabs .nav li a.active {
color: rgb(19, 62, 204); 
}
.classic-tabs .nav li a {
color: #777; 
}
.tabs-chili-pepper {
background-color: #ffffff; 
}
.classic-tabs .nav.tabs-animated li a.active {
border: none;
 }
.classic-tabs  .floor {
background-color: rgb(27, 95, 221);
 }

.staybotton {
display: inline-block;
width: 30px;
height: 2px;
position: absolute;
z-index: 1200;
-webkit-transition: all .4s linear;
-o-transition: all .4s linear;
transition: all .4s linear; 
margin-bottom: 0;


}

.bgAnimation {
       
        background-color: #fff;
        animation-name: bganime;
        animation-duration: 1.3s;
        animation-iteration-count: infinite;
        animation-timing-function: linear;
      }
      
      @keyframes bganime {
        from {background-color: #fff;}
        to {background-color: rgb(162, 231, 93);}
      }


      /* loader fo invoice */

      .flexbox {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
      }


       .flexbox > div {
         -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        /* border: 1px solid rgba(255, 255, 255, 0.1);
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        margin: 0;
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox; */
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        overflow: hidden; 

        position:fixed;
        width:100%;
        left:0;right:0;top:0;bottom:0;
        background-color: rgba(255, 255, 255, 0.822);
        z-index:9999;
      } 
      
      /* NO BORDER SPINNER */
      .nb-spinner {
        width: 105px;
        height: 105px;
        margin: 0;
        background: transparent;
        border-top: 4px solid #009688;
        border-right: 4px solid transparent;
        border-radius: 50%;
        -webkit-animation: 1s spin linear infinite;
        animation: 1s spin linear infinite;
      }
      
      @-webkit-keyframes spin {
        -webkit-from {
          -webkit-transform: rotate(0deg);
          -ms-transform: rotate(0deg);
          transform: rotate(0deg);
        }
        -webkit-to {
          -webkit-transform: rotate(360deg);
          -ms-transform: rotate(360deg);
          transform: rotate(360deg);
        }
      }
      
      @-webkit-keyframes spin {
        from {
          -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
        }
        to {
          -webkit-transform: rotate(360deg);
          transform: rotate(360deg);
        }
      }
      
      @keyframes spin {
        from {
          -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
        }
        to {
          -webkit-transform: rotate(360deg);
          transform: rotate(360deg);
        }
      }
      

      .fade-in-top {
        -webkit-animation: fade-in-top 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
                animation: fade-in-top 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
      }


/**
 * ----------------------------------------
 * animation fade-in-top
 * ----------------------------------------
 */
@-webkit-keyframes fade-in-top {
  0% {
    -webkit-transform: translateY(-50px);
            transform: translateY(-50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-in-top {
  0% {
    -webkit-transform: translateY(-50px);
            transform: translateY(-50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}



.Vendor_loader {
  margin: 100px auto;
  font-size: 25px;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  position: relative;
  text-indent: -9999em;
  -webkit-animation: load5 1.1s infinite ease;
  animation: load5 1.1s infinite ease;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}
@-webkit-keyframes load5 {
  0%,
  100% {
    box-shadow: 0em -2.6em 0em 0em #076fca, 1.8em -1.8em 0 0em rgba(7,111,202, 0.2), 2.5em 0em 0 0em rgba(7,111,202, 0.2), 1.75em 1.75em 0 0em rgba(7,111,202, 0.2), 0em 2.5em 0 0em rgba(7,111,202, 0.2), -1.8em 1.8em 0 0em rgba(7,111,202, 0.2), -2.6em 0em 0 0em rgba(7,111,202, 0.5), -1.8em -1.8em 0 0em rgba(7,111,202, 0.7);
  }
  12.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(7,111,202, 0.7), 1.8em -1.8em 0 0em #076fca, 2.5em 0em 0 0em rgba(7,111,202, 0.2), 1.75em 1.75em 0 0em rgba(7,111,202, 0.2), 0em 2.5em 0 0em rgba(7,111,202, 0.2), -1.8em 1.8em 0 0em rgba(7,111,202, 0.2), -2.6em 0em 0 0em rgba(7,111,202, 0.2), -1.8em -1.8em 0 0em rgba(7,111,202, 0.5);
  }
  25% {
    box-shadow: 0em -2.6em 0em 0em rgba(7,111,202, 0.5), 1.8em -1.8em 0 0em rgba(7,111,202, 0.7), 2.5em 0em 0 0em #076fca, 1.75em 1.75em 0 0em rgba(7,111,202, 0.2), 0em 2.5em 0 0em rgba(7,111,202, 0.2), -1.8em 1.8em 0 0em rgba(7,111,202, 0.2), -2.6em 0em 0 0em rgba(7,111,202, 0.2), -1.8em -1.8em 0 0em rgba(7,111,202, 0.2);
  }
  37.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(7,111,202, 0.2), 1.8em -1.8em 0 0em rgba(7,111,202, 0.5), 2.5em 0em 0 0em rgba(7,111,202, 0.7), 1.75em 1.75em 0 0em #076fca, 0em 2.5em 0 0em rgba(7,111,202, 0.2), -1.8em 1.8em 0 0em rgba(7,111,202, 0.2), -2.6em 0em 0 0em rgba(7,111,202, 0.2), -1.8em -1.8em 0 0em rgba(7,111,202, 0.2);
  }
  50% {
    box-shadow: 0em -2.6em 0em 0em rgba(7,111,202, 0.2), 1.8em -1.8em 0 0em rgba(7,111,202, 0.2), 2.5em 0em 0 0em rgba(7,111,202, 0.5), 1.75em 1.75em 0 0em rgba(7,111,202, 0.7), 0em 2.5em 0 0em #076fca, -1.8em 1.8em 0 0em rgba(7,111,202, 0.2), -2.6em 0em 0 0em rgba(7,111,202, 0.2), -1.8em -1.8em 0 0em rgba(7,111,202, 0.2);
  }
  62.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(7,111,202, 0.2), 1.8em -1.8em 0 0em rgba(7,111,202, 0.2), 2.5em 0em 0 0em rgba(7,111,202, 0.2), 1.75em 1.75em 0 0em rgba(7,111,202, 0.5), 0em 2.5em 0 0em rgba(7,111,202, 0.7), -1.8em 1.8em 0 0em #076fca, -2.6em 0em 0 0em rgba(7,111,202, 0.2), -1.8em -1.8em 0 0em rgba(7,111,202, 0.2);
  }
  75% {
    box-shadow: 0em -2.6em 0em 0em rgba(7,111,202, 0.2), 1.8em -1.8em 0 0em rgba(7,111,202, 0.2), 2.5em 0em 0 0em rgba(7,111,202, 0.2), 1.75em 1.75em 0 0em rgba(7,111,202, 0.2), 0em 2.5em 0 0em rgba(7,111,202, 0.5), -1.8em 1.8em 0 0em rgba(7,111,202, 0.7), -2.6em 0em 0 0em #076fca, -1.8em -1.8em 0 0em rgba(7,111,202, 0.2);
  }
  87.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(7,111,202, 0.2), 1.8em -1.8em 0 0em rgba(7,111,202, 0.2), 2.5em 0em 0 0em rgba(7,111,202, 0.2), 1.75em 1.75em 0 0em rgba(7,111,202, 0.2), 0em 2.5em 0 0em rgba(7,111,202, 0.2), -1.8em 1.8em 0 0em rgba(7,111,202, 0.5), -2.6em 0em 0 0em rgba(7,111,202, 0.7), -1.8em -1.8em 0 0em #076fca;
  }
}
@keyframes load5 {
  0%,
  100% {
    box-shadow: 0em -2.6em 0em 0em #076fca, 1.8em -1.8em 0 0em rgba(7,111,202, 0.2), 2.5em 0em 0 0em rgba(7,111,202, 0.2), 1.75em 1.75em 0 0em rgba(7,111,202, 0.2), 0em 2.5em 0 0em rgba(7,111,202, 0.2), -1.8em 1.8em 0 0em rgba(7,111,202, 0.2), -2.6em 0em 0 0em rgba(7,111,202, 0.5), -1.8em -1.8em 0 0em rgba(7,111,202, 0.7);
  }
  12.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(7,111,202, 0.7), 1.8em -1.8em 0 0em #076fca, 2.5em 0em 0 0em rgba(7,111,202, 0.2), 1.75em 1.75em 0 0em rgba(7,111,202, 0.2), 0em 2.5em 0 0em rgba(7,111,202, 0.2), -1.8em 1.8em 0 0em rgba(7,111,202, 0.2), -2.6em 0em 0 0em rgba(7,111,202, 0.2), -1.8em -1.8em 0 0em rgba(7,111,202, 0.5);
  }
  25% {
    box-shadow: 0em -2.6em 0em 0em rgba(7,111,202, 0.5), 1.8em -1.8em 0 0em rgba(7,111,202, 0.7), 2.5em 0em 0 0em #076fca, 1.75em 1.75em 0 0em rgba(7,111,202, 0.2), 0em 2.5em 0 0em rgba(7,111,202, 0.2), -1.8em 1.8em 0 0em rgba(7,111,202, 0.2), -2.6em 0em 0 0em rgba(7,111,202, 0.2), -1.8em -1.8em 0 0em rgba(7,111,202, 0.2);
  }
  37.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(7,111,202, 0.2), 1.8em -1.8em 0 0em rgba(7,111,202, 0.5), 2.5em 0em 0 0em rgba(7,111,202, 0.7), 1.75em 1.75em 0 0em #076fca, 0em 2.5em 0 0em rgba(7,111,202, 0.2), -1.8em 1.8em 0 0em rgba(7,111,202, 0.2), -2.6em 0em 0 0em rgba(7,111,202, 0.2), -1.8em -1.8em 0 0em rgba(7,111,202, 0.2);
  }
  50% {
    box-shadow: 0em -2.6em 0em 0em rgba(7,111,202, 0.2), 1.8em -1.8em 0 0em rgba(7,111,202, 0.2), 2.5em 0em 0 0em rgba(7,111,202, 0.5), 1.75em 1.75em 0 0em rgba(7,111,202, 0.7), 0em 2.5em 0 0em #076fca, -1.8em 1.8em 0 0em rgba(7,111,202, 0.2), -2.6em 0em 0 0em rgba(7,111,202, 0.2), -1.8em -1.8em 0 0em rgba(7,111,202, 0.2);
  }
  62.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(7,111,202, 0.2), 1.8em -1.8em 0 0em rgba(7,111,202, 0.2), 2.5em 0em 0 0em rgba(7,111,202, 0.2), 1.75em 1.75em 0 0em rgba(7,111,202, 0.5), 0em 2.5em 0 0em rgba(7,111,202, 0.7), -1.8em 1.8em 0 0em #076fca, -2.6em 0em 0 0em rgba(7,111,202, 0.2), -1.8em -1.8em 0 0em rgba(7,111,202, 0.2);
  }
  75% {
    box-shadow: 0em -2.6em 0em 0em rgba(7,111,202, 0.2), 1.8em -1.8em 0 0em rgba(7,111,202, 0.2), 2.5em 0em 0 0em rgba(7,111,202, 0.2), 1.75em 1.75em 0 0em rgba(7,111,202, 0.2), 0em 2.5em 0 0em rgba(7,111,202, 0.5), -1.8em 1.8em 0 0em rgba(7,111,202, 0.7), -2.6em 0em 0 0em #076fca, -1.8em -1.8em 0 0em rgba(7,111,202, 0.2);
  }
  87.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(7,111,202, 0.2), 1.8em -1.8em 0 0em rgba(7,111,202, 0.2), 2.5em 0em 0 0em rgba(7,111,202, 0.2), 1.75em 1.75em 0 0em rgba(7,111,202, 0.2), 0em 2.5em 0 0em rgba(7,111,202, 0.2), -1.8em 1.8em 0 0em rgba(7,111,202, 0.5), -2.6em 0em 0 0em rgba(7,111,202, 0.7), -1.8em -1.8em 0 0em #076fca;
  }
}