CHIEFSOFT\ameye
720 lines
13 KiB
CSS
720 lines
13 KiB
CSS
/* ***** Global ***** */
|
|
:root {
|
|
--lqd-container-width: 1220px;
|
|
--lqd-container-width-md: 100%;
|
|
--lqd-container-width-sm: 100%;
|
|
--lqd-row-gutter-x: 0;
|
|
--lqd-row-gutter-y: 0;
|
|
|
|
--lqd-color-primary: #000000;
|
|
--lqd-body-text-color: #000000;
|
|
--lqd-color-accent: #f7fd92;
|
|
--lqd-color-dark: #1A1D21;
|
|
--lqd-badge-color: rgba(255, 255, 255, 0.678);
|
|
--lqd-color-gray-500: #6b7280;
|
|
|
|
--lqd-body-font-family: 'Be Vietnam Pro', sans-serif;
|
|
--lqd-body-font-size: 13px;
|
|
--lqd-body-line-height: 1.23em;
|
|
|
|
--lqd-accent-font-family: 'Playfair Display', serif;
|
|
--lqd-accent-font-weight: 400;
|
|
|
|
--lqd-heading-font-family: 'Space Grotesk', sans-serif;
|
|
--lqd-heading-font-weight: 700;
|
|
--lqd-heading-line-height: 1em;
|
|
--lqd-heading-color: var(--lqd-color-primary);
|
|
--lqd-h1-font-size: 55px;
|
|
--lqd-h2-font-size: 42px;
|
|
--lqd-h2-letter-spacing: -0.8px;
|
|
--lqd-h3-font-size: 32px;
|
|
--lqd-h3-line-height: 1.31em;
|
|
--lqd-h3-letter-spacing: -0.4px;
|
|
--lqd-h4-font-size: 29px;
|
|
--lqd-h4-letter-spacing: -0.4px;
|
|
--lqd-h5-font-size: 20px;
|
|
--lqd-h5-line-height: 1.2em;
|
|
--lqd-h6-font-family: var(--lqd-body-font-family);
|
|
--lqd-h6-font-size: 14px;
|
|
--lqd-h6-font-weight: 500;
|
|
--lqd-h6-line-height: 1.2em;
|
|
|
|
--lqd-cc-size-inner: 25px;
|
|
--lqd-cc-bg: #fff;
|
|
--lqd-cc-active-bw: 1px;
|
|
--lqd-cc-active-bg: #fff;
|
|
--lqd-cc-active-bc: #fff;
|
|
--lqd-cc-active-circle-txt: #000;
|
|
--lqd-cc-blend-mode: difference;
|
|
}
|
|
|
|
/* ***** Button ***** */
|
|
button,
|
|
input[type="button"],
|
|
input[type="submit"],
|
|
.button {
|
|
font-family: var(--lqd-heading-font-family);
|
|
}
|
|
|
|
/* ***** Lity Modal ***** */
|
|
.lity-modal .lqd-contact-form {
|
|
--inputs-margin: 0 0 30px 0;
|
|
--input-margin-bottom: 30px;
|
|
}
|
|
|
|
.lity-modal h2 span {
|
|
font-family: 'DM Serif Text', serif;
|
|
font-style: italic;
|
|
}
|
|
|
|
@media (max-width: 1199px) {
|
|
.lity-modal .ld-fancy-heading h2 {
|
|
font-size: 48px;
|
|
line-height: 1em;
|
|
}
|
|
|
|
.lity-modal .module-content {
|
|
padding: 10px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 767px) {
|
|
.lity-modal .container {
|
|
padding: 30px 15px;
|
|
}
|
|
|
|
.lity-modal .module-info,
|
|
.lity-modal .module-form {
|
|
margin-top: 30px;
|
|
}
|
|
|
|
.lity-modal .ld-fancy-heading h2 {
|
|
font-size: 34px;
|
|
}
|
|
}
|
|
|
|
/* ***** Main Header ***** */
|
|
.main-header .main-nav {
|
|
--lqd-menu-items-top-padding: 16px;
|
|
--lqd-menu-items-right-padding: 40px;
|
|
--lqd-menu-items-bottom-padding: 16px;
|
|
--lqd-menu-items-left-padding: 40px;
|
|
}
|
|
|
|
.main-header .ld-module-sd .main-nav {
|
|
--lqd-menu-items-top-padding: 0;
|
|
--lqd-menu-items-right-padding: 0;
|
|
--lqd-menu-items-bottom-padding: 60px;
|
|
--lqd-menu-items-left-padding: 0;
|
|
}
|
|
|
|
.module-mobile-nav .main-nav {
|
|
--lqd-menu-items-top-padding: 0;
|
|
--lqd-menu-items-right-padding: 0;
|
|
--lqd-menu-items-bottom-padding: 40px;
|
|
--lqd-menu-items-left-padding: 0;
|
|
}
|
|
|
|
.module-mobile-nav .ld-module-dropdown {
|
|
width: 80vw;
|
|
}
|
|
|
|
.module-mobile-nav .module-col-inner {
|
|
padding: 35px;
|
|
}
|
|
|
|
.module-mobile-nav .lqd-menu-counter-right li a {
|
|
font-size: 24px;
|
|
}
|
|
|
|
@media (min-width: 1200px) and (max-width: 1400px) {
|
|
.main-header .main-nav {
|
|
--lqd-menu-items-right-padding: 20px;
|
|
--lqd-menu-items-left-padding: 20px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 1199px) {
|
|
.main-header .module-logo {
|
|
padding: 20px 0;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 767px) {
|
|
.main-header .ld-module-sd .main-nav {
|
|
--lqd-menu-items-bottom-padding: 25px;
|
|
}
|
|
|
|
.module-mobile-nav .lqd-menu-counter-right li a {
|
|
font-size: 17px;
|
|
}
|
|
|
|
.main-header .module-header {
|
|
padding: 20px 20px 0;
|
|
}
|
|
|
|
.main-header .ld-module-sd .module-social {
|
|
bottom: 30px;
|
|
}
|
|
}
|
|
|
|
/* ***** Stickybar Right ***** */
|
|
.main-header .lqd-stickybar-right {
|
|
padding: 0 0 7% 0;
|
|
}
|
|
|
|
/* ***** Stickybar Left ***** */
|
|
.main-header .lqd-stickybar-left {
|
|
padding: 6% 2% 6% 0;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.lqd-stickybar-wrap .ld-module-sd>.nav-trigger {
|
|
transform: rotate(-90deg);
|
|
}
|
|
|
|
/* ***** Sidebar Left ***** */
|
|
.main-header .lqd-stickybar-left .ld-module-sd>.ld-module-dropdown {
|
|
width: 55vw;
|
|
}
|
|
|
|
.main-header .ld-sd-wrap {
|
|
padding: 0;
|
|
}
|
|
|
|
.main-header .ld-module-sd .main-nav>li:hover>a,
|
|
.main-header .ld-module-sd .main-nav>li.is-active>a,
|
|
.navbar-fullscreen .main-header .ld-module-sd .main-nav>li>a:hover {
|
|
color: #184341;
|
|
}
|
|
|
|
.main-header .main-nav>li>a>.link-icon {
|
|
font-size: 0.7em;
|
|
}
|
|
|
|
@media (max-width: 1199px) {
|
|
.main-header .module-left-side {
|
|
padding: 100px 50px 50px 50px;
|
|
flex-direction: row;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 767px) {
|
|
.main-header .ld-module-sd>.ld-module-dropdown {
|
|
width: 80vw;
|
|
}
|
|
|
|
.main-header .module-left-side {
|
|
flex-direction: column;
|
|
padding: 35px;
|
|
}
|
|
|
|
.main-header .module-left-side .lqd-fancy-menu {
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
.main-header .module-left-side .main-nav a {
|
|
font-size: 24px;
|
|
--lqd-menu-items-top-padding: 0;
|
|
--lqd-menu-items-right-padding: 0;
|
|
--lqd-menu-items-bottom-padding: 40px;
|
|
--lqd-menu-items-left-padding: 0;
|
|
}
|
|
}
|
|
|
|
/* ***** Mobile Header ***** */
|
|
.main-header .navbar-collapse {
|
|
flex: 1 auto;
|
|
overflow: visible;
|
|
height: auto;
|
|
}
|
|
|
|
/* ***** Banner ***** */
|
|
.banner .lqd-vslider-ext h2 {
|
|
font-size: 55px;
|
|
}
|
|
|
|
.banner .lqd-vslider .lqd-extra-cursor {
|
|
background-color: rgba(255, 4, 4, 0.85);
|
|
}
|
|
|
|
.banner .lqd-vslider-scrn {
|
|
height: calc(100vh - 120px);
|
|
}
|
|
|
|
@media (max-width: 1199px) {
|
|
.banner .lqd-vslider-ext .d-flex {
|
|
padding-inline-end: 20%;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 992px) {
|
|
.lqd-vslider-ext li {
|
|
top: 0;
|
|
inset-inline-start: 0;
|
|
padding: 5.5rem 4rem 1rem;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 767px) {
|
|
.banner {
|
|
padding: 20px 20px 0 20px;
|
|
}
|
|
|
|
.banner .ld-fancy-heading h2 {
|
|
font-size: 50px;
|
|
}
|
|
}
|
|
|
|
/* ***** Clients ***** */
|
|
@media (max-width: 1199px) {
|
|
.clients {
|
|
padding: 50px 20px 40px 20px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 767px) {
|
|
.clients {
|
|
padding-top: 40px;
|
|
}
|
|
|
|
.clients .module-img {
|
|
margin-bottom: 20px;
|
|
}
|
|
}
|
|
|
|
/* ***** Our Services ***** */
|
|
.our-services .module-img-3 {
|
|
inset-inline-start: 25%;
|
|
}
|
|
|
|
@media (max-width: 1199px) {
|
|
.our-services {
|
|
padding-inline-end: 20px;
|
|
padding-inline-start: 20px;
|
|
}
|
|
}
|
|
|
|
@media (min-width: 768px) {
|
|
.our-services .ld-fancy-heading h3 {
|
|
padding-inline-end: 10px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 767px) {
|
|
.our-services {
|
|
padding-top: 20px;
|
|
padding-bottom: 40px;
|
|
}
|
|
|
|
.our-services .module-img-3 img {
|
|
width: 170px;
|
|
}
|
|
|
|
.our-services .module-col {
|
|
margin-bottom: 140px;
|
|
}
|
|
|
|
.our-services .module-img-1 {
|
|
width: 40%;
|
|
}
|
|
|
|
.our-services .module-img-2 {
|
|
width: 45%;
|
|
}
|
|
}
|
|
|
|
/* ***** Solutions ***** */
|
|
@media (max-width: 1199px) {
|
|
.solutions {
|
|
padding-top: 80px;
|
|
padding-inline-end: 20px;
|
|
padding-inline-start: 20px;
|
|
}
|
|
|
|
.solutions .module-title h2 {
|
|
margin: 15px 0 30px 0;
|
|
}
|
|
|
|
.solutions .module-box {
|
|
gap: 30px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 767px) {
|
|
.solutions {
|
|
padding-top: 40px;
|
|
padding-bottom: 90px;
|
|
}
|
|
|
|
.solutions .module-title {
|
|
padding-bottom: 6%;
|
|
}
|
|
|
|
.solutions .module-title h2 {
|
|
margin: 5px 0 10px 0;
|
|
}
|
|
}
|
|
|
|
/* ***** Section Dark ***** */
|
|
@media (max-width: 767px) {
|
|
.section-dark {
|
|
padding: 80px 20px;
|
|
}
|
|
}
|
|
|
|
/* ***** Our Vision ***** */
|
|
.our-vision .lqd-throwable-scene {
|
|
height: 73vh;
|
|
}
|
|
|
|
.our-vision .lqd-throwable-scene .module-float-1 span {
|
|
background-color: #d5d5d5;
|
|
}
|
|
|
|
.our-vision .lqd-throwable-scene .module-float-2 span {
|
|
background-color: #e1e3e8;
|
|
}
|
|
|
|
.our-vision .lqd-throwable-scene .module-float-3 span {
|
|
background-color: #c7d0c1;
|
|
}
|
|
|
|
.our-vision .lqd-throwable-scene .module-float-4 span {
|
|
background-color: #d9f8ea;
|
|
}
|
|
|
|
.our-vision .lqd-throwable-scene .module-float-5 span {
|
|
background-color: #c7d0c1;
|
|
}
|
|
|
|
.our-vision .lqd-throwable-scene .module-float-6 span {
|
|
background-color: #d9eef8;
|
|
}
|
|
|
|
.our-vision .lqd-throwable-scene .module-float-7 span {
|
|
background-color: #d9f8f1;
|
|
}
|
|
|
|
.our-vision .lqd-throwable-scene .module-float-8 span {
|
|
background-color: #f8f8d9;
|
|
}
|
|
|
|
.our-vision>.pos-abs {
|
|
inset-inline-start: 0px;
|
|
}
|
|
|
|
@media (max-width: 767px) {
|
|
.our-vision .lqd-text-reveal-el {
|
|
font-size: 12vw;
|
|
}
|
|
}
|
|
|
|
/* ***** Case Studies ***** */
|
|
.case-studies .liquid-filter-items {
|
|
margin-bottom: 35px;
|
|
}
|
|
|
|
.case-studies .filter-list li,
|
|
.case-studies .lqd-filter-dropdown .ui-button {
|
|
color: #4d4d4d;
|
|
}
|
|
|
|
.case-studies .filter-list li.active,
|
|
.case-studies .filter-list li.hover,
|
|
.case-studies .lqd-filter-dropdown .ui-button:active,
|
|
.case-studies .lqd-filter-dropdown .ui-button:focus {
|
|
color: #000000;
|
|
}
|
|
|
|
.case-studies .lqd-pf-item:hover .lqd-pf-overlay-bg {
|
|
opacity: 0;
|
|
}
|
|
|
|
@media (max-width: 1199px) {
|
|
.case-studies .module-title {
|
|
padding-inline-start: 30px;
|
|
}
|
|
|
|
.case-studies .module-col {
|
|
padding-inline-end: 30px;
|
|
padding-inline-start: 30px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 767px) {
|
|
.case-studies .col-12>.d-flex .ld-fancy-heading:first-child h2 {
|
|
font-size: 14vw;
|
|
}
|
|
|
|
.case-studies .col-12>.d-flex h2 {
|
|
font-size: 13vw;
|
|
}
|
|
}
|
|
|
|
/* ***** Services ***** */
|
|
.services .lqd-counter-element {
|
|
font-family: var(--lqd-heading-font-family);
|
|
}
|
|
|
|
.services .accordion-item.active .accordion-expander {
|
|
color: #ffffff;
|
|
background-color: #000000;
|
|
border-color: #000000;
|
|
}
|
|
|
|
.services .accordion-title a {
|
|
border-color: #707070;
|
|
}
|
|
|
|
.services .accordion-item.active .accordion-title a {
|
|
border-color: transparent;
|
|
}
|
|
|
|
.services .lqd-counter-element {
|
|
font-size: 170px;
|
|
}
|
|
|
|
@media (min-width: 1199px) {
|
|
.services .lqd-counter-element {
|
|
font-size: 220px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 1199px) {
|
|
.services .module-col {
|
|
padding-inline-end: 45px;
|
|
padding-inline-start: 45px;
|
|
}
|
|
|
|
.services .module-title {
|
|
padding-inline-start: 20px;
|
|
}
|
|
|
|
.services .module-btn {
|
|
padding-inline-end: 20px;
|
|
}
|
|
|
|
.services .module-content {
|
|
padding-inline-end: 20px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 767px) {
|
|
.services .module-title {
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.services .module-btn {
|
|
padding-inline-start: 20px;
|
|
}
|
|
|
|
.services .module-col {
|
|
padding: 0 20px 30px 20px;
|
|
}
|
|
|
|
.services .accordion-title a {
|
|
font-size: 24px;
|
|
line-height: 1.1em;
|
|
}
|
|
|
|
.services .accordion-expander {
|
|
font-size: 20px;
|
|
width: 45px;
|
|
height: 45px;
|
|
}
|
|
|
|
.services span.ld-fh-element {
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
|
|
/* ***** Section Flow ***** */
|
|
.section-flow {
|
|
min-height: 655px;
|
|
}
|
|
|
|
.section-flow .lqd-section-flow-panel-end {
|
|
padding: 13% 6%;
|
|
}
|
|
|
|
.section-flow .lqd-section-flow-panel-end .lqd-section-flow-item {
|
|
padding-top: 20%;
|
|
padding-bottom: 20%;
|
|
}
|
|
|
|
@media (max-width: 767px) {
|
|
.section-flow .lqd-section-flow-panel-end .lqd-section-flow-item {
|
|
padding-top: 45px;
|
|
padding-bottom: 45px;
|
|
}
|
|
}
|
|
|
|
/* ***** Testimonials ***** */
|
|
.testimonials .divider {
|
|
--divider-border-style: solid;
|
|
--divider-color: #FFFFFF26;
|
|
--divider-border-width: 1px;
|
|
--divider-element-spacing: 20px;
|
|
}
|
|
|
|
.testimonials .lqd-carousel-slides {
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.testimonials .carousel-nav .flickity-button {
|
|
width: 26px;
|
|
height: 26px;
|
|
color: #ffffff;
|
|
border-color: #3b3d3f;
|
|
background: #3b3d3f;
|
|
padding: 0;
|
|
}
|
|
|
|
.testimonials .carousel-nav .flickity-button svg {
|
|
fill: #ffffff;
|
|
}
|
|
|
|
.testimonials .carousel-dots {
|
|
top: auto;
|
|
bottom: 0px;
|
|
inset-inline-end: 0px;
|
|
inset-inline-start: 0;
|
|
}
|
|
|
|
.testimonials .lqd-carousel-slides-numbers {
|
|
color: #ffffff;
|
|
}
|
|
|
|
.testimonials .carousel-dots-mobile.carousel-dots-mobile-outside .flickity-page-dots {
|
|
margin-top: 1.5em;
|
|
}
|
|
|
|
.testimonials .flickity-page-dots .dot {
|
|
background-color: rgba(255, 255, 255, 0.14);
|
|
}
|
|
|
|
.testimonials .carousel-dots-mobile .flickity-page-dots .dot.is-selected {
|
|
background-color: #ffffff;
|
|
}
|
|
|
|
/* ***** Clients Carousel ****** */
|
|
@media (max-width: 1199px) {
|
|
.clients-carousel .carousel-item {
|
|
padding-inline-start: 10px;
|
|
padding-inline-end: 10px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 767px) {
|
|
.clients-carousel .carousel-item {
|
|
width: calc(100% / 1.5);
|
|
}
|
|
}
|
|
|
|
/* ***** Bolg ***** */
|
|
.blog .lqd-lp-style-21 h2.lqd-lp-title {
|
|
font-size: 21px;
|
|
}
|
|
|
|
.blog .lqd-lp .lqd-lp-content-bg,
|
|
.blog .lqd-lp .lqd-lp-img .lqd-overlay {
|
|
background-color: rgba(66, 46, 46, 0.16);
|
|
}
|
|
|
|
@media (max-width: 1199px) {
|
|
.blog {
|
|
padding-inline-end: 20px;
|
|
padding-inline-start: 20px;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 768px) {
|
|
.blog .lqd-lp-style-21 .lqd-lp-img {
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 767px) {
|
|
.blog {
|
|
padding-bottom: 20px;
|
|
}
|
|
|
|
.blog .row:first-child .col-12:first-child {
|
|
margin-bottom: 20px;
|
|
}
|
|
}
|
|
|
|
/* ***** Contact ***** */
|
|
.contact .lqd-contact-form {
|
|
--inputs-margin: 0 0 25px 0;
|
|
--input-margin-bottom: 25px;
|
|
}
|
|
|
|
.lqd-contact-form select:focus,
|
|
.lqd-contact-form input:focus,
|
|
.lqd-contact-form textarea:focus,
|
|
.lqd-contact-form .ui-button.ui-selectmenu-button:focus {
|
|
outline: none;
|
|
border-color: #000000;
|
|
color: #000000;
|
|
}
|
|
|
|
.contact input[type=submit] {
|
|
height: 40px;
|
|
border: 2px solid;
|
|
}
|
|
|
|
@media (max-width: 1199px) {
|
|
.contact {
|
|
padding-inline-end: 20px;
|
|
padding-inline-start: 20px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 767px) {
|
|
.contact .module-content {
|
|
margin-bottom: 30px;
|
|
}
|
|
}
|
|
|
|
/* ***** FOOTER ***** */
|
|
.main-footer .divider {
|
|
--divider-border-style: solid;
|
|
--divider-color: rgba(255, 255, 255, 0.12);
|
|
--divider-border-width: 1px;
|
|
}
|
|
|
|
.main-footer .social-icons-wrapper {
|
|
--grid-template-columns: repeat(0, auto);
|
|
--justify-content: center;
|
|
--grid-column-gap: 40px;
|
|
--content-width: 100%;
|
|
}
|
|
|
|
.main-footer .module-menu .link-badge {
|
|
font-size: 10px;
|
|
letter-spacing: 1px;
|
|
}
|
|
|
|
@media (max-width: 1199px) {
|
|
.main-footer {
|
|
padding-inline-end: 20px;
|
|
padding-inline-start: 20px;
|
|
}
|
|
|
|
.main-footer .module-menu .module-col {
|
|
margin-top: 15px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 767px) {
|
|
.main-footer .module-top .module-col {
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
.main-footer .module-info .module-col {
|
|
margin-bottom: 20px;
|
|
}
|
|
} |