@import url('https://fonts.googleapis.com/css?family=Montserrat&display=swap')
:root{ --color-yellow{color:#F7931D}}
body{ font-family:'Montserrat';  color:#333}
.flex{ display:flex}
.transition{ transition:all .5s linear}
.bg-menu{ background:#333}
.pos-relative{ position:relative}
.pos-absolute{ position:absolute}
menu{ height:36px;  margin:0;  padding:0;  align-items:center;  justify-content:center;  list-style:none}
menu a{ padding:10px 80px;  font:600 14px 'Montserrat';  color:#fff}
menu a:hover, .block-email:hover a{ color:#F7931D}
.b-r{ border-right:1px solid #fff}
.middle-block{    padding:2px 0; justify-content:space-between; align-items:center}
.block-phone ul{list-style:none}
.block-phone li{ padding:3px 0}
.block-phone a, .block-email a{    font:16px 'Montserrat'; color:#333}
.block-logo span{ font:600 14px 'Montserrat'; color:var(--color-yellow,#F7931D )}
.block-phone .img-phone::before, .block-email::before{    content:''; display:inline-block; width:12px; height:12px; margin-right:10px; background:url(../images/sprite.png) no-repeat;  background-position:0 -13px}
.block-email::before{ background-position:0 0}
.block-phone .img-phone::before{ margin-top:6px}
.link-logo{position:relative; align-items:center; overflow:hidden}
.link-logo-header::after{ position:absolute;  top:10px;  right:0;  bottom:0;  left:-100px;  width:120px;  height:45px;  background:linear-gradient(to bottom,rgba(229,172,142,0),rgba(255,255,255,0.5) 50%,rgba(229,172,142,0));  transform:rotateZ(-50deg);  content:'';  opacity:0}
.link-logo-header:hover::after{ opacity:1;  animation:blick_move 2s forwards}
@keyframes blick_move{ 100%{left:500px; opacity:0}}
.slogan{ width:200px;  display:inline-block;  padding-left:10px}
.bg-slogan-main{ padding:20px 0;  text-align:center;  font:900 20px 'Montserrat';  text-transform:uppercase;  background:var(--color-yellow,#F7931D );  color:#FFF;  text-shadow:0px 4px 4px rgba(0,0,0,0.25)}
.burger-menu{ position:relative;  display:none;  width:100%;  height:30px;  text-transform:uppercase;  font:14px 'Montserrat';  color:#000}
.burger-menu div{ display:inline-block}
.icon-burger{ margin-bottom:15px}
.burger-menu span{ margin:0 auto;  position:relative;  top:12px}
.burger-menu span:before, .burger-menu span:after{ position:absolute;  content:''}
.burger-menu span, .burger-menu span:before, .burger-menu span:after{ width:34px;  height:4px;  background-color:#fff;  display:block}
.burger-menu span:before{ margin-top:-8px}
.burger-menu span:after{ margin-top:8px}
.burger-menu span{ transition-duration:0s;  transition-delay:0.2s}
.burger-menu.open span{ background-color:rgba(0,0,0,0.0);  transition-delay:0.2s}
.burger-menu span:before{ transition-property:margin,transform;  transition-duration:0.2s;  transition-delay:0.2s,0s}
.burger-menu.open span:before{ margin-top:0;  transform:rotate(45deg);  transition-delay:0s,0.2s}
.burger-menu span:after{ transition-property:margin,transform;  transition-duration:0.2s;  transition-delay:0.2s,0s}
.burger-menu.open span:after{ margin-top:0;  transform:rotate(-45deg);  transition-delay:0s,0.2s}
.title-center{ font:bold 30px 'Montserrat';  color:#333;  text-transform:uppercase}
.border-container{ border-bottom:1px solid #fff}
.footer{ background:#333}
.footer .middle-block{ padding:22px 0}
.footer .block-phone a, .footer .block-email a{ color:#fff}
.block-phone li:hover a, .block-email:hover a{ color:var(--color-yellow,#F7931D )}
.footer .slogan{ font-size:14px;  color:var(--color-yellow,#F7931D )}
.footer .block-phone li{ padding-bottom:14px}
.copyright-footer{ padding:14px 0;  justify-content:space-between;  align-items:center}
.copyright{ font-size:12px;  color:#fff}
.dvacom a{ color:#fff;  font-size:10px}
.dvacom:hover a{ color:var(--color-yellow,#F7931D )}
.dvacom:hover span{ letter-spacing:1.5px}
.parent-mini-tech{ display:flex;  flex-wrap:wrap;  justify-content:center}
.mini-block-tehnology{margin-bottom:35px}
.name-tech{ left:0;  right:0;  padding:25px 0;  bottom:0;  text-align:center;  background:rgba(130,130,130,0.8)}
.link-tech{ display:block;  width:100%;  height:100%;  font:600 16px 'Montserrat';  text-transform:uppercase;  color:#fff;  overflow:hidden}
.link-tech img{width:100%; height:auto}
.link-tech:hover{ outline:3px solid var(--color-yellow,#F7931D )}
.link-tech:hover .name-tech{ background:var(--color-yellow,#F7931D )}
.link-tech:hover img{ transform:scale(1.05)}
.mini-post-news{ margin-bottom:30px}
.block-news .title-center{ padding-bottom:35px}
.block-news .p-0{ padding:0}
.breadcrumb a, .breadcrumb li{    font:600 12px 'Montserrat'; color:#333}
.breadcrumb a:hover, .breadcrumb li.active{  color:var(--color-yellow,#F7931D )}
.breadcrumb >li+li:before{    content:""; display:inline-block; width:3px; height:10px; margin:0 10px; vertical-align:middle; background:url(../images/sprite.png) no-repeat;  background-position:-17px 0}
.container-post a{ font-weight:bold;  color:var(--color-yellow,#F7931D )}
.table-img{ flex-wrap:wrap;  justify-content:center}
.table-img img{ max-width:300px;  width:100%;  height:auto;  margin:10px}
ul ol{ padding:6px}
.m-20{margin: 20px 0}
.p-lg-0{padding: 0}
.container-post{padding: 15px}
.container-post img {padding: 10px 0; width: 100%; max-width: 500px; height: auto}

.radius-btnCallMe{position:fixed; bottom:20px; display:flex;  align-items:center;  justify-content:center;  width:120px; height:120px; cursor:pointer; z-index:3}
.radius-btnCallMe::after{content:""; position:absolute; top:0; left:0; right:0; width:120px; height:120px; display:block; border-radius:50%; box-shadow:0px 0px 23px 0px rgba(0,0,0,0.75); animation:pulsbtn 4s linear infinite; z-index:-1}
.btn-CallMe{position:relative; width:70px; height:70px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:#F7931D}
.btn-CallMe .info-phone{position:relative; display:block; animation:movePhone 3s linear infinite;  z-index:3}
.block-phone{position:relative}
@keyframes pulsbtn{0%{transform:scale(0); box-shadow:0px 0px 23px 0px rgba(0,0,0,0.75)}
100%{transform:scale(1.5); box-shadow:0px 0px 23px 0px rgba(0,0,0,0)}
}
@keyframes movePhone{0%{transform:rotate(10deg)}
25%{transform:rotate(-25deg)}
50%{transform:rotate(10deg)}
75%{transform:rotate(25deg)}
100%{transform:rotate(10deg)}
}
.klick-phone{display:none; top:50%;  transform:translateY(-50%);  position:absolute;  left:54px;  background:#F7931D;  padding:10px 20px 10px 10px;  border-radius:0 45px 45px 0}
.klick-phone ul{list-style:none}
.klick-phone a{color:#fff}
