@import url("https://fonts.googleapis.com/css?family=DM+Sans:400,400i,500,500i,700&display=swap"); * { -webkit-box-sizing: border-box; box-sizing: border-box; } article, aside, details, figcaption, figure, footer, header, nav, section, summary { display: block; } audio, canvas, video { display: inline-block; } audio:not([controls]) { display: none; height: 0; } [hidden] { display: none; } html, button, input, select, textarea { font-family: "Source Sans Pro", Helvetica, sans-serif; } a { text-decoration: none; } a:focus { outline: thin dotted; } a:active, a:hover { outline: 0; } a:hover { text-decoration: underline; } address { margin: 0 0 24px; } abbr[title] { border-bottom: 1px dotted; } b, strong { font-weight: bold; } dfn { font-style: italic; } p { margin: 0 0 10px; } code, kbd, pre, samp { font-family: monospace, serif; font-size: 14px; -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; } pre { background: #f5f5f5; color: #666; font-family: monospace; font-size: 14px; margin: 20px 0; overflow: auto; padding: 20px; white-space: pre; white-space: pre-wrap; word-wrap: break-word; } blockquote, q { -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ""; content: none; } blockquote { font-size: 18px; font-style: italic; font-weight: 300; margin: 24px 40px; } blockquote blockquote { margin-right: 0; } blockquote cite, blockquote small { font-size: 14px; font-weight: normal; text-transform: uppercase; } blockquote em, blockquote i { font-style: normal; font-weight: 300; } blockquote strong, blockquote b { font-weight: 400; } small { font-size: smaller; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } dl { margin: 0 20px; } dt { font-weight: bold; } dd { margin: 0 0 20px; } menu, ol, ul { margin: 16px 0; padding: 0 0 0 40px; } ul { list-style-type: square; } nav ul, nav ol { list-style: none; list-style-image: none; } li > ul, li > ol { margin: 0; } img { -ms-interpolation-mode: bicubic; border: 0; vertical-align: middle; } svg:not(:root) { overflow: hidden; } figure { margin: 0; } form { margin: 0; } fieldset { border: 1px solid #c0c0c0; margin: 0 2px; min-width: inherit; padding: 0.35em 0.625em 0.75em; } legend { border: 0; padding: 0; white-space: normal; } button, input, select, textarea { font-size: 100%; margin: 0; max-width: 100%; vertical-align: baseline; } button, input { line-height: normal; } button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; -moz-appearance: button; appearance: button; cursor: pointer; } button[disabled], input[disabled] { cursor: default; } input[type="checkbox"], input[type="radio"] { padding: 0; } input[type="search"] { -webkit-appearance: textfield; -moz-appearance: textfield; appearance: textfield; appearance: textfield; padding-right: 2px; width: 270px; } input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; appearance: none; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } textarea { overflow: auto; vertical-align: top; } table { border-bottom: 1px solid #ededed; border-collapse: collapse; border-spacing: 0; font-size: 14px; line-height: 2; margin: 0 0 20px; width: 100%; } caption, th, td { font-weight: normal; text-align: left; } caption { font-size: 16px; margin: 20px 0; } th { font-weight: bold; text-transform: uppercase; } td { border-top: 1px solid #ededed; padding: 6px 10px 6px 0; } del { color: #333; } ins { background: #fff9c0; text-decoration: none; } hr { background-size: 4px 4px; border: 0; height: 1px; margin: 0 0 24px; } /** * Typography */ * { -webkit-box-sizing: border-box; box-sizing: border-box; } html { overflow: hidden; overflow-y: auto; } body { overflow: hidden; font-size: 18px; line-height: 24px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-family: "DM Sans", sans-serif; color: #757589; font-weight: 400; } @media only screen and (max-width: 767px) { body { font-size: 16px; line-height: 26px; } } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, address, p, pre, blockquote, dl, dd, menu, ol, ul, table, caption, hr { margin: 0; margin-bottom: 15px; } h1, h2, h3, h4, h5, h6 { font-family: 'Rubik', "DM Sans", sans-serif; /* "DM Sans" */ color: #656d78; /* 000248 */ font-weight: 700; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit; } h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover { text-decoration: none; } h1 { font-size: 56px; line-height: 68px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { h1 { font-size: 50px; line-height: 66px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { h1 { font-size: 48px; line-height: 64px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { h1 { font-size: 44px; line-height: 55px; } } @media only screen and (max-width: 767px) { h1 { font-size: 40px; line-height: 50px; } } @media only screen and (max-width: 575px) { h1 { font-size: 36px; line-height: 45px; } } h1.axil-display-1 { font-size: 80px; line-height: 90px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { h1.axil-display-1 { font-size: 55px; line-height: 68px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { h1.axil-display-1 { font-size: 55px; line-height: 68px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { h1.axil-display-1 { font-size: 44px; line-height: 55px; } } @media only screen and (max-width: 767px) { h1.axil-display-1 { font-size: 40px; line-height: 50px; } } @media only screen and (max-width: 575px) { h1.axil-display-1 { font-size: 36px !important; line-height: 45px !important; } } h2 { font-size: 50px; line-height: 62px; } h3 { font-size: 35px; line-height: 46px; } h4 { font-size: 26px; line-height: 32px; } h5 { font-size: 22px; line-height: 26px; } h6 { font-size: 16px; line-height: 22px; } @media only screen and (min-width: 768px) and (max-width: 991px) { h1 { font-size: 52px; } h2 { font-size: 48px; } h3 { font-size: 33px; } } @media only screen and (max-width: 767px) { h1 { font-size: 40px; line-height: 50px; } h1 br { display: none; } h2 { font-size: 30px; line-height: 40px; } h2 br { display: none; } h3 { font-size: 24px; line-height: 36px; } h3 br { display: none; } h4 { font-size: 20px; line-height: 29px; } h4 br { display: none; } } p { font-size: 18px; line-height: 28px; color: #757589; } @media only screen and (max-width: 767px) { p { font-size: 16px; line-height: 26px; } } p.subtitle-1 { font-size: 15px; line-height: 24px; } @media only screen and (max-width: 767px) { p.subtitle-1 { font-size: 16px; line-height: 26px; } } p.subtitle-2 { font-size: 20px; line-height: 32px; } @media only screen and (max-width: 767px) { p.subtitle-2 { font-size: 18px; line-height: 28px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { p.subtitle-2 { font-size: 18px; line-height: 28px; } p.subtitle-2 br { display: none; } } @media only screen and (max-width: 767px) { p.subtitle-2 { font-size: 16px; line-height: 26px; } p.subtitle-2 br { display: none; } } p.subtitle-3 { color: #52526C; font-size: 24px; line-height: 38px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { p.subtitle-3 { font-size: 20px; line-height: 32px; } } @media only screen and (max-width: 767px) { p.subtitle-3 { font-size: 16px; line-height: 26px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { p.subtitle-3 { font-size: 20px; line-height: 34px; } } p:last-child { margin: 0; } /* List Style */ ul, ol { padding-left: 18px; } ul.list-secondary li { font-size: 15px; position: relative; } ul.list-secondary li::before { font-family: "Font Awesome 5 Pro"; content: "\f105"; position: absolute; top: 0; left: -18px; font-size: 14px; line-height: inherit; color: inherit; font-weight: 900; } ul.list-secondary li::after { display: none; } ul.list-secondary li a { color: inherit; } ul.list-secondary li:hover a { color: #0ac775; text-decoration: none; } ul.list-secondary li:hover::before { color: #0ac775; } ul.bullet-list li { position: relative; padding-left: 20px; } ul.bullet-list li::after { content: ""; position: absolute; top: 50%; left: 0; width: 6px; height: 6px; display: block; border-radius: 50%; background: #757589; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } ul li:hover { color: #0ac775; text-decoration: none; } ol { padding-left: 18px; } ol li { font-size: 17px; line-height: 36px; font-weight: 400; color: #4d4d4d; } a:hover, a:focus, a:active { outline: none; } a:visited { color: inherit; } a { outline: none; color: #000248; text-decoration: underline; display: inline-block; } a:hover { color: #0ac775; } input, button, select, textarea { background: transparent; border: 1px solid #D3D3D3; -webkit-transition: all 0.4s ease-out 0s; -o-transition: all 0.4s ease-out 0s; transition: all 0.4s ease-out 0s; color: #757589; } input:focus, input:active, button:focus, button:active, select:focus, select:active, textarea:focus, textarea:active { outline: none; border-color: #0ac775; } /** * Correct the inability to style clickable types in iOS and Safari. */ button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } input, select, textarea { width: 100%; font-size: 14px; } input, select { height: 40px; padding: 0 15px; } /*===================== All Extend Here =======================*/ ul.social-share.social-share-style-2 li a:hover i, ul.social-share.social-share-style-2 li a:hover span { color: #0ac775; } ul.mainmenu li a { color: #000248; } ul.social-share.social-share-style-2 li a:hover i, ul.social-share.social-share-style-2 li a:hover span { color: #0ac775; } [data-overlay]:before { background: #0ac775; } ul.mainmenu, .side-nav .side-nav-inner .side-nav-content ul.main-navigation, .popup-mobile-manu .inner .menu-item ul.mainmenu-item, ul.social-share, ul.followers-list, .axil-blog-list .blog-top .author .info ul.blog-meta, .axil-breadcrumb-area.breadcrumb-style-2 ul.ax-breadcrumb, .axil-single-widget.category ul.category-list, .axil-single-widget.share ul.social-list, .axil-single-widget.small-post-wrapper .small-post .content ul.blog-meta, .axil-single-widget.tags ul.tags-list, .axil-blog-details-area .blog-top .author .info ul.blog-meta { padding: 0; margin: 0; list-style: none; } .liststyle { padding: 0; margin: 0; list-style: none; } .link-hover a, #scrollUp, ul.mainmenu li a, ul.mainmenu li.has-dropdown ul.axil-submenu li a, .close-sidenav button.close-button i, .side-nav .side-nav-inner .form-group button.side-nav-search-btn i, .side-nav .side-nav-inner .side-nav-content ul.main-navigation li a, .side-nav .side-nav-inner .side-nav-content .axil-contact-info-inner .axil-contact-info .address p a, .axil-scroll-navigation .nav .nav-item a::after, a.axil-button.axil-link-button::after, button.axil-button.axil-link-button::after, .ft-social-share li a, ul.social-share li a, ul.social-share li a i, ul.social-share.social-share-style-2 li a i, ul.social-share.social-share-style-2 li a span, ul.social-share.style-rounded li a, ul.social-share.style-rounded.bg-color--white li a, ul.followers-list li a span, .axil-service .inner .content h4.title a, .axil-service .inner .content a.axil-button, .axil-service .inner .content a.axil-button::after, .axil-service.service-bg-gray .inner, .axil-contact-form.contact-form-style-1 .callto-action-wrapper span a, .form-group input[type="submit"], .axil-testimonial, .axil-testimonial .inner::after, .axil-testimonial .description a.axil-link-button, .axil-testimonial .description a.axil-link-button::after, .brand-list li a, .brand-list li a img, .axil-blog-list .blog-top .title a, .axil-call-to-action .callto-action > span a, .axil-case-study .content .inner h4.title a, .axil-accordion .card .card-header h5 .btn.btn-link, .axil-accordion .card .collapse::after, .axil-accordion--2 .card .card-header .btn.btn-link, .axil-breadcrumb-area.breadcrumb-style-2 ul.ax-breadcrumb li a, .axil-address-list .axil-address p a, .axil-single-widget.small-post-wrapper .small-post .content h6 a, .axil-single-widget.tags ul.tags-list li a, .privacy-policy-area a::after, .pv-banner-area .inner a.scroll-down-btn, .pv-banner-area .inner a.scroll-down-btn span, .single-demo a h5.title, .pv-footer-styles .pv-copyright-area .copyright-inner .inner-left .quick-links li a { -webkit-transition: all .5s; -o-transition: all .5s; transition: all .5s; } ul.mainmenu li a, a.axil-button, button.axil-button { font-weight: 700; } .footer-default .footer-widget-item ul.ft-menu li a, .copyright-default .quick-contact ul li a { font-weight: 400; } .textUpper { text-transform: uppercase; } .textCap { text-transform: capitalize; } p:last-child { margin-bottom: 0; } .font-1 { font-family: "DM Sans", sans-serif; } .font-2 { font-family: "Lato", sans-serif; } .bg_image { background-repeat: no-repeat; background-size: cover; background-position: center center; } /*---------------------- Animation Css -----------------------*/ @-webkit-keyframes customOne { from { -webkit-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(0.9); transform: scale(0.9); } to { -webkit-transform: scale(1); transform: scale(1); } } @keyframes customOne { from { -webkit-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(0.9); transform: scale(0.9); } to { -webkit-transform: scale(1); transform: scale(1); } } @-webkit-keyframes customTwo { 0% { -webkit-transform: translate(0px, 0px); transform: translate(0px, 0px); } 50% { -webkit-transform: translate(100px, 0px); transform: translate(100px, 0px); } 100% { -webkit-transform: translate(50px, 50px); transform: translate(50px, 50px); } } @keyframes customTwo { 0% { -webkit-transform: translate(0px, 0px); transform: translate(0px, 0px); } 50% { -webkit-transform: translate(100px, 0px); transform: translate(100px, 0px); } 100% { -webkit-transform: translate(50px, 50px); transform: translate(50px, 50px); } } .customOne { -webkit-animation: customOne 2s infinite; animation: customOne 2s infinite; } /*------------------------ Move Up Animation ---------------------------*/ .move-up { -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); } .move-up.animate { -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-animation: moveVertical .65s ease forwards; animation: moveVertical .65s ease forwards; } /* ------------------------ Custom Animation 01 ----------------------------*/ @-webkit-keyframes headerSlideDown { 0% { margin-top: -100px; } to { margin-top: 0; } } @keyframes headerSlideDown { 0% { margin-top: -100px; } to { margin-top: 0; } } /*------------------------ slidefadeinup --------------------------*/ @-webkit-keyframes slideFadeInUp { from { opacity: 0; -webkit-transform: translate3d(0, 20%, 0); transform: translate3d(0, 20%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes slideFadeInUp { from { opacity: 0; -webkit-transform: translate3d(0, 20%, 0); transform: translate3d(0, 20%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .slideFadeInUp { -webkit-animation-name: slideFadeInUp; animation-name: slideFadeInUp; } /* ----------------------------------- Custom Animation For All Page ---------------------------------------*/ @-webkit-keyframes moveVertical { to { opacity: 1; -webkit-transform: translateY(0); } } @keyframes moveVertical { to { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } /*---------------------- Animated Text -----------------------*/ @-webkit-keyframes animateBorder { 0% { -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: left; transform-origin: left; } 50% { -webkit-transform: scaleX(1); transform: scaleX(1); -webkit-transform-origin: left; transform-origin: left; } 51% { -webkit-transform: scaleX(1); transform: scaleX(1); -webkit-transform-origin: right; transform-origin: right; } 100% { -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: right; transform-origin: right; } } @keyframes animateBorder { 0% { -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: left; transform-origin: left; } 50% { -webkit-transform: scaleX(1); transform: scaleX(1); -webkit-transform-origin: left; transform-origin: left; } 51% { -webkit-transform: scaleX(1); transform: scaleX(1); -webkit-transform-origin: right; transform-origin: right; } 100% { -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: right; transform-origin: right; } } .box span { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; -webkit-box-sizing: border-box; box-sizing: border-box; } .box span:nth-child(1) { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } .box span:nth-child(2) { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); left: auto; right: 0; } .box span:nth-child(3) { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .box span:nth-child(4) { -webkit-transform: rotate(270deg); -ms-transform: rotate(270deg); transform: rotate(270deg); } .box span::before { content: ''; position: absolute; width: 100%; height: 2px; background: #ffffff; -webkit-animation: animateBorder 4s linear infinite; animation: animateBorder 4s linear infinite; } .box span:nth-child(1)::before { left: 0; } .box span:nth-child(2)::before { top: -122px; right: 0; } .box span:nth-child(4)::before { top: -121px; left: 0; } .box span:nth-child(3)::before { right: 0; left: auto; } /*-------------------------- Scroll Line Animation ----------------------------*/ @-webkit-keyframes line1 { 0% { opacity: 1; bottom: 0; } 30% { bottom: 30%; } 50% { bottom: 50%; } 70% { bottom: 70%; } 100% { bottom: 100%; opacity: 0.5; } } @keyframes line1 { 0% { opacity: 1; bottom: 0; } 30% { bottom: 30%; } 50% { bottom: 50%; } 70% { bottom: 70%; } 100% { bottom: 100%; opacity: 0.5; } } @-webkit-keyframes line5 { 0% { opacity: 1; bottom: 400px; } 50% { bottom: 50%; } 100% { bottom: 100%; opacity: 0.5; } } @keyframes line5 { 0% { opacity: 1; bottom: 400px; } 50% { bottom: 50%; } 100% { bottom: 100%; opacity: 0.5; } } @-webkit-keyframes line2 { 0% { opacity: 1; top: 0; } 30% { bottom: 30%; } 50% { bottom: 50%; } 70% { bottom: 70%; } 100% { top: 100%; opacity: 0.5; } } @keyframes line2 { 0% { opacity: 1; top: 0; } 30% { bottom: 30%; } 50% { bottom: 50%; } 70% { bottom: 70%; } 100% { top: 100%; opacity: 0.5; } } @-webkit-keyframes line3 { 0% { opacity: 1; top: 500px; } 50% { top: 50%; } 100% { top: 100%; opacity: 0.5; } } @keyframes line3 { 0% { opacity: 1; top: 500px; } 50% { top: 50%; } 100% { top: 100%; opacity: 0.5; } } @-webkit-keyframes line4 { 0% { opacity: 1; top: 300px; } 50% { top: 50%; } 100% { top: 100%; opacity: 0.5; } } @keyframes line4 { 0% { opacity: 1; top: 300px; } 50% { top: 50%; } 100% { top: 100%; opacity: 0.5; } } /*-------------------------------- Scroll Down Button Animation ----------------------------------*/ @-webkit-keyframes scrollDown { 0% { opacity: 0; } 10% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } 100% { -webkit-transform: translateY(10px); transform: translateY(10px); opacity: 0; } } @keyframes scrollDown { 0% { opacity: 0; } 10% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } 100% { -webkit-transform: translateY(10px); transform: translateY(10px); opacity: 0; } } /*====================== Custom Animation ========================*/ .link-hover a { display: inline-block; padding: 3px 0; position: relative; overflow: hidden; -webkit-transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s; -o-transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s; transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s; z-index: 1; } .link-hover a::after { content: ""; width: 0; height: 1px; bottom: 0; position: absolute; left: auto; right: 0; z-index: -1; -webkit-transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s; -o-transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s; transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s; background: currentColor; } .link-hover a:hover::after { width: 100%; left: 0; right: auto; } .link-hover.color-var--2 a:hover { color: #5BCC9F !important; } /* SPLITTING */ .splitting .word, .splitting .char { display: inline-block; } .splitting .char { position: relative; } .animated .char { display: inline-block; -webkit-animation: texteffect 0.6s cubic-bezier(0.5, 0, 0.5, 1) both; animation: texteffect 0.6s cubic-bezier(0.5, 0, 0.5, 1) both; -webkit-animation-delay: calc(10ms * var(--char-index)); animation-delay: calc(10ms * var(--char-index)); } /* ANIMATIONS */ @-webkit-keyframes texteffect { 0% { -webkit-transform: translateY(50%); transform: translateY(50%); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @keyframes texteffect { 0% { -webkit-transform: translateY(50%); transform: translateY(50%); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @keyframes texteffect { 0% { -webkit-transform: translateY(50%); transform: translateY(50%); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } /* REVEAL EFFECT */ .reveal-effect { position: relative; } .reveal-effect > * { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); animation-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); position: relative; } .reveal-effect > * { -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; } .reveal-effect { -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; -o-transition-property: transform; transition-property: transform; transition-property: transform, -webkit-transform; } .reveal-effect { -webkit-transition-duration: 1.2s; -o-transition-duration: 1.2s; transition-duration: 1.2s; -webkit-transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1); -o-transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1); transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1); } .reveal-effect.animated { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .reveal-effect.animated * { -webkit-animation-name: show-img-1; animation-name: show-img-1; } .reveal-effect::after { -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); animation-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); } .reveal-effect::after { content: ""; width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0; } .reveal-effect::after { -webkit-transform-origin: left top; -ms-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(0.05, 0); -ms-transform: scale(0.05, 0); transform: scale(0.05, 0); -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); animation-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); } .reveal-effect.masker::after { background-color: rgba(0, 2, 72, 0.3); } .reveal-effect.animated::after { -webkit-animation-name: slide-bg-2; animation-name: slide-bg-2; } @-webkit-keyframes show-img-1 { 0%, 66.6% { visibility: hidden; } 100%, 66.7% { visibility: visible; } } @keyframes show-img-1 { 0%, 66.6% { visibility: hidden; } 100%, 66.7% { visibility: visible; } } @-webkit-keyframes slide-bg-2 { 33.3% { -webkit-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(0.05, 1); transform: scale(0.05, 1); } 66.6% { -webkit-transform-origin: left center; transform-origin: left center; -webkit-transform: scale(1, 1); transform: scale(1, 1); } 66.7% { -webkit-transform-origin: right center; transform-origin: right center; -webkit-transform: scale(1, 1); transform: scale(1, 1); } 100% { -webkit-transform-origin: right center; transform-origin: right center; -webkit-transform: scale(0, 1); transform: scale(0, 1); } } @keyframes slide-bg-2 { 33.3% { -webkit-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(0.05, 1); transform: scale(0.05, 1); } 66.6% { -webkit-transform-origin: left center; transform-origin: left center; -webkit-transform: scale(1, 1); transform: scale(1, 1); } 66.7% { -webkit-transform-origin: right center; transform-origin: right center; -webkit-transform: scale(1, 1); transform: scale(1, 1); } 100% { -webkit-transform-origin: right center; transform-origin: right center; -webkit-transform: scale(0, 1); transform: scale(0, 1); } } /*! Animate.css - http://daneden.me/animate Version - 3.4.0 Licensed under the MIT license - http://opensource.org/licenses/MIT Copyright (c) 2015 Daniel Eden */ .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } .animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s; } .animated.bounceIn, .animated.bounceOut { -webkit-animation-duration: .75s; animation-duration: .75s; } .animated.flipOutX, .animated.flipOutY { -webkit-animation-duration: .75s; animation-duration: .75s; } @-webkit-keyframes bounce { from, 20%, 53%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 40%, 43% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } 70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); } 90% { -webkit-transform: translate3d(0, -4px, 0); transform: translate3d(0, -4px, 0); } } @keyframes bounce { from, 20%, 53%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 40%, 43% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } 70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); } 90% { -webkit-transform: translate3d(0, -4px, 0); transform: translate3d(0, -4px, 0); } } .bounce { -webkit-animation-name: bounce; animation-name: bounce; -webkit-transform-origin: center bottom; -ms-transform-origin: center bottom; transform-origin: center bottom; } @-webkit-keyframes flash { from, 50%, to { opacity: 1; } 25%, 75% { opacity: 0; } } @keyframes flash { from, 50%, to { opacity: 1; } 25%, 75% { opacity: 0; } } .flash { -webkit-animation-name: flash; animation-name: flash; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes pulse { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes pulse { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .pulse { -webkit-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes rubberBand { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 30% { -webkit-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); } 40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); } 50% { -webkit-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.85, 1); } 65% { -webkit-transform: scale3d(0.95, 1.05, 1); transform: scale3d(0.95, 1.05, 1); } 75% { -webkit-transform: scale3d(1.05, 0.95, 1); transform: scale3d(1.05, 0.95, 1); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes rubberBand { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 30% { -webkit-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); } 40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); } 50% { -webkit-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.85, 1); } 65% { -webkit-transform: scale3d(0.95, 1.05, 1); transform: scale3d(0.95, 1.05, 1); } 75% { -webkit-transform: scale3d(1.05, 0.95, 1); transform: scale3d(1.05, 0.95, 1); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .rubberBand { -webkit-animation-name: rubberBand; animation-name: rubberBand; } @-webkit-keyframes shake { from, to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 20%, 40%, 60%, 80% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } } @keyframes shake { from, to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 20%, 40%, 60%, 80% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } } .shake { -webkit-animation-name: shake; animation-name: shake; } @-webkit-keyframes swing { 20% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg); } 40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg); } 60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg); } 80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg); } to { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); } } @keyframes swing { 20% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg); } 40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg); } 60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg); } 80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg); } to { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); } } .swing { -webkit-transform-origin: top center; -ms-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; animation-name: swing; } @-webkit-keyframes tada { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 10%, 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); } 40%, 60%, 80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes tada { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 10%, 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); } 40%, 60%, 80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .tada { -webkit-animation-name: tada; animation-name: tada; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes wobble { from { -webkit-transform: none; transform: none; } 15% { -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); } 30% { -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); } 45% { -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); } 60% { -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); } 75% { -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); } to { -webkit-transform: none; transform: none; } } @keyframes wobble { from { -webkit-transform: none; transform: none; } 15% { -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); } 30% { -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); } 45% { -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); } 60% { -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); } 75% { -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); } to { -webkit-transform: none; transform: none; } } .wobble { -webkit-animation-name: wobble; animation-name: wobble; } @-webkit-keyframes jello { from, 11.1%, to { -webkit-transform: none; transform: none; } 22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg); } 33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg); } 44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg); } 55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg); } 66.6% { -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg); transform: skewX(-0.78125deg) skewY(-0.78125deg); } 77.7% { -webkit-transform: skewX(0.39063deg) skewY(0.39063deg); transform: skewX(0.39063deg) skewY(0.39063deg); } 88.8% { -webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg); transform: skewX(-0.19531deg) skewY(-0.19531deg); } } @keyframes jello { from, 11.1%, to { -webkit-transform: none; transform: none; } 22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg); } 33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg); } 44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg); } 55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg); } 66.6% { -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg); transform: skewX(-0.78125deg) skewY(-0.78125deg); } 77.7% { -webkit-transform: skewX(0.39063deg) skewY(0.39063deg); transform: skewX(0.39063deg) skewY(0.39063deg); } 88.8% { -webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg); transform: skewX(-0.19531deg) skewY(-0.19531deg); } } .jello { -webkit-animation-name: jello; animation-name: jello; -webkit-transform-origin: center; -ms-transform-origin: center; transform-origin: center; } @-webkit-keyframes bounceIn { from, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(0.97, 0.97, 0.97); transform: scale3d(0.97, 0.97, 0.97); } to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes bounceIn { from, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(0.97, 0.97, 0.97); transform: scale3d(0.97, 0.97, 0.97); } to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .bounceIn { -webkit-animation-name: bounceIn; animation-name: bounceIn; } @-webkit-keyframes bounceInDown { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); } 75% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 90% { -webkit-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0); } to { -webkit-transform: none; transform: none; } } @keyframes bounceInDown { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); } 75% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 90% { -webkit-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0); } to { -webkit-transform: none; transform: none; } } .bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } to { -webkit-transform: none; transform: none; } } @keyframes bounceInLeft { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } to { -webkit-transform: none; transform: none; } } .bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } to { -webkit-transform: none; transform: none; } } @keyframes bounceInRight { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } to { -webkit-transform: none; transform: none; } } .bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceInUp { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes bounceInUp { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .bounceInUp { -webkit-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceOut { 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } to { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } } @keyframes bounceOut { 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } to { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } } .bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut; } @-webkit-keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } @keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } .bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } @keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } .bounceOutLeft { -webkit-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } @keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } @keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } .bounceOutUp { -webkit-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInDown { from { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDown { from { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInDownBig { from { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDownBig { from { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeft { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeft { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInLeftBig { from { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeftBig { from { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRight { from { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRight { from { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInRightBig { from { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRightBig { from { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeInUp { from { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInUp { from { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInUpBig { from { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInUpBig { from { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInUpBig { -webkit-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } @keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } .fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOutDown { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } @keyframes fadeOutDown { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } .fadeOutDown { -webkit-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutDownBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } @keyframes fadeOutDownBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } .fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeft { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @keyframes fadeOutLeft { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } .fadeOutLeft { -webkit-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutLeftBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } @keyframes fadeOutLeftBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } .fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRight { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } @keyframes fadeOutRight { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } .fadeOutRight { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutRightBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } @keyframes fadeOutRightBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } .fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes fadeOutUp { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } @keyframes fadeOutUp { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } .fadeOutUp { -webkit-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutUpBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } @keyframes fadeOutUpBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } .fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes flip { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); transform: perspective(400px) rotate3d(0, 1, 0, -360deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95); transform: perspective(400px) scale3d(0.95, 0.95, 0.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } to { -webkit-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes flip { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); transform: perspective(400px) rotate3d(0, 1, 0, -360deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95); transform: perspective(400px) scale3d(0.95, 0.95, 0.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } to { -webkit-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } .animated.flip { -webkit-backface-visibility: visible; backface-visibility: visible; -webkit-animation-name: flip; animation-name: flip; } @-webkit-keyframes flipInX { from { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); transform: perspective(400px) rotate3d(1, 0, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); transform: perspective(400px) rotate3d(1, 0, 0, -5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } @keyframes flipInX { from { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); transform: perspective(400px) rotate3d(1, 0, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); transform: perspective(400px) rotate3d(1, 0, 0, -5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } .flipInX { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInX; animation-name: flipInX; } @-webkit-keyframes flipInY { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); transform: perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); transform: perspective(400px) rotate3d(0, 1, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); transform: perspective(400px) rotate3d(0, 1, 0, -5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } @keyframes flipInY { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); transform: perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); transform: perspective(400px) rotate3d(0, 1, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); transform: perspective(400px) rotate3d(0, 1, 0, -5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } .flipInY { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInY; animation-name: flipInY; } @-webkit-keyframes flipOutX { from { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); opacity: 0; } } @keyframes flipOutX { from { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); opacity: 0; } } .flipOutX { -webkit-animation-name: flipOutX; animation-name: flipOutX; -webkit-backface-visibility: visible !important; backface-visibility: visible !important; } @-webkit-keyframes flipOutY { from { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); transform: perspective(400px) rotate3d(0, 1, 0, -15deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); opacity: 0; } } @keyframes flipOutY { from { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); transform: perspective(400px) rotate3d(0, 1, 0, -15deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); opacity: 0; } } .flipOutY { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipOutY; animation-name: flipOutY; } @-webkit-keyframes lightSpeedIn { from { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); transform: translate3d(100%, 0, 0) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: skewX(20deg); transform: skewX(20deg); opacity: 1; } 80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); opacity: 1; } to { -webkit-transform: none; transform: none; opacity: 1; } } @keyframes lightSpeedIn { from { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); transform: translate3d(100%, 0, 0) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: skewX(20deg); transform: skewX(20deg); opacity: 1; } 80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); opacity: 1; } to { -webkit-transform: none; transform: none; opacity: 1; } } .lightSpeedIn { -webkit-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } @-webkit-keyframes lightSpeedOut { from { opacity: 1; } to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0; } } @keyframes lightSpeedOut { from { opacity: 1; } to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0; } } .lightSpeedOut { -webkit-animation-name: lightSpeedOut; animation-name: lightSpeedOut; -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } @-webkit-keyframes rotateIn { from { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, -200deg); transform: rotate3d(0, 0, 1, -200deg); opacity: 0; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateIn { from { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, -200deg); transform: rotate3d(0, 0, 1, -200deg); opacity: 0; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; } } .rotateIn { -webkit-animation-name: rotateIn; animation-name: rotateIn; } @-webkit-keyframes rotateInDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; } @-webkit-keyframes rotateInDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInDownRight { -webkit-animation-name: rotateInDownRight; animation-name: rotateInDownRight; } @-webkit-keyframes rotateInUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; } @-webkit-keyframes rotateInUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -90deg); transform: rotate3d(0, 0, 1, -90deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -90deg); transform: rotate3d(0, 0, 1, -90deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInUpRight { -webkit-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateOut { from { -webkit-transform-origin: center; transform-origin: center; opacity: 1; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, 200deg); transform: rotate3d(0, 0, 1, 200deg); opacity: 0; } } @keyframes rotateOut { from { -webkit-transform-origin: center; transform-origin: center; opacity: 1; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, 200deg); transform: rotate3d(0, 0, 1, 200deg); opacity: 0; } } .rotateOut { -webkit-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } } @keyframes rotateOutDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } } .rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } @keyframes rotateOutDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } .rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes rotateOutUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } @keyframes rotateOutUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } .rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 90deg); transform: rotate3d(0, 0, 1, 90deg); opacity: 0; } } @keyframes rotateOutUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 90deg); transform: rotate3d(0, 0, 1, 90deg); opacity: 0; } } .rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes hinge { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate3d(0, 0, 1, 80deg); transform: rotate3d(0, 0, 1, 80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40%, 80% { -webkit-transform: rotate3d(0, 0, 1, 60deg); transform: rotate3d(0, 0, 1, 60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; } to { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0; } } @keyframes hinge { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate3d(0, 0, 1, 80deg); transform: rotate3d(0, 0, 1, 80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40%, 80% { -webkit-transform: rotate3d(0, 0, 1, 60deg); transform: rotate3d(0, 0, 1, 60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; } to { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0; } } .hinge { -webkit-animation-name: hinge; animation-name: hinge; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollIn { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes rollIn { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); } to { opacity: 1; -webkit-transform: none; transform: none; } } .rollIn { -webkit-animation-name: rollIn; animation-name: rollIn; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollOut { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } } @keyframes rollOut { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } } .rollOut { -webkit-animation-name: rollOut; animation-name: rollOut; } @-webkit-keyframes zoomIn { from { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 50% { opacity: 1; } } @keyframes zoomIn { from { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 50% { opacity: 1; } } .zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn; } @-webkit-keyframes zoomInDown { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInDown { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomInDown { -webkit-animation-name: zoomInDown; animation-name: zoomInDown; } @-webkit-keyframes zoomInLeft { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInLeft { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomInLeft { -webkit-animation-name: zoomInLeft; animation-name: zoomInLeft; } @-webkit-keyframes zoomInRight { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInRight { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomInRight { -webkit-animation-name: zoomInRight; animation-name: zoomInRight; } @-webkit-keyframes zoomInUp { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInUp { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomInUp { -webkit-animation-name: zoomInUp; animation-name: zoomInUp; } @-webkit-keyframes zoomOut { from { opacity: 1; } 50% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } to { opacity: 0; } } @keyframes zoomOut { from { opacity: 1; } 50% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } to { opacity: 0; } } .zoomOut { -webkit-animation-name: zoomOut; animation-name: zoomOut; } @-webkit-keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomOutDown { -webkit-animation-name: zoomOutDown; animation-name: zoomOutDown; } @-webkit-keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0); transform: scale(0.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } } @keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0); transform: scale(0.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } } .zoomOutLeft { -webkit-animation-name: zoomOutLeft; animation-name: zoomOutLeft; } @-webkit-keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(2000px, 0, 0); transform: scale(0.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } } @keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(2000px, 0, 0); transform: scale(0.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } } .zoomOutRight { -webkit-animation-name: zoomOutRight; animation-name: zoomOutRight; } @-webkit-keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomOutUp { -webkit-animation-name: zoomOutUp; animation-name: zoomOutUp; } @-webkit-keyframes slideInDown { from { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes slideInDown { from { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .slideInDown { -webkit-animation-name: slideInDown; animation-name: slideInDown; } @-webkit-keyframes slideInLeft { from { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes slideInLeft { from { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .slideInLeft { -webkit-animation-name: slideInLeft; animation-name: slideInLeft; } @-webkit-keyframes slideInRight { from { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes slideInRight { from { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight; } @-webkit-keyframes slideInUp { from { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes slideInUp { from { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .slideInUp { -webkit-animation-name: slideInUp; animation-name: slideInUp; } @-webkit-keyframes slideOutDown { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } @keyframes slideOutDown { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } .slideOutDown { -webkit-animation-name: slideOutDown; animation-name: slideOutDown; } @-webkit-keyframes slideOutLeft { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @keyframes slideOutLeft { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } .slideOutLeft { -webkit-animation-name: slideOutLeft; animation-name: slideOutLeft; } @-webkit-keyframes slideOutRight { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } @keyframes slideOutRight { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } .slideOutRight { -webkit-animation-name: slideOutRight; animation-name: slideOutRight; } @-webkit-keyframes slideOutUp { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } @keyframes slideOutUp { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } .slideOutUp { -webkit-animation-name: slideOutUp; animation-name: slideOutUp; } /*============================== * Utilities =================================*/ /*==================================== Google Font ===================================*/ /* font-family: 'DM Sans', sans-serif; */ .clearfix:before, .clearfix:after { content: " "; display: table; } .clearfix:after { clear: both; } .fix { overflow: hidden; } .slick-initialized .slick-slide { margin-bottom: -10px; } /*=============================== Background Color =================================*/ .bg-color-primary { background: #0ac775; } .bg-color-secondary { background: #FF9166; } .bg-color-tertiary { background: #49CCFF; } .bg-color-extra01 { background: #FFCD3E; } .bg-color-extra02 { background: #5BCC9F; } .bg-color-black { background: #000000; } .bg-color-darker { background: #52526C; } .bg-color-darkest { background: #000248; } .bg-color-dark { background: #757589; } .bg-color-mid { background: #999AB6; } .bg-color-light { background: #C7C7D5; } .bg-color-lighter { background: #F6F5FA; } .bg-color-lightest { background: #FAFAFB; } .bg-color-white { background: #FFFFFF; } .bg-color-tealLighter { background: #DCF7FE; } .bg-color-extra09 { background: #00004B; } .bg-color-extra010 { background: #00004B; } .bg-color-extra11 { background: #F6F5FA; } /*=========================== Background Image =============================*/ .bg_image--1 { background-image: url(../images/bg/bg-image-1.svg); } .bg_image--2 { background-image: url(../images/bg/bg-image-2.svg); } .font--1 { font-size: 1px !important; } .font--2 { font-size: 2px !important; } .font--3 { font-size: 3px !important; } .font--4 { font-size: 4px !important; } .font--5 { font-size: 5px !important; } .font--6 { font-size: 6px !important; } .font--7 { font-size: 7px !important; } .font--8 { font-size: 8px !important; } .font--9 { font-size: 9px !important; } .font--10 { font-size: 10px !important; } .font--11 { font-size: 11px !important; } .font--12 { font-size: 12px !important; } .font--13 { font-size: 13px !important; } .font--14 { font-size: 14px !important; } .font--15 { font-size: 15px !important; } .font--16 { font-size: 16px !important; } .font--17 { font-size: 17px !important; } .font--18 { font-size: 18px !important; } .font--19 { font-size: 19px !important; } .font--20 { font-size: 20px !important; } .font--21 { font-size: 21px !important; } .font--22 { font-size: 22px !important; } .font--23 { font-size: 23px !important; } .font--24 { font-size: 24px !important; } .font--25 { font-size: 25px !important; } .font--26 { font-size: 26px !important; } .font--27 { font-size: 27px !important; } .font--28 { font-size: 28px !important; } .font--29 { font-size: 29px !important; } .font--30 { font-size: 30px !important; } .font--31 { font-size: 31px !important; } .font--32 { font-size: 32px !important; } .font--33 { font-size: 33px !important; } .font--34 { font-size: 34px !important; } .font--35 { font-size: 35px !important; } .font--36 { font-size: 36px !important; } .font--37 { font-size: 37px !important; } .font--38 { font-size: 38px !important; } .font--39 { font-size: 39px !important; } .font--40 { font-size: 40px !important; } .font--41 { font-size: 41px !important; } .font--42 { font-size: 42px !important; } .font--43 { font-size: 43px !important; } .font--44 { font-size: 44px !important; } .font--45 { font-size: 45px !important; } .font--46 { font-size: 46px !important; } .font--47 { font-size: 47px !important; } .font--48 { font-size: 48px !important; } .font--49 { font-size: 49px !important; } .font--50 { font-size: 50px !important; } .font--51 { font-size: 51px !important; } .font--52 { font-size: 52px !important; } .font--53 { font-size: 53px !important; } .font--54 { font-size: 54px !important; } .font--55 { font-size: 55px !important; } .font--56 { font-size: 56px !important; } .font--57 { font-size: 57px !important; } .font--58 { font-size: 58px !important; } .font--59 { font-size: 59px !important; } .font--60 { font-size: 60px !important; } .font--61 { font-size: 61px !important; } .font--62 { font-size: 62px !important; } .font--63 { font-size: 63px !important; } .font--64 { font-size: 64px !important; } .font--65 { font-size: 65px !important; } .font--66 { font-size: 66px !important; } .font--67 { font-size: 67px !important; } .font--68 { font-size: 68px !important; } .font--69 { font-size: 69px !important; } .font--70 { font-size: 70px !important; } .font--71 { font-size: 71px !important; } .font--72 { font-size: 72px !important; } .font--73 { font-size: 73px !important; } .font--74 { font-size: 74px !important; } .font--75 { font-size: 75px !important; } .font--76 { font-size: 76px !important; } .font--77 { font-size: 77px !important; } .font--78 { font-size: 78px !important; } .font--79 { font-size: 79px !important; } .font--80 { font-size: 80px !important; } /*========================= Text specialized ==========================*/ .text-italic { font-style: italic; } .text-normal { font-style: normal; } .text-underline { font-style: underline; } /* Height and width */ .fullscreen { min-height: 100vh; width: 100%; } /*=================== Custom Row ======================*/ .row--0 { margin-left: -0px; margin-right: -0px; } .row--0 > [class*="col"] { padding-left: 0px; padding-right: 0px; } .row--5 { margin-left: -5px; margin-right: -5px; } .row--5 > [class*="col"] { padding-left: 5px; padding-right: 5px; } .row--10 { margin-left: -10px; margin-right: -10px; } .row--10 > [class*="col"] { padding-left: 10px; padding-right: 10px; } .row--20 { margin-left: -20px; margin-right: -20px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .row--20 { margin-left: -15px; margin-right: -15px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .row--20 { margin-left: -15px; margin-right: -15px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .row--20 { margin-left: -15px; margin-right: -15px; } } @media only screen and (max-width: 767px) { .row--20 { margin-left: -15px !important; margin-right: -15px !important; } } .row--20 > [class*="col"], .row--20 > [class*="col-"] { padding-left: 20px; padding-right: 20px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .row--20 > [class*="col"], .row--20 > [class*="col-"] { padding-left: 15px; padding-right: 15px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .row--20 > [class*="col"], .row--20 > [class*="col-"] { padding-left: 15px; padding-right: 15px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .row--20 > [class*="col"], .row--20 > [class*="col-"] { padding-left: 15px !important; padding-right: 15px !important; } } @media only screen and (max-width: 767px) { .row--20 > [class*="col"], .row--20 > [class*="col-"] { padding-left: 15px !important; padding-right: 15px !important; } } .row--25 { margin-left: -25px; margin-right: -25px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .row--25 { margin-left: -15px; margin-right: -15px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .row--25 { margin-left: -15px; margin-right: -15px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .row--25 { margin-left: -15px; margin-right: -15px; } } @media only screen and (max-width: 767px) { .row--25 { margin-left: -15px !important; margin-right: -15px !important; } } .row--25 > [class*="col"], .row--25 > [class*="col-"] { padding-left: 25px; padding-right: 25px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .row--25 > [class*="col"], .row--25 > [class*="col-"] { padding-left: 15px; padding-right: 15px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .row--25 > [class*="col"], .row--25 > [class*="col-"] { padding-left: 15px; padding-right: 15px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .row--25 > [class*="col"], .row--25 > [class*="col-"] { padding-left: 15px !important; padding-right: 15px !important; } } @media only screen and (max-width: 767px) { .row--25 > [class*="col"], .row--25 > [class*="col-"] { padding-left: 15px !important; padding-right: 15px !important; } } .row--30 { margin-left: -30px; margin-right: -30px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .row--30 { margin-left: -15px; margin-right: -15px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .row--30 { margin-left: -15px; margin-right: -15px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .row--30 { margin-left: -15px; margin-right: -15px; } } @media only screen and (max-width: 767px) { .row--30 { margin-left: -15px !important; margin-right: -15px !important; } } .row--30 > [class*="col"], .row--30 > [class*="col-"] { padding-left: 30px; padding-right: 30px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .row--30 > [class*="col"], .row--30 > [class*="col-"] { padding-left: 15px; padding-right: 15px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .row--30 > [class*="col"], .row--30 > [class*="col-"] { padding-left: 15px; padding-right: 15px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .row--30 > [class*="col"], .row--30 > [class*="col-"] { padding-left: 15px !important; padding-right: 15px !important; } } @media only screen and (max-width: 767px) { .row--30 > [class*="col"], .row--30 > [class*="col-"] { padding-left: 15px !important; padding-right: 15px !important; } } .row--45 { margin-left: -45px; margin-right: -45px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .row--45 { margin-left: -15px; margin-right: -15px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .row--45 { margin-left: -15px; margin-right: -15px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .row--45 { margin-left: -15px; margin-right: -15px; } } @media only screen and (max-width: 767px) { .row--45 { margin-left: -15px !important; margin-right: -15px !important; } } .row--45 > [class*="col"], .row--45 > [class*="col-"] { padding-left: 45px; padding-right: 45px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .row--45 > [class*="col"], .row--45 > [class*="col-"] { padding-left: 15px; padding-right: 15px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .row--45 > [class*="col"], .row--45 > [class*="col-"] { padding-left: 15px; padding-right: 15px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .row--45 > [class*="col"], .row--45 > [class*="col-"] { padding-left: 15px !important; padding-right: 15px !important; } } @media only screen and (max-width: 767px) { .row--45 > [class*="col"], .row--45 > [class*="col-"] { padding-left: 15px !important; padding-right: 15px !important; } } .row--40 { margin-left: -40px; margin-right: -40px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .row--40 { margin-left: -15px; margin-right: -15px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .row--40 { margin-left: -15px; margin-right: -15px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .row--40 { margin-left: -15px; margin-right: -15px; } } @media only screen and (max-width: 767px) { .row--40 { margin-left: -15px !important; margin-right: -15px !important; } } .row--40 > [class*="col"], .row--40 > [class*="col-"] { padding-left: 40px; padding-right: 40px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .row--40 > [class*="col"], .row--40 > [class*="col-"] { padding-left: 15px; padding-right: 15px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .row--40 > [class*="col"], .row--40 > [class*="col-"] { padding-left: 15px; padding-right: 15px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .row--40 > [class*="col"], .row--40 > [class*="col-"] { padding-left: 15px !important; padding-right: 15px !important; } } @media only screen and (max-width: 767px) { .row--40 > [class*="col"], .row--40 > [class*="col-"] { padding-left: 15px !important; padding-right: 15px !important; } } .row--60 { margin-left: -60px; margin-right: -60px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .row--60 { margin-left: -15px; margin-right: -15px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .row--60 { margin-left: -15px; margin-right: -15px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .row--60 { margin-left: -15px; margin-right: -15px; } } @media only screen and (max-width: 767px) { .row--60 { margin-left: -15px !important; margin-right: -15px !important; } } .row--60 > [class*="col"], .row--60 > [class*="col-"] { padding-left: 60px; padding-right: 60px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .row--60 > [class*="col"], .row--60 > [class*="col-"] { padding-left: 15px; padding-right: 15px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .row--60 > [class*="col"], .row--60 > [class*="col-"] { padding-left: 15px; padding-right: 15px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .row--60 > [class*="col"], .row--60 > [class*="col-"] { padding-left: 15px !important; padding-right: 15px !important; } } @media only screen and (max-width: 767px) { .row--60 > [class*="col"], .row--60 > [class*="col-"] { padding-left: 15px !important; padding-right: 15px !important; } } /*=========================== Input Placeholder =============================*/ input:-moz-placeholder, textarea:-moz-placeholder { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; } input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; } input::-moz-placeholder, textarea::-moz-placeholder { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; } input:-ms-input-placeholder, textarea:-ms-input-placeholder { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; } /*============================= Overlay styles ==============================*/ [data-overlay], [data-black-overlay], [data-white-overlay] { position: relative; } [data-overlay] > div, [data-overlay] > *, [data-black-overlay] > div, [data-black-overlay] > *, [data-white-overlay] > div, [data-white-overlay] > * { position: relative; z-index: 2; } [data-overlay]:before, [data-black-overlay]:before, [data-white-overlay]:before { content: ""; position: absolute; left: 0; top: 0; height: 100%; width: 100%; z-index: 2; } [data-black-overlay]:before { background-color: #000000; } [data-white-overlay]:before { background-color: #ffffff; } [data-overlay="1"]:before, [data-black-overlay="1"]:before, [data-white-overlay="1"]:before { opacity: 0.1; } [data-overlay="2"]:before, [data-black-overlay="2"]:before, [data-white-overlay="2"]:before { opacity: 0.2; } [data-overlay="3"]:before, [data-black-overlay="3"]:before, [data-white-overlay="3"]:before { opacity: 0.3; } [data-overlay="4"]:before, [data-black-overlay="4"]:before, [data-white-overlay="4"]:before { opacity: 0.4; } [data-overlay="5"]:before, [data-black-overlay="5"]:before, [data-white-overlay="5"]:before { opacity: 0.5; } [data-overlay="6"]:before, [data-black-overlay="6"]:before, [data-white-overlay="6"]:before { opacity: 0.6; } [data-overlay="7"]:before, [data-black-overlay="7"]:before, [data-white-overlay="7"]:before { opacity: 0.7; } [data-overlay="8"]:before, [data-black-overlay="8"]:before, [data-white-overlay="8"]:before { opacity: 0.8; } [data-overlay="9"]:before, [data-black-overlay="9"]:before, [data-white-overlay="9"]:before { opacity: 0.9; } [data-overlay="10"]:before, [data-black-overlay="10"]:before, [data-white-overlay="10"]:before { opacity: 1; } /*------------------------------ Scroll Up --------------------------------*/ #scrollUp { width: 70px; height: 80px; right: 100px; bottom: 60px; text-align: center; z-index: 9811 !important; text-decoration: none; background: #fff; line-height: 80px; color: #757589; font-size: 15px; font-weight: 400; display: inline-block; background: #ffffff; } @media only screen and (min-width: 768px) and (max-width: 991px) { #scrollUp { right: 30px; } } @media only screen and (max-width: 767px) { #scrollUp { right: 30px; } } #scrollUp::before { width: 100%; height: 100%; left: 0; bottom: 0; background: rgba(0, 2, 72, 0.1); content: ""; position: absolute; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-10deg); transform: rotateY(-10deg); -webkit-filter: blur(50px); filter: blur(50px); } #scrollUp::after { background: #ffffff; position: absolute; content: ""; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-10deg); transform: rotateY(-10deg); } @media only screen and (max-width: 767px) { #scrollUp { right: 20px; bottom: 30px; width: 50px; height: 60px; line-height: 60px; } } #scrollUp span.text { position: relative; display: inline-block; margin-top: 7px; } @media only screen and (max-width: 767px) { #scrollUp span.text { margin-top: 3px; } } #scrollUp span.text::after { width: 0; height: 0; border-style: solid; border-width: 0 5px 7px 5px; border-color: transparent transparent #0ac775 transparent; position: absolute; content: ""; left: 50%; top: 21%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } #scrollUp:hover { -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } #scrollUp:hover span.text { color: #0ac775; } /*-------------------- Contact Form ----------------------*/ .form-message { margin-bottom: 0; text-align: center; } .form-message.error { margin-top: 20px; color: #f80707; } .form-message.success { margin-top: 20px; color: #0d8d2d; } /*========================= Section Separation ==========================*/ .letterspacing--2 { letter-spacing: 2px; } .ax-section-gap { padding: 130px 0; } @media only screen and (min-width: 768px) and (max-width: 991px) { .ax-section-gap { padding: 80px 0; } } @media only screen and (max-width: 767px) { .ax-section-gap { padding: 60px 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .ptb--120 { padding: 80px 0 !important; } } @media only screen and (max-width: 767px) { .ptb--120 { padding: 60px 0 !important; } } .ax-section-gapBottom { padding-bottom: 130px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .ax-section-gapBottom { padding-bottom: 80px; } } @media only screen and (max-width: 767px) { .ax-section-gapBottom { padding-bottom: 60px; } } .ax-section-gapTop { padding-top: 130px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .ax-section-gapTop { padding-top: 80px; } } @media only screen and (max-width: 767px) { .ax-section-gapTop { padding-top: 60px; } } .pl--0 { padding-left: 0 !important; } .pr--0 { padding-right: 0 !important; } .pt--0 { padding-top: 0 !important; } .pb--0 { padding-bottom: 0 !important; } .mr--0 { margin-right: 0 !important; } .ml--0 { margin-left: 0 !important; } .mt--0 { margin-top: 0 !important; } .mb--0 { margin-bottom: 0 !important; } .pt--260 { padding-top: 260px; } .pt--250 { padding-top: 250px; } .pb--240 { padding-bottom: 240px; } .pb--220 { padding-bottom: 220px; } .plr--270 { padding: 0 270px; } .plr--300 { padding: 0 300px; } .plr--340 { padding: 0 340px; } .ptb--300 { padding: 300px 0; } .ptb--340 { padding: 340px 0; } .ptb--450 { padding: 450px 0; } .plr_dec--15 { margin: 0 -15px; } .pt--300 { padding-top: 300px; } .ptb--5 { padding: 5px 0; } .plr--5 { padding: 0 5px; } .pt--5 { padding-top: 5px; } .pb--5 { padding-bottom: 5px; } .pl--5 { padding-left: 5px; } .pr--5 { padding-right: 5px; } .mt--5 { margin-top: 5px !important; } .mb--5 { margin-bottom: 5px; } .mr--5 { margin-right: 5px; } .ml--5 { margin-left: 5px; } .ptb--10 { padding: 10px 0; } .plr--10 { padding: 0 10px; } .pt--10 { padding-top: 10px; } .pb--10 { padding-bottom: 10px; } .pl--10 { padding-left: 10px; } .pr--10 { padding-right: 10px; } .mt--10 { margin-top: 10px !important; } .mb--10 { margin-bottom: 10px; } .mr--10 { margin-right: 10px; } .ml--10 { margin-left: 10px; } .ptb--15 { padding: 15px 0; } .plr--15 { padding: 0 15px; } .pt--15 { padding-top: 15px; } .pb--15 { padding-bottom: 15px; } .pl--15 { padding-left: 15px; } .pr--15 { padding-right: 15px; } .mt--15 { margin-top: 15px !important; } .mb--15 { margin-bottom: 15px; } .mr--15 { margin-right: 15px; } .ml--15 { margin-left: 15px; } .ptb--20 { padding: 20px 0; } .plr--20 { padding: 0 20px; } .pt--20 { padding-top: 20px; } .pb--20 { padding-bottom: 20px; } .pl--20 { padding-left: 20px; } .pr--20 { padding-right: 20px; } .mt--20 { margin-top: 20px !important; } .mb--20 { margin-bottom: 20px; } .mr--20 { margin-right: 20px; } .ml--20 { margin-left: 20px; } .ptb--25 { padding: 25px 0; } .plr--25 { padding: 0 25px; } .pt--25 { padding-top: 25px; } .pb--25 { padding-bottom: 25px; } .pl--25 { padding-left: 25px; } .pr--25 { padding-right: 25px; } .mt--25 { margin-top: 25px !important; } .mb--25 { margin-bottom: 25px; } .mr--25 { margin-right: 25px; } .ml--25 { margin-left: 25px; } .ptb--30 { padding: 30px 0; } .plr--30 { padding: 0 30px; } .pt--30 { padding-top: 30px; } .pb--30 { padding-bottom: 30px; } .pl--30 { padding-left: 30px; } .pr--30 { padding-right: 30px; } .mt--30 { margin-top: 30px !important; } .mb--30 { margin-bottom: 30px; } .mr--30 { margin-right: 30px; } .ml--30 { margin-left: 30px; } .ptb--35 { padding: 35px 0; } .plr--35 { padding: 0 35px; } .pt--35 { padding-top: 35px; } .pb--35 { padding-bottom: 35px; } .pl--35 { padding-left: 35px; } .pr--35 { padding-right: 35px; } .mt--35 { margin-top: 35px !important; } .mb--35 { margin-bottom: 35px; } .mr--35 { margin-right: 35px; } .ml--35 { margin-left: 35px; } .ptb--40 { padding: 40px 0; } .plr--40 { padding: 0 40px; } .pt--40 { padding-top: 40px; } .pb--40 { padding-bottom: 40px; } .pl--40 { padding-left: 40px; } .pr--40 { padding-right: 40px; } .mt--40 { margin-top: 40px !important; } .mb--40 { margin-bottom: 40px; } .mr--40 { margin-right: 40px; } .ml--40 { margin-left: 40px; } .ptb--45 { padding: 45px 0; } .plr--45 { padding: 0 45px; } .pt--45 { padding-top: 45px; } .pb--45 { padding-bottom: 45px; } .pl--45 { padding-left: 45px; } .pr--45 { padding-right: 45px; } .mt--45 { margin-top: 45px !important; } .mb--45 { margin-bottom: 45px; } .mr--45 { margin-right: 45px; } .ml--45 { margin-left: 45px; } .ptb--50 { padding: 50px 0; } .plr--50 { padding: 0 50px; } .pt--50 { padding-top: 50px; } .pb--50 { padding-bottom: 50px; } .pl--50 { padding-left: 50px; } .pr--50 { padding-right: 50px; } .mt--50 { margin-top: 50px !important; } .mb--50 { margin-bottom: 50px; } .mr--50 { margin-right: 50px; } .ml--50 { margin-left: 50px; } .ptb--55 { padding: 55px 0; } .plr--55 { padding: 0 55px; } .pt--55 { padding-top: 55px; } .pb--55 { padding-bottom: 55px; } .pl--55 { padding-left: 55px; } .pr--55 { padding-right: 55px; } .mt--55 { margin-top: 55px !important; } .mb--55 { margin-bottom: 55px; } .mr--55 { margin-right: 55px; } .ml--55 { margin-left: 55px; } .ptb--60 { padding: 60px 0; } .plr--60 { padding: 0 60px; } .pt--60 { padding-top: 60px; } .pb--60 { padding-bottom: 60px; } .pl--60 { padding-left: 60px; } .pr--60 { padding-right: 60px; } .mt--60 { margin-top: 60px !important; } .mb--60 { margin-bottom: 60px; } .mr--60 { margin-right: 60px; } .ml--60 { margin-left: 60px; } .ptb--65 { padding: 65px 0; } .plr--65 { padding: 0 65px; } .pt--65 { padding-top: 65px; } .pb--65 { padding-bottom: 65px; } .pl--65 { padding-left: 65px; } .pr--65 { padding-right: 65px; } .mt--65 { margin-top: 65px !important; } .mb--65 { margin-bottom: 65px; } .mr--65 { margin-right: 65px; } .ml--65 { margin-left: 65px; } .ptb--70 { padding: 70px 0; } .plr--70 { padding: 0 70px; } .pt--70 { padding-top: 70px; } .pb--70 { padding-bottom: 70px; } .pl--70 { padding-left: 70px; } .pr--70 { padding-right: 70px; } .mt--70 { margin-top: 70px !important; } .mb--70 { margin-bottom: 70px; } .mr--70 { margin-right: 70px; } .ml--70 { margin-left: 70px; } .ptb--75 { padding: 75px 0; } .plr--75 { padding: 0 75px; } .pt--75 { padding-top: 75px; } .pb--75 { padding-bottom: 75px; } .pl--75 { padding-left: 75px; } .pr--75 { padding-right: 75px; } .mt--75 { margin-top: 75px !important; } .mb--75 { margin-bottom: 75px; } .mr--75 { margin-right: 75px; } .ml--75 { margin-left: 75px; } .ptb--80 { padding: 80px 0; } .plr--80 { padding: 0 80px; } .pt--80 { padding-top: 80px; } .pb--80 { padding-bottom: 80px; } .pl--80 { padding-left: 80px; } .pr--80 { padding-right: 80px; } .mt--80 { margin-top: 80px !important; } .mb--80 { margin-bottom: 80px; } .mr--80 { margin-right: 80px; } .ml--80 { margin-left: 80px; } .ptb--85 { padding: 85px 0; } .plr--85 { padding: 0 85px; } .pt--85 { padding-top: 85px; } .pb--85 { padding-bottom: 85px; } .pl--85 { padding-left: 85px; } .pr--85 { padding-right: 85px; } .mt--85 { margin-top: 85px !important; } .mb--85 { margin-bottom: 85px; } .mr--85 { margin-right: 85px; } .ml--85 { margin-left: 85px; } .ptb--90 { padding: 90px 0; } .plr--90 { padding: 0 90px; } .pt--90 { padding-top: 90px; } .pb--90 { padding-bottom: 90px; } .pl--90 { padding-left: 90px; } .pr--90 { padding-right: 90px; } .mt--90 { margin-top: 90px !important; } .mb--90 { margin-bottom: 90px; } .mr--90 { margin-right: 90px; } .ml--90 { margin-left: 90px; } .ptb--95 { padding: 95px 0; } .plr--95 { padding: 0 95px; } .pt--95 { padding-top: 95px; } .pb--95 { padding-bottom: 95px; } .pl--95 { padding-left: 95px; } .pr--95 { padding-right: 95px; } .mt--95 { margin-top: 95px !important; } .mb--95 { margin-bottom: 95px; } .mr--95 { margin-right: 95px; } .ml--95 { margin-left: 95px; } .ptb--100 { padding: 100px 0; } .plr--100 { padding: 0 100px; } .pt--100 { padding-top: 100px; } .pb--100 { padding-bottom: 100px; } .pl--100 { padding-left: 100px; } .pr--100 { padding-right: 100px; } .mt--100 { margin-top: 100px !important; } .mb--100 { margin-bottom: 100px; } .mr--100 { margin-right: 100px; } .ml--100 { margin-left: 100px; } .ptb--105 { padding: 105px 0; } .plr--105 { padding: 0 105px; } .pt--105 { padding-top: 105px; } .pb--105 { padding-bottom: 105px; } .pl--105 { padding-left: 105px; } .pr--105 { padding-right: 105px; } .mt--105 { margin-top: 105px !important; } .mb--105 { margin-bottom: 105px; } .mr--105 { margin-right: 105px; } .ml--105 { margin-left: 105px; } .ptb--110 { padding: 110px 0; } .plr--110 { padding: 0 110px; } .pt--110 { padding-top: 110px; } .pb--110 { padding-bottom: 110px; } .pl--110 { padding-left: 110px; } .pr--110 { padding-right: 110px; } .mt--110 { margin-top: 110px !important; } .mb--110 { margin-bottom: 110px; } .mr--110 { margin-right: 110px; } .ml--110 { margin-left: 110px; } .ptb--115 { padding: 115px 0; } .plr--115 { padding: 0 115px; } .pt--115 { padding-top: 115px; } .pb--115 { padding-bottom: 115px; } .pl--115 { padding-left: 115px; } .pr--115 { padding-right: 115px; } .mt--115 { margin-top: 115px !important; } .mb--115 { margin-bottom: 115px; } .mr--115 { margin-right: 115px; } .ml--115 { margin-left: 115px; } .ptb--120 { padding: 120px 0; } .plr--120 { padding: 0 120px; } .pt--120 { padding-top: 120px; } .pb--120 { padding-bottom: 120px; } .pl--120 { padding-left: 120px; } .pr--120 { padding-right: 120px; } .mt--120 { margin-top: 120px !important; } .mb--120 { margin-bottom: 120px; } .mr--120 { margin-right: 120px; } .ml--120 { margin-left: 120px; } .ptb--125 { padding: 125px 0; } .plr--125 { padding: 0 125px; } .pt--125 { padding-top: 125px; } .pb--125 { padding-bottom: 125px; } .pl--125 { padding-left: 125px; } .pr--125 { padding-right: 125px; } .mt--125 { margin-top: 125px !important; } .mb--125 { margin-bottom: 125px; } .mr--125 { margin-right: 125px; } .ml--125 { margin-left: 125px; } .ptb--130 { padding: 130px 0; } .plr--130 { padding: 0 130px; } .pt--130 { padding-top: 130px; } .pb--130 { padding-bottom: 130px; } .pl--130 { padding-left: 130px; } .pr--130 { padding-right: 130px; } .mt--130 { margin-top: 130px !important; } .mb--130 { margin-bottom: 130px; } .mr--130 { margin-right: 130px; } .ml--130 { margin-left: 130px; } .ptb--135 { padding: 135px 0; } .plr--135 { padding: 0 135px; } .pt--135 { padding-top: 135px; } .pb--135 { padding-bottom: 135px; } .pl--135 { padding-left: 135px; } .pr--135 { padding-right: 135px; } .mt--135 { margin-top: 135px !important; } .mb--135 { margin-bottom: 135px; } .mr--135 { margin-right: 135px; } .ml--135 { margin-left: 135px; } .ptb--140 { padding: 140px 0; } .plr--140 { padding: 0 140px; } .pt--140 { padding-top: 140px; } .pb--140 { padding-bottom: 140px; } .pl--140 { padding-left: 140px; } .pr--140 { padding-right: 140px; } .mt--140 { margin-top: 140px !important; } .mb--140 { margin-bottom: 140px; } .mr--140 { margin-right: 140px; } .ml--140 { margin-left: 140px; } .ptb--145 { padding: 145px 0; } .plr--145 { padding: 0 145px; } .pt--145 { padding-top: 145px; } .pb--145 { padding-bottom: 145px; } .pl--145 { padding-left: 145px; } .pr--145 { padding-right: 145px; } .mt--145 { margin-top: 145px !important; } .mb--145 { margin-bottom: 145px; } .mr--145 { margin-right: 145px; } .ml--145 { margin-left: 145px; } .ptb--150 { padding: 150px 0; } .plr--150 { padding: 0 150px; } .pt--150 { padding-top: 150px; } .pb--150 { padding-bottom: 150px; } .pl--150 { padding-left: 150px; } .pr--150 { padding-right: 150px; } .mt--150 { margin-top: 150px !important; } .mb--150 { margin-bottom: 150px; } .mr--150 { margin-right: 150px; } .ml--150 { margin-left: 150px; } .ptb--155 { padding: 155px 0; } .plr--155 { padding: 0 155px; } .pt--155 { padding-top: 155px; } .pb--155 { padding-bottom: 155px; } .pl--155 { padding-left: 155px; } .pr--155 { padding-right: 155px; } .mt--155 { margin-top: 155px !important; } .mb--155 { margin-bottom: 155px; } .mr--155 { margin-right: 155px; } .ml--155 { margin-left: 155px; } .ptb--160 { padding: 160px 0; } .plr--160 { padding: 0 160px; } .pt--160 { padding-top: 160px; } .pb--160 { padding-bottom: 160px; } .pl--160 { padding-left: 160px; } .pr--160 { padding-right: 160px; } .mt--160 { margin-top: 160px !important; } .mb--160 { margin-bottom: 160px; } .mr--160 { margin-right: 160px; } .ml--160 { margin-left: 160px; } .ptb--165 { padding: 165px 0; } .plr--165 { padding: 0 165px; } .pt--165 { padding-top: 165px; } .pb--165 { padding-bottom: 165px; } .pl--165 { padding-left: 165px; } .pr--165 { padding-right: 165px; } .mt--165 { margin-top: 165px !important; } .mb--165 { margin-bottom: 165px; } .mr--165 { margin-right: 165px; } .ml--165 { margin-left: 165px; } .ptb--170 { padding: 170px 0; } .plr--170 { padding: 0 170px; } .pt--170 { padding-top: 170px; } .pb--170 { padding-bottom: 170px; } .pl--170 { padding-left: 170px; } .pr--170 { padding-right: 170px; } .mt--170 { margin-top: 170px !important; } .mb--170 { margin-bottom: 170px; } .mr--170 { margin-right: 170px; } .ml--170 { margin-left: 170px; } .ptb--175 { padding: 175px 0; } .plr--175 { padding: 0 175px; } .pt--175 { padding-top: 175px; } .pb--175 { padding-bottom: 175px; } .pl--175 { padding-left: 175px; } .pr--175 { padding-right: 175px; } .mt--175 { margin-top: 175px !important; } .mb--175 { margin-bottom: 175px; } .mr--175 { margin-right: 175px; } .ml--175 { margin-left: 175px; } .ptb--180 { padding: 180px 0; } .plr--180 { padding: 0 180px; } .pt--180 { padding-top: 180px; } .pb--180 { padding-bottom: 180px; } .pl--180 { padding-left: 180px; } .pr--180 { padding-right: 180px; } .mt--180 { margin-top: 180px !important; } .mb--180 { margin-bottom: 180px; } .mr--180 { margin-right: 180px; } .ml--180 { margin-left: 180px; } .ptb--185 { padding: 185px 0; } .plr--185 { padding: 0 185px; } .pt--185 { padding-top: 185px; } .pb--185 { padding-bottom: 185px; } .pl--185 { padding-left: 185px; } .pr--185 { padding-right: 185px; } .mt--185 { margin-top: 185px !important; } .mb--185 { margin-bottom: 185px; } .mr--185 { margin-right: 185px; } .ml--185 { margin-left: 185px; } .ptb--190 { padding: 190px 0; } .plr--190 { padding: 0 190px; } .pt--190 { padding-top: 190px; } .pb--190 { padding-bottom: 190px; } .pl--190 { padding-left: 190px; } .pr--190 { padding-right: 190px; } .mt--190 { margin-top: 190px !important; } .mb--190 { margin-bottom: 190px; } .mr--190 { margin-right: 190px; } .ml--190 { margin-left: 190px; } .ptb--195 { padding: 195px 0; } .plr--195 { padding: 0 195px; } .pt--195 { padding-top: 195px; } .pb--195 { padding-bottom: 195px; } .pl--195 { padding-left: 195px; } .pr--195 { padding-right: 195px; } .mt--195 { margin-top: 195px !important; } .mb--195 { margin-bottom: 195px; } .mr--195 { margin-right: 195px; } .ml--195 { margin-left: 195px; } .ptb--200 { padding: 200px 0; } .plr--200 { padding: 0 200px; } .pt--200 { padding-top: 200px; } .pb--200 { padding-bottom: 200px; } .pl--200 { padding-left: 200px; } .pr--200 { padding-right: 200px; } .mt--200 { margin-top: 200px !important; } .mb--200 { margin-bottom: 200px; } .mr--200 { margin-right: 200px; } .ml--200 { margin-left: 200px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .ptb_lp--5 { padding: 5px 0; } .plr_lp--5 { padding: 0 5px; } .pt_lp--5 { padding-top: 5px; } .pb_lp--5 { padding-bottom: 5px; } .pl_lp--5 { padding-left: 5px; } .pr_lp--5 { padding-right: 5px; } .mt_lp--5 { margin-top: 5px; } .mb_lp--5 { margin-bottom: 5px; } .ptb_lp--10 { padding: 10px 0; } .plr_lp--10 { padding: 0 10px; } .pt_lp--10 { padding-top: 10px; } .pb_lp--10 { padding-bottom: 10px; } .pl_lp--10 { padding-left: 10px; } .pr_lp--10 { padding-right: 10px; } .mt_lp--10 { margin-top: 10px; } .mb_lp--10 { margin-bottom: 10px; } .ptb_lp--15 { padding: 15px 0; } .plr_lp--15 { padding: 0 15px; } .pt_lp--15 { padding-top: 15px; } .pb_lp--15 { padding-bottom: 15px; } .pl_lp--15 { padding-left: 15px; } .pr_lp--15 { padding-right: 15px; } .mt_lp--15 { margin-top: 15px; } .mb_lp--15 { margin-bottom: 15px; } .ptb_lp--20 { padding: 20px 0; } .plr_lp--20 { padding: 0 20px; } .pt_lp--20 { padding-top: 20px; } .pb_lp--20 { padding-bottom: 20px; } .pl_lp--20 { padding-left: 20px; } .pr_lp--20 { padding-right: 20px; } .mt_lp--20 { margin-top: 20px; } .mb_lp--20 { margin-bottom: 20px; } .ptb_lp--25 { padding: 25px 0; } .plr_lp--25 { padding: 0 25px; } .pt_lp--25 { padding-top: 25px; } .pb_lp--25 { padding-bottom: 25px; } .pl_lp--25 { padding-left: 25px; } .pr_lp--25 { padding-right: 25px; } .mt_lp--25 { margin-top: 25px; } .mb_lp--25 { margin-bottom: 25px; } .ptb_lp--30 { padding: 30px 0; } .plr_lp--30 { padding: 0 30px; } .pt_lp--30 { padding-top: 30px; } .pb_lp--30 { padding-bottom: 30px; } .pl_lp--30 { padding-left: 30px; } .pr_lp--30 { padding-right: 30px; } .mt_lp--30 { margin-top: 30px; } .mb_lp--30 { margin-bottom: 30px; } .ptb_lp--35 { padding: 35px 0; } .plr_lp--35 { padding: 0 35px; } .pt_lp--35 { padding-top: 35px; } .pb_lp--35 { padding-bottom: 35px; } .pl_lp--35 { padding-left: 35px; } .pr_lp--35 { padding-right: 35px; } .mt_lp--35 { margin-top: 35px; } .mb_lp--35 { margin-bottom: 35px; } .ptb_lp--40 { padding: 40px 0; } .plr_lp--40 { padding: 0 40px; } .pt_lp--40 { padding-top: 40px; } .pb_lp--40 { padding-bottom: 40px; } .pl_lp--40 { padding-left: 40px; } .pr_lp--40 { padding-right: 40px; } .mt_lp--40 { margin-top: 40px; } .mb_lp--40 { margin-bottom: 40px; } .ptb_lp--45 { padding: 45px 0; } .plr_lp--45 { padding: 0 45px; } .pt_lp--45 { padding-top: 45px; } .pb_lp--45 { padding-bottom: 45px; } .pl_lp--45 { padding-left: 45px; } .pr_lp--45 { padding-right: 45px; } .mt_lp--45 { margin-top: 45px; } .mb_lp--45 { margin-bottom: 45px; } .ptb_lp--50 { padding: 50px 0; } .plr_lp--50 { padding: 0 50px; } .pt_lp--50 { padding-top: 50px; } .pb_lp--50 { padding-bottom: 50px; } .pl_lp--50 { padding-left: 50px; } .pr_lp--50 { padding-right: 50px; } .mt_lp--50 { margin-top: 50px; } .mb_lp--50 { margin-bottom: 50px; } .ptb_lp--55 { padding: 55px 0; } .plr_lp--55 { padding: 0 55px; } .pt_lp--55 { padding-top: 55px; } .pb_lp--55 { padding-bottom: 55px; } .pl_lp--55 { padding-left: 55px; } .pr_lp--55 { padding-right: 55px; } .mt_lp--55 { margin-top: 55px; } .mb_lp--55 { margin-bottom: 55px; } .ptb_lp--60 { padding: 60px 0; } .plr_lp--60 { padding: 0 60px; } .pt_lp--60 { padding-top: 60px; } .pb_lp--60 { padding-bottom: 60px; } .pl_lp--60 { padding-left: 60px; } .pr_lp--60 { padding-right: 60px; } .mt_lp--60 { margin-top: 60px; } .mb_lp--60 { margin-bottom: 60px; } .ptb_lp--65 { padding: 65px 0; } .plr_lp--65 { padding: 0 65px; } .pt_lp--65 { padding-top: 65px; } .pb_lp--65 { padding-bottom: 65px; } .pl_lp--65 { padding-left: 65px; } .pr_lp--65 { padding-right: 65px; } .mt_lp--65 { margin-top: 65px; } .mb_lp--65 { margin-bottom: 65px; } .ptb_lp--70 { padding: 70px 0; } .plr_lp--70 { padding: 0 70px; } .pt_lp--70 { padding-top: 70px; } .pb_lp--70 { padding-bottom: 70px; } .pl_lp--70 { padding-left: 70px; } .pr_lp--70 { padding-right: 70px; } .mt_lp--70 { margin-top: 70px; } .mb_lp--70 { margin-bottom: 70px; } .ptb_lp--75 { padding: 75px 0; } .plr_lp--75 { padding: 0 75px; } .pt_lp--75 { padding-top: 75px; } .pb_lp--75 { padding-bottom: 75px; } .pl_lp--75 { padding-left: 75px; } .pr_lp--75 { padding-right: 75px; } .mt_lp--75 { margin-top: 75px; } .mb_lp--75 { margin-bottom: 75px; } .ptb_lp--80 { padding: 80px 0; } .plr_lp--80 { padding: 0 80px; } .pt_lp--80 { padding-top: 80px; } .pb_lp--80 { padding-bottom: 80px; } .pl_lp--80 { padding-left: 80px; } .pr_lp--80 { padding-right: 80px; } .mt_lp--80 { margin-top: 80px; } .mb_lp--80 { margin-bottom: 80px; } .ptb_lp--85 { padding: 85px 0; } .plr_lp--85 { padding: 0 85px; } .pt_lp--85 { padding-top: 85px; } .pb_lp--85 { padding-bottom: 85px; } .pl_lp--85 { padding-left: 85px; } .pr_lp--85 { padding-right: 85px; } .mt_lp--85 { margin-top: 85px; } .mb_lp--85 { margin-bottom: 85px; } .ptb_lp--90 { padding: 90px 0; } .plr_lp--90 { padding: 0 90px; } .pt_lp--90 { padding-top: 90px; } .pb_lp--90 { padding-bottom: 90px; } .pl_lp--90 { padding-left: 90px; } .pr_lp--90 { padding-right: 90px; } .mt_lp--90 { margin-top: 90px; } .mb_lp--90 { margin-bottom: 90px; } .ptb_lp--95 { padding: 95px 0; } .plr_lp--95 { padding: 0 95px; } .pt_lp--95 { padding-top: 95px; } .pb_lp--95 { padding-bottom: 95px; } .pl_lp--95 { padding-left: 95px; } .pr_lp--95 { padding-right: 95px; } .mt_lp--95 { margin-top: 95px; } .mb_lp--95 { margin-bottom: 95px; } .ptb_lp--100 { padding: 100px 0; } .plr_lp--100 { padding: 0 100px; } .pt_lp--100 { padding-top: 100px; } .pb_lp--100 { padding-bottom: 100px; } .pl_lp--100 { padding-left: 100px; } .pr_lp--100 { padding-right: 100px; } .mt_lp--100 { margin-top: 100px; } .mb_lp--100 { margin-bottom: 100px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .ptb_lg--5 { padding: 5px 0 !important; } .plr_lg--5 { padding: 0 5px !important; } .pt_lg--5 { padding-top: 5px !important; } .pb_lg--5 { padding-bottom: 5px !important; } .pl_lg--5 { padding-left: 5px !important; } .pr_lg--5 { padding-right: 5px !important; } .mt_lg--5 { margin-top: 5px !important; } .mb_lg--5 { margin-bottom: 5px !important; } .ml_lg--5 { margin-left: 5px !important; } .ptb_lg--10 { padding: 10px 0 !important; } .plr_lg--10 { padding: 0 10px !important; } .pt_lg--10 { padding-top: 10px !important; } .pb_lg--10 { padding-bottom: 10px !important; } .pl_lg--10 { padding-left: 10px !important; } .pr_lg--10 { padding-right: 10px !important; } .mt_lg--10 { margin-top: 10px !important; } .mb_lg--10 { margin-bottom: 10px !important; } .ml_lg--10 { margin-left: 10px !important; } .ptb_lg--15 { padding: 15px 0 !important; } .plr_lg--15 { padding: 0 15px !important; } .pt_lg--15 { padding-top: 15px !important; } .pb_lg--15 { padding-bottom: 15px !important; } .pl_lg--15 { padding-left: 15px !important; } .pr_lg--15 { padding-right: 15px !important; } .mt_lg--15 { margin-top: 15px !important; } .mb_lg--15 { margin-bottom: 15px !important; } .ml_lg--15 { margin-left: 15px !important; } .ptb_lg--20 { padding: 20px 0 !important; } .plr_lg--20 { padding: 0 20px !important; } .pt_lg--20 { padding-top: 20px !important; } .pb_lg--20 { padding-bottom: 20px !important; } .pl_lg--20 { padding-left: 20px !important; } .pr_lg--20 { padding-right: 20px !important; } .mt_lg--20 { margin-top: 20px !important; } .mb_lg--20 { margin-bottom: 20px !important; } .ml_lg--20 { margin-left: 20px !important; } .ptb_lg--25 { padding: 25px 0 !important; } .plr_lg--25 { padding: 0 25px !important; } .pt_lg--25 { padding-top: 25px !important; } .pb_lg--25 { padding-bottom: 25px !important; } .pl_lg--25 { padding-left: 25px !important; } .pr_lg--25 { padding-right: 25px !important; } .mt_lg--25 { margin-top: 25px !important; } .mb_lg--25 { margin-bottom: 25px !important; } .ml_lg--25 { margin-left: 25px !important; } .ptb_lg--30 { padding: 30px 0 !important; } .plr_lg--30 { padding: 0 30px !important; } .pt_lg--30 { padding-top: 30px !important; } .pb_lg--30 { padding-bottom: 30px !important; } .pl_lg--30 { padding-left: 30px !important; } .pr_lg--30 { padding-right: 30px !important; } .mt_lg--30 { margin-top: 30px !important; } .mb_lg--30 { margin-bottom: 30px !important; } .ml_lg--30 { margin-left: 30px !important; } .ptb_lg--35 { padding: 35px 0 !important; } .plr_lg--35 { padding: 0 35px !important; } .pt_lg--35 { padding-top: 35px !important; } .pb_lg--35 { padding-bottom: 35px !important; } .pl_lg--35 { padding-left: 35px !important; } .pr_lg--35 { padding-right: 35px !important; } .mt_lg--35 { margin-top: 35px !important; } .mb_lg--35 { margin-bottom: 35px !important; } .ml_lg--35 { margin-left: 35px !important; } .ptb_lg--40 { padding: 40px 0 !important; } .plr_lg--40 { padding: 0 40px !important; } .pt_lg--40 { padding-top: 40px !important; } .pb_lg--40 { padding-bottom: 40px !important; } .pl_lg--40 { padding-left: 40px !important; } .pr_lg--40 { padding-right: 40px !important; } .mt_lg--40 { margin-top: 40px !important; } .mb_lg--40 { margin-bottom: 40px !important; } .ml_lg--40 { margin-left: 40px !important; } .ptb_lg--45 { padding: 45px 0 !important; } .plr_lg--45 { padding: 0 45px !important; } .pt_lg--45 { padding-top: 45px !important; } .pb_lg--45 { padding-bottom: 45px !important; } .pl_lg--45 { padding-left: 45px !important; } .pr_lg--45 { padding-right: 45px !important; } .mt_lg--45 { margin-top: 45px !important; } .mb_lg--45 { margin-bottom: 45px !important; } .ml_lg--45 { margin-left: 45px !important; } .ptb_lg--50 { padding: 50px 0 !important; } .plr_lg--50 { padding: 0 50px !important; } .pt_lg--50 { padding-top: 50px !important; } .pb_lg--50 { padding-bottom: 50px !important; } .pl_lg--50 { padding-left: 50px !important; } .pr_lg--50 { padding-right: 50px !important; } .mt_lg--50 { margin-top: 50px !important; } .mb_lg--50 { margin-bottom: 50px !important; } .ml_lg--50 { margin-left: 50px !important; } .ptb_lg--55 { padding: 55px 0 !important; } .plr_lg--55 { padding: 0 55px !important; } .pt_lg--55 { padding-top: 55px !important; } .pb_lg--55 { padding-bottom: 55px !important; } .pl_lg--55 { padding-left: 55px !important; } .pr_lg--55 { padding-right: 55px !important; } .mt_lg--55 { margin-top: 55px !important; } .mb_lg--55 { margin-bottom: 55px !important; } .ml_lg--55 { margin-left: 55px !important; } .ptb_lg--60 { padding: 60px 0 !important; } .plr_lg--60 { padding: 0 60px !important; } .pt_lg--60 { padding-top: 60px !important; } .pb_lg--60 { padding-bottom: 60px !important; } .pl_lg--60 { padding-left: 60px !important; } .pr_lg--60 { padding-right: 60px !important; } .mt_lg--60 { margin-top: 60px !important; } .mb_lg--60 { margin-bottom: 60px !important; } .ml_lg--60 { margin-left: 60px !important; } .ptb_lg--65 { padding: 65px 0 !important; } .plr_lg--65 { padding: 0 65px !important; } .pt_lg--65 { padding-top: 65px !important; } .pb_lg--65 { padding-bottom: 65px !important; } .pl_lg--65 { padding-left: 65px !important; } .pr_lg--65 { padding-right: 65px !important; } .mt_lg--65 { margin-top: 65px !important; } .mb_lg--65 { margin-bottom: 65px !important; } .ml_lg--65 { margin-left: 65px !important; } .ptb_lg--70 { padding: 70px 0 !important; } .plr_lg--70 { padding: 0 70px !important; } .pt_lg--70 { padding-top: 70px !important; } .pb_lg--70 { padding-bottom: 70px !important; } .pl_lg--70 { padding-left: 70px !important; } .pr_lg--70 { padding-right: 70px !important; } .mt_lg--70 { margin-top: 70px !important; } .mb_lg--70 { margin-bottom: 70px !important; } .ml_lg--70 { margin-left: 70px !important; } .ptb_lg--75 { padding: 75px 0 !important; } .plr_lg--75 { padding: 0 75px !important; } .pt_lg--75 { padding-top: 75px !important; } .pb_lg--75 { padding-bottom: 75px !important; } .pl_lg--75 { padding-left: 75px !important; } .pr_lg--75 { padding-right: 75px !important; } .mt_lg--75 { margin-top: 75px !important; } .mb_lg--75 { margin-bottom: 75px !important; } .ml_lg--75 { margin-left: 75px !important; } .ptb_lg--80 { padding: 80px 0 !important; } .plr_lg--80 { padding: 0 80px !important; } .pt_lg--80 { padding-top: 80px !important; } .pb_lg--80 { padding-bottom: 80px !important; } .pl_lg--80 { padding-left: 80px !important; } .pr_lg--80 { padding-right: 80px !important; } .mt_lg--80 { margin-top: 80px !important; } .mb_lg--80 { margin-bottom: 80px !important; } .ml_lg--80 { margin-left: 80px !important; } .ptb_lg--85 { padding: 85px 0 !important; } .plr_lg--85 { padding: 0 85px !important; } .pt_lg--85 { padding-top: 85px !important; } .pb_lg--85 { padding-bottom: 85px !important; } .pl_lg--85 { padding-left: 85px !important; } .pr_lg--85 { padding-right: 85px !important; } .mt_lg--85 { margin-top: 85px !important; } .mb_lg--85 { margin-bottom: 85px !important; } .ml_lg--85 { margin-left: 85px !important; } .ptb_lg--90 { padding: 90px 0 !important; } .plr_lg--90 { padding: 0 90px !important; } .pt_lg--90 { padding-top: 90px !important; } .pb_lg--90 { padding-bottom: 90px !important; } .pl_lg--90 { padding-left: 90px !important; } .pr_lg--90 { padding-right: 90px !important; } .mt_lg--90 { margin-top: 90px !important; } .mb_lg--90 { margin-bottom: 90px !important; } .ml_lg--90 { margin-left: 90px !important; } .ptb_lg--95 { padding: 95px 0 !important; } .plr_lg--95 { padding: 0 95px !important; } .pt_lg--95 { padding-top: 95px !important; } .pb_lg--95 { padding-bottom: 95px !important; } .pl_lg--95 { padding-left: 95px !important; } .pr_lg--95 { padding-right: 95px !important; } .mt_lg--95 { margin-top: 95px !important; } .mb_lg--95 { margin-bottom: 95px !important; } .ml_lg--95 { margin-left: 95px !important; } .ptb_lg--100 { padding: 100px 0 !important; } .plr_lg--100 { padding: 0 100px !important; } .pt_lg--100 { padding-top: 100px !important; } .pb_lg--100 { padding-bottom: 100px !important; } .pl_lg--100 { padding-left: 100px !important; } .pr_lg--100 { padding-right: 100px !important; } .mt_lg--100 { margin-top: 100px !important; } .mb_lg--100 { margin-bottom: 100px !important; } .ml_lg--100 { margin-left: 100px !important; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .ptb_md--0 { padding: 0 !important; } .pl_md--0 { padding-left: 0 !important; } .pr_md--0 { padding-right: 0 !important; } .pt_md--0 { padding-top: 0 !important; } .pb_md--0 { padding-bottom: 0 !important; } .mr_md--0 { margin-right: 0 !important; } .ml_md--0 { margin-left: 0 !important; } .mt_md--0 { margin-top: 0 !important; } .mb_md--0 { margin-bottom: 0 !important; } .ptb_md--250 { padding: 250px 0 !important; } .ptb_md--5 { padding: 5px 0 !important; } .plr_md--5 { padding: 0 5px !important; } .pt_md--5 { padding-top: 5px !important; } .pb_md--5 { padding-bottom: 5px !important; } .pl_md--5 { padding-left: 5px !important; } .pr_md--5 { padding-right: 5px !important; } .mt_md--5 { margin-top: 5px !important; } .mb_md--5 { margin-bottom: 5px !important; } .ptb_md--10 { padding: 10px 0 !important; } .plr_md--10 { padding: 0 10px !important; } .pt_md--10 { padding-top: 10px !important; } .pb_md--10 { padding-bottom: 10px !important; } .pl_md--10 { padding-left: 10px !important; } .pr_md--10 { padding-right: 10px !important; } .mt_md--10 { margin-top: 10px !important; } .mb_md--10 { margin-bottom: 10px !important; } .ptb_md--15 { padding: 15px 0 !important; } .plr_md--15 { padding: 0 15px !important; } .pt_md--15 { padding-top: 15px !important; } .pb_md--15 { padding-bottom: 15px !important; } .pl_md--15 { padding-left: 15px !important; } .pr_md--15 { padding-right: 15px !important; } .mt_md--15 { margin-top: 15px !important; } .mb_md--15 { margin-bottom: 15px !important; } .ptb_md--20 { padding: 20px 0 !important; } .plr_md--20 { padding: 0 20px !important; } .pt_md--20 { padding-top: 20px !important; } .pb_md--20 { padding-bottom: 20px !important; } .pl_md--20 { padding-left: 20px !important; } .pr_md--20 { padding-right: 20px !important; } .mt_md--20 { margin-top: 20px !important; } .mb_md--20 { margin-bottom: 20px !important; } .ptb_md--25 { padding: 25px 0 !important; } .plr_md--25 { padding: 0 25px !important; } .pt_md--25 { padding-top: 25px !important; } .pb_md--25 { padding-bottom: 25px !important; } .pl_md--25 { padding-left: 25px !important; } .pr_md--25 { padding-right: 25px !important; } .mt_md--25 { margin-top: 25px !important; } .mb_md--25 { margin-bottom: 25px !important; } .ptb_md--30 { padding: 30px 0 !important; } .plr_md--30 { padding: 0 30px !important; } .pt_md--30 { padding-top: 30px !important; } .pb_md--30 { padding-bottom: 30px !important; } .pl_md--30 { padding-left: 30px !important; } .pr_md--30 { padding-right: 30px !important; } .mt_md--30 { margin-top: 30px !important; } .mb_md--30 { margin-bottom: 30px !important; } .ptb_md--35 { padding: 35px 0 !important; } .plr_md--35 { padding: 0 35px !important; } .pt_md--35 { padding-top: 35px !important; } .pb_md--35 { padding-bottom: 35px !important; } .pl_md--35 { padding-left: 35px !important; } .pr_md--35 { padding-right: 35px !important; } .mt_md--35 { margin-top: 35px !important; } .mb_md--35 { margin-bottom: 35px !important; } .ptb_md--40 { padding: 40px 0 !important; } .plr_md--40 { padding: 0 40px !important; } .pt_md--40 { padding-top: 40px !important; } .pb_md--40 { padding-bottom: 40px !important; } .pl_md--40 { padding-left: 40px !important; } .pr_md--40 { padding-right: 40px !important; } .mt_md--40 { margin-top: 40px !important; } .mb_md--40 { margin-bottom: 40px !important; } .ptb_md--45 { padding: 45px 0 !important; } .plr_md--45 { padding: 0 45px !important; } .pt_md--45 { padding-top: 45px !important; } .pb_md--45 { padding-bottom: 45px !important; } .pl_md--45 { padding-left: 45px !important; } .pr_md--45 { padding-right: 45px !important; } .mt_md--45 { margin-top: 45px !important; } .mb_md--45 { margin-bottom: 45px !important; } .ptb_md--50 { padding: 50px 0 !important; } .plr_md--50 { padding: 0 50px !important; } .pt_md--50 { padding-top: 50px !important; } .pb_md--50 { padding-bottom: 50px !important; } .pl_md--50 { padding-left: 50px !important; } .pr_md--50 { padding-right: 50px !important; } .mt_md--50 { margin-top: 50px !important; } .mb_md--50 { margin-bottom: 50px !important; } .ptb_md--55 { padding: 55px 0 !important; } .plr_md--55 { padding: 0 55px !important; } .pt_md--55 { padding-top: 55px !important; } .pb_md--55 { padding-bottom: 55px !important; } .pl_md--55 { padding-left: 55px !important; } .pr_md--55 { padding-right: 55px !important; } .mt_md--55 { margin-top: 55px !important; } .mb_md--55 { margin-bottom: 55px !important; } .ptb_md--60 { padding: 60px 0 !important; } .plr_md--60 { padding: 0 60px !important; } .pt_md--60 { padding-top: 60px !important; } .pb_md--60 { padding-bottom: 60px !important; } .pl_md--60 { padding-left: 60px !important; } .pr_md--60 { padding-right: 60px !important; } .mt_md--60 { margin-top: 60px !important; } .mb_md--60 { margin-bottom: 60px !important; } .ptb_md--65 { padding: 65px 0 !important; } .plr_md--65 { padding: 0 65px !important; } .pt_md--65 { padding-top: 65px !important; } .pb_md--65 { padding-bottom: 65px !important; } .pl_md--65 { padding-left: 65px !important; } .pr_md--65 { padding-right: 65px !important; } .mt_md--65 { margin-top: 65px !important; } .mb_md--65 { margin-bottom: 65px !important; } .ptb_md--70 { padding: 70px 0 !important; } .plr_md--70 { padding: 0 70px !important; } .pt_md--70 { padding-top: 70px !important; } .pb_md--70 { padding-bottom: 70px !important; } .pl_md--70 { padding-left: 70px !important; } .pr_md--70 { padding-right: 70px !important; } .mt_md--70 { margin-top: 70px !important; } .mb_md--70 { margin-bottom: 70px !important; } .ptb_md--75 { padding: 75px 0 !important; } .plr_md--75 { padding: 0 75px !important; } .pt_md--75 { padding-top: 75px !important; } .pb_md--75 { padding-bottom: 75px !important; } .pl_md--75 { padding-left: 75px !important; } .pr_md--75 { padding-right: 75px !important; } .mt_md--75 { margin-top: 75px !important; } .mb_md--75 { margin-bottom: 75px !important; } .ptb_md--80 { padding: 80px 0 !important; } .plr_md--80 { padding: 0 80px !important; } .pt_md--80 { padding-top: 80px !important; } .pb_md--80 { padding-bottom: 80px !important; } .pl_md--80 { padding-left: 80px !important; } .pr_md--80 { padding-right: 80px !important; } .mt_md--80 { margin-top: 80px !important; } .mb_md--80 { margin-bottom: 80px !important; } .ptb_md--85 { padding: 85px 0 !important; } .plr_md--85 { padding: 0 85px !important; } .pt_md--85 { padding-top: 85px !important; } .pb_md--85 { padding-bottom: 85px !important; } .pl_md--85 { padding-left: 85px !important; } .pr_md--85 { padding-right: 85px !important; } .mt_md--85 { margin-top: 85px !important; } .mb_md--85 { margin-bottom: 85px !important; } .ptb_md--90 { padding: 90px 0 !important; } .plr_md--90 { padding: 0 90px !important; } .pt_md--90 { padding-top: 90px !important; } .pb_md--90 { padding-bottom: 90px !important; } .pl_md--90 { padding-left: 90px !important; } .pr_md--90 { padding-right: 90px !important; } .mt_md--90 { margin-top: 90px !important; } .mb_md--90 { margin-bottom: 90px !important; } .ptb_md--95 { padding: 95px 0 !important; } .plr_md--95 { padding: 0 95px !important; } .pt_md--95 { padding-top: 95px !important; } .pb_md--95 { padding-bottom: 95px !important; } .pl_md--95 { padding-left: 95px !important; } .pr_md--95 { padding-right: 95px !important; } .mt_md--95 { margin-top: 95px !important; } .mb_md--95 { margin-bottom: 95px !important; } .ptb_md--100 { padding: 100px 0 !important; } .plr_md--100 { padding: 0 100px !important; } .pt_md--100 { padding-top: 100px !important; } .pb_md--100 { padding-bottom: 100px !important; } .pl_md--100 { padding-left: 100px !important; } .pr_md--100 { padding-right: 100px !important; } .mt_md--100 { margin-top: 100px !important; } .mb_md--100 { margin-bottom: 100px !important; } } @media only screen and (max-width: 767px) { .ptb_sm--250 { padding: 250px 0 !important; } .ptb_sm--0 { padding: 0 !important; } .pl_sm--0 { padding-left: 0 !important; } .pr_sm--0 { padding-right: 0 !important; } .pt_sm--0 { padding-top: 0 !important; } .pb_sm--0 { padding-bottom: 0 !important; } .mr_sm--0 { margin-right: 0 !important; } .ml_sm--0 { margin-left: 0 !important; } .mt_sm--0 { margin-top: 0 !important; } .mb_sm--0 { margin-bottom: 0 !important; } .pt_sm--150 { padding-top: 150px !important; } .pb_sm--110 { padding-bottom: 110px !important; } .ptb_sm--5 { padding: 5px 0 !important; } .plr_sm--5 { padding: 0 5px !important; } .pt_sm--5 { padding-top: 5px !important; } .pb_sm--5 { padding-bottom: 5px !important; } .pl_sm--5 { padding-left: 5px !important; } .pr_sm--5 { padding-right: 5px !important; } .mt_sm--5 { margin-top: 5px !important; } .ml_sm--5 { margin-left: 5px !important; } .mr_sm--5 { margin-right: 5px !important; } .mb_sm--5 { margin-bottom: 5px !important; } .ptb_sm--10 { padding: 10px 0 !important; } .plr_sm--10 { padding: 0 10px !important; } .pt_sm--10 { padding-top: 10px !important; } .pb_sm--10 { padding-bottom: 10px !important; } .pl_sm--10 { padding-left: 10px !important; } .pr_sm--10 { padding-right: 10px !important; } .mt_sm--10 { margin-top: 10px !important; } .ml_sm--10 { margin-left: 10px !important; } .mr_sm--10 { margin-right: 10px !important; } .mb_sm--10 { margin-bottom: 10px !important; } .ptb_sm--15 { padding: 15px 0 !important; } .plr_sm--15 { padding: 0 15px !important; } .pt_sm--15 { padding-top: 15px !important; } .pb_sm--15 { padding-bottom: 15px !important; } .pl_sm--15 { padding-left: 15px !important; } .pr_sm--15 { padding-right: 15px !important; } .mt_sm--15 { margin-top: 15px !important; } .ml_sm--15 { margin-left: 15px !important; } .mr_sm--15 { margin-right: 15px !important; } .mb_sm--15 { margin-bottom: 15px !important; } .ptb_sm--20 { padding: 20px 0 !important; } .plr_sm--20 { padding: 0 20px !important; } .pt_sm--20 { padding-top: 20px !important; } .pb_sm--20 { padding-bottom: 20px !important; } .pl_sm--20 { padding-left: 20px !important; } .pr_sm--20 { padding-right: 20px !important; } .mt_sm--20 { margin-top: 20px !important; } .ml_sm--20 { margin-left: 20px !important; } .mr_sm--20 { margin-right: 20px !important; } .mb_sm--20 { margin-bottom: 20px !important; } .ptb_sm--25 { padding: 25px 0 !important; } .plr_sm--25 { padding: 0 25px !important; } .pt_sm--25 { padding-top: 25px !important; } .pb_sm--25 { padding-bottom: 25px !important; } .pl_sm--25 { padding-left: 25px !important; } .pr_sm--25 { padding-right: 25px !important; } .mt_sm--25 { margin-top: 25px !important; } .ml_sm--25 { margin-left: 25px !important; } .mr_sm--25 { margin-right: 25px !important; } .mb_sm--25 { margin-bottom: 25px !important; } .ptb_sm--30 { padding: 30px 0 !important; } .plr_sm--30 { padding: 0 30px !important; } .pt_sm--30 { padding-top: 30px !important; } .pb_sm--30 { padding-bottom: 30px !important; } .pl_sm--30 { padding-left: 30px !important; } .pr_sm--30 { padding-right: 30px !important; } .mt_sm--30 { margin-top: 30px !important; } .ml_sm--30 { margin-left: 30px !important; } .mr_sm--30 { margin-right: 30px !important; } .mb_sm--30 { margin-bottom: 30px !important; } .ptb_sm--35 { padding: 35px 0 !important; } .plr_sm--35 { padding: 0 35px !important; } .pt_sm--35 { padding-top: 35px !important; } .pb_sm--35 { padding-bottom: 35px !important; } .pl_sm--35 { padding-left: 35px !important; } .pr_sm--35 { padding-right: 35px !important; } .mt_sm--35 { margin-top: 35px !important; } .ml_sm--35 { margin-left: 35px !important; } .mr_sm--35 { margin-right: 35px !important; } .mb_sm--35 { margin-bottom: 35px !important; } .ptb_sm--40 { padding: 40px 0 !important; } .plr_sm--40 { padding: 0 40px !important; } .pt_sm--40 { padding-top: 40px !important; } .pb_sm--40 { padding-bottom: 40px !important; } .pl_sm--40 { padding-left: 40px !important; } .pr_sm--40 { padding-right: 40px !important; } .mt_sm--40 { margin-top: 40px !important; } .ml_sm--40 { margin-left: 40px !important; } .mr_sm--40 { margin-right: 40px !important; } .mb_sm--40 { margin-bottom: 40px !important; } .ptb_sm--45 { padding: 45px 0 !important; } .plr_sm--45 { padding: 0 45px !important; } .pt_sm--45 { padding-top: 45px !important; } .pb_sm--45 { padding-bottom: 45px !important; } .pl_sm--45 { padding-left: 45px !important; } .pr_sm--45 { padding-right: 45px !important; } .mt_sm--45 { margin-top: 45px !important; } .ml_sm--45 { margin-left: 45px !important; } .mr_sm--45 { margin-right: 45px !important; } .mb_sm--45 { margin-bottom: 45px !important; } .ptb_sm--50 { padding: 50px 0 !important; } .plr_sm--50 { padding: 0 50px !important; } .pt_sm--50 { padding-top: 50px !important; } .pb_sm--50 { padding-bottom: 50px !important; } .pl_sm--50 { padding-left: 50px !important; } .pr_sm--50 { padding-right: 50px !important; } .mt_sm--50 { margin-top: 50px !important; } .ml_sm--50 { margin-left: 50px !important; } .mr_sm--50 { margin-right: 50px !important; } .mb_sm--50 { margin-bottom: 50px !important; } .ptb_sm--55 { padding: 55px 0 !important; } .plr_sm--55 { padding: 0 55px !important; } .pt_sm--55 { padding-top: 55px !important; } .pb_sm--55 { padding-bottom: 55px !important; } .pl_sm--55 { padding-left: 55px !important; } .pr_sm--55 { padding-right: 55px !important; } .mt_sm--55 { margin-top: 55px !important; } .ml_sm--55 { margin-left: 55px !important; } .mr_sm--55 { margin-right: 55px !important; } .mb_sm--55 { margin-bottom: 55px !important; } .ptb_sm--60 { padding: 60px 0 !important; } .plr_sm--60 { padding: 0 60px !important; } .pt_sm--60 { padding-top: 60px !important; } .pb_sm--60 { padding-bottom: 60px !important; } .pl_sm--60 { padding-left: 60px !important; } .pr_sm--60 { padding-right: 60px !important; } .mt_sm--60 { margin-top: 60px !important; } .ml_sm--60 { margin-left: 60px !important; } .mr_sm--60 { margin-right: 60px !important; } .mb_sm--60 { margin-bottom: 60px !important; } .ptb_sm--65 { padding: 65px 0 !important; } .plr_sm--65 { padding: 0 65px !important; } .pt_sm--65 { padding-top: 65px !important; } .pb_sm--65 { padding-bottom: 65px !important; } .pl_sm--65 { padding-left: 65px !important; } .pr_sm--65 { padding-right: 65px !important; } .mt_sm--65 { margin-top: 65px !important; } .ml_sm--65 { margin-left: 65px !important; } .mr_sm--65 { margin-right: 65px !important; } .mb_sm--65 { margin-bottom: 65px !important; } .ptb_sm--70 { padding: 70px 0 !important; } .plr_sm--70 { padding: 0 70px !important; } .pt_sm--70 { padding-top: 70px !important; } .pb_sm--70 { padding-bottom: 70px !important; } .pl_sm--70 { padding-left: 70px !important; } .pr_sm--70 { padding-right: 70px !important; } .mt_sm--70 { margin-top: 70px !important; } .ml_sm--70 { margin-left: 70px !important; } .mr_sm--70 { margin-right: 70px !important; } .mb_sm--70 { margin-bottom: 70px !important; } .ptb_sm--75 { padding: 75px 0 !important; } .plr_sm--75 { padding: 0 75px !important; } .pt_sm--75 { padding-top: 75px !important; } .pb_sm--75 { padding-bottom: 75px !important; } .pl_sm--75 { padding-left: 75px !important; } .pr_sm--75 { padding-right: 75px !important; } .mt_sm--75 { margin-top: 75px !important; } .ml_sm--75 { margin-left: 75px !important; } .mr_sm--75 { margin-right: 75px !important; } .mb_sm--75 { margin-bottom: 75px !important; } .ptb_sm--80 { padding: 80px 0 !important; } .plr_sm--80 { padding: 0 80px !important; } .pt_sm--80 { padding-top: 80px !important; } .pb_sm--80 { padding-bottom: 80px !important; } .pl_sm--80 { padding-left: 80px !important; } .pr_sm--80 { padding-right: 80px !important; } .mt_sm--80 { margin-top: 80px !important; } .ml_sm--80 { margin-left: 80px !important; } .mr_sm--80 { margin-right: 80px !important; } .mb_sm--80 { margin-bottom: 80px !important; } .ptb_sm--85 { padding: 85px 0 !important; } .plr_sm--85 { padding: 0 85px !important; } .pt_sm--85 { padding-top: 85px !important; } .pb_sm--85 { padding-bottom: 85px !important; } .pl_sm--85 { padding-left: 85px !important; } .pr_sm--85 { padding-right: 85px !important; } .mt_sm--85 { margin-top: 85px !important; } .ml_sm--85 { margin-left: 85px !important; } .mr_sm--85 { margin-right: 85px !important; } .mb_sm--85 { margin-bottom: 85px !important; } .ptb_sm--90 { padding: 90px 0 !important; } .plr_sm--90 { padding: 0 90px !important; } .pt_sm--90 { padding-top: 90px !important; } .pb_sm--90 { padding-bottom: 90px !important; } .pl_sm--90 { padding-left: 90px !important; } .pr_sm--90 { padding-right: 90px !important; } .mt_sm--90 { margin-top: 90px !important; } .ml_sm--90 { margin-left: 90px !important; } .mr_sm--90 { margin-right: 90px !important; } .mb_sm--90 { margin-bottom: 90px !important; } .ptb_sm--95 { padding: 95px 0 !important; } .plr_sm--95 { padding: 0 95px !important; } .pt_sm--95 { padding-top: 95px !important; } .pb_sm--95 { padding-bottom: 95px !important; } .pl_sm--95 { padding-left: 95px !important; } .pr_sm--95 { padding-right: 95px !important; } .mt_sm--95 { margin-top: 95px !important; } .ml_sm--95 { margin-left: 95px !important; } .mr_sm--95 { margin-right: 95px !important; } .mb_sm--95 { margin-bottom: 95px !important; } .ptb_sm--100 { padding: 100px 0 !important; } .plr_sm--100 { padding: 0 100px !important; } .pt_sm--100 { padding-top: 100px !important; } .pb_sm--100 { padding-bottom: 100px !important; } .pl_sm--100 { padding-left: 100px !important; } .pr_sm--100 { padding-right: 100px !important; } .mt_sm--100 { margin-top: 100px !important; } .ml_sm--100 { margin-left: 100px !important; } .mr_sm--100 { margin-right: 100px !important; } .mb_sm--100 { margin-bottom: 100px !important; } .pl_sm--0 { padding-left: 0; } .pr_sm--0 { padding-right: 0; } .pt_sm--0 { padding-top: 0; } .pb_sm--0 { padding-bottom: 0; } .mr_sm--0 { margin-right: 0; } .ml_sm--0 { margin-left: 0; } .mt_sm--0 { margin-top: 0; } .mb_sm--0 { margin-bottom: 0; } } @media only screen and (max-width: 575px) { .ptb_mobile--5 { padding: 5px 0 !important; } .plr_mobile--5 { padding: 0 5px !important; } .pt_mobile--5 { padding-top: 5px !important; } .pb_mobile--5 { padding-bottom: 5px !important; } .pl_mobile--5 { padding-left: 5px !important; } .pr_mobile--5 { padding-right: 5px !important; } .mt_mobile--5 { margin-top: 5px !important; } .mb_mobile--5 { margin-bottom: 5px !important; } .ptb_mobile--10 { padding: 10px 0 !important; } .plr_mobile--10 { padding: 0 10px !important; } .pt_mobile--10 { padding-top: 10px !important; } .pb_mobile--10 { padding-bottom: 10px !important; } .pl_mobile--10 { padding-left: 10px !important; } .pr_mobile--10 { padding-right: 10px !important; } .mt_mobile--10 { margin-top: 10px !important; } .mb_mobile--10 { margin-bottom: 10px !important; } .ptb_mobile--15 { padding: 15px 0 !important; } .plr_mobile--15 { padding: 0 15px !important; } .pt_mobile--15 { padding-top: 15px !important; } .pb_mobile--15 { padding-bottom: 15px !important; } .pl_mobile--15 { padding-left: 15px !important; } .pr_mobile--15 { padding-right: 15px !important; } .mt_mobile--15 { margin-top: 15px !important; } .mb_mobile--15 { margin-bottom: 15px !important; } .ptb_mobile--20 { padding: 20px 0 !important; } .plr_mobile--20 { padding: 0 20px !important; } .pt_mobile--20 { padding-top: 20px !important; } .pb_mobile--20 { padding-bottom: 20px !important; } .pl_mobile--20 { padding-left: 20px !important; } .pr_mobile--20 { padding-right: 20px !important; } .mt_mobile--20 { margin-top: 20px !important; } .mb_mobile--20 { margin-bottom: 20px !important; } .ptb_mobile--25 { padding: 25px 0 !important; } .plr_mobile--25 { padding: 0 25px !important; } .pt_mobile--25 { padding-top: 25px !important; } .pb_mobile--25 { padding-bottom: 25px !important; } .pl_mobile--25 { padding-left: 25px !important; } .pr_mobile--25 { padding-right: 25px !important; } .mt_mobile--25 { margin-top: 25px !important; } .mb_mobile--25 { margin-bottom: 25px !important; } .ptb_mobile--30 { padding: 30px 0 !important; } .plr_mobile--30 { padding: 0 30px !important; } .pt_mobile--30 { padding-top: 30px !important; } .pb_mobile--30 { padding-bottom: 30px !important; } .pl_mobile--30 { padding-left: 30px !important; } .pr_mobile--30 { padding-right: 30px !important; } .mt_mobile--30 { margin-top: 30px !important; } .mb_mobile--30 { margin-bottom: 30px !important; } .ptb_mobile--35 { padding: 35px 0 !important; } .plr_mobile--35 { padding: 0 35px !important; } .pt_mobile--35 { padding-top: 35px !important; } .pb_mobile--35 { padding-bottom: 35px !important; } .pl_mobile--35 { padding-left: 35px !important; } .pr_mobile--35 { padding-right: 35px !important; } .mt_mobile--35 { margin-top: 35px !important; } .mb_mobile--35 { margin-bottom: 35px !important; } .ptb_mobile--40 { padding: 40px 0 !important; } .plr_mobile--40 { padding: 0 40px !important; } .pt_mobile--40 { padding-top: 40px !important; } .pb_mobile--40 { padding-bottom: 40px !important; } .pl_mobile--40 { padding-left: 40px !important; } .pr_mobile--40 { padding-right: 40px !important; } .mt_mobile--40 { margin-top: 40px !important; } .mb_mobile--40 { margin-bottom: 40px !important; } .ptb_mobile--45 { padding: 45px 0 !important; } .plr_mobile--45 { padding: 0 45px !important; } .pt_mobile--45 { padding-top: 45px !important; } .pb_mobile--45 { padding-bottom: 45px !important; } .pl_mobile--45 { padding-left: 45px !important; } .pr_mobile--45 { padding-right: 45px !important; } .mt_mobile--45 { margin-top: 45px !important; } .mb_mobile--45 { margin-bottom: 45px !important; } .ptb_mobile--50 { padding: 50px 0 !important; } .plr_mobile--50 { padding: 0 50px !important; } .pt_mobile--50 { padding-top: 50px !important; } .pb_mobile--50 { padding-bottom: 50px !important; } .pl_mobile--50 { padding-left: 50px !important; } .pr_mobile--50 { padding-right: 50px !important; } .mt_mobile--50 { margin-top: 50px !important; } .mb_mobile--50 { margin-bottom: 50px !important; } .ptb_mobile--55 { padding: 55px 0 !important; } .plr_mobile--55 { padding: 0 55px !important; } .pt_mobile--55 { padding-top: 55px !important; } .pb_mobile--55 { padding-bottom: 55px !important; } .pl_mobile--55 { padding-left: 55px !important; } .pr_mobile--55 { padding-right: 55px !important; } .mt_mobile--55 { margin-top: 55px !important; } .mb_mobile--55 { margin-bottom: 55px !important; } .ptb_mobile--60 { padding: 60px 0 !important; } .plr_mobile--60 { padding: 0 60px !important; } .pt_mobile--60 { padding-top: 60px !important; } .pb_mobile--60 { padding-bottom: 60px !important; } .pl_mobile--60 { padding-left: 60px !important; } .pr_mobile--60 { padding-right: 60px !important; } .mt_mobile--60 { margin-top: 60px !important; } .mb_mobile--60 { margin-bottom: 60px !important; } .ptb_mobile--65 { padding: 65px 0 !important; } .plr_mobile--65 { padding: 0 65px !important; } .pt_mobile--65 { padding-top: 65px !important; } .pb_mobile--65 { padding-bottom: 65px !important; } .pl_mobile--65 { padding-left: 65px !important; } .pr_mobile--65 { padding-right: 65px !important; } .mt_mobile--65 { margin-top: 65px !important; } .mb_mobile--65 { margin-bottom: 65px !important; } .ptb_mobile--70 { padding: 70px 0 !important; } .plr_mobile--70 { padding: 0 70px !important; } .pt_mobile--70 { padding-top: 70px !important; } .pb_mobile--70 { padding-bottom: 70px !important; } .pl_mobile--70 { padding-left: 70px !important; } .pr_mobile--70 { padding-right: 70px !important; } .mt_mobile--70 { margin-top: 70px !important; } .mb_mobile--70 { margin-bottom: 70px !important; } .ptb_mobile--75 { padding: 75px 0 !important; } .plr_mobile--75 { padding: 0 75px !important; } .pt_mobile--75 { padding-top: 75px !important; } .pb_mobile--75 { padding-bottom: 75px !important; } .pl_mobile--75 { padding-left: 75px !important; } .pr_mobile--75 { padding-right: 75px !important; } .mt_mobile--75 { margin-top: 75px !important; } .mb_mobile--75 { margin-bottom: 75px !important; } .ptb_mobile--80 { padding: 80px 0 !important; } .plr_mobile--80 { padding: 0 80px !important; } .pt_mobile--80 { padding-top: 80px !important; } .pb_mobile--80 { padding-bottom: 80px !important; } .pl_mobile--80 { padding-left: 80px !important; } .pr_mobile--80 { padding-right: 80px !important; } .mt_mobile--80 { margin-top: 80px !important; } .mb_mobile--80 { margin-bottom: 80px !important; } .ptb_mobile--85 { padding: 85px 0 !important; } .plr_mobile--85 { padding: 0 85px !important; } .pt_mobile--85 { padding-top: 85px !important; } .pb_mobile--85 { padding-bottom: 85px !important; } .pl_mobile--85 { padding-left: 85px !important; } .pr_mobile--85 { padding-right: 85px !important; } .mt_mobile--85 { margin-top: 85px !important; } .mb_mobile--85 { margin-bottom: 85px !important; } .ptb_mobile--90 { padding: 90px 0 !important; } .plr_mobile--90 { padding: 0 90px !important; } .pt_mobile--90 { padding-top: 90px !important; } .pb_mobile--90 { padding-bottom: 90px !important; } .pl_mobile--90 { padding-left: 90px !important; } .pr_mobile--90 { padding-right: 90px !important; } .mt_mobile--90 { margin-top: 90px !important; } .mb_mobile--90 { margin-bottom: 90px !important; } .ptb_mobile--95 { padding: 95px 0 !important; } .plr_mobile--95 { padding: 0 95px !important; } .pt_mobile--95 { padding-top: 95px !important; } .pb_mobile--95 { padding-bottom: 95px !important; } .pl_mobile--95 { padding-left: 95px !important; } .pr_mobile--95 { padding-right: 95px !important; } .mt_mobile--95 { margin-top: 95px !important; } .mb_mobile--95 { margin-bottom: 95px !important; } .ptb_mobile--100 { padding: 100px 0 !important; } .plr_mobile--100 { padding: 0 100px !important; } .pt_mobile--100 { padding-top: 100px !important; } .pb_mobile--100 { padding-bottom: 100px !important; } .pl_mobile--100 { padding-left: 100px !important; } .pr_mobile--100 { padding-right: 100px !important; } .mt_mobile--100 { margin-top: 100px !important; } .mb_mobile--100 { margin-bottom: 100px !important; } } .slick-gutter-5 { margin-left: -5px; margin-right: -5px; } .slick-gutter-5 .slick-slide { padding-left: 5px; padding-right: 5px; } .slick-gutter-10 { margin-left: -10px; margin-right: -10px; } .slick-gutter-10 .slick-slide { padding-left: 10px; padding-right: 10px; } .slick-gutter-15 { margin-left: -15px; margin-right: -15px; } .slick-gutter-15 .slick-slide { padding-left: 15px; padding-right: 15px; } .slick-gutter-20 { margin-left: -20px; margin-right: -20px; } .slick-gutter-20 .slick-slide { padding-left: 20px; padding-right: 20px; } .slick-gutter-25 { margin-left: -25px; margin-right: -25px; } .slick-gutter-25 .slick-slide { padding-left: 25px; padding-right: 25px; } .slick-gutter-30 { margin-left: -30px; margin-right: -30px; } .slick-gutter-30 .slick-slide { padding-left: 30px; padding-right: 30px; } .slick-gutter-35 { margin-left: -35px; margin-right: -35px; } .slick-gutter-35 .slick-slide { padding-left: 35px; padding-right: 35px; } .slick-gutter-40 { margin-left: -40px; margin-right: -40px; } .slick-gutter-40 .slick-slide { padding-left: 40px; padding-right: 40px; } .slick-gutter-45 { margin-left: -45px; margin-right: -45px; } .slick-gutter-45 .slick-slide { padding-left: 45px; padding-right: 45px; } .slick-gutter-50 { margin-left: -50px; margin-right: -50px; } .slick-gutter-50 .slick-slide { padding-left: 50px; padding-right: 50px; } .slick-gutter-55 { margin-left: -55px; margin-right: -55px; } .slick-gutter-55 .slick-slide { padding-left: 55px; padding-right: 55px; } .slick-gutter-60 { margin-left: -60px; margin-right: -60px; } .slick-gutter-60 .slick-slide { padding-left: 60px; padding-right: 60px; } .slick-gutter-65 { margin-left: -65px; margin-right: -65px; } .slick-gutter-65 .slick-slide { padding-left: 65px; padding-right: 65px; } .slick-gutter-70 { margin-left: -70px; margin-right: -70px; } .slick-gutter-70 .slick-slide { padding-left: 70px; padding-right: 70px; } .slick-gutter-75 { margin-left: -75px; margin-right: -75px; } .slick-gutter-75 .slick-slide { padding-left: 75px; padding-right: 75px; } .slick-gutter-80 { margin-left: -80px; margin-right: -80px; } .slick-gutter-80 .slick-slide { padding-left: 80px; padding-right: 80px; } .slick-gutter-85 { margin-left: -85px; margin-right: -85px; } .slick-gutter-85 .slick-slide { padding-left: 85px; padding-right: 85px; } .slick-gutter-90 { margin-left: -90px; margin-right: -90px; } .slick-gutter-90 .slick-slide { padding-left: 90px; padding-right: 90px; } .slick-gutter-95 { margin-left: -95px; margin-right: -95px; } .slick-gutter-95 .slick-slide { padding-left: 95px; padding-right: 95px; } .slick-gutter-100 { margin-left: -100px; margin-right: -100px; } .slick-gutter-100 .slick-slide { padding-left: 100px; padding-right: 100px; } /*======= Common Style Css ======*/ .primary-color { color: #0ac775 !important; } .secondary-color { color: #FF9166 !important; } .tertiary-color { color: #49CCFF !important; } .extra01-color { color: #FFCD3E !important; } .extra02-color { color: #5BCC9F !important; } .extra03-color { color: #FFFFFF !important; } .extra04-color { color: #00CFFF !important; } .extra05-color { color: #7A19FF !important; } .extra06-color { color: #FF8A5B !important; } .extra07-color { color: #007AFF !important; } .extra08-color { color: #00D09C !important; } .extra09-color { color: #00004B !important; } .extra10-color { color: #007AFF !important; } .black-color { color: #000000 !important; } .darker-color { color: #52526C !important; } .darkest-color { color: #000248 !important; } .dark-color { color: #757589 !important; } .mid-color { color: #999AB6 !important; } .light-color { color: #C7C7D5 !important; } .lighter-color { color: #F6F5FA !important; } .lightest-color { color: #FAFAFB !important; } .white-color { color: #FFFFFF !important; } .tealLight-color { color: #D1EAED !important; } .tealLighter-color { color: #DCF7FE !important; } .liststyle { padding: 0; margin: 0; list-style: none; } .fontWeight900 { font-weight: 900 !important; } .fontWeight800 { font-weight: 800 !important; } .fontWeight700 { font-weight: 700 !important; } .fontWeight600 { font-weight: 600 !important; } .fontWeight500 { font-weight: 500 !important; } .fontWeight400 { font-weight: 400 !important; } .fontWeight300 { font-weight: 300 !important; } /* Theme Gradient */ .theme-gradient { background: -webkit-gradient(linear, left top, left bottom, from(#EAF8FF), to(#F6F6FF)); background: -webkit-linear-gradient(top, #EAF8FF 0%, #F6F6FF 100%); background: -o-linear-gradient(top, #EAF8FF 0%, #F6F6FF 100%); background: linear-gradient(180deg, #EAF8FF 0%, #F6F6FF 100%); } .theme-gradient-3 { background: -webkit-gradient(linear, right top, left top, from(#FFFFFF), color-stop(24.38%, #F4FF99), color-stop(77.05%, #E3D4F9), to(#FFFFFF)); background: -webkit-linear-gradient(right, #FFFFFF 0%, #F4FF99 24.38%, #E3D4F9 77.05%, #FFFFFF 100%); background: -o-linear-gradient(right, #FFFFFF 0%, #F4FF99 24.38%, #E3D4F9 77.05%, #FFFFFF 100%); background: linear-gradient(270deg, #FFFFFF 0%, #F4FF99 24.38%, #E3D4F9 77.05%, #FFFFFF 100%); } .theme-gradient-4 { background: -webkit-gradient(linear, left top, left bottom, from(#FEF7E2), to(#EEEEFD)); background: -webkit-linear-gradient(top, #FEF7E2 0%, #EEEEFD 100%); background: -o-linear-gradient(top, #FEF7E2 0%, #EEEEFD 100%); background: linear-gradient(180deg, #FEF7E2 0%, #EEEEFD 100%); } .theme-gradient-5 { background: -webkit-linear-gradient(315.26deg, #D6FFFC 0%, #FAE7E4 100%); background: -o-linear-gradient(315.26deg, #D6FFFC 0%, #FAE7E4 100%); background: linear-gradient(134.74deg, #D6FFFC 0%, #FAE7E4 100%); } .theme-gradient-6 { background: -webkit-gradient(linear, left top, left bottom, from(#A7FFF5), to(rgba(255, 255, 255, 0))); background: -webkit-linear-gradient(top, #A7FFF5 0%, rgba(255, 255, 255, 0) 100%); background: -o-linear-gradient(top, #A7FFF5 0%, rgba(255, 255, 255, 0) 100%); background: linear-gradient(180deg, #A7FFF5 0%, rgba(255, 255, 255, 0) 100%); } .theme-gradient-7 { background: -webkit-gradient(linear, left top, left bottom, from(#EBFFFD), to(#EFEEFA)); background: -webkit-linear-gradient(top, #EBFFFD 0%, #EFEEFA 100%); background: -o-linear-gradient(top, #EBFFFD 0%, #EFEEFA 100%); background: linear-gradient(180deg, #EBFFFD 0%, #EFEEFA 100%); } .theme-gradient-8 { background: -webkit-gradient(linear, left top, left bottom, from(#A7FFF5), to(#EEEEFD)); background: -webkit-linear-gradient(top, #A7FFF5 0%, #EEEEFD 100%); background: -o-linear-gradient(top, #A7FFF5 0%, #EEEEFD 100%); background: linear-gradient(180deg, #A7FFF5 0%, #EEEEFD 100%); } .theme-gradient-9 { background: -webkit-linear-gradient(296.77deg, #D6FFFC 0%, #FAE7E4 100%); background: -o-linear-gradient(296.77deg, #D6FFFC 0%, #FAE7E4 100%); background: linear-gradient(153.23deg, #D6FFFC 0%, #FAE7E4 100%); } .bg-primary-color { background: #0ac775 !important; } .bg-secondary-color { background: #FF9166 !important; } .bg-tertiary-color { background: #49CCFF !important; } .bg-extra01-color { background: #FFCD3E !important; } .bg-extra02-color { background: #5BCC9F !important; } .bg-extra03-color { background: #FFFFFF !important; } .bg-extra04-color { background: #00CFFF !important; } .bg-extra05-color { background: #7A19FF !important; } .bg-extra06-color { background: #FF8A5B !important; } .bg-extra07-color { background: #007AFF !important; } .bg-extra08-color { background: #00D09C !important; } .bg-black-color { background: #000000 !important; } .bg-darker-color { background: #52526C !important; } .bg-darkest-color { background: #000248 !important; } .bg-dark-color { background: #757589 !important; } .bg-mid-color { background: #999AB6 !important; } .bg-light-color { background: #C7C7D5 !important; } .bg-lighter-color { background: #F6F5FA !important; } .bg-lightest-color { background: #FAFAFB !important; } .bg-white-color { background: #FFFFFF !important; } .bg-tealLight-color { background: #D1EAED !important; } .bg-tealLighter-color { background: #DCF7FE !important; } /* ========= Forms Styles ========= */ .border-radius { border-radius: 4px; } input[type="text"], input[type="password"], input[type="email"], input[type="number"], textarea { font-size: 18px; font-weight: 400; height: auto; line-height: 28px; background: transparent; -webkit-box-shadow: none; box-shadow: none; padding: 0; outline: none; border: 0 none; border-bottom: 2px solid #C7C7D5; /* -- Placeholder -- */ } input[type="text"]::-webkit-input-placeholder, input[type="password"]::-webkit-input-placeholder, input[type="email"]::-webkit-input-placeholder, input[type="number"]::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #757589; /* Firefox */ opacity: 1; } input[type="text"]::-moz-placeholder, input[type="password"]::-moz-placeholder, input[type="email"]::-moz-placeholder, input[type="number"]::-moz-placeholder, textarea::-moz-placeholder { color: #757589; /* Firefox */ opacity: 1; } input[type="text"]:-ms-input-placeholder, input[type="password"]:-ms-input-placeholder, input[type="email"]:-ms-input-placeholder, input[type="number"]:-ms-input-placeholder, textarea:-ms-input-placeholder { color: #757589; /* Firefox */ opacity: 1; } input[type="text"]::-ms-input-placeholder, input[type="password"]::-ms-input-placeholder, input[type="email"]::-ms-input-placeholder, input[type="number"]::-ms-input-placeholder, textarea::-ms-input-placeholder { color: #757589; /* Firefox */ opacity: 1; } input[type="text"]::placeholder, input[type="password"]::placeholder, input[type="email"]::placeholder, input[type="number"]::placeholder, textarea::placeholder { color: #757589; /* Firefox */ opacity: 1; } input[type="text"]:-ms-input-placeholder, input[type="password"]:-ms-input-placeholder, input[type="email"]:-ms-input-placeholder, input[type="number"]:-ms-input-placeholder, textarea:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #757589; } input[type="text"]::-ms-input-placeholder, input[type="password"]::-ms-input-placeholder, input[type="email"]::-ms-input-placeholder, input[type="number"]::-ms-input-placeholder, textarea::-ms-input-placeholder { /* Microsoft Edge */ color: #757589; } input[type="text"].p-holder__active, input.input-active[type="text"], .input-active input[type="text"], input[type="password"].p-holder__active, input.input-active[type="password"], .input-active input[type="password"], input[type="email"].p-holder__active, input.input-active[type="email"], .input-active input[type="email"], input[type="number"].p-holder__active, input.input-active[type="number"], .input-active input[type="number"], textarea.p-holder__active, textarea.input-active { border-color: #0ac775; /* -- Placeholder -- */ } input[type="text"].p-holder__active::-webkit-input-placeholder, input.input-active[type="text"]::-webkit-input-placeholder, .input-active input[type="text"]::-webkit-input-placeholder, input[type="password"].p-holder__active::-webkit-input-placeholder, input.input-active[type="password"]::-webkit-input-placeholder, .input-active input[type="password"]::-webkit-input-placeholder, input[type="email"].p-holder__active::-webkit-input-placeholder, input.input-active[type="email"]::-webkit-input-placeholder, .input-active input[type="email"]::-webkit-input-placeholder, input[type="number"].p-holder__active::-webkit-input-placeholder, input.input-active[type="number"]::-webkit-input-placeholder, .input-active input[type="number"]::-webkit-input-placeholder, textarea.p-holder__active::-webkit-input-placeholder, textarea.input-active::-webkit-input-placeholder { color: #0ac775; /* Firefox */ opacity: 1; } input[type="text"].p-holder__active::-moz-placeholder, input.input-active[type="text"]::-moz-placeholder, .input-active input[type="text"]::-moz-placeholder, input[type="password"].p-holder__active::-moz-placeholder, input.input-active[type="password"]::-moz-placeholder, .input-active input[type="password"]::-moz-placeholder, input[type="email"].p-holder__active::-moz-placeholder, input.input-active[type="email"]::-moz-placeholder, .input-active input[type="email"]::-moz-placeholder, input[type="number"].p-holder__active::-moz-placeholder, input.input-active[type="number"]::-moz-placeholder, .input-active input[type="number"]::-moz-placeholder, textarea.p-holder__active::-moz-placeholder, textarea.input-active::-moz-placeholder { color: #0ac775; /* Firefox */ opacity: 1; } input[type="text"].p-holder__active:-ms-input-placeholder, input.input-active[type="text"]:-ms-input-placeholder, .input-active input[type="text"]:-ms-input-placeholder, input[type="password"].p-holder__active:-ms-input-placeholder, input.input-active[type="password"]:-ms-input-placeholder, .input-active input[type="password"]:-ms-input-placeholder, input[type="email"].p-holder__active:-ms-input-placeholder, input.input-active[type="email"]:-ms-input-placeholder, .input-active input[type="email"]:-ms-input-placeholder, input[type="number"].p-holder__active:-ms-input-placeholder, input.input-active[type="number"]:-ms-input-placeholder, .input-active input[type="number"]:-ms-input-placeholder, textarea.p-holder__active:-ms-input-placeholder, textarea.input-active:-ms-input-placeholder { color: #0ac775; /* Firefox */ opacity: 1; } input[type="text"].p-holder__active::-ms-input-placeholder, input.input-active[type="text"]::-ms-input-placeholder, .input-active input[type="text"]::-ms-input-placeholder, input[type="password"].p-holder__active::-ms-input-placeholder, input.input-active[type="password"]::-ms-input-placeholder, .input-active input[type="password"]::-ms-input-placeholder, input[type="email"].p-holder__active::-ms-input-placeholder, input.input-active[type="email"]::-ms-input-placeholder, .input-active input[type="email"]::-ms-input-placeholder, input[type="number"].p-holder__active::-ms-input-placeholder, input.input-active[type="number"]::-ms-input-placeholder, .input-active input[type="number"]::-ms-input-placeholder, textarea.p-holder__active::-ms-input-placeholder, textarea.input-active::-ms-input-placeholder { color: #0ac775; /* Firefox */ opacity: 1; } input[type="text"].p-holder__active::placeholder, input.input-active[type="text"]::placeholder, .input-active input[type="text"]::placeholder, input[type="password"].p-holder__active::placeholder, input.input-active[type="password"]::placeholder, .input-active input[type="password"]::placeholder, input[type="email"].p-holder__active::placeholder, input.input-active[type="email"]::placeholder, .input-active input[type="email"]::placeholder, input[type="number"].p-holder__active::placeholder, input.input-active[type="number"]::placeholder, .input-active input[type="number"]::placeholder, textarea.p-holder__active::placeholder, textarea.input-active::placeholder { color: #0ac775; /* Firefox */ opacity: 1; } input[type="text"].p-holder__active:-ms-input-placeholder, input.input-active[type="text"]:-ms-input-placeholder, .input-active input[type="text"]:-ms-input-placeholder, input[type="password"].p-holder__active:-ms-input-placeholder, input.input-active[type="password"]:-ms-input-placeholder, .input-active input[type="password"]:-ms-input-placeholder, input[type="email"].p-holder__active:-ms-input-placeholder, input.input-active[type="email"]:-ms-input-placeholder, .input-active input[type="email"]:-ms-input-placeholder, input[type="number"].p-holder__active:-ms-input-placeholder, input.input-active[type="number"]:-ms-input-placeholder, .input-active input[type="number"]:-ms-input-placeholder, textarea.p-holder__active:-ms-input-placeholder, textarea.input-active:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #0ac775; } input[type="text"].p-holder__active::-ms-input-placeholder, input.input-active[type="text"]::-ms-input-placeholder, .input-active input[type="text"]::-ms-input-placeholder, input[type="password"].p-holder__active::-ms-input-placeholder, input.input-active[type="password"]::-ms-input-placeholder, .input-active input[type="password"]::-ms-input-placeholder, input[type="email"].p-holder__active::-ms-input-placeholder, input.input-active[type="email"]::-ms-input-placeholder, .input-active input[type="email"]::-ms-input-placeholder, input[type="number"].p-holder__active::-ms-input-placeholder, input.input-active[type="number"]::-ms-input-placeholder, .input-active input[type="number"]::-ms-input-placeholder, textarea.p-holder__active::-ms-input-placeholder, textarea.input-active::-ms-input-placeholder { /* Microsoft Edge */ color: #0ac775; } input[type="text"].p-holder__error, input.input-error[type="text"], .input-error input[type="text"], input[type="password"].p-holder__error, input.input-error[type="password"], .input-error input[type="password"], input[type="email"].p-holder__error, input.input-error[type="email"], .input-error input[type="email"], input[type="number"].p-holder__error, input.input-error[type="number"], .input-error input[type="number"], textarea.p-holder__error, textarea.input-error { border-color: #f4282d; /* -- Placeholder -- */ } input[type="text"].p-holder__error::-webkit-input-placeholder, input.input-error[type="text"]::-webkit-input-placeholder, .input-error input[type="text"]::-webkit-input-placeholder, input[type="password"].p-holder__error::-webkit-input-placeholder, input.input-error[type="password"]::-webkit-input-placeholder, .input-error input[type="password"]::-webkit-input-placeholder, input[type="email"].p-holder__error::-webkit-input-placeholder, input.input-error[type="email"]::-webkit-input-placeholder, .input-error input[type="email"]::-webkit-input-placeholder, input[type="number"].p-holder__error::-webkit-input-placeholder, input.input-error[type="number"]::-webkit-input-placeholder, .input-error input[type="number"]::-webkit-input-placeholder, textarea.p-holder__error::-webkit-input-placeholder, textarea.input-error::-webkit-input-placeholder { color: #f4282d; /* Firefox */ opacity: 1; } input[type="text"].p-holder__error::-moz-placeholder, input.input-error[type="text"]::-moz-placeholder, .input-error input[type="text"]::-moz-placeholder, input[type="password"].p-holder__error::-moz-placeholder, input.input-error[type="password"]::-moz-placeholder, .input-error input[type="password"]::-moz-placeholder, input[type="email"].p-holder__error::-moz-placeholder, input.input-error[type="email"]::-moz-placeholder, .input-error input[type="email"]::-moz-placeholder, input[type="number"].p-holder__error::-moz-placeholder, input.input-error[type="number"]::-moz-placeholder, .input-error input[type="number"]::-moz-placeholder, textarea.p-holder__error::-moz-placeholder, textarea.input-error::-moz-placeholder { color: #f4282d; /* Firefox */ opacity: 1; } input[type="text"].p-holder__error:-ms-input-placeholder, input.input-error[type="text"]:-ms-input-placeholder, .input-error input[type="text"]:-ms-input-placeholder, input[type="password"].p-holder__error:-ms-input-placeholder, input.input-error[type="password"]:-ms-input-placeholder, .input-error input[type="password"]:-ms-input-placeholder, input[type="email"].p-holder__error:-ms-input-placeholder, input.input-error[type="email"]:-ms-input-placeholder, .input-error input[type="email"]:-ms-input-placeholder, input[type="number"].p-holder__error:-ms-input-placeholder, input.input-error[type="number"]:-ms-input-placeholder, .input-error input[type="number"]:-ms-input-placeholder, textarea.p-holder__error:-ms-input-placeholder, textarea.input-error:-ms-input-placeholder { color: #f4282d; /* Firefox */ opacity: 1; } input[type="text"].p-holder__error::-ms-input-placeholder, input.input-error[type="text"]::-ms-input-placeholder, .input-error input[type="text"]::-ms-input-placeholder, input[type="password"].p-holder__error::-ms-input-placeholder, input.input-error[type="password"]::-ms-input-placeholder, .input-error input[type="password"]::-ms-input-placeholder, input[type="email"].p-holder__error::-ms-input-placeholder, input.input-error[type="email"]::-ms-input-placeholder, .input-error input[type="email"]::-ms-input-placeholder, input[type="number"].p-holder__error::-ms-input-placeholder, input.input-error[type="number"]::-ms-input-placeholder, .input-error input[type="number"]::-ms-input-placeholder, textarea.p-holder__error::-ms-input-placeholder, textarea.input-error::-ms-input-placeholder { color: #f4282d; /* Firefox */ opacity: 1; } input[type="text"].p-holder__error::placeholder, input.input-error[type="text"]::placeholder, .input-error input[type="text"]::placeholder, input[type="password"].p-holder__error::placeholder, input.input-error[type="password"]::placeholder, .input-error input[type="password"]::placeholder, input[type="email"].p-holder__error::placeholder, input.input-error[type="email"]::placeholder, .input-error input[type="email"]::placeholder, input[type="number"].p-holder__error::placeholder, input.input-error[type="number"]::placeholder, .input-error input[type="number"]::placeholder, textarea.p-holder__error::placeholder, textarea.input-error::placeholder { color: #f4282d; /* Firefox */ opacity: 1; } input[type="text"].p-holder__error:-ms-input-placeholder, input.input-error[type="text"]:-ms-input-placeholder, .input-error input[type="text"]:-ms-input-placeholder, input[type="password"].p-holder__error:-ms-input-placeholder, input.input-error[type="password"]:-ms-input-placeholder, .input-error input[type="password"]:-ms-input-placeholder, input[type="email"].p-holder__error:-ms-input-placeholder, input.input-error[type="email"]:-ms-input-placeholder, .input-error input[type="email"]:-ms-input-placeholder, input[type="number"].p-holder__error:-ms-input-placeholder, input.input-error[type="number"]:-ms-input-placeholder, .input-error input[type="number"]:-ms-input-placeholder, textarea.p-holder__error:-ms-input-placeholder, textarea.input-error:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #f4282d; } input[type="text"].p-holder__error::-ms-input-placeholder, input.input-error[type="text"]::-ms-input-placeholder, .input-error input[type="text"]::-ms-input-placeholder, input[type="password"].p-holder__error::-ms-input-placeholder, input.input-error[type="password"]::-ms-input-placeholder, .input-error input[type="password"]::-ms-input-placeholder, input[type="email"].p-holder__error::-ms-input-placeholder, input.input-error[type="email"]::-ms-input-placeholder, .input-error input[type="email"]::-ms-input-placeholder, input[type="number"].p-holder__error::-ms-input-placeholder, input.input-error[type="number"]::-ms-input-placeholder, .input-error input[type="number"]::-ms-input-placeholder, textarea.p-holder__error::-ms-input-placeholder, textarea.input-error::-ms-input-placeholder { /* Microsoft Edge */ color: #f4282d; } input[type="text"].p-holder__error:focus, input.input-error[type="text"]:focus, .input-error input[type="text"]:focus, input[type="password"].p-holder__error:focus, input.input-error[type="password"]:focus, .input-error input[type="password"]:focus, input[type="email"].p-holder__error:focus, input.input-error[type="email"]:focus, .input-error input[type="email"]:focus, input[type="number"].p-holder__error:focus, input.input-error[type="number"]:focus, .input-error input[type="number"]:focus, textarea.p-holder__error:focus, textarea.input-error:focus { border-color: #f4282d; } input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, input[type="number"]:focus, textarea:focus { border-color: #0ac775; } input[type="checkbox"], input[type="radio"] { opacity: 0; position: absolute; } input[type="checkbox"] ~ label, input[type="radio"] ~ label { position: relative; font-size: 15px; line-height: 26px; color: #757589; font-weight: 400; padding-left: 20px; } input[type="checkbox"] ~ label::before, input[type="radio"] ~ label::before { content: " "; position: absolute; top: 6px; left: 0; width: 14px; height: 14px; background-color: #fff; border: 2px solid rgba(24, 152, 165, 0.2); border-radius: 2px; -webkit-transition: all .3s; -o-transition: all .3s; transition: all .3s; } input[type="checkbox"] ~ label::after, input[type="radio"] ~ label::after { content: " "; position: absolute; top: 9px; left: 2px; width: 10px; height: 5px; background-color: transparent; border-bottom: 2px solid #fff; border-left: 2px solid #fff; border-radius: 2px; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; -webkit-transition: all .3s; -o-transition: all .3s; transition: all .3s; } input[type="checkbox"]:checked ~ label::before, input[type="radio"]:checked ~ label::before { background-color: #0ac775; } input[type="checkbox"]:checked ~ label::after, input[type="radio"]:checked ~ label::after { opacity: 1; } input[type="radio"] ~ label::before { border-radius: 50%; } input[type="radio"] ~ label::after { width: 8px; height: 8px; left: 3px; background: #fff; border-radius: 50%; } /************************************** Header Styles ***************************************/ /*================= Header Styles ===================*/ .haeder-default { -webkit-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; padding: 15px 0; } .haeder-default.header-transparent { position: absolute; left: 0; right: 0; width: auto; z-index: 9; padding: 40px 0 0; } @media only screen and (min-width: 768px) and (max-width: 991px) { .haeder-default.header-transparent { padding: 20px 0 0; } } @media only screen and (max-width: 767px) { .haeder-default.header-transparent { padding: 20px 0 0; } } .haeder-default.sticky { position: fixed !important; top: 0; background: white; background-color: white; padding: 0; left: 0; right: 0; z-index: 9; -webkit-box-shadow: 0 8px 20px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 8px 20px 0 rgba(0, 0, 0, 0.1); -webkit-animation: headerSlideDown .95s ease forwards; animation: headerSlideDown .95s ease forwards; } .haeder-default.sticky .header-wrapper { padding: 5px 0; } .haeder-default .logo a { text-decoration: none; } .haeder-default .logo a svg { width: 100%; } .haeder-default .mainmenu-wrapepr { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .haeder-default .container, .haeder-default .header-right { position: static; } /*---------------------- Logo Animation -----------------------*/ circle#icon-oval-sm, circle#icon-oval-lg, circle.icon-oval-sm, circle.icon-oval-lg { -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } #logo:hover circle#icon-oval-sm, .logo:hover circle.icon-oval-sm { -webkit-transform: perspective(10px) translate3d(12.5px, -7.5px, 0) scale(0.8); transform: perspective(10px) translate3d(12.5px, -7.5px, 0) scale(0.8); } #logo:hover circle#icon-oval-lg, .logo:hover circle.icon-oval-lg { -webkit-transform: translate3d(-4px, 0, 10px) scale(1.3); transform: translate3d(-4px, 0, 10px) scale(1.3); } a { -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } /*===================== Navigation Styles =======================*/ ul.mainmenu { 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; margin: 0 -20px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { ul.mainmenu { margin: 0 -16px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { ul.mainmenu { margin: 0 -15px; } } ul.mainmenu > li > a { display: block; padding: 24px 20px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { ul.mainmenu > li > a { padding: 24px 16px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { ul.mainmenu > li > a { padding: 24px 15px; } } ul.mainmenu > li:hover > a { color: #0ac775; } ul.mainmenu li { margin: 0; position: relative; } ul.mainmenu li a { font-size: 16px; line-height: 22px; text-decoration: none; } ul.mainmenu li.has-dropdown ul.axil-submenu { position: absolute; top: 100%; left: 0; min-width: 250px; background: #ffffff; padding: 20px 0; list-style: none; opacity: 0; visibility: hidden; -webkit-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s; z-index: -2; border-radius: 6px; -webkit-transform: translateX(0) translateY(40px); -ms-transform: translateX(0) translateY(40px); transform: translateX(0) translateY(40px); -webkit-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-box-shadow: 0 13px 18px -8px rgba(0, 0, 0, 0.15), 0 29px 45px 4px rgba(0, 0, 0, 0.08), 0 11px 55px 10px rgba(0, 0, 0, 0.07); box-shadow: 0 13px 18px -8px rgba(0, 0, 0, 0.15), 0 29px 45px 4px rgba(0, 0, 0, 0.08), 0 11px 55px 10px rgba(0, 0, 0, 0.07); } ul.mainmenu li.has-dropdown ul.axil-submenu li { margin: 0 20px; } ul.mainmenu li.has-dropdown ul.axil-submenu li a { font-size: 15px; line-height: 31px; display: block; } ul.mainmenu li.has-dropdown ul.axil-submenu li a:hover { color: #0ac775; } ul.mainmenu li.has-dropdown:hover > a { color: #0ac775; } ul.mainmenu li.has-dropdown:hover ul.axil-submenu { opacity: 1; visibility: visible; z-index: 9999; -webkit-transform: translateX(0) translateY(0); -ms-transform: translateX(0) translateY(0); transform: translateX(0) translateY(0); } ul.mainmenu li.has-dropdown.active ul.axil-submenu.visible { opacity: 1; visibility: visible; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } /*---------------------- Sidebar Nav -----------------------*/ .side-nav-opened { position: relative; overflow: hidden; padding-right: 17px; } .side-nav-opened body { position: relative; z-index: 1; } .side-nav-opened body::before { content: " "; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); z-index: 99; -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } .close-sidenav { position: absolute; top: 20px; 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-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; width: 46px; height: 46px; border-radius: 100%; padding: 0; cursor: pointer; -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1); transition: -webkit-transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1); -o-transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1); transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1); transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), -webkit-transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1); } .close-sidenav button.close-button { padding: 0; border: 0 none; } .close-sidenav button.close-button i { font-size: 30px; color: #000248; } .close-sidenav button.close-button:hover i { color: #0ac775; } /*-------------------------- Side Nav Styles ---------------------------*/ .side-nav { width: 60vw; height: 100vh; position: fixed; top: 0; right: -61vw; z-index: 9999; padding: 55px; background: #ffffff; -webkit-transition: all 0.8s cubic-bezier(0.77, 0.2, 0.05, 1); -o-transition: all 0.8s cubic-bezier(0.77, 0.2, 0.05, 1); transition: all 0.8s cubic-bezier(0.77, 0.2, 0.05, 1); overflow-y: auto; } @media only screen and (max-width: 767px) { .side-nav { padding: 55px 30px 30px; } } @media only screen and (max-width: 575px) { .side-nav { width: 90vw; right: -90vw; } } .side-nav.opened { right: 0; } .side-nav .side-nav-inner { padding: 100px 50px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .side-nav .side-nav-inner { padding: 40px 0px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .side-nav .side-nav-inner { padding: 28px 0; } } @media only screen and (max-width: 767px) { .side-nav .side-nav-inner { padding: 28px 0; } } .side-nav .side-nav-inner .form-group { position: relative; margin-bottom: 80px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .side-nav .side-nav-inner .form-group { margin-bottom: 40px; } } @media only screen and (max-width: 767px) { .side-nav .side-nav-inner .form-group { margin-bottom: 40px; } } .side-nav .side-nav-inner .form-group input { border-bottom: 2px solid #D3D3D3; height: auto; font-size: 40px; color: #757589; padding-bottom: 10px; padding-right: 53px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .side-nav .side-nav-inner .form-group input { font-size: 35px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .side-nav .side-nav-inner .form-group input { font-size: 30px; } } @media only screen and (max-width: 767px) { .side-nav .side-nav-inner .form-group input { font-size: 30px; } } .side-nav .side-nav-inner .form-group button.side-nav-search-btn { position: absolute; right: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); border: 0 none; } .side-nav .side-nav-inner .form-group button.side-nav-search-btn i { color: #757589; font-size: 20px; font-weight: 400; } .side-nav .side-nav-inner .form-group button.side-nav-search-btn:hover i { color: #0ac775; } .side-nav .side-nav-inner .side-nav-content ul.main-navigation { margin: -45px 0; } @media only screen and (min-width: 768px) and (max-width: 991px) { .side-nav .side-nav-inner .side-nav-content ul.main-navigation { margin: -30px 0; margin-bottom: 30px; } } @media only screen and (max-width: 767px) { .side-nav .side-nav-inner .side-nav-content ul.main-navigation { margin: -17px 0; margin-bottom: 30px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .side-nav .side-nav-inner .side-nav-content ul.main-navigation { margin-top: -18px; } } .side-nav .side-nav-inner .side-nav-content ul.main-navigation li { margin: 45px 0; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .side-nav .side-nav-inner .side-nav-content ul.main-navigation li { margin: 22px 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .side-nav .side-nav-inner .side-nav-content ul.main-navigation li { margin: 30px 0; } } @media only screen and (max-width: 767px) { .side-nav .side-nav-inner .side-nav-content ul.main-navigation li { margin: 17px 0; } } .side-nav .side-nav-inner .side-nav-content ul.main-navigation li a { color: #000248; font-size: 36px; font-weight: 500; text-decoration: none; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .side-nav .side-nav-inner .side-nav-content ul.main-navigation li a { font-size: 28px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .side-nav .side-nav-inner .side-nav-content ul.main-navigation li a { font-size: 28px; } } @media only screen and (max-width: 767px) { .side-nav .side-nav-inner .side-nav-content ul.main-navigation li a { font-size: 25px; } } .side-nav .side-nav-inner .side-nav-content ul.main-navigation li a:hover { color: #0ac775; } .side-nav .side-nav-inner .side-nav-content .axil-contact-info-inner h5.title, .side-nav .side-nav-inner .side-nav-content .axil-contact-info-inner span.title { font-size: 18px; line-height: 1; color: #000248; font-weight: 500; display: block; margin-bottom: 15px; } .side-nav .side-nav-inner .side-nav-content .axil-contact-info-inner .axil-contact-info p { font-size: 16px; line-height: 28px; } .side-nav .side-nav-inner .side-nav-content .axil-contact-info-inner .axil-contact-info .address p { margin-bottom: 4px; } .side-nav .side-nav-inner .side-nav-content .axil-contact-info-inner .axil-contact-info .address p a { color: #757589; text-decoration: none; } .side-nav .side-nav-inner .side-nav-content .axil-contact-info-inner .axil-contact-info .address p a:hover { color: #0ac775; } .side-nav .side-nav-inner .side-nav-content .axil-contact-info-inner .axil-contact-info .address p i { padding-right: 14px; font-size: 14px; color: #000248; } .side-nav .side-nav-inner .side-nav-content .axil-contact-info-inner .axil-contact-info .address + .address { margin-top: 30px; } .side-nav .side-nav-inner .side-nav-content .axil-contact-info-inner .axil-contact-info + .axil-contact-info { margin-top: 30px; } /*----------------------- Menu Toggler -------------------------*/ .axil-menuToggle { position: relative; width: 60px; height: 60px; background: #ffffff; text-align: center; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; border-radius: 100%; -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } .axil-menuToggle span { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 20px; height: 2px; margin-bottom: 5px; position: relative; background: #000248; border-radius: 3px; z-index: 1; -webkit-transform-origin: 5px 0px; -ms-transform-origin: 5px 0px; transform-origin: 5px 0px; -webkit-transition: background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), opacity 0.55s ease, -webkit-transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1); transition: background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), opacity 0.55s ease, -webkit-transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1); -o-transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), opacity 0.55s ease; transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), opacity 0.55s ease; transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), opacity 0.55s ease, -webkit-transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1); } .axil-menuToggle span:last-child { width: 15px; right: -1px; position: relative; margin-bottom: 0; } /*--------------------- Bg Theme Color -----------------------*/ .bg-theme-color .axil-menuToggle { background: #000248; } .bg-theme-color .axil-menuToggle span { background: #fff; } /*------------------- Search Styles ---------------------*/ .axil-search-area { position: absolute; width: 100vw; height: 100%; background: #FAFAFB; top: 0; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; z-index: 999999; visibility: hidden; opacity: 0; -webkit-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .axil-search-area.visible { opacity: 1; visibility: visible; } .axil-search-area form { width: 100%; } .axil-search-area .search-field { width: 60%; margin: 0 auto; position: relative; } @media only screen and (max-width: 767px) { .axil-search-area .search-field { width: 87%; } } .axil-search-area .search-field input { width: 100%; height: 100%; border: none; background: 0 0; border-bottom: 1px solid #D3D3D3; padding: 4px 0; padding-right: 30px; } .axil-search-area .search-field button { position: absolute; right: 0; bottom: 0; border: none; background: 0 0; padding: 5px 0; cursor: pointer; -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } .axil-search-area .search-field button:hover { color: #0ac775; } .axil-search-area a.navbar-search-close { position: absolute; top: 50%; right: 30px; font-size: 24px; color: #000248; margin-right: 30px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } @media only screen and (max-width: 767px) { .axil-search-area a.navbar-search-close { top: 19%; margin-right: 0; } } .axil-search-area a.navbar-search-close:hover { color: #0ac775; } .ax-search-area a.search-trigger i { font-weight: 400; color: #000248; } /*----------------------- Scroll Navigation -------------------------*/ .axil-scroll-navigation .nav { position: static; width: 100%; top: 0; z-index: 9; padding-left: 0; position: relative; background: #fff; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; width: 100%; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; border: 0 none; } .axil-scroll-navigation .nav::after { height: 1px; background: #F6F5FA; width: 1290px; position: absolute; bottom: 0; content: ""; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .axil-scroll-navigation .nav .nav-item a { padding: 30px 10px; border-radius: 7px; -webkit-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out; text-decoration: none; position: relative; margin: 0 10px; background: transparent; color: #757589; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-scroll-navigation .nav .nav-item a { font-size: 16px; padding: 20px 4px; } } @media only screen and (max-width: 767px) { .axil-scroll-navigation .nav .nav-item a { padding: 10px 6px; margin: 0 5px; font-size: 14px; } } .axil-scroll-navigation .nav .nav-item a::after { position: absolute; content: ""; bottom: 0; background: #0ac775; height: 3px; width: 0; left: 0; } .axil-scroll-navigation .nav .nav-item a.active, .axil-scroll-navigation .nav .nav-item a:hover { color: #0ac775; } .axil-scroll-navigation .nav .nav-item a.active::after, .axil-scroll-navigation .nav .nav-item a:hover::after { width: 100%; } .axil-scroll-navigation .nav.is-affixed { border-bottom: 0; top: 0 !important; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } .axil-scroll-navigation .nav.is-affixed .sidebar__inner a { padding: 30px 10px; } /*----------------------------- Menu Bar Styles -------------------------------*/ .ax-menubar { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; pointer-events: auto; height: 19px; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; cursor: pointer; margin-left: 25px; color: #000248; } .ax-menubar div { width: 24px; height: 18px; pointer-events: auto; position: relative; color: #000248; display: block; } .ax-menubar div i { -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); top: 50%; left: 0; margin-top: -1px; width: 100%; height: 2px; background: currentColor; position: absolute; } .ax-menubar div i::before, .ax-menubar div i::after { left: 50%; width: 100%; height: 100%; background: inherit; content: ""; -webkit-transition: width 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: width 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: width 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -webkit-transform: translate(-50%); -ms-transform: translate(-50%); transform: translate(-50%); position: absolute; } .ax-menubar div i::before { top: -8px; } .ax-menubar div i::after { top: 8px; } .ax-menubar div:hover i::before, .ax-menubar div:hover i::after { width: 70%; } /*---------------------------- Popup MObile Menu ------------------------------*/ .popup-mobile-manu { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.9); visibility: hidden; opacity: 0; -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); z-index: 999; } .popup-mobile-manu .inner { background: #000000; width: 400px; max-width: 80%; height: 100%; text-align: left; -webkit-transition: all .3s; -o-transition: all .3s; transition: all .3s; overflow-y: auto; padding-top: 85px; -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); cursor: default; position: relative; } .popup-mobile-manu-visible .popup-mobile-manu { visibility: visible; opacity: 1; } .popup-mobile-manu-visible .popup-mobile-manu .inner { -webkit-transform: none; -ms-transform: none; transform: none; } /*---------------------------- Popup MObile Styles ------------------------------*/ .popup-mobile-manu .inner .mobileheader { top: 0; left: 0; right: 0; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; padding: 0 15px 0 15px; height: 85px; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; background: #fff; position: absolute; } .popup-mobile-manu .inner .mobileheader .logo { -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; } @media only screen and (max-width: 575px) { .popup-mobile-manu .inner .mobileheader .logo a img { max-width: 80%; } } .popup-mobile-manu .inner .mobileheader .close-menu { cursor: pointer; height: 40px; width: 40px; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; position: relative; } .popup-mobile-manu .inner .mobileheader .close-menu::before, .popup-mobile-manu .inner .mobileheader .close-menu::after { top: 19px; left: 8px; content: ""; width: 24px; height: 3px; background: #222; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); position: absolute; } .popup-mobile-manu .inner .mobileheader .close-menu::before { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .popup-mobile-manu .inner .mobileheader .close-menu::after { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .popup-mobile-manu .inner .menu-item ul.mainmenu-item { margin: 20px 20px 20px; } .popup-mobile-manu .inner .menu-item ul.mainmenu-item li { font-size: 16px; color: #fff; font-weight: 400; border-top: 1px solid transparent; border-color: rgba(255, 255, 255, 0.15); } .popup-mobile-manu .inner .menu-item ul.mainmenu-item li a { padding-top: 19px; padding-bottom: 19px; display: block; position: relative; text-transform: capitalize; text-decoration: none; -webkit-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s; color: #fff; } .popup-mobile-manu .inner .menu-item ul.mainmenu-item li:first-child { border: 0 none; } .popup-mobile-manu .inner .menu-item ul.mainmenu-item li.has-children > a { color: #fff; } .popup-mobile-manu .inner .menu-item ul.mainmenu-item li.has-children > a::after { top: 50%; right: 0; width: 40px; height: 40px; color: #fff; text-align: center; line-height: 40px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); content: ""; width: 0; height: 0; border-style: solid; border-width: 7px 7px 0 7px; border-color: #ffffff transparent transparent transparent; -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); display: inline-block; position: absolute; } .popup-mobile-manu .inner .menu-item ul.mainmenu-item li.has-children > a.active, .popup-mobile-manu .inner .menu-item ul.mainmenu-item li.has-children > a:hover { color: #0ac775; } .popup-mobile-manu .inner .menu-item ul.mainmenu-item li.has-children > a.active::after, .popup-mobile-manu .inner .menu-item ul.mainmenu-item li.has-children > a:hover::after { border-color: #0ac775 transparent transparent transparent; } .popup-mobile-manu .inner .menu-item ul.mainmenu-item li.has-children > a.active::after { width: 0; height: 0; border-style: solid; border-width: 0 7px 7px 7px; border-color: transparent transparent #0ac775 transparent; } .popup-mobile-manu .inner .menu-item ul.mainmenu-item li.has-children ul.submenu { display: none; padding: 0; margin: 0; list-style: none; margin-top: 0px; margin-bottom: 8px; padding-left: 10px; } .popup-mobile-manu .inner .menu-item ul.mainmenu-item li.has-children ul.submenu li a { padding-top: 8px; padding-bottom: 8px; font-size: 15px; color: #fff; } /************************************** Elements Styles ***************************************/ /*====================== Axil Button Styles ========================*/ .axil-button-group { margin: -10px; } .axil-button-group a.axil-button, .axil-button-group button.axil-button { margin: 10px; } a.axil-button, button.axil-button { -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; position: relative; color: #000248; display: inline-block; height: 46px; line-height: 46px; text-decoration: none; padding: 0 25px; z-index: 2; font-size: 16px; background: #ffffff; } @media only screen and (max-width: 767px) { a.axil-button, button.axil-button { font-size: 14px; } } a.axil-button.axil-link-button, button.axil-button.axil-link-button { color: #000248; height: auto; line-height: initial; position: relative; padding: 0; font-weight: 700; text-shadow: none; background: transparent; } a.axil-button.axil-link-button::after, button.axil-button.axil-link-button::after { position: absolute; left: 0; bottom: 0; width: 0; height: 1px; content: ""; } a.axil-button.axil-link-button:hover, button.axil-button.axil-link-button:hover { color: #0ac775; } a.axil-button.axil-link-button:hover::after, button.axil-button.axil-link-button:hover::after { background: #0ac775; width: 100%; } a.axil-button span, button.axil-button span { display: inline-block; } a.axil-button span.button-text, button.axil-button span.button-text { padding-right: 25px; } @media only screen and (max-width: 767px) { a.axil-button span.button-text, button.axil-button span.button-text { padding-right: 12px; } } a.axil-button span.button-icon, button.axil-button span.button-icon { width: 0; height: 0; border-style: solid; border-width: 4.5px 0 4.5px 6px; border-color: transparent transparent transparent #000024; } a.axil-button.btn-transparent span.button-text, button.axil-button.btn-transparent span.button-text { padding-right: 25px; } a.axil-button.btn-transparent span.button-icon, button.axil-button.btn-transparent span.button-icon { width: 0; height: 0; border-style: solid; border-width: 4.5px 0 4.5px 6px; border-color: transparent transparent transparent #000024; } a.axil-button.btn-transparent::before, button.axil-button.btn-transparent::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; border: 2px solid #000248; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } a.axil-button.btn-transparent::after, button.axil-button.btn-transparent::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; opacity: 0; background-color: #000248; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } a.axil-button.btn-transparent:hover, button.axil-button.btn-transparent:hover { color: #FFFFFF; } a.axil-button.btn-transparent:hover span.button-icon, button.axil-button.btn-transparent:hover span.button-icon { border-color: transparent transparent transparent #ffffff; } a.axil-button.btn-transparent:hover::before, button.axil-button.btn-transparent:hover::before { opacity: 0; -webkit-transform: scale(1.2, 1.2); -ms-transform: scale(1.2, 1.2); transform: scale(1.2, 1.2); } a.axil-button.btn-transparent:hover::after, button.axil-button.btn-transparent:hover::after { opacity: 1; -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1); } a.axil-button.btn-verde span.button-text, button.axil-button.btn-verde span.button-text { padding-right: 25px; } a.axil-button.btn-verde span.button-icon, button.axil-button.btn-verde span.button-icon { width: 0; height: 0; border-style: solid; border-width: 4.5px 0 4.5px 6px; color:#0ac775 !important; border-color: transparent transparent transparent #0ac775; } a.axil-button.btn-verde::before, button.axil-button.btn-verde::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; border: 2px solid #0ac775; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } a.axil-button.btn-verde::after, button.axil-button.btn-verde::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; opacity: 0; background-color: #0ac775; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } a.axil-button.btn-verde:hover, button.axil-button.btn-verde:hover { color: #FFFFFF !important; } a.axil-button.btn-verde:hover span.button-icon, button.axil-button.btn-verde:hover span.button-icon { border-color: transparent transparent transparent #ffffff;color: #FFFFFF !important; } a.axil-button.btn-verde:hover::before, button.axil-button.btn-verde:hover::before { opacity: 0; -webkit-transform: scale(1.2, 1.2); -ms-transform: scale(1.2, 1.2); transform: scale(1.2, 1.2); } a.axil-button.btn-verde:hover::after, button.axil-button.btn-verde:hover::after { opacity: 1; -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1); } a.axil-button.btn-large, button.axil-button.btn-large { height: 56px; line-height: 56px; } @media only screen and (max-width: 767px) { a.axil-button.btn-large, button.axil-button.btn-large { height: 52px; line-height: 52px; } } a.axil-button.btn-extra-large, button.axil-button.btn-extra-large { height: 56px; line-height: 56px; padding: 0 92px; } @media only screen and (max-width: 767px) { a.axil-button.btn-extra-large, button.axil-button.btn-extra-large { padding: 0 20px; height: 52px; line-height: 52px; } } a.axil-button.btn-xxl, button.axil-button.btn-xxl { padding: 0 92px; } @media only screen and (max-width: 767px) { a.axil-button.btn-xxl, button.axil-button.btn-xxl { padding: 0 24px; } } a.axil-button.btn-small, button.axil-button.btn-small { height: 36px; line-height: 36px; } a.axil-button.btn-solid, button.axil-button.btn-solid { color: #FFFFFF; } a.axil-button.btn-solid span.button-icon, button.axil-button.btn-solid span.button-icon { border-color: transparent transparent transparent #ffffff; } a.axil-button.btn-solid::before, button.axil-button.btn-solid::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; background-color: #000248; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } a.axil-button.btn-solid::after, button.axil-button.btn-solid::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; opacity: 0; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; border: 2px solid #000248; -webkit-transform: scale(1.2, 1.2); -ms-transform: scale(1.2, 1.2); transform: scale(1.2, 1.2); } a.axil-button.btn-solid:hover, button.axil-button.btn-solid:hover { color: #000248; } a.axil-button.btn-solid:hover span.button-icon, button.axil-button.btn-solid:hover span.button-icon { border-color: transparent transparent transparent #000248; } a.axil-button.btn-solid:hover::before, button.axil-button.btn-solid:hover::before { opacity: 0; -webkit-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } a.axil-button.btn-solid:hover::after, button.axil-button.btn-solid:hover::after { opacity: 1; -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1); } a.axil-button.btn-solid.bgextra07-color::before, button.axil-button.btn-solid.bgextra07-color::before { background-color: #007AFF; } a.axil-button.btn-solid.bgextra07-color::after, button.axil-button.btn-solid.bgextra07-color::after { border: 2px solid #007AFF; } a.axil-button.btn-solid.btn-verde-color::before, button.axil-button.btn-solid.btn-verde-color::before { background-color: #0ac775; } a.axil-button.btn-solid.btn-verde-color::after, button.axil-button.btn-solid.btn-verde-color::after { border: 2px solid #0ac775; } a.axil-button.btn-solid.btn-verde-color:hover, button.axil-button.btn-solid.btn-verde-color:hover { color: #0ac775 !important; } a.axil-button.btn-solid.btn-verde-color:hover span.button-icon, button.axil-button.btn-solid.btn-verde-color:hover span.button-icon { border-color: transparent transparent transparent #0ac775; } a.axil-button.btn-solid.btn-extra02-color::before, button.axil-button.btn-solid.btn-extra02-color::before { background-color: #5BCC9F; } a.axil-button.btn-solid.btn-extra02-color::after, button.axil-button.btn-solid.btn-extra02-color::after { border: 2px solid #5BCC9F; } a.axil-button.btn-solid.btn-extra02-color:hover, button.axil-button.btn-solid.btn-extra02-color:hover { color: #5BCC9F !important; } a.axil-button.btn-solid.btn-extra02-color:hover span.button-icon, button.axil-button.btn-solid.btn-extra02-color:hover span.button-icon { border-color: transparent transparent transparent #5BCC9F; } a.axil-button.btn-solid.btn-extra07-color::before, button.axil-button.btn-solid.btn-extra07-color::before { background-color: #007AFF; } a.axil-button.btn-solid.btn-extra07-color::after, button.axil-button.btn-solid.btn-extra07-color::after { border: 2px solid #007AFF; } a.axil-button.btn-solid.btn-extra07-color:hover, button.axil-button.btn-solid.btn-extra07-color:hover { color: #007AFF !important; } a.axil-button.btn-solid.btn-extra07-color:hover span.button-icon, button.axil-button.btn-solid.btn-extra07-color:hover span.button-icon { border-color: transparent transparent transparent #007AFF; } a.axil-button.btn-solid.btn-primary-color::before, button.axil-button.btn-solid.btn-primary-color::before { background-color: #0ac775; } a.axil-button.btn-solid.btn-primary-color::after, button.axil-button.btn-solid.btn-primary-color::after { border: 2px solid #0ac775; } a.axil-button.btn-solid.btn-primary-color:hover, button.axil-button.btn-solid.btn-primary-color:hover { color: #0ac775 !important; } a.axil-button.btn-solid.btn-primary-color:hover span.button-icon, button.axil-button.btn-solid.btn-primary-color:hover span.button-icon { border-color: transparent transparent transparent #0ac775; } /* ======================== Slider Video Play =========================*/ .yu2fvl { z-index: 9999; top: 0; } .yu2fvl-iframe { display: block; height: 100%; width: 100%; border: 0; } .yu2fvl-overlay { z-index: 9998; background: #000; opacity: 0.8; } .yu2fvl-close { position: absolute; top: 1px; left: 100%; display: inline-block; height: 35px; width: 35px; line-height: 35px; text-align: center; background: #f10 !important; background-color: #f10 !important; color: #ffffff; border: 0; background: none; cursor: pointer; } @media only screen and (min-width: 768px) and (max-width: 991px) { .yu2fvl-close { left: auto; right: 0; top: auto; bottom: 100%; } } @media only screen and (max-width: 767px) { .yu2fvl-close { left: auto; right: 0; top: auto; bottom: 100%; } .video h2 { color: #ffffff; font-size: 32px; } .video h4 { font-size: 22px; line-height: 32px; } } a.axil-link { position: relative; display: inline-block; z-index: 1; } a.axil-link::after { content: ""; width: 0; height: 1px; bottom: 0; position: absolute; left: auto; right: 0; z-index: -1; -webkit-transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s; -o-transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s; transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s; background: currentColor; } a.axil-link:hover::after { width: 100%; left: 0; right: auto; } /*===================== * Section Title ========================*/ .section-title span.sub-title { height: 36px; padding: 0 12px; font-size: 15px; line-height: 35px; display: inline-block; margin-bottom: 20px; } @media only screen and (max-width: 767px) { .section-title span.sub-title { margin-bottom: 10px; } } .section-title span.sub-title.extra08-color { background: rgba(0, 208, 156, 0.1); } .section-title span.sub-title.extra04-color { background: rgba(0, 207, 255, 0.1); } .section-title span.sub-title.extra05-color { background: rgba(122, 25, 255, 0.1); } .section-title span.sub-title.extra07-color { background: rgba(0, 122, 255, 0.1); } .section-title span.sub-title.extra06-color { background: rgba(255, 138, 91, 0.1); } .section-title span.sub-title.extra10-color { background: rgba(0, 122, 255, 0.1); } .section-title h2.title { margin-bottom: 20px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .section-title h2.title { margin-bottom: 15px; font-size: 40px; line-height: 52px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .section-title h2.title { margin-bottom: 15px; font-size: 35px; line-height: 42px; } .section-title h2.title br { display: none; } } @media only screen and (max-width: 767px) { .section-title h2.title { margin-bottom: 10px; } .section-title h2.title br { display: none; } } .section-title.text-center p { padding: 0 25%; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .section-title.text-center p { padding: 0 20%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .section-title.text-center p { padding: 0 10%; } } @media only screen and (max-width: 767px) { .section-title.text-center p { padding: 0; } } .section-title.text-left p { padding: 0 25% 0 0; } @media only screen and (max-width: 767px) { .section-title.text-left p { padding: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .section-title.text-left p { padding: 0; } } .section-title.text-right p { padding: 0 0 0 25%; } @media only screen and (max-width: 767px) { .section-title.text-right p { padding: 0; } } /* ======================== Dividers Area ==========================*/ .axil-basic-thine-line { border-top: 1px solid #C7C7D5; } /*=================== Social Icon ====================*/ .ft-social-share { margin: -5px -70px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .ft-social-share { margin: -5px -30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .ft-social-share { margin: -5px -30px; } } @media only screen and (max-width: 767px) { .ft-social-share { margin: -5px -10px; } } .ft-social-share li { margin: 5px 70px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .ft-social-share li { margin: 5px 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .ft-social-share li { margin: 5px 30px; } } @media only screen and (max-width: 767px) { .ft-social-share li { margin: 5px 10px; } } .ft-social-share li a { color: #999AB6; font-size: 30px; line-height: 28px; } @media only screen and (max-width: 767px) { .ft-social-share li a { font-size: 25px; } } @media only screen and (max-width: 575px) { .ft-social-share li a { font-size: 19px; } } .ft-social-share li:hover a { color: #0ac775; } .axil-social-icons { margin: 0 -15px; } .axil-social-icons li { margin: 0 15px; } .axil-social-icons li a { color: #000248; text-decoration: none; font-size: 20px; line-height: 28px; } /*------------------------ Social Share -------------------------*/ ul.social-share { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; text-decoration: none; margin: -10px; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media only screen and (max-width: 767px) { ul.social-share { margin: -5px; } } ul.social-share li { margin: 10px; } @media only screen and (max-width: 767px) { ul.social-share li { margin: 5px; } } ul.social-share li a { text-decoration: none; font-size: 15px; line-height: 24px; color: #757589; } ul.social-share li a i { font-size: 20px; line-height: 28px; color: #999AB8; font-weight: 400; } ul.social-share li a:hover { color: #0ac775; } ul.social-share li a:hover i { color: #0ac775; } ul.social-share.social-share-style-2 { margin-right: 0; } ul.social-share.social-share-style-2 li a i { color: #999AB8; font-size: 20px; line-height: 28px; } @media only screen and (max-width: 767px) { ul.social-share.social-share-style-2 li a i { font-size: 15px; } } ul.social-share.social-share-style-2 li a span { color: #757589; font-size: 15px; line-height: 24px; display: inline-block; padding-left: 10px; } @media only screen and (max-width: 767px) { ul.social-share.social-share-style-2 li a span { font-size: 14px; padding-left: 6px; } } ul.social-share.social-share-style-2 li:last-child { margin-right: 0; } ul.social-share.style-rounded li a { width: 32px; display: block; height: 32px; line-height: 32px; border-radius: 100%; background: #000248; text-align: center; } ul.social-share.style-rounded li a i { color: #ffffff; font-size: 14px; line-height: 16px; } ul.social-share.style-rounded li a:hover { background: #0ac775; } ul.social-share.style-rounded li a:hover i { color: #ffffff; } ul.social-share.style-rounded.bg-color--white li a { background: #ffffff; } ul.social-share.style-rounded.bg-color--white li a i { color: #52526E; } ul.social-share.style-rounded.bg-color--white li:hover a { background: #0ac775; } ul.social-share.style-rounded.bg-color--white li:hover a i { color: #ffffff; } .axil-social-share img { max-height: 70px; } @media only screen and (max-width: 767px) { .axil-social-share img { max-height: 48px; } } /*-------------------------- List Of Followers ----------------------------*/ ul.followers-list { margin: 0 -50px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-top: 110px; margin-bottom: -15px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { ul.followers-list { margin: 0 -20px; margin-bottom: -15px; margin-top: 40px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { ul.followers-list { margin: 0 -15px; margin-bottom: -15px; margin-top: 40px; } } @media only screen and (max-width: 767px) { ul.followers-list { margin: 0 -10px; margin-bottom: -15px; margin-top: 30px; } } ul.followers-list li { margin: 0 50px; margin-bottom: 15px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { ul.followers-list li { margin: 0 20px; margin-bottom: 15px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { ul.followers-list li { margin: 0 15px; margin-bottom: 15px; } } @media only screen and (max-width: 767px) { ul.followers-list li { margin: 0 10px; margin-bottom: 15px; } } ul.followers-list li a { text-decoration: none; } ul.followers-list li a i { height: 67px; width: 67px; background-color: #EA4C89; -webkit-box-shadow: 0 10px 37px -5px rgba(234, 76, 137, 0.5); box-shadow: 0 10px 37px -5px rgba(234, 76, 137, 0.5); line-height: 67px; text-align: center; color: #FFFFFF; border-radius: 100%; margin-right: 25px; } @media only screen and (min-width: 768px) and (max-width: 991px) { ul.followers-list li a i { margin-right: 13px; } } ul.followers-list li a span { color: #000248; font-weight: 700; font-size: 22px; line-height: 26px; } ul.followers-list li a:hover span { color: #0ac775; } ul.followers-list li.behance a i { background-color: #0067FF; -webkit-box-shadow: 0 10px 37px -5px rgba(0, 103, 255, 0.5); box-shadow: 0 10px 37px -5px rgba(0, 103, 255, 0.5); } ul.followers-list li.linkedin a i { background-color: #0177AC; -webkit-box-shadow: 0 10px 37px -5px rgba(1, 119, 172, 0.5); box-shadow: 0 10px 37px -5px rgba(1, 119, 172, 0.5); } /*==================== Service Styles ======================*/ .axil-service { margin-top: 60px; } @media only screen and (max-width: 767px) { .axil-service { margin-top: 30px; } } /*--------------------------- Single Service ---------------------------*/ .axil-service { position: relative; background: #ffffff; } @media only screen and (max-width: 767px) { .axil-service { background: #f7f7f7; } } .axil-service:hover { background: transparent; } .axil-service::before { width: 92%; height: 92%; left: -20px; bottom: -20px; background: rgba(0, 2, 72, 0.1); content: ""; position: absolute; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-10deg); transform: rotateY(-10deg); -webkit-filter: blur(50px); filter: blur(50px); opacity: 0; -webkit-transition: all 0.7s; -o-transition: all 0.7s; transition: all 0.7s; } @media only screen and (max-width: 767px) { .axil-service::before { display: none; } } .axil-service .inner { padding-top: 60px; padding-left: 40px; padding-right: 40px; padding-bottom: 60px; position: relative; z-index: 2; } @media only screen and (max-width: 767px) { .axil-service .inner { padding: 30px 20px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-service .inner { padding: 34px 20px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-service .inner { padding: 25px 15px; } } .axil-service .inner::after { background: #ffffff; position: absolute; content: ""; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: -1; -webkit-transform: perspective(500px) rotateY(-5deg); transform: perspective(500px) rotateY(-5deg); opacity: 0; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } @media only screen and (max-width: 767px) { .axil-service .inner::after { background: #f7f7f7; -webkit-transform: perspective(0) rotateY(0deg); transform: perspective(0) rotateY(0deg); } } .axil-service .inner::before { -webkit-transform: perspective(500px) rotateY(-5deg); transform: perspective(500px) rotateY(-5deg); position: absolute; width: calc(100% + -5px); height: calc(100% + -10px); top: calc(25px + 7px); content: ""; border: 4px solid #000345; z-index: -1; right: calc(25px - -7px); -webkit-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; opacity: 0; visibility: hidden; -webkit-box-shadow: 0 0 1px transparent; box-shadow: 0 0 1px transparent; -webkit-transition-delay: 0.2s; -o-transition-delay: 0.2s; transition-delay: 0.2s; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-service .inner::before { width: calc(100% + -15px); height: calc(100% + -15px); } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-service .inner::before { width: calc(100% + -15px); height: calc(100% + -15px); } } @media only screen and (max-width: 767px) { .axil-service .inner::before { width: calc(100% + -15px); height: calc(100% + -15px); } } @media only screen and (max-width: 767px) { .axil-service .inner::before { display: none; } } .axil-service .inner .icon { position: relative; height: 100px; width: 120px; z-index: 2; margin: 0 auto; -webkit-perspective: 100px; perspective: 100px; margin-bottom: 45px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-service .inner .icon { margin-bottom: 7px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-service .inner .icon { margin-bottom: 7px; } } @media only screen and (max-width: 767px) { .axil-service .inner .icon { margin-bottom: 7px; } } .axil-service .inner .icon::before { background: -webkit-gradient(linear, left top, left bottom, from(#EBFFFD), to(#EFEEFA)); background: -webkit-linear-gradient(top, #EBFFFD 0%, #EFEEFA 100%); background: -o-linear-gradient(top, #EBFFFD 0%, #EFEEFA 100%); background: linear-gradient(180deg, #EBFFFD 0%, #EFEEFA 100%); position: absolute; content: ""; right: 44%; top: -15%; height: 100%; width: 88px; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-5deg); transform: rotateY(-5deg); -webkit-box-shadow: 0 0 1px transparent; box-shadow: 0 0 1px transparent; } .axil-service .inner .icon.gradient-color-02::before { background: -webkit-gradient(linear, left top, left bottom, from(#FEF7E2), to(#EEEEFD)); background: -webkit-linear-gradient(top, #FEF7E2 0%, #EEEEFD 100%); background: -o-linear-gradient(top, #FEF7E2 0%, #EEEEFD 100%); background: linear-gradient(180deg, #FEF7E2 0%, #EEEEFD 100%); } .axil-service .inner .icon.gradient-color-02 .icon-inner { background: #5BCC9F; } .axil-service .inner .icon.gradient-color-03::before { background: -webkit-linear-gradient(315.26deg, #D6FFFC 0%, #FAE7E4 100%); background: -o-linear-gradient(315.26deg, #D6FFFC 0%, #FAE7E4 100%); background: linear-gradient(134.74deg, #D6FFFC 0%, #FAE7E4 100%); } .axil-service .inner .icon.gradient-color-03 .icon-inner { background: #49CCFF; } .axil-service .inner .icon.gradient-color-04::before { background: -webkit-gradient(linear, left top, left bottom, from(#F7F6FF), to(#FEEFEB)); background: -webkit-linear-gradient(top, #F7F6FF 0%, #FEEFEB 100%); background: -o-linear-gradient(top, #F7F6FF 0%, #FEEFEB 100%); background: linear-gradient(180deg, #F7F6FF 0%, #FEEFEB 100%); } .axil-service .inner .icon.gradient-color-04 .icon-inner { background: #FFCD3E; } .axil-service .inner .icon.gradient-color-05::before { background: -webkit-gradient(linear, left top, left bottom, from(#F7F6FF), to(#FEEFEB)); background: -webkit-linear-gradient(top, #F7F6FF 0%, #FEEFEB 100%); background: -o-linear-gradient(top, #F7F6FF 0%, #FEEFEB 100%); background: linear-gradient(180deg, #F7F6FF 0%, #FEEFEB 100%); } .axil-service .inner .icon.gradient-color-05 .icon-inner { background: #FF8A5B; } .axil-service .inner .icon.gradient-color-06::before { background: -webkit-gradient(linear, left top, left bottom, from(#EBFFFD), to(#EFEEFA)); background: -webkit-linear-gradient(top, #EBFFFD 0%, #EFEEFA 100%); background: -o-linear-gradient(top, #EBFFFD 0%, #EFEEFA 100%); background: linear-gradient(180deg, #EBFFFD 0%, #EFEEFA 100%); } .axil-service .inner .icon.gradient-color-06 .icon-inner { background: #007AFF; } .axil-service .inner .icon .icon-inner { position: relative; width: 62px; height: 62px; text-align: center; line-height: 58px; border-radius: 100%; background: #0ac775; left: 32px; z-index: 1; } .axil-service .inner .icon .icon-inner > img { position: absolute; top: 0; right: -5px; } .axil-service .inner .icon .icon-inner .text { font-size: 26px; color: #ffffff; font-weight: 700; } .axil-service .inner .content h4.title { margin-bottom: 20px; } @media only screen and (max-width: 767px) { .axil-service .inner .content h4.title { margin-bottom: 15px; } } .axil-service .inner .content h4.title a { text-decoration: none; } .axil-service .inner .content p { margin-bottom: 30px; } @media only screen and (max-width: 767px) { .axil-service .inner .content p { margin-bottom: 15px; } } .axil-service .inner .content a.axil-button { background: transparent; height: auto; line-height: inherit; position: relative; padding: 0; } .axil-service .inner .content a.axil-button::after { position: absolute; bottom: 0; width: 0; height: 1px; background: #0ac775; content: ""; left: 0; } .axil-service.active::before { opacity: 1; } .axil-service.active .inner::after { opacity: 1; } .axil-service.active .inner::before { opacity: 1; visibility: visible; } .axil-service.active .inner .content a.axil-button { color: #0ac775; } .axil-service.active .inner .content a.axil-button::after { width: 100%; } .axil-service.service-bg-gray .inner { background: #FAFAFB; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-service.service-bg-gray .inner { padding: 44px 25px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-service.service-bg-gray .inner { padding: 44px 25px; } } @media only screen and (max-width: 767px) { .axil-service.service-bg-gray .inner { padding: 30px 10px; } } .axil-service.service-bg-gray:hover .inner { background: #ffffff; } .axil-service.service-bg-gray.active .inner { background: #ffffff; } .axil-service.space-to-top { margin-top: -100px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-service.space-to-top { margin-top: 60px; } } @media only screen and (max-width: 767px) { .axil-service.space-to-top { margin-top: 30px; } } .axil-service.space-to-top2 { margin-top: -200px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-service.space-to-top2 { margin-top: 60px; } } @media only screen and (max-width: 767px) { .axil-service.space-to-top2 { margin-top: 30px; } } .axil-service.text-left .inner .icon { margin: inherit; margin-bottom: 18px; height: 80px; width: 80px; } .axil-service.text-left .inner .icon::before { right: -17px; height: 100%; width: 60px; } .axil-service.text-left .inner .icon .icon-inner { left: 0; } .axil-service.text-left .inner a.axil-button { padding: 0; } @-webkit-keyframes newanimation { 0% { opacity: 0; } 15% { opacity: 0.3; } 20% { opacity: 0.4; } 25% { opacity: 0.5; } 30% { opacity: 0.6; } 40% { opacity: 0.7; } 45% { opacity: 0.8; } 66% { opacity: 1; } 100% { opacity: 1; } } @keyframes newanimation { 0% { opacity: 0; } 15% { opacity: 0.3; } 20% { opacity: 0.4; } 25% { opacity: 0.5; } 30% { opacity: 0.6; } 40% { opacity: 0.7; } 45% { opacity: 0.8; } 66% { opacity: 1; } 100% { opacity: 1; } } /*------------------------------ Axil Service Style Two -------------------------------*/ .axil-service-two { margin-top: 30px; } .axil-service-two .icon { margin-bottom: 40px; } .axil-service-two .content h4.title { margin-bottom: 20px; } /*--------------------- Service Style Three ------------------------*/ .axil-service-style--3 .icon { position: relative; width: 62px; height: 62px; text-align: center; line-height: 62px; border-radius: 100%; background: #0ac775; } .axil-service-style--3 .icon img { position: absolute; top: 0; right: -5px; } .axil-service-style--3 .icon .text { font-size: 26px; color: #ffffff; font-weight: 700; } .axil-service-style--3 .content { padding-top: 40px; } @media only screen and (max-width: 767px) { .axil-service-style--3 .content { padding-top: 20px; } } .axil-service-style--3 .content .title { margin-bottom: 20px; } @media only screen and (max-width: 767px) { .axil-service-style--3 .content .title { margin-bottom: 10px; } } .axil-service-style--3 .content .title a { text-decoration: none; } .axil-service-style--3.color-var--2 .icon { background: #FF9166; } .axil-service-style--3.color-var--3 .icon { background: #49CCFF; } .axil-service-style--3.color-var--4 .icon { background: #FFCD3E; } .axil-service-style--3.color-var--5 .icon { background: #5BCC9F; } .axil-scroll-nav.navbar.navbar-example2.is-affixed .nav { width: 100% !important; } /*======================= Contact Form Style =========================*/ .axil-contact-form.contact-form-style-1 { padding: 50px; position: relative; z-index: 1; max-width: 490px; -webkit-perspective: 1000px; perspective: 1000px; padding-left: 60px; z-index: 2; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-contact-form.contact-form-style-1 { padding: 30px 35px; } } @media only screen and (max-width: 767px) { .axil-contact-form.contact-form-style-1 { padding: 50px 20px; padding-left: 20px; max-width: inherit; } } .axil-contact-form.contact-form-style-1::after { background: #ffffff; position: absolute; content: ""; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: -1; -webkit-transform-style: preserve-3d; -webkit-transform-style: preserve-3d; -webkit-transform: rotateY(-10deg); transform-style: preserve-3d; transform: rotateY(-10deg); -webkit-box-shadow: 0 0 1px transparent; box-shadow: 0 0 1px transparent; } @media only screen and (max-width: 767px) { .axil-contact-form.contact-form-style-1::after { -webkit-transform: rotateY(0); transform: rotateY(0); } } .axil-contact-form.contact-form-style-1::before { width: 92%; height: 92%; left: -20px; bottom: -20px; background: rgba(0, 2, 72, 0.1); content: ""; position: absolute; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-10deg); transform: rotateY(-10deg); -webkit-filter: blur(50px); filter: blur(50px); } @media only screen and (max-width: 767px) { .axil-contact-form.contact-form-style-1::before { display: none; } } .axil-contact-form.contact-form-style-1 .callto-action-wrapper span.text { font-size: 15px; line-height: 24px; display: inline-block; padding-right: 10px; } .axil-contact-form.contact-form-style-1 .callto-action-wrapper span i { font-size: 22px; font-weight: 400; color: #000248; line-height: 26px; padding-right: 4px; } .axil-contact-form.contact-form-style-1 .callto-action-wrapper span a { font-size: 22px; font-weight: 700; color: #000248; line-height: 26px; text-decoration: none; } @media only screen and (max-width: 767px) { .axil-contact-form.contact-form-style-1 .callto-action-wrapper span a { font-size: 14px; } } .axil-contact-form.contact-form-style-1 .callto-action-wrapper span a:hover { color: #0ac775; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-contact-form.contact-form-style-1 .shape-group { display: none; } } .axil-contact-form.contact-form-style-1 .shape-group .shape { position: absolute; right: -193px; top: 50%; z-index: -1; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-contact-form.contact-form-style-1 .shape-group .shape { right: -151px; } } @media only screen and (max-width: 767px) { .axil-contact-form.contact-form-style-1 .shape-group .shape { display: none; } } .axil-contact-form.contact-form-style-1 .shape-group .shape.shape-01 { right: -64px; top: 26%; } .contact-form-style-2 { position: relative; z-index: 2; } .contact-form-style-2 .inner { padding: 70px 50px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .contact-form-style-2 .inner { padding: 30px; } } @media only screen and (max-width: 767px) { .contact-form-style-2 .inner { padding: 30px 20px; } } .contact-form-style-2::after { background: #ffffff; position: absolute; content: ""; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: -1; -webkit-transform: perspective(700px) rotateY(-2deg); transform: perspective(700px) rotateY(-2deg); } @media only screen and (min-width: 768px) and (max-width: 991px) { .contact-form-style-2::after { -webkit-transform: perspective(0px) rotateY(0deg); transform: perspective(0px) rotateY(0deg); } } @media only screen and (max-width: 767px) { .contact-form-style-2::after { -webkit-transform: perspective(0px) rotateY(0deg); transform: perspective(0px) rotateY(0deg); } } .contact-form-style-2::before { width: 92%; height: 92%; left: -20px; bottom: -20px; background: rgba(0, 2, 72, 0.1); content: ""; position: absolute; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-10deg); transform: rotateY(-10deg); -webkit-filter: blur(50px); filter: blur(50px); } @media only screen and (max-width: 767px) { .contact-form-style-2::before { display: none; } } .axil-contact-area.axil-shape-position { position: relative; z-index: 2; } @media only screen and (max-width: 767px) { .axil-contact-area.axil-shape-position .shape-group { display: none; } } .axil-contact-area.axil-shape-position .shape-group .shape { position: absolute; z-index: -1; } .axil-contact-area.axil-shape-position .shape-group .shape.shape-01 { left: 43%; top: 50%; z-index: 1; } .axil-contact-area.axil-shape-position .shape-group .shape.shape-02 { left: 40%; top: 50%; z-index: 1; } .axil-contact-area.axil-shape-position .shape-group .shape.shape-03 { left: 30%; top: 46%; } /* Form Group */ .form-group { position: relative; z-index: 2; margin-bottom: 30px; } .form-group label { position: absolute; left: 0; width: 100%; top: 9px; color: #757589; -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; z-index: -1; letter-spacing: 0.5px; font-size: 18px; line-height: 28px; } .form-group input { border: 0; border-bottom: 2px solid #C7C7D5; background-color: transparent; padding-bottom: 8px; padding-top: 8px; } .form-group input[type="submit"] { border: 2px solid #000248; background: #ffffff; color: #000248; font-size: 16px; font-weight: 700; height: 46px; line-height: 44px; padding: 0; text-transform: capitalize; } .form-group input[type="submit"]:hover { background: #000248; color: #ffffff; } .form-group textarea { border: 0; min-height: 165px; padding-bottom: 8px; padding-top: 8px; border-bottom: 2px solid #C7C7D5; background-color: transparent; resize: none; } .form-group span.focus-border { position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background-color: #0ac775; -webkit-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s; } .form-group.focused label { top: -10px; font-size: 12px; color: #0ac775; -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } .form-group.focused span.focus-border { width: 100%; -webkit-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s; } /*-------------------------- Axil Address Area ----------------------------*/ .axil-address { padding: 50px 50px; position: relative; position: relative; z-index: 2; max-width: 450px; } @media only screen and (max-width: 767px) { .axil-address { padding: 30px 15px; } } .axil-address::after { background: #ffffff; position: absolute; content: ""; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: -1; -webkit-transform-style: preserve-3d; -webkit-transform-style: preserve-3d; -webkit-transform: rotateY(-10deg); transform-style: preserve-3d; transform: rotateY(-10deg); } .axil-address::before { width: 92%; height: 92%; left: -20px; bottom: -20px; background: rgba(0, 2, 72, 0.1); content: ""; position: absolute; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-10deg); transform: rotateY(-10deg); -webkit-filter: blur(50px); filter: blur(50px); } @media only screen and (max-width: 767px) { .axil-address::before { display: none; } } .axil-address .inner .icon { margin-bottom: 18px; } @media only screen and (max-width: 767px) { .axil-address .inner .icon { margin-bottom: 7px; } } .axil-address .inner .icon i { color: #000248; font-size: 36px; font-weight: 400; } .axil-address .inner .content h4.title { font-size: 26px; font-weight: 700; line-height: 32px; margin-bottom: 20px; } @media only screen and (max-width: 767px) { .axil-address .inner .content h4.title { margin-bottom: 6px; } } .axil-address .inner .content p a { color: #0ac775; font-weight: 700; font-size: 22px; text-decoration: none; } .axil-address .inner .content p + p { margin-top: 20px; } @media only screen and (max-width: 767px) { .axil-address .inner .content p + p { margin-top: 6px; } } /*------------------------- Axil Office Location ---------------------------*/ .axil-office-location .thumbnail { margin-bottom: 30px; } .axil-office-location .thumbnail img { width: 100%; } .axil-office-location .content h4.title { margin-bottom: 15px; } .axil-office-location .content p { margin-bottom: 20px; } /*------------------ Form Message ---------------------*/ p.form-messege.error { margin-top: 20px; color: #f10; } p.form-messege.success { color: green; margin-top: 20px; opacity: 0.8; } /*======================= Portfolio Styles =========================*/ /*------------------------- Masonary Grid List ----------------------------*/ .mesonry-list { margin: 0 -22px; } .mesonry-list.grid-metro3 .resizer { width: 33.33%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .mesonry-list.grid-metro3 .resizer { width: 50%; } } @media only screen and (max-width: 767px) { .mesonry-list.grid-metro3 .resizer { width: 50%; } } .mesonry-list.grid-metro3 .portfolio-33-33 { width: 33.33%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .mesonry-list.grid-metro3 .portfolio-33-33 { width: 50%; } } @media only screen and (max-width: 767px) { .mesonry-list.grid-metro3 .portfolio-33-33 { width: 100%; } } /*----------------------------- Portfolio Item ------------------------------*/ .portfolio { padding: 0 22px; margin-top: 60px; } @media only screen and (max-width: 767px) { .portfolio { margin-top: 30px; } } .portfolio .inner .thumb { display: inline-block; position: relative; z-index: 3; -webkit-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } @media only screen and (max-width: 767px) { .portfolio .inner .thumb { display: block; -webkit-transform: perspective(0) rotateY(0deg); transform: perspective(0) rotateY(0deg); } } .portfolio .inner .thumb::before { position: absolute; width: calc(100% - -2px); height: calc(100% + -15px); top: calc(25px + 10px); content: ""; border: 4px solid #000345; z-index: -1; right: calc(25px - 5px); -webkit-box-shadow: 0 5px 35px rgba(0, 2, 72, 0.1); box-shadow: 0 5px 35px rgba(0, 2, 72, 0.1); opacity: 0; -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } @media only screen and (max-width: 767px) { .portfolio .inner .thumb::before { display: none; } } .portfolio .inner .thumb a { display: block; } .portfolio .inner .thumb a img { width: 100%; } .portfolio .inner .port-overlay-info { padding-top: 30px; } @media only screen and (max-width: 767px) { .portfolio .inner .port-overlay-info { padding-top: 20px; } } .portfolio .inner .port-overlay-info .hover-action h4.title { margin-bottom: 10px; } @media only screen and (max-width: 767px) { .portfolio .inner .port-overlay-info .hover-action h4.title { margin-bottom: 0px; } } .portfolio .inner .port-overlay-info .hover-action h4.title a { text-decoration: none; } .portfolio .inner .port-overlay-info .hover-action span.category { font-size: 20px; line-height: 32px; display: block; } .portfolio.active .inner .thumb { -webkit-transform: perspective(500px) rotateY(-5deg); transform: perspective(500px) rotateY(-5deg); } @media only screen and (max-width: 767px) { .portfolio.active .inner .thumb { -webkit-transform: perspective(0) rotateY(0); transform: perspective(0) rotateY(0); } } .portfolio.active .inner .thumb::before { opacity: 1; } /*---------------------------------- Portfolio Button Styles -----------------------------------*/ .messonry-button button { border: 0 none; font-size: 16px; font-weight: 700; text-align: center; color: #000248; position: relative; height: 100px; z-index: 2; -webkit-perspective: 100px; perspective: 100px; padding: 0 35px; } @media only screen and (max-width: 767px) { .messonry-button button { font-size: 14px; height: 53px; padding: 0 14px; } } .messonry-button button::after { background: #ffffff; position: absolute; content: ""; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-10deg); transform: rotateY(-10deg); opacity: 0; } .messonry-button button::before { width: 92%; height: 92%; left: -20px; bottom: -20px; background: rgba(0, 2, 72, 0.1); content: ""; position: absolute; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-10deg); transform: rotateY(-10deg); -webkit-filter: blur(50px); filter: blur(50px); opacity: 0; -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; visibility: hidden; } @media only screen and (max-width: 767px) { .messonry-button button::before { display: none; } } .messonry-button button.is-checked { color: #0ac775; } .messonry-button button.is-checked::after { opacity: 1; } .messonry-button button.is-checked::before { opacity: 1; visibility: visible; } .messonry-button button:hover { color: #0ac775; } /*---------------------------- Axil Counterup Styles -----------------------------*/ .axil-counterup { height: 280px; width: 280px; position: relative; z-index: 2; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-counterup { height: 210px; width: 210px; } } @media only screen and (max-width: 767px) { .axil-counterup { margin: 0 auto; height: 210px; width: 210px; } } @media only screen and (max-width: 575px) { .axil-counterup { margin: 0 auto; height: auto; width: auto; padding: 20px 10px; margin-top: 30px !important; } } .axil-counterup::after { background: #ffffff; position: absolute; content: ""; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: -1; -webkit-transform: perspective(500px) rotateY(-5deg); transform: perspective(500px) rotateY(-5deg); -webkit-box-shadow: 0 0 1px transparent; box-shadow: 0 0 1px transparent; } .axil-counterup::before { width: 92%; height: 92%; left: -20px; bottom: -20px; background: rgba(0, 2, 72, 0.1); content: ""; position: absolute; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-10deg); transform: rotateY(-10deg); -webkit-filter: blur(50px); filter: blur(50px); -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } @media only screen and (max-width: 767px) { .axil-counterup::before { display: none; } } .axil-counterup .icon { height: 50px; width: 50px; background-color: rgba(112, 47, 255, 0.1); margin: 0 auto; line-height: 47px; border-radius: 100%; } .axil-counterup .icon img { height: 20px; } .axil-counterup h3.count { font-size: 50px; font-weight: 700; line-height: 62px; margin-top: 20px; margin-bottom: 0; position: relative; display: inline-block; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-counterup h3.count { font-size: 42px; line-height: 53px; margin-top: 14px; } } @media only screen and (max-width: 767px) { .axil-counterup h3.count { font-size: 42px; line-height: 53px; margin-top: 14px; } } @media only screen and (max-width: 575px) { .axil-counterup h3.count { font-size: 28px; line-height: 42px; margin-top: 9px; } } .axil-counterup h3.count::after { content: "+"; } .axil-counterup.counter-second { margin-top: 120px !important; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-counterup.counter-second { margin-top: 100px !important; } } @media only screen and (max-width: 767px) { .axil-counterup.counter-second { margin-top: 50px !important; } } @media only screen and (max-width: 575px) { .axil-counterup.counter-second { margin-top: 30px !important; } } .axil-counterup.counter-second .icon { background-color: rgba(255, 138, 91, 0.1); } .axil-counterup.counter-third .icon { background-color: rgba(0, 207, 255, 0.1); } .axil-counterup.counter-four { margin-top: 120px !important; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-counterup.counter-four { margin-top: 60px !important; } } @media only screen and (max-width: 767px) { .axil-counterup.counter-four { margin-top: 30px !important; } } .axil-counterup.counter-four .icon { background-color: rgba(0, 208, 156, 0.1); } .axil-counterup.color-style-two .icon { background-color: rgba(255, 138, 91, 0.1); } .axil-counterup.color-style-three .icon { background-color: rgba(0, 207, 255, 0.1); } .axil-counterup.color-style-four .icon { background-color: rgba(0, 208, 156, 0.1); } /*-------------------------------- Axil Testimonial Styles ----------------------------------*/ .axil-testimonial { position: relative; z-index: 2; } .axil-testimonial::before { position: absolute; content: ""; right: 40px; color: #00D09C; font-size: 45px; top: 69px; font-weight: 600; z-index: 3; background-image: url("../images/shape/quote.svg"); background-repeat: no-repeat, repeat; width: 52px; height: 44px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-testimonial::before { right: 20px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-testimonial::before { right: 20px; } } .axil-testimonial .inner { position: relative; padding: 60px 36px; z-index: 2; } @media only screen and (max-width: 767px) { .axil-testimonial .inner { padding: 22px 19px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-testimonial .inner { padding: 30px 40px; } } .axil-testimonial .inner::before { width: 100%; height: 92%; left: -25px; bottom: -25px; background: rgba(0, 2, 72, 0.1); opacity: 0; content: ""; position: absolute; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-2deg); transform: rotateY(-2deg); -webkit-filter: blur(40px); filter: blur(40px); -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } @media only screen and (max-width: 767px) { .axil-testimonial .inner::before { display: none; } } .axil-testimonial .inner::after { background: #ffffff; position: absolute; content: ""; top: 0; bottom: 0; left: 0; height: 100%; z-index: -1; -webkit-transform: perspective(700px) rotateY(-2deg); transform: perspective(700px) rotateY(-2deg); opacity: 0; width: 100%; -webkit-box-shadow: 0 0 1px transparent; box-shadow: 0 0 1px transparent; } .axil-testimonial .clint-info-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } @media only screen and (max-width: 767px) { .axil-testimonial .clint-info-wrapper { display: block; } } .axil-testimonial .clint-info-wrapper .thumb { position: relative; height: 100%; z-index: 1; display: inline-block; } .axil-testimonial .clint-info-wrapper .thumb::before { width: 92%; height: 92%; left: -10px; bottom: -10px; background: rgba(0, 2, 72, 0.3); content: ""; position: absolute; -webkit-filter: blur(14px); filter: blur(14px); -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; z-index: -1; } @media only screen and (max-width: 767px) { .axil-testimonial .clint-info-wrapper .thumb::before { display: none; } } .axil-testimonial .clint-info-wrapper .thumb img { height: 60px; } .axil-testimonial .clint-info-wrapper .client-info { padding-left: 25px; } @media only screen and (max-width: 767px) { .axil-testimonial .clint-info-wrapper .client-info { padding-left: 0; margin-top: 15px; } } .axil-testimonial .clint-info-wrapper .client-info h4.title { line-height: 32px; margin-bottom: 5px; } @media only screen and (max-width: 767px) { .axil-testimonial .clint-info-wrapper .client-info h4.title { line-height: 24px; font-size: 20px; } } .axil-testimonial .clint-info-wrapper .client-info span { line-height: 28px; display: inline-block; } .axil-testimonial .description { margin-top: 38px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-testimonial .description { margin-top: 20px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-testimonial .description { margin-top: 20px; } } @media only screen and (max-width: 767px) { .axil-testimonial .description { margin-top: 16px; } } .axil-testimonial .description p { margin-bottom: 0; } .axil-testimonial .description a.axil-link-button { margin-top: 40px; color: #000248; text-decoration: none; position: relative; font-weight: 700; font-size: 16px; line-height: 16px; } .axil-testimonial .description a.axil-link-button::after { position: absolute; bottom: 0; width: 0; height: 1px; content: ""; background: currentColor; left: 0; } @media only screen and (max-width: 767px) { .axil-testimonial .description a.axil-link-button { margin-top: 15px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-testimonial .description a.axil-link-button { margin-top: 20px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-testimonial .description a.axil-link-button { margin-top: 20px; } } .axil-testimonial .description a.axil-link-button:hover { color: #0ac775; } .axil-testimonial.style-var--2 .clint-info-wrapper .thumb { position: relative; height: 100%; z-index: 1; display: inline-block; } .axil-testimonial.style-var--2 .clint-info-wrapper .thumb::before { width: 92%; height: 92%; left: -10px; bottom: -10px; background: rgba(0, 2, 72, 0.3); content: ""; position: absolute; -webkit-filter: blur(14px); filter: blur(14px); -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; z-index: -1; } @media only screen and (max-width: 767px) { .axil-testimonial.style-var--2 .clint-info-wrapper .thumb::before { display: none; } } .axil-testimonial.style-var--2 .clint-info-wrapper .thumb img { height: 60px; width: 60px; border-radius: 100%; border: 4px solid #FFFFFF; -webkit-box-sizing: border-box; box-sizing: border-box; } .axil-testimonial.active .inner::before { opacity: 1; } .axil-testimonial.active .inner::after { opacity: 1; } .axil-testimonial.active .description a.axil-link-button { color: #0ac775; } .axil-testimonial.active .description a.axil-link-button::after { width: 100%; } /*------------------------ Brand Styles -------------------------*/ .axil-brand-logo-wrapper { padding-left: 88px; padding-right: 86px; } @media only screen and (max-width: 767px) { .axil-brand-logo-wrapper { padding-left: 0; padding-right: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-brand-logo-wrapper { padding-left: 0; padding-right: 0; } } .brand-list { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; position: relative; } .brand-list::before { position: absolute; content: ""; background: #C7C7D6; width: 100%; height: 1px; top: 50%; } @media only screen and (max-width: 575px) { .brand-list::before { display: none; } } .brand-list li { -webkit-flex-basis: 33.33%; -ms-flex-preferred-size: 33.33%; flex-basis: 33.33%; } @media only screen and (max-width: 575px) { .brand-list li { -webkit-flex-basis: 50%; -ms-flex-preferred-size: 50%; flex-basis: 50%; } } .brand-list li a { display: block; border-right: 1px solid #C7C7D6; text-align: center; height: 200px; line-height: 200px; } @media only screen and (max-width: 575px) { .brand-list li a { border: 0 none; height: 100px; line-height: 100px; } } .brand-list li a:hover { background: #f6f6f6; border-color: #f6f6f6; } .brand-list li a:hover img { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); } .brand-list li:nth-child(3) a { border-color: transparent; } .brand-list li:last-child a { border-color: transparent; } .bg-color-white .brand-list::before { background: #F6F5FA; } @media only screen and (max-width: 575px) { .bg-color-white .brand-list::before { display: none; } } .bg-color-white .brand-list li a { border-right: 1px solid #F6F5FA; } @media only screen and (max-width: 575px) { .bg-color-white .brand-list li a { border: 0 none; } } .bg-color-white .brand-list li:nth-child(3) a { border-color: transparent; } .bg-color-white .brand-list li:last-child a { border-color: transparent; } .client-list.slick-initialized .slick-slide { margin-bottom: 0; } /*------------------------- Client List --------------------------*/ ul.client-list { position: relative; z-index: 2; } ul.client-list li a img { max-height: 40px; } @media only screen and (max-width: 767px) { ul.client-list li a img { width: auto; padding: 0 10px; } } .bg-shape-image-position { position: relative; z-index: 2; } .bg-shape-image-position .bg-shape-image { position: absolute; bottom: 3%; left: 0; z-index: -1; right: 0; width: 100%; } .bg-shape-image-position .bg-shape-image img { width: 100%; height: 100%; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .bg-shape-image-position .bg-shape-image { bottom: 51%; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .bg-shape-image-position .bg-shape-image { bottom: 98%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .bg-shape-image-position .bg-shape-image { bottom: 98%; } } @media only screen and (max-width: 767px) { .bg-shape-image-position .bg-shape-image { bottom: 98%; } } @media only screen and (max-width: 479px) { .bg-shape-image-position .bg-shape-image { bottom: 98%; width: 117%; } } /*--------------------- Axil Blog Styles ----------------------*/ .axil-blog { position: relative; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-blog { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: reverse; -webkit-flex-direction: column-reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media only screen and (max-width: 767px) { .axil-blog { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: reverse; -webkit-flex-direction: column-reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } .axil-blog .content { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); left: 0; width: 360px; z-index: 2; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-blog .content { position: static; top: auto; -webkit-transform: inherit; -ms-transform: inherit; transform: inherit; width: 100%; } } @media only screen and (max-width: 767px) { .axil-blog .content { position: static; top: auto; -webkit-transform: inherit; -ms-transform: inherit; transform: inherit; width: 100%; } } .axil-blog .content .content-wrap { padding: 40px 30px; -webkit-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s; position: relative; z-index: 2; } @media only screen and (max-width: 767px) { .axil-blog .content .content-wrap { padding: 25px 20px; } } .axil-blog .content .content-wrap::after { background: #ffffff; position: absolute; content: ""; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: -1; -webkit-box-shadow: 0 0 1px transparent; box-shadow: 0 0 1px transparent; } .axil-blog .content .content-wrap::before { width: 92%; height: 92%; left: -20px; bottom: -20px; background: rgba(0, 2, 72, 0.1); content: ""; position: absolute; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-10deg); transform: rotateY(-10deg); -webkit-filter: blur(50px); filter: blur(50px); opacity: 0; -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } @media only screen and (max-width: 767px) { .axil-blog .content .content-wrap::before { display: none; } } .axil-blog .content .inner span.category { display: inline-block; height: 26px; background: #5BCC9F; font-size: 15px; color: #F6F5FA; padding: 0 10px; line-height: 26px; margin-bottom: 20px; } @media only screen and (max-width: 767px) { .axil-blog .content .inner span.category { margin-bottom: 15px; } } .axil-blog .content .inner h5.title { margin-bottom: 20px; } @media only screen and (max-width: 767px) { .axil-blog .content .inner h5.title { margin-bottom: 8px; } } .axil-blog .content .inner h5.title a { text-decoration: none; } .axil-blog .thumbnail { text-align: right; } .axil-blog .thumbnail .image img { width: 410px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-blog .thumbnail .image img { width: 100%; } } @media only screen and (max-width: 767px) { .axil-blog .thumbnail .image img { width: 100%; } } .axil-blog.active .content .content-wrap { padding-left: 40px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-blog.active .content .content-wrap { padding-left: 30px; } } @media only screen and (max-width: 767px) { .axil-blog.active .content .content-wrap { padding-left: 30px; } } .axil-blog.active .content .content-wrap::after { -webkit-transform: perspective(300px) rotateY(-5deg); transform: perspective(300px) rotateY(-5deg); } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-blog.active .content .content-wrap::after { -webkit-transform: perspective(0px) rotateY(0deg); transform: perspective(0px) rotateY(0deg); } } @media only screen and (max-width: 767px) { .axil-blog.active .content .content-wrap::after { -webkit-transform: perspective(0px) rotateY(0deg); transform: perspective(0px) rotateY(0deg); } } .axil-blog.active .content .content-wrap::before { opacity: 1; } .axil-blog:hover .content .inner h5.title a { color: #0ac775; } /*---------------------- Blog List Styles ------------------------*/ .axil-blog-list .blog-top .title { margin-bottom: 20px; } @media only screen and (max-width: 767px) { .axil-blog-list .blog-top .title { margin-bottom: 10px; } } .axil-blog-list .blog-top .title a { text-decoration: none; } .axil-blog-list .blog-top .author { 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; margin-bottom: 40px; } @media only screen and (max-width: 767px) { .axil-blog-list .blog-top .author { margin-bottom: 20px; } } .axil-blog-list .blog-top .author .author-thumb img { max-height: 50px; } .axil-blog-list .blog-top .author .info { padding-left: 20px; } .axil-blog-list .blog-top .author .info h6 { margin-bottom: 6px; } .axil-blog-list .blog-top .author .info ul.blog-meta { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin: 0 -10px; } .axil-blog-list .blog-top .author .info ul.blog-meta li { margin: 0 10px; font-size: 15px; line-height: 24px; } .axil-blog-list .thumbnail { margin-bottom: 20px; } .axil-blog-list .content p { font-size: 20px; line-height: 32px; margin-bottom: 40px; } @media only screen and (max-width: 767px) { .axil-blog-list .content p { margin-bottom: 20px; font-size: 16px; line-height: 26px; } } .axil-blog-list.sticky-blog { background: #F6F5FA; padding: 60px 40px; position: relative; } @media only screen and (max-width: 767px) { .axil-blog-list.sticky-blog { padding: 40px 20px; } } .axil-blog-list.sticky-blog .blog-top .title { margin-bottom: 15px; } .axil-blog-list.sticky-blog ul.blog-meta { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin: 0 -10px; } .axil-blog-list.sticky-blog ul.blog-meta li { margin: 0 10px; font-size: 15px; line-height: 24px; } .axil-blog-list.sticky-blog .sticky { position: absolute; right: 40px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .axil-blog-list.sticky-blog .sticky i { color: #0ac775; font-size: 20px; font-weight: 400; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); } .axil-blog-list.sticky-blog .shape-group .shape { position: absolute; bottom: 0; } .axil-blog-list.sticky-blog .shape-group .shape.shape-1 { left: 66%; } .axil-blog-list.sticky-blog .shape-group .shape.shape-2 { left: 46%; } .axil-blog-list.quote-blog { background: #F6F5FA; padding: 60px 40px; position: relative; z-index: 2; } @media only screen and (max-width: 767px) { .axil-blog-list.quote-blog { padding: 40px 20px; } } .axil-blog-list.quote-blog blockquote { padding-right: 11%; } .axil-blog-list.quote-blog .blog-top .author { margin-bottom: 0; } .axil-blog-list.quote-blog .shape-group .shape { position: absolute; bottom: 0; } .axil-blog-list.quote-blog .shape-group .shape.shape-1 { left: 66%; } .axil-blog-list.quote-blog .shape-group .shape.shape-2 { left: 46%; } .axil-blog-list.quote-blog .shape-group .shape.shape-3 { right: 40px; z-index: -1; top: 65px; } .axil-blog-list.gallery-post .thumbnail.axil-carousel { display: block; position: relative; } .axil-blog-list.gallery-post .thumbnail.axil-carousel .slick-slide { display: block; position: relative; } .axil-blog-list.gallery-post .thumbnail.axil-carousel .slick-slide::after { position: absolute; content: ""; left: 0; top: 0; height: 100%; width: 100px; background: -webkit-linear-gradient(left, black 0%, rgba(0, 0, 0, 0) 100%); background: -webkit-gradient(linear, left top, right top, from(black), to(rgba(0, 0, 0, 0))); background: -o-linear-gradient(left, black 0%, rgba(0, 0, 0, 0) 100%); background: linear-gradient(to right, black 0%, rgba(0, 0, 0, 0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=1 ); } .axil-blog-list.gallery-post .thumbnail.axil-carousel .slick-slide::before { position: absolute; content: ""; right: 0; top: 0; height: 100%; width: 100px; background: -webkit-linear-gradient(right, black 0%, rgba(0, 0, 0, 0) 100%); background: -webkit-gradient(linear, right top, left top, from(black), to(rgba(0, 0, 0, 0))); background: -o-linear-gradient(right, black 0%, rgba(0, 0, 0, 0) 100%); background: linear-gradient(to left, black 0%, rgba(0, 0, 0, 0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=1 ); } /*---------------------------- Axil Call To Action ------------------------------*/ .axil-call-to-action h2.title { margin-bottom: 40px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-call-to-action h2.title { margin-bottom: 20px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-call-to-action h2.title { margin-bottom: 20px; } } .axil-call-to-action a.axil-button { margin-bottom: 30px; } .axil-call-to-action .callto-action > span { color: #000248; font-size: 22px; line-height: 26px; font-weight: 700; display: inline-block; } @media only screen and (max-width: 767px) { .axil-call-to-action .callto-action > span { font-size: 15px; } } .axil-call-to-action .callto-action > span a { text-decoration: none; } .axil-call-to-action .callto-action > span.text { font-size: 15px; line-height: 24px; color: #757589; padding-right: 21px; font-weight: 400 !important; } .axil-call-to-action .callto-action > span i { padding-right: 14px; font-weight: 400; } .axil-call-to-action-area.shape-position { position: relative; overflow: hidden; } .axil-call-to-action-area.shape-position .shape-group .shape { position: absolute; } .axil-call-to-action-area.shape-position .shape-group .shape.shape-01 { bottom: 0; left: 300px; } @media only screen and (max-width: 767px) { .axil-call-to-action-area.shape-position .shape-group .shape.shape-01 { display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-call-to-action-area.shape-position .shape-group .shape.shape-01 { left: -3%; } } .axil-call-to-action-area.shape-position .shape-group .shape.shape-02 { bottom: 80px; right: 0; } @media only screen and (max-width: 767px) { .axil-call-to-action-area.shape-position .shape-group .shape.shape-02 { display: none; } } .axil-call-to-action-area.shape-position .shape-group .shape.shape-03 { top: 0; left: 440px; } @media only screen and (max-width: 767px) { .axil-call-to-action-area.shape-position .shape-group .shape.shape-03 { display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-call-to-action-area.shape-position .shape-group .shape.shape-03 { left: 73%; } } .axil-call-to-action-area.shape-position .shape-group .shape.shape-04 { top: 0; right: 300px; } @media only screen and (max-width: 767px) { .axil-call-to-action-area.shape-position .shape-group .shape.shape-04 { display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-call-to-action-area.shape-position .shape-group .shape.shape-04 { right: 66%; } } /*---------------------------------- Call To Action Style Two -----------------------------------*/ .axil-call-to-action.callaction-style-2 { position: relative; z-index: 2; } .axil-call-to-action.callaction-style-2 .inner { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; position: relative; z-index: 1; overflow: hidden; margin-left: -67px; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; padding: 80px 80px 80px 140px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-call-to-action.callaction-style-2 .inner { padding: 40px 40px 40px 40px; margin-left: 0; } } @media only screen and (max-width: 767px) { .axil-call-to-action.callaction-style-2 .inner { padding: 30px 30px; margin-left: 0; display: block; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-call-to-action.callaction-style-2 .inner { padding: 30px 30px; margin-left: 0; display: block; } } .axil-call-to-action.callaction-style-2 .inner::after { background: -webkit-gradient(linear, left top, left bottom, from(#FEF7E2), to(#EEEEFD)); background: -webkit-linear-gradient(top, #FEF7E2 0%, #EEEEFD 100%); background: -o-linear-gradient(top, #FEF7E2 0%, #EEEEFD 100%); background: linear-gradient(180deg, #FEF7E2 0%, #EEEEFD 100%); position: absolute; content: ""; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: -1; -webkit-transform: perspective(500px) rotateY(-5deg); transform: perspective(500px) rotateY(-5deg); -webkit-box-shadow: 0 0 1px transparent; box-shadow: 0 0 1px transparent; } @media only screen and (max-width: 767px) { .axil-call-to-action.callaction-style-2 .inner::after { -webkit-transform: perspective(0) rotateY(0); transform: perspective(0) rotateY(0); } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-call-to-action.callaction-style-2 .inner::after { -webkit-transform: perspective(0) rotateY(0); transform: perspective(0) rotateY(0); } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-call-to-action.callaction-style-2 .inner::after { -webkit-transform: perspective(0) rotateY(0); transform: perspective(0) rotateY(0); } } .axil-call-to-action.callaction-style-2 .inner h2.title { margin-bottom: 0; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-call-to-action.callaction-style-2 .inner h2.title { font-size: 34px; } } @media only screen and (max-width: 767px) { .axil-call-to-action.callaction-style-2 .inner h2.title { margin-bottom: 17px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-call-to-action.callaction-style-2 .inner h2.title { margin-bottom: 17px; font-size: 39px; } } .axil-call-to-action.callaction-style-2 .inner a.axil-button { margin-bottom: 0; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-call-to-action.callaction-style-2 .inner a.axil-button { margin-bottom: 0; } } @media only screen and (max-width: 767px) { .axil-call-to-action.callaction-style-2 .inner a.axil-button { margin-bottom: 0; } } .axil-call-to-action.callaction-style-2.variation--2 { margin-bottom: -110px; position: relative; } .axil-call-to-action.callaction-style-2.variation--2 .inner::after { background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ffffff)); background: -webkit-linear-gradient(top, #ffffff 0%, #ffffff 100%); background: -o-linear-gradient(top, #ffffff 0%, #ffffff 100%); background: linear-gradient(180deg, #ffffff 0%, #ffffff 100%); } .axil-call-to-action.callaction-style-2.variation--2 .inner h2.title { font-size: 42px; line-height: 60px; margin-bottom: 15px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-call-to-action.callaction-style-2.variation--2 .inner h2.title { font-size: 37px; line-height: 47px; margin-bottom: 8px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-call-to-action.callaction-style-2.variation--2 .inner h2.title { font-size: 32px; line-height: 46px; margin-bottom: 5px; } } @media only screen and (max-width: 767px) { .axil-call-to-action.callaction-style-2.variation--2 .inner h2.title { font-size: 32px; line-height: 46px; margin-bottom: 5px; } } @media only screen and (max-width: 575px) { .axil-call-to-action.callaction-style-2.variation--2 .inner h2.title { font-size: 28px; line-height: 40px; } } .axil-call-to-action.callaction-style-2.variation--2 .inner p { font-size: 20px; font-weight: 400; line-height: 35px; color: #75758B; } .axil-call-to-action.callaction-style-2.variation--2 .inner p a { color: #00CFFF; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-call-to-action.callaction-style-2.variation--2 .inner .button-wrapper { margin-top: 20px; } } @media only screen and (max-width: 767px) { .axil-call-to-action.callaction-style-2.variation--2 .inner .button-wrapper { margin-top: 20px; } } /*----------------------- Axil Case Study -------------------------*/ .axil-case-study { margin-top: 60px; position: relative; -webkit-box-shadow: 0 0 1px transparent; box-shadow: 0 0 1px transparent; } @media only screen and (max-width: 767px) { .axil-case-study { background: #ffffff; margin-top: 30px; } } .axil-case-study.theme-gradient-5 { background: -webkit-linear-gradient(315.26deg, #D6FFFC 0%, #FAE7E4 100%); background: -o-linear-gradient(315.26deg, #D6FFFC 0%, #FAE7E4 100%); background: linear-gradient(134.74deg, #D6FFFC 0%, #FAE7E4 100%); } .axil-case-study .thumbnail a { display: block; } .axil-case-study .thumbnail a img { width: 100%; } .axil-case-study .content { position: absolute; top: 0; left: 0; padding: 50px; width: 64%; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-case-study .content { padding: 20px; width: 80%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-case-study .content { padding: 20px; width: 100%; } } @media only screen and (max-width: 767px) { .axil-case-study .content { position: static; padding: 20px 10px; width: 100%; } } .axil-case-study .content .inner span.category { color: #737387; font-size: 20px; line-height: 32px; display: inline-block; margin-bottom: 10px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-case-study .content .inner span.category { font-size: 18px; line-height: 22px; margin-bottom: 5px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-case-study .content .inner span.category { font-size: 18px; line-height: 22px; margin-bottom: 5px; } } @media only screen and (max-width: 767px) { .axil-case-study .content .inner span.category { font-size: 14px; line-height: 20px; margin-bottom: 5px; } } @media only screen and (max-width: 767px) { .axil-case-study .content .inner h4.title { margin-bottom: 0; } } .axil-case-study .content .inner h4.title a { text-decoration: none; } .axil-case-study.with-mokup-images { padding-top: 50px; padding-bottom: 200px; } @media only screen and (max-width: 575px) { .axil-case-study.with-mokup-images { padding-top: 100px; padding-bottom: 100px; } } .axil-case-study.with-mokup-images .content { position: static; padding-bottom: 0; } .axil-case-study.with-mokup-images .content .inner { width: 60%; } @media only screen and (max-width: 575px) { .axil-case-study.with-mokup-images .content .inner { width: 100%; } } .axil-case-study.with-mokup-images .content .inner h4.title { font-size: 35px; font-weight: 700; line-height: 46px; } @media only screen and (max-width: 767px) { .axil-case-study.with-mokup-images .content .inner h4.title { font-size: 26px; line-height: 37px; } } .axil-case-study.with-mokup-images .mockup { position: absolute; right: 0; top: -23%; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-case-study.with-mokup-images .mockup { top: -14%; width: 48%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-case-study.with-mokup-images .mockup { top: 8%; width: 50%; } } @media only screen and (max-width: 767px) { .axil-case-study.with-mokup-images .mockup { top: 8%; width: 50%; } } @media only screen and (max-width: 575px) { .axil-case-study.with-mokup-images .mockup { display: none; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-case-study.with-mokup-images .mockup img { width: 100%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-case-study.with-mokup-images .mockup img { width: 100%; } } @media only screen and (max-width: 767px) { .axil-case-study.with-mokup-images .mockup img { width: 100%; } } .will-change-area { position: relative; } .will-change-area .image-1 { position: absolute; top: 0; left: 0; right: 0; } /*--------------------- Axil Slick ----------------------*/ .axil-featured-activation { position: relative; } .axil-featured-activation ul.slick-dots { position: absolute; z-index: 2; bottom: 0; left: 13.5%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-featured-activation ul.slick-dots { bottom: -30px; left: 9px; width: auto; } } @media only screen and (max-width: 767px) { .axil-featured-activation ul.slick-dots { bottom: -30px; left: 9px; width: auto; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-featured-activation ul.slick-dots { bottom: -40px; left: 7.5%; } } .axil-carousel ul.slick-dots li { position: relative; display: inline-block; width: 11px; height: 11px; margin: 0 10px; padding: 0; cursor: pointer; background: rgba(122, 25, 255, 0.1); border-radius: 100%; } .axil-carousel ul.slick-dots li button { display: block; width: 100%; height: 100%; padding: 0; border: 0; outline: none; border-radius: 100%; } .axil-carousel ul.slick-dots li button::before { display: none; } .axil-carousel ul.slick-dots li.slick-active { background: #7a19ff; } .axil-arrow-button { position: relative; } .axil-arrow-button .slick-prev, .axil-arrow-button .slick-next { z-index: 2; width: 40px; background: rgba(255, 255, 255, 0.3); height: 40px; border-radius: 100px; color: #fff; font-size: 18px; text-align: center; line-height: 41px; -webkit-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s; } .axil-arrow-button .slick-prev::before, .axil-arrow-button .slick-next::before { display: none; } .axil-arrow-button .slick-prev:hover, .axil-arrow-button .slick-next:hover { background: #fff; color: #0ac775; } .axil-arrow-button .slick-prev { left: 40px; } @media only screen and (max-width: 767px) { .axil-arrow-button .slick-prev { left: 20px; } } .axil-arrow-button .slick-next { right: 40px; } @media only screen and (max-width: 767px) { .axil-arrow-button .slick-next { right: 20px; } } .axil-arrow-button.botton-bottom-transparent ul.slick-dots { bottom: 26px; } @media only screen and (max-width: 767px) { .axil-arrow-button.botton-bottom-transparent ul.slick-dots { bottom: 10px; } } /*------------------------ Axil Team Styles -------------------------*/ .axil-team-area.shape-position { position: relative; z-index: 2; } @media only screen and (max-width: 575px) { .axil-team-area.shape-position .shape-group { display: none; } } .axil-team-area.shape-position .shape-group .shape { position: absolute; left: 0; top: 50%; } .axil-team-area.shape-position .shape-group .shape.shape-1 { left: 19%; top: 36%; z-index: 2; } .axil-team-area.shape-position .shape-group .shape.shape-2 { left: 7%; top: 30%; } .axil-team-area.shape-position .shape-group .shape.shape-3 { top: 23%; -webkit-transform: rotate(20deg); -ms-transform: rotate(20deg); transform: rotate(20deg); left: 18%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-team-area.shape-position .shape-group .shape.shape-3 { top: 17%; -webkit-transform: rotate(-7deg); -ms-transform: rotate(-7deg); transform: rotate(-7deg); } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-team-area.shape-position .shape-group .shape.shape-3 { left: -9%; } } @media only screen and (max-width: 767px) { .axil-team-area.shape-position .shape-group .shape.shape-3 { top: 13%; -webkit-transform: rotate(-7deg); -ms-transform: rotate(-7deg); transform: rotate(-7deg); } } .axil-team-area .thumbnail { position: relative; z-index: 3; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-team-area .thumbnail img { width: 100%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-team-area .thumbnail img { width: 100%; } } @media only screen and (max-width: 767px) { .axil-team-area .thumbnail img { width: 100%; } } @media only screen and (max-width: 767px) { .axil-team-area .thumbnail .image img { width: 100%; } } .axil-team-area .thumbnail .total-team-button a { display: inline-block; width: 80px; height: 60px; font-size: 26px; line-height: 32px; font-weight: 700; color: #FFFFFF; text-decoration: none; position: absolute; z-index: 2; right: 34%; bottom: 40px; text-align: center; line-height: 57px; } .axil-team-area .thumbnail .total-team-button a span { display: inline-block; padding-left: 10px; } .axil-team-area .thumbnail .total-team-button a::after { -webkit-box-shadow: 0 5px 35px rgba(0, 2, 72, 0.1); box-shadow: 0 5px 35px rgba(0, 2, 72, 0.1); background: #7A19FF; position: absolute; content: ""; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: -1; -webkit-transform: perspective(100px) rotateY(-20deg); transform: perspective(100px) rotateY(-20deg); } /* Axil Team Area */ .axil-team .inner .thumbnail { position: relative; display: inline-block; } .axil-team .inner .thumbnail::before { position: absolute; width: calc(100% + -2px); height: calc(100% + -7px); top: calc(25px + -2px); content: ""; border: 2px solid #000345; z-index: -1; right: calc(25px + -4px); opacity: 0; visibility: hidden; -webkit-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } .axil-team .inner .content { padding-top: 20px; } @media only screen and (max-width: 767px) { .axil-team .inner .content { padding-top: 13px; } } .axil-team .inner .content h4.title { margin-bottom: 10px; } @media only screen and (max-width: 767px) { .axil-team .inner .content h4.title { margin-bottom: 3px; } } .axil-team .inner .content h4.title a { text-decoration: none; } .axil-team .inner:hover .thumbnail::before { opacity: 1; visibility: visible; } /* Team Tab Styles */ .nav-tabs.team-nab-tabs { border: 0 none; } .nav-tabs.team-nab-tabs li a { margin: 0; display: inline-block; padding: 0; border: 0 none; text-decoration: none; background: transparent; color: #131A55; font-weight: 700; font-size: 16px; line-height: 22px; padding: 34px 15px; -webkit-perspective: 1000px; perspective: 1000px; -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } @media only screen and (min-width: 768px) and (max-width: 991px) { .nav-tabs.team-nab-tabs li a { padding: 20px 12px; } } @media only screen and (max-width: 767px) { .nav-tabs.team-nab-tabs li a { padding: 16px 11px; } } .nav-tabs.team-nab-tabs li a.nav-link.active { background: transparent; border: 0 none; position: relative; z-index: 2; color: #0ac775; } .nav-tabs.team-nab-tabs li a.nav-link.active::before { -webkit-box-shadow: 0 5px 35px rgba(0, 2, 72, 0.1); box-shadow: 0 5px 35px rgba(0, 2, 72, 0.1); background: #ffffff; position: absolute; content: ""; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: -1; -webkit-transform: perspective(225px) rotateY(-11deg); transform: perspective(225px) rotateY(-11deg); } @media only screen and (min-width: 768px) and (max-width: 991px) { .nav-tabs.team-nab-tabs li a.nav-link.active::before { -webkit-transform: perspective(210px) rotateY(-3deg); transform: perspective(210px) rotateY(-3deg); } } @media only screen and (max-width: 767px) { .nav-tabs.team-nab-tabs li a.nav-link.active::before { -webkit-transform: perspective(210px) rotateY(-3deg); transform: perspective(210px) rotateY(-3deg); } } /*-------------------------- Pricing Table Styles ----------------------------*/ .axil-pricing-table-area.pricing-shape-position { position: relative; z-index: 1; } .axil-pricing-table-area.pricing-shape-position .shape-group { position: absolute; left: 0; bottom: 270px; z-index: -1; } @media only screen and (max-width: 767px) { .axil-pricing-table-area.pricing-shape-position .shape-group { display: none; } } /*-------------------------------- Start Pricing Table Style ----------------------------------*/ .axil-pricing-table { position: relative; z-index: 2; } .axil-pricing-table .axil-pricing-inner { padding: 40px; background: #FFFFFF; margin: 0 auto; position: relative; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-pricing-table .axil-pricing-inner { padding: 40px 20px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-pricing-table .axil-pricing-inner { padding: 30px 20px; } } @media only screen and (max-width: 767px) { .axil-pricing-table .axil-pricing-inner { padding: 25px 15px; } } .axil-pricing-table .pricing-header { border-bottom: 1px solid #C7C7D5; padding-bottom: 10px; } .axil-pricing-table .pricing-header h4 { margin-bottom: 10px; } .axil-pricing-table .pricing-header p { font-size: 15px; line-height: 24px; margin-bottom: 30px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-pricing-table .pricing-header p { margin-bottom: 15px; } } @media only screen and (max-width: 767px) { .axil-pricing-table .pricing-header p { margin-bottom: 15px; } } .axil-pricing-table .pricing-header .price-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 20px; -webkit-box-align: end; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-pricing-table .pricing-header .price-wrapper { margin-bottom: 16px; } } @media only screen and (max-width: 767px) { .axil-pricing-table .pricing-header .price-wrapper { margin-bottom: 16px; } } .axil-pricing-table .pricing-header .price-wrapper .price { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: end; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; } .axil-pricing-table .pricing-header .price-wrapper .price h2 { color: #00D09C; font-size: 50px; line-height: 41px; font-weight: 700; margin-bottom: 0; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-pricing-table .pricing-header .price-wrapper .price h2 { font-size: 35px; } } @media only screen and (max-width: 767px) { .axil-pricing-table .pricing-header .price-wrapper .price h2 { font-size: 35px; } } .axil-pricing-table .pricing-header .price-wrapper .price span { color: #757589; font-size: 15px; line-height: 24px; } .axil-pricing-table .pricing-header .price-wrapper .date-option select { color: #757589; font-size: 15px; line-height: 24px; border: 0 none; border-bottom: 1px solid #D3D3D3; padding: 0; margin: 0; height: auto; } .axil-pricing-table .pricing-header .pricing-get-button { margin-bottom: 20px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-pricing-table .pricing-header .pricing-get-button { text-align: center; margin-bottom: 10px; } } .axil-pricing-table .pricing-header .pricing-get-button a.axil-button { width: 100%; text-align: center; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-pricing-table .pricing-header .pricing-get-button a.axil-button { width: auto; margin: 0 auto; padding: 0 13px; } } .axil-pricing-table .pricing-header span.subtitle { font-size: 15px; line-height: 24px; display: block; text-align: center; } .axil-pricing-table .pricing-body { margin-top: 20px; } .axil-pricing-table .pricing-body .inner ul.list-style { list-style: none; padding: 0; margin: 0; } .axil-pricing-table .pricing-body .inner ul.list-style li { color: #737387; font-size: 20px; line-height: 50px; position: relative; padding-left: 35px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-pricing-table .pricing-body .inner ul.list-style li { font-size: 14px; line-height: 34px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-pricing-table .pricing-body .inner ul.list-style li { font-size: 14px; line-height: 39px; } } @media only screen and (max-width: 767px) { .axil-pricing-table .pricing-body .inner ul.list-style li { font-size: 14px; line-height: 40px; } } .axil-pricing-table .pricing-body .inner ul.list-style li::before { position: absolute; color: #00D09C; font-family: "Font Awesome 5 Pro"; font-size: 18px; line-height: 18px; content: "\f00c"; font-weight: 400; left: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .axil-pricing-table.active { background: transparent; padding-left: 48px; } @media only screen and (max-width: 767px) { .axil-pricing-table.active { padding-left: 10px; } } .axil-pricing-table.active .axil-pricing-inner { position: relative; z-index: 2; background: transparent; } .axil-pricing-table.active .axil-pricing-inner::before { width: 92%; height: 92%; left: -20px; bottom: -20px; background: rgba(0, 2, 72, 0.1); content: ""; position: absolute; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-filter: blur(50px); filter: blur(50px); -webkit-transform: perspective(500px) rotateY(-5deg); transform: perspective(500px) rotateY(-5deg); } @media only screen and (max-width: 767px) { .axil-pricing-table.active .axil-pricing-inner::before { display: none; } } .axil-pricing-table.active .axil-pricing-inner::after { background: #ffffff; position: absolute; content: ""; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: -1; -webkit-transform: perspective(700px) rotateY(-2deg); transform: perspective(700px) rotateY(-2deg); } @media only screen and (max-width: 767px) { .axil-pricing-table.active .axil-pricing-inner::after { -webkit-transform: perspective(0px) rotateY(0deg); transform: perspective(0px) rotateY(0deg); } } .axil-pricing-table.active::before { -webkit-transform: perspective(500px) rotateY(-1deg); transform: perspective(500px) rotateY(-1deg); position: absolute; width: calc(100% + -61px); height: calc(100% + -15px); top: calc(25px + 11px); content: ""; border: 4px solid #000345; z-index: -1; right: calc(25px - -11px); -webkit-box-shadow: 0 0 1px transparent; box-shadow: 0 0 1px transparent; } @media only screen and (max-width: 767px) { .axil-pricing-table.active::before { width: calc(100% + -35px); height: calc(100% + -19px); top: calc(25px + 7px); right: calc(25px - -10px); } } @media only screen and (max-width: 575px) { .axil-pricing-table.active::before { display: none; } } .axil-pricing-table.active a.axil-button { color: #FFFFFF; } .axil-pricing-table.active a.axil-button::before { border: 2px solid #0ac775; } .axil-pricing-table.active a.axil-button::after { background-color: #0ac775; opacity: 1; -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1); } .axil-pricing-table.active a.axil-button span.button-icon { border-color: transparent transparent transparent #ffffff; } .axil-pricing-table.active a.axil-button:hover::before { -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1); } .axil-pricing-table.prcing-style-2 .axil-pricing-inner { padding: 40px 35px; } .axil-pricing-table.prcing-style-2.active { padding-left: 0; } .axil-pricing-table.prcing-style-2.active::before { width: calc(100% + -20px); height: calc(100% + -18px); } .axil-pricing-table .pricing-header .price-wrapper .date-option select { -moz-appearance: none; /* Firefox */ -webkit-appearance: none; /* Safari and Chrome */ appearance: none; } .axil-pricing-table .pricing-header .price-wrapper .date-option select { overflow: hidden; overflow: -moz-hidden-unscrollable; background: url(../images/icons/arrow-icon.png) no-repeat right white; display: inline-block; position: relative; padding-right: 12px; } /*----------------------- -Video Styles ------------------------*/ .video-button.position-to-top { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 3; } .axil-video-wrapper .thumbnail { position: relative; z-index: 2; overflow: hidden; -webkit-perspective: 1000px; perspective: 1000px; } /* Video Button */ a.video-btn { display: block; width: 120px; height: 120px; line-height: 120px; background: #ffffff; border-radius: 100%; } @media only screen and (min-width: 768px) and (max-width: 991px) { a.video-btn { width: 80px; height: 80px; line-height: 80px; } } @media only screen and (max-width: 767px) { a.video-btn { width: 60px; height: 60px; line-height: 60px; } } a.video-btn span.triangle { width: 0; height: 0; border-style: solid; border-width: 7.5px 0 7.5px 10px; border-color: transparent transparent transparent #0ac775; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); display: block; } /*---------------------------- Axil Countdown Styles -----------------------------*/ .countdown-style-1 .countbox.timer-grid > div { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; text-align: left; margin: 0 -50px; position: relative; z-index: 2; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: -20px; } .countdown-style-1 .countbox.timer-grid > div > span.axil-count { padding: 0 50px; display: inline-block; text-align: left; position: relative; margin-bottom: 20px; } .countdown-style-1 .countbox.timer-grid > div > span.axil-count::after { position: absolute; content: ""; background: #C7C7D5; height: 80px; width: 1px; top: 50%; right: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } @media only screen and (min-width: 768px) and (max-width: 991px) { .countdown-style-1 .countbox.timer-grid > div > span.axil-count::after { display: none; } } @media only screen and (max-width: 767px) { .countdown-style-1 .countbox.timer-grid > div > span.axil-count::after { display: none; } } .countdown-style-1 .countbox.timer-grid > div > span.axil-count:last-child::after { display: none; } .countdown-style-1 .countbox.timer-grid > div > span .time-count { color: #7A19FF; font-size: 80px; font-weight: 700; line-height: 73px; display: block; text-align: left; } @media only screen and (min-width: 768px) and (max-width: 991px) { .countdown-style-1 .countbox.timer-grid > div > span .time-count { font-size: 50px; line-height: 60px; } } @media only screen and (max-width: 767px) { .countdown-style-1 .countbox.timer-grid > div > span .time-count { font-size: 40px; line-height: 42px; } } .countdown-style-1 .countbox.timer-grid > div > span.count-inner p { color: #757589; font-size: 18px; line-height: 28px; text-align: center; } /*----------------------- Accordion Styles -------------------------*/ .axil-accordion .card { border: 0 none; border-bottom: 1px solid #F6F5FA; border-radius: 0; } .axil-accordion .card .card-header { padding: 20px 0px; margin-bottom: 0; background-color: transparent; border-bottom: 0; } .axil-accordion .card .card-header:first-child { border-radius: 0; } .axil-accordion .card .card-header h5 .btn.btn-link { padding: 0; font-size: 22px; line-height: 26px; border-radius: 0; text-decoration: none; font-weight: 600; color: #0ac775; outline: none; border: 0 none; } .axil-accordion .card .card-header h5 .btn.btn-link i { padding-right: 14px; font-weight: 400; } .axil-accordion .card .card-header h5 .btn.btn-link.collapsed { color: #52526C; } .axil-accordion .card .card-body { padding: 0 0 25px; } .axil-accordion .card .collapse { position: relative; } .axil-accordion .card .collapse::after { position: absolute; content: ""; left: 0; height: 3px; background: #0ac775; width: 100%; z-index: 2; bottom: -1px; opacity: 1; } .axil-accordion .card .collapse.show { opacity: 1; } /*----------------------------- Accourdion Style Two -------------------------------*/ .axil-accordion--2 .card { border-radius: 0; border: 1px solid #C7C7D5; } .axil-accordion--2 .card .card-header { padding: 0; margin-bottom: 0; background-color: transparent; border-bottom: 0; } .axil-accordion--2 .card .card-header:first-child { border-radius: 0; } .axil-accordion--2 .card .card-header .btn.btn-link { padding: 0; font-size: 22px; line-height: 26px; border-radius: 0; text-decoration: none; font-weight: 700; color: #0ac775; outline: none; border: 0 none; padding: 20px 35px; position: relative; } @media only screen and (max-width: 767px) { .axil-accordion--2 .card .card-header .btn.btn-link { font-size: 19px; line-height: 26px; padding: 15px 14px; padding-right: 24px; } } .axil-accordion--2 .card .card-header .btn.btn-link::after { top: 50%; right: 24px; width: 40px; height: 40px; color: #fff; text-align: center; line-height: 40px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); content: ""; -webkit-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; display: inline-block; position: absolute; width: 0; height: 0; border-style: solid; border-width: 0px 7px 7px 7px; border-color: transparent transparent #0ac775; } @media only screen and (max-width: 767px) { .axil-accordion--2 .card .card-header .btn.btn-link::after { right: 6px; } } .axil-accordion--2 .card .card-header .btn.btn-link.collapsed { color: #000248; } .axil-accordion--2 .card .card-header .btn.btn-link.collapsed::after { border-width: 7px 7px 0px 7px; border-color: #000248 transparent transparent; } .axil-accordion--2 .card .card-body { padding: 0 35px; padding-bottom: 20px; color: #757589; font-size: 18px; line-height: 30px; } @media only screen and (max-width: 767px) { .axil-accordion--2 .card .card-body { padding: 0 14px; padding-bottom: 20px; font-size: 16px; line-height: 26px; } } .axil-accordion--2 .card .collapse { position: relative; } .axil-accordion--2 .card + .card { margin-top: 30px; } /************************************** Template Styles ***************************************/ /*---------------------- * Banner ------------------------*/ .slider-fixed-height { height: 950px; width: 100%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .slider-fixed-height { height: auto; padding: 100px 0; } } @media only screen and (max-width: 767px) { .slider-fixed-height { height: auto; padding: 100px 0; } } .slider-fixed-800 { height: 800px; width: 100%; } /*----------------------- Slider Style One -------------------------*/ .axil-slide.slide-style-default .content { position: relative; z-index: 2; } .axil-slide.slide-style-default .content h1 { margin-bottom: 20px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-default .content h1 { margin-bottom: 7px; } } @media only screen and (max-width: 767px) { .axil-slide.slide-style-default .content h1 { margin-bottom: 7px; font-size: 31px !important; line-height: 42px !important; } } .axil-slide.slide-style-default .content p { margin-bottom: 40px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-default .content p { margin-bottom: 19px; } } @media only screen and (max-width: 767px) { .axil-slide.slide-style-default .content p { margin-bottom: 19px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-slide.slide-style-default .content p br { display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-default .content p br { display: none; } } @media only screen and (max-width: 767px) { .axil-slide.slide-style-default .content p br { display: none; } } .axil-slide.slide-style-default .topskew-thumbnail-group .thumbnail { position: relative; z-index: 3; -webkit-transform: perspective(500px) rotateY(0deg); transform: perspective(500px) rotateY(0deg); } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-slide.slide-style-default .topskew-thumbnail-group .thumbnail img { width: 100%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-default .topskew-thumbnail-group .thumbnail img { width: 100%; } } @media only screen and (max-width: 767px) { .axil-slide.slide-style-default .topskew-thumbnail-group .thumbnail img { width: 100%; } } .axil-slide.slide-style-default .topskew-thumbnail-group .thumbnail::before { position: absolute; width: calc(100% + -5px); height: calc(100% + -10px); top: calc(25px + 10px); content: ""; border: 4px solid #000345; z-index: -1; right: calc(25px + 9px); -webkit-box-shadow: 0 0 1px transparent; box-shadow: 0 0 1px transparent; -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-default .topskew-thumbnail-group .thumbnail::before { display: none; } } @media only screen and (max-width: 767px) { .axil-slide.slide-style-default .topskew-thumbnail-group .thumbnail::before { display: none; } } .axil-slide.slide-style-default .topskew-thumbnail-group .image-group { right: -72px; } @media only screen and (max-width: 767px) { .axil-slide.slide-style-default .topskew-thumbnail-group .image-group { right: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-default .topskew-thumbnail-group .image-group { right: 0; } } .axil-slide.slide-style-default .topskew-thumbnail-group .shape-group .shape.shape-1 { right: 48%; bottom: -70px; -webkit-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); } @media only screen and (max-width: 767px) { .axil-slide.slide-style-default .topskew-thumbnail-group .shape-group .shape.shape-1 { display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-default .topskew-thumbnail-group .shape-group .shape.shape-1 { display: none; } } .axil-slide.slide-style-default .topskew-thumbnail-group .shape-group .shape.shape-2 { z-index: 1; bottom: 136px; right: 87%; } @media only screen and (max-width: 767px) { .axil-slide.slide-style-default .topskew-thumbnail-group .shape-group .shape.shape-2 { display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-default .topskew-thumbnail-group .shape-group .shape.shape-2 { display: none; } } .axil-slide.slide-style-default .topskew-thumbnail-group .shape-group .shape.shape-3 { bottom: 38px; right: 95%; } @media only screen and (max-width: 767px) { .axil-slide.slide-style-default .topskew-thumbnail-group .shape-group .shape.shape-3 { display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-default .topskew-thumbnail-group .shape-group .shape.shape-3 { display: none; } } .axil-slide.slide-style-2.bg-image--3 { background-image: url(../images/bg/bg-image-3.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .axil-slide.slide-style-2.theme-gradient-6 { position: relative; } .axil-slide.slide-style-2.theme-gradient-6::after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: -webkit-gradient(linear, left top, left bottom, from(#A7FFF5), to(rgba(255, 255, 255, 0))); background: -webkit-linear-gradient(top, #A7FFF5 0%, rgba(255, 255, 255, 0) 100%); background: -o-linear-gradient(top, #A7FFF5 0%, rgba(255, 255, 255, 0) 100%); background: linear-gradient(180deg, #A7FFF5 0%, rgba(255, 255, 255, 0) 100%); content: ""; } .axil-slide.slide-style-3 { position: relative; z-index: 1; } .axil-slide.slide-style-3.slider-fixed-height { height: 1060px; width: 100%; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-slide.slide-style-3.slider-fixed-height { height: 768px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-3.slider-fixed-height { height: auto; padding-top: 150px; padding-bottom: 40px; } } @media only screen and (max-width: 767px) { .axil-slide.slide-style-3.slider-fixed-height { height: auto; padding-top: 150px; padding-bottom: 40px; } } .axil-slide.slide-style-3::before { background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(#FFFFFF)); background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%); background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%); background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%); position: absolute; bottom: 0; height: 718px; width: 100%; z-index: -1; content: ""; } .axil-slide.slide-style-3 .content { position: relative; z-index: 3; } .axil-slide.slide-style-3 .content span.title { color: #0ac775; font-size: 24px; font-weight: 700; letter-spacing: 10px; line-height: 38px; display: block; margin-bottom: 20px; } @media only screen and (max-width: 767px) { .axil-slide.slide-style-3 .content span.title { font-size: 16px; line-height: 30px; margin-bottom: 8px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-3 .content span.title { font-size: 18px; line-height: 33px; margin-bottom: 4px; } } .axil-slide.slide-style-3 .content h1 { margin-bottom: 40px; } @media only screen and (max-width: 767px) { .axil-slide.slide-style-3 .content h1 { margin-bottom: 20px; } } @media only screen and (max-width: 575px) { .axil-slide.slide-style-3 .content h1 { font-size: 30px !important; line-height: 43px !important; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-3 .content h1 { margin-bottom: 20px; } } .axil-slide.slide-style-3 .content .button-group { margin: 0 -20px; } .axil-slide.slide-style-3 .content .button-group a.axil-button { margin: 0 20px; } @media only screen and (max-width: 575px) { .axil-slide.slide-style-3 .content .button-group a.axil-link-button { margin-top: 15px; } } .axil-slide.slide-style-3 .design-text { position: absolute; bottom: 5%; right: -1%; z-index: -1; opacity: 1; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-3 .design-text { display: none; } } @media only screen and (max-width: 767px) { .axil-slide.slide-style-3 .design-text { display: none; } } .axil-slide.slide-style-4 .content h1.axil-display-1 { margin-bottom: 20px; } @media only screen and (max-width: 575px) { .axil-slide.slide-style-4 .content h1.axil-display-1 { font-size: 30px !important; line-height: 43px !important; } } .axil-slide.slide-style-4 .content p { color: #52526C; font-size: 24px; line-height: 38px; margin-bottom: 40px; padding-right: 20%; } @media only screen and (max-width: 767px) { .axil-slide.slide-style-4 .content p { font-size: 18px; line-height: 30px; margin-bottom: 20px; padding-right: 0; } } .axil-slide.slide-style-4 .thumbnail { -webkit-box-align: end; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; height: 100%; } .axil-slide.slide-style-4 .thumbnail .image { position: relative; z-index: 2; height: 100%; } .axil-slide.slide-style-4 .thumbnail .image::after { position: absolute; width: 114px; background: #FFFFFF; bottom: 0; right: 0; z-index: -1; content: ""; height: 424px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-slide.slide-style-4 .thumbnail .image::after { height: 335px; } } @media only screen and (max-width: 575px) { .axil-slide.slide-style-4 .thumbnail .image::after { display: none; } } .axil-slide.slide-style-4 .thumbnail .image.image-one::after { right: 106px; } .axil-slide.slide-style-4 .thumbnail .image.image-two::after { right: 0; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-slide.slide-style-4 .thumbnail .image img { width: 100%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-4 .thumbnail .image img { width: 100%; } } @media only screen and (max-width: 767px) { .axil-slide.slide-style-4 .thumbnail .image img { width: 100%; } } .axil-slide.slide-style-4 .follow-us { margin-top: 170px; position: relative; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-slide.slide-style-4 .follow-us { margin-top: 140px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-4 .follow-us { margin-top: 50px; } } @media only screen and (max-width: 767px) { .axil-slide.slide-style-4 .follow-us { margin-top: 50px; } } .axil-slide.slide-style-4 .follow-us::before { position: absolute; left: 0; height: 1px; width: 73%; background-color: #C7C7D6; content: ""; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-slide.slide-style-4 .follow-us::before { width: 63%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-4 .follow-us::before { width: 50%; } } @media only screen and (max-width: 767px) { .axil-slide.slide-style-4 .follow-us::before { display: none; } } @media only screen and (max-width: 767px) { .axil-slide.slide-style-4 .follow-us ul.social-share { -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; } } .axil-slide.slide-style-5 { padding-top: 300px; padding-bottom: 220px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-slide.slide-style-5 { padding-top: 300px; padding-bottom: 240px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-5 { padding-top: 200px; padding-bottom: 150px; } } @media only screen and (max-width: 767px) { .axil-slide.slide-style-5 { padding-top: 150px; padding-bottom: 100px; } } .axil-slide.slide-style-5 .contact-form-wrapper { position: absolute; right: 20%; bottom: -16%; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-slide.slide-style-5 .contact-form-wrapper { right: 5%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-5 .contact-form-wrapper { right: 0; } } @media only screen and (max-width: 767px) { .axil-slide.slide-style-5 .contact-form-wrapper { display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-5 .contact-form-wrapper { display: none; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-slide.slide-style-5 .contact-form-wrapper .axil-contact-form.contact-form-style-1 { padding: 40px 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-slide.slide-style-5 .contact-form-wrapper .axil-contact-form.contact-form-style-1 { max-width: 490px; padding: 40px 30px; } } .axil-slide.banner-technology { position: relative; z-index: 2; padding-bottom: 360px; padding-top: 250px; } @media only screen and (max-width: 767px) { .axil-slide.banner-technology { padding-bottom: 200px; padding-top: 150px; } } .axil-slide.banner-technology.bg_image--1 { background-image: url(../images/bg/bg-image-3.jpg); } .axil-slide.banner-technology.theme-gradient::after { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: -webkit-gradient(linear, left top, left bottom, from(#A7FFF5), to(rgba(255, 255, 255, 0))); background: -webkit-linear-gradient(top, #A7FFF5 0%, rgba(255, 255, 255, 0) 100%); background: -o-linear-gradient(top, #A7FFF5 0%, rgba(255, 255, 255, 0) 100%); background: linear-gradient(180deg, #A7FFF5 0%, rgba(255, 255, 255, 0) 100%); content: ""; z-index: -1; } .axil-slide.banner-technology .content { position: relative; z-index: 2; } .portfolio-slider { position: relative; } .portfolio-slider .thumbnail { position: absolute; right: 0; bottom: 0; z-index: 3; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .portfolio-slider .thumbnail { width: 72%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .portfolio-slider .thumbnail { position: static; } } @media only screen and (max-width: 767px) { .portfolio-slider .thumbnail { position: static; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .portfolio-slider .thumbnail img { width: 100%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .portfolio-slider .thumbnail img { width: 100%; } } @media only screen and (max-width: 767px) { .portfolio-slider .thumbnail img { width: 100%; } } .marque-images { background-image: url(../images/slider/designer-text.png); background-repeat: repeat-x; background-size: auto; height: 468px; position: absolute; width: 100%; bottom: -47%; right: 0; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .slide-style-5 .contact-form-wrapper .axil-contact-form::after { -webkit-transform: rotateY(0deg); transform: rotateY(0deg); } } @media only screen and (min-width: 768px) and (max-width: 991px) { .slide-style-5 .contact-form-wrapper .axil-contact-form::after { -webkit-transform: rotateY(0deg); transform: rotateY(0deg); } } /*------------------------- Slider Style Three --------------------------*/ .scroll-down_btn { position: absolute; left: 0; top: 124%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .scroll-down_btn { top: 111%; } } @media only screen and (max-width: 767px) { .scroll-down_btn { top: 111%; } } .scroll-down_btn .axil-scrollbown { display: inline-block; -webkit-box-sizing: border-box; box-sizing: border-box; height: 60px; width: 39px; border: 3px solid #00004B; border-radius: 19.5px; position: relative; } .scroll-down_btn .axil-scrollbown span { height: 15px; width: 8px; border-radius: 4px; background-color: #75758B; display: block; position: absolute; left: 50%; margin-top: 17px; -webkit-animation-name: scrollDown; animation-name: scrollDown; -webkit-animation-duration: 2.2s; animation-duration: 2.2s; -webkit-animation-timing-function: cubic-bezier(0.15, 0.41, 0.69, 0.94); animation-timing-function: cubic-bezier(0.15, 0.41, 0.69, 0.94); -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; margin-left: -4px; } /*===================== Breadcrumb Styles ======================*/ .axil-breadcrumb-area { /*-------------------- Breadcrumb Style Two ------------------------*/ } .axil-breadcrumb-area.breadcrumb-style-default { z-index: 2; overflow: hidden; position: relative; } .axil-breadcrumb-area.breadcrumb-style-default h2.axil-page-title { margin-top: 20px; font-size: 50px; line-height: 62px; } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-default h2.axil-page-title { margin-top: 10px; font-size: 30px; line-height: 41px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-breadcrumb-area.breadcrumb-style-default h2.axil-page-title { margin-top: 8px; margin-bottom: 0; } } .axil-breadcrumb-area.breadcrumb-style-default .axil-page-title { margin-top: 20px; font-size: 50px; line-height: 62px; } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-default .axil-page-title { margin-top: 10px; font-size: 30px; line-height: 41px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-breadcrumb-area.breadcrumb-style-default .axil-page-title { margin-top: 8px; margin-bottom: 0; } } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-default .shape-images { display: none; } } .axil-breadcrumb-area.breadcrumb-style-default .shape-images .shape { position: absolute; } .axil-breadcrumb-area.breadcrumb-style-default .shape-images .shape.shape-1 { right: 17%; bottom: 14%; -webkit-animation: customOne 2s infinite; animation: customOne 2s infinite; } .axil-breadcrumb-area.breadcrumb-style-default .shape-images .shape.shape-2 { right: 15%; bottom: -6px; z-index: -1; -webkit-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); } .axil-breadcrumb-area.breadcrumb-style-default .shape-images .shape.shape-3 { left: 0; top: 0; } .axil-breadcrumb-area.breadcrumb-style-2 ul.ax-breadcrumb { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin: 0 -13px; margin-bottom: 20px; } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-2 ul.ax-breadcrumb { margin-bottom: 12px; } } .axil-breadcrumb-area.breadcrumb-style-2 ul.ax-breadcrumb li { font-size: 15px; line-height: 24px; color: #757589; padding: 0 13px; position: relative; font-weight: 400; } .axil-breadcrumb-area.breadcrumb-style-2 ul.ax-breadcrumb li a { color: #757589; text-decoration: none; } .axil-breadcrumb-area.breadcrumb-style-2 ul.ax-breadcrumb li a:hover { color: #0ac775; } .axil-breadcrumb-area.breadcrumb-style-2 ul.ax-breadcrumb li.active { color: #0ac775; } .axil-breadcrumb-area.breadcrumb-style-2 ul.ax-breadcrumb li::after { position: absolute; right: 0; content: ""; width: 4px; height: 4px; background: #757589; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); border-radius: 100%; } .axil-breadcrumb-area.breadcrumb-style-2 ul.ax-breadcrumb li:last-child::after { display: none; } .axil-breadcrumb-area.breadcrumb-style-2 h2.title { font-size: 56px; font-weight: 700; line-height: 68px; margin-bottom: 20px; } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-2 h2.title { font-weight: 700; margin-bottom: 10px; font-size: 32px; line-height: 42px; } } @media only screen and (max-width: 575px) { .axil-breadcrumb-area.breadcrumb-style-2 h2.title { font-size: 31px; line-height: 43px; } } .axil-breadcrumb-area.breadcrumb-style-2 .title { font-size: 56px; font-weight: 700; line-height: 68px; margin-bottom: 20px; } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-2 .title { font-weight: 700; font-size: 32px !important; line-height: 42px !important; margin-bottom: 10px; } } @media only screen and (max-width: 575px) { .axil-breadcrumb-area.breadcrumb-style-2 .title { font-size: 31px; line-height: 43px; } } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-2 .page-title { font-size: 32px !important; line-height: 42px !important; } } .axil-breadcrumb-area.breadcrumb-style-2 p { color: #737387; font-size: 20px; line-height: 32px; padding-right: 12%; } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-2 p { font-size: 18px; line-height: 28px; padding-right: 0; } } .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail { position: relative; } .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .image-group { position: relative; padding-right: 118px; z-index: 3; -webkit-transform: perspective(500px) rotateY(-5deg); transform: perspective(500px) rotateY(-5deg); display: inline-block; -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .image-group { -webkit-transform: perspective(0) rotateY(0); transform: perspective(0) rotateY(0); padding-right: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .image-group { -webkit-transform: perspective(0) rotateY(0); transform: perspective(0) rotateY(0); } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .image-group { padding-right: 0; } } @media only screen and (max-width: 575px) { .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .image-group { padding-right: 0; } } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .image-group img { width: 100%; } } .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .image-group img.image-2 { position: absolute; right: 0; bottom: 85px; } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .image-group img.image-2 { left: 0; right: auto; width: 100%; } } .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .image-group::before { position: absolute; width: calc(100% - 116px); height: calc(100% + -19px); top: calc(25px + 10px); content: ""; border: 4px solid #000345; z-index: -1; right: calc(25px - -119px); -webkit-box-shadow: 0 0 1px transparent; box-shadow: 0 0 1px transparent; } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .image-group::before { display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .image-group::before { display: none; } } .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .shape-group .shape { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); left: 0; } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .shape-group .shape { display: none; } } .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .shape-group .shape.shape-1 { left: -17%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .shape-group .shape.shape-1 { right: 19%; left: auto; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); z-index: 1; } } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .shape-group .shape.shape-1 { display: none; } } .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .shape-group .shape.shape-2 { left: 7%; top: 52%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .shape-group .shape.shape-2 { right: 21%; left: auto; top: 71%; } } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .shape-group .shape.shape-2 { display: none; } } .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .shape-group .shape.shape-3 { left: 10%; top: 41%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .shape-group .shape.shape-3 { right: 30%; left: auto; z-index: 1; } } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .shape-group .shape.shape-3 { display: none; } } @media only screen and (max-width: 575px) { .axil-breadcrumb-area.breadcrumb-style-2.team-group-thumb .thumbnail .image-group img.image-1 { width: 100%; } } .axil-breadcrumb-area.breadcrumb-style-2.team-group-thumb .thumbnail .shape-group .shape { position: absolute; left: 0; top: auto; z-index: 3; bottom: 8%; -webkit-transform: inherit; -ms-transform: inherit; transform: inherit; } .axil-breadcrumb-area.breadcrumb-style-2.team-group-thumb .thumbnail .shape-group .shape.shape-1 { left: -1%; } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-2.team-group-thumb .thumbnail .shape-group .shape.shape-1 { display: block; } } .axil-breadcrumb-area.breadcrumb-style-2.team-group-thumb .thumbnail .shape-group .shape.shape-2 { left: 25%; top: 24%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-breadcrumb-area.breadcrumb-style-2.team-group-thumb .thumbnail .shape-group .shape.shape-2 { left: 18%; } } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-2.team-group-thumb .thumbnail .shape-group .shape.shape-2 { left: 29%; top: 24%; display: block; } } @media only screen and (max-width: 479px) { .axil-breadcrumb-area.breadcrumb-style-2.team-group-thumb .thumbnail .shape-group .shape.shape-2 { left: 45%; top: 3%; } } @media only screen and (max-width: 575px) { .axil-breadcrumb-area.breadcrumb-style-2.team-group-thumb .thumbnail .shape-group .shape.shape-2 { left: 43%; top: 22%; } } .axil-breadcrumb-area.breadcrumb-style-2.team-group-thumb .thumbnail .shape-group .shape.shape-3 { left: 54%; top: 13%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-breadcrumb-area.breadcrumb-style-2.team-group-thumb .thumbnail .shape-group .shape.shape-3 { left: 39%; } } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-2.team-group-thumb .thumbnail .shape-group .shape.shape-3 { display: block; } } @media only screen and (max-width: 575px) { .axil-breadcrumb-area.breadcrumb-style-2.team-group-thumb .thumbnail .shape-group .shape.shape-3 { display: none; } } .axil-breadcrumb-area.breadcrumb-style-2.team-group-thumb .thumbnail .shape-group .shape.shape-4 { left: 87%; top: 12%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-breadcrumb-area.breadcrumb-style-2.team-group-thumb .thumbnail .shape-group .shape.shape-4 { left: 63%; } } @media only screen and (max-width: 767px) { .axil-breadcrumb-area.breadcrumb-style-2.team-group-thumb .thumbnail .shape-group .shape.shape-4 { display: none; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-breadcrumb-area.breadcrumb-style-2.team-group-thumb .thumbnail .shape-group .shape.shape-4 { display: none; } } /*--------------------------- Axil Default Breadcrump -----------------------------*/ ul.axil-breadcrumb { margin: -10px; } ul.axil-breadcrumb li.axil-breadcrumb-item { font-size: 15px; line-height: 24px; padding: 10px; position: relative; } ul.axil-breadcrumb li.axil-breadcrumb-item a { text-decoration: none; } ul.axil-breadcrumb li.axil-breadcrumb-item.active { color: #0ac775; } ul.axil-breadcrumb li.axil-breadcrumb-item + .axil-breadcrumb-item::before { position: absolute; background: #757589; width: 4px; height: 4px; border-radius: 100%; left: -4px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); content: ""; } /*----------------------------- Breadcrumb Style Two -------------------------------*/ .breadcrumb-thumbnail-group { position: relative; } @media only screen and (min-width: 768px) and (max-width: 991px) { .breadcrumb-thumbnail-group { display: inline-block; } } @media only screen and (max-width: 767px) { .breadcrumb-thumbnail-group { display: inline-block; } } .breadcrumb-thumbnail-group .thumbnail { position: relative; z-index: 3; -webkit-transform: perspective(500px) rotateY(-5deg); transform: perspective(500px) rotateY(-5deg); display: inline-block; } @media only screen and (min-width: 768px) and (max-width: 991px) { .breadcrumb-thumbnail-group .thumbnail { -webkit-transform: perspective(0) rotateY(0); transform: perspective(0) rotateY(0); } } @media only screen and (max-width: 767px) { .breadcrumb-thumbnail-group .thumbnail { -webkit-transform: perspective(0) rotateY(0); transform: perspective(0) rotateY(0); } } .breadcrumb-thumbnail-group .thumbnail::before { position: absolute; width: calc(100% - 14px); height: calc(100% - 26px); top: calc(25px + 10px); content: ""; border: 4px solid #000345; z-index: -1; right: calc(25px + 12px); -webkit-transform: perspective(700px) rotateY(-4deg); transform: perspective(700px) rotateY(-4deg); -webkit-box-shadow: 0 0 1px transparent; box-shadow: 0 0 1px transparent; } @media only screen and (min-width: 768px) and (max-width: 991px) { .breadcrumb-thumbnail-group .thumbnail::before { display: none; } } @media only screen and (max-width: 767px) { .breadcrumb-thumbnail-group .thumbnail::before { display: none; } } @media only screen and (max-width: 575px) { .breadcrumb-thumbnail-group .thumbnail img { width: 100%; } } .breadcrumb-thumbnail-group .image-group { position: absolute; right: 0; bottom: 45px; z-index: 3; } @media only screen and (max-width: 767px) { .breadcrumb-thumbnail-group .shape-group { display: none; } } .breadcrumb-thumbnail-group .shape-group .shape { position: absolute; right: 50%; bottom: 0; } .breadcrumb-thumbnail-group .shape-group .shape.shape-1 { right: 26%; bottom: 20px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .breadcrumb-thumbnail-group .shape-group .shape.shape-1 { right: -37%; bottom: 47px; } } .breadcrumb-thumbnail-group .shape-group .shape.shape-2 { z-index: 1; bottom: 174px; right: 51%; } .breadcrumb-thumbnail-group .shape-group .shape.shape-3 { bottom: 130px; right: 58%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .breadcrumb-thumbnail-group .shape-group .shape.shape-3 { bottom: 147px; right: -38%; -webkit-transform: rotate(178deg); -ms-transform: rotate(178deg); transform: rotate(178deg); } } .breadcrumb-thumbnail-group.with-image-group { padding-right: 110px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .breadcrumb-thumbnail-group.with-image-group { padding-right: 0; } } @media only screen and (max-width: 767px) { .breadcrumb-thumbnail-group.with-image-group { padding-right: 0; } } .breadcrumb-thumbnail-group.with-image-group .shape-group .shape { position: absolute; right: 50%; bottom: 0; } .breadcrumb-thumbnail-group.with-image-group .shape-group .shape.shape-1 { right: 29%; bottom: 20px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .breadcrumb-thumbnail-group.with-image-group .shape-group .shape.shape-1 { right: -45%; } } @media only screen and (max-width: 767px) { .breadcrumb-thumbnail-group.with-image-group .shape-group .shape.shape-1 { display: none; } } .breadcrumb-thumbnail-group.with-image-group .shape-group .shape.shape-2 { z-index: 1; bottom: 174px; right: 56%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .breadcrumb-thumbnail-group.with-image-group .shape-group .shape.shape-2 { bottom: 54%; right: -27%; } } @media only screen and (max-width: 767px) { .breadcrumb-thumbnail-group.with-image-group .shape-group .shape.shape-2 { display: none; } } .breadcrumb-thumbnail-group.with-image-group .shape-group .shape.shape-3 { bottom: 73px; right: 62%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .breadcrumb-thumbnail-group.with-image-group .shape-group .shape.shape-3 { bottom: 23%; right: -50%; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); z-index: 2; } } @media only screen and (max-width: 767px) { .breadcrumb-thumbnail-group.with-image-group .shape-group .shape.shape-3 { display: none; } } .topskew-thumbnail-group { position: relative; } .topskew-thumbnail-group .thumbnail { position: relative; z-index: 3; -webkit-transform: perspective(500px) rotateY(-5deg); transform: perspective(500px) rotateY(-5deg); display: inline-block; } .topskew-thumbnail-group .thumbnail::before { position: absolute; width: calc(100% - 14px); height: calc(100% - 26px); top: calc(25px + 10px); content: ""; border: 4px solid #000345; z-index: -1; right: calc(25px + 12px); -webkit-transform: perspective(700px) rotateY(-4deg); transform: perspective(700px) rotateY(-4deg); } .topskew-thumbnail-group .image-group { position: absolute; right: 0; bottom: 45px; z-index: 3; } .topskew-thumbnail-group .shape-group .shape { position: absolute; right: 50%; bottom: 0; } .topskew-thumbnail-group .shape-group .shape.shape-1 { right: 29%; bottom: 20px; } .topskew-thumbnail-group .shape-group .shape.shape-2 { z-index: 1; bottom: 174px; right: 56%; } .topskew-thumbnail-group .shape-group .shape.shape-3 { bottom: 73px; right: 62%; } .topskew-thumbnail-group.with-image-group { padding-right: 110px; } /*----------------------------- Featured Styles -------------------------------*/ .axil-featured .thumbnail { margin-right: -30px; position: relative; z-index: 1; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-featured .thumbnail { margin-right: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-featured .thumbnail { margin-right: 0; } } @media only screen and (max-width: 767px) { .axil-featured .thumbnail { margin-right: 0; } } .axil-featured .thumbnail img { width: 100%; } .axil-featured .thumbnail a { display: block; } .axil-featured .inner { padding-left: 30px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-featured .inner { padding-left: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-featured .inner { padding-left: 0; } } @media only screen and (max-width: 767px) { .axil-featured .inner { padding-left: 0; } } .axil-featured .inner a { text-decoration: none; } .axil-featured .inner .section-title p.subtitle-2 { padding: 0; margin-bottom: 40px; } @media only screen and (max-width: 767px) { .axil-featured .inner .section-title p.subtitle-2 { margin-bottom: 20px; } } .axil-featured .inner .section-title a.axil-button { margin-bottom: 15px; } .axil-featured .inner .axil-counterup-area { margin: 0 -30px; margin-bottom: 30px; } @media only screen and (max-width: 767px) { .axil-featured .inner .axil-counterup-area { margin: 0 -15px; margin-bottom: 30px; } } .axil-featured .inner .axil-counterup-area .single-counterup { padding: 0 30px; } @media only screen and (max-width: 767px) { .axil-featured .inner .axil-counterup-area .single-counterup { padding: 0 15px; margin-bottom: 14px; } } .axil-featured .inner .axil-counterup-area.separator-line-vertical { position: relative; } .axil-featured .inner .axil-counterup-area.separator-line-vertical .single-counterup { position: relative; } .axil-featured .inner .axil-counterup-area.separator-line-vertical .single-counterup + .single-counterup::after { position: absolute; height: 80px; width: 1px; background-color: #C7C7D5; top: 50%; left: -1px; content: ""; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } @media only screen and (max-width: 767px) { .axil-featured .inner .axil-counterup-area.separator-line-vertical .single-counterup + .single-counterup::after { display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-featured .inner .axil-counterup-area.separator-line-vertical .single-counterup + .single-counterup::after { display: none; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-featured .inner .axil-counterup-area.separator-line-vertical .single-counterup + .single-counterup::after { display: none; } } .axil-featured .thumb-inner { position: relative; z-index: 2; } .axil-featured .thumb-inner .shape-group { position: absolute; bottom: -11%; left: -17%; z-index: 0; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-featured .thumb-inner .shape-group { display: none; } } @media only screen and (max-width: 767px) { .axil-featured .thumb-inner .shape-group { display: none; } } .axil-featured.axil-featured-left .inner { padding-left: 0; padding-right: 30px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-featured.axil-featured-left .inner { padding-right: 0; } } @media only screen and (max-width: 767px) { .axil-featured.axil-featured-left .inner { padding-right: 0; } } /*---------------------------- Counterup Styles ----------------------------*/ .single-counterup.counterup-style-1 { margin-top: 30px; } @media only screen and (max-width: 767px) { .single-counterup.counterup-style-1 { margin-top: 20px; } } .single-counterup.counterup-style-1 h3.count { display: inline-block; position: relative; font-size: 35px; line-height: 46px; margin-bottom: 0; color: #0ac775; } .single-counterup.counterup-style-1 h3.count::after { content: "%"; right: 0; } .single-counterup.counterup-style-1 h3.count.counter-k::after { content: "K"; } .animated-style-1 .slick-active .inner span { -webkit-animation: 1000ms ease-in-out 0s normal none 1 running fadeInRight; animation: 1000ms ease-in-out 0s normal none 1 running fadeInRight; } .animated-style-1 .slick-active .inner h2 { -webkit-animation: 1200ms ease-in-out 0s normal none 1 running fadeInRight; animation: 1200ms ease-in-out 0s normal none 1 running fadeInRight; } .animated-style-1 .slick-active .inner p { -webkit-animation: 1500ms ease-in-out 0s normal none 1 running fadeInRight; animation: 1500ms ease-in-out 0s normal none 1 running fadeInRight; } .animated-style-1 .slick-active .inner a.axil-button { -webkit-animation: 1700ms ease-in-out 0s normal none 1 running fadeInRight; animation: 1700ms ease-in-out 0s normal none 1 running fadeInRight; } .animated-style-1 .slick-active .inner .single-counterup { -webkit-animation: 1800ms ease-in-out 0s normal none 1 running fadeInRight; animation: 1800ms ease-in-out 0s normal none 1 running fadeInRight; } /*---------------------- About Styles ------------------------*/ .axil-about-inner .section-title p.subtitle-2 { padding: 0 14% 0 0; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-about-inner .section-title p.subtitle-2 { padding: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-about-inner .section-title p.subtitle-2 { padding: 0; } } @media only screen and (max-width: 767px) { .axil-about-inner .section-title p.subtitle-2 { padding: 0; } } .axil-shape-position { position: relative; } .axil-shape-position .axil-shape-group .shape { position: absolute; bottom: 0; right: 0; } .axil-shape-position .axil-shape-group .shape.shape-1 { right: 14%; bottom: 11%; } @media only screen and (max-width: 767px) { .axil-shape-position .axil-shape-group .shape.shape-1 { display: none; } } .axil-shape-position .axil-shape-group .shape.shape-2 { right: 12%; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); bottom: 20%; } @media only screen and (max-width: 767px) { .axil-shape-position .axil-shape-group .shape.shape-2 { display: none; } } /*------------------------- Axil Contact Styles --------------------------*/ .axil-address-list .axil-address { padding: 0; z-index: 2; max-width: inherit; } .axil-address-list .axil-address::before, .axil-address-list .axil-address::after { display: none; } .axil-address-list .axil-address h6.title { font-size: 22px; font-weight: 700; line-height: 26px; margin-bottom: 9px; } .axil-address-list .axil-address p { color: #757589; font-size: 18px; line-height: 28px; } .axil-address-list .axil-address p a { color: #757589; font-weight: 400; } .axil-address-list .axil-address p:hover a { color: #0ac775; } .axil-address-list .axil-address + .axil-address { margin-top: 30px; } /* --------------------------- Single Product Styles -------------------------------*/ .axil-working-process { 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; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-working-process { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } } @media only screen and (max-width: 767px) { .axil-working-process { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-working-process .thumbnail { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; } } @media only screen and (max-width: 767px) { .axil-working-process .thumbnail { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; } } .axil-working-process .thumbnail .image img { -webkit-transform: perspective(500px) rotateY(-5deg); transform: perspective(500px) rotateY(-5deg); } @media only screen and (max-width: 767px) { .axil-working-process .thumbnail .image img { width: 100%; -webkit-transform: inherit; -ms-transform: inherit; transform: inherit; } } .axil-working-process .content { padding-left: 110px; position: relative; margin-right: 200px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-working-process .content { padding-left: 40px; margin-right: 40px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-working-process .content { padding-left: 40px; margin-right: 40px; margin-top: 40px; -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; } } @media only screen and (max-width: 767px) { .axil-working-process .content { padding-left: 0px; margin-right: 40px; -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; margin-top: 30px; } } @media only screen and (max-width: 575px) { .axil-working-process .content { margin-right: 0; margin-top: 30px; } } .axil-working-process .content .inner .section-title span.process-step-number { -webkit-box-sizing: border-box; box-sizing: border-box; height: 149px; width: 149px; border: 1px solid #979797; opacity: 0.2; line-height: 149px; display: inline-block; opacity: 0.2; color: #737387; font-size: 60px; position: absolute; right: 0; top: -58px; border-radius: 100%; text-align: center; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-working-process .content .inner .section-title span.process-step-number { height: 100px; width: 100px; line-height: 100px; font-size: 49px; } } @media only screen and (max-width: 767px) { .axil-working-process .content .inner .section-title span.process-step-number { height: 100px; width: 100px; line-height: 100px; font-size: 49px; top: -16px; } } @media only screen and (max-width: 575px) { .axil-working-process .content .inner .section-title span.process-step-number { top: -6px; height: 70px; width: 70px; line-height: 70px; font-size: 36px; } } .axil-working-process.text-left .content { margin-right: 110px; padding-left: 200px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-working-process.text-left .content { padding-left: 40px; margin-right: 40px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-working-process.text-left .content { padding-left: 40px; margin-right: 40px; } } @media only screen and (max-width: 767px) { .axil-working-process.text-left .content { padding-left: 0px; margin-right: 40px; margin-top: 30px; } } @media only screen and (max-width: 575px) { .axil-working-process.text-left .content { padding-left: 0; margin-right: 0; margin-top: 30px; } } /*============================= Team Details Styles ===============================*/ .team-details-inner .inner h1.title { margin-bottom: 20px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .team-details-inner .inner h1.title { font-size: 46px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .team-details-inner .inner h1.title { font-size: 42px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .team-details-inner .inner h1.title { font-size: 40px; } } @media only screen and (max-width: 767px) { .team-details-inner .inner h1.title { margin-bottom: 5px; font-size: 32px; } } .team-details-inner .inner span.subtitle { display: block; color: #0ac775; border-bottom: 3px solid currentColor; font-weight: 700; font-size: 22px; line-height: 26px; padding-bottom: 20px; margin-bottom: 20px; } @media only screen and (max-width: 767px) { .team-details-inner .inner span.subtitle { padding-bottom: 7px; margin-bottom: 17px; } } .team-details-inner .inner ul.social-share li a { color: #999AB8; } .team-details-inner .inner p { margin-top: 40px; } @media only screen and (max-width: 767px) { .team-details-inner .inner p { margin-top: 20px; } } .axil-team-details-wrapper { padding-top: 250px; padding-bottom: 190px; } @media only screen and (max-width: 767px) { .axil-team-details-wrapper { padding-top: 100px; padding-bottom: 60px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-team-details-wrapper { padding-top: 100px; padding-bottom: 60px; } } .axil-team-details-wrapper .thumbnail { position: relative; z-index: 2; margin-left: -60px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-team-details-wrapper .thumbnail { margin-left: 0; padding-left: 20px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-team-details-wrapper .thumbnail { margin-left: 0; } } @media only screen and (max-width: 767px) { .axil-team-details-wrapper .thumbnail { margin-left: 0; } } .axil-team-details-wrapper .thumbnail::before { -webkit-transform: perspective(500px) rotateY(-5deg); transform: perspective(500px) rotateY(0deg); position: absolute; width: calc(100% + -3px); height: calc(100% + 4px); top: calc(25px + -9px); content: ""; border: 2px solid #000345; z-index: -1; right: calc(25px - -4px); } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-team-details-wrapper .thumbnail::before { right: calc(25px - 18px); } } @media only screen and (max-width: 767px) { .axil-team-details-wrapper .thumbnail::before { display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-team-details-wrapper .thumbnail::before { display: none; } } /*--------------------- Comming Soon Area ------------------------*/ .axil-comming-soon { position: relative; z-index: 2; height: 950px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-comming-soon { height: auto; padding: 100px 0; padding-top: 0; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-comming-soon { height: auto; padding: 100px 0; padding-top: 0; } } @media only screen and (max-width: 767px) { .axil-comming-soon { height: auto; padding: 100px 0; padding-top: 0; } } .axil-comming-soon .content .inner { padding-top: 110px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-comming-soon .content .inner { padding-top: 50px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-comming-soon .content .inner { padding-top: 50px; } } @media only screen and (max-width: 767px) { .axil-comming-soon .content .inner { padding-top: 50px; } } .axil-comming-soon .shape-wrapper .shape { position: absolute; } .axil-comming-soon .shape-wrapper .shape.shape-01 { left: 32%; bottom: 26%; z-index: -1; } .axil-comming-soon .shape-wrapper .shape.shape-02 { right: 42%; bottom: 26%; z-index: -1; } .axil-comming-soon .shape-wrapper .shape.shape-03 { top: 0; left: 0; z-index: -1; } .axil-comming-soon .shape-wrapper .shape.shape-03 img { width: 100%; } .axil-comming-soon .shape-wrapper .shape.shape-04 { bottom: 31.5%; right: 17%; z-index: -1; } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-comming-soon .shape-wrapper .shape.shape-04 { bottom: 31.5%; right: 6%; } } .axil-comming-soon .shape-wrapper .shape.shape-05 { bottom: 31.5%; right: 0%; z-index: -1; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-comming-soon .shape-wrapper .shape.shape-05 { bottom: 9.5%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-comming-soon .shape-wrapper .shape.shape-05 { display: none; } } @media only screen and (max-width: 767px) { .axil-comming-soon .shape-wrapper .shape.shape-05 { display: none; } } /*-------------------------- Single Case Study ----------------------------*/ .project-bief-styles { position: relative; z-index: 2; } .project-bief-styles .thumbnail { margin-right: 65px; } @media only screen and (max-width: 767px) { .project-bief-styles .thumbnail { margin-top: 30px; margin-right: 0; } } .project-bief-styles .shape-group { position: absolute; z-index: -1; } @media only screen and (max-width: 767px) { .project-bief-styles .shape-group { display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .project-bief-styles .shape-group { display: none; } } .project-bief-styles .shape-group.shape-01 { right: -33%; bottom: 11%; } .project-bief-styles .shape-group.shape-01 img { width: 257px; height: 179px; } .project-bief-styles .shape-group.shape-02 { right: -10%; bottom: -16%; z-index: -2; } .project-bief-styles.order-style-2 .thumbnail { margin-left: 0; margin-right: 65px; } @media only screen and (max-width: 767px) { .project-bief-styles.order-style-2 .thumbnail { margin-top: 30px; margin-right: 0; } } .project-bief-styles.order-style-2 .shape-group.shape-01 { left: -32%; right: auto; bottom: 11%; -webkit-transform: rotate(197deg); -ms-transform: rotate(197deg); transform: rotate(197deg); } .project-bief-styles.order-style-2 .shape-group.shape-02 { left: -9%; right: auto; bottom: 0%; -webkit-transform: rotate(-97deg); -ms-transform: rotate(-97deg); transform: rotate(-97deg); } .axil-project-solutions-area.shape-group-position { position: relative; } .axil-project-solutions-area.shape-group-position .shape-group { position: absolute; top: 50%; left: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } @media only screen and (max-width: 767px) { .axil-project-solutions-area.shape-group-position .shape-group { display: none; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-project-solutions-area.shape-group-position .shape-group { left: -41px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-project-solutions-area.shape-group-position .shape-group { display: none; } } /*------------------------- Axil Website Images ---------------------------*/ @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-website .thumbnail img { width: 100%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-website .thumbnail img { width: 100%; } } @media only screen and (max-width: 767px) { .axil-website .thumbnail img { width: 100%; } } /*-------------------------- Blog Sidebar Styles ----------------------------*/ .axil-single-widget .title { font-size: 22px; line-height: 26px; font-weight: 700; } .axil-single-widget.search .blog-search { position: relative; } .axil-single-widget.search .blog-search input { height: 46px; border: 1px solid #D3D3D3; padding: 0 20px; clear: #000248; padding-right: 52px; font-size: 15px; } .axil-single-widget.search .blog-search .search-button { position: absolute; right: 20px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); border: 0 none; padding: 0; } .axil-single-widget.search .blog-search .search-button i { color: #000248; font-weight: 400; } .axil-single-widget.search .blog-search .search-button::before { position: absolute; background: #C7C7D6; height: 18px; width: 1px; content: ""; left: -14px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .axil-single-widget.category ul.category-list li a { display: block; padding: 10px 0; padding-right: 20px; font-size: 18px; line-height: 28px; border-bottom: 1px solid #D3D3D3; text-decoration: none; color: #757589; -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; position: relative; } .axil-single-widget.category ul.category-list li a::after { width: 0; height: 0; border-style: solid; border-width: 4.5px 0 4.5px 6px; border-color: transparent transparent transparent #000248; position: absolute; right: 0; content: ""; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .axil-single-widget.category ul.category-list li:hover a { color: #0ac775; } .axil-single-widget.category ul.category-list li:first-child a { padding-top: 0; } .axil-single-widget.share { background: #7A19FF; padding: 17px 20px; } .axil-single-widget.share span { font-size: 22px; line-height: 26px; font-weight: 700; color: #ffffff; display: inline-block; } .axil-single-widget.share ul.social-list li { margin-left: 20px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-single-widget.share ul.social-list li { margin-left: 10px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-single-widget.share ul.social-list li { margin-left: 10px; } } @media only screen and (max-width: 767px) { .axil-single-widget.share ul.social-list li { margin-left: 10px; } } .axil-single-widget.share ul.social-list li a { font-size: 16px; line-height: 28px; color: #ffffff; } .axil-single-widget.small-post-wrapper { margin-top: -20px; } .axil-single-widget.small-post-wrapper .small-post { 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; margin-top: 20px; } .axil-single-widget.small-post-wrapper .small-post .thumbnail { padding-right: 20px; } .axil-single-widget.small-post-wrapper .small-post .thumbnail img { max-height: 80px; max-width: 100px; } .axil-single-widget.small-post-wrapper .small-post .content h6 { margin-bottom: 10px; } .axil-single-widget.small-post-wrapper .small-post .content h6 a { text-decoration: none; } .axil-single-widget.small-post-wrapper .small-post .content ul.blog-meta { margin: 0 -10px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .axil-single-widget.small-post-wrapper .small-post .content ul.blog-meta li { color: #757589; font-size: 12px; line-height: 24px; position: relative; margin: 0 10px; } .axil-single-widget.small-post-wrapper .small-post .content ul.blog-meta li + li::before { position: absolute; background: #D3D3D3; height: 14px; width: 1px; left: -10px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); content: ""; } .axil-single-widget.tags ul.tags-list { margin: 0 -5px; margin-bottom: -10px; } .axil-single-widget.tags ul.tags-list li { margin: 0 5px; margin-bottom: 10px; display: inline-block; } .axil-single-widget.tags ul.tags-list li a { background: #F6F5FA; display: inline-block; height: 26px; line-height: 26px; color: #757589; font-size: 15px; line-height: 24px; padding: 0 10px; text-decoration: none; } .axil-single-widget.tags ul.tags-list li a:hover { background: #0ac775; color: #ffffff; } /*-------------------------- Blog Details Area ---------------------------*/ .axil-blog-details-area .blog-top .title { margin-bottom: 20px; } @media only screen and (max-width: 767px) { .axil-blog-details-area .blog-top .title { margin-bottom: 10px; } } .axil-blog-details-area .blog-top .title a { text-decoration: none; } .axil-blog-details-area .blog-top .author { 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; margin-bottom: 40px; } @media only screen and (max-width: 767px) { .axil-blog-details-area .blog-top .author { margin-bottom: 20px; } } .axil-blog-details-area .blog-top .author .author-thumb img { max-height: 50px; } .axil-blog-details-area .blog-top .author .info { padding-left: 20px; } .axil-blog-details-area .blog-top .author .info h6 { margin-bottom: 6px; } .axil-blog-details-area .blog-top .author .info ul.blog-meta { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin: 0 -10px; } .axil-blog-details-area .blog-top .author .info ul.blog-meta li { margin: 0 10px; font-size: 15px; line-height: 24px; } .axil-blog-details-area .content p { font-size: 20px; line-height: 32px; margin-bottom: 22px; } @media only screen and (max-width: 767px) { .axil-blog-details-area .content p { font-size: 16px; line-height: 26px; margin-bottom: 10px; } } .axil-blog-details-area .axil-quote { padding: 30px; position: relative; border-left: 4px solid #0ac775; font-size: 20px; line-height: 32px; font-style: italic; margin: 40px 0; background: #FAFAFB; } @media only screen and (max-width: 767px) { .axil-blog-details-area .axil-quote { padding: 20px; font-size: 18px; line-height: 28px; margin: 30px 0; } } .axil-blog-details-area ul.bullet-list { margin: -14px 0; padding-bottom: 40px; border-bottom: 1px solid #F6F5FA; margin-bottom: 40px; } @media only screen and (max-width: 767px) { .axil-blog-details-area ul.bullet-list { padding-bottom: 20px; margin-bottom: 20px; } } .axil-blog-details-area ul.bullet-list li { margin: 14px 0; } @media only screen and (max-width: 767px) { .axil-blog-details-area ul.bullet-list li { margin: 3px 0; } } .axil-blog-details-area .blog-share .text { color: #000248; font-size: 20px; font-weight: 600; line-height: 32px; display: inline-block; padding-right: 36px; } @media only screen and (max-width: 575px) { .axil-blog-details-area .blog-share .text { margin-bottom: 10px; } } .axil-blog-details-area .blog-share ul.social-share li a { font-size: 15px; line-height: 24px; } .axil-blog-details-area .blog-share ul.social-share li a i { padding-right: 10px; font-size: 20px; } .axil-blog-details-area .axil-blog-author { padding: 30px; background: #FAFAFB; } @media only screen and (max-width: 767px) { .axil-blog-details-area .axil-blog-author { padding: 25px 20px; } } @media only screen and (max-width: 767px) { .axil-blog-details-area .axil-blog-author .author { display: block !important; } } .axil-blog-details-area .axil-blog-author .author-thumb { padding-right: 40px; } @media only screen and (max-width: 767px) { .axil-blog-details-area .axil-blog-author .author-thumb { padding-right: 0px; margin-bottom: 15px; } } .axil-blog-details-area .axil-blog-author .author-thumb img { max-height: 100px; } .axil-blog-details-area .axil-blog-author .info .title { font-size: 22px; margin-bottom: 20px; } @media only screen and (max-width: 767px) { .axil-blog-details-area .axil-blog-author .info .title { margin-bottom: 6px; } } .axil-blog-details-area .axil-blog-author .info .title a { text-decoration: none; } .axil-blog-details-area .axil-blog-author .info p { margin-bottom: 20px; } .axil-blog-details-area .axil-blog-author .info ul.social-share { margin: -10px; } .axil-blog-details-area .axil-blog-author .info ul.social-share li { margin: 10px; } .axil-blog-details-area .axil-blog-author .info ul.social-share li i { font-size: 18px; } .axil-blog-details-area .comment-list .comment { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .axil-blog-details-area .comment-list .comment .thumbnail { padding-right: 30px; } .axil-blog-details-area .comment-list .comment .thumbnail img { max-height: 60px; max-width: 60px; } .axil-blog-details-area .comment-list .comment .content .heading { 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-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 10px; } @media only screen and (max-width: 575px) { .axil-blog-details-area .comment-list .comment .content .heading { display: block; } } .axil-blog-details-area .comment-list .comment .content .heading .title h5 { margin-bottom: 0; } .axil-blog-details-area .comment-list .comment .content .heading .coment-date { 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; } .axil-blog-details-area .comment-list .comment .content .heading .coment-date p { font-size: 15px; line-height: 24px; color: #0ac775; margin-bottom: 0; } .axil-blog-details-area .comment-list .comment .content .heading .coment-date a.reply-btn { font-size: 14px; line-height: 26px; display: inline-block; color: #0ac775; padding-left: 10px; } .axil-blog-details-area .comment-list .comment + .comment { margin-top: 30px; } .axil-blog-details-area .comment-list .comment.comment-reply { margin-left: 75px; } @media only screen and (max-width: 767px) { .axil-blog-details-area .comment-list .comment.comment-reply { margin-left: 0; } } .axil-blog-details-area .axil-comment-form .inner { position: relative; z-index: 1; padding: 60px 40px; } @media only screen and (max-width: 767px) { .axil-blog-details-area .axil-comment-form .inner { padding: 30px 20px; } } .axil-blog-details-area .axil-comment-form .inner::before { width: 100%; height: 100%; left: 0; bottom: 0; background: rgba(0, 2, 72, 0.1); content: ""; position: absolute; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-10deg); transform: rotateY(-10deg); -webkit-filter: blur(50px); filter: blur(50px); } @media only screen and (max-width: 767px) { .axil-blog-details-area .axil-comment-form .inner::before { display: none; } } .axil-blog-details-area .axil-comment-form .inner::after { background: #ffffff; position: absolute; content: ""; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: -1; -webkit-transform-style: preserve-3d; -webkit-transform-style: preserve-3d; -webkit-transform: rotateY(-10deg); transform-style: preserve-3d; transform: rotateY(-10deg); } /*---------------------- Error Styles ------------------------*/ .axil-error-not-found { position: relative; z-index: 1; } .axil-error-not-found { position: relative; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-error-not-found.fullscreen { min-height: auto; width: 100%; padding: 150px 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-error-not-found.fullscreen { min-height: auto; width: 100%; padding: 150px 0; } } @media only screen and (max-width: 767px) { .axil-error-not-found.fullscreen { min-height: auto; width: 100%; padding: 150px 0; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-error-not-found .axil-error { padding-top: 70px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-error-not-found .axil-error { padding-top: 70px; } } @media only screen and (max-width: 767px) { .axil-error-not-found .axil-error { padding-top: 70px; } } .axil-error-not-found .shape-group .shape { position: absolute; z-index: 2; } .axil-error-not-found .shape-group .shape.shape-01 { bottom: 19%; left: 37%; } .axil-error-not-found .shape-group .shape.shape-02 { bottom: 100px; right: 11%; } .axil-error-not-found .shape-group .shape.shape-03 { bottom: auto; left: 0; top: 0; z-index: -1; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .axil-error-not-found .shape-group .shape.shape-03 { width: 100%; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-error-not-found .shape-group .shape.shape-03 { width: 100%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-error-not-found .shape-group .shape.shape-03 { width: 100%; } } @media only screen and (max-width: 767px) { .axil-error-not-found .shape-group .shape.shape-03 { width: 100%; } } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .axil-error-not-found .shape-group .shape.shape-03 img { width: 100%; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-error-not-found .shape-group .shape.shape-03 img { width: 100%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-error-not-found .shape-group .shape.shape-03 img { width: 100%; } } @media only screen and (max-width: 767px) { .axil-error-not-found .shape-group .shape.shape-03 img { width: 100%; } } .axil-error-not-found .shape-group .shape.shape-04 { bottom: auto; left: 0; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .axil-error-not-found .shape-group .shape.shape-04 { bottom: 0; left: 0; max-width: 27%; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-error-not-found .shape-group .shape.shape-04 { bottom: 0; left: 0; max-width: 27%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-error-not-found .shape-group .shape.shape-04 { bottom: 0; left: 0; max-width: 27%; } } @media only screen and (max-width: 767px) { .axil-error-not-found .shape-group .shape.shape-04 { display: none; } } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .axil-error-not-found .shape-group .shape.shape-04 img { width: 100%; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-error-not-found .shape-group .shape.shape-04 img { width: 100%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-error-not-found .shape-group .shape.shape-04 img { width: 100%; } } .axil-error { position: relative; z-index: 2; } .axil-error .text-image { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: -1; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .axil-error .text-image { width: 415px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .axil-error .text-image { width: 415px; } } @media only screen and (max-width: 767px) { .axil-error .text-image { width: auto; max-width: 217px; } } /*------------------------------ Privacy policy Styles --------------------------------*/ .privacy-policy-area a { color: #0ac775; text-decoration: none; -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; display: inline-block; position: relative; } .privacy-policy-area a::after { position: absolute; bottom: 0; width: 0; height: 1px; content: ""; left: 0; background: #0ac775; } .privacy-policy-area a:hover::after { width: 100%; } .privacy-policy-area ul { padding-left: 18px; list-style: disc; } .privacy-policy-area ul ul { margin-bottom: 0; } .privacy-policy-area ul li { margin-top: 10px; margin-bottom: 10px; font-size: 18px; line-height: 28px; } .privacy-policy-area h3 { margin-bottom: 20px; } .privacy-policy-area .section-title .title { display: inline-block; padding-bottom: 16px; border-bottom: 3px solid #0ac775; margin-bottom: 60px; } @media only screen and (max-width: 767px) { .privacy-policy-area .section-title .title { margin-bottom: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .privacy-policy-area .section-title .title { margin-bottom: 30px; } } /*----------------------------- Preview Page Style Css ------------------------------*/ /*-------------------------- Set Line Animation ----------------------------*/ .set-line-area { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; } @media only screen and (max-width: 767px) { .set-line-area { display: none; } } .set-line-area .line-inner { width: 100%; margin: 0 auto; position: relative; z-index: 2; height: 100%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .set-line-area .line-inner .line { width: 10%; height: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; border-right: 1px solid rgba(255, 255, 255, 0.6); position: relative; z-index: -1; } .set-line-area .line-inner .line:first-child { border-left: 1px solid rgba(255, 255, 255, 0.6); } .set-line-area .line-inner .line:first-child::before { content: ''; position: absolute; top: 0; right: -2px; width: 1px; height: 50px; -webkit-animation: line2 8s ease-out infinite; animation: line2 8s ease-out infinite; background: #007AFF; } .set-line-area .line-inner .line:first-child::after { content: ''; position: absolute; bottom: 0; right: -2px; width: 1px; height: 50px; -webkit-animation: line1 8s ease-out infinite; animation: line1 8s ease-out infinite; background: #49CCFF; } .set-line-area .line-inner .line:nth-child(2)::before { content: ''; position: absolute; bottom: 0; right: -2px; width: 1px; height: 50px; -webkit-animation: line1 8s ease-out infinite; animation: line1 8s ease-out infinite; background: #7A19FF; } .set-line-area .line-inner .line:nth-child(2)::after { content: ''; position: absolute; top: 0; right: -2px; width: 1px; height: 50px; -webkit-animation: line2 8s ease-out infinite; animation: line2 8s ease-out infinite; background: #FFCD3E; } .set-line-area .line-inner .line:nth-child(4)::before { content: ''; position: absolute; bottom: 400px; right: -2px; width: 1px; height: 50px; -webkit-animation: line5 8s ease-out infinite; animation: line5 8s ease-out infinite; background: #7A19FF; } .set-line-area .line-inner .line:nth-child(6)::before { content: ''; position: absolute; bottom: 0; right: -2px; width: 1px; height: 50px; -webkit-animation: line1 8s ease-out infinite; animation: line1 8s ease-out infinite; background: #7A19FF; } .set-line-area .line-inner .line:nth-child(5)::before { content: ''; position: absolute; top: 500px; right: -2px; width: 1px; height: 50px; -webkit-animation: line3 8s ease-out infinite; animation: line3 8s ease-out infinite; background: #00D09C; } .set-line-area .line-inner .line:nth-child(3)::before { content: ''; position: absolute; top: 500px; right: -2px; width: 1px; height: 50px; -webkit-animation: line3 8s ease-out infinite; animation: line3 8s ease-out infinite; background: #0ac775; } .set-line-area .line-inner .line:nth-child(7)::before { content: ''; position: absolute; top: 300px; right: -2px; width: 1px; height: 50px; -webkit-animation: line4 8s ease-out infinite; animation: line4 8s ease-out infinite; background: #00CFFF; } .set-line-area .line-inner .line:nth-child(9)::before { content: ''; position: absolute; top: 300px; right: -2px; width: 1px; height: 50px; -webkit-animation: line4 8s ease-out infinite; animation: line4 8s ease-out infinite; background: #FF8A5B; } /*---------------------- Banner Area ------------------------*/ .pv-page-wrapper { position: relative; } .pv-banner-area { height: 1080px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; position: relative; z-index: 2; } @media only screen and (max-width: 767px) { .pv-banner-area { padding: 100px 0; height: auto; padding-bottom: 62px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .pv-banner-area { padding: 150px 0; height: auto; padding-bottom: 110px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .pv-banner-area .mokup-group { display: none; } } .pv-banner-area .mokup-group .single-mokup { position: absolute; z-index: 2; } .pv-banner-area .mokup-group .single-mokup img { width: 100%; } .pv-banner-area .mokup-group .single-mokup.mokup-1 { right: 14%; top: 13%; width: 14%; } @media only screen and (min-width: 2000px) and (max-width: 4000px) { .pv-banner-area .mokup-group .single-mokup.mokup-1 { right: 17%; top: 4%; width: 380px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .pv-banner-area .mokup-group .single-mokup.mokup-1 { right: 3%; top: 34%; width: 14%; } } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .pv-banner-area .mokup-group .single-mokup.mokup-1 { right: 2%; top: 22%; width: 20%; } } @media only screen and (max-width: 767px) { .pv-banner-area .mokup-group .single-mokup.mokup-1 { display: none; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .pv-banner-area .mokup-group .single-mokup.mokup-1 img { width: 100%; } } .pv-banner-area .mokup-group .single-mokup.mokup-2 { right: 19%; bottom: 22%; width: 39%; } @media only screen and (min-width: 2000px) and (max-width: 4000px) { .pv-banner-area .mokup-group .single-mokup.mokup-2 { right: 26%; bottom: 19%; width: 800px; } } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .pv-banner-area .mokup-group .single-mokup.mokup-2 { right: 14%; bottom: 16%; width: 43%; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .pv-banner-area .mokup-group .single-mokup.mokup-2 { right: 4%; bottom: 16%; width: 60%; } } @media only screen and (max-width: 767px) { .pv-banner-area .mokup-group .single-mokup.mokup-2 { display: none; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .pv-banner-area .mokup-group .single-mokup.mokup-2 img { width: 100%; } } .pv-banner-area .mokup-group .single-mokup.mokup-3 { right: 57%; bottom: 4%; width: 22%; } @media only screen and (min-width: 2000px) and (max-width: 4000px) { .pv-banner-area .mokup-group .single-mokup.mokup-3 { right: 50%; bottom: 5%; width: 494px; } } @media only screen and (max-width: 767px) { .pv-banner-area .mokup-group .single-mokup.mokup-3 { display: none; } } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .pv-banner-area .mokup-group .single-mokup.mokup-3 { width: 32%; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .pv-banner-area .mokup-group .single-mokup.mokup-3 { right: 61%; bottom: 7%; width: 33%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .pv-banner-area .shape-group { display: none; } } @media only screen and (max-width: 767px) { .pv-banner-area .shape-group { display: none; } } .pv-banner-area .shape-group .shape { left: 0; position: absolute; z-index: 9; bottom: 0; } .pv-banner-area .shape-group .shape.shape-1 { left: 57%; bottom: 24%; z-index: 1; } .pv-banner-area .shape-group .shape.shape-2 { left: 7%; bottom: 19%; z-index: 1; } .pv-banner-area .shape-group .shape.shape-3 { left: auto; right: 5%; bottom: 20%; } .pv-banner-area .shape-group .shape.shape-4 { left: auto; right: 15%; bottom: 70%; z-index: 1; } .pv-banner-area .shape-group .shape.shape-5 { left: 38%; bottom: 60%; z-index: 1; } .pv-banner-area .shape-group .shape.shape-6 { left: 23%; bottom: 29%; z-index: 1; } @media only screen and (max-width: 575px) { .pv-banner-area .inner { padding-top: 30px !important; } } @media only screen and (max-width: 767px) { .pv-banner-area .inner { padding-bottom: 26px; } } .pv-banner-area .inner h1.title { margin-bottom: 110px; line-height: 68px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .pv-banner-area .inner h1.title { margin-bottom: 35px; line-height: 62px; font-size: 37px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .pv-banner-area .inner h1.title { margin-bottom: 20px; font-size: 32px; line-height: 51px; } } @media only screen and (max-width: 767px) { .pv-banner-area .inner h1.title { margin-bottom: 20px; font-size: 32px; line-height: 51px; } } @media only screen and (max-width: 575px) { .pv-banner-area .inner h1.title { font-size: 25px; line-height: 40px; } } .pv-banner-area .inner a.scroll-down-btn { text-decoration: none; } .pv-banner-area .inner a.scroll-down-btn i { height: 35px; width: 35px; background: #ffffff; border-radius: 100%; text-align: center; line-height: 35px; } .pv-banner-area .inner a.scroll-down-btn span { font-size: 16px; font-weight: 700; color: #000248; display: inline-block; padding-left: 20px; } .pv-banner-area .inner a.scroll-down-btn:hover span { color: #0ac775; } .pv-banner-area .theme-brief { position: absolute; z-index: 2; bottom: 40px; right: -230px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin: -35px; width: 55%; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .pv-banner-area .theme-brief { right: 0; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .pv-banner-area .theme-brief { right: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .pv-banner-area .theme-brief { right: auto; width: 100%; left: 0; position: static; margin: -15px; margin-top: 28px; } } @media only screen and (max-width: 767px) { .pv-banner-area .theme-brief { right: auto; width: 100%; left: 0; position: static; margin: -15px; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } } .pv-banner-area .theme-brief .single-counter { padding: 35px; -webkit-flex-basis: 33.33%; -ms-flex-preferred-size: 33.33%; flex-basis: 33.33%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .pv-banner-area .theme-brief .single-counter { padding: 15px; } } @media only screen and (max-width: 767px) { .pv-banner-area .theme-brief .single-counter { padding: 0px 15px; -webkit-flex-basis: 50%; -ms-flex-preferred-size: 50%; flex-basis: 50%; } } .pv-banner-area .theme-brief .single-counter span.subtile { color: #00004B; font-size: 15px; line-height: 24px; display: block; } .pv-banner-area .theme-brief .single-counter h2.title { font-size: 56px; line-height: 75px; display: inline-block; position: relative; } .pv-banner-area .theme-brief .single-counter h2.title::after { content: "+"; right: 0; } @media only screen and (min-width: 768px) and (max-width: 991px) { .pv-banner-area .theme-brief .single-counter h2.title { font-size: 40px; line-height: 58px; } } @media only screen and (max-width: 767px) { .pv-banner-area .theme-brief .single-counter h2.title { font-size: 30px; line-height: 40px; } } /*------------------------ Page Demo Area --------------------------*/ .page-demo-area .wrapper, .pv-feature-area .wrapper, .choose-us-area .wrapper, .pv-banner-area .wrapper { position: relative; z-index: 2; } .pv-section-title h2 { font-size: 50px; font-weight: 700; line-height: 62px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .pv-section-title h2 { font-size: 40px; line-height: 55px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .pv-section-title h2 { font-size: 30px; line-height: 48px; } .pv-section-title h2 br { display: none; } } @media only screen and (max-width: 767px) { .pv-section-title h2 { font-size: 36px; line-height: 41px; margin-bottom: 0; } .pv-section-title h2 br { display: none; } } @media only screen and (max-width: 575px) { .pv-section-title h2 { font-size: 26px; line-height: 40px; } } .pv-subtitle-title p { color: #52526C; font-size: 24px; line-height: 38px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .pv-subtitle-title p br { display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .pv-subtitle-title p { font-size: 18px; line-height: 29px; } .pv-subtitle-title p br { display: none; } } @media only screen and (max-width: 767px) { .pv-subtitle-title p { font-size: 18px; line-height: 29px; } .pv-subtitle-title p br { display: none; } } /* --------------------- Single Demo Area -----------------------*/ .page-demo-area .shape-group .shape { position: absolute; } .page-demo-area .shape-group .shape.shape-1 { left: -10%; top: 30%; z-index: -1; } .page-demo-area .shape-group .shape.shape-2 { bottom: 27%; right: -13%; z-index: -1; } .single-demo { margin-top: 80px; text-align: center; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .single-demo { margin-top: 40px; } } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .single-demo { margin-top: 40px; } } @media only screen and (max-width: 767px) { .single-demo { margin-top: 40px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .single-demo { margin-top: 40px; } } .single-demo a { display: block; text-decoration: none; } .single-demo a .thumb { position: relative; overflow: hidden; } .single-demo a .thumb img { width: 100%; } .single-demo a h5.title { margin-top: 30px; margin-bottom: 0; } .single-demo a h5.title:hover { color: #0ac775; } @media only screen and (max-width: 767px) { .single-demo a h5.title { margin-top: 15px; font-size: 18px; } } /*------------------------ Feature Area --------------------------*/ .pv-feature-area .shape-group .shape { position: absolute; } @media only screen and (max-width: 767px) { .pv-feature-area .shape-group .shape { display: none; } } .pv-feature-area .shape-group .shape.shape-1 { left: -14%; top: 27%; } .pv-feature-area .shape-group .shape.shape-2 { right: -10%; bottom: -4%; } .pv-feature { text-align: center; padding: 50px 30px; position: relative; z-index: 2; padding-top: 0; padding-bottom: 25px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; height: 100%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } @media only screen and (min-width: 768px) and (max-width: 991px) { .pv-feature { margin-top: 68px; padding: 50px 20px; padding-bottom: 25px; padding-top: 0; height: auto; } } @media only screen and (max-width: 767px) { .pv-feature { margin-top: 68px; padding: 50px 20px; padding-bottom: 25px; padding-top: 0; height: auto; } } .pv-feature::after { background: #ffffff; position: absolute; content: ""; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(15deg); transform: rotateY(15deg); } .pv-feature .inner .icon { position: relative; height: 70px; width: 80px; z-index: 2; margin: 0 auto; top: -33px; line-height: 59px; } .pv-feature .inner .icon::before { background: -webkit-gradient(linear, left top, left bottom, from(#EBFFFD), to(#EFEEFA)); background: -webkit-linear-gradient(top, #EBFFFD 0%, #EFEEFA 100%); background: -o-linear-gradient(top, #EBFFFD 0%, #EFEEFA 100%); background: linear-gradient(180deg, #EBFFFD 0%, #EFEEFA 100%); position: absolute; content: ""; right: 0; height: 100%; width: 80px; margin-top: -1px; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-5deg); transform: rotateY(-5deg); } .pv-feature .inner .content { position: relative; top: -10px; } .pv-feature .inner .content h5.title { margin-bottom: 20px; font-weight: 700; line-height: 26px; } .pv-feature .inner .content p { color: #52526E; font-size: 16px; line-height: 26px; } .pv-feature .inner .content .arrow-icon { height: 39px; width: 61px; position: relative; margin: 0 auto; z-index: 2; line-height: 39px; } .pv-feature .inner .content .arrow-icon::after { background: #0ac775; position: absolute; content: ""; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: -1; -webkit-transform: rotateY(-10deg); -webkit-transform-style: preserve-3d; transform-style: preserve-3d; transform: rotateY(-10deg); } .pv-feature .inner .content .arrow-icon i { color: #ffffff; } .pv-feature.datecated-support .inner .content .arrow-icon::after { background: #00D09C; } /*------------------------- Choose Us Area --------------------------*/ .choose-us-area .shape-group .shape { position: absolute; } .choose-us-area .shape-group .shape.shape-1 { left: -8%; top: 46%; z-index: -1; } .choose-us-area .shape-group .shape.shape-2 { bottom: -1%; right: 6%; z-index: -1; } .pv-choose-us { position: relative; z-index: 2; padding: 50px 30px; margin-top: 80px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .pv-choose-us { padding: 40px 18px; margin-top: 40px; } } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .pv-choose-us { padding: 40px 18px; margin-top: 40px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .pv-choose-us { margin-top: 40px; padding: 30px 26px; } } @media only screen and (max-width: 767px) { .pv-choose-us { margin-top: 40px; padding: 30px 26px; } } .pv-choose-us::after { background: #0ac775; position: absolute; content: ""; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-15deg); transform: rotateY(-15deg); } .pv-choose-us.bg-color-2::after { background: #49CCFF; } .pv-choose-us.bg-color-3::after { background: #FF8A5B; } .pv-choose-us .inner .content { 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; margin-bottom: 20px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .pv-choose-us .inner .content { margin-bottom: 0; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } } @media only screen and (max-width: 767px) { .pv-choose-us .inner .content { margin-bottom: 0; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .pv-choose-us .inner .content { -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } } @media only screen and (max-width: 575px) { .pv-choose-us .inner .content { display: block; } } .pv-choose-us .inner .content .icon { position: relative; height: 70px; z-index: 2; line-height: 65px; text-align: center; 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; } .pv-choose-us .inner .content .icon::before { background: -webkit-gradient(linear, left top, left bottom, from(#FEF7E2), to(#EEEEFD)); background: -webkit-linear-gradient(top, #FEF7E2 0%, #EEEEFD 100%); background: -o-linear-gradient(top, #FEF7E2 0%, #EEEEFD 100%); background: linear-gradient(180deg, #FEF7E2 0%, #EEEEFD 100%); position: absolute; content: ""; height: 100%; width: 80px; margin-top: -1px; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-5deg); transform: rotateY(-5deg); left: 0; } .pv-choose-us .inner .content .icon img { position: relative; left: 17px; width: 40px; } .pv-choose-us .inner .content .title { padding-left: 50px; } @media only screen and (max-width: 575px) { .pv-choose-us .inner .content .title { padding-left: 0; margin-top: 20px; } } .pv-choose-us .inner .content .title h5 { color: #ffffff; font-weight: 700; font-size: 20px; } .pv-choose-us .inner .description p { font-size: 16px; line-height: 26px; color: #ffffff; margin-bottom: 0; } .pv-choose-us.bg-color-4::after { background: #ffffff; } .pv-choose-us.bg-color-4 .inner .content .title h5 { color: #0ac775; font-weight: 700; } .pv-choose-us.bg-color-4 .inner .description p { color: #75758B; } /*-------------------------- Footer Area -----------------------------*/ .pv-footer-styles .axil-call-to-action.callaction-style-2 { position: relative; z-index: 2; padding-top: 0; } .pv-footer-styles .axil-call-to-action.callaction-style-2 .inner { margin-top: -120px; } .pv-footer-styles .axil-call-to-action.callaction-style-2 .inner::after { background: #ffffff; } .pv-footer-styles .pv-copyright-area { position: relative; z-index: 2; } .pv-footer-styles .pv-copyright-area .copyright-inner { 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; } @media only screen and (max-width: 767px) { .pv-footer-styles .pv-copyright-area .copyright-inner { display: block; } } .pv-footer-styles .pv-copyright-area .copyright-inner .inner-left p { color: #75758B; font-size: 20px; line-height: 26px; } .pv-footer-styles .pv-copyright-area .copyright-inner .inner-left .quick-links { margin: 0 -10px; } .pv-footer-styles .pv-copyright-area .copyright-inner .inner-left .quick-links li { padding: 0 10px; position: relative; } .pv-footer-styles .pv-copyright-area .copyright-inner .inner-left .quick-links li a { text-decoration: none; font-size: 16px; line-height: 26px; display: block; color: #75758B; } .pv-footer-styles .pv-copyright-area .copyright-inner .inner-left .quick-links li a:hover { color: #0ac775; } .pv-footer-styles .pv-copyright-area .copyright-inner .inner-left .quick-links li + li::before { position: absolute; left: -3px; content: "|"; } .pv-footer-styles .pv-copyright-area .copyright-inner .inner-right { padding-left: 70px; margin-left: 70px; position: relative; } @media only screen and (max-width: 767px) { .pv-footer-styles .pv-copyright-area .copyright-inner .inner-right { padding-left: 0; margin-left: 0; margin-top: 23px; } } @media only screen and (max-width: 767px) { .pv-footer-styles .pv-copyright-area .copyright-inner .inner-right ul.social-share { -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; } } .pv-footer-styles .pv-copyright-area .copyright-inner .inner-right::before { position: absolute; content: ""; } .pv-footer-styles .shape-group .shape { position: absolute; } .pv-footer-styles .shape-group .shape.shape-1 { left: 24%; top: -7%; } .pv-footer-styles .shape-group .shape.shape-2 { bottom: -1px; right: 21%; } /************************************** Footer Styles ***************************************/ /*=========================== Start Footer Area =============================*/ .footer-default .footer-widget-item.axil-border-right { position: relative; } .footer-default .footer-widget-item.axil-border-right::after { position: absolute; right: 7%; content: ""; height: 100%; width: 1px; background: #C7C7D5; top: 0; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .footer-default .footer-widget-item.axil-border-right::after { display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .footer-default .footer-widget-item.axil-border-right::after { display: none; } } @media only screen and (max-width: 767px) { .footer-default .footer-widget-item.axil-border-right::after { display: none; } } .footer-default .footer-widget-item h2 { margin-bottom: 10px; } .footer-default .footer-widget-item p { margin-bottom: 30px; } @media only screen and (max-width: 767px) { .footer-default .footer-widget-item p { margin-bottom: 10px; } } .footer-default .footer-widget-item ul.ft-menu li a { color: #757589; line-height: 28px; padding: 0; text-decoration: none; } .footer-default .footer-widget-item ul.ft-menu li a:hover { color: #0ac775; } .footer-default .footer-widget-item ul.ft-menu li + li { margin-top: 10px; } .footer-default .footer-widget-item.widget-support { position: relative; margin-left: -37px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .footer-default .footer-widget-item.widget-support { margin-left: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .footer-default .footer-widget-item.widget-support { margin-left: 0; } } @media only screen and (max-width: 767px) { .footer-default .footer-widget-item.widget-support { margin-left: 0; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .footer-default.footer-style-3 .footer-widget-item .logo a svg { width: 200px; } } .footer-default.footer-style-3 .footer-widget-item h6.title { color: #ffffff; font-size: 22px; line-height: 26px; font-weight: 700; margin-bottom: 40px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .footer-default.footer-style-3 .footer-widget-item h6.title { margin-bottom: 20px; } } @media only screen and (max-width: 767px) { .footer-default.footer-style-3 .footer-widget-item h6.title { margin-bottom: 20px; } } .footer-default.footer-style-3 .footer-widget-item h2 { margin-bottom: 10px; } .footer-default.footer-style-3 .footer-widget-item p { margin-bottom: 30px; } .footer-default.footer-style-3 .footer-widget-item ul.ft-menu li a { color: #C7C7D6; padding: 0; text-decoration: none; font-size: 18px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .footer-default.footer-style-3 .footer-widget-item ul.ft-menu li a { font-size: 16px; line-height: 20px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .footer-default.footer-style-3 .footer-widget-item ul.ft-menu li a { line-height: 20px; } } .footer-default.footer-style-3 .footer-widget-item ul.ft-menu li a:hover { color: #0ac775; } .footer-default.footer-style-3 .footer-widget-item .axil-ft-address { margin-top: 35px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .footer-default.footer-style-3 .footer-widget-item .axil-ft-address { margin-top: 16px; } } @media only screen and (max-width: 767px) { .footer-default.footer-style-3 .footer-widget-item .axil-ft-address { margin-top: 16px; } } .footer-default.footer-style-3 .footer-widget-item .axil-ft-address .address p { color: #C7C7D6; font-size: 18px; line-height: 28px; font-weight: 400; margin-bottom: 0; } .footer-default.footer-style-3 .footer-widget-item .axil-ft-address .address p span { font-size: 16px; line-height: 22px; display: inline-block; font-weight: 700; padding-right: 12px; } .footer-default.footer-style-3 .footer-widget-item .axil-ft-address .address p a { color: #C7C7D6; text-decoration: none; font-weight: 400; } .footer-default.footer-style-3 .footer-widget-item .axil-ft-address .address p + p { margin-top: 20px; } .footer-default.footer-style-3 .copyright-default .inner p { color: #F6F5FA; } .footer-default.footer-style-3 .copyright-default .quick-contact ul li a { color: #F6F5FA; } .footer-default.footer-style-3 .copyright-default .quick-contact ul li a:hover { color: #0ac775; } /*-------------------------- Newsletter Form ----------------------------*/ .newsletter-form { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: end; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; } @media only screen and (min-width: 768px) and (max-width: 991px) { .newsletter-form { display: block; } } @media only screen and (max-width: 767px) { .newsletter-form { display: block; } } .newsletter-form input { width: 330px; padding-bottom: 8px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .newsletter-form input { width: 250px; } } .newsletter-form .axil-button { margin-left: 30px; } @media only screen and (max-width: 575px) { .newsletter-form .axil-button { margin-left: 0; margin-top: 20px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .newsletter-form .axil-button { margin-left: 14px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .newsletter-form .axil-button { margin-left: 0; margin-top: 20px; } } @media only screen and (max-width: 767px) { .newsletter-form .axil-button { margin-left: 0; margin-top: 20px; } } /*====================== Copyright Area ========================*/ .copyright-default .quick-contact ul { margin: 0 -15px; } .copyright-default .quick-contact ul li { margin: 0 15px; } .copyright-default .quick-contact ul li a { color: #757589; text-decoration: none; } .copyright-default .quick-contact ul li a:hover { color: #0ac775; } /* Safari 10.1+ */ /* Safari 10.1+ (alternate method) */ @media not all and (min-resolution: 0.001dpcm) { @supports (-webkit-appearance: none) { .axil-service::before, .axil-contact-form.contact-form-style-1::before, .axil-contact-form.contact-form-style-1::after, .messonry-button button::before, .messonry-button button::after, .axil-counterup::before, .axil-testimonial .inner::before, .axil-blog .content .content-wrap::before, #scrollUp::before, #scrollUp::after, .contact-form-style-2::before, .axil-blog-details-area .axil-comment-form .inner::before, .axil-blog-details-area .axil-comment-form .inner::after, .axil-service .inner .icon::before, .axil-blog.active .content .content-wrap, .breadcrumb-thumbnail-group .thumbnail::before, .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .image-group, .axil-address::after, .axil-address::before { -webkit-transform: none; -ms-transform: none; transform: none; } .axil-service .inner::after, .axil-counterup::after, .axil-call-to-action.callaction-style-2 .inner::after, .axil-working-process .thumbnail .image img, .axil-service .inner::before, .axil-pricing-table.active::before, .axil-team-details-wrapper .thumbnail::before { -webkit-transform: perspective(500px); transform: perspective(500px); } .axil-team-area .thumbnail .total-team-button a::after { -webkit-transform: perspective(100px); transform: perspective(100px); } .axil-testimonial .inner::after, .axil-pricing-table.active .axil-pricing-inner::after, .axil-pricing-table.active .axil-pricing-inner::before, .contact-form-style-2::after { -webkit-transform: perspective(700px); transform: perspective(700px); } .axil-contact-form.contact-form-style-1::after, .axil-address::before, .axil-address::after { -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .axil-case-study .thumbnail a img, .axil-blog.active .content .content-wrap, .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .image-group img.image-2, .axil-breadcrumb-area.breadcrumb-style-2 .thumbnail .image-group img.image-1, .axil-team-details-wrapper .thumbnail img { -webkit-transform: none !important; -ms-transform: none !important; transform: none !important; } } }