:root{
	--blue:#334261;
    --grey:#f6f6f6;
    --yellow:#ffad66;
    --gradient-lavender-pink-peach: linear-gradient(98deg, #a570ff 0%, #ff6eb2 50%, #ffad66 100%);
	--standard:30px;
	--double:60px;
	--triple:90px;
    --mini:10px;
    --micro:5px;
    --small:20px;
}

::selection {
    background: var(--blue);
    color: #fff;
}

progress {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 5px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  background-color: transparent;
  color: var(--blue);
  z-index:9999;
}

progress::-webkit-progress-bar {
  background-color: transparent;
}

progress::-webkit-progress-value {
  background: var(--gradient-lavender-pink-peach)
}

progress::-moz-progress-bar {
  background: var(--gradient-lavender-pink-peach)
}

*{
	margin:0px;
	padding:0px;
}

html, body { 
    font-family: 'Lato', sans-serif;
	color:#a6a6c9;
    background: #211334 url(../img/bg.svg) center / cover no-repeat;
    font-weight: 400;
}


@property --angle {
    syntax: '<angle>';
    initial-value: 0deg;
    inherits: false;
    }
    .hero-chat::after,
    .hero-chat::before {
    content: '';
    position: absolute;
    
    background-image: conic-gradient(
        from var(--angle),
        transparent 88%,
        #a570ff,
        #ff6eb2,
        #ffad66 100%
    );
    inset: -2px;
    z-index: -1;
    border-radius: 10px;
    animation: 12s spin linear infinite;
    }
    
    .hero-chat::before {
    opacity: 0.7;
    }
    
    @keyframes spin {
    from {
        --angle: 0deg;
    }
    to {
        --angle: 360deg;
    }
    }

h1, h2, h3, h4{
	font-family: 'Lato', sans-serif;
	font-weight:700;
    color:#d9d9e8;
}

a img{
	border:0px;
}

a{
	text-decoration:none;
	transition: all 0.7s ease 0s;
}

ul{
	list-style-type:none;
}

footer{
	padding-top:var(--double);
	padding-bottom:var(--standard);
    color:#fff;
    background:linear-gradient(180deg, #15152c 0%, #111022 100%);
    /*min-height:400px;*/
    position:relative;
    bottom:0;
    z-index:0;
    width:100%;
    border-top:2px solid #3C3C77;
}

footer:hover{
    border-top:2px solid var(--yellow);
}

main{
    position:relative;
    /*margin-bottom:400px;*/
    z-index:1;
}

footer p {
    color: #fff;
    font-size: 16px;
    line-height: 1.5;
    margin: 0;
}

footer a{
    color:#fff;
}

.red{
    color:var(--red);
}

.social i{
    font-size: 32px;
    margin-left:var(--mini);
    margin-right:var(--mini);
    margin-bottom:var(--mini);
    width:30px;
    text-align:center;
}

a.social:hover{
    color:var(--blue);
}

a {
    color: var(--blue);
}

a:hover{
    color: var(--blue);
}

footer a{
	color:#fff;
}

.padding-0{
	padding:0;
}

.btn-primary {
    background-color: var(--blue);
	border-color: var(--blue);
	color:#fff;
	border-radius:20px;
	padding:5px var(--standard);
	border:0;
}


.btn-primary:active, .btn-primary:focus, .btn-primary:hover {
    color: #fff;
    background-color: var(--blue) !important;
    border-color: var(--blue);
}

.btn-primary-outline {
    background: var(--gradient-lavender-pink-peach);
	border-color: #fff !important;
	color:#fff !important;
	border-radius:6px;
	padding:10px var(--standard) !important;
	border:0;
}


.btn-primary-outline:active, .btn-primary-outline:focus, .btn-primary-outline:hover {
    color: #fff !important;
    background-color: transparent !important;
    border-color: #fff !important;
}

.btn-primary-outline > span > span {
    overflow: hidden;
    color: #fff !important;
}

.row-eq-height {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display:         flex;
}

.center{
	text-align:center;
}

.clear{
	clear:both;
}

.map-responsive{
    overflow:hidden;
    padding-bottom:25%;
    position:relative;
    height:0;
}
.map-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}

.parallax {
    background: transparent;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.wpcf7-form div.wpcf7-mail-sent-ok {
    border: 0px;
}

.wpcf7-form div.wpcf7-response-output {
    clear: both;
    margin: 30px;
	padding: 0;
	text-align:center;
}

.mt-triple{
	margin-top:var(--triple);
}

.mb-triple{
	margin-bottom:var(--triple);
}

.pt-triple{
	padding-top:var(--triple);
}

.pb-triple{
	padding-bottom:var(--triple);
}

.mt-double{
	margin-top:var(--double);
}

.mb-double{
	margin-bottom:var(--double);
}

.pt-double{
	padding-top:var(--double);
}

.pb-double{
	padding-bottom:var(--double);
}

.pt-small{
	padding-top:var(--small);
}

.pb-small{
	padding-bottom:var(--small);
}

.mt-standard{
	margin-top:var(--standard);
}

.mb-standard{
	margin-bottom:var(--standard);
}

.pt-standard{
	padding-top:var(--standard);
}

.pb-standard{
	padding-bottom:var(--standard);
}

.wpcf7-form-control-wrap span.wpcf7-not-valid-tip{
    display:none;
}

.wpcf7-form div.wpcf7-validation-errors {
    border: 0px;
}

input[type="text"].wpcf7-not-valid, input[type="email"].wpcf7-not-valid, textarea.wpcf7-not-valid,select.wpcf7-not-valid{
    border:1px solid red;
}

.wpcf7-form-control-wrap span.wpcf7-not-valid input[type="checkbox"]{
	outline: 1px solid red;
}

input[type="submit"] {
    transition: all 0.7s ease 0s;
    font-size: 16px;
    line-height: 1;
    padding: 8px var(--standard);
}

#gallery-center img{
    height: 40px;
    margin-bottom:5px
}

img.icon{
    height: 30px;
  float: left;
  margin-right: 10px;
}


#gallery-center p{
    font-size: 18px;
}

.empty-animation {
    animation-name: zoomInStable;
    animation-duration: 3s;
    animation-iteration-count: 1;
    animation-timing-function: linear;
  
    -webkit-animation-name: zoomInStable;
    -webkit-animation-duration: 3s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
  
    -moz-animation-name: zoomInStable;
    -moz-animation-duration: 3s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
  
    -ms-animation-name: zoomInStable;
    -ms-animation-duration: 3s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
  
    -o-animation-name: zoomInStable;
    -o-animation-duration: 3s;
    -o-animation-iteration-count: 1;
    -o-animation-timing-function: linear;
  }
  
  .empty-animation {
    animation-name: zoomInStable;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
  
    -webkit-animation-name: zoomInStable;
    -webkit-animation-duration: 3s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
  
    -moz-animation-name: zoomInStable;
    -moz-animation-duration: 3s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
  
    -ms-animation-name: zoomInStable;
    -ms-animation-duration: 3s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
  
    -o-animation-name: zoomInStable;
    -o-animation-duration: 3s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
  }
  
  .empty-animation {
    animation-name: slideInUp;
    animation-duration: 2s;
    animation-iteration-count: 1;
    animation-timing-function: linear;
  
    -webkit-animation-name: slideInUp;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
  
    -moz-animation-name: slideInUp;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
  
    -ms-animation-name: slideInUp;
    -ms-animation-duration: 2s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
  
  }
  
  .empty-animation {
    animation-name: slideInRight;
    animation-duration: 2s;
    animation-iteration-count: 1;
    animation-timing-function: linear;
  
    -webkit-animation-name: slideInRight;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
  
    -moz-animation-name: slideInRight;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
  
    -ms-animation-name: slideInRight;
    -ms-animation-duration: 2s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
  
  }
  
  .empty-animation {
    animation-name: slideInLeft;
    animation-duration: 2s;
    animation-iteration-count: 1;
    animation-timing-function: linear;
  
    -webkit-animation-name: slideInLeft;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
  
    -moz-animation-name: slideInLeft;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
  
    -ms-animation-name: slideInLeft;
    -ms-animation-duration: 2s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
  
  }
  
  .empty-animation {
    animation-name: slideInUp;
    animation-duration: 2s;
    animation-iteration-count: 1;
    animation-timing-function: linear;
  
    -webkit-animation-name: slideInUp;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
  
    -moz-animation-name: slideInUp;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
  
    -ms-animation-name: slideInUp;
    -ms-animation-duration: 2s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
  
  }
  
  @keyframes rotateme {
  
    0% {
      transform: rotate(0deg);
      opacity: 1;
    }
  
    50% {
      transform: rotate(180deg);
    }
  
    100% {
      transform: rotate(360deg);
      opacity: 1;
    }
  }
  
  .slider-one_experiance::before {
    animation-name: rotateme;
    animation-duration: 15s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
  
    -webkit-animation-name: rotateme;
    -webkit-animation-duration: 15s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
  
    -moz-animation-name: rotateme;
    -moz-animation-duration: 15s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
  
    -ms-animation-name: rotateme;
    -ms-animation-duration: 15s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
  
    -o-animation-name: rotateme;
    -o-animation-duration: 15s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
  }
  
  @keyframes rotateme2 {
  
    0% {
      transform: rotate(0deg);
      opacity: 1;
    }
  
    50% {
      transform: rotate(-180deg);
    }
  
    100% {
      transform: rotate(-360deg);
      opacity: 1;
    }
  }
  
  .empty-animation {
    animation-name: rotateme2;
    animation-duration: 15s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
  
    -webkit-animation-name: rotateme2;
    -webkit-animation-duration: 15s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
  
    -moz-animation-name: rotateme2;
    -moz-animation-duration: 15s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
  
    -ms-animation-name: rotateme2;
    -ms-animation-duration: 15s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
  
    -o-animation-name: rotateme2;
    -o-animation-duration: 15s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
  }
  
  /* Bob Up Down*/
  
  @-webkit-keyframes float_up_down {
    0% {
      -webkit-transform: translateY(0px);
      transform: translateY(0px);
      opacity: 1;
    }
  
    50% {
      -webkit-transform: translateY(30px);
      transform: translateY(30px);
      opacity: 1;
    }
  
    100% {
      -webkit-transform: translateY(0px);
      transform: translateY(0px);
      opacity: 1;
    }
  }
  
  @keyframes float_up_down {
    0% {
      transform: translateY(0px);
      transform: translateY(0px);
      opacity: 1;
    }
  
    50% {
      transform: translateY(30px);
      transform: translateY(30px);
      opacity: 1;
    }
  
    100% {
      transform: translateY(0px);
      transform: translateY(0px);
      opacity: 1;
    }
  }
  
  .empty-animation {
    animation-name: float_up_down;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
  
    -webkit-animation-name: float_up_down;
    -webkit-animation-duration: 3s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
  
    -moz-animation-name: float_up_down;
    -moz-animation-duration: 3s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
  
    -ms-animation-name: float_up_down;
    -ms-animation-duration: 3s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
  
    -o-animation-name: float_left_right;
    -o-animation-duration: 3s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
  }
  
  /* Bob */
  @-webkit-keyframes float_left_right {
    0% {
      -webkit-transform: translateX(-100px);
      transform: translateX(-100px);
      opacity: 1;
    }
  
    50% {
      -webkit-transform: translateX(100px);
      transform: translateX(100px);
      opacity: 0.40;
    }
  
    100% {
      -webkit-transform: translateX(-100px);
      transform: translateX(-100px);
      opacity: 1;
    }
  }
  
  @keyframes float_left_right {
    0% {
      -webkit-transform: translateX(-100px);
      transform: translateX(-100px);
      opacity: 1;
    }
  
    50% {
      -webkit-transform: translateX(100px);
      transform: translateX(100px);
      opacity: 0.40;
    }
  
    100% {
      -webkit-transform: translateX(-100px);
      transform: translateX(-100px);
      opacity: 1;
    }
  }
  
  .empty-animation {
    animation-name: float_left_right;
    animation-duration: 30s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
  
    -webkit-animation-name: float_left_right;
    -webkit-animation-duration: 30s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
  
    -moz-animation-name: float_left_right;
    -moz-animation-duration: 30s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
  
    -ms-animation-name: float_left_right;
    -ms-animation-duration: 30s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
  
    -o-animation-name: float_left_right;
    -o-animation-duration: 30s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
  }
  
  @-webkit-keyframes float_left_right_two {
    0% {
      -webkit-transform: translateX(-30px);
      opacity: 1;
    }
  
    50% {
      -webkit-transform: translateX(0px);
      opacity: 0.80;
    }
  
    100% {
      -webkit-transform: translateX(-30px);
      opacity: 1;
    }
  }
  
  @keyframes float_left_right_two {
    0% {
      transform: translateX(-30px);
      opacity: 1;
    }
  
    50% {
      transform: translateX(0px);
      opacity: 0.80;
    }
  
    100% {
      transform: translateX(-30px);
      opacity: 1;
    }
  }
  
  .empty-animation {
    animation-name: float_left_right_two;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
  
    -webkit-animation-name: float_left_right_two;
    -webkit-animation-duration: 5s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
  
    -moz-animation-name: float_left_right_two;
    -moz-animation-duration: 5s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
  
    -ms-animation-name: float_left_right_two;
    -ms-animation-duration: 5s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
  
    -o-animation-name: float_left_right_two;
    -o-animation-duration: 5s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
  }
  
  
  @-webkit-keyframes zoom-fade {
    0% {
      -webkit-transform: scale(0.8);
      transform: scale(0.8);
    }
  
    50% {
      -webkit-transform: scale(1);
      transform: scale(1);
    }
  
    100% {
      -webkit-transform: scale(0.8);
      transform: scale(0.8);
    }
  }
  
  .empty-animation {
    animation-name: zoom-fade;
    animation-duration: 6s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
  
    -webkit-animation-name: zoom-fade;
    -webkit-animation-duration: 6s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
  
    -moz-animation-name: zoom-fade;
    -moz-animation-duration: 6s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
  
    -ms-animation-name: zoom-fade;
    -ms-animation-duration: 6s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
  
    -o-animation-name: zoom-fade;
    -o-animation-duration: 6s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
  }
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  /* Dots Animations */
  
  .ct-dot-animated {
    position: absolute;
    width: 100%;
    height: 102%;
    top: 0;
    left: 0;
    z-index: 1;
  }
  
  .ct-dot-animated.top-slider {
    height: calc(100% + 330px);
    height: -webkit-calc(100% + 330px);
    margin-top: -330px
  }
  
  .ct-dot-animated .ct-dot-item {
    background-color: rgba(255, 255, 255, .2);
    width: 1px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 10%;
  }
  
  .ct-dot-animated .ct-dot-item span {
    width: 3px;
    height: 10px;
    -webkit-border-radius: 50px;
    -khtml-border-radius: 50px;
    -moz-border-radius: 50px;
    -ms-border-radius: 50px;
    -o-border-radius: 50px;
    border-radius: 50px;
    background-color: #ffffff;
    position: absolute;
    bottom: 14%;
    left: 0px
  }
  
  .ct-dot-animated .ct-dot-item:nth-child(1) span {
    background-color: #ffffff;
    -webkit-animation: dotAnimatedBottomToTop1 20s infinite linear;
    -moz-animation: dotAnimatedBottomToTop1 20s infinite linear;
    -o-animation: dotAnimatedBottomToTop1 20s infinite linear;
    animation: dotAnimatedBottomToTop1 20s infinite linear;
  }
  
  .ct-dot-animated .ct-dot-item:nth-child(2) {
    left: 50%
  }
  
  .ct-dot-animated .ct-dot-item:nth-child(2) span {
    background-color: #ffffff;
    bottom: 64%;
    -webkit-animation: dotAnimatedBottomToTop2 45s infinite linear;
    -moz-animation: dotAnimatedBottomToTop2 45s infinite linear;
    -o-animation: dotAnimatedBottomToTop2 45s infinite linear;
    animation: dotAnimatedBottomToTop2 45s infinite linear
  }
  
  .ct-dot-animated .ct-dot-item:nth-child(3) {
    left: 90%
  }
  
  .ct-dot-animated .ct-dot-item:nth-child(3) span {
    background-color: #ffffff;
    bottom: 5%;
    -webkit-animation: dotAnimatedBottomToTop3 30s infinite linear;
    -moz-animation: dotAnimatedBottomToTop3 30s infinite linear;
    -o-animation: dotAnimatedBottomToTop3 30s infinite linear;
    animation: dotAnimatedBottomToTop3 30s infinite linear
  }
  
  .ct-dot-animated .ct-dot-item:nth-child(4) {
    left: 60%
  }
  
  .ct-dot-animated .ct-dot-item:nth-child(4) span {
    background-color: #ffffff;
    bottom: 78%;
    -webkit-animation: dotAnimatedBottomToTop4 35s infinite linear;
    -moz-animation: dotAnimatedBottomToTop4 35s infinite linear;
    -o-animation: dotAnimatedBottomToTop4 35s infinite linear;
    animation: dotAnimatedBottomToTop4 35s infinite linear
  }
  
  .ct-dot-animated .ct-dot-item:nth-child(5) {
    left: 80%
  }
  
  .ct-dot-animated .ct-dot-item:nth-child(5) span {
    background-color: #ffffff;
    bottom: 46%;
    -webkit-animation: dotAnimatedBottomToTop5 30s infinite linear;
    -moz-animation: dotAnimatedBottomToTop5 30s infinite linear;
    -o-animation: dotAnimatedBottomToTop5 30s infinite linear;
    animation: dotAnimatedBottomToTop5 30s infinite linear
  }
  
  .ct-dot-animated .ct-dot-item:nth-child(6) {
    left: auto;
    right: 0
  }
  
  .ct-dot-animated .ct-dot-item:nth-child(6) span {
    background-color: #ffffff;
    bottom: 27%;
    -webkit-animation: dotAnimatedBottomToTop6 30s infinite linear;
    -moz-animation: dotAnimatedBottomToTop6 30s infinite linear;
    -o-animation: dotAnimatedBottomToTop6 30s infinite linear;
    animation: dotAnimatedBottomToTop6 30s infinite linear
  }
  
  .ct-dot-animated .ct-dot-container {
    max-width: 1004px;
    height: 100%;
    margin: 0 auto;
    position: relative
  }
  
  .error404 .site-content {
    padding-top: 195px !important;
    padding-bottom: 0 !important
  }
  
  
  @keyframes dotAnimatedBottomToTop1 {
    0% {
      bottom: 14%
    }
  
    50% {
      bottom: 100%
    }
  
    100% {
      bottom: 14%
    }
  }
  
  @keyframes dotAnimatedBottomToTop2 {
    0% {
      bottom: 64%
    }
  
    50% {
      bottom: 0
    }
  
    100% {
      bottom: 100%
    }
  }
  
  @keyframes dotAnimatedBottomToTop3 {
    0% {
      bottom: 5%
    }
  
    50% {
      bottom: 100%
    }
  
    100% {
      bottom: 5%
    }
  }
  
  @keyframes dotAnimatedBottomToTop4 {
    0% {
      bottom: 78%
    }
  
    50% {
      bottom: 0
    }
  
    100% {
      bottom: 78%
    }
  }
  
  @keyframes dotAnimatedBottomToTop5 {
    0% {
      bottom: 46%
    }
  
    50% {
      bottom: 0
    }
  
    100% {
      bottom: 46%
    }
  }
  
  @keyframes dotAnimatedBottomToTop6 {
    0% {
      bottom: 27%
    }
  
    50% {
      bottom: 100%
    }
  
    100% {
      bottom: 27%
    }
  }
  
  @keyframes dotAnimatedBottomToTop2 {
    0% {
      bottom: 64%
    }
  
    50% {
      bottom: 0
    }
  
    100% {
      bottom: 100%
    }
  }
  
  @keyframes dotAnimatedBottomToTop3 {
    0% {
      bottom: 5%
    }
  
    50% {
      bottom: 100%
    }
  
    100% {
      bottom: 5%
    }
  }
  
  @keyframes dotAnimatedBottomToTop4 {
    0% {
      bottom: 78%
    }
  
    50% {
      bottom: 0
    }
  
    100% {
      bottom: 78%
    }
  }
  
  @keyframes dotAnimatedBottomToTop5 {
    0% {
      bottom: 46%
    }
  
    50% {
      bottom: 0
    }
  
    100% {
      bottom: 46%
    }
  }
  
  @keyframes dotAnimatedBottomToTop6 {
    0% {
      bottom: 27%
    }
  
    50% {
      bottom: 100%
    }
  
    100% {
      bottom: 27%
    }
  }
  
  @keyframes dotAnimatedBottomToTop3 {
    0% {
      bottom: 5%
    }
  
    50% {
      bottom: 100%
    }
  
    100% {
      bottom: 5%
    }
  }
  
  @keyframes dotAnimatedBottomToTop4 {
    0% {
      bottom: 78%
    }
  
    50% {
      bottom: 0
    }
  
    100% {
      bottom: 78%
    }
  }
  
  @keyframes dotAnimatedBottomToTop4 {
    0% {
      bottom: 78%
    }
  
    50% {
      bottom: 0
    }
  
    100% {
      bottom: 78%
    }
  }
  
  @keyframes dotAnimatedBottomToTop5 {
    0% {
      bottom: 46%
    }
  
    50% {
      bottom: 0
    }
  
    100% {
      bottom: 46%
    }
  }
  
  @keyframes dotAnimatedBottomToTop6 {
    0% {
      bottom: 27%
    }
  
    50% {
      bottom: 100%
    }
  
    100% {
      bottom: 27%
    }
  }
  
  
  
  
  
  
  
  
  
  @-webkit-keyframes icon-bounce {
  
    0%,
    100%,
    20%,
    50%,
    80% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
  
    40% {
      -webkit-transform: translateY(-10px);
      transform: translateY(-10px);
    }
  
    60% {
      -webkit-transform: translateY(-5px);
      transform: translateY(-5px);
    }
  }
  
  @keyframes icon-bounce {
  
    0%,
    100%,
    20%,
    50%,
    80% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
  
    40% {
      -webkit-transform: translateY(-10px);
      transform: translateY(-10px);
    }
  
    60% {
      -webkit-transform: translateY(-5px);
      transform: translateY(-5px);
    }
  }
  
  
  
  
  
  
  @-webkit-keyframes marquee {
    from {
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  
    to {
      -webkit-transform: translateX(-50%);
      transform: translateX(-50%);
    }
  }
  
  @keyframes marquee {
    from {
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  
    to {
      -webkit-transform: translateX(-50%);
      transform: translateX(-50%);
    }
  }
  
  @-webkit-keyframes marquee2 {
    to {
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  
    from {
      -webkit-transform: translateX(-50%);
      transform: translateX(-50%);
    }
  }
  
  @keyframes marquee2 {
    to {
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  
    from {
      -webkit-transform: translateX(-50%);
      transform: translateX(-50%);
    }
  }
  
  
  
  @-webkit-keyframes shine {
    100% {
      left: 125%;
    }
  }
  
  @keyframes shine {
    100% {
      left: 125%;
    }
  }
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  @-webkit-keyframes float-bob {
    0% {
      -webkit-transform: translateX(-100px);
      transform: translateX(-100px);
    }
  
    50% {
      -webkit-transform: translateX(-10px);
      transform: translateX(-10px);
    }
  
    100% {
      -webkit-transform: translateX(-100px);
      transform: translateX(-100px);
    }
  }
  
  @keyframes float-bob {
    0% {
      -webkit-transform: translateX(-100px);
      transform: translateX(-100px);
    }
  
    50% {
      -webkit-transform: translateX(-10px);
      transform: translateX(-10px);
    }
  
    100% {
      -webkit-transform: translateX(-100px);
      transform: translateX(-100px);
    }
  }
  
  
  
  
  .float-bob {
    animation-name: float-bob;
    animation-duration: 7s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
  
    -webkit-animation-name: float-bob;
    -webkit-animation-duration: 7s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
  
    -moz-animation-name: float-bob;
    -moz-animation-duration: 7s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
  
    -ms-animation-name: float-bob;
    -ms-animation-duration: 7s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
  
    -o-animation-name: float-bob;
    -o-animation-duration: 7s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
  }
  
  
  
  
  /***
  =============================================
      Float Bob X Animation Css
  =============================================
  ***/
  @-webkit-keyframes float-bob-x {
    0% {
      transform: translateX(-30px);
    }
  
    50% {
      transform: translateX(-10px);
    }
  
    100% {
      transform: translateX(-30px);
    }
  }
  
  @keyframes float-bob-x {
    0% {
      transform: translateX(-30px);
    }
  
    50% {
      transform: translateX(-10px);
    }
  
    100% {
      transform: translateX(-30px);
    }
  }
  
  .float-bob-x {
    -webkit-animation-name: float-bob-x;
    animation-name: float-bob-x;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
  }
  
  
  /*** 
  =============================================
      Float Bob Y Animation Css
  =============================================
  ***/
  @-webkit-keyframes float-bob-y {
    0% {
      transform: translateY(-20px);
    }
  
    50% {
      transform: translateY(-10px);
    }
  
    100% {
      transform: translateY(-20px);
    }
  }
  
  @keyframes float-bob-y {
    0% {
      transform: translateY(-20px);
    }
  
    50% {
      transform: translateY(-10px);
    }
  
    100% {
      transform: translateY(-20px);
    }
  }
  
  .float-bob-y {
    -webkit-animation-name: float-bob-y;
    animation-name: float-bob-y;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
  }
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  /*** 
    =============================================
        Zoom In Out Css
    =============================================
    ***/
  .zoominout {
    animation-name: zoomInOut;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
  
    -webkit-animation-name: zoomInOut;
    -webkit-animation-duration: 3s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
  
    -moz-animation-name: zoomInOut;
    -moz-animation-duration: 3s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: ease-in-out;
  
    -ms-animation-name: zoomInOut;
    -ms-animation-duration: 3s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: ease-in-out;
  
    -o-animation-name: zoomInOut;
    -o-animation-duration: 3s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: ease-in-out;
  }
  
  @-webkit-keyframes zoomInOut {
    0% {
      -webkit-transform: rotate(0deg) scale(0.7);
      transform: rotate(0deg) scale(0.7);
      opacity: 0;
    }
  
    50% {
      -webkit-transform: rotate(180deg) scale(1);
      transform: rotate(180deg) scale(1);
      opacity: 1;
    }
  
    100% {
      -webkit-transform: rotate(360deg) scale(0.7);
      transform: rotate(360deg) scale(0.7);
      opacity: 0;
    }
  }
  
  
  
  
  /*** 
    =============================================
        Zoom In Out Css
    =============================================
    ***/
  .zoominout-2 {
    animation-name: zoomInOut-2;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
  
    -webkit-animation-name: zoomInOut-2;
    -webkit-animation-duration: 3s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
  
    -moz-animation-name: zoomInOut-2;
    -moz-animation-duration: 3s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: ease-in-out;
  
    -ms-animation-name: zoomInOut-2;
    -ms-animation-duration: 3s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: ease-in-out;
  
    -o-animation-name: zoomInOut-2;
    -o-animation-duration: 3s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: ease-in-out;
  }
  
  @-webkit-keyframes zoomInOut-2 {
    0% {
      -webkit-transform: rotate(0deg) scale(0.7);
      transform: rotate(0deg) scale(0.7);
      opacity: .50;
    }
  
    50% {
      -webkit-transform: rotate(0deg) scale(1);
      transform: rotate(0deg) scale(1);
      opacity: .50;
    }
  
    100% {
      -webkit-transform: rotate(0deg) scale(0.7);
      transform: rotate(0deg) scale(0.7);
      opacity: .50;
    }
  }
  
  
  /*--------------------------------------------------------------
  #     Zoom Fade Css
  --------------------------------------------------------------*/
  .zoom-fade {
    animation-name: zoom-fade;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
  
    -webkit-animation-name: zoom-fade;
    -webkit-animation-duration: 5s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
  
    -moz-animation-name: zoom-fade;
    -moz-animation-duration: 5s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
  
    -ms-animation-name: zoom-fade;
    -ms-animation-duration: 5s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
  
    -o-animation-name: zoom-fade;
    -o-animation-duration: 5s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
  }
  
  @-webkit-keyframes zoom-fade {
    0% {
      transform: scale(0.9) translateX(-50%);
    }
  
    50% {
      transform: scale(1) translateX(-50%);
    }
  
    100% {
      transform: scale(0.9) translateX(-50%);
    }
  }
  
  @keyframes zoom-fade {
    0% {
      transform: scale(0.9) translateX(-50%);
    }
  
    50% {
      transform: scale(1) translateX(-50%);
    }
  
    100% {
      transform: scale(0.9) translateX(-50%);
    }
  }
  
  
  /*--------------------------------------------------------------
  #     Zoom Fade 2 Css
  --------------------------------------------------------------*/
  .zoom-fade-2 {
    animation-name: zoom-fade-2;
    animation-duration: 8s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
  
    -webkit-animation-name: zoom-fade-2;
    -webkit-animation-duration: 8s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
  
    -moz-animation-name: zoom-fade-2;
    -moz-animation-duration: 8s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
  
    -ms-animation-name: zoom-fade-2;
    -ms-animation-duration: 8s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
  
    -o-animation-name: zoom-fade-2;
    -o-animation-duration: 8s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
  }
  
  @-webkit-keyframes zoom-fade-2 {
    0% {
      transform: scale(0.9) translateX(0) translateY(0);
    }
  
    50% {
      transform: scale(1) translateX(0) translateY(0);
    }
  
    100% {
      transform: scale(0.9) translateX(0) translateY(0);
    }
  }
  
  @keyframes zoom-fade-2 {
    0% {
      transform: scale(0.9) translateX(0) translateY(0);
    }
  
    50% {
      transform: scale(1) translateX(0) translateY(0);
    }
  
    100% {
      transform: scale(0.9) translateX(0) translateY(0);
    }
  }
  
  
  
  
  
  /*--------------------------------------------------------------
  #     Zoom Fade 3 Css
  --------------------------------------------------------------*/
  .zoom-fade-3 {
    animation-name: zoom-fade-3;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
  
    -webkit-animation-name: zoom-fade-3;
    -webkit-animation-duration: 5s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
  
    -moz-animation-name: zoom-fade-3;
    -moz-animation-duration: 5s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
  
    -ms-animation-name: zoom-fade-3;
    -ms-animation-duration: 5s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
  
    -o-animation-name: zoom-fade-3;
    -o-animation-duration: 5s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
  }
  
  
  
  @-webkit-keyframes ImgBounce {
    0% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
  
    100% {
      -webkit-transform: translateY(-30px);
      transform: translateY(-30px);
    }
  }
  
  @keyframes ImgBounce {
    0% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
  
    100% {
      -webkit-transform: translateY(-30px);
      transform: translateY(-30px);
    }
  }
  
  
  .img-bounce {
    -webkit-animation: ImgBounce 5s ease-in-out 0s infinite alternate;
    animation: ImgBounce 5s ease-in-out 0s infinite alternate;
  }

  .feature-one__start-1 {
	position: absolute;
	top: 0;
	left: -30px;
}

.feature-one__start-1 img {
	width: auto;
}

.feature-one__start-2 {
	position: fixed;
	top: 5%;
	left: 30%;
}

.feature-one__start-2 img {
	width: auto;
}

.feature-one__start-3 {
	position: absolute;
  bottom: 15%;
  left: 50%;
}

.feature-one__start-3 img {
	width: auto;
}

.feature-one__start-4 {
	position: fixed;
	top: 50%;
	left: 10%;
}

.feature-one__start-4 img {
	width: auto;
}

.feature-one__start-5 {
	position: fixed;
  top: 70%;
  left: 50%;
}

.feature-one__start-5 img {
	width: auto;
}

.feature-one__start-6 {
	position: absolute;
  top: 150px;
  right: 30%;
}

.feature-one__start-6 img {
	width: auto;
}

.feature-one__start-7 {
	position: fixed;
	bottom: 15px;
	right: 160px;
}

.feature-one__start-7 img {
	width: auto;
}

.slines {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 100%;
	margin: auto;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	max-width: 1140px;
}

.sline {
	position: absolute;
	width: 1px;
	height: 100%;
	top: 0;
	left: 0%;
	/*background: rgba(255, 255, 255, 0.05);*/
	overflow: hidden;
}

.sline::after {
	content: "";
	display: block;
	position: absolute;
	height: 15vh;
	width: 100%;
	top: -50%;
	left: 0;
	background: var(--gradient-lavender-pink-peach);
	-webkit-animation: drop 5s 0s infinite;
			animation: drop 5s 0s infinite;
	-webkit-animation-fill-mode: forwards;
			animation-fill-mode: forwards;
	-webkit-animation-timing-function: cubic-bezier(0.4, 0.26, 0, 0.97);
			animation-timing-function: cubic-bezier(0.4, 0.26, 0, 0.97);
}
.sline:nth-child(1) {
	margin-left: 0%;
}

.sline:nth-child(2) {
	margin-left: 33.3333%;
}

.sline:nth-child(3) {
	margin-left: 66.6666%;
}

.sline:nth-child(1)::after {
	-webkit-animation-delay: 6s;
		animation-delay: 6s;
}
.sline:nth-child(4) {
	margin-left: 100%;
}

.sline:nth-child(3)::after {
	-webkit-animation-delay: 12.5s;
		animation-delay: 12.5s;
}

@-webkit-keyframes drop {
	0% {
		top: -50%;
	}
	100% {
		top: 110%;
	}
}

@keyframes drop {
	0% {
		top: -50%;
	}
	100% {
		top: 110%;
	}
}

/*[type="button"]:not(:disabled), [type="reset"]:not(:disabled), [type="submit"]:not(:disabled), button:not(:disabled) {
    cursor: none;
}*/

div.wpcf7 .ajax-loader{
	float:left;
}

.form span.wpcf7-list-item {
    margin: 0px;
	margin-top:0px;
}

span.wpcf7-list-item {
    margin: 0;
}

.wpcf7-form-control-wrap {
    color: #fff;
	font-size:14px;
}

section{
	padding-top:var(--triple);
	padding-bottom:var(--triple);
}

.mobile{
    display:none;
}

.desktop{
    display:block;
}

p{
    font-weight: 300;
}

.offcanvas-active{
	overflow:hidden;
}

.screen-overlay {
  width:0%;
  height: 100%;
  z-index: 30;
  position: fixed;
  top: 0;
  left: 0;
  opacity:0;
  visibility:hidden;
  background-color: rgba(34, 34, 34, 0.6);
  transition:opacity .2s linear, visibility .1s, width 1s ease-in;
}

.screen-overlay.show {
    transition:opacity .5s ease, width 0s;
    opacity:1;
    width:100%;
    visibility:visible;
}

.offcanvas{
	width:80%;
	visibility: hidden;
	transform:translateX(-100%);
	transition:all .2s;
    border-radius:0; 
    box-shadow: 0 5px 10px rgba(0,0,0, .2);
	display:block;
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    z-index: 1200;
    background-color: #fff;
    overflow-y: scroll;
    overflow-x: hidden;
}

.offcanvas.offcanvas-right {
   right: 0;
   left: auto;
   transform: translateX(100%); 
 }

.offcanvas.show{
	visibility: visible;
    transform: translateX(0);
    transition: transform .2s;
}

.offcanvas .btn-close{ position: absolute; right:15px; top:-20px;z-index:9999;color:#fff;cursor:pointer }

.hamburger .line{
  width: 40px;
  height: 2px;
  background-color: #fff;
  display: block;
  margin: 6px auto;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.hamburger .line.dark{
    background-color: #fff;
}

.hamburger{
    z-index: 1300;
    position: fixed;
    right: 30px;
    top: 16px;
}

#menu-align{
    position:absolute;
    right:70px;
    top:16px;
}

.hamburger:hover{
  cursor: pointer;
}

.hamburger.is-active .line:nth-child(2){
  opacity: 0;
}

.hamburger.is-active .line:nth-child(1){
  -webkit-transform: translateY(6px) rotate(45deg);
  -ms-transform: translateY(6px) rotate(45deg);
  -o-transform: translateY(6px) rotate(45deg);
  transform: translateY(6px) rotate(45deg);
}

.hamburger.is-active .line:nth-child(3){
  -webkit-transform: translateY(-10px) rotate(-45deg);
  -ms-transform: translateY(-10px) rotate(-45deg);
  -o-transform: translateY(-10px) rotate(-45deg);
  transform: translateY(-10x) rotate(-45deg);
}

.cursor {
	position: fixed;
	top: 0px;
	left: 0px;
	pointer-events: none;
	/*mix-blend-mode: difference;*/
	border-radius: 50%;
	/*padding: 0.6rem;*/
	width: 10px;
	height: 10px;
	/*border: 1px solid #ccc;*/
    background: var(--blue);
	z-index:99999;
    contain: layout style size;
    pointer-events: none;
    will-change: transform;
    -webkit-transition: opacity .1s,-webkit-transform .25s ease-in-out;
    transition: opacity .1s,-webkit-transform .25s ease-in-out;
    -o-transition: opacity .1s,-o-transform .25s ease-in-out;
    -moz-transition: transform .25s ease-in-out,opacity .1s,-moz-transform .25s ease-in-out;
    transition: transform .25s ease-in-out,opacity .1s;
    transition: transform .25s ease-in-out,opacity .1s,-webkit-transform .25s ease-in-out,-moz-transform .25s ease-in-out,-o-transform .25s ease-in-out;
}

  
.cursor.cursor-active {
	transform: scale(24);
		-webkit-transform: scale(4);
	/*opacity: 0.25;*/
	background-color:rgba(51, 66, 97, 0.5)
}

#hero{
    min-height:50vh;
    position: relative;
}

#hero p.smooth{
    font-size: 30px;
    line-height: 135%;
}

p {
    font-size: 22px;
    line-height: 145%;
}

.content p{
    font-size:16px;
    line-height:130%;
    font-weight: 300;
}

#hero h1{
    text-shadow: none;
    font-size: 60px;
    line-height: 1.1;
}

.background{
    background-image:url(https://1576449561.rsc.cdn77.org/n3w.it/background_creative.png);
    background-repeat: repeat;
    background-size: contain;
}

.blue{
    background-color:var(--blue);
}

.change-color{
    background-color:#fff;
}

.btn {
	/*border: 1px solid var(--blue);*/
	overflow: hidden;
	color: #f4f4f4;
    pointer-events: auto;
    padding:5px 30px;
}

.btn.active{
    background-color: var(--blue);
    color:#fff;
}

.btn:hover{
  color:#fff;
}


.btn span {
	display: block;
	position: relative;
}

.btn > span {
	overflow: hidden;
}

.btn > span > span {
	overflow: hidden;
    color:var(--blue);
}

.btn:hover > span > span {
	animation: MoveUpInitial 0.2s forwards, MoveUpEnd 0.2s forwards 0.2s;
}


@keyframes MoveUpInitial {
	to {
		transform: translate3d(0,-105%,0);
	}
}

@keyframes MoveUpEnd {
	from {
		transform: translate3d(0,100%,0);
	}
	to {
		transform: translate3d(0,0,0);
	}
}

.btn::before {
	content: '';
	background: #000;
	transition: transform 0.3s cubic-bezier(0.7, 0, 0.2, 1);
	transform-origin: 100% 50%;
}

.btn:hover::before {
	transform: scale3d(0,1,1);
	transform-origin: 0% 50%;
}


a.link, a.link:hover{
  text-decoration:none;
}


.link {
    position: relative;
    white-space: nowrap;
}

.link::before,
.link::after {
    position: absolute;
    width: 100%;
    height: 1px;
    background: currentColor;
    top: 100%;
    left: 0;
    pointer-events: none;
}

.link::before {
    content: '';
    /* show by default */
}

.link::before {
    transform-origin: 100% 50%;
    transform: scale3d(0, 1, 1);
    transition: transform 0.3s;
}

.link:hover::before {
    transform-origin: 0% 50%;
    transform: scale3d(1, 1, 1);
}

h1:before {
  position:absolute;
  content:attr(data-text);
  color:#fff;
  background:var(--blue);
  clip-path: circle(20px at var(--x,-100%) var(--y,-100%));
}

h2{
    color: #d9d9e8;
    font-size: 42px;
    font-weight: bold;
    display: inline-block;
}

h2:before {
  position:absolute;
  content:attr(data-text);
  color:#fff;
  background:var(--blue);
  clip-path: circle(40px at var(--x,-100%) var(--y,-100%));
}

.cursor2 {
  position:fixed;
  width:80px;
  height:80px;
  background:#000;
  border-radius:50%;
  top:0;
  left:0;
  transform:translate(-50%,-50%);
  z-index:-2;
}

.words{
    display: inline;
    text-indent: 10px;
}
.words-1 span{
    position: absolute;
    opacity: 0;
    overflow: hidden;
    animation: rotateWord 6s linear infinite 0s;
}
.words-1 span:nth-child(2) {  
    animation-delay: 2s; 
}
.words-1 span:nth-child(3) {  
    animation-delay: 4s;  
}

@keyframes rotateWord {
    0% { opacity: 0; }
    2% { opacity: 0; transform: translateY(-30px); }
    5% { opacity: 1; transform: translateY(0px);}
    17% { opacity: 1; transform: translateY(0px); }
    20% { opacity: 0; transform: translateY(30px); }
    80% { opacity: 0; }
    100% { opacity: 0; }
}

.smooth.h1{
    font-size:38px;
    font-weight: bold;
    color:var(--blue);
}

.background p{
    color:#fff;
}

header{
    position: relative;
    z-index: 2;
}

.sliding-text-container {
    width: 100%;
    position: relative;
    text-align: center;
    /*      overflow      */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: clip;
    z-index: 1;
    /*background-color: #fff;*/
}

.big-text span {
    display: inline-block;
    font-size: 100px;
    color: #999;
    z-index: 0;
    font-weight: 900;
    animation: marquee 10s linear infinite;
    margin-left:15px;
    padding-left: 30px;
    padding-right: 30px;
}

.big-text a, .big-text-invert a{
    color: #f4f4f4;
    text-decoration:none;
}

.big-text a:hover, .big-text-invert a:hover{
    text-decoration:none;
}

.big-text:hover span, .big-text-invert:hover span{
    animation-play-state:paused;
    color: #ddd;
}

.big-text-invert span {
    display: inline-block;
    font-size: 100px;
    color: #ccc;
    z-index: 0;
    font-weight: 900;
    animation: marquee-invert 10s linear infinite;
    margin-left:15px;
    padding-left: 30px;
    padding-right: 30px;
}

.u-index::after {
    left: 90px;
}
.u-index::after {
    content: "";
    width: 2px;
    background-color: #3C3C77;
    z-index: 1;
    flex: 1;
}

.u-index::before {
    content: attr(data-index);
    /*position: relative;*/
    position: absolute;
    /*color: #2b2f3b;*/
    text-transform: uppercase;
    /*padding: 20px;*/
    padding:0;
    transform: rotate(180deg);
    -ms-transform: rotate(-90deg);
    z-index: 0;
    writing-mode: vertical-rl;
    transform-origin: right top;
    -ms-transform-origin: right top;
}

.linear{
    border-bottom: 1px solid #3C3C77;
    margin-bottom:15px;
}

.linear:last-child{
    border-bottom: 0px solid #3C3C77;
    margin-bottom:15px;
}

.u-index {
    width: 100px;
}

.u-index {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 90px;
    z-index: 1;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    flex-flow: column;
}
        
@keyframes marquee {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-100%);
    }
}

@keyframes marquee-invert {
    0% {
        transform: translateX(-100%);
    }
    100% {
        transform: translateX(0%);
    }
}

.row-marquee img, .row-marquee-inverter img{
    filter: grayscale(100%);
}

.row-marquee:hover img:hover, .row-marquee-inverter:hover img:hover{
    filter:none;
}

.row-marquee:hover img, .row-marquee-inverter:hover img{
    animation-play-state:paused;
}

.row-marquee img{
    float: left;
    width: 25%;
    animation: marquee 20s linear infinite;
    border:8px solid #fff;
}

.row-marquee-inverter img{
    float: left;
    width: 25%;
    animation: marquee-invert 20s linear infinite;
    border:8px solid #fff;
}

.row-marquee, .row-marquee-inverter{
    white-space: nowrap;
    width: 128%;
}


.zoom-img__wrap {
    overflow: hidden;
  }
  
  .zoom-img__img {
    will-change: transform;
  }

  .row:hover .section-col{
    opacity: 0.1;
  }
  
  .section-col{
    transition: opacity 250ms linear;
    margin-bottom:var(--standard);
  }
  .row .section-col:hover{
    opacity: 1;
  }

  .section{
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden;
    cursor: pointer;
  }

  .section-in{
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden;
    cursor: pointer;
  }

  .section-in img,   .section-in video{
    display: block;
    width: 100%;
    height: auto;
    transition: transform 250ms linear;
  }

 .section-in:hover img,  .section-in:hover video{
    transform: scale(1.1) rotate(-3deg);
  }

  .relative{
      position:relative;
  } 
  
  .hover-text{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 100;
    pointer-events: none;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    justify-content: center;
    -ms-flex-pack: center;
    text-align: center;
      -ms-flex-item-align: center;
      align-self: center;
    mix-blend-mode: difference;
  }
  .hover-text h2{
    font-weight: 800;
    font-size: 80px;
    line-height: 1;
    color: #fff;
    opacity: 0;
    transform: scale(0.8);
    transition: transform 250ms linear, opacity 250ms ease;
  }
  .section-col:hover + .hover-text h2{
    opacity: 1;
    transform: scale(1);
  }
  
  @media (max-width: 767px) {
    .section-col{
      -ms-flex: 0 0 100%;
      flex: 0 0 100%;
      max-width: 100%;
    }
    .hover-text h2{
      font-size: 12vw;
    }
  }

@keyframes slide-left {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(100px);
    }
}

@keyframes slide-right {
    0% {
        transform: translateX(-100%);
    }
    100% {
        transform: translateX(0px);
    }
}
  
.caratteristiche ul li{
    font-size:13px;
    font-weight: 300;
}

.caratteristiche ul li:before {
    content: '\f192';
    font-family: 'Font Awesome 5 Pro';
    float: left;
    margin-left: -1.5em;
    color: #ccc;
  }

#smooth-translate{
    /*background-color:aliceblue;*/
}
.blue.sticky-top{
    color:#fff;
}

.blue.sticky-top span{
    opacity:0.5;
}

.section-in{
    border-radius:20px;
}

.pt-0{
    padding-top:0;
}

.pb-0{
    padding-bottom:0;
}

.big-text-invert{
    /*background-color:#ccc;*/
    background: rgba(255,255,255,0.05);
}

#loghi img{
    filter:grayscale(100%);
    opacity:0.4;
    margin-bottom:var(--standard);
    border-radius: 10px;
    background-color: #fff;
    padding: 5px 10px;
}

#loghi img:hover{
    filter:grayscale(0%);
    opacity:1;
}

.sticky-top h2{
    font-size: 24px;
}

.scroll-downs {
    position: absolute;
    top: 0;
    right: 90px;
    bottom: -240px;
    margin: auto;
    
    width :34px;
    height: 55px;
  }
  .mousey {
    width: 4px;
    padding: 10px 15px;
    height: 35px;
    border: 3px solid var(--blue);
    border-radius: 25px;
    opacity: 0.75;
    box-sizing: content-box;
  }
  .scroller {
    width:4px;
    height: 10px;
    border-radius: 25%;
    background-color: var(--blue);
    animation-name: scroll;
    animation-duration: 2.2s;
    animation-timing-function: cubic-bezier(.15,.41,.69,.94);
    animation-iteration-count: infinite;
  }
  @keyframes scroll {
    0% { opacity: 0; }
    10% { transform: translateY(0); opacity: 1; }
    100% { transform: translateY(15px); opacity: 0;}
  }

.content p{
    font-weight:300;
    line-height: 1.8;
}

.slider{
    position: relative;
    z-index: 3;
}

.slider-move{
    transform: rotate(-10deg) scale(115%);
    margin-top: -10%;
}

.relative{
    position:relative;
}

.z-index-1{
    z-index:1;
}

.z-index-3{
    z-index:3;
}

.form-control{
    background-color:transparent !important;
    border:0 !important;
    border-bottom:2px solid aliceblue !important;
    color:#fff !important;
    margin-bottom:15px;
    border-radius:0px !important;
}

textarea.form-control{
    height:100px;
}

.sub-footer{
    background-color:#000;
    color:#fff;
    position: relative;
    z-index: 1;
}

.sub-footer p{
    padding:0;
    margin:0;
    line-height:30px;
    color:#fff;
    font-size:14px;
}

.form-control:focus{
    box-shadow: none;
}


#main-wrapper {
    width: 100%;
    margin: 0 auto;
  }
  
  #box-wrapper {
    position: relative;
  }
  
  #box {
    width: 100%;
    height: 360px;
    overflow: hidden;
    border-radius:10px;
  }

  #box img {
    opacity: 0.2;
  }
  
  img {
      transition: all 2000ms ease-out;
  }
  
  #box:hover img {
      transform: translateY(calc(-100% + 360px));
      opacity: 1;
  }

  .filterDiv {
    text-align: center;
    filter: blur(20px) grayscale(90%);
}

.show {
    filter: blur(0px)  grayscale(0%);
}

.show img{
  -webkit-box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0,0,0,0); 
    box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0,0,0,0);
}

#portfolio{
    /*background-color: aliceblue;*/
}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

#menu_right{
    background: linear-gradient( 180deg, rgba(141, 141, 185, 0.16) 0%, rgba(8, 8, 12, 0) 100% );
    background-color:#141126;
    animation: gradient 10s ease infinite;
    background-size: 400% 400%;
    color:#fff;
    border-left:2px solid #3C3C77;
}

#menu_right .background{
    background-size: contain;
    height: 100%;
}

#menu_right a{
    color:#fff !important;
    font-size:18px
}

#menu_right h3{
    margin-bottom: var(--standard);
}

#menu_right h3 a{
    margin-top:15px;
    font-size:46px;
}

#menu_right h5{
    color:#ccc;
    font-size:24px;
}

#myPortfolio .btn{
    margin-left:5px;
    margin-right:5px;
}

.rotate-slider{
    height:60vh;
    position:relative;
    overflow:hidden
}

.mobile-767{
    display:none;
}

.desktop-767{
    display:block;
}

#contatti{
    background: linear-gradient(180deg, #15152c 0%, #111022 100%);
    border-top:2px solid #3C3C77;
}

#contatti:hover{
    border-top:2px solid var(--yellow);
}

#contatti .col-md-6{
    width:100% !important;
    flex: unset;
    max-width: 100%;
    margin-bottom:var(--standard);
}

#contatti .wpcf7-form-control-wrap, #contatti a, #contatti .text-left{
    color:#fff;
}

#contatti .btn{
    color:#fff;
    font-size: 24px;
}

.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
    border-color: #ffb900;
    background-color: #ffb900;
    color: #fff;
    padding: 5px 30px;
    border-radius: 10px;
}

.wpcf7 form.sent .wpcf7-response-output {
    border-color: #46b450;
    background-color: #46b450;
    color: #fff;
    padding: 5px 30px;
    border-radius: 10px;
}

footer .btn{
    border-color:#fff;
    color:#fff;
}

article img{
    display:none;
}

article, .archive{
    padding-top:var(--double);
    padding-bottom:var(--double);
}

hr {
    max-width: 50px;
    border-width: 3px;
    border-color: var(--blue);
}

article ul li, .content ul li{
    list-style-type: disc;
    font-weight: 300;
}

article ul, .content ul{
    margin-left:var(--double);
}

.blue h1{
    color:#fff;
    font-size:18px;
    margin:0;
}

.caratteristiche ul li h3 {
    font-size: 13px;
    font-weight: 300;
    margin:0;
    color:#fff;
    margin-bottom:5px;
}

.slider{
    transform: rotate(-10deg) scale(115%);
    margin-top: -15%;
}

h3 .link::before, h3 .link::after {
    height: 5px;
}

nav .link::before, nav .link::after {
    height: 2px;
}

footer a:hover{
    color:#fff;
}

#logo {
    height: auto;
    margin-left: -16px;
    width: 80px;
    position: fixed;
}

h1 span, h2 span, h3 span{
    background: var(--gradient-lavender-pink-peach);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.ready-section{
    border-radius: 16px;
    /*background: linear-gradient(180deg, rgba(141, 141, 185, 0.16) 0%, rgba(8, 8, 12, 0) 100%);*/
    background: linear-gradient(180deg, #15152c 0%, #111022 100%);
    backdrop-filter: blur(8px);
    text-align: center;
    padding: 90px 30px;
    border: 1px solid #3C3C77;
}

.animation::before {
    opacity: 0.7;
}
.animation::after, .animation::before {
    content: '';
    position: absolute;
    background-image: conic-gradient( from var(--angle), transparent 88%, #a570ff, #ff6eb2, #ffad66 100% );
    inset:
  -2px;
    z-index: -1;
    border-radius:
  10px;
    animation:
  12s spin linear infinite;
  }

  .animation{
    background: linear-gradient(180deg, #241636 0%, #231530 100%);
    position:relative;
    border: 1px solid #2b183b;
    border-radius: 16px;
  }

  #gallery-center .slick-slide{
    margin-left: 15px;
    margin-right:15px;
  }



.feature-item {
    border-radius: 16px;
    /*background: linear-gradient(180deg, rgba(141, 141, 185, 0.16) 0%, rgba(8, 8, 12, 0) 100%);*/
    background: linear-gradient(180deg, #15152c 0%, #111022 100%);
    border: 2px solid #3C3C77;
    padding: 31px;
}

.feature-item:hover{
    border:2px solid var(--yellow);
}

.grecaptcha-badge{
  display: none !important;
}

@media only screen and (max-width : 1440px){
    #myPortfolio .btn{
        margin-bottom:15px;
    }
}


@media only screen and (max-width : 1200px){
    #logo {
        position: relative;
    }

    .mobile{
      display:block;
  }

  .desktop{
      display:none;
  }

  .words {
    display: block;
    text-indent: 0;
  }
}
 
@media only screen and (max-width : 991px){
	.row-eq-height{
        display:block;
    }

    

    .rotate-slider {
        height: 44vh;
    }

    

}
 
@media only screen and (max-width : 767px){
    .offcanvas{
        width:100%;
    }

    .u-index{
        display: none;
    }

    .caratteristiche ul{
        margin-left:20px;
    }

    .rotate-slider{
        height:40vh;
    }

    .scroll-downs{
        display:none;
    }

    .mobile-767{
        display:block;
    }

    .desktop-767{
        display:none;
    }

    .mobile-767 .section-in{
        border-radius:20px !important;
        margin-bottom:var(--double);
    }

    .slider-move{
        transform: rotate(-10deg) scale(115%);
        margin-top: -20%;
    }

    .row-marquee, .row-marquee-inverter {
        white-space: nowrap;
        width: 145%;
    }

    .big-text span, .big-text-invert span {
        font-size: 77px;
    }

    #hero h1 {
        font-size: 50px;
    }



    h1 br{
        display: none;
    }

}
 
@media only screen and (max-width : 480px){

    .slider-move{
        transform: rotate(-10deg) scale(115%);
        margin-top: -30%;
    }

    .row-marquee, .row-marquee-inverter {
        white-space: nowrap;
        width: 242%;
    }

    .big-text span, .big-text-invert span {
        font-size: 67px;
    }

    #hero p.smooth {
        font-size: 25px;
    }

    .rotate-slider{
        height:30vh;
    }
}
 
@media only screen and (max-width : 320px){
 
}