@font-face{font-family:"roboto";src:url("fonts/roboto-regular.ttf")format("TrueType");font-weight:400;font-display:swap}
@font-face{font-family:"roboto";src:url("fonts/roboto-bold.ttf")format("TrueType");font-weight:700;font-display:swap}
@font-face{font-family:"roboto";src:url("fonts/roboto-bolditalic.ttf")format("TrueType");font-weight:400;font-display:swap;font-style:italic;}
@font-face{font-family:"utm-hanzel";src:url("fonts/utm-hanzel.ttf")format("TrueType");font-weight:400;font-display:swap}

:root{
	--burger: #000;
	--blue-dark: #2E358C;
	--blue-light: #0079B9;
	--green-ruby: #00B0B1;
	--red: #E52629;
	--red-light: #EB5B6C;
	--yellow-dark: #FF0;
}
html, body { font-family: roboto, sans-serif; font-size:16px; }
h1, h2, h3, h4, h5, h6 { font-family:"utm-hanzel"; line-height:1.3em; font-weight:normal; }
a { color:inherit; }
.boundary { width: 96%; max-width: 1200px; }
.breadcrumb { line-height: 1.5em!important; }
.breadcrumb li { display:inline; }

.read-more { display:inline-block; color:#FFF; padding:3px 15px; height:30px; box-sizing:border-box; position:relative; margin-left:6px; }
.read-more:before, .read-more:after { content:""; width:3px; height:100%; display:inline-block; background-color:var(--blue-light); position:absolute; top:0; right:calc(100% + 2px); transition:all .5s; }
.read-more:after { right:unset; left:0; width:100%; height:0; background:unset; border-bottom:31px solid var(--blue-light); border-right:10px solid transparent; z-index:-1; }
.read-more:hover:before { background-color:var(--green-ruby); }
.read-more:hover:after { border-bottom-color:var(--green-ruby); }

.container .container-title { font-family:"utm-hanzel"; font-size:1.4em; line-height:1.2em; color:var(--blue-dark); background:url(../images/main-title-bg.jpg) top left repeat-x; background-size:auto 100%; position:relative; display:inline-block; box-sizing:border-box; margin:10px 0; width:100%; }
.container .container-title.short { width:auto; font-size:1.5em; }
.container .container-title:before, .container .container-title:after { content:""; display:inline-block; vertical-align:top; width:62px; height:62px; background:url(../images/main-title-before.jpg) top left no-repeat; background-size:100%; }
.container .container-title > span { display:inline-block; width:calc(100% - 58px); height:62px; vertical-align:top; margin-left:-10px; }
.container .container-title.short > span { padding:25px 40px 0 0; box-sizing:border-box; margin-left:-25px; width:calc(100% - 43px); }
.container .container-title > span span {display:block;}
.container .container-title:after { width:6px; background:#FFF url(../images/main-title-after.jpg) top left no-repeat; background-size:auto 100%; }

.top-menu { position:relative; width:100%; height:60px; line-height:60px; background-color:#FFF; box-shadow: 0 0.5px 3px #666; text-align:center; }
.top-menu .boundary { text-align:center; }
.top-menu .top-menu-logo { display:inline-block; vertical-align:top; height:50px; width:50px; line-height:60px; text-align:center; margin-left:-5px; float:left; }
.top-menu .top-menu-logo img { display:inline-block; vertical-align:middle; width:100%; height:auto; }
.top-menu .top-menu-title { display:inline-block; font-family:"utm-hanzel"; font-size:0.85em; color:#000; line-height:1.5em; text-align:center; margin-top:15px; margin-left:-10px; }
.top-menu .top-menu-title span { display:block; }
.top-menu .hamburger { margin:20px 0 0; float:right; }

.top-menu .top-menu-wrapper { position:fixed; top:0; left:110%; width:100%; height:100%; background-color:var(--green-ruby); color:#FFF; z-index:9998; transition:all 0.3s;  }
.top-menu .top-menu-wrapper .top-menu-title { display:none; }
.top-menu .top-menu-wrapper ul { list-style-type:none; font-size:1.4em; opacity:0; transition:all 1.5s; padding:0; margin-top:0; opacity:1; }
.top-menu .top-menu-wrapper ul li { line-height:50px; }
.top-menu .top-menu-wrapper ul li a i { display:none; vertical-align:middle; margin-top:-5px; font-size:0.7em; margin-left:5px; }
.top-menu .top-menu-wrapper ul li.active a.top-menu-item, .top-menu .top-menu-wrapper ul li:hover a.top-menu-item { color:var(--green-ruby); position:relative; display:inline-block; line-height:1.3em; }
.top-menu .top-menu-wrapper ul li a.top-menu-item:before, .top-menu .top-menu-wrapper ul li a.top-menu-item:before { content:""; display:none; width:120%; height:0; position:absolute; top:-7px; left:calc(-10% - 25px); border-bottom: 40px solid #FFF; border-left: 25px solid transparent; border-right: 25px solid transparent; z-index:-1; }
.top-menu .top-menu-wrapper ul li.active a.top-menu-item:before, .top-menu .top-menu-wrapper ul li:hover a.top-menu-item:before { display:block; }

.top-menu .top-menu-wrapper ul li:first-child { padding:10px 0; background-color:#FFF; font-family:"utm-hanzel"; }
.top-menu .top-menu-wrapper ul li:nth-child(2) { padding-top:20px; }
.top-menu .top-menu-wrapper.active { left:0; }
.top-menu .top-menu-wrapper .mobile-menu-logo { font-size:0.8em; line-height:1.5em; color:var(--blue-dark); }
.top-menu .top-menu-wrapper .mobile-menu-logo span { display:block; }
.top-menu .top-menu-wrapper .mobile-menu-logo .top-menu-logo { float:unset; width:70px; height:70px; margin-bottom:10px; }
.top-menu .top-menu-wrapper .mobile-menu-logo .top-menu-logo img { height:100%; width:auto; }

.top-menu .top-menu-wrapper .icon-x { position:absolute!important; top:10px; right:10px; font-size:2em; color:#000; }

.top-menu .top-menu-wrapper ul li ul { display:none; }

.banner { position:relative; }
.banner:before { content:""; display:block; }
.banner:before, .banner .owl-carousel .square-image:before { padding-top:46%; }
.banner .owl-carousel {position:absolute; top:0; left:0; width:100%; }
.banner .owl-carousel button { position:absolute; top:50%; left:5px; transform:translateY(-50%); color:#FFF!important; text-shadow:0 0 5px #000; }
.banner .owl-carousel button.owl-next {left:unset; right:5px;}
.banner .owl-carousel button i { font-size:1.5em; }

.introduction .square-image:before, .services .square-image:before { padding-top:52.333%; }

.introduction { margin:20px 0 40px; }
.introduction .col { text-align:left; line-height:1.5em; }
.introduction .col.min-hide { display:none!important; }
.introduction .introduction-content .square-image { display:none; }
.introduction .introduction-content .read-more { margin-bottom:20px; }

.services { }
.services .service-item { text-align:center; margin-bottom:20px; }
.services .service-item-title { font-size:1.1em; font-weight:bold; text-transform:uppercase; margin-top:10px; display:block; white-space:nowrap; }
.services .service-item:hover .service-item-title { color:var(--blue-light); }

.short-introduction { background-color:var(--green-ruby); color:#FFF; margin:40px 0; }
.short-introduction .boundary { text-align:center; padding:30px 0; line-height:1.5em; }
.short-introduction hr { display:inline-block; margin:10px auto; width:80%; height:1px; background-color:#FFF; border:0; }

.gallery { margin-top:40px; }
.gallery .container-description { margin:10px 0; }
.gallery .gallery-content { }
.gallery .gallery-content .gallery-item { display:inline-block; width:49.5%; margin:0 1% 5px 0; }
.gallery .gallery-content .gallery-item:nth-child(2n+0) { margin-right:0; }
.gallery .gallery-content .gallery-item .square-image:before { padding-top:75%; }

.products { margin-top:40px; padding:30px 0; }
.products .container-title { margin-bottom:20px; }
.products .products-item { margin-bottom:20px; padding-bottom:10px; box-shadow:0 0 3px #666; }
.products .products-item .square-image:before { padding-top:52.333%; }
.products .products-item .products-item-title { text-align:center; font-size:1.1em; font-weight:bold; padding:10px 10px 15px;; background-color:#FFF; }
.products .products-item .products-item-title a { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.products .products-item:hover .products-item-title { color:var(--blue-light); }
.products .products-item .products-item-description { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; padding: 0 10px; }
.products .products-item .button { margin-top:10px; background-color:var(--blue-light); border-color:var(--blue-light); }
.products .products-item .button:hover { background-color:var(--green-ruby); border-color:var(--green-ruby); }

.products .products-item .square-image img { z-index:2; }
.products .products-item .square-image:after { position: absolute; top: 0; left: -75%; z-index: 10; display: block; content: ''; width: 50%; height: 100%; background: -webkit-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%); background: linear-gradient(to right,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%); -webkit-transform: skewX(-25deg); transform: skewX(-25deg); transition:all 0.5s; }
.products .products-item:hover .square-image:after { left:120%; }

.projects { box-shadow: 0 0 10px #000; margin:40px 0; padding:40px 0; }
.projects .table .col { text-align:left; }
.projects .projects-slider { position:relative; }
.projects .projects-slider:before { content:""; display:block; width:100%; padding-top:calc(52.333% + 50px); }
.projects .projects-slider .owl-carousel { position:absolute; top:0; left:0; width:100%; }
.projects .projects-slider .owl-carousel button { position:absolute; top:calc(50% - 20px); left:5px; background-color:var(--blue-light)!important; color:#FFF!important; line-height:35px!important; height:35px; width:27px; font-size:1.2em!important; transform:translateY(-50%); }
.projects .projects-slider .owl-carousel button:hover { background-color:var(--green-ruby)!important; }
.projects .projects-slider .owl-carousel .owl-next { left:unset; right:5px; }
.projects .projects-slider .projects-item { text-align:center; }
.projects .projects-slider .projects-item .projects-item-title { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.projects .projects-slider .projects-item:hover .projects-item-title { color:var(--green-ruby); }
.projects .projects-slider .square-image { margin-bottom:10px; }
.projects .projects-slider .square-image:before { padding-top:52.333%; }

.projects form { margin-top:30px; box-shadow:0 0 3px #333; }
.projects form .form-title { background-color:var(--blue-light); color:#FFF; font-family:"utm-hanzel"; font-size:1.2em; }
.projects form .form-title, .projects form .form-content { padding:10px 15px; box-sizing:border-box; }
.projects form .read-more { padding:5px 10px; }

.news { margin:20px 0 40px; }
.news .news-item { display:block; margin-bottom:20px; }
.news .news-item .square-image:before { padding-top:52.333%; }
.news .news-item .news-item-title { font-weight:bold; font-size:1.1em; margin:10px 0; text-align:center; }
.news .news-item .news-item-description { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; }

.footer { width:100%; color:#FFF; padding:30px 0 0; position:relative; }
.footer:after { content:""; display:block; width:100%; height:100%; position:absolute; top:0; left:0; background:url(../images/footer-bg.jpg) center center no-repeat; background-size:auto 100%; z-index:-1; }
.footer .boundary { text-align:center; }
.footer h1 { font-size:1.3em; margin-bottom:20px; }
.footer h1 span { display:block; }
.footer ul { list-style-type:none; width:96%; margin:10px auto; padding:0; text-align:left; }
.footer ul li { margin-bottom: 10px; }
.footer .footer-contact ul li span { display:inline-block; vertical-align:middle; }
.footer h2 { width:96%; margin:40px auto 0; text-align:left; font-size:1.1em; }
.footer .footer-contact h2 { margin-top:30px; }
.footer a:hover { color:var(--yellow-dark); }
.footer .footer-gov { text-align:left; }
.footer .footer-menu iframe { margin-top:30px; width:100%; height:500px; }
.footer .footer-menu h2, .footer .footer-menu ul {display:none; }

.footer-copyright { border-top:1px solid #FFF; font-size:0.8em; color:#FFF; padding:7px 0; margin-top:40px; }
.footer-copyright span { display:block; margin-top:5px; }

@media (min-width:576px){
	.container .container-title { width:auto; font-size:1.5em; }
	.container .container-title > span { padding-top:25px; box-sizing:border-box; margin-left:-25px; width:calc(100% - 43px); padding-right:40px; }
	.container .container-title > span span { display:inline-block; }
	
	.top-menu .top-menu-title span { display:inline-block; }
	.top-menu .top-menu-title span:before { content:"\00a0"; }
	.top-menu .top-menu-wrapper .mobile-menu-logo .top-menu-logo { width:60px; height:60px; }
	.top-menu .top-menu-wrapper ul li:first-child { padding:5px 0; }
	.top-menu .top-menu-wrapper .mobile-menu-logo div { display:inline-block; width:auto; margin-top:10px; margin-left:10px; }
	.top-menu .top-menu-wrapper ul li { font-size: 1rem; line-height:40px; }
	.top-menu .top-menu-wrapper ul li:nth-child(2) { padding-top:10px; }
	.top-menu .top-menu-wrapper ul li a.top-menu-item:before, .top-menu .top-menu-wrapper ul li a.top-menu-item:before { border-bottom-width:35px; }
	
	.gallery .gallery-content .gallery-item { width:32.666%; margin-bottom:7px; }
	.gallery .gallery-content .gallery-item:nth-child(2n+0) { margin-right:1%; }
	.gallery .gallery-content .gallery-item:nth-child(3n+0) { margin-right:0; }
	
	.products .products-item { vertical-align:top; display:inline-block; width:49%; margin:0 2% 15px 0; }
	.products .products-item:nth-child(2n+0) { margin-right:0; }
}

@media (min-width: 768px){
	.container .container-title, .container .container-title.short { font-size:1.7em; }
	.container .container-title > span, .container .container-title.short > span { padding-top:20px; }
	
	.top-menu { z-index:100; height:70px; }
	.top-menu .boundary { width:100%; text-align:left; }
	.top-menu .top-menu-logo { margin:5px 0 0 5px; width:60px; height:60px; }
	.top-menu .top-menu-title, .top-menu .hamburger { display:none; }
	.top-menu .top-menu-wrapper { background-color:unset; top:unset; left:unset; position:relative; width:auto; height:auto; display:inline-block; float:unset; margin-left:20px;  }
	.top-menu .top-menu-wrapper .top-menu-title { display:block; text-align:left; margin-top:5px; margin-left:10px; font-size:1.1em; }
	.top-menu .top-menu-wrapper .mobile-menu-logo { display:none; }
	.top-menu .top-menu-wrapper ul { padding:0; margin:0; color:#333; opacity:1; font-size:1.2em; transition:unset; line-height:30px; }
	.top-menu .top-menu-wrapper ul li { display:inline-block; font-size:0.85rem; padding:0 5px; }
	.top-menu .top-menu-wrapper ul li:nth-child(2) { padding-top:0; }
	.top-menu .top-menu-wrapper ul li a { padding:0 5px; position:relative; }
	.top-menu .top-menu-wrapper ul li a.top-menu-item:before { border-bottom:30px solid var(--blue-dark); border-left: 8px solid transparent; border-right: 8px solid transparent; width:100%; left:-8px; }
	.top-menu .top-menu-wrapper ul li.active a.top-menu-item { color:#FFF; }
	.top-menu .top-menu-wrapper ul li:hover a.top-menu-item { color:var(--blue-dark); }
	.top-menu .top-menu-wrapper ul li:hover a.top-menu-item:before { display:none; }
	
	.banner:before, .banner .owl-carousel .square-image:before { padding-top:32.89%; }
	.banner .owl-carousel button i { font-size:2.5em; }

	.introduction .introduction-content .square-image { display:inline-block; float:right; width:45%; margin:20px 0 20px 10px; }
	.introduction .introduction-image { display:none; }
	
	.services .service-item { display:inline-block; vertical-align:top; width:48%; margin-right:2%; }
	.services .service-item:nth-child(2n+0) { margin-right:0; }
	
	.short-introduction hr { width:70%; margin:0 0 -10px; }

	.projects form { width:96%; margin-left:4%; margin-top:5em; }
	
	.news .news-item { display:inline-block; vertical-align:top; width:23.5%; margin-right:2%; }
	.news .news-item:nth-child(4n+0) { margin-right:0; }
	.news .news-item .news-item-title a { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
	
	.footer .footer-logo { display:inline-block; width:70px; height:auto; }
	.footer .footer-logo img { width:100%; height:auto; }
	.footer h1 { display:inline-block; width:calc(100% - 80px); text-align:left; margin-left:10px; }
	.footer h2 { margin-top:10px; }
	
	.footer .footer-menu iframe { margin-top:10px; }
	
	.footer-copyright span { display:inline-block; }
	.footer-copyright span:before { content:" -\00a0"; }
}

@media (min-width: 996px){
	.top-menu .top-menu-logo { margin-left:30px; }
	.top-menu .top-menu-wrapper { margin-left:40px; }
	.top-menu .top-menu-wrapper ul li { font-size:0.9rem; }
	.top-menu .top-menu-wrapper ul li.active a.top-menu-item:before, .top-menu .top-menu-wrapper ul li:hover a.top-menu-item:before { top:-5px; }
	
	.banner { margin-top:0; }
	
	.introduction { margin:60px 0; }
	.introduction .introduction-content .square-image { display:none; }
	.introduction .introduction-content .container-title { width:100%; }
	.introduction .introduction-content .container-title > span { padding-right:0; }
	.introduction .introduction-content .introduction-content-description { padding-right:20px; }
	.introduction .introduction-image { padding-top:5em; }
	
	.projects form .form-title, .projects form .form-content { padding:15px 20px; }
	.projects form .form-title { font-size:1.5em; }
	
	.products .products-item { width:23.5%; }
	.products .products-item:nth-child(2n+0) { margin-right:2%; }
	.products .products-item:nth-child(4n+0) { margin-right:0; }
	
	.footer h2 { margin-bottom:20px; }
	.footer .footer-logo { width:100px; }
	.footer h1 { width:calc(100% - 110px); font-size:1.6em; margin-bottom:0; vertical-align:bottom; }
	.footer .footer-contact ul { margin:30px 0; }
	.footer .footer-menu { padding-top:20px; }
}

@media (min-width: 1200px){
	.container .container-title { font-size:1.7em; }
	.container .container-title.short { font-size:1.9em; }
	.container .container-title, .container .container-title > span, .container .container-title:before, .container .container-title:after { height:82px; }
	.container .container-title:before { width:82px; }
	.container .container-title > span { width:calc(100% - 53px); padding-top:35px; margin-left:-35px; }
	.container .container-title.short > span { padding-top:35px; margin-left:-35px; width: calc(100% - 53px);  }
	
	.top-menu { height:100px; }
	.top-menu .top-menu-logo { width:90px; height:90px; }
	
	.top-menu .top-menu-wrapper .top-menu-title { font-size:1.7em; margin-top:13px; margin-left:15px; }
	.top-menu .top-menu-wrapper ul { margin-left:-5px; }
	.top-menu .top-menu-wrapper ul li { font-size:1.1rem; padding:0 10px; position:relative; }
	.top-menu .top-menu-wrapper ul li a { padding:0 10px; }
	.top-menu .top-menu-wrapper ul li a i { display:inline-block; }
	.top-menu .top-menu-wrapper ul li a.top-menu-item:before { content:""; display:inline-block; border-bottom:30px solid var(--blue-dark); transform:scaleY(0); transition:all 0.1s; }
	.top-menu .top-menu-wrapper ul li:hover a.top-menu-item { color:#FFF; }
	.top-menu .top-menu-wrapper ul li.active a.top-menu-item:before { transform:scaleY(1); }
	.top-menu .top-menu-wrapper ul li:hover a.top-menu-item:before { content:""; display:inline-block; transform:scaleY(1); transform-origin:100% 100%; }
	
	.top-menu .top-menu-wrapper ul li ul { display:none; position:absolute; top:100%; left:10px; background-color:#FFF; border:1px solid #DDD; padding:5px 0; box-shadow: 0 2px 3px #333; opacity:0; animation:opacity-animation 0.5s; }
	.top-menu .top-menu-wrapper ul li:hover ul { display:inline-block; opacity:1; transform:translateX(calc(-12.5% - 14px)); }
	@keyframes opacity-animation {
		0% { display:inline-block; opacity:0; transform:translateX(0); }
		100% { opacity:1; transform:translateX(calc(-12.5% - 14px)); }
	}
	.top-menu .top-menu-wrapper ul li ul li { display:block; white-space:nowrap; }
	.top-menu .top-menu-wrapper ul li ul li:first-child { font-family:"roboto"; padding:0; padding:0 10px; }
	.top-menu .top-menu-wrapper ul li ul li a { padding:0; position:relative; }
	.top-menu .top-menu-wrapper ul li ul li a:before { content:""; position:absolute; top:100%; left:0; display:inline-block; height:3px; width:0; background-color:var(--blue-dark); transition:all 0.3s;  }
	.top-menu .top-menu-wrapper ul li ul li:hover a:before { width:100%; }
	.top-menu .top-menu-wrapper ul li ul li:hover a { color:var(--blue-dark); }
	
	.introduction .introduction-image { padding-top:7em; }
	.introduction .introduction-content { font-size:1.1em; }
	.introduction .introduction-content .introduction-content-description { padding-right:50px; }
	
	.services .service-item-title { font-size:1.2em; }
	
	.projects form { margin-top:6.2em; }
	
	.footer { padding:60px 0 0; }
	.footer .footer-logo { margin-top:10px; width:110px; }
	.footer .footer-contact { display:inline-block; vertical-align:top; text-align:left; }
	.footer h1 { font-size:1.8em; width:calc(100% - 120px); }
	.footer ul { margin-left:0; font-size:1.1em; }
	
	.footer .footer-contact h2, .footer .footer-contact ul.fm { display:none; }
	
	.footer .footer-menu { padding-top:20px; }
	.footer .footer-menu h2 { display:block; }
	.footer .footer-menu ul, .footer .footer-menu iframe { display:inline-block; vertical-align:top; width:calc(100% - 300px); }
	.footer .footer-menu iframe { width:300px; }
	.footer h2 { font-size:1.3em; }
}