@-webkit-keyframes slide-down { 0% { opacity: 1 } 90% { opacity: 0 } } @keyframes slide-down { 0% { opacity: 1 } 90% { opacity: 0 } } .element { width: 100px; height: 100px; background: #000; -webkit-animation: slide-down 5s 3; animation: slide-down 5s 3 } .visually-hidden { margin: -1px; padding: 0; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip: rect(0, 0, 0, 0); position: absolute } body { font-family: Poppins, sans-serif; font-size: 16px; line-height: 28px; color: #797687; overflow-x: hidden } svg { display: block } a, button, input, textarea { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } input, textarea { width: 100%; padding: 10px 12px; outline: 0 } button { cursor: pointer; outline: 0 } a, a:hover { text-decoration: none } h1, h2, h3, h4, h5, h6 { font-family: Poppins, sans-serif; margin-top: 0; font-weight: 600; color: #2b2350 } img { max-width: 100%; height: auto } .pr { position: relative } .pt-7 { padding-top: 70px } section { position: relative } .mw-none { max-width: unset !important } @media (min-width: 1200px) { .container { max-width: 1200px } } .section-small { margin-bottom: 80px } .section-small .title { font-size: 20px; font-weight: 500 } .mt-40 { margin-top: 40px } .mt-60 { margin-top: 60px } .section-padding { padding: 100px 0 } .no-scroll { overflow-y: hidden !important } @font-face { font-family: Flaticon; src: url(Flaticon.eot); src: url(../fonts/Flaticon.eot?#iefix) format("embedded-opentype"), url(../fonts/Flaticon.woff) format("woff"), url(../fonts/Flaticon.ttf) format("truetype"), url(../fonts/Flaticon.svg#Flaticon) format("svg"); font-weight: 400; font-style: normal } @media screen and (-webkit-min-device-pixel-ratio: 0) { @font-face { font-family: Flaticon; src: url(../fonts/Flaticon.svg#Flaticon) format("svg") } } .fi:before { display: inline-block; font-family: Flaticon; font-style: normal; font-weight: 400; font-variant: normal; line-height: 1; text-decoration: inherit; text-rendering: optimizeLegibility; text-transform: none; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; -font-smoothing: antialiased } .flaticon-google-play:before { content: "\f100" } .flaticon-apple-logo:before { content: "\f101" } @media (max-width: 991px) { .pix-order-two { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2 } .pix-order-one { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1 } } .pix-btn { padding: 8px 30px; background: #fa7070; border-radius: 30px; display: inline-block; font-size: 14px; color: #fff; font-weight: 600; -webkit-box-shadow: 0 20px 30px 0 rgba(176, 70, 70, .3); box-shadow: 0 20px 30px 0 rgba(176, 70, 70, .3) } .pix-btn.submit-btn { border: 0; padding: 11px 35px } .pix-btn.submit-btn:focus { outline: 0 } .pix-btn.btn-large { padding: 16px 44px; font-size: 16px } .pix-btn.plus-icon { padding: 8px 64px 8px 41px; position: relative } .pix-btn.plus-icon i { margin-left: 10px; font-size: 20px; display: inline-block; position: absolute; right: 32px; top: 11px } .pix-btn.btn-big { padding: 16px 47px; font-size: 16px } .pix-btn.color-two { background: #7052fb; -webkit-box-shadow: 0 20px 30px 0 rgba(90, 70, 176, .3); box-shadow: 0 20px 30px 0 rgba(90, 70, 176, .3) } .pix-btn:focus, .pix-btn:hover { color: #fff; -webkit-box-shadow: none; box-shadow: none; outline: 0 } .pix-btn.btn-outline { border: 1px solid #fa7070; background: 0 0; color: #fa7070; -webkit-box-shadow: none; box-shadow: none } .pix-btn.btn-outline:hover { background: #fa7070; color: #fff; -webkit-box-shadow: 0 20px 30px 0 rgba(176, 70, 70, .3); box-shadow: 0 20px 30px 0 rgba(176, 70, 70, .3) } .pix-btn.btn-outline-two { border: 1px solid #7052fb; background: 0 0; color: #7052fb; -webkit-box-shadow: none; box-shadow: none } .pix-btn.btn-outline-two:hover { background: #7052fb; color: #fff; -webkit-box-shadow: 0 20px 30px 0 rgba(90, 70, 176, .3); box-shadow: 0 20px 30px 0 rgba(90, 70, 176, .3) } .pix-btn.btn-light { background: #fff; color: #fa7070; border: 2px solid #fff; padding: 14px 40px } .pix-btn.btn-light:focus { -webkit-box-shadow: none; box-shadow: none; outline: 0 } .pix-btn.btn-light.color-two { color: #7052fb } .pix-btn.btn-light:hover { background: 0 0; color: #fff; border-color: #fff } .btn-underline { color: #797687; font-size: 15px; position: relative; padding-bottom: 3px; font-weight: 500; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; line-height: 15px; max-width: 140px; margin: 0 auto } .btn-underline:before { content: ''; position: absolute; width: 100%; height: 1px; left: 0; bottom: 0; background: #797687; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .btn-underline i { display: inline-block; margin-left: 10px } .btn-underline:hover { color: #fa7070 } .btn-underline:hover:before { background: #fa7070 } .play-btn { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #fff; font-weight: 600 } .play-btn i { height: 60px; width: 60px; text-align: center; line-height: 60px; color: #fa7070; background: #fff; border-radius: 50%; margin-right: 10px; font-size: 30px; text-shadow: 0 10px 10px rgba(176, 70, 70, .4) } .play-btn:hover { color: #fff } .play-btn-two { position: relative } .play-btn-two i:before { position: relative; z-index: 222 } .play-btn-two i:after { position: absolute; content: ''; height: 50px; width: 50px; background: #e6e7eb; border-radius: 50%; top: 5px; left: 5px; z-index: 1 } .app-btn { padding: 10px 20px; border-radius: 30px; color: #7052fb; display: inline-block; font-size: 18px; border: 2px solid #7052fb } .app-btn i { color: #7052fb; font-size: 20px; vertical-align: -2px; margin-right: 4px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .app-btn:hover { color: #fff; background: #7052fb; -webkit-box-shadow: 0 20px 30px 0 rgba(67, 37, 204, .2); box-shadow: 0 20px 30px 0 rgba(67, 37, 204, .2) } .app-btn:hover i { color: #fff } .app-btn.btn-active { background: 0 0; color: #fff; -webkit-box-shadow: 0 20px 30px 0 rgba(67, 37, 204, .2); box-shadow: 0 20px 30px 0 rgba(67, 37, 204, .2); background: #7052fb } .app-btn.btn-active i { color: #fff } .app-btn.btn-active:hover { background: 0 0; color: #7052fb; -webkit-box-shadow: none; box-shadow: none } .app-btn.btn-active:hover i { color: #7052fb } .list-items { margin: 0; padding: 0; list-style: none } .list-items li { font-size: 16px; line-height: 36px; font-weight: 500; color: #2b2350; padding-left: 36px; position: relative } .list-items li:before { content: "\4e"; font-family: eleganticons; position: absolute; left: 0; top: 0; color: #fa7070 } .list-items.color-two li:before { color: #7052fb } .list-items.list-with-icon li:before { display: none } .list-items.list-with-icon li i { position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); color: #7052fb } section.brand { background: #f5f5f5; padding: 20px 0 40px } .sub-title11 { font-size: 18px; line-height: 26px; font-weight: 400 } input, textarea { background: #fdfdfd; padding: 6px 14px; border: 1px solid #efe7e7; margin-bottom: 18px; border-radius: 8px; font-size: 15px } input:focus, textarea:focus { background: #fff; -webkit-box-shadow: 0 20px 40px 0 rgba(79, 35, 35, .1); box-shadow: 1px 5px 8px 0 rgba(79, 35, 35, .1) } textarea { height: 150px } @-webkit-keyframes zoom { from { -webkit-transform: scale(1) translate(0) } to { -webkit-transform: scale(1.03) translate(0) } } @keyframes zoom { from { -webkit-transform: scale(1) translate(0) } to { -webkit-transform: scale(1.03) translate(0) } } @-webkit-keyframes zoommd { 0% { -webkit-transform: scale(.9); transform: scale(.9) } 100% { -webkit-transform: scale(1.5); transform: scale(1.5) } } @keyframes zoommd { 0% { -webkit-transform: scale(.9); transform: scale(.9) } 100% { -webkit-transform: scale(1.5); transform: scale(1.5) } } @-webkit-keyframes bounce { 0% { -webkit-transform: translateY(0); transform: translateY(0) } 100% { -webkit-transform: translateY(40px); transform: translateY(40px) } } @keyframes bounce { 0% { -webkit-transform: translateY(0); transform: translateY(0) } 100% { -webkit-transform: translateY(40px); transform: translateY(40px) } } @-webkit-keyframes movexy { 0% { -webkit-transform: translateX(-10px) scale(.9); transform: translateX(-10px) scale(.9) } 100% { -webkit-transform: translateX(30px) scale(1.3) translateY(10px); transform: translateX(30px) scale(1.3) translateY(10px) } } @keyframes movexy { 0% { -webkit-transform: translateX(-10px) scale(.9); transform: translateX(-10px) scale(.9) } 100% { -webkit-transform: translateX(30px) scale(1.3) translateY(10px); transform: translateX(30px) scale(1.3) translateY(10px) } } @-webkit-keyframes wave { 0% { -webkit-transform: rotateZ(0) translate3d(0, 1%, 0) rotateZ(0); transform: rotateZ(0) translate3d(0, 1%, 0) rotateZ(0) } 100% { -webkit-transform: rotateZ(360deg) translate3d(0, 1%, 0) rotateZ(-360deg); transform: rotateZ(360deg) translate3d(0, 1%, 0) rotateZ(-360deg) } } @keyframes wave { 0% { -webkit-transform: rotateZ(0) translate3d(0, 1%, 0) rotateZ(0); transform: rotateZ(0) translate3d(0, 1%, 0) rotateZ(0) } 100% { -webkit-transform: rotateZ(360deg) translate3d(0, 1%, 0) rotateZ(-360deg); transform: rotateZ(360deg) translate3d(0, 1%, 0) rotateZ(-360deg) } } @-webkit-keyframes pixFade { 0% { opacity: 0 } 100% { opacity: 1 } } @keyframes pixFade { 0% { opacity: 0 } 100% { opacity: 1 } } @-webkit-keyframes pixFadeUp { 0% { opacity: 0; -webkit-transform: translateY(20px); transform: translateY(20px) } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0) } } @keyframes pixFadeUp { 0% { opacity: 0; -webkit-transform: translateY(20px); transform: translateY(20px) } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0) } } @-webkit-keyframes pixFadeDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px) } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0) } } @keyframes pixFadeDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px) } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0) } } @-webkit-keyframes pixFadeLeft { 0% { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px) } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0) } } @keyframes pixFadeLeft { 0% { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px) } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0) } } @-webkit-keyframes pixFadeRight { 0% { opacity: 0; -webkit-transform: translateX(-20px); transform: translateX(-20px) } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0) } } @keyframes pixFadeRight { 0% { opacity: 0; -webkit-transform: translateX(-20px); transform: translateX(-20px) } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0) } } @-webkit-keyframes pixZoomIn { 0% { opacity: 0; -webkit-transform: scale(.7); transform: scale(.7) } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1) } } @keyframes pixZoomIn { 0% { opacity: 0; -webkit-transform: scale(.7); transform: scale(.7) } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1) } } @-webkit-keyframes pixBounceIn { 0% { -webkit-transform: scale(.1); transform: scale(.1); opacity: 0 } 60% { -webkit-transform: scale(1.1); transform: scale(1.1); opacity: 1 } 100% { -webkit-transform: scale(1); transform: scale(1) } } @keyframes pixBounceIn { 0% { -webkit-transform: scale(.1); transform: scale(.1); opacity: 0 } 60% { -webkit-transform: scale(1.1); transform: scale(1.1); opacity: 1 } 100% { -webkit-transform: scale(1); transform: scale(1) } } .pixFade { -webkit-animation-name: pixFade; animation-name: pixFade } .pixFadeUp { -webkit-animation-name: pixFadeUp; animation-name: pixFadeUp } .pixFadeDown { -webkit-animation-name: pixFadeDown; animation-name: pixFadeDown } .pixFadeLeft { -webkit-animation-name: pixFadeLeft; animation-name: pixFadeLeft } .pixFadeRight { -webkit-animation-name: pixFadeRight; animation-name: pixFadeRight } .pixZoomIn { -webkit-animation-name: pixZoomIn; animation-name: pixZoomIn } .pixBounceIn { -webkit-animation-name: pixBounceIn; animation-name: pixBounceIn } @-webkit-keyframes jumping { 0% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 0 } 50% { -webkit-transform: translateY(-20px); transform: translateY(-20px); opacity: 1 } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 0 } } @keyframes jumping { 0% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 0 } 50% { -webkit-transform: translateY(-20px); transform: translateY(-20px); opacity: 1 } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 0 } } @-webkit-keyframes jump { 0% { -webkit-transform: translateY(5px); transform: translateY(5px) } 50% { -webkit-transform: translateY(-10px); transform: translateY(-10px) } 100% { -webkit-transform: translateY(5px); transform: translateY(5px) } } @keyframes jump { 0% { -webkit-transform: translateY(5px); transform: translateY(5px) } 50% { -webkit-transform: translateY(-10px); transform: translateY(-10px) } 100% { -webkit-transform: translateY(5px); transform: translateY(5px) } } @-webkit-keyframes stickySlideDown { from { -webkit-transform: translateY(-100%); transform: translateY(-100%) } to { -webkit-transform: translateY(0); transform: translateY(0) } } @keyframes stickySlideDown { from { -webkit-transform: translateY(-100%); transform: translateY(-100%) } to { -webkit-transform: translateY(0); transform: translateY(0) } } @-webkit-keyframes moveclouds { 0% { -webkit-transform: translate3d(-10px, -10px, 0); transform: translate3d(-10px, -10px, 0); opacity: 1 } 50% { -webkit-transform: translate3d(-20px, 20px, 0); transform: translate3d(-20px, 20px, 0); opacity: 1 } 100% { -webkit-transform: translate3d(30px, 0, 0); transform: translate3d(30px, 0, 0); opacity: 1 } } @keyframes moveclouds { 0% { -webkit-transform: translate3d(-10px, -10px, 0); transform: translate3d(-10px, -10px, 0); opacity: 1 } 50% { -webkit-transform: translate3d(-20px, 20px, 0); transform: translate3d(-20px, 20px, 0); opacity: 1 } 100% { -webkit-transform: translate3d(30px, 0, 0); transform: translate3d(30px, 0, 0); opacity: 1 } } @-webkit-keyframes pulse { 0% { width: 82px; height: 82px; opacity: 1 } 50% { opacity: 1 } 100% { height: 150px; width: 150px; opacity: 0 } } @keyframes pulse { 0% { width: 82px; height: 82px; opacity: 1 } 50% { opacity: 1 } 100% { height: 150px; width: 150px; opacity: 0 } } .page-loader { background: #fff; position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 99999999 } .page-loader .loader { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%) } .page-loader svg { display: none } .blobs { -webkit-filter: url(#goo); filter: url(#goo); width: 300px; height: 300px; position: relative; overflow: hidden; border-radius: 70px; -webkit-transform-style: preserve-3d; transform-style: preserve-3d } .blobs .blob-center { -webkit-transform-style: preserve-3d; transform-style: preserve-3d; position: absolute; background: #fa7070; top: 50%; left: 50%; width: 30px; height: 30px; -webkit-transform-origin: left top; -ms-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(.9) translate(-50%, -50%); -ms-transform: scale(.9) translate(-50%, -50%); transform: scale(.9) translate(-50%, -50%); -webkit-animation: blob-grow linear 3.4s infinite; animation: blob-grow linear 3.4s infinite; border-radius: 50%; -webkit-box-shadow: 0 -10px 40px -5px #fa7070; box-shadow: 0 -10px 40px -5px #fa7070 } .blob { position: absolute; background: #fa7070; top: 50%; left: 50%; width: 30px; height: 30px; border-radius: 50%; -webkit-animation: blobs ease-out 3.4s infinite; animation: blobs ease-out 3.4s infinite; -webkit-transform: scale(.9) translate(-50%, -50%); -ms-transform: scale(.9) translate(-50%, -50%); transform: scale(.9) translate(-50%, -50%); -webkit-transform-origin: center top; -ms-transform-origin: center top; transform-origin: center top; opacity: 0 } .blob:nth-child(1) { -webkit-animation-delay: .2s; animation-delay: .2s } .blob:nth-child(2) { -webkit-animation-delay: .4s; animation-delay: .4s } .blob:nth-child(3) { -webkit-animation-delay: .6s; animation-delay: .6s } .blob:nth-child(4) { -webkit-animation-delay: .8s; animation-delay: .8s } .blob:nth-child(5) { -webkit-animation-delay: 1s; animation-delay: 1s } @-webkit-keyframes blobs { 0% { opacity: 0; -webkit-transform: scale(0) translate(calc(-330px - 50%), -50%); transform: scale(0) translate(calc(-330px - 50%), -50%) } 1% { opacity: 1 } 35%, 65% { opacity: 1; -webkit-transform: scale(.9) translate(-50%, -50%); transform: scale(.9) translate(-50%, -50%) } 99% { opacity: 1 } 100% { opacity: 0; -webkit-transform: scale(0) translate(calc(330px - 50%), -50%); transform: scale(0) translate(calc(330px - 50%), -50%) } } @keyframes blobs { 0% { opacity: 0; -webkit-transform: scale(0) translate(calc(-330px - 50%), -50%); transform: scale(0) translate(calc(-330px - 50%), -50%) } 1% { opacity: 1 } 35%, 65% { opacity: 1; -webkit-transform: scale(.9) translate(-50%, -50%); transform: scale(.9) translate(-50%, -50%) } 99% { opacity: 1 } 100% { opacity: 0; -webkit-transform: scale(0) translate(calc(330px - 50%), -50%); transform: scale(0) translate(calc(330px - 50%), -50%) } } @-webkit-keyframes blob-grow { 0%, 39% { -webkit-transform: scale(0) translate(-50%, -50%); transform: scale(0) translate(-50%, -50%) } 40%, 42% { -webkit-transform: scale(1, .9) translate(-50%, -50%); transform: scale(1, .9) translate(-50%, -50%) } 43%, 44% { -webkit-transform: scale(1.2, 1.1) translate(-50%, -50%); transform: scale(1.2, 1.1) translate(-50%, -50%) } 45%, 46% { -webkit-transform: scale(1.3, 1.2) translate(-50%, -50%); transform: scale(1.3, 1.2) translate(-50%, -50%) } 47%, 48% { -webkit-transform: scale(1.4, 1.3) translate(-50%, -50%); transform: scale(1.4, 1.3) translate(-50%, -50%) } 52% { -webkit-transform: scale(1.5, 1.4) translate(-50%, -50%); transform: scale(1.5, 1.4) translate(-50%, -50%) } 54% { -webkit-transform: scale(1.7, 1.6) translate(-50%, -50%); transform: scale(1.7, 1.6) translate(-50%, -50%) } 58% { -webkit-transform: scale(1.8, 1.7) translate(-50%, -50%); transform: scale(1.8, 1.7) translate(-50%, -50%) } 68%, 70% { -webkit-transform: scale(1.7, 1.5) translate(-50%, -50%); transform: scale(1.7, 1.5) translate(-50%, -50%) } 78% { -webkit-transform: scale(1.6, 1.4) translate(-50%, -50%); transform: scale(1.6, 1.4) translate(-50%, -50%) } 80%, 81% { -webkit-transform: scale(1.5, 1.4) translate(-50%, -50%); transform: scale(1.5, 1.4) translate(-50%, -50%) } 82%, 83% { -webkit-transform: scale(1.4, 1.3) translate(-50%, -50%); transform: scale(1.4, 1.3) translate(-50%, -50%) } 84%, 85% { -webkit-transform: scale(1.3, 1.2) translate(-50%, -50%); transform: scale(1.3, 1.2) translate(-50%, -50%) } 86%, 87% { -webkit-transform: scale(1.2, 1.1) translate(-50%, -50%); transform: scale(1.2, 1.1) translate(-50%, -50%) } 90%, 91% { -webkit-transform: scale(1, .9) translate(-50%, -50%); transform: scale(1, .9) translate(-50%, -50%) } 100%, 92% { -webkit-transform: scale(0) translate(-50%, -50%); transform: scale(0) translate(-50%, -50%) } } @keyframes blob-grow { 0%, 39% { -webkit-transform: scale(0) translate(-50%, -50%); transform: scale(0) translate(-50%, -50%) } 40%, 42% { -webkit-transform: scale(1, .9) translate(-50%, -50%); transform: scale(1, .9) translate(-50%, -50%) } 43%, 44% { -webkit-transform: scale(1.2, 1.1) translate(-50%, -50%); transform: scale(1.2, 1.1) translate(-50%, -50%) } 45%, 46% { -webkit-transform: scale(1.3, 1.2) translate(-50%, -50%); transform: scale(1.3, 1.2) translate(-50%, -50%) } 47%, 48% { -webkit-transform: scale(1.4, 1.3) translate(-50%, -50%); transform: scale(1.4, 1.3) translate(-50%, -50%) } 52% { -webkit-transform: scale(1.5, 1.4) translate(-50%, -50%); transform: scale(1.5, 1.4) translate(-50%, -50%) } 54% { -webkit-transform: scale(1.7, 1.6) translate(-50%, -50%); transform: scale(1.7, 1.6) translate(-50%, -50%) } 58% { -webkit-transform: scale(1.8, 1.7) translate(-50%, -50%); transform: scale(1.8, 1.7) translate(-50%, -50%) } 68%, 70% { -webkit-transform: scale(1.7, 1.5) translate(-50%, -50%); transform: scale(1.7, 1.5) translate(-50%, -50%) } 78% { -webkit-transform: scale(1.6, 1.4) translate(-50%, -50%); transform: scale(1.6, 1.4) translate(-50%, -50%) } 80%, 81% { -webkit-transform: scale(1.5, 1.4) translate(-50%, -50%); transform: scale(1.5, 1.4) translate(-50%, -50%) } 82%, 83% { -webkit-transform: scale(1.4, 1.3) translate(-50%, -50%); transform: scale(1.4, 1.3) translate(-50%, -50%) } 84%, 85% { -webkit-transform: scale(1.3, 1.2) translate(-50%, -50%); transform: scale(1.3, 1.2) translate(-50%, -50%) } 86%, 87% { -webkit-transform: scale(1.2, 1.1) translate(-50%, -50%); transform: scale(1.2, 1.1) translate(-50%, -50%) } 90%, 91% { -webkit-transform: scale(1, .9) translate(-50%, -50%); transform: scale(1, .9) translate(-50%, -50%) } 100%, 92% { -webkit-transform: scale(0) translate(-50%, -50%); transform: scale(0) translate(-50%, -50%) } } .site-header { position: relative; width: 100%; top: 0; left: 0; z-index: 9; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; box-shadow: 0px 0px 16px #00000029; } .site-header .heder-inner { position: relative } .site-header .heder-inner .site-logo a { display: block; max-width: 190px } .site-header .heder-inner .site-logo a img { width: 100% } .site-header .heder-inner .site-logo a .sticky-logo { display: none } .site-header .heder-inner .site-nav { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .site-header .heder-inner .site-nav .menu-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: relative } .site-header .heder-inner .site-nav .menu-wrapper:before { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .75); z-index: 99; opacity: 0; visibility: hidden; -webkit-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out } .site-header .heder-inner .site-nav .nav-right { margin-left: 40px } .site-header .heder-inner .site-nav .nav-right .nav-btn { background: #fff; -webkit-box-shadow: 0 20px 30px 0 rgba(79, 35, 35, .15); box-shadow: 0 20px 30px 0 rgba(79, 35, 35, .15); color: #fa7070; display: inline-block; padding: 7px 37px; font-weight: 600; border-radius: 30px; font-size: 14px; border: 2px solid transparent } .site-header .heder-inner .site-nav .nav-right .nav-btn:hover { background: #fa7070; color: #fff } .site-header .heder-inner .site-nav.nav-two .nav-right .nav-btn { background: 0 0; color: #fff; border: 2px solid #fff; -webkit-box-shadow: none; box-shadow: none; padding: 6px 37px } .site-header .heder-inner .site-nav.nav-two .nav-right .nav-btn:hover { background: #fff; color: #7052fb; border-color: #fff } .site-header .heder-inner .site-nav.nav-two .nav-right .nav-btn.style-two { background-color: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .3); color: #fff; padding: 9px 37px } .site-header .heder-inner .site-nav.nav-two .nav-right .nav-btn.style-two:hover { background: #fff; color: #7052fb } .site-header .heder-inner .site-nav.nav-two .site-main-menu li .sub-menu li a.current_page, .site-header .heder-inner .site-nav.nav-two .site-main-menu li .sub-menu li a:hover { color: #7052fb } .site-header .site-mobile-logo { display: none } .site-header .site-main-menu { margin: 0; padding: 0; list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex } .site-header .site-main-menu li { margin: 0 14px; position: relative; padding: 36px 0; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .site-header .site-main-menu li:last-child { margin-right: 0 } .site-header .site-main-menu li>a { color: #fff; font-size: 15px; font-weight: 500; position: relative } .site-header .site-main-menu li>a:after { content: ''; position: absolute; bottom: -2px; width: 0; height: 1px; background: #fff; opacity: 1; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; left: 0 } .site-header .site-main-menu li>a.current_page:after, .site-header .site-main-menu li>a:hover:after { width: 100%; opacity: 1 } .site-header .site-main-menu li.menu-item-has-children:after { position: absolute; right: -18px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); font-family: eleganticons; font-size: 10px; font-weight: 700; color: #fff; font-size: 14px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .site-header .site-main-menu li.menu-item-has-children:hover:after { color: #fa7070 } .site-header .site-main-menu li .sub-menu { display: block; margin: 0; padding: 23px 30px; list-style: none; background: #fff; -webkit-box-shadow: 0 0 36px 4px rgba(79, 35, 35, .1); box-shadow: 0 0 36px 4px rgba(79, 35, 35, .1); position: absolute; top: 110%; left: 0; min-width: 250px; visibility: hidden; opacity: 0; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; z-index: 999999; border-radius: 10px } .site-header .site-main-menu li .sub-menu li { display: block; margin: 0; padding: 0 } .site-header .site-main-menu li .sub-menu li.menu-item-has-children:after { content: "\35"; right: 0; color: #333 } .site-header .site-main-menu li .sub-menu li.menu-item-has-children .sub-menu { left: 105%; top: 0; visibility: hidden; opacity: 0 } .site-header .site-main-menu li .sub-menu li.menu-item-has-children:hover .sub-menu { top: -23px; visibility: visible; opacity: 1 } .site-header .site-main-menu li .sub-menu li a { display: block; padding: 3px 0; color: #797687; font-size: 14px; font-weight: 500 } .site-header .site-main-menu li .sub-menu li a:after { display: none } .site-header .site-main-menu li .sub-menu li a.current_page, .site-header .site-main-menu li .sub-menu li a:hover { color: #fa7070 } .site-header .site-main-menu li .sub-menu li:last-child a { border-bottom: 0 } .site-header .site-main-menu li:hover .sub-menu { opacity: 1; visibility: visible; top: 72% } .site-header .nav-dark .site-main-menu li a { color: #2b2350 } .site-header .nav-dark .site-main-menu li a:after { display: none } .site-header .nav-dark .site-main-menu li a.current_page, .site-header .nav-dark .site-main-menu li a:hover { color: #fa7070 } .site-header .nav-dark .site-main-menu li.menu-item-has-children:after { color: #2b2350 } .logo-sticky { display: none } .pix-header-fixed { top: 0; left: 0; right: 0; position: fixed; z-index: 9999; -webkit-box-shadow: 0 10px 20px 0 rgba(79, 35, 35, .08); box-shadow: 0 10px 20px 0 rgba(79, 35, 35, .08); -webkit-animation: stickySlideDown .65s cubic-bezier(.23, 1, .32, 1) both; animation: stickySlideDown .65s cubic-bezier(.23, 1, .32, 1) both; background: #fff } .pix-header-fixed .heder-inner .site-logo { padding: 8px 0 } .pix-header-fixed .heder-inner .site-logo .logo-sticky { display: block } .pix-header-fixed .heder-inner .site-logo .logo-main { display: none } .pix-header-fixed .heder-inner .site-nav .nav-right .nav-btn { background: 0 0; color: #fa7070; -webkit-box-shadow: none; box-shadow: none; border-color: #fa7070 } .pix-header-fixed .heder-inner .site-nav .nav-right .nav-btn:hover { background: #fa7070; color: #fff } .pix-header-fixed .heder-inner .site-nav.nav-two .nav-right .nav-btn, .pix-header-fixed .heder-inner .site-nav.nav-two .nav-right .nav-btn.style-two { border-color: #7052fb; color: #7052fb } .pix-header-fixed .heder-inner .site-nav.nav-two .nav-right .nav-btn.style-two:hover, .pix-header-fixed .heder-inner .site-nav.nav-two .nav-right .nav-btn:hover { background: #7052fb; color: #fff; border-color: #7052fb } .pix-header-fixed .heder-inner .site-nav.nav-two .site-main-menu li a.current_page, .pix-header-fixed .heder-inner .site-nav.nav-two .site-main-menu li a:hover { color: #7052fb } .pix-header-fixed .site-main-menu li { padding: 28px 0 } .pix-header-fixed .site-main-menu li.menu-item-has-children:after { color: #333 } .pix-header-fixed .site-main-menu li a { color: #333 } .pix-header-fixed .site-main-menu li a:after { display: none } .pix-header-fixed .site-main-menu li a.current_page, .pix-header-fixed .site-main-menu li a:hover { color: #fa7070 } .pix-header-fixed .site-main-menu li a.current_page:after, .pix-header-fixed .site-main-menu li a.current_page:before, .pix-header-fixed .site-main-menu li a:hover:after, .pix-header-fixed .site-main-menu li a:hover:before { background: #fa7070 } .pix-header-fixed .site-logo .main-logo { display: none } .pix-header-fixed .site-logo .sticky-logo { display: block } .return-to-top { position: fixed; bottom: -30px; right: 20px; width: 42px; height: 42px; line-height: 42px; text-align: center; cursor: pointer; z-index: 998; border-radius: 50%; opacity: 0; -webkit-transition: bottom .5s ease, opacity .5s ease; -o-transition: bottom .5s ease, opacity .5s ease; transition: bottom .5s ease, opacity .5s ease } .return-to-top:before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: 0 0; opacity: 1; display: block; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; border-radius: inherit; -webkit-transition: opacity .6s ease, -webkit-transform .5s ease; transition: opacity .6s ease, -webkit-transform .5s ease; -o-transition: transform .5s ease, opacity .6s ease; transition: transform .5s ease, opacity .6s ease; transition: transform .5s ease, opacity .6s ease, -webkit-transform .5s ease } .return-to-top:after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: block; background: rgba(0, 0, 0, .25); -webkit-box-shadow: 0 0 0 0 transparent; box-shadow: 0 0 0 0 transparent; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; border-radius: inherit } .return-to-top>i { position: relative; overflow: hidden; font-size: 12px; width: inherit; height: inherit; line-height: inherit; display: block; color: transparent; text-shadow: 0 0 #fff, 0 50px #fff; -webkit-transition: text-shadow .2s ease; -o-transition: text-shadow .2s ease; transition: text-shadow .2s ease; z-index: 1 } .return-to-top:hover:after { -webkit-transform: scale(1.07); -ms-transform: scale(1.07); transform: scale(1.07); background: #fa7070; -webkit-box-shadow: 0 10px 20px 8px rgba(0, 0, 0, .15); box-shadow: 0 10px 20px 8px rgba(0, 0, 0, .15) } .return-to-top:hover>i { text-shadow: 0 -50px #fff, 0 0 #fff } .return-to-top.back-top { bottom: 75px; opacity: 1 } .mask-overlay { position: fixed; width: 100%; height: 100%; background: rgba(0, 0, 0, .5); z-index: 3333; top: 0; left: 0 } .close-menu { display: none } .home-color-two .return-to-top:hover:after { -webkit-transform: scale(1.07); -ms-transform: scale(1.07); transform: scale(1.07); background: #7052fb; -webkit-box-shadow: 0 10px 20px 8px rgba(0, 0, 0, .15); box-shadow: 0 10px 20px 8px rgba(0, 0, 0, .15) } .home-color-two .return-to-top:hover>i { text-shadow: 0 -50px #fff, 0 0 #fff } @media (max-width: 991px) { .site-header .heder-inner { text-align: center; padding: 15px 0 } .site-header .heder-inner .site-nav .nav-right { margin-left: 20px } .site-header .heder-inner .site-nav .nav-right .nav-btn { padding: 8px 22px } .site-header .site-mobile-logo { display: block } .site-header .site-main-menu li { margin: 0 15px } .site-header .site-logo { display: none } .site-header.header-two.toggle-light .toggle-menu .bar { background: #fff } .site-header .site-nav { position: fixed; width: 320px !important; height: 100vh; background: #fff; top: 0; left: -100%; display: block !important; -webkit-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; overflow: scroll; -webkit-box-shadow: 0 20px 30px rgba(0, 0, 0, .1); box-shadow: 0 20px 30px rgba(0, 0, 0, .1) } .site-header .site-nav .site-main-menu { display: block; width: 100%; padding-bottom: 50px; text-align: left } .site-header .site-nav .site-main-menu li { padding: 0; margin: 0; border-bottom: 1px solid #f1f2f3 } .site-header .site-nav .site-main-menu li:first-child { border-top: 1px solid #f1f2f3 } .site-header .site-nav .site-main-menu li a { display: block; color: #2f2f2f !important; padding: 6px 35px; font-weight: 400 } .site-header .site-nav .site-main-menu li a:after { display: none } .site-header .site-nav .site-main-menu li.menu-item-has-children { position: relative } .site-header .site-nav .site-main-menu li.menu-item-has-children:after { display: none } .site-header .site-nav .site-main-menu li.menu-item-has-children a:hover, .site-header .site-nav .site-main-menu li.menu-item-has-children:focus { color: #fa7070 } .site-header .site-nav .site-main-menu li.menu-item-has-children i { position: absolute; top: 12px; right: 35px } .site-header .site-nav .site-main-menu li.menu-item-has-children .sub-menu { position: static; -webkit-box-shadow: none; box-shadow: none; opacity: 1; width: auto; visibility: visible; background: 0 0; padding: 0; display: none; -webkit-transition: none; -o-transition: none; transition: none } .site-header .site-nav .site-main-menu li.menu-item-has-children .sub-menu li { padding: 0 } .site-header .site-nav .site-main-menu li.menu-item-has-children .sub-menu li:first-child { border-top: 1px solid #f1f2f3 } .site-header .site-nav .site-main-menu li.menu-item-has-children .sub-menu li:last-child { border-bottom: none; padding-bottom: 0 } .site-header .site-nav .site-main-menu li.menu-item-has-children .sub-menu li a { color: #888; font-weight: 400; padding: 5px 35px 5px 45px } .site-header .site-nav .site-main-menu li.menu-item-has-children .sub-menu li.menu-item-has-children .sub-menu { opacity: 1; visibility: visible; position: relative; left: 0; top: auto } .site-header .site-nav .site-main-menu li.menu-item-has-children .sub-menu li.menu-item-has-children .sub-menu li a { padding-left: 60px } .site-header .site-nav .site-main-menu li.menu-item-has-children .sub-menu li.menu-item-has-children:after { content: "\33"; color: #fff } .site-header .site-nav .nav-right { display: none } .site-header .site-nav.nav-two .site-main-menu li.menu-item-has-children:focus, .site-header .site-nav.nav-two .site-main-menu li.menu-item-has-children:hover { color: #7052fb } .site-header .site-nav.nav-two .site-main-menu li.menu-item-has-children:focus:after, .site-header .site-nav.nav-two .site-main-menu li.menu-item-has-children:hover:after { color: #7052fb } .site-header .site-nav.nav-two .site-main-menu li.menu-item-has-children a:focus, .site-header .site-nav.nav-two .site-main-menu li.menu-item-has-children a:hover { color: #7052fb } .site-header.header-two .toggle-menu .bar { background: #2b2350 } .heder-inner .site-mobile-logo img { max-height: 50px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .pix-header-fixed .toggle-menu { top: 22px } .pix-header-fixed .toggle-menu .bar { background: #333 } .pix-header-fixed .site-main-menu li a { color: #fff } .pix-header-fixed .site-main-menu li.menu-item-has-children:after { color: #fff } .pix-header-fixed .heder-inner .site-logo { padding: 12px 0 } .pix-header-fixed.header-two.toggle-light .toggle-menu .bar { background: #000 } .sidebar-open .site-header .site-nav { left: 0 } .sidebar-open .menu-wrapper:before { opacity: 1; visibility: visible } .close-menu { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; top: 0; text-align: right; width: 100%; left: 0; padding: 2px; padding: 30px 20px } .close-menu i { font-size: 36px; color: #2b2350 } .close-menu span { font-size: 15px } .toggle-menu { position: absolute; left: 0; width: 26px; top: 30%; -ms-transform: translateY(-50%); display: block; height: 24px } .toggle-menu .bar { width: 18px; height: 2px; display: block; float: left; margin: 3px auto; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; background: #fff } .toggle-menu .bar:nth-child(2) { width: 24px } .header-dark .toggle-menu .bar { background: #2b2350 } } @media (max-width: 420px) { .site-header .site-nav { width: 100% !important } } .banner { position: relative } .banner .banner-content-wrap { position: relative; -webkit-transform: translateY(52%); -ms-transform: translateY(52%); transform: translateY(52%); z-index: 2 } .banner .banner-content .banner-title {} .banner .banner-content .banner-title span { font-weight: 800 } .banner .banner-content .description { font-size: 18px; font-weight: 400; color: #fff; line-height: 30px; margin-bottom: 47px } .banner .banner-content .banner-btn { color: #fff; padding: 10px 40px; border: 1px solid #fff; border-radius: 30px; font-size: 14px; display: inline-block } .banner .banner-content .banner-btn:hover { background: #fff; color: #fa7070; -webkit-box-shadow: 0 20px 30px 0 rgba(79, 35, 35, .15); box-shadow: 0 20px 30px 0 rgba(79, 35, 35, .15) } .banner.banner-one { height: 1050px; background-image: -o-linear-gradient(210deg, #fa9770 0, #fa7070 100%); background-image: linear-gradient(-120deg, #fa9770 0, #fa7070 100%); position: relative; overflow-x: hidden } .banner.banner-one .circle-shape { position: absolute; top: -20%; left: -13% } .banner.banner-one .promo-mockup { margin-left: -120px } .banner.banner-one .promo-mockup img { max-width: 920px; -webkit-animation: zoom 4s infinite ease; animation: zoom 4s infinite ease; -webkit-animation-direction: alternate; animation-direction: alternate; -webkit-transform: scale(1) translate(0); -ms-transform: scale(1) translate(0); transform: scale(1) translate(0) } .banner.banner-one .bg-shape { position: absolute; left: 0; bottom: 0; z-index: 1 } .banner.banner-two { height: 720px; overflow: hidden; background-image: -o-linear-gradient(150deg, #7052fb 0, #8a60fd 100%); background-image: linear-gradient(-60deg, #7052fb 0, #8a60fd 100%) } .banner.banner-two .vector-bg { position: absolute; left: 0; bottom: 0; width: 100%; height: 720px } .banner.banner-two .vector-bg img { max-width: unset } .banner.banner-two .banner-content-wrap { -webkit-transform: translateY(37%); -ms-transform: translateY(37%); transform: translateY(37%) } .banner.banner-two .banner-content .banner-title { color: #2b2350 } .banner.banner-two .banner-content .description { color: #2b2350 } .banner.banner-two .banner-content .banner-btn.color-two { background: #7052fb; -webkit-box-shadow: 0 20px 30px 0 rgba(90, 70, 176, .3); box-shadow: 0 20px 30px 0 rgba(90, 70, 176, .3); border: 1px solid transparent } .banner.banner-two .banner-content .banner-btn:hover { -webkit-box-shadow: none; box-shadow: none; color: #fff } .banner.banner-two .promo-mockup img { max-width: 850px } .banner.banner-three { background-image: -o-linear-gradient(150deg, #fa9770 0, #fa7070 100%); background-image: linear-gradient(-60deg, #fa9770 0, #fa7070 100%); height: 950px; min-height: 700px } .banner.banner-three .banner-content-wrap-two { padding-top: 185px } .banner.banner-three .banner-content { margin-bottom: 100px; position: relative; z-index: 22 } .banner.banner-three .banner-content .banner-title { font-size: 50px; line-height: 60px; font-weight: 800; margin-bottom: 20px } .banner.banner-three .banner-content .description { font-size: 18px; font-weight: 400; color: #fff; line-height: 30px; margin-bottom: 47px } .banner.banner-three .banner-content .banner-btn { color: #fff; padding: 8px 47px; border: 1px solid #fff; border-radius: 30px; font-size: 14px; display: inline-block; font-weight: 600 } .banner.banner-three .banner-content .banner-btn:hover { background: #fff; color: #fa7070; -webkit-box-shadow: 0 20px 30px 0 rgba(79, 35, 35, .15); box-shadow: 0 20px 30px 0 rgba(79, 35, 35, .15) } .banner.banner-three .play-btn { margin-left: 20px; font-weight: 500 } .banner.banner-three .circle-shape, .banner.banner-three .shape { position: absolute; z-index: 0; top: 0 } .banner.banner-three .circle-shape { left: 0 } .banner.banner-three .shape { right: 0 } .banner.banner-three .promo-mockup { position: relative; max-width: 970px; margin: 0 auto } .banner.banner-three .promo-mockup img { -webkit-box-shadow: 0 60px 100px 0 rgba(79, 35, 35, .2); box-shadow: 0 60px 100px 0 rgba(79, 35, 35, .2); border-radius: 10px } .banner.banner-three .promo-mockup .shape-shadow { border-radius: 10px; background-color: #fff; opacity: .4; -webkit-box-shadow: 0 60px 100px 0 rgba(79, 35, 35, .2); box-shadow: 0 60px 100px 0 rgba(79, 35, 35, .2); height: 100px; max-width: 73%; position: absolute; bottom: -40px; width: 100%; z-index: -1; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%) } .banner.banner-three .bg-shape-inner { position: absolute; width: 100%; height: 100%; top: 0; left: 0; overflow: hidden } .banner.banner-four { background-image: -o-linear-gradient(40deg, #4f29dd 0, #7052fb 100%); background-image: linear-gradient(180deg, #7d5df5 0, #edf0f3 100%); height: 100%; padding-top: 22px; } .banner.banner-four .banner-content-wrap-two { padding-top: 185px } .banner.banner-four .banner-content { margin-bottom: 100px; position: relative; z-index: 22 } .banner.banner-four .banner-content .banner-title { margin-bottom: 20px; font-size: 2rem; line-height: 145%; color: #2b2350; font-weight: 400; } .banner.banner-four .banner-content .banner-title span { font-weight: 600; text-transform: capitalize } .banner.banner-four .banner-content .description { font-size: 18px; font-weight: 400; color: #fff; line-height: 30px; margin-bottom: 47px } .banner.banner-four .promo-mockup { position: relative; z-index: 2; margin-top: -80px; -webkit-animation: jump 2s infinite; animation: jump 2s infinite } .banner.banner-four .play-btn { font-weight: 400 } .banner.banner-four .play-btn i { color: #7052fb; text-shadow: none } .banner.banner-four .bg-shape-inner { position: absolute; bottom: -2px } .banner .banner-button-container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center } .newsletter-form-banner { margin-bottom: 50px } .newsletter-form-banner .newsletter-inner { position: relative; max-width: 475px } .newsletter-form-banner .newsletter-inner input { width: 100%; margin: 0; height: 56px; border-radius: 30px; background: #fff; border: 0; outline: 0; padding: 10px 180px 10px 30px } .newsletter-form-banner .newsletter-inner input:focus { -webkit-box-shadow: none; box-shadow: none } .newsletter-form-banner .newsletter-inner button { position: absolute; right: 3px; top: 4px; border: 0; background: #7052fb; color: #fff; font-size: 16px; font-weight: 500; padding: 10px 30px; border-radius: 30px } .newsletter-form-banner .newsletter-inner button i { display: none } .newsletter-form-banner .newsletter-inner button.clicked i { display: block } .newsletter-form-banner .newsletter-inner button:hover { background: #5c42d2 } .animate-promo-mockup { position: relative; width: 830px; height: 600px; margin-left: -40px } .animate-promo-mockup img { position: absolute } .animate-promo-mockup img:nth-child(1) { left: 100px; bottom: 100px } .animate-promo-mockup img:nth-child(2) { left: 0; bottom: 100px } .animate-promo-mockup img:nth-child(3) { right: 0; bottom: 150px } .animate-promo-mockup img:nth-child(4) { bottom: 15px; left: 80px } .animate-promo-mockup img:nth-child(5) { bottom: 25px; left: 49% } .animate-promo-mockup img:nth-child(6) { right: 176px; bottom: 0; -webkit-animation: jump 2s infinite; animation: jump 2s infinite } .animate-promo-mockup img:nth-child(7) { right: 114px; bottom: 33px } .animate-promo-mockup img:nth-child(8) { left: 0; top: 0; -webkit-animation: moveclouds 4s 1s linear infinite alternate; animation: moveclouds 4s 1s linear infinite alternate } .animate-promo-mockup img:nth-child(9) { left: 50%; top: 0; -webkit-animation: moveclouds 4s 2s linear infinite alternate; animation: moveclouds 4s 2s linear infinite alternate } .animate-promo-mockup img:nth-child(10) { left: 90%; top: 0; -webkit-animation: moveclouds 4s 3s linear infinite alternate; animation: moveclouds 4s 3s linear infinite alternate } .slider-nav { position: absolute; top: 40%; left: 0; width: 100%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 999 } .slider-nav .slider-next, .slider-nav .slider-prev { height: 100px; width: 40px; text-align: center; line-height: 100px; background: rgba(0, 0, 0, .5); position: absolute; cursor: pointer; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .slider-nav .slider-next i, .slider-nav .slider-prev i { font-size: 30px; color: #fff } .slider-nav .slider-next:hover, .slider-nav .slider-prev:hover { background: #fa7070 } .slider-nav .slider-next { right: 0 } .slider-nav .slider-prev { left: 0 } .swiper-pagination { margin-top: 25px; position: absolute; left: 50% !important; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%) } .swiper-pagination .swiper-pagination-bullet { height: 14px; width: 14px; margin-right: 3px } .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #fff; opacity: 1 } .section-dark .gp-testimonial .gp-testimonial-author .author-details .testi-author-name { color: #fff } .section-dark .gp-testimonial .gp-testimonial-author .author-details span { color: #b5b5b5 } .section-dark .swiper-pagination-bullet { background: #fff; opacity: .5 } .scroll-circle { position: absolute; bottom: -48%; z-index: 1 } @media (max-width: 1600px) { .banner.banner-one .banner-content-wrap { -webkit-transform: translateY(70%); -ms-transform: translateY(70%); transform: translateY(70%) } .banner.banner-one .promo-mockup { margin-left: -50px } .banner.banner-one .promo-mockup img { max-width: 800px } .banner.banner-two .vector-bg { left: -15% } .banner.banner-two .animate-promo-mockup { width: 550px; height: 530px } .banner.banner-two .animate-promo-mockup img:nth-child(3) { right: -160px } .banner.banner-two .animate-promo-mockup img:nth-child(5) { left: 62% } .banner.banner-two .animate-promo-mockup img:nth-child(6) { right: -10px; width: 230px } .banner.banner-two .animate-promo-mockup img:nth-child(7) { right: -60px; width: 99px } .banner.banner-three .circle-shape { left: -20% } } @media (max-width: 1440px) { .banner.banner-one .banner-content-wrap { -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%) } .banner.banner-one .promo-mockup { margin-left: -50px } .banner.banner-one .promo-mockup img { max-width: 700px } .banner.banner-two { height: 890px } .banner.banner-two .vector-bg { left: -14%; height: 890px } .banner.banner-two .vector-bg img { height: 890px } .banner.banner-two .banner-content-wrap { -webkit-transform: translateY(40%); -ms-transform: translateY(40%); transform: translateY(40%) } .banner.banner-two .banner-content .banner-title { font-size: 50px; line-height: 60px } .banner.banner-two .animate-promo-mockup { width: 480px; height: 470px } .banner.banner-two .animate-promo-mockup img:nth-child(1) { left: 85px } .banner.banner-two .animate-promo-mockup img:nth-child(2) { width: 85px } .banner.banner-two .animate-promo-mockup img:nth-child(3) { right: -135px; width: 61px } .banner.banner-two .animate-promo-mockup img:nth-child(4) { left: 65px; width: 150px } .banner.banner-two .animate-promo-mockup img:nth-child(5) { left: 62% } .banner.banner-two .animate-promo-mockup img:nth-child(6) { right: -5px; width: 210px } .banner.banner-two .animate-promo-mockup img:nth-child(7) { right: -45px; width: 90px } .banner.banner-three .circle-shape { left: -35% } .banner.banner-three .shape { right: -15% } } @media (max-width: 1280px) { .banner.banner-one .banner-content-wrap { -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%) } .banner.banner-one .banner-content .banner-title { font-size: 50px; line-height: 60px } .banner.banner-one .banner-content p br { display: none } .banner.banner-one .promo-mockup { margin-left: -90px } .banner.banner-one .promo-mockup img { max-width: 100% } } @media (min-width: 992px) and (max-width:1200px) { .banner.banner-two .banner-content .banner-title { font-size: 40px; line-height: 50px } .banner.banner-two .banner-content p br { display: none } .banner.banner-two .animate-promo-mockup { width: 380px; height: 400px } .banner.banner-two .animate-promo-mockup img:nth-child(1) { left: 65px } .banner.banner-two .animate-promo-mockup img:nth-child(2) { width: 65px } .banner.banner-two .animate-promo-mockup img:nth-child(3) { right: -100px; width: 50px } .banner.banner-two .animate-promo-mockup img:nth-child(4) { left: 55px; width: 125px; bottom: 30px } .banner.banner-two .animate-promo-mockup img:nth-child(5) { left: 55%; width: 40px } .banner.banner-two .animate-promo-mockup img:nth-child(6) { right: -3px; width: 180px; bottom: 8px } .banner.banner-two .animate-promo-mockup img:nth-child(7) { right: -35px; width: 70px; bottom: 50px } .banner.banner-three .shape { right: -25% } } @media (max-width: 1200px) { .banner.banner-two { height: 840px } .banner.banner-two .vector-bg { height: 840px; left: -26% } .banner.banner-two .vector-bg img { height: 800px } .banner.banner-four { height: 880px; padding-top: 240px } .banner.banner-four .banner-content .banner-title { font-size: 50px; line-height: 65px } .banner.banner-four .promo-mockup { margin-top: -30px } } @media (min-width: 991px) and (max-width:1024px) { .banner.banner-one { height: 700px } .banner.banner-one .banner-content-wrap { -webkit-transform: translateY(60%); -ms-transform: translateY(60%); transform: translateY(60%) } .banner.banner-one .banner-content .banner-title { font-size: 40px; line-height: 50px } .banner.banner-one .circle-shape { max-width: 500px } } @media (max-width: 991px) { .banner.banner-one .banner-content-wrap { -webkit-transform: translateY(20%); -ms-transform: translateY(20%); transform: translateY(20%) } .banner.banner-one .banner-content { margin-bottom: 50px } .banner.banner-one .banner-content .banner-title { font-size: 40px; line-height: 50px } .banner.banner-one .banner-content p br { display: none } .banner.banner-one .promo-mockup { margin-left: -45px } .banner.banner-one .circle-shape { max-width: 500px } .banner.banner-two { height: 840px } .banner.banner-two .vector-bg { height: 840px; left: -27% } .banner.banner-two .vector-bg img { height: 840px } .banner.banner-two .banner-content-wrap { -webkit-transform: translateY(18%); -ms-transform: translateY(18%); transform: translateY(18%) } .banner.banner-two .banner-content .banner-title { font-size: 40px; line-height: 50px } .banner.banner-two .banner-content p br { display: none } .banner.banner-two .animate-promo-mockup { width: 380px; height: 380px } .banner.banner-two .animate-promo-mockup img:nth-child(1) { left: 65px } .banner.banner-two .animate-promo-mockup img:nth-child(2) { width: 65px } .banner.banner-two .animate-promo-mockup img:nth-child(3) { right: -100px; width: 50px } .banner.banner-two .animate-promo-mockup img:nth-child(4) { left: 55px; width: 125px; bottom: 30px } .banner.banner-two .animate-promo-mockup img:nth-child(5) { left: 55%; width: 40px } .banner.banner-two .animate-promo-mockup img:nth-child(6) { right: -3px; width: 180px; bottom: 8px } .banner.banner-two .animate-promo-mockup img:nth-child(7) { right: -35px; width: 70px; bottom: 50px } .banner.banner-three .promo-mockup img { -webkit-box-shadow: 0 40px 50px 0 rgba(79, 35, 35, .2); box-shadow: 0 40px 50px 0 rgba(79, 35, 35, .2) } .banner.banner-three .promo-mockup .shape-shadow { -webkit-box-shadow: 0 40px 50px 0 rgba(79, 35, 35, .2); box-shadow: 0 40px 50px 0 rgba(79, 35, 35, .2) } .banner.banner-three.banner-three .circle-shape { left: -50% } .banner.banner-three.banner-three .shape { right: -40% } .banner.banner-three .banner-content .banner-title { font-size: 45px; line-height: 55px } .banner.banner-four { height: 740px; padding-top: 200px } .banner.banner-four .banner-content .banner-title { font-size: 40px; line-height: 55px } .banner.banner-four .banner-content p { font-size: 16px } .banner.banner-four .banner-content p br { display: none } .banner.banner-four .promo-mockup { margin-top: -30px } } @media (max-width: 768px) { .banner.banner-one { height: 950px } .banner.banner-one .banner-content-wrap { -webkit-transform: translateY(20%); -ms-transform: translateY(20%); transform: translateY(20%) } .banner.banner-one .promo-mockup { margin-left: -45px } .banner.banner-one .promo-mockup img { max-width: 100% } .banner.banner-two { height: 840px } .banner.banner-two .vector-bg { right: -120% } .banner.banner-two .banner-content-wrap { -webkit-transform: translateY(18%); -ms-transform: translateY(18%); transform: translateY(18%) } .banner.banner-two .animate-promo-mockup { width: 360px; height: 370px; margin-left: 0 } .banner.banner-two .animate-promo-mockup img:nth-child(1) { left: 65px } .banner.banner-two .animate-promo-mockup img:nth-child(2) { width: 65px } .banner.banner-two .animate-promo-mockup img:nth-child(3) { right: -100px; width: 50px } .banner.banner-two .animate-promo-mockup img:nth-child(4) { left: 55px; width: 125px; bottom: 30px } .banner.banner-two .animate-promo-mockup img:nth-child(5) { left: 55%; width: 40px } .banner.banner-two .animate-promo-mockup img:nth-child(6) { right: -3px; width: 170px; bottom: 13px } .banner.banner-two .animate-promo-mockup img:nth-child(7) { right: -35px; width: 67px; bottom: 50px } .banner.banner-three { height: 750px } .banner.banner-three .banner-content { margin-bottom: 50px } .banner.banner-three .banner-content .banner-title { font-size: 34px; line-height: 44px } .banner.banner-three .banner-content .description br { display: none } .banner.banner-three .banner-content-wrap-two { padding-top: 130px } .banner.banner-three .circle-shape { left: -85% !important } .banner.banner-three .shape { right: -60% !important } .banner.banner-four { height: auto; padding-top: 12px; } .banner.banner-four .banner-content .banner-title { font-size: 30px; line-height: 45px } .banner.banner-four .banner-content p { font-size: 16px } .banner.banner-four .banner-content p br { display: none } .banner.banner-four .promo-mockup { margin-top: -30px } } @media (max-width: 640px) { .banner.banner-two .vector-bg { left: -45% } .banner.banner-two .vector-bg { left: -52% } .banner.banner-three .circle-shape { left: -95% !important } .banner.banner-three .shape { right: -70% !important } } @media (max-width: 576px) { .banner .banner-content .description { font-size: 16px } .banner.banner-one { height: 840px } .banner.banner-one .promo-mockup { margin-left: 0 } .banner.banner-one .banner-content .banner-title { font-size: 35px; line-height: 45px } .banner.banner-two .vector-bg { left: -50% } .banner.banner-three { height: 780px } .banner.banner-three .circle-shape { left: -130% !important } .banner.banner-three .shape { right: -90% !important } .banner.banner-three .shape-shadow { display: none } .banner.banner-three .promo-mockup img { max-width: 400px } } @media (max-width: 480px) { .banner.banner-two { background-image: linear-gradient(-60deg, #7052fb 0, #8a60fd 100%); background-image: url(../../media/banner/top-shape-mobile.png); background-size: cover; background-position: center } .banner.banner-two .vector-bg { display: none } .banner.banner-one { height: 770px } .banner.banner-one .banner-content-wrap { -webkit-transform: translateY(20%); -ms-transform: translateY(20%); transform: translateY(20%) } .banner.banner-one .promo-mockup img { max-width: 100% } .banner.banner-two { height: 750px } .banner.banner-two .banner-content .banner-btn.color-two { -webkit-box-shadow: none; box-shadow: none } .banner.banner-two .vector-bg { left: -100% } .banner.banner-two .banner-content-wrap { -webkit-transform: translateY(18%); -ms-transform: translateY(18%); transform: translateY(18%) } .banner.banner-two .animate-promo-mockup { width: 300px; height: 325px; margin-left: 0; margin-top: 20px } .banner.banner-two .animate-promo-mockup img:nth-child(1) { left: 30px } .banner.banner-two .animate-promo-mockup img:nth-child(2) { width: 40px } .banner.banner-two .animate-promo-mockup img:nth-child(3) { right: -30px; width: 30px; bottom: 130px } .banner.banner-two .animate-promo-mockup img:nth-child(4) { left: 20px; width: 80px; bottom: 56px } .banner.banner-two .animate-promo-mockup img:nth-child(5) { left: 49%; width: 30px; bottom: 45px } .banner.banner-two .animate-promo-mockup img:nth-child(6) { right: 20px; width: 140px; bottom: 30px } .banner.banner-two .animate-promo-mockup img:nth-child(7) { right: -5px; width: 50px; bottom: 70px } .banner.banner-three { height: auto; padding-bottom: 40px } .banner.banner-three .banner-content .banner-title { font-size: 30px; line-height: 40px } .banner.banner-three .promo-mockup img { max-width: 100% } } @media (max-width: 380px) { .banner .banner-button-container { display: block } .banner .banner-button-container .play-btn { margin-top: 30px } .banner.banner-two .banner-content .banner-btn.color-two { -webkit-box-shadow: none; box-shadow: none } .banner.banner-two { height: 690px } .newsletter-form-banner .newsletter-inner button { padding: 10px 20px } .newsletter-form-banner .newsletter-inner input { padding: 10px 140px 10px 30px } } .section-title { margin-bottom: 55px } .section-title .sub-title { font-size: 16px; text-transform: uppercase; font-weight: 500; color: #fa7070; letter-spacing: 3px } .section-title .title { font-size: 36px; font-weight: 600; line-height: 1.4 } .section-title .title span { color: #fa7070 } .section-title .title-two { font-size: 30px; font-weight: 500; line-height: 44px; max-width: 930px; margin: 0 auto } .section-title .title-two span { color: #fa7070 } .section-title.style-two .title { font-weight: 500 } .section-title.style-two p { font-size: 18px; line-height: 30px; margin-top: 28px } .section-title.dark-title .sub-title, .section-title.dark-title .title { color: #fff } .section-title.color-two .sub-title { color: #7052fb } .section-title.style-three span { font-weight: 300; color: #2b2350 } @media (max-width: 991px) { .section-title { margin-bottom: 50px } .section-title .title { font-size: 32px } .section-title.style-two p { margin-top: 13px } .section-title.style-two p br { display: none } .section-title .title-two { font-size: 26px; line-height: 36px } } @media (max-width: 768px) { .section-title .title { font-size: 28px } .section-title .title br { display: none } } .featured { padding-top: 32px } .pixsass-icon-box-wrapper { margin-top: 30px } .pixsass-icon-box-wrapper.style-one { margin-top: 16px } .pixsass-icon-box-wrapper.style-one .iapp-icon-box-icon { margin-bottom: 40px; height: 150px } .pixsass-icon-box-wrapper.style-one .pixsass-icon-box-content .pixsass-icon-box-title { font-size: 22px; font-weight: 500; line-height: 30px; margin-bottom: 0 } .pixsass-icon-box-wrapper.style-one .pixsass-icon-box-content .pixsass-icon-box-title a { color: #2b2350 } .pixsass-icon-box-wrapper.style-one .pixsass-icon-box-content .pixsass-icon-box-title a:hover { color: #fa7070 } .pixsass-icon-box-wrapper .iapp-icon-box-icon { margin-bottom: 32px } .pixsass-icon-box-wrapper .pixsass-icon-box-content .pixsass-icon-box-title { font-size: 20px; font-weight: 600; line-height: 30px; margin-bottom: 20px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .pixsass-icon-box-wrapper .pixsass-icon-box-content .pixsass-icon-box-title a { color: #2b2350 } .pixsass-icon-box-wrapper .pixsass-icon-box-content .pixsass-icon-box-title a:hover { color: #fa7070 } .pixsass-icon-box-wrapper .pixsass-icon-box-content p { margin: 0 } .pixsass-icon-box-wrapper.style-two { margin-bottom: 30px } .pixsass-icon-box-wrapper.style-two .pixsass-icon-box-content .pixsass-icon-box-title { font-size: 20px; font-weight: 600; line-height: 30px; margin-bottom: 10px } .pixsass-icon-box-wrapper.style-two .pixsass-icon-box-content .pixsass-icon-box-title a { color: #2b2350 } .pixsass-icon-box-wrapper.style-two .pixsass-icon-box-content .pixsass-icon-box-title a:hover { color: #fa7070 } .pixsass-icon-box-wrapper.style-three { border-radius: 6px; background-color: #fff; -webkit-box-shadow: 0 40px 60px 0 rgba(79, 35, 35, .14); box-shadow: 0 40px 60px 0 rgba(79, 35, 35, .14); padding: 40px 50px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; position: relative; z-index: 22; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .pixsass-icon-box-wrapper.style-three .iapp-icon-box-icon { width: 70px; margin-right: 30px; margin-bottom: 0 } .pixsass-icon-box-wrapper.style-three .pixsass-icon-box-content { -webkit-box-flex: 1; -ms-flex: 1; flex: 1 } .pixsass-icon-box-wrapper.style-three .pixsass-icon-box-content p { margin: 0 } .pixsass-icon-box-wrapper.style-four { border-radius: 4px; border: 1px solid #ece4e4; padding: 60px 40px 32px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; position: relative; overflow: hidden } .pixsass-icon-box-wrapper.style-four .layer { position: absolute; top: -100%; left: 0; width: 100%; z-index: -1; -webkit-transition: all .6s ease-in-out; -o-transition: all .6s ease-in-out; transition: all .6s ease-in-out } .pixsass-icon-box-wrapper.style-four .iapp-icon-box-icon { margin-bottom: 44px; height: 80px } .pixsass-icon-box-wrapper.style-four .pixsass-icon-box-content .pixsass-icon-box-title { font-size: 22px; font-weight: 500; margin-bottom: 25px } .pixsass-icon-box-wrapper.style-four .pixsass-icon-box-content .pixsass-icon-box-title a { color: #2b2350 } .pixsass-icon-box-wrapper.style-four .pixsass-icon-box-content .pixsass-icon-box-title a:hover { color: #fa7070 } .pixsass-icon-box-wrapper.style-four .pixsass-icon-box-content p { margin-bottom: 22px } .pixsass-icon-box-wrapper.style-four .pixsass-icon-box-content .more-btn { font-size: 35px; color: #bdb4b4; display: inline-block } .pixsass-icon-box-wrapper.style-four .pixsass-icon-box-content .more-btn:hover { color: #fa7070 } .pixsass-icon-box-wrapper.style-four:hover { -webkit-box-shadow: 0 40px 60px 0 rgba(79, 35, 35, .14); box-shadow: 0 40px 60px 0 rgba(79, 35, 35, .14) } .pixsass-icon-box-wrapper.style-four:hover .layer { top: 0 } .pixsass-icon-box-wrapper.style-five { -webkit-box-shadow: 0 30px 60px 0 rgba(52, 27, 159, .1); box-shadow: 0 8px 27px 0 rgb(52 27 159 / 10%); padding: 45px 40px; background: #fff } .pixsass-icon-box-wrapper.style-five .saaspik-icon-box-icon { height: 60px; width: 60px; line-height: 52px; text-align: center; border: 2px solid #404040; color: #7052fb; font-size: 22px; border-radius: 50%; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; margin-bottom: 42px } .pixsass-icon-box-wrapper.style-five .pixsass-icon-box-content .pixsass-icon-box-title { margin-bottom: 15px } .pixsass-icon-box-wrapper.style-five .pixsass-icon-box-content .pixsass-icon-box-title a:hover { color: #7052fb } .pixsass-icon-box-wrapper.style-five .pixsass-icon-box-content p { margin-bottom: 5px } .pixsass-icon-box-wrapper.style-five .pixsass-icon-box-content .more-btn { color: #2b2350; font-weight: 500 } .pixsass-icon-box-wrapper.style-five .pixsass-icon-box-content .more-btn i { vertical-align: middle; display: inline-block; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .pixsass-icon-box-wrapper.style-five .pixsass-icon-box-content .more-btn:hover { color: #7052fb } .pixsass-icon-box-wrapper.style-five .pixsass-icon-box-content .more-btn:hover i { padding-left: 3px; color: #7052fb } .pixsass-icon-box-wrapper.style-five:hover .saaspik-icon-box-icon { -webkit-box-shadow: 0 20px 30px 0 rgba(75, 42, 222, .2); box-shadow: 0 20px 30px 0 rgba(75, 42, 222, .2); background: #f3c703; color: #fff; border-color: #f3c703; } .pixsass-icon-box-wrapper.style-six { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 40px; -ms-flex-wrap: wrap; flex-wrap: wrap } .pixsass-icon-box-wrapper.style-six .saaspik-icon-box-icon { text-align: center; -webkit-box-shadow: 0 30px 40px 0 rgba(52, 27, 159, 0); box-shadow: 0 30px 40px 0 rgba(52, 27, 159, .1); border-radius: 4px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; margin-bottom: 0; margin-right: 30px; background: #fff0 } .pixsass-icon-box-wrapper.style-six .pixsass-icon-box-content { -webkit-box-flex: 1; -ms-flex: 1; flex: 1 } .pixsass-icon-box-wrapper.style-six .pixsass-icon-box-content .pixsass-icon-box-title { margin-bottom: 15px; font-weight: 400; margin: 0 } .pixsass-icon-box-wrapper.style-six .pixsass-icon-box-content .pixsass-icon-box-title a:hover { color: #7052fb } .pixsass-icon-box-wrapper.style-six .pixsass-icon-box-content p { margin-bottom: 35px } .pixsass-icon-box-wrapper.style-six .pixsass-icon-box-content .more-btn { color: #2b2350; font-weight: 500 } .pixsass-icon-box-wrapper.style-six .pixsass-icon-box-content .more-btn i { vertical-align: middle; display: inline-block; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .pixsass-icon-box-wrapper.style-six .pixsass-icon-box-content .more-btn:hover { color: #7052fb } .pixsass-icon-box-wrapper.style-six .pixsass-icon-box-content .more-btn:hover i { padding-left: 3px; color: #7052fb } .featured-six { padding: 110px 0 104px } .featured-five { padding: 20px 0 60px } .featured-two-service .pixsass-icon-box-wrapper.style-two .pixsass-icon-box-content .pixsass-icon-box-title a { color: #2b2350 } .featured-two-service .pixsass-icon-box-wrapper.style-two .pixsass-icon-box-content .pixsass-icon-box-title a:hover { color: #fa7070 } .featured-two { padding: 126px 0 28px } .featured-two .section-title { margin-bottom: 80px } .featured-three { padding: 45px 0 120px; background: #fdf8f8; overflow: hidden } .featured-three .scroll-circle { z-index: 1; left: -120px; bottom: -67% } .featured-four { padding-top: 400px } .featured-two-same { padding-top: 144px; padding-bottom: 27px } .featured-two-same .section-title { margin-bottom: 80px } .featured-two-same .pixsass-icon-box-wrapper.style-two .pixsass-icon-box-content .pixsass-icon-box-title a { color: #2b2350 } .featured-two-same .pixsass-icon-box-wrapper.style-two .pixsass-icon-box-content .pixsass-icon-box-title a:hover { color: #7052fb } .featured-two-same .scroll-circle { bottom: auto; top: -50% } .featured-four-ab { padding-top: 146px } .featured-homethree { padding-top: 228px; padding-bottom: 27px } .featured-homethree .section-title { margin-bottom: 80px !important } .down-bg { position: absolute; width: 100%; left: 0; bottom: 0; z-index: -1 } @media (max-width: 1200px) { .featured-homethree { padding-top: 118px } .featured-six { padding-top: 50px } } @media (max-width: 991px) { .featured-two { padding: 85px 0 35px } .featured-two-same { padding-top: 74px; padding-bottom: 44px } .featured { padding-top: 75px } .featured-three { padding: 76px 0 80px } .featured-homethree { padding-top: 0 } .pixsass-icon-box-wrapper.style-two { margin-bottom: 40px; text-align: center } .featured-four { padding-top: 185px; padding-bottom: 40px } .featured-homethree { padding-bottom: 34px } .featured-four-ab { padding-top: 76px } .featured-two-service { padding: 55px 0 43px !important } .featured-two-same .scroll-circle { left: -20% } .featured-three .scroll-circle { z-index: 1; left: -15%; bottom: 20% } .featured-three .scroll-circle img { max-width: 450px } .pixsass-icon-box-wrapper.style-one { text-align: center } .pixsass-icon-box-wrapper .pixsass-icon-box-content .pixsass-icon-box-title a br { display: none } .featured-six { padding-top: 0; padding-bottom: 38px } } @media (max-width: 768px) { .pixsass-icon-box-wrapper .pixsass-icon-box-content p br { display: none } .featured-four { padding-top: 250px } .featured-two-same .scroll-circle { left: -30% } .featured-three .scroll-circle { z-index: 1; left: -15%; bottom: 20% } .featured-three .scroll-circle img { max-width: 330px } .feature-image-wrapper { margin-bottom: 40px } } @media (max-width: 767px) { .featured-four { padding-top: 137px } } @media (max-width: 576px) { .featured-four { padding-top: 76px } } @media (max-width: 480px) { .featured-two-same .scroll-circle { left: -70% } .pixsass-icon-box-wrapper.style-three { text-align: center; display: block; padding: 0 0 15px; z-index: 8 } .pixsass-icon-box-wrapper.style-three .iapp-icon-box-icon { margin: 0 auto 15px; width: 100% } } .editor-design { padding-top: 40px; position: relative; padding-bottom: 40px } .editor-design-two { padding-top: 210px; padding-bottom: 50px } .editure-feature-image { position: absolute; left: 75px; top: 30% } .editure-feature-image .image-one { max-width: 720px } .editure-feature-image .image-two { top: 50%; position: absolute; right: -150px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%) } .editor-content { padding-left: 105px; padding-top: 50px } .editor-content .section-title.style-two { margin-bottom: 35px } .editor-content .section-title.style-two p { color: #fa7070; margin-bottom: 0 } .editor-content .section-title.style-two .title { margin-bottom: 20px } .editor-content .section-title.style-two.color-two { margin-bottom: 35px } .editor-content .section-title.style-two.color-two p { color: #7052fb; margin: 0 } .editor-content .description p { margin-bottom: 46px } .shape-bg { position: absolute; top: -188px; left: -10px; z-index: -1 } .animaated-elements { position: relative; height: 540px; width: 570px } .animaated-elements .elm-mass, .animaated-elements img { position: absolute } .animaated-elements .elm-clock { left: 20px } .animaated-elements .elm-man { left: 127px; bottom: 39px } .animaated-elements .elm-table { bottom: 40px; left: 45px; z-index: 2 } .animaated-elements .elm-sm-vase { left: 70px; bottom: 254px } .animaated-elements .elm-vase { bottom: 40px; right: -27px; z-index: 1 } .animaated-elements .elm-mass { right: 103px; top: 92px; width: 135px } .animaated-elements .elm-mass .mass-img { -webkit-animation: jumping 1.6s infinite; animation: jumping 1.6s infinite } .animaated-elements-two { position: relative; height: 560px; width: 570px; margin-top: 87px; z-index: 22 } .animaated-elements-two .elm-two { left: 20px; bottom: 85px } .animaated-elements-two .elm-three { top: -115px; right: 40px; -webkit-animation: jump 2s infinite; animation: jump 2s infinite } .animaated-elements-two .elm-four { right: 192px; bottom: 38px } .animaated-elements-two img { position: absolute } .genera-informes-content { position: relative; z-index: 22 } @media (max-width: 1600px) { .editure-feature-image .image-one { max-width: 600px } .editure-feature-image .image-two { margin-left: -124px; max-width: 220px } .editor-design { padding-bottom: 26px } .editor-design .shape-bg { max-width: 1200px } } @media (max-width: 1440px) { .editure-feature-image .image-one { max-width: 550px } .editure-feature-image .image-two { right: -130px; max-width: 200px } .editor-content { padding-top: 0 } } @media (max-width: 1280px) { .editor-content { padding-left: 0 } .editure-feature-image { left: 20px } .editure-feature-image .image-one { max-width: 480px } .editure-feature-image .image-two { margin-left: -100px; max-width: 180px } .editor-content { padding-top: 0 } .editor-design { padding-top: 70px; padding-bottom: 100px } .editor-design .shape-bg { max-width: 1100px } .editure-feature-image .image-two { right: -120px } } @media (min-width: 992px) and (max-width:1200px) { .editor-design-two { padding-top: 160px } .editor-design { padding-top: 100px; padding-bottom: 0 } .editor-content { padding-left: 50px } .animaated-elements-two { left: -90px } .genera-informes-content { padding-right: 50px } .animaated-elements { width: 470px; height: 440px } .animaated-elements .elm-clock { width: 120px } .animaated-elements .elm-table { width: 380px; bottom: 25px } .animaated-elements .elm-man { width: 225px } .animaated-elements .elm-sm-vase { width: 35px; bottom: 205px } .animaated-elements .elm-vase { width: 120px; bottom: 27px } .animaated-elements .elm-mass { right: 60px } .animaated-elements .elm-mass img { width: 110px } .animaated-elements-two { width: 470px; height: 460px; left: 0 } .animaated-elements-two .elm-two { bottom: 65px; width: 120px; left: 25px } .animaated-elements-two .elm-three { width: 180px; top: -70px } .animaated-elements-two .elm-four { width: 160px; right: 160px } } @media (max-width: 1024px) { .editor-content { padding-left: 100px } } @media (max-width: 991px) { .editor-design { padding-top: 62px; padding-bottom: 70px } .editor-design-two { padding-top: 90px; padding-bottom: 30px } .editure-feature-image { position: relative; left: 0 } .editure-feature-image .image-two { position: absolute; top: 50%; right: -82px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%) } .genera-informes-content { padding-bottom: 30px } .editor-content { padding-left: 0; padding-top: 17px } .editor-content .section-title.style-two.color-two { margin-bottom: 20px } .editor-content .section-title.style-two .title { margin-bottom: 15px } } @media (max-width: 768px) { .animaated-elements { left: -50px } .animaated-elements { width: 470px; height: 440px } .animaated-elements .elm-clock { width: 120px } .animaated-elements .elm-table { width: 380px; bottom: 25px } .animaated-elements .elm-man { width: 225px } .animaated-elements .elm-sm-vase { width: 35px; bottom: 205px } .animaated-elements .elm-vase { width: 120px; bottom: 27px } .animaated-elements .elm-mass { right: 60px } .animaated-elements .elm-mass img { width: 110px } .animaated-elements-two { width: 470px; height: 460px; margin-top: 35px } .animaated-elements-two .elm-two { bottom: 65px; width: 120px; left: 25px } .animaated-elements-two .elm-three { width: 180px; top: -70px } .animaated-elements-two .elm-four { width: 160px; right: 160px } } @media (max-width: 576px) { .editure-feature-image { position: relative; left: 0; margin-bottom: 30px } .editure-feature-image .image-one { max-width: 400px } .editure-feature-image .image-two { right: -80px } .editor-content { padding-left: 0 } .animaated-elements { width: 350px; height: 340px; left: 0 } .animaated-elements .elm-clock { width: 80px } .animaated-elements .elm-table { width: 280px; bottom: 35px } .animaated-elements .elm-man { width: 175px } .animaated-elements .elm-sm-vase { width: 25px; bottom: 169px } .animaated-elements .elm-vase { width: 85px; bottom: 35px } .animaated-elements .elm-mass { right: -20px; top: 70px } .animaated-elements .elm-mass img { width: 70px } .animaated-elements-two { width: 330px; height: 340px } .animaated-elements-two .elm-two { bottom: 65px; width: 70px; left: 25px } .animaated-elements-two .elm-three { width: 120px; top: -25px } .animaated-elements-two .elm-four { width: 105px; right: 120px } .genera-informes-two .scroll-circle { left: -70% !important } } @media (max-width: 480px) { .editure-feature-image .image-one { max-width: 300px } .editure-feature-image .image-two { right: 0 } .editure-feature-image .image-two-inner img { max-width: 150px } .genera-informes-two .scroll-circle { left: -100% !important } } .genera-informes { padding-top: 197px; padding-bottom: 222px; overflow: hidden } .genera-informes .section-title { margin-bottom: 30px } .genera-informes .list-items { margin-bottom: 50px } .genera-informes .shape-bg { left: auto; top: 0; right: 0 } .shape-bg0 { right: auto; top: 0; left: 0; position: absolute; z-index: -1 } .genera-informes-two { padding-top: 105px } .genera-informes-two .section-title { margin-top: 115px; margin-bottom: 36px } .genera-informes-two .list-items { margin-bottom: 50px } .informes-feature-image { position: absolute; right: 75px; top: 143px } .informes-feature-image .image-one { max-width: 720px } .informes-feature-image .image-two { position: absolute; right: 150px; bottom: -140px; max-width: 720px } .genera-informes-two .scroll-circle { top: 60px } .genera-informes-three { padding-top: 242px; position: relative } .genera-informes-three .shape-bg { left: auto; right: 0; top: 40px } .genera-informes-three .list-items { margin-bottom: 50px } .genera-informes-three .section-title { margin-bottom: 35px } @media (max-width: 1680px) { .informes-feature-image { position: absolute; right: 50px; top: 125px } .informes-feature-image .image-one { max-width: 620px } .informes-feature-image .image-two { position: absolute; right: 130px; bottom: -140px } .informes-feature-image .image-two img { max-width: 620px !important } } @media (max-width: 1600px) { .genera-informes { padding-bottom: 75px } .genera-informes .shape-bg { max-width: 500px } .informes-feature-image { top: 130px } .editor-design .shape-bg0 { max-width: 500px } } @media (max-width: 1440px) { .informes-feature-image { position: absolute; right: 25px } .informes-feature-image .image-one { max-width: 550px } .informes-feature-image .image-two { position: absolute; right: 100px; bottom: -140px } .informes-feature-image .image-two img { max-width: 550px !important } } @media (max-width: 1280px) { .genera-informes { padding-bottom: 120px } .genera-informes .shape-bg { max-width: 400px } .informes-feature-image { top: 70px } } @media (max-width: 1200px) { .informes-feature-image { position: absolute; right: 25px; top: 100px } .informes-feature-image .image-one { max-width: 450px } .informes-feature-image .image-two { position: absolute; right: 70px; bottom: -140px } .informes-feature-image .image-two img { max-width: 450px !important } .genera-informes { padding-top: 140px } .genera-informes .shape-bg { right: -180px } .genera-informes-three { padding-top: 180px } .genera-informes-three .shape-bg { width: 500px } } @media (max-width: 1024px) { .informes-feature-image { position: absolute; right: 25px; top: 75px } .informes-feature-image .image-one { max-width: 450px } .informes-feature-image .image-two { position: absolute; right: 70px; bottom: -140px; max-width: 450px } .genera-informes .shape-bg { right: -180px } } @media (max-width: 991px) { .genera-informes { padding-top: 0; overflow: hidden; padding-bottom: 80px } .genera-informes .section-title { margin-bottom: 20px; padding-top: 0 } .genera-informes .list-items { margin-bottom: 40px } .genera-informes .informes-feature-image { position: relative; right: 0; top: 0; margin-top: 0; margin-bottom: 120px; padding-top: 0 } .genera-informes .informes-feature-image .image-one { max-width: 450px } .genera-informes .informes-feature-image .image-two { position: absolute; right: -70px; bottom: -110px; max-width: 450px } .informes-feature-image .image-two { bottom: -100px } .genera-informes-two { padding-top: 46px } .genera-informes-two .section-title { margin-top: 71px; margin-bottom: 25px } .genera-informes-two .list-items { margin-bottom: 40px } .genera-informes-three { padding-top: 0 } .genera-informes-three .section-title { margin-top: 96px } .genera-informes-three .section-title.style-two { margin-top: 100px } .genera-informes-three .informes-feature-image { position: relative; top: 0; right: 0 } .genera-informes-three .informes-feature-image .image-two { right: auto; left: 70px } .genera-informes .shape-bg { right: -180px } .genera-informes-two .scroll-circle { left: -40% } } @media (max-width: 768px) { .informes-feature-image .image-two { right: -70px } } @media (max-width: 576px) { .informes-feature-image .image-two { left: 0; right: auto } .informes-feature-image .image-one img, .informes-feature-image .image-two img { max-width: 100% !important } } .revolutionize { padding: 116px 0 30px } .revolutionize-two { padding: 65px 0 30px } .revolutionize-two .bg-angle { background-image: -o-linear-gradient(150deg, #7052fb 0, #8a60fd 100%); background-image: linear-gradient(-60deg, #7052fb 0, #8a60fd 100%) } .bg-angle { background-image: -o-linear-gradient(30deg, #fa9770 0, #fa7070 100%); background-image: linear-gradient(60deg, #fa9770 0, #fa7070 100%); background-image: linear-gradient(60deg, #f4f7fb 0, #f4f7fb 100%); max-height: 700px; height: 100%; width: 100%; position: absolute; left: 0; top: 0; z-index: -1; overflow: hidden } .bg-angle:after { content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 0; border-top: 200px solid transparent; border-left: 1900px solid #fff; border-bottom: 0 solid transparent } #pix-tabs-nav { text-align: center; list-style: none; margin-bottom: 38px; padding: 0 } #pix-tabs-nav li { display: inline-block } #pix-tabs-nav li:not(:last-child) { margin-right: 20px } #pix-tabs-nav li a { color: #f1e8e8; font-weight: 500; cursor: pointer; padding: 11px 27px; border-radius: 30px; display: inline-block; margin-bottom: 20px } #pix-tabs-nav li a:hover { background: #fff; color: #fa7070; -webkit-box-shadow: 0 20px 30px 0 rgba(176, 70, 70, .3); box-shadow: 0 20px 30px 0 rgba(176, 70, 70, .3) } #pix-tabs-nav li.active a { background: #fff; color: #fa7070; -webkit-box-shadow: 0 20px 30px 0 rgba(176, 70, 70, .3); box-shadow: 0 20px 30px 0 rgba(176, 70, 70, .3) } #pix-tabs-nav.pix-tab-two li a:hover { color: #7052fb; -webkit-box-shadow: 0 20px 30px 0 rgba(90, 70, 176, .3); box-shadow: 0 20px 30px 0 rgba(90, 70, 176, .3) } #pix-tabs-nav.pix-tab-two li.active a { color: #7052fb; -webkit-box-shadow: 0 20px 30px 0 rgba(90, 70, 176, .3); box-shadow: 0 20px 30px 0 rgba(90, 70, 176, .3) } #pix-tabs-content .content { text-align: center; position: relative } #pix-tabs-content .content img { background-color: #e1d5d5; -webkit-box-shadow: 0 60px 100px 0 rgba(79, 35, 35, .2); box-shadow: 0 60px 100px 0 rgba(79, 35, 35, .2); border-radius: 10px } #pix-tabs-content .content .shape-shadow { border-radius: 10px; background-color: #fff; opacity: .4; -webkit-box-shadow: 0 60px 100px 0 rgba(79, 35, 35, .2); box-shadow: 0 60px 100px 0 rgba(79, 35, 35, .2); height: 100px; max-width: 73%; position: absolute; bottom: -40px; width: 100%; z-index: -1; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%) } #pix-tabs-content .content.color-two img { -webkit-box-shadow: 0 60px 100px 0 rgba(43, 35, 79, .2); box-shadow: 0 60px 100px 0 rgba(43, 35, 79, .2) } #pix-tabs-content .content.color-two .shape-shadow { -webkit-box-shadow: 0 60px 100px 0 rgba(43, 35, 79, .2); box-shadow: 0 60px 100px 0 rgba(43, 35, 79, .2) } @media (max-width: 991px) { .revolutionize, .revolutionize-two { padding: 76px 0 30px } #pix-tabs-content .content.color-two img { -webkit-box-shadow: 0 40px 50px 0 rgba(43, 35, 79, .2); box-shadow: 0 40px 50px 0 rgba(43, 35, 79, .2) } #pix-tabs-content .content.color-two .shape-shadow { -webkit-box-shadow: 0 40px 50px 0 rgba(43, 35, 79, .2); box-shadow: 0 40px 50px 0 rgba(43, 35, 79, .2) } } @media (max-width: 768px) { #pix-tabs-content .content img { -webkit-box-shadow: 0 40px 50px 0 rgba(79, 35, 35, .2); box-shadow: 0 40px 50px 0 rgba(79, 35, 35, .2) } #pix-tabs-content .content .shape-shadow { bottom: -30px; -webkit-box-shadow: 0 40px 50px 0 rgba(79, 35, 35, .2); box-shadow: 0 40px 50px 0 rgba(79, 35, 35, .2) } #pix-tabs-nav li:not(:last-child) { margin-right: 5px } } @media (max-width: 576px) { #pix-tabs-nav { margin: 0 } #pix-tabs-nav li { margin-right: 3px } #pix-tabs-nav li a { font-size: 14px; padding: 6px 22px } } @media (max-width: 420px) { #pix-tabs-nav { margin-bottom: 20px } #pix-tabs-nav li a { margin-bottom: 10px } #pix-tabs-nav li:not(:last-child) { margin-right: 0 } } .swiper-button-next, .swiper-button-prev, .swiper-container-rtl .swiper-button-next, .swiper-container-rtl .swiper-button-prev { background-image: none } .testimonials { background: #fdf8f8; padding: 116px 0 0; overflow: hidden } .testimonials .scroll-circle { bottom: 35%; right: -133px } .testimonial-wrapper { padding: 0 100px 160px; position: relative; z-index: 22 } .testimonial-wrapper .shape-shadow { border-radius: 10px; background-color: #fff; opacity: .4; -webkit-box-shadow: 0 60px 100px 0 rgba(102, 74, 74, .2); box-shadow: 0 60px 100px 0 rgba(102, 74, 74, .2); height: 100px; max-width: 54%; position: absolute; bottom: 120px; width: 100%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%) } .testimonial-wrapper .slider-nav .swiper-button-next, .testimonial-wrapper .slider-nav .swiper-button-prev { color: #bdb4b4; font-size: 36px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; outline: 0 } .testimonial-wrapper .slider-nav .swiper-button-next:hover, .testimonial-wrapper .slider-nav .swiper-button-prev:hover { color: #fa7070 } .testimonial-wrapper .slider-nav .swiper-button-next { right: 20px } .testimonial-wrapper .slider-nav .swiper-button-prev { left: 20px } #testimonial { border-radius: 10px; max-width: 770px; margin: 0 auto; position: relative; -webkit-box-shadow: 0 60px 100px 0 rgba(79, 35, 35, .1); box-shadow: 0 60px 100px 0 rgba(79, 35, 35, .1); background: #fff; width: 100% } #testimonial .testimonial { text-align: center; margin: 0 auto; padding: 60px; position: relative } #testimonial .testimonial .testimonial-content { max-width: 630px; margin: 0 auto 30px } #testimonial .testimonial .testimonial-content p { color: #656177; font-size: 20px; margin: 0; line-height: 38px } #testimonial .testimonial .single-bio-thumb { max-width: 80px; margin: 0 auto 41px; -webkit-box-shadow: 0 20px 30px 0 rgba(79, 35, 35, .2); box-shadow: 0 20px 30px 0 rgba(79, 35, 35, .2); border-radius: 50% } #testimonial .testimonial .single-bio-thumb img { border-radius: 50% } #testimonial .testimonial .bio-info .name { font-size: 20px; line-height: 32px; margin: 0 } .testimonials-two { position: relative; overflow: hidden } .testimonials-two .section-title { margin-bottom: 50px } .testimonials-two .animate-shape { position: absolute; right: -9%; top: -37% } #testimonial-wrapper { position: relative; z-index: 2 } #testimonial-wrapper .slider-nav .swiper-button-next, #testimonial-wrapper .slider-nav .swiper-button-prev { outline: 0 } #testimonial-wrapper .slider-nav .swiper-button-next i, #testimonial-wrapper .slider-nav .swiper-button-prev i { font-size: 32px } #testimonial-wrapper .slider-nav .swiper-button-next:hover, #testimonial-wrapper .slider-nav .swiper-button-prev:hover { color: #7052fb } #testimonial-wrapper .slider-nav .swiper-button-next { right: -60px } #testimonial-wrapper .slider-nav .swiper-button-prev { left: -70px } .testimonials-two, .testimonials-two-about { padding: 116px 0 60px } .testimonials-two .swiper-container, .testimonials-two-about .swiper-container { padding: 0 20px 10px } .testimonials-two { background: #f8f7fc } .testimonial-two .testi-content-inner { overflow: hidden; position: relative; background: #fff; -webkit-box-shadow: 0 30px 20px 0 rgba(43, 35, 79, .05); box-shadow: 0 30px 20px 0 rgba(43, 35, 79, .05); border-radius: 10px; padding: 25px; min-height: 235px } .testimonial-two .testimonial-bio { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 10px } .testimonial-two .testimonial-bio .avatar { height: 60px; width: 60px; border-radius: 50%; margin-right: 25px } .testimonial-two .testimonial-bio .avatar img { border-radius: 50%; max-width: 52px } .testimonial-two .testimonial-bio .bio-info .name { font-size: 20px; font-weight: 600; margin-top: 0; margin-bottom: 5px } .testimonial-two .testimonial-content { margin-bottom: 20px } .testimonial-two .testimonial-content p { font-size: 16px; line-height: 22px; margin: 0; margin-top: 10px } .testimonial-two .shape-shadow { border-radius: 10px; background-color: #fff; opacity: .4; -webkit-box-shadow: 0 20px 50px 0 rgba(102, 74, 74, .2); box-shadow: 0 20px 50px 0 rgba(102, 74, 74, .2); height: 100px; max-width: 81%; position: absolute; bottom: -40px; width: 100%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); z-index: -1 } .testimonial-two .quote { position: absolute; right: 60px } .rating { margin: 0; padding: 0; list-style: none; margin-bottom: 5px } .rating li { display: block; font-size: 15px; color: #412ba2; text-align: left; line-height: 25px; font-weight: 500; padding: 8px 10px; padding-bottom: 0 } #testimonial-wrapper-three { max-width: 1060px; margin: 0 auto; position: relative } #testimonial-wrapper-three .quote { position: absolute; bottom: 80px; right: 80px; z-index: 22 } #testimonial-wrapper-three .swiper-container { padding: 0 45px 80px } #testimonial-wrapper-three .slider-nav { width: 90px; top: auto; bottom: 100px; left: 50%; height: 40px } #testimonial-wrapper-three .slider-nav .swiper-button-prev { height: 25px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; outline: 0 } #testimonial-wrapper-three .slider-nav .swiper-button-prev .arrow { margin-top: 12px; width: 25px; height: 2px; background: #bdb4b4; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } #testimonial-wrapper-three .slider-nav .swiper-button-prev .arrow:after { content: ''; position: absolute; width: 15px; height: 2px; top: 7px; left: -2px; background-color: #bdb4b4; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } #testimonial-wrapper-three .slider-nav .swiper-button-prev .arrow:before { content: ''; position: absolute; width: 15px; height: 2px; top: 17px; left: -2px; background-color: #bdb4b4; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } #testimonial-wrapper-three .slider-nav .swiper-button-prev:hover { width: 40px; left: -15px } #testimonial-wrapper-three .slider-nav .swiper-button-prev:hover .arrow { width: 40px; background: #fa7070 } #testimonial-wrapper-three .slider-nav .swiper-button-prev:hover .arrow:after, #testimonial-wrapper-three .slider-nav .swiper-button-prev:hover .arrow:before { background: #fa7070 } #testimonial-wrapper-three .slider-nav .swiper-button-next { height: 25px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } #testimonial-wrapper-three .slider-nav .swiper-button-next .arrow { margin-top: 12px; width: 25px; height: 2px; background: #bdb4b4; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } #testimonial-wrapper-three .slider-nav .swiper-button-next .arrow:after { content: ''; position: absolute; width: 15px; height: 2px; top: 7px; right: -2px; background-color: #bdb4b4; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } #testimonial-wrapper-three .slider-nav .swiper-button-next .arrow:before { content: ''; position: absolute; width: 15px; height: 2px; top: 17px; right: -2px; background-color: #bdb4b4; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } #testimonial-wrapper-three .slider-nav .swiper-button-next:hover { width: 40px; right: -15px } #testimonial-wrapper-three .slider-nav .swiper-button-next:hover .arrow { width: 40px; background: #fa7070 } #testimonial-wrapper-three .slider-nav .swiper-button-next:hover .arrow:after, #testimonial-wrapper-three .slider-nav .swiper-button-next:hover .arrow:before { background: #fa7070 } .testimonials-two-about { background: #fdf8f8; padding: 116px 0 58px; overflow: hidden } .testimonials-two-about .testimonial-two .testi-content-inner { -webkit-box-shadow: 0 30px 20px 0 rgba(79, 35, 35, .1); box-shadow: 0 30px 20px 0 rgba(79, 35, 35, .1) } .testimonials-two-about .testimonial-two .shape-shadow { -webkit-box-shadow: 0 20px 50px 0 rgba(79, 35, 35, .1); box-shadow: 0 20px 50px 0 rgba(79, 35, 35, .1) } .testimonials-two-about .scroll-circle { bottom: 33%; z-index: 1; right: -7% } .testimonials-two-about #testimonial-wrapper .slider-nav .swiper-button-next:hover, .testimonials-two-about #testimonial-wrapper .slider-nav .swiper-button-prev:hover { color: #fa7070 } .testimonial-three { border-radius: 10px; background-color: #fff; -webkit-box-shadow: 0 20px 40px 0 rgba(79, 35, 35, .1); box-shadow: 0 20px 40px 0 rgba(79, 35, 35, .1); display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .testimonial-three .avatar, .testimonial-three .testimonial-content { -webkit-box-flex: 1; -ms-flex: 1; flex: 1 } .testimonial-three .testimonial-content { padding: 0 60px; margin-top: -47px } .testimonial-three .testimonial-content .bio-info { margin-bottom: 30px } .testimonial-three .testimonial-content .bio-info .name { font-size: 20px; font-weight: 600 } .testimonial-three .testimonial-content p { font-size: 18px; line-height: 32px; color: #656177 } .testimonials-three { padding: 95px 0 40px } @media (max-width: 1440px) { .testimonials-two .animate-shape, .testimonials-two .scroll-circle, .testimonials-two-about .animate-shape, .testimonials-two-about .scroll-circle { max-width: 600px } } @media (max-width: 1200px) { #testimonial-wrapper-three .slider-nav { bottom: 70px } } @media (max-width: 1024px) { .testimonial-three .testimonial-content { padding: 0 20px; margin-top: 0 } .testimonial-three .testimonial-content p { font-size: 16px; line-height: 28px } .testimonial-three .testimonial-content .bio-info { margin-bottom: 10px } #testimonial-wrapper-three .slider-nav { bottom: 80px } #testimonial-wrapper-three .quote { width: 80px } .testimonials .scroll-circle { max-width: 500px } .testimonials-two-about .scroll-circle { max-width: 400px } } @media (max-width: 991px) { .testimonials { padding: 76px 0 10px } .testimonials-two .swiper-container, .testimonials-two-about .swiper-container { padding: 0 20px 80px } .testimonials-two, .testimonials-two-about { padding: 76px 0 30px } #testimonial-wrapper .slider-nav .swiper-button-prev { left: -30px } #testimonial-wrapper .slider-nav .swiper-button-next { right: -20px } .testimonials-three { padding: 76px 0 0 } #testimonial-wrapper-three .slider-nav { display: none } .testimonials-two .animate-shape { right: -80% } .testimonial-wrapper { padding: 0 50px 110px } .testimonial-wrapper .slider-nav .swiper-button-prev { left: 0 } .testimonial-wrapper .slider-nav .swiper-button-next { right: 10px } .testimonial-wrapper .shape-shadow { bottom: 80px } #testimonial .testimonial .testimonial-content p { font-size: 18px; line-height: 34px } .testimonial-two .testi-content-inner { padding: 40px 30px } .testimonial-two .shape-shadow { bottom: -30px } } @media (max-width: 768px) { .testimonials { padding: 76px 0 30px } .testimonials-three { padding: 76px 0 30px } #testimonial-wrapper-three .swiper-container { padding: 0 25px 50px } #testimonial .testimonial { padding: 40px } #testimonial .testimonial .testimonial-content p { font-size: 16px; line-height: 30px } .testimonial-wrapper { padding: 0 50px 70px } .testimonial-wrapper .shape-shadow { bottom: 50px } #testimonial-wrapper .slider-nav .swiper-button-prev { left: -30px } #testimonial-wrapper .slider-nav .swiper-button-next { right: -20px } .testimonials-two .animate-shape { right: -100% } .testimonial-three { display: block; padding: 30px } .testimonial-three .avatar { width: 80px; height: 80px; border-radius: 50%; margin: auto 30px; overflow: hidden } .testimonial-three .avatar img { border-radius: 50% } #testimonial-wrapper-three .slider-nav { bottom: 50px; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); display: none } #testimonial-wrapper-three .quote { bottom: 50px } } @media (max-width: 576px) { #testimonial-wrapper .slider-nav .swiper-button-next, #testimonial-wrapper .slider-nav .swiper-button-prev, .testimonial-wrapper .slider-nav .swiper-button-next, .testimonial-wrapper .slider-nav .swiper-button-prev { display: none } .testimonial-wrapper { padding: 0 0 70px } #testimonial .testimonial { padding: 40px 25px } #testimonial-wrapper-three .slider-nav { display: none } #testimonial-wrapper-three .swiper-container { padding: 0 20px 50px !important } #testimonial-wrapper-three .quote { right: 30px } .testimonial-three { padding: 30px 10px } } .pricing { padding: 116px 0 120px } .pricing-two { padding-top: 146px; padding-bottom: 90px } .pricing-two-single { padding-top: 45px; padding-bottom: 25px } .pricing .scroll-circle { bottom: 20% } .pricing-single-one { padding: 116px 0 90px } .pricing-table { border-right: 1px solid #efe7e7; padding: 20px 40px; margin-bottom: 20px } .pricing-table.br-left { border-left: 1px solid #efe7e7 } .pricing-table .pricing-header { text-align: center; padding-bottom: 55px; border-bottom: 1px dashed #efe7e7; margin-bottom: 0 } .pricing-table .pricing-header .price { color: #150650; font-size: 28px; font-weight: 600; line-height: 50px; margin-bottom: 0; text-align: center; text-transform: uppercase } .pricing-table .pricing-header .price-title { font-size: 28px; font-weight: 700; text-transform: uppercase; letter-spacing: 4px } .pricing-table .pricing-header p { margin: 0 } .pricing-table .pricing-header .annual_price { display: none } .pricing-table .pricing-header.change-subs-duration .annual_price { display: block } .pricing-table .pricing-header.change-subs-duration .monthly_price { display: none } .pricing-table .price-feture { padding: 0; list-style: none; padding-bottom: 0; margin-bottom: 0 } .pricing-table .price-feture li { padding: 5px 0; padding-left: 33px; position: relative; color: #000; margin-bottom: 0; border-bottom: 1px solid #efe7e7; font-size: 14px; display: flex; align-items: center } .pricing-table .price-feture li:before { font-family: eleganticons; position: absolute; left: 0 } .pricing-table .price-feture li.have:before { content: "\4e"; color: #363836; padding: 0 5px; display: flex; align-items: center; vertical-align: middle; font-size: 22px } .pricing-table .price-feture li.not:before { content: "\4d"; color: #fa7878; padding: 5px } .pricing-table.color-two .pricing-header .price { color: #8070fa } .pricing-table.color-three .pricing-header .price { color: #22cd1a } .pricing-table .pix-btn { text-align: center; font-weight: 600; padding: 8px 0; width: 200px; text-align: center } .pricing-table.style-two { background: #fff; padding: 0 0 0; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; position: relative; border: 0; border-right: 1px solid #efe7e7; border-bottom: 1px solid #efe7e7 } .pricing-table.style-two.price-two { background: #f8f7fc } .pricing-table.style-two.price-two.featured .trend:before { border-right: 90px solid #7052fb } .pricing-table.style-two .pricing-header { text-align: left; border-color: #b4b2bf; padding-bottom: 0 } .pricing-table.style-two .pricing-header .price-title { letter-spacing: 0; } .pricing-table.style-two:hover { background: #fff; -webkit-box-shadow: 0 40px 80px 0 rgba(43, 35, 79, .14); box-shadow: 0 40px 80px 0 rgba(43, 35, 79, .14) } .pricing-table.featured .trend { position: absolute; top: 0; right: 0 } .pricing-table.featured .trend p { color: #fff; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); margin-left: 22px; margin-bottom: 0; z-index: 22; font-size: 14px; padding-top: 17px; padding-bottom: 15px } .pricing-table.featured .trend:before { content: ''; width: 0; height: 0; border-top: 0 solid transparent; border-bottom: 90px solid transparent; border-right: 90px solid #fa7070; position: absolute; top: 0; right: 0 } .tabed-content .tabs-item { display: none } .pricing-tab { text-align: center; margin-bottom: 80px; position: relative; z-index: 2 } .pricing-tab .tab-btn { cursor: pointer } .pricing-tab .monthly_tab_title { color: #fa7070 } .pricing-tab .pricing-tab-switcher { height: 40px; width: 90px; display: inline-block; border-radius: 50px; position: relative; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; margin: 0 18px; -webkit-transform: translateY(-3px); -ms-transform: translateY(-3px); transform: translateY(-3px); border: 1px solid #dcd2d2; border-radius: 30px; cursor: pointer } .pricing-tab .pricing-tab-switcher:before { content: ''; position: absolute; left: 5px; top: 4px; background: #fa7070; width: 30px; height: 30px; border-radius: 100%; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; -webkit-box-shadow: 0 14px 24px 0 rgba(176, 70, 70, .4); box-shadow: 0 14px 24px 0 rgba(176, 70, 70, .4) } .pricing-tab .pricing-tab-switcher.active:before { left: calc(100% - 35px) } .pricing-tab.seleceted .annual_tab_title { color: #fa7070 } .pricing-tab.seleceted .monthly_tab_title { color: #797687 } .pricing-tab span { vertical-align: middle } .pricing-tab.color-two .pricing-tab-switcher:before { background: #7052fb; -webkit-box-shadow: 0 14px 24px 0 rgba(90, 70, 176, .4); box-shadow: 0 14px 24px 0 rgba(90, 70, 176, .4) } .pricing-tab.color-two .monthly_tab_title { color: #7052fb } .pricing-tab.color-two.seleceted .annual_tab_title { color: #7052fb } .pricing-tab.color-two.seleceted .monthly_tab_title { color: #797687 } .tabs-wrapper { max-width: 830px; margin: 0 auto } .faq-tabs { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 40px; position: relative; z-index: 22 } .faq-tabs li { margin-bottom: 20px } .faq-tabs li:not(:last-child) { margin-right: 20px } .faq-tabs li a { font-size: 14px; font-weight: 600; color: #fa7070; background: rgba(250, 112, 112, .122); padding: 1px 25px; border-radius: 4px; display: inline-block } .faq-tabs li a.active, .faq-tabs li a:hover { background: #fa7070; color: #fff } .faq-tabs li:nth-child(2) a { background: rgba(94, 103, 225, .122); color: #5e67e1 } .faq-tabs li:nth-child(2) a.active, .faq-tabs li:nth-child(2) a:hover { background: #5e67e1; color: #ffff } .faq-tabs li:nth-child(3) a { background: rgba(26, 201, 88, .122); color: #1ac958 } .faq-tabs li:nth-child(3) a.active, .faq-tabs li:nth-child(3) a:hover { background: #1ac958; color: #ffff } .faq-tabs li:nth-child(4) a { background: rgba(251, 43, 224, .122); color: #fb2be0 } .faq-tabs li:nth-child(4) a.active, .faq-tabs li:nth-child(4) a:hover { background: #fb2be0; color: #ffff } .pricing-service { background: #fdf8f8; padding: 116px 0 90px } @media (max-width: 991px) { .pricing { padding: 76px 0 80px } .pricing-service { padding: 76px 0 50px } .pricing-single-one, .pricing-two-single { padding: 76px 0 50px } .pricing-tab { margin-bottom: 40px } .pricing-table { border: 1px solid #efe7e7; padding: 40px; max-width: 500px; margin: 0 auto 30px } .monthly_price img { width: 100% } .faq-tabs { margin-bottom: 30px } .pricing-two { padding-top: 66px; padding-bottom: 50px } .pricing .scroll-circle { width: 250px } } @media (max-width: 768px) { .faq-tabs li { margin-bottom: 10px } } .teams { padding: 116px 0 75px } .teams-single { padding: 116px 0 120px } .teams-two { padding-top: 116px; padding-bottom: 120px } .teams-two .scroll-circle { right: 0; left: auto; top: 25%; z-index: -1 } .team-member { margin-bottom: 70px; max-width: 370px; margin: 0 auto 70px } .team-member .member-avater { position: relative; overflow: hidden; border-radius: 10px } .team-member .member-avater svg { position: absolute; bottom: -100%; left: 0; -webkit-transition: all .6s ease-in-out; -o-transition: all .6s ease-in-out; transition: all .6s ease-in-out } .team-member .member-avater svg.layer-two { -webkit-transition-delay: .3s; -o-transition-delay: .3s; transition-delay: .3s } .team-member .member-avater svg:hover { bottom: 0 } .team-member .member-avater .member-social { margin: 0; padding: 0; list-style: none; position: absolute; bottom: 20px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); z-index: 333; opacity: 0; -webkit-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out; -webkit-transition-delay: .3s; -o-transition-delay: .3s; transition-delay: .3s } .team-member .member-avater .member-social li { display: inline-block; margin-right: 5px } .team-member .member-avater .member-social li a { display: inline-block; height: 46px; width: 46px; line-height: 46px; text-align: center; color: #fff; border: 2px solid #fff; border-radius: 50% } .team-member .member-avater .member-social li a:hover { background: #fff; color: #fa7070; -webkit-box-shadow: 0 20px 20px 0 rgba(79, 35, 35, .2); box-shadow: 0 20px 20px 0 rgba(79, 35, 35, .2) } .team-member .member-avater:hover svg { bottom: 0 } .team-member .member-avater:hover .member-social { bottom: 40px; opacity: 1 } .team-member .team-info { text-align: center; padding-top: 25px } .team-member .team-info .name { font-size: 20px; font-weight: 600 } .team-member .team-info .job { font-size: 16px; color: #797687; font-weight: 400 } @media (max-width: 991px) { .teams, .teams-two { padding: 76px 0 50px } .teams-two { padding: 76px 0 80px } .team-member { margin-bottom: 40px } .section-small { margin: 0 } .teams-single { padding: 76px 0 80px } .teams-single .button-container { margin-top: 10px } .teams-two .scroll-circle { max-width: 320px } } @media (max-width: 768px) { .teams-two .scroll-circle { max-width: 330px } } @media (max-width: 576px) { .scroll-circle { display: none } } .faq-section { padding-top: 115px } .faq-section-two { padding-top: 75px } .faqs { padding: 120px 0 } .card { border: 0; background: 0 0 } .card .card-header { background-color: transparent; border: 0; border-radius: 6px } .card .card-header .btn-link { padding: 0; color: #2b2350; font-size: 20px; font-weight: 600; text-decoration: none } .card .card-body { padding: 0 } .card .card-body p { font-size: 16px; margin-bottom: 25px } .faq { position: relative; z-index: 2 } .faq .card { border: 0; background: 0 0; margin-bottom: 20px; border: 1px solid #efe7e7 } .faq .card .card-header { padding: 0 } .faq .card .card-header h5 { position: relative; margin: 0 } .faq .card .card-header h5:before { content: "\33"; color: #aaa; display: block; position: absolute; font-size: 25px; top: 50%; right: 40px; z-index: 9; font-family: eleganticons; -webkit-transition: all .5s; -o-transition: all .5s; transition: all .5s; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); font-size: 20px } .faq .card .card-header .btn-link { color: #2b2350; font-size: 20px; font-weight: 500; text-decoration: none; white-space: normal; text-align: left; width: 100%; padding: 18px 40px } .faq .card .card-body { padding: 0 40px 40px } .faq .card .card-body p { font-size: 16px; margin-bottom: 0 } .faq .card.active { -webkit-box-shadow: 0 60px 100px 0 rgba(79, 35, 35, .1); box-shadow: 0 60px 100px 0 rgba(79, 35, 35, .1) } .faq .card.active h5:before { content: "\32"; color: #fa7070 } .faq-forms { padding-top: 120px } .faq-forms .section-title { margin-bottom: 50px } .faq-forms { max-width: 830px; margin: 0 auto } @media (max-width: 991px) { #faqs { padding: 80px 0 50px } .faq-two { margin-bottom: 30px } .faq-section-two { padding-top: 65px } .faq-section { padding-top: 75px } .faqs { padding: 80px 0 } .faq-forms { padding-top: 78px } } @media (max-width: 768px) { #faqs { padding: 50px 0 20px } .faq .card .card-header h5:before { right: 20px } .faq .card .card-header .btn-link { padding: 18px 20px } } @media (max-width: 576px) { .faq .card .card-header .btn-link { padding: 18px 30px 18px 20px; font-size: 18px } .faq .card .card-header h5:before { right: 10px } .faq .card .card-body { padding: 5px 20px 25px } } #brand-logo .section-small { margin-top: -90px } .brand-logo { text-align: center } .brand-logo img { opacity: .5; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .brand-logo img:hover { opacity: 1 } .brand-logo-ab { padding-bottom: 120px } .logo-carousel .swiper-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center } @media (max-width: 991px) { #brand-logo { padding-top: 76px } #brand-logo .section-small { margin-top: 0 } #brand-logo .section-small .title { margin-bottom: 50px } .brand-logo-ab { padding-bottom: 75px } .brand-logo-ab .section-small .title { margin-bottom: 60px } } @media (max-width: 768px) { #brand-logo { padding-top: 30px } #brand-logo .section-small { margin-top: 0 } } @media (max-width: 480px) { #brand-logo { padding-top: 0 } #brand-logo .section-small { margin-top: 0 } } .call-to-action { background-image: -o-linear-gradient(350deg, #fa7070 0, #fa9770 100%); background-image: linear-gradient(100deg, #fa7070 0, #fa9770 100%); padding: 111px 0 120px; overflow: hidden } .call-to-action .overlay-bg { position: absolute; right: 0; top: 0 } .call-to-action .action-content { position: relative } .call-to-action .action-content .title { color: #fff; font-size: 50px; line-height: 64px; font-weight: 700; margin-bottom: 28px } .call-to-action .action-content p { color: #fff; margin-bottom: 50px } .call-to-action .action-content .pix-btn { padding: 12px 50px; font-size: 16px; font-weight: 500; position: relative; z-index: 2 } .call-to-action .action-content.style-two .title { font-size: 40px; line-height: 54px; margin: 0 } .call-to-action.action-padding { padding: 172px 0 168px } .call-to-action .scroll-circle { right: 0; top: 40% } .signup-section { padding: 106px 0 111px; padding: 40px 0 40px; background-size: cover; background-position: center center; position: relative; background-image: -webkit-gradient(linear, left bottom, left top, from(#4f29dd), to(#7052fb)); background-image: -o-linear-gradient(bottom, #4f29dd 0, #7052fb 100%); background-image: linear-gradient(0deg, #4f29dd 0, #7052fb 100%); background-image: linear-gradient(0deg, #98cddf 0, #bee1ec 100%) } .signup-section .bg-shape { position: absolute; top: 0; left: 0; width: 100%; height: 100% } .signup-section .bg-shape img { position: absolute } .signup-section .bg-shape .shape-left { top: 0; left: 0 } .signup-section .bg-shape .shape-right { bottom: 0; right: 0 } .signup-heading .title { font-size: 50px; line-height: 64px; color: #fff; font-weight: 700; margin-bottom: 20px } .signup-heading p { COLOR: #fff; margin: 0 } @media (max-width: 1200px) { .call-to-action .action-content.style-two .title { font-size: 36px; line-height: 50px } .signup-heading .title { font-size: 40px; line-height: 50px } } @media (max-width: 991px) { .call-to-action { padding: 71px 0 80px } .call-to-action.action-padding { padding: 74px 0 80px } .call-to-action .action-content .title { font-size: 40px; line-height: 54px } .call-to-action .text-right { text-align: center !important } .call-to-action .action-content.style-two { margin-bottom: 30px; text-align: center } .call-to-action .action-content.style-two .title { font-size: 32px; line-height: 42px } .call-to-action .action-content.style-two .title br { display: none } .call-to-action .scroll-circle { max-width: 400px } } @media (max-width: 768px) { .call-to-action .action-content .title { font-size: 32px; line-height: 42px } .call-to-action .action-content p br { display: none } .call-to-action .scroll-circle { max-width: 300px } .signup-section .button-container { margin-top: 30px } .signup-section .button-container.text-right { text-align: left !important } } .countup { padding: 116px 0 30px } .countup .pix-btn { margin-top: 62px; position: relative; z-index: 2 } .countup .scroll-circle { top: 58% } .countup-wrapper { position: relative; z-index: 22 } .bg-map { height: 100%; width: 100%; position: absolute; z-index: -1; top: 15px; left: 0; background-position: center center; background-repeat: no-repeat } .fun-fact { margin-bottom: 30px } .fun-fact .count, .fun-fact span { font-size: 50px; font-weight: 400; margin: 0; line-height: 1.2; color: #7052fb; display: inline-block } .fun-fact p { font-size: 18px; margin: 0 } .fun-fact.color-two .count, .fun-fact.color-two span { color: #fa7070 } .fun-fact.color-three .count, .fun-fact.color-three span { color: #22cd1a } .fun-fact.color-four .count, .fun-fact.color-four span { color: #f62ee1 } @media (max-width: 991px) { .countup .scroll-circle { left: -30% } .countup { padding: 76px 0 75px } .countup .pix-btn { margin-top: 30px } } @media (max-width: 768px) { .countup .scroll-circle { left: -30% } } @media (max-width: 576px) { .fun-fact { text-align: center } } .newsletter { padding: 146px 0; background-size: cover; background-position: center center; overflow: hidden } .newsletter .scroll-circle { bottom: auto; right: 0; top: 100px } .newsletter-two { background-image: -o-linear-gradient(60deg, #fa7070 0, #fa9770 100%); background-image: linear-gradient(30deg, #fa7070 0, #fa9770 100%); padding: 118px 0 130px; overflow: hidden } .newsletter-two .scroll-circle { bottom: -79%; right: -7%; z-index: 1 } .form-result.alert { display: none; margin-top: 20px; margin-bottom: 0 } .newsletter-content .title { font-size: 40px; line-height: 50px; color: #fff; font-weight: 700 } .newsletter-form { max-width: 570px; margin-left: auto; position: relative; z-index: 22 } .newsletter-form .newsletter-inner { background: #fff; border-radius: 50px; overflow: hidden; padding: 5px; -webkit-box-shadow: 0 20px 30px 0 rgba(79, 35, 35, .15); box-shadow: 0 20px 30px 0 rgba(79, 35, 35, .15) } .newsletter-form .newsletter-inner input { background: 0 0; border: 0; height: 60px; outline: 0; -webkit-box-shadow: none; box-shadow: none; padding: 0 170px 0 40px; margin: 0; width: 100% } .newsletter-form .newsletter-inner input::-webkit-input-placeholder { color: #8e8b9e } .newsletter-form .newsletter-inner input:-ms-input-placeholder { color: #8e8b9e } .newsletter-form .newsletter-inner input::-ms-input-placeholder { color: #8e8b9e } .newsletter-form .newsletter-inner input::placeholder { color: #8e8b9e } .newsletter-form .newsletter-inner .newsletter-submit { background: #7052fb; border-radius: 50px; padding: 0 40px; color: #fff; border: 0; font-weight: 600; position: absolute; top: 5px; right: 5px; height: 60px } .newsletter-form .newsletter-inner .newsletter-submit i { display: none } .newsletter-form .newsletter-inner .newsletter-submit:hover { background: #5b39fa } .newsletter-form .newsletter-inner .newsletter-submit.clicked i { display: block } .newsletter-content-two { position: relative; z-index: 2 } .newsletter-content-two .title { font-size: 40px; line-height: 54px; font-weight: 700; color: #fff; margin-bottom: 20px } .newsletter-content-two p { color: #fff; margin-bottom: 70px } .newsletter-form-two { max-width: 770px; margin: 0 auto; z-index: 22; position: relative } .newsletter-form-two .newsletter-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .newsletter-form-two .newsletter-inner input { background: 0 0; border: 0; outline: 0; color: #fff; border-bottom: 1px solid #fff; padding: 15px 15px 15px 0; border-radius: 0; height: 60px; max-width: 500px; margin: 0; width: 100% } .newsletter-form-two .newsletter-inner input:focus { -webkit-box-shadow: none; box-shadow: none } .newsletter-form-two .newsletter-inner input::-webkit-input-placeholder { color: #fff } .newsletter-form-two .newsletter-inner input:-ms-input-placeholder { color: #fff } .newsletter-form-two .newsletter-inner input::-ms-input-placeholder { color: #fff } .newsletter-form-two .newsletter-inner input::placeholder { color: #fff } .newsletter-form-two .newsletter-inner .newsletter-submit { width: 220px; height: 60px; background: #fff; border: 0; border-radius: 30px; color: #fa7070; font-weight: 600; -webkit-box-shadow: 0 20px 30px 0 rgba(79, 35, 35, .15); box-shadow: 0 20px 30px 0 rgba(79, 35, 35, .15); -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .newsletter-form-two .newsletter-inner .newsletter-submit i { display: none } .newsletter-form-two .newsletter-inner .newsletter-submit:hover { -webkit-box-shadow: none; box-shadow: none } @media (max-width: 991px) { .newsletter { padding: 70px 0 80px } .newsletter-form .newsletter-inner input { height: 55px } .newsletter-two { padding: 70px 0 80px } .newsletter-content .title { font-size: 32px; line-height: 42px } .newsletter-form { margin-left: 0; margin: 30px auto 0 } .newsletter-content { text-align: center } .newsletter-content-two .title { font-size: 34px; line-height: 44px } .newsletter-content-two p br { display: none } .newsletter-two .scroll-circle { bottom: -40%; right: -10% } .newsletter-two .scroll-circle img { max-width: 380px } .newsletter .scroll-circle { max-width: 500px } .newsletter-form .newsletter-inner input { padding: 0 170px 0 40px } .newsletter-form .newsletter-inner .newsletter-submit { height: 55px } } @media (max-width: 768px) { .newsletter-two .scroll-circle { right: -80% } .newsletter .scroll-circle { max-width: 400px } .newsletter-two p { margin-bottom: 50px } .newsletter-two .newsletter-content-two .title { font-size: 30px; line-height: 40px } } @media (max-width: 480px) { .call-to-action .action-content.style-two .title, .newsletter-content-two .title { font-size: 28px; line-height: 40px } .call-to-action .action-content.style-two .title br, .newsletter-content-two .title br { display: none } .newsletter-form-two .newsletter-inner .newsletter-submit { margin-top: 20px } } @media (max-width: 480px) { .newsletter-content .title br { display: none } .newsletter-form .newsletter-inner .newsletter-submit, .newsletter-form .newsletter-inner input { padding: 0 20px } .newsletter-form-two .newsletter-inner { display: block } } .page-banner { background: #fdf8f8; text-align: center; height: 550px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; overflow: hidden } .page-banner .page-title { font-size: 50px; font-weight: 800; color: #2b2350; position: relative; z-index: 2; max-width: 820px; margin: 30px auto 15px } .page-banner .bradcurmed { margin: 0; padding: 0; list-style: none; position: relative; z-index: 2 } .page-banner .bradcurmed li { display: inline-block; position: relative; font-size: 18px } .page-banner .bradcurmed li:not(:last-child) { margin-right: 30px } .page-banner .bradcurmed li:not(:last-child):before { content: "\35"; font-family: eleganticons; position: absolute; right: -25px; top: 0 } .page-banner .bradcurmed li a { color: #2b2350; font-weight: 500 } .page-banner .bradcurmed li a:hover { color: #fa7070 } .page-banner .circle { position: absolute; top: -51%; left: -15%; z-index: 1 } .page-banner.blog-details-banner { height: 700px } .page-banner.blog-details-banner .circle { position: absolute; top: -39%; left: -19%; z-index: 1 } .page-banner.blog-details-banner .page-title-wrapper { margin-top: 60px } .page-banner.blog-details-banner .page-title { font-size: 40px; line-height: 54px; font-weight: 600; margin-top: 0; margin-bottom: 20px } .page-banner.blog-details-banner .post-meta { position: relative; z-index: 22; padding: 0 } .page-banner.blog-details-banner .post-meta li { display: inline-block; margin-right: 30px; position: relative; text-transform: uppercase } .page-banner.blog-details-banner .post-meta li:not(:last-child):after { position: absolute; content: ''; right: -20px; top: 7px; width: 2px; height: 14px; background: #9997a3 } .page-banner.blog-details-banner .post-meta li a { color: #797687; text-transform: uppercase; font-weight: 500; margin-left: 5px } .page-banner.blog-details-banner .post-meta li a:hover { color: #fa7070 } .page-banner.blog-details-banner .post-meta.color-theme { margin-bottom: 10px } .page-banner.blog-details-banner .post-meta.color-theme li a { color: #fa7070 } .animate-ball { position: absolute; height: 100%; width: 100%; margin: 0; padding: 0; list-style: none; top: 0; left: 0 } .animate-ball .ball { background: #fdf1f1; border-radius: 50%; position: absolute } .animate-ball .ball:nth-child(1) { height: 50px; width: 50px; top: 37%; left: 10%; -webkit-animation: zoommd 1.5s infinite alternate; animation: zoommd 1.5s infinite alternate } .animate-ball .ball:nth-child(2) { height: 70px; width: 70px; bottom: 22%; right: 8%; -webkit-animation: bounce 4s infinite alternate; animation: bounce 4s infinite alternate } .animate-ball .ball:nth-child(3) { height: 100px; width: 100px; bottom: 43%; right: 22%; -webkit-animation: zoommd 1.5s infinite alternate; animation: zoommd 1.5s infinite alternate } .animate-ball .ball:nth-child(4) { height: 40px; width: 40px; bottom: 20%; right: 32%; -webkit-animation: movexy 1.5s infinite alternate; animation: movexy 1.5s infinite alternate } .animate-ball .ball:nth-child(5) { height: 500px; width: 500px; top: -75%; right: 100px; -webkit-animation: wave 3s .1s infinite linear; animation: wave 3s .1s infinite linear } .page-banner-contact { height: 690px; position: relative; overflow: hidden; background: #fdf8f8 } .page-banner-contact .circle { position: absolute; top: -40%; left: -15% } .page-title-inner { position: relative; z-index: 2 } .animate-element-contact { position: relative; z-index: 222; height: 465px; width: 408px; bottom: -135px } .animate-element-contact img { position: absolute; bottom: 0 } .animate-element-contact img:nth-child(1) { left: 5px; bottom: 55px } .animate-element-contact img:nth-child(2) { bottom: 41px; left: 128px } .animate-element-contact img:nth-child(3) { right: 0 } .animate-element-contact img:nth-child(4) { bottom: 0; left: 110px } .page-banner { background: #fdf8f8; background-image: linear-gradient(-60deg, #7052fb 0, #8a60fd 100%); text-align: center; height: 84px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; overflow: hidden } .page-banner .page-title { font-size: 30px; font-weight: 600; color: #fff; position: relative; z-index: 2; max-width: 820px; margin: 22px auto 15px; padding-top: 30px } .page-banner .bradcurmed { margin: 0; padding: 0; list-style: none; position: relative; z-index: 2 } .page-banner .bradcurmed li { display: inline-block; position: relative; font-size: 18px; color: #ddd } .page-banner .bradcurmed li:not(:last-child) { margin-right: 30px } .page-banner .bradcurmed li:not(:last-child):before { content: "\35"; font-family: eleganticons; position: absolute; right: -25px; top: 0 } .page-banner .bradcurmed li a { color: #2b2350; font-weight: 500 } .page-banner .bradcurmed li a:hover { color: #fa7070 } .page-banner .circle { position: absolute; top: -51%; left: -15%; z-index: 1 } .page-banner.blog-details-banner { height: 700px } .page-banner.blog-details-banner .circle { position: absolute; top: -39%; left: -19%; z-index: 1 } .page-banner.blog-details-banner .page-title-wrapper { margin-top: 60px } .page-banner.blog-details-banner .page-title { font-size: 40px; line-height: 54px; font-weight: 600; margin-bottom: 20px } .page-banner.blog-details-banner .post-meta { position: relative; z-index: 22; padding: 0 } .page-banner.blog-details-banner .post-meta li { display: inline-block; margin-right: 30px; position: relative; text-transform: uppercase } .page-banner.blog-details-banner .post-meta li:not(:last-child):after { position: absolute; content: ''; right: -20px; top: 7px; width: 2px; height: 14px; background: #9997a3 } .page-banner.blog-details-banner .post-meta li a { color: #797687; text-transform: uppercase; font-weight: 500; margin-left: 5px } .page-banner.blog-details-banner .post-meta li a:hover { color: #fa7070 } .page-banner.blog-details-banner .post-meta.color-theme { margin-bottom: 10px } .page-banner.blog-details-banner .post-meta.color-theme li a { color: #fa7070 } .animate-ball { position: absolute; height: 100%; width: 100%; margin: 0; padding: 0; list-style: none; top: 0; left: 0 } .animate-ball .ball { background: #7358ec; border-radius: 50%; position: absolute } .animate-ball .ball:nth-child(1) { height: 50px; width: 50px; top: 37%; left: 10%; -webkit-animation: zoommd 1.5s infinite alternate; animation: zoommd 1.5s infinite alternate } .animate-ball .ball:nth-child(2) { height: 70px; width: 70px; bottom: 22%; right: 8%; -webkit-animation: bounce 4s infinite alternate; animation: bounce 4s infinite alternate } .animate-ball .ball:nth-child(3) { height: 100px; width: 100px; bottom: 43%; right: 22%; -webkit-animation: zoommd 1.5s infinite alternate; animation: zoommd 1.5s infinite alternate } .animate-ball .ball:nth-child(4) { height: 40px; width: 40px; bottom: 20%; right: 32%; -webkit-animation: movexy 1.5s infinite alternate; animation: movexy 1.5s infinite alternate } .animate-ball .ball:nth-child(5) { height: 500px; width: 500px; top: -75%; right: 100px; -webkit-animation: wave 3s .1s infinite linear; animation: wave 3s .1s infinite linear } .page-banner-contact { height: 700px; position: relative; overflow: hidden; background: #fdf8f8; z-index: 2 } .page-banner-contact .circle { position: absolute; top: -40%; left: -17% } .page-banner-contact .page-title-wrapper { padding: 315px 0 245px; position: relative } .page-banner-contact .page-title-wrapper .page-title { font-size: 40px; line-height: 54px } .page-banner-contact .page-title-wrapper p { font-size: 16px; line-height: 30px } .page-banner-contact .animate-ball .ball:nth-child(3) { bottom: 55%; right: 40%; height: 70px; width: 70px } .page-banner-contact .animate-ball .ball:nth-child(4) { bottom: 28%; right: 40% } .page-banner-contact .animate-ball .ball:nth-child(5) { top: -60% } .animate-element-contact { position: relative; z-index: 222; height: 465px; width: 408px; bottom: -135px } .animate-element-contact img { position: absolute; bottom: 0 } .animate-element-contact img:nth-child(1) { left: 5px; bottom: 55px } .animate-element-contact img:nth-child(2) { bottom: 41px; left: 128px } .animate-element-contact img:nth-child(3) { right: 0 } .animate-element-contact img:nth-child(4) { bottom: 0; left: 110px } @media (max-width: 1280px) { .animate-element-contact { margin-left: -80px } } @media (max-width: 1200px) { .page-banner { height: 400px } .page-banner .circle { top: -110%; left: -35% } .animate-ball .ball:nth-child(5) { top: -102%; right: 0 } .animate-element-contact { margin-left: -80px } } @media (max-width: 1024px) { .circle { display: none } } @media (max-width: 991px) { .page-banner { height: 65px } .page-banner .page-banner .circle { top: -185%; left: -45% } .page-banner .page-title { font-size: 40px; margin: 40px auto 15px } .page-banner .animate-ball .ball:nth-child(3) { height: 50px; width: 50px } .page-banner .animate-ball .ball:nth-child(3) { height: 40px; width: 40px } .page-banner .animate-ball .ball:nth-child(5) { top: -190px; right: 0; height: 250px; width: 250px } .page-banner.blog-details-banner { height: 400px } .page-banner.blog-details-banner .page-title { font-size: 30px; line-height: 44px } .page-banner.blog-details-banner .circle { left: -50% } .page-banner-contact { height: 800px } .page-banner-contact .page-title-wrapper { padding: 130px 0 0 } .animate-element-contact { height: 365px; margin: 0 auto } .page-banner .circle { left: -60% } } @media (max-width: 768px) { .page-banner .page-title { font-size: 30px; margin: 40px auto 10px } .page-banner.blog-details-banner { height: 400px } .page-banner.blog-details-banner .page-title { font-size: 26px; line-height: 36px } .page-banner.blog-details-banner .circle { left: -70% } .page-banner-contact .page-title-wrapper { padding: 100px 0 0 } .page-banner-contact .page-title-wrapper .page-title { font-size: 32px } .page-banner-contact .page-title-wrapper p br { display: none } .page-banner .circle { left: -80% } } @media (max-width: 576px) { .page-banner .circle { left: -120% } } .about { padding-top: 120px } .about-content { padding-right: 130px } .about-content .section-title { margin-bottom: 35px } .about-content p { margin-bottom: 40px } .about-content .singiture h4 { font-size: 20px; margin-bottom: 25px } @media (max-width: 991px) { .about { padding-top: 76px } .about-content { padding-right: 0 } .about-thumb { margin-top: 30px } } .service { padding-top: 120px } .popup-videos { position: relative; max-width: 470px } .popup-videos .play-btn { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-box-shadow: none; box-shadow: none } .service-content { padding: 30px 50px 0 50px } .service-content .section-title { margin-bottom: 40px } .service-content p { font-size: 18px; line-height: 34px } .featured-two-service { padding: 45px 0 28px } @media (max-width: 991px) { .service { padding-top: 80px } .service-content { padding: 0; margin-top: 50px } } .contactus { padding: 50px 0 } .gmap3-area { height: 500px } .contact-infos .contact-info { margin-bottom: 30px } .contact-infos .contact-info:first-child { border-bottom: 1px solid #efe7e7 } .contact-infos .contact-info .title { font-size: 24px; font-weight: 500; line-height: 28px; margin-bottom: 15px } .contact-infos .contact-info .description { font-size: 16px; line-height: 28px; color: #333 } .contact-infos .contact-info .info i { margin-right: 10px } .contact-infos .contact-info .info.phone { color: #fa7070 } @media (max-width: 991px) { .contactus { padding: 80px 0 80px } } .portfolios { padding: 120px 0 40px } .portfolios-three, .portfolios-two { padding: 120px 0 } .pixsass-isotope-filter { margin-bottom: 50px; padding: 0; list-style: none; text-align: center } .pixsass-isotope-filter li { display: inline-block; margin-bottom: 10px } .pixsass-isotope-filter li a { color: #797687; font-size: 16px; font-weight: 500; padding: 5px 23px; border: 1px solid transparent; border-radius: 30px; display: inline-block } .pixsass-isotope-filter li.current a { border-color: #fa7070; color: #fa7070 } .grid-sizer { min-height: 1px } .pixsass-portfolio-items.column-2 { width: calc(100% + 4%) } .pixsass-portfolio-items.column-2 .grid-sizer, .pixsass-portfolio-items.column-2 .pixsass-portfolio-item { width: calc(50% - 4%); margin-right: 4%; float: left } .pixsass-portfolio-items.column-3 { width: calc(100% + 2.4%) } .pixsass-portfolio-items.column-3 .grid-sizer, .pixsass-portfolio-items.column-3 .pixsass-portfolio-item { width: calc(33.33% - 2.4%); margin-right: 2.4%; float: left } .pixsass-portfolio-items.portfolio-one .pixsass-portfolio-item { position: relative; margin-bottom: 150px; float: left } .pixsass-portfolio-items.portfolio-one .pixsass-portfolio-item .portfolio-info { max-width: 420px; background: #fff; padding: 30px 40px; -webkit-box-shadow: 0 20px 40px 0 rgba(79, 35, 35, .1); box-shadow: 0 20px 40px 0 rgba(79, 35, 35, .1); position: absolute; width: 100%; bottom: -70px; left: 40px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .pixsass-portfolio-items.portfolio-one .pixsass-portfolio-item .portfolio-info h3 { font-size: 24px; margin: 0; line-height: 32px } .pixsass-portfolio-items.portfolio-one .pixsass-portfolio-item .portfolio-info h3 a { color: #2b2350 } .pixsass-portfolio-items.portfolio-one .pixsass-portfolio-item .portfolio-info h3 a:hover { color: #fa7070 } .pixsass-portfolio-items.portfolio-one .pixsass-portfolio-item .portfolio-info span { color: #797687; font-size: 16px } .pixsass-portfolio-items.portfolio-one .pixsass-portfolio-item:hover .portfolio-info { -webkit-box-shadow: none; box-shadow: none; bottom: 40px } .pixsass-portfolio-items.portfolio-two .pixsass-portfolio-item { position: relative; margin-bottom: 60px } .pixsass-portfolio-items.portfolio-two .pixsass-portfolio-item .pixsass-isotope-grid__img { position: relative; overflow: hidden } .pixsass-portfolio-items.portfolio-two .pixsass-portfolio-item .pixsass-isotope-grid__img:before { position: absolute; content: ''; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .2); opacity: 0; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; z-index: 2 } .pixsass-portfolio-items.portfolio-two .pixsass-portfolio-item .pixsass-isotope-grid__img img { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .pixsass-portfolio-items.portfolio-two .pixsass-portfolio-item .pixsass-isotope-grid__img:hover:before { opacity: 1 } .pixsass-portfolio-items.portfolio-two .pixsass-portfolio-item .pixsass-isotope-grid__img:hover img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1) } .pixsass-portfolio-items.portfolio-two .pixsass-portfolio-item .portfolio-info { padding: 30px 40px 0; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .pixsass-portfolio-items.portfolio-two .pixsass-portfolio-item .portfolio-info h3 { font-size: 24px; margin: 0; line-height: 32px } .pixsass-portfolio-items.portfolio-two .pixsass-portfolio-item .portfolio-info h3 a { color: #2b2350 } .pixsass-portfolio-items.portfolio-two .pixsass-portfolio-item .portfolio-info h3 a:hover { color: #fa7070 } .pixsass-portfolio-items.portfolio-two .pixsass-portfolio-item .portfolio-info span { color: #797687; font-size: 16px } .pixsass-portfolio-items.portfolio-two .pixsass-portfolio-item:hover .portfolio-info { -webkit-box-shadow: none; box-shadow: none } .pixsass-portfolio-items.portfolio-three .pixsass-portfolio-item { position: relative; margin-bottom: 2%; border-radius: 10px; overflow: hidden; position: relative } .pixsass-portfolio-items.portfolio-three .pixsass-portfolio-item img { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .pixsass-portfolio-items.portfolio-three .pixsass-portfolio-item:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: -o-linear-gradient(210deg, #fa9770 0, #fa7070 100%); background-image: linear-gradient(-120deg, #fa9770 0, #fa7070 100%); opacity: 0; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .pixsass-portfolio-items.portfolio-three .pixsass-portfolio-item .portfolio-info { padding: 35px 40px; -webkit-box-shadow: 0 20px 40px 0 rgba(79, 35, 35, .1); box-shadow: 0 20px 40px 0 rgba(79, 35, 35, .1); position: absolute; width: 100%; bottom: 0; left: 0; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .pixsass-portfolio-items.portfolio-three .pixsass-portfolio-item .portfolio-info h3 { font-size: 24px; margin-bottom: 4px; line-height: 32px; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); opacity: 0; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; -webkit-transition-delay: .1s; -o-transition-delay: .1s; transition-delay: .1s } .pixsass-portfolio-items.portfolio-three .pixsass-portfolio-item .portfolio-info h3 a { color: #fff } .pixsass-portfolio-items.portfolio-three .pixsass-portfolio-item .portfolio-info span { color: #fff; font-size: 14px; display: inline-block; text-transform: uppercase; margin-bottom: 15px; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); opacity: 0; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .pixsass-portfolio-items.portfolio-three .pixsass-portfolio-item .portfolio-info p { color: #fff; margin: 0; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); opacity: 0; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; -webkit-transition-delay: .3s; -o-transition-delay: .3s; transition-delay: .3s } .pixsass-portfolio-items.portfolio-three .pixsass-portfolio-item:hover:before { opacity: .9; z-index: 3 } .pixsass-portfolio-items.portfolio-three .pixsass-portfolio-item:hover img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1) } .pixsass-portfolio-items.portfolio-three .pixsass-portfolio-item:hover .portfolio-info { -webkit-box-shadow: none; box-shadow: none; z-index: 4 } .pixsass-portfolio-items.portfolio-three .pixsass-portfolio-item:hover .portfolio-info h3, .pixsass-portfolio-items.portfolio-three .pixsass-portfolio-item:hover .portfolio-info p, .pixsass-portfolio-items.portfolio-three .pixsass-portfolio-item:hover .portfolio-info span { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1 } .portfolio-single { padding: 116px 0 100px } .port-header { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 60px } .port-header .portfolio-title { -webkit-box-flex: 1; -ms-flex: 1; flex: 1 } .port-header .portfolio-title .title { max-width: 510px; font-size: 40px; line-height: 50px; font-weight: 500 } .port-header .share-link { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .port-header .share-link .footer-social-link { margin: 0 } .port-header .share-link li a { background: 0 0 } .portfolio-content img { margin-bottom: 70px } .portfolio-content .content-inner { padding-right: 65px; border-right: 1px solid #efe7e7 } .portfolio-content .content-inner .sub-title { font-size: 22px; font-weight: 500; line-height: 34px; margin-bottom: 30px } .portfolio-content .content-inner p { font-size: 18px; line-height: 30px } .portfolio-content .portfolio-info { padding-left: 55px } .portfolio-content .portfolio-info .info { margin: 0; padding: 0; list-style: none } .portfolio-content .portfolio-info .info li { font-size: 20px; font-weight: 500; margin-bottom: 45px; color: #2b2350 } .portfolio-content .portfolio-info .info li span { display: block; font-size: 16px; font-weight: 400; color: #797687; margin-top: 5px } .portfolio-nav { margin: 0; padding: 0; list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-top: 100px } .portfolio-nav li { font-size: 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -ms-flex-align: end; align-items: end } .portfolio-nav li i { font-size: 30px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .portfolio-nav li a { color: #797687 } .portfolio-nav li.prev i { margin-right: 10px } .portfolio-nav li.next i { margin-left: 10px } .portfolio-nav li:hover a, .portfolio-nav li:hover i { color: #fa7070 } .related-portfolio { padding-top: 80px } .related-portfolio .portfolio-item .feature-image { position: relative } .related-portfolio .portfolio-item .feature-image img { width: 100% } .related-portfolio .portfolio-item .feature-image a { display: block; position: relative } .related-portfolio .portfolio-item .feature-image a:before { content: ''; position: absolute; left: 0; top: 0; background: rgba(0, 0, 0, .2); width: 100%; height: 100%; opacity: 0; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .related-portfolio .portfolio-item .feature-image:hover a:before { opacity: 1 } .related-portfolio .portfolio-item .port-info { padding: 25px 40px 0 } .related-portfolio .portfolio-item .port-info h3 { font-size: 24px; margin-bottom: 3px; line-height: 32px } .related-portfolio .portfolio-item .port-info h3 a { color: #2b2350 } .related-portfolio .portfolio-item .port-info h3 a:hover { color: #fa7070 } #related-portfolio .swiper-pagination { position: relative; margin-top: 55px } #related-portfolio .swiper-pagination .swiper-pagination-bullet { height: 12px; width: 12px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; margin-right: 5px; position: relative; opacity: 1; background: 0 0; outline: 0 } #related-portfolio .swiper-pagination .swiper-pagination-bullet:before { content: ''; position: absolute; height: 12px; width: 12px; background: #e5d6d6; z-index: 2; top: 0; left: 0; border-radius: 50%; left: -2px; top: -2px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; -webkit-transform: scale(.7); -ms-transform: scale(.7); transform: scale(.7) } #related-portfolio .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { opacity: 1 } #related-portfolio .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active:before { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); background: #fa7070; -webkit-box-shadow: 0 10px 14px 0 rgba(79, 35, 35, .3); box-shadow: 0 10px 14px 0 rgba(79, 35, 35, .3) } @media (max-width: 991px) { .portfolios { padding: 80px 0 50px } .pixsass-isotope-filter { margin-bottom: 40px } .portfolios-three, .portfolios-two { padding: 80px 0 } .pixsass-portfolio-items.portfolio-one .pixsass-portfolio-item { margin-bottom: 120px } .pixsass-portfolio-items.portfolio-one .pixsass-portfolio-item .portfolio-info { max-width: 290px; left: 20px } .pixsass-portfolio-items.column-3 { width: calc(100% + 3%) } .pixsass-portfolio-items.column-3 .grid-sizer, .pixsass-portfolio-items.column-3 .pixsass-portfolio-item { width: calc(50% - 3%); margin-right: 3%; margin-bottom: 3% } .portfolio-single { padding: 76px 0 80px } .port-header { display: block } .port-header .portfolio-title .title { font-size: 30px; line-height: 40px; margin-bottom: 20px } } @media (max-width: 768px) { .pixsass-portfolio-items.portfolio-one .pixsass-portfolio-item .portfolio-info { max-width: 60%; left: 20px } .pixsass-portfolio-items.column-2, .pixsass-portfolio-items.column-3 { width: 100% } .pixsass-portfolio-items.column-2 .grid-sizer, .pixsass-portfolio-items.column-2 .pixsass-portfolio-item, .pixsass-portfolio-items.column-3 .grid-sizer, .pixsass-portfolio-items.column-3 .pixsass-portfolio-item { width: calc(48.33% - 5.4%); margin-right: 3.4%; margin-bottom: 30px } .pixsass-portfolio-items.column-2 .grid-sizer img, .pixsass-portfolio-items.column-2 .pixsass-portfolio-item img, .pixsass-portfolio-items.column-3 .grid-sizer img, .pixsass-portfolio-items.column-3 .pixsass-portfolio-item img { width: 100% } .pixsass-portfolio-items.column-2 .pixsass-portfolio-item { margin-bottom: 120px } .portfolio-content img { margin-bottom: 30px } .portfolio-content .content-inner { padding-right: 0; border-right: 0 } .related-portfolio { padding-top: 60px } .portfolio-content .portfolio-info { padding-left: 0; padding-top: 30px } .portfolio-nav { margin-top: 30px } } @media (max-width: 576px) { .pixsass-portfolio-items.column-2 .pixsass-portfolio-item { margin-bottom: 80px } .pixsass-portfolio-items.portfolio-one .pixsass-portfolio-item .portfolio-info { max-width: 80%; padding: 20px; bottom: -50px } .pixsass-portfolio-items.portfolio-one .pixsass-portfolio-item .portfolio-info h3 { font-size: 20px; line-height: 30px } } .download { padding: 120px 0 } .download-wrapper { padding-top: 115px } .download-wrapper .title { font-size: 34px; font-weight: 700; margin-bottom: 25px } .download-wrapper p { margin-bottom: 40px } .download-feature-image { position: relative } .download-feature-image .image-one { margin-left: 185px; z-index: 22; position: relative } .download-feature-image .image-two { position: absolute; right: 10px; top: -20px } .download-feature-image svg { position: absolute; z-index: -1; top: 43px; right: 0 } .app-btn-wrapper .app-btn:not(:last-child) { margin-right: 20px } @media (max-width: 1200px) { .download-feature-image .image-one { margin-left: 0 } } @media (max-width: 991px) { .download-feature-image svg { right: auto; left: 0 } .download-feature-image .image-one { margin-left: 0 } .download-feature-image .image-two { right: 25% } .download { padding: 100px 0 } .signup-section { padding: 70px 0 } } @media (max-width: 768px) { .download-feature-image .image-two { left: 150px; right: auto } } @media (max-width: 576px) { .download-feature-image svg { top: -50px } .download-feature-image .image-one { margin-left: 0; max-width: 200px } .download-feature-image .image-two { right: auto; top: -18px; max-width: 270px; left: 25% } .download-wrapper { padding-top: 50px } } @media (max-width: 480px) { .download-feature-image .image-two { right: auto; left: 15% } .app-btn-wrapper .app-btn:not(:last-child) { margin-right: 10px; margin-bottom: 10px } } .interface { padding: 105px 0 60px; overflow: hidden } .interface-image-wrapper { height: 600px } .interface-image-wrapper .image-one { margin-left: -60px; margin-top: 178px } .interface-image-wrapper .image-two { position: absolute; top: 0; left: 160px } .interface-image-wrapper.style-two .image-one { position: absolute; bottom: 0; left: -20px; margin: 0; z-index: 22 } .interface-image-wrapper.style-two .image-two { position: static; margin-left: 135px } .interface-content .interface-title h2 { font-size: 34px; line-height: 50px; margin-bottom: 20px } .interface-content .interface-title p { margin-bottom: 30px } .interface-content .list-items { margin-bottom: 30px } .interface-content .list-items li { line-height: 40px; font-size: 18px } .interface-content .list-items li:before { content: "\52"; color: #13bf24 } .svgbg-one, .svgbg-two { position: absolute; z-index: -1; -webkit-animation: g 3s .1s infinite linear; animation: g 3s .1s infinite linear } .svgbg-one { top: 55px; left: 50px } .svgbg-two { top: -70px; left: -37% } .svgbg-two { position: absolute; top: -70px; left: -37%; z-index: -1; -webkit-animation: wave 3s .1s infinite linear; animation: wave 3s .1s infinite linear } .interface-toparea { padding-bottom: 200px } .border-wrap { position: absolute; left: 50%; top: 50%; max-width: 775px; -webkit-transform: translate(-17%, -54%); -ms-transform: translate(-17%, -54%); transform: translate(-17%, -54%); width: 100%; z-index: -1 } .border-wrap .ball { position: absolute; height: 40px; width: 40px; border-radius: 50%; background: #fa7070; top: 49%; left: 45%; z-index: 22 } #animate-border { max-width: 775px; z-index: -1; opacity: .5 } .path { stroke-dasharray: 6; -webkit-animation: dash 30s linear infinite; animation: dash 30s linear infinite } @-webkit-keyframes dash { 0% { stroke-dashoffset: 1000 } } @keyframes dash { 0% { stroke-dashoffset: 1000 } } @media (min-width: 992px) and (max-width:1200px) { .interface-image-wrapper .image-two { max-width: 300px; left: 150px } #animate-border { max-width: 650px } .md-brn br { display: none } .interface { padding: 88px 0 37px } } @media (max-width: 992px) { .interface { padding: 62px 0 80px } .interface-toparea { padding-bottom: 100px } .border-wrap { display: none } .interface-image-wrapper .image-one { margin-left: -30px } .interface-image-wrapper .image-two { left: 190px } .svgbg-one { left: 50px } } @media (max-width: 576px) { .interface-image-wrapper .image-two { max-width: 300px; left: 180px } .interface-content .interface-title p br { display: none } .interface-image-wrapper.style-two .image-two { margin-left: 100px } } @media (max-width: 420px) { .interface-image-wrapper .image-one { z-index: 22; position: relative; margin-top: 25px; margin-left: 0 } .interface-image-wrapper .image-two { max-width: 300px; left: 70px } .interface-image-wrapper.style-two .image-one { max-width: 300px; left: 0 } .interface-image-wrapper.style-two .image-two { margin-left: 30px } } #blog-grid { padding: 72px 0 90px } #blog-grid .feature-image a { display: block; position: relative; overflow: hidden } #blog-grid .feature-image a img { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; width: 100% } #blog-grid .feature-image a:before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .3); opacity: 0; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; z-index: 22 } #blog-grid .feature-image a:hover:before { opacity: 1 } #blog-grid .feature-image a:hover img { -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05) } .blog-post { border-radius: 6px; background-color: #fff; -webkit-box-shadow: 0 6px 14px 0 rgba(43, 35, 79, .1); box-shadow: 0 6px 14px 0 rgba(43, 35, 79, .1); overflow: hidden; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; margin-bottom: 30px } .blog-post:hover { -webkit-box-shadow: 0 30px 60px 0 rgba(43, 35, 79, .12); box-shadow: 0 30px 60px 0 rgba(43, 35, 79, .12) } .blog-content { padding: 22px 25px 30px; background: #fff } .blog-content .post-meta { margin: 0; padding: 0; list-style: none } .blog-content .post-meta li { display: inline-block; margin-right: 0; position: relative; line-height: 23px } .blog-content .post-meta li:not(:last-child):after { position: absolute; content: ''; right: -18px; top: 7px; width: 2px; height: 14px; background: #9997a3 } .blog-content .post-meta li i { margin-right: 5px; color: #fa7070 } .blog-content .post-meta li a { color: #797687; font-size: 15px; font-weight: 500; text-transform: capitalize } .blog-content .post-meta li a:hover { color: #fa7070 } .blog-content .entry-title { font-size: 18px; font-weight: 600; margin: 5px 0 8px; line-height: 24px } .blog-content .entry-title a { color: #222 } .blog-content .entry-title a:hover { color: #fa7070 } .blog-content .read-more-ntn { font-size: 12px; font-weight: 600; color: #fa7070; text-transform: uppercase; display: -webkit-box; display: -ms-flexbox; display: flex } .blog-content .read-more-ntn i { font-size: 10px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-left: 5px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .blog-content .read-more-ntn:hover { color: #f83f3f } .blog-content .read-more-ntn:hover i { margin-left: 8px } .color-two .blog-content .post-meta li a:hover { color: #7052fb } .color-two .blog-content .entry-title a:hover { color: #7052fb } .post-author { font-size: 16px; font-weight: 500; color: #656177 } .post-author img { border-radius: 50%; margin-right: 20px } .post-author:hover { color: #7052fb } .blog-post-archive { padding: 80px 0 60px } .post-wrapper { max-width: 670px } .post-wrapper .categories { position: absolute; top: 40px; right: 0 } .post-wrapper .category-item { font-size: 16px; font-weight: 700; background: #f8f6f2; padding: 9px 17px; color: #827f79; margin-left: 5px } .post-wrapper .category-item:hover { background: #2b2350; color: #fff } .post-wrapper .post { margin-bottom: 60px } .post-wrapper .post:last-child .post { margin-bottom: 0 } .post .feature-image { border-radius: 6px; overflow: hidden } .post .blog-content { padding: 28px 0 40px; position: relative; border-bottom: 1px solid #e6e5e0 } .post .blog-content .post-meta li a { color: #797687; font-size: 15px; margin-right: 3px } .post .blog-content .post-meta li a:hover { color: #fa7070 } .post .blog-content .entry-title { margin: 14px 0 22px; font-size: 30px; line-height: 1.2 } .post .blog-content p { margin-bottom: 35px } .post .blog-content .read-more { font-size: 14px; text-transform: uppercase; font-weight: 500; color: #2b2350; position: relative } .post .blog-content .read-more i { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; vertical-align: middle; font-size: 16px } .post .blog-content .read-more:after { content: ''; position: absolute; bottom: -2px; left: 0; width: 0; height: 1px; background: #fa7070; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .post .blog-content .read-more:hover { color: #fa7070 } .post .blog-content .read-more:hover i { margin-left: 3px; color: #fa7070 } .post .blog-content .read-more:hover:after { width: 100% } .post .author { position: absolute; right: 0; bottom: 40px } .post .author img { height: 40px; width: 40px; border-radius: 50%; margin-right: 15px } .post .author span { font-size: 16px; font-weight: 500 } .post .author a { font-size: 16px; font-weight: 500; color: #2b2350 } .post .author a:hover { color: #fa7070 } .post.video-post .feature-image { position: relative } .post.video-post .feature-image .video-btn { height: 80px; width: 80px; background: #fff; border-radius: 50%; line-height: 80px; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center } .post.video-post .feature-image .video-btn:after, .post.video-post .feature-image .video-btn:before { content: ''; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); border: 1px solid #fff; border-radius: 50%; -webkit-animation: pulse 2s linear infinite; animation: pulse 2s linear infinite } .post.video-post .feature-image .video-btn:after { -webkit-animation-delay: 1s; animation-delay: 1s } .post.video-post .feature-image .video-btn i { color: #2b2350; font-size: 16px; font-size: 40px; line-height: 2.05 } .post.link-post .blog-content { background: #fdf8f8; padding: 50px 50px; border-bottom: 0; position: relative; overflow: hidden; border-radius: 6px } .post.link-post .blog-content:after, .post.link-post .blog-content:before { content: "\e02c"; font-family: ElegantIcons; position: absolute } .post.link-post .blog-content:before { left: 28px; top: 24px; color: #f7eded; font-size: 50px; z-index: 1 } .post.link-post .blog-content:after { right: 0; bottom: -3px; font-size: 100px; color: #f7eded } .post.link-post .blog-content p { font-size: 20px; font-weight: 000; position: relative; z-index: 2; margin-bottom: 0; line-height: 34px } .post.link-post .blog-content p a { color: #656177; font-weight: 500 } .post.link-post .blog-content p a:hover { color: #fa7070 } .blog-post-two { margin-bottom: 30px } .blog-post-two .feature-image { border-radius: 6px; overflow: hidden } .blog-post-two .feature-image img { border-radius: 6px; width: 100% } .blog-post-two .blog-content { padding: 22px 0 0; background: 0 0 } .blog-post-two .blog-content .post-meta li a { text-transform: capitalize } .blog-post-two .blog-content .entry-title { font-size: 24px; margin: 5px 0 15px } .blog-post-two .blog-content p { margin-bottom: 30px } .blog-post-two .blog-content .read-more { border: 2px solid #7052fb; border-radius: 30px; padding: 7px 25px; font-weight: 500; display: inline-block; color: #7052fb } .blog-post-two .blog-content .read-more:hover { background: #7052fb; color: #fff; -webkit-box-shadow: 0 20px 30px 0 rgba(75, 42, 222, .2); box-shadow: 0 20px 30px 0 rgba(75, 42, 222, .2) } .blog-grid-two { padding: 90px 0 } .author img { height: 40px; width: 40px; border-radius: 50%; margin-right: 15px } .author span { font-size: 16px; font-weight: 500 } .author a { font-size: 16px; font-weight: 500; color: #2b2350 } .author a:hover { color: #fa7070 } .quote-post { position: relative; background: #fdf8f8; padding: 50px; border-bottom: 0; overflow: hidden; border-radius: 6px } .quote-post:before { content: ''; position: absolute; left: 28px; top: -20px; background-image: url(../../media/blog/quote2.png); width: 140px; height: 80px; z-index: 1 } .quote-post p { font-size: 20px; font-weight: 400; line-height: 34px; margin-bottom: 50px; position: relative; z-index: 2; color: #656177 } .quote-post span { font-size: 16px; font-weight: 500; color: #2b2350 } .quote-post .quote { position: absolute; right: 50px; bottom: 35px } .post-post-grid { border-radius: 6px; -webkit-box-shadow: 0 6px 14px 0 rgba(43, 35, 79, .1); box-shadow: 0 6px 14px 0 rgba(43, 35, 79, .1); overflow: hidden; margin-bottom: 40px } .post-post-grid .feature-image img { width: 100% } .post-post-grid .blog-content { padding: 22px 40px 30px } .post-post-grid .blog-content .entry-title { margin: 8px 0 37px; line-height: 30px } .post-navigation { margin: 30px 0 0; padding: 0; list-style: none; text-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center } .post-navigation li { display: inline-block; height: 50px; width: 50px; line-height: 50px; font-size: 18px; margin-right: 10px; text-align: center; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; color: #797687; border-radius: 50%; border: 1px solid #e5dada } .post-navigation li a { display: block; color: #797687 } .post-navigation li.prev { line-height: 54px; font-size: 24px } .post-navigation li.next { line-height: 54px; font-size: 24px } .post-navigation li:hover { border-color: #fa7070; background: #fa7070; -webkit-box-shadow: 0 20px 30px 0 rgba(176, 70, 70, .3); box-shadow: 0 20px 30px 0 rgba(176, 70, 70, .3) } .post-navigation li:hover a { color: #fff } .post-navigation li.active { background: #fa7070; color: #fff; -webkit-box-shadow: 0 20px 30px 0 rgba(176, 70, 70, .3); box-shadow: 0 20px 30px 0 rgba(176, 70, 70, .3) } .blog-single { padding-top: 120px } .blog-single .post { margin-bottom: 20px } .blog-single .post .blog-content { padding: 40px 0 20px } .blog-single .post .blog-content p { margin-bottom: 45px } .blog-single .post .blog-content h3 { margin-top: 42px; font-size: 34px; font-weight: 500; margin-bottom: 20px } .blog-single blockquote { margin-bottom: 42px; display: block } .blog-single .tagcloud span { color: #2b2350; display: inline-block; margin-right: 15px; font-size: 20px; font-weight: 500 } .blog-single .tagcloud a { line-height: 25px } .blog-share { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .blog-share .share-title p { color: #2b2350; display: inline-block; margin: 0; font-weight: 500; font-size: 20px } .share-link { margin: 0; padding: 0; list-style: none } .share-link li { display: inline-block; margin-right: 5px } .share-link li:last-child { margin-right: 0 } .share-link li a { display: block; height: 44px; width: 44px; text-align: center; line-height: 45px; color: #aba8a4; border-radius: 50%; font-size: 14px; border: 1px solid #e5dada } .share-link li a:hover { background: #fa7070; color: #fff; -webkit-box-shadow: 0 20px 30px 0 rgba(176, 70, 70, .3); box-shadow: 0 20px 30px 0 rgba(176, 70, 70, .3); border-color: #fa7070 } .pixsass_post_author_box { background: #fdf8f8; padding: 40px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-top: 80px; border-radius: 6px } .pixsass_post_author_box .profile_image { width: 80px; margin-right: 20px; border-radius: 50% } .pixsass_post_author_box .profile_image img { border-radius: 50% } .pixsass_post_author_box .profile_content { -webkit-box-flex: 1; -ms-flex: 1; flex: 1 } .pixsass_post_author_box .profile_content .profile_name { font-size: 20px; line-height: 28px; color: #2b2350; margin: 0 } .pixsass_post_author_box .profile_content .author-job { font-size: 16px; line-height: 28px; margin-bottom: 15px; display: inline-block } .pixsass_post_author_box .profile_content p { font-size: 18px; color: #797687; margin: 0; font-weight: 500 } .comment-area { padding: 110px 0 120px } .comment-area .coment-title { font-size: 24px; font-weight: 600; color: #2b2350; margin-bottom: 70px } .comment-list { margin: 0; padding: 0; list-style: none } .comment-list .comment .comment-body { display: -webkit-box; display: -ms-flexbox; display: flex; margin-bottom: 40px } .comment-list .comment .comment-body .comment-author { width: 70px; height: 70px; border-radius: 50%; margin-right: 30px } .comment-list .comment .comment-body .comment-author img { border-radius: 50% } .comment-list .comment .comment-body .comment-content { border-bottom: 1px solid #e6e5e0; padding-bottom: 30px; position: relative } .comment-list .comment .comment-body .comment-content h4 { margin-top: 0; margin-bottom: 7px; font-size: 16px } .comment-list .comment .comment-body .comment-content h4 a { color: #2b2350 } .comment-list .comment .comment-body .comment-content h4 a:hover { color: #fa7070 } .comment-list .comment .comment-body .comment-content .comment-reply-link { color: #2b2350; font-size: 15px; font-weight: 500 } .comment-list .comment .comment-body .comment-content .comment-reply-link i { margin-right: 6px; font-size: 16px } .comment-list .comment .comment-body .comment-content .comment-reply-link:hover { color: #fa7070 } .comment-list .comment .comment-body .comment-content .comment-metadata { margin-bottom: 10px } .comment-list .comment .comment-body .comment-content .comment-metadata a { font-size: 16px; color: #918f9c; font-weight: 400; line-height: 28px } .comment-list .comment .comment-body .comment-content .comment-metadata a:hover { color: #fa7070 } .comment-list .comment .comment-body.menu-comments .comment-author { width: 100px; height: 100px } .comment-list .comment .comment-body.menu-comments .comment-author img { width: 100% } .comment-list .children { margin: 0; padding-left: 150px; list-style: none } .comment-list .children .comment .comment-body .comment-author { width: 50px; height: 50px } .comment-respond .comment-reply-title { font-size: 24px; font-weight: 600; margin-bottom: 42px } .comment-form .comment-form-author, .comment-form .comment-form-email { width: 50%; float: left; margin-bottom: 30px } .comment-form .comment-form-author { padding-right: 15px } .comment-form .comment-form-email { padding-left: 15px } .comment-form input, .comment-form textarea { background: #fff; border: 0; font-size: 16px; padding: 15px 30px; background: #fdfafa; border: 1px solid #efe7e7; margin: 0 } .comment-form input::-webkit-input-placeholder, .comment-form textarea::-webkit-input-placeholder { color: #a7a5b1; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .comment-form input:-ms-input-placeholder, .comment-form textarea:-ms-input-placeholder { color: #a7a5b1; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .comment-form input::-ms-input-placeholder, .comment-form textarea::-ms-input-placeholder { color: #a7a5b1; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .comment-form input::placeholder, .comment-form textarea::placeholder { color: #a7a5b1; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .comment-form input:focus, .comment-form textarea:focus { background-color: #fff; -webkit-box-shadow: 0 20px 40px 0 rgba(79, 35, 35, .1); box-shadow: 0 20px 40px 0 rgba(79, 35, 35, .1) } .comment-form .comment-form-comment { margin-bottom: 21px } .comment-form textarea { height: 200px; border-radius: 20px } .form-footer { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .form-footer input { width: 15px; margin-right: 10px } .form-footer .condition { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .form-footer .condition span { font-size: 14px } .form-footer .submit-btn { padding: 8px 45px } .circle-blog { position: absolute; top: -11%; left: -11%; z-index: -1 } @media (max-width: 991px) { #blog-grid { padding: 19px 0 50px } .blog-post-archive { padding: 80px 0 70px } .blog-single { padding-top: 80px } .sidebar { margin-top: 40px } .comment-area { padding: 70px 0 80px } .form-footer { display: block; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .form-footer input { width: 15px; margin-right: 10px } .form-footer .condition { margin-bottom: 30px } .form-footer .condition span { font-size: 14px } .form-footer .submit-btn { padding: 8px 45px } .blog-grid-two { padding-top: 0; padding-bottom: 50px } } @media (max-width: 768px) { .form-footer .condition { -webkit-box-align: normal; -ms-flex-align: normal; align-items: normal } .form-footer .condition span { margin-top: -6px } } @media (max-width: 576px) { .comment-list .children { padding-left: 95px } .comment-list .children .comment .comment-body .comment-author { margin-right: 15px } .countup .scroll-circle { display: none } } @media (max-width: 480px) { .comment-form .comment-form-author, .comment-form .comment-form-email { width: 100%; padding: 0 } } .search-form-widget { position: relative } .search-form-widget label { margin: 0; display: block } .search-form-widget .search-field { background: 0 0; border: 0; padding: 19px 10px 19px 30px; font-size: 16px; font-weight: 400; margin: 0; border-radius: 45px; width: 100%; border: 1px solid #efe7e7; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .search-form-widget .search-field::-webkit-input-placeholder { color: #797687 } .search-form-widget .search-field:-ms-input-placeholder { color: #797687 } .search-form-widget .search-field::-ms-input-placeholder { color: #797687 } .search-form-widget .search-field::placeholder { color: #797687 } .search-form-widget .search-field:focus, .search-form-widget .search-field:hover { -webkit-box-shadow: 0 20px 40px 0 rgba(79, 35, 35, .1); box-shadow: 0 20px 40px 0 rgba(79, 35, 35, .1) } .search-form-widget button { bottom: 0; border: 0; background-color: transparent; color: #9e9c97; outline: 0; position: absolute; top: 5px; right: 20px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); font-size: 20px; color: #fa7070; -webkit-transform: rotateY(-180deg); transform: rotateY(-180deg) } .search-form-widget button:hover { color: #fa7070 } .widget:not(:last-child) { margin-bottom: 20px; z-index: 2 } .widget .widget-title { font-size: 20px; font-weight: 600; border-bottom: 1px solid #ebe3e3; padding-bottom: 13px; margin-bottom: 25px } .widget ul { margin: 0; padding: 0; list-style: none } .widget ul li a { font-size: 14px; line-height: 40px; color: #797687; font-weight: 500 } .widget ul li a:hover { color: #fa7070 } .gp-posts-widget-wrapper .post-item { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap } .gp-posts-widget-wrapper .post-item:not(:last-child) { margin-bottom: 30px } .gp-posts-widget-wrapper .post-item .post-widget-thumbnail { border-radius: 5px; overflow: hidden; width: 100px; margin-right: 30px } .gp-posts-widget-wrapper .post-item .post-widget-info { -webkit-box-flex: 1; -ms-flex: 1; flex: 1 } .gp-posts-widget-wrapper .post-item .post-widget-info .post-widget-title { font-size: 18px; font-weight: 500; line-height: 28px } .gp-posts-widget-wrapper .post-item .post-widget-info .post-widget-title a { color: #2b2350 } .gp-posts-widget-wrapper .post-item .post-widget-info .post-widget-title a:hover { color: #fa7070 } .gp-posts-widget-wrapper .post-item .post-widget-info .post-date { color: #797687; font-size: 15px; line-height: 28px; font-weight: 500 } .tagcloud a { font-size: 14px; background: #f3ecec; color: #797687; padding: 6px 21px; font-weight: 500; margin-bottom: 10px; margin-right: 4px; display: inline-block; border-radius: 30px } .tagcloud a:hover { background: #fa7070; color: #fff; -webkit-box-shadow: 0 20px 30px 0 rgba(176, 70, 70, .3); box-shadow: 0 20px 30px 0 rgba(176, 70, 70, .3); position: relative; z-index: 2 } .comment-list { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 30px } .comment-list .icon { height: 70px; width: 70px; line-height: 77px; text-align: center; color: #2b2350; background: #f3ecec; border-radius: 50%; color: #797687; margin-right: 30px; font-size: 20px } .comment-list .comment-content { -webkit-box-flex: 1; -ms-flex: 1; flex: 1 } .comment-list .comment-content h3 { color: #2b2350; font-size: 16px; margin-bottom: 10px } .comment-list .comment-content h3 span { color: #797687; font-weight: 400 } .comment-list .comment-content p { line-height: 26px; margin-bottom: 24px; font-weight: 500 } .comment-list .comment-content p a { color: #797687 } .comment-list .comment-content p a:hover { color: #fa7070 } @media (max-width: 768px) { .search-form-widget { margin-top: 80px } .search-form-widget label { width: 100% } } .signin { height: 1050px; position: relative; overflow: hidden } .signin .circle { position: absolute; left: -17%; top: -33% } .signin .animate-ball .ball { background: #fff7f8 } .signin .animate-ball .ball:nth-child(1) { top: 22%; left: -30% } .signin .animate-ball .ball:nth-child(2) { height: 60px; width: 60px } .signin .animate-ball .ball:nth-child(3) { bottom: 110px; right: auto; left: -20%; height: 80px; width: 80px } .signin .animate-ball .ball:nth-child(4) { bottom: 30%; right: auto; left: -41% } .signin .animate-ball .ball:nth-child(5) { top: auto; right: 100px; bottom: -430px } .signin-from-wrapper { height: 1050px; position: relative; z-index: 22 } .signin-from-wrapper .signin-from-inner { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); padding-right: 100px; position: relative; z-index: 222 } .signin-from-wrapper .signin-from-inner .title { font-size: 36px } .signin-from-wrapper .signin-from-inner input:focus { -webkit-box-shadow: 0 20px 40px 0 rgba(79, 35, 35, .1); box-shadow: 0 20px 40px 0 rgba(79, 35, 35, .1); background: #fff; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .signin-from-wrapper .signin-from-inner button { border: 0; padding: 11px 67px; outline: 0; margin-bottom: 33px; margin-top: 55px } .signin-from-wrapper .signin-from-inner p { margin-top: 10px; margin-bottom: 38px; font-size: 18px } .signin-from-wrapper .signin-from-inner p a { color: #fa7070 } .signin-banner { background: #fef8f8; position: absolute; right: 0; height: 100%; max-width: 48%; width: 100%; top: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .signin-banner .image-two { margin-left: -35px; margin-top: -140px } .signin-banner.signup-banner { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start } .signin-banner.signup-banner .image-one, .signin-banner.signup-banner .image-two { position: absolute; bottom: 0; margin: 0 } .signin-banner.signup-banner .image-one { left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); margin: 0 } .signin-banner.signup-banner .animate-image-inner { position: absolute; width: 100%; height: 450px; left: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%) } .condition { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .condition .styled-checkbox { position: absolute; opacity: 0; height: 20px; width: 16px; margin: 0 } .condition span { font-size: 14px } .styled-checkbox+label { position: relative; cursor: pointer; padding: 0; margin: 0; height: 20px } .styled-checkbox+label:before { content: ''; margin-right: 10px; display: inline-block; vertical-align: text-top; width: 16px; height: 16px; border: 2px solid #aba8a4; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .styled-checkbox:hover+label:before { border-color: #fa7070 } .styled-checkbox:checked+label:before { border-color: #fa7070 } .styled-checkbox:checked+label:after { content: ''; position: absolute; left: 3px; top: 9px; background: #fa7070; width: 2px; height: 2px; -webkit-box-shadow: 2px 0 0 #fa7070, 4px 0 0 #fa7070, 4px -2px 0 #fa7070, 4px -4px 0 #fa7070, 4px -6px 0 #fa7070, 4px -8px 0 #fa7070; box-shadow: 2px 0 0 #fa7070, 4px 0 0 #fa7070, 4px -2px 0 #fa7070, 4px -4px 0 #fa7070, 4px -6px 0 #fa7070, 4px -8px 0 #fa7070; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg) } .forget-link { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-top: 5px } .forget-link .forget { font-size: 14px; color: #9694a2 } .forget-link .forget:hover { color: #fa7070 } .singup-social { margin-bottom: 25px; padding: 0; list-style: none } .singup-social li { display: inline-block; margin-bottom: 10px } .singup-social li:not(:last-child) { margin-right: 4px } .singup-social li a { display: inline-block; padding: 11px 35px; color: #fff; border-radius: 30px; font-size: 16px; width: 180px; text-align: center } .singup-social li a i { margin-right: 10px } .singup-social li a:hover { opacity: .8 } .singup-social li:nth-child(1) a { background: #3b5998 } .singup-social li:nth-child(2) a { background: #dd4b39 } .singup-social li:nth-child(3) a { background: #55acee } @media (max-width: 991px) { .signin-from-wrapper .signin-from-inner { -webkit-transform: translateY(-47%); -ms-transform: translateY(-47%); transform: translateY(-47%) } .signin-from-wrapper .signin-from-inner .title { font-size: 30px } .signup input { margin-bottom: 20px } } @media (max-width: 991px) { .signin { height: auto } .signin-from-wrapper { height: auto } .signin-from-wrapper .signin-from-inner { position: relative; height: auto; z-index: 22; padding: 150px 0 36px; top: 0; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } .signin-from-wrapper .signin-from-inner .title { font-size: 30px } .signin-banner { position: relative; max-width: 100%; z-index: 222; padding: 80px 0 } .signin-banner .image-one { max-width: 200px } .signin-banner .image-two { max-width: 80px; margin-left: -20px; margin-top: -50px } .signin-banner.signup-banner { height: 350px } .signin-banner.signup-banner .animate-image-inner { height: 200px } .signin-banner.signup-banner .animate-image-inner .image-two img { width: 60px } } @media (max-width: 768px) { .signin-from-wrapper .signin-from-inner { padding: 100px 0 5px } .signin-banner.signup-banner { padding: 50px 0; height: 300px } } .error-page { background: #fef9f9; padding: 185px 0 165px } .error-content-wrapper img { margin-bottom: 30px } .error-content-wrapper .error-title { font-size: 40px; font-weight: 600; line-height: 1.3 } .error-content-wrapper p { font-size: 20px; margin-bottom: 47px } .error-content-wrapper .pix-btn { padding: 11px 67px } @media (max-width: 991px) { .error-page { background: #fef9f9; padding: 130px 0 80px } .error-content-wrapper .error-title { font-size: 35px; font-weight: 600; line-height: 1.3 } .error-content-wrapper p { font-size: 16px } } #footer { background: #fdf8f8 } #footer .footer-nner { padding: 40px 0 25px } #footer .widget.footer-widget .widget-title { color: #2b2350; font-size: 20px; font-weight: 500; margin-bottom: 38px; border-bottom: 0; padding-bottom: 0 } #footer .widget.footer-widget p { margin-bottom: 15px; font-size: 15px; color: #333 } #footer .footer-menu { margin-bottom: 15px; padding: 0; list-style: none; position: relative } #footer .footer-menu li:not(:last-child) { margin-bottom: 10px } #footer .footer-menu li a { display: block; color: #292929; font-weight: 400; line-height: 30px; position: relative } #footer .footer-menu li a:hover { color: #fa7070 } #footer .footer-social-link { margin: 0; padding: 0; list-style: none; margin-top: 30px } #footer .footer-social-link li { display: inline-block } #footer .footer-social-link li:not(:last-child) { margin-right: 10px } #footer .footer-social-link li a { height: 45px; width: 45px; line-height: 45px; border: 1px solid #e6dbdb; display: block; border-radius: 50%; color: #9694a1; text-align: center; font-size: 16px } #footer .footer-social-link li a:hover { background: #fa7070; border-color: #fa7070; color: #fff; -webkit-box-shadow: 0 20px 30px 0 rgba(176, 70, 70, .3); box-shadow: 0 20px 30px 0 rgba(176, 70, 70, .3) } #footer .site-info { padding: 12px 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; border-top: 1px solid #e4d9d9; position: relative; z-index: 3 } #footer .site-info p { margin: 0 } #footer .site-info p a { color: #fa7070; font-weight: 500 } #footer .site-info p a:hover { color: #f83f3f } #footer.footer-two { background: #f8f7fc } #footer.footer-two .footer-menu li a:hover { color: #7052fb } #footer.footer-two .footer-social-link li a:hover { background: #7052fb; border-color: #7052fb; -webkit-box-shadow: 0 20px 30px 0 rgba(90, 70, 176, .3); box-shadow: 0 20px 30px 0 rgba(90, 70, 176, .3) } #footer.footer-two .site-info { border-color: #f3f2f2 } #footer.footer-two .site-info p a { color: #7052fb } #footer.footer-two .site-info p a:hover { color: #4720fa } #footer.footer-two .footer-social-link li a { border-color: #dad8e3 } #footer.footer-two .site-info-menu li a:hover { color: #7052fb } #footer.footer-three { position: relative } #footer.footer-three .footer-nner { position: relative; z-index: 3 } #footer.footer-three .map-bg { text-align: center; position: absolute; top: 30px; left: 0; z-index: 0; width: 100% } #footer.footer-four .site-info { background: #f8f2f2; border-top: 1px solid #e4d9d9; padding: 25px 0 } #footer.footer-four .site-info .site-info-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } #footer.footer-five { background: #2c234d } #footer.footer-five .widget.footer-widget .widget-title { color: #fff } #footer.footer-five .widget p { color: #a39eb9 } #footer.footer-five .footer-menu li a { color: #a39eb9 } #footer.footer-five .footer-menu li a:hover { color: #7052fb } #footer.footer-five .footer-social-link li a { border-color: #615a7e; color: #a39eb9 } #footer.footer-five .footer-social-link li a:hover { background: #7052fb; -webkit-box-shadow: 0 20px 30px 0 rgba(90, 70, 176, .3); box-shadow: 0 20px 30px 0 rgba(90, 70, 176, .3); border-color: #7052fb; color: #fff } #footer.footer-five .site-info-menu li a { color: #9c99a7 } #footer.footer-five .site-info-menu li a:hover { color: #7052fb } #footer.footer-five .site-info { border-color: #3d355b } #footer.footer-five .site-info p { color: #9c99a7 } #footer.footer-five .site-info p a { color: #7052fb } .site-info-menu { margin: 0; padding: 0; list-style: none } .off { display: block; color: #2b2350; font-weight: 500 } .site-info-menu li { display: inline-block } .site-info-menu li a { display: inline-block; color: #868494; font-size: 14px } .site-info-menu li a:hover { color: #fa7070 } .mar-auto { margin: 0 auto } .v-align i { vertical-align: middle } .mt-10 { margin-top: 10px } .display-block { display: block } .pad-00 .col-lg-3 { padding: 0 } .pad-00 .col-lg-2 { padding: 0 } .mt-57 { margin-top: 50px; padding: 0 !important; border-right: 0 !important; border-bottom: 0 !important } .col-lg-2 .pricing-table .price-feture li { padding-left: 10px } .min-h67 { min-height: 67px } .sc-css { vertical-align: middle; align-items: center; display: flex } .bor-left { border-left: 1px solid #efe7e7 !important } .bor-top { border-top: 1px solid #efe7e7 } .pricing-table .price-feture li i { color: #363836; padding: 0 5px; display: flex; align-items: center; vertical-align: middle; font-family: eleganticons; font-style: normal } i.ok { font-size: 24px } i.close { font-size: 28px; color: red !important; opacity: 1 } .pl-0 { padding-left: 0; justify-content: center } .mb-90 { margin-bottom: 90px } .pricing-table .price-feture li i.ok:before { content: "\4e" } .pricing-table .price-feture li i.close:before { content: "\4d" } .border-rad-left { border-top-left-radius: 9px } .pricing-table.style-two.price-bg { background-color: rgba(197, 219, 242, .3) } .pad-btm-0 { padding-bottom: 0 !important } .del-css { color: #ea3848; font-weight: 600; font-size: 20px } .mt-25 { margin-top: 25px } .mb-25 { margin-bottom: 25px } .gst { font-size: 20px } .hide { display: none } .price i { font-size: 28px } .font-c { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" } .testimonial-two .testi-content-inner.highlighted.highlighted { background: #2c3435; background-image: linear-gradient(246deg, #3b3f63, #2f3350) } .review-slider { border-radius: 3px; background: #fff; text-align: center; padding: 12px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; -webkit-box-shadow: 0 30px 60px 0 rgba(48, 11, 33, .08); box-shadow: 0 0 10px 0 #d1d0d2; margin-bottom: 30px; background: #fff; border-bottom: 2px solid #2d2d2d } .review-slider .review-content-inner .review-score { padding: 0 10px; font-size: 28px; font-weight: 500; margin-bottom: 6px; text-align: left } span.score { font-size: 18px; color: #101010; font-weight: 600; opacity: 1 } div.cs-skin-border { background: 0 0; font-size: 2em; font-weight: 700; max-width: 600px } .shape_wrap [class*=shape] { position: absolute; pointer-events: none; z-index: 1 } .shape12 { right: 150px; top: 0; width: 150px; height: 90px } .shape13 { top: -40px; left: 10%; max-width: 34px } .shape14 { right: 150px; bottom: 10%; max-width: 32px } .shape15 { right: 10%; top: 45%; max-width: 30px } .animation5 { -webkit-animation: rotate 10s linear infinite; -moz-animation: rotate 10s linear infinite; -o-animation: rotate 10s linear infinite; animation: rotate 10s linear infinite } .animation1 { -webkit-animation: orbit 20s linear infinite; -moz-animation: orbit 20s linear infinite; -o-animation: orbit 20s linear infinite; animation: orbit 20s linear infinite } .animation4 { -webkit-animation: orbit4 20s linear infinite; -moz-animation: orbit4 20s linear infinite; -o-animation: orbit4 20s linear infinite; animation: orbit4 20s linear infinite } .animation2 { -webkit-animation: orbit2 15s linear infinite; -moz-animation: orbit2 15s linear infinite; -o-animation: orbit2 15s linear infinite; animation: orbit2 15s linear infinite; position: absolute } @-webkit-keyframes orbit { from { -webkit-transform: rotate(0) translate(calc(105px - 50%), -50%) rotate(0) } to { -webkit-transform: rotate(360deg) translate(calc(105px - 50%), -50%) rotate(-360deg) } } @-moz-keyframes orbit { from { -moz-transform: rotate(0) translate(calc(105px - 50%), -50%) rotate(0) } to { -moz-transform: rotate(360deg) translate(calc(105px - 50%), -50%) rotate(-360deg) } } @-o-keyframes orbit { from { -o-transform: rotate(0) translate(calc(105px - 50%), -50%) rotate(0) } to { -o-transform: rotate(360deg) translate(calc(105px - 50%), -50%) rotate(-360deg) } } @keyframes orbit { from { transform: rotate(0) translate(calc(105px - 50%), -50%) rotate(0) } to { transform: rotate(360deg) translate(calc(105px - 50%), -50%) rotate(-360deg) } } @-webkit-keyframes orbit2 { 0% { -webkit-transform: rotate(0); top: -25px; left: 10px } 20% { -webkit-transform: rotate(45deg); top: 0; left: 59px } 40% { -webkit-transform: rotate(-12deg); top: 55%; left: 47px } 60% { -webkit-transform: rotate(-120deg); top: 60px; left: -7px } 80% { -webkit-transform: rotate(60deg); top: 9px; left: -29px } 100% { -webkit-transform: rotate(0); top: -25px; left: 10px } } @-moz-keyframes orbit2 { 0% { -moz-transform: rotate(0); top: -25px; left: 10px } 20% { -moz-transform: rotate(45deg); top: 0; left: 59px } 40% { -moz-transform: rotate(-12deg); top: 55%; left: 47px } 60% { -moz-transform: rotate(-120deg); top: 60px; left: -7px } 80% { -moz-transform: rotate(60deg); top: 9px; left: -29px } 100% { -moz-transform: rotate(0); top: -25px; left: 10px } } @-o-keyframes orbit2 { 0% { -o-transform: rotate(0); top: -25px; left: 10px } 20% { -o-transform: rotate(45deg); top: 0; left: 59px } 40% { -o-transform: rotate(-12deg); top: 55%; left: 47px } 60% { -o-transform: rotate(-120deg); top: 60px; left: -7px } 80% { -o-transform: rotate(60deg); top: 9px; left: -29px } 100% { -o-transform: rotate(0); top: -25px; left: 10px } } @keyframes orbit2 { 0% { transform: rotate(0); top: -25px; left: 10px } 20% { transform: rotate(45deg); top: 0; left: 59px } 40% { transform: rotate(-12deg); top: 55%; left: 47px } 60% { transform: rotate(-120deg); top: 60px; left: -7px } 80% { transform: rotate(60deg); top: 9px; left: -29px } 100% { transform: rotate(0); top: -25px; left: 10px } } @-webkit-keyframes orbit3 { 0% { -webkit-transform: rotate(360deg) translate(calc(105px - 50%), -50%) rotate(-360deg) } 50% { -webkit-transform: rotate(180deg) translate(calc(105px - 50%), -50%) rotate(180deg) } 100% { -webkit-transform: rotate(0) translate(calc(105px - 50%), -50%) rotate(0) } } @-moz-keyframes orbit3 { 0% { -moz-transform: rotate(360deg) translate(calc(105px - 50%), -50%) rotate(-360deg) } 50% { -moz-transform: rotate(180deg) translate(calc(105px - 50%), -50%) rotate(180deg) } 100% { -moz-transform: rotate(0) translate(calc(105px - 50%), -50%) rotate(0) } } @-o-keyframes orbit3 { 0% { -o-transform: rotate(360deg) translate(calc(105px - 50%), -50%) rotate(-360deg) } 50% { -o-transform: rotate(180deg) translate(calc(105px - 50%), -50%) rotate(180deg) } 100% { -o-transform: rotate(0) translate(calc(105px - 50%), -50%) rotate(0) } } @keyframes orbit3 { 0% { transform: rotate(360deg) translate(calc(105px - 50%), -50%) rotate(-360deg) } 50% { transform: rotate(180deg) translate(calc(105px - 50%), -50%) rotate(180deg) } 100% { transform: rotate(0) translate(calc(105px - 50%), -50%) rotate(0) } } @-webkit-keyframes orbit4 { 0% { -webkit-transform: translate(0, 0) rotate(0); transform: translate(0, 0) rotate(0) } 20% { -webkit-transform: translate(73px, -1px) rotate(36deg); transform: translate(73px, -1px) rotate(36deg) } 40% { -webkit-transform: translate(141px, 72px) rotate(72deg); transform: translate(141px, 72px) rotate(72deg) } 60% { -webkit-transform: translate(83px, 122px) rotate(108deg); transform: translate(83px, 122px) rotate(108deg) } 80% { -webkit-transform: translate(-40px, 72px) rotate(144deg); transform: translate(-40px, 72px) rotate(144deg) } 100% { -webkit-transform: translate(0, 0) rotate(0); transform: translate(0, 0) rotate(0) } } @-moz-keyframes orbit4 { 0% { -moz-transform: translate(0, 0) rotate(0); transform: translate(0, 0) rotate(0) } 20% { -moz-transform: translate(73px, -1px) rotate(36deg); transform: translate(73px, -1px) rotate(36deg) } 40% { -moz-transform: translate(141px, 72px) rotate(72deg); transform: translate(141px, 72px) rotate(72deg) } 60% { -moz-transform: translate(83px, 122px) rotate(108deg); transform: translate(83px, 122px) rotate(108deg) } 80% { -moz-transform: translate(-40px, 72px) rotate(144deg); transform: translate(-40px, 72px) rotate(144deg) } 100% { -moz-transform: translate(0, 0) rotate(0); transform: translate(0, 0) rotate(0) } } @-o-keyframes orbit4 { 0% { -o-transform: translate(0, 0) rotate(0); transform: translate(0, 0) rotate(0) } 20% { -o-transform: translate(73px, -1px) rotate(36deg); transform: translate(73px, -1px) rotate(36deg) } 40% { -o-transform: translate(141px, 72px) rotate(72deg); transform: translate(141px, 72px) rotate(72deg) } 60% { -o-transform: translate(83px, 122px) rotate(108deg); transform: translate(83px, 122px) rotate(108deg) } 80% { -o-transform: translate(-40px, 72px) rotate(144deg); transform: translate(-40px, 72px) rotate(144deg) } 100% { -o-transform: translate(0, 0) rotate(0); transform: translate(0, 0) rotate(0) } } @keyframes orbit4 { 0% { transform: translate(0, 0) rotate(0); transform: translate(0, 0) rotate(0) } 20% { transform: translate(73px, -1px) rotate(36deg); transform: translate(73px, -1px) rotate(36deg) } 40% { transform: translate(141px, 72px) rotate(72deg); transform: translate(141px, 72px) rotate(72deg) } 60% { transform: translate(83px, 122px) rotate(108deg); transform: translate(83px, 122px) rotate(108deg) } 80% { transform: translate(-40px, 72px) rotate(144deg); transform: translate(-40px, 72px) rotate(144deg) } 100% { transform: translate(0, 0) rotate(0); transform: translate(0, 0) rotate(0) } } @-webkit-keyframes rotate { 0% { -webkit-transform: rotate(0) } 50% { -webkit-transform: rotate(180deg) } 100% { -webkit-transform: rotate(360deg) } } @-moz-keyframes rotate { 0% { -moz-transform: rotate(0) } 50% { -moz-transform: rotate(180deg) } 100% { -moz-transform: rotate(360deg) } } @-o-keyframes rotate { 0% { -o-transform: rotate(0) } 50% { -o-transform: rotate(180deg) } 100% { -o-transform: rotate(360deg) } } @keyframes rotate { 0% { transform: rotate(0) } 50% { transform: rotate(180deg) } 100% { transform: rotate(360deg) } } @-webkit-keyframes zoom-fade { 0% { -webkit-transform: scale(.8); transform: scale(.8) } 50% { -webkit-transform: scale(1); transform: scale(1) } 100% { -webkit-transform: scale(.8); transform: scale(.8) } } @keyframes zoom-fade { 0% { -webkit-transform: scale(.8); transform: scale(.8) } 50% { -webkit-transform: scale(1); transform: scale(1) } 100% { -webkit-transform: scale(.8); transform: scale(.8) } } .editor-content ul.list-items { margin-bottom: 50px } div.cs-select { display: inline-block; vertical-align: middle; position: relative; text-align: left; background: #fff; z-index: 100; width: 100%; max-width: 100%; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; width: 100% !important; -webkit-box-shadow: 0 6px 24px 0 rgba(174, 174, 186, .16); box-shadow: 0 6px 24px 0 rgba(174, 174, 186, .16) } .flex-css ul { display: inline-block } .flex-css ul.mar-r { margin-right: 35px; width: 45% } div.cs-select:focus { outline: 0 } .cs-select select { display: none } #footer .footer-menu li a:before { -moz-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out } #footer .footer-menu li a:before { content: '\24'; position: absolute; top: 0; left: -5px; opacity: 0; visibility: hidden; transition: all .3s ease-in-out; font-size: 16px; font-family: ElegantIcons } #footer .footer-menu li a:hover:before { opacity: 1; visibility: visible } #footer .footer-menu li a:hover { padding-left: 15px } .info.phone { margin-bottom: 14px } .cs-select span { display: block; position: relative; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0; list-style: none; word-wrap: break-word; font-size: 17px; line-height: 1.41; letter-spacing: .2px; color: #333e63; font-weight: 400; padding: 16px 24px } .cs-select>span { padding-right: 3em } .cs-select .cs-selected span::after, .cs-select>span::after { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale } .cs-select>span::after { content: '\25BE'; right: 1em } .cs-select .cs-selected span::after { content: '\2713'; margin-left: 1em } .cs-select.cs-active>span::after { -webkit-transform: translateY(-50%) rotate(180deg); transform: translateY(-50%) rotate(180deg) } div.cs-active { z-index: 200 } .cs-select .cs-options { position: absolute; overflow: hidden; width: 100%; background: #fff; visibility: hidden; top: 100%; left: 0; z-index: 101; max-height: 230px; background: #fff; -webkit-box-shadow: 0 12px 24px 0 rgba(174, 174, 186, .32); box-shadow: 0 12px 24px 0 rgba(174, 174, 186, .32) } .cs-select.cs-active .cs-options { visibility: visible } .cs-select ul { list-style: none; margin: 0; padding: 0; width: 100%; overflow-x: hidden; overflow-y: auto; max-height: 230px } .cs-select ul span { padding: 1em } .cs-select ul li.cs-focus span { background-color: #ddd } .faq-forms1 { padding-bottom: 76px } .cs-select li.cs-optgroup ul { padding-left: 1em } .cs-select li.cs-optgroup>span { cursor: default } h3.sub-title1 { font-size: 18px; font-weight: 400; color: #45524d; margin-top: 1% } @media screen and (max-width: 30em) { div.cs-skin-border { font-size: 1em } } div.cs-skin-border ::-webkit-scrollbar { -webkit-appearance: none; width: 7px } .e-bill { font-size: 12px; display: block; line-height: 14px } div.cs-skin-border ::-webkit-scrollbar-thumb { -webkit-border-radius: 4px; border-radius: 4px; background-color: rgba(0, 0, 0, .5); -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5); box-shadow: 0 0 1px rgba(255, 255, 255, .5) } .cs-skin-border>span { border: 5px solid #000; border-color: inherit; -webkit-transition: background .2s, border-color .2s; transition: background .2s, border-color .2s; position: relative; overflow: hidden; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; background: #fff; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-flex: 1; -webkit-flex: 1 0 auto; -ms-flex: 1 0 auto; flex: 1 0 auto; z-index: 1; font-size: 17px; line-height: 1.41; letter-spacing: .2px; padding: 0 24px; -webkit-appearance: none; -webkit-border-radius: 0; border-radius: 0; border: none; height: 60px; background-clip: padding-box; color: #333e63 } .faq-forms1 { padding-bottom: 76px } .cs-skin-border .cs-selected span::after, .cs-skin-border>span::after { font-family: ElegantIcons; content: '\43' } .cs-skin-border ul span::after { content: ''; opacity: 0 } .cs-skin-border .cs-selected span::after { content: '\43'; color: transparent; font-size: 1.5em; opacity: 1; -webkit-transition: opacity .2s; transition: opacity .2s } .cs-skin-border.cs-active>span { background: #fff; border-color: #fff; color: #2980b9 } .cs-skin-border .cs-options { color: #2980b9; font-size: .75em; opacity: 0; -webkit-transition: opacity .2s, visibility 0s .2s; transition: opacity .2s, visibility 0s .2s } .cs-skin-border.cs-active .cs-options { opacity: 1; -webkit-transition: opacity .2s; transition: opacity .2s } .cs-skin-border ul span { -webkit-backface-visibility: hidden; backface-visibility: hidden } .cs-skin-border .cs-options li span:hover, .cs-skin-border li.cs-focus span { background: #f5f3ec } @media (max-width: 991px) { #footer .footer-nner { padding: 76px 0 22px } #footer .site-info { padding: 21px 0 } #footer .widget.footer-widget .widget-title { margin-bottom: 25px } } @media (max-width: 768px) { #footer .footer-menu { margin-bottom: 40px } #footer .site-info { padding: 21px 0; display: block; text-align: center } #footer.footer-four .copyright { margin-bottom: 20px } #footer.footer-four .site-info .site-info-inner { display: block } } .btn-underline1 { color: #797687; font-size: 20px; position: relative; padding-bottom: 3px; font-weight: 500; align-items: center; line-height: 15px; margin: 0 auto } .btn-underline1 i { vertical-align: middle } .shape-bg { top: -58px } .h_map_area { background: snow; padding-top: 120px } .h_map_area .hosting_title { margin-bottom: 0 } .h_map { height: 470px } .max-h { height: 470px } .h_map ul { height: 100%; margin-bottom: 0; position: relative; text-align: unset } .h_map ul li, .h_map ul li a { display: block; position: absolute; width: 30px; height: 30px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center } .shape16 { left: 50%; bottom: 30%; max-width: 25px } .h_map ul li .place_name { font-size: 12px; font-weight: 500; line-height: 25px; color: #fff; border-radius: 45px; background: #f8636b; padding: 0 12px; text-transform: uppercase; position: absolute; top: -100%; width: -webkit-max-content; width: -moz-max-content; width: max-content; -webkit-box-shadow: 0 20px 30px 0 rgba(214, 43, 51, .2); box-shadow: 0 20px 30px 0 rgba(214, 43, 51, .2); z-index: 9 } .h_map ul li .place_name:before { content: ""; width: 0; height: 0; border-style: solid; border-width: 6px 5px 0 5px; border-color: #f8636b transparent transparent transparent; position: absolute; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); bottom: -5px } .h_map ul li .round { width: 8px; height: 8px; border-radius: 50%; background: #f8636b; position: relative } .h_map ul li .round:after, .h_map ul li .round:before { content: ""; width: 100%; height: 100%; position: absolute; border-radius: 50%; background: #f8636b } .h_map ul li .round:before { -webkit-transform: scale(2.6); -ms-transform: scale(2.6); transform: scale(2.6); opacity: .4 } .h_map ul li .round:after { -webkit-transform: scale(5); -ms-transform: scale(5); transform: scale(4); opacity: .2 } .h_map ul li .round .dot { position: absolute; left: 50%; top: 50%; width: 16px; height: 16px; border-radius: 50%; background: rgba(247, 98, 106, .35); -webkit-animation: pulsate 3s infinite; animation: pulsate 3s infinite; -webkit-animation-delay: 1.5s; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); animation-delay: 1.5s; will-change: transform } .h_map ul li:nth-child(1) { top: -16px; left: 25%; opacity: 0 } .h_map ul li:nth-child(2) { top: 27px; left: 165px; opacity: 0 } .h_map ul li:nth-child(3) { top: 53px; left: 37% } .h_map ul li:nth-child(4) { top: 85px; left: 25% } .h_map ul li:nth-child(5) { top: 20%; left: 29% } .h_map ul li:nth-child(6) { top: 26%; left: 97px } .h_map ul li:nth-child(7) { top: 25%; left: 35% } .h_map ul li:nth-child(8) { top: 29%; left: 55% } .h_map ul li:nth-child(9) { top: 8%; left: 20% } .h_map ul li:nth-child(10) { top: 185px; right: 130px; opacity: 0 } .h_map ul li:nth-child(11) { top: 128px; right: 20% } .h_map ul li:nth-child(12) { top: 188px; left: 63%; opacity: 0 } .h_map ul li:nth-child(13) { top: 40%; left: 52% } .h_map ul li:nth-child(14) { top: 55%; right: 39%; opacity: 0 } .h_map ul li:nth-child(15) { top: 48%; left: 43% } .h_map ul li:nth-child(16) { top: 42%; left: 31% } .h_map ul li:nth-child(17) { top: 44%; left: 32px } .h_map ul li:nth-child(18) { top: 265px; left: 130px } .h_map ul li:nth-child(19) { top: 74%; left: 37% } .h_map ul li:nth-child(20) { top: 79%; left: 20% } .h_map ul li:nth-child(21) { top: 105px; left: 61%; opacity: 0 } .h_map ul li:nth-child(22) { bottom: -3%; left: 24% } .h_map ul li:nth-child(23) { top: 92%; left: 31% } .h_map ul li:nth-child(24) { bottom: 27%; left: 34% } .h_map ul li:nth-child(25) { bottom: 25%; right: 16%; opacity: 0 } .h_map ul li:nth-child(26) { top: 12%; left: 80% } @-webkit-keyframes pulsate { 0% { opacity: 1; -webkit-transform: translate(-50%, -50%) scale(.5); transform: translate(-50%, -50%) scale(.5) } 100% { opacity: 0; -webkit-transform: translate(-50%, -50%) scale(4); transform: translate(-50%, -50%) scale(4) } } @keyframes pulsate { 0% { opacity: 1; -webkit-transform: translate(-50%, -50%) scale(.5); transform: translate(-50%, -50%) scale(.5) } 100% { opacity: 0; -webkit-transform: translate(-50%, -50%) scale(4); transform: translate(-50%, -50%) scale(4) } } .text-grad { color: #2b2350; -webkit-letter-spacing: -.015em; -moz-letter-spacing: -.015em; -ms-letter-spacing: -.015em; letter-spacing: -.015em; background: linear-gradient(360deg, #f7368a, #350bd9); -webkit-background-clip: text; -webkit-text-fill-color: transparent; -moz-background-clip: text; -moz-text-fill-color: transparent; max-width: 32ch } .Fixed-plan-bar { display: flex; align-items: center; justify-content: center; background: radial-gradient(circle, rgba(122, 88, 252, 1) 63%, rgba(0, 212, 255, 1) 100%); color: #fff; padding: 10px; width: 100%; height: 74px; text-align: center; vertical-align: middle; position: fixed; bottom: 0; z-index: 9 } .Fixed-plan-bar h6 { display: inline-block; font-size: 18px; margin: 0 8px; background-color: #f0f8ff; padding: 4px 15px; border-radius: 31px; font-weight: 500 } .price-bg { background-image: linear-gradient(-60deg, #7052fb 0, #8a60fd 100%) } .price-bg .del-css { color: #352573; font-size: 20px } .price-bg .monthly_price h2 { color: #fff } .price-bg p { color: #ececec } .monthly_price h2 { font-size: 1.8rem } .price-bg-xs .del-css { color: #f44336; font-size: 16px } .price-bg .monthly_price h2 { color: #fff } .price-bg-xs p { color: #525252; font-size: 14px; font-weight: 600 } .price-bg-xs .monthly_price h2 { text-align: center; font-size: 1.5rem; margin: 0 } .price-bg-xs .gst { color: #2b2350; opacity: .8; font-size: 12px; margin-right: 4px; font-weight: 600 } .vissible-xs { display: none } .action { padding: 20px 10px } .action p { margin-bottom: 0 } @media (max-width: 420px) { .hidden-xs { display: none } .vissible-xs { display: block } .page-banner .page-title { color: #333; padding-top: 30px } .Fixed-plan-bar { height: 100px; background: #9b00ed } .Fixed-plan-bar h6 { font-size: 15px; margin: 0 8px 10px } .font-style-xs { font-size: 20px; line-height: 30px; letter-spacing: .5px } .h_map { height: 360px } .shape-bg { top: -30px } svg.h100 { width: 360px !important } .h_map ul li .round { width: 6px; height: 6px } .h_map ul li, .h_map ul li a { width: 20px; height: 20px } .h_map ul li .round .dot { width: 16px; height: 16px } .h_map ul li:nth-child(3) { top: 42px } .h_map ul li:nth-child(4) { top: 62px; left: 24% } .h_map ul li:nth-child(6) { top: 23%; left: 12% } .h_map ul li:nth-child(7) { top: 25%; left: 46% } .h_map ul li:nth-child(11) { top: 87px; right: 15% } .h_map ul li:nth-child(13) { top: 37%; left: 56% } .h_map ul li:nth-child(16) { top: 38%; left: 32% } .h_map ul li:nth-child(17) { top: 38%; left: 25px } .h_map ul li:nth-child(18) { top: 53%; left: 18% } .h_map ul li:nth-child(19) { top: 65% } .h_map ul li:nth-child(20) { top: 65%; left: 21% } .h_map ul li:nth-child(22) { bottom: 10%; left: 23% } .h_map ul li:nth-child(23) { top: 80%; left: 32% } .h_map ul li:nth-child(24) { bottom: 37%; left: 34% } .post-post-grid { margin-bottom: 15px } .faq-forms1 { padding-bottom: 35px } #footer.footer-two { background: #f8f7fc !important } .interface-image-wrapper { height: 285px !important; overflow: hidden } .interface-toparea { padding-bottom: 40px !important } .interface-content .interface-title h2 { font-size: 28px; line-height: 40px; margin-top: 15px } } @media (min-width: 1401px) and (max-width: 16550px) { .container { max-width: 1320px } } @media (min-width: 1660px) and (max-width: 1920px) { .container { max-width: 1820px } }