[dir=ltr] .page-section{padding:0px;} [dir=ltr] b,[dir=ltr] strong { font-weight:bold; } .welcome-text-area { overflow:hidden; padding-top:50px; width:100%;position:relative;padding-bottom:100px; } .welcome-text { position:relative; z-index:9; } .welcome-text h1 { font-size:50px; margin-bottom:30px; } .aboutbgmn img{width:100%; } .area-bg-layer { background:rgba(0,0,0,0) url(../../img/bg-layers/about_bg_layers_3.png) no-repeat scroll center center; height:100%; left:0; position:absolute; top:0; width:100%; opacity:.5; } .area-bg { height:100%; left:0; position:absolute; top:0; width:100%; } .area-title { margin-bottom:80px; position:relative; } .area-bg-text { font-size:80px; font-weight:700; left:50%; letter-spacing:10px; line-height:1; opacity:0.1; position:absolute; top:0; -webkit-transform:translateX(-50%); transform:translateX(-50%); } .sub_hidding { font-weight:400; } .features-top-area .features-box:hover,.features-top-area .features-box.active { -webkit-box-shadow:0 0 20px rgba(0,0,0,0.2); box-shadow:0 0 20px rgba(0,0,0,0.2); } .text-icon-box { overflow:hidden; } .features-box-icon { -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-animation:5s ease 0s normal none infinite running border_animate; animation:5s ease 0s normal none infinite running border_animate; background:#d1fff6 none repeat scroll 0 0; border-radius:30% 70% 70% 30% / 30% 30% 70% 70%; display:-webkit-box; display:-ms-flexbox; display:flex; height:120px; margin:0 auto 20px; overflow:hidden; padding:30px; text-align:center; width:120px; } .box-img-icon { display:inline-block; margin-bottom:20px; width:60px; } .box-img-icon{width:100%;} .text-icon-box:hover .features-box-icon { -webkit-animation-play-state:paused; animation-play-state:paused; } @-webkit-keyframes border_animate { 0% { border-radius:30% 70% 70% 30%/30% 30% 70% 70%; } 25% { border-radius:58% 42% 75% 25%/76% 46% 54% 24%; } 50% { border-radius:50% 50% 33% 67%/55% 27% 73% 45%; } 75% { border-radius:33% 67% 58% 42%/63% 68% 32% 37%; } } @keyframes border_animate { 0% { border-radius:30% 70% 70% 30%/30% 30% 70% 70%; } 25% { border-radius:58% 42% 75% 25%/76% 46% 54% 24%; } 50% { border-radius:50% 50% 33% 67%/55% 27% 73% 45%; } 75% { border-radius:33% 67% 58% 42%/63% 68% 32% 37%; } } .talks-circle img { -webkit-animation:90s linear 0s normal none infinite running big-spin; animation:90s linear 0s normal none infinite running big-spin; } @-webkit-keyframes big-spin { 0% { -webkit-transform:rotate(0deg); transform:rotate(0deg); } 100% { -webkit-transform:rotate(360deg); transform:rotate(360deg); } } @keyframes big-spin { 0% { -webkit-transform:rotate(0deg); transform:rotate(0deg); } 100% { -webkit-transform:rotate(360deg); transform:rotate(360deg); } } .features-area .text-icon-box { background:#ffffff none repeat scroll 0 0; -webkit-box-shadow:0 16px 32px rgba(0,0,0,0.1); box-shadow:0 16px 32px rgba(0,0,0,0.1); padding:60px 30px; } .features-area .text-icon-box a { font-weight:600; color:#71E8F6; } .features-area .box-icon { font-size:50px; color:#233653; } .features-area .text-icon-box::before { background:#48d6ee none repeat scroll 0 0; content:""; height:100%; left:0; opacity:0; position:absolute; top:0; -webkit-transition:all 0.3s ease 0s; transition:all 0.3s ease 0s; width:100%; z-index:-1; } .features-area .text-icon-box:hover::before,.features-area .text-icon-box.active::before,.features-area .text-icon-box:hover,.features-area .text-icon-box.active,.features-area .text-icon-box:hover .subhidding,.features-area .text-icon-box.active .subhidding,.features-area .text-icon-box:hover .box-icon,.features-area .text-icon-box.active .box-icon,.features-area .text-icon-box:hover a,.features-area .text-icon-box.active a { color:#fff; opacity:1; } .features-area .text-icon-box .subhidding { -webkit-transition:all 0.3s ease 0s; transition:all 0.3s ease 0s; } .features-bg-layer { -webkit-animation:5s ease 0s normal none infinite running border_animate; animation:5s ease 0s normal none infinite running border_animate; background:#5580ff none repeat scroll 0 0; border-radius:30% 70% 70% 30% / 30% 30% 70% 70%; height:50%; left:50%; opacity:0; position:absolute; top:50%; -webkit-transform:translateX(-50%) translateY(-50%); transform:translateX(-50%) translateY(-50%); -webkit-transition:all 0.3s ease 0s; transition:all 0.3s ease 0s; width:50%; z-index:-1; } .features-area .text-icon-box:hover .features-bg-layer,.features-area .text-icon-box.active .features-bg-layer { opacity:0.1; } .bg-animate-layer { background:rgba(0,0,0,0) -webkit-gradient(linear,left top,right top,from(#f9748f),to(#ff8a73)) repeat scroll 0 0; background:rgba(0,0,0,0) linear-gradient(to right,#f9748f,#ff8a73) repeat scroll 0 0; height:100%; left:0; opacity:0; position:absolute; top:0; -webkit-transition:all 0.3s ease 0s; transition:all 0.3s ease 0s; width:100%; z-index:-1; } .bg-animate-layer::before,.bg-animate-layer::after { content:""; position:absolute; z-index:-1; opacity:0; } .bg-animate-layer::before { background:rgba(0,0,0,0) -webkit-gradient(linear,left top,right top,from(#f9748f),to(#ff8a73)) repeat scroll 0 0; background:rgba(0,0,0,0) linear-gradient(to right,#f9748f,#ff8a73) repeat scroll 0 0; border-radius:50%; height:20px; left:0; top:0; -webkit-transition:0.3s; transition:0.3s; width:20px; } .bg-animate-layer::after { background:rgba(0,0,0,0) -webkit-gradient(linear,left top,right top,from(#f9748f),to(#ff8a73)) repeat scroll 0 0; background:rgba(0,0,0,0) linear-gradient(to right,#f9748f,#ff8a73) repeat scroll 0 0; border-radius:50%; bottom:0; height:20px; right:0; -webkit-transition:0.4s; transition:0.4s; width:20px; } .text-icon-box:hover .bg-animate-layer::before,.text-icon-box:hover .bg-animate-layer::after,.text-icon-box.active .bg-animate-layer::before,.text-icon-box.active .bg-animate-layer::after { height:100%; -webkit-transform:scale(2); transform:scale(2); width:100%; } .text-icon-box:hover .bg-animate-layer,.text-icon-box:hover .bg-animate-layer,.text-icon-box.active .bg-animate-layer,.text-icon-box.active .bg-animate-layer { opacity:1; } .features-top-area .features-box { padding:60px 30px; -webkit-transition:0.3s; transition:0.3s;position:relative; } .home-alt .features-top-area .features-box img,.home-alt .features-top-area .features-box h3 { -webkit-transition:0.3s; transition:0.3s; } .home-alt .features-top-area .features-box:hover,.home-alt .features-top-area .features-box.active { -webkit-box-shadow:0 0 20px rgba(0,0,0,0.2); box-shadow:0 0 20px rgba(0,0,0,0.2); color:#ffffff; } .home-alt .features-top-area .features-box:hover h3,.home-alt .features-top-area .features-box.active h3 { color:#ffffff; } .home-alt .features-top-area .features-box:hover .more,.home-alt .features-top-area .features-box.active .more { color:#ffffff; } .home-alt .features-top-area img { height:60px; } .home-alt .features-top-area .features-box:hover .box-img-icon img,.home-alt .features-top-area .features-box.active .box-img-icon img { -webkit-filter:sepia(100%) saturate(100%) hue-rotate(100deg) brightness(200%) contrast(100%); filter:sepia(100%) saturate(100%) hue-rotate(100deg) brightness(200%) contrast(100%); } .bg-animate-layer::before { background:rgba(0,0,0,0) -webkit-gradient(linear,right top,left top,from(#ff8a73),to(#f9748f)) repeat scroll 0 0; background:rgba(0,0,0,0) linear-gradient(to left,#ff8a73,#f9748f) repeat scroll 0 0; } .bg-animate-layer { background:rgba(0,0,0,0) -webkit-gradient(linear,left top,right top,from(#f9748f),to(#ff8a73)) repeat scroll 0 0; background:rgba(0,0,0,0) linear-gradient(to right,#f9748f,#ff8a73) repeat scroll 0 0; } .about-middile.section-padding { padding:130px 0; } .about-middile .about-mockup-bg { right:-303px; } .about-content h3 { font-size:36px;font-weight:bold; } .promo-button .video-area-popup { background:#ad7cff none repeat scroll 0 0; border-radius:50%; -webkit-box-shadow:0 0 16px #ad7cff; box-shadow:0 0 16px #ad7cff; color:#ffffff; cursor:pointer; display:inline-block; font-size:18px; height:60px; line-height:1; margin-right:30px; padding-left:5px; padding-top:21px; position:relative; text-align:center; -webkit-transition:all 0.3s ease 0s; transition:all 0.3s ease 0s; width:60px; } .promo-button .video-area-popup { background:#FF8A73; box-shadow:0 0 16px #FF8A73; } .promo-button .fa{color:#fff;} .promo-button *{ color:#233653; font-weight:bold;} .about-fun-fact { position:relative; -webkit-transform:translateX(50px); transform:translateX(50px); z-index:9; } .single-fun-fact { position:relative; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-shadow:0 0 20px rgba(0,0,0,0.15); box-shadow:0 0 20px rgba(0,0,0,0.15); display:-webkit-inline-box; display:-ms-inline-flexbox; display:inline-flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; height:180px; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; margin:20px; text-align:center; -webkit-transition:all 0.3s ease 0s; transition:all 0.3s ease 0s; width:180px; } .single-fun-fact h3 { font-size:50px; } .single-fun-fact:first-child,.single-fun-fact:nth-child(3) { position:relative; top:-50px; } .single-fun-fact::before { background:rgba(0,0,0,0) -webkit-gradient(linear,right bottom,left top,from(#48d6ee),to(#75eaf7)) repeat scroll 0 0; background:rgba(0,0,0,0) linear-gradient(to left top,#48d6ee,#75eaf7) repeat scroll 0 0; content:""; height:100%; left:0; opacity:0; position:absolute; top:0; -webkit-transition:all 0.3s ease 0s; transition:all 0.3s ease 0s; width:100%; z-index:-1; } .single-fun-fact.color-two::before { background:rgba(0,0,0,0) -webkit-gradient(linear,right top,left top,from(#f9748f),to(#fe9a8b)) repeat scroll 0 0; background:rgba(0,0,0,0) linear-gradient(to left,#f9748f,#fe9a8b) repeat scroll 0 0; } .single-fun-fact:hover::before,.single-fun-fact:hover,.single-fun-fact:hover h3,.single-fun-fact.active::before,.single-fun-fact.active,.single-fun-fact.active h3 { color:#fff; opacity:1; } .single-fun-fact::after { background:#fff none repeat scroll 0 0; content:""; height:100%; left:0; position:absolute; top:0; -webkit-transition:all 0.3s ease 0s; transition:all 0.3s ease 0s; width:100%; z-index:-1; } .single-fun-fact:hover::after,.single-fun-fact.active::after { opacity:0; } [dir=ltr] .page-section.about-ussectionm{padding-top:4rem;padding-bottom:4rem; } .about-content h3 { font-size:29px; font-weight:bold; }