@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap'); /* font "Montserrat": - : Use a value from 100 to 900 - : Use a unique and descriptive class name .montserrat- { font-family: "Montserrat", sans-serif; font-optical-sizing: auto; font-weight: ; font-style: normal; } */ /* font "Roboto": - : Use a value from 100 to 900 - : Use a unique and descriptive class name .roboto- { font-family: "Roboto", sans-serif; font-optical-sizing: auto; font-weight: ; font-style: normal; font-variation-settings: "wdth" 100; } */ :root { /* font */ --ff-main: "Montserrat", sans-serif; --ff-base: "Roboto", sans-serif; --ff-secondary: "Roboto", sans-serif; /* font color base-set */ --color-base-1: #3D5167; --color-base-2: #ffffff; --color-base-3: #EBF2FA; --color-base-4: #D7E5F5; --color-base-5: #F5F9FD; --color-base-6: #F5F9FD; /* font color opacity-set */ --color-base-1-opt-50: rgba(0, 0, 0, 0.5); --color-base-1-opt-10: rgba(37, 37, 37, 0.1); --color-base-2-opt-10: rgba(255, 255, 255, 0.1); /* font color main-set */ --color-main: #5C89BB; --color-special: #3D5167; /* font color gradient-set */ /* --gradient-text: linear-gradient(90deg, #d4d4d4 0%, #202020 100%); */ /* bg color base-set */ /* --bg-color-base-1: #151515; */ /* --bg-color-base-2: #ffffff; */ /* --bg-color-base-3: #252525; */ --bg-color-base-1: #3D5167; --bg-color-base-2: #ffffff; --bg-color-base-3: #EBF2FA; --bg-color-base-4: #D7E5F5; --bg-color-base-5: #F5F9FD; --bg-color-base-6: #F5F9FD; /* bg color main-set */ --bg-color-main: #5C89BB; --bg-color-special: #3D5167; /* bg color gradient-set */ /* --bg-gradient-base-1: linear-gradient(90deg, #d4d4d4 0%, #202020 100%); */ /* --bg-gradient-base-2: linear-gradient(270deg, #d4d4d4 0%, #202020 100%); */ /* BTN // coloring-set */ --btn-color-base-1: #000000; --btn-color-base-2: #ffffff; --btn-bg-color-1: #5C89BB; --btn-bg-color-1-hover: #63A0E5; --btn-bg-color-2: #fff; --btn-bg-color-2-hover: #E9C076; --btn-bg-gradient-1: linear-gradient(-90deg, #EECE99 0%, #AE8450 100%); --btn-bg-gradient-1-hover: linear-gradient(90deg, #EECE99 0%, #AE8450 100%); /* Cookie // coloring-set */ --cookie-color-main: #346092; --cookie-color-base-1: #1e1e1e; --cookie-color-base-2: #ffffff; /* --cookie-gradient-text: linear-gradient(90deg, #d4d4d4 0%, #202020 100%); */ --cookie-bg-color-main: #346092; --cookie-bg-color-base-1: #1e1e1e; --cookie-bg-color-base-2: #ffffff; /* --cookie-bg-gradient: linear-gradient(90deg, #d4d4d4 0%, #202020 100%); */ --cookie-shadow: #000000; /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ --fz-h1: 32px; --fz-h1-not-front: 32px; --fz-h2: 24px; --fz-h2-not-front: 24px; --fz-h3: 20px; --fz-h3-not-front: 20px; /* --fz-h2-stages-title: 24px; */ --fz-h3-benefits-title: 20px; --fz-h3-service-title: 20px; --fz-h3-stages-title: 20px; --fz-h3-catalog-title: 16px; --fz-slider-title: 31px; --fz-slider-subtitle: 20px; --fz-h1-subtitle: 16px; --fz-h2-subtitle: 16px; /* --fz-label-block: 20px; */ --fz-nav-title: 20px; --fz-nav-head: 16px; --fz-nav-menu: 16px; --fz-nav-foot: 16px; --fz-btn: 15px; --fz-btn-small: 15px; --fz-more: 16px; --fz-more-link: 16px; --fz-search: 16px; --fz-big: 18px; --fz-base: 16px; --fz-small: 16px; --fz-about-text: 20px; --fz-form-title: 24px; --fz-form-subtitle: 20px; --fz-form-text: 16px; --fz-form-field-label: 20px; --fz-form-input: 16px; --fz-form-placeholder: 16px; --fz-form-cheakbox: 14px; --fz-form-btn: 15px; --fz-form-title-Modal: 20px; --fz-cookie-title: 16px; --fz-cookie-text: 14px; --fz-cookie-btn: 14px; --fz-cookie-small-text: 14px; } /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) { :root { --fz-h1: 40px; --fz-h1-not-front: 40px; --fz-h2: 35px; --fz-h2-not-front: 35px; --fz-h3: 23px; --fz-h3-not-front: 23px; --fz-h2-benefits-title: 24px; --fz-h3-service-title: 16px; --fz-h3-catalog-title: 13px; --fz-h1-subtitle: 16px; --fz-h2-subtitle: 16px; --fz-nav-head: 16px; --fz-nav-menu: 16px; --fz-nav-foot: 16px; --fz-btn: 16px; --fz-btn-small: 16px; --fz-more: 16px; --fz-more-link: 16px; --fz-search: 16px; --fz-big: 18px; --fz-base: 16px; --fz-small: 15px; --fz-form-title: 35px; --fz-form-subtitle: 16px; --fz-form-text: 16px; --fz-form-field-label: 18px; --fz-form-input: 16px; --fz-form-placeholder: 16px; --fz-form-cheakbox: 11px; --fz-form-btn: 16px; --fz-form-title-Modal: 20px; --fz-cookie-title: 16px; --fz-cookie-text: 14px; --fz-cookie-btn: 14px; --fz-cookie-small-text: 14px; } } */ @media (max-width: 1199px) { :root { --fz-h1: 28px; --fz-h1-not-front: 28px; --fz-h2: 24px; --fz-h2-not-front: 24px; --fz-h3: 20px; --fz-h3-not-front: 20px; /* --fz-h2-stages-title: 24px; */ --fz-h3-benefits-title: 20px; --fz-h3-service-title: 20px; --fz-h3-stages-title: 20px; --fz-h3-catalog-title: 16px; --fz-slider-title: 26px; --fz-slider-subtitle: 20px; --fz-h1-subtitle: 16px; --fz-h2-subtitle: 16px; /* --fz-label-block: 20px; */ --fz-nav-title: 20px; --fz-nav-head: 16px; --fz-nav-menu: 16px; --fz-nav-foot: 16px; --fz-btn: 15px; --fz-btn-small: 15px; --fz-more: 16px; --fz-more-link: 16px; --fz-search: 16px; --fz-big: 18px; --fz-base: 16px; --fz-small: 16px; --fz-about-text: 20px; --fz-form-title: 24px; --fz-form-subtitle: 20px; --fz-form-text: 16px; --fz-form-field-label: 20px; --fz-form-input: 16px; --fz-form-placeholder: 16px; --fz-form-cheakbox: 14px; --fz-form-btn: 15px; --fz-form-title-Modal: 20px; --fz-cookie-title: 16px; --fz-cookie-text: 14px; --fz-cookie-btn: 14px; --fz-cookie-small-text: 14px; } } @media (max-width: 991px) { :root { --fz-h1: 26px; --fz-h1-not-front: 26px; --fz-h2: 22px; --fz-h2-not-front: 22px; --fz-h3: 20px; --fz-h3-not-front: 20px; /* --fz-h2-stages-title: 24px; */ --fz-h3-benefits-title: 20px; --fz-h3-service-title: 20px; --fz-h3-stages-title: 20px; --fz-h3-catalog-title: 16px; --fz-slider-title: 25px; --fz-slider-subtitle: 20px; --fz-h1-subtitle: 16px; --fz-h2-subtitle: 16px; /* --fz-label-block: 20px; */ --fz-nav-title: 20px; --fz-nav-head: 16px; --fz-nav-menu: 16px; --fz-nav-foot: 16px; --fz-btn: 15px; --fz-btn-small: 15px; --fz-more: 16px; --fz-more-link: 16px; --fz-search: 16px; --fz-big: 18px; --fz-base: 16px; --fz-small: 16px; --fz-about-text: 18px; --fz-form-title: 22px; --fz-form-subtitle: 20px; --fz-form-text: 16px; --fz-form-field-label: 20px; --fz-form-input: 16px; --fz-form-placeholder: 16px; --fz-form-cheakbox: 14px; --fz-form-btn: 15px; --fz-form-title-Modal: 20px; --fz-cookie-title: 16px; --fz-cookie-text: 14px; --fz-cookie-btn: 14px; --fz-cookie-small-text: 14px; } } @media (max-width: 767px) { :root { --fz-h1: 26px; --fz-h1-not-front: 26px; --fz-h2: 22px; --fz-h2-not-front: 22px; --fz-h3: 20px; --fz-h3-not-front: 20px; /* --fz-h2-stages-title: 24px; */ --fz-h3-benefits-title: 20px; --fz-h3-service-title: 20px; --fz-h3-stages-title: 20px; --fz-h3-catalog-title: 16px; --fz-slider-title: 25px; --fz-slider-subtitle: 20px; --fz-h1-subtitle: 16px; --fz-h2-subtitle: 16px; /* --fz-label-block: 20px; */ --fz-nav-title: 20px; --fz-nav-head: 16px; --fz-nav-menu: 16px; --fz-nav-foot: 16px; --fz-btn: 15px; --fz-btn-small: 15px; --fz-more: 16px; --fz-more-link: 16px; --fz-search: 16px; --fz-big: 18px; --fz-base: 16px; --fz-small: 16px; --fz-about-text: 18px; --fz-form-title: 22px; --fz-form-subtitle: 20px; --fz-form-text: 16px; --fz-form-field-label: 18px; --fz-form-input: 16px; --fz-form-placeholder: 16px; --fz-form-cheakbox: 14px; --fz-form-btn: 15px; --fz-form-title-Modal: 20px; --fz-cookie-title: 16px; --fz-cookie-text: 14px; --fz-cookie-btn: 14px; --fz-cookie-small-text: 14px; } } @media (max-width: 575px) { :root { --fz-h1: 25px; --fz-h1-not-front: 25px; --fz-h2: 21px; --fz-h2-not-front: 21px; --fz-h3: 20px; --fz-h3-not-front: 20px; /* --fz-h2-stages-title: 24px; */ --fz-h3-benefits-title: 20px; --fz-h3-service-title: 20px; --fz-h3-stages-title: 20px; --fz-h3-catalog-title: 16px; --fz-slider-title: 24px; --fz-slider-subtitle: 20px; --fz-h1-subtitle: 16px; --fz-h2-subtitle: 16px; /* --fz-label-block: 20px; */ --fz-nav-title: 20px; --fz-nav-head: 16px; --fz-nav-menu: 16px; --fz-nav-foot: 16px; --fz-btn: 15px; --fz-btn-small: 15px; --fz-more: 16px; --fz-more-link: 16px; --fz-search: 16px; --fz-big: 18px; --fz-base: 16px; --fz-small: 16px; --fz-about-text: 16px; --fz-form-title: 21px; --fz-form-subtitle: 18px; --fz-form-text: 16px; --fz-form-field-label: 18px; --fz-form-input: 16px; --fz-form-placeholder: 16px; --fz-form-cheakbox: 14px; --fz-form-btn: 15px; --fz-form-title-Modal: 20px; --fz-cookie-title: 16px; --fz-cookie-text: 14px; --fz-cookie-btn: 14px; --fz-cookie-small-text: 14px; } } @media (max-width: 460px) { :root { --fz-h1: 24px; --fz-h1-not-front: 24px; --fz-h2: 20px; --fz-h2-not-front: 20px; --fz-h3: 20px; --fz-h3-not-front: 20px; /* --fz-h2-stages-title: 24px; */ --fz-h3-benefits-title: 18px; --fz-h3-service-title: 18px; --fz-h3-stages-title: 18px; --fz-h3-catalog-title: 16px; --fz-slider-title: 22px; --fz-slider-subtitle: 18px; --fz-h1-subtitle: 16px; --fz-h2-subtitle: 16px; /* --fz-label-block: 20px; */ --fz-nav-title: 18px; --fz-nav-head: 14px; --fz-nav-menu: 16px; --fz-nav-foot: 14px; --fz-btn: 15px; --fz-btn-small: 15px; --fz-more: 16px; --fz-more-link: 16px; --fz-search: 16px; --fz-big: 16px; --fz-base: 14x; --fz-small: 14px; --fz-about-text: 14px; --fz-form-title: 20px; --fz-form-subtitle: 16px; --fz-form-text: 14px; --fz-form-field-label: 16px; --fz-form-input: 14px; --fz-form-placeholder: 14px; --fz-form-cheakbox: 12px; --fz-form-btn: 15px; --fz-form-title-Modal: 20px; --fz-cookie-title: 14px; --fz-cookie-text: 12px; --fz-cookie-btn: 12px; --fz-cookie-small-text: 12px; } } @media (max-width: 350px) { :root { --fz-h1: 24px; --fz-h1-not-front: 24px; --fz-h2: 20px; --fz-h2-not-front: 20px; --fz-h3: 20px; --fz-h3-not-front: 20px; /* --fz-h2-stages-title: 24px; */ --fz-h3-benefits-title: 18px; --fz-h3-service-title: 18px; --fz-h3-stages-title: 18px; --fz-h3-catalog-title: 16px; --fz-slider-title: 22px; --fz-slider-subtitle: 18px; --fz-h1-subtitle: 16px; --fz-h2-subtitle: 16px; /* --fz-label-block: 20px; */ --fz-nav-title: 18px; --fz-nav-head: 14px; --fz-nav-menu: 16px; --fz-nav-foot: 14px; --fz-btn: 15px; --fz-btn-small: 15px; --fz-more: 16px; --fz-more-link: 16px; --fz-search: 16px; --fz-big: 16px; --fz-base: 14px; --fz-small: 14px; --fz-about-text: 16px; --fz-form-title: 20px; --fz-form-subtitle: 16px; --fz-form-text: 14px; --fz-form-field-label: 16px; --fz-form-input: 14px; --fz-form-placeholder: 14px; --fz-form-cheakbox: 12px; --fz-form-btn: 15px; --fz-form-title-Modal: 20px; --fz-cookie-title: 14px; --fz-cookie-text: 12px; --fz-cookie-btn: 12px; --fz-cookie-small-text: 12px; } } /* MAIN SETTINGS */ body { font-size: var(--fz-base); font-family: var(--ff-base); line-height: 1.25; color: var(--color-base-1); background-color: var(--bg-color-base-2); overflow: auto; overflow-x: hidden; } @media (min-width: 350px) {} @media (min-width: 460px) {} @media (min-width: 576px) { .container { max-width: 576px; } } @media (min-width: 768px) { .container { max-width: 768px; } } @media (min-width: 992px) { .container { max-width: 992px; } } @media (min-width: 1200px) { .container { max-width: 1200px; } } /* @media (min-width: 1400px) { .container { max-width: 1320px; } } */ /* @media (min-width: 1700px) { .container { max-width: 1700px; } } */ div#app { display: flex; flex-direction: column; justify-content: space-between; min-height: 100vh; overflow: hidden; } main#main { flex-grow: 1; } header#header { position: relative; z-index: 50; background-color: rgb(0 0 0 / 40%); /* position: fixed !important; */ position: absolute !important; /* top: 0; */ left: 0; width: 100%; } #header-mob { position: fixed !important; top: 0; z-index: 51 !important; } footer#footer { /* margin-top: 65px; */ /* padding: 30px 0; */ background-color: var(--bg-color-base-3); position: relative; z-index: 50; } .not-front main#main { padding: 150px 0 50px; } .not-front main#main .wr_content { position: relative; /* z-index: 1; */ } .not-front footer#footer { /* border-top: 5px solid var(--color-main); */ } h1, h2, h3, h4, h5, h6 { font-weight: 400; line-height: 1.2; margin-bottom: 0; } h1 {text-transform: none;} h2 {text-transform: uppercase;} h3 {text-transform: none;} h4 {text-transform: none;} h5 {text-transform: none;} h6 {text-transform: none;} h1 {font-family: var(--ff-main);} h2 {font-family: var(--ff-main);} h1 {font-weight: 400;} h2 {font-weight: 700;} h1 {font-size: var(--fz-h1);} h2 {font-size: var(--fz-h2);} h3 {font-size: var(--fz-h3);} .not-front h1 {font-size: var(--fz-h1-not-front);} .not-front h2 {font-size: var(--fz-h2-not-front);} .not-front h3 {font-size: var(--fz-h3-not-front);} .not-front h1 {margin-bottom: 50px;} .not-front h2 {margin-bottom: 20px;} h1 { /* gradient-text */ /* background: var(--gradient-text); -webkit-background-clip: text; -webkit-text-fill-color: transparent; color: #000; */ /* color-text */ color: inherit; } h2 { /* gradient-text */ /* background: var(--gradient-text); -webkit-background-clip: text; -webkit-text-fill-color: transparent; color: #000; */ /* color-text */ color: inherit; } h1 span {color: var(--color-main);} h2 span {color: var(--color-main);} h1.front-h1 { display: flex; align-items: center; justify-content: center; flex-direction: column; text-transform: uppercase; text-align: center; } h1.front-h1 span { font-weight: 800; color: var(--color-main); } .view-header h1 {margin-bottom: 20px; width: 100%;} .view-header h2 {margin-bottom: 50px;} .view-header {margin-bottom: 40px;} .view-header .view-header-inner { display: flex; flex-direction: column; /* align-items: center; */ justify-content: center; gap: 40px; } .view-header .view-header-inner .header-title {display: flex;} .view-header .view-header-inner .header-title h1, .view-header .view-header-inner .header-title h2 {margin-bottom: 0; line-height: 1.4;} .view-header p {margin-bottom: 0;} p.front-h1-subtitle { font-size: var(--fz-h1-subtitle); /* font-style: italic; */ color: inherit; margin-bottom: 0; } p.front-h2-subtitle { font-size: var(--fz-h2-subtitle); /* font-style: italic; */ color: inherit; margin-bottom: 0; } p.front-h1-subtitle span {color: var(--color-special);} p.front-h2-subtitle span {color: var(--color-special);} div#app a.btn { font-family: var(--ff-base); font-size: var(--fz-btn); font-weight: 400; } a, button { transition: all .2s linear; } /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) { div#app { position: relative; inset: 0; top: 0px; } .view-header {margin-bottom: 20px;} .view-header .view-header-inner {gap: 20px;} .view-header h1 {padding: 0 15px;} .not-front main#main { padding: 50px 0 50px; } } @media (max-width: 767px) { .not-front h1 { margin-bottom: 40px; } } @media (max-width: 575px) { /* div#app {top: 65px;} */ .view-header h1 {padding: 0 0px;} } @media (max-width: 460px) { /* div#app {top: 55px;} */ p.front-h2-subtitle {text-align: justify;} .not-front h1 { margin-bottom: 30px; } } @media (max-width: 350px) { /* div#app {top: 45px;} */ } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) {} @media (max-width: 767px) {} @media (max-width: 575px) {} @media (max-width: 460px) {} @media (max-width: 350px) {} /* B L O C K S */ #slider-block, #video-block, #services-block, #catalog-block, .about-block { margin-bottom: 80px; } #stages-block, #benefits-block { margin-bottom: 60px; } #stages-block, #benefits-block, #reviews-block, footer#footer { background-color: var(--bg-color-base-3); color: var(--color-base-1); } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) { } @media (max-width: 767px) { #slider-block, #video-block, #services-block, #catalog-block, .about-block { margin-bottom: 60px; } } @media (max-width: 575px) {} @media (max-width: 460px) { #slider-block, #video-block, #services-block, #catalog-block, .about-block { margin-bottom: 40px; } #stages-block, #benefits-block { margin-bottom: 40px; } } @media (max-width: 350px) {} /* */ #scrollToTop { width: 48px; height: 48px; background: none; text-indent: 0; font-size: 0; border: 0px; outline: 0px; display: flex; bottom: 120px; cursor: pointer; position: fixed; right: 75px; z-index: 1000; transition: 0.2s; padding: 0; border-radius: 5px; overflow: hidden; /* background-color: #f8f7f3a1; */ } #scrollToTop:hover { background-color: #5c89bb; box-shadow: 0 0 20px #5c89bb; transform: scale(1.1); } #scrollToTop img { width: 48px; height: auto; aspect-ratio: 5/5; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } #scrollToTop:hover img { /* transform: translate(-50%, -50%); */ /* overflow: hidden; */ /* border-radius: 55px; */ } @media (max-width: 460px) { #scrollToTop { width: 38px; height: 38px; bottom: 50px; right: 25px; } } /* S L I D E R // Block */ /* в slick.css */ .slick-slide img { display: block; width: 100%; height: auto; min-height: 570px; aspect-ratio: 1920/570; object-fit: cover; opacity: 0.7; } /* в styles.css */ ul.slick-dots { margin: 20px 0; position: absolute; bottom: 0; width: 100%; } ul.slick-dots li button { background: #8e8787; border: 2px solid #8e8787; } ul.slick-dots li button:hover { background-color: var(--color-base-2); border-color: var(--color-base-2); } ul.slick-dots li { box-shadow: 0 0 15px 0px var(--color-base-2); border-radius: 50%; } ul.slick-dots li.slick-active { box-shadow: 0 0 20px 1px var(--color-base-2); } ul.slick-dots li.slick-active button { background-color: var(--color-base-2); box-shadow: 0 0 0px 2px var(--color-base-2); border-color: var(--color-base-1); } button.slick-arrow { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; z-index: 10; background-color: var(--bg-color-base-2-opt-50); border-radius: 50%; } button.slick-arrow::before { border-radius: 50px; } button.slick-arrow:hover::before { box-shadow: 0 0px 6px 0px var(--btn-bg-color-1-hover); /* background-color: var(--btn-bg-color-1-hover); */ background-color: #eeff3980; } button.slick-prev.slick-arrow::before { background-image: url("/sites/all/themes/vesta_theme/image/arrow-top.svg"); transform: rotate(-90deg); /* background-image: url("/sites/all/themes/vesta_theme/image/custom-images/slider/slider-btn-left.svg"); */ } button.slick-next.slick-arrow::before { background-image: url("/sites/all/themes/vesta_theme/image/arrow-top.svg"); transform: rotate(90deg); /* background-image: url("/sites/all/themes/vesta_theme/image/custom-images/slider/slider-btn-right.svg"); */ } @media (max-width: 991px) { button.slick-prev.slick-arrow { left: 10px; } button.slick-next.slick-arrow { right: 10px; } } @media (max-width: 767px) {} @media (max-width: 575px) {} @media (max-width: 460px) { button.slick-prev.slick-arrow, button.slick-next.slick-arrow { display: none !important; } } @media (max-width: 350px) {} /* slider // Block */ div#slider-block .view.view-slayder.view-id-slayder .view-content .views-row .node.node--type-slide { position: relative; } /* slider // Block -> content */ div#slider-block .view.view-slayder.view-id-slayder .view-content .node--type-slide .content { width: 100%; height: 100%; display: flex; align-items: center; gap: 20px; padding-top: 80px; } /* slider // Block -> content -> img */ div#slider-block .field.field--name-field-image.field--type-image.field--label-hidden.field__item { background: var(--bg-color-base-1); } /* slider // Block -> content -> title & subtitle & text */ div#slider-block .view.view-slayder.view-id-slayder .view-content .node--type-slide .content .field.field--name-field-slide-title.field--type-text-long.field--label-hidden.field__item { font-size: var(--fz-slider-title); font-family: var(--ff-main); font-weight: 700; line-height: 1.4; color: var(--color-base-4); text-transform: uppercase; text-align: center; } div#slider-block .view.view-slayder.view-id-slayder .view-content .node--type-slide .content .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item { font-size: var(--fz-slider-subtitle); line-height: 1.4; font-weight: 300; text-align: center; } /* slider // Block -> content -> btn */ div#slider-block .view.view-slayder.view-id-slayder .view-content .node--type-slide .content .field.field--name-field-slide-link.field--type-link.field--label-hidden.field__item a { border: 1px solid var(--color-base-3); /* background-color: #00000040; */ backdrop-filter: blur(5px); color: var(--color-base-2); /* text-decoration: none; */ font-size: var(--fz-btn); padding: 5px 15px; transition: all .5s linear; text-decoration: none; height: 40px; width: 170px; display: flex; justify-content: center; gap: 5px; align-items: center; border-radius: 4px; flex-direction: row-reverse; } div#slider-block .view.view-slayder.view-id-slayder .view-content .node--type-slide .content .field.field--name-field-slide-link.field--type-link.field--label-hidden.field__item a:hover { background-color: var(--btn-bg-color-1-hover); border: 1px solid var(--btn-bg-color-1-hover); transition: all .2s linear; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) {} @media (max-width: 767px) {} @media (max-width: 575px) {} @media (max-width: 460px) {} @media (max-width: 350px) {} /* slider // Block -> custom-nav */ /* === ПРОГРЕСС-БАР === */ /* Скрываем стандартные элементы slick */ .view-content.slick-slider .slick-dots, .view-content.slick-slider .slick-arrow { display: none !important; } div#slider-block { position: relative; } div#slider-block div#block-vesta-theme-slaydnavigaciya .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item { position: absolute; bottom: 20px; width: 100%; } .slider-progress { position: relative; /* display: flex; */ /* gap: 6px; */ width: 100%; height: 4px; background: rgba(255, 255, 255, 0.3); /* фон полоски */ overflow: hidden; } .slider-progress-active { position: absolute; top: 0; left: 0; height: 100%; /* width: 0; задаётся через JS */ background: #fff; /* активный сегмент */ transition: left 0.5s ease; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) {} @media (max-width: 767px) {} @media (max-width: 575px) {} @media (max-width: 460px) {} @media (max-width: 350px) {} /* webkit-scrollbar */ /* div#offcanvasNav .offcanvas-body::-webkit-scrollbar { width: 30px; } div#offcanvasNav .offcanvas-body::-webkit-scrollbar-track { background: #EFDED1; border: 3px solid var(--color-main-hover); } div#offcanvasNav .offcanvas-body::-webkit-scrollbar-thumb { background: #ddb08c; border: 3px solid var(--color-main-hover); } div#offcanvasNav .offcanvas-body::-webkit-scrollbar-button { background: antiquewhite; } */ /* M O R E - L I N K // btn */ /* more-link // btn */ .more-link { display: flex; align-items: center; justify-content: center; margin-top: 40px; width: 100%; } .more-link a { font-weight: 400; font-size: var(--fz-more-link); color: var(--color-base-2); border: 1px solid var(--btn-bg-color-1); border-radius: 4px; text-decoration: none; width: 370px; height: 48px; display: flex; justify-content: center; align-items: center; background-color: var(--btn-bg-color-1); padding: 10px; text-align: center; flex-direction: row-reverse; gap: 5px; } .more-link a:hover { background-color: var(--btn-bg-color-1-hover); border: 1px solid var(--btn-bg-color-1-hover); } .more-link a::before { content: ''; display: block; width: 16px; height: 16px; background-image: url(/sites/all/themes/vesta_theme/image/custom-images/tools/arrow-more.png); background-position: center; background-repeat: no-repeat; background-size: contain; } /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) { } @media (max-width: 991px) {} @media (max-width: 767px) {} @media (max-width: 575px) { .more-link { margin-top: 30px; } } @media (max-width: 460px) {} @media (max-width: 350px) { .more-link a { height: auto; padding: 15px; } } /* P A G E R // all */ /* pager // all -> nav-pager */ nav.pager { margin-top: 15px; } nav.pager ul.pager__items.js-pager__items { margin: 0; padding: 0; list-style-type: none; display: flex; justify-content: center; align-items: center; gap: 10px; font-size: 20px; } nav.pager ul.pager__items.js-pager__items li.pager__item.is-active { font-weight: 700; color: var(--color-main); border-radius: 10px; padding: 7px 10px; } nav.pager ul.pager__items.js-pager__items li.pager__item a { text-decoration: none; font-size: 28px; font-weight: 700; color: var(--color-main); } /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) {} @media (max-width: 767px) {} @media (max-width: 575px) {} @media (max-width: 460px) {} @media (max-width: 350px) {} /* C O O K I E - F U L L // block */ /* cookie - full // block */ main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock { font-family: var(--ff-base); font-size: var(--fz-cookie-text); max-height: 100%; overflow-y: auto; background-color: var(--cookie-bg-color-main); color: var(--color-base); } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper { background-color: transparent; box-shadow: 0 0 0px var(--cookie-shadow); border: 0; padding: 0; max-height: 100%; overflow-y: auto; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .container { padding: 10px 20px 20px; background-color: #fffffff2; box-shadow: 0 0 0px var(--cookie-shadow); display: flex; flex-direction: column; gap: 15px; } /* cookie // Content */ main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .vpa-content { font-size: var(--fz-cookie-text); display: flex; flex-direction: column; align-items: flex-start; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .vpa-content strong { display: flex; position: relative; /* height: 26px; */ align-items: center; color: inherit; font-weight: 700; font-size: var(--fz-cookie-title); } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .vpa-content strong::before { content: ''; display: block; width: 25px; height: 25px; aspect-ratio: 10/10; background-image: url(/sites/all/themes/vesta_theme/image/custom-images/cookies/cookie.svg); background-position: center; background-repeat: no-repeat; background-size: auto; margin-right: 5px; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .vpa-content p { color: inherit; margin-bottom: 10px; font-family: var(--ff-base); font-size: var(--fz-cookie-text); font-weight: 400; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .vpa-content p:first-child { font-weight: 700; margin-bottom: 12px; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .vpa-content p:last-child { margin-bottom: 0px; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .vpa-content a { color: inherit; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .vpa-content a:hover { color: var(--cookie-color-main); } /* cookie // BTNs */ main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .container .vpa-actions { /* width: 100%; */ display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: center; gap: 7px; margin-top: 0; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .container .vpa-actions button.btn { width: auto; height: 32px; padding: 8px 15px; display: flex; align-items: center; justify-content: center; text-transform: uppercase; font-family: var(--ff-base); font-size: var(--fz-cookie-btn); font-weight: 400; border-radius: 6px; line-height: 1; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .container .vpa-actions button#vpa-btn-yes { width: 125px; color: var(--cookie-color-base-1); background-color: var(--cookie-bg-color-base-2); border: 1px solid var(--cookie-bg-color-base-1); } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .container .vpa-actions button#vpa-btn-yes:hover { color: var(--cookie-bg-color-base-2); background-color: var(--cookie-color-main); border-color: var(--cookie-color-main); } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .container .vpa-actions button#vpa-btn-no { width: 140px; color: var(--cookie-bg-color-base-1); background-color: var(--cookie-bg-color-base-2); border: 2px solid var(--cookie-bg-color-base-1); } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .container .vpa-actions button#vpa-btn-no:hover { color: var(--cookie-color-base-2); background-color: var(--cookie-color-main); border-color: var(--cookie-color-main); } /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) { main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .container { display: flex; flex-direction: column; align-items: flex-start; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .container .vpa-actions { width: 100%; display: flex; justify-content: flex-start; } } @media (max-width: 767px) {} @media (max-width: 575px) { main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .vpa-content p { text-align: justify; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .container .vpa-actions { justify-content: center; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .container .vpa-actions button#vpa-btn-yes, main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .container .vpa-actions button#vpa-btn-no { width: 50%; } } @media (max-width: 460px) {} @media (max-width: 350px) { main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .container .vpa-actions { display: flex; flex-direction: column; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .container .vpa-actions button#vpa-btn-yes, main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-full-wrapper .container .vpa-actions button#vpa-btn-no { width: 100%; } } /* C O O K I E - A B B R E V I A T E D // block */ /* cookie - abbreviated // block */ main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock {} main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-short-wrapper { box-shadow: 0 2px 9px rgb(0 0 0 / 15%); border: none; max-height: 100%; overflow-y: auto; background-color: var(--bg-color-main); } /* cookie // Content */ main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-short-wrapper .vpa-content { font-size: var(--fz-cookie-small-text); display: flex; flex-direction: column; align-items: flex-start; color: var(--color-base-2); } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-short-wrapper .vpa-content p { color: inherit; margin-bottom: 10px; font-family: var(--ff-base); font-size: var(--fz-cookie-small-text); font-weight: 400; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-short-wrapper .vpa-content p:first-child { font-weight: 400; margin-bottom: 12px; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-short-wrapper .vpa-content p:last-child { margin-bottom: 0px; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-short-wrapper .vpa-content a { color: inherit; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-short-wrapper .vpa-content a:hover { color: var(--cookie-color-main); } /* cookie // BTNs */ main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-short-wrapper .vpa-actions { /* width: 100%; */ display: flex; justify-content: center; align-items: center; gap: 7px; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-short-wrapper .vpa-actions button.btn { width: auto; height: 32px; padding: 8px 25px; display: flex; align-items: center; justify-content: center; text-transform: uppercase; font-family: var(--ff-base); font-size: var(--fz-cookie-btn); font-weight: 400; border-radius: 6px; line-height: 1; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-short-wrapper .vpa-actions button#vpa-btn-ok { color: var(--cookie-color-base-1); background-color: var(--cookie-bg-color-base-2); border: 1px solid var(--cookie-bg-color-base-1); } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-short-wrapper .vpa-actions button#vpa-btn-ok:hover { color: var(--cookie-bg-color-base-2); background-color: var(--cookie-color-main); border-color: var(--cookie-color-main); } /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) {} @media (max-width: 767px) {} @media (max-width: 575px) { main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-short-wrapper { display: flex; flex-direction: column; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-short-wrapper .vpa-content p { text-align: justify; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-short-wrapper .vpa-actions { width: 100%; } main#main .region.region-content div#block-vesta-theme-vestaprivacyaccessblock div#vpa-short-wrapper .vpa-actions button#vpa-btn-ok { width: 100%; } } @media (max-width: 460px) {} @media (max-width: 350px) {} /* F O R M _ S E A R C H // Block */ /* form-search // Block */ /* form-search // Block -> form */ form[id^="search-api-page-block-form-search"] { display: flex; align-items: center; flex-wrap: wrap; /* gap: 5px; */ flex-direction: row; justify-content: center; border: 3px solid var(--btn-bg-color-1); border-radius: 5px; overflow: hidden; } /* form-search // Block -> form -> input */ form[id^="search-api-page-block-form-search"] .js-form-item.form-item.js-form-type-search.form-type-search { width: 80%; height: 100%; } form[id^="search-api-page-block-form-search"] input[id^="edit-keys"] { width: 100%; height: 50px; background-color: #719ccc; border: 0; transition: all .2s linear; border-radius: 0px; color: var(--color-base-2); } form[id^="search-api-page-block-form-search"] input[id^="edit-keys"]:focus { box-shadow: none; border: 0; } form[id^="search-api-page-block-form-search"] input[id^="edit-keys"]::placeholder { color: var(--color-base-2); } /* form-search // Block -> form -> button */ form[id^="search-api-page-block-form-search"] div[id^="edit-actions"] { width: 20%; height: 50px; /* aspect-ratio: 5/5; */ display: flex; align-items: center; justify-content: center; } form[id^="search-api-page-block-form-search"] div[id^="edit-actions"] button[id^="edit-submit"] { width: 100%; height: 100%; padding: 0; font-size: 0; background-color: var(--bg-color-main); border: none; border-radius: 0; content: ''; display: block; background-image: url(/sites/all/themes/vesta_theme/image/custom-images/tools/search-white.svg); background-repeat: no-repeat; background-position: center; background-size: inherit; } form[id^="search-api-page-block-form-search"] div[id^="edit-actions"] button[id^="edit-submit"]:hover { background-color: var(--btn-bg-color-1-hover); border-radius: 0; } /* S E A R C H // Page */ .not-front main#main form#search-api-page-block-form-search { background-color: var(--bg-color-base-3); border: 1px solid var(--bg-color-base-2); /* border: 0; */ border-radius: 5px; overflow: hidden; display: flex; flex-direction: row; justify-content: space-between; gap: 0px; margin-bottom: 20px; width: 100%; } .not-front main#main form#search-api-page-block-form-search .js-form-item.form-item.js-form-type-search.form-type-search.js-form-item-keys.form-item-keys.form-no-label { width: 90%; height: 100%; } .not-front main#main form#search-api-page-block-form-search .js-form-item.form-item.js-form-type-search.form-type-search.js-form-item-keys.form-item-keys.form-no-label input { width: 100%; height: 50px; } .not-front main#main form#search-api-page-block-form-search div.form-actions { width: 10%; height: 50px; } .not-front main#main form#search-api-page-block-form-search div.form-actions button { width: 100%; height: 100%; } /* search // Page */ .searching-title { font-size: var(--fz-h3-not-front); font-weight: 600; } .searching-title a { color: var(--btn-bg-color-1); text-decoration: none; } .searching-title a:hover { color: var(--btn-bg-color-1-hover); text-decoration: underline; } @media (max-width: 575px) {} @media (max-width: 460px) { .not-front main#main form#search-api-page-block-form-search { display: flex; flex-direction: column; } .not-front main#main form#search-api-page-block-form-search .js-form-item.form-item.js-form-type-search.form-type-search.js-form-item-keys.form-item-keys.form-no-label { border-bottom: 1px solid #fff; width: 100%; } .not-front main#main form#search-api-page-block-form-search div.form-actions { width: 100%; } } @media (max-width: 350px) {} /* H E A D E R S // */ /* ПО УМОЛЧАНИЮ — ВСЕ ХЕДЕРЫ СКРЫТЫ */ /* #header, #header-mob { opacity: 0; transform: translateY(-100%); pointer-events: none; transition: opacity 0.3s ease, transform 0.3s ease; } */ /* КОГДА СКРОЛЛ БЫЛ */ /* body.header-active #header, body.header-active #header-mob { opacity: 1; transform: translateY(0); pointer-events: auto; } */ /* header#header */ /* H E A D E R // Block */ /* header // Block */ .header-top { padding: 10px 0; } .header-bottom { background: var(--bg-gradient-base-1); } /* header // Block -> content */ .header-top .head-inner { display: flex; justify-content: space-between; align-items: center; gap: 20px;/*45*/ } .header-top .head-inner .head-content { display: flex; justify-content: space-between; align-items: center; gap: 15px;/*45*/ } /* header // Block -> img */ header#header .logo { aspect-ratio: 64/82; width: 100%; max-width: 64px; height: auto; } header#header .logo img { width: 100%; height: 100%; /* aspect-ratio: 77/76; */ object-fit: contain; } /* header // Block -> contacts */ /* header // Block -> callback */ header#header .head-inner .head-content .head-feedback {} header#header .head-inner .head-content .head-feedback .col-callback {} header#header .head-inner .head-content .head-feedback .col-callback a { padding: 9px 20px; width: 170px; display: flex; justify-content: center; align-items: center; background: var(--btn-bg-gradient-1); color: var(--bg-color-base-1); border: 2px solid var(--bg-color-base-1); border: 0; font-size: var(--fz-btn); border-radius: 6px; font-weight: 600; } header#header .head-inner .head-content .head-feedback .col-callback a:hover { background: var(--btn-bg-gradient-1-hover); /* color: var(--bg-color-base-1); */ } /* header // Block -> nav-search */ header#header .nav-search { display: flex; align-items: center; justify-content: space-between; gap: 20px; } /* header // Block -> nav-search -> nav */ header#header nav ul.nav { display: flex; flex-direction: row; flex-wrap: nowrap; gap: 25px; /*35*/ } header#header nav ul.nav li a.nav-link { font-size: var(--fz-nav-head); font-weight: 400; color: var(--color-base-2); height: 50px; display: flex; align-items: center; justify-content: center; padding: 0; } header#header nav ul.nav li a.nav-link.is-active { text-decoration: underline; } header#header nav ul.nav li a.nav-link:hover { color: var(--color-base-4); } header#header nav ul.nav li.nav-item:first-child { display: none; } header#header nav ul.nav li.nav-item.dropdown a.dropdown-toggle::after { background-image: url(/sites/all/themes/vesta_theme/image/custom-images/tools/arrow-down.svg); background-repeat: no-repeat; background-position: center; background-size: contain; width: 11px; height: 10px; border: none !important; margin-left: 15px; } header#header nav ul.nav li.nav-item.dropdown ul.dropdown-menu { background-color: var(--color-main); border-radius: 0 0 15px 15px; top: 55px; } header#header nav ul.nav li.nav-item.dropdown ul.dropdown-menu li a.dropdown-item:hover { background-color: var(--color-base-1); color: var(--color-main); } /* header // Block -> nav-search */ header#header .nav-search { display: block; } /* header // Block -> nav-search -> nav-bar */ header#header .nav-bar { display: flex; align-items: center; justify-content: space-between; gap: 20px;/*35*/ } /* header // Block -> nav-search -> nav-bar -> btn Open/Close search */ header#header .nav-bar .btn-search-react {} header#header .btn-search-react button#search-toggle { /* font-size: 0; */ color: var(--color-base-2); /* width: 72px; */ /* height: 22px; */ padding: 0px; border-radius: 6px; background-color: transparent; display: flex; justify-content: center; align-items: center; gap: 12px; } header#header .btn-search-react button#search-toggle:hover { color: var(--color-base-4); } header#header .btn-search-react button#search-toggle img { width: 14px; height: 14px; object-fit: contain; aspect-ratio: 30/30; } /* header#header .btn-search-react button#search-toggle:hover img { width: 20px; height: 20px; } */ /* header // Block -> nav-search -> nav-bar -> search */ header#header .nav-search .col-search { width: 100%; display: flex; align-items: center; justify-content: center; /* padding: 10px 0 10px; */ } header#header .nav-search .col-search .region.region-search .contextual-region { position: initial; } header#header .nav-search .col-search form[id^="search-api-page-block-form-search"] { width: 900px; /* margin: 10px 0; */ position: absolute; bottom: -80px; left: 50%; transform: translateX(-50%); display: flex; justify-content: space-between; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) { /* header#header .logo { max-width: 70px; } */ header#header .head-inner { gap: 20px; } header#header .nav-bar { gap: 10px; } header#header .head-inner .head-content { margin-left: 0px; gap: 10px; } header#header .head-inner .head-content .head-feedback .col-callback a { padding: 10px 5px; width: 135px; height: 70px; } header#header nav ul.nav { gap: 10px; } header#header nav ul.nav li a.nav-link { padding: 5px 5px; } header#header .btn-search-react button#search-toggle { font-size: 0; color: transparent; gap: 0; } header#header .btn-search-react button#search-toggle img { width: 16px; height: 16px; } } @media (max-width: 991px) {} @media (max-width: 767px) {} @media (max-width: 575px) {} @media (max-width: 460px) {} @media (max-width: 350px) {} /* H E A D E R - M O B I L E // Block */ /* header-mobile // Block */ #header-mob { gap: 25px; display: flex; align-items: center; justify-content: space-between; background-color: var(--bg-color-base-1); box-shadow: 0px 0px 10px 0px var(--bg-color-main); } /* header-mobile // Block -> img */ #header-mob .logo { aspect-ratio: 10/10; width: 100%; max-width: 70px; height: auto; padding: 0; } #header-mob .logo img { width: 100%; height: 100%; object-fit: contain; } /* header-mobile // Block -> content */ #header-mob .head-mob-content { display: flex; justify-content: center; align-items: center; gap: 10px; /* padding: 0px; */ } /* header-mobile // Block -> content -> contacts */ /* header-mobile // Block -> content -> callback */ #header-mob .head-mob-content .head-mob-feedback {} #header-mob .head-mob-content .head-mob-feedback .col-callback a { padding: 13px 30px; display: flex; justify-content: center; align-items: center; background-color: var(--bg-color-base-1); color: var(--bg-color-base-2); border: 2px solid var(--bg-color-base-1); border: 0; font-size: var(--fz-btn); border-radius: 6px; } #header-mob .head-mob-content .head-mob-feedback .col-callback a { background-color: var(--bg-color-base-2); background-color: var(--bg-color-main); } /* header-mobile // Block -> btn-nav */ #header-mob .col-nav { aspect-ratio: 5/5; height: auto; width: 100%; max-width: 60px; /* padding: 0px; */ } #header-mob .col-nav img { width: 100%; height: 100%; object-fit: contain; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) {} @media (max-width: 767px) { #header-mob .head-mob-content .head-mob-feedback { display: none; } } @media (max-width: 575px) { #header-mob { gap: 10px; } #header-mob .col-nav { max-width: 55px; } } @media (max-width: 460px) {} @media (max-width: 350px) { #header-mob .head-mob-content { padding: 0px; } } /* H E A D E R - M O B I L E // Menu */ /* header-mobile // Menu */ div#offcanvasNav { background-color: var(--bg-color-base-1); gap: 20px; } /* header-mobile // NAV -> header */ div#offcanvasNav .offcanvas-header { padding: 10px; display: flex; justify-content: space-between; } div#offcanvasNav .offcanvas-header .logo { aspect-ratio: 70/70; width: 100%; max-width: 100px; height: auto; } div#offcanvasNav .offcanvas-header .logo img { width: 100%; height: 100%; /* aspect-ratio: 115/115; */ object-fit: contain; } div#offcanvasNav .offcanvas-header button.btn-close { filter: invert(1); width: 40px; height: 40px; scale: 1.5; margin: 0 10px 0 0; } /* header-mobile // NAV -> body */ div#offcanvasNav .offcanvas-body { display: flex; flex-direction: column; gap: 20px; } /* header-mobile // NAV -> body -> search */ div#offcanvasNav .offcanvas-body .region.region-search form { display: flex; justify-content: space-between; width: 100%; height: 43px; flex-direction: row; border: 2px solid #fff; gap: 0; } div#offcanvasNav .offcanvas-body .region.region-search form .js-form-item.form-item.js-form-type-search.form-type-search.js-form-item-keys.form-item-keys.form-no-label { width: 80%; height: 100%; } /* div#offcanvasNav .offcanvas-body .region.region-search form div[id^="edit-actions"] { width: 10%; min-width: 30px; height: 100%; } */ div#offcanvasNav .offcanvas-body .region.region-search form .js-form-item.form-item.js-form-type-search.form-type-search.js-form-item-keys.form-item-keys.form-no-label input { background-color: transparent; height: 100%; width: 100%; padding: 13px 10px 13px 20px; color: var(--color-base-2); } div#offcanvasNav .offcanvas-body .region.region-search form .js-form-item.form-item.js-form-type-search.form-type-search.js-form-item-keys.form-item-keys.form-no-label input::placeholder { font-weight: 500; font-size: var(--fz-base); color: var(--color-base-2); } div#offcanvasNav .offcanvas-body .region.region-search form .js-form-item.form-item.js-form-type-search.form-type-search.js-form-item-keys.form-item-keys.form-no-label input:focus { box-shadow: none; outline: 0; border: 0; border-radius: 0; } div#offcanvasNav .offcanvas-body .region.region-search form div[id^="edit-actions"] { min-width: 46px; width: 10%; height: 100%; display: flex; align-items: center; justify-content: center; right: 0; } div#offcanvasNav .offcanvas-body .region.region-search form div button { padding: 22px; border-radius: 0; width: 100%; } div#offcanvasNav .offcanvas-body .region.region-search form div button:hover { background-color: var(--btn-bg-color-1-hover); } /* header-mobile // NAV -> body -> nav */ div#offcanvasNav .offcanvas-body nav div { text-transform: uppercase; font-weight: 500; color: var(--color-base-2); margin-bottom: 10px; } div#offcanvasNav .offcanvas-body nav ul.nav li.nav-item a.nav-link { padding: 10px; color: #fff; display: flex; align-items: center; height: 63px; font-weight: 700; } div#offcanvasNav .offcanvas-body nav ul.nav li.nav-item a.nav-link:hover { background-color: var(--btn-bg-color-1); /* color: #000; */ } div#offcanvasNav .offcanvas-body nav ul.nav li.nav-item a.is-active { background-color: var(--btn-bg-color-1-hover); } /* header-mobile // NAV -> body -> nav -> dropdown-menu */ #offcanvasNav li.nav-item.dropdown ul.dropdown-menu { border-radius: 0; border: 0; padding: 0; background-color: var(--color-base-2); margin-bottom: 10px; } #offcanvasNav li.nav-item.dropdown ul.dropdown-menu li.nav-item a.dropdown-item { padding: 14px 23px; font-size: var(--fz-text-small); } #offcanvasNav li.nav-item.dropdown ul.dropdown-menu li.nav-item a.dropdown-item:hover { background-color: #eeff39bf; } #offcanvasNav li.nav-item.dropdown ul.dropdown-menu li.nav-item a.dropdown-item.is-active { background-color: var(--btn-bg-color-1); border: 10px solid #fff; border-top: 0; border-bottom: 0; } /* header-mobile // NAV -> body -> contacts & social */ div#offcanvasNav .offcanvas-body .menu-contacts { background-color: var(--bg-color-base-1); border: 3px solid var(--color-base-2); border-radius: 6px; color: var(--color-base-2); padding: 10px; } div#offcanvasNav .offcanvas-body .menu-contacts .contacts { display: flex; flex-direction: column; gap: 20px; } div#offcanvasNav .offcanvas-body .menu-contacts .contacts .contacts-set { display: flex; flex-direction: column; gap: 10px; } div#offcanvasNav .offcanvas-body .menu-contacts .contacts p.contacts-text { margin-bottom: 0px; color: var(--color-base-2); } div#offcanvasNav .offcanvas-body .menu-contacts .contacts p.contacts-text:hover { color: var(--btn-bg-color-1-hover); } div#offcanvasNav .offcanvas-body .menu-contacts .contacts p.contacts-text span { color: inherit; } div#offcanvasNav .offcanvas-body .menu-contacts .contacts p.contacts-text a { color: inherit; text-decoration: none; } div#offcanvasNav .offcanvas-body .menu-contacts .contacts p.contacts-text a:hover { color: inherit; text-decoration: underline; } div#offcanvasNav .offcanvas-body .menu-contacts .contacts .address span { display: flex; align-items: center; gap: 10px; } div#offcanvasNav .offcanvas-body .menu-contacts .contacts .contacts-set-mes { display: flex; flex-direction: row; gap: 5px; } div#offcanvasNav .offcanvas-body .menu-contacts .contacts .contacts-set-mes a.soc-mes { background-color: transparent; width: 35px; height: auto; display: flex; aspect-ratio: 30/30; justify-content: center; align-items: center; padding: 0; border-radius: 5px; } div#offcanvasNav .offcanvas-body .menu-contacts .contacts .contacts-set-mes a.soc-mes img { width: 100%; height: auto; object-fit: contain; } /* header-mobile // NAV -> body -> feedback */ div#offcanvasNav .offcanvas-body .menu-contacts .col-callback { margin-top: 20px; } div#offcanvasNav .offcanvas-body .menu-contacts .col-callback a { width: 100%; padding: 13px 30px; display: flex; justify-content: center; align-items: center; background-color: var(--bg-color-base-2); color: var(--color-base-1); border: 0; font-size: var(--fz-btn); border-radius: 6px; } div#offcanvasNav .offcanvas-body .menu-contacts .col-callback a:hover { background-color: var(--bg-color-main); color: var(--color-base-2); } /* MEDIA SIZE */ @media (max-width: 991px) {} @media (max-width: 767px) {} @media (max-width: 575px) {} @media (max-width: 460px) { div#offcanvasNav .offcanvas-body .region.region-search form .js-form-item.form-item.js-form-type-search.form-type-search.js-form-item-keys.form-item-keys.form-no-label { width: 84%; } div#offcanvasNav .offcanvas-body .region.region-search form#search-api-page-block-form-search--2 .js-form-item.form-item.js-form-type-search.form-type-search.js-form-item-keys.form-item-keys.form-no-label { width: 80%; } } @media (max-width: 350px) { div#offcanvasNav .offcanvas-body .region.region-search form .js-form-item.form-item.js-form-type-search.form-type-search.js-form-item-keys.form-item-keys.form-no-label { width: 70%; } div#offcanvasNav .offcanvas-body .head-right-up .col-contacts p.contact-item span { display: block; margin-bottom: 5px; } } /* B A N N E R // Block */ /* banner // Block */ /* #head-banner {position: relative;} #head-banner::before { content: ''; display: block; background: url(/sites/all/themes/vesta_theme/image/custom-images/banner/bg-banner.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; width: 100%; height: 100%; aspect-ratio: 1920/817; position: absolute; top: 0px; left: 0px; z-index: 1; } */ /* .banner-block { margin: 126px 0 266px; position: relative; z-index: 2; } */ /* banner // Block -> content */ /* .banner-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item { max-width: 570px; width: 100%; } */ /* banner // Block -> content -> view-header */ /* .banner-block .view-header {margin-bottom: 30px;} .banner-block .view-header .view-header-inner {gap: 30px;} */ /* banner // Block -> content -> btn */ /* .banner-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item a { padding: 10px 68px; border: 1px solid var(--bg-color-base-2); color: var(--color-base-1); background-color: var(--bg-color-base-2); text-decoration: none; border-radius: 0; } .banner-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item a:hover { border: 1px solid var(--bg-color-main); background-color: var(--bg-color-main); } */ /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ /* @media (max-width: 1199px) { .banner-block { margin: 90px 0 165px; } .banner-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item { max-width: 530px; } } @media (max-width: 991px) { .banner-block { margin: 90px 0 135px; } .banner-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item { max-width: 450px; } } @media (max-width: 767px) { .banner-block { margin: 75px 0 95px; } } @media (max-width: 575px) {} @media (max-width: 460px) { .banner-block { margin: 75px 0 55px; } .banner-block .view-header .view-header-inner p.front-h1-subtitle { text-align: justify; } .banner-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item a { width: 100%; } } @media (max-width: 350px) { .banner-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item a { padding: 10px 38px; } } */ /* V I D E O - G A L L E R Y // Block */ /* video-gallery // Block */ .video-block .region.region-video div#block-vesta-theme-zagolovokglavnoystranicy { margin-bottom: 80px; } /* video-gallery // Block -> content */ .front .view.view-video-gallery.view-id-video_gallery .view-content .views-row .node.node--type-videogallery.node--view-mode-teaser {} /* video-gallery // Block -> content -> item */ .front .view.view-video-gallery.view-id-video_gallery .view-content .views-row .node.node--type-videogallery.node--view-mode-teaser .field.field--name-field-video-files.field--type-text-long.field--label-hidden.field__items .field__item { width: 100%; } .front .view.view-video-gallery.view-id-video_gallery .view-content .views-row .node.node--type-videogallery.node--view-mode-teaser .field.field--name-field-video-files.field--type-text-long.field--label-hidden.field__items .field__item:nth-child(n+2) { display: none; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) { .video-block .region.region-video div#block-vesta-theme-zagolovokglavnoystranicy { margin-bottom: 60px; } } @media (max-width: 767px) {} @media (max-width: 575px) { .video-block .region.region-video div#block-vesta-theme-zagolovokglavnoystranicy { margin-bottom: 40px; } } @media (max-width: 460px) {} @media (max-width: 350px) {} /* V I D E O - G A L L E R Y // Page */ /* video-gallery // Page */ /* video-gallery // Page -> content */ .view.view-video-gallery.view-id-video_gallery .view-content .views-row .node.node--type-videogallery.node--view-mode-teaser .field.field--name-field-video-files.field--type-text-long.field--label-hidden.field__items { display: flex; flex-wrap: wrap; gap: 30px; } .view.view-video-gallery.view-id-video_gallery .view-content .views-row .node.node--type-videogallery.node--view-mode-teaser .field.field--name-field-video-files.field--type-text-long.field--label-hidden.field__items::after { display: none; } /* video-gallery // Page -> content -> item */ .view.view-video-gallery.view-id-video_gallery .view-content .views-row .node.node--type-videogallery.node--view-mode-teaser .field.field--name-field-video-files.field--type-text-long.field--label-hidden.field__items .field__item { width: 31.5%; aspect-ratio: 1170/660; height: auto; } .view.view-video-gallery.view-id-video_gallery .view-content .views-row .node.node--type-videogallery.node--view-mode-teaser .field.field--name-field-video-files.field--type-text-long.field--label-hidden.field__items .field__item iframe { width: 100%; height: 100%; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) { .view.view-video-gallery.view-id-video_gallery .view-content .views-row .node.node--type-videogallery.node--view-mode-teaser .field.field--name-field-video-files.field--type-text-long.field--label-hidden.field__items { gap: 25px; } } @media (max-width: 991px) { .view.view-video-gallery.view-id-video_gallery .view-content .views-row .node.node--type-videogallery.node--view-mode-teaser .field.field--name-field-video-files.field--type-text-long.field--label-hidden.field__items { gap: 20px; } } @media (max-width: 767px) { .view.view-video-gallery.view-id-video_gallery .view-content .views-row .node.node--type-videogallery.node--view-mode-teaser .field.field--name-field-video-files.field--type-text-long.field--label-hidden.field__items .field__item { width: 48%; } } @media (max-width: 575px) { .view.view-video-gallery.view-id-video_gallery .view-content .views-row .node.node--type-videogallery.node--view-mode-teaser .field.field--name-field-video-files.field--type-text-long.field--label-hidden.field__items { gap: 15px; } } @media (max-width: 460px) { .view.view-video-gallery.view-id-video_gallery .view-content .views-row .node.node--type-videogallery.node--view-mode-teaser .field.field--name-field-video-files.field--type-text-long.field--label-hidden.field__items .field__item { width: 100%; } } @media (max-width: 350px) { .view.view-video-gallery.view-id-video_gallery .view-content .views-row .node.node--type-videogallery.node--view-mode-teaser .field.field--name-field-video-files.field--type-text-long.field--label-hidden.field__items { gap: 10px; } } /* A B O U T // Block */ /* about // Block */ /* about // Block -> view-header */ .about-block .view-header .view-header-inner { display: flex; flex-direction: row; align-items: flex-end; justify-content: space-between; } .about-block .view-header .view-header-inner .header-title { max-width: 500px; } .about-block .view-header .view-header-inner p.front-h2-subtitle { max-width: 475px; } /* about // Block -> content */ /* .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser {} */ /* about // Block -> content -> left */ /* .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-left { position: relative; } */ /* about // Block -> content -> left -> img */ /* .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-left .field.field--name-field-about-image-one.field--type-image.field--label-hidden.field__item { aspect-ratio: 670/238; width: 100%; height: auto; margin-bottom: 40px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-left .field.field--name-field-about-image-one.field--type-image.field--label-hidden.field__item img { width: 100%; height: 100%; object-fit: cover; } */ /* about // Block -> content -> left -> text */ /* .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-left .field.field--name-field-small-description.field--type-text-long.field--label-hidden.field__item { margin-bottom: 65px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-left .field.field--name-field-small-description.field--type-text-long.field--label-hidden.field__item p { margin-bottom: 10px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-left .field.field--name-field-small-description.field--type-text-long.field--label-hidden.field__item p:hover { margin-bottom: 0px; } */ /* about // Block -> content -> left -> btn */ /* .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-left .field.field--name-dynamic-token-fieldnode-btn-more-company.field--type-ds.field--label-hidden.field__item a { padding: 12px 68px; border: 1px solid var(--bg-color-base-2); color: var(--color-base-2); background-color: var(--btn-bg-color-1); position: absolute; bottom: 0; left: 15px; text-decoration: none; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-left .field.field--name-dynamic-token-fieldnode-btn-more-company.field--type-ds.field--label-hidden.field__item a:hover { border: 1px solid var(--btn-bg-color-1-hover); color: var(--color-base-1); background-color: var(--bg-color-main); } */ /* about // Block -> content -> right */ /* .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-right {} */ /* about // Block -> content -> right -> img */ /* .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-right .field.field--name-field-about-image-two.field--type-image.field--label-hidden.field__item { width: auto; height: 100%; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-right .field.field--name-field-about-image-two.field--type-image.field--label-hidden.field__item img { width: 100%; height: 100%; object-fit: cover; } */ /* about // Block -> content */ .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser { font-size: var(--fz-about-text); line-height: 1.4; font-weight: 300; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .field.field--name-field-small-description.field--type-text-long.field--label-hidden.field__item p, .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .field.field--name-field-small-description-2.field--type-text-long.field--label-hidden.field__item p { margin-bottom: 30px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .field.field--name-field-small-description.field--type-text-long.field--label-hidden.field__item p:last-child, .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .field.field--name-field-small-description-2.field--type-text-long.field--label-hidden.field__item p:last-child { margin-bottom: 0px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .field.field--name-field-small-description.field--type-text-long.field--label-hidden.field__item p strong, .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .field.field--name-field-small-description-2.field--type-text-long.field--label-hidden.field__item p strong { font-weight: 500; } /* about // Block -> content -> UP */ .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-up { display: grid; gap: 30px; grid-template-columns: 6fr 6fr; } /* about // Block -> content -> UP -> img */ .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-up .field.field--name-field-about-image-one.field--type-image.field--label-hidden.field__item { /* aspect-ratio: 570/270; */ width: 100%; height: auto; min-height: 270px; overflow: hidden; border-radius: 4px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-up .field.field--name-field-about-image-one.field--type-image.field--label-hidden.field__item img { width: 100%; height: 100%; object-fit: cover; } /* about // Block -> content -> DOWN */ .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-down { margin-top: 30px; display: grid; gap: 30px; grid-template-columns: 6fr 6fr; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-down .content-inner { display: flex; flex-direction: column; justify-content: space-between; } /* about // Block -> content -> DOWN -> img */ .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-down .field.field--name-field-about-image-two.field--type-image.field--label-hidden.field__item { aspect-ratio: 570/570; width: 100%; height: 100%; overflow: hidden; border-radius: 4px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-down .field.field--name-field-about-image-two.field--type-image.field--label-hidden.field__item img { width: 100%; height: 100%; object-fit: cover; } /* about // Block -> content -> DOWN -> btn */ .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-down .content-inner .field.field--name-dynamic-token-fieldnode-btn-more-company.field--type-ds.field--label-hidden.field__item a { padding: 12px 18px; text-decoration: none; background: var(--btn-bg-color-1); color: var(--color-base-2); border: none; border-radius: 4px; display: flex; width: 370px; height: 48px; font-weight: 400; font-size: var(--fz-form-btn); position: relative; align-items: center; justify-content: center; gap: 5px; margin-top: 20px; flex-direction: row-reverse; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-down .content-inner .field.field--name-dynamic-token-fieldnode-btn-more-company.field--type-ds.field--label-hidden.field__item a::before { content: ''; display: block; width: 16px; height: 16px; background-image: url(/sites/all/themes/vesta_theme/image/custom-images/tools/arrow-more.png); background-position: center; background-repeat: no-repeat; background-size: contain; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-down .content-inner .field.field--name-dynamic-token-fieldnode-btn-more-company.field--type-ds.field--label-hidden.field__item a:hover { color: var(--color-base-2); background: var(--btn-bg-color-1-hover); } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) { .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-up { gap: 25px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-down { margin-top: 25px; gap: 25px; } } @media (max-width: 991px) { .about-block .view-header .view-header-inner { display: flex; flex-direction: column; align-items: flex-start; } .about-block .view-header .view-header-inner .header-title {max-width: 400px;} .about-block .view-header .view-header-inner p.front-h2-subtitle {max-width: 100%;} /* .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-left .field.field--name-field-about-image-one.field--type-image.field--label-hidden.field__item { margin-bottom: 20px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-left .field.field--name-field-small-description.field--type-text-long.field--label-hidden.field__item { margin-bottom: 20px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-left .field.field--name-dynamic-token-fieldnode-btn-more-company.field--type-ds.field--label-hidden.field__item a { position: relative; left: 0; width: 100%; display: flex; align-items: center; justify-content: center; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-right { margin-top: 20px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-right .field.field--name-field-about-image-two.field--type-image.field--label-hidden.field__item { aspect-ratio: 670/238; } */ .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-up { gap: 20px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-down { margin-top: 20px; gap: 20px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-down .content-inner .field.field--name-dynamic-token-fieldnode-btn-more-company.field--type-ds.field--label-hidden.field__item a { width: 100%; } } @media (max-width: 767px) { .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-up { gap: 15px; display: flex; flex-direction: column; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-up .field.field--name-field-about-image-one.field--type-image.field--label-hidden.field__item { aspect-ratio: 570/270; min-height: auto; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .field.field--name-field-small-description.field--type-text-long.field--label-hidden.field__item p, .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .field.field--name-field-small-description-2.field--type-text-long.field--label-hidden.field__item p { margin-bottom: 10px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-down { display: flex; gap: 15px; flex-direction: column-reverse; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .content-down .field.field--name-field-about-image-two.field--type-image.field--label-hidden.field__item { aspect-ratio: 570/370; height: auto; } } @media (max-width: 575px) {} @media (max-width: 460px) { .about-block .view-header .view-header-inner p.front-h2-subtitle {text-align: justify;} /* .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-left .field.field--name-field-small-description.field--type-text-long.field--label-hidden.field__item { text-align: justify; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-right { display: none; } */ } @media (max-width: 350px) { /* .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-teaser .about.center .about-left .field.field--name-dynamic-token-fieldnode-btn-more-company.field--type-ds.field--label-hidden.field__item a { padding: 12px 18px; } */ } /* A B O U T // Page */ /* about // Page */ /* about // Page -> content */ .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-default {} /* about // Page -> content -> text */ .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-default .field.field--name-field-description.field--type-text-long.field--label-hidden.field__item { margin-bottom: 30px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-default .field.field--name-field-description.field--type-text-long.field--label-hidden.field__item p { margin-bottom: 10px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-default .field.field--name-field-description.field--type-text-long.field--label-hidden.field__item p:last-child { margin-bottom: 0px; } /* about // Page -> content -> img-set */ .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-default .field.field--name-field-about-photo-set.field--type-image.field--label-hidden.field__items { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 30px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-default .field.field--name-field-about-photo-set.field--type-image.field--label-hidden.field__items .field__item { aspect-ratio: 570/370; width: 31.5%; height: auto; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-default .field.field--name-field-about-photo-set.field--type-image.field--label-hidden.field__items .field__item img { width: 100%; height: 100%; object-fit: cover; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) { .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-default .field.field--name-field-about-photo-set.field--type-image.field--label-hidden.field__items .field__item { width: 31%; } } @media (max-width: 991px) { .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-default .field.field--name-field-description.field--type-text-long.field--label-hidden.field__item { text-align: justify; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-default .field.field--name-field-about-photo-set.field--type-image.field--label-hidden.field__items { gap: 20px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-default .field.field--name-field-about-photo-set.field--type-image.field--label-hidden.field__items .field__item { width: 31.5%; } } @media (max-width: 767px) { .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-default .field.field--name-field-about-photo-set.field--type-image.field--label-hidden.field__items .field__item { width: 30.5%; } } @media (max-width: 575px) { .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-default .field.field--name-field-about-photo-set.field--type-image.field--label-hidden.field__items { gap: 15px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-default .field.field--name-field-about-photo-set.field--type-image.field--label-hidden.field__items .field__item { width: 48%; } } @media (max-width: 460px) { .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-default .field.field--name-field-about-photo-set.field--type-image.field--label-hidden.field__items { gap: 10px; } .view.view-about-fortune.view-id-about_fortune .view-content .views-row .node.node--type-about.node--view-mode-default .field.field--name-field-about-photo-set.field--type-image.field--label-hidden.field__items .field__item { width: 100%; } } @media (max-width: 350px) {} /* S T A G E S // Block */ /* stages // Block */ /* stages // Block -> content */ /* stages // Block -> content -> view-header */ .stages-block .view-header .view-header-inner { max-width: 500px; } .stages-block .view-header .view-header-inner .header-title h2 { /* font-size: var(--fz-h2-stages-title); */ } /* stages // Block -> header */ .stages-block .region.region-stages div#block-vesta-theme-stages-company { padding: 60px 0 80px; } .stages-block .region.region-stages div#block-vesta-theme-stages-company .view-header { margin-bottom: 60px; } /* stages // Block -> right -> content */ .stages-block .region.region-stages div#block-vesta-theme-stages-company .stages { display: flex; flex-wrap: wrap; justify-content: space-between; row-gap: 36px; column-gap: 30px; } /* stages // Block -> right -> content -> stages */ .stages-block .region.region-stages div#block-vesta-theme-stages-company .stages .stage-item { display: grid; column-gap: 35px; width: 48.5%; row-gap: 18px; grid-template-areas: 'a b' 'a c'; grid-template-columns: 35px 11fr; } /* stages // Block -> right -> content -> stages -> num */ .stages-block .region.region-stages div#block-vesta-theme-stages-company .stages .stage-item p.stage-num { color: var(--color-main); font-weight: 700; font-size: 24px; grid-area: a; } /* stages // Block -> right -> content -> stages -> title */ .stages-block .region.region-stages div#block-vesta-theme-stages-company .stages .stage-item p.stage-title { font-size: var(--fz-h3-stages-title); text-transform: uppercase; font-weight: 600; grid-area: b; } /* stages // Block -> right -> content -> stages -> text */ .stages-block .region.region-stages div#block-vesta-theme-stages-company .stages .stage-item p.stage-text { grid-area: c; line-height: 1.4; } .stages-block .region.region-stages div#block-vesta-theme-stages-company .stages .stage-item p { margin-bottom: 0px; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) { /* .stages-block .region.region-stages div#block-vesta-theme-stages-company { margin-left: 50px; } */ .stages-block .region.region-stages div#block-vesta-theme-stages-company .stages .stage-item { width: 48%; } } @media (max-width: 991px) { /* .stages-block .region.region-stages div#block-vesta-theme-stages-company { margin-left: 20px; } */ .stages-block .region.region-stages div#block-vesta-theme-stages-company .stages { row-gap: 30px; column-gap: 20px; } .stages-block .region.region-stages div#block-vesta-theme-stages-company .stages .stage-item { gap: 15px; } } @media (max-width: 767px) { /* .stages-block .region.region-stages { display: flex; flex-direction: column; } */ .stages-block .region.region-stages div#block-vesta-theme-stages-company { padding: 40px 0 60px; } .stages-block .region.region-stages div#block-vesta-theme-stages-company .view-header { margin-bottom: 40px; } .stages-block .region.region-stages div#block-vesta-theme-stages-company .stages .stage-item { width: 100%; } .stages-block .region.region-stages div#block-vesta-theme-stages-company .stages .stage-item p.stage-text { max-width: 100%; } } @media (max-width: 575px) { } @media (max-width: 460px) { .stages-block .region.region-stages div#block-vesta-theme-stages-company .view-header { margin-bottom: 20px; } .stages-block .region.region-stages div#block-vesta-theme-stages-company { padding: 40px 0 40px; } .stages-block .region.region-stages div#block-vesta-theme-stages-company .stages { gap: 20px; } /* .stages-block .region.region-stages div#block-vesta-theme-stages-company .stages .stage-item { gap: 5px; } */ .stages-block .region.region-stages div#block-vesta-theme-stages-company .stages .stage-item p.stage-text { text-align: justify; } } @media (max-width: 350px) { } /* D E C O R // Block */ /* decor // Block */ div#decor-block { position: relative; padding: 137px 0 142px; } #decor-block::before { content: ''; display: block; background: url(/sites/all/themes/vesta_theme/image/custom-images/backgrounds/bg-decor.png); background-repeat: no-repeat; background-position: center; background-size: cover; /* border-radius: 40px; */ /* min-width: 1767px; */ /* max-width: 1767px; */ width: auto; /* min-height: 754px; */ height: 100%; width: 100%; /* aspect-ratio: 1921/370; */ position: absolute; top: 0px; left: 0; z-index: 1; } div#decor-block .region.region-decor { position: relative; z-index: 2; } /* decor // Block -> content */ div#decor-block .region.region-decor div#block-vesta-theme-decor-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item { font-size: 20px; text-transform: uppercase; color: var(--color-base-2); display: flex; gap: 30px; justify-content: space-between; line-height: 1.4; } div#decor-block .region.region-decor div#block-vesta-theme-decor-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item p { margin: 0; } div#decor-block .region.region-decor div#block-vesta-theme-decor-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item p strong { font-weight: 800; color: var(--color-base-4); font-family: var(--ff-main); } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) { div#decor-block { padding: 105px 0 115px; } } @media (max-width: 991px) { div#decor-block .region.region-decor div#block-vesta-theme-decor-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item { display: flex; justify-content: flex-start; flex-direction: column; } div#decor-block { padding: 40px 0 45px; } } @media (max-width: 767px) {} @media (max-width: 575px) { div#decor-block .region.region-decor div#block-vesta-theme-decor-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item { gap: 30px; } } @media (max-width: 460px) {} @media (max-width: 350px) {} /* B E N E F I T S // Block */ /* benefits // Block */ .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company { padding: 60px 0 80px; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .view-header { margin-bottom: 60px; } /* benefits // Block -> content */ .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits { display: flex; flex-wrap: wrap; row-gap: 84px; column-gap: 60px; } /* benefits // Block -> content -> benefits */ .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item { width: 29.9%; padding-top: 78px; position: relative; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item::before { content: ''; display: block; background-image: url(/sites/all/themes/vesta_theme/image/custom-images/benefits/benefits-01.svg); background-position: center; background-size: contain; background-repeat: no-repeat; width: 48px; height: 48px; position: absolute; inset: 0; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item:nth-child(1):before { background-image: url(/sites/all/themes/vesta_theme/image/custom-images/benefits/benefits-01.svg); background-position: center; background-size: contain; background-repeat: no-repeat; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item:nth-child(2):before { background-image: url(/sites/all/themes/vesta_theme/image/custom-images/benefits/benefits-02.svg); background-position: center; background-size: contain; background-repeat: no-repeat; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item:nth-child(3):before { background-image: url(/sites/all/themes/vesta_theme/image/custom-images/benefits/benefits-03.svg); background-position: center; background-size: contain; background-repeat: no-repeat; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item:nth-child(4):before { background-image: url(/sites/all/themes/vesta_theme/image/custom-images/benefits/benefits-04.svg); background-position: center; background-size: contain; background-repeat: no-repeat; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item:nth-child(5):before { background-image: url(/sites/all/themes/vesta_theme/image/custom-images/benefits/benefits-05.svg); background-position: center; background-size: contain; background-repeat: no-repeat; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item:nth-child(6):before { background-image: url(/sites/all/themes/vesta_theme/image/custom-images/benefits/benefits-06.svg); background-position: center; background-size: contain; background-repeat: no-repeat; } /* benefits // Block -> content -> benefits -> title */ .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item p.benefits-title { font-size: var(--fz-h3-benefits-title); font-weight: 700; margin-bottom: 20px; min-height: 50px; } /* benefits // Block -> content -> benefits -> text */ .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item p.benefits-text { line-height: 1.4; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item p { margin-bottom: 0px; } /* benefits // Block -> content -> benefits -> block-text */ .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits-block-text { padding: 60px 30px; margin-top: 80px; text-align: center; font-size: 20px; background-color: var(--color-base-5); font-weight: 300; display: flex; flex-direction: column; align-items: center; justify-content: center; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits-block-text p { margin-bottom: 20px; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits-block-text p:first-child { max-width: 850px; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits-block-text p:last-child { margin-bottom: 0px; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) { /* .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company { margin-left: 50px; } */ .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits { row-gap: 56px; column-gap: 48px; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item { width: 30%; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits-block-text { padding: 50px 30px; } } @media (max-width: 991px) { /* .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company { margin-left: 20px; } */ /* .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item { gap: 12px; } */ .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits { row-gap: 45px; column-gap: 37px; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits-block-text { padding: 40px 20px; } } @media (max-width: 767px) { .benefits-block .region.region-benefits { display: flex; flex-direction: column; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company { padding: 40px 0 60px; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item p.benefits-text { max-width: 100%; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits { row-gap: 40px; column-gap: 38px; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item { width: 46.5%; padding-top: 58px; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item::before { width: 40px; height: 40px; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits-block-text { margin-top: 60px; } } @media (max-width: 575px) { .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item { width: 100%; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item::before { left: 50%; transform: translateX(-50%); } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item p.benefits-title { text-align: center; margin-bottom: 10px; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item p.benefits-text { text-align: center; } } @media (max-width: 460px) { .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company { padding: 30px 0 50px; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits { gap: 20px; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits .benefit-item { gap: 5px; } .benefits-block .region.region-benefits div#block-vesta-theme-benefits-company .benefits-block-text { padding: 30px 10px; margin-top: 40px; } } @media (max-width: 350px) { } /* S E R V I C E S // Block */ /* services // Block */ /* services // Block -> view-header */ .services-block .view-header .view-header-inner { display: flex; flex-direction: row; align-items: flex-end; justify-content: space-between; } .services-block .view-header .view-header-inner .header-title { max-width: 500px; } .services-block .view-header .view-header-inner p.front-h2-subtitle { max-width: 475px; } /* services // Block -> content */ .view.view-services-fortune.view-id-services_fortune .view-content { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 30px; } .view.view-services-fortune.view-id-services_fortune .view-content .views-row { aspect-ratio: 570/410; width: 48.7%; height: auto; overflow: hidden; border-radius: 4px; border: 1px solid var(--color-base-4); color: var(--color-base-1); } /* services // Block -> content -> item */ .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser { padding: 30px; width: 100%; height: 100%; transition: all .5s linear; } .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser:hover { border: 1px solid var(--btn-bg-color-1-hover); transition: all 0.2s linear; } /* services // Block -> content -> item -> img */ .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser .field.field--name-field-service-photo.field--type-image.field--label-hidden.field__item { aspect-ratio: 510/210; width: 100%; height: auto; } .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser .field.field--name-field-service-photo.field--type-image.field--label-hidden.field__item img { width: 100%; height: 100%; object-fit: cover; } .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser .content-inner { margin-top: 20px; } /* services // Block -> content -> item -> title */ .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser .content-inner .field.field--name-node-title.field--type-ds.field--label-hidden.field__item { margin-bottom: 20px; } .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser .content-inner h3 { font-size: var(--fz-h3-service-title); color: var(--color-base-1); font-weight: 700; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; height: 56px; max-height: 56px; line-height: 1.3; } .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser .content-inner h3:hover { color: var(--color-main); } .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser .content-inner h3 a { text-decoration: none; padding-right: 250px; color: inherit; width: 100%; display: block; } .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser .content-inner h3 a:hover { color: inherit; } /* services // Block -> content -> item -> more */ .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser .content-inner .field.field--name-node-link.field--type-ds.field--label-hidden.field__item a { color: var(--color-main); width: 170px; display: flex; font-weight: 600; padding: 12px 15px; border-radius: 4px; text-align: center; text-decoration: none; border: 2px solid var(--bg-color-main); flex-direction: row-reverse; align-items: center; gap: 5px; justify-content: center; } .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser .content-inner .field.field--name-node-link.field--type-ds.field--label-hidden.field__item a:hover{ color: var(--color-base-2); background-color: var(--bg-color-main); } .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser .content-inner .field.field--name-node-link.field--type-ds.field--label-hidden.field__item a::before { content: ''; display: block; width: 16px; height: 16px; background-image: url(/sites/all/themes/vesta_theme/image/custom-images/tools/arrow-more-color.png); background-position: center; background-repeat: no-repeat; background-size: contain; } .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser .content-inner .field.field--name-node-link.field--type-ds.field--label-hidden.field__item a:hover::before { background-image: url(/sites/all/themes/vesta_theme/image/custom-images/tools/arrow-more.png); background-position: center; background-repeat: no-repeat; background-size: contain; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) { .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser .content-inner h3 a { padding-right: 75px; } } */ @media (max-width: 1199px) { .view.view-services-fortune.view-id-services_fortune .view-content { gap: 25px; } .view.view-services-fortune.view-id-services_fortune .view-content .views-row { aspect-ratio: 570/460; width: 48.5%; } .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser .content-inner h3 a { padding-right: 0px; } } @media (max-width: 991px) { .services-block .view-header .view-header-inner { display: flex; flex-direction: column; align-items: flex-start; } .services-block .view-header .view-header-inner .header-title {max-width: 450px;} .services-block .view-header .view-header-inner p.front-h2-subtitle {max-width: 100%;} .view.view-services-fortune.view-id-services_fortune .view-content { gap: 20px; } .view.view-services-fortune.view-id-services_fortune .view-content .views-row { aspect-ratio: initial; } .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser { padding: 10px; } } @media (max-width: 767px) { .view.view-services-fortune.view-id-services_fortune .view-content .views-row { width: 48%; } .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser .content-inner h3 { height: 52px; max-height: 52px; } } @media (max-width: 575px) { .view.view-services-fortune.view-id-services_fortune .view-content { gap: 15px; } .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser .content-inner h3 { /* -webkit-line-clamp: 3; */ height: 54px; max-height: 54px; } } @media (max-width: 460px) { .services-block .view-header .view-header-inner .header-title { max-width: 300px; } .services-block .view-header .view-header-inner p.front-h2-subtitle {text-align: justify;} .view.view-services-fortune.view-id-services_fortune .view-content { gap: 10px; } .view.view-services-fortune.view-id-services_fortune .view-content .views-row { width: 100%; } .front .view.view-services-fortune.view-id-services_fortune .view-content .views-row:nth-child(n+4) { display: none; } /* .view.view-services-fortune.view-id-services_fortune .view-content .views-row, .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser { aspect-ratio: 370/337; } */ .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser .content-inner h3 { height: 48px; max-height: 48px; } } @media (max-width: 350px) { /* .view.view-services-fortune.view-id-services_fortune .view-content .views-row .node.node--type-services-fortune.node--view-mode-teaser .content-inner h3 { height: 40px; max-height: 40px; } */ } /* S E R V I C E S // Page */ /* services // Page */ /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) {} @media (max-width: 767px) {} @media (max-width: 575px) {} @media (max-width: 460px) {} @media (max-width: 350px) {} /* S E R V I C E S // Cards Page */ /* services // Cards Page */ /* services // Cards Page -> content -> text */ .node.node--type-services-fortune.node--view-mode-full .field.field--name-field-service-description.field--type-text-long.field--label-hidden.field__item { margin-bottom: 20px; } .node.node--type-services-fortune.node--view-mode-full .field.field--name-field-service-description.field--type-text-long.field--label-hidden.field__item p { margin-bottom: 10px; } .node.node--type-services-fortune.node--view-mode-full .field.field--name-field-service-description.field--type-text-long.field--label-hidden.field__item p:last-child { margin-bottom: 0px; } /* services // Cards Page -> content -> photo-set */ .node.node--type-services-fortune.node--view-mode-full .slider-navigation { position: relative; overflow: hidden; } /* services // Cards Page -> content -> photo-set -> set */ .node.node--type-services-fortune.node--view-mode-full .slider-navigation .field.field--name-field-service-photo-set.field--type-image.field--label-hidden.field__items { display: flex; gap: 45px; --gap: 45px; --items-per-view: 3; /* overflow: hidden; */ scroll-behavior: smooth; transition: transform 0.4s ease; margin: 0 30px; } /* services // Cards Page -> content -> photo-set -> item */ .node.node--type-services-fortune.node--view-mode-full .slider-navigation .field.field--name-field-service-photo-set.field--type-image.field--label-hidden.field__items .field__item { /* width: 18.5%; */ flex: 0 0 calc((100% - (var(--gap) * (var(--items-per-view) - 1))) / var(--items-per-view)); aspect-ratio: 570/370; /* width: 100%; */ height: auto; overflow: hidden; border-radius: 5px; } .node.node--type-services-fortune.node--view-mode-full .slider-navigation .field.field--name-field-service-photo-set.field--type-image.field--label-hidden.field__items .field__item img { width: 100%; height: 100%; object-fit: cover; } /* services // Cards Page -> content -> slider-nav */ .node.node--type-services-fortune.node--view-mode-full .slider-navigation { position: relative; } .services-nav {margin-top: 30px;} .services-nav .slider-nav { display: flex; justify-content: center; align-items: flex-end; margin-top: 15px; gap: 10px; } .services-nav .slider-nav .slider-dots { /* height: 15px; */ display: flex; align-items: center; justify-content: center; gap: 13px; } .services-nav .slider-nav .slider-dots button { width: 10px; height: 10px; border-radius: 50%; border: none; background-color: var(--bg-color-base-4); cursor: pointer; padding: 0; } .services-nav .slider-nav .slider-dots button.active { background-color: var(--color-main); /* border: 2px solid white; */ /* box-shadow: 0 0 0px 2px var(--color-base-1); */ } .services-nav .slider-nav .slider-dots button:hover { background-color: #eccb96; } .services-nav .slider-nav .slider-btn-inner { display: flex; gap: 15px; align-items: center; justify-content: center; position: absolute; top: 45%; width: 100%; height: 0px; /* 106px */ transform: translateY(-50%); } .services-nav .slider-nav .slider-btn-inner button { background-repeat: no-repeat; background-position: center; background-size: contain; width: 40px; height: 40px; aspect-ratio: 10/10; border: 0; border-radius: 50%; background-color: var(--bg-color-base-2-opt-50); font-size: 0; color: transparent; position: absolute; } .services-nav .slider-nav .slider-btn-inner button.slider-prev {left: 0;} .services-nav .slider-nav .slider-btn-inner button.slider-next {right: 0;} .services-nav .slider-nav .slider-btn-inner button.slider-prev {background-image: url(/sites/all/themes/vesta_theme/image/custom-images/slider/slider-btn-left.svg);} .services-nav .slider-nav .slider-btn-inner button.slider-next {background-image: url(/sites/all/themes/vesta_theme/image/custom-images/slider/slider-btn-right.svg);} .services-nav .slider-nav .slider-btn-inner button:hover { box-shadow: 0 0px 6px 0px var(--bg-color-base-2); background-color: var(--bg-color-base-2); } @media (max-width: 1199px) { .node.node--type-services-fortune.node--view-mode-full .slider-navigation .field.field--name-field-service-photo-set.field--type-image.field--label-hidden.field__items { gap: 40px; --gap: 40px; } .services-nav .slider-nav .slider-btn-inner { top: 40%; } } @media (max-width: 991px) { .node.node--type-services-fortune.node--view-mode-full .field.field--name-field-service-description.field--type-text-long.field--label-hidden.field__item { text-align: justify; } .node.node--type-services-fortune.node--view-mode-full .slider-navigation .field.field--name-field-service-photo-set.field--type-image.field--label-hidden.field__items { gap: 30px; --gap: 30px; } .services-nav .slider-nav .slider-btn-inner { top: 38%; } } @media (max-width: 767px) { .node.node--type-services-fortune.node--view-mode-full .slider-navigation .field.field--name-field-service-photo-set.field--type-image.field--label-hidden.field__items { /* gap: 40px; */ /* --gap: 40px; */ } } @media (max-width: 575px) { .node.node--type-services-fortune.node--view-mode-full .slider-navigation .field.field--name-field-service-photo-set.field--type-image.field--label-hidden.field__items { /* margin: 0 50px; gap: 35px; --gap: 35px; */ margin: 0 25px; gap: 25px; --gap: 25px; } .services-nav .slider-nav .slider-btn-inner button.slider-prev { left: 0px; } .services-nav .slider-nav .slider-btn-inner button.slider-next { right: 0px; } .services-nav .slider-nav .slider-btn-inner { top: 35%; } } @media (max-width: 460px) { .node.node--type-services-fortune.node--view-mode-full .slider-navigation .field.field--name-field-service-photo-set.field--type-image.field--label-hidden.field__items { margin: 0px 15px; gap: 15px; --gap: 15px; } .services-nav .slider-nav .slider-btn-inner { top: 40%; } .services-nav .slider-nav .slider-btn-inner button { width: 32px; height: 32px; } .services-nav .slider-nav .slider-dots { gap: 10px; } .services-nav .slider-nav .slider-dots button { width: 8px; height: 8px; } } @media (max-width: 350px) { .services-nav .slider-nav .slider-btn-inner { top: 38%; } } /* T O - F O R M // Block */ /* to form // Block */ /* #to_form-block { position: relative; } #to_form-block::before { content: ''; display: block; background: url(/sites/all/themes/vesta_theme/image/custom-images/backgrounds/bg-to-form.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; z-index: 1; } */ /* .to_form-block {} .to_form-block .region.region-to-form { margin: 240px 0; position: relative; z-index: 2; display: flex; align-items: center; justify-content: center; flex-direction: column; } */ /* to form // Block -> content */ /* .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy { max-width: 970px; width: 100%; padding: 70px 157px; backdrop-filter: blur(15px); background-color: #00000080; border: 1px solid var(--color-base-3); } .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item { display: flex; flex-direction: column; align-items: center; } */ /* to form // Block -> content -> view-header */ /* .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item .view-header .view-header-inner { display: flex; align-items: center; text-align: center; } .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item p.front-h2-subtitle { max-width: 550px; } */ /* to form // Block -> content -> btn-set */ /* .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item .btn-set { display: flex; justify-content: center; align-items: center; gap: 30px; } */ /* .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item .btn-set a.callback { padding: 12px 18px; border: 1px solid var(--bg-color-base-2); color: var(--color-base-2); text-decoration: none; width: 313px; display: flex; justify-content: center; align-items: center; } .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item .btn-set a.callback:hover { border: 1px solid var(--bg-color-main); color: var(--color-base-1); background-color: var(--bg-color-main); } */ /* .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item .btn-set a.more-services { padding: 12px 18px; border: 1px solid var(--bg-color-base-2); color: var(--color-base-1); background-color: var(--bg-color-base-2); text-decoration: none; border-radius: 0; width: 313px; display: flex; justify-content: center; align-items: center; } .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item .btn-set a.more-services:hover { border: 1px solid var(--bg-color-main); background-color: var(--bg-color-main); } */ /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ /* @media (max-width: 1199px) { .to_form-block .region.region-to-form { margin: 180px 0; } .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy { max-width: 770px; padding: 50px 30px; } } @media (max-width: 991px) { .to_form-block .region.region-to-form { margin: 140px 0; } .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy { max-width: 720px; } } @media (max-width: 767px) { .to_form-block .region.region-to-form { margin: 100px 0; } .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy { max-width: 450px; padding: 40px 40px; } .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item .btn-set { display: flex; flex-direction: column; gap: 15px; width: 100%; } .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item .btn-set a.callback, .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item .btn-set a.more-services { width: 100%; } } @media (max-width: 575px) { .to_form-block .region.region-to-form { margin: 80px 0; } } @media (max-width: 460px) { .to_form-block .region.region-to-form { margin: 60px 0; } .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy { padding: 25px 20px; } } @media (max-width: 350px) { .to_form-block .region.region-to-form { margin: 50px 0; } .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy { padding: 25px 15px; } .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item .btn-set a.callback, .to_form-block .region.region-to-form div#block-vesta-theme-ostalisvoprosy .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item .btn-set a.more-services { text-align: center; } } */ /* C A T A L O G // Block */ /* catalog // Block */ /* catalog // Block -> view-header */ .catalog-block .view-header .view-header-inner { display: flex; flex-direction: row; align-items: flex-end; justify-content: space-between; } .catalog-block .view-header .view-header-inner .header-title { max-width: 600px; width: 100%; } .catalog-block .view-header .view-header-inner .header-title h2 { display: flex; flex-direction: column; } .catalog-block .view-header .view-header-inner .header-title h2 span.header-span { color: var(--color-main); display: block; } .catalog-block .view-header .view-header-inner p.front-h2-subtitle { max-width: 475px; width: 100%; } /* catalog // Block -> content */ .view.view-projects-completed.view-id-projects_completed .view-content { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 30px; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row { width: 48.5%; } /* catalog // Block -> content -> item */ .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser { background-color: #000; position: relative; aspect-ratio: 570/370; width: 100%; height: 370px; overflow: hidden; border-radius: 4px; } /* catalog // Block -> content -> item -> img */ .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-field-project-photo.field--type-image.field--label-hidden.field__item { /* aspect-ratio: 570/370; */ width: 100%; height: 100%; transition: all .5s linear; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-field-project-photo.field--type-image.field--label-hidden.field__item img { width: 100%; height: 100%; object-fit: cover; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser:hover .field.field--name-field-project-photo.field--type-image.field--label-hidden.field__item { opacity: 0.55; transition: all .2s linear; } /* catalog // Block -> content -> item -> content-inner */ /* .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .content-inner { position: absolute; bottom: 0; left: 0; padding: 30px; width: auto; display: flex; gap: 30px; flex-direction: column; align-items: flex-start; } */ /* catalog // Block -> content -> item -> content-inner -> icon */ .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-field-project-icon.field--type-image.field--label-hidden.field__item { aspect-ratio: 30/30; height: auto; width: 30px; position: absolute; top: 30px; left: 30px; display: none; transition: all .5s linear; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-field-project-icon.field--type-image.field--label-hidden.field__item img { width: 100%; height: 100%; object-fit: contain; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser:hover .field.field--name-field-project-icon.field--type-image.field--label-hidden.field__item { display: block; transition: all .2s linear; } /* catalog // Block -> content -> item -> content-inner -> title */ .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-node-title.field--type-ds.field--label-hidden.field__item { position: absolute; bottom: 100px; left: 30px; height: 39px; flex-direction: column-reverse; max-width: 350px; display: none; transition: all .5s linear; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser:hover .field.field--name-node-title.field--type-ds.field--label-hidden.field__item { display: flex; transition: all .2s linear; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-node-title.field--type-ds.field--label-hidden.field__item h3 { /* border: 1px solid var(--color-base-3); */ /* background-color: #00000080; */ /* backdrop-filter: blur(15px); */ color: var(--color-base-2); text-decoration: none; font-size: var(--fz-h3-catalog-title); transition: all .5s linear; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; width: 100%; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-node-title.field--type-ds.field--label-hidden.field__item h3:hover { color: var(--color-main); transition: all .2s linear; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-node-title.field--type-ds.field--label-hidden.field__item h3 a { color: inherit; text-decoration: inherit; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-node-title.field--type-ds.field--label-hidden.field__item h3 a:hover { color: inherit; text-decoration: inherit; } /* catalog // Block -> content -> item -> content-inner -> more link */ .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-node-link.field--type-ds.field--label-hidden.field__item { position: absolute; bottom: 30px; left: 30px; display: none; transition: all .5s linear; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser:hover .field.field--name-node-link.field--type-ds.field--label-hidden.field__item { display: block; transition: all .2s linear; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-node-link.field--type-ds.field--label-hidden.field__item a { border: 1px solid var(--color-base-3); /* background-color: #00000040; */ backdrop-filter: blur(5px); color: var(--color-base-2); /* text-decoration: none; */ font-size: var(--fz-btn); padding: 5px 15px; transition: all .5s linear; text-decoration: none; height: 40px; width: 170px; display: flex; justify-content: center; gap: 5px; align-items: center; border-radius: 4px; flex-direction: row-reverse; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-node-link.field--type-ds.field--label-hidden.field__item a:hover { background-color: var(--btn-bg-color-1-hover); border: 1px solid var(--btn-bg-color-1-hover); transition: all .2s linear; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-node-link.field--type-ds.field--label-hidden.field__item a::before { content: ''; display: block; width: 16px; height: 16px; background-image: url(/sites/all/themes/vesta_theme/image/custom-images/tools/arrow-more.png); background-position: center; background-repeat: no-repeat; background-size: contain; } /* catalog // Block -> content -> item -> content-inner -> year */ /* .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .content-inner .field.field--name-field-project-year.field--type-string.field--label-hidden.field__item a { padding: 7px 24px; border: 1px solid var(--color-base-3); background-color: #00000080; backdrop-filter: blur(15px); color: var(--color-base-2); text-decoration: none; font-size: var(--fz-h3-catalog-title); height: 35px; display: flex; justify-content: center; align-items: center; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .content-inner .field.field--name-field-project-year.field--type-string.field--label-hidden.field__item a:hover { background-color: #e9c07680; } */ /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) { .view.view-projects-completed.view-id-projects_completed .view-content .views-row { width: 48.4%; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .content-inner { padding: 15px; } } @media (max-width: 991px) { .catalog-block .view-header .view-header-inner { display: flex; flex-direction: column; align-items: flex-start; } .catalog-block .view-header .view-header-inner .header-title {max-width: 400px;} .catalog-block .view-header .view-header-inner p.front-h2-subtitle {max-width: 100%;} .view.view-projects-completed.view-id-projects_completed .view-content {gap: 20px;} .view.view-projects-completed.view-id-projects_completed .view-content .views-row {width: 48.5%;} .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .content-inner { padding: 10px; gap: 5px; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .content-inner .field.field--name-node-title.field--type-ds.field--label-hidden.field__item h3 a { padding: 7px 10px; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .content-inner .field.field--name-field-project-year.field--type-string.field--label-hidden.field__item a { padding: 7px 10px; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-node-title.field--type-ds.field--label-hidden.field__item { max-width: 250px; } } @media (max-width: 767px) { .view.view-projects-completed.view-id-projects_completed .view-content .views-row { width: 48%; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .content-inner { display: flex; flex-direction: column-reverse; align-items: flex-start; justify-content: space-between; height: 100%; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .content-inner .field.field--name-node-title.field--type-ds.field--label-hidden.field__item { width: 100%; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-field-project-icon.field--type-image.field--label-hidden.field__item { top: 10px; left: 10px; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-node-title.field--type-ds.field--label-hidden.field__item { max-width: 200px; height: 58px; bottom: 70px; left: 10px; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-node-title.field--type-ds.field--label-hidden.field__item h3 { -webkit-line-clamp: 3; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-node-link.field--type-ds.field--label-hidden.field__item { bottom: 10px; left: 10px; } } @media (max-width: 575px) { .view.view-projects-completed.view-id-projects_completed .view-content {gap: 15px;} .view.view-projects-completed.view-id-projects_completed .view-content .views-row {width: 100%;} .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .content-inner { align-items: center; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .content-inner .field.field--name-node-title.field--type-ds.field--label-hidden.field__item h3 a { height: auto; padding: 10px 10px; text-align: center; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-node-title.field--type-ds.field--label-hidden.field__item { max-width: 300px; } } @media (max-width: 460px) { .front .view.view-projects-completed.view-id-projects_completed .view-content .views-row:nth-child(n+4) { display: none; } .view.view-projects-completed.view-id-projects_completed .view-content {gap: 10px;} .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-field-project-photo.field--type-image.field--label-hidden.field__item { aspect-ratio: 570/400; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser { aspect-ratio: initial; height: auto; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-node-title.field--type-ds.field--label-hidden.field__item { height: 39px; } .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-node-title.field--type-ds.field--label-hidden.field__item h3 { -webkit-line-clamp: 2; } } @media (max-width: 350px) { .view.view-projects-completed.view-id-projects_completed .view-content .views-row .node.node--type-projects-completed.node--view-mode-teaser .field.field--name-field-project-photo.field--type-image.field--label-hidden.field__item { aspect-ratio: 570/570; } } /* C A T A L O G // Page */ /* catalog // Page */ /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) {} @media (max-width: 767px) {} @media (max-width: 575px) {} @media (max-width: 460px) {} @media (max-width: 350px) {} /* C A T A L O G // Card's Page */ /* catalog // Card's Page */ /* catalog // Card's Page -> content -> year */ /* .node.node--type-projects-completed.node--view-mode-full .field.field--name-field-project-year.field--type-string.field--label-hidden.field__item { padding: 7px 24px; border: 1px solid var(--color-base-3); background-color: #00000080; backdrop-filter: blur(15px); color: var(--color-base-2); text-decoration: none; font-size: var(--fz-h3-catalog-title); height: 35px; display: flex; justify-content: center; align-items: center; margin-bottom: 20px; width: 100px; } */ /* .node.node--type-projects-completed.node--view-mode-full .field.field--name-field-project-year.field--type-string.field--label-hidden.field__item a { padding: 7px 24px; border: 1px solid var(--color-base-3); background-color: #00000080; backdrop-filter: blur(15px); color: var(--color-base-2); text-decoration: none; font-size: var(--fz-h3-catalog-title); height: 35px; display: flex; justify-content: center; align-items: center; } .node.node--type-projects-completed.node--view-mode-full .field.field--name-field-project-year.field--type-string.field--label-hidden.field__item a:hover { background-color: #e9c07680; } */ /* catalog // Card's Page -> content -> text */ .node.node--type-projects-completed.node--view-mode-full .field.field--name-field-project-description.field--type-text-long.field--label-hidden.field__item { margin-bottom: 20px; } .node.node--type-projects-completed.node--view-mode-full .field.field--name-field-project-description.field--type-text-long.field--label-hidden.field__item p { margin-bottom: 10px; } .node.node--type-projects-completed.node--view-mode-full .field.field--name-field-project-description.field--type-text-long.field--label-hidden.field__item p:hover { margin-bottom: 0px; } /* catalog // Cards Page -> content -> photo-set */ .node.node--type-projects-completed.node--view-mode-full .slider-navigation { position: relative; overflow: hidden; } /* catalog // Cards Page -> content -> photo-set -> set */ .node.node--type-projects-completed.node--view-mode-full .slider-navigation .field.field--name-field-project-photo-set.field--type-image.field--label-hidden.field__items { display: flex; gap: 45px; --gap: 45px; --items-per-view: 3; /* overflow: hidden; */ scroll-behavior: smooth; transition: transform 0.4s ease; margin: 0 30px; } /* catalog // Cards Page -> content -> photo-set -> item */ .node.node--type-projects-completed.node--view-mode-full .slider-navigation .field.field--name-field-project-photo-set.field--type-image.field--label-hidden.field__items .field__item { /* width: 18.5%; */ flex: 0 0 calc((100% - (var(--gap) * (var(--items-per-view) - 1))) / var(--items-per-view)); aspect-ratio: 570/370; /* width: 100%; */ height: auto; overflow: hidden; border-radius: 5px; } .node.node--type-projects-completed.node--view-mode-full .slider-navigation .field.field--name-field-project-photo-set.field--type-image.field--label-hidden.field__items .field__item img { width: 100%; height: 100%; object-fit: cover; } /* catalog // Cards Page -> content -> slider-nav */ .node.node--type-projects-completed.node--view-mode-full .slider-navigation { position: relative; } .projects-nav {margin-top: 30px;} .projects-nav .slider-nav { display: flex; justify-content: center; align-items: flex-end; margin-top: 15px; gap: 10px; } .projects-nav .slider-nav .slider-dots { /* height: 15px; */ display: flex; align-items: center; justify-content: center; gap: 13px; } .projects-nav .slider-nav .slider-dots button { width: 10px; height: 10px; border-radius: 50%; border: none; background-color: var(--bg-color-base-4); cursor: pointer; padding: 0; } .projects-nav .slider-nav .slider-dots button.active { background-color: var(--color-main); /* border: 2px solid white; */ /* box-shadow: 0 0 0px 2px var(--color-base-1); */ } .projects-nav .slider-nav .slider-dots button:hover { background-color: #eccb96; } .projects-nav .slider-nav .slider-btn-inner { display: flex; gap: 15px; align-items: center; justify-content: center; position: absolute; top: 45%; width: 100%; height: 0px; /* 106px */ transform: translateY(-50%); } .projects-nav .slider-nav .slider-btn-inner button { background-repeat: no-repeat; background-position: center; background-size: contain; width: 40px; height: 40px; aspect-ratio: 10/10; border: 0; border-radius: 50%; background-color: var(--bg-color-base-2-opt-50); font-size: 0; color: transparent; position: absolute; } .projects-nav .slider-nav .slider-btn-inner button.slider-prev {left: 0;} .projects-nav .slider-nav .slider-btn-inner button.slider-next {right: 0;} .projects-nav .slider-nav .slider-btn-inner button.slider-prev {background-image: url(/sites/all/themes/vesta_theme/image/custom-images/slider/slider-btn-left.svg);} .projects-nav .slider-nav .slider-btn-inner button.slider-next {background-image: url(/sites/all/themes/vesta_theme/image/custom-images/slider/slider-btn-right.svg);} .projects-nav .slider-nav .slider-btn-inner button:hover { box-shadow: 0 0px 6px 0px var(--bg-color-base-2); background-color: var(--bg-color-base-2); } @media (max-width: 1199px) { .node.node--type-projects-completed.node--view-mode-full .slider-navigation .field.field--name-field-project-photo-set.field--type-image.field--label-hidden.field__items { gap: 40px; --gap: 40px; } .projects-nav .slider-nav .slider-btn-inner { top: 40%; } } @media (max-width: 991px) { .node.node--type-projects-completed.node--view-mode-full .field.field--name-field-project-description.field--type-text-long.field--label-hidden.field__item { text-align: justify; } .node.node--type-projects-completed.node--view-mode-full .slider-navigation .field.field--name-field-project-photo-set.field--type-image.field--label-hidden.field__items { gap: 30px; --gap: 30px; } .projects-nav .slider-nav .slider-btn-inner { top: 38%; } } @media (max-width: 767px) { .node.node--type-projects-completed.node--view-mode-full .slider-navigation .field.field--name-field-project-photo-set.field--type-image.field--label-hidden.field__items { /* gap: 40px; */ /* --gap: 40px; */ } } @media (max-width: 575px) { .node.node--type-projects-completed.node--view-mode-full .slider-navigation .field.field--name-field-project-photo-set.field--type-image.field--label-hidden.field__items { /* margin: 0 50px; gap: 35px; --gap: 35px; */ margin: 0 25px; gap: 25px; --gap: 25px; } .projects-nav .slider-nav .slider-btn-inner button.slider-prev { left: 0px; } .projects-nav .slider-nav .slider-btn-inner button.slider-next { right: 0px; } .projects-nav .slider-nav .slider-btn-inner { top: 35%; } } @media (max-width: 460px) { .node.node--type-projects-completed.node--view-mode-full .slider-navigation .field.field--name-field-project-photo-set.field--type-image.field--label-hidden.field__items { margin: 0px 15px; gap: 15px; --gap: 15px; } .projects-nav .slider-nav .slider-btn-inner { top: 40%; } .projects-nav .slider-nav .slider-btn-inner button { width: 32px; height: 32px; } .projects-nav .slider-nav .slider-dots { gap: 10px; } .projects-nav .slider-nav .slider-dots button { width: 8px; height: 8px; } } @media (max-width: 350px) { .projects-nav .slider-nav .slider-btn-inner { top: 38%; } } /* P H O T O - G A L L E R Y // Block */ /* photo-gallery // Block */ /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) {} @media (max-width: 767px) {} @media (max-width: 575px) {} @media (max-width: 460px) {} @media (max-width: 350px) {} /* P H O T O - G A L L E R Y // Page */ /* photo-gallery // Page */ /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) {} @media (max-width: 767px) {} @media (max-width: 575px) {} @media (max-width: 460px) {} @media (max-width: 350px) {} /* F O R M // Block */ /* form // Block */ #form-block { position: relative; display: flex; align-items: center; justify-content: center; /* padding-right: 0; */ /* border-right: 1px solid var(--color-base-3); */ } #form-block::before { content: ''; display: block; background: url(/sites/all/themes/vesta_theme/image/custom-images/form/bg-form.png); background-repeat: no-repeat; background-position: center; background-size: cover; /* border-radius: 40px; */ /* min-width: 1767px; */ /* max-width: 1767px; */ width: auto; /* min-height: 754px; */ height: 100%; width: 100%; aspect-ratio: 1921/754; position: absolute; top: 0px; left: 0; z-index: 1; /* transform: translateX(-50%); */ } #form-block .region.region-form { position: relative; z-index: 2; margin: 60px 0 80px; display: grid; gap: 30px; grid-template-columns: 6fr 6fr; } /* form // Block -> Text to form */ div#block-vesta_theme_tekstkforme {} .form-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 20px; color: var(--color-base-2); margin-bottom: 30px; } .form-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item::after { display: none; } .form-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item h2.form-title { font-family: var(--ff-main); font-size: var(--fz-form-title); font-style: normal; color: var(--color-base-2); line-height: 1.5; max-width: 350px; margin: 0; } .form-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item h2.form-title span { color: var(--color-base-4); } .form-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item p.form-subtitle { font-size: var(--fz-form-subtitle); max-width: 400px; } .form-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item p { margin-bottom: 5px; font-size: var(--fz-form-text); font-weight: 300; line-height: 1.5; } .form-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item p:last-child { margin-bottom: 0; } /* form // Block -> content */ .form-block div#block-vesta-theme-vebforma div.webform-ajax-form-wrapper { display: flex; align-items: center; justify-content: center; } /* form // Block -> form */ .form-block .webform-ajax-form-wrapper form { width: 100%; position: relative; z-index: 2; display: flex; flex-direction: column; align-items: flex-end; } /* form // Block -> form -> js-form-item */ .form-block .webform-ajax-form-wrapper form .js-form-item.form-item { margin-bottom: 30px; display: flex; gap: 20px; justify-content: flex-end; display: grid; grid-template-columns: 80px 11fr; grid-template-areas: 'a b' '. c'; row-gap: 2px; column-gap: 20px; } /* form // Block -> form -> field labels */ .form-block .webform-ajax-form-wrapper form .js-form-item.form-item label { font-size: var(--fz-form-field-label); color: var(--color-base-2); font-weight: 700; display: none; width: 80px; grid-area: a; } .form-block .webform-ajax-form-wrapper form .js-form-item.form-item:nth-child(1) label, .form-block .webform-ajax-form-wrapper form .js-form-item.form-item:nth-child(2) label { display: block; } /* form // Block -> form -> inputs -> name, phone */ .form-block .webform-ajax-form-wrapper form .js-form-item.form-item input { margin: 0; padding: 0px 0px 10px; height: 37px; max-width: 470px; line-height: 1; border: none; border-bottom: 1px solid var(--color-base-2); border-radius: 0; color: var(--color-base-2); background-color: transparent; font-size: var(--fz-form-input); grid-area: b; } .form-block .webform-ajax-form-wrapper form .js-form-item.form-item input::placeholder { font-size: var(--fz-form-placeholder); color: var(--color-base-3); } .form-block .webform-ajax-form-wrapper form .js-form-item.form-item input:focus { box-shadow: none; outline: 0; } /* form // Block -> form -> textarea -> comment */ .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper { grid-area: b; } .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea { margin: 0; padding: 10px 0px 10px; height: 37px; min-height: 37px; max-height: 200px; max-width: 470px; line-height: 1; border: none; border-bottom: 1px solid var(--color-base-3); border-radius: 0; color: var(--color-base-3); background-color: transparent; font-size: var(--fz-form-input); } .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea::placeholder { color: var(--color-base-3); font-size: var(--fz-form-placeholder); } .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea:focus { box-shadow: none; outline: 0; } /* form // Block -> form -> textarea -> webkit-scrollbar */ .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea::-webkit-scrollbar { width: 15px; } .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea::-webkit-scrollbar-track { background: #fae6c1; } .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea::-webkit-scrollbar-thumb { background: var(--bg-color-main); } /* .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea::-webkit-scrollbar-button { background: antiquewhite; } */ /* form // Block -> form -> inputs -> cheakbox */ .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox { margin: 0 0 30px; max-width: 470px; display: grid; grid-template-columns: 20px 11fr; grid-template-areas: 'a b' 'c c'; row-gap: 2px; column-gap: 17px; align-items: center; font-size: 14px; } .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox input { height: 20px; width: 20px; grid-area: a; } .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox .description { grid-area: b; font-size: var(--fz-form-cheakbox); line-height: 1.5; color: var(--color-base-2); } .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox .description a { color: inherit; } .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox .description a:hover { color: var(--btn-bg-color-1-hover); } /* form // Block -> form -> btn */ .form-block .webform-ajax-form-wrapper form div[id^='edit-actions'] { max-width: 470px; width: 100%; display: flex; align-items: center; justify-content: center; } .form-block .webform-ajax-form-wrapper form button[id^="edit-actions-submit"] { background: var(--btn-bg-color-1); color: var(--color-base-2); border: none; border-radius: 4px; width: 100%; height: 47px; font-weight: 400; font-size: var(--fz-form-btn); position: relative; display: flex; gap: 5px; flex-direction: row-reverse; align-items: center; justify-content: center; } .form-block .webform-ajax-form-wrapper form button[id^="edit-actions-submit"]:hover { color: var(--color-base-2); background: var(--btn-bg-color-1-hover); } .form-block .webform-ajax-form-wrapper form button[id^="edit-actions-submit"]::before { content: ''; display: block; width: 16px; height: 16px; background-image: url(/sites/all/themes/vesta_theme/image/custom-images/tools/arrow-more.png); background-position: center; background-repeat: no-repeat; background-size: contain; } /* form // Block -> form -> errors */ .alert.alert-error.alert-danger.alert-dismissible.fade.show { display: none; } .form-block .webform-ajax-form-wrapper form .js-form-item.form-item strong { color: var(--btn-bg-color-1-hover); } .form-block .webform-ajax-form-wrapper form .js-form-item.form-item .form-item--error-message { grid-area: c; } .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox .form-item--error-message { grid-area: c; font-size: 16px; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) { #form-block .region.region-form { gap: 70px; grid-template-columns: 45fr 75fr; } .form-block .webform-ajax-form-wrapper form .js-form-item.form-item input, .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea, .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox, .form-block .webform-ajax-form-wrapper form div[id^='edit-actions'] { max-width: 460px; } } @media (max-width: 991px) { /* #form-block { padding-right: calc(var(--bs-gutter-x) * .5); border: none; border-bottom: 1px solid var(--color-base-3); } */ #form-block .region.region-form { /* padding-right: 0px; */ /* margin: 80px 0 40px; */ display: flex; flex-direction: column; gap: 0px; } .form-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item { gap: 15px; } /* .form-block .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item p.form-subtitle { max-width: 800px; } */ .form-block .webform-ajax-form-wrapper form .js-form-item.form-item input, .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea, .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox, .form-block .webform-ajax-form-wrapper form div[id^='edit-actions'] { max-width: 470px; } } @media (max-width: 767px) { #form-block .region.region-form { margin: 40px 0 60px; } .form-block .webform-ajax-form-wrapper form .js-form-item.form-item input, .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea, .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox, .form-block .webform-ajax-form-wrapper form div[id^='edit-actions'] { max-width: 420px; } } @media (max-width: 575px) { .form-block .webform-ajax-form-wrapper form .js-form-item.form-item { display: flex; flex-direction: column; row-gap: 5px; } } @media (max-width: 460px) { #form-block .region.region-form { margin: 40px 0 40px; } .form-block .webform-ajax-form-wrapper form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox .form-item--error-message { font-size: 14px; } } @media (max-width: 350px) {} /* F O R M // Page */ /* form // Page */ .not-front main#main div#webform-submission-callback-form-ajax { display: flex; justify-content: center; align-items: center; padding: 0px 200px 0px; position: relative; /* border-radius: 40px; */ overflow: hidden; } /* form // Page -> content */ form#webform-submission-callback-add-form { position: relative; z-index: 2; } form#webform-submission-callback-add-form .js-form-item.form-item { margin-bottom: 15px; } form#webform-submission-callback-add-form .js-form-item.form-item label { display: none; font-size: var(--fz-form-field-label); } /* form // Page -> inputs -> name, phone */ form#webform-submission-callback-add-form .js-form-item.form-item input { margin: 0; padding: 11px 18px 10px; height: 45px; line-height: 1; border: none; border-radius: 0; color: var(--color-base-1); background-color: #eee; font-size: var(--fz-form-input); } form#webform-submission-callback-add-form .js-form-item.form-item input::placeholder { color: #848484; font-size: var(--fz-form-placeholder); } form#webform-submission-callback-add-form .js-form-item.form-item input:focus { box-shadow: none; outline: 0; } /* form // Page -> textarea -> comment */ form#webform-submission-callback-add-form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea { margin: 0; padding: 11px 18px 10px; height: 95px; min-height: 95px; max-height: 200px; line-height: 1; border: none; border-radius: 0; color: var(--color-base-1); background-color: #eee; font-size: var(--fz-form-input); } form#webform-submission-callback-add-form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea::placeholder { color: #848484; font-size: var(--fz-form-placeholder); } form#webform-submission-callback-add-form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea:focus { box-shadow: none; outline: 0; } /* form // Block -> form -> textarea -> webkit-scrollbar */ form#webform-submission-callback-add-form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea::-webkit-scrollbar { width: 15px; } form#webform-submission-callback-add-form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea::-webkit-scrollbar-track { background: #fae6c1; } form#webform-submission-callback-add-form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea::-webkit-scrollbar-thumb { background: var(--bg-color-main); } /* form#webform-submission-callback-add-form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea::-webkit-scrollbar-button { background: antiquewhite; } */ /* form // Page -> inputs -> cheakbox */ form#webform-submission-callback-add-form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox { margin: 20px 0; display: grid; grid-template-columns: 20px 11fr; grid-template-areas: 'a b' 'c c'; row-gap: 2px; column-gap: 20px; align-items: center; font-size: 14px; } form#webform-submission-callback-add-form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox input { width: 20px; height: 20px; grid-area: a; } form#webform-submission-callback-add-form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox .description { grid-area: b; font-size: var(--fz-form-cheakbox); } form#webform-submission-callback-add-form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox .description a { color: var(--color-main); text-decoration: none; } form#webform-submission-callback-add-form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox .description a:hover { text-decoration: underline; } /* form // Page -> btn */ form#webform-submission-callback-add-form button[id^="edit-actions-submit"] { background-color: var(--bg-color-base-1); color: var(--color-base-2); border: none; border: 1px solid var(--bg-color-base-2); border-radius: 0; width: 100%; height: 47px; font-weight: 400; font-size: var(--fz-form-btn); position: relative; } form#webform-submission-callback-add-form button[id^="edit-actions-submit"]:hover { background-color: var(--bg-color-main); /* color: var(--color-base-1); */ border: 1px solid var(--bg-color-main); } /* form // Page -> errors */ .alert.alert-error.alert-danger.alert-dismissible.fade.show { display: none; } form#webform-submission-callback-add-form .js-form-item.form-item strong { color: var(--btn-bg-color-1-hover); } form#webform-submission-callback-add-form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox .form-item--error-message { grid-area: c; font-size: 16px; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) { .not-front main#main div#webform-submission-callback-form-ajax {padding: 0px 150px 0px;} } @media (max-width: 991px) { .not-front main#main div#webform-submission-callback-form-ajax {padding: 0px 100px 0px;} } @media (max-width: 767px) { .not-front main#main div#webform-submission-callback-form-ajax { padding: 0px 50px 0px; } } @media (max-width: 575px) { .not-front main#main div#webform-submission-callback-form-ajax { padding: 0px 0px 0px; } } @media (max-width: 460px) {} @media (max-width: 350px) {} /* F O R M // Modal */ /* form // Modal */ .modal-content { border: 3px solid var(--color-main); border-radius: 15px; overflow: hidden; background-color: var(--bg-color-base-3); } /* form // Modal -> Header */ .modal-content .modal-header { background-color: var(--color-main); /* background-color: transparent; */ color: var(--color-base-2); border-bottom: 1px solid var(--bg-color-main); border-radius: 0; } .modal-content .modal-header .modal-title { text-transform: uppercase; font-family: var(--ff-main); font-weight: 700; font-size: var(--fz-form-title-Modal); } .modal-content .modal-header button.btn-close { background-image: url(/sites/all/themes/vesta_theme/image/custom-images/form/close.svg); background-position: center; background-size: auto; background-repeat: no-repeat; background-color: #ffffff; } /* form // Modal -> body */ .modal-content .modal-body form {} .modal-content .modal-body form .js-form-item.form-item { margin: 0px 0px 15px; } .modal-content .modal-body form label { display: none; font-size: var(--fz-form-field-label); } /* form // Modal -> body -> inputs -> name, phone */ .modal-content .modal-body form .js-form-item.form-item input { margin: 0; padding: 11px 18px 10px; height: 45px; line-height: 1; border: none; border-radius: 5px; color: var(--color-base-1); background-color: #fff; font-size: var(--fz-form-input); } .modal-content .modal-body form .js-form-item.form-item input::placeholder { color: #848484; font-size: var(--fz-form-placeholder); } .modal-content .modal-body form .js-form-item.form-item input:focus { box-shadow: none; outline: 0; } /* form // Modal -> body -> textarea -> comment */ .modal-content .modal-body form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea { margin: 0; padding: 11px 18px 10px; height: 95px; min-height: 95px; max-height: 200px; line-height: 1; border: none; border-radius: 5px; color: var(--color-base-1); background-color: #fff; font-size: var(--fz-form-input); } .modal-content .modal-body form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea::placeholder { color: #848484; font-size: var(--fz-form-placeholder); } .modal-content .modal-body form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea:focus { box-shadow: none; outline: 0; } /* form // Block -> body -> form -> textarea -> webkit-scrollbar */ .modal-content .modal-body form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea::-webkit-scrollbar { width: 15px; } .modal-content .modal-body form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea::-webkit-scrollbar-track { background: #fae6c1; } .modal-content .modal-body form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea::-webkit-scrollbar-thumb { background: var(--bg-color-main); } /* .modal-content .modal-body form .js-form-item.form-item.js-form-type-textarea.form-type-textarea .form-textarea-wrapper textarea::-webkit-scrollbar-button { background: antiquewhite; } */ /* form // Modal -> body -> inputs -> cheakbox */ .modal-content .modal-body form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox { margin: 10px 5px; display: grid; grid-template-columns: 20px 11fr; grid-template-areas: 'a b' 'c c'; row-gap: 2px; column-gap: 20px; align-items: center; font-size: 14px; } .modal-content .modal-body form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox input { height: 20px; width: 20px; grid-area: a; } .modal-content .modal-body form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox .description { grid-area: b; font-size: var(--fz-form-cheakbox); } .modal-content .modal-body form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox .description a { color: var(--color-main); text-decoration: none; } .modal-content .modal-body form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox .description a:hover { text-decoration: underline; } /* form // Modal -> footer */ .modal-content .modal-footer { border-top: 1px solid var(--bg-color-main); } /* form // Modal -> footer -> btn */ .modal-content .modal-footer button[class^="webform-button--submit"] { background-color: var(--color-main); color: var(--color-base-2); border: none; border-radius: 0; width: 100%; height: 40px; font-weight: 600; font-size: var(--fz-form-btn); position: relative; } .modal-content .modal-footer button[class^="webform-button--submit"]:hover { background-color: var(--color-special); } /* form // Modal -> errors */ .alert.alert-error.alert-danger.alert-dismissible.fade.show { display: none; } .modal-content .modal-body form .js-form-item.form-item strong { color: var(--btn-bg-color-1-hover); } .modal-content .modal-body form .js-form-item.form-item.js-form-type-checkbox.form-type-checkbox .form-item--error-message { grid-area: c; font-size: 16px; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) {} @media (max-width: 767px) {} @media (max-width: 575px) {} @media (max-width: 460px) {} @media (max-width: 350px) {} /* M A P // Block */ /* map // Block */ .mapContainer { width: 100%; height: 400px; margin-top: 20px; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) {} @media (max-width: 767px) {} @media (max-width: 575px) {} @media (max-width: 460px) {} @media (max-width: 350px) {} /* C O N T A C T S // Head */ /* contacts // Head */ .head-contacts .contacts { display: flex; justify-content: space-between; align-items: center; gap: 15px; /*45*/ } /* contacts // Head -> set's */ .head-contacts .contacts .contacts-set { gap: 40px; display: flex; align-items: center; justify-content: center; } .head-contacts .contacts .contacts-set-mes { display: flex; align-items: center; justify-content: center; } /* contacts // Head -> set-inner */ /* contacts // Head -> set-inner -> field */ .head-contacts .contacts .contacts-set p.contacts-text { color: var(--color-base-2); margin: 0; } .head-contacts .contacts .contacts-set p.contacts-text:hover { color: var(--color-base-4); } .head-contacts .contacts .contacts-set p.contacts-text a { color: inherit; text-decoration: none; width: 100%; display: flex; gap: 8px; align-items: center; font-size: var(--fz-nav-head); } .head-contacts .contacts .contacts-set p.contacts-text a:hover { color: inherit; text-decoration: underline; } .head-contacts .contacts .contacts-set p.contacts-text a::before { content: ''; display: block; width: 14px; height: 14px; background-image: url(/sites/all/themes/vesta_theme/image/custom-images/header/call.svg); background-position: center; background-repeat: no-repeat; background-size: contain; } .head-contacts .contacts .contacts-set p.contacts-text.address span { display: flex; gap: 8px; width: 100%; align-items: center; } /* contacts // Head -> set-inner -> soc-mes */ .head-contacts .contacts .contacts-set-mes .contacts-col { display: flex; justify-content: space-between; gap: 6px; } .head-contacts .contacts .contacts-set-mes a.soc-mes { width: 32px; height: auto; aspect-ratio: 33/33; overflow: hidden; border-radius: 5px; } .head-contacts .contacts .contacts-set-mes a.soc-mes img { width: 100%; height: 100%; object-fit: contain; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) { .head-contacts .contacts { gap: 20px; } .head-contacts .contacts .contacts-set { gap: 20px; } .head-contacts .contacts .contacts-set-mes .contacts-col { /* gap: 5px; */ display: flex; flex-wrap: wrap; width: 70px; } } @media (max-width: 991px) {} @media (max-width: 767px) {} @media (max-width: 575px) {} @media (max-width: 460px) {} @media (max-width: 350px) {} /* C O N T A C T S // Head-Mobile */ /* contacts // Head-Mobile */ #header-mob .head-mob-contacts .contacts { display: flex; justify-content: space-between; align-items: center; gap: 25px; } /* contacts // Head -> set's */ #header-mob .head-mob-contacts .contacts .contacts-set-mes { display: flex; align-items: center; justify-content: center; } #header-mob .head-mob-contacts .contacts p.contacts-text { color: var(--color-base-2); margin-bottom: 0; } #header-mob .head-mob-contacts .contacts p.contacts-text:hover { color: var(--color-main); } #header-mob .head-mob-contacts .contacts p.contacts-text a { color: inherit; text-decoration: none; display: flex; gap: 8px; align-items: center; font-size: var(--fz-nav-head); } #header-mob .head-mob-contacts .contacts p.contacts-text a::before { content: ''; display: block; width: 14px; height: 14px; background-image: url(/sites/all/themes/vesta_theme/image/custom-images/header/call.svg); background-position: center; background-repeat: no-repeat; background-size: contain; } #header-mob .head-mob-contacts .contacts p.contacts-text a:hover { color: inherit; text-decoration: underline; } /* contacts // Head -> set-inner -> soc-mes */ .head-mob-contacts .contacts .contacts-set-mes .contacts-col { display: flex; justify-content: space-between; gap: 10px; } .head-mob-contacts .contacts .contacts-set-mes .contacts-col a.soc-mes { width: 30px; height: auto; aspect-ratio: 33/33; overflow: hidden; border-radius: 5px; } .head-mob-contacts .contacts .contacts-set-mes .contacts-col a.soc-mes img { width: 100%; height: 100%; object-fit: contain; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) {} @media (max-width: 767px) {} @media (max-width: 575px) { #header-mob .head-mob-contacts .contacts .contacts-set-1 { display: none; } .head-mob-contacts .contacts .contacts-set-mes .contacts-col a.soc-mes { width: 40px; } } @media (max-width: 460px) { .head-mob-contacts .contacts .contacts-set-mes .contacts-col { gap: 5px; } } @media (max-width: 350px) { #header-mob .head-mob-contacts .contacts .contacts-set-mes { display: none; } } /* C O N T A C T S // Foot */ /* contacts // Foot */ .foot-contacts .contacts { display: flex; flex-direction: column; gap: 27px; } .foot-contacts .region.region-contacts-footer { display: flex; flex-direction: column; gap: 100px; } .foot-contacts .region.region-contacts-footer div[id^='block-vesta-theme-contact-block'] .block-title { font-weight: 600; text-transform: uppercase; margin-bottom: 16px; } /* contacts // Foot -> set's */ .foot-contacts .contacts .contacts-set { display: flex; flex-direction: column; /* gap: 10px; */ } .foot-contacts .contacts .contacts-set-1 { max-width: 270px; font-size: 15px; font-weight: 600; } .foot-contacts .contacts .contacts-set-2 { gap: 5px; } .foot-contacts .contacts .contacts-set-mes { display: flex; align-items: flex-start; } /* contacts // Foot -> set-inner */ /* contacts // Foot -> set-inner -> field */ .foot-contacts .contacts .contacts-set p.contacts-text { color: var(--color-base-1); margin: 0; } .foot-contacts .contacts .contacts-set p.contacts-text:hover { color: var(--color-main); } .foot-contacts .contacts .contacts-set p.contacts-text a { color: inherit; text-decoration: none; width: 100%; /* display: block; */ display: flex; gap: 8px; align-items: center; margin-top: 27px; } .foot-contacts .contacts .contacts-set p.contacts-text a:hover { color: inherit; text-decoration: underline; } .foot-contacts .contacts .contacts-set p.contacts-text.address span { display: flex; gap: 8px; width: 100%; align-items: center; } /* contacts // Foot -> set-inner -> soc-mes */ .foot-contacts .contacts .contacts-set-mes .contacts-col { display: flex; justify-content: space-between; gap: 5px; } .foot-contacts .contacts .contacts-set-mes a.soc-mes { width: 36px; height: auto; aspect-ratio: 33/33; } .foot-contacts .contacts .contacts-set-mes a.soc-mes img { width: 100%; height: 100%; object-fit: contain; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) { .foot-contacts .contacts { gap: 20px; } } @media (max-width: 991px) { .foot-contacts .contacts { display: flex; flex-direction: row-reverse; } .foot-contacts .contacts .contacts-set-mes .contacts-col { gap: 15px; display: flex; /* flex-direction: column; */ flex-wrap: wrap; max-width: 87px; } .foot-contacts .region.region-contacts-footer .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item { display: flex; } } @media (max-width: 767px) { /* .foot-contacts .contacts { display: flex; flex-direction: column; align-items: flex-start; } */ /* .foot-contacts .contacts .contacts-set-mes { display: flex; align-items: center; } */ /* .foot-contacts .contacts .contacts-set-mes .contacts-col { display: flex; flex-direction: row; gap: 8px; } */ .foot-contacts .region.region-contacts-footer { gap: 20px; } } @media (max-width: 575px) { .foot-contacts .contacts { display: flex; flex-direction: column; } .foot-contacts .contacts .contacts-set-mes .contacts-col { display: flex; flex-direction: row; gap: 5px; max-width: 100%; } .foot-contacts .contacts .contacts-set p.contacts-text a { margin-top: 15px; } footer#footer .row-content .foot-col-nav nav ul.nav li.nav-item:first-child a { margin-bottom: 5px; } } @media (max-width: 460px) {} @media (max-width: 350px) {} /* C O N T A C T S // Block */ /* contacts // Block */ /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) {} @media (max-width: 767px) {} @media (max-width: 575px) {} @media (max-width: 460px) {} @media (max-width: 350px) {} /* C O N T A C T S // Page */ /* contacts // Page */ .view.view-kontakty.view-id-kontakty {} .view.view-kontakty.view-id-kontakty .contacts { display: flex; flex-direction: column; gap: 15px; } .view.view-kontakty.view-id-kontakty .contacts .contacts-set { display: flex; flex-direction: column; gap: 10px; } .view.view-kontakty.view-id-kontakty .contacts .contacts-title { font-size: 20px; font-weight: 700; color: var(--color-main); } .view.view-kontakty.view-id-kontakty .contacts p.contacts-text { color: var(--color-base-1); margin: 0; } .view.view-kontakty.view-id-kontakty .contacts p.contacts-text:hover { color: var(--color-main); } .view.view-kontakty.view-id-kontakty .contacts p.contacts-text span.contacts-label { font-weight: 500; color: var(--bg-color-base-1); } .view.view-kontakty.view-id-kontakty .contacts p.contacts-text span { color: inherit; } .view.view-kontakty.view-id-kontakty .contacts p.contacts-text a { text-decoration: none; color: inherit; } .view.view-kontakty.view-id-kontakty .contacts p.contacts-text a:hover { text-decoration: underline; color: inherit; } /* contacts // Page */ .view.view-kontakty.view-id-kontakty .contacts .contacts-set .contacts-col p.contacts-label { font-weight: 500; margin-bottom: 5px; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) {} @media (max-width: 767px) {} @media (max-width: 575px) {} @media (max-width: 460px) {} @media (max-width: 350px) {} /* R E V I E W S // Block */ /* reviews // Block */ div#reviews-block { padding: 60px 0 80px; } #reviews-block .region.region-reviews div#block-vesta-theme-review-widget .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item { display: flex; justify-content: center; align-items: center; } #reviews-block .region.region-reviews div#block-vesta-theme-review-widget .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item div { height: 800px !important; width: 750px !important; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) {} @media (max-width: 991px) { #reviews-block .region.region-reviews div#block-vesta-theme-review-widget .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item div { width: 650px !important; height: 750px !important; } } @media (max-width: 767px) { #reviews-block .region.region-reviews div#block-vesta-theme-review-widget .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item div { width: 500px !important; height: 700px !important; } } @media (max-width: 575px) { #reviews-block .region.region-reviews div#block-vesta-theme-review-widget .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item div { width: 100% !important; height: 650px !important; } } @media (max-width: 460px) { #reviews-block .region.region-reviews div#block-vesta-theme-review-widget .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item div { height: 580px !important; } } @media (max-width: 350px) { #reviews-block .region.region-reviews div#block-vesta-theme-review-widget .field.field--name-body.field--type-text-with-summary.field--label-hidden.field__item div { height: 500px !important; } } /* F O O T E R S // Block */ /* footers // Block */ /* footers // Block -> content */ footer#footer .row-content { display: grid; gap: 100px; grid-template-columns: 2fr 9fr 3fr; /* border-bottom: 1px solid var(--color-base-1); */ padding: 60px 0; } footer#footer .row-content .content-inner { margin: 120px 0; padding-left: 50px; display: flex; flex-direction: row-reverse; justify-content: space-between; gap: 80px; } /* footers // Block -> content -> column-01 */ footer#footer .row-content .foot-col-one { display: flex; flex-direction: column; gap: 15px; } footer#footer .row-content .foot-col-one, footer#footer .row-content .foot-col-two, footer#footer .row-content .foot-col-three { padding: 0; } /* footers // Block -> content -> column-01 -> logo */ footer#footer .row-content .foot-col-one .logo { width: 100%; max-width: 142px; height: auto; aspect-ratio: 142/182; } footer#footer .row-content .foot-col-one .logo img { width: 100%; height: 100%; object-fit: contain; } /* footers // Block -> content -> column-02 */ footer#footer .row-content .foot-col-nav { /* width: 50%; */ display: flex; gap: 100px; } /* footers // Block -> content -> column-02 -> nav */ footer#footer .row-content .foot-col-nav nav ul.nav { width: 100%; display: flex; flex-direction: column; flex-wrap: wrap; } footer#footer .row-content .foot-col-nav nav ul.nav li.nav-item { width: 100%; } footer#footer .row-content .foot-col-nav nav ul.nav li.nav-item a { color: var(--color-base-1); padding: 5px 0px; } footer#footer .row-content .foot-col-nav nav ul.nav li.nav-item a:hover { color: var(--color-main); } footer#footer .row-content .foot-col-nav nav ul.nav li.nav-item a.is-active { text-decoration: underline; } footer#footer .row-content .foot-col-nav nav ul.nav li.nav-item:first-child a { margin-bottom: 15px; font-weight: 700; padding: 0px 0px 5px 0px; font-size: var(--fz-nav-title); } footer#footer .row-content .foot-col-nav .view.view-services-fortune.view-id-services_fortune .view-header { margin-bottom: 20px; } footer#footer .row-content .foot-col-nav .view.view-services-fortune.view-id-services_fortune .view-header h2 { font-size: var(--fz-nav-title); font-family: var(--ff-base); text-transform: none; font-weight: 700; } footer#footer .row-content .foot-col-nav .view.view-services-fortune.view-id-services_fortune .view-content { gap: 20px; row-gap: 10px; display: flex; flex-wrap: wrap; justify-content: space-between; font-size: var(--fz-nav-foot); } footer#footer .row-content .foot-col-nav .view.view-services-fortune.view-id-services_fortune .view-content .views-row { width: 47.5%; aspect-ratio: auto; border: none; } footer#footer .row-content .foot-col-nav .view.view-services-fortune.view-id-services_fortune .view-content .views-row .views-field.views-field-title span.field-content { width: 100%; display: block; } footer#footer .row-content .foot-col-nav .view.view-services-fortune.view-id-services_fortune .view-content .views-row .views-field.views-field-title span.field-content a { width: 100%; display: block; padding: 5px 0; color: var(--color-base-1); text-decoration: none; } footer#footer .row-content .foot-col-nav .view.view-services-fortune.view-id-services_fortune .view-content .views-row:first-child .views-field.views-field-title span.field-content a { padding-top: 0; } footer#footer .row-content .foot-col-nav .view.view-services-fortune.view-id-services_fortune .view-content .views-row .views-field.views-field-title span.field-content a:hover { color: var(--color-main); } /* footers // Block -> content -> column-03 */ footer#footer .row-content .foot-col-contacts { /* width: 50%; */ } /* footers // Block -> copyright */ footer#footer .row-copiryght { border-top: 1px solid var(--color-base-1); } footer#footer .row-copiryght .copiryght-inner { display: flex; gap: 20px; align-items: center; justify-content: space-between; font-family: var(--ff-secondary); font-size: var(--fz-small); padding: 20px 0; } footer#footer .row-copiryght .copiryght-item { width: auto; color: inherit; text-decoration: none; } footer#footer .row-copiryght .copiryght-item:hover { color: var(--color-main); } footer#footer .row-copiryght .copiryght-item span { font-weight: 700; } /* MEDIA SIZE */ /* @media (max-width: 1699px) {} */ /* @media (max-width: 1399px) {} */ @media (max-width: 1199px) { /* footer#footer .row-content .content-inner { padding-left: 20px; gap: 40px; } */ footer#footer .row-copiryght .copyright-col { width: 100%; } footer#footer .row-copiryght .copyright-col.col-one, footer#footer .row-copiryght .copyright-col.col-two, footer#footer .row-copiryght .copyright-col.col-three {text-align: center;} footer#footer .row-content { gap: 40px; } footer#footer .row-content .foot-col-nav { gap: 40px; } } @media (max-width: 991px) { footer#footer .row-content { /* display: flex; */ /* justify-content: center; */ display: grid; grid-template-columns: 4fr 8fr; grid-template-areas: 'a c' 'b b'; } footer#footer .row-content .foot-col-one, footer#footer .row-content .foot-col-two, footer#footer .row-content .foot-col-three { padding: 0 12px; } footer#footer .row-content .foot-col-one { grid-area: a; } footer#footer .row-content .foot-col-two { grid-area: b; display: grid; grid-template-columns: 4fr 8fr; } footer#footer .row-content .foot-col-three { grid-area: c; padding-left: 0; } footer#footer .row-content .foot-col-nav .view.view-services-fortune.view-id-services_fortune .view-content { gap: 10px; } footer#footer .row-content .foot-col-nav .view.view-services-fortune.view-id-services_fortune .view-content .views-row { width: 100%; } /* footer#footer .row-content .content-inner { padding-left: calc(var(--bs-gutter-x) * .5); margin: 40px 0; } */ footer#footer .row-copiryght .copiryght-inner { display: flex; flex-direction: column; gap: 10px; } footer#footer .row-copiryght .copiryght-item { width: 100%; text-align: center; } footer#footer .row-copiryght a.privacy, footer#footer .row-copiryght a.copiryght { text-align: center; } footer#footer .row-copiryght a.agreement, footer#footer .row-copiryght a.webvesta { text-align: center; } } @media (max-width: 767px) { /* footer#footer .row-content .content-inner { flex-direction: column-reverse; } */ footer#footer .row-content .foot-col-contacts { width: 100%; } /* footer#footer .row-content { display: flex; align-items: center; justify-content: center; } */ footer#footer .row-content .foot-col-one { display: flex; align-items: center; text-align: center; } footer#footer .row-content .foot-col-nav { width: 100%; } footer#footer .row-content .foot-col-nav nav ul.nav { margin-top: 0px; display: flex; align-items: flex-start; justify-content: center; } footer#footer .row-content .foot-col-nav nav ul.nav li.nav-item { width: 100%; } footer#footer .row-copiryght { padding: 0 12px; } footer#footer .row-content { padding: 50px 0; } } @media (max-width: 575px) { footer#footer .row-copiryght .copiryght-item { width: 100%; } footer#footer .row-copiryght .copiryght-item, footer#footer .row-copiryght a.privacy, footer#footer .row-copiryght a.agreement, footer#footer .row-copiryght a.copiryght, footer#footer .row-copiryght a.webvesta { text-align: left; } footer#footer .row-content { gap: 20px; } footer#footer .row-content .foot-col-two { gap: 20px; } footer#footer .row-content .foot-col-one .logo { max-width: 100px; } footer#footer .row-content { display: flex; align-items: center; justify-content: center; flex-direction: column; } footer#footer .row-content .foot-col-one { align-items: flex-start; } footer#footer .row-content .foot-col-two { display: flex; flex-direction: column; } footer#footer .row-content .foot-col-nav .view.view-services-fortune.view-id-services_fortune .view-header { margin-bottom: 10px; } footer#footer .row-content .foot-col-three { padding-left: 12px; } } @media (max-width: 460px) { /* footer#footer .row-content .content-inner { margin: 30px 0; } */ footer#footer .row-content { padding: 40px 0; } } @media (max-width: 350px) {}