/*== GENERAL CSS ==*/ a, .ctaArea *, .storeProduct li *, .header * { text-decoration:none; -webkit-transition:all 250ms linear; -moz-transition:all 250ms linear; -ms-transition:all 250ms linear; -o-transition:all 250ms linear; transition:all 250ms linear; } @-webkit-keyframes tyre-info7{from{-webkit-transform:translate3d(-130px, 0, 0);transform:translate3d(-130px, 0, 0);} to{-webkit-transform:translate3d(0px, 0, 0);transform:translate3d(0px, 0, 0);} } @keyframes tyre-info7{from{-webkit-transform:translate3d(-130px, 0, 0);transform:translate3d(-130px, 0, 0);} to{-webkit-transform:translate3d(0px, 0, 0);transform:translate3d(0px, 0, 0);} } .tyre-info7-anim{-webkit-animation-name:tyre-info7;animation-name:tyre-info7;} @-webkit-keyframes tyre-info6{from{-webkit-transform:translate3d(-70px, 0, 0);transform:translate3d(-70px, 0, 0);} to{-webkit-transform:translate3d(0,0, 0);transform:translate3d(0,0, 0);} } @keyframes tyre-info6{from{-webkit-transform:translate3d(-70px, 0, 0);transform:translate3d(-70px, 0, 0);} to{-webkit-transform:translate3d(0,0, 0);transform:translate3d(0, 0, 0);} } .tyre-info6-anim{-webkit-animation-name:tyre-info6;animation-name:tyre-info6;} @-webkit-keyframes tyre-info3{from{-webkit-transform:translate3d(70px, 0, 0);transform:translate3d(70px, 0, 0);} to{-webkit-transform:translate3d(0,0, 0);transform:translate3d(0,0, 0);} } @keyframes tyre-info3{from{-webkit-transform:translate3d(70px, 0, 0);transform:translate3d(70px, 0, 0);} to{-webkit-transform:translate3d(0,0, 0);transform:translate3d(0, 0, 0);} } .tyre-info3-anim{-webkit-animation-name:tyre-info3;animation-name:tyre-info3;} @-webkit-keyframes tyre-info2{from{-webkit-transform:translate3d(100px, 0, 0);transform:translate3d(100px, 0, 0);} to{-webkit-transform:translate3d(0,0, 0);transform:translate3d(0,0, 0);} } @keyframes tyre-info2{from{-webkit-transform:translate3d(100px, 0, 0);transform:translate3d(100px, 0, 0);} to{-webkit-transform:translate3d(0,0, 0);transform:translate3d(0, 0, 0);} } .tyre-info2-anim{-webkit-animation-name:tyre-info2;animation-name:tyre-info2;} @-webkit-keyframes tyre-info1{from{-webkit-transform:translate3d(120px, 0, 0);transform:translate3d(120px, 0, 0);} to{-webkit-transform:translate3d(0,0, 0);transform:translate3d(0,0, 0);} } @keyframes tyre-info1{from{-webkit-transform:translate3d(120px, 0, 0);transform:translate3d(120px, 0, 0);} to{-webkit-transform:translate3d(0,0, 0);transform:translate3d(0, 0, 0);} } .tyre-info1-anim{-webkit-animation-name:tyre-info1;animation-name:tyre-info1;} @-webkit-keyframes l-circle-anim{from{stroke-dashoffset:1000;stroke-dasharray:1000;} to{stroke-dashoffset:0;} } @keyframes l-circle-anim{from{stroke-dashoffset:1000;stroke-dasharray:1000;} to{stroke-dashoffset:0;stroke-dasharray:0;} } .line-circle .cls-1-anim{-webkit-animation-name:l-circle-anim;animation-name:l-circle-anim;} @-webkit-keyframes blue-line-anim{from{stroke-dashoffset:1000;stroke-dasharray:1000;} to{stroke-dashoffset:0;} } @keyframes blue-line-anim{from{stroke-dashoffset:1000;stroke-dasharray:1000;} to{stroke-dashoffset:0;stroke-dasharray:0;} } .blue-line-anim{-webkit-animation-name:blue-line-anim;animation-name:blue-line-anim;} @-webkit-keyframes moveBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(20px)}} @keyframes moveBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(20px)}} @-webkit-keyframes moveLeftBounce{0%,100%{transform:translateX(-10px)}50%{transform:translateX(10px)}} @keyframes moveLeftBounce{0%,100%{transform:translateX(-10px)}50%{transform:translateX(10px)}} @-webkit-keyframes moveFor{0%,100%{width: 55px;left: -80px;right: auto;}100%{left: auto;right: 0;width: 6px;}} @keyframes moveFor{0%,100%{width: 55px;left: -80px;right: auto;}100%{left: auto;right: 0;width: 6px;}} .btn { position: relative; border: 1px solid #26b24b; overflow: hidden; background: #26b24b; color: #fff; font-size: 18px; text-transform: lowercase; min-width: 175px; display: inline-block; padding: 12px 20px; border-radius: 30px; -webkit-transition: all .5s; -moz-transition: all .5s; transition: all .5s;} .btn::first-letter{text-transform: uppercase;} .btn span { position: relative; z-index: 1; } /*.btn:after { content: ""; position: absolute; right: 700px; left: 0; top: 0; bottom: 0; background: #000; -webkit-transition: all .75s; -moz-transition: all .75s; transition: all .75s;} .btn:hover:after { right: 0; }*/ .btn:hover, .btn:focus{background-color: #245ca6;color: #fff;} /*body{cursor:url(assets/images/cursor.png), auto;}*/ .main-section {padding: 70px 0;} .main-section .header-section{text-align: center;} .main-section .header-section h2{} .main-section h2 { margin-bottom: 30px; display:block;color: #E36179; font-size:40px;letter-spacing: 2px;font-weight: 700;} .main-section p{font-size: 15px;color: #000;} .fa-phone{transform: rotate(90deg);} /*=== HEADER CSS ===*/ .header figure img, .footer figure img{width: 100%;} .banner { position: relative; } .bannerWrapper{position: relative;} .banner .header-section{text-align: center;} .banner .header-section h2{margin: 15px 0 0;} .banner img{width: 100%;} .banner figure{margin-bottom: 0;} .banner figcaption{position: absolute;left: 0px;top: 30%;width: 460px;padding: 40px 30px 40px 40px;} .banner figcaption.bnWrp2{width: 380px;} .banner figcaption.bnWrp4::before{background: rgb(255 255 255 / 50%);} .banner figcaption.bnWrp4 h1{color: #454545;text-shadow: 0 1px 2px #fff;} .banner figcaption h1 span{ color: #bf0d3e; font-size: 58px;} .banner figcaption.bnWrp4 h3{color: rgb(0 0 0 / 20%);} .banner figcaption::before {content: "";position: absolute;top: 0;left: -100%;right: 0;bottom: 0;background: rgb(0 0 0 / 50%);transform: skewX(-13.5deg); border-right: 6px solid #bf0d3e;} /*.banner figcaption.bnWrp1{top: 20px;left: 30px;width: 32%;} .banner figcaption.bnWrp1 h1{ text-shadow: 0 0 3px #fff;} .banner figcaption.bnWrp1 p, .banner figcaption.bnWrp3 p, .banner figcaption.bnWrp4 p, .banner figcaption.bnWrp5 p{color: #000;} .banner figcaption.bnWrp2{top: 20px;right: 0;left: 0;text-align: center;background: rgb(0 0 0 / 80%);margin: auto;width: 55%;padding: 22px;} .banner figcaption.bnWrp3{top: 30px;right: 30px;text-align: right;width: 30%;} .banner figcaption.bnWrp4{top: 45%;right: 0;left: 0;text-align: center;margin: auto;width: 40%;} .banner figcaption.bnWrp5{top: 30px;left: 30px;width: 38%;}*/ /*.prevNxtNew{position: absolute;top: 45%;left: 30px;font-size: 32px;color: #6b6c6e;z-index: 9999;background: #fff;line-height: 1;min-width: 43px;text-align: center;padding: 5px;}*/ .prevNxtNew{position: absolute;top: 45%;left: 30px;font-size: 32px;color: #000;z-index: 9999;line-height: 1;} .nextNew{left: auto;right: 30px;} .banner figcaption h1{z-index: 2;position: relative;font-size: 32px;text-shadow: 0 1px 2px #000;text-transform: capitalize;font-weight: 600;color: #fff;margin: 0 0 5px;} .banner figcaption h3{color: rgb(255 255 255 / 20%);position: absolute;margin: 0;bottom: -24px;left: -40px;font-size: 160px;letter-spacing: 5px; line-height: 1;z-index: 1;} .banner figcaption p{z-index: 2;position: relative; margin: 0;font-size: 18px;font-weight: 700;text-transform: uppercase;font-style: italic; line-height: 1; } .cycle-slideshow ul, .cycle-slideshow li { width:100%; height:100%; overflow:hidden; } .cycle-slideshow ul li img { width: 100%;} .banner .cycle-pager { bottom:15px; right:0; left:0; margin:0 auto; position:absolute; text-align:center; z-index:100; } .banner .cycle-pager span { width: 14px; height: 14px; display: inline-block; vertical-align: top; cursor: pointer; font-size: 0px; margin: 3px; text-align: center; background-color: #fff; border-radius: 50%; position: relative;} .banner .cycle-pager span.cycle-pager-active {background: #BD0B3E; } .banner .cycle-pager > * { cursor: pointer;} .cycle-caption { opacity:1; z-index:99; } .caption1 { -moz-animation: fadeInRight 0.8s ease-in 0.8s backwards; -webkit-animation: fadeInRight 0.8s ease-in 0.8s backwards; animation: fadeInRight 0.8s ease-in 0.8s backwards; opacity: 1; } .caption2 { -moz-animation: fadeInLeft 0.8s ease-in 1.5s backwards; -webkit-animation: fadeInLeft 0.8s ease-in 1.5s backwards; animation: fadeInLeft 0.8s ease-in 1.5s backwards; opacity:1; } .caption3 { -moz-animation: fadeInRight 0.8s ease-in 1.7s backwards; -webkit-animation: fadeInRight 0.8s ease-in 1.7s backwards; animation: fadeInRight 0.8s ease-in 1.7s backwards; opacity: 1; } .caption4 { -moz-animation: fadeInUp 0.8s ease-in 1.9s backwards; -webkit-animation: fadeInUp 0.8s ease-in 1.9s backwards; animation: fadeInUp 0.8s ease-in 1.9s backwards; opacity:1; } #progress { position: absolute; bottom: 0; left:0; height: 7px; width: 0px; background: -moz-linear-gradient(left, rgba(30,30,30,0.3) 0%, rgba(0,0,0,0.8) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(30,30,30,0.3)), color-stop(100%,rgba(0,0,0,0.8))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(left, rgba(30,30,30,0.3) 0%,rgba(0,0,0,0.8) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(left, rgba(30,30,30,0.3) 0%,rgba(0,0,0,0.8) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(left, rgba(30,30,30,0.3) 0%,rgba(0,0,0,0.8) 100%); /* IE10+ */ background: linear-gradient(to right ,rgba(30,30,30,0.3) 0%,rgba(0,0,0,0.8) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4d1e1e1e', endColorstr='#cc000000',GradientType=1 ); /* IE6-9 */ z-index: 99999; -webkit-border-top-right-radius: 50px; -webkit-border-bottom-right-radius: 50px; -moz-border-radius-topright: 50px; -moz-border-radius-bottomright: 50px; border-top-right-radius: 50px; border-bottom-right-radius: 50px; } .cycle-slideshow, .cycle-slideshow * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .home-section-one{position: relative; padding: 150px 0;} .home-section-one .container{max-width: 1400px;} .home-section-one .header-section h2{margin-bottom: 110px; color: #bf0d3e;} .home-section-one .sec1Wrapper{} .home-section-one .sec1Wrapper .devTab.dev2Tab{display: inline-block;width: 27%;} .home-section-one .sec1Wrapper .devTab{text-align: center;} .home-section-one .sec1Wrapper .devTab figure{display: inline-block; position: relative; animation-duration: 4.25s;font-size: 0;} /*.home-section-one .sec1Wrapper .devTab figure img{width: 78%;margin: 0 auto;}*/ .home-section-one .sec1Wrapper .devTab figure .treeWrp{position: absolute;text-align: center;width: 150px;transition: 0.5s;} .home-section-one .sec1Wrapper .devTab figure .mainTreeWrpInr.active .treeWrp{width: 115px;} .home-section-one .sec1Wrapper .devTab figure .myTreAct{right: -16px !important;top: -70px !important;left: auto !important;bottom: auto !important;text-align: center !important;} .home-section-one .sec1Wrapper .devTab figure .treeWrp.myTreAct a img{margin: 0 0 25px 0 !important; /*transform: scale(1.2);*/transition: 0.5s;} .home-section-one .sec1Wrapper .devTab figure .treeWrp1{right: 168px;top: -70px;} .home-section-one .sec1Wrapper .devTab figure .treeWrp2{left: 168px;top: 60px;} .home-section-one .sec1Wrapper .devTab figure .treeWrp3{right: 168px;top: 215px;} .home-section-one .sec1Wrapper .devTab figure .treeWrp4{left: 168px;bottom: 338px;} .home-section-one .sec1Wrapper .devTab figure .treeWrp5{right: 168px;bottom: 245px;} .home-section-one .sec1Wrapper .devTab figure .treeWrp2 a strong{color: #F6972A !important;} .home-section-one .sec1Wrapper .devTab figure .treeWrp3 a strong{color: #FCCB70 !important;} .home-section-one .sec1Wrapper .devTab figure .treeWrp4 a strong{color: #66D78A !important;} .home-section-one .sec1Wrapper .devTab figure .treeWrp5 a strong{color: #add8e6 !important;} /*.home-section-one .sec1Wrapper .devTab figure .treeWrp2, .home-section-one .sec1Wrapper .devTab figure .treeWrp4{text-align: right;}*/ /*.home-section-one .sec1Wrapper .devTab figure .treeWrp2 a img{margin: 0 75px 0 0 !important;} .home-section-one .sec1Wrapper .devTab figure .treeWrp4 a img{margin: 0 75px 0 0 !important;}*/ .home-section-one .sec1Wrapper .devTab figure .treeWrp a{display: block; transition: 0.6s;/*animation-duration: 2s;animation-delay: 3s;*/} /*.home-section-one .sec1Wrapper .devTab figure .treeWrp3 a, .home-section-one .sec1Wrapper .devTab figure .treeWrp4 a{animation-delay: 2.5s;}*/ .home-section-one .sec1Wrapper .devTab figure .treeWrp a{} /*.home-section-one .sec1Wrapper .devTab figure .treeWrp a:hover{transform: rotate(-2deg);}*/ .home-section-one .sec1Wrapper .devTab figure .treeWrp a img{margin: 0 0 10px;} .home-section-one .sec1Wrapper .devTab figure .treeWrp a span{font-size: 22px;font-weight: 300;color: #131414; display: none !important;} .home-section-one .sec1Wrapper .devTab figure .treeWrp a span, .home-section-one .sec1Wrapper .devTab figure .treeWrp a strong{display: block;/*text-align: left;*/} .home-section-one .sec1Wrapper .devTab figure .treeWrp a strong{/*font-size: 2.5vh;*/font-size: 16px;color: #F9918E;animation-delay: 1s;transition: 0.2s;margin-top: 10px;} .home-section-one .sec1Wrapper .devTab figure .treeWrp.myTreAct a strong{font-size: 15px;} /*.home-section-one .sec1Wrapper .devTab figure .treeWrp a:hover strong{transform: translateY(-4px) rotate(2deg);}*/ .home-section-one .sec1Wrapper .devTab figure .treeWrp.unactive a span{display: none; opacity: 0;visibility: hidden;} /*.home-section-one .sec1Wrapper .devTab figure .treeWrp.unactive .active span{opacity: 1;visibility: visible;}*/ /*.home-section-one .sec1Wrapper .devTab figure .treeWrp.unactive {left: 0 !important;right: 0 !important;margin: auto;text-align: center;}*/ .home-section-one .sec1Wrapper .devTab figure .treeWrp.unactive a strong{position: absolute;right: 80px;bottom: 5px;font-size: 12px;font-weight: 400;} .home-section-one .sec1Wrapper .devTab figure .treeWrp.unactive {left: auto !important;right: auto !important;margin: 40px auto 0;text-align: center;position: relative;bottom: auto;top: auto;} .mainTreeWrpInr {position: absolute;top: 0;left: 0;right: 0;bottom: 0;margin: auto;text-align: center;} .home-section-one .sec1Wrapper .devTab figure .treeWrp.unactive a img {margin: 0 !important; transform: scale(0.8) !important;} .home-section-one .sec1Wrapper .tabArea{display: inline-block;width: 72%;vertical-align: top;} .home-section-one .sec1Wrapper .tabArea .tabPnl{display: none;/*margin:0 0 0 130px;*/margin:0 0 0 50px;position: relative;} .home-section-one .sec1Wrapper .tabArea .slick-list ul li{position: relative;padding: 10px;display: none;border: 1px solid #000;align-items: center;transition: all .6s ease;} .home-section-one .sec1Wrapper .tabArea .slick-list ul li::before{content: "";position: absolute;top: 8px;left: 0;background-color: #000;border-radius: 50%;/* height: 8px; *//* width: 8px; */} .home-section-one .sec1Wrapper .tabArea .tabPnl#tab0 .testimonial-slider ul li a:hover{color: #f9918e;} .home-section-one .sec1Wrapper .tabArea .tabPnl#tab1 .testimonial-slider2 ul li a:hover{color: #f6962b;} .home-section-one .sec1Wrapper .tabArea .tabPnl#tab2 .testimonial-slider3 ul li a:hover{color: #fcca71;} .home-section-one .sec1Wrapper .tabArea .tabPnl#tab3 .testimonial-slider4 ul li a:hover{color: #68d689;} .home-section-one .sec1Wrapper .tabArea .tabPnl#tab4 .testimonial-slider5 ul li a:hover{color: #add8e6;} .home-section-one .sec1Wrapper .tabArea .tabPnl#tab0 .testimonial-slider ul li:before{background: #f9918e;} .home-section-one .sec1Wrapper .tabArea .tabPnl#tab1 .testimonial-slider2 ul li:hover{background: #f6962b;} .home-section-one .sec1Wrapper .tabArea .tabPnl#tab2 .testimonial-slider3 ul li:hover{background: #fcca71;} .home-section-one .sec1Wrapper .tabArea .tabPnl#tab3 .testimonial-slider4 ul li:hover{background: #68d689;} .home-section-one .sec1Wrapper .tabArea .tabPnl#tab4 .testimonial-slider5 ul li:hover{background: #add8e6;} .ct-show{display: flex !important;} /* .home-section-one .sec1Wrapper .tabArea .tabPnl#tab0 .testimonial-slider ul li:before{display: none;} .home-section-one .sec1Wrapper .tabArea .tabPnl#tab0 .testimonial-slider ul li a{} .home-section-one .sec1Wrapper .tabArea .tabPnl#tab0 .testimonial-slider ul li a figure{ display: block;width: 30%;} .home-section-one .sec1Wrapper .tabArea .tabPnl#tab0 .testimonial-slider ul li a figure img{} .home-section-one .sec1Wrapper .tabArea .tabPnl#tab0 .testimonial-slider ul li a span{background: #ffffff;padding: 10px 10px 10px 20px;display: block;position: absolute;top: 0;left: 90px;right: 0;z-index: 9;box-shadow: 0 0 2px #0000008c;margin: 2px;transform: skewX(-30deg);width: 74%;bottom: 0;} .home-section-one .sec1Wrapper .tabArea .tabPnl#tab0 .testimonial-slider ul li a span small{transform: skewX(30deg);display: block;} */ .testimonial-nav .slick-slide, .testimonial-nav2 .slick-slide, .testimonial-nav3 .slick-slide, .testimonial-nav4 .slick-slide, .testimonial-nav5 .slick-slide {overflow: hidden;padding: 20px 0;margin: 0 0 15px;/*width: 100% !important;*/cursor: pointer;} .navImg h3 {display: block;font-size: 20px;font-weight: bold;color: #F9255F;margin-bottom: 0;min-height: 48px;} .testimonial-nav, .testimonial-nav2, .testimonial-nav3, .testimonial-nav4, .testimonial-nav5 {display: inline-block;vertical-align: top; width: 220px;} .dashInrWrp.activePopup .testimonial-nav, .dashInrWrp.activePopup .testimonial-nav2, .dashInrWrp.activePopup .testimonial-nav3, .dashInrWrp.activePopup .testimonial-nav4, .dashInrWrp.activePopup .testimonial-nav5{margin-left: -135px; margin-top: 130px; transform: scale(0.7);} .testimonial-slider, .testimonial-slider2, .testimonial-slider3, .testimonial-slider4, .testimonial-slider5 {width: 590px;display: inline-block;vertical-align: top;padding-left: 60px; padding-top: 42px;} .dashInrWrp.activePopup .testimonial-slider, .dashInrWrp.activePopup .testimonial-slider2, .dashInrWrp.activePopup .testimonial-slider3, .dashInrWrp.activePopup .testimonial-slider4, .dashInrWrp.activePopup .testimonial-slider5{padding-left: 60px;} .testimonial-slider ul li, .testimonial-slider2 ul li, .testimonial-slider3 ul li, .testimonial-slider4 ul li, .testimonial-slider5 ul li{ margin-bottom: 30px; } .testimonial-slider ul li a, .testimonial-slider2 ul li a, .testimonial-slider3 ul li a, .testimonial-slider4 ul li a, .testimonial-slider5 ul li a{text-transform: uppercase !important;color: #7f7f7f;font-size: 17px;font-weight: 500;text-transform: none;display: block;/* text-align: justify; *//* margin: 0 0px 0 10px; */display: table;vertical-align: middle;height: 100%;/* position: absolute; */width: 100%;left: 0;padding: 10px;line-height: 23px;} .testimonial-slider ul li p, .testimonial-slider2 ul li p, .testimonial-slider3 ul li p, .testimonial-slider4 ul li p, .testimonial-slider5 ul li p{ font-size: 18px;font-weight: 300;color: #131414; display: none;} .navImg{position: relative;text-align: center;} .navImg::before {content: url(assets/images/pagerAfter.png);position: absolute;top: 0;left: 0;right: 0;bottom: 0;opacity: 0;} .navImg.slick-slide.slick-current.slick-active h3{font-size: 40px;text-decoration: underline;} /*.slick-slider .slick-list{ height: 435px !important; max-height: 435px !important;}*/ /*.navImg.slick-slide.slick-current.slick-active span{color: #F9918E !important;}*/ /*.testimonial-nav .slick-list, .testimonial-nav2 .slick-list, .testimonial-nav5 .slick-list{ height: 105px !important; max-height: 105px !important;}*/ /*.testimonial-nav3 .slick-list{ height: 435px !important; max-height: 435px !important;}*/ /*.testimonial-nav4 .navImg .slick-list{ height: 435px !important; max-height: 435px !important;}*/ .popupVideo, .videoPopUpMain{position: absolute;top: 0;left: 90px;/* right: 0;bottom: 0;*/ display: none;width: 78%;background: #fff;z-index: 999;box-shadow: 0 0 4px #ccc;padding: 30px 80px;} .popupVideo .toClose, .videoPopUpMain .toClose2{position: absolute;top: 10px;right: 10px;background-color:#7f7f7f;color: #fff;border-radius: 50%;padding: 5px;z-index: 9999; line-height: 1;min-width: 25px;text-align: center;} .popupVideo h4, .videoPopUpMain h5{font-size: 20px;color: #585858;text-transform: none;font-weight: 600; margin: 0 0 5px;text-transform: uppercase !important;} .popupVideo h5{color: #7E7E7E;font-size: 16px; margin: 0 0 5px;} .popupVideo h6{text-transform: uppercase !important;color: #7E7E7E; font-size: 13px; color: #f9918e; margin: 0 0 15px;} .popupVideo h6 span{color: #7f7f7f; display: inline-block; margin: 0 5px;} .popupVideo p{margin: 0 0 10px;word-spacing: 3px;} .popupVideo ul{list-style: circle;margin: 5px 0 10px 18px;} .popupVideo .cycle-slideshow{margin: 0;} .popupVideo video, .videoPopUpMain video{width: 100%;} .popupVideo figure{margin: 0 auto 30px; max-width: 100%;} .popupVideo figure img{/*width: 829px; height: 529px;*/ width: 100%; height: auto;} .popupVideo .prev, .popupVideo .next{position: absolute;top: 45%; left: 30px; font-size: 30px; z-index: 1; color: #7f7f7f;} .popupVideo .next{left: auto;right: 30px;} .slick-prev, .slick-next{position: absolute;bottom: -35px;top: auto;transform: rotate(180deg); left: 100px;z-index: 9;} .slick-prev{bottom: auto !important;top: -35px;opacity: 0 !important;} .slick-prev:before, .slick-next:before{ color: #000;} .slick-prev::before{content: '\f107' !important; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands', fontAwesome; font-weight: 700;} .slick-next::before{content: '\f106' !important; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands', fontAwesome; font-weight: 700;} /*.home-section-one .slick-track, .home-section-one .slick-slide{width: 100% !important; }*/ #tab3 .slick-arrow{visibility: hidden;} .testimonial-nav, .testimonial-nav2, .testimonial-nav3, .testimonial-nav4, .testimonial-nav5{min-height: 525px;} /*.slick-initialized .slick-slide{width: 100% !important;}*/ /* .navImg:before { background: #1017ef12; width: 70%; height: 100%; content: ""; position: absolute; left: 0; clip-path: polygon(100% 0, 0% 100%, 0% 0%); top: 0; } .navImg:after { background: #ff499414; width: 70%; height: 100%; content: ""; position: absolute; right: 0; bottom: 0; clip-path: polygon(100% 0, 0% 100%, 100% 100%); } */ .treeWrp.treeWrp1 a svg #icon1, .treeWrp.treeWrp2 a svg #icon2, .treeWrp.treeWrp3 a svg #icon3, .treeWrp.treeWrp4 a svg #icon4, .treeWrp.treeWrp4 a svg #icon5 { cursor: pointer; fill-rule: evenodd; } .treeWrp.treeWrp1 a:hover #icon1, .treeWrp.treeWrp2 a:hover #icon2, .treeWrp.treeWrp3 a:hover #icon3, .treeWrp.treeWrp4 a:hover #icon4, .treeWrp.treeWrp5 a:hover #icon5 { fill-opacity: 0; stroke-width: 1; stroke-miterlimit: 1; stroke-dasharray: 400; stroke-dashoffset: 0; animation: linear forwards; -webkit-animation: linear forwards; -o-animation: linear forwards; -moz-animation: linear forwards; animation-name: dash, fill; animation-duration: 4s, 0.4s; animation-delay: 0s, 3s; } .treeWrp.treeWrp1 a:hover #icon1{ fill: #f9918e; stroke: #f9918e; } .treeWrp.treeWrp2 a:hover #icon2 { fill: #f6972a; stroke: #f6972a; } .treeWrp.treeWrp3 a:hover #icon3 { fill: #fccb70; stroke: #fccb70; } .treeWrp.treeWrp4 a:hover #icon4 { fill: #66d78a; stroke: #66d78a; } .treeWrp.treeWrp5 a:hover #icon5 { fill: #add8e6; stroke: #add8e6; } #pinkline-up{ stroke:#add8e6; fill:#add8e6; fill-opacity: 0; stroke-width: 1; stroke-miterlimit: 1; stroke-dasharray: 400; stroke-dashoffset: 0; animation: linear forwards; -webkit-animation: linear forwards; -o-animation: linear forwards; -moz-animation: linear forwards; animation-name: dash, fill, DASH3; animation-duration: 4s, 1s, 3s; animation-delay: 0s, 15s;animation-play-state: paused; } #yellowline-up{ stroke:#fccb70; fill:#fccb70; fill-opacity: 0; stroke-width: 1; stroke-miterlimit: 1; stroke-dasharray: 400; stroke-dashoffset: 0; animation: linear forwards; -webkit-animation: linear forwards; -o-animation: linear forwards; -moz-animation: linear forwards; animation-name: dash, fill, DASH3; animation-duration: 4s, 1s, 3s; animation-delay: 0s, 12s;animation-play-state: paused; } #green-up{ stroke:#66d78a; fill:#66d78a; fill-opacity: 0; stroke-width: 1; stroke-miterlimit: 1; stroke-dasharray: 400; stroke-dashoffset: 0; animation: linear forwards; -webkit-animation: linear forwards; -o-animation: linear forwards; -moz-animation: linear forwards; animation-name: dash, fill, DASH3; animation-duration: 4s, 1s, 3s; animation-delay: 0s, 9s;animation-play-state: paused; } #darkyellow-up{ stroke:#f6972a; fill:#f6972a; fill-opacity: 0; stroke-width: 1; stroke-miterlimit: 1; stroke-dasharray: 400; stroke-dashoffset: 0; animation: linear forwards; -webkit-animation: linear forwards; -o-animation: linear forwards; -moz-animation: linear forwards; animation-name: dash, fill, DASH3; animation-duration: 4s, 1s, 3s; animation-delay: 0s, 6s;animation-play-state: paused; } #pinkline2-up{ stroke:#f9918e; fill:#f9918e; fill-opacity: 0; stroke-width: 1; stroke-miterlimit: 1; stroke-dasharray: 400; stroke-dashoffset: 0; animation: linear forwards; -webkit-animation: linear forwards; -o-animation: linear forwards; -moz-animation: linear forwards; animation-name: dash, fill, DASH3; animation-duration: 4s, 1s, 3s; animation-delay: 0s, 3s;animation-play-state: paused; } .home-section-one .sec1Wrapper .tabArea .slick-list ul li span { display: block; } .home-section-one:hover .main-tree path{animation-play-state: running !important; } .home-section-one .sec1Wrapper .tabArea .slick-list ul li img { width: 100px; } .home-section-one .sec1Wrapper .tabArea .slick-list ul li:hover { background: rgb(249, 145, 142); color: #fff !important; } .home-section-one .sec1Wrapper .tabArea .slick-list ul li:hover a { color: #fff !important; } @-webkit-keyframes dash { from { stroke-dashoffset: 400 } to { stroke-dashoffset: 0 } } @-webkit-keyframes fill { from { fill-opacity: 0 } to { fill-opacity: 1; stroke-width: 0 } } #pinkline, #yellowline, #green, #darkyellow, #pinkline2{ fill-opacity:0; stroke-width:1; stroke-dasharray: 800; stroke-dashoffset:800; -moz-animation:DASH3 2s ease-in-out 1s forwards; -webkit-animation:DASH3 2s ease-in-out 1s forwards; animation:DASH3 2s ease-in-out 1s forwards; } #pinkline{ stroke:#f9918e; fill:#f9918e; } #yellowline{ stroke:#fccb70; fill:#fccb70; -moz-animation:DASH3 2s ease-in-out 5s forwards; -webkit-animation:DASH3 2s ease-in-out 5s forwards; animation:DASH3 2s ease-in-out 5s forwards; } #green{ stroke:#66d78a; fill:#66d78a; -moz-animation:DASH3 2s ease-in-out 8s forwards; -webkit-animation:DASH3 2s ease-in-out 8s forwards; animation:DASH3 2s ease-in-out 8s forwards; } #darkyellow{ stroke:#f6972a; fill:#f6972a; -moz-animation:DASH3 2s ease-in-out 10s forwards; -webkit-animation:DASH3 2s ease-in-out 10s forwards; animation:DASH3 2s ease-in-out 10s forwards; } #pinkline2{ stroke:#f9918e; fill:#f9918e; -moz-animation:DASH3 2s ease-in-out 14s forwards; -webkit-animation:DASH3 2s ease-in-out 14s forwards; animation:DASH3 2s ease-in-out 14s forwards; } /*.dashInrWrp { display: none; width: 0; transition: all .6s ease; } .dashInwrpshow{ display: block;width: 100%;}*/ @-webkit-keyframes DASH3{ 0% {stroke-dashoffset:800;} 80% {stroke-dashoffset:1;fill-opacity:0;} 100%{stroke-dashoffset:1;fill-opacity:1;} } @-moz-keyframes DASH3{ 0% {stroke-dashoffset:800;} 80% {stroke-dashoffset:0;fill-opacity:0;} 100%{stroke-dashoffset:0;fill-opacity:1;} } .devTab.dev2Tab .main-tree { display: none; } .gif-tree{ display: none; } .devTab.dev2Tab .gif-tree{ display: block; } .treeWrp.treeWrp1 a { margin: 0 0 0 -5px; } .treeWrp.treeWrp2 a { margin: 0 0 0 -3px; } .treeWrp.treeWrp3 a { margin: 0 0 0 1px; } .treeWrp.treeWrp4 a { margin: 0 0 0 -4px; } .treeWrp.treeWrp5 a { margin: 0 0 0 1px; } .home-section-one .sec1Wrapper .tabArea .slick-list ul li span { display: block; } .home-section-one .sec1Wrapper .devTab figure .mainTreeWrpInr.active .treeWrp a svg { animation: none; } .home-section-one .sec1Wrapper .devTab figure .treeWrp a svg { animation: beat 1.5s infinite alternate;animation-delay: 3s; } .home-section-one .sec1Wrapper .devTab figure .mainTreeWrpInr.active .treeWrp a.active svg { animation: beat 1.5s infinite alternate !important; } @keyframes beat{ to { transform: scale(1.1); } } @media only screen and (min-width: 0px) and (max-width: 897px) { .home-section-one .sec1Wrapper .tabArea .slick-list ul li span{display: inline;} .banner .cycle-pager{bottom: 0;} .banner .cycle-pager span{width: 8px;height: 8px;} .prevNxtNew{top: 45%;left: 10px;font-size: 16px;/*min-width: 26px;*/} .nextNew{left: auto;right: 10px;} .home-section-one{padding: 35px 0;} .home-section-one .header-section h2 {margin: 0 auto;font-size: 24px;width: 280px;} .home-section-one .sec1Wrapper {max-width: 520px;margin: 0 auto;} .home-section-one .sec1Wrapper .devTab.dev2Tab, .home-section-one .sec1Wrapper .tabArea{display: block;width: 100%;} .home-section-one .sec1Wrapper .devTab figure img, .devTab .main-tree {display: none;} .mainTreeWrpInr{position: relative;left: auto;right: auto;bottom: auto;top: auto;} .mainTreeWrpInr.active{margin-bottom: 130px;} .home-section-one .sec1Wrapper .devTab figure .treeWrp.unactive, .home-section-one .sec1Wrapper .devTab figure .treeWrp {left: auto !important;right: auto !important;margin: 0px auto 10px;text-align: center;width: 32%;position: relative !important;top: auto !important;bottom: auto !important;display: inline-block;vertical-align: top;} .home-section-one .sec1Wrapper .devTab figure .treeWrp a{margin: 0;} .home-section-one .sec1Wrapper .devTab figure .treeWrp a svg {height: 90px;width: 75px;} .home-section-one .sec1Wrapper .devTab figure .treeWrp.unactive a strong, .home-section-one .sec1Wrapper .devTab figure .treeWrp a strong{font-weight: 400;font-size: 14px !important;position: relative !important;right: auto !important;bottom: auto !important;} .myTreAct svg{animation: none;} body .home-section-one .sec1Wrapper .devTab figure .treeWrp{width: 32%;} .testimonial-nav, .testimonial-nav2, .testimonial-nav3, .testimonial-nav4, .testimonial-nav5{width: 100%;} .home-section-one .sec1Wrapper .tabArea .tabPnl{margin: 0;} .home-section-one .sec1Wrapper .devTab{margin-bottom: 35px;margin-top: 80px;} .home-section-one .sec1Wrapper .devTab.dev2Tab{margin-top: 35px;} .navImg h3{font-size: 14px;min-height: auto;} .navImg.slick-slide.slick-current.slick-active h3{font-size: 22px;} .testimonial-nav .slick-slide, .testimonial-nav2 .slick-slide, .testimonial-nav3 .slick-slide, .testimonial-nav4 .slick-slide, .testimonial-nav5 .slick-slide{padding: 6px 0;margin: 0 0px;} .navImg.slick-slide.slick-current.slick-active.slick-center {padding: 0;} .testimonial-nav, .testimonial-nav2, .testimonial-nav3, .testimonial-nav4, .testimonial-nav5{min-height: auto;margin-bottom: 15px;} .testimonial-slider, .testimonial-slider2, .testimonial-slider3, .testimonial-slider4, .testimonial-slider5{padding: 0 !important;display: block;width: 100%;} #tab0 .slick-arrow, #tab1 .slick-arrow, #tab3 .slick-arrow{visibility: visible;} .slick-prev, .slick-next{top: 3px;bottom: auto !important;transform: rotate(90deg);right: -5px;left: auto;} .slick-prev {left: -5px;right: auto;display: block !important;} .testimonial-slider ul li a, .testimonial-slider2 ul li a, .testimonial-slider3 ul li a, .testimonial-slider4 ul li a, .testimonial-slider5 ul li a{padding: 0 0 0 5px; font-size: 14px; text-align: left;display: block;} .testimonial-slider ul li a br, .testimonial-slider2 ul li a br, .testimonial-slider3 ul li a br, .testimonial-slider4 ul li a br, .testimonial-slider5 ul li a br{display: none;} .home-section-one .sec1Wrapper .devTab figure{display: block;} .home-section-one .sec1Wrapper .devTab figure .mainTreeWrpInr.active .treeWrp.myTreAct {position: absolute !important;top: 95px !important;left: 0 !important;right: 0 !important;width: 100%;overflow: hidden;padding: 11px 0;} .home-section-one .sec1Wrapper .devTab figure .mainTreeWrpInr.active .treeWrp.myTreAct a{transform: scale(1.35);font-size: 0;} .home-section-one .sec1Wrapper .devTab figure .mainTreeWrpInr.active .treeWrp.myTreAct a strong{font-size: 20px !important;margin: 0 0 0 5px;font-weight: 500;vertical-align: middle; display: inline-block;} .home-section-one .sec1Wrapper .devTab figure .mainTreeWrpInr.active .treeWrp {width: 24.5%;} .home-section-one .sec1Wrapper .devTab figure .mainTreeWrpInr.active .treeWrp a svg {height: 52px;width: 40px;} .home-section-one .sec1Wrapper .devTab figure .mainTreeWrpInr.active .treeWrp a strong {font-size: 11px !important;} .testimonial-slider ul li, .testimonial-slider2 ul li, .testimonial-slider3 ul li, .testimonial-slider4 ul li, .testimonial-slider5 ul li{margin-bottom: 5px;max-width: 400px;margin: auto;padding: 5px !important;margin: 0 auto 10px;} .dashInrWrp.activePopup .testimonial-nav, .dashInrWrp.activePopup .testimonial-nav2, .dashInrWrp.activePopup .testimonial-nav3, .dashInrWrp.activePopup .testimonial-nav4, .dashInrWrp.activePopup .testimonial-nav5 {margin-left: 0;margin-top: 0;transform: none;} .popupVideo, .videoPopUpMain{padding: 15px;width: 100%;left: 0;top: 0px;/*left: auto; position: relative; top: auto; margin: 0 0 30px;*/} .popupVideo h4{text-align: left;position: relative;/*padding-right: 15px;*/} .popupVideo h4 br{display: none;} /*.popupVideo h4::before{content: "";position: absolute;top: 5px;left: 0;height: 8px;width: 8px;background: #7f7f7f;border-radius: 50%;}*/ .popupVideo h4, .videoPopUpMain h5 {font-size: 15px;} .popupVideo h5{font-size: 13px;} .popupVideo h6{font-size: 12px;margin: 0 0 8px;} .popupVideo .prev, .popupVideo .next{font-size: 20px;left: 0;} .popupVideo .next{left: auto;right: 0;} .popupVideo figure{margin-bottom: 10px;} .popupVideo p, .popupVideo p + ul li{ font-size: 12px;line-height: 1.3;} .popupVideo .toClose, .videoPopUpMain .toClose2{top: -8px;right: -8px;padding: 4px;font-size: 12px; min-width: 20px;} } @media only screen and (min-width: 898px) and (max-width: 1299px) { .banner img{height: 400px;object-fit: cover;} .home-section-one .sec1Wrapper {max-width: 874px;margin: 0 auto;} .home-section-one .sec1Wrapper .devTab figure img {width: 235px;} .home-section-one .sec1Wrapper .devTab figure .mainTreeWrpInr.active .treeWrp a svg {width: 60px;height: 80px;} .home-section-one .sec1Wrapper .devTab figure .treeWrp a strong{font-size: 13px;} .home-section-one .sec1Wrapper .devTab figure .myTreAct{right: -25px !important;top: -40px !important;} .home-section-one .sec1Wrapper .devTab figure .treeWrp.myTreAct a strong{font-size: 13px;} .navImg h3{font-size: 16px;min-height: 32px;} .navImg.slick-slide.slick-current.slick-active h3{font-size: 26px;} .testimonial-nav .slick-slide, .testimonial-nav2 .slick-slide, .testimonial-nav3 .slick-slide, .testimonial-nav4 .slick-slide, .testimonial-nav5 .slick-slide{padding: 10px 0;width: 100% !important;} .testimonial-nav, .testimonial-nav2, .testimonial-nav3, .testimonial-nav4, .testimonial-nav5 {min-height: 207px;width: 100px;} .slick-prev, .slick-next{left: 40px;bottom: -15px;} .slick-prev{bottom: auto !important;top: -30px;} .testimonial-slider, .testimonial-slider2, .testimonial-slider3, .testimonial-slider4, .testimonial-slider5{padding-left: 25px;padding-top: 15px;width: 475px;} .testimonial-slider ul li, .testimonial-slider2 ul li, .testimonial-slider3 ul li, .testimonial-slider4 ul li, .testimonial-slider5 ul li {margin-bottom: 20px;} .testimonial-slider ul li a, .testimonial-slider2 ul li a, .testimonial-slider3 ul li a, .testimonial-slider4 ul li a, .testimonial-slider5 ul li a{font-size: 15px;} .popupVideo, .videoPopUpMain{left: 30px;width: 90%;padding: 20px 40px;} .popupVideo h4{font-size: 17px;} .popupVideo h5{font-size: 14px;} .popupVideo h6{margin: 0 0 8px;} .popupVideo figure{margin-bottom: 10px;} .popupVideo p, .popupVideo li{font-size: 14px;} .popupVideo .next{right: 15px;} .popupVideo .prev{left: 15px;} .dashInrWrp.activePopup .testimonial-nav, .dashInrWrp.activePopup .testimonial-nav2, .dashInrWrp.activePopup .testimonial-nav3, .dashInrWrp.activePopup .testimonial-nav4, .dashInrWrp.activePopup .testimonial-nav5 {margin-left: -72px;margin-top: 75px;} }