
.header{position:fixed;left:0;top:0;right:0;padding:10px 15px;z-index:999;}
.header:before{content:"";position:absolute;left:0;top:0;right:0;bottom:0;background: linear-gradient(to right, var(--color1), transparent, rgba(0,0,0,0.5));opacity:0.75;}
.ifscroll .header{padding:0;background:var(--cwhite);-webkit-box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.3);-moz-box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.3);box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.3);}
.ifscroll .header:before{background:var(--cwhite);}
.header-inner{margin:0 15px 0;}
.ifscroll .header-inner{margin:0 30px;}
.web-title img{position:relative;display:block;width:10vh;height:auto;padding:0;margin:0 10px 0 0;line-height:1;z-index:5;}
.ifscroll .web-title img{width:5vh;}
.web-title h2{font-family: Arial !important;position:relative;font-size:80%;line-height:1;font-weight:normal;margin:38px 0 0;padding:0;letter-spacing:-0.5px;text-transform:uppercase;color:var(--cwhite);text-shadow:1px 1px 2px #000;-webkit-text-stroke:1px transparent;}
.ifscroll .web-title h2{overflow:hidden;font-size:0;margin:0;}
.ifscroll .header .animation-title1{background-image: linear-gradient(-225deg,var(--cblack) 0%,var(--cblack) 29%,var(--cblack) 67%,var(--cblack) 100%);}

.pagetop{position:relative;overflow:hidden;background: linear-gradient(to right, var(--cdark), var(--color1), var(--color3), var(--color1), var(--cdark));}
.pagetop-bg{position:absolute;left:0;top:0;right:0;height:25vh;z-index:10;background: linear-gradient(to top, transparent, var(--cblack));opacity:0.4;}
.pagetop-inner{position:relative;overflow:hidden;margin:0;}
#blog .pagetop-inner, #product .pagetop-inner, #profile .pagetop-inner, #service .pagetop-inner, #category .pagetop-inner{min-height:85vh;background: linear-gradient(to right, var(--color1), var(--color2), var(--color2), var(--color1));}
#blog .pagetop-inner, #profile .pagetop-inner{min-height:60vh;}
#category .pagetop-inner{min-height:50vh;}
#blog .pagetop-inner:after, #product .pagetop-inner:after, #profile .pagetop-inner:after, #service .pagetop-inner:after, #category .pagetop-inner:after{content:"";position:absolute;left:0;top:0;right:0;bottom:0;background-color:transparent;
background-image: url("data:image/svg+xml,%3Csvg width='100' height='20' viewBox='0 0 100 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.184 20c.357-.13.72-.264 1.088-.402l1.768-.661C33.64 15.347 39.647 14 50 14c10.271 0 15.362 1.222 24.629 4.928.955.383 1.869.74 2.75 1.072h6.225c-2.51-.73-5.139-1.691-8.233-2.928C65.888 13.278 60.562 12 50 12c-10.626 0-16.855 1.397-26.66 5.063l-1.767.662c-2.475.923-4.66 1.674-6.724 2.275h6.335zm0-20C13.258 2.892 8.077 4 0 4V2c5.744 0 9.951-.574 14.85-2h6.334zM77.38 0C85.239 2.966 90.502 4 100 4V2c-6.842 0-11.386-.542-16.396-2h-6.225zM0 14c8.44 0 13.718-1.21 22.272-4.402l1.768-.661C33.64 5.347 39.647 4 50 4c10.271 0 15.362 1.222 24.629 4.928C84.112 12.722 89.438 14 100 14v-2c-10.271 0-15.362-1.222-24.629-4.928C65.888 3.278 60.562 2 50 2 39.374 2 33.145 3.397 23.34 7.063l-1.767.662C13.223 10.84 8.163 12 0 12v2z' fill='%23ffffff' fill-opacity='0.15' fill-rule='evenodd'/%3E%3C/svg%3E");}
.graphmod1, .graphmod2{position:absolute;left:-2px;right:-2px;bottom:-25px;z-index:10;overflow:hidden;}
.graphmod1{opacity:0.5;}
.graphmod1 svg, .graphmod2 svg{width:100%;height:auto;display:block;height:auto;}
.graphmod1 svg{fill:var(--cwhite);}
#blog .graphmod1 svg, #blog .graphmod2 svg, #product .graphmod1 svg, #product .graphmod2 svg, #profile .graphmod1 svg, #profile .graphmod2 svg, #service .graphmod1 svg, #service .graphmod2 svg, #category .graphmod1 svg, #category .graphmod2 svg{fill:var(--cwhite);}
.pagetop-info{position:absolute;bottom:0;left:0;width:100%;z-index:7;}
.pagetop-info-bottom{width:80%;margin:0 auto;height:17vh;background:rgba(0,0,0,0.2);border:var(--cwhite) 1px solid;border-radius:15px 15px 0 0;}
.pagetop-info-inner{position:relative;overflow:hidden;text-align:center;height:12vh;}
.pagetop-info-inner h2{padding:0;margin:0;line-height:1.1;font-size:140%;font-weight:bold;color:#54FFF4;text-shadow:1px 1px 2px #000;-webkit-text-stroke:1px transparent;}
.pagetop-info-inner p{padding:0;margin:5px 0 0;line-height:1.1;font-size:100%;font-weight:normal;color:var(--cwhite);text-shadow:1px 1px 2px #000;-webkit-text-stroke:1px transparent;}
.pagetop-info h1{font-family: 'Poppins-Medium', Arial !important;padding:0;margin:0 0 30px;line-height:1.1;font-size:250%;font-weight:bold;color:var(--cwhite);text-shadow:1px 1px 2px #000;-webkit-text-stroke:1px transparent;}
#profile .pagetop-info h1, #service .pagetop-info h1{font-size:400%;}

.menurow{margin:0 0 0 auto;float:right;}
.navbar {
  padding: 0;
}

.navbar ul {
  margin: 0;
  padding: 0;
  display: flex;
  list-style: none;
  align-items: center;
}

.navbar li {
  position: relative;line-height:1.1;padding:0;
}
.navbar a svg{display:block;width:auto;height:22px;padding:0;margin:0 2px 0 0;line-height:1;fill:var(--color3)!important;opacity:0.8;}
.ifscroll .navbar a svg{fill:var(--color1)!important;opacity:0.4;}
.navbar a {
  padding:7px 10px;
  margin:0 0 0 5px;
  font-size: 95%;
  color:var(--cwhite);
  transition: 0.3s;
  line-height:1.1;
  font-weight: normal;
  border-radius:4px;
}
.ifscroll .navbar a {
  color:var(--cblack);
}

.navbar a:hover, .navbar .active, .navbar li:hover > a, .navbar a:focus {
  color:var(--cwhite)!important;
  background:var(--color1);
}
.navbar a:hover svg, .navbar .active svg, .navbar li:hover > a svg{
  opacity:1;
}
.ifscroll .navbar a:hover svg, .ifscroll .navbar .active svg, .ifscroll .navbar li:hover > a svg{
  fill:var(--color3)!important;
}
.navbar .dropdown ul {
  display: block;
  position: absolute;
  left:5px;
  top: calc(100% + 35px);
  margin: 0;
  padding: 15px 15px 10px;
  z-index: 99;
  opacity: 0;min-width:200px;
  visibility: hidden;
  background:transparent;
  box-shadow: none;
  transition: 0.3s;
  border-radius: 0;
}
.navbar .dropdown ul:after{content:"";position:absolute;left:0;top:5px;right:0;bottom:0;background:var(--color1);border-radius:5px;}
.navbar .dropdown ul a {
	position:relative;z-index:3;
  margin:0!important;
  padding:0!important;
  color:var(--color3)!important;line-height:1.1;
}
.navbar .dropdown ul li{padding: 5px 0!important;}
.navbar .dropdown ul a:hover, .navbar .dropdown ul .active:hover, .navbar .dropdown ul li:hover > a {
  color: var(--cwhite)!important;
  background:transparent;
}

.navbar .dropdown:hover > ul {
  opacity: 1;
  top: 100%;
  visibility: visible;
}

.navbar .dropdown .dropdown ul {
  top: 0;
  left: calc(100% - 30px);
  visibility: hidden;
}

.navbar .dropdown .dropdown:hover > ul {
  opacity: 1;
  top: 0;
  left: 100%;
  visibility: visible;
}

.image-product, .image-blogbig, .image-other, .image-top, .image-category{width: 100%;display: block;position: relative;overflow:hidden;background-size:cover;background-repeat:no-repeat;background-position:center;}
.image-product{height:35vh;border-radius:7px;}
.image-blogbig{height:calc(40vh + 10px);border-radius:7px 0 0 7px;}
.image-other{height:20vh;border-radius:7px;}
.image-top{height:85vh;z-index:6;background:var(--color1);}
.image-top img{opacity:0.8;}
.image-category{height:30vh;border-radius:7px;}
.imagefull img, .video-view{display:block;width:100%;height:100%;position: absolute;top: 50%;left: 50%;margin:0 auto;object-fit: cover;-webkit-transform: translate3d(-50%, -50%, 0);-moz-transform: translate3d(-50%, -50%, 0);-ms-transform: translate3d(-50%, -50%, 0);-o-transform: translate3d(-50%, -50%, 0);transform: translate3d(-50%, -50%, 0);}
.imageblur img{opacity:0.5;-webkit-filter: blur(10px);filter: blur(10px);}

.fade-gallery-slider{position:relative;width:100%;max-width:100%;overflow:hidden;margin:0;height:100vh;background-size:cover;background-repeat:no-repeat;}
.fade-gallery-img{position:absolute;top:0;left:0;width:100%;height:100vh;opacity:0;transition:opacity 1s ease-in-out;object-fit:cover;z-index:0}
.fade-gallery-img.active{opacity:1;z-index:1}
.slide-title{position:absolute;left:0;bottom:0;right:0;z-index:5;text-align:center;padding:0 0 6%;background: linear-gradient(to top, var(--cblack), transparent);}
.slide-title h2{font-family: 'Poppins-Medium', Arial !important;font-size:400%;margin:0;padding:0;line-height:1.1;color:var(--cyellow);font-weight:bold;text-shadow:1px 1px 2px #000;-webkit-text-stroke:1px transparent;}
.slide-isi{position:relative;overflow:hidden;margin:15px 25% 0;font-size:100%;padding:0;line-height:1.1;color:var(--cwhite);text-shadow:1px 1px 2px #000;-webkit-text-stroke:1px transparent;}
.slide-title:hover h2{color:var(--color3);}
.slide-title:hover p{color:var(--cyellow);}

.profile-area{position:relative;margin:-1px 0 0;}
.profile-area:before{content:"";position:absolute;left:0;top:0;right:0;height:20vh;background: linear-gradient(to right, var(--cdark) 0%, var(--color1) 25%, var(--color2) 50%, var(--color1) 75%, var(--cdark) 100%);}
.profile-box{position:relative;background:var(--cgrey1);padding:6vh 5% 8vh;border-radius:10px;margin:8vh 7% 0;z-index:2;border:var(--color1) 1px solid;}
.profile-head{margin:0 0 5vh;}
.profile-head h1, .module-head h1{position:relative;font-family: 'Poppins-Medium', Arial !important;font-size:180%;margin:0;padding:0;line-height:1;letter-spacing:-1px;}
.profile-head h1:after, .module-head h1:after{content:"";position:absolute;bottom:-3px;left:50%;height:2px;width:100%;background:var(--cyellow);-webkit-transform: translate3d(-50%, 0, 0);-ms-transform: translate3d(-50%, 0, 0);-o-transform: translate3d(-50%, 0, 0);transform: translate3d(-50%, 0, 0);}
.profile-col{position:relative;width:calc(25% - 20px);margin:0 10px;}
.profile-icon{position:relative;width:16vh;height:16vh;border-radius:50%;margin:-5vh auto 0;background:var(--cwhite);border:var(--color1) 1px solid;z-index:3;}
.profile-icon img{display:block;width:7vh;height:auto;line-height:1;}
.profile-inner{position:relative;overflow:hidden;margin:-8vh auto 0;padding:8vh 20px 60px;background: linear-gradient(to top, var(--color2) 35%, var(--color1));border-radius:7px;}
.profile-col:hover .profile-inner{background: var(--color1)}
.profile-inner:after{content:"";position:absolute;left:0;top:0;right:0;bottom:0;background-color:transparent;
background-image: url("data:image/svg+xml,%3Csvg width='100' height='20' viewBox='0 0 100 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.184 20c.357-.13.72-.264 1.088-.402l1.768-.661C33.64 15.347 39.647 14 50 14c10.271 0 15.362 1.222 24.629 4.928.955.383 1.869.74 2.75 1.072h6.225c-2.51-.73-5.139-1.691-8.233-2.928C65.888 13.278 60.562 12 50 12c-10.626 0-16.855 1.397-26.66 5.063l-1.767.662c-2.475.923-4.66 1.674-6.724 2.275h6.335zm0-20C13.258 2.892 8.077 4 0 4V2c5.744 0 9.951-.574 14.85-2h6.334zM77.38 0C85.239 2.966 90.502 4 100 4V2c-6.842 0-11.386-.542-16.396-2h-6.225zM0 14c8.44 0 13.718-1.21 22.272-4.402l1.768-.661C33.64 5.347 39.647 4 50 4c10.271 0 15.362 1.222 24.629 4.928C84.112 12.722 89.438 14 100 14v-2c-10.271 0-15.362-1.222-24.629-4.928C65.888 3.278 60.562 2 50 2 39.374 2 33.145 3.397 23.34 7.063l-1.767.662C13.223 10.84 8.163 12 0 12v2z' fill='%23ffffff' fill-opacity='0.15' fill-rule='evenodd'/%3E%3C/svg%3E");}
.profile-inner h2{font-size:110%;margin:40px auto 0;padding:0;line-height:1.1;color:var(--cwhite);text-shadow:1px 1px 2px #000;-webkit-text-stroke:1px transparent;}

.service-area{position:relative;overflow:hidden;margin:10vh 0 0;padding:18vh 10%;border-radius:10px;}
.service-area:after{content:"";position:absolute;left:0;top:0;right:0;bottom:0;background:var(--cdark);opacity:0.55;}
.service-inner{position:relative;z-index:5;}
.service-col{position:relative;width:calc(50% - 40px);margin:0 20px;}
.service-item{margin:0 auto;}
.service-item h2{font-family: 'Poppins-Medium', Arial !important;font-size:180%;margin:0;padding:0;line-height:1.1;color:var(--cyellow);font-weight:bold;text-shadow:1px 1px 2px #000;-webkit-text-stroke:1px transparent;}
.service-col:hover .service-item h2{color:var(--color3);}
.service-isi{font-family:Arial !important;font-size:90%;margin:0;padding:0;line-height:1.1;color:var(--cwhite);text-shadow:1px 1px 2px #000;-webkit-text-stroke:1px transparent;}
.service-icon{min-width:14vh!important;min-height:14vh!important;max-width:14vh!important;max-height:14vh!important;margin:0 10px 0 0;}

.product-area{position:relative;overflow:hidden;margin:10vh 0 0;}
.product-image{position:relative;overflow:hidden;border-radius:7px;padding:5px;background: linear-gradient(to top, var(--color1), var(--color3));border:var(--color1) 1px solid;z-index:2;}
.producthome-title{position:relative;overflow:hidden;margin-top:-8px;background: linear-gradient(to top, transparent, var(--cgrey3));padding:8px 0 0;}
.producthome-title:after{content:"";position:absolute;top:7px;border-top:var(--color1) 10px solid;border-left:transparent 10px solid;border-right:transparent 10px solid;left:50%;-webkit-transform: translate3d(-50%, 0, 0);-ms-transform: translate3d(-50%, 0, 0);-o-transform: translate3d(-50%, 0, 0);transform: translate3d(-50%, 0, 0);}
.producthome-title h2{font-size:110%;margin:20px 0 0;padding:0;line-height:1.2;font-weight:bold;color:var(--cblack);}
.carousel-cell:hover .producthome-title h2{color:var(--cdark);}
.dotted{position:absolute;left:0;top:0;right:0;bottom:0;}
.table-product td{font-size:100%!important;border:none!important;padding:15px 0!important;margin:0!important;line-height:1.1!important;vertical-align:top;border-bottom:#bdbdbd 1px dotted!important;}

.blog-box{margin:10vh 7% 0;}
.blog-primary{position:relative;width:calc(60% - 20px);margin:0 10px;background:var(--cblack);border-radius:7px;}
.blog-primary-image{position:relative;width:70%;}
.blog-primary-image:after{content:"";position:absolute;right:-1px;top:0;bottom:0;left:0;background: linear-gradient(to right, transparent 40%, var(--cblack));}
.blog-primary-title{position:relative;width:55%;margin-left:-25%;}
.blog-primary-title h2{font-size:160%;margin:0;padding:0;line-height:1.1;font-weight:bold;color:var(--cyellow);}
.blog-primary-title p{font-size:90%;margin:0;padding:0;line-height:1.1;font-weight:normal;color:var(--cgrey1);}
.blog-other{position:relative;width:calc(40% - 20px);margin:0 10px;}
.blog-other-item:nth-child(1){display:none;}
.blog-other-image{position:relative;width:calc(40% - 10px);margin:0 5px;}
.blog-other-title{position:relative;width:calc(60% - 10px);margin:0 5px;padding:15px 0;}
.blog-other-title h2{font-size:110%;margin:0;padding:0;line-height:1.1;font-weight:bold;color:var(--cblack)}
.blog-other-title p{font-size:90%;margin:0;padding:0;line-height:1.1;font-weight:normal;color:var(--color1)}
.blog-other-item:hover .blog-other-title h2{color:var(--color1)}
.blog-primary:hover .blog-primary-title h2{color:var(--cwhite)}

.data-content{position:relative;overflow:hidden;}
.main-image{float:right;vertical-align:text-top;width:45%;margin:0 0 10px 15px;padding:5px;border:#bdbdbd 1px solid;border-radius:7px;}
.main-image img{display:block;width:100%;height:auto;border-radius:7px;}

.category-top{position:absolute;left:0;bottom:0;right:0;padding:2vh 0 10vh;}
.category-top:before{content:"";position:absolute;left:0;bottom:0;right:0;top:0;background: linear-gradient(to top, var(--cdark), transparent);}
.category-top h2{position:relative;padding:0;margin:0 0 10px;line-height:1.1;font-size:140%;font-weight:bold;color:var(--color3);text-shadow:1px 1px 2px #000;-webkit-text-stroke:1px transparent;z-index:3;}
.category-top h1{position:relative;font-family: 'Poppins-Medium', Arial !important;padding:0;margin:0;line-height:1.1;font-size:400%;font-weight:bold;color:var(--cwhite);text-shadow:1px 1px 2px #000;-webkit-text-stroke:1px transparent;z-index:3;}
.category-col{position:relative;width:calc(33.33333333% - 20px);margin:30px 10px 0;text-align:center;}
.image-category-box{position:relative;overflow:hidden;padding:5px;border:#bdbdbd 1px solid;border-radius:7px;}
.category-col h2{display:block;padding:0;margin:10px 0 0;line-height:1.1;font-size:110%;font-weight:bold;color:var(--cblack);}
.category-col:hover h2{color:var(--cdark);}

.content-isi h1,.content-isi h2,.content-isi h3,.content-isi h4,.content-isi h5,.content-isi h6,.content-isi p {line-height:1.5;display:block;}
.content-isi h1,.content-isi h2,.content-isi h3,.content-isi h4,.content-isi h5,.content-isi h6,.content-isi p{margin:0 0 15px;}
.content-isi ul{margin:0 0 20px 40px;line-height:1.2;padding:0;}
.content-isi li{margin:0 0 10px 0;line-height:1.2;padding:0;}
.content-isi .table, .content-isi table{width:100% !important;}
.content-isi .box{padding:0 0 10px !important;}
.content-isi hr {margin-top: 5px !important;margin-bottom: 5px !important;border:none !important;}

.carousel {background:transparent;}
.carousel-cell {width: 100%;counter-increment: gallery-cell;cursor:default;}
.product-area .carousel-cell{width:calc(33.33333333% - 15px);margin:0 10px;text-align:center;}
.flickity-enabled {position: relative;}
.flickity-enabled:focus { outline: none;}
.flickity-viewport {position: relative;height: 100%;overflow:hidden;}
.flickity-slider {position: absolute;width: 100%;height: 100%;}
.flickity-enabled.is-draggable {-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.flickity-enabled.is-draggable .flickity-viewport {cursor: move;cursor: -webkit-grab;cursor: grab;}
.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {cursor: -webkit-grabbing;cursor: grabbing;}
.flickity-prev-next-button {position: absolute;top:0;width: 30px;height: 30px;border:none;background-color:transparent;background-position: center;background-repeat: no-repeat;cursor: pointer;z-index:10;}
.flickity-prev-next-button:disabled {filter: alpha(opacity=0); /* IE8 */opacity: 0;cursor: auto;}
.flickity-prev-next-button svg {display:none;}
.flickity-page-dots {display:none;}
.flickity-prev-next-button{background-repeat:no-repeat !important;top:50%;-webkit-transform: translate3d(0, -50%, 0);-moz-transform: translate3d(0, -50%, 0);-ms-transform: translate3d(0, -50%, 0);-o-transform: translate3d(0, -50%, 0);transform: translate3d(0, -50%, 0);}
.product-box .flickity-prev-next-button{width:34px;height:34px;border-radius:50%;background-color:var(--color1);background-size:25% auto;margin-top:-15px!important;}
.flickity-prev-next-button.previous{background-position: center;background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");}
.flickity-prev-next-button.next{background-position: center;background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");}
.product-box .flickity-prev-next-button.next{right:-10px;}
.product-box .flickity-prev-next-button.previous{left:-10px;}

.footer-area{position:relative;overflow:hidden;margin:15vh 0 0;border-top:var(--color2) 5px solid;background: linear-gradient(to right, var(--color1), var(--color2), var(--color2), var(--color1));}
.footer-bg{position:absolute;left:0;top:0;right:0;bottom:0;font-size:600%;font-family: 'Poppins-Medium', Arial !important;letter-spacing:-5px;opacity:0.1;font-weight:bold;white-space: nowrap;}
.footer-bg marquee{margin-top:-5vh;}
.footer-inner{position:relative;overflow:hidden;margin:0;padding:10vh 0 17vh;background: linear-gradient(to right, var(--cdark), transparent, var(--cdark));}
.copyright{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,0.2);}
.copyright-item{height:7vh;font-size:85%;margin:0 auto;color:var(--color3);font-weight:normal;line-height:1;display:block;}
.footer-left{width:35%;float:left;}
.footer-right{width:35%;float:right;}
.footer-inner h2, .footer-inner p{font-size:100%;margin:0;padding:0;line-height:1.1;font-weight:bold;color:var(--cgrey1);text-shadow:1px 1px 2px #000;-webkit-text-stroke:1px transparent;}
.footer-inner p{font-weight:normal;font-size:90%;}
.footer-inner svg{width:24px;height:auto;fill:var(--color2);}

.bottom-tombol{position:fixed;right:15px;z-index:800;bottom:20px;}
#ScrollToTop{width:30px;height:0;cursor:pointer;margin-top:0;border-radius:3px;opacity:1!important;overflow:hidden;}
.ifscroll #ScrollToTop{height:30px;margin-top:3px!important;background:var(--color2);}
#ScrollToTop svg{width:22px;height:auto;display:block;margin:0;padding:0;line-height:1;fill:var(--cwhite);}

.animation-title1{background-size: auto auto;background-clip: border-box;background-size: 200% auto;background-clip: text;text-fill-color: transparent;-webkit-background-clip: text;-webkit-text-fill-color: transparent;animation:textclip 6s linear infinite;background-image: linear-gradient(-225deg,var(--cgrey2) 0%,var(--cwhite) 29%,var(--cgrey2) 67%,var(--cwhite) 100%);}

.animation-title-dark{background-size: auto auto;background-clip: border-box;background-size: 200% auto;background-clip: text;text-fill-color: transparent;-webkit-background-clip: text;-webkit-text-fill-color: transparent;animation:textclip 6s linear infinite;background-image: linear-gradient(-225deg,var(--color1) 0%,var(--cblack) 29%,var(--color1) 67%,var(--cblack) 100%);}

.marquee {
  position: relative;
  width: 100vw;
  max-width: 100%;
  overflow-x: hidden;
}

.track {
  white-space: nowrap;
  will-change: transform;
  animation: marquee 10s linear infinite;
}

@keyframes marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

.title-site{position:relative;}
.ifscroll .title-site{margin-top:0;}

.textwater h1 {
	font-family: 'Poppins-Medium', Arial !important;
	color: #fff;
	font-size: 180%;
	font-weight:bold;
	position: absolute;
	left:0;
	top:0;
}
.ifscroll .textwater h1 {font-size: 140%;top:50%;-webkit-transform: translate3d(0, -50%, 0);-moz-transform: translate3d(0, -50%, 0);-ms-transform: translate3d(0, -50%, 0);-o-transform: translate3d(0, -50%, 0);transform: translate3d(0, -50%, 0);}
.textwater h1:nth-child(1) {color: var(--color3);}
.ifscroll .textwater h1:nth-child(1) {color: var(--color1);}
.textwater h1:nth-child(2) {color: var(--color1);animation: animate 4s ease-in-out infinite;opacity:0.55;}
.ifscroll .textwater h1:nth-child(2) {color: var(--cwhite);opacity:0.65;}

@keyframes animate {
	0%,
	100% {
		clip-path: polygon(
			0% 45%,
			16% 44%,
			33% 50%,
			54% 60%,
			70% 61%,
			84% 59%,
			100% 52%,
			100% 100%,
			0% 100%
		);
	}

	50% {
		clip-path: polygon(
			0% 60%,
			15% 65%,
			34% 66%,
			51% 62%,
			67% 50%,
			84% 45%,
			100% 46%,
			100% 100%,
			0% 100%
		);
	}
}

@-webkit-keyframes textclip {to {background-position: 200% center;}}
@-moz-keyframes textclip {to {background-position: 200% center;}}
@keyframes textclip {to {background-position: 200% center;}}
@-o-keyframes textclip {to {background-position: 200% center;}}