/*----------------------------------------------------------------- Main Style Stylesheet Template Name : Facnex - Industry & Factory HTML Template Author : NourEgy Version : 1.0 Primary Use : Industry, Factory -----------------------------------------------------------------*/ /*----------------------------------------------------------------- Table Of Index -------------------------------- 1. Reset css 2. Style Css 1- Loading Screen 2- Navigation 3- Home 4- About 5- Service 6- Statistics 7- Protfolio 8- Testimonial 9- Blog 11- Footer -----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Default Settings ----------------------------------------------------------------*/ /*========== All Transition Settings ==========*/ /*========== Block Settings ==========*/ img { max-width: 100%; height: auto; } iframe { width: 100%; border: none; } a, a:hover, a:focus, a:active, button:focus { text-decoration: none; border: none; outline: 0; color: #FFF; } ul ol, li{ list-style: none; margin: 0; padding: 0; } select:focus, select:active { box-shadow: none; border: 0; outline: 0 } select { height: 50px !important; outline: 0; resize: none; font-weight: 400; display: block; width: 100%; line-height: 24px; font-size: 14px; border: 1px solid #f1f1f1; padding: 13px 20px; background: #f9f9f9; color: #02185a; border-radius: 0px; margin-bottom: 30px; box-shadow: none !important; width: 100%; } .nice-select { width: 100% !important; border-radius: 0 !important; height: 50px; line-height: 50px; font-size: 15px; background: #fff !important; margin-bottom: 30px; } .nice-select .list { width: 100%; overflow-y: scroll; max-height: 160px; z-index: 999; border-radius: 0; } label { text-transform: uppercase; font-weight: 600; } input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="tel"]:focus, input[type="search"]:focus, input[type="password"]:focus, input[type="subject"]:focus, textarea:focus, select:focus, button:focus { outline: none; border: 1px solid #2859a8; } input[type="text"], input[type="email"], input[type="url"], input[type="tel"], input[type="search"], input[type="password"], input[type="subject"], textarea { outline: 0; resize: none; font-weight: 400; display: block; width: 100%; line-height: 24px; height: 50px; font-size: 14px; border: 1px solid #eee; padding: 13px 20px; background: #fff; color: #02185a; border-radius: 0px; margin-bottom: 30px; box-shadow: none !important; } textarea { height: 150px; padding-top: 20px; } textarea:focus { outline: none !important; box-shadow: none !important; } /*========== Typography Settings ==========*/ h1,h2,h3,h4,h5,h6 { margin: 0; padding: 0; line-height: 1; } h1 { font-size: 55px; font-weight: 700; } h2 { font-size: 40px; font-weight: 500; } h3 { font-weight: 500; font-size: 23px; } h4 { font-size: 23px; font-weight: 500; } h5 { font-size: 20px; font-weight: 500; } p { line-height: 28px; font-weight: 400; font-family: 'Roboto', sans-serif; color: #000; } .empty-btn { border: 1px solid rgba(255, 255, 255, 0.2); padding: 10px 30px; text-transform: uppercase; font-size: 13px; font-family: 'Roboto', sans-serif; font-weight: 600; display: inline-block; } .empty-btn:hover { border: 1px solid rgba(255, 255, 255, 0.5); } /*========== Spacing CSS ==========*/ .pt-220 { padding-top: 220px; } .ptb-130 { padding-top: 130px; padding-bottom: 130px; } .pt-130 { padding-top: 130px; } .pb-130 { padding-bottom: 130px; } .ptb-120 { padding-top: 120px; padding-bottom: 120px; } .pt-120 { padding-top: 120px; } .pb-120 { padding-bottom: 120px; } .ptb-110 { padding-top: 110px; padding-bottom: 110px; } .pt-110 { padding-top: 110px; } .pb-110 { padding-bottom: 110px; } .ptb-100 { padding-top: 100px; padding-bottom: 100px; } .pt-100 { padding-top: 100px; } .pb-100 { padding-bottom: 100px; } .ptb-90 { padding-top: 40px; padding-bottom: 40px; } .pt-90 { padding-top: 40px; } .pb-90 { padding-bottom: 40px; } .ptb-80 { padding-top: 80px; padding-bottom: 80px; } .pt-80 { padding-top: 80px; } .pb-80 { padding-bottom: 80px; } .ptb-70 { padding-top: 40px; padding-bottom: 40px; } .pt-70 { padding-top: 40px; } .pb-70 { padding-bottom: 40px; } .ptb-60 { padding-top: 60px; padding-bottom: 60px; } .pt-60 { padding-top: 60px; } .pb-60 { padding-bottom: 60px; } .ptb-50 { padding-top: 50px; padding-bottom: 50px; } .pt-50 { padding-top: 50px; } .pb-50 { padding-bottom: 50px; } .ptb-40 { padding-top: 40px; padding-bottom: 40px; } .pt-40 { padding-top: 40px; } .pb-40 { padding-bottom: 40px; } .pb-30 { padding-bottom: 30px; } .pt-30 { padding-top: 30px; } .pb-20 { padding-bottom: 20px; } .pt-20 { padding-top: 20px; } .pb-10 { padding-bottom: 10px; } .pt-10 { padding-top: 10px; } .no-padding { padding: 0; } .mt-100 { margin-top: 100px; } .mb-100 { margin-bottom: 100px; } .mb-70 { margin-bottom: 70px } .mt-50 { margin-top: 50px; } .mb-50 { margin-bottom: 50px; } .mb-40 { margin-bottom: 40px; } .mt-40 { margin-top: 40px; } .mt-30 { margin-top: 30px; } .mr-30 { margin-right: 30px !important; } .mb-30 { margin-bottom: 30px; } .ml-30 { margin-left: 30px; } .mt-25 { margin-top: 25px; } .mr-25 { margin-right: 25px; } .mb-25 { margin-bottom: 25px; } .ml-25 { margin-left: 25px; } .mt-20 { margin-top: 20px; } .mr-20 { margin-right: 20px; } .mb-20 { margin-bottom: 20px; } .ml-20 { margin-left: 20px; } .mt-15 { margin-top: 15px; } .mr-15 { margin-right: 15px; } .mb-15 { margin-bottom: 15px; } .ml-15 { margin-left: 15px; } .mt-15 { margin-top: 15px; } .mr-15 { margin-right: 15px; } .mb-15 { margin-bottom: 15px; } .ml-15 { margin-left: 15px; } .mt-10 { margin-top: 10px; } .mr-10 { margin-right: 10px; } .mb-10 { margin-bottom: 10px !important; } .ml-10 { margin-left: 10px; } .mt-5 { margin-top: 5px; } .mr-5 { margin-right: 5px; } .mb-5 { margin-bottom: 5px; } .ml-5 { margin-bottom: 5px; } .mt-0 { margin-top: 0px; } .mr-0 { margin-right: 0px; } .mb-0 { margin-bottom: 0px; } .ml-0 { margin-left: 0px; } .mrl-row { margin-right: 0; margin-left: 0; } .last-child { margin-bottom: 0px !important; } /*========= Alignment CSS ==========*/ .text-center { text-align: center; } .text-right { text-align: right; } /*========== My Classes ==========*/ .section-title { margin-bottom: 20px; } .section-title-left { margin-bottom: 15px; } .section-title h2, .section-title-left h2 { color: #02185a; display: block; text-transform: uppercase; font-family: 'Roboto', sans-serif; font-weight: 600; letter-spacing: .20px; font-size: 14px; line-height: 14px; margin: 0; margin-bottom: 10px; font-weight: 600; } .section-title h2, .section-title-left h2 { padding-left: 0px; position: relative; color: #02185a; } .section-title h2::after, .section-title-left h2::after { background: #2859a8; line-height: 27px; position: absolute; left: 0; content: ""; top: 5px; height: 3px; width: 40px; display: none; } .section-title h3, .section-title-left h3 { color: #000; text-transform: capitalize; font-size: 25px; font-weight: 600; margin-bottom: 0px; line-height: 34px; } .section-title h3 { margin-bottom: 20px; } .p-title-section { text-transform: capitalize; font-family: 'Poppins', sans-serif; font-weight: 500; line-height: 30px; font-size: 15px; margin-bottom: 20px; margin-top: -5px; margin-left: -20px; } .section-title h3 span, .section-title-left h3 span { color: #2859a8; } .section-title .line-title { width: 75px; height: 3px; background: #2859a8; margin-right: auto; margin-left: auto; margin-top: 22px; } /*.section-title p { max-width: 630px; margin-right: auto; margin-left: auto; margin-top: 25px; color: #9e9e9e; font-size: 15px; font-weight: 400; line-height: 24px; margin-bottom: 0; text-transform: capitalize; }*/ .section-title-left .line-title { margin-bottom: 22px; width: 75px; height: 3px; background: #2859a8; margin-top: 22px; } .display-table { width: 100%; height: 100%; display: table; } .table-cell { display: table-cell; vertical-align: middle; } .position-relative { position: relative; } .position-absolute { position: absolute; } .position-inherit { position: inherit; } .title-inner-page { color: #02185a; text-transform: capitalize; font-size: 25px; font-weight: 600; margin-bottom: 30px; line-height: 25px; margin-top: 0; } /*main-btn-one*/ .main-btn-one, .main-btn-two, .main-btn-three, .main-btn-four { position: relative; min-width: 180px; background: #FFF; color: #02185a; line-height: 50px; height: 50px; display: inline-block; -webkite-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; font-family: 'Poppins', sans-serif; } .main-btn-one:focus { background: #FFF; color: #02185a; } .main-btn-one:hover { color: #2859a8; } .main-btn-one .text-btn, .main-btn-two .text-btn, .main-btn-three .text-btn, .main-btn-four .text-btn { float: left; min-width: 130px; text-align: center; font-size: 13px; text-transform: uppercase; font-weight: 600; position: relative; letter-spacing: .50px; overflow: hidden; } .main-btn-one .text-btn .text-btn-one, .main-btn-two .text-btn .text-btn-one, .main-btn-three .text-btn .text-btn-one, .main-btn-four .text-btn .text-btn-one { display: block; margin-left: -100%; float: left; transition: .4s; text-align: center; min-width: 130px; height: 50px; padding: 0 15px; background: #2859a8; color: #FFF; } .main-btn-one .text-btn .text-btn-two, .main-btn-two .text-btn .text-btn-two, .main-btn-three .text-btn .text-btn-two, .main-btn-four .text-btn .text-btn-two { margin-left: 0px; transition: .4s; min-width: 130px; height: 50px; text-align: center; display: block; padding: 0 15px; display: block; background: #FFF; color: #02185a; } .main-btn-one:hover .text-btn .text-btn-one, .main-btn-two:hover .text-btn .text-btn-one, .main-btn-three:hover .text-btn .text-btn-one, .main-btn-four:hover .text-btn .text-btn-one { margin-left: 0; } .main-btn-one:hover .text-btn .text-btn-two, .main-btn-two:hover .text-btn .text-btn-two, .main-btn-three:hover .text-btn .text-btn-two, .main-btn-four:hover .text-btn .text-btn-two { margin-left: 100%; } .main-btn-one::after, .main-btn-two::after, .main-btn-three::after, .main-btn-four::after, .main-btn-one .text-btn::after, .main-btn-two .text-btn::after, .main-btn-three .text-btn::after, .main-btn-four .text-btn::after, .main-btn-one .arrow-btn::after, .main-btn-two .arrow-btn::after, .main-btn-three .arrow-btn::after, .main-btn-four .arrow-btn::after { content: ""; clear: both; display: block; width: 100%; } .main-btn-one .text-btn::before, .main-btn-two .text-btn::before, .main-btn-three .text-btn::before, .main-btn-four .text-btn::before { content: ""; width: 2px; height: 50px; background: #ddd; right: 0; top: 0px; position: absolute; opacity: 0.5; } .main-btn-one:hover .text-btn::before { background: #e06026; } .main-btn-one .arrow-btn, .main-btn-two .arrow-btn, .main-btn-three .arrow-btn, .main-btn-four .arrow-btn { height: 50px; width: 50px; text-align: center; overflow: hidden; background: #f9f9f9; line-height: 50px; } .main-btn-one .arrow-btn .arrow-one, .main-btn-two .arrow-btn .arrow-one, .main-btn-three .arrow-btn .arrow-one, .main-btn-four .arrow-btn .arrow-one { display: block; background: #2859a8; font-size: 13px; line-height: 50px; color: #fff; margin-left: -50px; float: left; transition: .4s; text-align: center; width: 50px; height: 50px; font-size: 15px; } .main-btn-one .arrow-btn .arrow-two, .main-btn-two .arrow-btn .arrow-two, .main-btn-three .arrow-btn .arrow-two, .main-btn-four .arrow-btn .arrow-two { background: #f9f9f9; font-size: 13px; line-height: 50px; margin-left: 0px; transition: .4s; height: 50px; width: 50px; text-align: center; font-size: 15px; display: block; } .main-btn-one:hover .arrow-btn .arrow-one, .main-btn-two:hover .arrow-btn .arrow-one, .main-btn-three:hover .arrow-btn .arrow-one, .main-btn-four:hover .arrow-btn .arrow-one { margin-left: 0; } .main-btn-one:hover .arrow-btn .arrow-two, .main-btn-two:hover .arrow-btn .arrow-two, .main-btn-three:hover .arrow-btn .arrow-two, .main-btn-four:hover .arrow-btn .arrow-two { margin-left: 50px; } /* Color Btn Two*/ .main-btn-two .text-btn .text-btn-one { background: #02185a; color: #FFF; } .main-btn-two .text-btn .text-btn-two { background: #2859a8; color: #fff; } .main-btn-two .text-btn::before { background: #e4500d; } .main-btn-two:hover .text-btn::before { background: #2e3e6c; } .main-btn-two .arrow-btn { background: #2859a8; line-height: 50px; } .main-btn-two .arrow-btn .arrow-one { background: #011552; color: #fff; } .main-btn-two .arrow-btn .arrow-two { background: #2859a8; color: #FFF; } /* Color Btn Three */ .main-btn-three .text-btn .text-btn-one { background: #fff; color: #02185a; } .main-btn-three .text-btn .text-btn-two { background: #2859a8; color: #fff; } .main-btn-three .text-btn::before { background: #e4500d; } .main-btn-three:hover .text-btn::before { background: #eee; } .main-btn-three .arrow-btn { background: #2859a8; line-height: 50px; } .main-btn-three .arrow-btn .arrow-one { background: #fff; color: #02185a; } .main-btn-three .arrow-btn .arrow-two { background: #2859a8; color: #FFF; } /* Color Btn Four */ .main-btn-four .text-btn .text-btn-one { background: #02185a; color: #fff; } .main-btn-four .text-btn .text-btn-two { background: #fff; color: #02185a; } .main-btn-four .text-btn::before { background: #02185a; } .main-btn-four:hover .text-btn::before { background: #2e3e6c; } .main-btn-four .arrow-btn { background: #02185a; line-height: 50px; } .main-btn-four .arrow-btn .arrow-one { background: #02185a; color: #fff; } .main-btn-four .arrow-btn .arrow-two { background: #f9f9f9; color: #02185a; } .btn-read-more { position: relative; -webkite-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; padding-bottom: 2px; color: #02185a; font-size: 12px; line-height: 20px; text-transform: uppercase; font-weight: 700; display: inline-block; width: auto; margin-top: 17px; } .btn-read-more:active, .btn-read-more:focus { color: #02185a; } .btn-read-more:hover::before { left: 0; width: 100%; right: auto; } .btn-read-more::before { content: ''; position: absolute; right: 0; bottom: 0; height: 2px; width: 0; background: #2859a8; z-index: 1; -webkite-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } .btn-read-more::after { clear: both; display: block; width: 100%; width: 100%; background-color: #d6d6d6; content: ''; position: absolute; left: 0; bottom: 0; height: 2px; } .btn-read-more .text-btn { display: inline-block; vertical-align: middle; position: relative; left: 0; -webkit-transform: translateX(0); -moz-transform: translateX(0); transform: translateX(0); -webkite-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } .btn-read-more:hover .text-btn { position: relative; left: 4px; -webkit-transform: translateX(4px); -moz-transform: translateX(4px); transform: translateX(4px); -webkite-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } .btn-read-more:hover { color: #2859a8; } .btn-read-more:hover i { opacity: 0; } .btn-read-more i { font-size: 14px; position: relative; top: 1px; display: inline-block; vertical-align: middle; line-height: inherit; -webkit-transform: translateX(0); -moz-transform: translateX(0); transform: translateX(0); -webkite-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; margin: 0; right: -2px; } .btn-one, .btn-two, .btn-three, .btn-four, .btn-five { cursor: pointer; display: inline-block; font-family: 'Poppins', sans-serif; position: relative; z-index: 2; font-size: 13px; font-weight: 600; text-transform: uppercase; text-align: center; padding: 0 5px; line-height: 40px; min-width: 175px; height:40px; letter-spacing: 0.30px; border-radius: 2px; -webkite-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .btn-one { background: #2859a8; color: #ffffff; } .btn-one:hover{ background: #02185a; color: #fff; } .btn-two { background: transparent; border: 2px solid #f9f9f9; color: #FFF; } .btn-two:hover { background: #FFF; color: #02185a; border: 2px solid #fff; } .btn-three { background: #FFF; color: #2d2a2a; } .btn-three:hover { background: #2859a8; color: #FFF; } .btn-four { background: #02185a; color: #fff; } .btn-four:hover { background: #fff; color: #02185a; } .btn-five { background: transparent; border: 2px solid #02185a; color: #02185a; line-height: 48px; } .btn-five:hover { background: #02185a; color: #fff; border: 2px solid #02185a; } .text-link { display: inline-block; padding-right: 2px; font-family: 'Poppins', sans-serif; font-size: 14px; font-weight: 600; } .social-media { padding-left: 0; padding-right: 0; margin-bottom: 0; } .social-media li { display: inline-block; } .social-media li a { margin-right: 10px; transition: .4s; width: 40px; height: 40px; border-radius: 0px; font-size: 15px; line-height: 40px; text-align: center; color: #ffffff; border: 1px solid #2859a8; background: #2859a8; display: block; } .social-media li a:hover { background: #FFF; color: #2859a8; border: 1px solid #ffffff; } .cover-background { position: relative !important; background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important; height: 100%; width: 100%; } .bg-image { background-image: url(http://placehold.it/1920x1280); background-position: center center; background-repeat: no-repeat; background-attachment: fixed; top: 0; left: 0; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; width: 100%; position: relative; } .overlay { background: linear-gradient(45deg, rgba(38, 38, 47, 0.95) 0%, rgba(38, 38, 47, 0.95) 100%); position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .bg-white { background: #FFF !important; } .bg-gray { background: #f9f9f9; } .bg-dark { background: #02185a !important; } .color-white { color: #FFF !important; } .color-gray { color: #eee !important; } body { position: relative; margin: 0; padding: 0; font-family: 'Poppins', sans-serif; font-weight: 400; font-size: 14px; color: #989898; line-height: 25px; } /*---------------------------------------------------------------- End Default Settings ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Loading Screen ----------------------------------------------------------------*/ .loading-screen { position: fixed; width: 100%; height: 100%; background: #f9f9f9; left: 0; top: 0; z-index: 99999; } .lds-ring { display: block; position: relative; width: 80px; height: 80px; margin-right: auto; margin-left: auto; right: 0; left: 0; } .lds-ring div { box-sizing: border-box; display: block; position: absolute; width: 64px; height: 64px; margin: 8px; border: 8px solid #2859a8; border-radius: 50%; animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; border-color: #2859a8 transparent transparent transparent; } .lds-ring div:nth-child(1) { animation-delay: -0.45s; } .lds-ring div:nth-child(2) { animation-delay: -0.3s; } .lds-ring div:nth-child(3) { animation-delay: -0.15s; } @keyframes lds-ring { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /*---------------------------------------------------------------- End Loading Screen ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Upperbar ----------------------------------------------------------------*/ .upper-bar { background: #ffffff; height: 50px; line-height: 50px; font-size: 14px; border-bottom: 1px solid #f1f1f1; } .upper-bar-dark { background: #02185a; } .upper-bar .contact-us-bar { font-weight: 500; } .upper-bar .contact-us-bar p { line-height: 50px; text-transform: capitalize; font-weight: 500; font-size: 14px; color: #fff; } .upper-bar .contact-us-bar a { font-size: 12px; margin-right: 12px; color: #02185a; font-weight: 500; border-right: 2px solid #ccc; padding-right: 12px; transition: all 0.4s; } .upper-bar .contact-us-bar a:last-child { border-right: none; } .upper-bar .contact-us-bar a span { font-size: 14px; margin-right: 5px; transition: .1s; color: #2859a8; } .upper-bar .contact-us-bar a span::before { font-size: 14px; line-height: 14px; margin: 0; font-weight: 900; } .upper-bar .contact-us-bar a:hover { color: #2859a8; } .upper-bar .social-media-bar { float: right; margin-bottom: 0; padding-left: 0; } .upper-bar .social-media-bar li { display: inline-block; padding-left: 3px; } .upper-bar .social-media-bar li a { transition: .4s; width: 30px; height: 30px; border-radius: 0px; background: #f9f9f9; font-size: 12px; line-height: 30px; text-align: center; color: #02185a; display: block; border: 1px solid #f1f1f1; } .upper-bar .social-media-bar li a:hover { background: #2859a8; border: 1px solid #2859a8; color: #fff; } .upper-bar-dark .social-media-bar li a { transition: .4s; width: 30px; height: 30px; border-radius: 0px; background: transparent; font-size: 12px; line-height: 30px; text-align: center; color: #fff; display: block; border: 1px solid transparent; } .upper-bar-two { background: #fff; height: 50px; line-height: 50px; font-size: 14px; border-bottom: 1px solid #f1f1f1; } .upper-bar-two .contact-us-bar a { color: #02185a; font-weight: 600; } .upper-bar-two .contact-us-bar a span { color: #2859a8; } .upper-bar-two .social-media-bar li a { border: 1px solid #f1f1f1; background: #f9f9f9; color: #02185a; } .upper-bar-two .social-media-bar li a:hover { background: #2859a8; border: 1px solid #2859a8; color: #ffffff; } .classic-upper-bar { background: #2859a8; } .classic-upper-bar .contact-us-bar a { font-size: 12px; margin-right: 12px; color: #eee; font-weight: 500; border-right: 2px solid #eeeeee47; padding-right: 12px; transition: all 0.4s; } .classic-upper-bar .contact-us-bar a:hover { color: #FFF; } .classic-upper-bar .contact-us-bar a span { font-size: 14px; margin-right: 5px; transition: .1s; color: #eee; } .classic-upper-bar .social-media-bar li a { transition: .4s; width: 30px; height: 30px; border-radius: 2px; background: transparent; font-size: 12px; line-height: 30px; text-align: center; color: #eee; display: block; border: 1px solid transparent; } .upper-bar-three { background: #02185a; z-index: 777; position: absolute; width: 100%; border-bottom: none; } .upper-bar-three .contact-us-bar a { color: #ddd; font-weight: 500; border-right: 2px solid rgba(204, 204, 204, 0.28); } .upper-bar-three .contact-us-bar a span { color: #fff; } .upper-bar-three .social-media-bar li a { border: 1px solid transparent; background: transparent; color: #FFF; } /*---------------------------------------------------------------- End Upperbar ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Navbar ----------------------------------------------------------------*/ nav { display: block; width: 100%; position: relative; z-index: 999; } .stuck { position: fixed; top: 0; width: 100%; left: 0; z-index: 5555; box-shadow: 0 10px 20px rgba(0,0,0,.1); border-bottom: 1px solid #eee; background: #FFF; } .container-nav { position: relative; } .nav-menu-bar { background: #FFF; border-top: 1px solid #eee; height: 85px; } .my-logo { display: inline-block; width: 130px; padding: 24.5px 0; } .nav-bar .single-item { position: relative; padding-left: 50px; margin-top: 22px; float: right; width: 100%; } .nav-bar .single-item span { left: 0; top: 0; color: #2859a8; position: absolute; font-size: 30px; } .nav-bar .single-item span::before { margin: 0; font-size: 30px; line-height: 30px; } .nav-bar .single-item h3 { color: #02185a; margin-bottom: 0px; font-size: 16px; line-height: 18px; font-weight: 700; } .nav-bar .single-item p { margin-bottom: 0; font-size: 13px; line-height: 26px; color: #777777; font-weight: 500; } .nav-bar .btn-arrow-two { float: right; margin-top: 18px; } .navbar-toggle { height: 32px; line-height: 32px; width: 30px; cursor: pointer; top: 35px; right: 15px; position: absolute; display: none; } .navbar-toggle span { -webkit-transition: 0.4s ease-in-out; -moz-transition: 0.4s ease-in-out; -ms-transition: 0.4s ease-in-out; -o-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .navbar-toggle:hover span { background: #2859a8; } .navbar-toggle span:first-child { background: #02185a; display: block; height: 2px; left: 0; margin: auto; position: absolute; right: 0; width: 22px; top: 0; } .navbar-toggle span:nth-child(2) { background: #02185a; display: block; height: 2px; left: 0; margin: auto; position: absolute; right: 0; width: 22px; top: 6px; } .navbar-toggle span:nth-child(3) { background: #02185a; display: block; height: 2px; left: 0; margin: auto; position: absolute; right: 0; width: 22px; top: 12px; } .navbar-toggle-active span:first-child { top: 7px; transform: rotate(45deg); background: #2859a8; } .navbar-toggle-active span:nth-child(2) { display: none; } .navbar-toggle-active span:nth-child(3) { top: 7px; transform: rotate(135deg); background: #2859a8; } .nav-menu { padding: 0; margin: 0; list-style: none; float: left; } .nav-menu li { display: inline-block; } .nav-menu li a { color: #02185a; text-decoration: none; display: block; margin-right: 28px; font-size: 13px; font-weight: 500; padding: 30px 0; font-family: 'Poppins', sans-serif; position: relative; text-transform: uppercase; } .nav-menu .nav-item.active .nav-link, .nav-menu .nav-item:hover .nav-link { color: #2859a8; } .nav-menu .nav-item .nav-link:before { position: absolute; content: ''; width: 100%; display: table; height: 3px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; bottom: 25px; -webkit-transition: all 300ms linear; transition: all 300ms linear; -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); background: #2859a8 !important; opacity: 0; } .nav-menu .nav-item.active > .nav-link:before, .nav-menu .nav-item:hover .nav-link:before { -webkit-transform: scaleX(1); transform: scaleX(1); opacity: 1; color: #2859a8 !important; background-color: transparent; } .has-dropdown .icon-down { opacity: 0.8; position: absolute; right: -12px; top: 31px; } .icon-links { float: right; margin-right: 40px; position: relative; top: 0; right: 0; margin-left: 35px; } .icon-links a { color: #02185a; text-decoration: none; display: inline-block; margin-left: 14px; font-size: 15px; font-weight: 700; padding: 30px 0; font-family: 'Roboto', sans-serif; position: relative; text-transform: uppercase; transition: all 0.4s; } .icon-links a:first-child { margin-left: 0; } .icon-links a:hover { color: #2859a8; } .nav-bar .nav-menu .nav-item.has-dropdown > ul.sub-menu { -webkit-transform: translateY(10%); -moz-transform: translateY(10%); -ms-transform: translateY(10%); -o-transform: translateY(10%); transform: translateY(10%); -webkit-transition: all 0.15s ease-in-out; -moz-transition: all 0.15s ease-in-out; -ms-transition: all 0.15s ease-in-out; -o-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out; margin: 0; padding: 0; list-style: none; position: absolute; width: 270px; visibility: hidden; opacity: 0; background: #fff; box-shadow: 0px 3px 9px 0px rgba(0, 0, 0, 0.08); border-bottom: 3px solid #2859a8; height: 380px; overflow: auto; margin-left: 0px; } .nav-bar .nav-menu .nav-item.has-dropdown > ul.sub-menu li.active a { color: #2859a8; } .nav-bar .nav-menu .nav-item.has-dropdown > ul.sub-menu::after { clear: both; content: " "; display: block; width: 100%; } .nav-item.has-dropdown > ul.sub-menu li { display: block; z-index: 3; } .nav-item.has-dropdown > ul.sub-menu li a { opacity: .7; display: block; text-transform: capitalize; color: #3e3a3a; font-size: 13px; font-weight: 600; padding: 7px 23px; margin: 0; position: relative; background: transparent; border-bottom: 1px solid #f1f1f1 !important; transition: .5s; } .nav-item.has-dropdown > ul.sub-menu li a:last-child { border: none; } .nav-item.has-dropdown > ul.sub-menu li a:hover { opacity: 1; } .nav-item.has-dropdown > ul.sub-menu li a:hover { color: #02185a; opacity: 1; background: #f9f9f9; padding-right: 20px; } .nav-item.has-dropdown:hover ul.sub-menu { -webkit-transform: translateY(0) !important; -moz-transform: translateY(0) !important; -ms-transform: translateY(0) !important; -o-transform: translateY(0) !important; transform: translateY(0) !important; opacity: 1 !important; visibility: visible !important; } .nav-item.has-dropdown > ul.sub-menu li { position: relative; } .nav-bar .sub-menu .has-dropdown-two { position: relative; } .nav-bar .sub-menu .has-dropdown-two span { float: right; margin-top: 4px; font-size: 12px; } .nav-bar .sub-menu .has-dropdown-two:hover > ul.sub-menu-two { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); opacity: 1; visibility: visible } .nav-bar .sub-menu .has-dropdown-two > ul.sub-menu-two { -webkit-transform: translateY(10%); -moz-transform: translateY(10%); -ms-transform: translateY(10%); -o-transform: translateY(10%); transform: translateY(10%); -webkit-transition: all 0.15s ease; -moz-transition: all 0.15s ease; -ms-transition: all 0.15s ease; -o-transition: all 0.15s ease; transition: all 0.15s ease; margin: 0; padding: 0; list-style: none; position: absolute; width: 230px; visibility: hidden; opacity: 0; top: 0; background: #fff; box-shadow: 0px 3px 9px 0px rgba(0, 0, 0, 0.08); border-bottom: 3px solid #2859a8; margin-left: 230px; } .nav-bar .sub-menu .has-dropdown-two > ul.sub-menu-two::after { clear: both; width: 100%; display: block; } .nav-bar-two { background: #FFF; } .nav-bar-two .nav-menu { float: right; } .nav-bar-two .nav-menu li a { margin-left: 30px; margin-right: 0; } .nav-bar-three { position: absolute; width: 100%; background: transparent; background: #fff; } .nav-bar-three .nav-menu { float: left; } .nav-bar-three .navbar-toggle span { background: #fff; } .nav-fixed-two .navbar-toggle span { background: #02185a; } .nav-fixed-two .nav-bar-three .nav-menu li a { margin-left: 28px; margin-right: 0; color: #000; } .nav-bar-three .icon-links .btn-three { cursor: pointer; display: inline-block; font-family: 'Poppins', sans-serif; position: relative; z-index: 2; font-size: 13px; font-weight: 600; text-transform: uppercase; text-align: center; padding: 0 5px; line-height: 38px; min-width: 160px; background: #2859a8; color: #fff !important; height: 38px; letter-spacing: 0.30px; -webkite-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; box-shadow: none; border-radius: 2px; margin-top: 26px; } .nav-bar-three .icon-links .btn-three:hover { color: #fff; } .side-menu-btn span { background: #122b51 !important; } .nav-bar-three .side-menu-btn span { background-color: #fff; } .fixed-top .my-logo .logo-two { display: none; } .fixed-top .my-logo .logo-one { display: block; } .fixed-top-one .my-logo .logo-two { display: none; } .nav-fixed-two .my-logo .logo-one { display: none; } .fixed-top::after, .nav-fixed:after, .fixed-top .nav-output::after, .nav-fixed .nav-output::after { clear: both; content; ""; width: 100%; display: block; } .fixed-top { position: fixed; top: 50px; -webkit-transition: all 0.15s ease; -moz-transition: all 0.15s ease; -ms-transition: all 0.15s ease; -o-transition: all 0.15s ease; transition: all 0.15s ease; } .nav-fixed { background: #fff; position: fixed; top: 0; right: 0; left: 0; z-index: 999; width: 100%; -webkit-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.15); -o-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.15); box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.15); -webkit-transition: all 0.15s ease; -moz-transition: all 0.15s ease; -ms-transition: all 0.15s ease; -o-transition: all 0.15s ease; transition: all 0.15s ease; } .nav-fixed .my-logo .logo-two { display: block; } .nav-fixed .my-logo .logo-one { display: none; } .fixed-top .nav-menu li a, .fixed-top .icon-links a { color: #FFF; } .nav-bar-fixed .nav-menu .nav-item .nav-link:before { bottom: 20px; } .nav-bar-fixed .nav-menu { float: left; } .nav-bar-fixed .nav-menu .nav-menu li a { margin-right: 28px; } .nav-bar-three .stuck { position: fixed; top: 0; width: 100%; left: 0; z-index: 5555; box-shadow: none; border-bottom: 1px solid rgba(214, 212, 212, 0.27); background: transparent; } .nav-fixed-two .stuck { position: fixed; top: 0; width: 100%; left: 0; z-index: 5555; box-shadow: none; border-bottom: 1px solid rgba(144, 139, 139, 0.37); background: #FFF } .nav-menu li a{color: #000;} .nav-fixed-two .nav-menu li a { margin-left: 28px; margin-right: 0; color: #000; } .modal .products-details-content img{width: 100%;height: 200px;object-fit: cover;} .modal .text-box .title-product{color: #000;font-size: 16px;margin-bottom: 10px;} .modal-title { margin-bottom: 0; line-height: 1.5; font-size: 13px; font-weight: 600; color: #000; } .modal .item-explain{margin-bottom: 0px;} .modal-footer button{font-size: 13px;} .modal-footer .btn-primary{background-color: #2859a8;} .nav-fixed-two .side-menu-btn span { background: #122b51 !important; } .nav-fixed-two .btn-three { background: #2859a8; color: #FFF; } .nav-fixed-two .icon-links .btn-three:hover { color: #fff; background: #02185a; } /*---------------------------------------------------------------- End Navbar ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Slids Menu ----------------------------------------------------------------*/ /* Side Menu Item */ .side-menu { position: fixed; top: 0; right: -430px; width: 430px; height: 100%; min-height: 100%; padding: 25px; background: #fff; overflow: hidden; visibility: hidden; z-index: 9999; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; -webkit-box-shadow: -11px 0px 13px rgba(0,0,0,.02); -moz-box-shadow: -11px 0px 13px rgba(0,0,0,.02); -o-box-shadow: -11px 0px 13px rgba(0,0,0,.02); box-shadow: -11px 0px 13px rgba(0,0,0,.02); overflow-y: auto; overflow-x: hidden; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .side-menu.open { right: 0; visibility: visible; } .close-side-menu { top: 30px; right: 30px; width: 40px; height: 40px; position: absolute; border-radius: 2px; background: #2859a8; z-index: 55; text-align: center; line-height: 40px; -webkit-transition: 0.4s; -moz-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s; } .close-side-menu span { font-size: 35px; font-weight: 700; text-align: center; line-height: 40px; color: #fff; } .close-side-menu:hover { background: #02185a; color: #fff; } .close-side-menu:hover span { color: #fff; } .about-side { margin-bottom: 50px; } .about-side img { width: 110px !important; margin-bottom: 20px; } .about-side p { margin-bottom: 0; font-size: 14px; font-weight: 500; } .contact-side h6, .follow-us h6 { position: relative; font-size: 16px; font-weight: 600; text-transform: capitalize; color: #02185a; letter-spacing: .5px; margin-bottom: 10px; } .contact-side .contact-info .single-contact { margin-bottom: 25px; } .contact-side .contact-info .single-contact span { color: #2859a8; } .contact-side .contact-info .single-contact span::before { margin: 0; } .contact-side .contact-info .single-contact .info-cont p { color: #989898; font-weight: 600; } .contact-side { margin-bottom: 50px; } .side-menu .social-media li a { background: #f9f9f9; border: 1px solid #f1f1f1; color: #2859a8; } .side-menu .social-media li a:hover { background: #2859a8; border: 1px solid #2859a8; color: #fff; } /* Overlay Side Menu */ .close-menu-sidebar { height: 100%; background: rgba(253, 253, 253, 0.95); position: absolute; left: 0; top: 0; z-index: 9998; cursor: url("../images/icons/cancel.png"), auto; opacity: 0; visibility: hidden; width: 0px; -webkit-transition: 0.4s; -moz-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s; } .close-menu-sidebar.open { width: 100%; opacity: 1; visibility: inherit; } .side-menu-btn{ text-decoration: none; font-family: 'Poppins', sans-serif; transition: all .4s; border-radius: 0; color: #122b51 !important; text-align: center; padding: 0; right: 0; z-index: 555; width: 20px; height: 15px; position: absolute !important; right: -40px; top: 35px; } .side-menu-btn:hover{ color:#3333ff !important; } .side-menu-btn span { display: block; position: absolute; background-color: #0b2653; height: 2.3px; -webkit-transition: all .3s linear 0ms; -khtml-transition: all .3s linear 0ms; -moz-transition: all .3s linear 0ms; -ms-transition: all .3s linear 0ms; -o-transition: all .3s linear 0ms; transition: all .3s linear 0ms; width: 20px; } .side-menu-btn span:first-child { top: 0; right: 0; } .side-menu-btn span:nth-child(2) { top: 6px; right: 0; width: 16px; } .side-menu-btn span:last-child { top: 12px; left: 0; } .side-menu-btn:hover span:nth-child(2) { width: 20px; } /*---------------------------------------------------------------- End Slids Menu ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Search ----------------------------------------------------------------*/ .search-screen { position: fixed; top: -100%; left: 0; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.95); overflow: hidden; visibility: hidden; z-index: 9999; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; overflow-y: auto; overflow-x: hidden; -webkit-transition: 0.4s; -moz-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s; } .search-screen.open { top: 0; visibility: visible; } /* Start Close Search */ .search-screen .close-search { top: 30px; right: 30px; width: 40px; height: 40px; position: absolute; border-radius: 2px; background: #2859a8; z-index: 55; text-align: center; line-height: 40px; -webkit-transition: 0.4s; -moz-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s; } .close-search span { font-size: 35px; font-weight: 700; text-align: center; line-height: 40px; color: #fff; } .close-search:hover { background: #02185a; color: #fff; } .close-search:hover span { color: #fff; } /* End Close Search */ .search-screen .input-search { top: 50%; max-width: 750px; margin: auto; position: absolute; left: 0; right: 0; display: block; } .search-screen .input-search input[type="search"] { position: relative; width: 90%; font-family: inherit; font-size: 14px; font-weight: inherit; color: #02185a; border-radius: 2px; background: #fff; outline: 0; cursor: pointer; margin: 0; margin-right: auto !important; margin-left: auto !important; display: block; overflow: hidden; padding: 20px; border: 1px solid #eee; height: 70px; box-shadow: 0px 10px 25px rgba(0, 0, 0, 0.1); } .search-screen .search-btn { background: #2859a8; border: none; cursor: pointer; outline: none; color: #FFF; font-size: 16px; height: 70px; width: 70px; line-height: 70px; text-align: center; position: absolute; right: 5%; top: 0; -webkit-transition: 0.4s; -moz-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s; } .search-screen .search-btn i { padding-left: 5px; } .search-screen .search-btn:hover { background: #02185a; } /*---------------------------------------------------------------- End Search ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Widget Shopping Cart ----------------------------------------------------------------*/ /*---------------------------------------------------------------- End Widget Shopping Cart ----------------------------------------------------------------*/ .widget-shopping-cart { -webkit-transform: translateY(10%); -moz-transform: translateY(10%); -ms-transform: translateY(10%); -o-transform: translateY(10%); transform: translateY(10%); -webkit-transition: all 0.15s ease; -moz-transition: all 0.15s ease; -ms-transition: all 0.15s ease; -o-transition: all 0.15s ease; transition: all 0.15s ease; margin: 0; padding: 0; position: absolute; top: 100%; right: 0; width: 280px; visibility: hidden; opacity: 0; border-radius: 1px; overflow: hidden; background: #fff; box-shadow: 0px 3px 9px 0px rgba(0, 0, 0, 0.08); border: 1px solid #f1f1f1; padding: 10px; } .cart-link:hover .widget-shopping-cart { -webkit-transform: translateY(0) !important; -moz-transform: translateY(0) !important; -ms-transform: translateY(0) !important; -o-transform: translateY(0) !important; transform: translateY(0) !important; opacity: 1 !important; visibility: visible !important; } .widget-shopping-cart ul { padding-left: 0; line-height: 40px; margin: 0; } .widget-shopping-cart ul .empty-cart { font-size: 15px; color: #02185a; text-transform: capitalize; font-weight: 600; padding: 10px; } /*---------------------------------------------------------------- Start Section Header ----------------------------------------------------------------*/ .main-home { background-position: center center; background-repeat: no-repeat; background-attachment: fixed; top: 0; left: 0; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; height: 700px; min-height: 100%; width: 100%; position: relative; overflow: hidden; z-index: 222; } .main-home .overlay { background: rgba(50, 50, 50, 0.3); position: absolute; top: 0; left: 0; width: 100%; min-height: 100%; height: 700px; } .info-header { height: 700px; min-height: 100% } .main-home .top-title-header { position: relative; padding-left: 70px; font-size: 14px; font-weight: 600; color: #FFF; text-transform: uppercase; margin-bottom: 15px; letter-spacing: 2px; } .main-home .top-title-header::after { background: #2859a8; width: 50px; height: 3px; line-height: 27px; position: absolute; left: 0; content: ""; top: 11px; } .info-header h1 { color: #fff; text-transform: capitalize; font-weight: 700; line-height: 50px; font-size: 35px; margin-bottom: 20px; } .info-header h1 span { color: #2859a8; } .text-header { text-transform: capitalize; font-size: 17px; color: #f8f8f8; font-weight: 600; line-height: 30px; margin-bottom: 45px; max-width: 600px; } .banner { position: relative; z-index: 33; } .banner-meta { display: block; margin: 0 0 40px; padding-left: 0; } .banner-btn::after { content: ""; display: block; clear: both; width: 100%; } .banner-meta li { display: inline; position: relative; letter-spacing: 4px; text-transform: UPPERCASE; font-size: 18px; color: #EEE; font-weight: 700; line-height: 27px; } .banner-meta li:first-of-type::before { top: -1px; content: " "; font-size: 11px; position: relative; color: currentcolor; padding: 0 20px 0 0; } .banner-meta li::before { top: -1px; content: "|"; font-size: 11px; position: relative; color: currentcolor; padding: 0 20px 0 17px; } .banner-btn .main-btn-one, .banner-btn .main-btn-two { float: left; } .play-video div.play { background: transparent; border: 2px solid #FFF; width: 51px; height: 51px; line-height: 49px; border-radius: 50%; position: relative; font-size: 15px; display: inline-block; text-align: center; color: #fff; margin-right: 5px; margin-left: 15px; transition: all 0.4s; } .play-video span { text-transform: uppercase; letter-spacing: 0.26px; font-family: 'Poppins', sans-serif; position: relative; z-index: 2; font-size: 13px; font-weight: 600; transition: all 0.4s; } .play-video:hover { color: #2859a8; } .play-video:hover div.play { color: #2859a8; border: 2px solid #2859a8; } .text-left { text-align: left !important; } text-right { text-align: right !important; } /*----------- Header 01-Home -----------*/ .home-two { height: 700px; min-height: 100%; width: 100%; position: relative; overflow: hidden; z-index: 222; } .home-two .overlay { background: linear-gradient(45deg, rgb(14, 27, 62) 0%, rgba(12, 24, 60, 0.1) 100%); position: absolute; top: 0; left: 0; width: 100%; min-height: 100%; height: 700px; } .home-two .slider-hero .owl-dots { display: none; } .home-two .info-header { height: 700px; min-height: 100%; padding-bottom: 100px; } .home-two .info-header .top-title-header { color: #eee; display: block; letter-spacing: 1px; line-height: 20px; font-size: 15px; text-transform: uppercase; font-weight: 700; margin-bottom: 10px; } .home-two .info-header .line-header { width: 75px; height: 3px; background: #fff; margin-right: auto; margin-left: auto; margin-top: 25px; margin-bottom: 40px; } /*----------- Header 02-Home Slider Hero -----------*/ .owl-carousel { position: relative; } .slider-hero .owl-nav{ position: absolute; top: 48%; width: 100%; z-index: 999; transform: translateY(-50%); } .slider-hero .owl-nav div { width: 40px; height: 40px; color: #02185a; text-align: center; line-height: 44px; font-size: 15px; background: rgb(255, 255, 255); border-radius: 0px; z-index: 999; } .slider-hero .owl-nav div:hover { background: #2859a8; color: #fff; } .slider-hero .owl-nav div.owl-prev { left: 0px; position: absolute; transition: all 0.4s ease 0s; } .slider-hero .owl-nav div.owl-next { right: 0px; position: absolute; transition: all 0.4s ease 0s; } .slider-hero .owl-dots { position: absolute; bottom: 5%; width: 100%; z-index: 99; transform: translateY(-50%); text-align: center; } .slider-hero .owl-dots .owl-dot { margin: 20px 7px 0 7px; width: 9px; height: 9px; background: transparent; margin-right: 5px; margin-left: 5px; display: inline-block; border-radius: 0; border: 1px solid #FFF; transition: 0.4s; } .slider-hero .owl-dots .owl-dot.active, .slider-hero .owl-dots .owl-dot:hover { background: #fff; } /*----------- Header 03-Home -----------*/ .home-three { height: 80vh; margin-bottom: 70px; min-height: 100%; width: 100%; position: relative; overflow: hidden; z-index: 222; } .blog-img{width: 100%;height: 220px;overflow: hidden;} .blog-img img{width: 100% !important;height: auto !important;min-height: 100% !important;object-fit: cover !important;} .home-three .overlay { background: rgba(50, 50, 50, 0.5); position: absolute; top: 0; left: 0; width: 100%; min-height: 100%; height: 80vh; } .home-three .info-header { height: 95vh; min-height: 100%; } .home-three .info-header h1 { margin-bottom: 50px; } .home-three .call-us span { color: #eee; } .home-three .call-us .phone-number a { color: #fff; } /*----------- Header 02-Home -----------*/ .home-two { height: 700px; min-height: 100%; width: 100%; position: relative; overflow: hidden; z-index: 222; } .home-classic .cover-background { background-position: center top !important; } .home-classic .slider-hero .owl-dots { display: none; } .home-classic .overlay { background: rgba(50, 50, 50, 0.1); } .home-classic .inner-banner { padding: 50px; background: #FFF; } .home-classic .top-title-header { color: #666; display: block; text-transform: uppercase; font-family: 'Roboto', sans-serif; font-weight: 600; letter-spacing: .20px; font-size: 15px; line-height: 15px; margin-bottom: 13px } .home-classic .info-header h1 { color: #02185a; text-transform: capitalize; font-weight: 700; line-height: 55px; font-size: 50px; margin-bottom: 22px; } .home-classic .text-header { text-transform: capitalize; font-size: 14px; line-height: 24px; color: #989898; font-weight: 500; margin-bottom: 35px; } .home-classic .play-video div.play { border: 2px solid #2859a8; color: #2859a8; } .home-classic .play-video span { color: #2859a8; } .home-classic .play-video:hover div.play { border: 2px solid #02185a; color: #02185a; } .home-classic .play-video:hover span { color: #02185a; } .icon-header { color: #2859a8; } .icon-header::before { font-size: 50px; } /*---------------------------------------------------------------- End Section Header ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Bar Get a Free ----------------------------------------------------------------*/ .bar-get { background: #f9f9f9; position: relative; } .bar-get .content-get-bar { margin-top: -100px; background: #2859a8; margin-right: 0; margin-left: 0; padding: 80px 35px; position: relative; z-index: 5; -webkit-box-shadow: 0px 5px 20px rgba(52, 47, 47, 0.12); -moz-box-shadow: 0px 5px 20px rgba(52, 47, 47, 0.12); -ms-box-shadow: 0px 5px 20px rgba(52, 47, 47, 0.12); -o-box-shadow: 0px 5px 20px rgba(52, 47, 47, 0.12); box-shadow: 0px 5px 20px rgba(52, 47, 47, 0.12); } .bar-get h2 { color: #FFF; font-weight: 500; text-transform: capitalize; font-size: 40px; } .bar-get h2 span { font-weight: 700; } .bar-get .main-btn-four { float: right; } .content-get-bar p { margin-bottom: 0; color: #EEE; margin-top: 10px; position: relative; font-size: 16px; font-weight: 500; } .bar-get-two { background: #fff; } /*---------------------------------------------------------------- End Bar Get a Free ----------------------------------------------------------------*/ .info-about-us { background: #f9f9f9; position: relative; padding: 50px 0 20px; } .info-about-us .about-us-item { position: relative; margin-bottom: 30px; padding-left: 90px; padding-top: 10px; } .info-about-us .about-us-item span { font-size: 35px; color: #fff; position: absolute; left: 0; top: 0; bottom: 0; background: #02185a; height: 65px; width: 65px; line-height: 65px; text-align: center; border-radius: 3px; transition: 0.4s; } .info-about-us .about-us-item:hover span { background: #2859a8; } .inbox-item-info h3 { line-height: 24px; margin-bottom: 0; color: #02185a; font-size: 18px; font-weight: 600; text-transform: capitalize; } .inbox-item-info p { font-size: 14px; font-weight: 500; margin-bottom: 0; } /*---------------------------------------------------------------- Start Section Features ----------------------------------------------------------------*/ .features { background: #FFF; } /* feat-item-one */ .feat-item-one { position: relative; z-index: 1; overflow: hidden; background: #fff; transition: 0.4s; margin-bottom: 30px; border: 1px solid #f1f1f1; border-bottom: 3px solid #2859a8; } .feat-item-one:hover { background: #02185a; border: 1px solid #02185a; border-bottom: 3px solid #02185a; } .feat-item-one:hover .content-box-feat span, .feat-item-one:hover .content-box-feat h4, .feat-item-one:hover .content-box-feat p { color: #FFF; -webkite-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .feat-item-one .content-box-feat { position: relative; padding: 40px 30px; z-index: 5; text-align: left; } .feat-item-one .content-box-feat span { font-size: 50px; color: #2859a8; display: block; line-height: 50px; } .feat-item-one .content-box-feat span::before { margin: 0; font-size: 50px; } .feat-item-one .content-box-feat h4 { color: #02185a; font-size: 18px; font-weight: 600; margin-bottom: 20px; text-transform: capitalize; margin-top: 25px; } .feat-item-one .content-box-feat p { margin-bottom: 0; line-height: 24px; } .feat-two-content { background: #fff; position: relative; margin-right: 0; margin-left: 0; margin-top: -143px; z-index: 555; } .img-feat-two { background-image: url(../images/about/02.jpg); top: 0; left: 0; position: relative !important; background-size: cover !important; background-position: top center !important; background-repeat: no-repeat !important; height: 100%; width: 100%; min-height: 318px; } .feat-why-us { padding: 100px 50px 70px; border: 1px solid #ddd; } .feat-item-two { position: relative; z-index: 1; overflow: hidden; transition: 0.4s; padding-bottom: 30px; } .feat-item-two .content-box-feat { position: relative; z-index: 5; text-align: left; padding-left: 85px; } .feat-item-two .content-box-feat span { color: #2859a8; display: block; position: absolute; left: 0; top: 0; height: 65px; width: 65px; background: #fff; text-align: center; line-height: 60px; border: 1px solid #f1f1f1; } .feat-item-two .content-box-feat span::before { margin: 0; font-size: 35px; } .feat-item-two .content-box-feat h4 { color: #02185a; font-size: 16px; font-weight: 600; margin-bottom: 0px; text-transform: capitalize; line-height: 28px; padding-top: 4px; } .feat-item-two .content-box-feat p { margin-bottom: 0; line-height: 24px; } .feat-three-content { position: relative; z-index: 555; } .feat-item-three { position: relative; z-index: 1; background: #fff; transition: 0.4s; margin-bottom: 30px; border: 1px solid #f1f1f1; border-bottom: 3px solid #2859a8; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px; } .feat-item-three:hover .content-box-feat span, .feat-item-three:hover .content-box-feat h3, .feat-item-three:hover .content-box-feat h4, .feat-item-three:hover .content-box-feat p { color: #02185a; } .about-side h4{font-size: 16px;color: #000;} .feat-item-three .content-box-feat { position: relative; padding:20px; z-index: 5; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px; text-align: center; } .feat-item-three .content-box-feat span { font-size: 50px; color: #2859a8; display: block; line-height: 50px; position: absolute; border: 1px solid #1bbcbb; top: -19%; z-index: 9999; left: 50%; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px; transform: translate(-50%); width: 70px; height: 70px; border-radius: 50px; text-align: center; line-height: 62px; background: white; } .feat-item-three .content-box-feat span::before { margin: 0; font-size: 39px; } .feat-item-three .content-box-feat h3 { color: #666; display: block; text-transform: uppercase; font-family: 'Roboto', sans-serif; letter-spacing: .20px; font-size: 12px; line-height: 14px; margin: 0; margin-bottom: 10px; font-weight: 500; margin-top: 40px; } .feat-item-three .content-box-feat h4 { color: #02185a; font-size: 20px; font-weight: 600; text-transform: capitalize; margin-bottom: 15px; } .feat-item-three .content-box-feat p { margin-bottom: 0; line-height: 24px; } .btn-video-play { position: relative; z-index: 10; box-sizing: content-box; display: block; background: #2859a8; border-radius: 50%; height: 80px; width: 80px; margin-right: auto; margin-left: auto; } .btn-video-play:before { content: ""; position: absolute; z-index: 0; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); display: block; width: 80px; height: 80px; background: #2859a8; border-radius: 50%; animation: pulse-border 1500ms ease-out infinite; } .btn-video-play:after { content: ""; position: absolute; z-index: 1; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); display: block; width: 80px; height: 80px; background: #2859a829; border-radius: 50%; transition: all 200ms; } .btn-video-play:hover:after { background-color: darken(#2859a8, 10%); } .btn-video-play i { background: transparent; border: 2px solid #2859a8; width: 80px; height: 80px; line-height: 80px; border-radius: 50%; position: relative; font-size: 15px; display: inline-block; text-align: center; color: #fff; transition: all 0.4s; z-index: 555; } @keyframes pulse-border { 0% { transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); opacity: 1; } 100% { transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5); opacity: 0; } } /*---------------------------------------------------------------- End Section Features ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Section About Us ----------------------------------------------------------------*/ .about-one { background: #f9f9f9; } .padding-about-one { padding-right: 15px; } .about-img-one { border-radius: 5px; overflow: hidden; } .about-img-one .text-overlay { width: 100%; height: 100%; border: 2px solid rgba(255, 255, 255, .9); background-color: rgba(25, 25, 33, 0.15); position: relative; } .about-img-one .pos-text { position: absolute; bottom: 30px; left: 30px; font-size: 60px; color: #FFF; font-weight: 700; letter-spacing: 2px; } .about-img-one .pos-text span { display: block; font-size: 14px; margin-top: 20px; letter-spacing: 2px; text-transform: uppercase; font-weight: 700; } .info-about h5 { font-size: 22px; line-height: 30px; margin-bottom: 25px; margin-top: 0; color: #787878; } .info-about .list-feat { padding-left: 0; } .info-about .list-feat li { font-weight: 600; color: #42526e; position: relative; padding-left: 20px; font-size: 14px; margin-bottom: 10px; } .info-about .list-feat li span { position: absolute; margin-right: 10px; height: 5px; width: 5px; background: #2859a8; display: block; left: 0; top: 10px; border-radius: 50%; } .call-us { display: inline-block; margin-left: 30px; overflow: hidden; } .call-us .phone-number { font-size: 18px; margin-top: 10px; color: #02185a; font-weight: 700; letter-spacing: 1.3px; } .call-us .phone-number a { color: #02185a; } .call-us span { display: block; font-size: 13px; color: #42526e; font-weight: 600; line-height: 20px; } .about-two { background: #f9f9f9; } .about-two .p-about-two { padding-bottom: 25px; margin-bottom: 35px; border-bottom: 1px solid #ddd; } .about-two .why-us { position: relative; } .item-why-us { margin-bottom: 30px; position: relative; padding-left: 60px; } .about-two .item-why-us span { font-size: 50px; color: #2859a8; display: block; position: absolute; left: 0; top: 0; line-height: 40px; } .about-two .item-why-us h4 { color: #02185a; font-size: 18px; font-weight: 600; margin-bottom: 15px; text-transform: capitalize; } .about-two .item-why-us p { margin-bottom: 0; line-height: 24px; } .about-img-two { position: relative; } .about-img-two img { width: 100%; position: relative; z-index: 55; box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15); } .about-img-two { position: relative; padding-right: 35px; padding-left: 35px; } .about-img-two .overlay-about { color: #fff; position: absolute; width: 100%; top: 35px; bottom: 35px; right: 0; background: #2859a8; box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15); } .about-img-two .pos-text { position: absolute; z-index: 66; bottom: -10px; left: 55px; right: 55px; top: -10px; border: 2px solid rgba(255, 255, 255, .9); background: rgba(14, 27, 62, 0.2); } .number-years { position: absolute; bottom: 35px; left: 30px; font-size: 60px; color: #FFF; font-weight: 700; letter-spacing: 2px; line-height: 50px; } .about-img-two .pos-text span { line-height: 20px; color: #fff; position: absolute; bottom: 40px; left: 120px; display: block; font-size: 13px; letter-spacing: 2px; text-transform: uppercase; font-weight: 700; } .about-classic-img { background-image: url(../images/about/05-about-us.html); top: 0; left: 0; position: relative !important; background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important; height: 100%; width: 100%; min-height: 318px; } .about-classic { background: #FFF; } .contact-classic { padding-right: 15px; padding-left: 15px; } .contact-classic .info-about { padding: 50px; background: #f9f9f9; } .contact-classic .leader-company { position: relative; padding-left: 90px; padding-top: 10px; } .contact-classic .leader-company img { height: 70px; width: 70px; border-radius: 50%; position: absolute; left: 0; top: 0; } .contact-classic .leader-company h3 { line-height: 24px; margin-bottom: 0; color: #02185a; font-size: 18px; font-weight: 600; text-transform: capitalize; } .contact-classic .leader-company p { text-transform: uppercase; font-size: 14px; font-weight: 700; } .about-classic .item-why-us { position: relative; padding-left: 70px; } .about-classic .item-why-us span { position: absolute; left: 0; top: 0; color: #02185a; font-size: 50px; } .about-classic .item-why-us h4 { color: #02185a; font-size: 18px; font-weight: 600; margin-bottom: 15px; text-transform: capitalize; } .about-classic .item-why-us p { margin-bottom: 0; line-height: 24px; font-size: 14px; } .about-carousel { position: relative; } .about-carousel .owl-dots { position: absolute; bottom: 20px; width: 100%; z-index: 99; transform: translateY(-50%); text-align: left; margin-left: 30px; } .about-carousel .owl-dots .owl-dot { margin: 20px 7px 0 7px; width: 20px; height: 6px; background: #ffffff; margin-right: 5px; margin-left: 5px; display: inline-block; border-radius: 0; transition: 0.4s; border-radius: 2px; } .about-carousel .owl-dots .owl-dot.active, .about-carousel .owl-dots .owl-dot:hover { background: #2859a8; } .about-carousel .owl-nav{ position: absolute; bottom: 60px; width: 100%; z-index: 999; right: 30px; display: none; } .about-carousel .owl-nav div { width: 40px; height: 40px; color: #02185a; text-align: center; line-height: 40px; font-size: 15px; background: #fff; border-radius: 0; z-index: 999; border: 1px solid #eee; } .about-carousel .owl-nav div:hover { background: #2859a8; color: #fff; } .about-carousel .owl-nav div.owl-prev { right: 50px; position: absolute; transition: all 0.4s ease 0s; } .about-carousel .owl-nav div.owl-next { right: 0px; position: absolute; transition: all 0.4s ease 0s; } .about-three { background: #FFF; position: relative; } .about-img-three { position: relative; z-index: 10; margin-left: 50px; margin-bottom: 50px; margin-right: 15px; border: 10px solid #fff; box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.2); } .about-img-three img { } .slider-about { display: inline-block; position: relative; } .slider-about::before { position: absolute; bottom: 0; left: 0; width: 80%; height: 80%; content: ''; background: #2859a8; } .overlay-about-three { } .p-about-thtee { padding-bottom: 10px; margin-bottom: 15px; border-bottom: 1px solid #ddd; } /*---------------------------------------------------------------- End Section About US ----------------------------------------------------------------*/ .our-skills { background: #FFF; padding-top: 230px; position: relative; } .skills .skill-box { margin-bottom: 60px; } .skills .skill-box:last-of-type { margin-bottom: 0; } .skills .skill-title { color: #666; display: block; text-transform: uppercase; font-family: 'Roboto', sans-serif; letter-spacing: .20px; font-size: 14px; line-height: 14px; margin: 0; margin-bottom: 15px; font-weight: 500; } .skills .skill-box .progress-line { background: #f1f1f1; height: 5px; margin: 0; position: relative; width: 100%; } .skills .skill-box .progress-line > span { position: absolute; display: block; top: 0; left: 0; height: 100%; width: 0; background: #2859a8; } .skills .skill-box .progress-line > span > .percent-tooltip { position: absolute; right: -15px; top: -30px; color: #666; display: block; text-transform: uppercase; font-family: 'Roboto', sans-serif; letter-spacing: .20px; font-size: 14px; line-height: 14px; margin-bottom: 15px; font-weight: 500; } .our-skills-two { background: #2859a8; padding-top: 120px; } /*---------------------------------------------------------------- Start Statistics ----------------------------------------------------------------*/ .creative-facts { background: url(../images/about/howimg.png) no-repeat center left; background-size: 170% 100%; padding: 50px; background-color: #fff; } .contera:before { content: ''; position: absolute; top: 0; left: -120px; width: 70px; height: 100%; border-top: 394px solid transparent; border-right: 120px solid #2859a8; position: absolute; } .contera { background: #2859a8; position: relative; padding: 40px 30px; height: 400px; } .who-we-contant h4 { margin-bottom: 20px; font-size: 30px; } .more-btn { position: relative; z-index: 1; min-width: 160px; height: 45px; line-height: 45px; font-size: 12px; font-weight: 600; letter-spacing: 1px; display: inline-block; padding: 0 20px; text-align: center; text-transform: uppercase; color: #000 !important; box-shadow: 0 3px 20px rgba(0, 0, 0, 0.1); border-radius: 0px; background: #fff; -webkit-transition: all 500ms; transition: all 500ms; } .fact-box { position: relative; margin-top: 26px; } .fact-box .inner { position: relative; padding: 50px 15px 30px; max-width: 250px; margin: 0 auto; text-align: center; border: 2px solid #fdc236; border-radius: 0px 0px 5px 5px; border-top: none; } .fact-box .inner:before { content: ''; position: absolute; right: 0px; top: 0px; width: 60px; border-bottom: 2px solid #fdc236; } .fact-box .icon-box { position: absolute; left: 50%; top: -30px; margin-left: -30px; width: 60px; height: 60px; line-height: 48px; font-size: 42px; } .fact-box .content { position: relative; } .count-outer { position: relative; font-size: 35px; line-height: 1.4em; font-weight: 700; color: #333; margin-bottom: 7px; } .count-outer .count-text { font-weight: 700; } .gradient-text.cyan { color: #fff; } .fact-box .counter-title { position: relative; font-size: 14px; line-height: 26px; font-weight: 600; color: #fff; } .fact-box .inner::after { content: ''; position: absolute; left: 0px; top: 0px; width: 60px; border-bottom: 2px solid #fdc236; } .icon-box [class^="flaticon-"]:before, [class*=" flaticon-"]:before, [class^="flaticon-"]:after, [class*=" flaticon-"]:after{ font-size: 50px; margin-left: 0px; color: #fff; } .count{color: #fff;} .statistics { width: 100%; background-image: url(../images/about/staticimg.jpg); background-position: center left; background-repeat: no-repeat; top: 0; left: 0; background-color:#00000066; background-blend-mode: multiply; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; position: relative; padding: 50px !important; } .statistics .overlay { background: rgba(14, 27, 62, 0.5); position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .content-statistics { margin-bottom: -100px; -webkit-box-shadow: 0px 5px 20px rgba(52, 47, 47, 0.12); -moz-box-shadow: 0px 5px 20px rgba(52, 47, 47, 0.12); -ms-box-shadow: 0px 5px 20px rgba(52, 47, 47, 0.12); -o-box-shadow: 0px 5px 20px rgba(52, 47, 47, 0.12); box-shadow: 0px 5px 20px rgba(52, 47, 47, 0.12); margin-right: 0; margin-left: 0; background: #2859a8; z-index: 10; position: relative; padding: 100px 50px 70px; border-radius: 5px; } .text-support { padding-right: 30px; } .content-statistics h2 { } .content-statistics .section-title-left h2::after { background: #ffffff; } .content-statistics h3 { color: #FFF; text-transform: capitalize; font-size: 40px; font-weight: 600; margin-bottom: 0px; line-height: 45px; } .content-statistics .p-support { font-family: 'Poppins', sans-serif; line-height: 28px; border-bottom: 2px solid rgba(238, 238, 238, 0.22); padding-bottom: 30px; margin-bottom: 35px; color: #f9f9f9; font-weight: 600; font-size: 15px; letter-spacing: 0.50px; } .contact-support h6 { position: relative; font-size: 22px; font-weight: 600; text-transform: capitalize; color: #fff; letter-spacing: .5px; line-height: 30px; margin-bottom: 32px; } .contact-support .single-contact { position: relative; margin-bottom: 30px; padding-left: 40px; } .contact-support .single-contact span::before { position: absolute; left: 0; color: #fff; top: 0px; font-size: 22px; margin: 0; } .contact-support .single-contact .info-cont p { color: #f9f9f9 !important; font-size: 14px; font-weight: 600; margin-bottom: 10px; line-height: 20px; position: relative; letter-spacing: 0.30px; } .content-statistics form select { height: 50px !important; outline: 0; resize: none; font-weight: 400; display: block; width: 100%; line-height: 24px; font-size: 14px; border: 1px solid #f1f1f1; padding: 13px 20px; background: #fff; color: #02185a; border-radius: 0px; margin-bottom: 30px; box-shadow: none !important; } .content-statistics textarea { height: 100px; } .content-statistics input[type="text"], .content-statistics input[type="email"], .content-statistics textarea, .content-statistics select { background: #FFF; } .content-statistics input[type="text"]:focus, .content-statistics input[type="email"]:focus, .content-statistics textarea:focus, .content-statistics select:focus { outline: none; border: 1px solid #eee; } .stat-item { margin-bottom: 30px; text-align: left; position: relative; padding-left: 70px; } .stat-item span::before { font-size: 50px; line-height: 50px; margin: 0; color: #FFF; position: absolute; left: 0; top: 0; } .stat-icon { font-size: 50px; color: #2859a8; position: absolute; left: 0; top: 0; display: none; } .stat-item .count { font-size: 50px; color: #2859a8; font-weight: 900; line-height: 30px; letter-spacing: 1px; margin-bottom: 20px; font-family: 'Roboto', sans-serif; } .stat-item .text { color: #eee; font-weight: 700; font-size: 14px; text-transform: capitalize; letter-spacing: 1px; line-height: 16px; display: block; margin-bottom: 0px; } .statistics-two .stat-item { margin-bottom: 30px; text-align: left; position: relative; padding-left: 70px; } .statistics-two .stat-item span::before { transition: 0.4s; border-radius: 3px; font-size: 50px; line-height: 50px; margin: 0; color: #2859a8; position: absolute; left: 0; top: 0; } .statistics-two .stat-item .count { font-size: 50px; color: #02185a; font-weight: 700; line-height: 30px; letter-spacing: 1px; margin-bottom: 20px; font-family: 'Roboto', sans-serif; } .statistics-two .stat-item p { color: #666; font-weight: 700; font-size: 14px; text-transform: capitalize; letter-spacing: 1px; line-height: 16px; display: block; margin-bottom: 0px; } /*---------------------------------------------------------------- End Statistics ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Section Services ----------------------------------------------------------------*/ .services { position: relative; } .services-one { background: #fff; padding-top: 220px; } .services-page { background: #fff; } .services-page .services-item-one { margin-bottom: 40px; } .services-page .services-item-two { background: #FFF; } /* feat-item-three */ .services-item-two { position: relative; z-index: 1; margin-bottom: 30px; overflow: hidden; background: #fff; border: 1px solid #f1f1f1; border-bottom: 3px solid #2859a8; } .services-item-two .content-box { position: relative; padding: 40px 30px; z-index: 5; text-align: left; } .services-item-two:hover { -webkit-box-shadow: 0px 5px 20px rgba(52, 47, 47, 0.3); -moz-box-shadow: 0px 5px 20px rgba(52, 47, 47, 0.3); -ms-box-shadow: 0px 5px 20px rgba(52, 47, 47, 0.3); -o-box-shadow: 0px 5px 20px rgba(52, 47, 47, 0.3); box-shadow: 0px 5px 20px rgba(52, 47, 47, 0.3); } .services-item-two .content-box span { font-size: 50px; color: #2859a8; display: block; line-height: 50px; } .services-item-two .content-box span::before { margin: 0; font-size: 50px; color: #2859a8; display: block; line-height: 50px; } .services-item-two .content-box h4 { color: #02185a; font-size: 18px; font-weight: 600; margin-bottom: 20px; text-transform: capitalize; margin-top: 25px; } .services-item-two .content-box p { margin-bottom: 0; line-height: 24px; } .services-item-two:hover .btn-read-more { color: #FFF; } .services-item-two .btn-read-more:hover { color: #2859a8; } /*.content-box .read-more:before:hover { -webkit-transform: scaleX(1); transform: scaleX(1); opacity: 1; color: #2859a8 !important; background-color: transparent; }*/ .services-item-two .services-box-img { bottom: 0; left: 0; opacity: 1; position: absolute; right: 0; top: 0; z-index: 0; background-size: cover; background-position: center center; height: 100%; width: 100%; opacity: 0; -webkite-transition: all 0.7s; -moz-transition: all 0.7s; -ms-transition: all 0.7s; -o-transition: all 0.7s; transition: all 0.7s; opacity: 0; visibility: hidden; -webkit-transform: scale(1.3); -moz-transform: scale(1.3); -ms-transform: scale(1.3); -o-transform: scale(1.3); transform: scale(1.3); z-index: -1; } .services-item-two .services-box-img::before { background: rgba(14, 27, 62, 0.6) !important; content: " "; display: block; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 2; } .services-item-two:hover .services-box-img, .services-item-two.active .services-box-img { opacity: 1; -webkit-transform: scale(1.0); -moz-transform: scale(1.0); -ms-transform: scale(1.0); -o-transform: scale(1.0); transform: scale(1.0); visibility: visible; } .services-item-two:hover .content-box h4, .services-item-two.active .content-box h4, .services-item-two:hover .content-box p, .services-item-two.active .content-box p { color: #FFF; -webkite-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .services-two { background: #fff; } .services-item-one img { transition: 0.4s; } .services-item-one:hover img { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); } .services-item-one .img-services { position: relative; overflow: hidden; } .services-item-one .content-box { background: #fff; text-align: left; padding: 30px; transition: 0.4s; margin: -30px 20px 0; z-index: 2; position: relative; border: 1px solid #f1f1f1; border-bottom: 3px solid #2859a8; position: relative; } .services-item-one .content-box h4 { color: #02185a; font-size: 18px; font-weight: 600; margin-bottom: 0px; text-transform: capitalize; padding-left: 70px; padding-top: 3px; line-height: 25px; } .services-item-one .content-box span { font-size: 50px; color: #2859a8; display: block; line-height: 50px; position: absolute; top: 30px; left: 30px; } .services-item-one .content-box span::before { margin: 0; font-size: 50px; color: #2859a8; display: block; line-height: 50px; } .services-item-one .content-box p { margin-bottom: 0; line-height: 24px; margin-top: 20px; } .services-item-one .content-box .read-more { color: #898989; font-size: 12px; display: inline-block; font-weight: 700; margin-top: 15px; border-bottom: 2px solid #898989; line-height: 20px; text-transform: uppercase; } .services-item-one .content-box .read-more:hover { color: #2859a8; border-bottom: 2px solid #2859a8; } .services-carousel .owl-nav { position: absolute; top: -143px; width: 100%; z-index: 999; transform: translateY(-50%); } .services-carousel .owl-nav div { width: 40px; height: 40px; color: #02185a; text-align: center; line-height: 42px; font-size: 16px; background: #f9f9f9; border-radius: 1px; border: 1px solid #eee; z-index: 999; } .services-carousel .owl-nav div.owl-prev { right: 50px; position: absolute; transition: all 0.4s ease 0s; } .services-carousel .owl-nav div.owl-next { right: 0px; position: absolute; transition: all 0.4s ease 0s; } .services-carousel .owl-nav div:hover { background: #2859a8; color: #fff; border: 1px solid #2859a8; } .services-three { background: #f9f9f9; position: relative; } .services-item-three { position: relative; z-index: 1; overflow: hidden; transition: 0.4s; margin-bottom: 30px; padding-left: 35px; } .services-item-three:hover .content-box { background: #02185a; border: 1px solid #02185a; border-bottom: 3px solid #02185a; } .services-item-three:hover .content-box h4, .services-item-three:hover .content-box p, .services-item-three:hover .btn-read-more { color: #FFF; } .services-item-three .content-box { z-index: 5; text-align: left; padding: 40px 30px 40px 65px; background: #FFF; border: 1px solid #f1f1f1; border-bottom: 3px solid #2859a8; transition: 0.4s; } .services-item-three .content-box span { color: #fff; display: block; position: absolute; left: 0; top: 45px; height: 75px; width: 75px; background: #2859a8; text-align: center; line-height: 70px; } .services-item-three .content-box span::before { margin: 0; font-size: 40px } .services-item-three .content-box h4 { color: #02185a; font-size: 18px; font-weight: 600; margin-bottom: 0px; text-transform: capitalize; line-height: 25px; } .services-item-three .content-box p { margin-bottom: 0; line-height: 24px; margin-top: 20px; } .services-classic { padding-right: 30px; padding-left: 30px; } .item-server-four { padding: 0; } .item-server-four .services-item-four { } .item-server-four .services-item-four .content-box { position: relative; padding: 40px 30px; z-index: 5; text-align: center; } .services-item-four .content-box span { font-size: 50px; color: #2859a8; display: block; } .services-item-four .content-box h4 { color: #02185a; font-size: 18px; font-weight: 600; margin-bottom: 20px; text-transform: capitalize; margin-top: 25px; } .services-item-four .content-box p { margin-bottom: 0; line-height: 24px; } .item-server-four:nth-child(1) { border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; } .item-server-four:nth-child(2) { border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; } .item-server-four:nth-child(3) { border-bottom: 1px solid #ddd; } .item-server-four:nth-child(4) { border-right: 1px solid #ddd; } .item-server-four:nth-child(5) { border-right: 1px solid #ddd; } .item-server-four .services-item-two { margin-bottom: 0; } /* Signle Services Page */ .single-services { background: #fff; } .title-widget { } .widget { margin-bottom: 40px; } .title-widget h3 { position: relative; font-size: 20px; font-weight: 600; line-height: 20px; text-transform: capitalize; color: #02185a; margin-bottom: 30px; } .links-services { padding-left: 0; margin-bottom: 0; border-top: none; } .links-services li { border-bottom: 1px solid #f5f3f3; margin-right: 0; margin-left: 0; } .links-services li a { font-size: 14px; font-weight: 500; padding-bottom: 15px; display: block; line-height: 15px; text-transform: capitalize; color: #898989; padding-top: 15px; transition: all .4s; } .links-services li.active a, .links-services li a:hover { color: #2859a8; padding-left: 10px; } .links-services li a i { margin-right: 10px; } .links-services li:last-child { border-bottom: none; } .lists-brochures { padding-left: 0; } .lists-brochures li a { width: 100%; position: relative; border: 1px solid #f1f1f1; background: #f9f9f9; color: #02185a; height: 60px; line-height: 60px; display: block; margin-bottom: 20px; text-align: left; padding-left: 15px; font-family: 'Poppins', sans-serif; z-index: 2; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.20px; } .lists-brochures li a i { margin-right: 10px; font-size: 11px; } .lists-brochures li:last-child a { margin-bottom: 0; } .lists-brochures li a span { position: absolute; right: 15px; height: 30px; width: 30px; background: #2859a8; line-height: 30px; top: 15px; text-align: center; font-size: 10px; color: #FFF; } .inner-widget { } .inner-widget p { line-height: 24px; margin-bottom: 30px; } .title-single-service h3 { color: #02185a; text-transform: capitalize; font-size: 25px; font-weight: 600; margin-bottom: 25px; line-height: 25px; margin-top: 0; } .container-service-details .faq { background: transparent; padding: 0; } .signle-services-item { margin-bottom: 50px; } .signle-services-item .indicator { padding-left: 0; margin-bottom: 20px; } .indicator li { margin-bottom: 10px; color: #898989; font-size: 14px; text-transform: capitalize; } .indicator li span { margin-right: 10px; color: #2859a8 !important; } .img-indicator { padding-top: 10px; } .how-work-two { margin-right: 0; margin-left: 0; } .signle-services-item img { width: 100%; } .signle-services-item .item-process { padding: 30px; background: #FFF; position: relative; text-align: left; border: 1px solid #f1f1f1; } .signle-services-item .item-process .number-work { margin-bottom: 20px; font-size: 30px; line-height: 25px; font-weight: 600; } .signle-services-item .item-process h4 { color: #02185a; font-size: 18px; font-weight: 600; text-transform: capitalize; } .signle-services-item .item-process .line-process { width: 50px; height: 3px; background: #2859a8; margin-top: 25px; margin-bottom: 20px; margin-left: 0; } .signle-services-item .item-process p { margin-bottom: 0; line-height: 24px; } .faq-page { background: #FFF; padding-top: 120px !important; } /*---------------------------------------------------------------- End Section Services ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Section Work Process ----------------------------------------------------------------*/ .work-process { width: 100%; background-image: url(../images/header/header-25.jpg); background-position: center center; background-repeat: no-repeat; top: 0; left: 0; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; position: relative; } .work-process .overlay { background: rgba(14, 27, 62, 0.5); position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .content-process { z-index: 10; position: relative; margin-bottom: -100px; box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.05); margin-right: 0; margin-left: 0; border-radius: 5px; overflow: hidden; } .item-process { padding: 50px 30px; background: #FFF; position: relative; text-align: left; border: 1px solid #f1f1f1; } .item-process .number-work { margin-bottom: 30px; font-size: 60px; line-height: 45px; font-weight: 600; color: #2859a8; } .item-process h3 { color: #666; display: block; text-transform: uppercase; font-family: 'Roboto', sans-serif; letter-spacing: .20px; font-size: 12px; line-height: 14px; margin: 0; margin-bottom: 10px; font-weight: 500; margin-top: 30px } .item-process h4 { color: #02185a; font-size: 20px; font-weight: 600; text-transform: capitalize; margin-bottom: 25px } .item-process .line-process { color: #02185a; font-size: 20px; font-weight: 600; text-transform: capitalize; margin-bottom: 20px; } .item-process p { margin-bottom: 0; line-height: 24px; } /*---------------------------------------------------------------- End Section Work Process ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Section FAQ’s ----------------------------------------------------------------*/ .faq { padding-top: 220px; background: #FFF; position: relative; } .faq-two { padding-top: 120px; } .faq-three { padding-top: 120px; background: #f9f9f9; } .img-video .start-video .popup-video { background: #2859a8; color: #FFF; height: 50px; width: 180px; display: inline-block; position: relative; margin-right: 70px; line-height: 50px; text-align: center; font-weight: 600; letter-spacing: 0.35px; font-size: 14px; transition: 0.4s; } .img-video .start-video .popup-video:hover { opacity: 0.8; } .img-video .start-video .popup-video i { padding-right: 5px; font-size: 12px; } .img-video .start-video .popup-video span { position: absolute; right: -70px; width: 70px; background: #eee; color: #000; height: 50px; line-height: 50px; letter-spacing: 1px; font-weight: 500; } .img-video { position: relative; } .img-video img { width: 100%; } .overlay-video { position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: rgba(50, 50, 50, 0.2); } .intro-video { position: absolute; top: 50%; width: 250px; display: block; right: 0; left: 0; margin-right: auto; margin-left: auto; } .our-video-text { padding-top: 40px; } .img-video .start-video { z-index: 3; transition: all .4s ease; text-align: center; } .img-video .start-video .go-video { z-index: 3; position: absolute; right: 0; left: 0; background: #2859a8; border-radius: 50%; transition: all .4s ease; font-size: 18px; } .img-video .start-video .go-video:hover { background: #02185a; } .title-video { transform: translate(-50%, -100%); font-size: 14px; font-weight: 700; color: #FFF; } .accordion { margin-top: 35px; } .faq .card { padding: 0; border: none; box-shadow: none; border-radius: 0; background: none; margin-bottom: 5px; border: 1px solid #ddd; } .faq .card-header { padding: 0; border: none; box-shadow: none; border-radius: 0; background: none; } .card .card-header button:after { position: absolute; right: 30px; top: 20px; font-weight: 900; font-family: "Font Awesome 5 Free"; content: "\f067"; font-size: 10px; height: 20px; width: 20px; background: transparent; line-height: 20px; text-align: center; } .card .card-header button[aria-expanded="true"] { margin-bottom: 0; color: #2859a8; } .card .card-header button[aria-expanded="true"]:after { content: "\f068"; background: #2859a8; color: #FFF; } .faq .card-header .btn-link { display: block; width: 100%; text-align: left; padding: 15px 30px; background: #fff; font-size: 18px; color: #02185a; font-weight: 500; text-decoration: none; border-bottom: 1px solid #ddd; white-space: inherit; padding-right: 40px; } .faq .card-body { padding: 20px 30px 15px; background: #FFF; font-family: 'Roboto', sans-serif; } .faq-three .acco { margin-top: 0 !important; } /*---------------------------------------------------------------- End Section FAQ’s ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Section Portfolio ----------------------------------------------------------------*/ .portoflio-one { position: relative; } .case-item h5{font-size: 16px;padding-top: 0px;margin-top: 0px;} .portoflio-one .owl-carousel { position: relative; } .portoflio-one .owl-nav{ position: absolute; top: -70px; width: 100%; z-index: 999; transform: translateY(-50%); } .portoflio-one .owl-nav div { width: 40px; height: 40px; color: #02185a; text-align: center; line-height: 42px; font-size: 16px; background: #ffffff; border-radius: 1px; border: 1px solid #eee; z-index: 999; } .portoflio-one .owl-nav div:hover { background: #2859a8; color: #fff; } .portoflio-one .owl-nav div.owl-prev { right: 50px; position: absolute; transition: all 0.4s ease 0s; } .portoflio-one .owl-nav div.owl-next { right: 0px; position: absolute; transition: all 0.4s ease 0s; } .case-item { position: relative; } .img-case { position: relative; overflow: hidden; } .portoflio-one .owl-carousel .owl-item .img-case img { display: block; margin-right: auto !important; margin-left: auto !important; width: 1000px !important; -webkit-transition: all 2s; -moz-transition: all 2s; -ms-transition: all 2s; -o-transition: all 2s; transition: all 2s; } .img-case img { width: 1000px !important; -webkit-transition: all 2s; -moz-transition: all 2s; -ms-transition: all 2s; -o-transition: all 2s; transition: all 2s; } .case-item:hover .img-case img { opacity: 0.9; -webkit-transform: scale(1.15); -moz-transform: scale(1.15); -ms-transform: scale(1.15); -o-transform: scale(1.15); transform: scale(1.15); } .case-item .img-case .overlay-case { position: absolute; left: 10px; bottom: 10px; right: 10px; top: 10px; z-index: 25; opacity: 0; display: block; background: rgba(1, 16, 59, 0.95); -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); -webkit-transition: all 0.6s; -moz-transition: all 0.6s; -ms-transition: all 0.6s; -o-transition: all 0.6s; transition: all 0.6s; -webkit-transform-origin: left; -moz-transform-origin: left; -ms-transform-origin: left; -o-transform-origin: left; transform-origin: left; } .case-item:hover .img-case .overlay-case { opacity: 1; -webkit-transform: scaleX(1); -moz-transform: scaleX(1); -ms-transform: scaleX(1); -o-transform: scaleX(1); transform: scaleX(1); } .case-item .img-case .overlay-case .inner-overlay { position: absolute; left: 0px; top: 30px; width: 100%; height: 100%; display: table; z-index: 1; padding: 10px 10px; vertical-align: middle; opacity: 0; transition: all 0.7s ease; -moz-transition: all 0.7s ease; -webkit-transition: all 0.7s ease; -ms-transition: all 0.7s ease; -o-transition: all 0.7s ease; } .case-item:hover .img-case .overlay-case .inner-overlay { opacity: 1; top: 0; transition-delay: 0.5s; } .case-item .img-case .overlay-case .inner-overlay .case-study-text { position: relative; text-align: center; display: table-cell; vertical-align: middle; } .text-of-case { position: absolute; bottom: 20px; right: 10px; left: 20px; text-align: left; } .case-study-text .tag-case { color: #2859a8; font-size: 12px; text-transform: uppercase; font-weight: 700; line-height: 12px; font-family: 'Roboto', sans-serif; margin-bottom: 10px; } .case-study-text h5 a { color: #fff; display: block; margin-top: 7px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; font-size: 18px; font-weight: 600; margin-bottom: 0px; text-transform: capitalize; padding-top: 3px; line-height: 25px; } .case-study-text h5:hover a{ color: #2859a8 !important; } .portfolio-two .links-case { position: absolute; top: 20px; right: 10px; } .links-case div { display: inline-block; } .links-case div a { margin-right: 5px; margin-left: 5px; transition: .4s; width: 40px; height: 40px; border-radius: 0px; font-size: 14px; line-height: 40px; text-align: center; color: #02185a; border: 1px solid #f1f1f1; background: #fff; display: block; } .links-case div a:hover { border: 1px solid #2859a8; color: #FFF; background: #2859a8; } .portfolio-two { background: #fff; position: relative; } .portfolio-two .filter-group { position: relative; display: block; width: 100%; text-align: left; } .list-control { display: inline-block; margin-bottom: 30px; padding-left: 0; } .list-control li { margin: 0 15px 10px 0; padding: 8px 20px; font-weight: 700; cursor: pointer; display: inherit; color: #02185a; text-transform: capitalize; font-size: 13px; background: #FFF; border: 1px solid #f1f1f1; } .list-control li.active { background: #2859a8; color: #FFF; } .portfolio-two .case-item { margin-bottom: 30px; } .portfolio-two .img-case img { display: block; margin-right: auto !important; margin-left: auto !important; width: 1000px !important; -webkit-transition: all 2s; -moz-transition: all 2s; -ms-transition: all 2s; -o-transition: all 2s; transition: all 2s; } .portfolio-two .img-case img { display: block; -webkit-transition: all 2s; -moz-transition: all 2s; -ms-transition: all 2s; -o-transition: all 2s; transition: all 2s; } .portfolio-two .img-case:hover img { opacity: 0.9; -webkit-transform: scale(1.15); -moz-transform: scale(1.15); -ms-transform: scale(1.15); -o-transform: scale(1.15); transform: scale(1.15); } .footer-case { padding: 20px; background: #FFF; border: 1px solid #eee; text-align: left; color: #02185a; border-bottom: 3px solid #2859a8; } .footer-case .tag-case { color: #898989; font-size: 12px; text-transform: uppercase; font-weight: 700; line-height: 12px; font-family: 'Roboto', sans-serif; margin-bottom: 10px; } .portfolio-two .case-study-text h5 a { color: #FFF; } .footer-case h5 a { display: block; margin-top: 7px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; color: #02185a; font-size: 18px; font-weight: 600; margin-bottom: 0px; text-transform: capitalize; padding-top: 3px; line-height: 25px; } .footer-case h5 a:hover { color: #2859a8; } .footer-case p { margin-bottom: 0; } .footer-case .read-more { color: #898989; font-size: 12px; display: inline-block; font-weight: 700; margin-top: 15px; border-bottom: 1px solid #898989; line-height: 20px; text-transform: uppercase; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .footer-case .read-more:hover { color: #2859a8; border-bottom: 1px solid #2859a8; } .footer-case .read-more i { font-size: 11px; margin-left: 5px; } .portfolio-three { background: #02185a; padding-bottom: 220px; position: relative; z-index: 5; } .case-three .owl-nav, .case-single .owl-nav { position: absolute; top: 46%; width: 100%; z-index: 999; transform: translateY(-50%); } .case-three .owl-nav div, .case-single .owl-nav div{ width: 40px; height: 40px; color: #02185a; text-align: center; line-height: 42px; font-size: 16px; background: #f9f9f9; border-radius: 1px; border: 1px solid #eee; z-index: 999; } .case-three .owl-nav div:hover, .case-single .owl-nav div:hover { color: #FFF; background: #2859a8; border: 1px solid #2859a8; } .case-three .owl-nav div.owl-prev, .case-single .owl-nav div.owl-prev { left: 10px; position: absolute; transition: all 0.4s ease 0s; } .case-three .owl-nav div.owl-next, .case-single .owl-nav div.owl-next { right: 10px; position: absolute; transition: all 0.4s ease 0s; } .case-single.owl-carousel.owl-drag .owl-item { width: 100%; } .case-three .portfolio-three-item { opacity: 0.3; -webkit-transition: all 0.6s; -moz-transition: all 0.6s; -ms-transition: all 0.6s; -o-transition: all 0.6s; transition: all 0.6s; } .case-three .owl-item.center .portfolio-three-item { opacity: 1; } .case-three .owl-item.center .case-study-text { opacity: 1; -webkit-transform: scaleX(1); -moz-transform: scaleX(1); -ms-transform: scaleX(1); -o-transform: scaleX(1); transform: scaleX(1); } .case-three .case-study-text { position: absolute; left: 10px; bottom: 10px; right: 10px; top: 10px; z-index: 25; opacity: 0; display: block; -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); -webkit-transition: all 0.6s; -moz-transition: all 0.6s; -ms-transition: all 0.6s; -o-transition: all 0.6s; transition: all 0.6s; -webkit-transform-origin: left; -moz-transform-origin: left; -ms-transform-origin: left; -o-transform-origin: left; transform-origin: left; } .case-three .text-of-case { position: absolute; bottom: 30px; right: 10px; left: 30px; text-align: left; background: #FFF; padding: 30px; border-bottom: 3px solid #2859a8; width: 60%; } .portfolio-page-three { background: #02185a; } .case-study-text h5 a { color: #02185a; } .portfolio-three-item .img-case { position: relative; overflow: hidden; } .portfolio-three-item .img-case img { width: 100%; -webkit-transition: all 2s; -moz-transition: all 2s; -ms-transition: all 2s; -o-transition: all 2s; transition: all 2s; } .portfolio-three-item:hover .img-case img { opacity: 0.9; -webkit-transform: scale(1.15); -moz-transform: scale(1.15); -ms-transform: scale(1.15); -o-transform: scale(1.15); transform: scale(1.15); } /* Page Single Case */ .single-case-study { position: relative; background: #fff; } .single-item-one, .single-item-two, .single-item-three { background: #FFF; margin-right: 0; margin-left: 0; } .single-item-one { padding: 100px 50px 50px; background: #fff; border: 1px solid #eee; } .single-item-one .portoflio-one { background: #fff; } .single-item-two { padding: 0 50px 20px; } .single-item-three { padding: 0 50px 40px; margin-bottom: 120px; } .single-item-three .img-indicator { padding-top: 0px; } .box-project h3 { color: #02185a; text-transform: capitalize; margin-top: -10px; font-size: 32px; font-weight: 600; line-height: 50px; margin-bottom: 15px; } .box-project p { margin-bottom: 25px; font-size: 16px; line-height: 30px; max-width: 640px; } .box-project .project-details { padding: 30px 30px 10px; background: #f9f9f9; border: 1px solid #f1f1f1; } .box-project ul li { padding-bottom: 20px; font-size: 13px; text-transform: capitalize; font-weight: 500; line-height: 13px; letter-spacing: 1px; } .portfolio-info { padding-bottom: 25px; font-size: 14px; text-transform: capitalize; font-weight: 500; line-height: 13px; letter-spacing: 1px; color: #989898; } .portfolio-info span { font-size: 14px; font-weight: 600; color: #02185a; text-align: left; width: 140px; display: block; float: left; text-transform: capitalize; line-height: 14px; } .item-dat-case { margin-bottom: 30px; } .item-dat-case h4 { color: #02185a; font-size: 18px; font-weight: 600; text-transform: capitalize; margin-bottom: 18px; } .item-dat-case p { line-height: 24px; margin-bottom: 0; } .info-project { background: #f9f9f9; } .info-project .faq { background: transparent; padding-top: 0; } .info-project .card { background: transparent; } .case-studies h4 { color: #02185a; text-transform: capitalize; font-size: 25px; font-weight: 600; margin-bottom: 40px; line-height: 25px; margin-top: 0; } .single-case-slider .owl-item img { width: 1000px; } .more-projects { background: #FFF; position: relative; } .more-projects .portoflio-one .owl-nav { top: -60px; } /*---------------------------------------------------------------- End Section Portfolio ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Section price ----------------------------------------------------------------*/ .price { background: #fff; padding-top: 220px; position: relative; } .price-bg-two { background: #f9f9f9; } .price .price-item { padding: 50px 40px; background: #fff; margin-bottom: 30px; border: 1px solid #f1f1f1; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; position: relative; border-bottom: 3px solid #2859a8; } .price .price-item:hover { position: relative; z-index: 9; border: 1px solid #02185a; border-bottom: 3px solid #02185a; background: #02185a; } .price .price-item:hover h4, .price .price-item:hover .value h3, .price .price-item:hover .value .per, .price .price-item:hover .features-price ul li { color: #FFF; } .price .price-item:hover .header-price { border-bottom: 1px solid rgba(221, 221, 221, 0.2); } .header-price { border-bottom: 1px solid #ddd; text-align: left; padding-bottom: 50px; } .price-item .header-price h4 { font-weight: 600; text-align: left; color: #02185a; text-transform: capitalize; font-size: 20px; margin-bottom: 30px; } .price-item .value { text-align: left; padding-left: 15px; position: relative; } .price-item .value h3 { font-size: 50px; font-weight: 800; display: inline-block; color: #02185a; position: relative; font-family: 'Roboto', sans-serif; } .price-item .value h3 span { font-size: 12px; position: absolute; top: 0; left: -15px; } .value .per { text-transform: uppercase; font-size: 13px; font-weight: 600; margin-left: 10px; color: #02185a; } .price-item .header-price p { margin-bottom: 0px; line-height: 24px; text-transform: capitalize; font-weight: 600; text-align: left; padding-bottom: 25px; display: none; } .price-item .features-price { text-align: left; } .price-item .features-price ul { text-align: left; padding: 50px 0 15px 30px; } .price-item .features-price ul li { font-size: 14px; font-weight: 500; color: #02185a; margin-bottom: 20px; } .price-item .features-price ul li span { margin-right: 10px; color: #2859a8; } .price .order { text-align: center; width: 100%; } .price .price-two { background: #2859a8 !important; border: none !important; border-bottom: none !important; } .price .price-two:hover { background: #02185a !important; } .price-two .header-price h4 { color: #FFF; } .price-two .header-price { border-bottom: 1px solid rgba(238, 238, 238, 0.3); } .price-two .features-price ul li { color: #FFF; } .price-two .btn-four:hover { background: #2859a8; color: #fff; } .price-two .features-price ul li span { color: #ffffff; } .price-two .value h3, .price-two .features ul li span, .price-two .value .per { color: #ffffff; } .pricing-page { background: #FFF; } .pricing-page .price { background: #fff; padding-top: 120px; position: relative; } .pricing-page .work-process { background: #f9f9f9; } .pricing-page .work-process .content-process { z-index: 10; position: relative; margin-bottom: 0; box-shadow: none; margin-right: 0; margin-left: 0; border-radius: 5px; overflow: hidden; } /*---------------------------------------------------------------- End Section Price ----------------------------------------------------------------*/ /**/ .testimonials { position: relative; } .clients-page { background: #FFF; } .testimonials-one .owl-carousel { position: relative; } .testimonials-one .owl-carousel .testmonail-item .owl-item { margin: auto; } .testimonials-one .owl-theme .owl-dots .owl-dot span { margin: 20px 7px 0 7px; width: 9px; height: 9px; background: transparent; margin-right: 5px; margin-left: 5px; display: inline-block; border-radius: 0; border: 1px solid #FFF; transition: 0.4s; } .testimonials-one .owl-theme .owl-dots .owl-dot:hover span, .testimonials-one .owl-theme .owl-dots .owl-dot.active span { background: #fff; } .testimonials-one .owl-dots .active span { background: #fff !important; } .testimonials-one .owl-nav { position: absolute; bottom: 50px; right: 40px; z-index: 999; transform: translateY(-50%); } .testimonials-one .owl-nav div { width: 40px !important; height: 40px !important; color: #02185a !important; text-align: center !important; line-height: 36px !important; font-size: 16px !important; background: rgb(255, 255, 255) !important; border-radius: 1px !important; z-index: 999 !important; } .testimonials-one .owl-nav div:hover { background: #2859a8 !important; color: #fff !important; } .testimonials-one .owl-nav div.owl-prev { right: 0; position: absolute; transition: all 0.4s ease 0s; } .testimonials-one .owl-nav div.owl-next { left: 0px; position: absolute; transition: all 0.4s ease 0s; } .testimonials-one .owl-theme .owl-nav.disabled+.owl-dots { margin-top: 0; text-align: right; position: absolute; bottom: 0; right: 0; } .testimonials-one { background-image: url(../images/header/header-41.jpg); background-position: center center; background-repeat: no-repeat; background-attachment: fixed; top: 0; left: 0; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; width: 100%; position: relative; } .content-testimonial { padding: 100px; background: #02185a; } .testimonials-one .testmonail-box { background-color: transparent; padding: 0; position: relative; border-radius: 0; } .icon-quote span { color: #2859a8; margin-bottom: 30px; line-height: 40px; display: block; } .icon-quote span::before { margin: 0; font-size: 50px; } .testimonials-one .authore-client { display: block; position: relative; padding-left: 90px; height: 70px; padding-top: 12px; margin-top: 50px; } .testimonials-one .authore-client img { border-radius: 0; height: 70px; width: 70px; position: absolute; left: 0; top: 0; border-radius: 5px; } .testimonials-one .inner-test p { font-size: 18px; font-weight: 400; line-height: 35px; text-transform: capitalize; color: #EEE; margin-bottom: 0; text-align: left; } .testimonials-one .author-details h6 { color: #fff; font-weight: 500; font-size: 20px; line-height: 20px; margin-bottom: 10px; text-transform: capitalize; letter-spacing: 1px; text-align: left; } .testimonials-one .author-details span { display: block; line-height: 15px; margin-bottom: 0px; font-size: 12px; font-weight: 500; text-transform: uppercase; margin-top: 5px; color: #ddd; text-align: left; } /*---------------------------------------------------------------- Start Section Testimonials ----------------------------------------------------------------*/ .testimonials { } .testimonials .overlay { } .owl-carousel { position: relative; } .testimonials .owl-nav { position: absolute; top: -60px; width: 100%; z-index: 999; transform: translateY(-50%); } .testimonials .owl-nav div { width: 40px; height: 40px; color: #02185a; text-align: center; line-height: 42px; font-size: 16px; background: #fff; border-radius: 1px; border: 1px solid #eee; z-index: 999; } .testimonials .owl-nav div:hover { color: #FFF; background: #2859a8; border: 1px solid #2859a8; } .testimonials .owl-nav div.owl-prev { right: 50px; position: absolute; transition: all 0.4s ease 0s; } .testimonials .owl-nav div.owl-next { right: 0px; position: absolute; transition: all 0.4s ease 0s; } .testimonials .testmonail-box { background: #ffffff; padding: 20px; margin: 2px; position: relative; border: 1px solid #f5f5f5; text-align: left; overflow: hidden; border-bottom: 3px solid #2859a8; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px; } .testimonials .inner-test { margin-top: 10px; padding-top: 10px; margin-bottom: 15px; border-top: 2px solid #EEE; } #revtext{height: 125px;} .testimonials .inner-test p { margin-bottom: 0; font-size: 14px; font-weight: 400; line-height: 28px; } .list-stars li i{font-size: 13px;} .list-stars li{font-size: 13px;} .testimonials .quote-icon { position: absolute; color: #f9f9f9; font-size: 28px; right: 30px; transform: rotate(180deg); top: 50px; } .testimonials .client-img { display: inline-block; margin-right: 20px; float: left; } .testimonials .client-img img { height: 65px; width: 65px; background: #FFF; position: relative; box-shadow: 1px 6px 9px rgba(0, 0, 0, 0.08); border-radius: 50px; } .testimonials .author-details { float: left; } .testimonials .author-details h6{ color: #02185a; text-transform: capitalize; font-size: 16px; font-weight: 600; padding-top: 6px; line-height: 23px; margin-bottom: 2px; } .testimonials .author-details span { font-size: 12px; font-weight: 500; line-height: 20px; } .author-details div{font-size: 12px;} .list-stars { padding-left: 0; margin-bottom: 0; } .list-stars li { display: inline-block; font-size: 7px; color: #fac917; padding-right: 2px; } .list-stars li:last-child { color: #DDD; } .testimonials-two { background: #FFF !important; } .testimonials-two .testmonail-box { background: #f9f9f9; } .testimonials-two .quote-icon { color: rgba(0, 0, 0, 0.08); } .testimonials .inner-test { border-top: 2px solid #EEE; } .careers { background: #f9f9f9; } .careers-page { background: #fff; } .career-item { padding: 30px; background: #FFF; border: 1px solid #eee; } .career-item .title-item { border-bottom: 1px solid #eee; padding-bottom: 20px; margin-bottom: 15px; } .career-item h3 { color: #02185a; font-size: 18px; font-weight: 600; text-transform: capitalize; display: block; line-height: 20px; margin-bottom: 15px; } .history span:first-child { color: #ffffff; font-weight: 600; background: #2859a8; padding: 5px 10px; margin-right: 10px; font-size: 12px; } .history span { text-transform: uppercase; color: #989898; font-weight: 600; font-size: 12px; letter-spacing: 0.20px; } .career-item ul { padding-left: 0; margin-bottom: 0px; } .career-item ul li { margin-bottom: 5px; color: #666; } .career-item ul li span { margin-right: 10px; color: #2859a8 !important; } .career-item .read-more:hover { color: #2859a8; border-bottom: 1px solid #2859a8; } .career-item .read-more { color: #898989; font-size: 12px; display: inline-block; font-weight: 700; border-bottom: 1px solid #898989; line-height: 20px; text-transform: uppercase; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .career-item .read-more i { font-size: 11px; margin-left: 5px; } .apply-team { padding: 80px 50px 100px; background: #FFF; border: 1px solid #eee; margin-right: 0; margin-left: 0; margin-top: 90px; margin-bottom: 30px; } .apply-team .line-title { margin-bottom: 50px; } .apply-team form select { height: 50px !important; outline: 0; resize: none; font-weight: 400; display: block; width: 100%; line-height: 24px; font-size: 14px; border: 1px solid #f1f1f1; padding: 13px 20px; background: #f9f9f9; color: #02185a; border-radius: 2px; margin-bottom: 30px; box-shadow: none !important; } .apply-team form input[type="file"] { height: 50px !important; outline: 0; resize: none; font-weight: 400; display: block; width: 100%; line-height: 24px; font-size: 14px; border: 1px solid #eee; padding: 13px 20px; background: #fff; color: #02185a; border-radius: 2px; margin-bottom: 30px; box-shadow: none !importan } /*---------------------------------------------------------------- End Section Testimonials ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Section Clients ----------------------------------------------------------------*/ .clients { position: relative; background: #2859a8; } .clients .overlay { background-image: url(../images/icons/map_img.png); background-position: center center; background-repeat: no-repeat; top: 0; left: 0; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; width: 100%; position: absolute; opacity: 0.4; } .clients .owl-item > .owl-item { margin-right: auto !important; margin-left: auto !important; display: block; width: 100%; } .sponsor-item { direction: block; } .sponsor-item img { opacity: .9; display: block; margin-right: auto !important; margin-left: auto !important; width: 100px !important; transition: 0.4s; position: relative; } .sponsor-item:hover img{ opacity: 1; -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); } .our-partner { background: #f9f9f9; } .our-partner .partner-item { background: #FFF; border: 1px solid #f1f1f1; padding: 30px; } .our-partner .partner-item img { display: block; margin-right: auto; margin-left: auto; opacity: 0.6; transition: 0.4s ease-in-out; } .our-partner .partner-item:hover img { opacity: 1; } /*---------------------------------------------------------------- End Section Clients ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Section Team ----------------------------------------------------------------*/ .our-team { background: #fff; } .item-team { margin-bottom: 30px; } .team-one-item { position: relative; overflow: hidden; } .our-team .team-one-item img { display: block; margin-right: auto !important; margin-left: auto !important; width: 1000px !important; -webkit-transition: all 2s; -moz-transition: all 2s; -ms-transition: all 2s; -o-transition: all 2s; transition: all 2s; } .item-team:hover .team-one-item img { opacity: 0.9; -webkit-transform: scale(1.15); -moz-transform: scale(1.15); -ms-transform: scale(1.15); -o-transform: scale(1.15); transform: scale(1.15); } .team-one-item .overlay-team { position: absolute; left: 10px; bottom: 10px; right: 10px; top: 10px; z-index: 25; opacity: 0; display: block; background: rgba(1, 16, 59, 0.95); -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease; transition: all 0.6s ease; -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); -webkit-transition: all 0.6s; -moz-transition: all 0.6s; -ms-transition: all 0.6s; -o-transition: all 0.6s; transition: all 0.6s; -webkit-transform-origin: left; -moz-transform-origin: left; -ms-transform-origin: left; -o-transform-origin: left; transform-origin: left; } .item-team:hover .team-one-item .overlay-team { opacity: 1; -webkit-transform: scaleX(1); -moz-transform: scaleX(1); -ms-transform: scaleX(1); -o-transform: scaleX(1); transform: scaleX(1); } .team-one-item .overlay-team .inner-overlay { position: absolute; left: 0px; top: 30px; width: 100%; height: 100%; display: table; z-index: 1; padding: 10px 10px; vertical-align: middle; opacity: 0; transition: all 0.7s ease; -moz-transition: all 0.7s ease; -webkit-transition: all 0.7s ease; -ms-transition: all 0.7s ease; -o-transition: all 0.7s ease; } .item-team:hover .team-one-item .overlay-team .inner-overlay { opacity: 1; top: 0; transition-delay: 0.5s; } .team-one-item .overlay-team .inner-overlay .text-team { position: relative; text-align: center; display: table-cell; vertical-align: middle; } .text-team h4 { color: #fff; font-weight: 500; font-size: 20px; line-height: 20px; margin-bottom: 10px; text-transform: capitalize; letter-spacing: 1px; } .text-team p { display: block; line-height: 14px; margin-bottom: 0px; font-size: 14px; font-weight: 500; text-transform: uppercase; margin-top: 5px; color: #ddd; } .text-team .line-item { width: 50px; height: 3px; margin: 20px auto 25px; background: #2859a8; } .social-media-team { padding-left: 0; } .social-media-team li { display: inline-block; } .social-media-team li a { margin-right: 5px; margin-left: 5px; transition: .4s; width: 40px; height: 40px; border-radius: 0; font-size: 14px; line-height: 40px; text-align: center; color: #02185a; border: 1px solid #f1f1f1; background: #fff; display: block; } .social-media-team li a:hover { border: 1px solid #2859a8; color: #FFF; background: #2859a8; } .our-team-two { width: 100%; background: #02185a; position: relative; } .our-team-two .overlay { background-image: url(../images/icons/map_img.png); background-position: center center; background-repeat: no-repeat; top: 0; left: 0; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; width: 100%; position: absolute; opacity: 0.2; } .our-team-two .team-carousel { margin-bottom: -139px; } .team-carousel .owl-nav { position: absolute; top: -143px; width: 100%; z-index: 999; transform: translateY(-50%); } .team-carousel .owl-nav div.owl-prev { right: 50px; position: absolute; transition: all 0.4s ease 0s; } .team-carousel .owl-nav div.owl-next { right: 0px; position: absolute; transition: all 0.4s ease 0s; } .team-carousel .owl-nav div { width: 40px; height: 40px; color: #02185a; text-align: center; line-height: 42px; font-size: 16px; background: #f9f9f9; border-radius: 1px; border: 1px solid #eee; z-index: 999; } .team-carousel .owl-nav div:hover { background: #2859a8; color: #fff; border: 1px solid #2859a8; } .our-team-two .team-carousel .item-team { margin-bottom: 30px; } .team-classic .team-one-item { margin-bottom: 0; } .team-classic .owl-carousel { position: relative; } .team-classic .owl-nav{ position: absolute; top: 46%; width: 100%; z-index: 999; transform: translateY(-50%); } .team-classic .owl-nav div { width: 40px; height: 40px; color: #ffffff; text-align: center; line-height: 42px; font-size: 20px; background: rgba(129, 118, 118, 0.78); border-radius: 2px; z-index: 999; } .team-classic .owl-nav div:hover { background: #2859a8; color: #fff; } .team-classic .owl-nav div.owl-prev { left: 10px; position: absolute; transition: all 0.4s ease 0s; } .team-classic .owl-nav div.owl-next { right: 10px; position: absolute; transition: all 0.4s ease 0s; } .footer-team { padding: 30px; text-align: left; background: #fff; border: 1px solid #f1f1f1; border-bottom: 3px solid #2859a8; } .footer-team h4 { color: #02185a; font-size: 20px; font-weight: 600; text-transform: capitalize; margin-bottom: 15px; display: block; line-height: 18px; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all .4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } .footer-team p { color: #898989; font-size: 12px; margin-bottom: 0px; text-transform: uppercase; font-weight: 600; line-height: 12px; } .join-team { background: #fff; margin-top: 50px; margin-bottom: 30px; border: 1px solid #eee; padding: 50px 50px 10px; } .join-team h3 { color: #666; display: block; text-transform: uppercase; font-family: 'Roboto', sans-serif; font-weight: 600; letter-spacing: .20px; font-size: 14px; line-height: 14px; margin: 0; margin-bottom: 15px; font-weight: 600; } .join-team h4 { color: #02185a; text-transform: capitalize; font-size: 30px; font-weight: 600; margin-top: 10px; line-height: 36px; margin-bottom: 40px; } .join-team .btn-work-with-us .main-btn-two { margin-bottom: 40px !important; float: right } /*---------------------------------------------------------------- End Section Team ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Section Blog ----------------------------------------------------------------*/ .blog { position: relative; } .blog-item { margin-bottom: 30px; } .blog-img { overflow: hidden; } .blog-item:hover img { -webkit-transform: scale(1.1,1.1); -moz-transform: scale(1.1,1.1); -o-transform: scale(1.1,1.1); transform: scale(1.1,1.1); } .blog-img { position: relative; } .blog-img img { width: 100%; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .blog-info { background: #fff; padding: 20px; z-index: 1; position: relative; border: 1px solid #f1f1f1; border-bottom: 3px solid #2859a8; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px; } .date { padding-left: 0; } .date li { display: inline-block; margin-right: 10px; } .date li a { color: #2859a8; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .date li a:hover { color: #2859a8; } .date li span { padding-right: 5px; } .blog-info .title-post h5 { display: block; color: #02185a; font-size: 16px; font-weight: 700; line-height: 23px; margin-bottom: 10px; text-transform: capitalize; margin-top: 5px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .blog-item a h5:hover { color: #2859a8; } .blog-info .post-text { font-size: 14px; font-weight: 400; line-height: 23px; } .blog-info .post-text p { margin-bottom: 0; line-height: 24px; } .blog-info .date { line-height: 20px; margin-bottom: 0px; font-size: 12px; font-weight: 700; text-transform: uppercase; font-family: 'Roboto', sans-serif; } .blog-info .link-post { color: #898989; font-size: 12px; display: inline-block; font-weight: 700; margin-top: 17px; border-bottom: 2px solid #898989; line-height: 20px; text-transform: uppercase; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s } .blog-info .link-post i { font-size: 11px; margin-left: 5px; } .blog-info .link-post:hover { color: #2859a8; border-bottom: 2px solid #2859a8; } /* Blog Page */ .blog-page, .blog-grid { background: #FFF; } .blog-page .blog-info { background: transparent; padding: 35px; z-index: 1; position: relative; border: none; border-bottom: none; padding-bottom: 20px; } .single-blog .blog-info .title-post h5 { font-size: 20px; font-weight: 600; line-height: 50px; margin-bottom: 10px; margin-top: 0px; } .single-blog .blog-info { padding: 20px; } .author img { float: left; height: 35px; width: 35px; margin-right: 15px; border-radius: 50%; border: 2px solid #2859a8; } .author .inner-author { padding-top: 5px; font-weight: 600; overflow: hidden; } .author .inner-author a { color: #2859a8; font-weight: 700; } .author .inner-author a:hover { color: #2859a8; } .left-side-bar { max-width: 340px; } .widget-profile { background: #fff; padding: 30px 28px; border: 1px solid #f1f1f1; border-bottom: 3px solid #2859a8; } .widget-profile h3 { line-height: 20px; text-transform: uppercase; color: #02185a; font-weight: 600; font-size: 18px; } .widget-profile span { font-weight: 500; line-height: 30px; color: #666; display: block; font-size: 15px; margin: 11px 0 10px; text-transform: capitalize; } .widget-profile p { font-size: 14px; margin-bottom: 0; line-height: 24px; font-weight: 400; } .widget-profile .read-more { color: #898989; font-size: 12px; display: inline-block; font-weight: 700; margin-top: 15px; border-bottom: 1px solid #898989; line-height: 20px; text-transform: uppercase; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .widget-profile .read-more i { font-size: 11px; margin-left: 5px; } .widget-profile .read-more:hover { color: #2859a8; border-bottom: 1px solid #2859a8; } .body-widget { position: relative; background: #fff; padding: 35px 30px; border: 1px solid #f1f1f1; border-bottom: 3px solid #2859a8; } .body-widget input[type="text"] { background: #FFF; } .btn-search { background: #2859a8; border: none; cursor: pointer; outline: none; color: #FFF; font-size: 14px; height: 50px; width: 50px; line-height: 50px; text-align: center; position: absolute; right: 30px; top: 85px; -webkit-transition: 0.4s; -moz-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s; } .btn-search:hover { background: #02185a; } .widget .categories { padding-left: 0; background: #FFF; margin-bottom: 0; border-top: none; padding-bottom: 15px; padding-top: 15px; border: 1px solid #f1f1f1; } .widget .categories li { border-bottom: 1px solid #f5f3f3; margin-right: 30px; margin-left: 30px; } .widget .categories li a { font-size: 14px; font-weight: 500; padding-bottom: 15px; display: block; line-height: 15px; text-transform: capitalize; color: #898989; padding-top: 15px; transition: all .4s; } .widget .categories li a:hover { color: #2859a8; padding-left: 10px; } .widget .categories li a i { margin-right: 10px; } .widget .categories li:last-child { border-bottom: none; } .widget-posts { position: relative; background: #fff; padding: 35px 30px; border: 1px solid #f1f1f1; border-bottom: 3px solid #2859a8; } .lastet-posts { margin-bottom: 20px; overflow: hidden; border-bottom: 1px solid #f1f1f1; padding-bottom: 20px; } .lastet-posts img { float: left; height: auto; width: 25%; border-radius: 3px; display: block; } .widget-posts .lastet-posts:last-child { border: none; margin-bottom: 0; padding-bottom: 0; } .inner-text { float: left; width: 75%; padding-left: 10px; } .widget-posts .inner-text h6 { color: #02185a; font-size: 14px; display: block; font-weight: 600; line-height: 22px; text-transform: capitalize; transition: 0.4s; } .widget-posts .inner-text h6:hover { color: #2859a8; } .inner-text .meta { font-size: 11px; color: #9b9b9b; line-height: 20px; font-weight: 700; text-transform: uppercase; font-family: 'Roboto', sans-serif; margin-top: 5px; } .tags { padding-bottom: 10px; } .widget .tags-list { padding-left: 0; } .widget .tags-list li { display: inline-block; } .widget .tags-list li a { font-size: 14px; font-weight: 500; color: #ffffff; padding: 3px 10px; margin-right: 5px; margin-bottom: 10px; display: block; transition: 0.4s; background: #2859a8; border: 2px solid #2859a8; border-radius: 2px; } .widget .tags-list li a:hover { background: #02185a; border: 2px solid #02185a; color: #FFF; } .blog-pagination { margin-top: 20px; margin-bottom: 20px; } .blog-pagination .pagination li { margin-right: 10px; } .blog-pagination .pagination li a { background-color: transparent; font-size: 16px; color: #9b9b9b; font-weight: 600; text-transform: uppercase; padding: 0; width: 45px; height: 45px; line-height: 42px; text-align: center; display: block; border: 2px solid #ddd; transition: 0.4s; } .pagination li a.active, .pagination li a:hover { background: #2859a8; border: 2px solid #2859a8; color: #FFF; } .single-blog .post-text p { margin-bottom: 0px; font-size: 14px; line-height: 28px; } .single-blog .author { padding-top: 30px; margin-top: 30px; border-top: 2px solid #f1f1f1; padding-bottom: 30px; margin-bottom: 30px; border-bottom: 2px solid #f1f1f1; } .single-blog .author span { font-size: 15px; font-weight: 600; color: #02185a; } .share { float: right; overflow: hidden; margin-top: -20px; } .share-social { float: left; padding-left: 0; margin-top: 20px; margin-bottom: 0; } .share-social li { display: inline-block; padding-left: 10px; } .share-social a { transition: .4s; width: 30px; height: 30px; border-radius: 2px; background: #f9f9f9; font-size: 12px; line-height: 30px; text-align: center; color: #02185a; display: block; border: 1px solid #f1f1f1; } .share-social a:hover { color: #fff; background: #2859a8; border: 1px solid #2859a8 } .comments .title-comments { } .comments .title-comments h4 { position: relative; font-size: 18px; font-weight: 600; line-height: 14px; text-transform: capitalize; color: #02185a; } .inner-comments { padding: 30px 0; background: #FFF; overflow: hidden; border-top: none; } .comment-author { padding-bottom: 30px; overflow: hidden; } .reply { margin-left: 120px; padding-top: 30px; border-top: 1px solid #f1f1f1; } .last-comment { padding-bottom: 0px; margin-bottom: 0px; border-bottom: none; } .comment-author img { border-radius: 5px; float: left; margin-right: 20px; width: 70px; height: 70px; } .person { padding-left: 90px; } .person h5 { display: block; color: #02185a; font-size: 18px; font-weight: 600; line-height: 23px; text-transform: capitalize; margin-bottom: 5px; } .person .time { line-height: 20px; margin-bottom: 5px; font-size: 12px; margin: 0 0 10px; font-weight: 700; text-transform: uppercase; font-family: 'Roboto', sans-serif; } .person p { margin-bottom: 15px; } .person a { color: #898989; background: #fff; line-height: 20px; padding: 5px 12px; border: 1px solid #f1f1f1; font-size: 11px; font-weight: 700; text-transform: uppercase; font-family: 'Roboto', sans-serif; transition: 0.4s; } .person a:hover { color: #fff; background: #2859a8; border: 1px solid #2859a8; } .title-add h4 { position: relative; font-size: 20px; font-weight: 600; text-transform: capitalize; line-height: 20px; color: #02185a; margin-bottom: 30px; } .comment-form { } .comments { padding-top: 20px; margin-bottom: 10px; } .comments .title-comments h4 { position: relative; font-size: 20px; font-weight: 600; line-height: 20px; text-transform: capitalize; color: #02185a; } /*---------------------------------------------------------------- End Section Blog ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Section support ----------------------------------------------------------------*/ .support { width: 100%; background-position: center center; background-repeat: no-repeat; top: 0; left: 0; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; position: relative; background-image: url(../images/header/header-25.jpg); } .support-two .overlay { background: rgba(14, 27, 62, 0.2); } .support-two .content-statistics { background: #ffffff; box-shadow: none; border-bottom: 5px solid #2859a8; } .support .content-statistics { margin-bottom: 0; } .content-statistics h2 { color: #2859a8; } .support-two .content-statistics .section-title-left h2::after { background: #2859a8; } .support-two .content-statistics h3 { color: #02185a; } .support-two .content-statistics .p-support { border-bottom: 2px solid rgb(238 238 238 / 77%); color: #666; } .support-two .contact-support h6 { color: #02185a; } .support-two .contact-support .single-contact span::before { position: absolute; left: 0; color: #2859a8; top: 0px; font-size: 22px; margin: 0; } .support-two .contact-support .single-contact .info-cont p { color: #666 !important; } .support-two .content-statistics input[type="text"], .support-two .content-statistics input[type="email"], .support-two .content-statistics textarea, .support-two .content-statistics select { background: #fff; border: 1px solid #eee; } .support-two .content-statistics input[type="text"]:focus, .support-two .content-statistics input[type="email"]:focus, .support-two .content-statistics textarea:focus, .support-two .content-statistics select:focus { border: 1px solid #2859a8; } .centent-support h3 { color: #FFF; text-transform: capitalize; font-size: 40px; font-weight: 600; margin-bottom: 0px; line-height: 45px; } .centent-support p { margin-bottom: 30px; font-family: 'Poppins', sans-serif; line-height: 24px; color: #EEE; } .support .centent-support form select { height: 50px !important; outline: 0; resize: none; font-weight: 400; display: block; width: 100%; line-height: 24px; font-size: 14px; border: 1px solid #f1f1f1; padding: 13px 20px; background: #f9f9f9; color: #02185a; border-radius: 2px; margin-bottom: 30px; box-shadow: none !important; } .support .centent-support form .btn-one { width: 100%; margin-bottom: 30px; } /*---------------------------------------------------------------- End Section support ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Footer ----------------------------------------------------------------*/ footer { padding-top: 80px; background: #1c1c1c; position: relative; } footer::before { background-image: url(../images/icons/map_img.png); background-position: center center; background-repeat: no-repeat; top: 0; left: 0; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; width: 100%; position: absolute; opacity: 0.2; content: ""; z-index: 0; height: 100%; } .footer-default-padding { padding-top: 50px; } .footer-widget h4 { position: relative; font-size: 16px; font-weight: 600; text-transform: capitalize; color: #ffffff; letter-spacing: .5px; } .footer-widget .line-footer { width: 44px; height: 2px; background: #2859a8; margin-bottom: 29px; margin-top: 15px; } .footer-row { margin-bottom: 50px; } .footer-widget .footer-logo img { width: 150px; margin-bottom: 30px; } .contact-info { padding-left: 0; } .contact-info .single-contact { position: relative; padding-left: 40px; margin-bottom: 30px; } .contact-info .single-contact span { position: absolute; left: 0; color: rgba(255, 255, 255, 0.85); top: 0; font-size: 16px; } .contact-info .single-contact .info-cont p { color: #ccc; font-size: 14px; font-weight: 600; margin-bottom: 10px; line-height: 15px; position: relative; } .footer-widget .social-media-footer { padding-left: 0; margin-bottom: 0; } .footer-widget .social-media-footer li { display: inline-block; padding-right: 15px; } .footer-widget .social-media-footer li a { font-size: 18px; color: #fff; transition: .1s; } .footer-widget .social-media-footer li a:hover { color: #f57479; } /* COMPANY LINKs */ .footer-widget .footer-link { padding-left: 0; } .footer-widget .footer-link li { border-bottom: 1px solid rgba(214, 214, 214, 0.1); transition: .4s; } .footer-widget .footer-link li:first-child a { padding-top: 0; } .footer-widget .footer-link li:hover a { padding-left: 0px; color: #FFF; } .footer-widget .footer-link li a { font-size: 13px; color: #ccc; display: block; transition: .4s; padding-top: 13px; padding-bottom: 13px; line-height: 14px; font-weight: 600; } .footer-widget .footer-link li span { padding-right: 5px; font-size: 10px; } .row-contact { background: #f9f9f9; margin-right: 0; margin-left: 0; padding-top: 0; padding-bottom: 0; margin-bottom: 40px; border: 1px solid #ddd; position: relative; } .row-contact .no-padding { border-right: 1px solid #DDD; } .row-contact .no-padding:last-child { border-right: none; } .row-contact .single-item { position: relative; padding-left: 0px; margin-bottom: 10px; margin-left: 15px; margin-top: 10px; display: flex; align-items: center; gap: 10px; } .row-contact .single-item span { left: 0; top: 0; color: #2859a8; font-size: 30px; } .row-contact .single-item span::before { margin: 0; font-size: 28px; line-height: 35px; } .row-contact .single-item p { font-size: 13px; color: #02185a; font-weight: 500; line-height: 15px; margin-bottom: 0px; } /* newsletter-item */ .footer-widget p { font-weight: 500; color: #ccc; font-size: 14px; } .newsletter-item { position: relative; margin-bottom: 35px; } .newsletter-item input { } .newsletter-item button { height: 40px; box-shadow: none; position: absolute; cursor: pointer; right: 0px; width: 50px; text-align: center; font-size: 20px; color: #ffffff; background: #2859a8; display: inline-block; top: 0; line-height: 40px; border: 1px solid #2859a8; } .footer-bar { z-index: 3; position: relative; background: #2859a8; } footer .copyright { font-weight: 500; font-size: 14px; color: #f4f7fd; letter-spacing: 1.7px; line-height: 10px; padding-top: 10px; padding-bottom: 0px; text-align: left; } footer .copyright a { color: #2859a8; font-weight: 700; } .links-of-footer { text-align: right; padding-left: 0; font-size: 14px; color: #f4f7fd; letter-spacing: 1.7px; line-height: 30px; padding-top: 0px; margin-bottom: 0; } .links-of-footer li { display: inline-block; margin-left: 25px; } .links-of-footer li a { position: relative; font-weight: 500; letter-spacing: 0.7px; line-height: 30px; text-transform: capitalize; transition: 0.4s; font-size: 12px; } .footer-copy{padding: 6px;} .links-of-footer li a::before { content: ""; position: absolute; height: 5px; width: 5px; background: #f4f7fd; display: block; left: -16px; top: 8px; border-radius: 50%; } .links-of-footer li a:hover { color: #2859a8; } .links-of-footer li:first-child a::before { display: none; } /* Scroll Top */ .scroll-up { position: fixed; bottom: 70px; right: 20px; background: #2859a8; color: #FFF; width: 40px; height: 40px; line-height: 42px; font-size: 18px; text-align: center; border-radius: 2px; cursor: pointer; z-index: 555; display: none; -webkit-box-shadow: 0 10px 10px rgba(0, 0, 0, 0.18); -moz-box-shadow: 0 10px 10px rgba(0, 0, 0, 0.18); -o-box-shadow: 0 10px 10px rgba(0, 0, 0, 0.18); box-shadow: 0 10px 10px rgba(0, 0, 0, 0.18); transition: all 0.4s; } .scroll-up:hover { background: #02185a; } /*---------------------------------------------------------------- End Footer ----------------------------------------------------------------*/ /*---------------------------------------------------------------- Start Page Shop ----------------------------------------------------------------*/ .shop { background: #fff; } .img-product { position: relative; border: 1px solid #f1f1f1; overflow: hidden; } .img-product img { width: 100%; } .img-product .btn-product { display: block; position: absolute; width: 100%; text-align: center; line-height: 50px; height: 50px; background: #2859a8; z-index: 5; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.30px; border-radius: 2px; -webkite-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; bottom: -50px; left: 0; } .img-product .btn-product i { margin-right: 10px; } .single-product-item:hover .img-product .btn-product { bottom: 0; } .single-product-item .img-product{ width: 100%; height: 220px; overflow: hidden; } .single-product-item .img-product img{ width: 100%; height: 100%; object-fit: cover; min-height: 100%; } .content-product { padding: 20px; text-align: left; position: relative; border: 1px solid #f1f1f1; border-top: 0; border-bottom: 3px solid #2859a8; } .content-product h4 a { font-size: 16px; font-weight: 600; color: #02185a; line-height: 18px; margin-bottom: 12px; text-transform: capitalize; transition: 0.4s; } .content-product h4 a:hover { color: #2859a8; } .price-product { line-height: 26px; margin-bottom: 20px; font-size: 14px; margin-top: 0px; } .price-product span { margin-right: 5px; margin-left: 5px; font-weight: 600; color: #2859a8; position: relative; } .price-product span.old-price { color: #898989; font-weight: 400;color: #898989; } .price-product span.old-price::before { position: absolute; content: " "; width: 100%; height: 2px; top: 10px; background: #898989; } .evaluation-product { padding-left: 0; margin-bottom: 0; position: absolute; top: 30px; right: 30px; } .evaluation-product li { display: inline-block; font-size: 7px; color: #fac917; padding-right: 1px; padding-left: 1px; opacity: 0.9; } .results { line-height: 50px; font-weight: 600; display: block; } .product-info .evaluation-product { padding-left: 0; margin-bottom: 0; position: relative; top: 0px; right: 0px; } .box-single-product { background: #FFF; align-items: center; margin-right: 0; margin-left: 0; } .revision{ box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px; } .box-single-product .img-product { margin-bottom: 50px; position: relative; overflow: hidden; } .box-single-product .img-product img { width: 100%; height: 400px; object-fit: cover; } .product-info h3 { color: #02185a; text-transform: capitalize; font-size: 20px; font-weight: 600; margin-bottom: 10px; line-height: 25px; margin-top: 0; } .product-info span { margin-left: 0; margin-right: 10px; } .product-info p { margin-bottom: 10px; padding-bottom: 0px; } .quantity::after, .product-info::after, .btns::after, .nav-tabs::after { display: block; width: 100%; clear: both; content: " "; } .quantity { float: left; } .product-info .btn-one { box-shadow: none; } .quantity .minus, .quantity .plus { height: 50px; width: 50px; line-height: 50px; font-size: 15px; color: #02185a; background: #f9f9f9; display: block; float: left; border: 1px solid #f1f1f1; border-right: none; text-align: center; } .quantity .plus { border-left: none; border-right: 1px solid #f1f1f1; } .quantity input { float: left; width: 100px; background: #FFF; border: 1px solid #f1f1f1; text-align: center; color: #02185a; margin-bottom: 0; } .share-product { } .share-product span { font-weight: 600; transition: .4s; width: 70px; height: 40px; border-radius: 2px; background: #fff; font-size: 12px; line-height: 40px; text-align: center; color: #02185a; border: 1px solid #f1f1f1; display: inline-block; } .share-product .share-social a { transition: .4s; width: 40px; height: 40px; border-radius: 2px; background: #fff; font-size: 14px; line-height: 40px; text-align: center; color: #02185a; display: block; border: 1px solid #f1f1f1; } .share-product .share-social a:hover { background: #2859a8; border: 1px solid #2859a8; color: #FFF; } .nav-tabs { padding-left: 0; margin-bottom: 0; border: 2px solid #f1f1f1; background: #FFF; } .nav-tabs li { width: 175px; display: block; float: left; font-weight: 600; line-height: 50px; height: 50px; text-align: center; position: relative; cursor: pointer; border: 2px solid #f1f1f1; border-bottom: none; color: #02185a; border-top: none; } .nav-tabs li:first-child { border-right: none; border-left: none; } .nav-tabs li h5 { line-height: 50px; font-size: 13px; text-transform: uppercase; } .nav-tabs li.active { background: #fff; position: relative; } .nav-tabs li.active::before { content: " "; display: block; width: 100%; bottom: -2px; height: 2px; background: #fff; position: absolute; } .content-revision > div, .my-account > div { display: none; } .content-revision > div:first-child, .my-account > div:first-child { display:block; } .discription-one h5{color: #000;font-size: 14px;} .content-revision, .my-account { background: #FFF; padding: 20px; border: 1px solid #eee; border-top: none; } .reviews .title-add { padding: 0; background: #FFF; } .reviews .title-add h4 { font-size: 18px; margin-bottom: 5px; text-transform: capitalize; } .reviews .comment-form { padding: 0; background: #FFF; border: none; } .products-footer h4 { color: #02185a; text-transform: capitalize; font-size: 20px; font-weight: 600; margin-bottom: 30px; line-height: 25px; margin-top: 0; } .cart-empty-item { padding: 50px; background: #FFF; border: 1px solid #eee; } .cart-empty-item p { font-size: 18px; margin-bottom: 20px; text-transform: capitalize; color: #02185a; font-weight: 600; } .my-account .title-add { padding: 0; margin-bottom: 30px; border: none; } .my-account .title-add h4 { position: relative; font-size: 18px; font-weight: 700; text-transform: capitalize; line-height: 18px; color: #02185a; } .my-account .btn-one { border: none; box-shadow: none; margin-right: 10px; } .remember-me { padding-left: 5px; font-size: 16px; font-weight: 500; color: #898989; margin-bottom: 0px; } .loss-password a { font-size: 16px; font-weight: 500; color: #898989; margin-bottom: 0px; display: block; transition: 0.4s; } .loss-password a:hover { color: #2859a8; } .lost-password-page { padding: 50px; background: #FFF; border: 1px solid #eee; } .lost-password-page .btn-one { border: none; } .portoflio-one .products-footer .owl-nav { position: absolute; top: -60px; width: 100%; z-index: 999; transform: translateY(-50%); } /*---------------------------------------------------------------- End Page Shop ----------------------------------------------------------------*/ /*---------------------------------------------------------------- End Page Shop ----------------------------------------------------------------*/ .error-page { background: #fff; border-top: 1px solid #eee; } .error-item { padding: 50px 0; } .error-item h1 { font-size: 100px; line-height: 80px; color: #02185a; margin-bottom: 20px; } .error-item h2 { font-size: 20px; color: #02185a; font-weight: 700; text-transform: uppercase; margin-bottom: 30px; line-height: 18px; } .error-item p { font-size: 16px; color: #666; margin-bottom: 40px; } /*---------------------------------------------------------------- End Page Shop ----------------------------------------------------------------*/ .contact-us-page { padding-top: 40px; } .contact-us-meta .line-contact { margin-top: 0px; margin-bottom: 80px; height: 1px; background: #e6e4e4; width: 100%; } .contact-item { margin-bottom: 30px; background: #ffffff; padding: 20px; border: 1px solid #eee; border-radius: 2px; height: 95px; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px; } .contact-item .inner-contact { position: relative; padding-left: 50px; margin-bottom: 10px; padding-bottom: 0px; } .contact-item .inner-contact span { position: absolute; left: 0; top: 0; height: 40px; width: 40px; background: #2859a8; border: 1px solid #2859a8; text-align: center; line-height: 40px; font-size: 16px; color: #ffffff; border-radius: 4px; } .contact-item p{margin-bottom: 0px;} .contact-item .inner-contact h4 { font-size: 16px; line-height: 18px; padding-top: 0px; font-weight: 600; color: #02185a; padding-bottom: 5px; text-transform: capitalize; } .contact-us-meta .contact-item p { color: #666; font-size: 14px; font-weight: 600; margin-bottom: 0px; line-height: 15px; position: relative; } .img-contact { position: relative; } .img-contact img { width: 100%; } .img-contact .overlay-contact-us { padding: 10px; height: 100%; position: absolute; width: 100%; top: 0; left: 0; } .img-contact .text-overlay { width: 100%; height: 100%; border: 2px solid rgba(255, 255, 255, .9); background-color: rgba(25, 25, 33, 0.10); position: relative; } .img-contact .text-overlay h3 { position: absolute; bottom: 30px; left: 30px; font-size: 30px; color: #FFF; font-weight: 700; } /******** header-breadcrumb ******/ .header-breadcrumb { padding: 140px 0; background-image: url(../images/header/header-03.jpg); min-height: 100%; position: relative !important; background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important; height: 100%; padding-top: 155px; padding-bottom: 60px; width: 100%; margin-bottom: 40px; } .header-breadcrumb-two { padding: 40px 0; min-height: 100%; position: relative !important; height: 100%; background: #FFF; width: 100%; border-top: 1px solid #f1f1f1; } .header-breadcrumb::after { background: rgba(50, 50, 50, 0.4); position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: ""; } .header-breadcrumb .container { position: relative; z-index: 5; text-align: left; } .header-breadcrumb .page-title-heading { color: #fff; position: relative; text-transform: capitalize; font-size: 30px; font-weight: 600; margin-bottom: 0px; line-height: 50px; } .page-title-line { color: #eee; display: block; text-transform: capitalize; font-family: 'Roboto', sans-serif; font-weight: 600; letter-spacing: 2.2px; font-size: 14px; line-height: 14px; margin: 0; margin-bottom: 5px; font-weight: 600; position: relative; } .header-breadcrumb .breadcrumb, .header-breadcrumb-two .breadcrumb { text-align: left; padding: 0; background: none; display: block; margin: 0; border: none; border-radius: 0; margin-top: 20px; } .header-breadcrumb .breadcrumb li, .header-breadcrumb-two .breadcrumb li { display: inline-block; position: relative; padding-right: 5px; padding-left: 5px; font-size: 16px; font-weight: 500; color: #eee; text-transform: capitalize; transition: 0.4s; letter-spacing: 0.20px; font-family: 'Roboto', sans-serif; } .header-breadcrumb .breadcrumb li a, .header-breadcrumb-two .breadcrumb li a{ transition: 0.4s; } .header-breadcrumb .breadcrumb li:hover a, .header-breadcrumb-two .breadcrumb li:hover a { color: #2859a8; } .header-breadcrumb-two .breadcrumb li a { color: #666; } .header-breadcrumb-two .breadcrumb li { color: #989898; } .header-breadcrumb-two .breadcrumb { margin-top: 0; } /* Main-Color : #2859a8 Dark-color : #02185a Pink-color : #ff3376 Blue-color : #2859a8 */