@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700;800;900&display=swap");@import url("https://use.fontawesome.com/releases/v5.13.0/css/all.css");*{-webkit-box-sizing:border-box;box-sizing:border-box}body{font-family:"Poppins","sans-serif" !important;color:#563d7c;font-size:16px;background-color:#fff;overflow-x:hidden !important}a{color:#fff;text-decoration:none;font-size:inherit}a:focus{outline:none !important;-webkit-box-shadow:none !important;box-shadow:none !important}button{border:0}button:focus{outline:none}ul{list-style:none}.row,container-md,section{overflow-x:hidden !important}.spacer{border:2px solid #c80e13;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.navbar{position:fixed;top:0;left:0;width:100%;z-index:20;background-color:rgba(86,61,124,0.7);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.navbar:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:5px;background-color:transparent;background-image:-webkit-gradient(linear, left top, right top, from(#f2d53c), color-stop(transparent), to(#f2d53c));background-image:linear-gradient(to right, #f2d53c, transparent, #f2d53c)}.navbar.active .brand-logo{-webkit-transition:0.1s ease;transition:0.1s ease;-webkit-transform:translateY(-200%);transform:translateY(-200%)}.navbar.active .menu .bar{-webkit-transform:rotate(360deg);transform:rotate(360deg);background-color:transparent}.navbar.active .menu .bar:before{-webkit-transform:translateY(0) rotate(45deg);transform:translateY(0) rotate(45deg);background-color:#fff}.navbar.active .menu .bar:after{-webkit-transform:translateY(0) rotate(-45deg);transform:translateY(0) rotate(-45deg);background-color:#fff}.navbar-brand{padding-top:0 !important;padding-bottom:0 !important}.brand-logo{-webkit-transform:translateX(0);transform:translateX(0);-webkit-transition:0.4s ease;transition:0.4s ease;height:1.875rem}.menu{cursor:pointer;background-color:transparent;height:1.875rem;width:1.875rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.menu .bar{width:calc(1.875rem - 4px);height:3px;border-radius:3px;background-color:#fff;-webkit-transition:0.5s;transition:0.5s;position:relative}.menu .bar:before,.menu .bar:after{content:'';position:absolute;width:inherit;height:inherit;background-color:#fff;-webkit-transition:0.5s ease;transition:0.5s ease;left:0}.menu .bar:before{-webkit-transform:translateY(calc(3px * 2.5));transform:translateY(calc(3px * 2.5))}.menu .bar:after{-webkit-transform:translateY(calc(3px * -2.5));transform:translateY(calc(3px * -2.5))}.nav-container{position:fixed;top:0;left:0;width:100%;height:100vh;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background-color:rgba(86,61,124,0.9);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);-webkit-transition:0.3s ease;transition:0.3s ease;-webkit-transform:translateX(-100%);transform:translateX(-100%);z-index:15}.nav-container.active{-webkit-transform:translateX(0);transform:translateX(0)}.nav-container.active .nav-link{text-align:center;-webkit-animation:appear 0.5s forwards ease var(--i);animation:appear 0.5s forwards ease var(--i)}.nav-container ul{padding:0;margin:0}.nav-container .nav-link{-webkit-transition:0.3s;transition:0.3s;opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px);-webkit-animation:hide 0.5s forwards ease;animation:hide 0.5s forwards ease}.nav-container .nav-link:hover{color:#bd9dea}.hero{padding-top:calc(1.875rem + 0.5rem);padding-bottom:calc(1.875rem - 1rem);background-image:url("/svg/lower.svg");background-repeat:no-repeat;background-position:bottom;background-size:contain;position:relative;overflow:hidden}.hero:before{content:'';position:absolute;top:0;left:0;height:100%;width:100%;background-image:-webkit-gradient(linear, left bottom, left top, from(#bd9dea), color-stop(#fff), to(#bd9dea));background-image:linear-gradient(to top, #bd9dea, #fff, #bd9dea);z-index:-5}.hero:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:5px;background-color:transparent;background-image:-webkit-gradient(linear, left top, right top, from(#f2d53c), color-stop(transparent), to(#f2d53c));background-image:linear-gradient(to right, #f2d53c, transparent, #f2d53c)}.hero .main-container{height:100%;z-index:10;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.hero .left-container{overflow:hidden}.hero .left-container .content.active .title,.hero .left-container .content.active .description,.hero .left-container .content.active .social-media-container{-webkit-transition:0.7s ease;transition:0.7s ease;-webkit-transform:translateX(0);transform:translateX(0)}.hero .left-container .content.active .btn-success{-webkit-transition:0.7s ease;transition:0.7s ease;-webkit-transform:scale(1);transform:scale(1)}.hero .left-container .title{color:#bd9dea;letter-spacing:2px;font-weight:800;text-shadow:4px 4px 0 rgba(17,17,17,0.9);-webkit-transition:0.3s ease;transition:0.3s ease;-webkit-transform:translateX(200%);transform:translateX(200%)}.hero .left-container .description{-webkit-transition:0.3s ease;transition:0.3s ease;-webkit-transform:translateX(-200%);transform:translateX(-200%)}.hero .left-container .social-media-container{-webkit-transition:-webkit-transform 0.3s ease;transition:-webkit-transform 0.3s ease;transition:transform 0.3s ease;transition:transform 0.3s ease, -webkit-transform 0.3s ease;-webkit-transform:translateX(200%);transform:translateX(200%)}.hero .left-container .social-media-container ul{padding-left:0.25rem;margin-bottom:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.hero .left-container .social-media-container li{text-align:center;margin-right:0.75rem}.hero .left-container .social-media-container i{-webkit-transition:0.3s ease;transition:0.3s ease;color:#563d7c;font-size:1.7rem}.hero .left-container .btn-success{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-transition:0.3s ease;transition:0.3s ease;-webkit-transform:scale(0);transform:scale(0);letter-spacing:1px;text-transform:uppercase}.hero .bottom-row.active .item{-webkit-transition:-webkit-transform 0.7s ease;transition:-webkit-transform 0.7s ease;transition:transform 0.7s ease;transition:transform 0.7s ease, -webkit-transform 0.7s ease;-webkit-transform:scale(1);transform:scale(1)}.hero .bottom-row .item{text-align:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:start;-webkit-perspective:1000px;perspective:1000px;position:relative;-webkit-transition:0.3s ease;transition:0.3s ease;-webkit-transform:scale(0);transform:scale(0)}.hero .bottom-row .item:before{content:'';position:absolute;bottom:40px;left:50%;width:100px;height:100px;background-color:rgba(17,17,17,0.2);border-radius:50%;-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:translateX(-50%) rotateX(70deg);transform:translateX(-50%) rotateX(70deg)}.hero .bottom-row .item img{cursor:pointer;width:100px;height:100px;margin-bottom:1rem;z-index:1;-webkit-transition:0.3s;transition:0.3s;-webkit-transform-origin:center top;transform-origin:center top}.hero .bottom-row .item img.active{-webkit-animation:shake 2s forwards;animation:shake 2s forwards}.hero .bottom-row .item h6{color:#fff;z-index:1}.service .ratio{-webkit-transition:0.3s ease;transition:0.3s ease;-webkit-transform:scale(0);transform:scale(0)}.service .ratio.active{-webkit-transition:0.7s ease;transition:0.7s ease;-webkit-transform:scale(1);transform:scale(1)}.service .row{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.service .left-col{background:url("/img/bg-whitemug.jpg");-webkit-transition:0.3s ease;transition:0.3s ease;-webkit-transform:translateX(-200%);transform:translateX(-200%)}.service .left-col.active{-webkit-transition:0.7s ease;transition:0.7s ease;-webkit-transform:translateX(0);transform:translateX(0)}.service .right-col{background:url("/img/bg-office-supplies.jpg");-webkit-transition:0.3s ease;transition:0.3s ease;-webkit-transform:translateX(200%);transform:translateX(200%)}.service .right-col.active{-webkit-transition:0.7s ease;transition:0.7s ease;-webkit-transform:translateX(0);transform:translateX(0)}.service .left-col,.service .right-col{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background-position:center;background-size:cover;position:relative;z-index:5;color:#fff;height:30rem}.service .left-col:before,.service .right-col:before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(17,17,17,0.3);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:-5}.service .left-col .title,.service .right-col .title{text-align:center;line-height:1.5}.service .center-col{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.service .center-col .item{margin-bottom:1.5rem;position:relative;overflow:hidden}.service .center-col .item:hover .overlay{-webkit-transition:0.5s ease;transition:0.5s ease;-webkit-transform:translateY(0);transform:translateY(0)}.service .center-col .item .overlay{position:absolute;top:0;left:0;height:100%;width:100%;background-color:rgba(17,17,17,0.5);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-transition:0.3s ease;transition:0.3s ease;-webkit-transform:translateY(-200%);transform:translateY(-200%);font-weight:bold;color:#fff}.service .center-col .item:nth-child(1),.service .center-col .item:nth-child(2),.service .center-col .item:nth-child(3),.service .center-col .item:nth-child(4){-webkit-transition:0.3s ease;transition:0.3s ease;-webkit-transform:scale(0);transform:scale(0)}.service .center-col .item:nth-child(1).active,.service .center-col .item:nth-child(2).active,.service .center-col .item:nth-child(3).active,.service .center-col .item:nth-child(4).active{-webkit-transition:0.7s ease;transition:0.7s ease;-webkit-transform:scale(1);transform:scale(1)}.service .center-col .item .img-thumbnail{background-color:#bd9dea;position:relative}.product{background-color:#fff;background-image:-webkit-gradient(linear, left top, right top, from(#bd9dea), color-stop(rgba(189,157,234,0.5)), to(rgba(189,157,234,0.2)));background-image:linear-gradient(to right, #bd9dea, rgba(189,157,234,0.5), rgba(189,157,234,0.2))}.product .carousel .carousel-indicators{margin-bottom:0.5rem !important}.product .carousel .carousel-indicators li{width:10px;height:10px;border-radius:50%;background-color:#563d7c}.product .carousel .carousel-caption{color:#563d7c !important}.product .carousel .carousel-control-prev,.product .carousel .carousel-control-next{top:50%;bottom:0;width:10%;height:10%;border-radius:50% 50%;background-color:#563d7c}.product .carousel .carousel-control-prev i,.product .carousel .carousel-control-next i{font-weight:bolder;color:#fff}.product .carousel img{border-radius:30px}@media (min-width: 481px){.nav-container{width:50%}}@media (min-width: 769px){.nav-container{width:40%}}@media (min-width: 1025px){.hero .btn-success{width:50%}.hero .bottom-row .item:before{content:'';position:absolute;width:150px;height:150px}.hero .bottom-row .item img{cursor:pointer;width:150px;height:150px}.nav-container{width:30%}.service .left-col,.service .right-col{height:25rem}}@-webkit-keyframes appear{from{opacity:0;-webkit-transform:translateX(-60px);transform:translateX(-60px)}to{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes appear{from{opacity:0;-webkit-transform:translateX(-60px);transform:translateX(-60px)}to{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@-webkit-keyframes hide{from{opacity:1;-webkit-transform:translateY(0px);transform:translateY(0px)}to{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px)}}@keyframes hide{from{opacity:1;-webkit-transform:translateY(0px);transform:translateY(0px)}to{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px)}}@-webkit-keyframes shake{0%,10%{-webkit-transform:rotateZ(0deg);transform:rotateZ(0deg)}15%{-webkit-transform:rotateZ(20deg);transform:rotateZ(20deg)}20%{-webkit-transform:rotateZ(-20deg);transform:rotateZ(-20deg)}25%{-webkit-transform:rotateZ(20deg);transform:rotateZ(20deg)}50%{-webkit-transform:rotateZ(-20deg);transform:rotateZ(-20deg)}75%{-webkit-transform:rotateZ(20deg);transform:rotateZ(20deg)}100%{-webkit-transform:rotateZ(0deg);transform:rotateZ(0deg)}}@keyframes shake{0%,10%{-webkit-transform:rotateZ(0deg);transform:rotateZ(0deg)}15%{-webkit-transform:rotateZ(20deg);transform:rotateZ(20deg)}20%{-webkit-transform:rotateZ(-20deg);transform:rotateZ(-20deg)}25%{-webkit-transform:rotateZ(20deg);transform:rotateZ(20deg)}50%{-webkit-transform:rotateZ(-20deg);transform:rotateZ(-20deg)}75%{-webkit-transform:rotateZ(20deg);transform:rotateZ(20deg)}100%{-webkit-transform:rotateZ(0deg);transform:rotateZ(0deg)}}
