.image-scroll-01 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/02/web-12.jpg); } .image-scroll-02 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/02/web-13.jpg); } .image-scroll-03 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/02/web-14.jpg); } .image-scroll-04 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/02/web-15.jpg); } .image-scroll-05 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/02/web-16.jpg); } .image-scroll-06 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/02/web-17.jpg); } .image-scroll-07 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/02/web-18.jpg); } .image-scroll-08 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/02/web-19.jpg); } .image-scroll-09 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/02/web-20.jpg); } .image-scroll-13 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/agency04-1-scaled.jpg); } .image-scroll-14 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/agency06-1-scaled.jpg); } .image-scroll-15 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/agency05-2-1.jpg); } .image-scroll-16 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/agency06-1-scaled.jpg); } .image-scroll-17 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/bbq02.jpg); } .image-scroll-18 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/builder-1-scaled.jpg); } .image-scroll-19 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/builder01-1-scaled.jpg); } .image-scroll-20 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/builder02-1-scaled.jpg); } .image-scroll-21 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/builder03-1-scaled.jpg); } .image-scroll-22 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/burquer01-scaled.jpg); } .image-scroll-23 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/contact-us-01-1.jpg); } .image-scroll-24 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/contac-us-02-1.jpg); } .image-scroll-25 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/contact-lawyer01-1.jpg); } .image-scroll-26 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/fitness06-scaled.jpg); } .image-scroll-27 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/fitness04-scaled.jpg); } .image-scroll-28 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/fitness01-scaled.jpg); } .image-scroll-29 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/fitness02-scaled.jpg); } .image-scroll-30 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/fitness03-scaled.jpg); } .image-scroll-31 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/fitness04-scaled.jpg); } .image-scroll-32 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/fitness05-scaled.jpg); } .image-scroll-33 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/lawyer02-2-scaled.jpg); } .image-scroll-34 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/lawyer01-1-scaled.jpg); } .image-scroll-35 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/houses01-1-scaled.jpg); } .image-scroll-36 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/lawyer03-1-scaled.jpg); } .image-scroll-37 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/06/new-season-scaled.jpg); } .image-scroll-38 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/06/agenda-scaled.jpg); } .image-scroll-39 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/06/asma-scaled.jpg); } .image-scroll-40 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/06/glasses.jpg); } .image-scroll-41 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/06/gympro-scaled.jpg); } .image-scroll-42 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/06/hiking-scaled.jpg); } .image-scroll-43 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/06/recruitment-screenshot.jpg); } /* sliderdemo */ .image-scroll-10 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/06/Untitled-37.jpg); } .image-scroll-11 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/06/Untitled-35.jpg); } .image-scroll-12 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/06/Untitled-40.jpg); } /* countdown-counter-demo */ .image-scroll-200 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/06/astronaut-countdown.jpg); } .image-scroll-201 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/06/countdown-launch-elementor.jpg); } .image-scroll-202 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/06/countdown-screenshot.jpg); } @charset "UTF-8"; @font-face { font-family: "Raleway Regular"; src: url(../fonts/Raleway/RalewayRegular.eot); src: url(../fonts/Raleway/RalewayRegular.eot?#iefix) format("embedded-opentype"), url(../fonts/Raleway/RalewayRegular.woff) format("woff"), url(../fonts/Raleway/RalewayRegular.ttf) format("truetype"); font-style: normal; font-weight: 400; font-display: swap; } @font-face { font-family: "Raleway Light"; src: url(../fonts/Raleway/RalewayLight.eot); src: url(../fonts/Raleway/RalewayLight.eot?#iefix) format("embedded-opentype"), url(../fonts/Raleway/RalewayLight.woff) format("woff"), url(../fonts/Raleway/RalewayLight.ttf) format("truetype"); font-style: normal; font-weight: 300; font-display: swap; } @font-face { font-family: Flaticon; src: url(../fonts/flaticon/Flaticon.eot); src: url(../fonts/flaticon/Flaticon.eot?#iefix) format("embedded-opentype"), url(../fonts/flaticon/Flaticon.woff) format("woff"), url(../fonts/flaticon/Flaticon.ttf) format("truetype"), url(../fonts/flaticon/Flaticon.svg#Flaticon) format("svg"); font-weight: 400; font-style: normal; font-display: swap; } @media screen and (-webkit-min-device-pixel-ratio: 0) { @font-face { font-family: Flaticon; src: url(../fonts/flaticon/Flaticon.svg#Flaticon) format("svg"); font-display: swap; } } .fi:before { display: inline-block; font-family: Flaticon; font-style: normal; font-weight: 400; font-variant: normal; line-height: 1; text-decoration: inherit; text-rendering: optimizeLegibility; text-transform: none; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; } .flaticon-briefcase:before { content: "\f100"; } .flaticon-search:before { content: "\f101"; } .flaticon-smartphone-call:before { content: "\f102"; } .flaticon-folded-newspaper:before { content: "\f103"; } .flaticon-placeholder:before { content: "\f104"; } .flaticon-home:before { content: "\f105"; } .main-content:before { content: ""; width: 100%; height: 100%; position: absolute; top: 0; left: 0; } * { -webkit-box-sizing: border-box; box-sizing: border-box; } .main-content { background-repeat: no-repeat; -webkit-background-size: cover; background-size: cover; background-position: center; position: relative; } ul { padding: 0; margin: 0; } li { list-style: none; } .wrapper { overflow: hidden; position: relative; -webkit-box-flex: 1; -webkit-flex: 1 0 auto; -ms-flex: 1 0 auto; flex: 1 0 auto; min-height: 100%; } .footer { -webkit-box-flex: 1; -webkit-flex: 1 0 auto; -ms-flex: 1 0 auto; flex: 1 0 auto; } .container { position: relative; z-index: 1; margin: 0 auto; max-width: 1200px; } .h2 { display: inline-block; color: tomato; font-size: 1.92857rem; padding: 22px; padding-top: 0; border-bottom: 2px solid tomato; margin-bottom: 20px; } img { display: block; max-width: 100%; max-height: 100%; } h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: 0; font-weight: 400; } .button { display: inline-block; border: none; color: #fff; text-decoration: none; background-image: linear-gradient(40deg, #ef42ff, #ff4500); padding-left: 32px; padding-right: 32px; line-height: 25px; font-size: 13px; text-transform: uppercase; font-weight: 600; text-align: center; position: relative; outline: 0; -webkit-transition: background-color 0.1s ease; -o-transition: background-color 0.1s ease; transition: background-color 0.1s ease; cursor: pointer; padding-top: 10px; padding-bottom: 10px; } .button:hover { background-color: #40bebd85; color: #fff; border-color: #40bea7; padding-top: 10px; padding-bottom: 10px; background-image: linear-gradient(40deg, #ef42ff, #40bea7); /* border: 1px solid; */ box-shadow: 0 0 0 0.25rem rgb(82 82 82 / 25%); -webkit-transition: background-color 0.1s ease; -o-transition: background-color 0.1s ease; transition: background-color 0.1s ease; cursor: pointer; } audio, canvas, progress, video { display: inline-block; } audio:not([controls]) { display: none; height: 0; } progress { vertical-align: baseline; } a { background-color: transparent; -webkit-text-decoration-skip: objects; text-decoration: none; } a:active, a:hover { outline-width: 0; } a:hover { text-decoration: none; } abbr[title] { border-bottom: none; text-decoration: underline; -webkit-text-decoration: underline dotted; text-decoration: underline dotted; } b, strong { font-weight: inherit; } b, strong { font-weight: bolder; } dfn { font-style: italic; } mark { background-color: #ff0; color: #000; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } img { border-style: none; } svg:not(:root) { overflow: hidden; } code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } /* figure { margin: 1em 40px; } */ hr { -webkit-box-sizing: content-box; box-sizing: content-box; height: 0; overflow: visible; } button, input, select, textarea { font: inherit; margin: 0; } optgroup { font-weight: 700; } button, input { overflow: visible; } [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner, button::-moz-focus-inner { border-style: none; padding: 0; } [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring, button:-moz-focusring { outline: 1px dotted ButtonText; } fieldset { border: 1px solid silver; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } legend { -webkit-box-sizing: border-box; box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; } textarea { overflow: auto; } [type="checkbox"], [type="radio"] { -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0; } [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } [type="search"] { -webkit-appearance: textfield; outline-offset: -2px; } [type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-input-placeholder { color: inherit; opacity: 0.54; } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } .loader { bottom: 0; height: auto; left: 30%; position: absolute; right: 0; top: 0; width: 10%; z-index: 9999; } .loader-inner { position: fixed; top: 50%; left: 50%; height: 10rem; width: 10rem; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } .loader-inner>.circle { position: absolute; height: inherit; width: inherit; background: tomato; -webkit-border-radius: 50%; border-radius: 50%; -webkit-animation: animate-circle 1.5s cubic-bezier(0.9, 0.24, 0.62, 0.79) infinite; animation: animate-circle 1.5s cubic-bezier(0.9, 0.24, 0.62, 0.79) infinite; -webkit-animation-fill-mode: backwards; animation-fill-mode: backwards; } .loader-inner>.circle:nth-of-type(1) { -webkit-animation-delay: 0; animation-delay: 0; } .loader-inner>.circle:nth-of-type(2) { -webkit-animation-delay: 1.2s; animation-delay: 1.2s; } .loader-inner>.circle:nth-of-type(3) { -webkit-animation-delay: 0.9s; animation-delay: 0.9s; } @-webkit-keyframes animate-circle { from { -webkit-transform: scale(0); transform: scale(0); opacity: 1; } to { -webkit-transform: scale(1); transform: scale(1); opacity: 0; } } @keyframes animate-circle { from { -webkit-transform: scale(0); transform: scale(0); opacity: 1; } to { -webkit-transform: scale(1); transform: scale(1); opacity: 0; } } .mnu-btn { background-color: tomato; outline: 0; width: 50px; height: 50px; border: none; position: relative; cursor: pointer; margin-left: auto; -webkit-transition: background-color 0.5s; -o-transition: background-color 0.5s; transition: background-color 0.5s; margin-bottom: 30px; } .mnu-btn span { display: block; } .sandwich { width: 30px; height: 30px; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; } .sw-topper { position: relative; top: 9px; width: 30px; height: 2px; background: #fff; border: none; -webkit-border-radius: 4px 4px 4px 4px; border-radius: 4px 4px 4px 4px; -webkit-transition: top 0.2s, -webkit-transform 0.5s; transition: top 0.2s, -webkit-transform 0.5s; -o-transition: transform 0.5s, top 0.2s; transition: transform 0.5s, top 0.2s; transition: transform 0.5s, top 0.2s, -webkit-transform 0.5s; } .sw-bottom { position: relative; width: 30px; height: 2px; top: 13px; background: #fff; border: none; -webkit-border-radius: 4px 4px 4px 4px; border-radius: 4px 4px 4px 4px; -webkit-transition: top 0.2s, -webkit-transform 0.5s; transition: top 0.2s, -webkit-transform 0.5s; -o-transition: transform 0.5s, top 0.2s; transition: transform 0.5s, top 0.2s; transition: transform 0.5s, top 0.2s, -webkit-transform 0.5s; } .sw-footer { position: relative; width: 30px; height: 2px; top: 17px; background: #fff; border: none; -webkit-border-radius: 4px 4px 4px 4px; border-radius: 4px 4px 4px 4px; -webkit-transition: top 0.2s, -webkit-transform 0.5s; transition: top 0.2s, -webkit-transform 0.5s; -o-transition: transform 0.5s, top 0.2s; transition: transform 0.5s, top 0.2s; transition: transform 0.5s, top 0.2s, -webkit-transform 0.5s; -webkit-transition-delay: 0.2s, 0s; -o-transition-delay: 0.2s, 0s; transition-delay: 0.2s, 0s; } .sandwich.active .sw-topper { top: 14px; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .sandwich.active .sw-bottom { top: 12px; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .sandwich.active .sw-footer { opacity: 0; top: 0; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .user { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; text-align: center; opacity: 0; -webkit-transition: opacity 0.2s; -o-transition: opacity 0.2s; transition: opacity 0.2s; white-space: nowrap; } .user__photo { width: 120px; height: 120px; -webkit-border-radius: 50%; border-radius: 50%; background-color: #eee; margin-bottom: 25px; } .user__name { letter-spacing: 1px; font-weight: 400; font-size: 1rem; margin-bottom: 10px; } .user__skills { font-weight: 400; font-size: 0.85714rem; color: #434343; } .nav { margin-top: -110px; position: relative; z-index: 10; -webkit-transition: margin-top 0.5s; -o-transition: margin-top 0.5s; transition: margin-top 0.5s; } .nav-list__item:first-child .nav-list__link { border-top: 1px solid #212121; } .nav-list__item:first-child .nav-list__link:before { content: "\f105"; } .nav-list__item:nth-child(2) .nav-list__link:before { content: "\f100"; } .nav-list__item:nth-child(3) .nav-list__link:before { content: "\f103"; } .nav-list__item:nth-child(4) .nav-list__link:before { content: "\f104"; } .nav-list__link { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; color: #b2b2b2; font-weight: 300; font-size: 1rem; background-color: #111; padding: 10px 0 10px 10px; border-bottom: 1px solid #212121; white-space: nowrap; -webkit-transition-property: background-color, color, text-indent; -o-transition-property: background-color, color, text-indent; transition-property: background-color, color, text-indent; -webkit-transition-duration: 0.5s; -o-transition-duration: 0.5s; transition-duration: 0.5s; } .nav-list__link:hover { background-color: tomato; color: #fff; } .nav-list__link:before { font-family: Flaticon; font-size: 1.57143rem; display: block; margin-right: 15px; -webkit-transition: margin-left 0.5s; -o-transition: margin-left 0.5s; transition: margin-left 0.5s; } .main-content { height: 100vh; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .main-content:before { background-color: rgba(0, 0, 0, 0.6); } .content { color: #fff; position: relative; margin-left: 50px; } .title { text-transform: uppercase; margin-bottom: 40px; } .title span { display: block; } .title-first { letter-spacing: 1px; font-size: 2.85714rem; margin-bottom: 5px; } .title-second { font-size: 1.57143rem; } .main-button { letter-spacing: 1px; -webkit-border-radius: 100px; border-radius: 100px; -webkit-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; } .main-button:after { content: ""; display: inline-block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; -webkit-border-radius: 100px; border-radius: 100px; background-color: tomato; z-index: -1; -webkit-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .main-button:hover { -webkit-transform: translateY(-3px); -ms-transform: translateY(-3px); transform: translateY(-3px); -webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2); } .main-button:hover:after { -webkit-transform: scaleX(1.4) scaleY(1.6); -ms-transform: scaleX(1.4) scaleY(1.6); transform: scaleX(1.4) scaleY(1.6); opacity: 0; } .main-button:active { -webkit-transform: translateY(-1px); -ms-transform: translateY(-1px); transform: translateY(-1px); -webkit-box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2); box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2); } .portfolio-main { padding-top: 50px; width: 100%; padding-left: 20px; padding-right: 20px; } .portfolio-heading { color: #fff; } .portfolio-header { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 40px; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .breadcrumbs { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-bottom: 20px; } .breadcrumbs__item:not(:last-child)::after { content: ">"; position: relative; padding-left: 6px; padding-right: 6px; font-size: 12px; } .breadcrumbs__link { letter-spacing: 1px; position: relative; color: #798794; -webkit-transition: 0.15s color; -o-transition: 0.15s color; transition: 0.15s color; } .breadcrumbs__link:hover { color: #ced3d8; } .filters { position: relative; top: 15px; text-align: right; } .filter-label { background-color: transparent; -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; padding: 5px 15px; opacity: 0.4; margin-bottom: 8px; font-size: 0.85714rem; letter-spacing: 3px; color: #fff; outline: 0; cursor: pointer; border: 0; -webkit-border-radius: 5px; border-radius: 5px; } .filter-label:hover { background-color: tomato; opacity: 1; } .filter-label.active { background-color: tomato; opacity: 1; } .gallery__content { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin: 0 -15px -15px; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .gallery__content_2 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin: 0 -15px -15px; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .gallery__content_3 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin: 0 -15px -15px; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .gallery__item { width: -webkit-calc(33.3333% - 30px); width: calc(33.3333% - 30px); margin: 0 15px 15px; overflow: hidden; display: block; position: relative; -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; text-align: center; } .gallery__item:hover .gallery__overlay { opacity: 1; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); } .gallery__img { display: block; min-height: 500px; -webkit-background-size: cover; background-size: cover; background-repeat: no-repeat; background-position: center top; -webkit-transition: background-position 6s; -o-transition: background-position 6s; transition: background-position 6s; -webkit-border-radius: 5px; border-radius: 5px; } .gallery__img:hover { background-position: bottom; transition: all 2.800s; } .gallery__title { color: #fff; letter-spacing: 1px; text-transform: uppercase; } .gallery__description p { color: #616e79; line-height: 1.6; padding: 0; } .inside { background-color: #fafafa; } .inside .inside-content { margin: 5px 5px 55px 55px; } .inside-content { padding: 80px 13% 50px; } .about-header { text-align: center; margin-bottom: 35px; font-family: "Raleway Light", sans-serif; } .about-header__img { display: inline-block; width: 220px; height: 220px; -webkit-border-radius: 50%; border-radius: 50%; background-color: #181818; margin-bottom: 35px; } .about-header__skills { letter-spacing: 3px; font-family: "Raleway Regular", sans-serif; } .about-body p { line-height: 1.6; font-size: 1.07143rem; color: #333; } .contact-header { text-align: center; } .subtitle-text { margin-bottom: 60px; } .subtitle-text p { letter-spacing: 3px; } .contact-body { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .contacts-list { margin-bottom: -40px; margin-top: 45px; margin-right: 30px; } .contacts-list__item { font-size: 1.42857rem; font-family: "Raleway Light", sans-serif; color: #000; margin-bottom: 40px; } .contacts-list__header { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin-bottom: 10px; } .contacts-list__header:before { font-family: Flaticon; font-size: 1.85714rem; display: block; margin-right: 15px; color: #333; } .contacts-list__header svg { width: 26px; height: 26px; margin-right: 15px; } .contacts-list__header svg path, .contacts-list__header svg polygon { fill: #333 !important; } .contacts-list__item:nth-child(1) .contacts-list__header:before { content: "\f101"; } .contacts-list__item:nth-child(4) .contacts-list__header:before { content: "\f104"; } .contacts-list__item:nth-child(5) .contacts-list__header:before { content: "\f102"; } .contacts-list__info { font-size: 1rem; } .contacts-site { color: tomato; text-decoration: underline; font-family: "Raleway Regular", sans-serif; -webkit-transition: color 0.15s; -o-transition: color 0.15s; transition: color 0.15s; } .contacts-site:hover { color: #fa2600; text-decoration: underline; } .contact-form { padding: 30px; color: #fff; background-color: #181818; max-width: 450px; width: 50%; } .form-title { font-size: 1.57143rem; margin-bottom: 25px; text-align: center; } .contact-form__label { display: block; width: 100%; letter-spacing: 3px; font-size: 0.92857rem; color: #5b5b5b; margin-bottom: 15px; } .contact-form__item { display: block; width: 100%; border: 1px solid #484848; background-color: #2e2e2e; padding: 10px; font-size: 1.07143rem; color: #fff; margin-top: 10px; } .contact-textarea { max-width: 100%; margin-bottom: 30px; } .contact-form__button { text-align: center; margin-bottom: 10px; } .contact-form__button .button { line-height: 40px; padding: 0 20px; -webkit-transition: opacity 0.15s, -webkit-transform 0.15s; transition: opacity 0.15s, -webkit-transform 0.15s; -o-transition: opacity 0.15s, transform 0.15s; transition: opacity 0.15s, transform 0.15s; transition: opacity 0.15s, transform 0.15s, -webkit-transform 0.15s; } .contact-form__button .button:hover { opacity: 0.8; } .contact-form__button .button:active { -webkit-transform: translateY(2px); -ms-transform: translateY(2px); transform: translateY(2px); } @media (max-width: 1200px) { .gallery__item { width: -webkit-calc(50% - 30px); width: calc(50% - 30px); } .filters, .portfolio-header__left, .portfolio-header__right { width: 100%; text-align: center; } .filters { top: 0; } .breadcrumbs { -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } } @media (max-width: 991.99px) { .title-first { font-size: 2.5rem; } .title-second { font-size: 1.42857rem; } .main-button { line-height: 45px; } } @media (max-width: 767.99px) { .portfolio-main { padding-left: 10px; padding-right: 10px; } .main-content { -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .content { margin-left: 0; text-align: center; } .gallery__content { margin: 0; margin-bottom: -30px; } .gallery__content_2 { margin: 0; margin-bottom: -30px; } .gallery__content_3 { margin: 0; margin-bottom: -30px; } .gallery__item { width: 100%; margin-left: 0; margin-right: 0; margin-bottom: 30px; } .contact-form { width: 100%; } .contacts-list { margin-right: 0; margin-bottom: 30px; } } @media (max-width: 576px) { .title { margin-bottom: 30px; } .title-first { font-size: 1.42857rem; } .title-second { font-size: 1rem; } .gallery__item { text-align: center; } } @media (max-width: 480px) { .main-button { line-height: 40px; } .gallery__overlay-site, .gallery__overlay-text p { font-size: 0.71429rem; margin-bottom: 5px; margin-top: 5px; } .gallery__overlay-site { margin-bottom: 0; } .gallery__overlay-button { padding: 6px 15px; font-size: 0.71429rem; } .filters { text-align: center; padding-top: 10px; padding-bottom: 5px; } .inside-content { padding: 50px 5% 40px; } .about-header__img { width: 175px; height: 175px; margin-bottom: 20px; } .contact-form { padding: 15px; } .contacts-list { margin-bottom: 15px; } .subtitle-text { margin-bottom: 15px; } .contact-form__label { font-size: 0.78571rem; } } @media (max-width: 320px) { .title { margin-bottom: 15px; } .title-first { font-size: 1.28571rem; margin-bottom: 10px; } .title-second { font-size: 0.85714rem; } .portfolio-heading { font-size: 2rem; } } .justifyContent { justify-content: center; } .tns-controls button { background-color: #000; padding: 5px; } .waves { -webkit-box-shadow: 0px 15px 20px -15px #111; -moz-box-shadow: 0px 15px 20px -15px #111; box-shadow: 0px 15px 20px -15px #111; } /* sliders */ .leaks-slider-bg-01 { background-image: url(https://agency.dronstar.com/wp-content/uploads/2022/03/slider-shape.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; }