.tpl-component-articles .navbar { position: sticky; top: 0; z-index: 1000; background-color: #fff; padding: 10px; border-bottom: 1px solid #ccc; }
.tpl-component-articles .navbar-brand { font-size: 20px; }
.tpl-component-articles .navbar a:hover, .tpl-component-articles ol.navbar-nav.soderzh a:hover { text-decoration: underline; }
.tpl-component-articles ol.navbar-nav, .tpl-component-articles ul.navbar-nav { padding: 10px 15px; margin: 20px 0; font-size: 16px; }
.tpl-component-articles ol.navbar-nav.soderzh { background: #eeeeee; border-radius: 10%; padding: 20px 0 15px 30px; }
.tpl-component-articles ol.navbar-nav.soderzh a { color: #4d4d4d; text-decoration: none; border: none; }
.tpl-component-articles ol.navbar-nav li { margin-bottom: 15px; }
.tpl-component-articles li.nav-item { margin: 10px 0; padding: 0; font-size: 16px; }
.tpl-component-articles li.nav-item a { color: #2f2f2d; border: none; text-decoration: none; }
.tpl-component-articles ul.cities { column-count: 2; list-style-type: circle; color: #f7f7f7; font-size: 16px; }
.tpl-component-articles ul.cities a { color: #e8e8e8; }
.tpl-component-articles ul.cities span { color: #2cd181; font-size: 16px; }
.tpl-component-articles .margin20 { margin: 5px 20px 0 0; }
.tpl-component-articles .container.s-content img { width: 100%; }
.tpl-component-articles .portfolio__item-line { margin: -2px 0; font-size: 12px; }
.tpl-component-articles .portfolio__item-line.constructname { color: #35d788; margin-bottom: 10px; font-size: 16px; }
.tpl-component-articles .portfolio__item-line.citycname { font-size: 14px; margin-bottom: 6px; }
@media (min-width: 992px) { 
.tpl-component-articles .navbar-container { position: sticky; top: 0; overflow-y: auto; height: 100vh; }
.tpl-component-articles .navbar-container .navbar { align-items: flex-start; justify-content: flex-start; flex-wrap: nowrap; flex-direction: column; height: 100%; }
.tpl-component-articles .navbar-container .navbar-collapse { align-items: flex-start; }
.tpl-component-articles .navbar-container .nav, .tpl-component-articles .navbar-container .navbar-nav { flex-direction: column !important; flex-wrap: nowrap; }
 }
.tpl-component-articles .article h1 { font-size: 32px; }
.tpl-component-articles .article h2 { font-size: 27px; }
.tpl-component-articles .article h3 { font-size: 24px; }
.tpl-component-articles .article h4 { font-size: 22px; }
.tpl-component-articles .article h5 { font-size: 20px; }
.tpl-component-articles .article h2, .tpl-component-articles .article h3, .tpl-component-articles .article h4, .tpl-component-articles .article h5 { font-family: roboto light; text-transform: none; font-weight: 700; line-height: 30px; padding-bottom: 30px; margin-top: 25px; color: black; text-align: start; }
.tpl-component-articles .article__content p { font-size: 20px; line-height: 1.7; padding-bottom: 30px; font-family: roboto light; }
.tpl-component-articles .article ol, .tpl-component-articles .article ul { font-family: roboto light; font-size: 16px; }
.tpl-component-articles .article_gallery { margin: 10px 0; }
.tpl-component-video .noscroll { overflow: hidden; }
.tpl-component-video main { font-size: 0; }
.tpl-component-video main .column.left, .tpl-component-video main .column.right { background: #fcfcfc; display: block; position: relative; font-size: small; width: 100%; min-height: 0; vertical-align: top; }
@media (min-width: 900px) { 
.tpl-component-video main .column.left, .tpl-component-video main .column.right { display: inline-block; width: 100%; max-width: 500px; min-height: 20vh; }
.tpl-component-video main .column.right { margin-left: 50%; }
 }
.tpl-component-video .video-banner { display: block; position: relative; margin: 10px; }
@media (min-width: 641px) { 
.tpl-component-video .video-banner { position: relative; margin: 15px 15px 6px 15px; }
 }
.tpl-component-video .video-banner .video-banner-img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
.tpl-component-video .video-banner-headline { position: absolute; left: 1.5rem; bottom: 1.5rem; font-family: 'Source Sans Pro', sans-serif; font-size: 1.25em; font-weight: 900; line-height: 1.0em; color: #fff; text-transform: uppercase; letter-spacing: 0.045em; }
@media (min-width: 641px) { 
.tpl-component-video .video-banner-headline { left: 1em; bottom: 0.75em; font-size: 1em; line-height: 1.5em; }
 }
.tpl-component-video .video-banner-icon-play { position: absolute; left: 50%; top: 50%; display: block; width: 2.5em; height: 2.5em; -webkit-transform: translateX(-50%) translateY(-50%) scale(1.0); -moz-transform: translateX(-50%) translateY(-50%) scale(1.0); -ms-transform: translateX(-50%) translateY(-50%) scale(1.0); -o-transform: translateX(-50%) translateY(-50%) scale(1.0); transform: translateX(-50%) translateY(-50%) scale(1.0); -webkit-transition: all 0.2s ease-out 0.05s; transition: all 0.2s ease-out 0.05s; }
@media (min-width: 641px) { 
.tpl-component-video .video-banner-icon-play { width: 4.5em; height: 4.5em; opacity: 0.6; }
 }
.tpl-component-video .video-banner-icon-play:hover { -webkit-transform: translateX(-50%) translateY(-50%) scale(1.2); -moz-transform: translateX(-50%) translateY(-50%) scale(1.2); -ms-transform: translateX(-50%) translateY(-50%) scale(1.2); -o-transform: translateX(-50%) translateY(-50%) scale(1.2); transform: translateX(-50%) translateY(-50%) scale(1.2); backgound: #330099; }
.tpl-component-video .content .video-thumb-grid { position: relative; font-size: 0; width: calc(100% + 2rem); margin: 0 -1rem; }
.tpl-component-video .content .video-thumb { display: inline-block; vertical-align: top; text-decoration: none; width: calc((100% - 4rem) / 2); height: 0; padding-top: calc(((100% - 4rem) / 2) * 0.5625); margin: 1rem 1rem; overflow: hidden; position: relative; font-size: 1rem; -webkit-transform: scale(1.0); transform: scale(1.0); box-shadow: 0 0 0 rgba(0,0,0,0.0); -webkit-transition: all 0.2s ease-out 0.05s; transition: all 0.2s ease-out 0.05s; }
.tpl-component-video .content .video-thumb:hover { -webkit-transform: scale(1.05); transform: scale(1.05); box-shadow: 0 2px 4px rgba(13,1,61,0.35); }
.tpl-component-video .content .video-thumb img { display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; right: 0; bottom: 0; object-fit: cover; object-position: 50% 50%; background: #2b2b2b; }
.tpl-component-video .video-modal, .tpl-component-video .video-modal .overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 3000; }
.tpl-component-video .video-modal { overflow: hidden; position: fixed; opacity: 0.0; -webkit-transform: translate(500%,0%); transform: translate(500%,0%); -webkit-transition: -webkit-transform 0s linear 0s; transition: transform 0s linear 0s; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -moz-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; }
.tpl-component-video .video-modal .overlay { z-index: 0; background: rgba(13,1,61,0.82); opacity: 0.0; -webkit-transition: opacity 0.2s ease-out 0.05s; transition: opacity 0.2s ease-out 0.05s; }
.tpl-component-video .video-modal-content { position: relative; top: auto; right: auto; bottom: auto; left: auto; z-index: 1; margin: 0 auto; overflow-y: visible; background: #000; width: calc(100% - 12em); height: 0; padding-top: calc((100% - 12em) * 0.5625); }
@media (min-aspect-ratio: 16/9) { 
.tpl-component-video .video-modal-content { width: 0; height: calc(100vh - 10em); padding-top: 0; padding-left: calc((100vh - 10em) * 1.7778); }
 }
@media (max-width: 640px) { 
.tpl-component-video .video-modal-content { width: calc(100% - 1em); padding-top: calc((100% - 1em) * 0.5625); }
 }
.tpl-component-video .close-video-modal { display: block; position: absolute; left: 0; top: -40px; text-decoration: none; font-size: 20px; font-weight: bold; color: #fff; }
.tpl-component-video iframe#youtube { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; background: #000; box-shadow: 0px 2px 16px rgba(0,0,0,0.5); }
.tpl-component-video .show-video-modal .video-modal { opacity: 1.0; transform: translate(0%,0%); -webkit-transform: translate(0%,0%); }
.tpl-component-video .show-video-modal .video-modal .overlay { opacity: 1.0; }
.tpl-component-video .show-video-modal .video-modal-content { transform: translate(0%,0%); -webkit-transform: translate(0%,0%); }
.tpl-component-video .gotoproduct { margin: 0px 15px 25px 15px; text-align: center; }
.tpl-component-video .normal_price.dogovor { font-size: 16px !important; }
