h1,h2,h3,h4,h5,h6,p,span,ul,li,a,.btn-default,textarea { margin: 0; padding: 0; } * { margin: 0; padding: 0; } a { text-decoration: none !important; } a:hover { text-decoration: none; } a:focus { text-decoration: none; } body { overflow-x: hidden; /* font-family: 'Poppins', sans-serif; */ } /*----------------------------------------Push Navigation---------------------------------*/ div#menuoverlay { display: none; } a#hamburg { position: fixed; top: 10px; left: 10px; width: 40px; height: 40px; z-index: 9999999; text-align: center; color: white; display: none; transition: all ease-out 0.3s; } a#hamburg i { position: relative; top: 50%; transform: translateY(-50%); } .nav1 { transition: all ease-out 0.3s; display: none; } .nav1 a { color: #fff; font-size: 13px; } .nav1 ul { margin: 0; padding: 0; background-color: #303030; } .nav1 ul li { display: inline-block; position: relative; } .nav1 ul li>a { display: inline-block; padding: 10px; } .nav1 ul li>a>i { margin-left: 15px; transition: all ease-out 0.3s; -webkit-transition: all ease-out 0.1s; } .nav1 ul li ul { display: none; position: absolute; top: 38px; background: #222; width: 200px; text-align: left; } .nav1 .search-nav,.nav1 .title { display: none; } .nav1 ul li ul li { display: block; } .nav1 ul li ul li a { display: block; } .nav1 ul li:hover>a { color: #000; text-decoration: none; } .nav1 ul li:hover>a>i { transform: rotateZ(90deg); } .nav1 ul li:hover ul { display: block; } .nav1 span.marrow { border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #fff; float: right; height: 0; margin: 8px 0 0 8px; width: 0; } .nav1 ul li.open span.marrow { border-left: 5px solid transparent; border-top: 0; border-right: 5px solid transparent; border-bottom: 5px solid #fff; } @media screen and (max-width:991px) { a#hamburg { display: block; } main { transition: all ease-out 0.3s; } .nav1 .row { margin: 0px; } .nav1 { background: black; box-shadow: -2px 0 0px #f9d707 inset; display: block; height: 100%; left: 0; overflow-x: hidden; overflow-y: auto; position: fixed; top: 0; transform: translateX(-250px); width: 250px; } .nav1 .search-nav,.nav1 .title { display: block; } .nav1 .search-nav input { border: 1px solid #2c313f; background-color: rgba(255, 255, 255, 0.2); padding: 5px; width: 100%; color: #000; margin: 10px 0; } .nav1 .search-nav input[type="submit"] { background: url("images/search-icon.png") no-repeat scroll center center; border: 0; width: auto; font-size: 0; height: 16px; position: absolute; right: 7px; top: 8px; width: 16px; filter: invert(100%); } .nav1 .title { background: #000; color: #fff; font-size: 14px; margin: 0 -15px; padding: 6px 15px 6px; } .search-nav>form { position: relative; } .nav1 a:hover { color: #0c73b4; text-decoration: none; } .nav1 ul { text-align: left; background-color: transparent; margin-top: 50px; } .nav1 ul li { display: block; border-bottom: 1px solid #999; } .nav1 ul li a { display: block; padding: 10px 0; } .nav1 ul li:hover>a { color: #0c73b4; } .nav1 ul li a>i { float: right; } .nav1 ul li ul { display: none; position: static; width: 100%; background-color: transparent; padding: 0 10px; } .nav1 ul li:hover>ul { display: none; } .nav1 ul li:hover>a>i { transform: rotateZ(0); } .nav1 ul li.open>a { background-color: transparent; } .nav1 ul li.open>a>i { transform: rotateZ(90deg); } .nav1 ul li.open>ul { display: block; } div#menuoverlay { display: block; visibility: hidden; position: fixed; left: 0; top: 0; width: 100%; height: 100%; transition: all ease-out 0.3s; z-index: 1; opacity: 0; } html.open-menu { overflow: hidden; } html.open-menu div#menuoverlay { visibility: visible; background: rgba(0, 0, 0, 0.5); min-height: 100vh; width: 100% !important; opacity: 1; width: calc(-150%); left: 250px; } html.open-menu a#hamburg { transform: translateX(250px); z-index: 999; } html.open-menu main { transform: translateX(250px); } html.open-menu nav.nav1 { z-index: 3; transform: translateX(0); } .menu-main-menu-container ul ul ul li a { padding: 5px; } ul li.has-subnav .accordion-btn { color: #000; font-size: 24px; width: 20px !important; float: right; line-height: inherit !important; } .nav1 ul li:last-child { border: 0; } .nav-cross.open>span { background: #f9d707; } /*---------------------Hamberg Icon --------------------------------------------- */ .nav-cross { width: 24px; height: 40px; position: relative; margin: 0px auto; transform: rotate(0deg); transition: .5s ease-in-out; cursor: pointer; } .nav-cross span { display: block; position: absolute; height: 3px; width: 100%; background: #f9d707; opacity: 1; left: 0; transform: rotate(0deg); transition: .25s ease-in-out; } #nav-icon1 span:nth-child(1) { top: 0px; } #nav-icon1 span:nth-child(2) { top: 18px; } #nav-icon1 span:nth-child(3) { top: 36px; } #nav-icon1.open span:nth-child(1) { top: 18px; transform: rotate(135deg); } #nav-icon1.open span:nth-child(2) { opacity: 0; left: -60px; } #nav-icon1.open span:nth-child(3) { top: 18px; transform: rotate(-135deg); } .nav-cross span:nth-child(1) { top: 12px; transform-origin: left center; } .nav-cross span:nth-child(2) { top: 20px; transform-origin: left center; } .nav-cross span:nth-child(3) { top: 28px; transform-origin: left center; } .nav-cross.open span:nth-child(1) { transform: rotate(45deg); top: 11px; left: 4px; } .nav-cross.open span:nth-child(2) { width: 0%; opacity: 0; } .nav-cross.open span:nth-child(3) { transform: rotate(-45deg); top: 28px; left: 4px; } } /*---------------------------------- Slick SLider----------------------------------------------------*/ .main-slider,.item-slider,.client,.thumb-slider { display: none; } .item-slider.slick-initialized,.thumb-slider.slick-initialized,.client.slick-initialized,.main-slider.slick-initialized { display: block !important; } .slider { position: relative; clear: left; overflow: hidden; } .slider .inner-item { height: 756px; } .slider .container { position: relative; } .slick-slide .caption { color: #fff; font-size: 1.2em; line-height: 1.2em; position: absolute; left: 10%; text-shadow: 2px 2px 2px #000; top: 37%; width: 35%; background: rgba(0, 0, 0, 0.7); padding: 20px 20px 0; z-index: 99; } .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .thumb-slider .slick-slide { margin: 5px 0 0 5px; } .slider-thumb .thumb-slider .slick-slide img { max-width: 100%; height: auto; box-sizing: border-box; } .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track,.slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; display: block; } .slick-track:before,.slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; height: 100%; min-height: 1px; position: relative; } [dir='rtl'] .slick-slide { float: right; } .slick-slide img { display: block; transition: all .25s ease; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } .slick-dots { position: absolute; z-index: 11; bottom: -30px; margin: 0px; padding: 0; text-align: center; width: 100%; } .slick-dots li { list-style: none; display: inline-block; } .slick-dots button { border: 1px solid #333; background: #fff; width: 12px; height: 12px; border-radius: 100%; font-size: 0; padding: 0px; margin-right: 5px; } .slick-dots .slick-active button { background: red; } .slick-arrow { border: 0px; font-size: 0; right: 0; margin-top: -20px; position: absolute; top: 50%; z-index: 1; background: #303030 url(images/right-arrow.png) no-repeat center center; width: 36px; height: 40px; /*transform: rotate(180deg)*/ } .services-slider .slick-arrow { height: 65px; } .slick-arrow:hover { background: #000 url(images/right-arrow.png) no-repeat center center; } .slick-next.slick-arrow { transform: rotate(0deg)} .slider-progress { width: 100%; height: 5px; background: rgba(0, 216, 192, 0.8); position: absolute; top: 0; z-index: 99; } .slider-progress .progress { width: 0%; height: 5px; background: rgba(36, 51, 0, 0.8); } .thumb-slider .slick-active img { border: 1px solid transparent; } .thumb-slider .slick-current img { opacity: 0.5; } /* custom css */ .baselineRow { display: flex; align-items: baseline; } .centerRow { display: flex; align-items: center; } section { padding: 50px 0; } marquee { width: 100%; height: 170px; display: flex; align-items: center; } marquee .animatedTxt { margin: 0; font-size: 120px; text-transform: uppercase; color: transparent; -webkit-text-stroke: 1px #dddd; } marquee .animatedTxt span { -webkit-text-stroke: 1px #ff000057; } /* slider css */ .word { /* font-family: 'Anton', sans-serif; */ perspective: 1000px; } .word span { cursor: pointer; display: inline-block; font-size: 95px; user-select: none; line-height: 1; text-transform: uppercase; } .evenword { cursor: pointer; display: inline-block; font-size: 75px; user-select: none; line-height: 1; color: #fff; text-transform: uppercase; } .darktext { color: #fff; font-family: 'Conv_Poppins-Regular', sans-serif; font-size: 16px; margin-bottom: 15px; line-height: 1.6; } .word.even { color: #fff; -webkit-text-stroke: 0px; } .word span:nth-child(1) { color: transparent; -webkit-text-stroke: 1px #fff; } .word span:nth-child(2) { color: transparent; -webkit-text-stroke: 1px #fff; } .word span:nth-child(3) { color: transparent; -webkit-text-stroke: 1px #fff; } .word span:nth-child(4) { color: transparent; -webkit-text-stroke: 1px #fff; } .word span:nth-child(5) { color: transparent; -webkit-text-stroke: 1px #fff; } .word span:nth-child(6) { color: transparent; -webkit-text-stroke: 1px #fff; } .word span:nth-child(7) { color: transparent; -webkit-text-stroke: 1px #fff; } .word span:nth-child(8) { color: transparent; -webkit-text-stroke: 1px #fff; } .word span:nth-child(9) { color: transparent; -webkit-text-stroke: 1px #fff; } .word span:nth-child(10) { color: transparent; -webkit-text-stroke: 1px #fff; } .word span:nth-child(11) { color: transparent; -webkit-text-stroke: 1px #fff; } .word span:nth-child(12) { color: transparent; -webkit-text-stroke: 1px #fff; } .word span:nth-child(1).active { animation: balance 1.5s ease-out; transform-origin: bottom left; } @keyframes balance { 0%,100% { transform: rotate(0deg); } 30%,60% { transform: rotate(-45deg); } } .word span:nth-child(2).active { animation: shrinkjump 1s ease-in-out; transform-origin: bottom center; } @keyframes shrinkjump { 10%,35% { transform: scale(2, .2) translate(0, 0); } 45%,50% { transform: scale(1) translate(0, -150px); } 80% { transform: scale(1) translate(0, 0); } } .word span:nth-child(3).active { animation: falling 2s ease-out; transform-origin: bottom center; } @keyframes falling { 12% { transform: rotateX(240deg); } 24% { transform: rotateX(150deg); } 36% { transform: rotateX(200deg); } 48% { transform: rotateX(175deg); } 60%,85% { transform: rotateX(180deg); } 100% { transform: rotateX(0deg); } } .word span:nth-child(4).active { animation: rotate 1s ease-out; } @keyframes rotate { 20%,80% { transform: rotateY(180deg); } 100% { transform: rotateY(360deg); } } .word span:nth-child(5).active { animation: toplong 1.5s linear; } @keyframes toplong { 10%,40% { transform: translateY(-48vh) scaleY(1); } 90% { transform: translateY(-48vh) scaleY(4); } } .word span:nth-child(6).active { animation: balance 1.5s ease-out; transform-origin: bottom left; } @keyframes balance { 0%,100% { transform: rotate(0deg); } 30%,60% { transform: rotate(-45deg); } } .word span:nth-child(7).active { animation: shrinkjump 1s ease-in-out; transform-origin: bottom center; } @keyframes shrinkjump { 10%,35% { transform: scale(2, .2) translate(0, 0); } 45%,50% { transform: scale(1) translate(0, -150px); } 80% { transform: scale(1) translate(0, 0); } } .word span:nth-child(8).active { animation: falling 2s ease-out; transform-origin: bottom center; } @keyframes falling { 12% { transform: rotateX(240deg); } 24% { transform: rotateX(150deg); } 36% { transform: rotateX(200deg); } 48% { transform: rotateX(175deg); } 60%,85% { transform: rotateX(180deg); } 100% { transform: rotateX(0deg); } } .word span:nth-child(9).active { animation: rotate 1s ease-out; } @keyframes rotate { 20%,80% { transform: rotateY(180deg); } 100% { transform: rotateY(360deg); } } .word span:nth-child(10).active { animation: toplong 1.5s linear; } @keyframes toplong { 10%,40% { transform: translateY(-48vh) scaleY(1); } 90% { transform: translateY(-48vh) scaleY(4); } } .word span:nth-child(11).active { animation: balance 1.5s ease-out; transform-origin: bottom left; } .secondHeading { position: relative; margin: 0; padding-left: 10px; margin-bottom: 15px; font-size: 40px; line-height: 1.3; color: #000; text-transform: capitalize; font-family: 'Conv_Poppins-Regular', sans-serif !important; } .secondHeading:before { content: ""; background-color: red; width: 15px; position: absolute; top: -5px; left: -20px; bottom: -12px; animation: scroll 2s infinite; } .secondHeading .word { /* font-family: 'Anton', sans-serif; */ perspective: 1000px; } .secondHeading .word span { cursor: pointer; display: inline-block; font-size: 55px; user-select: none; line-height: 1; text-transform: initial; } .secondHeading .evenword { cursor: pointer; display: inline-block; font-size: 65px; user-select: none; line-height: 1; color: #000; text-transform: capitalize; } .subtitleLight { margin: 0 0 15px 0; font-size: 70px; line-height: 1.2; color: #000; text-transform: capitalize; letter-spacing: 2px; } .secondHeading .darktext { color: #fff; font-family: 'poppins', sans-serif; font-size: 16px; margin-bottom: 15px; } .secondHeading .word.even { color: #000; -webkit-text-stroke: 0px; } .secondHeading .word span:nth-child(1) { color: black; -webkit-text-stroke: 1px #000; } .secondHeading .word span:nth-child(2) { color: black; -webkit-text-stroke: 1px #000; } .secondHeading .word span:nth-child(3) { color: black; -webkit-text-stroke: 1px #000; } .secondHeading .word span:nth-child(4) { color: black; -webkit-text-stroke: 1px #000; } .secondHeading .word span:nth-child(5) { color: black; -webkit-text-stroke: 1px #000; } .secondHeading .word span:nth-child(6) { color: black; -webkit-text-stroke: 1px #000; } .secondHeading .word span:nth-child(7) { color: black; -webkit-text-stroke: 1px #000; } .secondHeading .word span:nth-child(8) { color: transparent; -webkit-text-stroke: 1px #fff; } .secondHeading .word span:nth-child(9) { color: transparent; -webkit-text-stroke: 1px #fff; } .secondHeading .word span:nth-child(10) { color: transparent; -webkit-text-stroke: 1px #fff; } .secondHeading .word span:nth-child(11) { color: transparent; -webkit-text-stroke: 1px #fff; } .secondHeading .word span:nth-child(1).active { animation: balance 1.5s ease-out; transform-origin: bottom left; } @keyframes balance { 0%,100% { transform: rotate(0deg); } 30%,60% { transform: rotate(-45deg); } } .secondHeading .word span:nth-child(2).active { animation: shrinkjump 1s ease-in-out; transform-origin: bottom center; } @keyframes shrinkjump { 10%,35% { transform: scale(2, .2) translate(0, 0); } 45%,50% { transform: scale(1) translate(0, -150px); } 80% { transform: scale(1) translate(0, 0); } } .secondHeading .word span:nth-child(3).active { animation: falling 2s ease-out; transform-origin: bottom center; } @keyframes falling { 12% { transform: rotateX(240deg); } 24% { transform: rotateX(150deg); } 36% { transform: rotateX(200deg); } 48% { transform: rotateX(175deg); } 60%,85% { transform: rotateX(180deg); } 100% { transform: rotateX(0deg); } } .secondHeading .word span:nth-child(4).active { animation: rotate 1s ease-out; } @keyframes rotate { 20%,80% { transform: rotateY(180deg); } 100% { transform: rotateY(360deg); } } .secondHeading .word span:nth-child(5).active { animation: toplong 1.5s linear; } @keyframes toplong { 10%,40% { transform: translateY(-48vh) scaleY(1); } 90% { transform: translateY(-48vh) scaleY(4); } } .secondHeading .word span:nth-child(6).active { animation: balance 1.5s ease-out; transform-origin: bottom left; } @keyframes balance { 0%,100% { transform: rotate(0deg); } 30%,60% { transform: rotate(-45deg); } } .secondHeading .word span:nth-child(7).active { animation: shrinkjump 1s ease-in-out; transform-origin: bottom center; } @keyframes shrinkjump { 10%,35% { transform: scale(2, .2) translate(0, 0); } 45%,50% { transform: scale(1) translate(0, -150px); } 80% { transform: scale(1) translate(0, 0); } } .secondHeading .word span:nth-child(8).active { animation: falling 2s ease-out; transform-origin: bottom center; } @keyframes falling { 12% { transform: rotateX(240deg); } 24% { transform: rotateX(150deg); } 36% { transform: rotateX(200deg); } 48% { transform: rotateX(175deg); } 60%,85% { transform: rotateX(180deg); } 100% { transform: rotateX(0deg); } } .secondHeading .word span:nth-child(9).active { animation: rotate 1s ease-out; } @keyframes rotate { 20%,80% { transform: rotateY(180deg); } 100% { transform: rotateY(360deg); } } .secondHeading .word span:nth-child(10).active { animation: toplong 1.5s linear; } @keyframes toplong { 10%,40% { transform: translateY(-48vh) scaleY(1); } 90% { transform: translateY(-48vh) scaleY(4); } } .secondHeading .word span:nth-child(11).active { animation: balance 1.5s ease-out; transform-origin: bottom left; } .lightText { color: #787878; font-family: 'Conv_Poppins-Regular', sans-serif; font-size: 16px; margin-bottom: 15px; line-height: 1.6; transition: all ease 1s; } /* header start*/ header { position: absolute; z-index: 1; left: 0; right: 0; margin: 0 auto; } header .row { display: flex; align-items: center; padding: 20px 0; } header .row .logo img { width: 229px; height: 82px; object-fit: contain; } header .row .menu ul { margin: 0; list-style: none; display: flex; justify-content: center; } header .row .menu ul li { display: inline-flex; border-bottom: 1px solid #efefef; transition: all ease 1s; position: relative; } header .row .menu ul li:hover:before { position: absolute; content: ''; width: 7px; height: 7px; left: 0; right: 0; bottom: 7px; background: red; text-align: center; margin: 0 auto; border-radius: 3.5px; transition: all ease 1s; animation: bounce-in-fwd 2s infinite alternate both; } header .row .menu ul li:hover:after { position: absolute; content: ''; width: 10px; height: 10px; left: 0; right: 0; bottom: -11px; background: red; text-align: center; margin: 0 auto; transition: all ease 1s; clip-path: polygon(0 0, 53% 100%, 100% 0); } .bounce-in-fwd { animation: bounce-in-fwd 2s infinite alternate both; } @keyframes bounce-in-fwd { 0% { transform: scale(0); animation-timing-function: ease-in; opacity: 0; } 38% { transform: scale(1); animation-timing-function: ease-out; opacity: 1; } 55% { transform: scale(0.7); animation-timing-function: ease-in; } 72% { transform: scale(1); animation-timing-function: ease-out; } 81% { transform: scale(0.84); animation-timing-function: ease-in; } 89% { transform: scale(1); animation-timing-function: ease-out; } 95% { transform: scale(0.95); animation-timing-function: ease-in; } 100% { transform: scale(1); animation-timing-function: ease-out; } } header .row .menu ul li a { display: block; padding: 17px 20px; margin-right: 5px; color: #fff; text-transform: uppercase; font-size: 16px; position: relative; } header .row .menu ul li a:hover { color: red; } header .row .menu ul li:hover { border-bottom: 1px solid red; transition: all ease 1s; } /* header end*/ /* mian banner start */ .banner { background-image: url(../images/Banner.png); background-size: cover; position: relative; z-index: 0; display: flex; height: 965px; background-repeat: no-repeat; background-position: bottom; } .banner .banner-body { display: flex; height: 100vh; position: relative; } .banner .banner-body .slick-list { overflow: visible; } .banner .banner-body .row .bannerRightcontent img { position: absolute; z-index: 1; top: 0; bottom: 0; margin: auto; width: 1120px; } .banner .banner-body .row .bannerLeftcontent { position: relative; } .subtitleDark { margin: 0 0 15px 0; font-size: 40px; color: #fff; text-transform: uppercase; letter-spacing: 2px; } .mainHeading { position: relative; margin: 0; padding-left: 0px; margin-bottom: 15px; } .mainHeading:before { content: ""; background-color: red; width: 15px; position: absolute; top: -5px; left: -40px; bottom: -12px; animation: scroll 2s infinite; } .banner .banner-body .row { display: flex; align-items: center; height: 100vh; position: relative; } .banner .banner-body .item.slick-slide { overflow: hidden; opacity: 0; } .banner .banner-body .item.slick-slide.slick-current { overflow: visible; opacity: 1; } .banner:before { content: ''; position: absolute; width: 1px; height: 80%; background: #828282; left: 5%; top: 10%; } .banner .slick-dots { width: 20px; top: 48%; bottom: 0; left: -10%; transform: rotateY(180deg); height: 100px; display: inline-block; } .banner .slick-dots li { display: block; } .banner .slick-dots button { padding: 5px; border: 1px solid red; } /* services start */ section.servicesSec { position: relative; padding: 0 0 20px; z-index: 0; } section.serviceBox { background: #f5f5f5; padding: 100px 0; display: flex; align-items: center; position: relative; z-index: 1; } .servicesCount { position: relative; display: flex; flex-wrap: wrap; justify-content: center; } .image-fluid.serviceTri1 { position: absolute; width: 100%; height: 625px; object-fit: contain; top: -140px; bottom: 0; margin: 0 auto; z-index: 0; } .image-fluid.serviceTri2 { position: absolute; width: 100%; height: 620px; object-fit: contain; top: -110px; bottom: 0; margin: 0 auto; } .servicesCount .serv { width: 40%; display: flex; flex-direction: column; align-items: center; background: #fff; z-index: 1; height: 200px; justify-content: center; margin: 10px; text-align: center; transition: all ease 1s; } .servicesCount .serv .image-fluid { width: 50px; height: 50px; object-fit: contain; } .servicesCount .serv:nth-child(3n+1) { border: 12px solid #ff00003b; } .servicesCount .serv:hover { scale: 1.15; transition: all ease 1s; } .servicesCount .serv:nth-child(2) { border: 12px solid #80808075; } .servicesCount .serv:nth-child(3) { border: 12px solid #80808075; } .serviceBox .small-bubble.small-bubble-vector1 { top: 85%; left: 48%; } .serviceBox .small-bubble.small-bubble-vector2 { top: 90%; left: 55%; } .serviceBox .small-bubble.small-bubble-vector3 { top: 85%; left: 15%; } .serviceBox .small-bubble.small-bubble-vector4 { top: 80%; left: 12%; animation: shake-vertical 8s ease-in-out infinite; } .small-bubble-vector5 { top: 90%; left: 8%; width: 5px; } .small-bubble-vector6 { top: 90%; left: 65%; width: 5px; animation: shake-vertical 5s ease-in-out infinite; } /* services end */ /* faqs start */ .faqs { position: relative; padding: 80px 0 100px; } .faqs marquee { position: absolute; z-index: 1; } .centerHeading { text-align: center; padding-bottom: 30px; position: relative; z-index: 2; } .faqs .centerHeading .subtitleLight span { text-transform: lowercase; } #tabs-container { background-image: url(../images/faqlogobg.png); background-size: contain; background-position: center; padding: 0; background-repeat: no-repeat; height: 730px; } .projects-wrapper #tabs-container ul li { list-style: none; } #tabs-container ul li { list-style: none; } #tabs-container ul { padding: 20px 20px; margin: 0; background: #000000ba; } #tabs-container ul li a { display: block; padding: 10px 10px; background: #fff; margin-bottom: 20px; border-radius: 10px; font-size: 16px; color: #000; line-height: 1.8; height: 95px; display: flex; align-items: center; z-index: 3; position: relative; font-family: 'Conv_Poppins-Regular', sans-serif; } #tabs-container ul li a:hover { background: #e51717cf; color: #fff; } #tabs-container .col-md-6 { padding-left: 0; padding-right: 0; } #tabs-container .row { display: flex; } .tab-loop { padding: 20px 30px; height: 100%; background: #ff0000cf; } .tab-loop .answer p { color: #fff; font-size: 30px; margin-bottom: 30px; position: relative; } .tab-loop .answer p:before { content: ''; position: absolute; width: 109%; height: 2px; left: -29px; background: #fff; bottom: -20px; } .tab-loop .tabsleft-content { color: #fff; font-size: 16px; line-height: 1.8; } .newHeading { margin: 0; padding-left: 10px; margin-bottom: 15px; font-size: 45px; line-height: 1; color: #000; text-transform: capitalize; } .faqs .triangle2 { top: 10%; left: 20%; width: 80px; opacity: 0.8; z-index: 0; } .faqs .triangle1 { top: 8%; left: 23%; width: 80px; opacity: 0.8; z-index: 0; } .faqs .small-bubble.small-bubble-vector1 { left: 12%; width: 15px; z-index: 0; animation: shake-vertical 6s ease-in-out infinite; transition: all 6s ease-in-out; } .faqs .small-bubble.small-bubble-vector3 { top: 10%; animation: shake-vertical 8s ease-in-out infinite; transition: all 8s ease-in-out; z-index: 0; position: absolute; } .faqs .small-bubble.small-bubble-vector2 { animation: shake-vertical 8s ease-in-out infinite; transition: all 8s ease-in-out; z-index: 0; position: absolute; left: 70%; } .faqs .triangle3 { left: 88%; top: 22%; width: 250px; opacity: 0.6; } .faqs .triangle4 { width: 250px; opacity: 0.8; left: 8%; bottom: 4%; } /* faqs end */ /* testi section start */ .testimonialSec { position: relative; } .testi { position: relative; } .testimonialSec .lightText.testileft { font-size: 20px; line-height: 1.6; padding: 50px 0; } .testileftcontent ul { list-style: none; display: flex; } .testileftcontent ul li { width: 33.3%; text-align: center; } .testi .testislider.slider .darktext { background: #000; padding: 10px; } .testi .testislider.slider .slick-slide { display: flex; position: relative; height: 400px; margin: 50px 0 160px; } .testi .testislider.slider .slick-slide img { position: absolute; width: 30%; right: 30px; top: 0; border: 1px solid #ddd; box-shadow: 2px 4px 17px 7px #67656536; background: #0000004f; z-index: 3; } .testi .testislider.slider .slick-slide .quoteImg2 { background: transparent; box-shadow: none; border: none; left: 3%; top: 17px; width: 20%; } .testi .testislider.slider .slick-slide .quoteImg1 { background: transparent; position: absolute; box-shadow: none; border: none; left: 35%; top: 100%; width: 20%; z-index: 34; } .testimonialSec .slick-prev { right: 38%; top: 80%; background: #303030 url(../images/left-arrow.png) no-repeat center center; } .testimonialSec .slick-next { right: 33%; top: 80%; background: #303030 url(../images/right-arrow.png) no-repeat center center; } .testi .testislider.slider .slick-slide .darktext { width: 70%; position: relative; top: 100px; padding: 60px 50px 60px 40px; z-index: 3; margin-left: 10px; height: 342px; } .testi .testislider.slider .slick-slide .darktext:before { content: ''; position: absolute; width: 99%; height: 90%; z-index: -5; margin: 10px; border: 2px solid #000; top: -20px; left: -19px; } .testimonialSec .row { display: flex; flex-wrap: wrap; align-items: center; } .testimonialSec marquee { position: absolute; } /* testi section end */ /* award section start */ .awardSec { position: relative; background-image: url(../images/awardbg.png); background-size: contain; /* height: 600px; */ background-position: top; background-repeat: no-repeat; padding-bottom: 50px; z-index: 1; } .awardSec section.awards.slider { padding: 0 0 50px; } .awardSec marquee .animatedTxt { color: transparent; -webkit-text-stroke: 1px #ee7d94; } .awardSec marquee { position: absolute; } .awardSec .subtitleLight { color: #fff; margin-bottom: 25px; } .awardSec .newHeading { color: #fff; margin-bottom: 25px; } .awardSec .centerHeading { width: 50%; left: 0; right: 0; margin: 0 auto; padding: 50px 0; } .awardSec .centerHeading .lightText { color: #fff; margin-bottom: 25px; } .awardSec .awards.slider .awardSliderinner { background-color: #fff; margin: 0px 20px 20px; padding: 20px 40px; display: flex; flex-wrap: wrap; justify-content: center; text-align: center; box-shadow: 12px 17px 25px -6px #dddddd73; } .awardSec .awards.slider .awardSliderinner img { width: 200px; height: 200px; object-fit: contain; margin-bottom: 20px; } .awardSec .awards.slider .awardSliderinner .awardtitle { font-size: 18px; color: #000; height: 55px; line-height: 1.6; max-width: 80%; margin: 0 0 20px; } .awardSec .awards.slider .awardSliderinner .lightText { color: #000; font-size: 16px; line-height: 1.6; } .awardSec .slick-prev { right: 49.8%; top: 95%; background: #303030 url(../images/left-arrow.png) no-repeat center center; } .awardSec .slick-next { right: 46.5%; top: 95%; background: #303030 url(../images/right-arrow.png) no-repeat center center; } .awardSec .triangle.triangle1 { height: auto; bottom: 63%; left: 8%; animation: rotate-scale-up 10s infinite; opacity: 0.6; } .awardSec .triangle.triangle2 { height: auto; bottom: 58%; left: 28%; animation: rotate-scale-up 12s infinite; opacity: 0.6; z-index: -1; } .awardSec .triangle.triangle3 { height: auto; bottom: 56%; left: 69%; animation: rotate-scale-up 11s infinite; opacity: 0.6; width: 80px; z-index: -1; } .awardSec .triangle.triangle4 { height: auto; bottom: 70%; left: 77%; animation: rotate-scale-up 11s infinite; opacity: 0.6; width: 60px; z-index: 0; } .awardSec .triangle.triangle5 { height: auto; bottom: 40%; left: 91%; animation: rotate-scale-up 11s infinite; opacity: 0.6; width: 60px; z-index: 0; } .awardSec .triangle.triangle6 { height: auto; bottom: 40%; left: 6%; animation: rotate-scale-up 11s infinite; opacity: 0.6; width: 60px; z-index: 0; } .awardSec .triangle.triangle7 { height: auto; bottom: 50%; left: 47%; animation: rotate-scale-up 12s infinite; opacity: 0.6; width: 70px; z-index: -1; } .awardSec .triangle.triangle8 { height: auto; bottom: 77%; left: 5%; animation: rotate-scale-up 10s infinite; opacity: 0.6; width: 240px; } .awardSec .triangle.triangle9 { height: auto; bottom: 85%; left: 87%; animation: rotate-scale-up 10s infinite; opacity: 0.6; width: 240px; } .awardSec .triangle.triangle10 { height: auto; bottom: 7%; left: 91%; animation: rotate-scale-up 10s infinite; opacity: 0.6; width: 270px; display: none; } .awardSec .triangle.triangle11 { height: auto; bottom: 17%; left: -3%; animation: rotate-scale-up 10s infinite; opacity: 0.6; width: 230px; } /* award section end */ /* mapSec css start */ .mapSec {position: relative;z-index: 1;padding: 100px 0;} .mapSec marquee { position: absolute; } .mapSec .newHeading { padding-bottom: 50px; } .mapSec .hoverHeading { padding: 20px; } .hoverHeading { cursor: pointer; position: relative; padding: 10px 20px; background: transparent; font-size: 30px; transition: all 1s; color: red; } .hoverHeading:after,.hoverHeading:before { content: " "; width: 40%; height: 45px; position: absolute; border: 0px solid #fff; transition: all 1s; } .hoverHeading:after { top: -1px; left: -1px; border-top: 3px solid black; border-left: 3px solid black; } .hoverHeading:before { bottom: -1px; right: -1px; border-bottom: 3px solid red; border-right: 3px solid red; } .hoverHeading:hover { border-top-right-radius: 0px; border-bottom-left-radius: 0px; } .hoverHeading:hover:before,.hoverHeading:hover:after { width: 100%; height: 100%; } .map-section { padding: 10px 0; text-align: center; margin: 0 auto; } .map-bg { background: url(../images/ezgif.com-gif-maker2.png) no-repeat; background-position: center; background-size: contain; width: 100%; height: 300px; position: relative; top: 10px; left: 50px; } .marker1 { width: 50px; height: 50px; position: absolute; top: 24%; left: 34%; display: block; } .pin { width: 8px; height: 8px; position: relative; top: 11px; left: 11px; border: 1px solid #e35123; border-radius: 50%; z-index: 1; } .marker1 .pin { background: #d0d0d0; } .marker1 .pin-effect { background: rgb(219 186 1); } .pin-effect { width: 20px; height: 20px; position: absolute; top: 5px; display: block; border-radius: 50%; opacity: 0; animation: pulsate 2.4s ease-out infinite; left: 5px; } .map-bg .contact-canada-banner div.name_coun { font-size: 18px; line-height: normal; font-family: Gilroy-Semibold; text-transform: capitalize; } .map-bg .contact-canada-banner div.name_coun span { font-family: Gilroy-Regular; font-size: 12px; color: #282526; margin-top: 10px; line-height: normal; display: block; text-transform: uppercase; } .country-list { bottom: -70px; position: absolute; width: 100%; } .country-list .country-name { display: inline-flex; margin-right: 60px !important; position: relative; justify-content: center; align-items: center; flex-direction: column-reverse; } .country-list .country-name:after { /* content: ""; width: 4px; height: 40px; display: inline-block; position: absolute; left: -15px; bottom: 0; margin: auto; */ } .country-list .country-name:nth-child(1):after { background: #39386e; } .address-section .country-list .country-name:nth-child(2):after { background: #ccc; } .country-list .country-name:nth-child(3):after { background: #027602; } .country-list .country-name:nth-child(4):after { background: #1a89c8; } .country-list .country-name .country--title { position: relative; font-size: 16px; letter-spacing: 1px; color: #000; text-transform: uppercase; } .contact-canada-banner { display: none; } .marker1:hover .contact-canada-banner { padding: 10px 10px 10px 35px; top: -80px; left: 23px; width: 550px; padding-top: 0; background-size: 100% 100%; padding-bottom: 0; transition: all 0.25s ease; height: 157px; display: block; text-align: left; background: #ddddddc7; position: absolute; z-index: 999999; display: flex; align-items: center; } .marker1:hover .contact-canada-banner p { color: #000; font-family: 'Conv_Poppins-Regular', sans-serif; } .marker1:hover .contact-canada-banner div.name_coun span { float: left; margin-top: 10px; width: 30%; margin-left: 2%; border-right: 1px solid #000; font-size: 14px; font-family: 'Conv_Poppins-Regular', sans-serif; } .marker1:hover .contact-canada-banner div.name_coun span.add__03 { border-right: 0 solid #000; width: 33%; } @keyframes pulsate { 0% { transform: scale(0.1); opacity: 0; } 50% { opacity: 1; } 100% { transform: scale(1.2); opacity: 0; } } /* mapSec css end */ /* contactSec css start */ .contactSec { background-color: #000; position: relative; padding: 50px 0 150px; } .contactSec marquee .animatedTxt { -webkit-text-stroke: 1px #dddd; } .contactSec .centerHeading { text-align: left; } .contactSec .centerHeading .subtitleLight { color: red; } .contactSec .centerHeading .mainHeading .evenword { font-size: 45px; margin-bottom: 10px; } .contactSec .centerHeading .lightText { color: #fff; } .contactSec .small-bubble.small-bubble-vector3 { top: 55%; left: 94%; } .contactSec .small-bubble.small-bubble-vector2 { top: 75%; left: 40%; } .contactSec .small-bubble.small-bubble-vector1 { top: 65%; left: 60%; } .contactSec .triangle.triangle1 { left: 90%; bottom: 10%; } .contactSec .triangle.triangle5 { left: 10%; bottom: 8%; animation: rotate-scale-up 12s infinite; width: 90px; } .contactSec .triangle.triangle8 { left: 93%; bottom: 11%; animation: rotate-scale-up 12s infinite; width: 180px; } .contactSec .triangle.triangle9 { left: -6%; bottom: 75%; animation: rotate-scale-up 12s infinite; } /* contactSec css end */ /* partnersSec start */ .partnersSec .small-bubble.small-bubble-vector1 { top: 85%; left: 95%; z-index: 0; max-width: 40px; } .partnersSec { position: relative; background-image: url(../images/partnersbg.png); background-size: contain; padding: 100px 0 50px; } .partnersSec marquee { position: absolute; top: 0; } .partnersSec .row { display: flex; align-items: center; } .partnersSec .partnersLogos slider { padding: 50px 0; position: relative; } .partnersSec section.partners.slider { padding: 0; } .partnersSec .partnersLogos section img { padding: 24px 25px; background: #fff; border: 1px solid #000; height: 240px; width: 80%; margin: 0 auto; object-fit: contain; margin-top: 1px; margin-bottom: 20px; } .partnersSec .partnersLogos .slick-dots { position: relative; width: 20px; left: 0; top: -310px; } .partnersSec .triangle.triangle2 { height: auto; bottom: 7%; left: 80%; animation: rotate-scale-up 7s infinite; opacity: 0.7; } .partnersSec .triangle.triangle1 { height: auto; bottom: 9%; left: 77%; animation: rotate-scale-up 10s infinite; opacity: 0.7; } .partnersSec .triangle.triangle3 { bottom: 30%; left: 97%; animation: rotate-scale-up 10s infinite; opacity: 0.7; } /* partnersSec end */ /* mian banner end */ .projects-wrapper { position: relative; overflow: hidden; padding: 0; } .mac-area-clip-inner { clip: rect(auto, auto, auto, auto); height: 100%; left: 0; position: absolute; top: 0; width: 100%; } .mac-area-clip { position: relative; height: 100vh; display: flex; } .mac-area { position: fixed; width: 100%; top: 0; left: 0; height: 100%; display: flex; flex-direction: column; justify-content: center; } .mac-area .row { display: flex; flex-wrap: wrap; align-items: center; } .projects-wrapper .box-content { margin-left: 8%; margin-right: 8%; } .bg-primary15.neww { background: linear-gradient(to right, #500689 0, #630688 50%, #fff 50%, #fff 100%); position: relative; margin-left: -15px; margin-right: -15px; } .projects-wrapper .img--projects img { width: 70%; margin: 0 auto; } .projects-wrapper .img--projects { text-align: center; } .bg-primary1 { background: linear-gradient(to right, #73cf36 0, #10b4dd 50%, #fff 50%, #fff 100%); position: relative; margin-left: -15px; margin-right: -15px} .bg-primary7 { background: linear-gradient(to right, #ef4b51 0, #d72f35 50%, #fff 50%, #fff 100%); position: relative; margin-left: -15px; margin-right: -15px} .bg-primary6 { background: linear-gradient(to right, #e73330 0, #ef4b23 20%, #ffc90a 50%, #fff 50%, #fff 100%); position: relative; margin-left: -15px; margin-right: -15px} .bg-primary3 { background: linear-gradient(to right, #eb3740 0, #a3141a 50%, #fff 50%, #fff 100%); position: relative; margin-left: -15px; margin-right: -15px} .bg-primary2 { background: linear-gradient(to right, #00b4e0 0, #0a5bc7 50%, #fff 50%, #fff 100%); position: relative; margin-left: -15px; margin-right: -15px} .bg-primary5 { background: linear-gradient(to right, #009f98 0, #63c9bd 50%, #fff 50%, #fff 100%); position: relative; margin-left: -15px; margin-right: -15px} .bg-primary4 { background: linear-gradient(to right, #151b28 0, #0b2254 50%, #fff 50%, #fff 100%); position: relative; margin-left: -15px; margin-right: -15px} .box-content .list_cat { list-style: none; padding: 0; margin: 30px 0; text-align: left} .box-content img,.box-content svg { width: 227px; height: 102px; object-fit: contain; object-position: left; } .box-content .list_cat li { background: #dddddd; padding: 10px 15px; color: #282526; font-size: 16px; line-height: 18px; font-family: Gilroy-Light; display: inline-block; margin-right: 8px; font-family: 'Conv_Poppins-Regular', sans-serif; } .box-content .content-boxx { color: #282526; margin-bottom: 40px; font-size: 16px; line-height: 1.6; } .projects-wrapper .triangle2 { left: 79%; bottom: -5%; width: 70px; } .projects-wrapper .triangle.triangle1 { left: 85%; bottom: -5%; width: 70px; } .projects-wrapper .triangle3 { left: 79%; bottom: -35%; width: 80px; } .projects-wrapper .small-bubble.small-bubble-vector3 { top: 100%; left: 75%; max-width: 7px; } .projects-wrapper .small-bubble.small-bubble-vector2 { top: 108%; left: 67%; max-width: 10px; animation: shake-vertical 8s ease-in-out infinite; transition: all 8s ease-in-out; } .projects-wrapper .small-bubble.small-bubble-vector1 { top: -30%; left: 55%; width: 20px; animation: shake-vertical 4s ease-in-out infinite; transition: all 4s ease-in-out; } .box-content img.amj-logo { /*width: 110px !important;*/ /*height: initial !important*/ } .box-content img.self_logo { width: 190px !important; height: initial !important} .box-content img.ether_logo { width: 190px !important; height: initial !important} .box-content img.stop_vaping_logo { width: 190px !important; height: initial !important} .mar-auto:after { margin-left: auto; margin-right: auto} .content-link { margin: 20px 0; display: block} .content-link a { border: 0 solid #ee3824; padding: 0 50px; font-size: 14px; letter-spacing: 1px; text-decoration: none; color: #fff !important; font-weight: 500; height: 40px; line-height: 40px; text-transform: uppercase; font-family: Gilroy-Medium; transition: linear .3s; background: #ffa20a; background: linear-gradient(-90deg, #ffa20a 0, #fd4b0f 100%); border-radius: 8px; box-shadow: 0 5px 14.4px .6px rgba(238, 56, 38, .22); display: inline-block} /* btn1 start */ .btn1 a { padding: 15px 30px; font-size: 1.25rem; position: relative; border: 2px solid white; color: white; background-color: transparent; text-align: center; font-size: 16px; display: block; text-transform: uppercase; cursor: pointer; font-family: 'Conv_Poppins-Regular', sans-serif; } .btn1 a:hover { color: red; } .btn1 .border::after,.border::before,.border span::after,.border span::before { content: ""; position: absolute; background-color: #fff; transition: 0.5s ease; /* z-index: -1; */ } .btn1 .border::after,.border::before { height: 100%; width: 2px; top: -2px; } .btn1 .border::after { left: -2px; } .btn1 .border::before { right: -2px; } .border span::after,.border span::before { height: 2px; width: 100%; left: -2px; } .border span::after { top: -2px; } .border span::before { bottom: -2px; } .border:hover:after { transform: translatex(-12px); } .border:hover:before { transform: translatex(12px); } .border:hover span::after { transform: translatey(-12px); } .border:hover span::before { transform: translatey(12px); } /* btn1 end */ /* btn2 start */ .btn2 { width: 200px; } .btn2 a { padding: 15px 30px; font-size: 1.25rem; position: relative; border: 2px solid red; color: white; background-color: red; text-align: center; font-size: 16px; display: block; text-transform: uppercase; cursor: pointer; margin-top: 30px; font-family: 'Conv_Poppins-Regular', sans-serif; } .btn2 a:hover { color: red; background: transparent; border: 2px solid #b9b9b9; } .btn2 .border::after,.btn2 .border::before,.btn2 .border span::after,.btn2 .border span::before { content: ""; position: absolute; background-color: red; transition: 0.5s ease; /* z-index: -1; */ } .btn2 .border::after,.border::before { height: 100%; width: 2px; top: 0px; } .btn2 .border::after { left: -2px; } .btn2 .border::before { right: -2px; } .btn2 .border span::after,.border span::before { height: 2px; width: 100%; left: -2px; } .btn2 .border span::after { top: -2px; } .btn2 .border span::before { bottom: -2px; } .border:hover:after { transform: translatex(-12px); } .btn2 .border:hover:before { transform: translatex(12px); } .btn2 .border:hover span::after { transform: translatey(-12px); } .btn2 .border:hover span::before { transform: translatey(12px); } /* btn2 end */ .swap span { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 1rem 2rem; box-sizing: border-box; opacity: 0; color: black; transition: 0.35s ease; } .swap::before { content: ""; left: 0; top: 0; position: absolute; width: 0; height: 100%; background-color: white; transition: 0.5s ease; } .swap:hover:before { width: 100%; } .swap:hover span { opacity: 1; } .future::after,.future::before { content: ""; position: absolute; border: 2px solid white; width: calc(100% + 15px); height: 60px; transition: 0.5s ease; } .future::after { top: -15px; left: -15px; border-right: none; border-bottom: none; } .future::before { bottom: -15px; right: -15px; border-left: none; border-top: none; } .future:hover:after,.future:hover:before { width: calc(100% - 30px); height: 80px; } .banner .banner-body .row .bannerLeftcontent::before { /* content: ""; */ /* background-color: red; */ /* width: 15px; */ /* position: absolute; */ top: 0; /* left: -10px; */ /* bottom: -12px; */ /* animation: scroll 2s infinite; */ } @keyframes scroll { 0% { bottom: 100%; opacity: 0; } 100% { bottom: -12px; opacity: 1; } } .scale-up-center { animation: scale-up-center 4s cubic-bezier(0.390, 0.575, 0.565, 1.000) infinite alternate both; } @-webkit-keyframes scale-up-center { 0% { transform: scale(0.5); } 100% { transform: scale(1); } } @keyframes scale-up-center { 0% { transform: scale(0.5); } 100% { transform: scale(1); } } .small-bubble { position: absolute; object-fit: cover; object-position: center; width: 20px; z-index: 1; animation: shake-vertical 2s ease-in-out infinite; transition: all 2s ease-in-out; } .small-bubble.small-bubble-vector1 { top: 10%; left: 45%; max-width: 30px; } .small-bubble.small-bubble-vector2 { top: 14%; left: 58%; max-width: 20px; animation: shake-vertical 3s ease-in-out infinite; transition: all 3s ease-in-out; } .small-bubble.small-bubble-vector3 { top: 20%; left: 35%; max-width: 10px; animation: shake-vertical 4s ease-in-out infinite; transition: all 4s ease-in-out; } @keyframes shake-vertical { 0% { transform: translateY(0); } 10% { transform: translateY(-13px); } 20% { transform: translateY(13px); } 30% { transform: translateY(-13px); } 40% { transform: translateY(13px); } 50% { transform: translateY(-13px); } 60% { transform: translateY(13px); } 70% { transform: translateY(-13px); } 80% { transform: translateY(10.4px); } 90% { transform: translateY(-10.4px); } 100% { transform: translateY(0); } } .triangle { position: absolute; left: 0; bottom: 0px; } .triangle.triangle1 { width: 80px; height: auto; top: 35%; left: 4%; animation: rotate-scale-up 7s infinite; } .triangle2 { width: 100px; height: auto; bottom: 19%; left: 5%; animation: rotate-scale-up 5s infinite; } .triangle3 { width: 70px; height: auto; bottom: 8%; left: 60%; animation: rotate-scale-up 7s infinite; } .triangle4 { width: 90px; height: auto; bottom: 10%; left: 48%; animation: rotate-scale-up 6s infinite; } @keyframes rotate-scale-up { 0% { -webkit-transform: scale(1.0) rotateZ(0); transform: scale(1.0) rotateZ(0); } 50% { -webkit-transform: scale(1.3) rotateZ(180deg); transform: scale(1.3) rotateZ(180deg); } 100% { -webkit-transform: scale(1.0) rotateZ(360deg); transform: scale(1.0) rotateZ(360deg); } } /* footer css start */ .cookie { background: #000; color: #fff; padding: 10px 0; } .cookie p { margin-bottom: 0; font-family: Gilroy-Medium; font-size: 14px; letter-spacing: 1px; color: #fff; line-height: 24px; padding-top: 7px; } input.cookieok { border: 0 solid #ee3824; font-size: 13px; letter-spacing: 1px; text-decoration: none; color: #fff !important; font-weight: 500; text-transform: uppercase; font-family: Gilroy-Medium; transition: linear 0.3s; background: #ffa20a; background: linear-gradient(-90deg, #ffa20a 0, #fd4b0f 100%); border-radius: 8px; height: 35px; line-height: 35px; padding: 0 24px; cursor: pointer; } .videoask-embed__button--1ONxk { z-index: 9999999 !important; } .show-mobile { display: none; } .contant-section { padding: 200px 0 100px; color: #fff; font-size: 14px; position: relative; background: #f37a20; background: linear-gradient(-138deg, #f37a20 0, #ef5123 55%, #ee3824 100%); margin-top: -130px; z-index: 999999; } .contant-section p { color: #fff; } .contant-section .title-small { text-transform: uppercase; font-family: Gilroy-Medium; font-size: 12px; letter-spacing: 2px; font-weight: 300; position: relative; padding-left: 40px; } .contant-section .title-small:before { position: absolute; left: 0; width: 30px; height: 30%; padding: 10px; border-top: 1px solid #fff; top: 0; content: ""; margin-top: 9px; margin-left: 0; } .contant-section .title_class { margin-top: 25px; margin-bottom: 40px; font-size: 32px; font-family: Gilroy-Regular; color: #fff; font-weight: 600; line-height: 1.1; } .contant-section .footer--div { width: 47%; float: left; margin-right: 3%; margin-bottom: 30px; } .contant-section .footer--div select { background: 0 0; border-width: 0 0 1px 0; font-size: 14px; width: 100%; height: 40px; border-style: solid; border-color: #fff; color: #fff; outline: 0; border-radius: 0; } .contant-section .footer--div select .option,.contant-section .footer--div select .option:disabled { background: #2a2a2a; border: 0; outline: 0; background-color: #2a2a2a; color: #fff; } .contant-section .footer--div select .option:hover { background: #f37a20; border: 0; outline: 0; background-color: #f37a20; color: #fff; } .contant-section .footer--div input { background: 0 0; border-width: 0 0 1px 0; font-size: 14px; width: 100%; height: 40px; border-style: solid; border-color: #fff; color: #fff; outline: 0; border-radius: 0; } .contant-section .footer--div ::-webkit-input-placeholder { color: #fff; } .contant-section .footer--div :-ms-input-placeholder { color: #fff; } .contant-section .footer--div ::placeholder { color: #fff; } #quote .btn-white { border: 0 solid #fff; padding: 0 35px; height: 40px; line-height: 40px; font-size: 14px; letter-spacing: 1px; text-decoration: none; color: #f16721 !important; font-weight: 500; cursor: pointer; text-transform: uppercase; font-family: Gilroy-Medium; transition: linear 0.3s; background: #fff; background: #fff; border-radius: 8px; display: inline-block; } .widget-section .widget_title { margin-bottom: 20px; color: #282526; font-size: 23px; margin-top: 0; font-weight: 600; line-height: 1.1; font-family: 'Conv_Poppins-Regular', sans-serif; } .widget-section p a:first-child { border-right: 1px solid #ededed; padding-right: 10px; margin-right: 7px; } .widget-section a { color: #282526; font-size: 14px; } .widget-section p { color: #282526; font-size: 16px; line-height: 22px; margin-bottom: 0; display: flex; flex-direction: column; padding-bottom: 20px; } .social_icons { text-align: left; margin: 30px 0 0; } .social_icons ul { padding: 0; margin: 0; } .social_icons ul li { display: inline-block; } .social_icons ul li a svg.social-links { fill: #969596; transition: all 0.5s ease; margin-right: 5px; } .social_icons ul li a:hover svg.social-links { fill: #ef5123; transition: all 0.5s ease; } .social_icons ul li a:hover { color: #ffa20a; } .widget-section input[type="email"],.widget-section input[type="submit"] { width: 100%; } .widget-section input[type="email"] { padding: 10px; font-family: 'Conv_Poppins-Regular', sans-serif !important; font-size: 16px; } .widget-section input { border: 1px solid #000; margin-bottom: 0.5em; } .testing { color: #2a2a2a; font-size: 12px; margin: 0; font-family: Gilroy-Regular; } #subscriber_form .error { color: #2a2a2a; font-size: 12px; margin: 0; font-family: Gilroy-Regular; } .widget-section #subscriber_form .sbt { padding: 0 12px; color: #fff; border: 0; text-align: center; background-size: 100% 100%; z-index: 1; display: block; background: #ffa20a; background: linear-gradient(-90deg, #ffa20a 0, #fd4b0f 100%); border-radius: 8px; box-shadow: 0 5px 14.4px 0.6px rgba(238, 56, 38, 0.22); height: 40px; line-height: 40px; text-transform: uppercase; font-family: Gilroy-Medium; font-size: 14px; letter-spacing: 1px; margin-top: 0; cursor: pointer; width: 100%; position: relative; } .widget-section a.btn3 { width: 100%; text-align: center; padding-top: 11px; margin-top: 25px; height: 40px; background-size: 100% 100%; display: inline-block; position: relative; border: 0 solid #ee3824; font-size: 14px; letter-spacing: 1px; text-decoration: none; color: #fff !important; font-weight: 500; text-transform: uppercase; font-family: Gilroy-Medium; transition: linear 0.3s; background: #ffa20a; background: linear-gradient(-90deg, #ffa20a 0, #fd4b0f 100%); border-radius: 8px; box-shadow: 0 5px 14.4px 0.6px rgba(238, 56, 38, 0.22); } .widget-section { padding-top: 50px; padding-bottom: 50px; } .widgetContent { padding: 0 20px; border: 1px solid #000; height: 300px; display: flex; flex-direction: column; justify-content: center; } .widgetContent ul { list-style: none; } .widgetContent ul li h6 { color: red; font-size: 16px; } .widgetContent ul li a { color: #000; font-size: 16px; } .widgetContent ul li { color: #000; font-size: 16px; width: 70%; line-height: 1.6; } .widgetContent2 { padding: 0 20px; border: 1px solid #000; border-left: 0; height: 300px; display: flex; flex-direction: column; justify-content: center; } .widgetContent2 input { box-sizing: border-box; border-radius: 4px; padding: 0px 0px 0px 16px; height: 54px; text-align: left; color: #fff; font-size: 18px; font-weight: 400; letter-spacing: 0px; background-color: red; border: 1px solid rgb(96, 106, 114); } .widgetContent2 input::placeholder { color: #fff; } .widgetContent2 button { position: absolute; width: 34%; right: 4px; top: -78px; border-width: 2px; color: rgb(255, 255, 255); font-size: 18px; font-weight: 600; letter-spacing: 0px; line-height: 1; white-space: normal; padding-top: 0px; padding-bottom: 0px; text-align: center; word-break: break-word; align-self: flex-end; cursor: pointer; height: 54px; background: black; border-radius: 0px; transition: all ease 1s; font-family: 'Conv_Poppins-Regular', sans-serif !important; } .widgetContent2 button:hover { background: red; transition: all ease 1s; } .widgetContent3 { padding: 0 20px; border: 1px solid #000; border-left: 0; height: 300px; display: flex; flex-direction: column; justify-content: center; } .widgetContent3 .btn2 a { color: #fff; } .widgetContent3 .btn2 a:hover { color: #000; } .widget-section col { padding: 0; } .widget-section .col-md-4 { padding: 0; } .p-50 { padding: 0 40px; } .p-r-50 { padding-right: 50px; } span.hover-tooltip { display: none; } .copyright-section { z-index: 999999; position: relative; background: red; padding: 0; } .copyright-section .menu-footer-menu-container { background: #ddd; padding: 10px 20px; } .copyright-section .row { display: flex; align-items: center; } .copyright-section .container { /* padding-top: 20px; */ /* padding-bottom: 20px; */ border-top: 1px solid #ccc; } .b-right { border-right: 1px solid #ccc; } ul#menu-footer-menu { margin: 0; padding: 0; } ul#menu-footer-menu li { display: inline-block; float: none; border-left: 0; padding-right: 15px; } ul#menu-footer-menu li a { font-size: 14px; letter-spacing: 1px; color: #282526; text-transform: uppercase; text-decoration: none; } .copyright-section .col-12.col-sm-12.col-md-12.col-lg-8.col-xl-8 { padding: 0; } .copy-txt p { font-size: 14px; letter-spacing: 1px; color: #fff; text-transform: uppercase; line-height: normal; margin-top: 0; text-align: right; margin-bottom: 0; } .copyright-section a:hover { color: initial; text-decoration: none; } .copyright-section .footer-img { display: inline-flex; width: auto; float: none; padding: 0; height: 75px; margin: 0 auto 0; text-align: center; border-bottom: 0 solid #eee; list-style: none; float: right; } .copyright-section .footer-img li { padding: 0 5px 0 5px !important; } .copyright-section ul li:first-child { padding-left: 0; border-left: 0; } .footer-img a:hover div { -webkit-filter: grayscale(0); filter: grayscale(0); transition: linear 0.3s; } .address-section .container { padding: 0 50px; background: #282526; height: 320px; } .address-section { padding-top: 50px; position: relative; z-index: 9999999; } .address-section .blog-t-section { padding: 30px 0; } .sub-heading { font-family: Gilroy-Regular; color: #fff; text-transform: uppercase; letter-spacing: 1px; } .our-blog-cap { font-size: 34px; color: #edffff; font-family: Gilroy-Bold; line-height: 40px; padding: 10px 0; } .our-blog-cap span { color: #ef5123; } .blog-t-section p { font-size: 14px; color: #fff; margin-bottom: 5px; } .inputdiv { display: flex; flex-grow: 1; flex-direction: column; align-self: flex-end; } .inputmain { display: flex; justify-content: flex-start; padding: 0px 4px 15px; position: relative; flex: 1 0 0px; } /* footer css end */ /* scrollbar ****************/ /* width */ ::-webkit-scrollbar { width: 10px; } /* Track */ ::-webkit-scrollbar-track { box-shadow: inset 0 0 30px #000; } /* Handle */ ::-webkit-scrollbar-thumb { background: linear-gradient(180deg, rgb(220 53 59) 25%, rgb(219 52 58) 25%, rgb(255 255 255) 50%, rgb(255 255 255) 50%, #000000 75%, rgb(0 0 0) 75%); ; border-radius: 10px; } /*banner-formSec css start*/ seciton.banner.formBanner .banner-body .item { position: relative; top: 55%; transform: translateY(-50%); } .formRightbox { width: 80%; margin: 0 auto; padding: 0; position: relative; } .formRightbox form { width: 100%; margin: 0 auto; background: #de002e; padding: 30px 50px; position: relative; z-index: 0; } .formRightbox form:before { content: ''; position: absolute; background: url(../images/formvectorlight.png); left: 0px; top: 250px; bottom: 0; width: 672px; height: 888px; margin: auto; z-index: -1; transform: rotate(180deg); } .formRightbox form:after { content: ''; position: absolute; background: url(../images/formvectorlightdark.png); right: 0px; top: -370px; bottom: 0; width: 642px; height: 1088px; margin: auto; z-index: -1; transform: rotate(180deg); animation: slide-top 3s cubic-bezier(0.250, 0.460, 0.500, 0.940) infinite alternate both; } .formContent { text-align: center; } .formHeading { font-size: 32px; color: #fff; font-weight: 500; margin: 0; line-height: 1.2; font-family: 'Conv_Poppins-Regular' !important; } .formContent .darktext { margin-bottom: 25px; } .formRightbox form input { width: 100%; padding: 8px 20px; margin-bottom: 15px; } .formRightbox form input:focus { outline: none; } .formRightbox form select { width: 100%; padding: 15px 20px; margin-bottom: 15px; font-size: 16px; color: #757575; } .formRightbox form textarea { width: 100%; padding: 10px 20px; } .formRightbox form textarea:focus { outline: none; } .formRightbox .btn1 { margin-top: 20px; width: 50%; margin: 0 auto; margin-top: 11px; } .formRightbox .btn1 a:hover { background: #fff; color: #000; } .formRightbox form input::placeholder { font-size: 16px; } seciton.banner.formBanner .triangle3 { width: 170px; z-index: -1; left: 70%; bottom: -6%; animation: rotate-scale-up 15s infinite; } seciton.banner.formBanner .triangle2 { width: 160px; z-index: -1; left: -10%; bottom: 85%; animation: rotate-scale-up 15s infinite; } .slide-top { animation: slide-top 3s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite alternate both; } @-webkit-keyframes slide-top { 0% { transform: translateY(0); } 100% { transform: translateY(-100px); } } @keyframes slide-top { 0% { transform: translateY(0); } 100% { transform: translateY(-100px); } } /* banner-formSec css end*/ /* android servicesSec css start */ .wrapper { display: flex; align-items: center; justify-content: space-between; width: 100%; flex-wrap: wrap; padding: 70px 0; } .wrapper .wraperItems { width: 42%; background: #fff; margin-bottom: 20px; transition: all ease 1s; } .wrapper .wraperItems:hover { /* transition: all ease 1s; */ /* background: #de002e !important; */ } .wrapper .wraperItems img {} .wrapper .wraperItems a { display: block; padding: 30px; } .wrapper .wraperItems a { display: flex; flex-direction: column; transition: all ease 1s; height: 370px; justify-content: space-around; } .wrapper .wraperItems .imgBox { padding: 25px 20px; border-radius: 70px; background: #de002e; object-fit: contain; width: 90px; height: 90px; } .wrapper .wraperItems:hover .imgBox { background: #000; transition: all ease 1s; } .wrapper .wraperItems .imgBox img { width: 50px; height: 40px; object-fit: contain; } .wrapper .wraperItems a:hover { background: #de002e; transition: all ease 1s; transform: scale(1.04); } .wrapper .wraperItems:hover .lightText { color: #fff; transition: all ease 1s; } .wrapper .wraperItems:hover .serviceName { color: #fff; transition: all ease 1s; } .wrapper .wraperItems .serviceName { font-size: 24px; font-weight: 500; margin: 0; line-height: 1.2; transition: all ease 1s; } .uspSec { background-image: url(../images/Banner.png); background-size: cover; position: relative; z-index: 0; display: flex; height: 965px; background-repeat: no-repeat; background-position: bottom; padding: 80px; align-items: center; } .uspSec marquee { position: absolute; left: 0; top: 15%; } .uspSec .subtitleLight { color: #fff; } .uspSec .secondHeading { color: #fff; line-height: 1.4; } .uspSec .lightText { color: #fff; } .uspSec .lightText { width: 80%; } .list-point { padding: 0px 0px 0px 90px; margin: 0px; list-style: none; } .list-point li { position: relative; margin-bottom: 5px; padding-left: 15px; width: 100%; display: inline-block; } .list-point li a { color: #a8a8a8; font-size: 20px; line-height: 1.9; } .list-point li a:hover { color: #fa0000; } .list-point li:before { content: ''; background: rgb(255, 162, 10); background: linear-gradient(40deg, rgb(254 0 0) 0%, rgb(253 0 0) 100%); width: 7px; height: 7px; display: inline-block; position: absolute; left: -9px; top: 12px; border-radius: 50%; } .list-point li:after { content: ''; width: 17px; height: 17px; display: inline-block; position: absolute; left: -14px; border: 1px solid #9c9c9c; top: 7px; border-radius: 50%; } .uspSec .triangle2 { left: 10%; bottom: 10%; opacity: 0.7; } .uspSec .triangle3 { opacity: 0.7; } .uspSec .triangle1 { left: 80%; bottom: 30%; opacity: 0.7; } /* android servicesSec css end */ /* android page mac area sec start */ section.projects-wrapper.amdroidApppage{ position: relative; } section.projects-wrapper.amdroidApppage:before { content: ''; position: absolute; background-image: linear-gradient(180deg, rgba(153, 42, 142, 1) 25%, rgb(255 212 0 / 0%) 42%, rgb(241 210 8 / 0%) 50%, rgb(141 198 63 / 0%) 50%, rgb(141 198 63 / 0%) 60%, rgba(153, 42, 142, 1) 75%); width: 4.5%; height: 150vh; background-size: cover; background-position: top; top: -30px; left: 360px; z-index: 1; background-repeat: no-repeat; transform: rotate(135deg); } section.projects-wrapper.amdroidApppage:after { content: ''; position: absolute; background-image: linear-gradient(180deg, rgba(153, 42, 142, 1) 11%, rgb(255 212 0 / 0%) 31%, rgb(241 210 8 / 0%) 50%, rgb(141 198 63 / 0%) 50%, rgb(141 198 63 / 0%) 64%, rgba(153, 42, 142, 1) 86%); width: 4.5%; height: 150vh; background-size: cover; background-position: top; top: -200px; left: 400px; z-index: 1; background-repeat: no-repeat; transform: rotate(135deg); } section.projects-wrapper.amdroidApppage .secondHeading { font-size: 35px; line-height: 1.4; font-family: 'Conv_Poppins-Regular', sans-serif !important; } section.projects-wrapper.amdroidApppage .subtitleLight { font-size: 56px; } .projects-wrapper.amdroidApppage .triangle4 { left: -50%; bottom: -25%; width: 40%; z-index: -1; animation: rotate-scale-up 12s infinite; } .projects-wrapper.amdroidApppage .triangle5 { left: -90%; bottom: 67%; width: 40%; z-index: -1; animation: rotate-scale-up 10s infinite; } /* android page mac area sec end */ /* why Apps Vent sec start */ section.whyAppsVent.transSec .list-point { padding: 0 0 0 20px; } .whyAppsVent { background-image: url(../images/whyAppsventBG.png); background-size: cover; position: relative; z-index: 0; background-position: top; background-repeat: no-repeat; padding: 50px; } .whyAppsVent marquee { position: absolute; top: -40px; left: 0; } .whyAppsVent .subtitleLight { color: #fff; } .whyAppsVent .secondHeading { color: #fff; font-size: 40px; line-height: 1.3; } .whyAppsVent .appventRight-services { list-style: none; margin: 0; padding: 20px 0; } .whyAppsVent .darktext { font-size: 30px; text-transform: capitalize; } .whyAppsVent .lightText { color: #fff; } /* why Apps Vent sec end */ /* portfolio sec css start */ section.sec-08 { padding: 0; position: relative; background-image: url(../images/partnersbg.png); background-size: contain; padding: 50px 0 0px; } .case-studies .case-text{ position: absolute; bottom: 0; width: 100%; left: 0; padding-left: 50px; padding-right: 50px; padding-bottom: 50px; background: linear-gradient(180deg, transparent, red); height: 0; opacity: 0; -webkit-transition: height .6s ease-in-out, opacity .6s; -moz-transition: height .6s ease-in-out, opacity .6s; -ms-transition: height .6s ease-in-out, opacity .6s; -o-transition: height .6s ease-in-out, opacity .6s; transition: height .6s ease-in-out, opacity .6s} .case-studies .case-logo{ position: absolute; bottom: 50px; width: 80%; left: 10%; height: 116px; -webkit-transition: height 1s ease-in-out, opacity 1.5s; -moz-transition: height 1s ease-in-out, opacity 1.5s; -ms-transition: height 1s ease-in-out, opacity 1.5s; -o-transition: height 1s ease-in-out, opacity 1.5s; transition: height 1s ease-in-out, opacity 1.5s; margin: 0 0 20px; opacity: 1} .case-studies:hover .case-logo{ height: 0; -webkit-transition: height .1s ease-in-out, opacity .2s; -moz-transition: height .1s ease-in-out, opacity .2s; -ms-transition: height .1s ease-in-out, opacity .2s; -o-transition: height .1s ease-in-out, opacity .2s; transition: height .1s ease-in-out, opacity .2s; opacity: 0} .case-studies:hover .case-text{ height: auto; opacity: 1; -webkit-transition: height .6s ease-in-out, opacity .6s; -moz-transition: height .6s ease-in-out, opacity .6s; -ms-transition: height .6s ease-in-out, opacity .6s; -o-transition: height .6s ease-in-out, opacity .6s; transition: height .6s ease-in-out, opacity .6s; } .case-studies .case-text img{ margin: 0 0 20px} .case-studies .case-text:before{ content: ""; background: #fff; width: 30px; height: 2px; display: block; margin-top: 30px; position: relative; top: 130px; opacity: .5} .case-studies .case-text p{ width: 100%; color: #fff; font-size: 16px; line-height: 26px; margin-bottom: 20px} .case-studies .case-text a{ color: #fff; font-size: 15px; display: block; margin: 10px 0} section.sec-08 .col-12.col-md-4.case-studies.p-0 { padding: 0; } section.sec-08 .row.centerRow { padding: 50px; } section.sec-08 marquee { position: absolute; left: 0; } section.sec-08 .row.centerRow .subtitleLight { width: 75%; font-size: 55px; } section.sec-08 .row.centerRow .secondHeading { width: 75%; font-size: 40px; line-height: 1.4; } /* portfolio sec css end */ /* solutionSec css start */ .solutionSec { position: relative; } .solutionSecrightbox .list-point { padding: 0 0 0 30px; } .solutionSec .secondHeading { line-height: 1.4; } /* solutionSec css end */ /* devprocess Sec css started */ .devProcess { background-image: url(../images/ourProcessBG.png); background-size: cover; position: relative; z-index: 0; background-position: top; background-repeat: no-repeat; padding: 100px 0; } .centerContentBox { text-align: center; width: 60%; margin: 0 auto; } .devProcess .secondHeading:before { content: none; } .devProcess .subtitleLight { color: #fff; text-align: center; } .devProcess .secondHeading { color: #fff; text-align: center; } .devProcess .slick-dots { position: relative; height: 50px; right: -40%; transform: rotate(90deg); top: -300px; } .devProcess .slick-dots li { transform: rotate(270deg); } .devProcess .customslider .secondHeading { color: red; text-align: left; padding: 0; } .customslider .list-point { padding: 0 0 0 30px; } .devProcess .darktext { font-size: 22px; } .customslider .slide img { display: block; width: 500px; height: auto; box-shadow: 10px 10px 5px 0px red; margin: 20px auto 0; transform: translateY(-20px); } .customslider .slick-dots { display: flex; justify-content: center; margin: 0; padding: 1rem 0; list-style-type: none; } .customslider .slick-dots li { margin: 0 0.1rem; } .customslider .row { display: flex; align-items: center; } .customslider .slick-list.draggable { /* padding: 80px 0 0; */ height: unset; margin: 50px 0; } .customslider .slick-dots button { display: block; width: 10px; height: 10px; padding: 0; border: none; border-radius: 100%; background-color: #ccc; text-indent: -9999px; } .customslider .slick-dots li.slick-active button { background-color: #2346aa; } .customslider .slick-dots a { width: 22px; height: 29px; font-size: 22px; margin: 0 5px; line-height: 24px; display: flex; justify-content: center; text-decoration: none; color: #303030; padding: 0 20px; cursor: pointer; margin: 0 20px; } .customslider .slick-dots .slick-active a { color: red; font-size: 34px; } .customslider .slick-dots a:hover { background: transparent; } .devProcess .small-bubble-vector1 { left: 20%; animation: shake-vertical 12s ease-in-out infinite; } .devProcess .small-bubble-vector2 { left: 15%; top: 55%; animation: shake-vertical 12s ease-in-out infinite; } .devProcess .small-bubble-vector3 { left: 90%; max-width: 20px; animation: shake-vertical 10s ease-in-out infinite; } .devProcess .small-bubble-vector4 { left: 84%; bottom: 17%; max-width: 14px; animation: shake-vertical 10s ease-in-out infinite; } .devProcess .small-bubble-vector5 { animation: shake-vertical 8s ease-in-out infinite; } /* devprocess Sec css end */ /* technology Sec css start */ .technology { position: relative; background-image: url(../images/partnersbg.png); background-size: contain; padding: 100px 0 50px; } .technology .technologySecrightbox { text-align: center; } .technology .triangle2 { bottom: 19%; left: 85%; animation: rotate-scale-up 9s infinite; } .technology .triangle1 { left: 89%; bottom: 9%; animation: rotate-scale-up 7s infinite; } .technology .triangle4 { left: 5%; top: 10%; } .technology .triangle3 { left: 9%; top: 13%; } .technology .small-bubble-vector1 { left: 14%; } .technology .small-bubble-vector2 { left: 10%; top: 30%; } .technology .small-bubble-vector3 { left: 90%; top: 90%; } .technology marquee { position: absolute; top: 0; } /* technology Sec css end */ /* whyAppsVent revSec css start */ .whyAppsVent.revSec { background-image: url(../images/whyAppsvent2BG.png); } .whyAppsVent.revSec .list-point { padding-left: 20px; } .whyAppsVent.revSec .list-point li {} .whyAppsVent.revSec .list-point li a { color: #fff; } .whyAppsVent.revSec .list-point li::after { border: 1px solid #fff; } .whyAppsVent.revSec .list-point li::before { background: #fff; } .whyAppsVent.revSec .list-point li a:hover { color: red; } /* whyAppsVent revSec css end */ /* clientBenifits css start */ .clientBenifits { position: relative; background-image: url(../images/clientBenifitsBG.png); background-size: contain; } .clientBenifits marquee { position: absolute; top: 0px; } .clientBenifits .clientBenifitsBox .subtitleLight { color: red; } .clientBenifits .clientBenifitsBox { width: 70%; } .clientBenifits .clientBenifitsBox .secondHeading { color: #fff; } .clientBenifits .clientBenifitsBox .lightText { color: #fff; } .clientBenifits .BenifitsService { width: 100%; padding: 50px 0 0; } .clientBenifits .BenifitsService ul { list-style: none; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; } .clientBenifits .BenifitsService ul li { width: 22%; } .clientBenifits .BenifitsService ul li .secondHeading { font-size: 26px; color: #fff; } .clientBenifits .BenifitsService ul li .secondHeading span { color: red; } .clientBenifits .BenifitsService ul li .lightText { color: #fff; } .clientBenifits .triangle1 { left: 91%; width: 70px; animation: rotate-scale-up 12s infinite; } .clientBenifits .triangle2 { left: 86%; top: 30%; width: 50px; } .clientBenifits .triangle3 { left: 90%; width: 70px; animation: rotate-scale-up 12s infinite; } .clientBenifits .triangle4 { top: 10%; left: 4%; animation: rotate-scale-up 12s infinite; } .clientBenifits .triangle5 { top: 70%; left: 4%; animation: rotate-scale-up 12s infinite; width: 80px; } .clientBenifits .triangle6 { top: 70%; left: 4%; animation: rotate-scale-up 12s infinite; width: 80px; } .clientBenifits .BenifitsService ul li:hover { transform: scale(1.1); transition: all ease 1s; background: #ffffff40; } .clientBenifits .BenifitsService ul li { transition: all ease 1s; padding: 10px; } /* clientBenifits css end */ /* ios development page start */ /* growth sec css start */ .clientBenifits.growth { position: relative; background: url(../images/IosAppDevelopment/iosbenifitsBG.png); background-position: bottom; z-index: 0; } .clientBenifits .clientBenifitsBox { width: 60%; } .clientBenifits.growth .BenifitsService ul li { width: 30%; margin: 20px 0; } .clientBenifits.growth .BenifitsService ul { display: flex; flex-wrap: wrap; } .clientBenifits.growth .clientBenifitsBox .subtitleLight { color: #fff; } /* growth sec css end */ /* transSec sec css start */ section.whyAppsVent.transSec .iosAppsLeftSec img { width: 90%; } section.whyAppsVent.transSec .row { display: flex; align-items: center; } section.whyAppsVent.transSec { background: #f3f3f3; } section.whyAppsVent.transSec .subtitleLight { color: #000; } section.whyAppsVent.transSec .secondHeading { color: #000; } section.whyAppsVent.transSec .darktext { color: #000; } section.whyAppsVent.transSec .lightText { color: #000; } section.whyAppsVent.transSec .iosAppsLeftSec { /* background: url(../images/IosAppDevelopment/iosTrivector.png); */ /* background-size: contain; */ /* background-position: center center; */ /* background-repeat: no-repeat; */ position: relative; z-index: 0; } section.whyAppsVent.transSec .iosAppsLeftSec img { position: absolute; bottom: 0; top: 0; margin: auto; width: 100%; } section.whyAppsVent.transSec .iosAppsLeftSec .timg { z-index: 1; width: 1660px; left: -960px; top: 50px; } section.whyAppsVent.transSec .iosAppsLeftSec .simg { z-index: 2; left: -120px; animation: rotate-scale-up 50s infinite; } section.whyAppsVent.transSec .iosAppsLeftSec .fimg { z-index: 3; left: -120px; } section.whyAppsVent.transSec .triangle1 { left: 90%; top: 10%; } section.whyAppsVent.transSec .triangle2 { left: 90%; top: 16%; } section.whyAppsVent.transSec .triangle3 { left: 90%; width: 130px; bottom: -60px; } section.whyAppsVent.transSec .triangle4 { left: 80%; } section.whyAppsVent.transSec .triangle5 { left: 5%; bottom: 3%; width: 100px; animation: rotate-scale-up 12s infinite; } section.whyAppsVent.transSec .triangle6 { left: 80%; animation: rotate-scale-up 12s infinite; width: 110px; } section.whyAppsVent.transSec .triangle7 { left: 5%; bottom: 23%; width: 100px; animation: rotate-scale-up 12s infinite; } .slide-tr { animation: slide-tr 3s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite alternate both; } @keyframes slide-tr { 0% { transform: translateY(0) translateX(0); } 100% { transform: translateY(-100px) translateX(100px); } } /* transSec sec css end */ /* .ensureAndCutting Sec css start */ .ensureAndCutting { position: relative; background: url(../images/IosAppDevelopment/ensureandCuttingBG.png); background-position: top; padding: 50px 0 100px; } .ensureAndCutting marquee .animatedTxt { -webkit-text-stroke: 1px #3f2d30; } .ensureAndCutting_Box .secondHeading { color: #fff; font-size: 35px; } .ensureAndCutting .ensureAndCutting_Box .lightText { color: #fff; } .ensureAndCutting .ensureAndCutting_Box li a { color: #fff; } .ensureAndCutting .ensureAndCutting_Box .list-point { padding-left: 20px; } .ensureAndCutting_Box { background: #151515; height: 780px; display: flex; flex-direction: column; padding: 30px 30px; justify-content: space-around; transition: all ease 1s; width: 95%; margin: 0 auto; position: relative; z-index: 2; } .ensureAndCutting_Box:hover { background: #2b0d12; transition: all ease 1s; transform: scale(1.06); } .ensureAndCutting_Box ul { list-style: none; } .ensureAndCutting_Box ul li:first-child { margin-bottom: 60px; } .ensureAndCutting_Box .darktext { font-size: 24px; } .ensureAndCutting_Box .appsTypes li { margin-bottom: 0; } .ensureAndCutting_Box .appsTypes li { margin: 0 0 20px !important; } .ensureAndCutting_Box .appsTypes li img { width: 30px; height: 30px; object-fit: contain; margin: 0 10px 0 0; } .ensureAndCutting .ensureAndCutting_Box li a:hover { color: red; } .ensureAndCutting .triangle1 { left: 90%; bottom: 0%; } .ensureAndCutting .triangle2 { left: 90%; top: 0%; animation: rotate-scale-up 15s infinite; } .ensureAndCutting .triangle3 { left: 2%; z-index: 1; width: 130px; } .ensureAndCutting .triangle4 { left: 0; top: 32%; opacity: 1; } .ensureAndCutting .triangle5 { width: 100px; animation: rotate-scale-up 15s infinite; left: 45%; z-index: 0; } .ensureAndCutting .triangle6 { width: 100px; animation: rotate-scale-up 15s infinite; left: 5%; z-index: 0; } .ensureAndCutting .triangle7 { left: 44%; bottom: -5%; position: absolute; z-index: 1; animation: rotate-scale-up 15s infinite; width: 300px; } /* .ensureAndCutting Sec css end */ /* emerging sec css start */ .emergingTechSec { position: relative; background-image: url(../images/partnersbg.png); background-size: contain; } .emergingTechSec .solutionSecleftbox { /* padding-left: 80px; */ width: 70%; margin: 0 auto; } .emergingTechSec .center.slider .slick-slide { margin: 25px 1px; min-width: 218px; } .emergingTechSec .row { display: flex; align-items: center; } .emergingTechSec .center.slider .slick-slide img { width: 85%; margin: 0 -50px; background: #fff; padding: 30px; height: 240px; object-fit: contain; box-shadow: 4px 5px 10px 6px #ddd; } .emergingTechSec .center.slider { margin: 40px 0; padding: 0; } /* emerging sec css end */ /* conter sec css start */ .counterSec { position: relative; padding: 20px 0; } .counterSec .bgBox { background: #f4f4f4; padding: 40px 0; } .counterSec .secondHeading { text-align: center; } .counterSec .bgBox .secondHeading strong { color: red; } .counterSec .bgBox .secondHeading { font-weight: 500; } .counterSec .secondHeading:before { content: none; } .counterSec .row { display: flex; align-items: center; } .counterSec:before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; background: #00000014; height: 100%; width: 65%; z-index: -1; clip-path: polygon(0 0, 51% 0, 100% 100%, 0% 100%); animation: conterBG-left 10s infinite alternate both; } .counterSec:after { content: ''; position: absolute; right: 0; top: 0; bottom: 0; background: red; height: 100%; width: 64%; z-index: -1; clip-path: polygon(0 0, 100% 0, 100% 100%, 49% 100%); animation: conterBG-right 5s infinite alternate both; } .counterSec .tiles-box { text-align: center; position: relative; padding: 50px 100px; } .counterSec .tiles-box:before { position: absolute; } .counterSec .tiles-box h3 { margin: 0 0 15px; font-size: 24px; color: #000; text-transform: capitalize; font-family: 'Conv_Poppins-Regular', sans-serif !important; } .counterSec .tiles-box p { margin: 0 0 25px; font-size: 45px; color: #000; font-weight: 800; text-transform: uppercase; font-family: 'Conv_Poppins-Regular', sans-serif !important; } .conterBG-left { animation: conterBG-left 10s infinite alternate both; } @keyframes conterBG-left { 0% { transform: translateX(0); } 100% { transform: translateX(-100px); } } .conterBG-right { animation: conterBG-right 5s infinite alternate both; } @keyframes conterBG-right { 0% { transform: translateX(0); } 100% { transform: translateX(100px); } } /* counter sec css end */ /* ios development page end */ /* wearable development page start */ section.servicesSec.wearablePage marquee { position: absolute; z-index: 1; } section.clientBenifits.bg1 { background-image: url(../images/wearable/bg1.png); background-size: 100% 100%; background-position: top; background-repeat: no-repeat; height: 100vh; display: flex; align-items: center; } section.clientBenifits.bg1 .clientBenifitsBox { width: 100%; } section.clientBenifits.bg1 .row { display: flex; justify-content: flex-end; } section.clientBenifits.bg1 .subtitleLight { color: #fff; font-size: 65px; line-height: 1; } section.clientBenifits.bg1 .secondHeading { font-weight: 400; } section.devProcess.lightSec { background: none; position: relative; } section.devProcess.lightSec .centerContentBox { width: 100%; } section.devProcess.lightSec .centerContentBox .subtitleLight { color: #000; } section.devProcess.lightSec .centerContentBox .secondHeading { color: #000; } section.devProcess.lightSec .centerContentBox .darktext { color: #000; font-size: 16px; width: 80%; margin: 0 auto; } section.devProcess.lightSec marquee { position: absolute; top: 10px; } section.devProcess.lightSec .small-bubble.small-bubble-vector1 { left: 10%; z-index: 0; } section.devProcess.lightSec .small-bubble.small-bubble-vector2 { left: 85%; width: 15px; } section.devProcess.lightSec .triangle.triangle1 { left: 87%; position: absolute; z-index: -1; animation: rotate-scale-up 12s infinite; } section.devProcess.lightSec .triangle.triangle2 { left: 87%; position: absolute; z-index: -1; animation: rotate-scale-up 12s infinite; } section.devProcess.lightSec .triangle.triangle3 { left: 7%; top: 20%; position: absolute; z-index: -1; animation: rotate-scale-up 12s infinite; } section.devProcess.lightSec .triangle.triangle4 { left: 7%; top: 20%; position: absolute; z-index: -1; animation: rotate-scale-up 12s infinite; } section.devProcess.lightSec .triangle.triangle5 { left: 80%; top: 20%; position: absolute; z-index: -1; animation: rotate-scale-up 12s infinite; width: 120px; } section.devProcess.lightSec .triangle.triangle6 { left: 10%; bottom: 8%; position: absolute; z-index: -1; animation: rotate-scale-up 12s infinite; width: 120px; } section.devProcess.lightSec .triangle.triangle7 { left: 10%; bottom: 9%; position: absolute; z-index: -1; animation: rotate-scale-up 12s infinite; width: 120px; } section.clientBenifits.bg1.bg2 { background-image: url(../images/wearable/bg2.png); } /* wearable development page end */ /* 404 page start */ #handboy{ animation: swing ease-in-out 1.3s infinite alternate; transform-origin: 98% 98%; transform-box: fill-box; } #girllight{ animation: swing ease-in-out 1.3s infinite alternate; transform-origin: 0% 97%; transform-box: fill-box; } #hairgirl{ animation: swinghair ease-in-out 1.3s infinite alternate; transform-origin: 60% 0%; transform-box: fill-box; } #zero{ transform-origin: bottom; transform-box: fill-box; } /*************swing************/ @keyframes swing { 0% { transform: rotate(10deg); } 100% { transform: rotate(-10deg); } } /*************swing hair************/ @keyframes swinghair { 0% { transform: rotate(6deg); } 100% { transform: rotate(-6deg); } } .heartbeat { animation: heartbeat 2s cubic-bezier(0.470, 0.000, 0.745, 0.715) infinite both; } @-webkit-keyframes heartbeat { from { transform: scale(1); transform-origin: center center; animation-timing-function: ease-out; } 10% { transform: scale(0.91); animation-timing-function: ease-in; } 17% { transform: scale(0.98); animation-timing-function: ease-out; } 33% { transform: scale(0.87); animation-timing-function: ease-in; } 45% { transform: scale(1); animation-timing-function: ease-out; } } @keyframes heartbeat { from { transform: scale(1); transform-origin: center center; animation-timing-function: ease-out; } 10% { transform: scale(0.91); animation-timing-function: ease-in; } 17% { transform: scale(0.98); animation-timing-function: ease-out; } 33% { transform: scale(0.87); animation-timing-function: ease-in; } 45% { transform: scale(1); animation-timing-function: ease-out; } } .shake-top { animation: shake-top 4s cubic-bezier(0.455, 0.030, 0.515, 0.955) infinite both; } @-webkit-keyframes shake-top { 0%,100% { transform: rotate(0deg); transform-origin: 50% 0; } 10% { transform: rotate(2deg); } 20%,40%,60% { transform: rotate(-4deg); } 30%,50%,70% { transform: rotate(4deg); } 80% { transform: rotate(-2deg); } 90% { transform: rotate(2deg); } } @keyframes shake-top { 0%,100% { transform: rotate(0deg); transform-origin: 50% 0; } 10% { transform: rotate(2deg); } 20%,40%,60% { transform: rotate(-4deg); } 30%,50%,70% { transform: rotate(4deg); } 80% { transform: rotate(-2deg); } 90% { transform: rotate(2deg); } } /* 404 page end */ /* app Support page star */ .banner.formBanner.rightImg .imgRightbox { animation: shake-top 14s cubic-bezier(0.455, 0.030, 0.515, 0.955) infinite both; } .clientBenifits.growth.support { background: url(../images/partnersbg.png); position: relative; z-index: 1; } .clientBenifits.growth.support .subtitleLight { color: #000; } .clientBenifits.growth.support .secondHeading { color: #000; } .clientBenifits.growth.support .lightText { color: #000; } .clientBenifits.growth.support .clientBenifitsBox { width: 100%; } section.clientBenifits.growth.support .BenifitsService ul li { width: 45%; } section.clientBenifits.growth.support .BenifitsService ul li:hover { background: #46464640; } .clientBenifits.growth.support .row.mainContent { display: flex; align-items: center; } section.whyAppsVent.transSec.maintanance { background-image: url(../images/app-support/Group-3.jpg); padding: 100px 50px 80px; height: 850px; } .whyAppsVent.transSec.maintanance img.fimg { width: 880px; height: 511px; position: absolute; left: -43%; object-fit: cover; } section.whyAppsVent.transSec.maintanance .subtitleLight { color: #fff; font-size: 65px; } section.whyAppsVent.transSec.maintanance .secondHeading { color: #fff; } section.whyAppsVent.transSec.maintanance .lightText { color: #fff; } section.whyAppsVent.transSec.maintanance .row { display: flex; align-items: center; } section.whyAppsVent.transSec.maintanance marquee { top: 10px; } .whyAppsVent.transSec.maintanance .small-bubble-vector1 { top: 90%; max-width: 30px; animation: shake-vertical 8s ease-in-out infinite; } .whyAppsVent.transSec.maintanance .small-bubble-vector2 { left: 10%; top: 30%; } .whyAppsVent.transSec.maintanance .triangle7 { left: 90%; animation: rotate-scale-up 10s infinite; } .whyAppsVent.transSec.maintanance .triangle6 { left: 34%; bottom: 3%; } .whyAppsVent.transSec.maintanance .triangle5 { bottom: 10%; } .whyAppsVent.transSec.maintanance .triangle4 { left: 10%; top: 10%; } .whyAppsVent.transSec.maintanance .triangle2 { animation: rotate-scale-up 10s infinite; } .whyAppsVent.transSec.maintanance .triangle1 { animation: rotate-scale-up 10s infinite; } .whyAppsVent.transSec.maintanance .triangle3 { left: 0; bottom: 0%; } /****************** education-app-page css start *****************/ section.innerbaner.industries-sec.education-baner .main { text-align: left; align-items: flex-start; } section.innerbaner.industries-sec.education-baner:after { background: url(images/education-apps-baner-phone.png); transform: scale(1, 1); width: 558px; height: 595px; right: 7%; top: 12%; } .learning-managment-section .managment-events { padding: 50px 0 0; text-align: center; } .learning-managment-section .main { text-align: center; display: flex; flex-direction: column; align-items: center; padding: 50px 0 20px; } .learning-managment-section .managment-events .education-apps { display: flex; flex-wrap: wrap; flex-direction: row; padding: 0; justify-content: center; } .learning-managment-section .managment-events .education-apps .item { flex-direction: column; align-items: center; display: flex; margin: 50px 15px 50px 15px; background: #fff; padding: 0 0px; border-radius: 6px; box-shadow: 0px 0 9px -4px; width: 20%; position: relative; padding: 50px 0 0; transition: all ease 1s; border: 2px solid transparent; } .learning-managment-section .managment-events .education-apps .item:before { content: ''; position: absolute; left: 0; top: -30px; right: 0; margin: 0 auto; background: #fff; width: 110px; height: 110px; border-radius: 50%; } .learning-managment-section .managment-events .education-apps .item:after { content: ''; position: absolute; left: 0.5px; top: -22.5px; right: 0; margin: 0 auto; /* background: #fff; */ width: 85px; height: 85px; border-radius: 50%; border: 1px solid #d4d4d4; } .learning-managment-section .managment-events .education-apps .item:hover { border: 2px solid red; transition: all ease 1s; transform: scale(1.05); } .learning-managment-section .managment-events .education-apps .item .lightText { margin-top: 0; color: #adadad; } .learning-managment-section .managment-events .education-apps .item img { width: 90px; height: 90px; margin-top: -93px; /* border: 15px solid #fff; */padding: 20px; position: relative; /* border: 1px solid #ddd; */position: relative; position: relative; object-fit: contain; } .learning-managment-section .managment-events .education-apps .item:hover a img { filter: invert(19%) sepia(51%) saturate(7398%) hue-rotate(356deg) brightness(99%) contrast(600%); border: 1px solid #000; border-radius: 50%; } .learning-managment-section .managment-events .education-apps .item p { padding: 20px; font-size: 16px; line-height: 26px; text-align: center; } .learning-managment-section .sub-heading { color: #6c6c6c; letter-spacing: 4px; text-transform: uppercase; font-weight: 500; font-size: 15px; padding: 20px 0 15px; margin: 0; } .learning-managment-section .sec-heading { text-transform: uppercase; font-size: 35px; font-family: 'georgeTown-Regular', sans-serif; font-weight: 300; margin: 0 0 25px; } section.explore-sec.education-page { position: relative; } section.explore-sec.education-page::after { position: absolute; content: ''; width: 793px; height: 526px; background: var(--skyblue-color); right: 0; top: -7%; z-index: -1; animation: bounce-right 5s infinite both; } section.explore-sec.education-page .edu-img:before { position: absolute; content: ''; background: url(images/education-page-explore-section.png); width: 1069px; height: 1136px; right: -210px; top: 0; } .learning-managment-section { background: url(../images/partnersbg.png); position: relative; z-index: 0; } .learning-managment-section:before { content: ''; position: absolute; background: url(../images/app-support/Rectangle.png); left: 0; top: 0; background-size: cover; background-position: center; z-index: -1; width: 100%; height: 130%; animation: slide-top 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite alternate both; } .learning-managment-section .centerHeading { width: 80%; margin: 0 auto; padding: 0; } .learning-managment-section .centerHeading .newHeading { margin-bottom: 30px; } .learning-managment-section .centerHeading .lightText { color: #000; } .learning-managment-section .triangle1 { top: 10%; z-index: -1; animation: rotate-scale-up 10s infinite; } .learning-managment-section .triangle2 { left: 10%; z-index: -1; top: 22%; animation: rotate-scale-up 10s infinite; } .learning-managment-section .triangle3 { animation: rotate-scale-up 10s infinite; z-index: -2; top: 90%; } .learning-managment-section .triangle4 { animation: rotate-scale-up 10s infinite; z-index: -2; top: 90%; } .learning-managment-section .triangle5 { animation: rotate-scale-up 10s infinite; z-index: -1; top: 70%; width: 120px; left: 87%; } .learning-managment-section .triangle6 { animation: rotate-scale-up 13s infinite; z-index: -1; top: 70%; width: 120px; left: 87%; } .learning-managment-section .triangle7 { animation: rotate-scale-up 13s infinite; z-index: -1; top: 70%; width: 140px; left: 5%; } .slide-top { animation: slide-top 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite alternate both; } @-webkit-keyframes slide-top { 0% { transform: translateY(0); } 100% { transform: translateY(-100px); } } @keyframes slide-top { 0% { transform: translateY(0); } 100% { transform: translateY(-100px); } } /****************** education-app-page css end *****************/ /* app Support page start */ /* supportNmaintanance Sec start */ .supportNmaintanance { background: url(../images/app-support/support&maintanance.png); background-position: left top; padding: 50px 0 50px; background-size: cover; position: relative; background-repeat: no-repeat; } .supportNmaintanance marquee { position: absolute; } .supportNmaintanance .supportMaintananceContent .subtitleLight { color: #fff; font-size: 60px; } .supportNmaintanance .supportMaintananceContent .secondHeading { color: #fff; margin-bottom: 40px; font-size: 40px; font-weight: 300; } .supportNmaintanance .supportMaintananceContent .contentBox { margin-bottom: 20px; margin-top: 15px; } .supportNmaintanance .supportMaintananceContent .smallHeading { font-size: 22px; margin-bottom: 10px; } .supportNmaintanance .supportMaintananceContent .contentBox .lightText { color: #fff; width: 70%; margin-bottom: 0; } .supportNmaintanance .supportMaintananceContent .smallHeading::before { width: 5px; } .supportNmaintanance .triangle1 { left: 85%; top: 45%; position: absolute; animation: rotate-scale-up 10s infinite; width: 120px; } .supportNmaintanance .triangle2 { left: 94%; top: 81%; position: absolute; animation: rotate-scale-up 10s infinite; width: 90px; } .supportNmaintanance .triangle3 { left: 94%; top: 76%; position: absolute; animation: rotate-scale-up 10s infinite; width: 90px; } .supportNmaintanance .triangle4 { left: 93%; top: 65%; position: absolute; animation: rotate-scale-up 10s infinite; width: 90px; } .supportNmaintanance .triangle5 { left: 27%; top: 80%; position: absolute; animation: rotate-scale-up 10s infinite; width: 150px; } .supportNmaintanance .triangle6 { left: 96%; top: 24%; position: absolute; animation: rotate-scale-up 10s infinite; width: 150px; } .supportNmaintanance .triangle7 { left: 93%; top: 94%; position: absolute; animation: rotate-scale-up 10s infinite; width: 150px; } /* supportNmaintanance Sec end */ /* approach sec css start */ .approach { position: relative; background-image: url(../images/app-support/approachBg.jpg); background-size: cover; background-position: 100% 100%; background-repeat: no-repeat; height: 780px; display: flex; align-items: center; padding: 100px 0 0; z-index: 0; } .approach marquee { position: absolute; top: 0; z-index: 2; } .approach .subtitleLight { color: #fff; } .approach .secondHeading { color: #fff; } .approach .lightText { color: #fff; } .approach .triangle3 { left: 93%; animation: rotate-scale-up 9s infinite; } .approach .triangle4 { left: 93%; width: 70px; animation: rotate-scale-up 6s infinite; } .approach .triangle2 { left: 20%; bottom: 10%; width: 70px; } .approach .triangle1 { left: 20%; bottom: 12%; width: 70px; } .approach .triangle5 { left: -12%; bottom: 25%; width: 26%; animation: rotate-scale-up 19s infinite; position: absolute; z-index: 1; } /* approach sec css end */ /* app Support page end */ /* startup prototype page start */ .prototyeConsultant { background-image: url(../images/startupPrototype/prototyeConsultantBg.png); background-size: cover; position: relative; z-index: 0; background-position: top; background-repeat: no-repeat; padding: 100px 0 100px; } .prototyeConsultant marquee { position: absolute; top: 0; z-index: 1; } .prototyeConsultant .subtitleLight { color: #fff; font-size: 65px; } .prototyeConsultant .secondHeading { color: #fff; } .prototyeConsultant .lightText { color: #fff; } .prototyeConsultant .triangle7 { left: 35%; top: 0%; animation: rotate-scale-up 23s infinite; z-index: -1; } .prototyeConsultant .triangle6 { left: 10%; top: 10%; animation: rotate-scale-up 13s infinite; width: 100px; } .prototyeConsultant .triangle5 { left: 10%; top: 10%; animation: rotate-scale-up 7s infinite; width: 100px; z-index: 0; } .prototyeConsultant .triangle4 { left: 10%; top: 80%; animation: rotate-scale-up 7s infinite; } .prototyeConsultant .triangle2 { animation: rotate-scale-up 10s infinite; left: 90%; top: 45%; } .prototyeConsultant .triangle1 { animation: rotate-scale-up 13s infinite; left: 80%; top: 83%; width: 70px; } .prototyeConsultant .triangle3 { left: 79%; top: 86%; width: 70px; } /* startup prototype page end */ /* intellectual property start */ /* banner with right content banner start */ .banner.formBanner.rightContent { height: 750px; } .banner.formBanner.rightContent .banner-body .item { top: 45%; transform: translateY(-53%); } .banner.formBanner.rightContent .word span { font-size: 66px; } .banner.formBanner.rightContent .evenword { font-size: 61px; } .banner.formBanner.rightContent .bannerRightContent { padding-top: 50px; } /* banner with right content banner end */ /* leftimgwith-rightContent sec start */ .leftimgwith-rightContent { background: url(../images/partnersbg.png); padding: 100px 0 100px; position: relative; } .leftimgwith-rightContent .imgbox img { width: 100%; height: 100%; position: relative; object-fit: cover; } .leftimgwith-rightContent .imgbox { position: relative; } .leftimgwith-rightContent .imgbox:before { content: ''; position: absolute; width: 90%; height: 90%; background: red; bottom: -30px; right: -30px; animation: slide-tl 5s linear infinite alternate both; } .leftimgwith-rightContent .clientBenifitsBox { padding-left: 50px; } .leftimgwith-rightContent .clientBenifitsBox .subtitleLight { font-size: 56px; line-height: 1.1; } .leftimgwith-rightContent .clientBenifitsBox .secondHeading { font-weight: 400; line-height: 1.2; } .leftimgwith-rightContent marquee { position: absolute; top: 0; } .leftimgwith-rightContent .triangle1 { animation: rotate-scale-up 9s infinite; bottom: 3%; left: 8%; width: 70px; } .leftimgwith-rightContent .triangle2 { animation: rotate-scale-up 9s infinite; bottom: 9%; width: 70px; } .leftimgwith-rightContent .triangle3 { animation: rotate-scale-up 12s infinite; } .leftimgwith-rightContent .triangle4 { animation: rotate-scale-up 12s infinite; left: 88%; top: 25%; width: 130px; z-index: 0; } .leftimgwith-rightContent .triangle5 { animation: rotate-scale-up 12s infinite; left: 2%; top: 31%; width: 150px; z-index: 0; } .leftimgwith-rightContent .triangle6 { animation: rotate-scale-up 12s infinite; left: 90%; top: 31%; width: 130px; z-index: 0; } .leftimgwith-rightContent .triangle7 { animation: rotate-scale-up 12s infinite; left: 1%; width: 120px; top: 40%; } .slide-tl { animation: slide-tl 5s linear infinite alternate both; } @-webkit-keyframes slide-tl { 0% { transform: translateY(0) translateX(0); } 100% { transform: translateY(-100px) translateX(-100px); } } @keyframes slide-tl { 0% { transform: translateY(0) translateX(0); } 100% { transform: translateY(-100px) translateX(-100px); } } /* leftimgwith-rightContent sec end */ /* arbitration sec start */ .prototyeConsultant.arbitration { background-image: url(../images/intellectual-property/ARBITRATIONbg.png); } /* arbitration sec end */ /* rightimgwith-leftContent sec end */ .rightimgwith-leftContent { background: url(../images/partnersbg.png); padding: 100px 0 100px; position: relative; background-color: #c3b8b82b; } .rightimgwith-leftContent .imgbox img { width: 100%; height: 100%; position: relative; object-fit: cover; } .rightimgwith-leftContent .imgbox { position: relative; } .rightimgwith-leftContent .imgbox:before { content: ''; position: absolute; width: 90%; height: 90%; background: red; bottom: -30px; right: -30px; animation: slide-tl 5s linear infinite alternate both; } .rightimgwith-leftContent marquee { position: absolute; top: 0; } .rightimgwith-leftContent .triangle1 { animation: rotate-scale-up 9s infinite; bottom: 3%; left: 8%; width: 70px; } .rightimgwith-leftContent .triangle2 { animation: rotate-scale-up 9s infinite; bottom: 9%; width: 70px; } .rightimgwith-leftContent .triangle3 { animation: rotate-scale-up 12s infinite; } .rightimgwith-leftContent .triangle4 { animation: rotate-scale-up 12s infinite; left: 88%; top: 25%; width: 130px; z-index: 0; } .rightimgwith-leftContent .triangle5 { animation: rotate-scale-up 12s infinite; left: 2%; top: 31%; width: 150px; z-index: 0; } .rightimgwith-leftContent .triangle6 { animation: rotate-scale-up 12s infinite; left: 90%; top: 31%; width: 130px; z-index: 0; } .rightimgwith-leftContent .triangle7 { animation: rotate-scale-up 12s infinite; left: 1%; width: 120px; top: 40%; } /* rightimgwith-leftContent sec end */ /* leftimgwith-rightContent sec start */ .leftimgwith-rightContent2 { background: url(../images/partnersbg.png); padding: 100px 0 100px; position: relative; } .leftimgwith-rightContent2 .imgbox img { width: 100%; height: 100%; position: relative; object-fit: cover; } .leftimgwith-rightContent2 .imgbox { position: relative; } .leftimgwith-rightContent2 .imgbox:before { content: ''; position: absolute; width: 90%; height: 90%; background: red; bottom: -30px; left: -30px; animation: slide-tr 7s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite alternate both; } .leftimgwith-rightContent2 .clientBenifitsBox { padding-left: 50px; } .leftimgwith-rightContent2 .clientBenifitsBox .subtitleLight { font-size: 56px; line-height: 1.1; } .leftimgwith-rightContent2 .clientBenifitsBox .secondHeading { font-weight: 400; line-height: 1.2; } .leftimgwith-rightContent2 marquee { position: absolute; top: 0; } .leftimgwith-rightContent2 .triangle1 { animation: rotate-scale-up 9s infinite; bottom: 3%; left: 8%; width: 70px; } .leftimgwith-rightContent2 .triangle2 { animation: rotate-scale-up 9s infinite; bottom: 9%; width: 70px; } .leftimgwith-rightContent2 .triangle3 { animation: rotate-scale-up 12s infinite; } .leftimgwith-rightContent2 .triangle4 { animation: rotate-scale-up 12s infinite; left: 88%; top: 25%; width: 130px; z-index: 0; } .leftimgwith-rightContent2 .triangle5 { animation: rotate-scale-up 12s infinite; left: 2%; top: 31%; width: 150px; z-index: 0; } .leftimgwith-rightContent2 .triangle6 { animation: rotate-scale-up 12s infinite; left: 90%; top: 31%; width: 130px; z-index: 0; } .leftimgwith-rightContent2 .triangle7 { animation: rotate-scale-up 12s infinite; left: 1%; width: 120px; top: 40%; } .slide-tr { animation: slide-tr 5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite alternate both; } @-webkit-keyframes slide-tr { 0% { transform: translateY(0) translateX(0); } 100% { transform: translateY(-100px) translateX(100px); } } @keyframes slide-tr { 0% { transform: translateY(0) translateX(0); } 100% { transform: translateY(-100px) translateX(100px); } } /* leftimgwith-rightContent sec end */ /* securing-assets sec start */ .securing-assets { position: relative; display: flex; align-items: center; flex-wrap: wrap; background: url(../images/intellectual-property/securing-assetsBG.png); padding: 100px 0 100px; background-position: center center; height: 800px; } .securing-assets .clientBenifitsBox { width: 75%; } .securing-assets .securingRightImg { position: absolute; right: -90px; top: 130px; bottom: 0; margin: 0; } .securing-assets marquee { position: absolute; top: 0; } .securing-assets .subtitleLight { color: #fff; font-size: 55px; } .securing-assets .secondHeading { color: #fff; font-size: 50px; } .securing-assets .lightText { color: #fff; } .securing-assets ul { display: flex; flex-wrap: wrap; } .securing-assets ul li { display: flex; width: 33.333%; padding-left: 20px; position: relative; padding-top: 10px; padding-bottom: 10px; } .securing-assets ul li:before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; margin: auto; width: 8px; height: 8px; background: red; border-radius: 5px; } .securing-assets ul li:after { content: ''; position: absolute; left: -4px; top: 0px; bottom: 0; margin: auto; width: 16px; height: 16px; background: transparent; border-radius: 9px; border: 1px solid #787272; } .securing-assets ul li a:hover { color: red; letter-spacing: 2px; } .securing-assets ul li a { color: #fff; } .securing-assets .securingRightImg img { width: 80%; animation: scale-down-center 3s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite alternate both; } .securing-assets .triangle.triangle1 {} .securing-assets .triangle.triangle2 { width: 100px; height: auto; top: 23%; left: 4%; animation: rotate-scale-up 10s infinite; } .securing-assets .triangle.triangle3 { opacity: 0.4; } .securing-assets .triangle.triangle4 { opacity: 0.4; } .securing-assets .triangle.triangle5 { width: 100px; height: auto; top: 62%; left: 7%; z-index: 0; animation: rotate-scale-up 10s infinite; opacity: 0.4; } .securing-assets .triangle.triangle6 { width: 100px; height: auto; top: 64%; left: 7%; z-index: 0; animation: rotate-scale-up 10s infinite; opacity: 0.4; } .securing-assets .triangle.triangle7 { width: 100px; height: auto; top: 23%; left: 90%; animation: rotate-scale-up 10s infinite; opacity: 0.4; } .scale-down-center { animation: scale-down-center 3s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite alternate both; } @-webkit-keyframes scale-down-center { 0% { transform: scale(1); } 100% { transform: scale(0.5); } } @keyframes scale-down-center { 0% { transform: scale(1); } 100% { transform: scale(0.8); } } /* securing-assets sec end */ /* intellectual property end */ /* leading flutter app page start */ /* flutterService Sec start */ .servicesSec.flutterService { position: relative; background: #f5f5f5; } .servicesSec.flutterService marquee { position: absolute; top: 0px; } .servicesSec.flutterService section.serviceBox { background: transparent; } .servicesSec.flutterService section.serviceBox .row { display: flex; align-items: center; } .servicesSec.flutterService .small-bubble.small-bubble-vector1 { top: 10%; } .servicesSec.flutterService .small-bubble.small-bubble-vector2 { display: none; } .servicesSec.flutterService .small-bubble.small-bubble-vector6 { top: 12%; } .servicesSec.flutterService .triangle.triangle3 { top: 8px; left: 44%; } .servicesSec.flutterService .triangle.triangle4 { top: 8px; left: 50%; width: 60px; } /* flutterService Sec end */ /* flutterExperties Sec start */ .clientBenifits.growth.flutterExperties { background: url(../images/flutter-app/digital-experties.png); background-position: bottom; background-size: 100% 100%; padding: 100px 0; position: relative; } .clientBenifits.growth.flutterExperties .clientBenifitsBox { width: 70%; } .clientBenifits.growth.flutterExperties .clientBenifitsBox .secondHeading { width: 85%; } .clientBenifits.growth.flutterExperties .clientBenifitsBox .lightText { width: 85%; } .clientBenifits.growth.flutterExperties .clientBenifitsBox .subtitleLight { width: 85%; font-size: 65px; } .clientBenifits.growth.flutterExperties .btn2 { position: relative; top: -20px; } .clientBenifits.growth.flutterExperties .BenifitsService { padding: 30px 0 0; } /* flutterExperties Sec end */ /* reasons Sec start */ .clientBenifits.growth.reasons { background: #f5f5f5; padding: 100px 0; } .clientBenifits.growth.reasons .clientBenifitsBox { width: 100%; } .clientBenifits.growth.reasons .subtitleLight { color: #000; } .clientBenifits.growth.reasons .secondHeading { color: #000; } .clientBenifits.growth.reasons .lightText { color: #000; } .clientBenifits.growth.reasons .BenifitsService { padding: 30px 0 0; } .clientBenifits.growth.flutterExperties .triangle.triangle7 { position: absolute; left: 27%; top: 23%; z-index: -1; width: 23%; animation: rotate-scale-up 20s infinite; } /* reasons Sec end */ /* build-scalable-app Sec start */ .build-scalable-app { position: relative; background: url(../images/flutter-app/build-scalableBG.png); background-size: cover; background-position: top center; height: 800px; display: flex; align-items: center; z-index: 0; } .build-scalable-app marquee { position: absolute; top: -20px; } .build-scalable-app .row { display: flex; justify-content: flex-end; } .build-scalable-app .subtitleLight { color: #fff; } .build-scalable-app .secondHeading { color: #fff; font-weight: 400; } .build-scalable-app .lightText { color: #fff; } .build-scalable-app .triangle1 { left: 88%; width: 170px; top: 25%; animation: rotate-scale-up 12s infinite; z-index: 1; } .build-scalable-app .triangle2 { left: 90%; width: 170px; top: 30%; animation: rotate-scale-up 12s infinite; z-index: 0; } .build-scalable-app.cost-estimate .triangle1 { top: 11%; width: 100px; } .build-scalable-app.cost-estimate .triangle2 { top: 80%; left: 84%; width: 100px; } .build-scalable-app .triangle3 { position: absolute; z-index: -1; animation: rotate-scale-up 12s infinite; } .build-scalable-app .triangle4 { left: 20%; top: 10%; animation: rotate-scale-up 10s infinite; } .build-scalable-app .triangle5 { left: 20%; top: 70%; animation: rotate-scale-up 10s infinite; width: 130px; } .build-scalable-app .triangle6 { left: 20%; top: 70%; animation: rotate-scale-up 10s infinite; width: 130px; } .build-scalable-app.cost-estimate .triangle5 { left: 3%; width: 100px; } .build-scalable-app.cost-estimate .triangle6 { left: 3%; width: 100px; top: 7%; } /* build-scalable-app Sec end */ /* build-scalable-app cost-estimate Sec start */ .build-scalable-app.cost-estimate { background: url(../images/flutter-app/cost-estimateBG.png); } .build-scalable-app.cost-estimate .row { display: flex; justify-content: flex-start; } /* build-scalable-app cost-estimate Sec end */ /* leftRight-hoverbox Sec start */ .clientBenifits.growth.leftRight-hoverbox { background: url(../images/flutter-app/partnersbg.png); } .clientBenifits.growth.leftRight-hoverbox .subtitleLight { color: #000; } .clientBenifits.growth.leftRight-hoverbox .secondHeading { color: #000; } .clientBenifits.growth.leftRight-hoverbox .BenifitsService ul li { width: 45%; } .clientBenifits.growth.leftRight-hoverbox .lightText { color: #000; } /* leftRight-hoverbox Sec end */ /* client-benifits Sec start */ .client-benifits { background: url(../images/flutter-app/partnersbg.png); background-size: cover; background-position: center; position: relative; height: 750px; display: flex; align-items: center; } .client-benifits .list-point .secondHeading { margin-bottom: 50px; } .client-benifits marquee { position: absolute; top: -20px; } .client-benifits .small-bubble-vector3 { left: 8%; top: 45%; } .client-benifits .small-bubble-vector4 { left: 2%; top: 47%; animation: shake-vertical 4s ease-in-out infinite; width: 10px; } .client-benifits .small-bubble-vector1 { display: none; } .client-benifits .small-bubble-vector2 { display: none; } .client-benifits .secondHeading { width: 80%; } .client-benifits .triangle3 { left: 75%; } /* client-benifits Sec end */ /* smallSection Sec start */ .smallSection { background: url(../images/flutter-app/dropMessagesecBG.png); background-size: cover; background-position: center top; height: 600px; display: flex; align-items: center; position: relative; z-index: 0; } .smallSection .dropMsgimg img { position: absolute; top: 55px; right: -130px; width: 100%; object-fit: cover; } .smallSection .secondHeading { color: #fff; padding: 0; } .smallSection .secondHeading:before { display: none; } .smallSection .lightText { color: #fff; } .smallSection .btn2 { width: 250px; } .smallSection .triangle1 { width: 25%; animation: rotate-scale-up 17s infinite; position: absolute; z-index: -1; top: 6%; left: -8%; } /* smallSection Sec end */ /* leading flutter app page end */ /* crossPlatform app page start */ /* .servicesSec.crossPlatform sec start */ .servicesSec.crossPlatform { position: relative; } .servicesSec.crossPlatform marquee { position: absolute; top: 0; z-index: 2; } .servicesSec.crossPlatform .row { display: flex; align-items: center; } .servicesSec.crossPlatform .serviceBox { background: transparent; } .servicesSec.crossPlatform .secondHeading { width: 90%; font-weight: 200; } .servicesSec.crossPlatform .secondHeading { width: 90%; font-weight: 200; } /* .servicesSec.crossPlatform sec end */ /* .servicesSec.opt-for-cross sec start */ .servicesSec.opt-for-cross { background: #f4f4f4; } .servicesSec.opt-for-cross marquee { position: absolute; top: 0; z-index: 2; } .servicesSec.opt-for-cross .imgBox { display: flex; align-items: center; justify-content: center; } .servicesSec.opt-for-cross .imgBox .countBox { margin: 0; color: #fff; font-size: 24px; letter-spacing: 2px; } .servicesSec.opt-for-cross .wrapper .wraperItems:hover .imgBox { background: #fff; } .servicesSec.opt-for-cross .wrapper .wraperItems:hover .imgBox .countBox { color: red; } .servicesSec.opt-for-cross .secondHeading { font-weight: 400; } /* .servicesSec.opt-for-cross sec end */ /* .rightContentwith-background sec start */ .rightContentwith-background { position: relative; background: url(../images/CrossPlatformApp/whyChooseBG.png); background-size: cover; background-position: top center; background-repeat: no-repeat; padding: 100px 0; } .rightContentwith-background marquee { position: absolute; top: 0; } .rightContentwith-background .subtitleLight { color: #fff; } .rightContentwith-background .secondHeading { color: #fff; } .rightContentwith-background .lightText { color: #fff; margin-bottom: 25px; } .rightContentwith-background .row { display: flex; justify-content: end; } .rightContentwith-background .smallContent .secondHeading { font-size: 25px; line-height: 1.8; } .rightContentwith-background .triangle1 { left: 90%; top: 83%; position: absolute; width: 53px; } .rightContentwith-background .triangle2 { left: 93%; top: 77%; position: absolute; width: 53px; } .rightContentwith-background .triangle3 { left: 95%; top: 91%; position: absolute; width: 53px; } .rightContentwith-background .triangle4 { left: 89%; top: 91%; position: absolute; width: 53px; } .rightContentwith-background .triangle5 { left: 97%; top: 75%; position: absolute; width: 53px; animation: rotate-scale-up 9s infinite; } .rightContentwith-background .triangle6 { animation: rotate-scale-up 17s infinite; left: -2%; } /* .rightContentwith-background sec end */ /* .clientBenifits.nextProject sec start */ .clientBenifits.nextProject { background-image: url(../images/CrossPlatformApp/nextProjectBG.png); } .clientBenifits.nextProject .BenifitsService ul li { width: 44%; display: flex; align-items: center; } .clientBenifits.nextProject .subtitleLight { color: #fff; } .clientBenifits.nextProject .BenifitsService { padding: 0; } /* .clientBenifits.nextProject sec end */ .emergingTechSec .solutionSecleftbox .secondHeading { font-weight: 300; } .emergingTechSec .solutionSecleftbox .secondHeading strong span { color: red; } /* crossPlatform app page end */ /* custom-software-development app page start */ /* .digital-services sec start */ .clientBenifits.digital-services { position: relative; background-image: url(../images/custom-softwearDevelopment/digitalServiceBG.png); background-size: cover; background-position: bottom center; background-repeat: no-repeat; padding: 100px 0; } .clientBenifits.digital-services .clientBenifitsBox { width: 100%; } .clientBenifits.digital-services .BenifitsService ul { display: flex; flex-wrap: wrap; } .clientBenifits.digital-services .BenifitsService ul li { width: 31.33%; padding: 10px 10px; margin-bottom: 20px; } .clientBenifits.digital-services marquee { position: absolute; top: -20px; } .clientBenifits.digital-services .clientBenifitsBox .subtitleLight { color: #fff; } .clientBenifits.digital-services .clientBenifitsBox .secondHeading { font-size: 48px; font-weight: 300; } /* .digital-services sec end */ /* .leftimgwith-rightContent.dService sec start */ .leftimgwith-rightContent.dService .imgbox::before { content: ''; position: absolute; width: 90%; height: 90%; background: red; bottom: -30px; left: -30px; animation: slide-tr 7s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite alternate both; } /* .leftimgwith-rightContent.dService sec end */ /* .ensureAndCutting.dreamWeBuild sec start */ .ensureAndCutting.dreamWeBuild { position: relative; padding: 150px 0 60px; background-image: url(../images/custom-softwearDevelopment/dreamWeBuildBG.png); background-size: cover; } .ensureAndCutting.dreamWeBuild marquee { position: absolute; top: 0; } .ensureAndCutting.dreamWeBuild .ensureAndCutting_Box { height: 900px; display: flex; justify-content: flex-start; width: 100%; } .ensureAndCutting.dreamWeBuild .ensureAndCutting_Box.box2 ul li { padding-left: 30px; position: relative; } .ensureAndCutting.dreamWeBuild .ensureAndCutting_Box.box2 ul li:before { content: ''; position: absolute; left: 10px; top: 0; bottom: 0; margin: auto; width: 5px; height: 5px; background: #fff; border-radius: 100%; } .ensureAndCutting.dreamWeBuild .ensureAndCutting_Box.box2 ul li:after { content: ''; position: absolute; left: 5px; top: 0; bottom: 0; margin: auto; width: 15px; height: 15px; background: transparent; border: 1px solid #fff; border-radius: 100%; } /* .ensureAndCutting.dreamWeBuild sec end */ /* .emergingTechSec.poweringSolutions sec start */ .emergingTechSec.poweringSolutions .solutionSecleftbox { margin-right: 0; } /* .emergingTechSec.poweringSolutions sec end */ /* custom-software-development app page end */ /************************************************ Inner page Css ************************************************/ .startupBroke h4.subtitleLight.brokSm { font-size: 60px; margin-bottom: 0 !important; } .startupBroke h4.subtitleLight.brokClutter { font-size: 60px; } .startupBroke h2.secondHeading { font-weight: 100; margin-bottom: 0; } .headingBroke:before { content: ""; background-color: red; width: 15px; position: absolute; top: -5px; left: -20px; bottom: -12px; animation: scroll 2s infinite; } .headingBroke { position: relative; } .startupBroke h2.secondHeading:before { display: none; } .startupBroke ul { list-style: none; margin: 0; display: flex; margin-top: 40px; } .startupBroke ul li { margin-right: 25px; } .sectionDotedImg{ background: url('../images/helpImage/bgdootedimg.png') no-repeat; background-size: cover; background-position: center center; } h2#helpMarquee { font-size: 200px; margin-bottom: 45px; } a.btn.btnLines .btnLinesInner .btnLinsbg:after{ content: ''; background: url('../images/helpImage/btnlines.png') no-repeat; background-size: contain; display: block; width: 10px; height: 50px; } a.btn.btnLines .btnLinesInner { display: inline-flex; align-items: center; } a.btn.btnLines .btnLinesInner .btnTextBg { background: #de002e; height: 50px; display: flex; align-items: center; color: #fff; padding: 0px 20px; } a.btn.btnLines .btnLinesInner .fa-chevron-right { height: 50px; background: #050505; padding: 0px 20px; display: flex; align-items: center; color: #fff; } .btnLinesInner .btnLinsbg { margin: 0px 4px; } .btnLineDotes { margin-top: 40px; } .btnLineDotes { margin-top: 40px; } section.solutionSec.sectionDotedImg .container>.row { display: flex; align-items: end; } .sectionDotedImg img.img-fluid.triangle.triangle4.rotate-scale-up { left: 94%; } .sectionDotedImg img.img-fluid.triangle.triangle3.rotate-scale-up { left: 90%; } .ourStartup{ background: url('../images/helpImage/btnbgall.png') no-repeat; background-size: cover; background-position: center center; } #ourStartupSection h4.subtitleLight.brokSm { margin-bottom: 0; color: #fff; font-size: 55px; } #ourStartupSection h2.secondHeading:before { display: none; } #ourStartupSection h2.secondHeading { color: #fff; font-weight: 100; margin-bottom: 0; } #ourStartupSection h4.subtitleLight.brokClutter { color: #fff; font-size: 50px; } #ourStartupSect .headingBroke~p { color: #fff !important; } #ourStartupSection .headingBroke ~p { color: #fff; } #ourStartupSection .row { display: flex; flex-wrap: wrap; } .BenifitsService.startupsBox h2.secondHeading { font-size: 30px; padding-left: 0; } .startupsBox .startupsBoxLins { position: relative; margin-bottom: 20px; } .startupsBox .startupsBoxLins:before { content: ''; background-color: red; width: 7px; position: absolute; top: -5px; left: -20px; bottom: 0; animation: scroll 2s infinite; } .startupsBox p { color: #fff; } .startupsBox.mt-5 { margin-top: 40px; } .headingBroke h2.secondHeading:before { display: none; } .ourClientsCol .headingBroke h4.subtitleLight.brokClutter { font-size: 49px; } .ourClientsCol h4.subtitleLight { margin-bottom: 0; } .ourClientsCol h2.secondHeading { margin-bottom: 0; } .ourClientsCol p { color: #787878; margin-top: 20px; } #ourClientSec h2#ourClientMarquee { font-size: 200px; } .ourClientsImg ul { list-style: none; display: flex; align-items: center; } .ourClientsImg ul li { margin-right: 60px; } #ourClientSec .row { display: flex; align-items: center; } .ourClientsImg ul li img { width: 100%; } section#helpYouSec{ background: url('../images/helpImage/helpyou.png') no-repeat; background-size: cover; background-position: center center; } #helpYouSec h4.subtitleLight, #helpYouSec span.secondHeading, #helpYouSec .centerRow p { color: #fff; } #helpYouSec h4.subtitleLight.brokClutter { font-size: 40px !important; } #helpYouSec h4.subtitleLight.brokClutter span.secondHeading { font-weight: 100; } #helpYouSec .row.centerRow { justify-content: center; } #helpYouSec .row.centerRow span.secondHeading:before { display: none; } .numBox { background: #fff; height: 400px; transition: all 0.4s ease; box-shadow: 0px 0px 79px 0px rgba(0, 0, 0, 0.08); padding: 40px; } .numBox .numBoxInner p { color: #000; font-size: 30px; font-weight: 600; text-align: center; line-height: 38px; } .numBoxInner { transition: all 0.4s ease; height: 100%; display: flex; align-items: center; flex-direction: column; justify-content: center; border: solid 2px #de002e; position: relative; padding: 0px 50px; } .numBoxInner .numPosition { position: absolute; top: -23px; left: -26px; background: #de002e; width: 70px; height: 70px; border-radius: 100%; display: flex; transition: all 0.4s ease; align-items: center; justify-content: center; color: #fff; font-size: 26px; } .numBoxInner .numPosition:after { content: ''; width: 70px; height: 70px; position: absolute; border-radius: 100%; z-index: -1; left: -7px; top: -6px; transition: all 0.4s ease; visibility: hidden; opacity: 0; } .numBox:hover .numBoxInner .numPosition:after { visibility: visible; opacity: 1; transition: all 0.4s ease; background: #000; } .numBox:hover .numPosition { top: -10px; left: -8px; background: #de002e; padding: 1px 13px 10px 0px; transition: all 0.4s ease; transform: scale(1.1); } .numBox:hover .numPosition::before { content: ''; background: url('../images/helpImage/trAngl.png') no-repeat; background-size: contain; width: 90px; height: 77px; position: absolute; z-index: 9; } .numBox:hover { background: transparent; transition: all 0.4s ease; border: solid 1px #fff; } .numBox:hover .numBoxInner { background: #fff; transition: all 0.4s ease; } div#RowSetMx { margin: 30px 50px -216px 50px; overflow: hidden; padding-bottom: 60px; } #otherConcerSec .row { display: flex; flex-wrap: wrap; align-items: center; } section#otherConcerSec { padding-top: 110px; background: url('../images/helpImage/bgdootedimg.png') no-repeat; background-size: cover; position: relative; background-position: center center; } h2.animatedTxt.otherConcernMarquee { font-size: 200px; } div#contactForm select, div#contactForm input { height: 55px; font-size:13px; background: transparent; border: none; color: #ffffff91 !important; border-bottom: solid 1px #ffffff91; } div#contactForm input::placeholder { color: #ffffff91 !important; } div#contactForm { border: solid 1px #ffffff91 !important; padding: 30px 35px; } .btn2.contactFormBtn a.border { font-size: 13px; } div#contactForm select:focus, div#contactForm input:focus { box-shadow: unset !important; } #contactForm select option { color: #000 !important; } #otherConcerSec::before { content: ''; background: url('../images/helpImage/bigangle.png') no-repeat; background-size: contain; background-position: center center; width: 35%; height: 45%; position: absolute; top: 46%; animation: rotate-scale-up 12s infinite; z-index: 0; } seciton.banner.formBanner.rightImg.helPage{ background: url('../images/helpImage/topbgbanner.png') no-repeat; background-size: cover !important; background-position: center bottom; } seciton.banner.formBanner.rightImg.helPage .imgRightbox { display: none; }