@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:wght@200;300;600;700&display=swap'); * { -webkit-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 0; } body, html { height: 100%; } html { margin: 0; padding: 0; width: 100%; height: 100%; scroll-behavior: smooth; } html, body, div, span, img, ol, ul, li, a, p, h1, h2, h3, h4, h5, h6, option, legend, label, table, th, td, tr, article, aside, caption, figure, footer, header, hgroup, mark, nav, section, time, audio, video { margin: 0; padding: 0; border: 0; outline: 0; } .wrapper { height: 100%; } img { border: none; outline: none; max-width: 100%; } label { display: inline-block; font-weight: normal; margin-bottom: 5px; max-width: 100%; } a { outline: none; text-decoration: none; color: #2db1e3; } a img { border: none; } a:active { outline: none; text-decoration: none; color: #232323; opacity: 1; } a:focus { outline: none; text-decoration: none; color: #232323; } a:hover { outline: none; text-decoration: none; color: #232323; opacity: 1; } button { outline: medium none; } iframe { border: none; } hr { margin-top: 0; margin-bottom: 0; border: 0; border-top: 1px solid #eee; } pre { display: block; margin: 0 0 30px; padding: 9.5px; word-wrap: break-word; word-break: break-all; color: #333; border: 1px solid #ededed; border-radius: inherit; background-color: #f9f9f9; font-size: 13px; line-height: 1.42857143; } input { border: 1px solid #e7e7e7; border-radius: inherit; -webkit-box-shadow: inherit; box-shadow: inherit; min-height: 50px; } input:focus { outline: none; -webkit-box-shadow: inherit; box-shadow: inherit; } textarea:focus { outline: none; -webkit-box-shadow: inherit; box-shadow: inherit; } select:focus { outline: none; -webkit-box-shadow: inherit; box-shadow: inherit; } ul { list-style-type: none; } ul, li { margin: 0; padding: 0; list-style: none; } b { font-weight: 900; } strong { font-weight: 900; } .row { --bs-gutter-x: 30px; } /* -------------------------------------------- Template Default Fonts & Fonts Styles ---------------------------------------------- */ body { font-family: 'Titillium Web', sans-serif; font-size: 16px; font-weight: 400; line-height: 28px; overflow-x: hidden; background-color: #ffffff; color: #666666; } h1, h2, h3, h4, h5, h6 { color: #232323; font-weight: normal; line-height: 1.2; font-family: 'Titillium Web', sans-serif; letter-spacing: 0; margin: 0; } h1, h2, h3, h4, h5, h6 { margin-bottom: 15px; } h1 { font-size: 40px; } h2 { font-size: 36px; } h3 { font-size: 27px; } h4 { font-size: 20px; } h5 { font-size: 18px; } h6 { font-size: 14px; } a, .btn, button { -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; outline: medium none; } p { color: #666666; margin: 0 0 15px; text-transform: none; font-weight: 400; font-family: 'Titillium Web', sans-serif; } a { -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; text-decoration: none; font-weight: 600; } /* -------------------------------------------- Helper CSS ---------------------------------------------- */ @media (min-width: 1601px) { .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 1250px; } } .container-medium { padding: 0 15px; margin: auto; max-width: 1400px; } .container-full { padding: 0 15px; margin: auto; max-width: 1400px; } .container-fill { padding: 0 15px; margin: auto; max-width: 100%; } @media (min-width: 576px) { .container-medium { max-width: 540px; width: 100%; } } @media (min-width: 768px) { .container-medium { max-width: 720px; width: 100%; } } @media (min-width: 992px) { .container-medium { max-width: 960px; width: 100%; } } @media (min-width: 1200px) { .container-medium { max-width: 1400px; width: 80%; } } @media (min-width: 576px) { .container-full { max-width: 540px; width: 100%; } } @media (min-width: 768px) { .container-full { max-width: 720px; width: 100%; } } @media (min-width: 992px) { .container-full { max-width: 960px; width: 100%; } } @media (min-width: 1200px) { .container-full { max-width: 95%; width: 95%; } } @media (min-width: 576px) { .container-fill { max-width: 540px; width: 100%; } } @media (min-width: 768px) { .container-fill { max-width: 720px; width: 100%; } } @media (min-width: 992px) { .container-fill { max-width: 960px; width: 100%; } } @media (min-width: 1200px) { .container-fill { width: 100%; max-width: 100%; } } @media (max-width: 1199px) { .container-fill { padding: 0 15px; width: 100%; } } @media only screen and (min-width: 1367px) { .container-stage { margin-left: calc((100% - 1320px)/ 2); width: auto; min-width: auto; max-width: inherit; padding-right: 0; } } @media only screen and (max-width: 767px) { .row { --bs-gutter-x: 1.5rem; } } .fixed-bg { position: absolute; top: inherit; right: inherit; bottom: 0; left: 0; content: ""; height: 100%; width: 100%; z-index: inherit; } .bg-cover { background-position: center center !important; background-size: cover !important; } .bg-fixed { background-attachment: fixed !important; background-position: center center !important; background-size: cover !important; } .bg-fit { background-size: 100% 100% !important; background-position: center !important; } .bg-gray { background: #e7edf8; } .bg-light { background-color: #ffffff; } .bg-dark { background-color: #0b5c8d !important; } .bg-theme { background-color: #2db1e3; } .bg-gradient { background-color: #2db1e3; background: -webkit-gradient(linear, left top, right top, from(#00102d), color-stop(56%, #2db1e3)) !important; background: linear-gradient(90deg, #00102d 0%, #2db1e3 56%) !important; } .text-light { color: #ffffff; } .text-light h1, .text-light h2, .text-light h3, .text-light h4, .text-light h5, .text-light h6, .text-light p, .text-light span, .text-light a { color: #ffffff; } .shadow { -webkit-box-shadow: inherit !important; box-shadow: inherit !important; } .shadow.dark { position: relative; z-index: 1; } .shadow.dark:after { background: #000 none repeat scroll 0 0; content: ""; height: 100%; left: 0; opacity: 0.3; position: absolute; top: 0; width: 100%; z-index: -1; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .shadow.dark-hard { position: relative; z-index: 1; } .shadow.dark-hard:after { background: #0b5c8d none repeat scroll 0 0; content: ""; height: 100%; left: 0; opacity: 0.65; position: absolute; top: 0; width: 100%; z-index: -1; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .shadow.dark-small { position: relative; z-index: 1; } .shadow.dark-small:after { background: #0b5c8d none repeat scroll 0 0; content: ""; height: 100%; left: 0; opacity: 0.3; position: absolute; top: 0; width: 100%; z-index: -1; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .shadow.theme { position: relative; z-index: 1; } .shadow.theme:after { background: #2db1e3 none repeat scroll 0 0; content: ""; height: 100%; left: 0; opacity: 0.7; position: absolute; top: 0; width: 100%; z-index: -1; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .shadow.gradient { position: relative; z-index: 1; } .shadow.gradient:after { background: -webkit-gradient(linear, left top, right top, from(#0b5c8d), color-stop(#2db1e3), to(#0b5c8d)) none repeat scroll 0 0; background: linear-gradient(to right, #0b5c8d, #2db1e3, #0b5c8d) none repeat scroll 0 0; content: ""; height: 100%; left: 0; opacity: 0.7; position: absolute; top: 0; width: 100%; z-index: -1; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .shadow.light { position: relative; z-index: 1; } .shadow.light:after { background: #ffffff none repeat scroll 0 0; content: ""; height: 100%; left: 0; opacity: 0.6; position: absolute; top: 0; width: 100%; z-index: -1; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .default-padding, .default-padding-top, .default-padding-bottom, .default-padding-mx { position: relative; } .default-padding { padding-top: 60px; padding-bottom: 60px; } @media only screen and (max-width: 767px) { .default-padding { padding-top: 50px; padding-bottom: 50px; } } .default-padding-big { padding: 250px 0; } @media only screen and (max-width: 767px) { .default-padding-big { padding: 50px 0; } } .default-padding-top { padding-top: 120px; } @media only screen and (max-width: 767px) { .default-padding-top { padding-top: 50px; } } .default-padding-bottom { padding-bottom: 120px; } @media only screen and (max-width: 767px) { .default-padding-bottom { padding-bottom: 50px; } } .default-padding.bottom-less { padding-top: 60px; padding-bottom: 60px; } @media only screen and (max-width: 767px) { .default-padding.bottom-less { padding-top: 50px; padding-bottom: 20px; } } .default-padding-bottom.bottom-less { margin-bottom: -30px; } @media only screen and (max-width: 767px) { .default-padding-bottom.bottom-less { margin-bottom: 0; } } .default-padding-top.bottom-less { margin-bottom: -30px; } @media only screen and (max-width: 767px) { .default-padding-top.bottom-less { margin-bottom: 0; } } .top-border { border-top: 1px solid #e7e7e7; } .align-center { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .relative { position: relative; z-index: 1; } .overflow-hidden { overflow: hidden; } .carousel-shadow .owl-stage-outer { margin: -15px -15px; padding: 15px; } .border-bottom { border-bottom: 1px solid #e7e7e7; } .border-top { border-top: 1px solid #e7e7e7; } .border-left { border-left: 1px solid #e7e7e7; } .border-right { border-right: 1px solid #e7e7e7; } /* Color */ .color-theme { color: #2db1e3; } .color-dark { color: #0b5c8d; } .color-black { color: #000000; } .color-gray { color: #e7edf8; } .color-gradient { text-transform: uppercase; font-weight: 600; color: #2db1e3; margin-top: -5px; display: inline-block; background: -webkit-gradient(linear, left top, right top, color-stop(30%, #1273eb), to(#04d7f2)); background: linear-gradient(90deg, #1273eb 30%, #04d7f2 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; } .half-bg-gray { position: relative; z-index: 1; } .half-bg-gray::before { position: absolute; left: 0; bottom: 0; content: ""; height: 120px; width: 100%; background: #e7edf8; z-index: -1; } .half-bg-light { position: relative; z-index: 1; } .half-bg-light::before { position: absolute; left: 0; bottom: 0; content: ""; height: 120px; width: 100%; background: #ffffff; z-index: -1; } .shape-right-bottom { position: absolute; right: 0; bottom: 0; height: 300px; width: 300px; background-size: contain; background-repeat: no-repeat; background-position: right bottom; z-index: -1; } .sub-heading { text-transform: uppercase; color: #2db1e3; font-weight: 600; background: -webkit-gradient(linear, left top, right top, from(#2db1e3), color-stop(#0b5c8d), to(#2db1e3)); background: linear-gradient(to right, #2db1e3, #0b5c8d, #2db1e3); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-size: 220% 150%; display: inline-block; position: relative; z-index: 1; margin-left: 40px; } .sub-heading::after { position: absolute; left: -40px; content: ""; height: 10px; width: 32px; background: url(../img/shape/shape_line.png); background-size: contain; background-repeat: no-repeat; top: 8px; } .sub-heading.light { color: #ffffff; background: #ffffff; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; } .sub-heading.light::after { background: url(../img/shape/shape_line_light.png); background-size: contain; background-repeat: no-repeat; } .heading { font-weight: 600; margin-top: -5px; } .heading span { font-weight: 400; } .site-heading { margin-bottom: 30px; } .site-heading .sub-title { text-transform: uppercase; color: #2db1e3; font-weight: 600; background: -webkit-gradient(linear, left top, right top, from(#2db1e3), color-stop(#0b5c8d), to(#2db1e3)); background: linear-gradient(to right, #2db1e3, #0b5c8d, #2db1e3); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-size: 220% 150%; display: inline-block; position: relative; z-index: 1; padding-bottom: 20px; } .site-heading .sub-title::after { position: absolute; left: 50%; content: ""; height: 10px; width: 32px; background: url(../img/shape/shape_line.png); background-size: contain; background-repeat: no-repeat; bottom: 0; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .site-heading .title { font-weight: 600; margin-bottom: 0; } .site-heading p { margin-bottom: 0; margin-top: 25px; padding: 0 10%; } @media (max-width: 767px) { .site-heading p { padding: 0; } } @media only screen and (max-width: 767px) { .site-heading { margin-bottom: 30px; } } .heading-left { position: relative; z-index: 1; margin-bottom: 60px; } .heading-left .sub-title { text-transform: uppercase; color: #2db1e3; font-weight: 600; background: -webkit-gradient(linear, left top, right top, from(#2db1e3), color-stop(#0b5c8d), to(#2db1e3)); background: linear-gradient(to right, #2db1e3, #0b5c8d, #2db1e3); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-size: 220% 150%; display: inline-block; position: relative; z-index: 1; padding-left: 45px; } .heading-left .sub-title::after { position: absolute; left: 0; content: ""; height: 10px; width: 32px; background: url(../img/shape/shape_line.png); background-size: contain; background-repeat: no-repeat; top: 7px; } .heading-left .heading { font-weight: 600; margin-bottom: 0; } @media only screen and (min-width: 768px) and (max-width: 991px) { .heading-left .heading { margin-bottom: 30px; } } @media only screen and (max-width: 767px) { .heading-left .heading { margin-bottom: 15px; } } .heading-left p { margin-bottom: 0; } .heading-left .btn { margin-top: 30px; } @media only screen and (max-width: 767px) { .heading-left { margin-bottom: 30px; } } .bg-dark .heading-left p { opacity: 0.8; } .top-shape-120 { position: absolute; left: 0; top: 0; content: ""; height: 120px; width: 100%; background: #e7edf8; z-index: -1; } .bottom-shape-120 { position: absolute; left: 0; bottom: 0; content: ""; height: 120px; width: 100%; background: #e7edf8; z-index: -1; } .shape-bottom-large { position: absolute; right: -150%; top: 0; content: ""; height: 200%; width: 500%; background: #e7edf8; z-index: -1; } /* Video Play Button */ .video-play-button { display: inline-block; background: #2db1e3; height: 60px; width: 60px; line-height: 60px; text-align: center; border-radius: 50%; color: #232323; position: relative; } .video-play-button i { font-weight: 400; font-size: 20px; position: relative; left: 3px; top: 2px; } .video-play-button .effect { position: absolute; width: 100px; height: 100px; background: #2db1e3; opacity: 0; border-radius: 100%; left: 50%; top: 50%; z-index: -1; -webkit-animation: video-play 1500ms ease-out infinite; animation: video-play 1500ms ease-out infinite; } .video-play-button .effect::after { position: absolute; content: ""; width: 70px; height: 70px; background: yellow; opacity: 0; border-radius: 100%; left: 50%; top: 50%; z-index: -1; -webkit-animation: video-play 1500ms ease-out infinite; animation: video-play 1500ms ease-out infinite; -webkit-animation-delay: 2s; animation-delay: 2s; } .video-play-button .effect::before { position: absolute; content: ""; width: 60px; height: 60px; background: green; opacity: 0; border-radius: 100%; left: 50%; top: 50%; z-index: -1; -webkit-animation: video-play 1500ms ease-out infinite; animation: video-play 1500ms ease-out infinite; -webkit-animation-delay: 3s; animation-delay: 3s; } .video-play-button.with-text { width: auto; background: transparent; } .video-play-button.with-text span { position: relative; z-index: 1; } .video-play-button.with-text span i { margin-left: 25px; margin-right: 30px; color: #ffffff; left: 0; } .video-play-button.with-text .effect { height: 60px; width: 60px; left: 0; -webkit-animation: inherit; animation: inherit; background: #2db1e3; top: 0; opacity: 1; z-index: 1; } .video-play-button.with-text .effect::before { display: none; } .video-play-button.with-text .effect::after { background: #2db1e3; height: 100%; width: 100%; z-index: inherit; -webkit-animation-delay: 0s; animation-delay: 0s; } /* Video Paly */ @-webkit-keyframes video-play { 0% { -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); opacity: 1; } 100% { -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5); transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5); opacity: 0; } } @keyframes video-play { 0% { -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); opacity: 1; } 100% { -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5); transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5); opacity: 0; } } /*Zoom Animation */ .zoom-animation { -webkit-animation: zoom 2000ms ease-out infinite; animation: zoom 2000ms ease-out infinite; } /* Slider Zoom Effect */ @-webkit-keyframes zoom { from { -webkit-transform: scale(1, 1); } to { -webkit-transform: scale(1.2, 1.2); } } @keyframes zoom { from { -webkit-transform: scale(1, 1); transform: scale(1, 1); } to { -webkit-transform: scale(1.2, 1.2); transform: scale(1.2, 1.2); } } /* Spiner Animation */ .spiner-animation { -webkit-animation: spinner 20s infinite linear; animation: spinner 20s infinite linear; } /*Preloader Spiner Animation */ @-webkit-keyframes spinner { to { -webkit-transform: rotateZ(360deg); transform: rotateZ(360deg); } } @keyframes spinner { to { -webkit-transform: rotateZ(360deg); transform: rotateZ(360deg); } } /* Infinite Up Down Animation */ @keyframes UpDown { 0% { -webkit-transform: translateY(0px); transform: translateY(0px); } 50% { -webkit-transform: translateY(-25px); transform: translateY(-25px); } 100% { -webkit-transform: translateY(0px); transform: translateY(0px); } } /* Animation UpDown */ .updown-animation { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: cubic-bezier(0.54, 0.085, 0.5, 0.92); animation-timing-function: cubic-bezier(0.54, 0.085, 0.5, 0.92); -webkit-animation-name: UpDown; animation-name: UpDown; -webkit-animation-duration: 2s; animation-duration: 2s; } @-webkit-keyframes UpDown { 0% { -webkit-transform: translateY(0px); transform: translateY(0px); } 50% { -webkit-transform: translateY(-25px); transform: translateY(-25px); } 100% { -webkit-transform: translateY(0px); transform: translateY(0px); } } /* Animation Left Right */ .leftRight-animation { -webkit-animation: fadeLeftRight 10s ease-out infinite; animation: fadeLeftRight 10s ease-out infinite; } /* Fade Left Right */ @keyframes fadeLeftRight { 0%, 100% { -webkit-transform: translateX(0px); transform: translateX(0px); } 50% { -webkit-transform: translateX(100px); transform: translateX(100px); } } @-webkit-keyframes fadeLeftRight { 0%, 100% { -webkit-transform: translateX(0px); transform: translateX(0px); } 50% { -webkit-transform: translateX(100px); transform: translateX(100px); } } /* Animation Right Left */ .rightLeft-animation { -webkit-animation: fadeRightLeft 10s ease-out infinite; animation: fadeRightLeft 10s ease-out infinite; } @keyframes fadeRightLeft { 0%, 100% { -webkit-transform: translateX(0px); transform: translateX(0px); } 50% { -webkit-transform: translateX(-50px); transform: translateX(-50px); } } @-webkit-keyframes fadeRightLeft { 0%, 100% { -webkit-transform: translateX(0px); transform: translateX(0px); } 50% { -webkit-transform: translateX(-50px); transform: translateX(-50px); } } /* Animation Zoom Up Down */ .zoomUpDown-animation { -webkit-animation: zoomUpDown 10s ease-out infinite; animation: zoomUpDown 10s ease-out infinite; } /* Zoom Up Down */ @keyframes zoomUpDown { 0%, 100% { -webkit-transform: scale(0.5); transform: scale(0.5); } 50% { -webkit-transform: scale(0.7); transform: scale(0.7); } } @-webkit-keyframes zoomUpDown { 0%, 100% { -webkit-transform: scale(0.5); transform: scale(0.5); } 50% { -webkit-transform: scale(0.8); transform: scale(0.8); } } /* Animation Moving */ .moving-animation { -webkit-animation: moving 10s ease-out infinite; animation: moving 10s ease-out infinite; } /* Mooving Animation */ @-webkit-keyframes moving { 0% { -webkit-transform: translate(0px, 0px); transform: translate(0px, 0px); } 20% { -webkit-transform: translate(0px, -30px); transform: translate(0px, -30px); } 50% { -webkit-transform: translate(-100px, -30px); transform: translate(-100px, -30px); } 70% { -webkit-transform: translate(-100px, 0px); transform: translate(-100px, 0px); } 100% { -webkit-transform: translate(0px, 0px); transform: translate(0px, 0px); } } @keyframes moving { 0% { -webkit-transform: translate(0px, 0px); transform: translate(0px, 0px); } 20% { -webkit-transform: translate(0px, -30px); transform: translate(0px, -30px); } 50% { -webkit-transform: translate(-100px, -30px); transform: translate(-100px, -30px); } 70% { -webkit-transform: translate(-100px, 0px); transform: translate(-100px, 0px); } 100% { -webkit-transform: translate(0px, 0px); transform: translate(0px, 0px); } } /* Animation Rotation */ @keyframes infinite-rotate { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 50% { -webkit-transform: rotate(180deg); transform: rotate(180deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @-webkit-keyframes infinite-rotate { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 50% { -webkit-transform: rotate(180deg); transform: rotate(180deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } /* Button Border Animation */ @-webkit-keyframes open { 0% { width: 0; height: 0; } 50% { width: 100px; height: 0; } 100% { width: 100px; height: 55px; } } @keyframes open { 0% { width: 0; height: 0; } 50% { width: 100px; height: 0; } 100% { width: 100px; height: 55px; } } @-webkit-keyframes openB { 0% { width: 0px; } 100% { width: 100px; } } @keyframes openB { 0% { width: 0px; } 100% { width: 100px; } } /* Animation Shine (A shine color will move inside the text) */ @-webkit-keyframes shine { 0% { background-position: 0; } 60% { background-position: 180px; } 100% { background-position: 180px; } } @keyframes shine { 0% { background-position: 0; } 60% { background-position: 180px; } 100% { background-position: 180px; } } @-webkit-keyframes infiniteMove { 0% { border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%; } 50% { border-radius: 30% 60% 70% 40% / 50% 60% 30% 60%; } 100% { border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%; } } @keyframes infiniteMove { 0% { border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%; } 50% { border-radius: 30% 60% 70% 40% / 50% 60% 30% 60%; } 100% { border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%; } } @-webkit-keyframes infiniteMove2 { 0% { border-radius: 60% 30% 70% 40% / 60% 40% 30% 70%; } 50% { border-radius: 50% 60% 30% 60% / 30% 60% 70% 40%; } 100% { border-radius: 60% 30% 70% 40% / 60% 40% 30% 70%; } } @keyframes infiniteMove2 { 0% { border-radius: 60% 30% 70% 40% / 60% 40% 30% 70%; } 50% { border-radius: 50% 60% 30% 60% / 30% 60% 70% 40%; } 100% { border-radius: 60% 30% 70% 40% / 60% 40% 30% 70%; } } /* -------------------------------------------- Button ---------------------------------------------- */ .btn { display: inline-block; font-weight: 600; text-transform: capitalize; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; overflow: hidden; border-radius: 5px; border: 2px solid transparent; -webkit-box-shadow: inherit; box-shadow: inherit; font-size: 15px; text-transform: capitalize; letter-spacing: 0.5px; padding: 13px 30px; background: #e7edf8; position: relative; z-index: 1; } .btn:focus, .btn.active { -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; -webkit-box-shadow: inherit; box-shadow: inherit; border: 2px solid transparent; } .btn:hover { background-color: #2db1e3; color: #ffffff; } .btn.radius { border-radius: 6px; } .btn.btn-border { border: 2px solid #e7e7e7; background: transparent; } .btn.btn-border:hover { background: #2db1e3; border-color: #2db1e3; } .btn.btn-border.animation::after { position: absolute; top: 0; right: inherit; bottom: inherit; left: 0; content: ""; height: 100%; width: 0; z-index: -1; background: #e7e7e7; -webkit-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; } .btn.btn-border.animation:hover { border-color: #e7e7e7; color: #0b5c8d; } .btn.btn-border.animation:hover::after { width: 100%; } .btn.btn-border-dark { border: 2px solid #011e2a; background: transparent; } .btn.btn-border-dark:hover { background: #0b5c8d; border-color: #0b5c8d; } .btn.btn-border-dark.animation::after { position: absolute; top: 0; right: inherit; bottom: inherit; left: 0; content: ""; height: 100%; width: 0; z-index: -1; background: #0b5c8d; -webkit-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; } .btn.btn-border-dark.animation:hover { border-color: #0b5c8d; color: #ffffff; } .btn.btn-border-dark.animation:hover::after { width: 100%; } .btn.btn-border-theme { border: 2px solid #2db1e3; background: transparent; } .btn.btn-border-theme:hover { background: #2db1e3; border-color: #2db1e3; } .btn.btn-border-theme.animation::after { position: absolute; top: 0; right: inherit; bottom: inherit; left: 0; content: ""; height: 100%; width: 0; z-index: -1; background: #2db1e3; -webkit-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; } .btn.btn-border-theme.animation:hover { border-color: #2db1e3; color: #ffffff; } .btn.btn-border-theme.animation:hover::after { width: 100%; } .btn.btn-border-light { border: 2px solid #ffffff; background: transparent; color: #ffffff; } .btn.btn-border-light:hover { background: #ffffff; border-color: #ffffff; color: #0b5c8d; } .btn.btn-border-light.animation::after { position: absolute; top: 0; right: inherit; bottom: inherit; left: 0; content: ""; height: 100%; width: 0; z-index: -1; background: #ffffff; -webkit-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; } .btn.btn-border-light.animation:hover { border-color: #ffffff; color: #0b5c8d; } .btn.btn-border-light.animation:hover::after { width: 100%; } .btn.btn-gradient { border: none; color: #ffffff; } .btn.btn-gradient::after { position: absolute; top: 0; right: inherit; bottom: inherit; left: 0; content: ""; height: 100%; width: 100%; z-index: -1; background-color: #2db1e3; background-image: -webkit-gradient(linear, left top, right top, from(#0b5c8d), color-stop(#2db1e3), to(#0b5c8d)); background-image: linear-gradient(to right, #0b5c8d, #2db1e3, #0b5c8d); background-size: 220% 150%; -webkit-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; } .btn.btn-gradient:hover::after { background-position: -70% 0; } .btn.btn-gradient.active { background-position: -70% 0; } .btn.btn-theme { color: #ffffff; border: none; background: #2db1e3; } .btn.btn-theme::after { position: absolute; top: inherit; right: inherit; bottom: inherit; left: -5%; content: ""; height: 150px; width: 115%; z-index: -1; background-color: #0b5c8d; -webkit-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; -webkit-transform: translateY(-45%) skew(25deg) scale(0); transform: translateY(-45%) skew(25deg) scale(0); } .btn.btn-theme:hover::after { -webkit-transform: translateY(-45%) skew(25deg) scale(1.2); transform: translateY(-45%) skew(25deg) scale(1.2); } .btn.btn-theme.hover-light::after { background-color: #ffffff; -webkit-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; } .btn.btn-theme.hover-light:hover { color: #0b5c8d; -webkit-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; } .btn.btn-theme.hover-light:hover::after { -webkit-transform: translateY(-45%) skew(25deg) scale(1.2); transform: translateY(-45%) skew(25deg) scale(1.2); } .btn.btn-light { color: #232323; border: none; background: #ffffff; border: 2px solid transparent; } .btn.btn-light:hover { color: #ffffff; background: transparent; border: 2px solid #ffffff; } .btn.btn-dark { color: #ffffff; background: #0b5c8d; border: none; } .btn.btn-dark::after { position: absolute; top: 0; right: inherit; bottom: inherit; left: 0; content: ""; height: 100%; width: 0; z-index: -1; background-color: #2db1e3; -webkit-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; } .btn.btn-dark:hover::after { width: 100%; } .btn i { position: relative; top: 1px; margin-left: 5px; } .btn.text-slide { min-width: 150px; height: 55px; line-height: 55px; } .btn.text-slide span { position: absolute; height: 100%; width: 100%; top: 0; left: 0; text-align: center; } .btn.animate-border { overflow: inherit; z-index: inherit; width: 200px; height: 55px; line-height: 55px; padding: 0; } .btn.animate-border:hover { background: transparent; color: #0b5c8d; } .btn.animate-border:hover .hover-border::after, .btn.animate-border:hover .hover-border::before { opacity: 1; -webkit-animation: open 0.4s; /* Chrome, Safari, Opera */ animation: open 0.4s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1); animation-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1); -webkit-animation-direction: normal; animation-direction: normal; } .btn.animate-border:hover .hover-border-bottom::after, .btn.animate-border:hover .hover-border-bottom::before { opacity: 1; -webkit-animation: openB 0.4s; /* Chrome, Safari, Opera */ animation: openB 0.4s; -webkit-animation-delay: 0.4s; animation-delay: 0.4s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1); animation-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1); -webkit-animation-direction: normal; animation-direction: normal; } .btn.animate-border .hover-border { position: absolute; left: 0; top: -1px; height: 100%; width: 100%; } .btn.animate-border .hover-border::before { position: absolute; content: ""; height: 0; width: 0; display: block; opacity: 0; border-top: solid 2px red; border-left: solid 2px red; right: 98px; top: -1px; } .btn.animate-border .hover-border::after { position: absolute; content: ""; height: 0; width: 0; display: block; opacity: 0; border-top: solid 2px red; border-right: solid 2px red; left: 98px; top: -1px; } .btn.animate-border .hover-border-bottom { position: absolute; left: 0; top: 0; height: 100%; width: 100%; z-index: 1; } .btn.animate-border .hover-border-bottom::before { position: absolute; content: ""; width: 0; display: block; opacity: 0; height: 55px; border-bottom: solid 2px red; right: -1px; bottom: -2px; } .btn.animate-border .hover-border-bottom::after { position: absolute; content: ""; width: 0; display: block; opacity: 0; height: 100%; border-bottom: solid 2px red; left: 0; bottom: -2px; } .btn.animated-arrow { border: none; background: transparent; min-width: 14rem; height: auto; padding: 0; } .btn.animated-arrow .circle { -webkit-transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1); transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1); position: relative; display: block; margin: 0; width: 3.5rem; height: 3.5rem; background: #2db1e3; border-radius: 2rem; } .btn.animated-arrow .circle .icon { -webkit-transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1); transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1); left: 15px; width: 1.125rem; height: 0.125rem; background: none; position: absolute; top: 0; bottom: 0; margin: auto; } .btn.animated-arrow .circle .icon::before { position: absolute; content: ""; top: -0.25rem; right: 0.0625rem; width: 0.625rem; height: 0.625rem; border-top: 0.125rem solid #ffffff; border-right: 0.125rem solid #ffffff; -webkit-transform: rotate(45deg); transform: rotate(45deg); } .btn.animated-arrow .button-text { -webkit-transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1); transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1); position: absolute; top: 0; left: 0; right: 0; bottom: 0; padding: 15px 0; margin: 0 0 0 70px; color: #ffffff; line-height: 2; text-align: left; width: 100%; font-size: 15px; text-transform: uppercase; } .btn.animated-arrow:hover { color: #ffffff; } .btn.animated-arrow:hover .circle { width: 100%; } .btn.animated-arrow:hover .circle .icon.arrow { background: #ffffff; -webkit-transform: translate(1.5rem, 0); transform: translate(1.5rem, 0); } .btn.animated-arrow:hover .button-text { color: #ffffff; } .btn.circle { border-radius: 30px !important; } .text-shine { background: -webkit-gradient(linear, left top, right top, color-stop(0, #0b5c8d), color-stop(10%, #ffffff), color-stop(20%, #2db1e3)); background: linear-gradient(to right, #0b5c8d 0, #ffffff 10%, #2db1e3 20%); background-position: 0; -webkit-background-clip: text; -webkit-text-fill-color: transparent; -webkit-animation: shine 3s infinite linear; animation: shine 3s infinite linear; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-text-size-adjust: none; font-weight: 600; font-size: 16px; text-decoration: none; white-space: nowrap; padding: 12px 48px; } .animate-inout { background: -webkit-gradient(linear, left top, right top, from(#8A6552), to(#472d20)); background: linear-gradient(90deg, #8A6552 0%, #472d20 100%); color: #ffffff; font-size: 12px; text-transform: capitalize; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: relative; overflow: hidden; border: solid 2px #2db1e3; cursor: pointer; } .animate-inout span { z-index: 1; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; line-height: 20px; } .animate-inout::before, .animate-inout::after { width: 0%; height: 0%; position: absolute; content: ""; border-radius: 100%; } .animate-inout:after { -webkit-transition: all 0.5s ease; transition: all 0.5s ease; background-color: #ffffff; } .animate-inout:before { -webkit-transition: all 0.5s ease-out; transition: all 0.5s ease-out; background: #2db1e3; } .animate-inout.animate-inout-borde { background: transparent; color: #0b5c8d; } .animate-inout.animate-inout-borde::after { background: -webkit-gradient(linear, left top, right top, from(#8A6552), to(#472d20)); background: linear-gradient(90deg, #8A6552 0%, #472d20 100%); } .animate-inout.animate-inout-borde:hover { color: #ffffff; } .animate-inout.animate-inout-borde:hover::before { -webkit-transition: all 0.5s ease-in; transition: all 0.5s ease-in; } .animate-inout.animate-inout-borde:hover::after { -webkit-transition: all 0.7s ease-in; transition: all 0.7s ease-in; } .animate-inout:hover { color: #0b5c8d; } .animate-inout:hover::before, .animate-inout:hover::after { width: 200px; height: 200px; border-radius: 4px; } .animate-inout:hover::before { -webkit-transition: all 0.5s ease-in; transition: all 0.5s ease-in; } .animate-inout:hover::after { -webkit-transition: all 0.7s ease-in; transition: all 0.7s ease-in; } .btn-md { padding: 17px 45px; font-size: 17px; } .btn-sm { padding: 14px 40px; font-size: 14px; } .btn-border-secondary { display: inline-block; border: 1px solid #e7e7e7; padding: 12px 35px; border-radius: 30px; color: #232323; } .btn-border-secondary i { display: inline-block; font-size: 12px; margin-right: 5px; } .btn-border-secondary:hover { border-color: #2db1e3; background: #2db1e3; color: #ffffff; } /* ---------------------------------- Nice Select CSS ------------------------------------*/ .nice-select { -webkit-tap-highlight-color: transparent; background-color: #fff; border: solid 1px #e8e8e8; -webkit-box-sizing: border-box; box-sizing: border-box; clear: both; cursor: pointer; display: block; float: left; font-family: inherit; font-size: 16px; font-weight: normal; height: 50px; line-height: 50px; outline: none; padding-left: 18px; padding-right: 30px; position: relative; text-align: left !important; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; white-space: nowrap; width: 100%; margin-bottom: 15px; } .nice-select:hover { border-color: #dbdbdb; } .nice-select:active, .nice-select.open, .nice-select:focus { border-color: #999; } .nice-select::after { border-bottom: 2px solid #999; border-right: 2px solid #999; content: ''; display: block; height: 5px; margin-top: -6px; pointer-events: none; position: absolute; right: 12px; top: 50%; -webkit-transform-origin: 66% 66%; transform-origin: 66% 66%; -webkit-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out; width: 5px; } .nice-select.open .list { opacity: 1; pointer-events: auto; -webkit-transform: scale(1) translateY(0); transform: scale(1) translateY(0); overflow-y: auto !important; height: auto; } .nice-select.open ::after { -webkit-transform: rotate(-135deg); transform: rotate(-135deg); } .nice-select.disabled { border-color: #ededed; color: #999; pointer-events: none; } .nice-select.disabled::after { border-color: #96aac1; } .nice-select.wide { width: 100%; } .nice-select.wide .list { left: 0 !important; right: 0 !important; } .nice-select.right { float: right; } .nice-select.right .list { left: auto; right: 0; } .nice-select.small { font-size: 12px; height: 36px; line-height: 34px; } .nice-select.small::after { height: 4px; width: 4px; } .nice-select.small .option { line-height: 34px; min-height: 34px; } .nice-select .list { background-color: #fff; border-radius: 5px; -webkit-box-shadow: 0 0 0 1px rgba(68, 68, 68, 0.11); box-shadow: 0 0 0 1px rgba(68, 68, 68, 0.11); -webkit-box-sizing: border-box; box-sizing: border-box; margin-top: 4px; opacity: 0; overflow: hidden; padding: 0; pointer-events: none; position: absolute; top: 100%; left: 0; -webkit-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-transform: scale(0.75) translateY(-21px); transform: scale(0.75) translateY(-21px); -webkit-transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity 0.15s ease-out; transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity 0.15s ease-out; z-index: 9; width: 100%; } .nice-select .list:hover .option:not(:hover) { background-color: transparent !important; } .nice-select .option { cursor: pointer; font-weight: 400; line-height: 40px; list-style: none; min-height: 40px; outline: none; padding-left: 18px; padding-right: 29px; text-align: left; -webkit-transition: all 0.2s; transition: all 0.2s; } .nice-select .option:hover, .nice-select .option.focus, .nice-select .option.selected.focus { background-color: #f6f6f6; } .nice-select .option.selected { font-weight: 600; } .nice-select .option.disabled { background-color: transparent; color: #999; cursor: default; } .no-csspointerevents .nice-select .list { display: none; } .no-csspointerevents .nice-select.open .list { display: block; } /* ---------------------------------- Template Section Styles ------------------------------------*/ /* ---------------------------------- Top Bar ------------------------------------*/ .top-bar .info i { margin-right: 5px; position: relative; top: 1px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .top-bar .info { text-align: center; } } .top-bar li { display: inline-block; margin-right: 30px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .top-bar li { margin: 0 15px; } } .top-bar .text-right li { margin-right: 0; margin-left: 20px; } .top-bar .item-flex { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .top-bar .item-flex>div { margin-right: 40px; } .top-bar .item-flex>div:last-child { margin-left: 0; } .top-bar .item-flex.text-right>div { margin-right: 0; margin-left: 40px; } .top-bar .item-flex.text-right>div:last-child { margin-left: 40px; } .top-bar .item-flex.text-right>div:first-child { margin-left: 0; } @media only screen and (min-width: 768px) and (max-width: 991px) { .top-bar .item-flex { text-align: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-top: 15px; display: none; } .top-bar .item-flex li { margin: 0 15px; } } @media only screen and (max-width: 767px) { .top-bar { display: none; } } .top-style-one { padding: 12px 0; } @media (min-width: 1200px) { .top-bar .container-fill.pr, .navbar .container-fill.pr { padding-left: 0; padding-right: 80px; } } /* Navbar Style */ @media (min-width: 1200px) { .navbar.brand-style-bg .navbar-header { padding: 51px 0; position: relative; top: -61px; margin-bottom: -70px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .navbar.brand-style-bg .navbar-header img.logo.logo-scrolled { display: none; } .navbar.brand-style-bg .navbar-header::after { position: absolute; left: 0; top: 0; content: ""; height: 100%; width: 100%; background: #2db1e3; z-index: -1; } .navbar.brand-style-bg .navbar-header::before { position: absolute; right: -30px; top: 0; content: ""; border-right: 30px solid transparent; border-bottom: 52px solid #2db1e3; opacity: 0.7; } .navbar.brand-style-bg.sticked .navbar-header { padding: 14px 0; top: 0; margin: 0; } .navbar.brand-style-bg.sticked .navbar-header .navbar-brand { padding-left: 50px; } .navbar.brand-style-bg.sticked .navbar-header img.logo.logo-scrolled { display: inline-block; } .navbar.brand-style-bg.sticked .navbar-header img.logo.logo-display { display: none; } .navbar.brand-style-bg.sticked .navbar-header::after, .navbar.brand-style-bg.sticked .navbar-header::before { display: none; } .container-fill.pr .info { padding-left: 80px; } .container-fill.pr .navbar-collapse.collapse { padding-left: 55px; } .navbar.navbar-default.attr-border-full .container-fill { padding: 0 80px; padding-right: 0; } .navbar.navbar-default.attr-border-full .navbar-header { position: relative; padding-right: 20px; } .navbar .attr-right { float: right; margin-left: 15px; } .navbar.navbar-default.attr-border-full .navbar-header .navbar-brand { padding: 15px 0; } .navbar.navbar-default.attr-border-full .navbar-header::after { position: absolute; right: 0; bottom: 0; content: ""; border-right: 1px solid rgba(255, 255, 255, 0.3); height: 100%; } .navbar.navbar-default.attr-border-full .attr-right .attr-nav li.contact { position: relative; padding: 32px 30px; margin-left: 20px; top: 0; background: #2db1e3; } .navbar.navbar-default.attr-border-full .attr-right .attr-nav li.contact::after { height: 100%; } .navbar .attr-right .attr-nav li { margin-left: 15px; } } @media (max-width: 1440px) { .navbar .attr-right .attr-nav li .call .icon{ display:none; } nav.navbar.attr-border-full ul.nav>li>a, nav.navbar.brand-center ul.nav>li>a { padding: 40px 10px; } nav.navbar ul.nav>li>a { font-size: 14px; } .navbar.navbar-default.attr-border-full .navbar-header { padding-right: 10px; } .navbar .attr-right { margin-left: 10px; } .navbar.navbar-default.attr-border-full .container-fill{ padding: 0 10px; padding-right: 0; } } @media (max-width: 1199px) { .navbar.brand-style-bg .navbar-header .navbar-brand { padding-left: 0; } .navbar.brand-style-bg .navbar-header .navbar-brand img.logo.logo-display { display: none; } } @media only screen and (min-width: 1200px) and (max-width: 1350px) { .navbar.validnavs.navbar-default .navbar-nav li a { padding: 30px 10px !important; font-size: 14px; } } @media only screen and (min-width: 1024px) and (max-width: 1199px) { .navbar.validnavs.navbar-default .navbar-nav li a { padding: 30px 8px !important; font-size: 14px; } } @media (min-width: 768px) { .navbar.no-background.top-pad-50 { margin-top: 58px !important; } } /* ---------------------------------- Banner Style ------------------------------------*/ .banner-area { height: 100%; width: 100%; position: relative; } @media (max-width: 1023px) { .banner-area { height: auto; } } .banner-area div { height: 100%; } .banner-area div.swiper-slide .row div { height: auto; } .banner-area.top-pad-80 .content { padding-top: 80px; } @media (max-width: 1023px) { .banner-area.top-pad-80 .content { padding-top: 200px; } } @media only screen and (max-width: 767px) { .banner-area.top-pad-80 .content { padding-top: 140px; } } .banner-area.top-pad-90 .content { padding-top: 90px; } @media (max-width: 1023px) { .banner-area.top-pad-90 .content { padding-top: 200px; } } @media only screen and (max-width: 767px) { .banner-area.top-pad-90 .content { padding-top: 140px; } } .banner-area.top-pad-100 .content { padding-top: 100px; } @media (max-width: 1023px) { .banner-area.top-pad-100 .content { padding-top: 200px; } } @media only screen and (max-width: 767px) { .banner-area.top-pad-100 .content { padding-top: 140px; } } .banner-area.top-pad-110 .content { padding-top: 110px; } @media (max-width: 1023px) { .banner-area.top-pad-110 .content { padding-top: 200px; } } @media only screen and (max-width: 767px) { .banner-area.top-pad-110 .content { padding-top: 140px; } } .banner-area.top-pad-120 .content { padding-top: 120px; } @media (max-width: 1023px) { .banner-area.top-pad-120 .content { padding-top: 200px; } } @media only screen and (max-width: 767px) { .banner-area.top-pad-120 .content { padding-top: 140px; } } .banner-area.top-pad-130 .content { padding-top: 130px; } @media (max-width: 1023px) { .banner-area.top-pad-130 .content { padding-top: 200px; } } @media only screen and (max-width: 767px) { .banner-area.top-pad-130 .content { padding-top: 140px; } } .banner-area.top-pad-150 .content { padding-top: 150px; } @media (max-width: 1023px) { .banner-area.top-pad-150 .content { padding-top: 200px; } } @media only screen and (max-width: 767px) { .banner-area.top-pad-150 .content { padding-top: 140px; } } .banner-area.auto-height { height: auto; } .banner-area.auto-height div { height: auto; } .banner-area.auto-height .content { padding: 200px 0; } @media only screen and (max-width: 767px) { .banner-area.auto-height .content { padding: 60px 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .banner-area.auto-height .content { padding: 120px 0; } } .banner-area.auto-height .content .thumb { padding-left: 35px; } @media (max-width: 991px) { .banner-area.auto-height .content .thumb { padding-left: 0; margin-top: 50px; } } .banner-area.auto-height.inc-header-transparent .content { padding-top: 250px; } @media only screen and (max-width: 767px) { .banner-area.auto-height.inc-header-transparent .content { padding-top: 140px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .banner-area.auto-height.inc-header-transparent .content { padding-top: 220px; } } .banner-area.auto-height.inc-header-transparent.double-items.bottom-thumb .content .info { padding-top: 80px; } .banner-area.auto-height.inc-header-transparent.double-items.bottom-thumb .content .thumb { margin-top: 250px; } @media only screen and (max-width: 767px) { .banner-area.auto-height.inc-header-transparent.double-items.bottom-thumb .content .thumb { margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .banner-area.auto-height.inc-header-transparent.double-items.bottom-thumb .content .thumb { margin-top: 50px; } } .banner-area .content { position: relative; z-index: 9; -webkit-transition: all 500ms ease; transition: all 500ms ease; } @media (max-width: 1023px) { .banner-area .content { padding: 120px 0; } } @media only screen and (max-width: 767px) { .banner-area .content { padding: 60px 0; } } .banner-area h4 { -webkit-transition: all 500ms ease; transition: all 500ms ease; -webkit-transform: translate3d(-15%, 0, 0); transform: translate3d(-15%, 0, 0); opacity: 0; visibility: hidden; } .banner-area h2 { -webkit-transition: all 500ms ease; transition: all 500ms ease; -webkit-transform: translateY(-50%); transform: translateY(-50%); opacity: 0; visibility: hidden; } .banner-area p { -webkit-transition: all 500ms ease; transition: all 500ms ease; -webkit-transform: translateY(50%); transform: translateY(50%); opacity: 0; padding-right: 25%; margin: 0; visibility: hidden; } @media (max-width: 1023px) { .banner-area p { padding-right: 0; } } .banner-area.text-center p { padding-left: 13%; padding-right: 13%; } @media (max-width: 1023px) { .banner-area.text-center p { padding: 0; } } .banner-area .thumb { -webkit-transition: all 500ms ease; transition: all 500ms ease; opacity: 0; visibility: hidden; } .banner-area .button { -webkit-transition: all 500ms ease; transition: all 500ms ease; -webkit-transform: translateY(50%); transform: translateY(50%); opacity: 0; visibility: hidden; margin-top: 30px; } .banner-area .banner-slide h4 { -webkit-transform: translateY(50%); transform: translateY(50%); } .banner-area .banner-slide h2 { -webkit-transform: translateY(50%); transform: translateY(50%); } .banner-area .banner-slide p { -webkit-transform: translateY(50%); transform: translateY(50%); } .banner-area .banner-slide .button { -webkit-transform: translateY(50%); transform: translateY(50%); } .banner-area .banner-slide .swiper-slide.swiper-slide-active h4 { -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition-delay: 1200ms; transition-delay: 1200ms; } .banner-area .banner-slide .swiper-slide.swiper-slide-active h2 { -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition-delay: 1400ms; transition-delay: 1400ms; } .banner-area .banner-slide .swiper-slide.swiper-slide-active p { -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition-delay: 1600ms; transition-delay: 1600ms; } .banner-area .banner-slide .swiper-slide.swiper-slide-active .button { -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition-delay: 1800ms; transition-delay: 1800ms; } .banner-area.double-items .thumb { -webkit-transform: translateY(50%); transform: translateY(50%); } .banner-area.double-items .swiper-slide.swiper-slide-active .thumb { -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition-delay: 500ms; transition-delay: 500ms; visibility: visible; opacity: 1; } .banner-area.double-items.bottom-thumb .content { padding: 0; } .banner-area.double-items.bottom-thumb .content .thumb { margin-top: 120px; } @media only screen and (max-width: 767px) { .banner-area.double-items.bottom-thumb .content { padding: 50px 0; } .banner-area.double-items.bottom-thumb .content .thumb { margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .banner-area.double-items.bottom-thumb .content { padding: 120px 0; } .banner-area.double-items.bottom-thumb .content .thumb { margin-top: 50px; } } .banner-area.zoom-effect .banner-thumb { -webkit-transition: 10s ease-out; transition: 10s ease-out; -webkit-transform: scale(1.1); transform: scale(1.1); position: absolute; left: 0; top: 0; content: ""; height: 100%; width: 100%; } .banner-area.zoom-effect .swiper-slide.swiper-slide-active .banner-thumb { -webkit-transform: scale(1); transform: scale(1); } .banner-area .swiper-notification { display: none; } .banner-area .swiper-slide.swiper-slide-active h4 { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; visibility: visible; -webkit-transition-delay: 800ms; transition-delay: 800ms; } .banner-area .swiper-slide.swiper-slide-active h2 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; visibility: visible; -webkit-transition-delay: 1600ms; transition-delay: 1600ms; } .banner-area .swiper-slide.swiper-slide-active p { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; visibility: visible; -webkit-transition-delay: 2400ms; transition-delay: 2400ms; } .banner-area .swiper-slide.swiper-slide-active .button { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; visibility: visible; -webkit-transition-delay: 3200ms; transition-delay: 3200ms; } .banner-area.banner-style-one .swiper-slide.swiper-slide-active .button { -webkit-transition-delay: 2400ms; transition-delay: 2400ms; } .banner-area .banner-items { position: relative; width: 100%; height: 100%; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-box-sizing: content-box; box-sizing: content-box; -webkit-transform: translate3d(0px, 0, 0); transform: translate3d(0px, 0, 0); } .banner-area:hover .swiper-button-prev, .banner-area:hover .swiper-button-next { opacity: 1; } .banner-area:hover .swiper-button-prev { left: 30px; right: auto; } .banner-area:hover .swiper-button-next { right: 30px; left: auto; } .banner-area .swiper-button-prev, .banner-area .swiper-button-next { height: auto; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; opacity: 0; } .banner-area .swiper-button-prev::after, .banner-area .swiper-button-next::after { font-size: 28px; color: #ffffff; } .banner-area.navigation-circle .swiper-button-prev, .banner-area.navigation-circle .swiper-button-next { height: 60px; width: 60px; line-height: 60px; background: rgba(0, 0, 0, 0.5); border-radius: 50%; } .banner-area.navigation-circle .swiper-button-prev::after, .banner-area.navigation-circle .swiper-button-next::after { font-size: 18px; } .banner-area.navigation-right-bottom .swiper-button-prev, .banner-area.navigation-right-bottom .swiper-button-next { left: auto; right: 30px; opacity: 1; top: auto; -webkit-transform: inherit; transform: inherit; bottom: 50px; border-radius: inherit; } .banner-area.navigation-right-bottom .swiper-button-prev { right: 92px; } .banner-area.navigation-between-bottom .content { padding-bottom: 105px; } @media only screen and (min-width: 829px) and (max-width: 1023px) { .banner-area.navigation-between-bottom .content { padding-bottom: 220px; } } .banner-area.navigation-between-bottom .swiper-button-prev, .banner-area.navigation-between-bottom .swiper-button-next { left: auto; right: 30px; opacity: 1; top: auto; -webkit-transform: inherit; transform: inherit; bottom: 30px; border-radius: inherit; } .banner-area.navigation-between-bottom .swiper-button-prev { left: 30px; right: auto; } @media only screen and (max-width: 830px) { .banner-area .swiper-button-prev, .banner-area .swiper-button-next { display: none; } } .banner-area.navigation-custom .swiper-button-prev::after { font-family: 'ElegantIcons'; content: "\23"; font-size: 22px; } .banner-area.navigation-custom .swiper-button-next::after { font-family: 'ElegantIcons'; content: "\24"; font-size: 22px; } .banner-area.navigation-text .swiper-button-prev, .banner-area.navigation-text .swiper-button-next { opacity: 1; top: auto; -webkit-transform: inherit; transform: inherit; left: auto; right: 0; bottom: 0; display: inline-block; width: 150px; background: rgba(0, 0, 0, 0.2); text-align: center; height: 100px; line-height: 100px; } @media only screen and (max-width: 830px) { .banner-area.navigation-text .swiper-button-prev, .banner-area.navigation-text .swiper-button-next { display: none; } } .banner-area.navigation-text .swiper-button-prev { right: 151px; } .banner-area.navigation-text .swiper-button-prev::after { font-family: 'Titillium Web', sans-serif; content: "Prev"; text-transform: uppercase !important; font-size: 16px; font-weight: 600; letter-spacing: 0.6px; } .banner-area.navigation-text .swiper-button-next::after { font-family: 'Titillium Web', sans-serif; content: "Next"; text-transform: uppercase !important; font-size: 16px; font-weight: 600; letter-spacing: 0.6px; } .banner-area.navigation-icon-solid .swiper-button-prev::after, .banner-area.navigation-icon-solid .swiper-button-next::after { font-size: 30px; } .banner-area.navigation-custom-large .swiper-button-prev, .banner-area.navigation-custom-large .swiper-button-next { min-width: 65px; height: 30px; margin: 0; } .banner-area.navigation-custom-large .swiper-button-prev::after { font-family: "Font Awesome 5 Pro"; content: "\f104"; font-weight: 100; font-size: 30px; position: absolute; left: 8px; } .banner-area.navigation-custom-large .swiper-button-prev::before { position: absolute; top: 50%; right: inherit; bottom: inherit; left: 12px; content: ""; height: 2px; width: 50px; z-index: -1; background-color: #ffffff; margin-top: -1px; } .banner-area.navigation-custom-large .swiper-button-next::after { font-family: "Font Awesome 5 Pro"; content: "\f105"; font-weight: 100; font-size: 30px; position: absolute; right: 8px; } .banner-area.navigation-custom-large .swiper-button-next::before { position: absolute; top: 50%; right: 12px; bottom: inherit; left: inherit; content: ""; height: 2px; width: 50px; z-index: -1; background-color: #ffffff; margin-top: -1px; } .banner-area.navigation-right-botom .swiper-button-prev, .banner-area.navigation-right-botom .swiper-button-next { position: absolute; left: auto; right: 30px; top: auto; bottom: 40px; opacity: 1; -webkit-transform: inherit; transform: inherit; } .banner-area.navigation-right-botom .swiper-button-prev { right: 60px; } .banner-area.navigation-right-botom.navigation-custom-large .swiper-button-prev, .banner-area.navigation-right-botom.navigation-custom-large .swiper-button-next { bottom: 30px; } .banner-area.navigation-right-botom.navigation-custom-large .swiper-button-prev { right: 100px; } .banner-area .swiper-pagination { height: auto; bottom: 35px; } .banner-area .swiper-pagination span.swiper-pagination-bullet { height: 4px; width: 50px; background: rgba(255, 255, 255, 0.5); opacity: 1; border-radius: inherit; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .banner-area .swiper-pagination span.swiper-pagination-bullet.swiper-pagination-bullet-active { background: white; height: 7px; } @media only screen and (max-width: 767px) { .banner-area.include-pagination .content { padding-bottom: 100px; } } .banner-area .swiper-pagination-fraction span { -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .banner-area .swiper-pagination-fraction span.swiper-pagination-current { font-size: 30px; font-family: 'Titillium Web', sans-serif; font-weight: 600; } /* Banner Style One */ .banner-style-one { overflow: hidden; position: relative; z-index: 1; } .banner-style-one .banner-angle-shape .shape-item { position: absolute; right: -300px; bottom: -400px; height: 0; width: 600px; background: linear-gradient(-45deg, #5410ba 45%, #2db1e3 100%); z-index: 1; -webkit-transform: rotate(35deg); transform: rotate(35deg); opacity: 0; -webkit-transition: all 1000ms ease; transition: all 1000ms ease; -webkit-box-shadow: 0px 0px 10px #232931; box-shadow: 0px 0px 10px #232931; -webkit-transition-delay: 800ms; transition-delay: 800ms; } .banner-style-one .banner-angle-shape .shape-item:first-child { z-index: 2; } .banner-style-one .banner-angle-shape .shape-item:nth-child(2) { height: 0; width: 2200px; bottom: 399px; right: -350px; background: -webkit-gradient(linear, left top, right top, color-stop(30%, #2db1e3), color-stop(70%, rgba(0, 0, 0, 0))); background: linear-gradient(90deg, #2db1e3 30%, rgba(0, 0, 0, 0) 70%); -webkit-transition-delay: 3000ms; transition-delay: 3000ms; -webkit-transform: rotate(65deg); transform: rotate(65deg); } .banner-style-one .banner-angle-shape .shape-item:nth-child(3) { height: 0; width: 2200px; bottom: 400px; right: -224px; background: -webkit-gradient(linear, left top, right top, color-stop(10%, #2db1e3), color-stop(80%, rgba(0, 0, 0, 0))); background: linear-gradient(90deg, #2db1e3 10%, rgba(0, 0, 0, 0) 80%); -webkit-transition-delay: 3800ms; transition-delay: 3800ms; -webkit-transform: rotate(65deg); transform: rotate(65deg); -webkit-box-shadow: inherit; box-shadow: inherit; } @media only screen and (max-width: 767px) { .banner-style-one .banner-angle-shape .shape-item { display: none; } } .banner-style-one.swiper-slide-visible .banner-angle-shape .shape-item { height: 1000px; opacity: 0.7; } .banner-style-one.swiper-slide-visible .banner-angle-shape .shape-item:nth-child(2) { height: 150px; opacity: 1; } .banner-style-one.swiper-slide-visible .banner-angle-shape .shape-item:nth-child(3) { height: 100px; opacity: 1; } /* Banner Style Custom */ .banner-area h2 { font-size: 80px; line-height: 1; margin-bottom: 25px; font-weight: 300; } .banner-area h2 strong { display: block; font-weight: 600; } @media only screen and (max-width: 767px) { .banner-area h2 { font-size: 40px; } } .banner-area h4 { font-weight: 600; text-transform: uppercase; margin-bottom: 20px; font-size: 22px; } @media only screen and (max-width: 767px) { .banner-area h4 { font-size: 18px; } } .banner-area p { font-size: 18px; line-height: 30px; } .banner-area.banner-style-two .content h2 { font-size: 70px; font-weight: 600; } .banner-area.banner-style-two .content h2 strong { font-weight: 600; font-size: 90px; } @media only screen and (max-width: 767px) { .banner-area.banner-style-two .content h2 { font-size: 30px; } .banner-area.banner-style-two .content h2 strong { font-size: 36px; margin-top: 15px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .banner-area.banner-style-two .content h2 strong { font-size: 70px; } } .banner-area.banner-style-two .swiper-slide { overflow: hidden; } .banner-area.banner-style-two .swiper-slide::before { position: absolute; left: 5%; top: 50%; content: ""; height: 500px; width: 500px; background: #2db1e3; -webkit-transform: translateY(0); transform: translateY(0); background-size: 220% 150%; opacity: 0; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; -webkit-transition-delay: 900ms; transition-delay: 900ms; border-radius: 50%; filter: blur(80px); -webkit-filter: blur(80px); } .banner-area.banner-style-two .swiper-slide.swiper-slide-active { opacity: 1; } .banner-area.banner-style-two .swiper-slide.swiper-slide-active::before { opacity: 0.3; -webkit-transform: translateY(-50%); transform: translateY(-50%); margin-top: 30px; } .banner-style-three { padding-top: 220px; } @media only screen and (max-width: 991px) { .banner-style-three { padding: 0 15px; } } .banner-style-three img { padding-left: 50px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .banner-style-three img { padding-left: 0; display: none; } } @media only screen and (max-width: 767px) { .banner-style-three img { padding-left: 0; display: none; } } .banner-style-three .info { margin-top: -100px; } .banner-style-three .info h4 { font-size: 24px; } .banner-style-three .info h2 { font-size: 80px; line-height: 1; font-weight: 600; margin-bottom: 25px; } @media only screen and (max-width: 767px) { .banner-style-three .info h2 { font-size: 36px; line-height: 1.2; margin-bottom: 0; } } .banner-style-three .info .btn { margin-top: 25px; } .banner-style-three .info p { opacity: 0.8; padding-right: 7%; font-size: 18px; line-height: 1.9; margin: 0; } .banner-style-three-area { position: relative; overflow: hidden; z-index: 1; } @media only screen and (min-width: 768px) and (max-width: 991px) { .banner-style-three-area { padding-top: 300px; padding-bottom: 120px; } } @media only screen and (max-width: 767px) { .banner-style-three-area { padding-top: 250px; padding-bottom: 60px; } } .banner-style-three-area .shape { position: absolute; left: 0; top: 120px; content: ""; height: 100%; width: 100%; background-size: cover; background-position: bottom center; z-index: -1; } .banner-style-four-area { height: 100%; position: relative; } @media only screen and (max-width: 991px) { .banner-style-four-area { height: auto; } } .banner-style-four-area div { height: 100%; } @media only screen and (max-width: 991px) { .banner-style-four-area div { height: auto; } } .banner-style-four-area .banner-items .row div { height: auto; } @media only screen and (min-width: 768px) and (max-width: 991px) { .banner-style-four-area .banner-items { padding: 120px 0; } } @media only screen and (max-width: 767px) { .banner-style-four-area .banner-items { padding: 60px 0; } } .banner-style-four-area .banner-thumb { position: absolute; right: 0; top: 0; height: 100% !important; width: 46%; background-size: cover; background-position: center top; } .banner-style-four-area .thumb { position: relative; z-index: 1; padding: 50px; } .banner-style-four-area .thumb img { border-radius: 50%; } .banner-style-four-area .thumb::after { position: absolute; right: 25px; bottom: 30px; content: ""; height: 90%; width: 90%; background: #2db1e3; z-index: -1; border-radius: 50%; opacity: 0.3; } @media only screen and (max-width: 991px) { .banner-style-four-area .thumb { display: none; } } .banner-style-four-area .title { font-size: 60px; line-height: 1; font-weight: 300; } @media only screen and (max-width: 767px) { .banner-style-four-area .title { font-size: 30px; line-height: 1.2; } } .banner-style-four-area .title strong { display: block; font-weight: 600; font-size: 65px; } @media only screen and (max-width: 767px) { .banner-style-four-area .title strong { font-size: 36px; } } .banner-style-four-area p { font-size: 18px; padding-right: 15%; line-height: 32px; margin-top: 30px; margin-bottom: 0; color: #cccccc; } .banner-style-four-area .button { margin-top: 30px; } /* Banner Style FIve */ .banner-style-five-area { position: relative; z-index: 1; } .banner-style-five-area .banner-items { padding-top: 180px; } .banner-style-five-area .banner-shape-bottom { background-size: contain; position: absolute; left: 0; bottom: 0; height: 100%; width: 100%; background-position: bottom center; z-index: -1; background-repeat: no-repeat; } .banner-style-five h2 { font-size: 60px; font-weight: 600; margin-bottom: 25px; } @media only screen and (max-width: 767px) { .banner-style-five h2 { font-size: 36px; } } .banner-style-five p { padding: 0 20%; opacity: 0.9; margin: 0; } @media only screen and (max-width: 767px) { .banner-style-five p { padding: 0; } } .banner-style-five .button { margin-top: 30px; } .banner-style-five .thumb img { margin-top: 60px; } @media only screen and (min-width: 1024px) { .banner-style-five .thumb img { max-width: 120%; width: 110%; margin-left: -5%; } } .banner-style-five .video-play-button.with-text .effect, .banner-style-five .video-play-button.with-text .effect::after { background: #1a29ff; } .banner-style-six-area { height: 100%; background-size: 50%, contain; background-position: right bottom; background-repeat: no-repeat; overflow: inherit; position: relative; } @media only screen and (max-width: 991px) { .banner-style-six-area { height: auto; background-position: right top; } } .banner-style-six-area .animate-shape { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; } .banner-style-six-area .animate-shape img { position: absolute; } .banner-style-six-area .animate-shape img:first-child { opacity: 0.3; height: 200px; } .banner-style-six-area .animate-shape img:nth-child(2) { position: absolute; left: 50%; bottom: 0; -webkit-animation: spinner 30s infinite linear; animation: spinner 30s infinite linear; margin-left: -80px; } .banner-style-six-area div { height: 100%; } .banner-style-six-area .row.align-center { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .banner-style-six-area .row div { height: auto; } @media only screen and (max-width: 991px) { .banner-style-six-area .banner-items { padding-top: 160px; } } @media only screen and (max-width: 767px) { .banner-style-six-area .banner-items { padding-top: 100px; } } .banner-style-six .info { padding-top: 50px; } .banner-style-six .thumb { position: relative; z-index: 1; } .banner-style-six .thumb img { max-width: 110%; margin-top: 90px; } .banner-style-six .thumb img:nth-child(2) { position: absolute; left: 0; bottom: -50px; -webkit-animation: spinner 30s infinite linear; animation: spinner 30s infinite linear; margin-left: -100px; } @media only screen and (max-width: 991px) { .banner-style-six .thumb img { max-width: 80%; margin: auto; } } @media only screen and (max-width: 991px) { .banner-style-six .thumb { text-align: center; margin-top: 50px; } } .banner-style-six h4 { color: #2db1e3; font-weight: 600; background: -webkit-gradient(linear, left top, right top, from(#2db1e3), color-stop(#0b5c8d), to(#2db1e3)); background: linear-gradient(to right, #2db1e3, #0b5c8d, #2db1e3); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-size: 220% 150%; display: inline-block; position: relative; z-index: 1; margin-bottom: 20px; } .banner-style-six h2 { font-size: 70px; line-height: 1; font-weight: 300; margin-bottom: 30px; } @media only screen and (max-width: 767px) { .banner-style-six h2 { font-size: 36px; line-height: 1.2; } } .banner-style-six h2 strong { display: block; font-weight: 600; text-transform: uppercase; font-size: 100px; } @media only screen and (max-width: 767px) { .banner-style-six h2 strong { font-size: 36px; } } .banner-style-six p { padding-right: 20%; font-size: 18px; line-height: 1.7; } /* ---------------------------------- About Style ------------------------------------*/ .about-area { position: relative; z-index: 1; padding-top: 60px; padding-bottom: 60px; } .about-area .shape-animated { position: absolute; right: 50px; top: 80px; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: cubic-bezier(0.54, 0.085, 0.5, 0.92); animation-timing-function: cubic-bezier(0.54, 0.085, 0.5, 0.92); -webkit-animation-name: UpDown; animation-name: UpDown; -webkit-animation-duration: 4s; animation-duration: 4s; } @media only screen and (max-width: 767px) { .about-area .shape-animated { display: none; } } .about-area .shape-right-bottom { position: absolute; right: 0; bottom: 0; opacity: 0.3; z-index: -1; } .about-area .shape-right-bottom img { height: 100%; width: 100%; } .about-area .experience { position: relative; padding-top: 35px; margin-top: 70px; padding-bottom: 15px; display: block; } @media (max-width: 1399px) { .about-area .experience { display: none; } } @media only screen and (min-width: 1200px) and (max-width: 1399px) { .about-area.default-padding-top { padding-bottom: 110px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .about-area.default-padding-top { padding-bottom: 110px; } } .about-style-one .thumb { position: relative; } .about-style-one .thumb .experience { z-index: 1; position: absolute; left: 0; right: 50%; bottom: 60px; background: -webkit-gradient(linear, left top, right top, from(#0b5c8d), color-stop(#2db1e3), to(#0b5c8d)); background: linear-gradient(to right, #0b5c8d, #2db1e3, #0b5c8d); background-size: 220% 150%; padding: 30px; margin-right: -35px; } .about-style-one .thumb .experience h2 { margin: 0; color: #ffffff; font-weight: 400; line-height: 1.1; } .about-style-one .thumb .experience h2 strong { display: block; -webkit-text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-stroke: 1px #ffffff; font-size: 75px; font-weight: 900; } .about-style-one .thumb .shape { position: absolute; } .about-style-one .thumb .shape:first-child { left: 50%; top: 0; height: 100%; width: 15px; background: #ffffff; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .about-style-one .thumb .shape:nth-child(2) { right: 0; top: 0; height: 60px; width: 50%; background: #ffffff; } .about-style-one .thumb .shape:nth-child(3) { right: 50%; bottom: 0; height: 120px; width: 53%; background: #ffffff; margin-right: -7px; } @media only screen and (min-width: 1400px) { .about-style-one .thumb .shape:nth-child(3) { background: #e7edf8; } } @media only screen and (max-width: 767px) { .about-style-one .thumb .shape { display: none; } } .about-style-one>.info { margin-top: 55px; } @media only screen and (max-width: 767px) { .about-style-one>.info { margin-top: 30px; } } .award { z-index: 1; position: absolute; left: -50px; right: 50%; bottom: 60px; background: -webkit-gradient(linear, left top, right top, from(#0b5c8d), color-stop(#2db1e3), to(#0b5c8d)); background: linear-gradient(to right, #0b5c8d, #2db1e3, #0b5c8d); background-size: 220% 150%; padding: 30px; margin-right: -50px; display: -webkit-box; display: -ms-flexbox; display: flex; } .award i { display: inline-block; color: #ffffff; font-size: 80px; margin-right: 20px; font-weight: 100; } .award h4 { font-weight: 600; color: #ffffff; } .award p { color: #dddddd; margin: 0; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .award { left: 0; bottom: 30px; right: 35%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .award { left: 0; bottom: 0; } } @media only screen and (max-width: 767px) { .award { left: 0; bottom: 0; display: none; } } .shape-left-top { position: absolute; left: 0; top: 0; height: 500px; width: 500px; background-size: contain; z-index: -1; background-repeat: no-repeat; } .short-feature-list { display: -webkit-box; display: -ms-flexbox; display: flex; margin: 0 -15px; } .short-feature-list h4 { padding-left: 40px; position: relative; z-index: 1; } .short-feature-list h4::after { position: absolute; left: 0; top: 0; content: "\f00c"; font-family: "Font Awesome 5 Pro"; height: 25px; width: 25px; line-height: 25px; text-align: center; background: -webkit-gradient(linear, left top, right top, from(#2db1e3), color-stop(#0b5c8d), to(#2db1e3)); background: linear-gradient(to right, #2db1e3, #0b5c8d, #2db1e3); color: #ffffff; font-size: 13px; border-radius: 50%; background-size: 200% 150%; } .short-feature-list li { padding: 0 15px; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; margin-top: 30px; position: relative; } .short-feature-list li a { display: inline-block; font-weight: 600; color: #232323; font-size: 22px; } .short-feature-list li a:hover { color: #2db1e3; } .short-feature-list li p { margin: 0; } @media only screen and (max-width: 550px) { .short-feature-list li p { padding-left: 40px; } } .short-feature-list li i { display: inline-block; font-weight: 600; font-size: 19px; position: relative; top: 2px; padding-left: 18px; } .short-feature-list li i::after { position: absolute; right: 3px; top: 50%; content: ""; width: 20px; border: 1px solid; z-index: -1; -webkit-transform: translateY(-50%); transform: translateY(-50%); } @media only screen and (max-width: 550px) { .short-feature-list li { width: 100%; } } @media only screen and (max-width: 550px) { .short-feature-list { display: block; } } .blur-bg { position: absolute; right: 80px; top: 80px; height: 300px; width: 300px; background: -webkit-gradient(linear, left top, right top, from(#2db1e3), color-stop(#0b5c8d), to(#2db1e3)); background: linear-gradient(to right, #2db1e3, #0b5c8d, #2db1e3); z-index: -1; background-size: 220% 150%; border-radius: 50%; filter: blur(80px); opacity: 0.1; -webkit-filter: blur(80px); } @media only screen and (min-width: 768px) and (max-width: 991px) { .blur-bg { display: none; } } @media only screen and (max-width: 767px) { .blur-bg { display: none; } } .experience { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .experience .left { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .experience h2 { font-size: 200px; line-height: 140px; margin: 0; font-weight: 900; margin-right: 15px; text-shadow: -5px 5px 0px #eceefe; position: relative; top: -85px; margin-bottom: -120px; color: transparent; -webkit-text-stroke: 2px #666666; } .experience h4 { font-weight: 600; margin: 0; } .about-style-two { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; height: 100%; padding-left: 30px; } .about-style-two .thumb { position: relative; z-index: 1; text-align: center; margin-left: 80px; margin-right: 50px; } .about-style-two .thumb .shape { position: absolute; right: 80px; top: 50px; z-index: -1; width: 100%; } .about-style-two .thumb .fun-fact { position: absolute; left: -80px; top: 34%; background: #2db1e3; -webkit-box-shadow: 0px 2px 12px 0px #e7e7e7; box-shadow: 0px 2px 12px 0px #e7e7e7; padding: 20px 50px; padding-bottom: 17px; background-size: 220% 150%; } .about-style-two .thumb .fun-fact .counter { font-size: 30px; font-weight: 600; color: #ffffff; margin: 0; } .about-style-two .thumb .fun-fact .counter .operator { font-size: 30px; } .about-style-two .thumb .fun-fact .medium { color: #fbf6f6; font-weight: 400; } .about-style-two .thumb .fun-fact::after { position: absolute; right: 15px; bottom: -19px; content: ""; height: 20px; width: 20px; background: #2db1e3; -webkit-clip-path: polygon(100% 0, 0 0, 100% 100%); clip-path: polygon(100% 0, 0 0, 100% 100%); } @media only screen and (min-width: 768px) and (max-width: 991px) { .about-style-two .thumb { margin-right: 0; margin-bottom: 50px; display: none; } } @media only screen and (max-width: 767px) { .about-style-two .thumb { margin-right: 0; margin-bottom: 30px; display: none; } } .about-style-two ul { margin-top: 30px; margin-bottom: 50px; } .about-style-two ul li { font-size: 17px; font-weight: 600; color: #232323; position: relative; padding-left: 40px; margin-top: 10px; } .about-style-two ul li::after { position: absolute; left: 0; top: 0; content: "\f00c"; font-family: "Font Awesome 5 Pro"; font-size: 11px; height: 25px; width: 25px; line-height: 25px; border: 1px solid #e7e7e7; text-align: center; border-radius: 5px; color: #2db1e3; font-weight: 600; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .about-style-two ul { margin-bottom: 110px; } } .about-style-two .expertise { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; bottom: -50px; margin-top: -50px; padding-right: 50px; border-radius: 30px; position: relative; z-index: 1; background-size: 70%; background-position: right; } .about-style-two .expertise .left { padding: 50px; background: #ffffff; border-radius: 30px 0 0 30px; border: 1px solid #e7e7e7; } .about-style-two .expertise .left h2 { font-size: 20px; color: #232323; margin: 0; } .about-style-two .expertise .left h2 strong { display: block; font-size: 80px; line-height: 1; } @media only screen and (max-width: 767px) { .about-style-two .expertise .left h2 { color: #ffffff; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .about-style-two .expertise .left { width: 50%; text-align: center; } } @media only screen and (max-width: 767px) { .about-style-two .expertise .left { background: transparent; border: none; padding: 0; margin-bottom: 20px; border-bottom: 1px solid; border-radius: 0; padding-bottom: 20px; display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .about-style-two .expertise .right { position: relative; left: -6%; } } .about-style-two .expertise::after { position: absolute; right: 0; top: 0; content: ""; height: 100%; width: 80%; background: #0b5c8d; z-index: -1; opacity: 0.5; border-radius: 30px; } @media only screen and (max-width: 767px) { .about-style-two .expertise::after { height: 100%; width: 100%; } } @media only screen and (max-width: 767px) { .about-style-two .expertise { display: block; bottom: 0; margin: 0; margin-bottom: 50px; text-align: center; background-size: cover; padding: 50px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .about-style-two .expertise { display: none; } } .about-solid-thumb .thumb-shape .shape:nth-child(3) { display: none; } .bg-gray .about-style-two ul li::after { position: absolute; left: 0; top: 0; content: "\f00c"; font-family: "Font Awesome 5 Pro"; font-size: 11px; height: 25px; width: 25px; line-height: 25px; border: 1px solid #9cbfff; text-align: center; border-radius: 5px; color: #2db1e3; font-weight: 600; } @media only screen and (max-width: 767px) { .shape-left-top { display: none; } } .thumb-style-three { position: relative; } .thumb-style-three img { } @media only screen and (max-width: 767px) { .thumb-style-three img { padding: 0; width: 100%; margin-bottom: 30px; } } .thumb-style-three img:nth-child(2) { float: right; margin-top: 200px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .thumb-style-three img { margin-bottom: 50px; padding-right: 0; } .thumb-style-three img:first-child { padding-right: 15px; } .thumb-style-three img:nth-child(2) { padding-left: 15px; } } @media only screen and (max-width: 767px) { .thumb-style-three img:nth-child(2) { display: none; } } .thumb-style-three .experience { position: absolute; right: 0; top: 0; width: 50%; display: block; text-align: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .thumb-style-three .experience img { width: 80%; } @media only screen and (max-width: 767px) { .thumb-style-three .experience { display: none; } } .about-style-three button.accordion-button { background: transparent; color: #232323; border: none; -webkit-box-shadow: inherit; box-shadow: inherit; padding-left: 0; font-size: 20px; font-weight: 600; } .about-style-three button.accordion-button::after { background: transparent; content: "\f107"; font-family: "Font Awesome 5 Pro"; font-weight: 100; } .about-style-three button.accordion-button:not(.collapsed)::after { -webkit-transform: inherit; transform: inherit; content: "\f106"; } .about-style-three button.accordion-button:focus { background: transparent; color: #232323; border: none; -webkit-box-shadow: inherit; box-shadow: inherit; padding-left: 0; font-size: 20px; font-weight: 600; } .about-style-three .accordion-item { background: transparent; border: none; border-bottom: 1px solid #e7e7e7; } .about-style-three .accordion-item h2 { margin: 0; } .about-style-three .accordion-body { border-top: 1px solid #e7e7e7; padding-left: 0; } .about-style-three .accordion-body p { color: #666666; } .about-style-three h2 { font-weight: 600; margin-bottom: 25px; } .about-style-three p { opacity: 0.8; } .about-style-three-area.bg-dark .about-style-three button.accordion-button { color: #ffffff; } .about-style-three-area.bg-dark .about-style-three button.accordion-button:focus { color: #ffffff; } .about-style-three-area.bg-dark .about-style-three .accordion-item { border-bottom: 1px solid rgba(255, 255, 255, 0.2); } .about-style-three-area.bg-dark .about-style-three .accordion-body { border-top: 1px solid rgba(255, 255, 255, 0.2); padding-left: 0; } .about-style-three-area.bg-dark .about-style-three .accordion-body p { opacity: 0.8; color: #ffffff; } .about-style-four .thumb { position: relative; z-index: 1; } .about-style-four .thumb img { border-radius: 50%; } @media only screen and (max-width: 991px) { .about-style-four .thumb { margin-left: 15px; margin-right: 15px; margin-bottom: 50px; } } .about-style-four ul li { position: relative; z-index: 1; padding-left: 38px; margin-top: 20px; font-size: 18px; line-height: 1.7; } .about-style-four ul li::after { position: absolute; left: 0; top: 2px; content: "\f00c"; font-family: "Font Awesome 5 Pro"; height: 25px; width: 25px; line-height: 25px; text-align: center; background: -webkit-gradient(linear, left top, right top, from(#0b5c8d), color-stop(#2db1e3), to(#0b5c8d)); background: linear-gradient(to right, #0b5c8d, #2db1e3, #0b5c8d); color: #ffffff; font-size: 13px; border-radius: 50%; background-size: 200% 150%; -webkit-box-shadow: 0 10px 13px rgba(46, 151, 0, 0.21); box-shadow: 0 10px 13px rgba(46, 151, 0, 0.21); } .about-style-four ul li:nth-child(2)::after { background: -webkit-gradient(linear, left top, right top, from(#F3001D), to(#FFB400)); background: linear-gradient(to right, #F3001D, #FFB400); } .about-style-four ul li:nth-child(3)::after { background: -webkit-gradient(linear, left top, right top, from(#00F511), to(#2E9700)); background: linear-gradient(to right, #00F511, #2E9700); } .shape-move { background: #2db1e3; -webkit-animation: infiniteMove 8s ease-in-out infinite; animation: infiniteMove 8s ease-in-out infinite; border-radius: 50%; height: 90%; -webkit-transition: all 1s ease-in-out; transition: all 1s ease-in-out; width: 100%; position: absolute; bottom: 42px; z-index: 0; left: -9px; z-index: -1; } .shape-move:nth-child(2) { background: #232323; -webkit-animation: infiniteMove2 8s ease-in-out infinite; animation: infiniteMove2 8s ease-in-out infinite; border-radius: 50%; height: 97%; -webkit-transition: all 1s ease-in-out; transition: all 1s ease-in-out; width: 76%; position: absolute; top: 13px; z-index: 0; left: 13px; z-index: -1; opacity: 0.3; } .about-style-five-area { position: relative; z-index: 1; } .about-style-five-area::after { position: absolute; right: -150px; bottom: -150px; content: ""; height: 500px; width: 500px; z-index: -1; background: #ffffff; border-radius: 50%; opacity: 0.4; -webkit-box-shadow: 0 5px 30px 0 rgba(214, 215, 216, 0.57); box-shadow: 0 5px 30px 0 rgba(214, 215, 216, 0.57); } .about-style-five-area::before { position: absolute; right: 0; bottom: -150px; content: ""; height: 500px; width: 500px; z-index: -1; background: #ffffff; border-radius: 50%; opacity: 0.4; -webkit-box-shadow: 0 5px 30px 0 rgba(214, 215, 216, 0.57); box-shadow: 0 5px 30px 0 rgba(214, 215, 216, 0.57); } .about-style-five ul { margin: 0; padding: 0; list-style: none; display: -ms-grid; display: grid; -ms-grid-columns: 1fr 1fr; grid-template-columns: 1fr 1fr; grid-column-gap: 30px; } @media only screen and (max-width: 767px) { .about-style-five ul { display: block; margin-top: 30px; } } .about-style-five ul li { margin-top: 30px; position: relative; z-index: 1; padding-left: 40px; } .about-style-five ul li h5 { font-weight: 600; font-size: 20px; } .about-style-five ul li p { margin: 0; } .about-style-five ul li::after { position: absolute; left: 0; top: 0; content: "\f00c"; font-family: "Font Awesome 5 Pro"; height: 25px; width: 25px; text-align: center; line-height: 25px; background: -webkit-gradient(linear, left top, right top, from(#0b5c8d), color-stop(#2db1e3), to(#0b5c8d)); background: linear-gradient(to right, #0b5c8d, #2db1e3, #0b5c8d); color: #ffffff; background-size: 200% 150%; -webkit-box-shadow: 0 10px 13px rgba(46, 151, 0, 0.21); box-shadow: 0 10px 13px rgba(46, 151, 0, 0.21); border-radius: 50%; font-size: 12px; } .about-style-five ul li:nth-child(2n)::after { background: -webkit-gradient(linear, left top, right top, from(#F3001D), to(#FFB400)); background: linear-gradient(to right, #F3001D, #FFB400); } /* ---------------------------------- Services Style One ------------------------------------*/ .services-area { position: relative; z-index: 1; } .services-area .shape { position: absolute; left: 0; top: 170px; right: 0; bottom: 0; z-index: -1; opacity: 0.4; background-size: cover; background-repeat: no-repeat; } .services-style-one { margin-bottom: 30px; } .services-style-one .item { padding: 50px 30px; position: relative; z-index: 1; overflow: hidden; border-radius: 15px; } .services-style-one .item::after { position: absolute; left: 0; bottom: 0; content: ""; height: 100%; width: 70%; background: #ffffff; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; z-index: -1; opacity: 0; visibility: hidden; border-radius: 5px; } @media only screen and (max-width: 1199px) { .services-style-one .item::after { opacity: 1; visibility: visible; height: 100%; width: 100%; } } .services-style-one .item::before { -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; position: absolute; left: 0; top: 0; content: ""; height: 150px; width: 150px; background: url(../img/shape/globe.webp); background-repeat: no-repeat; background-size: contain; background-position: top right; opacity: 0; visibility: hidden; } @media only screen and (max-width: 1199px) { .services-style-one .item::before { opacity: 1; visibility: visible; } } @media only screen and (max-width: 767px) { .services-style-one .item::before { left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } } .services-style-one .item.active::after { opacity: 1; visibility: visible; width: 100%; } .services-style-one .item.active::before { opacity: 1; visibility: visible; } .services-style-one .item.active .bottom>a { opacity: 1; padding-right: 0; } .services-style-one .item>i, .services-style-one .item .top>i { display: inline-block; font-size: 60px; margin-bottom: 30px; color: #2db1e3; } .services-style-one .item .bottom { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; border-top: 1px solid #dddddd; margin-top: 30px; padding-top: 15px; } .services-style-one .item .bottom h4 a { color: #232323; } .services-style-one .item .bottom h4 a:hover { color: #2db1e3; } .services-style-one .item .bottom a { display: inline-block; color: #232323; } .services-style-one .item .bottom a i { position: relative; top: 1px; } .services-style-one .item .bottom>a { opacity: 0; padding-right: 15px; } @media only screen and (max-width: 767px) { .services-style-one .item .bottom>a { display: none; } } @media only screen and (max-width: 767px) { .services-style-one .item .bottom { border: none; padding-top: 0; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-top: 25px; } } .services-style-one .item:hover .bottom a { color: #2db1e3; } .services-style-one .item:hover .bottom>a { padding-right: 0; } @media only screen and (max-width: 767px) { .services-style-one .item { text-align: center; } } .services-style-one h4 { font-weight: 600; margin: 0; } .services-style-one p { margin: 0; } .services-style-two-area { position: relative; overflow: hidden; } .services-style-two-area .shape { position: absolute; left: 0; bottom: 0; height: 100%; width: 100%; background-repeat: no-repeat; } .services-style-two-area .shape-right-bottom { z-index: inherit; height: 500px; width: 500px; right: -160px; bottom: -110px; } .services-style-two a { display: block; padding: 50px; position: relative; z-index: 1; background: #041736; } .services-style-two a::after { position: absolute; left: 0; top: 0; content: ""; height: 100%; width: 50%; background: #2db1e3; z-index: -1; -webkit-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; opacity: 0; visibility: hidden; } .services-style-two a:hover::after { width: 100%; opacity: 1; visibility: visible; } .services-style-two a:hover i { background: #ffffff; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; } .services-style-two h5 { margin: 0; font-weight: 600; margin-top: 15px; } .services-style-two i { display: inline-block; font-size: 55px; background: -webkit-gradient(linear, left top, right top, from(#2db1e3), color-stop(#0b5c8d), to(#2db1e3)); background: linear-gradient(to right, #2db1e3, #0b5c8d, #2db1e3); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-size: 220% 150%; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .swiper-slide.swiper-slide-active .services-style-two i { background: #ffffff; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; } .swiper-slide.swiper-slide-active .services-style-two a::after { opacity: 1; visibility: visible; width: 100%; } .services-details-area .thumb img { margin-bottom: 30px; } .services-details-area h1, .services-details-area h2, .services-details-area h3, .services-details-area h4, .services-details-area h5, .services-details-area h6 { font-weight: 600; } .services-details-area .features { margin-bottom: 30px; margin-top: -15px; } .services-details-area .features .content { margin-top: 30px; } .services-details-area .features ul { margin: 0; padding: 0; list-style: none; } .services-details-area .features ul li { position: relative; z-index: 1; padding-left: 24px; line-height: 2.2; } .services-details-area .features ul li::after { position: absolute; left: 0; top: 0; content: "\f00c"; font-family: "Font Awesome 5 Pro"; font-size: 14px; color: #2db1e3; font-weight: 600; } .quick-contact-widget { padding: 60px 37px; text-align: center; background-size: cover; background-position: center; position: relative; z-index: 1; border-radius: 7px; } .quick-contact-widget h2 { font-size: 30px; font-weight: 600; margin-bottom: 10px; } .quick-contact-widget h4 a { font-weight: 400; border-bottom: 2px solid; } .quick-contact-widget i { display: inline-block; height: 60px; width: 60px; line-height: 60px; font-weight: 100; background: #ffffff; color: #2db1e3; font-size: 22px; border-radius: 50%; margin-bottom: 40px; position: relative; } .quick-contact-widget i::after { position: absolute; left: -10px; top: -10px; content: ""; height: 80px; width: 80px; background: #ffffff; z-index: -1; border-radius: 50%; opacity: 0.8; } .quick-contact-widget::after { position: absolute; left: 0; top: 0; content: ""; height: 100%; width: 100%; background: #0b5c8d; z-index: -1; opacity: 0.6; border-radius: 7px; } .quick-contact-widget .btn-sm { font-size: 16px; } .services-sidebar .single-widget { margin-top: 50px; } .services-sidebar .single-widget .widget-title { display: block; font-weight: 600; margin-bottom: 30px; margin-top: -5px; position: relative; text-transform: capitalize; z-index: 1; display: inline-block; padding-bottom: 15px; } .services-sidebar .single-widget .widget-title::after { position: absolute; left: 0; bottom: 0; content: ""; height: 2px; width: 50px; border-bottom: 2px solid #2db1e3; } .services-sidebar .single-widget h4.widget-title { font-size: 22px; } .services-sidebar .single-widget:first-child { margin-top: 0; } .widget-brochure ul { margin-top: 10px; padding-left: 0; list-style: none; } .widget-brochure ul li a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-top: 15px; background: #ffffff; padding: 12px 25px; border-radius: 5px; border: 2px solid #cddff7; color: #232323; } .widget-brochure ul li a:hover { color: #2db1e3; } .widget-brochure ul li:first-child a { margin-top: 0; } .widget-brochure ul li i { font-size: 25px; font-weight: 100; margin-right: 16px; display: inline-block; height: 50px; width: 50px; line-height: 50px; background: #0b5c8d; text-align: center; color: #ffffff; border-radius: 50%; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .widget-brochure ul li:hover i { background: #2db1e3; } .services-list-widget ul { margin-top: 7px; } .services-list-widget ul li { display: block; } .services-list-widget ul li a { display: block; padding: 18px 25px; border-bottom: 1px solid #c8e0ff; position: relative; z-index: 1; overflow: hidden; color: #232323; background: #f1f4f8; } .services-list-widget ul li a::before { position: absolute; left: 0; top: 0; content: ""; height: 100%; width: 0; background: -webkit-gradient(linear, left top, right top, from(#0b5c8d), color-stop(#2db1e3), to(#0b5c8d)); background: linear-gradient(to right, #0b5c8d, #2db1e3, #0b5c8d); background-size: 220% 150%; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; z-index: -1; } .services-list-widget ul li a:hover { color: #ffffff; } .services-list-widget ul li a:hover::before { width: 100%; } .services-list-widget ul li.current-item a { color: #ffffff; } .services-list-widget ul li.current-item a::after { position: absolute; right: 20px; top: 50%; content: "\f061"; border-radius: 50%; font-family: "Font Awesome 5 Pro"; font-weight: 600; -webkit-transform: translateY(-50%); transform: translateY(-50%); font-size: 17px; } .services-list-widget ul li.current-item a::before { width: 100%; } .services-more { margin-top: 30px; } @media only screen and (max-width: 767px) { .services-more .row { margin-top: -20px; } } .services-more .item { padding: 35px; background: #ffffff; -webkit-box-shadow: 0px 2px 12px 0px #e7e7e7; box-shadow: 0px 2px 12px 0px #e7e7e7; margin-top: 15px; } @media only screen and (max-width: 767px) { .services-more .item { margin-top: 30px; } } .services-more .item i { display: inline-block; font-size: 50px; margin-bottom: 30px; color: #2db1e3; } .services-more .item a { color: #232323; } .services-more .item a:hover { color: #2db1e3; } .services-more .item p { margin: 0; } .appoinment-style-two { padding: 80px 50px; background: #0b5c8d; position: relative; bottom: -300px; margin-top: -300px; margin-right: 20px; } @media only screen and (max-width: 991px) { .appoinment-style-two { margin: 0; bottom: 0; margin-bottom: 30px; } } .appoinment-style-two h4 { font-weight: 600; text-transform: uppercase; } .appoinment-style-two p { opacity: 0.8; } .appoinment-style-two input { margin-bottom: 15px; background: transparent !important; border: 1px solid rgba(255, 255, 255, 0.2); color: #ffffff !important; border-radius: 5px; } .appoinment-style-two .nice-select { margin-bottom: 15px; background: transparent !important; border: 1px solid rgba(255, 255, 255, 0.2); color: #ffffff !important; border-radius: 5px; } .appoinment-style-two .nice-select .option { color: #232323; } .appoinment-style-two input:focus { margin-bottom: 15px; background: transparent !important; border: 1px solid rgba(255, 255, 255, 0.2); color: #ffffff !important; border-radius: 5px; } .appoinment-style-two button { width: 100%; border: none; background: #2db1e3; padding: 13px; border-radius: 5px; color: #ffffff; font-weight: 600; } .appoinment-style-two input::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #cccccc; } .appoinment-style-two input::-moz-placeholder { /* Firefox 19+ */ color: #cccccc; } .appoinment-style-two input:-ms-input-placeholder { /* IE 10+ */ color: #cccccc; } .appoinment-style-two input:-moz-placeholder { /* Firefox 18- */ color: #cccccc; } .services-style-three { margin-bottom: 30px; } .services-style-three .item { padding: 60px 30px; border: 1px solid #e7e7e7; border-radius: 8px; } .services-style-three .item>i { display: inline-block; font-size: 60px; margin-bottom: 30px; color: #2db1e3; } .services-style-three .item a { color: #232323; } .services-style-three .item>a { display: inline-block; height: 48px; width: 48px; line-height: 48px; text-align: center; border: 1px solid #e7e7e7; border-radius: 50%; font-size: 14px; margin-top: 10px; } @media only screen and (max-width: 991px) { .services-style-three .item { text-align: center; } } .brand3col { text-align: left; } @media only screen and (max-width: 991px) { .brand3col { text-align: center; } } .brand-items.pb-120 { border: none; position: relative; top: -80px; margin-bottom: -80px; } @media only screen and (max-width: 991px) { .brand-items.pb-120 { top: 0; margin-bottom: 0; } } .services-style-four { margin-bottom: 30px; } .services-style-four .item { padding: 60px 37px; padding-bottom: 50px; -webkit-box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1); box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1); border-radius: 10px; position: relative; z-index: 1; overflow: hidden; } .services-style-four .item .thumb { position: absolute; left: 0; top: 0; height: 80%; width: 100%; background-size: cover; background-position: center; z-index: -1; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; opacity: 0; visibility: hidden; } .services-style-four .item .thumb::after { position: absolute; left: 0; top: 0; content: ""; height: 100%; width: 100%; background: #0b5c8d; z-index: -1; opacity: 0.6; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .services-style-four .item .bg-shape { position: absolute; right: 0; bottom: 0; height: 150px; width: 150px; background-size: contain; background-repeat: no-repeat; z-index: -1; background-position: right bottom; opacity: 0.5; } .services-style-four .item>i { display: inline-block; font-size: 60px; border-radius: 50%; text-align: center; color: #2db1e3; margin-bottom: 30px; position: relative; z-index: 1; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .services-style-four .item>i::before { line-height: inherit; } .services-style-four .item a { color: #232323; } .services-style-four .item:hover a { left: 0; opacity: 1; visibility: visible; } .services-style-four .item p { -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .services-style-four .bottom { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-top: 25px; } .services-style-four .bottom span { font-size: 40px; font-weight: 900; opacity: 0.2; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .services-style-four .bottom a { display: inline-block; height: 40px; width: 40px; line-height: 42px; background: #2db1e3; color: #ffffff !important; text-align: center; border-radius: 50%; font-size: 14px; position: relative; left: -30px; opacity: 0; visibility: hidden; } .services-style-four .bottom i::before { line-height: inherit; } .services-style-four:first-child .item .thumb, .services-style-four:hover .item .thumb { visibility: visible; opacity: 1; height: 100%; } .services-style-four:first-child .bottom a, .services-style-four:hover .bottom a { left: 0; opacity: 1; visibility: visible; color: #232323; } .services-style-four:first-child .item>i, .services-style-four:hover .item>i { color: #ffffff; } .services-style-four:first-child a, .services-style-four:hover a { color: #ffffff; } .services-style-four:first-child p, .services-style-four:hover p { color: #ffffff; opacity: 0.9; } .services-style-four:first-child span, .services-style-four:hover span { color: #ffffff; opacity: 0.4; } .services-style-five-item { background: #ffffff; -webkit-box-shadow: 0 5px 30px 0 rgba(214, 215, 216, 0.57); box-shadow: 0 5px 30px 0 rgba(214, 215, 216, 0.57); padding: 60px 30px; border-radius: 10px; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; position: relative; z-index: 1; overflow: hidden; margin-bottom: 30px; } @media only screen and (max-width: 767px) { .services-style-five-item { text-align: center; } } .services-style-five-item .shape { left: auto; right: 0; bottom: auto; top: -30px; height: 50%; width: 50%; opacity: 1; z-index: inherit; } .services-style-five-item .shape img { top: 0; height: 100%; width: 100%; } .services-style-five-item h4 a { color: #232323; } .services-style-five-item p { margin: 0; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .services-style-five-item .icon { height: 110px; width: 110px; text-align: center; margin-bottom: 30px; position: relative; background: #ffffff; border-radius: 50%; } @media only screen and (max-width: 767px) { .services-style-five-item .icon { margin: auto auto 30px; } } .services-style-five-item .icon .circle-border { height: 100%; width: 100%; position: absolute; left: 0; top: 0; border: 1px solid rgba(16, 76, 186, 0.1); background: rgba(16, 76, 186, 0.04); border-radius: 50%; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .services-style-five-item .icon .circle-border::after { position: absolute; left: 9px; top: 10px; content: ""; height: 12px; width: 12px; background: #e2e2e2; border-radius: 50%; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; border: 1px solid #ffffff; } .services-style-five-item img { height: 60px; position: relative; top: 25px; z-index: 1; } .services-style-five-item.active::after { width: 100%; visibility: visible; opacity: 1; } .services-style-five-item.active .bottom a { border-color: rgba(255, 255, 255, 0.5); color: #ffffff; } .services-style-five-item.active .icon .circle-border { -webkit-animation: spinner 6s infinite linear; animation: spinner 6s infinite linear; border-color: #ffffff; background: #ffffff; } .services-style-five-item.active .icon .circle-border::after { background: #ffffff; border: 1px solid #2db1e3; } .services-style-five-item.active h4 { color: #ffffff; } .services-style-five-item.active h4 a { color: #ffffff; } .services-style-five-item.active p { color: #ffffff; opacity: 0.9; } .services-style-five-item::after { position: absolute; left: 0; bottom: 0; content: ""; height: 100%; width: 70%; background: -webkit-gradient(linear, left top, right top, from(#b900ff), color-stop(#2db1e3), to(#b900ff)); background: linear-gradient(to right, #b900ff, #2db1e3, #b900ff); z-index: -1; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; opacity: 0; visibility: hidden; background-size: 220%; } .services-style-five-item:hover .icon .circle-border { -webkit-animation: spinner 6s infinite linear; animation: spinner 6s infinite linear; border-color: #ffffff; background: #ffffff; } .services-style-five-item:hover .icon .circle-border::after { background: #ffffff; border: 1px solid #2db1e3; } .services-style-five-item:hover::after { width: 100%; visibility: visible; opacity: 1; } .services-style-five-item:hover h4 { color: #ffffff; } .services-style-five-item:hover h4 a { color: #ffffff; } .services-style-five-item:hover p { color: #ffffff; opacity: 0.9; } .services-style-five-item:hover .bottom a { border-color: rgba(255, 255, 255, 0.5); color: #ffffff; } .services-style-five-item:hover .bottom a:hover { border-color: #2db1e3; } .services-style-five-box { position: relative; } .services-style-five-box .shape-left-top { left: -200px; top: -120px; } .services-style-five-area { overflow-x: hidden; background-size: 25%, contain; background-repeat: no-repeat; background-position: left top; } /* ---------------------------------- Achivement Style ------------------------------------*/ .achivement-area { position: relative; z-index: 1; } .achivement-style-one .item { background-size: cover; background-position: center; display: -webkit-box; display: -ms-flexbox; display: flex; padding: 60px 50px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; z-index: 1; border-radius: 5px; } .achivement-style-one .item .circle { position: relative; margin-right: 30px; margin-bottom: -10px; } .achivement-style-one .item .circle strong { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); color: #ffffff; font-weight: 600; font-size: 30px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .achivement-style-one .item .circle { margin-right: 0; margin-bottom: 30px; } } @media only screen and (max-width: 767px) { .achivement-style-one .item .circle { margin-right: 0; margin-bottom: 30px; } } .achivement-style-one .item h4 { font-weight: 600; font-size: 24px; } .achivement-style-one .item p { margin: 0; } .achivement-style-one .item::after { position: absolute; left: 0; top: 0; height: 100%; width: 100%; content: ""; background: #0b5c8d; z-index: -1; opacity: 0.6; border-radius: 5px; } .achivement-style-one .item.bg-gradient::after { display: none; } .achivement-style-one .item.bg-gradient { overflow: hidden; } .achivement-style-one .item.bg-gradient::before { position: absolute; right: -20px; top: -20px; content: ""; height: 250px; width: 100%; background: url(../img/shape/17.png); background-size: contain; background-repeat: no-repeat; background-position: right; z-index: -1; opacity: 0.8; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .achivement-style-one .item { display: block; text-align: center; } .achivement-style-one .item .counter { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 30px; } } @media only screen and (max-width: 767px) { .achivement-style-one .item { display: block; text-align: center; } .achivement-style-one .item .counter { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .achivement-style-one { margin-top: 30px; } .achivement-style-one:first-child { margin-top: 0; } } @media only screen and (max-width: 767px) { .achivement-style-one { margin-top: 30px; } .achivement-style-one:first-child { margin-top: 0; } } /* ---------------------------------- Choose Us Style ------------------------------------*/ .choose-us-area { position: relative; z-index: 1; } .choose-us-area .shape { position: absolute; right: 0; bottom: 0; height: 100%; width: 80%; background-size: contain; background-repeat: no-repeat; background-position: bottom right; z-index: -1; } @media only screen and (min-width: 768px) and (max-width: 991px) { .choose-us-area .shape { display: none; } } @media only screen and (max-width: 767px) { .choose-us-area .shape { display: none; } } .choose-us-style-two-box { position: relative; z-index: 1; } .choose-us-style-two-box .shape-bottom { position: absolute; left: -150px; width: 300px; top: -180px; z-index: -1; } .choose-us-style-one .right-item { position: relative; z-index: 1; } .choose-us-card .item { border: 1px solid #e7e7e7; padding: 20px; border-radius: 10px; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; background: #ffffff; } .choose-us-card .item img { height: 100px; margin-bottom: 20px; } .choose-us-card .item span { display: block; text-transform: uppercase; font-size: 14px; font-weight: 400; margin-bottom: 3px; } .choose-us-card .item a { text-transform: uppercase; } .choose-us-card .item h4 { font-weight: 600; } .choose-us-style-two { margin-bottom: 60px; } .choose-us-style-two .thumb { position: relative; } .choose-us-style-two .thumb img { border-radius: 5px; } .choose-us-style-two .thumb .title { margin-left: 30px; position: absolute; border-bottom: 1px solid #e7e7e7; background: #ffffff; bottom: -30px; padding: 15px 30px; border-radius: 8px 0 8px 8px; -webkit-transition: all 0.45s ease-in-out; transition: all 0.45s ease-in-out; right: 0; left: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .choose-us-style-two .thumb .title h4 { font-weight: 600; margin: 0; } .choose-us-style-two .thumb .title a { color: #232323; } .choose-us-style-two .thumb .title a i { position: relative; top: 2px; margin-left: 20px; } .choose-us-style-two .thumb .title .top { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .choose-us-style-two .thumb .title .top i { display: inline-block; color: #2db1e3; text-align: center; font-size: 45px; margin-right: 20px; background: -webkit-gradient(linear, left top, right top, from(#0b5c8d), color-stop(#2db1e3), to(#0b5c8d)); background: linear-gradient(to right, #0b5c8d, #2db1e3, #0b5c8d); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-size: 220% 150%; } .choose-us-style-two .thumb .overlay { position: absolute; left: 0; top: 0; padding: 37px; z-index: 1; height: 80%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; width: 100%; visibility: hidden; opacity: 0; } .choose-us-style-two .thumb .overlay i { display: inline-block; font-size: 35px; color: #ffffff; margin-bottom: 30px; height: 70px; width: 70px; line-height: 80px; background: -webkit-gradient(linear, left top, right top, from(#2db1e3), color-stop(#0b5c8d), to(#2db1e3)); background: linear-gradient(to right, #2db1e3, #0b5c8d, #2db1e3); border-radius: 50%; background-size: 220% 150%; } .choose-us-style-two .thumb .overlay a { color: #ffffff; } .choose-us-style-two .thumb .overlay p { margin: 0; color: #fbf6f6; } .choose-us-style-two .thumb .overlay::after { position: absolute; left: 0; top: 0; content: ""; height: 100%; width: 100%; background: #0b5c8d; z-index: -1; opacity: 0.6; border-radius: 5px; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .choose-us-style-two:hover .thumb .overlay { top: 0; opacity: 1; visibility: visible; height: 100%; } .choose-us-card-two:first-child .title { -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; bottom: 0; visibility: hidden; opacity: 0; } .choose-us-card-two:first-child .choose-us-style-two .thumb .title>a { left: 0; opacity: 1; } .choose-us-card-two:first-child .choose-us-style-two .thumb .overlay { top: 0; opacity: 1; visibility: visible; height: 100%; } .choose-us-card-two:hover .title { -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; bottom: 0; visibility: hidden; opacity: 0; } @media only screen and (max-width: 767px) { .choose-us-card { margin-top: 30px; } .choose-us-card:first-child { margin-top: 0; } } /* ---------------------------------- Brand Style ------------------------------------*/ .brand-items { text-align: center; border-top: 1px solid #e7e7e7; } .brand-items img { border-radius: 10px; border: 1px solid #e7e7e7; padding: 10px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .brand-items { padding-bottom: 110px; padding-top: 0; border: none; } } @media only screen and (max-width: 767px) { .brand-items { padding-bottom: 50px; padding-top: 0; border: none; } } .brand-style-five img { width: auto; height: auto; } .brand-style-five h3 { margin: 0; font-weight: 600; border-right: 1px solid #dddddd; } @media only screen and (max-width: 991px) { .brand-style-five h3 { border: none; } } .brand-style-five h3 strong { font-size: 36px; color: #2db1e3; text-decoration: underline; font-weight: 600; } @media only screen and (max-width: 991px) { .brand-style-five { text-align: center; } } /* ---------------------------------- Projects Style ------------------------------------*/ .projects-area .masonary { margin: -15px; } /* ---------------------------------- Process Style ------------------------------------*/ .process-area .thumb { position: relative; z-index: 1; } .process-area .thumb::after { position: absolute; left: -80px; top: 50%; content: ""; height: 500px; width: 500px; background: #2db1e3; z-index: -1; border-radius: 50%; -webkit-filter: blur(70px); filter: blur(70px); -webkit-transform: translateY(-50%); transform: translateY(-50%); } @media only screen and (max-width: 767px) { .process-area .thumb::after { display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .process-area .thumb { margin-bottom: 50px; text-align: center; } } @media only screen and (max-width: 767px) { .process-area .thumb { margin-bottom: 50px; text-align: center; } } .process-style-one { position: relative; } .process-list li { margin-top: 30px; position: relative; } .process-list li i { display: inline-block; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); right: 100%; position: absolute; font-size: 60px; top: -18px; margin-right: 50px; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; opacity: 0; } .process-list li img { position: absolute; width: 55px; right: 100%; margin-right: 25px; top: 9px; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; opacity: 0; } @media only screen and (min-width: 768px) and (max-width: 991px) { .process-list li img { display: none; } } @media only screen and (max-width: 767px) { .process-list li img { display: none; } } .process-list li:hover i { margin-right: 10px; opacity: 0.7; } .process-list li:hover img { opacity: 1; margin-right: 12px; } .process-list li:first-child i { margin-right: 10px; opacity: 0.7; } .process-list li:first-child img { opacity: 1; margin-right: 12px; } .process-list h4 { font-weight: 600; } .process-list p { padding-right: 25%; opacity: 0.8; margin-bottom: 0; } .single-kit { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; border-top: 1px solid rgba(255, 255, 255, 0.2); padding-top: 30px; } @media only screen and (max-width: 767px) { .single-kit .video-play-button { display: none; } } .call { display: -webkit-box; display: -ms-flexbox; display: flex; } .call i { display: inline-block; font-size: 40px; margin-right: 15px; margin-top: 3px; } .call p { font-size: 14px; margin: 0; } .process-style-two { position: relative; z-index: 1; margin-bottom: 30px; } .process-style-two .item { padding: 60px 36px; background: #102a54; border-radius: 5px; } .process-style-two:last-child::after { display: none; } .process-style-two:nth-child(2) .item { background: #2db1e3; } .process-style-two img { height: 150px; margin-bottom: 30px; } .process-style-two h4 { font-weight: 600; margin: 0; } .process-style-two a { display: inline-block; height: 45px; width: 45px; line-height: 45px; background: rgba(255, 255, 255, 0.1); border-radius: 50%; margin-top: 25px; border: 1px dashed rgba(255, 255, 255, 0.3); } .process-style-two p { color: #cccccc; margin-top: 15px; margin-bottom: 0; } @media (min-width: 1024px) { .process-style-two p { padding: 0 10%; } } .process-style-three { margin-top: 120px; } @media only screen and (max-width: 767px) { .process-style-three { margin-top: 50px; text-align: center; } } .process-style-three:first-child { margin-top: 0; } .process-style-three h2 { font-weight: 600; margin-bottom: 30px; } .process-style-three ul { margin: 0; padding: 0; list-style: none; display: -ms-grid; display: grid; -ms-grid-columns: 1fr 1fr; grid-template-columns: 1fr 1fr; grid-column-gap: 50px; } @media only screen and (max-width: 767px) { .process-style-three ul { display: block; text-align: center; margin-top: 30px; } } .process-style-three ul li { margin-top: 20px; } .process-style-three ul li h4 { font-weight: 600; } .process-style-three ul li p { margin: 0; } .process-style-three ul li i { display: inline-block; height: 65px; width: 65px; line-height: 65px; background: -webkit-gradient(linear, left top, left bottom, from(#0090ff), color-stop(51%, #4e70fc), to(#9b4ff9)); background: linear-gradient(-180deg, #0090ff 0%, #4e70fc 51%, #9b4ff9 100%); text-align: center; color: #ffffff; font-size: 26px; border-radius: 50%; margin-bottom: 30px; } .process-style-three ul li:nth-child(2n) i { background: linear-gradient(-108deg, #ff940e 0%, #fe6638 51%, #fd3761 100%); } @media only screen and (max-width: 991px) { .processs-style-three .thumb { margin: 0; } } .processs-style-three .thumb::after { display: none !important; } .processs-style-three li { margin-top: 50px; display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; z-index: 1; } .processs-style-three li p { margin: 0; } @media only screen and (max-width: 991px) { .processs-style-three li p { padding: 0; } } .processs-style-three li span { display: inline-block; height: 50px; width: 50px; text-align: center; line-height: 50px; background: -webkit-gradient(linear, left top, right top, from(#0b5c8d), color-stop(#2db1e3), to(#0b5c8d)); background: linear-gradient(to right, #0b5c8d, #2db1e3, #0b5c8d); border-radius: 50%; background-size: 220%; font-weight: 700; font-size: 20px; margin-right: 30px; } .processs-style-three li:nth-child(2n) { margin-left: 75px; } @media only screen and (max-width: 767px) { .processs-style-three li:nth-child(2n) { margin-left: 0; } } .processs-style-three li:first-child::after { left: -50px; bottom: -167px; content: ""; height: 50px; width: 100%; background: url(../img/illustration/arrow.png); position: absolute; background-size: contain; background-repeat: no-repeat; background-position: left bottom; -webkit-transform: rotate(25deg); transform: rotate(25deg); } @media only screen and (max-width: 767px) { .processs-style-three li:first-child::after { display: none; } } /* ---------------------------------- Team Style ------------------------------------*/ .team-area .shape { position: absolute; left: -20%; top: 0; height: 100%; width: 120%; background-size: cover; background-repeat: no-repeat; background-position: right bottom; z-index: -1; } .team-area .center-shape { position: absolute; left: 0; top: 50%; height: 100%; width: 100%; background-size: cover; background-position: center; -webkit-transform: translateY(-50%); transform: translateY(-50%); } @media only screen and (max-width: 767px) { .team-area .center-shape { display: none; } } .team-style-one .thumb { position: relative; z-index: 1; } .team-style-one .thumb .angle-shape { position: absolute; left: 0; bottom: -1px; height: 100%; width: 100%; background-size: contain; background-repeat: no-repeat; background-position: bottom right; border-radius: 30px; } .team-style-one .thumb img { border-radius: 0 0 30px 30px; } .team-style-one .info { position: relative; margin-top: 15px; } .team-style-one .info .title { font-weight: 600; margin-bottom: 5px; } .team-style-one .info .title a { color: #232323; } .team-style-one .info span { text-transform: capitalize; color: #888888; font-weight: 400; margin-bottom: -8px; display: block; } .team-style-one .info .social { z-index: 9; } .team-style-one .info .social li { position: absolute; left: 30px; z-index: 9; width: 60px; text-align: center; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; -webkit-transition-delay: 100ms; transition-delay: 100ms; opacity: 0; -webkit-transform: translateY(-115px); transform: translateY(-115px); } .team-style-one .info .social li a { display: inline-block; height: 45px; width: 45px; line-height: 48px; background: #2db1e3; border-radius: 50%; font-weight: 100; color: #ffffff; font-size: 14px; } .team-style-one .info .social li a.facebook { background: #3B5998; } .team-style-one .info .social li a.twitter { background: #1DA1F2; } .team-style-one .info .social li a.pinterest { background: #BD081C; } .team-style-one .info .social li a.g-plus { background: #DB4437; } .team-style-one .info .social li a.linkedin { background: #0077B5; } .team-style-one .info .social li a.instagramm { background: #3f729b; } .team-style-one .info .social li:nth-child(2) { -webkit-transform: translateY(-165px); transform: translateY(-165px); } .team-style-one .info .social li:nth-child(3) { -webkit-transform: translateY(-215px); transform: translateY(-215px); -webkit-transition-delay: 150ms; transition-delay: 150ms; } .team-style-one .info .social li:nth-child(4) { -webkit-transform: translateY(-265px); transform: translateY(-265px); -webkit-transition-delay: 200ms; transition-delay: 200ms; } .team-style-one .info .social li:nth-child(5) { -webkit-transform: translateY(-315px); transform: translateY(-315px); -webkit-transition-delay: 250ms; transition-delay: 250ms; } .team-style-one:hover .social li { -webkit-transform: translateY(-130px); transform: translateY(-130px); opacity: 1; } .team-style-one:hover .social li:nth-child(2) { -webkit-transform: translateY(-185px); transform: translateY(-185px); } .team-style-one:hover .social li:nth-child(3) { -webkit-transform: translateY(-240px); transform: translateY(-240px); } .team-style-one:hover .social li:nth-child(4) { -webkit-transform: translateY(-295px); transform: translateY(-295px); } .team-style-one:hover .social li:nth-child(5) { -webkit-transform: translateY(-350px); transform: translateY(-350px); } .team-grid-style { padding-bottom: 70px !important; } @media only screen and (max-width: 767px) { .team-grid-style { padding-bottom: 0 !important; } } .team-grid-style .team-style-one { margin-bottom: 50px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .team-single-info .thumb img { margin-bottom: 30px; } } @media only screen and (max-width: 767px) { .team-single-info .thumb img { margin-bottom: 30px; } } .team-single-info h2 { font-weight: 600; } .team-single-info span { display: block; text-transform: uppercase; color: #2db1e3; font-weight: 600; margin-bottom: 25px; } .team-single-info .list { margin-top: 25px; border-top: 1px solid #e7e7e7; padding-top: 20px; } .team-single-info .list ul { margin: 0 -15px; padding: 0; list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media only screen and (max-width: 767px) { .team-single-info .list ul { margin: 0; } } .team-single-info .list ul li { margin-top: 10px; float: left; width: 50%; padding: 0 15px; display: -webkit-box; display: -ms-flexbox; display: flex; } .team-single-info .list ul li a { font-weight: 400; color: #232323; } .team-single-info .list ul li a:hover { color: #2db1e3; } .team-single-info .list ul li strong { display: -webkit-box; display: -ms-flexbox; display: flex; margin-right: 10px; min-width: 80px; color: #232323; } .team-single-info .list ul li i { position: relative; top: 4px; margin-right: 8px; color: #2db1e3; } @media only screen and (max-width: 767px) { .team-single-info .list ul li { width: 100%; padding: 0; } } .team-single-info .social { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 35px; font-weight: 600; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .team-single-info .social .share-link { position: relative; z-index: 1; margin-left: 20px; padding-right: 20px; } .team-single-info .social .share-link>i { display: inline-block; height: 45px; background: #ffffff; -webkit-box-shadow: 0 0 10px #cccccc; box-shadow: 0 0 10px #cccccc; line-height: 45px; width: 45px; text-align: center; border-radius: 50%; cursor: pointer; color: #2db1e3; } .team-single-info .social .share-link ul { display: -webkit-box; display: -ms-flexbox; display: flex; list-style-type: none; grid-gap: 10px; padding: 0; margin: 0; position: absolute; left: 0; top: 0; z-index: 0; opacity: 0; pointer-events: none; -webkit-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } .team-single-info .social .share-link ul li { display: inline-block; margin: 0; color: #232323; } .team-single-info .social .share-link ul li a { display: inline-block; height: 45px; width: 45px; line-height: 47px; background: #f1f1f1; text-align: center; border-radius: 50%; font-weight: 400; color: #232323; } .team-single-info .social .share-link ul li a:hover { color: #2db1e3; } .team-single-info .social .share-link:hover ul { left: 58px; opacity: 1; pointer-events: auto; } @media only screen and (max-width: 767px) { .team-single-info .social .share-link { display: none; } } .team-single-bottom-info h2 { font-weight: 600; } .team-single-bottom-info h3 { margin-top: 20px; font-weight: 600; } .team-single-bottom-info ul li { display: block; position: relative; line-height: 2; font-weight: 600; font-size: 18px; padding-left: 40px; } .team-single-bottom-info ul li::after { position: absolute; left: 0; top: 5px; content: "\f00c"; font-family: "Font Awesome 5 Pro"; font-size: 13px; font-weight: 600; height: 25px; line-height: 25px; width: 25px; border: 1px solid #a1c2ff; text-align: center; border-radius: 5px; color: #2db1e3; } .progress-box { margin-top: 35px; } .progress-box:first-child { margin-top: 0; } .progress-box .progress { background: #a1c2ff; height: 10px; overflow: inherit; } .progress-box .progress .progress-bar { background: #2db1e3; position: relative; overflow: inherit; } .progress-box .progress .progress-bar span { position: absolute; right: -15px; top: -43px; bottom: auto; background: #2db1e3; display: inline-block; padding: 2px 5px; padding-left: 7px; border-radius: 5px; } .progress-box .progress .progress-bar span::after { position: absolute; left: 50%; bottom: -8px; content: ""; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 10px solid #2db1e3; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .progress-box h5 { font-weight: 600; } @media only screen and (min-width: 1024px) and (max-width: 1199px) { .team-single-area .align-center { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } } /* ---------------------------------- Quick Contact Style ------------------------------------*/ .quick-contact-area { position: relative; z-index: 1; } .quick-contact-area .shape-left-top { position: absolute; left: 0; bottom: 0; height: 100%; width: 100%; background-size: cover; background-repeat: no-repeat; z-index: -1; } .quick-contact-style-one { position: relative; z-index: 1; } .quick-contact-style-one li { display: block; position: relative; padding-left: 30px; line-height: 36px; } .quick-contact-style-one li::after { position: absolute; left: 0; top: 0; content: "\f058"; font-family: "Font Awesome 5 Pro"; font-weight: 600; font-size: 20px; color: #ffffff; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .quick-contact-style-one { margin-bottom: 50px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .quick-contact-style-one { margin-bottom: 50px; } } @media only screen and (max-width: 767px) { .quick-contact-style-one { margin-bottom: 50px; } } .tab-style-one .nav-link { display: inline-block; margin: 0; border: none; } .tab-style-one .nav-tabs { border: none; margin-bottom: 40px; } .tab-style-one .nav-tabs button { background: transparent; border: 2px solid #2980f5; border-radius: 5px; padding: 12px 36px; margin-right: 10px; font-weight: 600; color: #ffffff; font-size: 20px; } .tab-style-one .nav-tabs button.active { border-color: #ffffff; } .tab-style-one .list li { display: block; position: relative; z-index: 1; padding-left: 30px; line-height: 40px; color: #ffffff; } .tab-style-one .list li::after { position: absolute; left: 0; top: 0; content: "\f00c"; font-family: "Font Awesome 5 Pro"; font-weight: 600; font-size: 14px; } .tab-style-one p { opacity: 0.9; } .our-achivement li { margin-top: 30px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .our-achivement li .thumb { max-width: 190px; min-width: 190px; margin-right: 20px; } .our-achivement li .thumb img { border-radius: 7px; } .our-achivement li h4 { font-weight: 600; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .our-achivement li h4 strong { font-size: 30px; margin-right: 40px; position: relative; z-index: 1; padding-right: 10px; font-weight: 600; } .our-achivement li h4 strong::after { position: absolute; left: 100%; top: 50%; content: ""; height: 1px; width: 30px; background: rgba(255, 255, 255, 0.4); z-index: -1; } .our-achivement li p { margin: 0; } .consultation-form input { min-height: 55px; color: #ffffff; margin-bottom: 20px; font-weight: 600; } .consultation-form label { font-weight: 600; color: #fff; } .consultation-form button { font-weight: 600; width: 100%; background: #2db1e3; min-height: 55px; border-radius: 5px; border: none !important; } .consultation-form button i { position: relative; top: 2px; margin-left: 3px; } .consultation-form .nice-select { min-height: 55px; border-radius: 5px; } .consultation-form .nice-select span { color: #232323; } .consultation-form .nice-select .option { color: #232323; } .consultation-form.theme input, .consultation-form.theme textarea { background: transparent; border: 2px solid rgba(255, 255, 255, 0.5); color: #FFFFFFB3; font-weight: 600; } .consultation-form.theme input::-webkit-input-placeholder { color: #FFFFFFB3; font-size: 16px; font-weight: 600; } .consultation-form.theme input::-moz-placeholder { color: #FFFFFFB3; font-size: 16px; font-weight: 600; } .consultation-form.theme input:-ms-input-placeholder { color: #FFFFFFB3; font-size: 16px; font-weight: 600; } .consultation-form.theme input:-moz-placeholder { color: #FFFFFFB3; font-size: 16px; font-weight: 600; } .consultation-form.theme .nice-select { background: transparent; border: 2px solid rgba(255, 255, 255, 0.5); } .consultation-form.theme .nice-select span { color: #FFFFFFB3; } .consultation-form.theme .nice-select::after { border-color: #ffffff; height: 8px; width: 8px; right: 15px; } .consultation-form.theme button { background: #0b5c8d; color: #ffffff; font-size: 17px; } .consultation-form.theme button:hover { background: #000; } .contact-list { margin-top: 30px; } .contact-list li { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .contact-list h5 { font-size: 16px; font-weight: 400; margin-bottom: 5px; } .contact-list a { display: inline-block; font-size: 24px; font-weight: 600; } .contact-list i { display: inline-block; margin-right: 25px; height: 65px; width: 65px; line-height: 65px; text-align: center; background: #ffffff; border-radius: 50%; font-weight: 600; font-size: 30px; color: #2db1e3; position: relative; z-index: 1; } .contact-list i::after { position: absolute; left: -10px; top: -10px; content: ""; height: 85px; width: 85px; background: #ffffff; z-index: -1; border-radius: 50%; opacity: 0.2; } /* ---------------------------------- Benifits Style ------------------------------------*/ .benifits-area .bg-text { margin: 0; z-index: 100; position: relative; bottom: -55px; margin-top: -90px; } .benifits-style-one .item { background: #ffffff; padding: 80px; padding-bottom: 120px; padding-top: 100px; position: relative; z-index: 1; } .benifits-style-one .item .bg-text { position: absolute; right: 35%; top: -115px; z-index: -1; } @media only screen and (max-width: 767px) { .benifits-style-one .item { padding: 50px; padding-bottom: 50px; padding-top: 50px; } } .bg-text { display: inline-block; font-size: 180px; font-weight: 900; -webkit-text-stroke: 1px #ffffff; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-size: cover; background-position: center; line-height: 1; margin: 0; } @media only screen and (min-width: 768px) and (max-width: 991px) { .bg-text { font-size: 122px; bottom: -65px; } } @media only screen and (max-width: 767px) { .bg-text { display: none; } } /* ---------------------------------- Feature Style ------------------------------------*/ .feature-style-five { position: relative; } .feature-style-five i { display: inline-block; font-size: 50px; margin-bottom: 30px; font-weight: 100; } .feature-style-five .row>div:first-child .feature-style-five-item { margin-top: 0; } .feature-style-five .row>div:first-child .feature-style-five-item i { background: -webkit-gradient(linear, left top, right top, from(#0b5c8d), color-stop(#2db1e3), to(#0b5c8d)); background: linear-gradient(to right, #0b5c8d, #2db1e3, #0b5c8d); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-size: 220% 150%; } .feature-style-five .row>div:nth-child(2) .feature-style-five-item { margin-top: 80px; } .feature-style-five .row>div:nth-child(2) .feature-style-five-item i { background: -webkit-gradient(linear, left top, right top, from(#F3001D), to(#FFB400)); background: linear-gradient(to right, #F3001D, #FFB400); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; } @media only screen and (max-width: 767px) { .feature-style-five .row>div:nth-child(2) .feature-style-five-item { margin-top: 30px; } } .feature-style-five .row>div:nth-child(3) .feature-style-five-item { margin-top: -50px; } @media only screen and (max-width: 767px) { .feature-style-five .row>div:nth-child(3) .feature-style-five-item { margin-top: 30px; } } .feature-style-five .row>div:nth-child(3) .feature-style-five-item i { background: -webkit-gradient(linear, left top, right bottom, from(#F84E77), to(#FFA3B9)); background: linear-gradient(to bottom right, #F84E77, #FFA3B9); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; } .feature-style-five .row>div:nth-child(4) .feature-style-five-item i { background: linear-gradient(145deg, #4f5eff 0%, #8a20a2 80%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; } .feature-style-five-item { padding: 50px 40px; background: #ffffff; border-radius: 10px; margin-top: 30px; -webkit-box-shadow: 0 25px 70px rgba(0, 0, 0, 0.07); box-shadow: 0 25px 70px rgba(0, 0, 0, 0.07); overflow: hidden; position: relative; z-index: 1; } .feature-style-five-item:after { position: absolute; left: 50px; top: 45px; content: ""; height: 55px; width: 55px; background: #000000; border-radius: 50%; opacity: 0.05; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .feature-style-five-item h4 { font-weight: 600; } .feature-style-five-item p { margin: 0; } .featuresa-area { position: relative; z-index: 1; overflow-x: hidden; } .shape-right-center { position: absolute; right: -250px; top: 0; height: 50%; width: 50%; background-repeat: no-repeat; background-position: right top; z-index: -1; background-size: contain; } .shape-left-bottom-animated { position: absolute; left: -150px; bottom: -50px; } .shape-left-bottom-animated img { height: 400px; } /* ---------------------------------- Pricing Style ------------------------------------*/ .pricing-style-one { margin-bottom: 30px; } .pricing-style-one .item { border: 2px solid #bad3ff; -webkit-box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.07); box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.07); border-radius: 10px; padding: 50px; } .pricing-style-one .item .pricing-header { margin-bottom: 30px; } .pricing-style-one .item .pricing-header p { margin: 0; } .pricing-style-one .item .pricing-header h4 { text-transform: capitalize; font-weight: 600; } .pricing-style-one .item .pricing-header h2 { font-size: 60px; font-weight: 600; } .pricing-style-one .item .pricing-header h2 sub { font-size: 20px; font-weight: 400; margin-left: 0px; } .pricing-style-one .item .pricing-header h2 sup { font-size: 30px; top: -22px; } .pricing-style-one .item li { margin-bottom: 8px; display: -webkit-box; display: -ms-flexbox; display: flex; } .pricing-style-one .item li i { font-size: 14px; margin-right: 10px; color: #2db1e3; position: relative; top: 6px; } .pricing-style-one .item li:last-child { margin-bottom: 0; } .pricing-style-one .item.active { background: #ffffff; } .pricing-style-one .btn { margin-top: 20px; } .pricing-tab .nav-tabs { border: none; display: inline-block; background: rgba(255, 255, 255, 0.6); padding: 10px 0; border-radius: 30px; position: relative; z-index: 1; } .pricing-tab .nav-tabs .nav-link { display: inline-block; margin: 0; border: none; border-radius: 30px; padding: 5px 25px; color: #232323; margin-left: 10px; margin-right: 10px; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; font-size: 14px; font-weight: 600; } .pricing-tab .nav-tabs .nav-link.active { background: #2db1e3; color: #ffffff; } .pricing-tab .nav-tabs::after { position: absolute; left: 50%; top: 0; content: ""; height: 100%; width: 2px; background: #e7edf8; z-index: -1; margin-left: 5px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .pricing-tab { margin-top: -30px; margin-bottom: 60px; } } @media only screen and (max-width: 767px) { .pricing-tab { margin-bottom: 30px; } } .pricing-style-two { text-align: center; } .pricing-style-two .item { background: #ffffff; border: 2px solid #ffffff; } .pricing-style-two .item .btn { margin-top: 30px; } .pricing-style-two .item img { height: 150px; margin-bottom: 30px; } .pricing-style-two .item ul { display: inline-block; } .pricing-style-two .item .pricing-header { margin-bottom: 20px; } .pricing-style-two .item .pricing-header h2 sub { font-size: 16px; color: #777777; } .pricing-style-two:nth-child(2) .item { border-color: #2db1e3; } /* ---------------------------------- Testimonials Style ------------------------------------*/ @media only screen and (min-width: 768px) and (max-width: 991px) { .testimonial-area.bg-fit { background-size: cover !important; } } @media only screen and (max-width: 767px) { .testimonial-area.bg-fit { background-image: none !important; background-color: #0b5c8d; overflow: hidden; } } .testimonial-style-one-box { padding-top: 120px; padding-bottom: 90px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .testimonial-style-one-box { padding-top: 50px; padding-bottom: 0; } } @media only screen and (max-width: 767px) { .testimonial-style-one-box { padding-top: 0; padding-bottom: 0; margin-bottom: -30px; } } .testimonial-style-one-carousel { margin: 0 -15px; } .testimonial-style-one { padding: 50px; border-radius: 10px; background: #fff; padding-bottom: 20px; } .testimonial-style-one h4 { font-weight: 600; margin-bottom: 5px; font-size: 22px; } .testimonial-style-one span { display: block; color: #2db1e3; font-weight: 600; font-size: 18px; } .testimonial-style-one p { margin: 0; line-height: normal; } .testimonial-style-one .quote-icon { position: absolute; width: 100px; right: 10px; top: 10px; opacity: 0.6; } .testimonial-style-one .provider { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 20px; } .testimonial-style-one .provider .thumb img { height: 80px; margin-left: 3px; padding: 0; margin-right: 20px; border-radius: 50%; min-width: 80px; } @media only screen and (max-width: 400px) { .testimonial-style-one .provider .thumb img { display: none; } } .testimonial-style-two-box { padding-top: 120px; padding-bottom: 120px; } @media only screen and (max-width: 767px) { .testimonial-style-two-box { padding-top: 10px; padding-bottom: 10px; } } .testimonial-style-two-box .site-heading { margin-bottom: 40px; } .testimonial-style-two .provider { margin-top: 40px; } .testimonial-style-two .thumb { position: relative; margin-bottom: 20px; } .testimonial-style-two .thumb>img { height: 100px; width: 100px; border-radius: 50%; background: -webkit-gradient(linear, left top, left bottom, from(#0090ff), color-stop(51%, #4e70fc), to(#9b4ff9)); background: linear-gradient(-180deg, #0090ff 0%, #4e70fc 51%, #9b4ff9 100%); padding: 6px; } .testimonial-style-two p { margin: 0; font-size: 28px; line-height: 1.3; font-weight: 300; color: #cccccc; } .testimonial-style-two h4 { font-weight: 600; margin-bottom: 3px; } .testimonial-style-two span { color: #2db1e3; font-weight: 600; } /* ---------------------------------- Fun Factor Style ------------------------------------*/ .fun-fact .counter { position: relative; } .fun-fact .counter { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 60px; font-weight: 600; color: #232323; line-height: 1; margin-bottom: 5px; margin-top: -5px; } .text-light .fun-fact .counter { color: #ffffff; } .fun-fact .operator { font-size: 50px; margin-left: 2px; } .fun-fact .medium { font-weight: 600; color: #232323; } .text-light .fun-fact .medium { color: #ffffff; } .fun-fact-style-one { border-right: 1px solid rgba(255, 255, 255, 0.2); } .fun-fact-style-one:last-child { border: none; } .fun-fact-style-one .fun-fact { padding: 0 50px; } .fun-fact-style-one .medium { font-size: 27px; display: block; margin-bottom: 0; } .fun-fact-style-one .counter { margin-bottom: 15px; } @media only screen and (max-width: 991px) { .fun-fact-style-one .counter { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } .fun-fact-style-one .operator { font-size: 60px; font-weight: 300; } .fun-fact-style-one p { margin: 0; opacity: 0.9; } @media only screen and (max-width: 991px) { .fun-fact-style-one { margin-top: 50px; text-align: center; } .fun-fact-style-one:first-child { margin-top: 0; } } .fun-fact-style-one-box { margin: 0 -50px; } /* ---------------------------------- Gallery Style ------------------------------------*/ .projects-area .shape-left { position: absolute; left: 0; top: 0; height: 40%; width: 40%; background-size: contain; background-repeat: no-repeat; background-position: left top; z-index: -1; opacity: 0.2; } @media only screen and (min-width: 768px) and (max-width: 991px) { .projects-area .masonary { margin: 0; } } @media only screen and (max-width: 767px) { .projects-area .masonary { margin: 0; } } .gallery-items .gallery-item { float: left; padding: 15px; } .gallery-items .gallery-item .item { overflow: hidden; position: relative; } @media only screen and (min-width: 992px) { .gallery-items .gallery-item .item.gallery-mixed-item.active .content::after { height: 100%; } .gallery-items .gallery-item .item.gallery-mixed-item.active span { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } .gallery-items .gallery-item .item.gallery-mixed-item.active::after { left: -100%; top: 0; } .gallery-items .gallery-item .item.gallery-mixed-item.active h4 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } .gallery-items.colums-2 .gallery-item { width: 50%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .gallery-items.colums-2 .gallery-item { width: 50% !important; } } @media only screen and (max-width: 767px) { .gallery-items.colums-2 .gallery-item { width: 100% !important; } } .gallery-items.colums-3 .gallery-item { width: 33.3333%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .gallery-items.colums-3 .gallery-item { width: 50% !important; } } @media only screen and (max-width: 767px) { .gallery-items.colums-3 .gallery-item { width: 100% !important; } } .gallery-items.colums-3.mixed .gallery-item:first-child { width: 25%; } .gallery-items.colums-3.mixed .gallery-item:nth-child(2) { width: 50%; } .gallery-items.colums-3.mixed .gallery-item:nth-child(3) { width: 25%; } .gallery-items.colums-4 .gallery-item { width: 25%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .gallery-items.colums-4 .gallery-item { width: 50% !important; } } @media only screen and (max-width: 767px) { .gallery-items.colums-4 .gallery-item { width: 100% !important; } } .gallery-items.colums-5 .gallery-item { width: 20%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .gallery-items.colums-5 .gallery-item { width: 50% !important; } } @media only screen and (max-width: 767px) { .gallery-items.colums-5 .gallery-item { width: 100% !important; } } .gallery-items.colums-6 .gallery-item { width: 16.6666%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .gallery-items.colums-6 .gallery-item { width: 50% !important; } } @media only screen and (max-width: 767px) { .gallery-items.colums-6 .gallery-item { width: 100% !important; } } .gallery-items.mixed { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media only screen and (min-width: 768px) and (max-width: 991px) { .gallery-items.mixed { display: -ms-grid; display: grid; grid-gap: 30px; -ms-grid-columns: (minmax(250px, 1fr))[auto-fit]; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); } .gallery-items.mixed .gallery-item { width: auto !important; float: none; display: -webkit-box; display: -ms-flexbox; display: flex; padding: 0; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .gallery-items.mixed .gallery-item .item { height: 100%; width: 100%; } .gallery-items.mixed .gallery-item .item .thumb { height: 100%; width: 100%; } .gallery-items.mixed .gallery-item .item .thumb img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } } @media only screen and (max-width: 767px) { .gallery-items.mixed { display: -ms-grid; display: grid; grid-gap: 30px; -ms-grid-columns: (minmax(250px, 1fr))[auto-fit]; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); } .gallery-items.mixed .gallery-item { width: auto !important; float: none; display: -webkit-box; display: -ms-flexbox; display: flex; padding: 0; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .gallery-items.mixed .gallery-item .item { height: 100%; width: 100%; } .gallery-items.mixed .gallery-item .item .thumb { height: 100%; width: 100%; } .gallery-items.mixed .gallery-item .item .thumb img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } } .projects-area { position: relative; z-index: 1; } .projects-area .shape { position: absolute; left: 0; top: 0; right: 0; bottom: 10%; background-size: contain; background-repeat: no-repeat; background-position: center top; z-index: -1; } .projects-area .shape-top { position: absolute; left: 0; top: 0; height: 100%; width: 100%; background-size: contain; background-repeat: no-repeat; background-position: center top; z-index: -1; } /* Gallery Style One */ .gallery-style-one .item { overflow: hidden; position: relative; z-index: 1; border-radius: 5px; } .gallery-style-one .item .content { position: absolute; left: 30px; right: 30px; bottom: 20px; padding: 10px 15px; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; z-index: 9; } .gallery-style-one .item .content h4 { margin-bottom: 5px; font-size: 20px; -webkit-transform: translateY(-20px); transform: translateY(-20px); -webkit-transition: all 0.45s ease-in-out; transition: all 0.45s ease-in-out; opacity: 0; -webkit-transition-delay: 150ms; transition-delay: 150ms; position: relative; display: inline-block; } .gallery-style-one .item .content h4::after { position: absolute; left: 0; bottom: 0; content: ""; height: 2px; width: 0; background: #232323; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; -webkit-transition-delay: 300ms; transition-delay: 300ms; } .gallery-style-one .item .content a { color: #232323; } .gallery-style-one .item .content span { display: block; margin-bottom: -2px; text-transform: uppercase; color: #2db1e3; font-weight: 600; font-size: 14px; -webkit-transition: all 0.45s ease-in-out; transition: all 0.45s ease-in-out; -webkit-transform: translateX(30px); transform: translateX(30px); opacity: 0; -webkit-transition-delay: 100ms; transition-delay: 100ms; } .gallery-style-one .item .content::after { position: absolute; left: 0; bottom: 0; content: ""; height: 0; width: 100%; background: #ffffff; z-index: -1; border-radius: 5px; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .gallery-style-one .item:hover .content h4::after { width: 100%; } .gallery-style-one .item:hover .content::after { height: 100%; } .gallery-style-one .item:hover .thumb img { -webkit-transform: scale(1.2); transform: scale(1.2); } .gallery-style-one .item:hover .thumb::after { opacity: 1; height: 150px; } .gallery-style-one .item:hover h4 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } .gallery-style-one .item:hover span { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } .gallery-style-one .item:hover::after { left: -100%; top: 0; } .gallery-style-one .item .thumb img { -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; -webkit-transform: scale(1); transform: scale(1); } .gallery-style-one .item::after { content: ""; position: absolute; height: 100%; width: 100%; left: 170%; top: 0; -webkit-transform: skewX(45deg); transform: skewX(45deg); -webkit-transition: all 0.55s ease-in-out; transition: all 0.55s ease-in-out; background: -webkit-gradient(linear, left top, right top, from(#0b5c8d), color-stop(#2db1e3), to(#0b5c8d)); background: linear-gradient(to right, #0b5c8d, #2db1e3, #0b5c8d); opacity: 0.6; z-index: 1; background-size: 220% 150%; } .gallery-style-one .item::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #0b5c8d; -webkit-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s; opacity: 0; z-index: 1; } .project-details-area .thumb img { margin-bottom: 50px; } @media only screen and (max-width: 767px) { .project-details-area .thumb img { margin-bottom: 30px; } } .project-details-area h1, .project-details-area h2, .project-details-area h3, .project-details-area h4, .project-details-area h5, .project-details-area h6 { font-weight: 600; } .project-details-area .main-content { margin-top: 40px; } .project-details-area .main-content .row img { margin-top: 0px; } .project-info { background: #f1f4f8; padding: 50px; } .project-info .title { font-weight: 600; margin-bottom: 25px; position: relative; z-index: 1; padding-bottom: 15px; margin-top: -5px; } .project-info .title::after { position: absolute; left: 0; bottom: 0; content: ""; height: 2px; width: 50px; border-bottom: 2px solid #2db1e3; } .project-info ul { padding-left: 0; list-style: none; margin: 0; } .project-info ul li { font-weight: 600; font-size: 16px; color: #232323; margin-top: 15px; } .project-info ul li:first-child { border: none; margin-top: 0; padding-top: 0; } .project-info ul li span { font-weight: 400; position: relative; display: block; color: #666666; } .project-info ul.social { margin-top: 25px; border-top: 1px solid #e2d8d8; padding-top: 25px; } .project-info ul.social li { display: inline-block; margin: 0; margin-right: 28px; margin-top: 5px; } .project-info ul.social li a { display: inline-block; text-align: center; border-radius: 50%; font-size: 20px; font-weight: 100; color: #232323; } .project-info ul.social li a:hover { color: #2db1e3; } .project-info ul.social li:last-child { margin-right: 0; } ul.check-list { padding: 0; margin: 0 -15px; margin-top: -15px; overflow: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } ul.check-list li { float: left; width: 50%; padding: 0 15px; position: relative; padding-left: 65px; margin-top: 30px; } ul.check-list li::after { position: absolute; left: 15px; top: 0; content: "\f00c"; font-family: "Font Awesome 5 Pro"; height: 30px; width: 30px; line-height: 30px; color: #ffffff; text-align: center; border-radius: 50%; font-size: 15px; background: -webkit-gradient(linear, left top, right top, from(#0b5c8d), color-stop(#2db1e3), to(#0b5c8d)); background: linear-gradient(to right, #0b5c8d, #2db1e3, #0b5c8d); background-size: 220% 150%; } ul.check-list li h4 { margin-bottom: 10px; } ul.check-list li p { margin: 0; } @media only screen and (min-width: 992px) and (max-width: 1199px) { ul.check-list li { width: 100%; } } @media only screen and (max-width: 767px) { ul.check-list li { width: 100%; } } /* ---------------------------------- Faq Style ------------------------------------*/ .faq-area { position: relative; z-index: 1; } .faq-area .circle-shape { position: absolute; z-index: -1; border-radius: 50%; background: linear-gradient(-62.5deg, transparent, #ffffff); opacity: 0.3; } .faq-area .circle-shape:first-child { top: 80px; right: 120px; height: 150px; width: 150px; } .faq-area .circle-shape:nth-child(2) { height: 600px; width: 600px; bottom: -50px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); opacity: 0.8; } .faq-area.shape-less .circle-shape { display: none; } .faq-style-one .accordion-item { background: transparent; border: none; } .faq-style-one .accordion-item:first-child { border: none; padding-top: 0; margin-top: 0; } .faq-style-one .accordion-item .accordion-body { padding-left: 0; padding-top: 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .faq-style-one .accordion-item .accordion-body .number { display: inline-block; background: #ffffff; min-width: 40px; text-align: center; height: 40px; line-height: 40px; font-weight: 900; margin-right: 20px; -webkit-box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.07); box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.07); border: 2px solid #bad3ff; color: #232323; letter-spacing: 0.6px; border-radius: 5px; } .faq-style-one button.accordion-button { border-radius: inherit; background: transparent; -webkit-box-shadow: inherit; box-shadow: inherit; border-bottom: 1px solid rgba(0, 0, 0, 0.125); padding-left: 0; color: #232323; font-size: 20px; font-weight: 600; } .faq-style-one button.accordion-button:not(.collapsed) { border-bottom: 1px solid rgba(0, 0, 0, 0.125); color: #2db1e3; } .faq-style-one .heading-left { margin-bottom: 15px; } .faq-style-one .thumb { padding-right: 35px; position: relative; z-index: 1; } .faq-style-one .thumb img { border-radius: 7px; } .faq-style-one .thumb .shape { position: absolute; left: -80px; bottom: -80px; height: 100%; width: 150px; background-size: contain; background-repeat: no-repeat; background-position: left bottom; } @media only screen and (min-width: 768px) and (max-width: 991px) { .faq-style-one .thumb { padding-right: 0; margin-bottom: 50px; } } @media only screen and (max-width: 767px) { .faq-style-one .thumb { padding-right: 0; margin-bottom: 30px; } } /* ---------------------------------- Meeting Style ------------------------------------*/ .meeting-style-one-area { position: relative; z-index: 1; overflow: hidden; } .meeting-style-one-area .shape { position: absolute; left: 0; top: 0; height: 100%; width: 100%; z-index: -1; background-size: 50%; background-repeat: no-repeat; background-position: right; opacity: 0.4; } .meeting-style-one-area .shape-left-top { opacity: 0.6; position: absolute; left: 0; top: 0; height: 100%; width: 55%; background-size: cover; z-index: -1; background-repeat: no-repeat; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .meeting-style-one-area .shape-left-top { width: 100%; display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .meeting-style-one-area .shape-left-top { display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .meeting-style-one-area { text-align: center; } } @media only screen and (max-width: 1199px) { .meeting-style-one-area::after { position: absolute; left: 0; top: 0; content: ""; height: 100%; width: 100%; z-index: -1; background: #0b5c8d; opacity: 0.6; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .meeting-style-one ul { text-align: center !important; margin-top: 40px; } } .meeting-style-one ul li { display: inline-block; text-align: center; margin-left: 30px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .meeting-style-one ul li { margin-left: 15px; margin-right: 15px; } } @media only screen and (max-width: 767px) { .meeting-style-one ul li { margin-left: 15px; margin-right: 15px; margin-top: 30px; } } .meeting-style-one ul li i { display: inline-block; font-size: 40px; margin-bottom: 25px; } .meeting-style-one ul li a { display: block; background: -webkit-gradient(linear, left top, right top, from(#0b5c8d), color-stop(#2db1e3), to(#0b5c8d)); background: linear-gradient(to right, #0b5c8d, #2db1e3, #0b5c8d); padding: 30px; padding-top: 40px; border-radius: 30px; min-width: 220px; background-size: 220% 150%; } .meeting-style-one ul li img { height: 50px; width: auto; margin-bottom: 15px; } .meeting-style-one ul li h5 { text-transform: capitalize; font-weight: 600; margin-bottom: 5px; font-size: 20px; } .meeting-style-one ul li p { margin-bottom: 0; } .meeting-style-one ul.list li { display: block; text-align: left; margin-left: 0; padding-left: 25px; line-height: 35px; position: relative; z-index: 1; } @media only screen and (max-width: 767px) { .meeting-style-one ul.list li { margin: 0; } } .meeting-style-one ul.list li::after { position: absolute; left: 0; top: 0; content: "\f00c"; font-family: "Font Awesome 5 Pro"; } @media only screen and (max-width: 991px) { .meeting-style-one ul.list { display: inline-block; margin-top: 0; } } .meeting-style-one .fun-fact { margin-top: 40px; display: -webkit-box; display: -ms-flexbox; display: flex; } .meeting-style-one .fun-fact .counter { margin-bottom: 0; } .meeting-style-one .fun-fact i { display: inline-block; font-size: 70px; margin-right: 25px; border-right: 1px solid rgba(255, 255, 255, 0.4); padding-right: 25px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .meeting-style-one .fun-fact { margin-top: 30px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } @media only screen and (max-width: 767px) { .meeting-style-one .fun-fact { margin-top: 30px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; display: none; } } @media only screen and (max-width: 767px) { .meeting-style-one .text-end { text-align: center !important; } } @media only screen and (max-width: 767px) { .meeting-style-one { text-align: center; } } /* ---------------------------------- Blog Style ------------------------------------*/ .blog-area .single-item { margin-bottom: 30px; } .blog-area.full-blog .blog-style-one { margin-bottom: 50px; } .blog-area.full-blog .blog-style-one:last-child { margin-bottom: 0; } .blog-area.full-blog .blog-style-two { margin-bottom: 50px; } .blog-area.full-blog .blog-style-two:last-child { margin-bottom: 0; } .blog-area.full-blog .pagination { margin-top: 50px; } .blog-area h1, .blog-area h2, .blog-area h3, .blog-area h5, .blog-area h6 { font-weight: 600; } .blog-area.single .blog-style-one { -webkit-box-shadow: inherit; box-shadow: inherit; margin-bottom: 0; } .blog-area.single .blog-style-one .info { padding: 0; } .blog-area.single .blog-style-one .thumb img { margin-bottom: 30px; border-radius: 5px; } .blog-area.single .blog-style-two { -webkit-box-shadow: inherit; box-shadow: inherit; margin-bottom: 0; } .blog-area.single .blog-style-two .info { padding: 0; } .blog-area.single .blog-style-two .thumb img { margin-bottom: 30px; border-radius: 5px; } .blog-style-one { -webkit-box-shadow: 0px 2px 12px 0px #e7e7e7; box-shadow: 0px 2px 12px 0px #e7e7e7; background: #ffffff; border-radius: 8px; } .blog-style-one .thumb { position: relative; z-index: 1; padding: 15px; padding-bottom: 0; } .blog-style-one .thumb img { border-radius: 8px; } .blog-style-one .info { padding: 30px; } .blog-style-one .meta { margin-bottom: 20px; } .blog-style-one .meta li { display: inline-block; margin-right: 15px; } .blog-style-one .meta li a { display: inline-block; font-weight: 400; color: #666666; font-size: 15px; } .blog-style-one .meta li a:hover { color: #2db1e3; } .blog-style-one .meta li i { margin-right: 3px; } .blog-style-one .meta li i.fa-tag { -webkit-transform: rotate(45deg); transform: rotate(45deg); position: relative; top: 2px; } .blog-style-one .meta li.tags a { display: inline-block; background: #2db1e3; color: #ffffff; padding: 3px 15px; border-radius: 5px; } .blog-style-one .title { line-height: 1.3; font-weight: 600; } .blog-style-one .title a { font-weight: 600; color: #232323; font-size: 19px; line-height: normal; } .blog-style-one .title a:hover { color: #2db1e3; } .blog-style-one h4.title { font-size: 24px; } .blog-style-one .author { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border-top: 1px solid #e7e7e7; padding: 15px 0; padding-bottom: 30px; margin: 0 30px; margin-top: -20px; } .blog-style-one .author h5 { margin-bottom: 2px; font-weight: 600; } .blog-style-one .author span { font-weight: 400; } .blog-style-one .author .thumbs { margin-bottom: 0; } .blog-style-one .author img { height: 55px; width: 55px; border-radius: 50%; border: 2px solid #e7e7e7; padding: 1px; margin-right: 15px; } .blog-style-two { -webkit-box-shadow: 0px 2px 12px 0px #e7e7e7; box-shadow: 0px 2px 12px 0px #e7e7e7; background: #ffffff; border-radius: 8px; } .blog-style-two .thumb { position: relative; z-index: 1; } .blog-style-two .thumb img { border-radius: 8px 8px 0 0; } .blog-style-two .thumb>a { position: relative; } .blog-style-two .thumb .tags a { position: absolute; left: 30px; top: 0; display: inline-block; background: #2db1e3; color: #ffffff; padding: 4px 20px; border-radius: 0 0 5px 5px; } .blog-style-two .info { padding: 30px; } .blog-style-two .meta { margin-bottom: 15px; } .blog-style-two .meta li { display: inline-block; margin-right: 15px; } .blog-style-two .meta li a { display: inline-block; font-weight: 600; color: #666666; } .blog-style-two .meta li a:hover { color: #2db1e3; } .blog-style-two .meta li i { margin-right: 3px; } .blog-style-two .meta li i.fa-tag { -webkit-transform: rotate(45deg); transform: rotate(45deg); position: relative; top: 2px; } .blog-style-two .meta li.tags a { display: inline-block; background: #2db1e3; color: #ffffff; padding: 3px 15px; border-radius: 5px; } .blog-style-two .title { line-height: 1.3; font-weight: 600; } .blog-style-two .title a { font-weight: 600; color: #232323; } .blog-style-two .title a:hover { color: #2db1e3; } .blog-style-two h4.title { font-size: 24px; } .blog-style-two .author { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border-top: 1px solid #e7e7e7; padding: 15px 0; padding-bottom: 30px; margin: 0 30px; margin-top: -20px; } .blog-style-two .author h5 { margin-bottom: 2px; font-weight: 600; } .blog-style-two .author span { font-weight: 400; } .blog-style-two .author .thumbs { margin-bottom: 0; } .blog-style-two .author img { height: 55px; width: 55px; border-radius: 50%; border: 2px solid #e7e7e7; padding: 1px; margin-right: 15px; } /* Pagination */ .pagination { display: block; margin-top: 30px; } .pagination li { display: inline-block; margin-top: 7px; } .pagination li a { display: inline-block; padding: 15px 20px; border-radius: 5px; margin: 0 2px; color: #232323; font-weight: 800; line-height: 19px; } .pagination li.page-item.active a { background: #2db1e3; border-color: #2db1e3; } .pagination i { position: relative; top: 1px; } /* Sidebar */ .sidebar .title { display: block; font-weight: 600; margin-bottom: 30px; margin-top: -5px; position: relative; text-transform: capitalize; z-index: 1; display: inline-block; padding-bottom: 15px; } .sidebar .title h4 { font-size: 22px; margin: 0; } .sidebar .title h3 { margin: 0; } .sidebar .title h2 { margin: 0; } .sidebar .title::after { position: absolute; left: 0; bottom: 0; content: ""; height: 2px; width: 50px; border-bottom: 2px solid #2db1e3; } .sidebar input[type="text"] { border: 1px solid #a7c6ff; -webkit-box-shadow: inherit; box-shadow: inherit; min-height: 60px; border-radius: 5px; padding: 20px; } .sidebar button[type="submit"] { background: #2db1e3; border: none; color: #ffffff; font-weight: 600; letter-spacing: 1px; min-height: 55px; width: 55px; position: absolute; right: 5px; text-transform: uppercase; top: 5px; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; border-radius: inherit; font-size: 18px; border-radius: 8px; } .sidebar button[type="submit"] i { font-weight: 600; } .sidebar button[type="submit"]:hover { background: #0b5c8d; } .sidebar form { position: relative; } .sidebar .sidebar-item { float: left; margin-bottom: 50px; width: 100%; background: #f1f4f8; padding: 40px; } .sidebar .sidebar-item:last-child { margin-bottom: 0; } .sidebar .sidebar-item.category li { display: block; position: relative; margin-top: 13px; } .sidebar .sidebar-item.category li a { display: -webkit-box; display: -ms-flexbox; display: flex; text-transform: capitalize; font-weight: 600; color: #666666; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .sidebar .sidebar-item.category li a:hover { color: #2db1e3; } .sidebar .sidebar-item.category li a span { font-size: 13px; margin-left: 5px; background: #ffffff; min-width: 40px; padding: 3px; text-align: center; color: #232323; border-radius: 30px; } .sidebar .sidebar-item.category li:first-child { margin-top: 0; padding-top: 0; } .sidebar .sidebar-item.category li:first-child a span { top: 0; } .sidebar .sidebar-item.category li:first-child a::after { top: 0; } .sidebar .sidebar-item.category li:last-child { border: none; margin-bottom: 0; padding-bottom: 0; } .sidebar .sidebar-item.category .sidebar-info { margin-top: -5px; } .sidebar .sidebar-item.archives ul li { display: block; margin-bottom: 20px; position: relative; } .sidebar .sidebar-item.archives ul li:last-child { margin-bottom: 0; } .sidebar .sidebar-item.archives ul li a { display: inline-block; font-weight: 600; text-transform: capitalize; z-index: 1; padding-left: 25px; color: #666666; } .sidebar .sidebar-item.archives ul li a::after { border-radius: 50%; content: "\f07b"; font-family: "Font Awesome 5 Pro"; height: 8px; left: 0; position: absolute; width: 8px; font-weight: 300; } .sidebar .sidebar-item.archives ul li a:hover { color: #2db1e3; } .sidebar .sidebar-item.archives .sidebar-info { margin-top: -5px; } .sidebar .sidebar-item.recent-post li { color: #cdd0d3; margin-bottom: 30px; } .sidebar .sidebar-item.recent-post li a { color: #232323; display: block; font-weight: 700; } .sidebar .sidebar-item.recent-post li a:last-child { display: inline-block; } .sidebar .sidebar-item.recent-post li a:hover { color: #2db1e3; } .sidebar .sidebar-item.recent-post li a span { display: inline-block; color: #002359; } .sidebar .sidebar-item.recent-post li span { display: inline-block; font-size: 14px; font-weight: 600; text-transform: capitalize; } .sidebar .sidebar-item.recent-post li:last-child { border: medium none; margin: 0; padding: 0; } .sidebar .sidebar-item.recent-post li .thumb { display: table-cell; padding: 0; padding-top: 5px; vertical-align: top; width: 80px; } .sidebar .sidebar-item.recent-post li .thumb img { width: 100%; border-radius: inherit; height: 70px; object-fit: cover; } .sidebar .sidebar-item.recent-post li .info { -webkit-box-shadow: inherit; box-shadow: inherit; color: #837f7e; display: table-cell; line-height: 26px; padding: 0; padding-left: 15px; vertical-align: top; padding-top: 0 !important; } .sidebar .sidebar-item.recent-post li .info a { text-decoration: inherit; font-weight: 600; font-size: 14px; margin-top: 0; line-height: normal; } .sidebar .sidebar-item.recent-post .meta-title { font-weight: 700; text-transform: capitalize; font-size: 13px; } .sidebar .sidebar-item.recent-post .meta-title a { color: #888888; } .sidebar .sidebar-item.recent-post .meta-title i { margin-right: 3px; font-weight: 600; } .sidebar .sidebar-item.gallery ul { margin: -7px; overflow: hidden; } .sidebar .sidebar-item.gallery ul li { -webkit-box-sizing: border-box; box-sizing: border-box; float: left; padding: 7px; width: 33.333%; } .sidebar .sidebar-item.gallery ul li img { min-height: 70px; width: 100%; } .sidebar .sidebar-item.social-sidebar ul { margin-bottom: -10px; overflow: hidden; } .sidebar .sidebar-item.social-sidebar ul li { display: inline-block; float: left; margin-right: 10px; margin-bottom: 10px; } .sidebar .sidebar-item.social-sidebar ul li a { background: #002359 none repeat scroll 0 0; border: none; color: #ffffff; display: inline-block; height: 50px; line-height: 54px; margin-bottom: 5px; text-align: center; width: 50px; font-size: 14px; } .sidebar .sidebar-item.social-sidebar ul li a:hover { color: #ffffff !important; } .sidebar .sidebar-item.social-sidebar ul li.facebook a { background: #3B5998; } .sidebar .sidebar-item.social-sidebar ul li.twitter a { background: #1DA1F2; } .sidebar .sidebar-item.social-sidebar ul li.pinterest a { background: #E60023; } .sidebar .sidebar-item.social-sidebar ul li.g-plus a { background: #DB4437; } .sidebar .sidebar-item.social-sidebar ul li.linkedin a { background: #0077B5; } .sidebar .sidebar-item.tags ul { margin-top: -8px; } .sidebar .sidebar-item.tags ul li { display: inline-block; } .sidebar .sidebar-item.tags ul li a { border: 1px solid #e7e7e7; display: inline-block; font-weight: 600; margin-top: 8px; margin-right: 5px; padding: 6px 22px; text-transform: capitalize; font-size: 13px; border-radius: 30px; color: #666666; background: #ffffff; } .sidebar .sidebar-item.tags ul li a:hover { color: #2db1e3; } /* Blog Single */ .blog-area.single .item .blog-item-box span { background-color: #2db1e3; color: #ffffff; display: inline-block; font-weight: 700; letter-spacing: 1px; padding: 3px 20px; text-transform: uppercase; } .blog-area.single .item .blog-item-box h2 { font-weight: 600; } .blog-area.single .item .blog-item-box h3 { font-weight: 600; } .blog-area.single .item .blog-item-box h4 { font-weight: 600; } .blog-area.single .item .blog-item-box .cats { float: left; margin-right: 5px; } .blog-area.single .item .blog-item-box .meta { overflow: hidden; width: 100%; border: none; padding: 0; } .blog-area.single .item .blog-item-box .meta .date { float: right; letter-spacing: 1px; text-transform: uppercase; } .blog-area.single .item .blog-item-box .meta li { margin-right: 25px; font-weight: 400; } .blog-area.single .item .blog-item-box .meta li a { font-weight: 400; } .blog-area.single .item .blog-item-box .meta li i { color: #2db1e3; font-weight: 100; font-size: 15px; position: relative; font-weight: 3; } .post-pagi-area { margin-top: 40px; overflow: hidden; } .post-pagi-area a { display: inline-block; font-weight: 400; text-transform: uppercase; color: #2db1e3; font-size: 16px; } .post-pagi-area a i { font-weight: 600; } .post-pagi-area a:last-child { float: right; text-align: right; } .post-pagi-area a:last-child i { margin-left: 3px; } .post-pagi-area a:first-child i { margin-right: 3px; } .post-pagi-area a:hover { color: #2db1e3; } .post-pagi-area h5 { margin: 0; margin-top: 5px; font-weight: 600; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; font-size: 20px; text-transform: none; } .post-pagi-area h5:hover { color: var(--color-primary); } .blog-area.single .info>ul { margin-bottom: 25px; margin-top: 25px; list-style: disc; padding-left: 20px; } .blog-area.single .info>ul li { list-style: disc; } .blog-area blockquote { position: relative; z-index: 1; border: none; font-size: 22px; margin-top: 30px; margin-bottom: 30px; color: #c3d2ff; font-weight: 400; background: #0b5c8d; padding: 80px 50px; font-style: italic; line-height: 1.7; } .blog-area blockquote::after { position: absolute; right: 50px; content: "\f10d"; font-family: "Font Awesome 5 Pro"; color: #ffffff; bottom: -25px; font-weight: 100; opacity: 0.1; font-size: 120px; font-style: normal; line-height: 1; } .blog-area blockquote cite { display: block; margin-top: 15px; color: #999999; font-weight: 600; font-style: normal; } .blog-area blockquote p { margin: 0; position: relative; z-index: 1; line-height: 34px; font-size: 16px; font-style: italic; font-weight: 600; color: #c3d2ff; } .blog-area .post-tags { margin-top: 40px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; border-top: 1px solid #e7e7e7; border-bottom: 1px solid #e7e7e7; padding: 10px 0; padding-bottom: 6px; } .blog-area .post-tags .tags a { background: #e7edf8; padding: 10px 15px; font-size: 14px; margin-right: 3px; margin-bottom: 5px; display: inline-block; color: #232323; } .blog-area .post-tags .tags a:hover { color: #2db1e3; } .blog-area .share { margin-top: 40px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; border-top: 1px solid #e7e7e7; border-bottom: 1px solid #e7e7e7; padding: 10px 0; padding-bottom: 6px; } .blog-area .share li { display: inline-block; margin-left: 15px; } .blog-area .share li a { display: inline-block; color: #666666; } .blog-area .share li.facebook a { color: #3B5998; } .blog-area .share li.twitter a { color: #1DA1F2; } .blog-area .share li.pinterest a { color: #BD081C; } .blog-area .share li.g-plus a { color: #DB4437; } .blog-area .share li.linkedin a { color: #0077B5; } /* Comments */ .comments-area { margin-top: 40px; } .comments-area .comment-item { margin-top: 30px; display: -webkit-box; display: -ms-flexbox; display: flex; padding: 37px; -webkit-box-shadow: 0px 2px 12px 0px #e7e7e7; box-shadow: 0px 2px 12px 0px #e7e7e7; background: #ffffff; position: relative; border-radius: 8px; } .comments-area .comment-item .comments-info p { display: block; margin: 0; } .comments-area .comment-item .comments-info a { border: 1px solid #e7e7e7; color: #002359; display: inline-block; font-size: 12px; margin-top: 5px; padding: 1px 20px; background: #ffffff; text-transform: uppercase; font-weight: 700; border-radius: 30px; } .comments-area .comment-item .comments-info a:hover { color: #2db1e3; } .comments-area .comment-item .comments-info a i { margin-right: 10px; } .comments-area .comment-item .avatar { height: 120px; width: 120px; min-width: 120px; } .comments-area .comment-item .avatar img { height: 90px; width: 90px; border-radius: 5px; } @media only screen and (max-width: 500px) { .comments-area .comment-item .avatar { margin: auto; } } .comments-area .comment-item:last-child { margin-bottom: 0; } .comments-area .comment-item.reply { margin-left: 80px; } @media only screen and (max-width: 767px) { .comments-area .comment-item.reply { margin-left: 0; } } .comments-area .comment-item .content .title { -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 15px; font-weight: 600; } .comments-area .comment-item .content .title span { font-weight: 400; color: #999999; display: block; margin-top: 0; font-size: 16px; } .comments-area .comment-item .content .title span i { font-weight: 600; margin-right: 5px; } .comments-area .comment-item .content .title span i.fa-reply { font-weight: 700; margin-right: 3px; } .comments-area .comment-item .content .title span a { margin-left: 10px; } .comments-area .comment-item .content .title h5 { margin-bottom: 5px; } .comments-area .comment-item .content h2 { font-size: 18px; font-weight: 600; text-transform: capitalize; margin-bottom: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .comments-area .comment-item .content h3 { font-size: 18px; font-weight: 600; text-transform: capitalize; margin-bottom: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .comments-area .comment-item .content h4 { font-size: 18px; font-weight: 600; text-transform: capitalize; margin-bottom: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .comments-area .comment-item .content .reply { position: absolute; top: 37px; right: 37px; } .comments-area .comment-item .content .reply a { font-size: 14px; background: #2db1e3; color: #ffffff; display: inline-block; padding: 8px; font-weight: 600; border-radius: 5px; } .comments-area .comment-item .content .reply a:hover { background: #0b5c8d; } .comments-area .comment-item .content .reply i { font-size: 12px; } @media only screen and (max-width: 500px) { .comments-area .comment-item .content .reply { top: auto; right: auto; bottom: 37px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } } .comments-area .comment-item .content p:last-child { margin-bottom: 0; } @media only screen and (max-width: 500px) { .comments-area .comment-item { display: block; text-align: center; padding-bottom: 90px; } } .comments-area .contact-comments .submit { margin-bottom: 0; } .comments-area .contact-comments .comments { margin-top: 20px; } @media only screen and (max-width: 767px) { .comments-area .contact-comments .comments { margin-top: 0; } } @media only screen and (max-width: 767px) { .comments-area .contact-comments .form-group { margin-bottom: 15px; } } .comments-area .comments-form { margin-top: 50px; } .comments-area .comments-form input { -webkit-box-shadow: inherit; box-shadow: inherit; padding: 15px; background: transparent; font-size: 14px; min-height: 60px; border: 2px solid #e7e7e7; } .comments-area .comments-form textarea { -webkit-box-shadow: inherit; box-shadow: inherit; padding: 15px; background: transparent; font-size: 14px; min-height: 60px; border: 2px solid #e7e7e7; min-height: 180px; padding: 15px; } .comments-area .comments-form button { background: transparent; margin-top: 15px; border: 2px solid #2db1e3 !important; background: #2db1e3; overflow: hidden; position: relative; z-index: 1; color: #ffffff; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; padding: 12px 40px; padding-top: 14px; font-size: 16px; border-radius: 5px; font-weight: 600; text-transform: uppercase; } .comments-area .comments-form button:focus { background: transparent; margin-top: 15px; border: 2px solid #2db1e3 !important; overflow: hidden; position: relative; z-index: 1; color: #ffffff; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; padding: 12px 40px; padding-top: 14px; font-size: 16px; border-radius: 5px; font-weight: 600; text-transform: uppercase; } .comments-area .comments-form button:hover { background: #0b5c8d; border-color: #0b5c8d; } .comments-area .comments-form .form-group .submit { margin-bottom: 0; } .comments-area .comments-form .title h2 { font-weight: 600; margin-bottom: 30px; text-transform: capitalize; } .comments-area .comments-form .title h3 { font-weight: 600; margin-bottom: 30px; text-transform: capitalize; } .comments-area .comments-form .title h4 { font-weight: 600; margin-bottom: 30px; text-transform: capitalize; } .comments-area .comments-list { margin-bottom: 50px; } .comments-area .comments-title h2 { font-weight: 600; margin-bottom: 30px; text-transform: capitalize; } .comments-area .comments-title h3 { font-weight: 600; margin-bottom: 30px; text-transform: capitalize; } .comments-area .comments-title h4 { font-weight: 600; margin-bottom: 30px; text-transform: capitalize; } .responsive-video { position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0; } .responsive-video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* ---------------------------------- Contact Style ------------------------------------*/ .contact-style-two-items { overflow: hidden; border-radius: 8px; position: relative; z-index: 1; } .contact-style-two-items .shape-left-top { position: absolute; left: 0; bottom: 0; height: 100%; width: 100%; background-size: cover; background-repeat: no-repeat; z-index: -1; } @media only screen and (max-width: 991px) { .contact-style-two-items .shape-left-top { background: transparent !important; } } @media only screen and (max-width: 991px) { .contact-style-two-items { background: transparent !important; } } .contact-style-two:nth-child(2) { background: rgba(0, 0, 0, 0.1); } .contact-style-two .item { padding: 50px 37px; } .contact-style-two .item .title { font-weight: 600; font-size: 22px; } .contact-style-two .item p { margin: 0; } .contact-style-two .item a { display: inline-block; margin-top: 20px; border-bottom: 1px solid; line-height: 1; } @media only screen and (max-width: 991px) { .contact-style-two .item { background: #2db1e3; border-radius: 7px; } } .contact-style-two i { display: inline-block; font-size: 35px; font-weight: 100; margin-bottom: 35px; height: 80px; width: 80px; line-height: 80px; background: #ffffff; border-radius: 50%; color: #2db1e3; text-align: center; } .contact-style-two i.fa-phone-plus { -webkit-transform: rotate(90deg); transform: rotate(90deg); } .contact-style-two:last-child { border: none; } @media only screen and (max-width: 991px) { .contact-style-two { margin-top: 30px; } .contact-style-two:first-child { margin-top: 0; } } .contact-form-area { position: relative; background: rgba(242, 247, 248, 0.5); } .contact-form-area .google-maps { position: absolute; left: 0; top: 0; height: 100%; width: 60%; border-right: 2px solid #ffffff; } @media only screen and (max-width: 991px) { .contact-form-area .google-maps { position: relative; width: 100%; } } .contact-form-area iframe { min-height: 435px; margin-bottom: -10px; position: absolute; left: 0; top: 0; height: 100%; width: 100%; } .contact-form-area .form { max-width: 630px; padding: 80px; position: relative; z-index: 1; background: #ffffff; -webkit-box-shadow: 0px 10px 30px 0px rgba(44, 130, 237, 0.4); box-shadow: 0px 10px 30px 0px rgba(44, 130, 237, 0.4); border-radius: 8px; } .contact-form-area .form input { border: 1px solid #e7e7e7; background: #ffffff; -webkit-box-shadow: inherit; box-shadow: inherit; margin-bottom: 15px; min-height: 55px; padding: 5px 20px; } .contact-form-area .form textarea { border: 1px solid #e7e7e7; background: #ffffff; -webkit-box-shadow: inherit; box-shadow: inherit; margin-bottom: 15px; padding: 5px 20px; min-height: 180px; } .contact-form-area .form button { border: none; background: #2db1e3; display: inline-block; padding: 17px 45px; font-size: 17px; font-weight: 600; letter-spacing: 0.5px; border-radius: 5px; color: #ffffff; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .contact-form-area .form button i { display: inline-block; margin-right: 5px; font-weight: 100; } .contact-form-area .form button:hover { background: #0b5c8d; } @media only screen and (max-width: 767px) { .contact-form-area .form { max-width: 100%; padding: 50px 30px; margin-top: 350px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .contact-form-area .form { padding: 80px; max-width: 100%; margin-top: 350px; } } @media only screen and (max-width: 991px) { .contact-form-area { padding-top: 0; } } .shape-right-bottom-large { position: absolute; right: -50px; top: -50px; height: 500px; width: 500px; background-size: contain !important; background-repeat: no-repeat; background-position: right top; } .contact-style-two-area { background-size: 35%, contain !important; background-repeat: no-repeat !important; background-position: right bottom !important; background: #ffffff; } .contact-style-two-area .form { max-width: 100%; margin-right: 50px; padding: 0; background: transparent; -webkit-box-shadow: inherit; box-shadow: inherit; } .contact-style-two-area .form input { background: #f7f8fb; border: none; min-height: 60px; padding: 20px; } .contact-style-two-area .form textarea { background: #f7f8fb; border: none; min-height: 200px; padding: 20px; } .contact-style-two-area .form button { border-radius: 30px; margin-top: 15px; } @media only screen and (max-width: 991px) { .contact-style-two-area .form { margin-top: 60px; margin-right: 0; } } @media only screen and (max-width: 991px) { .contact-style-two-area .contact-info { margin-top: 50px; } } .contact-style-two-area .contact-info .item { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 30px; } .contact-style-two-area .contact-info .item .heading { margin-bottom: 40px; } .contact-style-two-area .contact-info .item i { display: inline-block; font-size: 30px; height: 50px; width: 50px; font-weight: 1; color: #2db1e3; } .contact-style-two-area .contact-info .item h5 { font-weight: 600; text-transform: capitalize; font-size: 20px; } .contact-style-two-area .contact-info .item p { margin: 0; } /* ---------------------------------- Breadcrumb Style ------------------------------------*/ .breadcrumb-area { padding: 80px 0; position: relative; z-index: 1; overflow: hidden; } .breadcrumb-area .top-pad-extra { padding-top: 240px; } .breadcrumb-area .row { position: relative; z-index: 1; } .breadcrumb-area .breadcrumb { background: #fff; display: inline-block; margin: 0; padding: 10px 40px; position: relative; z-index: 1; border-radius: 5em; } .breadcrumb-area .breadcrumb>li+li::before { content: "/"; font-weight: 700; padding: 0 5px; display: none; } .breadcrumb-area .breadcrumb li { color: #09445a; padding: 0 15px; position: relative; display: inline-block; z-index: 1; font-weight: 600; font-family: var(--font-default); } .breadcrumb-area .breadcrumb li a { color: #09445a; font-family: var(--font-default); } .breadcrumb-area .breadcrumb li::after { content: "/"; font-weight: 600; right: -7px; position: absolute; font-size: 18px; line-height: 0; top: 50%; margin-top: 1px; } .breadcrumb-area .breadcrumb li i { margin-right: 5px; } .breadcrumb-area .breadcrumb li:last-child::after { display: none; } .breadcrumb-area h1 { display: block; font-weight: 600; margin-top: 70px; margin-bottom: 30px; } @media only screen and (max-width: 767px) { .breadcrumb-area { padding: 80px 0; } } /* ---------------------------------- Error Page Style ------------------------------------*/ /* ============================================================== # Error Page =================================================================== */ .error-page-area .shape { position: absolute; left: 0; bottom: 0; height: 100%; width: 100%; background-position: center !important; background-repeat: no-repeat !important; z-index: -1; opacity: 0.04; background-size: cover !important; } .error-box h1 { font-size: 200px; font-weight: 600; line-height: 140px; margin-bottom: 20px; } .error-box h1 span { line-height: 0; } .error-box .btn { margin-top: 15px; } .error-box h2 { font-weight: 600; } .error-box p { padding: 0 10%; } .error-box .search { text-align: center; } .error-box .search .input-group { display: block; width: auto; max-width: initial; } .error-box .search .input-group form { max-width: 70%; margin: 30px auto auto; position: relative; } .error-box .search .input-group form input { border: 1px solid #e7e7e7; background: transparent; -webkit-box-shadow: inherit; box-shadow: inherit; padding: 20px; } .error-box .search .input-group form button { position: absolute; right: 0; top: 0; background: transparent; height: 50px; padding: 0 20px; border-left: 1px solid #e7e7e7 !important; } .error-box .search .input-group form button i { font-weight: 400; } /* ---------------------------------- Footer Style ------------------------------------*/ footer { overflow: hidden; position: relative; z-index: 1; } @media only screen and (min-width: 768px) and (max-width: 991px) { footer .item { margin-top: 50px; } } @media only screen and (max-width: 767px) { footer .item { margin-top: 50px; } } footer .widget-title { font-weight: 600; font-size: 22px; margin-bottom: 30px; } footer .logo { margin-bottom: 30px; height: 80px; } footer p { color: #cccccc !important; } footer .link li { margin-top: 10px; } footer .link li:first-child { margin-top: 0; } footer .link li a { font-weight: 400; } footer .link li a:hover { margin-left: 10px; } footer .link li i { font-size: 14px; margin-right: 5px; } footer a { font-weight: 400; } footer .about { padding-right: 35px; } footer .social { margin-top: 30px; } footer .social li { display: inline-block; margin-right: 10px; } footer .social li a { display: inline-block; height: 40px; width: 40px; line-height: 45px; text-align: center; background: rgba(255, 255, 255, 0.06); border-radius: 5px; font-size: 14px; } footer .social li a:hover { background: #2db1e3; } footer .address { padding-right: 35px; } footer .address li { margin-top: 25px; display: -webkit-box; display: -ms-flexbox; display: flex; } footer .address li strong { color: #ffffff; display: block; font-weight: 600; } footer .address li i { font-size: 30px; color: #ffffff; margin-right: 15px; position: relative; top: 5px; } footer .address li i.fal.fa-clock { font-size: 26px; } footer .newsletter { position: relative; padding-left: 50px; } footer .newsletter form { margin-top: 30px; } footer .newsletter input, footer .newsletter input:focus { background: transparent; border: 1px solid rgba(255, 255, 255, 0.3); color: #ffffff; } footer .newsletter input::-webkit-input-placeholder, footer .newsletter input:focus::-webkit-input-placeholder { color: #cccccc; font-size: 15px; font-weight: 300; } footer .newsletter input::-moz-placeholder, footer .newsletter input:focus::-moz-placeholder { color: #cccccc; font-size: 15px; font-weight: 300; } footer .newsletter input:-ms-input-placeholder, footer .newsletter input:focus:-ms-input-placeholder { color: #cccccc; font-size: 15px; font-weight: 300; } footer .newsletter input:-moz-placeholder, footer .newsletter input:focus:-moz-placeholder { color: #cccccc; font-size: 15px; font-weight: 300; } footer .newsletter button { border: none; padding: 11px; width: 100%; border-radius: 5px; margin-top: 15px; font-weight: 600; background: transparent; position: relative; z-index: 1; color: #ffffff; } footer .newsletter button i { font-weight: 100; } footer .newsletter button::after { position: absolute; left: 0; top: 0; content: ""; height: 100%; width: 100%; background: #2db1e3; z-index: -1; border-radius: 5px; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; background-size: 220% 150%; } footer .newsletter::after { position: absolute; left: 0; top: -100%; content: ""; height: 500%; width: 300%; background: #2db1e31f; z-index: -1; } @media only screen and (min-width: 768px) and (max-width: 991px) { footer .newsletter::after { display: none; } } @media only screen and (max-width: 767px) { footer .newsletter::after { display: none; } } footer .newsletter::before { position: absolute; left: 0; top: 0; content: ""; height: 100%; width: 3px; background: #2db1e3; } @media only screen and (max-width: 767px) { footer .newsletter::before { display: none; } } @media only screen and (max-width: 767px) { footer .newsletter { padding-left: 0; } } footer.bg-dark li { color: #cccccc; } footer.bg-dark li a { color: #cccccc; } footer.bg-dark li a:hover { color: #ffffff; } footer.bg-dark::after { position: absolute; left: -50px; top: -50px; content: ""; height: 300px; width: 300px; background: #2db1e3; z-index: -1; border-radius: 50%; -webkit-filter: blur(80px); filter: blur(80px); } footer .footer-bottom { border-top: 1px solid rgba(255, 255, 255, 0.2); padding: 20px 0; position: relative; z-index: 1; background: #0b5c8d; } footer .footer-bottom p { margin-bottom: 0; } footer .footer-bottom a { font-weight: 600; } footer .footer-bottom a:hover { color: #2db1e3; } footer .footer-bottom .text-right { text-align: right; } footer .footer-bottom .text-right li { display: inline-block; margin-left: 20px; } footer .footer-bottom .text-right li:first-child { margin-left: 0; } @media only screen and (min-width: 768px) and (max-width: 991px) { footer .footer-bottom .text-right { text-align: center; margin-top: 10px; } } @media only screen and (max-width: 767px) { footer .footer-bottom .text-right { text-align: center; margin-top: 10px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { footer .footer-bottom { text-align: center; } } @media only screen and (max-width: 767px) { footer .footer-bottom { text-align: center; } } @media only screen and (min-width: 768px) and (max-width: 991px) { footer .f-items { padding-top: 70px; } } @media only screen and (max-width: 767px) { footer .f-items { padding-top: 0; } } /* ---------------------------------- Preloader Style ------------------------------------*/ .no-js #loader { display: none; } .js #loader { display: block; position: absolute; left: 100px; top: 0; } .se-pre-con { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 999999; background: url(../img/preloader.gif) center no-repeat #fff; text-align: center; } .kapak { height: 250px; width: 100%; object-fit: cover; } @keyframes TopBottom { 0% { transform: translate(0px, 0px) } 65% { transform: translate(0, 30px) } 100% { transform: translate(0px, 0px) } } .image-hover { position: relative; display: inline-block; overflow: hidden; cursor: pointer; } .image-hover:before { position: absolute; top: 50%; left: 50%; z-index: 2; display: block; content: ''; width: 0; height: 0; background: rgba(255, 255, 255, 0.2); border-radius: 100%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); opacity: 0; cursor: pointer; } .image-hover:hover:before { -webkit-animation: circle .75s; animation: circle .75s; cursor: pointer; } @-webkit-keyframes circle { 0% { opacity: 1 } 40% { opacity: 1 } 100% { width: 200%; height: 200%; opacity: 0 } } @keyframes circle { 0% { opacity: 1 } 40% { opacity: 1 } 100% { width: 200%; height: 200%; opacity: 0 } } /*-------------------------------------------------------------- # Services Two --------------------------------------------------------------*/ .services-two { position: relative; display: block; padding: 60px 0 60px; z-index: 1; background: #F3F6FB; } .services-two:before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 567px; background-color: #e7edf8; z-index: -1; } .services-two__bg { position: absolute; top: 167px; left: 0; right: 0; height: 400px; opacity: .50; background-position: top center; background-repeat: no-repeat; background-size: cover; z-index: -1; } .services-two__single { position: relative; display: block; margin-bottom: 30px; } .services-two__img { position: relative; display: block; overflow: hidden; z-index: 1; } .services-two__img img { width: 100%; border-top-left-radius: 10px; border-top-right-radius: 10px; } .services-two__title-box { position: absolute; bottom: 60px; right: 0; background-color: rgb(255, 255, 255); box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.07); padding: 16px 25px 16px 25px; border-top-left-radius: 10px; border-bottom-left-radius: 10px; transition: opacity 500ms ease, visibility 500ms ease, transform 500ms ease; z-index: 2; width: 85%; } .services-two__single:hover .services-two__title-box { visibility: hidden; opacity: 0; } .services-two__subtitle { font-size: 14px; line-height: 19px; } .services-two__title { font-size: 20px; font-weight: 600; line-height: normal; margin: 0px; } .services-two__title a { color: #0b5c8d; } .services-two__content { position: relative; display: flex; background-color: #2db1e3; align-items: center; justify-content: end; padding: 36px 39px 22px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; } .services-two__icon { position: relative; display: inline-block; } .services-two__icon span { position: relative; display: inline-block; font-size: 64px; color: #ffcd1e; } .services-two__more-details { position: relative; display: block; top: 0; } .services-two__more-details a { font-size: 16px; font-weight: 700; color: #ffffff; position: relative; display: flex; align-items: center; } .services-two__more-details a i { color: #ffffff; padding-right: 10px; } .services-two__hover-content { position: absolute; bottom: 0; right: 0; background-color: rgb(255, 255, 255); box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.07); border-top-left-radius: 10px; padding-left: 30px; padding-right: 35px; padding-top: 26px; padding-bottom: 25px; transform: translateY(-66%); transition: opacity 500ms ease, visibility 500ms ease, transform 500ms ease; visibility: hidden; opacity: 0; z-index: 3; width: 85%; } .services-two__single:hover .services-two__hover-content { visibility: visible; transform: translateY(0%); opacity: 1; } .services-two__hover-sub-title { font-size: 14px; line-height: 19px; } .services-two__hover-title { font-size: 20px; font-weight: 600; line-height: normal; } .services-two__hover-title a { color: #0b5c8d; -webkit-transition: all 500ms ease; transition: all 500ms ease; } .services-two__hover-title a:hover { color: #0b5c8d; } .services-two__hover-text { line-height: 26px; padding-top: 9px; padding-bottom: 13px; } .services-two__hover-more-details { position: relative; display: block; } .services-two__hover-more-details a { font-size: 16px; font-weight: 700; color: #2db1e3; position: relative; display: flex; align-items: center; -webkit-transition: all 500ms ease; transition: all 500ms ease; } .services-two__hover-more-details a i { color: #2db1e3; font-size: 15px; padding-right: 10px; -webkit-transition: all 500ms ease; transition: all 500ms ease; } .services-two__hover-more-details a:hover { color: #0b5c8d; } .services-two__hover-more-details a:hover i { color: #0b5c8d; } .section-title { position: relative; display: block; margin-bottom: 40px; } .section-title__title { text-transform: uppercase; color: #2db1e3; font-weight: 600; background: -webkit-gradient(linear, left top, right top, from(#2db1e3), color-stop(#0b5c8d), to(#2db1e3)); background: linear-gradient(to right, #2db1e3, #0b5c8d, #2db1e3); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; background-size: 220% 150%; display: inline-block; position: relative; z-index: 1; padding-bottom: 20px; } .section-title__title::after { position: absolute; left: 50%; content: ""; height: 10px; width: 32px; background: url(../img/shape/shape_line.png); background-size: contain; background-repeat: no-repeat; bottom: 0; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .proje_img img { height: 320px !important; object-fit: cover; } .projekategori_img img { height: 400px !important; object-fit: cover; } .proje_detay_Swiper { height: 80%; width: 100%; } .projedetay_Thumb_Swiper { height: 20%; box-sizing: border-box; padding: 10px 0; } .projedetay_Thumb_Swiper .swiper-slide { width: 25%; height: 100%; opacity: 0.4; } .projedetay_Thumb_Swiper .swiper-slide-thumb-active { opacity: 1; } .proje_detay_Swiper img { height: 500px; width: 100%; object-fit: contain; background: #000; } .projedetay_Thumb_Swiper img { height: 160px; width: 100%; object-fit: cover; } .urun_detay_Swiper { width: 100%; } .urundetay_Thumb_Swiper { box-sizing: border-box; padding: 10px 0; } .urundetay_Thumb_Swiper .swiper-slide { width: 25%; height: 100%; } .urundetay_Thumb_Swiper .swiper-slide-thumb-active { opacity: 1; } .urundetay_Thumb_Swiper .swiper-slide-thumb-active img { border: 1px solid #2db1e3; } .urun_detay_Swiper img { height: 440px; width: 100%; object-fit: contain; border: 1px solid #f1f4f8; border-radius: 5px; } .urundetay_Thumb_Swiper img { height: 115px; width: 100%; object-fit: contain; border: 1px solid #f1f4f8; padding: 10px; } .project-three__single { position: relative; margin-bottom: 30px; } .project-three__image { position: relative; border-radius: 10px; overflow: hidden; background-color: #fff; box-shadow: 0 5px 35px rgb(0 0 0 / 10%); } .project-three__image img { position: relative; width: 100%; display: block; transition: all 500ms ease; -moz-transition: all 500ms ease; -webkit-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; border-radius: 10px; padding: 5px; height: 370px; object-fit: contain; } .galeri img { height: 300px; object-fit: cover; } .project-three__image:hover img { opacity: 0.50; transform: scale(1.06, 1.06); } .project-three__overlay-box { position: absolute; left: 20px; bottom: 20px; overflow: hidden; border-radius: 10px; display: inline-block; padding: 25px 80px 25px 30px; border-left: 5px solid #2ab684; background-color: #fff; } .project-three__sub-title { position: relative; font-size: 16px; color: #fc8f14; } .project-three__title { position: relative; font-weight: 700; font-size: 20px; margin-top: 5px; margin-bottom: 0; } .project-three__title a { position: relative; color: #080d1c; -webkit-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; -moz-transition: all 300ms ease; transition: all 300ms ease; } .project-three__title a:hover { color: #fc8f14; } .project-three__arrow { position: absolute; right: -20px; bottom: -17px; width: 60px; height: 60px; border-radius: 50%; text-align: center; line-height: 60px; display: inline-block; font-size: 16px; color: #fff; background-color: #fc8f14; -webkit-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; -moz-transition: all 300ms ease; transition: all 300ms ease; } .project-three__arrow:hover { color: #fff; background-color: #2ab684; } .project-three__arrow span { position: absolute; top: 18px; left: 15px; } .arkaBeyaz1 { background: #fff; border-radius: 10px; padding: 20px; } .firmaLogo { -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; margin-bottom: 30px; display: flex; align-items: center; justify-content: center; height: 200px; overflow: hidden; text-align: center } .firmaLogo:hover { -webkit-box-shadow: 0px 2px 30px -5px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 2px 30px -5px rgba(0, 0, 0, 0.2); box-shadow: 0px 2px 30px -5px rgba(0, 0, 0, 0.2); } .bg-3 { background: #efefef; } .card { position: relative; width: 100%; border-radius: 5px; padding: 30px; margin-bottom: 2rem; border: 10px solid transparent; display: inline-block; box-shadow: 0px 0px 20px 0px rgb(62 62 101 / 13%); transition: all 0.4s; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; } #accordion .card { position: relative; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; min-width: 0; word-wrap: break-word; background-color: none; background: none; border-radius: 0; box-shadow: none; padding: 0; margin: 0; } #accordion .card .card-body { background-color: #f4f4f4; color: #000; border-radius: 0; margin-bottom: 5px; } #accordion .card .card-header { background-color: #f4f4f4; color: #2db1e3; border-bottom: 1px solid #f4f4f4; margin-bottom: 5px; } #accordion .card .card-header a { color: #2db1e3; font-weight: 400; width: 100%; } #accordion .card .card-header h5 { font-weight: 400; font-size: 15px; } .select { height: auto; line-height: inherit; padding: 10px 20px; font-size: 14px; border: 0; font-weight: 500; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; } .shop-item { position: relative; margin-bottom: 40px; } .prod-img { width: 100%; height: 350px; text-align: center; box-sizing: border-box; padding: 5px; background: #fff; position: relative; border-bottom: 0; -webkit-box-shadow: 0 0 40px rgba(82, 85, 90, 0.1); -moz-box-shadow: 0 0 40px rgba(82, 85, 90, 0.1); box-shadow: 0 0 40px rgba(82, 85, 90, 0.1); -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; z-index: 1; align-items: center; justify-content: center; display: flex; } .layout-dark .prod-img { background: #212529 !important; } .ins-inverter-badge { height: 90px !important; width: 100px; top: -19px; position: absolute; left: 0px; } .prod-img img { margin-top: 0px; width: auto; max-height: 340px; padding: 10px; } .prod-img .label:not(.discount) { top: 0; color: #3bb77e; background: #3bb77e36; padding: 0 15px; height: 25px; line-height: 25px; font-weight: 600; } .prod-img .label { position: absolute; left: 0px; top: 10px; font-size: 14px; color: #666; } .prod-img .label.discount { right: 10px; left: unset; font-weight: bold; } .prod-img .prod-name { width: calc(100% - 42px); position: absolute; bottom: 20px; font-size: 14px; text-align: center; left: 20px; color: #000; } .prod-text { width: 100%; height: 145px; float: left; background: #fff; box-sizing: border-box; padding: 20px; -webkit-box-shadow: 0 0 40px rgba(82, 85, 90, 0.1); -moz-box-shadow: 0 0 40px rgba(82, 85, 90, 0.1); box-shadow: 0 0 40px rgba(82, 85, 90, 0.1); -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; border-top: 0; position: relative; } .layout-dark .prod-text { background: #212529 !important; } .prod-text .features { width: 100%; text-align: center; float: left; font-size: 14px; } .prod-text .features span { width: 100%; float: left; text-align: center; height: 24px; line-height: 24px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #2db1e3; margin-top: 10px; } .layout-dark .prod-text { color: #fff !important; } .prod-text .price { width: 90%; float: left; text-align: center; margin: 0 5%; color: #000; font-size: 0; } .prod-text .price span.linetrough { color: #666; text-decoration: line-through; font-weight: 300; } .prod-text .price span { font-size: 15px; display: inline-block; text-align: center; height: 40px; line-height: 40px; float: none; font-weight: bold; color: #2db1e3; padding: 0px 10px; } .layout-dark .prod-text .price span { color: #fff !important; } .prod-text .buttons { float: left; width: 100%; margin-top: 10px; text-align: center; } .prod-text .buttons a:last-child { float: right; margin-right: 10px; } .prod-text .buttons a:first-child { float: left; margin-left: 10px; } .prod-text .buttons a { text-align: left; height: 20px; line-height: 20px; font-size: 12px; position: relative; padding-left: 24px; display: inline-block; float: none !important; } .prod-text .prod-detail-btn { transition: all .3s cubic-bezier(.77, 0, .175, 1); position: absolute; left: 0; bottom: 2px; width: 100%; overflow: hidden; height: 50px; line-height: 50px; text-align: center; letter-spacing: 2px; color: #2db1e3; font-size: 14px; font-weight: bold; background: #ffffff05; text-transform: uppercase; } .prod-text .prod-detail-btn span { position: relative; z-index: 3; transition: all .3s cubic-bezier(.77, 0, .175, 1); } .prod-text .prod-detail-btn .hover-bg { transition: all .3s cubic-bezier(.77, 0, .175, 1); position: absolute; left: 0; bottom: 0; width: 100%; height: 0; background: linear-gradient(to right, #2db1e3, #0b5c8d, #2db1e3); z-index: 2; } .prod-text .prod-detail-btn span { position: relative; z-index: 3; transition: all .3s cubic-bezier(.77, 0, .175, 1); } .prod-text .bottom-line { position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; background: linear-gradient(to right, #2db1e3, #0b5c8d, #2db1e3); } .prod:hover .prod-text .prod-detail-btn .hover-bg { height: 50px; } .prod:hover .prod-text .prod-detail-btn span { color: #fff; } .pro-detail-big-img { -webkit-box-shadow: 0 0 40px rgba(82, 85, 90, 0.1); -moz-box-shadow: 0 0 40px rgba(82, 85, 90, 0.1); box-shadow: 0 0 40px rgba(82, 85, 90, 0.1); -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; } .prod-img .label.discount { z-index: 1; background: #2db1e3; color: #ffffff; padding: 0 15px; position: absolute; font-weight: 600; right: 0; top: 0; height: 25px; line-height: 25px; } .product-sort { display: flex; align-items: center; flex-wrap: wrap; margin-bottom: 45px; position: relative } .product-sort .select { background-color: #f4f4f4; } .product-sort .product-sort-ordering { text-align: left; min-width: 240px } .product-sort .product-sort-ordering .pro-choose-ordering { position: relative } .product-sort .product-sort-ordering .pro-choose-ordering .choose-control { width: 100%; border: 1px solid #ddd; padding: 15px 0 15px 20px; display: block; color: #677286; font-size: 16px; font-weight: 500; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; cursor: pointer; outline: 0; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background-color: transparent } .product-sort .product-result-count { text-align: right; flex-grow: 1 } @media(max-width:500px) { .product-sort .product-result-count { text-align: left; margin-top: 20px } .footer .footer-widget .widget-content .module-social { justify-content: center; } .footer .widget-links .widget-content { text-align: left } .footer .widget-links h3 { text-align: left } } .product-sort .product-result-count .product-count-text { font-size: 16px; color: #2db1e3; font-weight: 600; margin: 0; } .sidebar-widget.contact-form-action { padding-left: 0; } .sidebar-widget { position: relative; margin-bottom: 45px; } .sidebar-title { position: relative; margin-bottom: 17px; } .sidebar-title h2 { position: relative; color: #2db1e3; font-size: 24px; font-weight: 600; line-height: 1.3em; text-transform: capitalize; } .blog-cat-two { position: relative; border-radius: 0px; overflow: hidden; background-color: #f4f4f4; } .blog-cat-two li { position: relative; } .blog-cat-two li a { position: relative; color: #000; font-size: 14px; padding: 13px 20px; display: block; transition: all 500ms ease; -moz-transition: all 500ms ease; -webkit-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; border-bottom: 1px dashed #00000036; } .blog-cat-two li a:hover { color: #ffffff; background-color: #2db1e3; } .blog-cat-two li:last-child a { border-bottom: 0px; } .blog-cat-two li a span { position: absolute; right: 20px; } .sidebar .card { margin-bottom: 10px; border-radius: 0; padding: 0; border: 0; box-shadow: none; background: #f9f9f9; } .sidebar .card-header { padding: .75rem 1.25rem; margin-bottom: 0; background: #f9f9f9; border-color: #dedede; border-radius: 0; } .sidebar .card-header a { color: #000; display: block; } .sidebar .show .card-body { border-left: solid 2px #2db1e3 !important; } .sidebar .card-header a:not(.collapsed) .rotate-icon { -webkit-transform: rotate(180deg); transform: rotate(180deg); } .sidebar .title { color: #000; margin-bottom: 25px; font-weight: bold; text-transform: uppercase; } .checkbox-custom, .radio-custom { opacity: 0; position: absolute } .checkbox-custom, .checkbox-custom-label, .radio-custom, .radio-custom-label { display: inline-block; vertical-align: middle; cursor: pointer } .checkbox-custom-label, .radio-custom-label { position: relative; display: block; margin: 0; } .checkbox-custom+.checkbox-custom-label:before, .radio-custom+.radio-custom-label:before { content: ''; border: 1px solid #2db1e3; display: inline-block; line-height: 15px; vertical-align: middle; width: 20px; height: 20px; padding: 2px; margin-right: 10px; text-align: center } .checkbox-custom:checked+.checkbox-custom-label:before { content: ""; background: #2db1e3; color: #2db1e3; } .radio-custom+.radio-custom-label:before { border-radius: 50% } .radio-custom:checked+.radio-custom-label:before { content: ""; background: #fff; color: #1f2026 } .blog-cat-two li.active a { color: #fff; } .blog-cat-two li.active { background-color: #2db1e3; } .contact-form-action .form-control { height: auto; line-height: inherit; padding: 10px 20px; font-size: 14px; color: #2db1e3; border: 0; font-weight: 500; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; background-color: #f4f4f4; min-height: auto; } .contact-form-action .form-group .submit-btn { position: absolute; right: 0px; top: 50%; border: 0; background-color: transparent; color: #2db1e3; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); min-height: auto; } .contact-form-action .form-group .submit-btn:hover { background-color: transparent; } .col-kolaymenu { display: none; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #000; background: none; border: none; float: right; margin-right: 5px; } .col-kolaymenu-filter { display: none; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #000; background: none; border: none; float: right; margin-right: 5px; } .float-right { float: right !important; } @media only screen and (max-width: 767px) { .col-kolaymenu { display: -webkit-inline-box !important; display: -ms-inline-flexbox !important; display: inline-flex !important; } .kolay-menu>ul { display: none; } .col-kolaymenu-filter { display: -webkit-inline-box !important; display: -ms-inline-flexbox !important; display: inline-flex !important; } .kolay-menu-filter .filtre { display: none; } .prod-img { height: auto; } .prod-img img { margin-top: 10px; height: 250px; object-fit: contain; } .prod-text { padding: 0; } .prod-text .price span { font-size: 13px; height: auto; line-height: normal; } .belgeler img { height: auto; } .product-sort { display: flex; align-items: center; flex-wrap: wrap; margin-bottom: 45px; position: relative; margin-left: 10px; margin-right: 10px; margin-top: -20px; } .product-sort .product-sort-ordering { width: 100%; } .sidebar-title h2 { margin-bottom: 5px; } .sidebar-widget { margin-bottom: 20px; } } .urunkucuk img { width: 100%; max-width: 100%; display: block; height: 120px !important; object-fit: contain !important; padding: 5px; background-color: #fff; border: 1px solid #f4f4f4; } .product-price .old-price { text-decoration: line-through; color: #B6B6B6; margin-left: 20px; font-size: 28px; font-weight: 700; } .stock-status { display: inline-block; padding: 8px 12px; border-radius: 5px; margin-bottom: 20px; font-size: 14px; font-weight: 700; line-height: 1; } .stock-status.out-stock { background: #2db1e3; color: #fff; } .stock-status.out-yeni { color: #3bb77e; background: #3bb77e36; } .product-content .product-price { color: #9bcb3b; font-size: 28px; font-weight: 700; line-height: 28px; margin-bottom: 26px; } .product-tabs { background-color: #ffffff; margin-top: 75px; margin-bottom: 40px; border-radius: 5px; } .product-tabs .nav-tabs { background-color: #f1f4f8; border: 0; text-align: center; } .product-tabs .nav-tabs li { margin-right: 30px; } .product-tabs .nav-tabs li:last-child { margin-right: 0; } .product-tabs .nav-tabs li a { color: #2154a5; font-size: 16px; font-weight: 700; text-transform: capitalize; border-radius: 0; margin-right: 0; padding-bottom: 14px; display: block; border-right: 0; position: relative; } .product-tabs .nav-tabs li a::after { content: ''; position: absolute; bottom: -4px; left: 0; width: 100%; height: 4px; background-color: transparent; -webkit-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; } @media (max-width: 420px) { .product-tabs .nav-tabs li a::after { content: unset; } } .product-tabs .nav-tabs li a:focus, .product-tabs .nav-tabs li a:hover { color: #e30909; background: transparent; } .product-tabs .nav-tabs li>.active, .product-tabs .nav-tabs li>.active:focus, .product-tabs .nav-tabs li>.active:hover { color: #e30909; background: transparent; } .product-tabs .nav-tabs li>.active::after, .product-tabs .nav-tabs li>.active:focus::after, .product-tabs .nav-tabs li>.active:hover::after { background-color: #e30909; } .product-tabs .tab-content { border-top: 4px solid #e6eaef; padding: 20px; box-shadow: 0px 15px 28px 0px rgb(62 62 101 / 6%); } .product-tabs .tab-content p { font-size: 15px; font-weight: 400; line-height: 25px; color: #8e949e; } .product-tabs .tab-content h5 { font-size: 13px; } .product-tabs .tab-content .review-comment .review-body { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 25px; } .product-tabs .tab-content .review-comment .review-body img { width: 60px; height: 60px; border-radius: 8px 8px 0 8px; margin-right: 30px; } .product-tabs .tab-content .review-comment .review-body h6, .product-tabs .tab-content .review-comment .review-body p { margin-bottom: 0; } .product-tabs .tab-content .review-comment .review-body .product-rating i.active { color: #e30909; } .product-tabs .tab-content .review-comment .product-comment { margin-bottom: 35px; } .product-tabs .tab-content .review-comment .product-comment p { margin-bottom: 0; } .product-tabs .tab-content .form-review .nice-select .list { width: 100%; } .form-review .form-control { margin-bottom: 30px; } .single-project-item { position: relative; overflow: hidden; margin-bottom: 30px; border-radius } .single-project-item img { width: 100%; transition: all linear 0.3s; } .single-project-item .single-project-overlay { position: absolute; left: 0; top: 0; height: 100%; width: 100%; display: flex; flex-direction: column; justify-content: flex-end; padding-left: 15px; padding-bottom: 32px; z-index: 10; cursor: pointer; } .single-project-item .single-project-overlay::before { position: absolute; content: ''; left: 0; top: 0; height: 100%; width: 100%; background-image: -moz-linear-gradient(90deg, #b882fc 0%, rgba(184, 130, 252, 0) 65%); background-image: -webkit-linear-gradient(90deg, #b882fc 0%, rgba(184, 130, 252, 0) 65%); background-image: -ms-linear-gradient(90deg, #b882fc 0%, rgba(184, 130, 252, 0) 65%); z-index: -1; opacity: 0; transition: all linear 0.3s; } .single-project-item .single-project-overlay .title { color: #fff; font-size: 24px; margin-bottom: 7px; font-weight: 600; max-width: 260px; } @media only screen and (min-width: 1200px) and (max-width: 1600px) { .single-project-item .single-project-overlay .title { font-size: 20px; } } .single-project-item .single-project-overlay span { color: #000; font-weight: 800; font-size: 14px; color: #b882fc; text-transform: uppercase; transition: all linear 0.3s; } .single-project-item .single-project-overlay a { color: #fff; border: 2px solid #fff; border-radius: 50%; height: 50px; width: 50px; text-align: center; line-height: 50px; display: inline-block; position: absolute; right: 0px; bottom: 40px; z-index: 20; opacity: 0; transition: all linear 0.3s; } @media only screen and (min-width: 992px) and (max-width: 1365px) { .single-project-item .single-project-overlay a { position: static; opacity: 1; margin-top: 15px; } } @media only screen and (min-width: 992px) and (max-width: 1200px) { .single-project-item .single-project-overlay a { position: static; opacity: 1; margin-top: 15px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .single-project-item .single-project-overlay a { position: static; opacity: 1; margin-top: 15px; } } @media (max-width: 767px) { .single-project-item .single-project-overlay a { position: static; opacity: 1; margin-top: 15px; } } .single-project-item .single-project-overlay a:hover { background: #fff; color: #b882fc; } .single-project-item:hover .single-project-overlay::before { opacity: 1; } .single-project-item:hover .single-project-overlay span { color: #fff; } .single-project-item:hover .single-project-overlay a { opacity: 1; right: 40px; } .single-project-item:hover img { transform: scale(1.1); } .foto_galeri img { height: 420px; object-fit: cover; border-top-right-radius: 50px; border-bottom-left-radius: 50px; } @media (max-width: 767px) { .gallery-list { margin-top: 15px; } } .gallery-list .gallery-card { margin-bottom: 15px; } .gallery-list .gallery-card:last-child { margin-bottom: 0; } .gallery-list .glink { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .gallery-list .photo { width: 120px; height: 90px; overflow: hidden; } .gallery-list .photo img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .gallery-list .description { padding-left: 20px; } .gallery-list .description .title { color: #6f6f6f; font-size: 16px; font-weight: 500; line-height: 1.3; overflow: hidden; max-height: 43px; } .gallery-list .description .date { color: #939393; font-size: 13px; margin-top: 7px; } .gallery-list .description .date .icon { font-size: 13px; margin-right: 7px; } .gallery.list .gallery-card { margin-bottom: 30px; } @media (max-width: 479px) { .gallery.list .gallery-card:last-child { margin-bottom: 0; } } .gallery-card a { position: relative; display: block; } .gallery-card a:hover .gallery-body { background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.7))); background: linear-gradient(transparent, rgba(0, 0, 0, 0.7)); } .gallery-card a:hover .gallery-cover img { -webkit-transform: scale(1.1); transform: scale(1.1); } .gallery-card a:hover .gallery-photo img { -webkit-transform: scale(1.1); transform: scale(1.1); } .gallery-card a:hover .gallery-overlay { opacity: 1; visibility: visible; } .gallery-header { position: relative; } .gallery-header .icon { position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; width: 50px; height: 50px; border-radius: 100%; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; background: rgba(238, 51, 53, 0.9); color: #fff; font-size: 18px; } .gallery-photo { overflow: hidden; height: 200px; } .gallery-photo img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -webkit-transition: .7s ease; transition: .7s ease; } .gallery-footer { padding-top: 15px; } .gallery-footer .title { color: #6f6f6f; font-size: 16px; font-weight: 500; line-height: 1.4; max-height: 46px; overflow: hidden; margin-bottom: 8px; } .gallery-footer .text { color: #6f6f6f; font-size: 13px; line-height: 1.7; max-height: 64px; overflow: hidden; } .gallery-overlay { position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 11; background: rgba(0, 0, 0, 0.3); padding: 40px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-align: center; opacity: 0; visibility: hidden; -webkit-transition: .3s; transition: .3s; } .gallery-overlay .icon { font-size: 42px; color: #fff; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; color: #fff; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .gallery-body { left: 0; right: 0; top: 0; bottom: 0; position: absolute; background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.5))); background: linear-gradient(transparent, rgba(0, 0, 0, 0.5)); padding: 30px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } @media (max-width: 767px) { .gallery-body { padding: 20px; } } .gallery-body .title { color: #fff; font-size: 21px; font-weight: 600; line-height: normal; padding-right: 50px; overflow: hidden; max-height: 90px; margin: 0; } .gallery-body .date { color: #fff; font-size: 13px; margin-top: 10px; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; opacity: .8; } .gallery-body .date .icon { font-size: 13px; margin-right: 7px; } .gallery-body>.icon { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; width: 50px; height: 50px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; background: #ee3335; border-radius: 100%; color: #fff; font-size: 18px; position: absolute; right: 20px; top: 20px; } @media (max-width: 479px) { .gallery-body>.icon { display: none; } } .gallery-cover { overflow: hidden; height: 300px; } @media (max-width: 479px) { .gallery-cover { height: auto; } } .gallery-cover img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -webkit-transition: ease .7s; transition: ease .7s; } .no-gutters { margin-right: 0; margin-left: 0; } .video-detail__wrapper { background: #333; min-height: 600px; padding-top: 50px; padding-bottom: 150px; } .video-detail__header { margin-top: 20px; margin-bottom: 20px; } .video-detail__header .title { color: #ffffff; font-size: 28px; font-weight: 400; } .video-detail-player iframe { width: 100%; height: 530px; } @media (max-width: 767px) { .video-detail-player iframe { height: auto; } } @media (min-width: 768px) and (max-width: 991px) { .video-detail-player iframe { height: 400px; } } .video-detail-other-videos .heading { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; background: rgba(0, 0, 0, 0.2); height: 60px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding-left: 15px; padding-right: 15px; color: #ffffff; font-size: 16px; font-weight: 400; margin: 0; } .video-detail-other-videos .heading .all-videos { text-transform: capitalize; font-size: 12px; color: #ffffff; opacity: .7; font-weight: 400; } .video-detail-other-videos .heading .all-videos:hover { text-decoration: underline; } .video-detail-list { overflow-y: auto; background: #212529; height: calc(530px - 60px); border-bottom: 1px solid rgba(255, 255, 255, 0.07); margin: 0; padding: 0; } @media (min-width: 768px) and (max-width: 991px) { .video-detail-list { height: 340px; } } .video-detail-list li { padding-top: 10px; padding-bottom: 10px; border-bottom: 1px solid rgba(255, 255, 255, 0.07); -webkit-transition: .3s; transition: .3s; } .video-detail-list li:last-child { border-bottom: 0 none; } .video-detail-list li:hover { background: rgba(0, 0, 0, 0.2); } .video-detail-list li a { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .video-detail-list .video-left { width: 110px; height: 70px; position: relative; margin-left: 10px; margin-right: 10px; } .video-detail-list .video-left img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .video-detail-list .video-left .icon { position: absolute; left: 0; right: 0; top: 0; bottom: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: rgba(0, 0, 0, 0.55); color: #ffffff; font-size: 16px; } .video-detail-list .video-right { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding-left: 5px; padding-right: 15px; } .video-detail-list .video-right .title { color: #ffffff !important; font-size: 14px !important; line-height: 1.4 !important; margin-bottom: 0px !important; } .no-gutters>.col, .no-gutters>[class*=col-] { padding-right: 0; padding-left: 0; } .videobg { background: #333; } .services-sidebar { clear: both; } .btn--yeni { border: none; background: #2db1e3; padding: 15px 25px; color: #fff; border-radius: 5px; } .btn--yeni:hover { background: #0b5c8d; color: #fff; } .kapat { background: #2db1e3; border: none; color: #fff; display: flex; justify-content: center; align-items: center; position: absolute; right: 0; top: 0; width: 40px; height: 40px; z-index: 10; } .kapat:hover { background: #0b5c8d; } .contact-card { padding: 47px 50px 40px; border-radius: 4px; -webkit-box-shadow: 0px 5px 83px 0px rgba(3, 43, 86, 0.12); box-shadow: 0px 5px 83px 0px rgba(3, 43, 86, 0.12); position: relative; height: -webkit-max-content; height: -moz-max-content; height: max-content; } @media (min-width: 992px) and (max-width: 1199.98px) { .contact-card { padding: 37px 25px 30px; } } @media screen and (max-width: 767.98px) { .contact-card { padding: 37px 25px 30px; } } .contact-card .contact-body .card-heading { font-family: #2154a5; font-size: 24px; line-height: 1; font-weight: 700; text-transform: capitalize; color: #05213f; margin-bottom: 20px; } @media screen and (max-width: 991.98px) { .contact-card .contact-body .card-heading { text-align: center; line-height: 1.4; } } .contact-card .contact-body .card-desc { font-weight: 400; font-size: 15px; line-height: 25px; color: #8e949e; margin-bottom: 28px; } @media screen and (max-width: 991.98px) { .contact-card .contact-body .card-desc { text-align: center; } } .contact-card .contact-body h4 { font-weight: bold; color: #fff; font-size: 30px; margin-bottom: 30px; } .contact-card .contact-body form { margin-bottom: 0; } .contact-card .contact-body form .form-control { margin-bottom: 26px; } .contact-card .contact-body .custom-radio-group { margin-bottom: 22px; } .contact-card .contact-body .btn { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; height: 60px; } @media screen and (min-width: 768px) { .contact-card .contact-body .btn { height: 75px; } } .contact-card .contact-body .btn i { font-size: 10px; } .contact-card .contact-body .contact-result { margin-top: 10px; text-align: center; } @media screen and (max-width: 991.98px) { .contact-card.contact-card-2 { margin-bottom: 70px; } } .contact-card.contact-card-2 .custom-radio-group { -ms-flex-wrap: wrap; flex-wrap: wrap; } .contact-card.contact-card-2 .price-value { display: block; width: 100%; color: #8e949e; font-size: 14px; font-weight: 700; height: 55px; line-height: 1; border-radius: 4px; background-color: #e6eaef; border: 0; padding-left: 25px; margin-bottom: 50px; color: #1d65b9; } .contact-card.contact-card-2 .block-info:first-child { margin-bottom: 20px; } .golge1 { box-shadow: 0px 0px 20px 0px rgb(62 62 101 / 13%) !important; } .turkey-map-drawing { text-align: center; } .turkey-map-drawing svg { width: 100%; height: auto; } .turkey-map-drawing g.is-completed path { fill: #2db1e3; } .turkey-map-drawing path { cursor: pointer; fill: #0b5c8d; -webkit-transition: .2s; transition: .2s; } .turkey-map-drawing path:hover { fill: #2db1e3 !important; } .turkey-map-name { position: absolute; z-index: 2; } .turkey-map-name div { display: inline-block; background: #2db1e3; color: #ffffff; font-size: 13px; font-weight: 500; padding: 8px 16px; border-radius: 2px; } .list .card { width: 100%; border-radius: 5px; padding: 30px; margin-bottom: 2rem; border: 10px solid transparent; display: inline-block; box-shadow: 0px 0px 20px 0px rgb(62 62 101 / 13%); transition: all 0.4s; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; } .bayiler>.icon { position: absolute; right: 30px; top: 15px; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; border-radius: 100%; width: 37px; height: 37px; border: 2px solid currentColor; color: #000; opacity: .3; } .box-header { margin-bottom: 50px; } .bayiler .title { color: #4d4d4d; font-size: 20px; font-weight: 600; line-height: 1.3; margin-bottom: 0; } .bayiler .title.small { font-size: 12px; font-weight: 400; margin-bottom: 0px; } .bayiler .text { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #939393; font-size: 13px; margin-top: 5px; margin-right: 10px; } .box-footer .name { color: #777; font-size: 16px; font-weight: 500; display: block; } .box-footer .text .icon { margin-right: 10px; font-size: 13px; } .actions-holder { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; justify-content: right; } .btn2 { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; z-index: 2; font-size: 15px; font-weight: bold; text-transform: capitalize; border: none; } .btn--transparent { background-color: transparent; color: #fff; border: 2px solid transparent; } .btn--transparent::before { content: unset; } .btn--transparent:active, .btn--transparent:focus, .btn--transparent:hover { color: #fff; } .btn--transparent.btn--primary { border-color: #e30909; } .btn--transparent.btn--primary:active, .btn--transparent.btn--primary:focus, .btn--transparent.btn--primary:hover { background-color: #e30909; } .btn--transparent.btn--white { border-color: #fff; } .btn--transparent.btn--white:active, .btn--transparent.btn--white:focus, .btn--transparent.btn--white:hover { border-color: #e30909; background-color: #e30909; } .ist_icon { font-size: 65px; margin-bottom: 20px; color: #2db1e3; opacity: 0.2; } .single-services-box { background-color: #fafafa; -webkit-transition: 0.5s; transition: 0.5s; padding: 30px; } .single-services-box h3 { position: relative; padding-left: 65px; line-height: 1.4; font-size: 20px; font-weight: 700; padding: 0; margin-bottom: 10px; } .single-services-box h3 i { color: #fe235b; display: inline-block; position: absolute; left: 0; font-size: 45px; top: 3px; z-index: 1; } .single-services-box h3 i::after { position: absolute; left: -10px; top: -3px; z-index: -1; background-color: #fbd3dd; width: 55px; height: 55px; content: ''; border-radius: 50%; } .single-services-box h3 i.color-043d72 { color: #043d72; } .single-services-box h3 i.color-043d72::after { background-color: #d4d6de; } .single-services-box p { margin-top: 15px; } .single-services-box .read-more-btn { display: inline-block; margin-top: 6px; color: #130947; text-transform: uppercase; font-weight: 700; font-size: 14px; } .single-services-box .read-more-btn:hover { color: #1a1a1a; } .single-services-box:hover { background-color: #fffffffff; border-color: #fffffffff !important; -webkit-transform: scale(1.05); transform: scale(1.05); -webkit-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.07); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.07); position: relative; z-index: 1; } .row .col-lg-6:nth-child(1) .single-services-box { border-right: 1px solid #1a1a1a; border-bottom: 1px solid #1a1a1a; } .row .col-lg-6:nth-child(2) .single-services-box { border-bottom: 1px solid #1a1a1a; } .row .col-lg-6:nth-child(3) .single-services-box { border-right: 1px solid #1a1a1a; border-bottom: 1px solid #1a1a1a; } .row .col-lg-6:nth-child(4) .single-services-box { border-bottom: 1px solid #1a1a1a; } .row .col-lg-6:nth-child(5) .single-services-box { border-right: 1px solid #1a1a1a; border-bottom: 1px solid #1a1a1a; } .row .col-lg-6:nth-child(6) .single-services-box { border-bottom: 1px solid #1a1a1a; } .row .col-lg-6:nth-child(7) .single-services-box { border-right: 1px solid #1a1a1a; border-bottom: 1px solid #1a1a1a; } .row .col-lg-6:nth-child(8) .single-services-box { border-bottom: 1px solid #1a1a1a; } .row .col-lg-4:nth-child(1) .single-services-box { border-right: 1px solid #1a1a1a; border-bottom: 1px solid #1a1a1a; } .row .col-lg-4:nth-child(2) .single-services-box { border-bottom: 1px solid #1a1a1a; } .row .col-lg-4:nth-child(3) .single-services-box { border-left: 1px solid #1a1a1a; border-bottom: 1px solid #1a1a1a; } .row .col-lg-4:nth-child(4) .single-services-box { border-bottom: 1px solid #1a1a1a; } .row .col-lg-4:nth-child(4) .single-services-box, .row .col-lg-4:nth-child(5) .single-services-box, .row .col-lg-4:nth-child(7) .single-services-box, .row .col-lg-4:nth-child(8) .single-services-box { border-right: 1px solid #1a1a1a; } .row .col-lg-4:nth-child(7) .single-services-box { border-top: 1px solid #1a1a1a; } .row .col-lg-4:nth-child(8) .single-services-box { border-top: 1px solid #1a1a1a; } .row .col-lg-4:nth-child(9) .single-services-box { border-top: 1px solid #1a1a1a; } .service-box-area.st-1 { background-repeat: no-repeat; } .modal_footer_anasayfa { position: absolute; bottom: 0; right: 0; background-image: linear-gradient(to bottom, rgba(255, 0, 0, 0), rgb(0 0 0)); width: 100%; } .modal_header_anasayfa { position: absolute; right: 0; } .modal_footer_anasayfa .checktext { color: #fff; } .broucher-box { position: relative; padding: 12px 22px; border-radius: 6px; overflow: hidden; margin-bottom: 20px; transition: all 500ms ease; -moz-transition: all 500ms ease; -webkit-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; border: 1px solid #ddd; text-align: left; } .broucher-box .overlay-link { position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; display: block; z-index: 1; } .broucher-box .broucher-inner { position: relative; font-size: 16px; color: #1b4962; font-weight: 400; transition: all 500ms ease; -moz-transition: all 500ms ease; -webkit-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; } .broucher-box .broucher-inner .download-icon { position: absolute; right: -5px; top: 2px; color: #222222; font-size: 16px; line-height: 1em; transition: all 500ms ease; -moz-transition: all 500ms ease; -webkit-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; } .broucher-box:hover { border-color: #2154a5; } .broucher-box:hover { color: #fff; background-color: #2154a5; } .broucher-box:hover .broucher-inner .download-icon, .broucher-box:hover .broucher-inner { color: #fff; } .broucher-box:last-child { margin-bottom: 0px; } .mobil_right{ display:none; } @media only screen and (max-width: 767px) { .banner-area { margin-top: 88px; } .banner-area.banner-style-two .swiper-slide{ background-size: contain !important; height:260px; background-repeat: no-repeat !important; background-position: top !important; } .banner-area.top-pad-150 .content{ padding-bottom: 0; padding-top: 0; } .banner-area p{ font-size: 13px; line-height: normal; margin-top:10px; } .banner-area.banner-style-two .content h2{ font-size:20px; margin-bottom:0px; line-height: normal; } .banner-area.banner-style-two .content .button{ margin-top:10px; } .banner-area.banner-style-two .content .button a{ padding:5px 15px; font-size:13px; } .banner-area .swiper-pagination{ bottom:10px; } .choose-us-card { margin-top: 0px; margin-bottom:20px; } .breadcrumb-area { padding-top: 70px; padding-bottom: 20px; } .breadcrumb-area h1 { display: block; font-weight: 600; margin-top: 30px; margin-bottom: 10px; font-size: 20px; } .breadcrumb-area .breadcrumb { background: #fff; display: inline-block; margin: 0; padding: 5px 15px; position: relative; z-index: 1; border-radius: 5em; } .breadcrumb-area .breadcrumb li { color: #09445a; padding: 0 10px; position: relative; display: inline-block; z-index: 1; font-weight: 600; font-size: 13px; } .breadcrumb-area .breadcrumb li a { color: #09445a; font-size: 13px; } .product-sort { margin-top: 0; margin-left: 0; margin-right: 0; } .accordion-item { margin-bottom:10px; } .prod-img img { margin-top: 10px; height: 140px; object-fit: cover; } .prod-text { height: 130px; } .prod-text .price { margin-top: 10px; } .urun_detay_Swiper img { height: 278px; width: 100%; object-fit: contain; border: 1px solid #f1f4f8; border-radius: 10px; padding: 5px; } .urundetay_Thumb_Swiper img { height: 70px; width: 100%; object-fit: contain; border: 1px solid #f1f4f8; padding: 5px; } .proje_detay_Swiper img { height: 260px; width: 100%; object-fit: contain; background: #000; } .projedetay_Thumb_Swiper img { height: 80px; width: 100%; object-fit: cover; } .api { position: fixed; bottom: 0 !important; left: 0 !important; z-index: 9 !important; width: 100% !important; display: flex; } .api div{ flex: 1 0 0%; } .api a{ border-radius:0 !important; width: 100% !important; } .api:hover a { transform: rotate(0deg) !important; -webkit-transform: rotate(0deg) !important; } footer { padding-bottom: 50px; } a.navbar-brand { left: 48%; } .mobil_right{ position: absolute; top: 0; right: 10px; height: 88px; display: flex; } }