Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- html {
- -webkit-box-sizing: border-box;
- box-sizing: border-box; }
- *,
- *::before,
- *::after {
- -webkit-box-sizing: inherit;
- box-sizing: inherit; }
- .title {
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 32px;
- line-height: 39px;
- color: #333333;
- font-weight: 900;
- padding: 0;
- margin: 0;
- text-transform: uppercase;
- padding-bottom: 30px;
- position: relative;
- margin-bottom: 30px; }
- .title::before {
- content: "";
- position: absolute;
- bottom: 0;
- left: 0;
- width: 170px;
- height: 5px;
- background: -webkit-gradient(linear, right top, left top, from(#F9D423), to(#F83600));
- background: linear-gradient(270deg, #F9D423 0%, #F83600 100%);
- border-radius: 5px; }
- .title--white {
- color: #ffffff;
- background: none;
- -webkit-text-fill-color: inherit; }
- .subtitle {
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 18px;
- line-height: 22px;
- font-weight: 600;
- color: #333333;
- padding: 0;
- margin: 0;
- text-transform: uppercase;
- background: -webkit-gradient(linear, right top, left top, from(#F9D423), to(#F83600));
- background: linear-gradient(270deg, #F9D423 0%, #F83600 100%);
- -webkit-text-fill-color: transparent;
- -webkit-background-clip: text;
- background-clip: text;
- padding-bottom: 20px; }
- .subtitle--white {
- color: #ffffff;
- background: none;
- -webkit-text-fill-color: inherit; }
- .background-text {
- display: none; }
- @media (min-width: 420px) {
- .title {
- font-size: 20px;
- line-height: 1.2;
- position: relative;
- z-index: 10; }
- .subtitle {
- font-size: 14px;
- line-height: 1.2; } }
- .btn {
- display: block;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 14px;
- line-height: 17px;
- font-weight: 600;
- text-transform: uppercase;
- color: #ffffff;
- background-image: -webkit-gradient(linear, right top, left top, from(#F9D423), to(#F83600));
- background-image: linear-gradient(270deg, #F9D423 0%, #F83600 100%);
- text-decoration: none;
- width: 270px;
- padding-top: 21px;
- padding-bottom: 21px;
- padding-left: 61px;
- padding-right: 61px;
- border-radius: 99px;
- text-align: center;
- cursor: pointer; }
- @media (min-width: 420px) {
- .subtitle {
- font-size: 16px;
- line-height: 1.2; }
- .title {
- font-size: 20px;
- line-height: 1.2; } }
- @media (min-width: 1200px) {
- .background-text {
- display: block; }
- .title {
- margin-bottom: 120px;
- font-size: 32px;
- line-height: 39px; }
- .subtitle {
- font-size: 18px;
- line-height: 22px; } }
- /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
- /* Document
- ========================================================================== */
- /**
- * 1. Correct the line height in all browsers.
- * 2. Prevent adjustments of font size after orientation changes in iOS.
- */
- html {
- line-height: 1.15;
- /* 1 */
- -webkit-text-size-adjust: 100%;
- /* 2 */ }
- /* Sections
- ========================================================================== */
- /**
- * Remove the margin in all browsers.
- */
- body {
- margin: 0; }
- /**
- * Render the `main` element consistently in IE.
- */
- main {
- display: block; }
- /**
- * Correct the font size and margin on `h1` elements within `section` and
- * `article` contexts in Chrome, Firefox, and Safari.
- */
- h1 {
- font-size: 2em;
- margin: 0.67em 0; }
- /* Grouping content
- ========================================================================== */
- /**
- * 1. Add the correct box sizing in Firefox.
- * 2. Show the overflow in Edge and IE.
- */
- hr {
- -webkit-box-sizing: content-box;
- box-sizing: content-box;
- /* 1 */
- height: 0;
- /* 1 */
- overflow: visible;
- /* 2 */ }
- /**
- * 1. Correct the inheritance and scaling of font size in all browsers.
- * 2. Correct the odd `em` font sizing in all browsers.
- */
- pre {
- font-family: monospace, monospace;
- /* 1 */
- font-size: 1em;
- /* 2 */ }
- /* Text-level semantics
- ========================================================================== */
- /**
- * Remove the gray background on active links in IE 10.
- */
- a {
- background-color: transparent; }
- /**
- * 1. Remove the bottom border in Chrome 57-
- * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
- */
- abbr[title] {
- border-bottom: none;
- /* 1 */
- text-decoration: underline;
- /* 2 */
- -webkit-text-decoration: underline dotted;
- text-decoration: underline dotted;
- /* 2 */ }
- /**
- * Add the correct font weight in Chrome, Edge, and Safari.
- */
- b,
- strong {
- font-weight: bolder; }
- /**
- * 1. Correct the inheritance and scaling of font size in all browsers.
- * 2. Correct the odd `em` font sizing in all browsers.
- */
- code,
- kbd,
- samp {
- font-family: monospace, monospace;
- /* 1 */
- font-size: 1em;
- /* 2 */ }
- /**
- * Add the correct font size in all browsers.
- */
- small {
- font-size: 80%; }
- /**
- * Prevent `sub` and `sup` elements from affecting the line height in
- * all browsers.
- */
- sub,
- sup {
- font-size: 75%;
- line-height: 0;
- position: relative;
- vertical-align: baseline; }
- sub {
- bottom: -0.25em; }
- sup {
- top: -0.5em; }
- /* Embedded content
- ========================================================================== */
- /**
- * Remove the border on images inside links in IE 10.
- */
- img {
- border-style: none; }
- /* Forms
- ========================================================================== */
- /**
- * 1. Change the font styles in all browsers.
- * 2. Remove the margin in Firefox and Safari.
- */
- button,
- input,
- optgroup,
- select,
- textarea {
- font-family: inherit;
- /* 1 */
- font-size: 100%;
- /* 1 */
- line-height: 1.15;
- /* 1 */
- margin: 0;
- /* 2 */ }
- /**
- * Show the overflow in IE.
- * 1. Show the overflow in Edge.
- */
- button,
- input {
- /* 1 */
- overflow: visible; }
- /**
- * Remove the inheritance of text transform in Edge, Firefox, and IE.
- * 1. Remove the inheritance of text transform in Firefox.
- */
- button,
- select {
- /* 1 */
- text-transform: none; }
- /**
- * Correct the inability to style clickable types in iOS and Safari.
- */
- button,
- [type="button"],
- [type="reset"],
- [type="submit"] {
- -webkit-appearance: button; }
- /**
- * Remove the inner border and padding in Firefox.
- */
- button::-moz-focus-inner,
- [type="button"]::-moz-focus-inner,
- [type="reset"]::-moz-focus-inner,
- [type="submit"]::-moz-focus-inner {
- border-style: none;
- padding: 0; }
- /**
- * Restore the focus styles unset by the previous rule.
- */
- button:-moz-focusring,
- [type="button"]:-moz-focusring,
- [type="reset"]:-moz-focusring,
- [type="submit"]:-moz-focusring {
- outline: 1px dotted ButtonText; }
- /**
- * Correct the padding in Firefox.
- */
- fieldset {
- padding: 0.35em 0.75em 0.625em; }
- /**
- * 1. Correct the text wrapping in Edge and IE.
- * 2. Correct the color inheritance from `fieldset` elements in IE.
- * 3. Remove the padding so developers are not caught out when they zero out
- * `fieldset` elements in all browsers.
- */
- legend {
- -webkit-box-sizing: border-box;
- box-sizing: border-box;
- /* 1 */
- color: inherit;
- /* 2 */
- display: table;
- /* 1 */
- max-width: 100%;
- /* 1 */
- padding: 0;
- /* 3 */
- white-space: normal;
- /* 1 */ }
- /**
- * Add the correct vertical alignment in Chrome, Firefox, and Opera.
- */
- progress {
- vertical-align: baseline; }
- /**
- * Remove the default vertical scrollbar in IE 10+.
- */
- textarea {
- overflow: auto; }
- /**
- * 1. Add the correct box sizing in IE 10.
- * 2. Remove the padding in IE 10.
- */
- [type="checkbox"],
- [type="radio"] {
- -webkit-box-sizing: border-box;
- box-sizing: border-box;
- /* 1 */
- padding: 0;
- /* 2 */ }
- /**
- * Correct the cursor style of increment and decrement buttons in Chrome.
- */
- [type="number"]::-webkit-inner-spin-button,
- [type="number"]::-webkit-outer-spin-button {
- height: auto; }
- /**
- * 1. Correct the odd appearance in Chrome and Safari.
- * 2. Correct the outline style in Safari.
- */
- [type="search"] {
- -webkit-appearance: textfield;
- /* 1 */
- outline-offset: -2px;
- /* 2 */ }
- /**
- * Remove the inner padding in Chrome and Safari on macOS.
- */
- [type="search"]::-webkit-search-decoration {
- -webkit-appearance: none; }
- /**
- * 1. Correct the inability to style clickable types in iOS and Safari.
- * 2. Change font properties to `inherit` in Safari.
- */
- ::-webkit-file-upload-button {
- -webkit-appearance: button;
- /* 1 */
- font: inherit;
- /* 2 */ }
- /* Interactive
- ========================================================================== */
- /*
- * Add the correct display in Edge, IE 10+, and Firefox.
- */
- details {
- display: block; }
- /*
- * Add the correct display in all browsers.
- */
- summary {
- display: list-item; }
- /* Misc
- ========================================================================== */
- /**
- * Add the correct display in IE 10+.
- */
- template {
- display: none; }
- /**
- * Add the correct display in IE 10.
- */
- [hidden] {
- display: none; }
- @font-face {
- font-family: "Montserrat";
- src: url("../fonts/Montserrat-Light.woff") format("woff");
- font-weight: 300;
- font-style: normal; }
- @font-face {
- font-family: "Montserrat";
- src: url("../fonts/Montserrat-Regular.woff") format("woff");
- font-weight: 400;
- font-style: normal; }
- @font-face {
- font-family: "Montserrat";
- src: url("../fonts/Montserrat-Medium.woff") format("woff");
- font-weight: 500;
- font-style: normal; }
- @font-face {
- font-family: "Montserrat";
- src: url("../fonts/Montserrat-SemiBold.woff") format("woff");
- font-weight: 600;
- font-style: normal; }
- @font-face {
- font-family: "Montserrat";
- src: url("../fonts/Montserrat-Bold.woff") format("woff");
- font-weight: 700;
- font-style: normal; }
- @font-face {
- font-family: "Montserrat";
- src: url("../fonts/Montserrat-Black.woff") format("woff");
- font-weight: 800;
- font-style: normal; }
- @font-face {
- font-family: "Roboto";
- src: url("../fonts/Roboto.woff") format("woff");
- font-weight: 400;
- font-style: normal; }
- @font-face {
- font-family: "Open Sans";
- src: url("../fonts/OpenSans-Regular.woff") format("woff");
- font-weight: 400;
- font-style: normal; }
- .wrapper {
- width: 320px;
- padding-left: 10px;
- padding-right: 10px;
- margin-left: auto;
- margin-right: auto; }
- .wrapper--no-mobile {
- width: 100%;
- padding: 0; }
- .wrapper--nopadding {
- padding-right: 0; }
- @media (min-width: 420px) {
- .wrapper {
- width: 420px;
- padding-left: 20px;
- padding-right: 20px; }
- .wrapper--no-mobile {
- width: 100%;
- padding: 0; }
- .wrapper--nopadding {
- padding-right: 0; } }
- @media (min-width: 460px) {
- .wrapper {
- width: 460px; } }
- @media (min-width: 600px) {
- .wrapper {
- width: 600px; }
- .wrapper--no-mobile {
- width: 600px;
- padding: 0; } }
- @media (min-width: 768px) {
- .wrapper {
- width: 768px; }
- .wrapper--no-mobile {
- width: 768px;
- padding-left: 20px;
- padding-right: 20px; } }
- @media (min-width: 1200px) {
- .wrapper {
- width: 1200px;
- position: relative;
- padding-left: 30px;
- padding-right: 30px; } }
- @media (min-width: 1366px) {
- .wrapper {
- width: 1366px;
- position: relative;
- padding-left: 40px;
- padding-right: 40px; } }
- .header {
- padding-top: 20px; }
- .header__contacts {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -ms-flex-wrap: wrap;
- flex-wrap: wrap; }
- .header__logo {
- padding-bottom: 10px; }
- .header__logo img {
- width: 100%;
- height: auto; }
- .header__location {
- padding: 0;
- margin: 0;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 16px;
- line-height: 20px;
- padding-bottom: 10px; }
- .header__location span svg {
- width: 14px;
- height: 20px; }
- .header__phone {
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 18px;
- line-height: 22px;
- text-decoration: none;
- color: #333333;
- padding-bottom: 20px; }
- .header__phone span {
- font-weight: 600; }
- .header__callback {
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 12px;
- line-height: 1.2;
- font-weight: 600;
- text-decoration: none;
- color: #333333;
- padding-left: 10px;
- padding-right: 10px;
- padding-top: 12px;
- padding-bottom: 13px;
- border: 2px solid #333333;
- border-radius: 99px;
- margin-bottom: 20px; }
- @media (min-width: 420px) {
- .header__location {
- padding-bottom: 0; }
- .header__contacts {
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between; }
- .header__phone {
- -ms-flex-item-align: center;
- align-self: center; } }
- @media (min-width: 600px) {
- .header__container {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -ms-flex-wrap: wrap;
- flex-wrap: wrap; }
- .header__logo {
- width: 280px;
- margin-right: 30px; }
- .header__location {
- -ms-flex-item-align: center;
- align-self: center;
- margin-left: auto;
- position: relative;
- padding-left: 22px;
- padding-bottom: 10px; }
- .header__location span {
- position: absolute;
- left: 0;
- top: 0; }
- .header__contacts {
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1; } }
- @media (min-width: 768px) {
- .header__logo {
- width: 280px; }
- .header__contacts {
- -webkit-box-flex: 0;
- -ms-flex-positive: 0;
- flex-grow: 0;
- margin-left: auto; }
- .header__location {
- padding-bottom: 20px;
- margin-left: 0; }
- .header__phone {
- padding-right: 30px;
- padding-left: 40px; } }
- @media (min-width: 1200px) {
- .header {
- padding-top: 20px;
- padding-bottom: 35px; }
- .header__logo {
- width: 320px;
- margin-right: 47px;
- padding-bottom: 0; }
- .header__phone {
- padding-right: 0; }
- .header__location {
- padding-bottom: 0;
- margin-left: 0;
- margin-right: auto; }
- .header__contacts {
- -webkit-box-flex: 0;
- -ms-flex-positive: 0;
- flex-grow: 0; }
- .header__phone {
- -ms-flex-item-align: start;
- align-self: flex-start;
- padding-bottom: 0;
- padding-top: 10px; }
- .header__callback {
- margin-left: 45px;
- margin-bottom: 0;
- -ms-flex-item-align: start;
- align-self: flex-start;
- padding-left: 43px;
- padding-right: 44px; }
- .header__location {
- -ms-flex-item-align: inherit;
- align-self: inherit;
- padding-top: 12px; }
- .header__location span {
- top: 12px; } }
- .menu {
- background-color: rgba(237, 237, 237, 0.5); }
- .menu__list {
- padding: 0;
- margin: 0;
- list-style: none;
- text-align: center;
- width: 100%;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-orient: vertical;
- -webkit-box-direction: normal;
- -ms-flex-direction: column;
- flex-direction: column; }
- .menu__link {
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 18px;
- line-height: 1.2;
- font-weight: 600;
- color: #333333;
- text-decoration: none;
- display: block;
- padding-top: 10px;
- padding-bottom: 12px;
- border-bottom: 1px solid #333333; }
- .menu__link--active {
- color: #f2620d; }
- .menu__link:hover {
- -webkit-transition: all, 0.3s;
- transition: all, 0.3s;
- color: #f2620d; }
- .menu__item:last-child .menu__link {
- border-bottom: 0; }
- @media (min-width: 600px) {
- .menu__list {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-orient: horizontal;
- -webkit-box-direction: normal;
- -ms-flex-direction: row;
- flex-direction: row;
- -ms-flex-wrap: wrap;
- flex-wrap: wrap;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center; }
- .menu__link {
- padding-left: 10px;
- padding-right: 10px;
- border: none; } }
- @media (min-width: 768px) {
- .menu__list {
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between;
- margin-left: auto;
- margin-right: auto; }
- .menu__link {
- padding-left: 10px;
- padding-right: 10px;
- padding-top: 21px;
- padding-bottom: 17px; } }
- .slider {
- background-image: url("../img/bg-slider-mobile.jpg");
- background-position: top center;
- width: 100%;
- background-size: auto;
- overflow: hidden;
- background-position-y: 50px;
- background-repeat: no-repeat;
- min-height: 600px; }
- .slider__wrapper {
- width: 320px;
- padding-left: 10px;
- padding-right: 10px;
- padding-top: 50px;
- padding-bottom: 50px;
- margin-left: auto;
- margin-right: auto;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-orient: vertical;
- -webkit-box-direction: normal;
- -ms-flex-direction: column;
- flex-direction: column; }
- .slider__subtitle {
- padding: 0;
- margin: 0;
- font-family: "Roboto", "Arial", "sans-serif";
- text-transform: uppercase;
- font-size: 14px;
- line-height: 1.2;
- color: #4F4F4F;
- padding-bottom: 20px; }
- .slider__title {
- padding: 0;
- margin: 0;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 20px;
- text-transform: uppercase;
- font-weight: 900;
- padding-bottom: 20px;
- padding-right: 100px; }
- .slider__text {
- padding: 0;
- margin: 0;
- padding-right: 100px;
- padding-bottom: 55px;
- font-family: "Roboto", "Arial", "sans-serif";
- font-weight: 600; }
- .slider__btn {
- margin-top: auto;
- padding-left: 30px;
- padding-right: 30px;
- width: 180px; }
- @media (min-width: 420px) {
- .slider__wrapper {
- width: 420px;
- min-height: 350px; }
- .slider__title {
- padding-right: 150px; }
- .slider__text {
- padding-right: 140px; }
- .slider__btn {
- margin-top: auto; } }
- @media (min-width: 600px) {
- .slider {
- background-image: url("../img/bg-slider-600.jpg");
- background-position: center -150px; }
- .slider__title {
- font-size: 25px; }
- .slider__wrapper {
- width: 600px;
- padding-left: 20px;
- padding-right: 20px; }
- .slider__text {
- padding-right: 300px; } }
- @media (min-width: 768px) {
- .slider__wrapper {
- width: 768px; } }
- @media (min-width: 1200px) {
- .slider {
- background-image: url("../img/slider.jpg");
- background-position: center; }
- .slider__wrapper {
- width: 1200px;
- padding-top: 78px;
- min-height: 570px; }
- .slider__subtitle {
- font-size: 24px;
- line-height: 1.2; }
- .slider__title {
- font-size: 60px;
- line-height: 1.2;
- padding-right: 370px; }
- .slider__text {
- font-size: 24px;
- line-height: 1.2;
- text-transform: uppercase;
- max-width: 570px;
- padding-right: 0;
- padding-bottom: 0; }
- .slider__btn {
- width: 270px; } }
- .services {
- padding-top: 20px;
- padding-bottom: 20px; }
- .serives__list {
- padding: 0;
- margin: 0;
- list-style: none; }
- .services__item-title {
- margin: 0;
- padding-bottom: 60px;
- padding-left: 12px;
- margin-bottom: 20px; }
- .services__item-title::before {
- width: 5px;
- height: 100%;
- background: -webkit-gradient(linear, left bottom, left top, from(#F9D423), to(#F83600));
- background: linear-gradient(360deg, #F9D423 0%, #F83600 100%); }
- .services__item {
- width: 296px;
- min-height: 168px;
- background-color: #c4c4c4;
- margin-bottom: 20px;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-orient: vertical;
- -webkit-box-direction: normal;
- -ms-flex-direction: column;
- flex-direction: column; }
- .services__order {
- margin-top: auto; }
- .services__item:last-child {
- background-color: transparent; }
- .services__order {
- margin-left: auto;
- margin-right: auto; }
- @media (min-width: 420px) {
- .services {
- background-image: url("../img/bg-services-mobile.png");
- background-repeat: no-repeat; }
- .serives__list {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -ms-flex-wrap: wrap;
- flex-wrap: wrap; }
- .services__item {
- width: 48%;
- margin-left: auto;
- margin-right: auto; }
- .services__item-title {
- padding-bottom: 30px;
- font-size: 18px; }
- .services__order {
- width: 90%;
- padding-left: 10px;
- padding-right: 10px;
- font-size: 13px; } }
- @media (min-width: 600px) {
- .services {
- background-image: url("../img/bg-services-600.jpg"); } }
- @media (min-width: 768px) {
- .services__item {
- width: 32%; } }
- @media (min-width: 1200px) {
- .services {
- position: relative;
- background-image: url("../img/bg-services.jpg");
- z-index: 10; }
- .serives__list {
- position: relative;
- z-index: 20;
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between; }
- .services__item {
- width: 370px;
- height: 210px;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-orient: vertical;
- -webkit-box-direction: normal;
- -ms-flex-direction: column;
- flex-direction: column;
- margin-left: 0;
- margin-right: 0; }
- .services__item:nth-child(3n) {
- margin-right: 0; }
- .services__item-title {
- font-size: 32px;
- margin: 0;
- padding-bottom: 60px; }
- .services__order {
- margin-top: auto; }
- .services__background-text {
- position: absolute;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-weight: 900;
- font-size: 144px;
- line-height: 177px;
- background: -webkit-gradient(linear, right top, left top, from(#F9D423), to(#F83600));
- background: linear-gradient(270deg, #F9D423 0%, #F83600 100%);
- -webkit-text-fill-color: transparent;
- -webkit-background-clip: text;
- background-clip: text;
- opacity: 0.1;
- width: 1125px;
- top: -100px;
- right: -100px;
- text-align: right;
- z-index: 2;
- text-transform: uppercase; } }
- .cases {
- padding-top: 30px;
- padding-bottom: 30px;
- background-color: #000000; }
- .cases__list {
- padding: 0;
- margin: 0;
- list-style: none; }
- .cases__item {
- width: 100%;
- min-height: 376px;
- background-image: url("../img/cases-1.jpg");
- background-size: cover;
- background-repeat: no-repeat;
- margin-bottom: 20px; }
- .cases__item:nth-child(2) {
- background-image: url("../img/cases-2.jpg"); }
- .cases__item:nth-child(3) {
- background-image: url("../img/cases-3.jpg"); }
- @media (min-width: 600px) {
- .cases__list {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between; }
- .cases__item {
- width: 33%;
- min-height: 240px;
- margin-bottom: 0; } }
- @media (min-width: 768px) {
- .cases {
- padding-top: 210px;
- padding-bottom: 210px; }
- .cases__item {
- min-height: 470px; } }
- @media (min-width: 1200px) {
- .block.cases {
- z-index: 10;
- position: relative; }
- .block.order--services {
- padding-top: 120px; }
- .cases__background-image {
- position: absolute;
- background-image: url("../img/cases-column.png");
- width: 369px;
- height: 500px;
- left: -330px;
- bottom: -210px; }
- .cases__background-text {
- position: absolute;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-weight: 900;
- font-size: 144px;
- line-height: 177px;
- color: #FFFFFF;
- text-transform: uppercase;
- opacity: 0.1;
- width: 1150px;
- left: -300px;
- top: -80px;
- z-index: 2; }
- .cases__container {
- position: relative; }
- .cases__item {
- width: 370px;
- height: 460px; } }
- @media (min-width: 600px) {
- .cases--services .cases__container::before {
- width: 1100px;
- height: 1200px;
- right: -900px; } }
- @media (min-width: 1200px) {
- .cases {
- padding-top: 0;
- padding-bottom: 0; }
- .cases--services {
- padding-top: 420px;
- padding-bottom: 420px; } }
- .stages {
- padding-top: 30px;
- padding-bottom: 30px;
- background-image: url("../img/bg-stages.png");
- background-repeat: no-repeat;
- background-position: 0;
- background-size: cover; }
- .stages__container {
- color: #333333;
- position: relative;
- z-index: 10; }
- .stages__about {
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 14px;
- line-height: 1.2;
- font-weight: 700;
- padding: 0;
- margin: 0;
- text-transform: uppercase;
- position: relative;
- padding-left: 15px;
- padding-right: 30px;
- margin-bottom: 20px; }
- .stages__about::before {
- content: "";
- position: absolute;
- bottom: 0;
- left: 0;
- width: 5px;
- height: 100%;
- background: -webkit-gradient(linear, left bottom, left top, from(#F9D423), to(#F83600));
- background: linear-gradient(360deg, #F9D423 0%, #F83600 100%);
- border-radius: 5px; }
- .stages__list {
- padding: 0;
- margin: 0;
- list-style: none;
- padding-bottom: 60px; }
- .stages__item {
- margin-bottom: 20px; }
- .stages__item-title {
- padding: 0;
- margin: 0;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 16px;
- line-height: 1.2;
- font-weight: 700;
- text-transform: uppercase;
- padding-top: 10px;
- padding-bottom: 30px;
- padding-left: 85px;
- text-align: left;
- position: relative; }
- .stages__item-title::before {
- content: "01";
- position: absolute;
- left: 0;
- top: 0;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 45px;
- line-height: 1.2;
- font-weight: 700;
- background-image: -webkit-gradient(linear, right top, left top, from(#F9D423), to(#F83600));
- background-image: linear-gradient(270deg, #F9D423 0%, #F83600 100%);
- text-transform: uppercase;
- -webkit-text-fill-color: transparent;
- -webkit-background-clip: text;
- background-clip: text; }
- .stages__item:nth-child(2) .stages__item-title::before {
- content: "02"; }
- .stages__item:nth-child(3) .stages__item-title::before {
- content: "03"; }
- .stages__item:nth-child(4) .stages__item-title::before {
- content: "04"; }
- .stages__item:nth-child(5) .stages__item-title::before {
- content: "05"; }
- .stages__item:nth-child(6) .stages__item-title::before {
- content: "06"; }
- .stages__item-text {
- padding: 0;
- margin: 0;
- font-family: "Roboto", "Arial", "sans-serif";
- font-size: 12px;
- line-height: 1.2;
- font-weight: 400;
- color: #333333; }
- @media (min-width: 600px) {
- .stages {
- padding-top: 60px;
- padding-bottom: 180px;
- background-position: center 0; }
- .stages__list {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -ms-flex-wrap: wrap;
- flex-wrap: wrap;
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between;
- position: relative;
- z-index: 10; }
- .stages__item {
- width: 46%; }
- .stages__item-title {
- padding-right: 30px; } }
- @media (min-width: 768px) {
- .stages {
- background-position: center; }
- .stages__wrap {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- padding-bottom: 40px;
- position: relative;
- z-index: 20; }
- .stages__inner {
- width: 70%; }
- .stages__about {
- width: 30%;
- margin-left: auto;
- -ms-flex-item-align: start;
- align-self: flex-start; }
- .stages__item {
- width: 33%;
- padding-right: 20px; }
- .stages__item-title {
- padding-left: 75px;
- font-size: 14px;
- padding-right: 0; } }
- @media (min-width: 1200px) {
- .stages {
- position: relative;
- padding-top: 150px;
- padding-bottom: 150px; }
- .stages__item {
- min-height: 137px;
- height: 100%;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-orient: vertical;
- -webkit-box-direction: normal;
- -ms-flex-direction: column;
- flex-direction: column; }
- .stages__item-text {
- margin-top: auto;
- padding-right: 120px; }
- .stages__item-title {
- padding-left: 102px;
- font-size: 18px;
- line-height: 22px;
- padding-bottom: 35px; }
- .stages__item-title::before {
- font-weight: 700;
- font-size: 66px;
- line-height: 80px; }
- .stages__background-text {
- position: absolute;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-weight: 900;
- font-size: 144px;
- line-height: 177px;
- color: #333333;
- opacity: 0.1;
- width: 1770px;
- top: 0;
- right: -300px;
- z-index: 2;
- text-transform: uppercase; }
- .stages__about {
- font-size: 18px;
- width: 25%; }
- .stages__title {
- margin-bottom: 70px; } }
- @media (min-width: 600px) {
- .stages--services {
- padding-top: 120px;
- padding-bottom: 180px;
- background-position: center 40px; } }
- @media (min-width: 600px) {
- .stages--services {
- padding-bottom: 240px; } }
- @media (min-width: 1200px) {
- .stages--services {
- background-position: center 100px;
- background-size: cover;
- margin-top: -100px; }
- .stages--services .stages__background-text {
- width: 905px;
- text-align: right;
- top: -100px;
- right: -450px;
- z-index: 10; }
- .stages--services .block.stages--services {
- padding-top: 0;
- padding-bottom: 0; } }
- .achievement {
- background-color: black;
- padding-top: 60px;
- padding-bottom: 60px; }
- .achievement__subtitle {
- color: #ffffff;
- background: none;
- -webkit-text-fill-color: inherit; }
- .achievement__title {
- color: #ffffff;
- background: none;
- -webkit-text-fill-color: inherit; }
- .achievement__text {
- padding: 0;
- margin: 0;
- color: #ffffff;
- font-family: "Roboto", "Arial", "sans-serif";
- font-size: 14px;
- line-height: 22px;
- padding-bottom: 20px; }
- .achievement__list {
- padding: 0;
- margin: 0;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -ms-flex-wrap: wrap;
- flex-wrap: wrap;
- padding-top: 20px;
- padding-bottom: 20px;
- z-index: 20; }
- .achievement__item {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-orient: vertical;
- -webkit-box-direction: normal;
- -ms-flex-direction: column;
- flex-direction: column;
- width: 150px;
- -webkit-box-align: start;
- -ms-flex-align: start;
- align-items: flex-start; }
- .achievement__number {
- padding: 0;
- margin: 0;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 36px;
- line-height: 1.2;
- font-weight: 700;
- text-transform: uppercase;
- background: -webkit-gradient(linear, right top, left top, from(#F9D423), to(#F83600));
- background: linear-gradient(270deg, #F9D423 0%, #F83600 100%);
- -webkit-text-fill-color: transparent;
- -webkit-background-clip: text;
- background-clip: text; }
- .achievement__number + .achievement__text {
- font-family: "Montserrat", "Arial", "sans-serif";
- padding-right: 0;
- font-weight: 800; }
- @media (min-width: 420px) {
- .achievement__item {
- width: 120px;
- padding-right: 20px; } }
- @media (min-width: 1200px) {
- .achievement__title {
- padding-bottom: 70px;
- margin-bottom: 50px; }
- .achievement__dec-img {
- position: absolute;
- width: 653px;
- height: 856px;
- background-image: url("../img/achievement-caesar.png");
- background-repeat: no-repeat;
- right: -400px;
- bottom: 0; }
- .achievement__number {
- line-height: 88px; }
- .achievement__container {
- position: relative; }
- .achievement__container {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between; }
- .achievement__inner {
- width: 760px;
- position: relative;
- z-index: 10; }
- .achievement__inner .achievement__text {
- padding-right: 90px;
- line-height: 30px; }
- .achievement__list {
- max-width: 380px;
- padding-top: 140px; }
- .achievement__number {
- font-size: 72px; }
- .achievement__item {
- min-width: 186px; }
- .achievement__text {
- font-size: 18px; }
- .achievement__background-text {
- position: absolute;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-weight: 900;
- font-size: 144px;
- line-height: 177px;
- color: #ffffff;
- opacity: 0.1;
- width: 1970px;
- top: 50px;
- right: -500px;
- z-index: 1;
- text-transform: uppercase; } }
- .reviews {
- padding-top: 30px;
- padding-bottom: 30px; }
- .reviews__list {
- padding: 0;
- margin: 0;
- list-style: none; }
- .reviews__container {
- color: #333333; }
- .review {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-orient: vertical;
- -webkit-box-direction: normal;
- -ms-flex-direction: column;
- flex-direction: column; }
- .review__person-photo {
- width: 192px;
- height: 190px;
- background-image: url("../img/reviews__person.jpg");
- margin-bottom: 20px; }
- .review__person-name {
- padding: 0;
- margin: 0;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 24px;
- line-height: 29px;
- font-weight: 700;
- text-transform: uppercase;
- padding-bottom: 10px; }
- .review__person-position {
- padding: 0;
- margin: 0;
- font-weight: 500;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 14px;
- line-height: 17px;
- text-transform: uppercase; }
- .review__text {
- font-family: "Roboto", "Arial", "sans-serif";
- font-size: 14px;
- line-height: 1.2;
- position: relative;
- margin: 0;
- padding: 0;
- padding-left: 40px;
- padding-right: 20px;
- padding-top: 20px;
- padding-bottom: 20px; }
- .review__text::before {
- content: "";
- position: absolute;
- width: 30px;
- height: 30px;
- background-image: url("../img/quote.svg");
- background-repeat: no-repeat;
- background-size: cover;
- left: 0;
- top: 20px; }
- .review__cite {
- font-family: "Montserrat", "Arial", "sans-serif";
- text-transform: uppercase;
- font-size: 14px;
- line-height: 1.2;
- font-weight: 400;
- font-style: normal;
- padding-left: 60px;
- position: relative; }
- .review__cite::before {
- content: "";
- position: absolute;
- width: 14px;
- height: 14px;
- background-image: url("../img/cite.svg");
- left: 75px;
- top: 5px;
- background-repeat: no-repeat;
- background-size: contain; }
- @media (min-width: 600px) {
- .reviews {
- background-image: url("../img/bg-reviews.png");
- background-repeat: no-repeat;
- background-size: cover;
- background-position: center 0;
- background-repeat: no-repeat; }
- .review {
- -webkit-box-orient: horizontal;
- -webkit-box-direction: normal;
- -ms-flex-direction: row;
- flex-direction: row;
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between; }
- .review__inner {
- width: 60%; }
- .review__text {
- padding-left: 75px; }
- .review__text::before {
- width: 51px;
- height: 48px; }
- .review__person-photo {
- border-radius: 50%; }
- .review__cite {
- padding-left: 95px; } }
- @media (min-width: 768px) {
- .review {
- -webkit-box-pack: start;
- -ms-flex-pack: start;
- justify-content: flex-start; }
- .review__inner {
- padding-left: 20px; }
- .review__inner::before {
- left: 70px; } }
- @media (min-width: 1200px) {
- .review {
- -webkit-box-pack: start;
- -ms-flex-pack: start;
- justify-content: flex-start; }
- .review__inner {
- padding-left: 20px; }
- .reviews__background-text {
- position: absolute;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-weight: 900;
- font-size: 144px;
- line-height: 176px;
- text-align: right;
- color: #333333;
- opacity: 0.1;
- width: 1160px;
- top: -100px;
- right: -300px;
- z-index: 1;
- text-transform: uppercase; } }
- @media (min-width: 600px) {
- .reviews--services {
- padding-top: 240px;
- padding-bottom: 240px; } }
- @media (min-width: 768px) {
- .review {
- padding-left: 100px; } }
- .order {
- background-color: #000000;
- padding-top: 30px;
- padding-bottom: 30px; }
- .order__form {
- padding-top: 20px;
- padding-bottom: 20px;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-orient: vertical;
- -webkit-box-direction: normal;
- -ms-flex-direction: column;
- flex-direction: column; }
- .order__form-item {
- margin: 0;
- padding: 0;
- margin-bottom: 20px;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- width: 100%; }
- .order__input {
- border: none;
- background-color: transparent;
- border-bottom: 1px solid #ffffff;
- width: 100%;
- padding-top: 10px;
- padding-left: 5px;
- padding-bottom: 5px;
- padding-right: 10px;
- color: #ffffff;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 30px;
- line-height: 1.2;
- font-weight: 400; }
- .order__form-select {
- border-radius: 0;
- border: none;
- background-color: transparent;
- border-bottom: 1px solid #ffffff;
- width: 100%;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 14px;
- line-height: 1.2;
- font-weight: 700;
- color: #ffffff;
- padding-top: 10px; }
- .order__form-select option {
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 14px;
- line-height: 1.2;
- font-weight: 700;
- color: #ffffff; }
- .order__input::-webkit-input-placeholder {
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 30px;
- line-height: 1.2;
- font-weight: 400; }
- .order__input::-ms-input-placeholder {
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 30px;
- line-height: 1.2;
- font-weight: 400; }
- .order__input::placeholder {
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 30px;
- line-height: 1.2;
- font-weight: 400; }
- .order__textarea {
- border: none;
- background-color: transparent;
- border-bottom: 1px solid #ffffff;
- width: 100%;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 30px;
- line-height: 1.2;
- font-weight: 400;
- padding-left: 5px;
- padding-top: 10px;
- color: #ffffff;
- margin-bottom: 60px; }
- .order__textarea::-webkit-input-placeholder {
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 30px;
- line-height: 1.2;
- font-weight: 400; }
- .order__textarea::-ms-input-placeholder {
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 30px;
- line-height: 1.2;
- font-weight: 400; }
- .order__textarea::placeholder {
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 30px;
- line-height: 1.2;
- font-weight: 400; }
- .order__form-input {
- border: none;
- margin-left: auto;
- margin-right: auto; }
- @media (min-width: 768px) {
- .order {
- padding-bottom: 60px; }
- .order__form-row {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex; }
- .order__form-item {
- margin-right: 20px; }
- .order__textarea {
- margin-right: 20px; }
- .order__form-input {
- margin-right: 20px; } }
- @media (min-width: 1200px) {
- .order__form-item {
- margin-bottom: 60px; }
- .order__textarea {
- margin-bottom: 100px; }
- .order__container {
- position: relative;
- max-width: 994px;
- overflow: hidden; }
- .order__container::before {
- content: "";
- position: absolute;
- background-image: url("../img/order-fountain.png");
- width: 674px;
- height: 748px;
- background-repeat: no-repeat;
- background-size: contain;
- right: -530px;
- top: -200px;
- z-index: -1; } }
- @media (min-width: 1200px) {
- .order__bg-decor {
- width: 674px;
- height: 746px;
- background-image: url("../img/order-fountain.png");
- position: absolute;
- right: -320px;
- top: 100px; }
- .order__background-image {
- width: 1629px;
- height: 1920px;
- background-image: url("../img/bg-order-services.png"); }
- .order__background-text {
- position: absolute;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-weight: 900;
- font-size: 144px;
- line-height: 177px;
- color: #ffffff;
- opacity: 0.1;
- width: 1970px;
- top: -70px;
- right: -500px;
- z-index: 1;
- text-transform: uppercase; } }
- .footer {
- background-color: black;
- margin-top: -1px; }
- .footer__container {
- padding-top: 60px;
- position: relative; }
- .footer__container::before {
- content: "";
- position: absolute;
- top: 27px;
- left: 0;
- width: 100%;
- height: 3px;
- background-image: -webkit-gradient(linear, right top, left top, from(#F9D423), to(#F83600));
- background-image: linear-gradient(270deg, #F9D423 0%, #F83600 100%); }
- .footer__text {
- padding: 0;
- margin: 0;
- font-family: "Roboto", "Arial", "sans-serif";
- font-size: 12px;
- line-height: 1.2;
- font-weight: 400;
- color: #ffffff; }
- .footer__block {
- padding-bottom: 30px; }
- .footer__block-title {
- padding: 0;
- margin: 0;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 16px;
- line-height: 1.2;
- font-weight: 300;
- color: #ffffff;
- text-transform: uppercase;
- padding-bottom: 20px; }
- .footer__nav {
- padding: 0;
- margin: 0;
- list-style: none;
- padding-left: 10px; }
- .footer__link {
- font-family: "Roboto", "Arial", "sans-serif";
- font-size: 14px;
- line-height: 30px;
- font-weight: 400;
- color: #ffffff;
- text-decoration: none; }
- .footer__link:hover {
- background: -webkit-gradient(linear, right top, left top, from(#F9D423), to(#F83600));
- background: linear-gradient(270deg, #F9D423 0%, #F83600 100%);
- -webkit-text-fill-color: transparent;
- -webkit-background-clip: text;
- background-clip: text; }
- .footer__location {
- padding: 0;
- margin: 0;
- list-style: none; }
- .footer__location-item {
- font-family: "Open Sans", "Arial", sans-serif;
- font-size: 14px;
- line-height: 1.2;
- font-weight: 400;
- color: #ffffff;
- padding-bottom: 10px;
- position: relative;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex; }
- .footer__location-item span {
- margin-right: 14px; }
- .icon__location {
- fill: #ffffff; }
- .footer__location-link {
- font-family: "Roboto", "Arial", "sans-serif";
- font-size: 14px;
- line-height: 1.2;
- font-weight: 400;
- color: #ffffff;
- text-decoration: none; }
- .footer__location-item:hover span {
- color: #f2620d; }
- @media (min-width: 768px) {
- .footer__container {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between;
- padding-top: 120px; }
- .footer__block {
- width: 30%; }
- .footer__block--logo {
- width: 40%;
- padding-right: 35px; } }
- @media (min-width: 1200px) {
- .footer__block--logo {
- width: 26%;
- padding-right: 0; }
- .footer__block--services {
- width: 25%;
- margin-left: auto; }
- .footer__block--location {
- width: 22%; }
- .footer__block .logo--footer {
- padding-left: 0; } }
- .logo {
- text-align: center;
- padding-left: 55px;
- position: relative; }
- .logo::before {
- content: "";
- position: absolute;
- width: 80px;
- height: 40px;
- background-image: url("../img/logo.svg");
- background-size: cover;
- left: 0;
- top: 6px; }
- .logo--footer {
- text-align: left;
- color: #ffffff;
- padding-left: 0; }
- .logo--footer::before {
- content: none; }
- .logo--footer .logo__title {
- font-size: 40px;
- letter-spacing: 1px; }
- .logo--footer .logo__subtitle {
- font-size: 16px; }
- .logo__title {
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 32px;
- font-weight: 300;
- padding: 0;
- margin: 0; }
- .logo__title span {
- font-weight: 500; }
- .logo__subtitle {
- padding: 0;
- margin: 0;
- font-family: "Roboto", "Arial", "sans-serif";
- font-size: 12px;
- text-transform: lowercase;
- color: #d8d8d8; }
- @media (min-width: 420px) {
- .logo {
- text-align: left;
- padding-left: 85px; }
- .logo--footer {
- padding-left: 0; } }
- @media (min-width: 1200px) {
- .logo {
- padding-left: 100px; }
- .logo::before {
- width: 89px;
- height: 45px; }
- .logo__title {
- font-size: 36px; }
- .logo__subtitle {
- font-size: 14px; } }
- .tariffs {
- padding-top: 30px;
- padding-bottom: 30px; }
- .tariffs__list {
- padding: 0;
- margin: 0;
- list-style: none;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-orient: horizontal;
- -webkit-box-direction: normal;
- -ms-flex-direction: row;
- flex-direction: row;
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between;
- width: 860px;
- -webkit-box-align: start;
- -ms-flex-align: start;
- align-items: flex-start; }
- .tariffs__list-wrap {
- overflow-x: scroll; }
- .tariffs__list-wrap::-webkit-scrollbar {
- width: 100%;
- height: 7px;
- background-color: rgba(0, 0, 0, 0.2);
- border-radius: 5px; }
- .tariffs__list-wrap::-webkit-scrollbar-thumb {
- background-image: -webkit-gradient(linear, right top, left top, from(#F9D423), to(#F83600));
- background-image: linear-gradient(270deg, #F9D423 0%, #F83600 100%);
- border-radius: 5px; }
- .tariff__checklist {
- padding: 0;
- margin: 0;
- list-style: none;
- padding-bottom: 40px; }
- .tariff__order {
- width: 240px;
- padding-left: 40px;
- padding-right: 40px; }
- .tariff {
- width: 100%;
- background: #FFFFFF;
- -webkit-box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
- box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
- border-radius: 10px;
- margin-bottom: 30px;
- padding-bottom: 40px;
- width: 280px;
- max-width: 370px;
- margin-right: 20px;
- margin-left: 5px; }
- .tariff__cost {
- padding: 0;
- margin: 0; }
- .tariff__title {
- font-family: "Montserrat", "Arial", "sans-serif";
- text-transform: uppercase;
- font-size: 24px;
- line-height: 1.2;
- font-weight: 700;
- padding: 0;
- margin: 0;
- text-align: center;
- padding-top: 38px;
- padding-bottom: 33px;
- color: #ffffff;
- border-radius: 10px 10px 0px 0px; }
- .tariff--econom .tariff__title {
- background-color: #f9d022; }
- .tariff--gold .tariff__title {
- background-color: #f84303; }
- .tariff--platinum .tariff__title {
- background-color: #f88c13; }
- .tariff__inner {
- padding-top: 20px;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-orient: vertical;
- -webkit-box-direction: normal;
- -ms-flex-direction: column;
- flex-direction: column;
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center; }
- .tariff__about {
- padding: 0;
- margin: 0;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 15px;
- line-height: 24px;
- font-weight: 800;
- text-align: center;
- text-transform: uppercase; }
- .tariff__cost {
- font-family: "Montserrat", "Arial", "sans-serif";
- color: #4f4f4f;
- font-size: 24px;
- padding-top: 13px;
- padding-bottom: 55px; }
- .tariff__cost span {
- font-weight: 600;
- font-size: 48px; }
- .tariff__point {
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 14px;
- line-height: 20px;
- text-align: center;
- padding-bottom: 22px;
- color: #333333; }
- .tariff__point span {
- font-weight: 700; }
- @media (min-width: 420px) {
- .tariffs__list {
- width: 1170px; }
- .tariff {
- width: 370px; }
- .tariff__inner {
- padding-left: 20px;
- padding-right: 20px; }
- .tariff__point {
- font-size: 16px;
- line-height: 20px; }
- .tariff__about {
- font-size: 20px;
- line-height: 24px; }
- .tariff__order {
- width: 270px; } }
- @media (min-width: 420px) {
- .tariffs {
- background-image: url("../img/tariffs-bg.png");
- background-repeat: no-repeat;
- background-position: center; } }
- @media (min-width: 600px) {
- .tariffs {
- padding-top: 120px;
- padding-bottom: 180px; } }
- @media (min-width: 768px) {
- .tariffs {
- color: inherit; } }
- @media (min-width: 1200px) {
- .tariffs__list {
- width: 100%; }
- .tariffs__list-wrap {
- overflow: visible;
- position: relative;
- z-index: 10; }
- .tariffs-background-text {
- position: absolute;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-weight: 900;
- font-size: 144px;
- line-height: 177px;
- background: -webkit-gradient(linear, right top, left top, from(#F9D423), to(#F83600));
- background: linear-gradient(270deg, #F9D423 0%, #F83600 100%);
- -webkit-text-fill-color: transparent;
- -webkit-background-clip: text;
- background-clip: text;
- opacity: 0.15;
- top: -100px;
- right: -200px;
- text-align: right;
- z-index: 1;
- width: 1489px;
- text-transform: uppercase; } }
- .custom {
- background-color: #000000; }
- .custom__text {
- color: #ffffff;
- padding: 0;
- margin: 0;
- padding-bottom: 30px;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 14px;
- line-height: 22px; }
- .custom__text--big {
- text-transform: uppercase;
- font-size: 24px;
- line-height: 34px;
- font-weight: 800; }
- .custom__btn {
- width: 300px;
- padding-left: 30px;
- padding-right: 30px; }
- @media (min-width: 600px) {
- .custom {
- padding-top: 180px;
- padding-bottom: 180px; } }
- @media (min-width: 768px) {
- .custom {
- color: inherit; }
- .custom__text {
- font-size: 18px;
- padding-bottom: 65px; }
- .custom__text--big {
- font-size: 60px;
- line-height: 70px;
- font-weight: 900;
- padding-bottom: 45px; } }
- @media (min-width: 1200px) {
- .custom__title {
- margin-bottom: 70px; }
- .custom__background-image {
- position: absolute;
- background-image: url("../img/bg-custom-face.png");
- background-repeat: no-repeat;
- background-size: cover;
- background-position: center 200;
- width: 982px;
- height: 1202px;
- top: 0;
- right: -530px; }
- .custom__background-text {
- position: absolute;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-weight: 900;
- font-size: 144px;
- line-height: 176px;
- color: #FFFFFF;
- text-transform: uppercase;
- opacity: 0.25;
- width: 1970px;
- left: -300px;
- top: 100px;
- z-index: 2; }
- .custom__btn {
- margin-bottom: 60px; }
- .custom__text {
- position: relative;
- z-index: 20; }
- .custom__container {
- position: relative;
- z-index: 20; }
- .custom__text--big {
- font-size: 70px;
- line-height: 80px;
- margin-bottom: 0; }
- .custom__text {
- padding-right: 160px; } }
- .promotion {
- padding-top: 60px;
- padding-bottom: 60px;
- overflow: hidden; }
- .promotion__list {
- padding: 0;
- margin: 0;
- list-style: none; }
- .promotion__item {
- padding-bottom: 40px; }
- .promotion__item:nth-child(2) .promotion__item-title::before {
- content: "02"; }
- .promotion__item:nth-child(3) .promotion__item-title::before {
- content: "03"; }
- .promotion__item:nth-child(4) {
- position: relative; }
- .promotion__item:nth-child(4) .promotion__item-title {
- padding-left: 30px;
- padding-bottom: 40px;
- font-size: 22px;
- line-height: 1.2;
- font-weight: 900;
- position: relative;
- margin-bottom: 40px; }
- .promotion__item:nth-child(4) .promotion__item-title::before {
- content: "";
- position: absolute;
- left: 0;
- top: 0;
- width: 7px;
- height: 100%;
- background: none;
- background-image: -webkit-gradient(linear, left bottom, left top, from(#F9D423), to(#F83600));
- background-image: linear-gradient(360deg, #F9D423 0%, #F83600 100%);
- border-radius: 5px;
- z-index: 10; }
- .promotion__item-title {
- padding: 0;
- margin: 0;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 18px;
- line-height: 1.2;
- font-weight: 700;
- padding-bottom: 40px;
- padding-left: 70px;
- position: relative;
- color: #333333;
- text-transform: uppercase; }
- .promotion__item-title::before {
- content: "01";
- position: absolute;
- left: 0;
- top: -5px;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 46px;
- line-height: 1.2;
- font-weight: 900;
- background-image: -webkit-gradient(linear, right top, left top, from(#F9D423), to(#F83600));
- background-image: linear-gradient(270deg, #F9D423 0%, #F83600 100%);
- text-transform: uppercase;
- -webkit-text-fill-color: transparent;
- -webkit-background-clip: text;
- background-clip: text; }
- .promotion__text {
- padding: 0;
- margin: 0;
- font-family: "Roboto", "Arial", "sans-serif";
- font-size: 16px;
- line-height: 1.2;
- font-weight: 400;
- color: #333333; }
- .promotion__btn {
- margin-left: auto;
- margin-right: auto; }
- @media (min-width: 600px) {
- .promotion {
- padding-top: 240px;
- padding-bottom: 180px;
- -webkit-clip-path: polygon(0 0, 100% 12%, 100% 100%, 0% 88%);
- clip-path: polygon(0 0, 100% 12%, 100% 100%, 0% 88%);
- margin-top: -177px; } }
- @media (min-width: 768px) {
- .promotion {
- background-image: url("../img/bg-custom.png");
- background-size: cover;
- margin-top: 0;
- padding-top: 120px; }
- .promotion__list {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -ms-flex-wrap: wrap;
- flex-wrap: wrap;
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between; }
- .promotion__item {
- width: 48%; }
- .promotion__item:nth-child(4) .promotion__item-title {
- margin-top: 61px; }
- .promotion__item-title {
- padding-left: 100px; }
- .promotion__item-title::before {
- top: -10px; }
- .promotion__btn {
- margin-top: auto; } }
- @media (min-width: 1200px) {
- .promotion {
- padding-top: 240px;
- padding-bottom: 420px; }
- .promotion__text {
- font-size: 18px; }
- .promotion__item-title {
- font-size: 24px;
- line-height: 1.2;
- font-weight: 700; }
- .promotion__item-title::before {
- font-size: 60px; }
- .promotion__item {
- width: 45%; }
- .promotion__background-text {
- position: absolute;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-weight: 900;
- font-size: 144px;
- line-height: 177px;
- background: -webkit-gradient(linear, right top, left top, from(#F9D423), to(#F83600));
- background: linear-gradient(270deg, #F9D423 0%, #F83600 100%);
- -webkit-text-fill-color: transparent;
- -webkit-background-clip: text;
- background-clip: text;
- opacity: 0.25;
- width: 1125px;
- top: -100px;
- right: -200px;
- text-align: right;
- z-index: 2;
- text-transform: uppercase; } }
- .advantages {
- padding-top: 60px;
- padding-bottom: 60px;
- background-color: #000000; }
- .advantages__list {
- padding: 0;
- margin: 0;
- list-style: none; }
- .advantages__item {
- padding-bottom: 40px; }
- .advantages__btn {
- margin-left: auto;
- margin-right: auto;
- padding-left: 20px;
- padding-right: 20px; }
- .advantages__item-title {
- padding: 0;
- margin: 0;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 18px;
- line-height: 1.2;
- font-weight: 700;
- padding-bottom: 40px;
- padding-left: 70px;
- position: relative;
- color: #ffffff;
- text-transform: uppercase; }
- .advantages__item-title::before {
- content: "01";
- position: absolute;
- left: 0;
- top: -5px;
- font-family: "Montserrat", "Arial", "sans-serif";
- font-size: 46px;
- line-height: 1.2;
- font-weight: 900;
- background-image: -webkit-gradient(linear, right top, left top, from(#F9D423), to(#F83600));
- background-image: linear-gradient(270deg, #F9D423 0%, #F83600 100%);
- text-transform: uppercase;
- -webkit-text-fill-color: transparent;
- -webkit-background-clip: text;
- background-clip: text; }
- .advantages__item:nth-child(2) .advantages__item-title::before {
- content: "02"; }
- .advantages__item:nth-child(3) .advantages__item-title::before {
- content: "03"; }
- .advantages__item:nth-child(4) .advantages__item-title::before {
- content: "04"; }
- .advantages__item-text {
- padding: 0;
- margin: 0;
- font-family: "Roboto", "Arial", "sans-serif";
- font-size: 16px;
- line-height: 1.2;
- font-weight: 400;
- color: #ffffff; }
- @media (min-width: 600px) {
- .advantages {
- padding-top: 240px;
- padding-bottom: 240px; } }
- @media (min-width: 768px) {
- .advantages__list {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -ms-flex-wrap: wrap;
- flex-wrap: wrap;
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between;
- padding-bottom: 60px; }
- .advantages__item {
- width: 48%; }
- .advantages__item-title {
- padding-left: 100px; }
- .advantages__item-title::before {
- top: -10px; }
- .advantages__btn {
- margin-left: 0; } }
- @media (min-width: 1200px) {
- .advantages__list {
- padding-right: 240px; }
- .advantages__item {
- width: 40%; }
- .advantages__container {
- position: relative; } }
- .block {
- padding-top: 120px;
- padding-bottom: 120px;
- background-color: lightyellow;
- position: relative;
- margin-top: 85px;
- padding-bottom: 85px; }
- .block__wrapper {
- padding-top: 60px;
- padding-bottom: 60px; }
- .cases--services.block {
- margin-top: -120px; }
- .parallelogram--left {
- background-color: currentColor;
- color: lightpink;
- margin-top: 85px; }
- .parallelogram--left::before {
- content: "";
- position: absolute;
- width: 100%;
- height: 100px;
- background-color: currentColor;
- -webkit-clip-path: polygon(100% 15%, 0 100%, 100% 100%);
- clip-path: polygon(100% 15%, 0 100%, 100% 100%);
- top: -100px;
- left: 0; }
- .parallelogram--left:after {
- content: "";
- position: absolute;
- width: 100%;
- height: 100px;
- background-color: currentColor;
- -webkit-clip-path: polygon(0 0, 0 85%, 100% 0);
- clip-path: polygon(0 0, 0 85%, 100% 0);
- bottom: -100px;
- left: 0; }
- .trapezoid--left {
- background-color: currentColor;
- padding-bottom: 60px;
- padding-top: 60px; }
- .trapezoid--left::before {
- content: "";
- position: absolute;
- width: 100%;
- height: 100px;
- background-color: currentColor;
- -webkit-clip-path: polygon(100% 15%, 0 100%, 100% 100%);
- clip-path: polygon(100% 15%, 0 100%, 100% 100%);
- top: -100px;
- left: 0; }
- .trapezoid--left:after {
- content: "";
- position: absolute;
- width: 100%;
- height: 100px;
- background-color: currentColor;
- -webkit-clip-path: polygon(100% 0, 0 0, 100% 85%);
- clip-path: polygon(100% 0, 0 0, 100% 85%);
- bottom: -100px;
- left: 0; }
- .trapezoid--right {
- background-color: currentColor;
- color: lightgoldenrodyellow;
- margin-top: 85px;
- margin-bottom: 85px;
- padding-top: 60px;
- padding-bottom: 60px; }
- .trapezoid--right::before {
- content: "";
- position: absolute;
- width: 100%;
- height: 100px;
- background-color: currentColor;
- -webkit-clip-path: polygon(0 15%, 0% 100%, 100% 100%);
- clip-path: polygon(0 15%, 0% 100%, 100% 100%);
- top: -100px;
- left: 0; }
- .trapezoid--right:after {
- content: "";
- position: absolute;
- width: 100%;
- height: 100px;
- background-color: currentColor;
- -webkit-clip-path: polygon(0 0, 0 85%, 100% 0);
- clip-path: polygon(0 0, 0 85%, 100% 0);
- bottom: -100px;
- left: 0; }
- .parallelogram--right {
- background-color: currentColor; }
- .parallelogram--right::before {
- content: "";
- position: absolute;
- width: 100%;
- height: 100px;
- background-color: currentColor;
- -webkit-clip-path: polygon(0 15%, 0% 100%, 100% 100%);
- clip-path: polygon(0 15%, 0% 100%, 100% 100%);
- top: -100px;
- left: 0; }
- .parallelogram--right:after {
- content: "";
- position: absolute;
- width: 100%;
- height: 100px;
- background-color: currentColor;
- -webkit-clip-path: polygon(100% 0, 0 0, 100% 85%);
- clip-path: polygon(100% 0, 0 0, 100% 85%);
- bottom: -100px;
- left: 0; }
- .block.block--first {
- margin-top: 0;
- padding-top: 30px; }
- .block.block--first::before {
- content: none; }
- .block.block--last {
- margin-bottom: 0; }
- .block.block--last::after {
- content: none; }
- .block--white {
- color: #ffffff; }
- .block--white::after {
- bottom: 0;
- color: transparent; }
- .block--black {
- color: #000000;
- margin-top: -15px; }
- .subblock {
- background-color: lightcyan;
- width: 100%;
- min-height: 300px; }
- .content {
- background-color: lightcoral;
- min-height: 100px; }
- @media (min-width: 600px) {
- .block {
- padding: 0;
- margin: 0;
- padding-top: 120px;
- padding-bottom: 120px;
- background-size: cover;
- background-position: center 0; }
- .block.services {
- padding-top: 60px; }
- .cases {
- padding-bottom: 180px; }
- .stages {
- padding-top: 90px;
- padding-bottom: 180px; }
- .achievement {
- margin-top: -90px; }
- .reviews {
- padding-top: 180px; }
- .reviews::before {
- -webkit-clip-path: polygon(0 0, 0 100%, 100% 0);
- clip-path: polygon(0 0, 0 100%, 100% 0);
- color: #000000;
- top: 0; }
- .custom.block {
- padding-top: 0; } }
- @media (min-width: 767px) {
- .advantages--services {
- margin-top: -40px; } }
- @media (min-width: 1200px) {
- .block.services {
- padding-top: 0; }
- .block {
- padding-top: 0;
- padding-bottom: 0; }
- .block::before {
- height: 200px;
- top: -200px; }
- .block::after {
- height: 200px;
- bottom: -200px; }
- .block__wrapper {
- padding-top: 200px;
- padding-bottom: 200px;
- overflow: hidden;
- position: relative;
- height: 100%;
- width: 100%; }
- .block__wrapper--last {
- padding-bottom: 0; }
- .block.stages {
- padding-top: 200px;
- padding-bottom: 200px; }
- .block.stages--services {
- padding-top: 0;
- padding-bottom: 100px; }
- .block.reviews {
- padding-top: 200px;
- padding-bottom: 100px; }
- .block.reviews::before {
- -webkit-clip-path: polygon(0 0, 0 100%, 100% 0);
- clip-path: polygon(0 0, 0 100%, 100% 0);
- color: #000000;
- top: 0; } }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement