/********************************************************************************* Template Name: Voopo - VOIP, Telecom and Cloud Services Template Description: Voopo is a beautiful and unique Bootstrap 4 template. Version: 1.0 **********************************************************************************/ /*=============================================================================== [ INDEX ] ================================================================================= reset typography helper-class button section-title header slider service business software price shop video working faq breadcaump about testimonial blog sidebar blog-list contact cart checkout blog-details footer /* Needed Files*/ /*===== Colors =====//*/ /*===== Font Family =====//*/ /*===== Line Height =====//*/ /*===== Radius =====//*/ /*==== Font size =====//*/ /*===== Border color ======//*/ /*===== Alerts color =====//*/ /*===== Social Colors =====//*/ /* Layouts*/ /* container 450px*/ /* container 300px*/ /******************* Basic Styles ********************/ /*-------------------- Reset Styles ----------------------*/ :root { --color-orange1: #fc770a;/* Replace with your desired color */ --color-blue1:#011054; } * { box-sizing: border-box; } article, aside, details, figcaption, figure, footer, header, nav, section, summary { display: block; } .bg-blue{ background-color:var(--color-blue1) !important; } audio, canvas, video { display: inline-block; } audio:not([controls]) { display: none; height: 0; } [hidden] { display: none; } html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } html, button, input, select, textarea { font-family: "Ubuntu", sans-serif; } body { color: #141412; line-height: 1.5; margin: 0; } a { color: #ca3c08; text-decoration: none; } a:visited { color: #ac0404; } a:focus { outline: thin dotted; } a:active, a:hover { color: #ea9629; outline: 0; } a:hover { text-decoration: underline; } h1, h2, h3, h4, h5, h6 { clear: both; font-family: "Ubuntu", sans-serif; line-height: 1.3; } h1 { font-size: 48px; margin: 33px 0; } h2 { font-size: 30px; margin: 25px 0; } h3 { font-size: 22px; margin: 22px 0; } h4 { font-size: 20px; margin: 25px 0; } h5 { font-size: 18px; margin: 30px 0; } h6 { font-size: 16px; margin: 36px 0; } address { font-style: italic; margin: 0 0 24px; } abbr[title] { border-bottom: 1px dotted; } b, strong { font-weight: bold; } dfn { font-style: italic; } mark { background: #ff0; color: #000; } p { margin: 0 0 24px; } code, kbd, pre, samp { font-family: monospace, serif; font-size: 14px; -webkit-hyphens: none; -ms-hyphens: none; hyphens: none; } pre { background: #f5f5f5; color: #666; font-family: monospace; font-size: 14px; margin: 20px 0; overflow: auto; padding: 20px; white-space: pre; white-space: pre-wrap; word-wrap: break-word; } blockquote, q { -webkit-hyphens: none; -ms-hyphens: none; hyphens: none; quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ""; content: none; } blockquote { font-size: 18px; font-style: italic; font-weight: 300; margin: 24px 40px; } blockquote blockquote { margin-right: 0; } blockquote cite, blockquote small { font-size: 14px; font-weight: normal; text-transform: uppercase; } blockquote em, blockquote i { font-style: normal; font-weight: 300; } blockquote strong, blockquote b { font-weight: 400; } small { font-size: smaller; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } dl { margin: 0 20px; } dt { font-weight: bold; } dd { margin: 0 0 20px; } menu, ol, ul { margin: 16px 0; padding: 0 0 0 40px; } ul { list-style-type: square; } nav ul, nav ol { list-style: none; list-style-image: none; } li > ul, li > ol { margin: 0; } img { -ms-interpolation-mode: bicubic; border: 0; vertical-align: middle; } svg:not(:root) { overflow: hidden; } figure { margin: 0; } form { margin: 0; } fieldset { border: 1px solid #c0c0c0; margin: 0 2px; min-width: inherit; padding: 0.35em 0.625em 0.75em; } legend { border: 0; padding: 0; white-space: normal; } button, input, select, textarea { font-size: 100%; margin: 0; max-width: 100%; vertical-align: baseline; } button, input { line-height: normal; } button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; } button[disabled], input[disabled] { cursor: default; } input[type="checkbox"], input[type="radio"] { padding: 0; } input[type="search"] { -webkit-appearance: textfield; padding-right: 2px; /* Don't cut off the webkit search cancel button */ width: 270px; } input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } textarea { overflow: auto; vertical-align: top; } table { border-bottom: 1px solid #ededed; border-collapse: collapse; border-spacing: 0; font-size: 14px; line-height: 2; margin: 0 0 20px; width: 100%; } caption, th, td { font-weight: normal; text-align: left; } caption { font-size: 16px; margin: 20px 0; } th { font-weight: bold; text-transform: uppercase; } td { border-top: 1px solid #ededed; padding: 6px 10px 6px 0; } del { color: #333; } ins { background: #fff9c0; text-decoration: none; } hr { background-size: 4px 4px; border: 0; height: 1px; margin: 0 0 24px; } /* Placeholder text color -- selectors need to be separate to work. */ ::-webkit-input-placeholder { color: #7d7b6d; } :-moz-placeholder { color: #7d7b6d; } ::-moz-placeholder { color: #7d7b6d; } :-ms-input-placeholder { color: #7d7b6d; } /*-------------------- Typography -------------------*/ html { overflow-x: hidden; } body { overflow-x: hidden; font-size: 14px; line-height: 24px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-family: "Ubuntu", sans-serif; color: #333333; font-weight: 400; } p { font-size: 14px; line-height: 24px; color: #035f91; } ::-webkit-input-placeholder { color: #333333; } :-moz-placeholder { color: #333333; } ::-moz-placeholder { color: #333333; } :-ms-input-placeholder { color: #333333; } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, address, p, pre, blockquote, dl, dd, menu, ol, ul, table, caption, hr { margin: 0; margin-bottom: 15px; } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: "Ubuntu", sans-serif; line-height: 1.3; } h1, .h1 { font-size: 55px; font-weight: 700; } h2, .h2 { font-size: 24px; font-weight: 700; } h3, .h3 { font-size: 22px; } h4, .h4 { font-size: 20px; } h5, .h5 { font-size: 18px; } h6, .h6 { font-size: 16px; } @media only screen and (min-width: 768px) and (max-width: 991px) { h1, .h1 { font-size: 36px; } h2, .h2 { font-size: 26px; } h3, .h3 { font-size: 20px; } } @media only screen and (max-width: 767px) { h1, .h1 { font-size: 32px; } h2, .h2 { font-size: 24px; } h3, .h3 { font-size: 18px; } } h1, .h1, h2, .h2 { font-weight: 700; } h3, .h3, h4, .h4 { font-weight: 600; } h5, .h5, h6, .h6 { font-weight: 500; } a:hover, a:focus, a:active { text-decoration: none; outline: none; } /**-------------------- Helper Class ------------------*/ .hidden { display: none; } .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } .invisible { visibility: hidden; } .clearfix:before, .clearfix:after { content: " "; /* 1 */ display: table; /* 2 */ } .clearfix:after { clear: both; } .poss--relative { position: relative; } .poss--absolute { position: absolute; } a { transition: 0.5s; } a#scrollUp { background: #bd4e45; color: #fff; bottom: 40px; right: 40px; border-radius: 100px; height: 45px; width: 45px; font-size: 20px; text-align: center; padding: 9px 0; box-shadow: 0 0 15px 0px rgba(50, 50, 50, 0.2); transition: 0.3s; line-height: 25px; } a#scrollUp:hover { background: #fff; color: #bd4e45; } input, textarea { outline: none; transition: 0.3s; } @media only screen and (max-width: 575px) { .container { width: 450px; } } @media only screen and (max-width: 479px) { .container { width: 300px; } } /* Font specialized */ .body--font { font-family: "Ubuntu", sans-serif; } .heading--font { font-family: "Ubuntu", sans-serif; } /* Height and width */ .fullscreen { min-height: 100vh; width: 100%; } .w--100 { width: 100%; } .w--75 { width: 75%; } .w--50 { width: 50%; } .w--33 { width: 33.33%; } .w--25 { width: 25%; } .w--10 { width: 10%; } .h--100 { height: 100%; } .h--75 { height: 75%; } .h--50 { height: 50%; } .h--25 { height: 25%; } .h--33 { height: 33.33%; } .h--10 { height: 10%; } /* Define Colors */ .theme--color { color: #bd4e45; } .color--light { color: #999999; } .color--dark { color: #333333; } .color--black { color: #000000; } .color--white { color: #ffffff; } /* Background Color */ .bg--theme { background: #bd4e45; } .bg--light { background: #999999; } .bg--dark { background: #333333; } .bg--black { background: #000000; } .bg--white { background: #ffffff; } .bg--cart-1 { background: #f8fafb; } .bg--cart-2 { background: #00082e; } .bg--cart-3 { background: #000624; } .bg--cart-4 { background: #f8fafb; } .bg--cart-5 { background: #f5f8fa; } .bg--cart-6 { background: #f8f1f4; } .bg--cart-7 { background: #f5f8fa; } .bg--cart-8 { background: #010f54; } .bg--cart-9 { background: #f1f5f8; } .bg--cart-10 { background: #f8fafb; } .bg--cart-11 { background: #f8f9fa; } /* Background Image */ .bg-image--1 { background-image: url(images/bg/1.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--2 { background-image: url(images/bg/2.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--3 { background-image: url(images/bg/3.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--4 { background-image: url(images/bg/4.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--5 { background-image: url(images/bg/5.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--6 { background-image: url(images/bg/6.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--7 { background-image: url(images/bg/7.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--8 { background-image: url(images/bg/8.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--9 { background-image: url(images/bg/9.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--10 { background-image: url(images/bg/10.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--11 { background-image: url(images/bg/11.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--12 { background-image: url(images/bg/12.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--13 { background-image: url(images/bg/13.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--14 { background-image: url(images/bg/14.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--15 { background-image: url(images/bg/15.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--16 { background-image: url(images/bg/16.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--17 { background-image: url(images/bg/17.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--18 { background-image: url(images/bg/18.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--19 { background-image: url(images/bg/19.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .bg-image--20 { background-image: url(images/bg/20.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } .mt--20 { margin-top: 20px; } .mt--30 { margin-top: 30px; } .mt--40 { margin-top: 40px; } .mt--50 { margin-top: 50px; } .mt--60 { margin-top: 60px; } .mt--70 { margin-top: 70px; } .mt--80 { margin-top: 80px; } .mt--90 { margin-top: 90px; } .mt--100 { margin-top: 100px; } .mt--110 { margin-top: 110px; } .mt--120 { margin-top: 120px; } .mt--130 { margin-top: 130px; } .mt--140 { margin-top: 140px; } .mt--150 { margin-top: 150px; } .pt--20 { padding-top: 20px; } .pt--30 { padding-top: 30px; } .pt--40 { padding-top: 40px; } .pt--50 { padding-top: 50px; } .pt--60 { padding-top: 60px; } .pt--70 { padding-top: 70px; } .pt--80 { padding-top: 80px; } .pt--90 { padding-top: 90px; } .pt--100 { padding-top: 100px; } .pt--110 { padding-top: 110px; } .pt--120 { padding-top: 120px; } .pt--130 { padding-top: 130px; } .pt--140 { padding-top: 140px; } .pt--150 { padding-top: 150px; } .pb--20 { padding-bottom: 20px; } .pb--30 { padding-bottom: 30px; } .pb--40 { padding-bottom: 40px; } .pb--50 { padding-bottom: 50px; } .pb--60 { padding-bottom: 60px; } .pb--70 { padding-bottom: 70px; } .pb--80 { padding-bottom: 80px; } .pb--90 { padding-bottom: 90px; } .pb--100 { padding-bottom: 100px; } .pb--110 { padding-bottom: 110px; } .pb--120 { padding-bottom: 120px; } .pb--130 { padding-bottom: 130px; } .pb--140 { padding-bottom: 140px; } .pb--150 { padding-bottom: 150px; } .pb--160 { padding-bottom: 160px; } .pb--170 { padding-bottom: 170px; } .pb--180 { padding-bottom: 180px; } .pb--190 { padding-bottom: 190px; } .pb--200 { padding-bottom: 200px; } .pb--210 { padding-bottom: 210px; } .pb--220 { padding-bottom: 220px; } .pb--230 { padding-bottom: 230px; } .pb--240 { padding-bottom: 240px; } .pb--250 { padding-bottom: 250px; } .ptb--20 { padding: 20px 0; } .ptb--30 { padding: 30px 0; } .ptb--40 { padding: 40px 0; } .ptb--50 { padding: 50px 0; } .ptb--60 { padding: 60px 0; } .ptb--70 { padding: 70px 0; } .ptb--80 { padding: 80px 0; } .ptb--90 { padding: 90px 0; } .ptb--100 { padding: 100px 0; } .ptb--110 { padding: 110px 0; } .ptb--120 { padding: 120px 0; } .ptb--130 { padding: 130px 0; } .ptb--140 { padding: 140px 0; } .ptb--150 { padding: 150px 0; } .mb--60 { margin-bottom: 60px; } /* Text specialized */ .text--italic { font-style: italic; } .text--normal { font-style: normal; } .text--underline { font-style: underline; } /* Section padding */ .section-padding--xlg { padding: 150px 0; } .section-padding--lg { padding: 100px 0; } .section-padding--md { padding: 90px 0; } .section-padding--sm { padding: 50px 0; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .lg__mt--40 { margin-top: 40px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .section-padding--xlg { padding: 120px 0; } .section-padding--lg { padding: 100px 0; } .section-padding--md { padding: 85px 0; } .section-padding--sm { padding: 70px 0; } .md__mt--40 { margin-top: 40px; } } @media only screen and (max-width: 767px) { .section-padding--xlg { padding: 90px 0; } .section-padding--lg { padding: 70px 0; } .section-padding--md { padding: 60px 0; } .section-padding--sm { padding: 50px 0; } .section-padding--xs { padding: 50px 0; } .sm-mt-60 { margin-top: 60px; } .sm__mt--40 { margin-top: 40px; } } @media only screen and (max-width: 575px) { .xs-mt-60 { margin-top: 60px; } .xs__mt--40 { margin-top: 40px; } } /* Overlay styles */ [data-overlay], [data-black-overlay] { position: relative; } [data-overlay] > div, [data-overlay] > *, [data-black-overlay] > div, [data-black-overlay] > * { position: relative; z-index: 2; } [data-overlay]:before, [data-black-overlay]:before { content: ""; position: absolute; left: 0; top: 0; height: 100%; width: 100%; z-index: 1; } [data-overlay]:before { background-color: #bd4e45; } [data-black-overlay]:before { background-color: #000000; } [data-overlay="1"]:before, [data-black-overlay="1"]:before { opacity: 0.1; } [data-overlay="2"]:before, [data-black-overlay="2"]:before { opacity: 0.2; } [data-overlay="3"]:before, [data-black-overlay="3"]:before { opacity: 0.3; } [data-overlay="4"]:before, [data-black-overlay="4"]:before { opacity: 0.4; } [data-overlay="5"]:before, [data-black-overlay="5"]:before { opacity: 0.5; } [data-overlay="6"]:before, [data-black-overlay="6"]:before { opacity: 0.6; } [data-overlay="7"]:before, [data-black-overlay="7"]:before { opacity: 0.7; } [data-overlay="8"]:before, [data-black-overlay="8"]:before { opacity: 0.8; } [data-overlay="9"]:before, [data-black-overlay="9"]:before { opacity: 0.9; } [data-overlay="10"]:before, [data-black-overlay="10"]:before { opacity: 1; } @media only screen and (max-width: 767px) { .ptb--110 { padding: 60px 0; } .ptb--120 { padding: 60px 0; } .pt--120 { padding-top: 60px; } .pt--110 { padding-top: 60px; } .pb--120 { padding-bottom: 60px; } .pb--110 { padding-bottom: 60px; } } /******************* Elements Styles ********************/ /*------------------ Button Styles ---------------------*/ a.voopo__btn, button.voopo__btn { background: rgba(0, 0, 0, 0) linear-gradient(-90deg, #fccec8, #e05941) repeat scroll 0 0; border-radius: 24px; color: #ffffff; display: inline-block; font-size: 18px; font-weight: 500; height: 47px; line-height: 47px; padding: 0 40px; position: relative; transition: all 0.5s ease 0s; z-index: 1; } a.voopo__btn::before, button.voopo__btn::before { background: rgba(0, 0, 0, 0) linear-gradient(90deg, #fccec8, #e05941) repeat scroll 0 0; border-radius: 24px; content: ""; height: 100%; left: 0; opacity: 0; position: absolute; top: 0; transition: all 0.5s ease 0s; width: 100%; z-index: -1; } a.voopo__btn:hover::before, button.voopo__btn:hover::before { opacity: 1; } a.voopo__btn.btn--light, button.voopo__btn.btn--light { background: linear-gradient(-90deg, #eef3f6, #eef3f6); color: #e05941; position: relative; transition: all 0.5s ease 0s; z-index: 1; } a.voopo__btn.btn--light::before, button.voopo__btn.btn--light::before { background: linear-gradient(-90deg, #fccec8, #e05941); border-radius: 24px; content: ""; height: 100%; left: 0; opacity: 0; position: absolute; top: 0; transition: all 0.5s ease 0s; width: 100%; z-index: -1; } a.voopo__btn.btn--light:hover::before, button.voopo__btn.btn--light:hover::before { opacity: 1; color: #fff; } a.voopo__btn.btn--light:hover, button.voopo__btn.btn--light:hover { color: #fff; } a.voopo__btn.white__btn, button.voopo__btn.white__btn { background: #eef3f6 none repeat scroll 0 0; color: #e05941; } a.voopo__btn.white__btn:hover, button.voopo__btn.white__btn:hover { background: #e05941; color: #fff; } button.voopo__btn { outline: none; } .yu2fvl { z-index: 9999; top: 0; } .yu2fvl-iframe { display: block; height: 100%; width: 100%; border: 0; } .yu2fvl-overlay { z-index: 9998; background: #000; opacity: 0.8; } .yu2fvl-close { position: absolute; top: 1px; left: 100%; display: inline-block; height: 35px; width: 35px; line-height: 35px; text-align: center; background: #f10 !important; background-color: #f10 !important; color: #ffffff; border: 0; background: none; cursor: pointer; } @media only screen and (min-width: 768px) and (max-width: 991px) { .yu2fvl-close { left: auto; right: 0; top: auto; bottom: 100%; } } @media only screen and (max-width: 767px) { .yu2fvl-close { left: auto; right: 0; top: auto; bottom: 100%; } .video h2 { color: #ffffff; font-size: 32px; } .video h4 { font-size: 22px; line-height: 32px; } } /*------------------------------ Section Title Styles --------------------------------*/ .section__title span { color: #010f54; font-size: 30px; font-weight: 300; line-height: 40px; } .section__title h2 { color: #010f54; font-size: 36px; margin-bottom: 0; margin-top: 4px; } .section__title--2 span { color: #010f54; font-size: 18px; } .section__title--2 h2 { color: #010f54; font-size: 36px; margin-bottom: 35px; margin-top: 4px; padding-bottom: 40px; position: relative; } .section__title--2 h2::before { background: linear-gradient(to left, #fccec8, #e05941); bottom: 0; content: ""; height: 3px; left: 0; position: absolute; width: 150px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .section__title--2 h2 { margin-bottom: 22px; padding-bottom: 21px; } } @media only screen and (max-width: 767px) { .section__title--2 h2 { font-size: 27px; margin-bottom: 24px; padding-bottom: 21px; } } @media only screen and (max-width: 575px) { .section__title--2 h2 { font-size: 22px; margin-bottom: 24px; } } @media only screen and (max-width: 479px) { .section__title h2 { font-size: 27px; margin-top: 0; } .section__title span { font-size: 24px; } } /******************* Blocks Styles ********************/ /*----------------------- Header Styles -------------------------*/ .header-area { left: 0; /* position: absolute; */ right: 0; top: 50px; width: auto; z-index: 99; transition: 0.3s; } .mainmenu { display: flex; justify-content: left; list-style: outside none none; margin: 0; padding: 0; } .mainmenu li { margin: 0 22px; } .mainmenu li a { /* color: #fefefe; */ display: block; font-size: 18px; font-weight: 500; line-height: 59px; transition: all 0.3s ease 0s; } .mainmenu li a:hover { color: #e05941; } .header__btn { text-align: right; } .header--2 .mainmenu li a { color: #010f54; font-size: 18px; font-weight: 500; line-height: 59px; transition: 0.5s; } .header--2 .mainmenu li a:hover { color: #e15f48 !important; } @media only screen and (min-width: 992px) { .mainmenu > li.drop { position: relative; } .mainmenu > li.drop > ul.dropdown__menu { background: #fff none repeat scroll 0 0; border-top: 3px solid #bd4e45; box-shadow: 0 10px 15px rgba(0, 0, 0, 0.3); left: 0; margin: 0; opacity: 0; padding: 20px 30px; position: absolute; top: 120%; transition: all 0.5s ease 0s; visibility: hidden; width: 230px; z-index: 99; } .mainmenu > li.drop > ul.dropdown__menu li { margin: 0; } .mainmenu > li.drop > ul.dropdown__menu li a { color: #444; display: block; font-size: 15px; font-weight: 400; line-height: 21px; padding: 4px 0; text-transform: capitalize; transition: all 0.5s ease 0s; } .mainmenu > li.drop > ul.dropdown__menu li a:hover { color: #e05941; font-weight: 600; padding-left: 5px; } .mainmenu li.drop:hover ul.dropdown__menu { opacity: 1; top: 100%; visibility: visible; } } .mobile-menu .header__btn { color: #fff; font-size: 27px; position: absolute; right: 57px; top: 50%; transform: translateY(-50%); z-index: 9991; } .mobile-menu .logo { align-items: center; display: flex; height: 100px; left: 0; position: absolute; top: 50%; transform: translateY(-50%); z-index: 9991; } .mean-container .mean-nav ul { display: block; } .mean-container .mean-nav ul li { margin: 0; } .mean-container .mean-nav ul li a { line-height: inherit; } .mean-container .mean-nav { max-height: 255px; overflow-y: auto; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .mainmenu li { margin: 0 14px; } } @media only screen and (max-width: 575px) { .mobile-menu .logo a img { width: 156px; } .header__btn a.voopo__btn { padding: 0 29px; } .mobile-menu .header__btn { right: 47px; } .header-area { top: 30px; } } @media only screen and (max-width: 479px) { .mobile-menu .logo a img { width: 109px; } .mobile-menu .header__btn { right: 45px; } .header__btn a.voopo__btn { font-size: 14px; height: 38px; line-height: 36px; padding: 0 20px; } } /*----------------- Slider Styles -----------------*/ .gra__bg--1 { background: linear-gradient(to top, #1344a4, #011054); } .slider--one .slider_fixed_height { /* height: 900px; */ } .slider--one .slide { padding: 120px 0; /* padding-top: 100px; */ } .slider--2 .slider_fixed_height { height: 900px; } .slider--2 .slide { padding-bottom: 10px; } .slide .content h1 { color: #ffffff; line-height: 65px; margin-bottom: 25px; background: linear-gradient(110deg, #fff 33%, rgba(0, 0, 0, 0) 33%), linear-gradient(110deg, #f2a192 34%, #f06850 34%); background-size: 400%; -webkit-text-fill-color: transparent; -webkit-background-clip: text; animation: Gradient 5s ease infinite; -webkit-animation: Gradient 15s ease infinite; -moz-animation: Gradient 5s ease infinite; } .slide .content p { color: #eef3f6; font-size: 16px; line-height: 26px; margin-bottom: 40px; } .slide .slide__fornt__img { text-align: right; } @-webkit-keyframes Gradient { 0% { background-position: 30% 50%; } 50% { background-position: 25% 50%; } 100% { background-position: 30% 50%; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .slide .slide__fornt__img img { width: 100%; } .slider--one .slider_fixed_height, .slider--2 .slider_fixed_height { height: 700px; } .slider--2 .slide { padding-bottom: 0; padding-top: 41px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .slide .content h1 { line-height: 49px; } .slide .slide__fornt__img img { width: 100%; } .slider--2 .slider_fixed_height { height: 700px; } .slider--2 .slide { padding-bottom: 0; padding-top: 100px; } .slider--one .slider_fixed_height { height: 700px; } } @media only screen and (max-width: 767px) { .slide .content h1 { line-height: 41px; margin-bottom: 17px; } .slide .slide__fornt__img img { width: 100%; } .slider--2 .slider_fixed_height, .slider--one .slider_fixed_height { height: auto; } .slider--2 .slide, .slider--one .slider_fixed_height { padding-bottom: 70px; padding-top: 157px; } .slide .slide__fornt__img { margin-top: 26px; text-align: center; } } /*----------------- Service Styles -----------------*/ .service { background: #fff none repeat scroll 0 0; border-radius: 10px; box-shadow: 0 0 15px rgba(19, 68, 165, 0.1); padding: 46px 38px; transition: 0.5s; } .service:hover { transform: translateY(-10px); } .service img { height: 38px; } .service h2 { margin-top: 22px; } .service h2 a { color: #1344a5; font-size: 24px; font-weight: 500; transition: 0.3s; } .service h2 a:hover { color: #e05941; } .service p { margin: 0; } .service--2 .service img { height: 39px; } .voopo__service.service__position { position: relative; top: -120px; } .service__title h2 { color: #010f54; display: inline-block; font-size: 36px; line-height: 47px; margin-bottom: 5px; position: relative; z-index: 1; } .service__title h2::before { background: linear-gradient(-90deg, #efaca0, #fde5e2); bottom: 4px; content: ""; height: 12px; left: -3px; position: absolute; width: 100%; z-index: -1; } .service__title h3 { color: #010f54; display: inline-block; font-size: 36px; line-height: 39px; margin-bottom: 42px; position: relative; z-index: 2; } .service__title h3::before { background: linear-gradient(-90deg, #efaca0, #fde5e2); bottom: 0; content: ""; height: 12px; left: 0; position: absolute; width: 100%; z-index: -1; } .service__title p { color: #035e91; font-size: 16px; font-weight: 700; line-height: 30px; margin-bottom: 32px; padding-right: 23%; } .area__text::before { color: #fafafc; content: "voopo"; font-size: 310px; font-weight: 700; letter-spacing: 16px; position: absolute; right: 0; top: 50%; transform: translateY(-50%); } .best__service { display: flex; flex-wrap: wrap; } .best__service .icon { margin-right: 7px; background: rgba(0, 0, 0, 0) url("images/icons/bg.png") no-repeat scroll left top; color: linear-gradient(-90deg, #fccec8, #e05941); font-size: 40px; height: 74%; line-height: 123px; text-align: center; flex-basis: 31%; } .best__service .icon i { background: -webkit-linear-gradient(#fbcbc4, #e15c45); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .best__service .content { flex-basis: 67%; } .best__service .content h2 { font-size: 24px; line-height: 47px; margin-bottom: 6px; margin-top: 25px; } .best__service .content h2 a { color: #1344a5; transition: 0.4s; } .best__service .content h2 a:hover { color: #e05941; } .best__service .content p { line-height: 25px; margin: 0; } .best__service + .best__service { margin-top: 46px; } .service--3 .thumb { margin-left: -15px; margin-right: -15px; } .service--3 .thumb img { width: 100%; } .service--3 .service__inner { margin-left: -15px; margin-right: -15px; padding-bottom: 60px; padding-left: 370px; padding-top: 80px; } .service--3 .service__inner h2 { color: #010f54; font-size: 36px; margin-bottom: 35px; padding-bottom: 40px; position: relative; } .service--3 .service__inner h2::before { background: #e15b43 none repeat scroll 0 0; bottom: 0; content: ""; height: 3px; left: 0; position: absolute; width: 150px; } .service--3 .service__inner p { font-size: 14px; line-height: 24px; margin-bottom: 38px; padding-right: 30%; } .video__cion a { color: #035e91; font-size: 16px; font-weight: 700; } .video__cion a span { background: #efaca0 none repeat scroll 0 0; border-radius: 100%; display: inline-block; height: 100px; line-height: 120px; margin-right: 20px; text-align: center; width: 100px; } .video__cion a span i { background: #e05941 none repeat scroll 0 0; border-radius: 100%; color: #ffffff; display: inline-block; font-size: 40px; height: 65px; line-height: 65px; text-align: center; width: 65px; padding-left: 3px; } @media only screen and (min-width: 1600px) and (max-width: 1919px) { .bg-image--7 { background: #fff none repeat scroll 0 0; } .service--3 .service__inner { padding-left: 200px; } .service--3 .service__inner h2 { margin-bottom: 27px; padding-bottom: 24px; } } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .bg-image--7 { background: #fff none repeat scroll 0 0; } .service--3 .service__inner { padding-bottom: 0px; padding-left: 15px; padding-top: 30px; } .service--3 .service__inner h2 { margin-bottom: 21px; padding-bottom: 20px; } .service--3 .service__inner p { margin-bottom: 12px; padding-right: 16%; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .best__service + .best__service { margin-top: 30px; } .voopo__service.service__position { padding: 120px 0; top: 0; } .bg-image--7 { background: #fff none repeat scroll 0 0; } .service--3 .service__inner { padding-bottom: 0; padding-left: 20px; padding-top: 28px; } .service--3 .service__inner h2 { margin-bottom: 21px; padding-bottom: 22px; } .service--3 .service__inner p { font-size: 14px; line-height: 24px; margin-bottom: 17px; } .video__cion a span { height: 80px; line-height: 98px; width: 80px; } .video__cion a span i { height: 50px; line-height: 50px; width: 50px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .best__service .content h2 { font-size: 21px; line-height: 41px; margin-bottom: 6px; margin-top: 25px; } .service__title h3 { margin-bottom: 28px; } .service__title p { margin-bottom: 25px; padding-right: 8%; } .best__service + .best__service { margin-top: 30px; } .area__text::before { font-size: 223px; } .voopo__service.service__position { padding: 120px 0; top: 0; } .bg-image--7 { background: #fff none repeat scroll 0 0; } .service--3 .service__inner { padding-bottom: 40px; padding-left: 40px; padding-top: 40px; } } @media only screen and (max-width: 767px) { .best__service .icon { flex-basis: 24%; } .best__service .content { flex-basis: 73%; } .best__service + .best__service { margin-top: 30px; } .voopo__service.service__position { padding: 120px 0; top: 0; } .bg-image--7 { background: #fff none repeat scroll 0 0; } .service--3 .service__inner { padding-bottom: 40px; padding-left: 40px; padding-top: 40px; } .area__text::before { font-size: 171px; } .voopo__service.service__position { padding: 60px 0; } .best__service .content h2 { font-size: 20px; } } @media only screen and (max-width: 575px) { .service__title h2 { display: block; } .service__title h2::before { display: none; } .best__service .icon { flex-basis: 30%; } .best__service .content { flex-basis: 68%; } .video__inner .video__content { padding: 40px 19px 30px; } .video__inner .video__content h2 { font-size: 24px; margin-bottom: 19px; padding-bottom: 22px; } } @media only screen and (max-width: 479px) { .best__service .icon { flex-basis: 41%; } .best__service .content { flex-basis: 100%; } .best__service .content h2 { margin-top: 0; } } /*------------------ Button Styles ---------------------*/ .voopo__business .content h2 { color: #010f54; font-size: 36px; font-weight: 700; line-height: 40px; margin-bottom: 40px; padding-bottom: 44px; position: relative; } .voopo__business .content h2::before { background: linear-gradient(-90deg, #fccec8, #e05941); bottom: 0; content: ""; height: 3px; left: 0; position: absolute; width: 150px; transition: 0.5s; } .voopo__business .content h2:hover::before { width: 180px; } .voopo__business .content p { color: #035e91; font-size: 16px; line-height: 27px; margin-bottom: 25px; } .voopo__business .content p.first__desc { color: #010f54; font-size: 16px; font-weight: 700; line-height: 27px; margin-bottom: 26px; } .voopo__business .content p:last-child { margin: 0; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .voopo__business .thumb img { width: 100%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .voopo__business .thumb img { width: 100%; } .voopo__business .content h2 { font-size: 26px; line-height: 36px; margin-bottom: 24px; padding-bottom: 23px; } .voopo__business .content p { font-size: 14px; line-height: 25px; margin-bottom: 13px; } } @media only screen and (max-width: 767px) { .voopo__business .thumb img { width: 100%; } .voopo__business .content h2 { color: #010f54; font-size: 30px; font-weight: 700; line-height: 41px; margin-bottom: 16px; padding-bottom: 15px; position: relative; } .voopo__business .content h2 { font-size: 30px; line-height: 41px; margin-bottom: 16px; padding-bottom: 15px; } } @media only screen and (max-width: 575px) { .voopo__business .content h2 { font-size: 24px; line-height: 36px; } .area__text::before { display: none; } .voopo__business .content h2 { font-size: 20px; line-height: 31px; } } @media only screen and (max-width: 479px) { .voopo__business .content p { font-size: 14px; line-height: 24px; } } /*------------------ Software Styles ---------------------*/ .voopo__software { padding-bottom: 325px; } .voopo__software .sft-bg-color { background: linear-gradient(to bottom, #1344a4, #011156); padding-bottom: 92px; padding-top: 172px; } .voopo__software .shape--1 { bottom: 100px; position: absolute; right: 0; } .voopo__software .content h2 { color: #eef3f6; font-size: 36px; line-height: 47px; } .voopo__software .content p { color: #eef3f6; font-size: 16px; line-height: 26px; margin-bottom: 24px; } .voopo__software .content p + p { margin: 0; } .download__btn { display: flex; list-style: outside none none; margin: 80px -20px 0; padding: 0; } .download__btn li { margin: 0 20px; } .download__btn li a { background: #010f54 none repeat scroll 0 0; border-radius: 26px; color: #eef3f6; display: inline-block; font-size: 16px; height: 50px; line-height: 50px; padding: 0 40px; text-align: center; transition: all 0.5s ease 0s; } .download__btn li a img { padding-left: 20px; } .download__btn li a:hover { background: #e05941 none repeat scroll 0 0; } .voopo__software.software__style--2 { padding-bottom: 0; padding-top: 110px; } .voopo__software.software__style--2 .content p { margin-bottom: 0; padding: 0 27%; } .voopo__software.software__style--2 .download__btn { justify-content: center; margin: 40px -20px 0; } .voopo__software.software__style--2 .download__btn li a { background: #ffffff none repeat scroll 0 0; color: #0d348c; transition: 0.5s; } .voopo__software.software__style--2 .download__btn li a:hover { background: #bd4e45; color: #010f54; } .voopo__software.software__style--2 .thumb { margin-bottom: -155px; margin-top: 38px; position: relative; } .voopo__software .poly__1 { position: absolute; top: 50px; left: 50px; } .voopo__software .poly__2 { position: absolute; left: 236px; top: 215px; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .voopo__software .shape--1 { bottom: 50%; transform: translateY(50%); width: 50%; } .voopo__software .shape--1 img { width: 100%; } .voopo__software { padding-bottom: 120px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .voopo__software .shape--1 { bottom: 50%; transform: translateY(50%); width: 50%; } .voopo__software .shape--1 img { width: 100%; } .voopo__software { padding-bottom: 120px; } .download__btn { margin: 38px -20px 0; } .voopo__software .sft-bg-color { padding-top: 120px; } .voopo__software.software__style--2 .content p { padding: 0 20%; } .voopo__software.software__style--2 .thumb img { width: 100%; } .voopo__software.software__style--2 .thumb { margin-bottom: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .voopo__software .shape--1 { bottom: 50%; transform: translateY(50%); width: 45%; } .voopo__software .shape--1 img { width: 100%; } .voopo__software { padding-bottom: 120px; } .voopo__software .sft-bg-color { padding-bottom: 57px; padding-top: 113px; } .download__btn { margin: 22px -20px 0; } .voopo__software.software__style--2 .content p { padding: 0 11%; } .voopo__software.software__style--2 .thumb { margin-bottom: 0; } .voopo__software.software__style--2 .thumb img { width: 100%; } .voopo__software.software__style--2 .thumb { margin-bottom: 0; } } @media only screen and (max-width: 767px) { .voopo__software .shape--1 { bottom: 50%; transform: translateY(50%); width: 50%; } .voopo__software .shape--1 img { width: 100%; } .voopo__software { padding-bottom: 120px; } .voopo__software .shape--1 { bottom: 0; padding-top: 55px; position: inherit; transform: translateY(0px); width: 100%; } .voopo__software .sft-bg-color { padding-top: 120px; } .voopo__software.software__style--2 .content p { padding: 0; } .voopo__software.software__style--2 .download__btn { flex-wrap: wrap; } .voopo__software.software__style--2 .download__btn li + li { margin-top: 20px; } .voopo__software.software__style--2 .download__btn li { flex-basis: 100%; } .voopo__software.software__style--2 .thumb img { width: 100%; } .voopo__software.software__style--2 .thumb { margin-bottom: 0; } .voopo__software.software__style--2 { padding-top: 60px; } .voopo__software { padding-bottom: 60px; } } @media only screen and (max-width: 575px) { .voopo__software .poly__1 { left: 11px; top: 24px; } .voopo__software .poly__2 { left: 230px; top: 41px; } } @media only screen and (max-width: 479px) { .voopo__software .content h2 { font-size: 28px; line-height: 39px; } .voopo__software .content p { font-size: 14px; line-height: 24px; margin-bottom: 12px; } .download__btn { flex-wrap: wrap; justify-content: center; margin: 30px -20px 0; } .download__btn li + li { margin-top: 20px; } .voopo__software .sft-bg-color { padding-top: 113px; } } /*----------------------- Price Styles -------------------------*/ .pricing { background: #fff none repeat scroll 0 0; box-shadow: 0 0 10px rgba(1, 15, 10, 0.1); margin-top: 40px; padding: 58px 0 35px; text-align: center; } .pricing.active .content span::before { background: linear-gradient(-90deg, #feffff, #e8f6ff); } .pricing.active .content ul li::before { background-image: linear-gradient(to right, rgba(248, 217, 214, 0), rgba(248, 217, 214, 0.8) 40%, rgba(248, 217, 214, 0.8) 60%, rgba(248, 217, 214, 0)); } .pricing .content ul { list-style: outside none none; margin: 0 0 17px; padding: 0; } .pricing .content ul li { color: #010f54; font-size: 16px; font-weight: 500; padding: 13px 0; position: relative; } .pricing .content ul li::before { background-image: linear-gradient(to right, rgba(233, 246, 255, 0), rgba(233, 246, 255, 0.8) 40%, rgba(233, 246, 255, 0.8) 60%, rgba(233, 246, 255, 0)); background-position: center center; background-repeat: no-repeat; background-size: 84% auto; content: ""; height: 0.125rem; left: 0; position: absolute; top: 0; width: 100%; } .pricing .content ul li:first-child::before { display: none; } .pricing .content span { color: #010f54; font-size: 18px; font-weight: 700; position: relative; z-index: 1; } .pricing .content span::before { background: linear-gradient(-90deg, #fbfdff, #e9f6ff); border-radius: 100%; content: ""; height: 70px; left: 50%; position: absolute; top: 50%; transform: translateX(-50%) translateY(-50%); width: 70px; z-index: -1; } .pricing .content .price { margin-bottom: 42px; margin-top: 44px; } .pricing .content .price p { color: #010f54; font-size: 40px; font-weight: 500; line-height: 47px; } .pricing .content .price p sup { left: 8px; top: -7px; } .pricing .content .price p sub { font-size: 16px; left: -8px; } /*------------------ Shop Styles ---------------------*/ .product { box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); margin-top: 40px; } .product .thumb a img { width: 100%; } .product .content { padding: 5px 20px 30px; } .product .content h2 { margin-bottom: 2px; } .product .content h2 a { color: #010f54; font-size: 20px; line-height: 47px; transition: 0.5s; } .product .content h2 a:hover { color: #e05941; } .product .content p { margin-bottom: 18px; } .product .content span.price { color: #010f54; font-size: 24px; font-weight: 500; } .product .hover__action { opacity: 0; position: absolute; text-align: center; top: 50%; transform: translateY(-50%); transition: all 0.5s ease 0s; width: 100%; } .product:hover .hover__action { opacity: 1; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .product .content h2 a { font-size: 17px; line-height: 41px; } .product .content { padding: 5px 17px 30px; } } /*----------------- Video Styles -----------------*/ .voopo__video { padding-bottom: 200px; } .video__inner { position: relative; z-index: 2; } .video__inner::before { background: -webkit-gradient(linear, right top, left top, from(#1343a3), to(#011056)); background: linear-gradient(to left, #1343a3, #011056); content: ""; height: 100%; left: 0; opacity: 0.85; position: absolute; top: 0; width: 100%; z-index: -1; } .video__inner .video__content { background: #ffffff none repeat scroll 0 0; border-radius: 10px; margin-left: 80px; overflow: hidden; padding: 40px 34px 80px; position: relative; top: 80px; } .video__inner .video__content::before { background-image: url("images/icons/v1.png"); background-position: right bottom; background-repeat: no-repeat; background-size: cover; bottom: -109px; content: ""; height: 199px; position: absolute; right: -94px; transform: rotate(205deg); width: 234px; } .video__inner .video__content p { margin: 0; font-size: 16px; line-height: 27px; } .video__inner .video__content p + p { margin-top: 27px; } .video__inner .video__content h2 { color: #010f54; font-size: 36px; margin-bottom: 33px; padding-bottom: 38px; position: relative; text-align: center; } .video__inner .video__content h2::before { background: linear-gradient(to right, #e05a42, #fbcdc7); bottom: 0; content: ""; height: 3px; left: 50%; position: absolute; transform: translateX(-50%); width: 150px; } .video__trigger { position: absolute; text-align: center; top: 50%; transform: translateY(-50%); width: 100%; } .video__trigger a { background: rgba(214, 89, 65, 0.5) none repeat scroll 0 0; border-radius: 100%; display: inline-block; font-size: 40px; height: 100px; line-height: 100px; width: 100px; } .video__trigger a i { background: #e05941 none repeat scroll 0 0; border-radius: 100%; color: #fff; height: 66px; line-height: 66px; text-align: center; width: 66px; transition: 0.5s; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .video__inner .video__content { margin-left: 60px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .video__inner .video__content { margin-left: 29px; } } @media only screen and (max-width: 767px) { .video__inner .video__content { margin-left: 0; } .video__trigger { width: auto; } .video__trigger a { height: 80px; line-height: 80px; width: 80px; } .voopo__video { padding-bottom: 154px; } } @media only screen and (max-width: 575px) { .video__inner .video__content { margin-left: 20px; margin-right: 20px; top: 20px; } .voopo__video { padding-bottom: 139px; } .video__inner .video__content h2 { font-size: 24px; margin-bottom: 23px; padding-bottom: 27px; } .video__inner .video__content { padding: 40px 29px 80px; } } /*===== Colors =====//*/ /*===== Font Family =====//*/ /*===== Line Height =====//*/ /*===== Radius =====//*/ /*==== Font size =====//*/ /*===== Border color ======//*/ /*===== Alerts color =====//*/ /*===== Social Colors =====//*/ /* Layouts*/ /* container 450px*/ /* container 300px*/ /*------------------ Working Styles ---------------------*/ .voopo__working__process { padding-top: 110px; padding-bottom: 110px; } .voopo__working__process .thumb__poss { bottom: 0; position: absolute; right: 0; } .voopo__process { display: flex; margin-top: 60px; } .voopo__process .count { margin-right: 40px; } .voopo__process .count span { background: linear-gradient(to left, #fccec8, #e05941); border-radius: 100%; color: #f5f8fa; display: inline-block; font-size: 24px; font-weight: 700; height: 60px; line-height: 60px; text-align: center; width: 60px; } .voopo__process .content h4 { color: #010f54; font-size: 24px; line-height: 40px; margin-bottom: 12px; } .voopo__process .content p { font-size: 16px; line-height: 27px; margin: 0; } .works__inner .section__title--2 span { color: #eef3f6; } .works__inner .section__title--2 h2 { color: #eef3f6; } .works__inner p { color: #eef3f6; font-size: 16px; line-height: 27px; margin: 0; padding-right: 16%; } .works { display: flex; } .works .icons { margin-right: 17px; } .works .icons i { color: #eef3f6; font-size: 16px; } .works .content h2 { color: #eef3f6; font-size: 24px; line-height: 27px; margin-bottom: 20px; } .works .content p { color: #eef3f6; font-size: 16px; line-height: 27px; margin: 0; } .works + .works { margin-top: 40px; } .voopo__works { padding: 115px 0; } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .voopo__working__process .thumb__poss { right: -263px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .voopo__working__process .thumb__poss { right: -41%; width: 100%; } .voopo__working__process .thumb__poss img { width: 100%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .voopo__working__process .thumb__poss img { width: 100%; } .voopo__working__process .thumb__poss { right: -72%; } } @media only screen and (max-width: 767px) { .voopo__working__process .thumb__poss { display: none; } .voopo__working__process .thumb__poss img { width: 100%; } .voopo__working__process { padding-bottom: 60px; padding-top: 60px; } .voopo__works { padding: 60px 0; } } @media only screen and (max-width: 575px) { .voopo__process .count { margin-right: 20px; } .voopo__process .content h4 { font-size: 20px; line-height: 24px; } } /*------------------ Software Styles ---------------------*/ .faq_inner { padding-left: 65px; } .faq_inner .content h2 { color: #010f54; font-size: 36px; } .faq_inner .content p { color: #010f54; font-size: 16px; line-height: 27px; margin-bottom: 25px; } .faq_inner .content .input__box input { background: #f5f8fa none repeat scroll 0 0; border: 0 none; border-radius: 4px; color: #035f91; height: 60px; margin-bottom: 20px; padding: 0 30px; width: 100%; } .faq_inner .content .input__box input:focus { border: 1px solid #bd4e45; } .faq_inner .content .input__box textarea { background: #f5f8fa none repeat scroll 0 0; border: 0 none; border-radius: 4px; color: #035f91; margin-bottom: 30px; min-height: 143px; padding: 20px; width: 100%; resize: none; } .faq_inner .content .input__box textarea:focus { border: 1px solid #bd4e45; } .faq_inner .content .input__box input::-webkit-input-placeholder { color: #035f91; opacity: 1; } .faq_inner .content .input__box input::-moz-placeholder { color: #035f91; opacity: 1; } .faq_inner .content .input__box input:-ms-input-placeholder { color: #035f91; opacity: 1; } .faq_inner .content .input__box input:-moz-placeholder { color: #035f91; opacity: 1; } .faq_inner .content .input__box textarea::-webkit-input-placeholder { color: #035f91; opacity: 1; } .faq_inner .content .input__box textarea::-moz-placeholder { color: #035f91; opacity: 1; } .faq_inner .content .input__box textarea:-ms-input-placeholder { color: #035f91; opacity: 1; } .faq_inner .content .input__box textarea:-moz-placeholder { color: #035f91; opacity: 1; } .acc-header h5 { margin: 0; } .acc-header h5 a { background: #f5f8fa none repeat scroll 0 0; border: 0 none; color: #e05941; display: block; font-size: 18px; font-weight: 500; line-height: 40px; margin: 0; padding: 10px 60px 10px 40px; position: relative; } .acc-header h5 a::before { content: "\f303"; font-family: Material-Design-Iconic-Font; font-size: 24px; position: absolute; right: 47px; top: 50%; transform: translateY(-50%); } .acc-header h5 a.collapsed { color: #010f54; } .acc-header h5 a.collapsed::before { content: "\f2fe"; } .panora_accordion .card-body { background: #f5f8fa none repeat scroll 0 0; color: #035f91; font-size: 14px; font-weight: 400; line-height: 24px; padding: 0 40px 26px; } .panora_accordion .card { background-clip: border-box; background-color: #fff; border: 0 none; border-radius: 4px; margin-bottom: 30px; position: relative; } .panora_accordion .card:last-child { margin-bottom: 0; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .faq_inner { padding-left: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .faq_inner { padding-left: 0; } } @media only screen and (max-width: 767px) { .faq_inner { padding-left: 0; } .faq_inner .content h2 { font-size: 29px; } .acc-header h5 a { font-size: 17px; line-height: 23px; } } @media only screen and (max-width: 575px) { .panora_accordion .card-body { padding: 0 38px 16px; } .faq_inner .content h2 { font-size: 20px; } } /*------------------ Breadcaump Styles ---------------------*/ .pr__bradcaump__area { align-items: center; display: flex; height: 120px; } .pr__bradcaump__area .bradcaump-title { color: #fefefe; font-size: 50px; line-height: 70px; margin: 0; } .breadcrumb--2.pr__bradcaump__area .bradcaump-title { color: #010f54; font-size: 36px; line-height: 47px; margin: 0 0 8px; } .breadcrumb--2.pr__bradcaump__area { height: 360px; } .breadcrumb--2 .bradcaump-content .breadcrumb_item { color: #010f54; font-size: 18px; transition: 0.3s; } .breadcrumb--2 .bradcaump-content .breadcrumb_item:hover { color: #e05941; } .breadcrumb--2 .bradcaump-content .brd-separetor { margin: 0 8px; } @media only screen and (max-width: 575px) { .pr__bradcaump__area { height: 400px; padding-top: 87px; } .pr__bradcaump__area .bradcaump-title { font-size: 50px; } .pr__bradcaump__area .bradcaump-title { font-size: 30px; } .breadcrumb--2.pr__bradcaump__area .bradcaump-title { font-size: 28px; line-height: 45px; } } @media only screen and (max-width: 479px) { .pr__bradcaump__area { height: 300px; padding-top: 82px; } } /*------------------ About Styles ---------------------*/ .voopo__about__area { padding-bottom: 120px; position: relative; z-index: 2; padding-top: 120px; } .voopo__about__area .about--thumb { position: absolute; right: 0; top: -52px; } .about__inner p { font-size: 16px; line-height: 27px; margin: 0; } .about__inner p + p { margin-top: 29px; } @media only screen and (min-width: 1600px) and (max-width: 1919px) { .voopo__about__area .about--thumb { width: 59%; } } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .voopo__about__area { padding-bottom: 250px; } .voopo__about__area .about--thumb { top: 50%; transform: translateY(-50%); width: 55%; } .voopo__about__area .about--thumb img { width: 100%; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .voopo__about__area { padding-bottom: 150px; } .voopo__about__area .about--thumb { top: 50%; transform: translateY(-50%); width: 55%; } .voopo__about__area .about--thumb img { width: 100%; } .about__inner p { font-size: 14px; line-height: 24px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .voopo__about__area { padding-bottom: 150px; } .voopo__about__area .about--thumb { position: inherit; top: auto; transform: inherit; width: 100%; margin-top: 30px; } .voopo__about__area .about--thumb img { width: 100%; } .voopo__about__area { background: #f8fafb none repeat scroll 0 0; padding: 120px 0 90px; } .voopo__about__area .about--shape { display: none; } .about__inner p { font-size: 14px; line-height: 24px; } } @media only screen and (max-width: 767px) { .voopo__about__area { padding-bottom: 150px; } .voopo__about__area .about--thumb { position: inherit; top: auto; transform: inherit; width: 100%; margin-top: 30px; } .voopo__about__area .about--thumb img { width: 100%; } .voopo__about__area { background: #f8fafb none repeat scroll 0 0; padding: 120px 0 90px; } .voopo__about__area .about--shape { display: none; } .about__inner p { font-size: 14px; line-height: 24px; } .works .content p { font-size: 14px; line-height: 24px; } .works__inner p { font-size: 14px; line-height: 24px; padding-right: 0; } .voopo__about__area { padding: 60px 0; } .about__inner p { font-size: 14px; line-height: 24px; } } /*------------------ Testimonial Styles ---------------------*/ .testimonial { margin-top: 40px; } .testimonial .thumb { margin-bottom: 24px; } .testimonial .clint__info h4 { color: #010f54; font-size: 24px; margin-bottom: 19px; padding-bottom: 24px; position: relative; } .testimonial .clint__info h4::before { background: linear-gradient(to left, #fccec8, #e05941); bottom: 0; content: ""; height: 3px; left: 0; position: absolute; width: 150px; } .testimonial .clint__info p { font-size: 16px; line-height: 27px; margin: 0; } @media only screen and (min-width: 768px) and (max-width: 991px) { .testimonial .clint__info h4 { font-size: 20px; margin-bottom: 19px; padding-bottom: 25px; } } /*-------------------------- Blog Styles -------------------------------*/ .banner { position: relative; } .banner .hover__action { bottom: 0; padding: 20px; position: absolute; } .banner .hover__action .banner__content span { color: #ffffff; font-size: 18px; font-weight: 500; } .banner .hover__action .banner__content h3 { margin-bottom: 18px; margin-top: 8px; } .banner .hover__action .banner__content h3 a { color: #ffffff; font-size: 24px; font-weight: 500; padding-right: 35%; transition: all 0.3s ease 0s; display: inline-block; } .banner .hover__action .banner__content h3 a:hover { color: #bd4e45; } .banner .hover__action .banner__content .banner__btn a.voopo__btn { border-radius: 4px; height: 40px; line-height: 40px; } .banner.b11 .hover__action .banner__content h3 a { padding-right: 6%; } .banner .thumb img { width: 100%; } .banner .hover__action .banner__content .banner__btn a.voopo__btn::before { border-radius: 4px; } .blog { background: #fff none repeat scroll 0 0; border-radius: 4px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.13); margin-top: 30px; } .blog .thumb { overflow: hidden; } .blog .thumb a img { transition: all 0.5s ease 0s; width: 100%; } .blog:hover .thumb a img { transform: scale(1.1); } .blog .content { border-bottom: 1px solid #e5eff4; padding: 30px; } .blog .content span { color: #035f91; font-size: 12px; } .blog .content span a { color: #035f91; transition: all 0.3s ease 0s; } .blog .content span a:hover { color: #e05941; } .blog .content h2 { font-size: 20px; font-weight: 500; line-height: 38px; margin-bottom: 12px; } .blog .content h2 a { color: #010f54; transition: 0.3s; } .blog .content h2 a:hover { color: #e05941; } .blog .content p { margin: 0; padding-right: 10%; } .blog a.readmore__btn { display: inline-block; font-size: 14px; font-weight: 700; height: 52px; line-height: 52px; padding: 0 30px; transition: all 0.5s ease 0s; background: -webkit-linear-gradient(#e05a42, #ef998a); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .blog a.readmore__btn:hover { background: -webkit-linear-gradient(#035f91, #035f91); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .space--left { padding-left: 85px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .banner .hover__action { padding: 20px 15px; } .banner .hover__action .banner__content h3 a { font-size: 19px; } .banner.b11 .hover__action .banner__content h3 a { padding-right: 0; } .space--left { padding-left: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .banner.b11 .hover__action .banner__content h3 a { padding-right: 0; font-size: 22px; } .space--left { padding-left: 15px; } .blog__list .content h2 a { font-size: 20px; line-height: 22px; } } @media only screen and (max-width: 767px) { .blog .content { border-bottom: 1px solid #e5eff4; padding: 30px 20px; } .blog .content h2 { font-size: 18px; line-height: 35px; } .blog .content p { padding-right: 0; } .banner.b11 .hover__action .banner__content h3 a { font-size: 18px; line-height: 27px; } .space--left { padding-left: 15px; } .banner .hover__action { bottom: 50%; padding: 20px; transform: translateY(50%); } .banner .hover__action .banner__content h3 { margin-bottom: 15px; margin-top: 9px; } .banner .hover__action .banner__content h3 a { padding-right: 0; } } @media only screen and (max-width: 575px) { .blog__list .content h2 a { font-size: 19px; line-height: 25px; } } /*------------------ Sidebar Styles ---------------------*/ .vp__widget.search { position: relative; } .vp__widget.search input { background: #fff none repeat scroll 0 0; border: 0 none; border-radius: 3px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); color: #010f54; font-size: 12px; height: 60px; padding: 0 66px 0 30px; width: 100%; } .vp__widget.search button { background: #e15e46 none repeat scroll 0 0; border: 0 none; border-radius: 3px; height: 100%; padding: 0 20px; position: absolute; right: 0; top: 50%; transform: translateY(-50%); transition: 0.3s; } .vp__widget.search button:hover { background: #bd4e45; color: #fff; } .vp__widget.search button i { color: #fff; font-size: 24px; } .vp__widget.newsletter { background: #fff none repeat scroll 0 0; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); padding: 40px 27px; border-radius: 30px; } .vp__widget.newsletter h4 { color: #1344a5; font-size: 18px; font-weight: 700; margin-bottom: 23px; } .vp__widget.newsletter input { -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; border-color: currentcolor currentcolor #010f54; border-image: none; border-style: none none solid; border-width: 0 0 1px; color: #010f54; font-size: 12px; margin-bottom: 24px; padding-bottom: 7px; width: 100%; } .vp__widget.newsletter a.voopo__btn { height: 40px; line-height: 38px; text-align: center; width: 100%; } .vp__widget.voopo__tag .tag__list { display: flex; flex-wrap: wrap; list-style: outside none none; margin: 0 -3px; padding: 0; } .vp__widget.voopo__tag .tag__list li { margin: 0 3px 13px; } .vp__widget.voopo__tag .tag__list li a { background: #eef3f6 none repeat scroll 0 0; border-radius: 16px; color: #010f54; display: inline-block; font-size: 14px; font-weight: 500; height: 30px; line-height: 30px; padding: 0 14px; transition: 0.3s; } .vp__widget.voopo__tag .tag__list li a:hover { background: #bd4e45; color: #fff; } .single__tab__content.tab-pane:not(.active) { display: none; } .vp__widget.recent__post__wrap { background: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } .vp__widget.recent__post__wrap .voopo__nav { border-bottom: 1px solid #eef3f6; margin-bottom: 20px; } .vp__widget.recent__post__wrap .voopo__nav a { color: #a9c2cb; font-size-s: 18px; font-weight: 700; padding: 0; margin: 0; height: 50px; line-height: 50px; flex-basis: 50%; text-align: center; position: relative; transition: 0.3s; } .vp__widget.recent__post__wrap .voopo__nav a.active, .vp__widget.recent__post__wrap .voopo__nav a:hover { color: #1344a5; } .vp__widget.recent__post__wrap .voopo__nav a + a { border-left: 1px solid #eef3f6; } .single__tab__content { padding: 0 25px; } .single__tab__content .recent__post { align-items: center; display: flex; } .single__tab__content .recent__post + .recent__post { margin-top: 25px; } .single__tab__content .recent__post .thumb { margin-right: 25px; } .single__tab__content .recent__post .thumb a img { width: 75px; } .single__tab__content .recent__post .content h4 { font-weight: 500; line-height: 20px; margin: 0 0 5px; } .single__tab__content .recent__post .content h4 a { color: #035f91; font-size: 14px; transition: all 0.3s ease 0s; } .single__tab__content .recent__post .content h4 a:hover { color: #e05941; } .single__tab__content .recent__post .content span { color: #035f91; font-size: 12px; font-style: italic; } .vp__widget.recent__post__wrap { border-radius: 30px; padding-bottom: 30px; } .vp__widget.banner .thumb img { width: 100%; } .vp__widget.search input::-webkit-input-placeholder, .vp__widget.newsletter input::-webkit-input-placeholder { color: #010f54; opacity: 1; } .vp__widget.search input::-moz-placeholder, .vp__widget.newsletter input::-moz-placeholder { color: #010f54; opacity: 1; } .vp__widget.search input:-ms-input-placeholder, .vp__widget.newsletter input:-ms-input-placeholder { color: #010f54; opacity: 1; } .vp__widget.search input:-moz-placeholder, .vp__widget.newsletter input:-moz-placeholder { color: #010f54; opacity: 1; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .single__tab__content .recent__post { display: block; } .single__tab__content .recent__post .thumb { margin-bottom: 6px; margin-right: 0; } } /*---------------------- Blog list Styles ------------------------*/ .blog__list__wrapper { margin-top: -60px; } .blog__list { align-items: center; background: #fff none repeat scroll 0 0; border-radius: 13px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); display: flex; margin-top: 60px; } .blog__list .content { padding: 37px 40px; } .blog__list .content h2 { margin-bottom: 28px; } .blog__list .content h2 a { color: #1344a5; font-size: 24px; line-height: 34px; transition: all 0.3s ease 0s; } .blog__list .content h2 a:hover { color: #e05941; } .blog__list .content p { font-size: 16px; line-height: 27px; margin-bottom: 41px; } .blog__list .content .blog__meta { display: flex; list-style: outside none none; margin-bottom: 25px; padding: 0; } .blog__list .content .blog__meta li { color: #035f91; font-size: 12px; font-weight: 500; } .blog__list .content .blog__meta li.separator { padding: 0 13px; } .blog__list .content .blog__meta li a { color: #035f91; transition: 0.3s; } .blog__list .content .blog__meta li a:hover { color: #e05941; } .blog__list .content .blog__cat { display: flex; list-style: outside none none; margin: 0; padding: 0; } .blog__list .content .blog__cat li a { background: #eef3f6 none repeat scroll 0 0; border-radius: 8px; color: #035f91; display: block; font-size: 12px; font-weight: 500; height: 20px; line-height: 20px; padding: 0 6px; transition: all 0.3s ease 0s; } .blog__list .content .blog__cat li a:hover { background: #bd4e45 none repeat scroll 0 0; color: #fff; } .blog__list .content .blog__cat li + li { margin-left: 13px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .blog__list { display: block; } .blog__list .thumb a img { width: 100%; } .blog__list .content { padding: 40px 22px; } .blog__list .content h2 { margin-bottom: 10px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .blog__list .content p { font-size: 14px; line-height: 24px; margin-bottom: 21px; } .blog__list .content { padding: 40px 28px; } } @media only screen and (max-width: 767px) { .blog__list { display: block !important; } .blog__list .thumb a img { width: 100%; } .blog__list .content p { font-size: 14px; line-height: 24px; } } @media only screen and (max-width: 575px) { .blog__list .content { padding: 40px 20px; } .blog__list .content h2 { margin-bottom: 18px; } .blog__list .content h2 a { font-size: 20px; line-height: 30px; } .blog__list .content p { margin-bottom: 18px; } .banner .hover__action .banner__content h3 a { font-size: 15px; line-height: 20px; } .banner.b11 .hover__action .banner__content h3 a { font-size: 16px; line-height: 20px; } } /*---------------------- Contact Styles ------------------------*/ .voopo__contact__form h2 { color: #010f54; font-size: 36px; line-height: 45px; margin-bottom: 54px; } .voopo__contact__form .single-contact-form { margin-top: 35px; } .voopo__contact__form .single-contact-form input { -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; border-color: currentcolor currentcolor #a9c2cb; border-image: none; border-style: none none solid; border-width: 0 0 1px; color: #010f54; font-weight: 500; padding-bottom: 27px; width: 100%; outline: none; } .voopo__contact__form .single-contact-form input:focus { border-bottom: 1px solid #e05941; } .voopo__contact__form .single-contact-form textarea { -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; border-color: currentcolor currentcolor #a9c2cb; border-image: none; border-style: none none solid; border-width: 0 0 1px; margin-bottom: 50px; min-height: 80px; resize: none; width: 100%; color: #010f54; outline: none; } .voopo__contact__form .single-contact-form textarea:focus { border-bottom: 1px solid #e05941; } .voopo__contact__form .single-contact-form input::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #010f54; } .voopo__contact__form .single-contact-form input::-moz-placeholder { /* Firefox 19+ */ color: #010f54; } .voopo__contact__form .single-contact-form input:-ms-input-placeholder { /* IE 10+ */ color: #010f54; } .voopo__contact__form .single-contact-form input:-moz-placeholder { /* Firefox 18- */ color: #010f54; } .voopo__contact__form .single-contact-form textarea::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #010f54; } .voopo__contact__form .single-contact-form textarea::-moz-placeholder { /* Firefox 19+ */ color: #010f54; } .voopo__contact__form .single-contact-form textarea:-ms-input-placeholder { /* IE 10+ */ color: #010f54; } .voopo__contact__form .single-contact-form textarea:-moz-placeholder { /* Firefox 18- */ color: #010f54; } button.voopo__btn { border: 0 none; } .vp__contact__address { padding: 120px 0; } .vp__contact__address h2 { color: #010f54; font-size: 36px; line-height: 45px; margin-bottom: 28px; } .vp__contact__address .vp__address h4 { color: #010f54; font-size: 24px; font-weight: 700; line-height: 45px; margin-bottom: 17px; padding-bottom: 10px; position: relative; } .vp__contact__address .vp__address h4::before { background: #e15d45 none repeat scroll 0 0; bottom: 0; content: ""; height: 3px; left: 0; position: absolute; width: 60px; } .vp__contact__address .vp__address p { margin: 0; color: #010f54; font-size: 18px; line-height: 30px; padding-right: 32%; } .vp__contact__address .vp__address p a { color: #010f54; display: block; font-size: 18px; line-height: 35px; transition: 0.3s; } .vp__contact__address .vp__address p a:hover { color: #e05941; } .vp__contact__address .vp__address + .vp__address { margin-top: 20px; } #googleMap { height: 100%; width: 100%; } .voopo__address { position: relative; } .goggle__map { height: 100%; position: absolute; right: 0; top: 0; width: 1077px; } @media only screen and (min-width: 1600px) and (max-width: 1919px) { .goggle__map { width: 800px; } } @media only screen and (min-width: 1200px) and (max-width: 1599px) { .goggle__map { width: 700px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .goggle__map { width: 512px; } .voopo__contact__form h2 { font-size: 30px; line-height: 43px; margin-bottom: 37px; } .contact__thumb img { width: 100%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .goggle__map { width: 400px; } .voopo__contact__form h2 { font-size: 23px; line-height: 36px; margin-bottom: 25px; } .contact__thumb img { width: 100%; } } @media only screen and (max-width: 767px) { .voopo__contact__form h2 { font-size: 25px; line-height: 38px; margin-bottom: 18px; } .contact__thumb { margin-top: 30px; } .contact__thumb img { width: 100%; } .vp__contact__address h2 { font-size: 25px; } .goggle__map { height: 500px; position: inherit; top: 0; width: 1077px; bottom: 0; width: 100%; left: 0; } .vp__contact__address .vp__address p { padding-right: 0; } } @media only screen and (max-width: 575px) { .contact__thumb img { width: 100%; } .voopo__contact__form h2 { font-size: 20px; line-height: 31px; margin-bottom: 0; } } /*------------------ Cart Styles ---------------------*/ .cart-title-area { padding-top: 30px; } .car-header-title h2 { font-size: 20px; margin: 0; text-transform: uppercase; } .table-content table { background: #fff none repeat scroll 0 0; border-color: #c1c1c1; border-radius: 0; border-style: solid; border-width: 1px 0 0 1px; margin: 0 0 50px; text-align: center; width: 100%; } .table-content table th { border-top: medium none; color: #1344a5; font-weight: 700; padding: 20px 10px; text-align: center; text-transform: uppercase; vertical-align: middle; white-space: nowrap; } .table-content table th, .table-content table td { border-bottom: 1px solid #c1c1c1; border-right: 1px solid #c1c1c1; } .table-content table td { border-top: medium none; padding: 20px 10px; vertical-align: middle; font-size: 13px; } .table-content table td input { background: #e5e5e5 none repeat scroll 0 0; border: medium none; border-radius: 3px; color: #035e91; font-size: 15px; font-weight: normal; height: 40px; padding: 0 5px 0 10px; width: 60px; } .table-content table td.product-subtotal { font-size: 14px; font-weight: bold; width: 120px; color: #035e91; text-align: center; } .table-content table td.product-name a { font-size: 14px; font-weight: 700; margin-left: 10px; color: #035e91; } .table-content table td.product-name { width: 270px; text-align: center; } .table-content table td.product-thumbnail { width: 130px; text-align: center; } .table-content table td.product-remove i { color: #919191; display: inline-block; font-size: 20px; height: 40px; line-height: 40px; text-align: center; width: 40px; text-align: center; } .table-content table .product-price .amount { font-size: 15px; font-weight: 700; color: #035e91; } .table-content table td.product-remove i:hover { color: #010f54; } .table-content table td.product-quantity { width: 180px; position: relative; text-align: center; } .table-content table td.product-quantity .qtybutton { position: absolute; line-height: 50px; height: 50px; top: 50%; width: 20px; -webkit-transform: translateY(-50%); transform: translateY(-50%); cursor: pointer; } .table-content table td.product-quantity .inc.qtybutton { left: 54%; right: auto; } .table-content table td.product-quantity .dec.qtybutton { right: 54%; left: auto; } .table-content table td.product-quantity input { text-align: center; } .table-content table td.product-quantity input[type=number]::-webkit-inner-spin-button, .table-content table td.product-quantity input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; -moz-appearance: none; appearance: none; margin: 0; } .table-content table td.product-remove { width: 150px; text-align: center; } .table-content table td.product-price { width: 130px; text-align: center; } .table-content table td.product-name a:hover, .buttons-cart a:hover { color: #e05941; } .buttons-cart { margin-bottom: 30px; overflow: hidden; } .buttons-cart input, .buttons-cart button, .buttons-cart a { margin-top: 20px; } .buttons-cart input, .coupon input[type="submit"], .buttons-cart a, .coupon-info p.form-row input[type="submit"] { background: #010f54 none repeat scroll 0 0; border: medium none; border-radius: 30px; box-shadow: none; color: #fff; display: inline-block; float: left; font-size: 12px; font-weight: 700; height: 40px; line-height: 40px; margin-right: 15px; padding: 0 15px; text-shadow: none; text-transform: uppercase; transition: all 0.3s ease 0s; white-space: nowrap; } .buttons-cart input:hover, .coupon input[type=submit]:hover, .buttons-cart a:hover { background: #e05941; color: #fff !important; } .buttons-cart a { color: #fff; float: left; height: 40px; line-height: 40px; } .coupon { margin-bottom: 40px; overflow: hidden; padding-bottom: 20px; } .coupon h3 { margin: 0 0 10px; font-size: 14px; text-transform: uppercase; } .coupon input[type=text] { border: 1px solid #c1c1c1; float: left; height: 40px; margin: 0 6px 20px 0; max-width: 100%; padding: 0 0 0 10px; width: 170px; } .cart_totals { float: left; text-align: right; width: 100%; margin-top: 15px; } .cart_totals h2 { border-bottom: 2px solid #c1c1c1; display: inline-block; font-size: 30px; margin: 0 0 35px; text-transform: uppercase; } .cart_totals table { border: medium none; float: right; margin: 0; text-align: right; } .cart_totals table th { border: medium none; font-size: 14px; font-weight: bold; padding: 0 20px 12px 0; text-align: right; text-transform: uppercase; vertical-align: top; } .cart_totals table td { border: medium none; padding: 0 0 12px; vertical-align: top; } .cart_totals table td .amount { color: #010f54; float: right; font-size: 13px; font-weight: bold; margin-left: 5px; text-align: right; text-transform: uppercase; } .cart_totals table td ul#shipping_method { list-style: outside none none; margin: 0; padding: 0; } .cart_totals table td ul#shipping_method li { float: left; margin: 0 0 10px; padding: 0; text-indent: 0; width: 100%; } .cart_totals table td ul#shipping_method li input { margin: 0; position: relative; top: 2px; } a.shipping-calculator-button { font-weight: bold; color: #035e91; } a.shipping-calculator-button:hover { color: #e05941; } .cart_totals table tr.order-total th, .cart_totals table tr.order-total .amount { font-size: 20px; text-transform: uppercase; white-space: nowrap; } .wc-proceed-to-checkout a { background: #010f54 none repeat scroll 0 0; border-radius: 30px; color: #fff; display: inline-block; font-size: 14px; font-weight: 700; height: 50px; line-height: 50px; margin-top: 20px; padding: 0 30px; text-transform: uppercase; } .wc-proceed-to-checkout a:hover { background: #e05941; color: #fff !important; } .owl-theme .owl-controls .owl-page span { background: #ffffff none repeat scroll 0 0; border: 1px solid #c1c1c1; border-radius: 100%; display: block; height: 13px; margin: 3px; width: 13px; -webkit-transition: 0.3s; transition: 0.3s; } .owl-theme .owl-controls .owl-page.active span, .owl-theme .owl-controls.clickable .owl-page:hover span { border: 2px solid #c1c1c1; } .slider-area.slider-v4 { margin: 30px 0 35px 0; } .coupon p { margin-bottom: 12px; } /*======= Checkout Styles =======*/ .single-accordion { margin-bottom: 30px; } .mb--20 { margin-bottom: 20px; } input[type="submit"] { cursor: pointer; } .single-accordion { margin-bottom: 30px; } .order-details .dcare__btn { border: 0 none; } .accordion-head { background-color: #bd4e45; color: #ffffff; display: block; font-size: 15px; font-weight: 700; height: 47px; line-height: 49px; padding: 0 12px 0 28px; position: relative; text-align: left; text-transform: uppercase; width: 100%; font-family: "Ubuntu", sans-serif; } .accordion-head:focus, .accordion-head:hover { color: #ffffff; } .accordion-head.collapsed { background-color: #f1f2f3; color: #333; } .accordion-head.collapsed:focus { color: #333; } .accordion-head.collapsed:hover { color: #bd4e45; } .accordion-body { overflow: hidden; padding: 30px; border: 1px solid #eeeeee; border-top: none; } .checkout-method-list { float: left; margin-bottom: 15px; width: 100%; padding-left: 0; list-style: none; } .checkout-method-list li { display: block; text-transform: capitalize; cursor: pointer; float: left; margin-right: 30px; } .checkout-method-list li::before { content: "\f192"; font-family: 'Fontawesome'; float: left; line-height: 24px; padding-left: 1px; margin-right: 10px; font-size: 16px; } .checkout-method-list li.active::before { color: #bd4e45; } .shipping-method h5 { font-size: 16px; text-transform: capitalize; margin-bottom: 15px; font-weight: 700; font-style: italic; } .shipping-method p span { font-weight: 700; color: #333; text-transform: capitalize; margin-right: 10px; } .payment-method-list { float: left; width: 100%; padding-left: 0; list-style: none; } .payment-method-list li { display: block; text-transform: capitalize; cursor: pointer; float: left; margin-right: 30px; } .payment-method-list li::before { content: "\f192"; font-family: 'Fontawesome'; float: left; line-height: 24px; padding-left: 1px; margin-right: 10px; font-size: 16px; } .payment-method-list li.active::before { color: #bd4e45; } .shipping-form-toggle { display: inline-block; text-transform: capitalize; cursor: pointer; padding: 0; background-color: transparent; border: none; margin-bottom: 20px; } .shipping-form-toggle::before { content: "\f192"; font-family: 'Fontawesome'; float: left; line-height: 24px; padding-left: 1px; margin-right: 10px; font-size: 16px; } .shipping-form-toggle.active::before { color: #bd4e45; } .checkout-login-form { float: left; width: 100%; } .checkout-login-form .input-box input { width: 100%; border: 1px solid #ededed; background-color: #ffffff; height: 40px; line-height: 24px; padding: 7px 15px; color: #333333; font-size: 15px; float: left; } .checkout-login-form .input-box input[type="submit"] { width: 120px; margin-right: 0; background-color: #bd4e45; padding: 8px 15px; border: none; color: #ffffff; text-transform: uppercase; font-weight: 700; margin-bottom: 0; border-radius: 50px; } .checkout-login-form .input-box input[type="submit"]:hover { background-color: #ac453d; } .checkout-register-form { display: none; float: left; width: 100%; } .checkout-register-form .input-box input { width: 100%; border: 1px solid #ededed; background-color: #ffffff; height: 40px; line-height: 24px; padding: 7px 15px; color: #333333; font-size: 15px; float: left; } .checkout-register-form .input-box input[type="submit"] { width: 120px; margin-right: 0; background-color: #bd4e45; padding: 8px 15px; border: none; color: #ffffff; text-transform: uppercase; font-weight: 700; margin-bottom: 0; border-radius: 50px; } .checkout-register-form .input-box input[type="submit"]:hover { background-color: #ac453d; } .checkout-form { float: left; width: 100%; } .checkout-form.shipping-form { display: none; } .checkout-form input { width: 100%; border: 1px solid #ededed; background-color: #ffffff; height: 40px; line-height: 24px; padding: 7px 15px; color: #333333; font-size: 15px; float: left; } .checkout-form select { -moz-appearance: none; -webkit-appearance: none; appearance: none; background: rgba(0, 0, 0, 0) url("images/icons/select-arrow-down-2.png") no-repeat scroll right 5px center; width: 100%; border: 1px solid #ededed; background-color: #ffffff; height: 40px; line-height: 24px; padding: 7px 15px; color: #333333; font-size: 15px; float: left; } .checkout-form select option { padding: 5px 15px; } .checkout-form textarea { width: 100%; border: 1px solid #ededed; background-color: #ffffff; height: 120px; line-height: 24px; padding: 7px 15px; color: #333333; font-size: 15px; float: left; } .payment-form { float: left; width: 100%; display: none; } .payment-form label { display: block; font-size: 15px; } .payment-form input { width: 100%; border: 1px solid #ededed; background-color: #ffffff; height: 40px; line-height: 24px; padding: 7px 15px; color: #333333; font-size: 15px; float: left; } .payment-form select { -moz-appearance: none; -webkit-appearance: none; appearance: none; background: rgba(0, 0, 0, 0) url("images/icons/select-arrow-down-2.png") no-repeat scroll right 5px center; width: 100%; border: 1px solid #ededed; background-color: #ffffff; height: 40px; line-height: 24px; padding: 7px 15px; color: #333333; font-size: 15px; float: left; } .payment-form select option { padding: 5px 15px; } .payment-form a { color: #bd4e45; font-size: 15px; margin-top: 5px; } .order-details-wrapper h2 { background: #bd4e45; color: #ffffff; display: block; font-size: 14px; font-weight: 700; height: 45px; line-height: 45px; padding: 0 12px 0 28px; text-transform: uppercase; width: 100%; margin: 0; } .order-details { background-color: #f1f2f3; padding: 10px 0; text-align: left; float: left; width: 100%; } .order-details ul { padding-left: 0; list-style: none; } .order-details ul li { border-bottom: 1px solid #e9e9e9; display: block; float: left; padding: 16px 28px; text-align: left; width: 100%; } .order-details ul li:last-child { border-bottom: 0 solid transparent; } .order-details ul li p { color: #606060; display: block; margin: 0; width: 60%; float: left; } .order-details ul li p:last-child { width: 40%; } .order-details ul li p.strong { color: #303030; font-weight: 600; text-transform: uppercase; } .order-details ul li p input { display: block; float: left; margin-right: 10px; margin-top: 3px; } .order-details ul li p label { color: #606060; display: block; float: left; font-weight: 300; margin: 0; overflow: hidden; line-height: 20px; } .checkout-form input::-webkit-input-placeholder, .checkout-register-form .input-box input::-webkit-input-placeholder, .checkout-login-form .input-box input::-webkit-input-placeholder { color: #333333; opacity: 1; } .checkout-form input::-moz-placeholder, .checkout-register-form .input-box input::-moz-placeholder, .checkout-login-form .input-box input::-moz-placeholder { color: #333333; opacity: 1; } .checkout-form input:-ms-input-placeholder, .checkout-register-form .input-box input:-ms-input-placeholder, .checkout-login-form .input-box input:-ms-input-placeholder { color: #333333; opacity: 1; } .faq_inner .content .input__box textarea:-moz-placeholder, .checkout-register-form .input-box input:-moz-placeholder, .checkout-login-form .input-box input:-moz-placeholder { color: #333333; opacity: 1; } /*------------------ About Styles ---------------------*/ .bl__details__inner .thumb img { width: 100%; } .bl__details__inner .blog__content { padding-left: 100px; } .bl__details__inner .blog__content .author { align-items: center; display: flex; margin-bottom: 30px; margin-top: 40px; } .bl__details__inner .blog__content .author .author_info { padding-left: 15px; } .bl__details__inner .blog__content .author .author_info h6 { color: #010f54; font-size: 24px; font-weight: 700; margin: 0 0 4px; } .bl__details__inner .blog__content .author .author_info span { color: #035f91; font-size: 14px; font-weight: 500; } .bl__details__inner .blog__content p { color: #035f91; font-size: 16px; line-height: 33px; margin-bottom: 0; } .bl__details__inner .blog__content h2.bl_title { color: #035f91; font-size: 24px; font-weight: 500; margin-bottom: 17px; margin-top: 45px; } .bl__details__inner .blog__content blockquote { color: #035f91; font-size: 20px; font-weight: 700; line-height: 30px; margin: 61px 118px 40px; position: relative; text-align: center; } .bl__details__inner .blog__content blockquote::before { background-image: url(images/blog/quote.png); background-position: center center; background-repeat: no-repeat; background-size: auto auto; content: ""; height: 41px; left: -63px; position: absolute; top: -23px; width: 61px; } .bl__details__inner .bl_list { display: flex; justify-content: space-between; list-style: outside none none; margin: 50px -15px 0; padding: 0; } .bl__details__inner .bl_list li { padding: 0 15px; } .bl__details__inner .bl_list li a img { width: 100%; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .bl__details__inner .blog__content blockquote { margin: 61px 73px 40px; } .bl__details__inner .blog__content { padding-left: 70px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .bl__details__inner .blog__content blockquote { margin: 61px 75px 40px; } .bl__details__inner .blog__content { padding-left: 70px; } } @media only screen and (max-width: 767px) { .bl__details__inner .blog__content { padding-left: 50px; } .bl__details__inner .blog__content blockquote { margin: 61px 9px 40px; } .bl__details__inner .blog__content p { font-size: 14px; line-height: 26px; } } @media only screen and (max-width: 575px) { .bl__details__inner .blog__content blockquote { margin: 61px 0 40px; } .bl__details__inner .blog__content blockquote::before { left: -64px; } .bl__details__inner .blog__content .author .author_info h6 { font-size: 21px; } } @media only screen and (max-width: 479px) { .bl__details__inner .blog__content { padding-left: 0; } .bl__details__inner .blog__content blockquote { font-size: 16px; margin: 61px 25px 40px; } .bl__details__inner .blog__content blockquote::before { left: -41px; } } /*----------------- Footer Styles --------------------*/ .footer__top { padding: 100px 0 90px; } .single__wedget .content p { color: #eef3f6; font-size: 16px; line-height: 27px; margin-bottom: 0; margin-top: 33px; } .single__wedget .ft__title { color: #eef3f6; font-size: 24px; line-height: 40px; margin-bottom: 10px; padding-bottom: 12px; position: relative; } .single__wedget .ft__title::before { background: #65788c none repeat scroll 0 0; bottom: 0; content: ""; height: 1px; left: 0; position: absolute; width: 170px; } .single__wedget .ft__contact__link { list-style: outside none none; margin: 0; padding: 0; } .single__wedget .ft__contact__link li a { color: #eef3f6; font-size: 14px; line-height: 42px; transition: 0.3s; } .single__wedget .ft__contact__link li a:hover { color: #bd4e45; } .copyright { padding: 28px 0; } .copyright .copyright__inner p { color: #62b1de; margin: 0; } .social-icon { display: flex; justify-content: flex-end; list-style: outside none none; margin: 0; padding: 0; } .social-icon li a { background: #02335b none repeat scroll 0 0; border-radius: 100%; display: block; font-size: 22px; height: 40px; line-height: 40px; text-align: center; width: 40px; transition: 0.3s; } .social-icon li a:hover { background: #e05941; } .social-icon li a i { background: -webkit-linear-gradient(#f9c3bc, #e46b56); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .social-icon li + li { margin-left: 30px; } .footer--2 .single__wedget .ft__title { color: #010f54; } .footer--2 .single__wedget .content p, .footer--2 .single__wedget .ft__contact__link li a { color: #035f91; } .footer--2 .single__wedget .ft__contact__link li a:hover { color: #bd4e45; } .footer--2 .single__wedget .ft__title::before { background: #c7d8de none repeat scroll 0 0; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .single__wedget .ft__title::before { width: 140px; } } @media only screen and (max-width: 575px) { .copyright .copyright__inner p { text-align: center; } .social-icon { display: flex; justify-content: center; } .ft__social__link { padding-top: 15px; } a#scrollUp { right: 14px; } } /*# sourceMappingURL=style.css.map */ .flex { display: flex; display: -moz-flex; display: -webkit-flex; display: -ms-flex; display: flex } .justify-space-between { -moz-justify-content: space-between; -webkit-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between } .justify-content-center { justify-content: center } .justify-content-start { justify-content: start } .justify-content-end { justify-content: flex-end } .justify-content-around { justify-content: space-around } .flex-wrap { flex-wrap: wrap } .nav-container { position: relative } .nav-top-container { border-bottom: 1px solid rgba(0,0,0,.06) } .nav-top { width: 100%; display: block; float: left; padding: 5px 0; padding-top: 4px; color: #fff ; } .nav-top ul { padding: 0; margin: 0 } .nav-top>ul>li { list-style: none; float: left; height: 24px } .nav-top .li-dark-mode-sw button { width: auto!important; padding: 0 10px!important; position: relative; top: 1px } .nav-top ul li a { padding: 4px 10px!important; line-height: 24px; color: #666 } .nav-top ul li .span-sep { padding: 6px 0; line-height: 24px } .nav-top ul li .image-profile-drop { padding: 0 10px!important } .nav-top .left { float: left; } .nav-top .right { float: right } .search-icon { font-size: 17px!important; display: block; cursor: pointer; border-radius: 2px; text-align: center; margin-left: 0!important; margin-top: -1px!important; padding-right: 5px!important } .modal-search { display: none; background: #FFF; position: absolute; width: 100%; z-index: 999999; box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05); -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05); -webkit-transition: .50s; transition: .50s; transition: all .2s ease-in-out 0s; right: 15px; top: 100px } .modal-search .container { position: relative } .modal-search .s-close { position: absolute; right: 20px; top: 20px; font-size: 13px; cursor: pointer; color: #999; box-shadow: none } .mobile-search-icon { display: none } .search-open .modal-search { display: block } .modal-search .form-control:focus,.modal-search .form-control { background: rgba(0,0,0,0.9) none repeat scroll 0 0; border: medium none; color: #fff; font-size: 14px; height: 64px; padding: 5px 20px; width: 40%; top: 0; right: 0; transition: all .2s ease-in-out 0s; position: absolute; border-radius: 0!important; box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05) } .search-active .modal-search { box-shadow: none; -webkit-box-shadow: none; border-color: #e0e0e0 } .contact-item{ color:#eef3f6 } .widget-newsletter input[name='url'],.modal-newsletter input[name='url'] { display: none!important } .newsletter { width: 100%; max-width: 100%; overflow: hidden; margin-top: 5px; font-size: 13px; position: relative; display: flex; align-items: center } .newsletter input { width: 100%; font-size: 13px; line-height: 18px; background: #2d2e30; border: 1px solid transparent; border-right: 0!important; outline: none!important; color: #ccc; height: 38px; padding: 10px 20px; box-shadow: none; border-radius: 3px 0 0 3px } .newsletter .newsletter-button { height: 38px; padding: 6px 14px; border-radius: 0 3px 3px 0; line-height: 1.5; outline: none!important; font-size: 14px; border: 0; color: #fff; -moz-transition: .2s; -webkit-transition: .2s; transition: .2s; white-space: nowrap } .newsletter .newsletter-button:hover { opacity: .8 } .modal-newsletter .modal-dialog { max-width: 650px } .modal-newsletter .modal-content { border-radius: 0 } .modal-newsletter .modal-body { padding: 50px } .modal-newsletter .modal-body .close { display: inline-block; padding: 6px; color: #777; opacity: 1!important; position: absolute; top: 5px; right: 5px; font-size: 11px; width: 34px; height: 34px } .modal-newsletter .modal-title { text-align: center; text-transform: uppercase; font-size: 20px; font-weight: 700; letter-spacing: 2px; margin: 0 0 15px } .modal-newsletter .modal-desc { line-height: 26px; text-align: center; margin-bottom: 20px; color: #6c757d } .modal-newsletter .form-input { background-color: #f8f8f8; height: 40px; line-height: 40px; border-radius: 0!important } .modal-newsletter .form-input:focus { border-color: #cfcfcf } .modal-newsletter .btn { padding: 7px 30px!important; line-height: 26px; border-radius: 0!important; color: #fff!important; border: 0!important; white-space: nowrap } .modal-newsletter .btn:hover { opacity: .9 } .modal-newsletter .modal-newsletter-inputs { position: relative; display: flex; align-items: center } .modal-newsletter .text-close { background-color: transparent!important; border: 0!important; box-shadow: none!important; margin: 0!important; padding: 0!important; text-decoration: underline; color: #6c757d } .modal-newsletter .text-close:hover { color: #555 } .newsletter .newsletter-button{background-color: #e05941;border: 1px solid #e05941} .cookies-warning { background-color: #fafafc; border-radius: 2px; bottom: 18px; left: 20px; opacity: 0.9; position: fixed; width: 400px; max-width: 100%; z-index: 9999; border: 1px solid #e5e5e8; } .cookies-warning .text { font-size: 13px; padding: 24px 18px; color: #333; line-height: 24px; } .cookies-warning .icon-cl { cursor: pointer; padding: 8px; position: absolute; font-size: 12px; right: 1px; top: -5px; color: #7b7b7b !important; }