@charset "UTF-8";
/*!
Theme Name: euromsz
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: euromsz
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

euromsz is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
@font-face {
  font-family: 'Montserrat';
  src: local("Montserrat Semi Bold"), local("Montserrat-Semi-Bold"), url("../fonts/Montserrat-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Montserrat';
  src: local("Montserrat Regular"), local("Montserrat-Regular"), url("../fonts/Montserrat-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
body {
  margin: 0;
}

.main_page {
  color: #020202;
  background: #fff;
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 22px;
  max-width: 1920px;
  line-height: 1.4;
  margin: auto;
}
.main_page * {
  box-sizing: border-box;
  --color-text: #000;
  --color-blue: #0166B1;
}
.main_page *::before, .main_page *::after {
  box-sizing: content-box;
}
.main_page .img_responsive {
  display: block;
  width: 100%;
  height: auto;
  margin: auto;
}
.main_page .my_btn {
  display: inline-block;
  position: relative;
  width: 100%;
  max-width: 170px;
  text-align: center;
  cursor: pointer;
  transition: all .2s linear;
  color: #fff;
  overflow: hidden;
  z-index: 0;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  border-radius: 6px;
  position: relative;
  font-size: 14px;
  text-transform: uppercase;
  font-weight: 400;
  padding: 15px 20px;
  background: var(--color-color-blue);
  margin: auto;
  font-family: 'Roboto', sans-serif;
  outline: none;
  border: 1px solid var(--color-blue);
  border-radius: 0;
}
.main_page .my_btn::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: initial;
  right: 0;
  width: 0;
  height: 100%;
  background: #fff;
  transition: all .3s linear;
  z-index: -1;
}
.main_page .my_btn:hover {
  color: #7BA5E3;
}
.main_page .my_btn:hover::before {
  right: initial;
  left: 0;
  width: 100%;
}
.main_page .my_btn:focus {
  outline: none;
}
.main_page .my_btn:hover {
  color: var(--color-blue);
}
.main_page h1 {
  color: var(--color-blue);
  font-size: 60px;
  font-weight: 600;
  text-align: center;
  margin: 13px 0 0;
  line-height: 1.2;
}
.main_page h2 {
  font-size: 32px;
  font-weight: 600;
  text-align: center;
  text-transform: uppercase;
  margin: 0;
}
.main_page h4 {
  font-size: 22px;
  font-weight: 600;
  margin: 0;
  line-height: 1.09;
  text-align: center;
}
.main_page p {
  margin: 0;
}
.main_page a {
  color: var(--color-text);
  transition: all .25s linear;
  text-decoration: none;
}
.main_page ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
}
.main_page .container {
  max-width: 1440px;
  margin: auto;
}
.main_page .main-header {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  max-width: 1920px;
  margin: auto;
  min-height: 40px;
  z-index: 2;
  padding: 27px 20px 24px;
  background: rgba(255, 255, 255, 0.8);
  transition: all .25s linear;
  box-shadow: rgba(12, 69, 159, 0.09) 0px 4px 16px;
}
.main_page .main-header .box_content {
  margin: auto;
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}
.main_page .main-header .box_content .logo {
  display: block;
}
.main_page .main-header .box_content .logo .strong {
  float: left;
  text-align: left;
}
.main_page .main-header .box_content .logo .strong img {
  display: block;
  height: auto;
  width: 100%;
  max-width: 190px;
  transition: all .25s linear;
}
.main_page .main-header .box_content .box_tel {
  text-align: right;
  padding-left: 20px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -o-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: flex-end;
  -webkit-align-items: flex-end;
  -ms-flex-align: flex-end;
  align-items: flex-end;
}
.main_page .main-header .box_content .box_tel a {
  display: inline-block;
  color: var(--color-blue);
  font-weight: bold;
  font-size: 24px;
  position: relative;
}
.main_page .main-header .box_content .box_tel a::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: initial;
  right: 0;
  width: 0;
  height: 2px;
  background: var(--color-blue);
  transition: all .3s linear;
}
.main_page .main-header .box_content .box_tel a:hover::before {
  right: initial;
  left: 0;
  width: 100%;
}
.main_page .main-header .box_content .box_tel a:last-of-type {
  margin-top: 5px;
}
.main_page .main-header.header-scroll {
  padding: 10px 20px 10px;
}
.main_page .main-header.header-scroll .box_content .box_tel a {
  font-size: 20px;
}
.main_page .section-1 {
  padding: 118px 20px 140px;
  background-image: url(../images/sct-1_bg.webp);
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
  min-height: 100vh;
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}
.main_page .section-1::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(229, 229, 229, 0.46);
  opacity: 0.7;
}
.main_page .section-1 .box_content {
  position: relative;
  margin: auto;
}
.main_page .section_portfolio {
  padding: 138px 10px 130px;
}
.main_page .section_portfolio .box_title {
  text-align: center;
}
.main_page .section_portfolio .box_content {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  max-width: 1440px;
  margin: 24px auto 0;
}
.main_page .section_portfolio .box_content .box {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -o-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  width: calc(33.33% - 10px);
  -webkit-justify-content: flex-end;
  -ms-justify-content: flex-end;
  justify-content: flex-end;
  padding: 20px;
  height: 350px;
  position: relative;
  box-shadow: 0px 4px 16px rgba(92, 140, 215, 0.09);
  border-radius: 6px;
  margin: 5px;
  background: #ffffff;
}
.main_page .section_portfolio .box_content .box .box_logo {
  margin: auto 0;
}
.main_page .section_portfolio .box_content .box .box_logo img,
.main_page .section_portfolio .box_content .box .box_logo svg {
  display: block;
  width: 100%;
  max-width: 250px;
  margin: auto;
  height: auto;
  transition: all .6s linear;
}
.main_page .section_portfolio .box_content .box .box_logo p {
  text-align: center;
  font-size: 50px;
  font-weight: 600;
  transition: all .6s linear;
}
.main_page .section_portfolio .box_content .box .box_text {
  text-align: center;
  padding: 20px 0 10px;
}
.main_page .section_portfolio .box_content .box .box_text p {
  margin: 10px 0 0;
  color: #ffffff;
}
.main_page .section_portfolio .box_content .box .box_hide {
  z-index: -1;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: auto;
  opacity: 0;
  transition: opacity 1s linear;
  padding: 20px;
  background: #fff;
}
.main_page .section_portfolio .box_content .box .box_hide::-webkit-scrollbar {
  width: 5px;
}
.main_page .section_portfolio .box_content .box .box_hide::-webkit-scrollbar-thumb {
  background: #000000;
}
.main_page .section_portfolio .box_content .box .box_hide::-webkit-scrollbar-thumb {
  background: var(--color-blue);
}
.main_page .section_portfolio .box_content .box .box_hide img {
  display: block;
  width: 100%;
  height: auto;
}
.main_page .section_portfolio .box_content .box_2 .box_logo img,
.main_page .section_portfolio .box_content .box_2 .box_logo svg {
  max-width: 160px;
}
.main_page footer {
  padding: 35px 20px 20px;
  background: var(--color-blue);
}
.main_page footer .box_content .box_top {
  display: -webkit-grid;
  display: -moz-grid;
  display: -o-box;
  display: -ms-grid;
  display: grid;
  -webkit-grid-template-columns: repeat(3, 1fr);
  -moz-grid-template-columns: repeat(3, 1fr);
  -o-grid-template-columns: repeat(3, 1fr);
  -ms-grid-template-columns: repeat(3, 1fr);
  grid-template-columns: repeat(3, 1fr);
}
.main_page footer .box_content .box_top .box_address .box:not(:first-of-type) {
  margin-top: 5px;
}
.main_page footer .box_content .box_top .box_address address,
.main_page footer .box_content .box_top .box_address p {
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  font-style: normal;
}
.main_page footer .box_content .box_top .box_logo {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}
.main_page footer .box_content .box_top .logo {
  display: inline-block;
  margin: auto;
}
.main_page footer .box_content .box_top .logo .strong img {
  display: block;
  height: auto;
  width: 100%;
  max-width: 175px;
  transition: all .25s linear;
}
.main_page footer .box_content .box_top .box_tel {
  text-align: right;
  padding-left: 20px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -o-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: flex-end;
  -webkit-align-items: flex-end;
  -ms-flex-align: flex-end;
  align-items: flex-end;
  -webkit-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;
}
.main_page footer .box_content .box_top .box_tel a {
  display: block;
  color: #fff;
  font-weight: bold;
  font-size: 24px;
  position: relative;
}
.main_page footer .box_content .box_top .box_tel a::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: initial;
  right: 0;
  width: 0;
  height: 2px;
  background: var(--color-blue);
  transition: all .3s linear;
}
.main_page footer .box_content .box_top .box_tel a:hover::before {
  right: initial;
  left: 0;
  width: 100%;
}
.main_page footer .box_content .box_top .box_tel a::before {
  background: #fff;
}
.main_page footer .box_content .box_bottom {
  padding-top: 15px;
}
.main_page footer .box_content .box_bottom p {
  color: #fff;
  font-size: 16px;
  text-align: center;
}
@media (hover: hover) and (pointer: fine) {
  .main_page .section_portfolio .box_content .box:hover .box_logo img,
  .main_page .section_portfolio .box_content .box:hover .box_logo svg,
  .main_page .section_portfolio .box_content .box:hover .box_logo p {
    -webkit-transform: rotateY(360deg);
    -moz-transform: rotateY(360deg);
    -o-transform: rotateY(360deg);
    -ms-transform: rotateY(360deg);
    transform: rotateY(360deg);
  }
  .main_page .section_portfolio .box_content .box:hover .box_hide {
    z-index: 1;
    opacity: 1;
  }
}
@media (hover: none), (pointer: coarse) {
  .main_page .section_portfolio .box_content .box .box_logo img,
  .main_page .section_portfolio .box_content .box .box_logo svg,
  .main_page .section_portfolio .box_content .box .box_logo p {
    pointer-events: none;
    -webkit-user-select: none;
    /* iOS, Safari, Chrome */
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    /* стандарт */
    -webkit-touch-callout: none;
    /* забороняє меню "копіювати/вставити" на iOS при довгому натисканні */
    -webkit-tap-highlight-color: transparent;
    /* прибирає підсвічування при тапі */
  }
  .main_page .section_portfolio .box_content .box:active .box_logo img,
  .main_page .section_portfolio .box_content .box:active .box_logo svg,
  .main_page .section_portfolio .box_content .box:active .box_logo p {
    -webkit-transform: rotateY(360deg);
    -moz-transform: rotateY(360deg);
    -o-transform: rotateY(360deg);
    -ms-transform: rotateY(360deg);
    transform: rotateY(360deg);
  }
  .main_page .section_portfolio .box_content .box:active .box_hide {
    z-index: 1;
    opacity: 1;
  }
  .main_page .section_portfolio .box_content .box:active .box_hide p {
    pointer-events: none;
    -webkit-user-select: none;
    /* iOS, Safari, Chrome */
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    /* стандарт */
    -webkit-touch-callout: none;
    /* забороняє меню "копіювати/вставити" на iOS при довгому натисканні */
    -webkit-tap-highlight-color: transparent;
    /* прибирає підсвічування при тапі */
  }
  .main_page .section_portfolio .box_content .box::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
  }
}
@media (max-width: 768px) {
  .main_page h1 {
    font-size: 42px;
  }
  .main_page h2 {
    font-size: 24px;
  }
  .main_page p {
    font-size: 20px;
  }
  .main_page .main-header {
    padding: 15px 20px;
  }
  .main_page .main-header .container .burger {
    display: block;
  }
  .main_page .section-1 {
    padding: 90px 20px;
  }
  .main_page .section_portfolio {
    padding: 100px 10px;
  }
  .main_page .section_portfolio .box_content {
    display: -webkit-grid;
    display: -moz-grid;
    display: -o-box;
    display: -ms-grid;
    display: grid;
    -webkit-grid-template-columns: 1fr 1fr;
    -moz-grid-template-columns: 1fr 1fr;
    -o-grid-template-columns: 1fr 1fr;
    -ms-grid-template-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -webkit-grid-column-gap: 10px;
    -moz-grid-column-gap: 10px;
    -o-grid-column-gap: 10px;
    -ms-grid-column-gap: 10px;
    grid-column-gap: 10px;
    -webkit-grid-row-gap: 10px;
    -moz-grid-row-gap: 10px;
    -o-grid-row-gap: 10px;
    -ms-grid-row-gap: 10px;
    grid-row-gap: 10px;
  }
  .main_page .section_portfolio .box_content .box {
    width: 100%;
  }
  .main_page footer .box_content .box_top {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -o-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
  }
  .main_page footer .box_content .box_top .box_logo {
    order: -1;
  }
  .main_page footer .box_content .box_top .box_address {
    margin-top: 20px;
  }
  .main_page footer .box_content .box_top .box_tel {
    margin-top: 20px;
    text-align: center;
    padding-left: 0;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
  }
  .main_page footer .box_content .box_top .box_tel a {
    font-size: 18px;
  }
}
@media (max-width: 600px) {
  .main_page .section-7 .box_title p {
    font-size: 36px;
  }
  .main_page .section_portfolio .box_content {
    display: block;
  }
  .main_page .section_portfolio .box_content .box {
    width: 100%;
  }
}
@media (max-width: 480px) {
  .main_page h1 {
    font-size: 28px;
  }
  .main_page p {
    font-size: 18px;
  }
  .main_page .main-header .box_content .box_tel a {
    font-size: 16px;
  }
  .main_page .main-header.header-scroll .box_content .box_tel a {
    font-size: 13px;
  }
  .main_page .section-1 {
    height: auto;
    padding-top: 80px;
  }
  .main_page .section-1 .box_content {
    padding: 70px 0 100px;
  }
  .main_page .section-1 .box_content .box_left .box_text p {
    font-size: 24px;
  }
  .main_page .section-7 .box_title p {
    font-size: 24px;
  }
  .main_page .section_portfolio {
    padding: 70px 10px;
  }
  .main_page footer .box_content .box_top .box_address p,
  .main_page footer .box_content .box_top .box_address address {
    font-size: 14px;
  }
  .main_page footer .box_content .box_bottom p {
    font-size: 14px;
  }
}
@media (max-width: 400px) {
  .main_page h1 {
    font-size: 28px;
  }
  .main_page .main-header {
    padding: 15px 10px;
  }
  .main_page .main-header .box_content .box_tel a {
    font-size: 14px;
  }
  .main_page .section-1 .box_content .box_text p {
    font-size: 28px;
  }
  .main_page .section-2 .box_content .box {
    width: 100%;
  }
  .main_page .section-2 .box_content .box .box_img {
    min-width: 35px;
  }
  .main_page .section-2 .box_content .box .box_img i {
    font-size: 32px;
  }
  .main_page .section-2 .box_content .box .box_number {
    min-width: 115px;
  }
  .main_page .section-2 .box_content .box .box_number p {
    font-size: 42px;
  }
  .main_page .section-5 .box_content .box_left .box_text p {
    font-size: 23px;
  }
}