header {
height: 90px;
position: absolute;
left: 0;
top: 0;
z-index: 4;
width: 100%;
color: #fff;
border-bottom: 2px solid rgba(255, 255, 255, 0.5); }
@media (max-width: 900px) {
header {
height: 70px;
position: fixed;
background: #23211b;
border-bottom: 2px solid #23211b; } }
header .mobile-btn-menu {
display: none;
position: absolute;
right: 0;
z-index: 3;
width: 70px;
height: 70px;
top: 0;
background: var(--main-color); }
@media (max-width: 900px) {
header .mobile-btn-menu {
display: block; } }
header .mobile-btn-menu:before {
position: absolute;
left: 20px;
width: 30px;
top: 25px;
height: 2px;
background: #fff;
content: ""; }
header .mobile-btn-menu:after {
position: absolute;
left: 20px;
width: 30px;
bottom: 25px;
height: 2px;
background: #fff;
content: ""; }
header .mobile-btn-menu span {
position: absolute;
left: 20px;
width: 30px;
top: calc(50% - 1px);
height: 2px;
background: #fff; }
header .logo {
height: inherit;
display: inline-flex;
vertical-align: top;
width: 30%;
position: relative; }
@media (max-width: 1200px) {
header .logo {
width: 20%; } }
@media (max-width: 900px) {
header .logo {
float: left;
width: 150px; } }
header .logo .middle {
margin: auto;
display: flex;
text-align: left; }
header .logo span {
margin: auto;
margin-left: 150px;
padding-left: 20px;
padding-right: 20px;
font-size: 12px; }
@media (max-width: 1200px) {
header .logo span {
display: none; } }
header .logo a {
position: absolute;
width: 150px;
height: 100%;
top: 0;
left: 0;
display: flex; }
header .logo a img {
width: 100%;
object-fit: contain;
object-position: left center;
max-height: 80%;
margin: auto; }
header .adres-sec {
display: inline-flex;
height: inherit;
vertical-align: top;
width: 24%;
padding-left: 20px;
padding-right: 20px;
text-align: left; }
@media (max-width: 900px) {
header .adres-sec {
float: left;
width: 200px; } }
@media (max-width: 700px) {
header .adres-sec {
display: none; } }
header .adres-sec span {
margin: auto;
font-size: 14px;
position: relative;
padding-left: 20px; }
header .adres-sec span i {
position: absolute;
left: 0;
font-size: 16px;
top: 2px; }
header .job-sec {
display: inline-flex;
height: inherit;
vertical-align: top;
text-align: left;
width: 20%;
padding-left: 20px;
padding-right: 20px; }
@media (max-width: 1100px) {
header .job-sec {
width: 24%; } }
@media (max-width: 900px) {
header .job-sec {
display: none; } }
header .job-sec .middle {
margin: auto;
margin-left: 0; }
header .job-sec span {
display: block;
font-size: 14px;
position: relative;
padding-left: 25px;
margin-bottom: 5px; }
header .job-sec span:last-child {
margin-bottom: 0; }
header .job-sec span i {
position: absolute;
left: 0;
font-size: 16px;
top: 0px; }
header .phone-head {
display: inline-flex;
height: inherit;
vertical-align: top;
width: 15%;
padding-left: 20px; }
@media (max-width: 1200px) {
header .phone-head {
width: 24%; } }
@media (max-width: 900px) {
header .phone-head {
float: left;
width: 185px; } }
@media (max-width: 500px) {
header .phone-head {
display: none; } }
header .phone-head span {
margin: auto;
margin-right: 0;
text-align: right; }
header .phone-head a {
font-family: "Acrom";
font-size: 18px;
color: #fff;
text-decoration: none; }
@media (max-width: 900px) {
header .phone-head a {
font-size: 16px; } }
header .phone-head .head-call {
outline: none;
transition: 0.3s;
padding: 10px 15px;
background: var(--main-color);
margin-top: 5px;
cursor: pointer;
font-family: "Acrom";
text-transform: uppercase;
font-size: 12px;
display: inline-block;
color: #fff;
border-radius: 5px; }
header .phone-head .head-call:hover {
background: var(--two-color);
box-shadow: 0 0 15px rgba(71, 74, 80, 0.5); }

footer {
padding-top: 30px;
background: #23211b; }
@media (max-width: 750px) {
footer {
margin-bottom: 50px; } }
footer .child-menu {
display: none; }
footer .developed {
background: #0b090b;
padding-top: 10px;
padding-bottom: 10px;
color: #fff; }
footer .developed .wrapper {
font-size: 0; }
footer .developed span {
display: inline-block;
vertical-align: top;
color: #fff;
font-family: "Acrom";
font-size: 14px; }
@media (max-width: 600px) {
footer .developed span {
margin-bottom: 15px; }
footer .developed span:last-child {
margin-bottom: 0; } }
@media (max-width: 500px) {
footer .developed span {
width: 100%;
margin-bottom: 10px; } }
footer .developed span a {
color: #fff;
font-family: "Acrom";
text-decoration: none;
font-size: 14px; }
footer .developed span a:hover {
color: var(--two-color); }
footer .footer-colum {
width: 24%;
display: inline-block;
vertical-align: top;
padding-bottom: 30px; }
@media (max-width: 800px) {
footer .footer-colum {
max-width: 48%;
width: 48%;
padding-right: 50px; } }
@media (max-width: 600px) {
footer .footer-colum {
width: 100%;
max-width: 100%;
padding-bottom: 20px; } }
footer .footer-colum .footer-title {
color: #fff;
font-family: "Acrom";
font-size: 27px;
margin-bottom: 30px; }
@media (max-width: 600px) {
footer .footer-colum .footer-title {
margin-bottom: 10px; } }
footer .footer-colum .footer-desc {
text-align: left;
color: #fff; }
footer .footer-colum .footer-desc p {
font-size: 13px;
line-height: 17px;
color: #909090; }
footer .footer-colum .footer-desc .footer-info {
display: block;
padding-left: 25px;
position: relative;
font-family: "Acrom";
line-height: 17px;
font-size: 13px;
margin-bottom: 20px; }
@media (max-width: 600px) {
footer .footer-colum .footer-desc .footer-info {
margin-bottom: 10px; } }
footer .footer-colum .footer-desc .footer-info i {
top: 2px;
left: 0;
position: absolute;
color: var(--two-color); }
footer .footer-colum .footer-desc .footer-info a {
text-decoration: none;
color: inherit;
font-size: inherit; }
footer .footer-colum .footer-desc input {
background: transparent;
border: 1px solid #ccc;
height: 37px;
font-family: "Acrom";
border-radius: 5px;
color: #fff;
padding: 10px;
padding-right: 45px; }
@media (max-width: 860px) {
footer .footer-colum .footer-desc input {
padding-right: 0; } }
footer .footer-colum-menu {
width: 30%;
display: inline-block;
vertical-align: top;
padding-bottom: 30px; }
@media (max-width: 800px) {
footer .footer-colum-menu {
display: none; } }
footer .footer-colum-menu .footer-title {
color: #fff;
font-family: "Acrom";
font-size: 27px;
margin-bottom: 30px; }
@media (max-width: 600px) {
footer .footer-colum-menu .footer-title {
margin-bottom: 10px; } }
footer .footer-colum-menu ul {
padding: 0; }
footer .footer-colum-menu li {
padding: 0;
margin-bottom: 7px;
list-style: none;
display: inline-block;
vertical-align: top;
text-align: left;
width: 100%; }
footer .footer-colum-menu li a {
color: #fff;
text-decoration: none;
font-family: "Acrom";
font-size: 14px; }
footer .footer-colum-menu li a:hover {
color: var(--main-color); }

.menu-main {
position: absolute;
left: 0;
top: 88px;
z-index: 4;
width: 100%; }
.menu-main .project-ref {
cursor: default; }
.menu-main li {
display: inline-block;
position: relative; }
.menu-main li .child-menu {
position: absolute;
display: none;
padding: 0;
left: -20px;
border-radius: 2px;
overflow: hidden;
margin: 0;
top: 100%;
width: max-content;
background: var(--main-color); }
.menu-main li .child-menu li {
display: block; }
.menu-main li .child-menu a {
padding-left: 20px;
padding-right: 20px;
font-size: 14px; }
.menu-main li .child-menu a:hover {
background: var(--two-color);
color: #fff; }
.menu-main li:hover .child-menu {
display: block; }
.menu-main a {
padding-top: 10px;
display: block;
font-size: 16px;
text-transform: uppercase;
text-decoration: none;
padding-bottom: 10px;
font-family: "Acrom";
border-top: 2px solid transparent;
color: #fff; }
.menu-main a:hover {
color: var(--main-color); }
.menu-main .active-menu {
border-top: 2px solid var(--main-color);
color: var(--main-color); }
@media (max-width: 900px) {
.menu-main {
left: -100%;
transition: 0.2s;
position: fixed;
top: 90px;
background: #23211b;
width: 100%;
overflow: auto;
padding-bottom: 20px;
height: calc(100vh - 90px);
z-index: 7; }
.menu-main li {
display: block;
border-bottom: 1px solid var(--main-color); }
.menu-main li .child-menu {
display: block;
position: relative;
left: 0;
background: transparent; }
.menu-main li .child-menu li {
border-bottom: none; }
.menu-main li .child-menu a {
padding-left: 0px;
padding-right: 0;
padding-top: 0px;
padding-bottom: 5px;
font-size: 12px; } }

.mobile-inform {
display: none;
padding-top: 20px;
padding-bottom: 20px; }
@media (max-width: 900px) {
.mobile-inform {
display: flow-root; } }
.mobile-inform .job-time {
float: left;
width: 50%;
text-align: left; }
@media (max-width: 500px) {
.mobile-inform .job-time {
width: 100%; } }
.mobile-inform .job-time span {
display: block;
margin-bottom: 5px;
color: #fff;
font-size: 16px;
padding-left: 25px;
position: relative; }
.mobile-inform .job-time span i {
position: absolute;
left: 0;
top: 0; }
.mobile-inform .job-time span:last-child {
margin-bottom: 0; }
.mobile-inform .call-mobile-sec {
display: none; }
@media (max-width: 500px) {
.mobile-inform .call-mobile-sec {
display: block;
margin-bottom: 20px; } }
.mobile-inform .call-mobile-sec a {
font-size: 22px;
padding-top: 0;
padding-bottom: 0; }
.mobile-inform .call-mobile-sec .mob-call {
outline: none;
transition: 0.3s;
padding: 10px 20px;
background: var(--main-color);
margin-top: 5px;
cursor: pointer;
font-family: "Acrom";
text-transform: uppercase;
font-size: 12px;
display: inline-block;
color: #fff;
border-radius: 5px; }
.mobile-inform .adres-mob {
display: none;
text-align: left;
color: #fff;
font-size: 16px;
float: left;
width: 50%;
font-size: 16px;
padding-left: 25px;
position: relative; }
@media (max-width: 500px) {
.mobile-inform .adres-mob {
width: 100%;
margin-top: 10px; } }
.mobile-inform .adres-mob i {
position: absolute;
left: 0;
top: 0; }
@media (max-width: 700px) {
.mobile-inform .adres-mob {
display: block; } }

.active-menu-sec {
left: 0; }