/* Основные стили для компьютера */ /* Header */ .header { background: var(--main_white); border-bottom: 1px solid var(--interface_title); position: fixed; top: 0; left: 0; width: 100%; z-index: 4; } .header-container { display: flex; align-items: center; justify-content: space-between; padding: 16px 0; } .header-bars { display: none; } .header-logo { display: flex; align-items: center; gap: 8px; } .header-logo span { color: var(---main_black); font-size: 20px; text-transform: uppercase; } .header-navs { display: flex; align-items: center; gap: 24px; } .header-navs__link { padding: 8px 12px; font-size: 16px; font-weight: bold; text-transform: uppercase; line-height: 20px; } .header-accordion {} .header-accordion__btn { display: flex; align-items: center; gap: 4px; padding: 8px 12px; border-radius: 24px; background: var(--accent-2); cursor: pointer; user-select: none; font-size: 16px; font-weight: bold; line-height: 20px; color: var(---main_black); } .header-right { display: flex; align-items: center; gap: 8px; } .header-lang__btn { display: flex; align-items: center; cursor: pointer; user-select: none; gap: 4px; padding: 12px 15px; color: var(---main_black); font-size: 16px; font-weight: bold; line-height: 20px; } /* Header end */ /* Footer */ .footer { background: var(--main_black); padding: 40px 0 38px; color: var(--main_white); } .footer-top { display: flex; align-items: stretch; justify-content: space-between; gap: 48px; } .footer-top .logo { display: flex; align-items: center; gap: 10px; font-size: 20px; font-weight: 500; text-transform: uppercase; background: var(--accent-1); color: transparent; -webkit-background-clip: text; background-clip: text; margin-bottom: 24px; } .footer-content__address { font-size: 24px; font-weight: 500; line-height: 32px; margin-bottom: 32px; } .footer-content { width: 100%; } .footer-content ul { display: flex; flex-direction: column; gap: 24px; } .footer-content ul li { display: flex; flex-direction: column; gap: 4px; } .footer-content ul p { font-size: 16px; font-weight: bold; line-height: 20px; } .footer-content ul a { font-size: 24px; font-weight: 500; line-height: 32px; } .footer-content__wrap { display: flex; align-items: flex-end; justify-content: space-between; width: 100%; } .footer-top__link { display: flex; flex-direction: column; gap: 24px; } .footer-top__link .link-black { padding: 7px 15px; color: var(--main_white); font-size: 24px; line-height: 32px; font-weight: 500; white-space: nowrap; border: 1px solid var(--main_white); border-radius: 24px; } .footer-top__link .link-white { width: 100%; text-align: center; background: var(--main_white); color: var(--main_black); font-size: 20px; font-weight: 600; line-height: 24px; padding: 12px; border-radius: 20px; } .footer-contact { width: 364px; flex-shrink: 0; background: var(--accent-1); border-radius: 24px; padding: 24px; display: flex; flex-direction: column; gap: 16px; } .footer-contact__title { color: var(--main_black); font-size: 24px; font-weight: 500; line-height: 32px; } .footer-contact__submit { width: 100%; text-align: center; height: 48px; border-radius: 16px; background: var(--main_black); font-size: 20px; font-weight: 600; line-height: 24px; color: var(--main_white); } .footer-bottom { display: flex; align-items: center; justify-content: space-between; padding-top: 17px; margin-top: 19px; border-top: 1px solid var(--main_white); } .footer-network { display: flex; align-items: center; gap: 32px; } .footer-bottom a { font-size: 16px; line-height: 20px; font-weight: 500; color: var(--main_white); opacity: 0.6; text-decoration: underline; } /* Footer end */ /* Where home */ .where-home { padding: 162px 0 37px; color: var(--background); } .where-home h1 { font-size: 82px; font-weight: bold; line-height: 96px; margin-bottom: 41px; text-transform: uppercase; } .where-home p { max-width: 928px; color: #FFF; font-size: 36px; font-weight: bold; line-height: 40px; text-transform: uppercase; } /* Where home end */ /* Find us */ .find-us { color: var(--background); padding-bottom: 24px; } .find-us h2 { padding: 10px 0; font-size: 36px; font-weight: bold; line-height: 40px; text-transform: uppercase; margin-bottom: 24px; } .find-us ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px; } .find-us h3 { font-size: 24px; font-weight: bold; line-height: 28px; margin-bottom: 8px; text-transform: uppercase; } .find-us p { font-size: 24px; font-weight: 500; line-height: 32px; } /* Find us end */ /* Location */ .location { padding-bottom: 35px; } .location h2 { padding: 10px 0; margin-bottom: 37px; text-align: right; font-size: 36px; font-weight: bold; line-height: 40px; text-transform: uppercase; color: var(--main_white); } .location iframe { height: 783px; width: 100%; border-radius: 64px; } /* Location end */ /* Sell form */ .sell-form { padding-bottom: 31px; } .sell-form__container { background: var(--main_white); border-radius: 64px; padding: 64px 105px 38px; color: var(--grey-black); display: flex; flex-direction: column; gap: 48px; } .sell-form h2 { font-size: 36px; font-weight: bold; line-height: 40px; text-transform: uppercase; } .sell-form p { text-transform: uppercase; font-size: 24px; font-weight: bold; line-height: 28px; } .sell-form form { display: flex; flex-direction: column; align-items: center; gap: 16px; } .sell-form form button { background: var(--main_black); padding: 11px 70px; color: var(--main_white); text-transform: uppercase; border-radius: 16px; font-size: 20px; font-weight: 600; line-height: 24px; border: 1px solid var(--main_black); } .sell-form form button:hover { background: var(--main_white); color: var(--main_black); } /* Sell form end */ /* Breadcrumb */ .breadcrumb { padding: 108px 0 24px; } .breadcrumb .container { color: var(--main_white); font-size: 14px; font-weight: 500; line-height: 16px; } .breadcrumb a { display: inline; } /* Breadcrumb end */ /* Authors */ .authors { padding-bottom: 120px; } .authors h2 { font-weight: bold; font-size: 64px; line-height: 120%; color: white; text-transform: uppercase; margin-bottom: 36px; } .authors ul { display: flex; flex-wrap: wrap; align-items: stretch; justify-content: center; gap: 24px; } .authors li { background: #F5F5F5; border-radius: 48px; display: flex; flex-direction: column; align-items: center; text-align: center; width: calc(100% / 3 - 16px); } .authors a { padding: 52px 17px 57px; width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; } .authors .main-img { width: 200px; height: 200px; border-radius: 50%; overflow: hidden; flex-shrink: 0; margin-bottom: 31px; } .authors .main-img img { width: 100%; height: 100%; object-fit: cover; } .authors-name { font-size: 24px; font-weight: bold; text-transform: uppercase; line-height: 28px; color: #121212; margin-bottom: 5px; } .authors-type { color: #121212; font-size: 24px; font-weight: 500; line-height: 32px; margin-bottom: 31px; } .authors p { color: #666666; font-weight: 500; font-size: 20px; line-height: 24px; } /* Authors end */ /* Author */ .author { padding-bottom: 36px; } .author-content { display: flex; align-items: center; gap: 31px; margin-bottom: 17.5px; } .author .main-img { width: 278px; height: 278px; flex-shrink: 0; border-radius: 48px; overflow: hidden; } .author .main-img img { width: 100%; height: 100%; object-fit: cover; } .author-name { font-size: 24px; font-weight: bold; line-height: 28px; color: white; margin-bottom: 5px; text-transform: uppercase; } .author-type { font-size: 24px; font-weight: 500; line-height: 32px; color: white; margin-bottom: 5px; } .author-description { font-size: 24px; font-weight: 500; line-height: 32px; color: white; margin-bottom: 45px; } .author p { font-size: 20px; font-weight: 500; line-height: 24px; color: white; } .author h2 { font-size: 64px; font-weight: bold; line-height: 120%; color: white; } /* Author end */