@import 'https://fonts.googleapis.com/css?family=Dancing+Script:400,700|Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i';

/* ========== СБРОС И БАЗОВЫЕ СТИЛИ ========== */
html, body {
    width: 100%;
    max-width: 100%;
    height: 100%;
    cursor: default;
}

body {
    background-color: #fff;
    color: #333;
    font-size: 14px;
    line-height: 1.42857;
    padding: 0;
}

img {
    max-width: 100%;
    height: auto;
}

ul {
    margin: 0px;
    padding: 0px;
}

ul, ol, li {
    list-style: outside none none;
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    font-size: 14px;
}

.fix {
    overflow: hidden;
}

.clear {
    clear: both;
}

/* ========== ТИПОГРАФИКА ========== */
p {
    color: #444444;
    font-family: "Roboto", sans-serif;
    font-size: 15px;
    font-weight: 400;
    line-height: 24px;
    margin: 0 0 10px;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0 0 15px;
    font-family: "Roboto", sans-serif;
    font-size: 26px;
    font-weight: 700;
}

h3 {
    font-size: 18px;
}

a {
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    text-decoration: none;
    color: #222222;
    font-family: 'Roboto', sans-serif;
}

a:hover {
    color: #2A2F35;
    text-decoration: none;
}

a:focus, a:active, a:hover {
    outline: 0 none;
    text-decoration: none;
}

ul > li > a {
    color: #222222;
    font-family: "Roboto", sans-serif;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    -webkit-transition: all 0.2s ease-in-out 0s;
    transition: all 0.2s ease-in-out 0s;
}

/* ========== КОМПОНЕНТЫ ========== */
/* Выравнивание */
.floatleft { float: left; }
.floatright { float: right; }
.alignleft {
    float: left;
    margin-right: 15px;
    margin-bottom: 15px;
}
.alignright {
    float: right;
    margin-left: 15px;
    margin-bottom: 15px;
}
.aligncenter {
    display: block;
    margin: 0 auto 15px;
}

/* Отступы */
.pd0 { padding: 0px; }

/* WOW анимации */
.wow { visibility: hidden; }
.cap-readmore { opacity: 0; }
.cap-readmore.animated {
    opacity: 1;
    visibility: visible;
}

/* Заголовки секций */
.title-section h1 {
    color: #222222;
    font-family: "Roboto", sans-serif;
    font-size: 24px;
    font-weight: 700;
    margin: 0 0 20px;
    padding-bottom: 20px;
    position: relative;
    text-transform: uppercase;
}

.section_title {
    text-align: center;
}
.section_title h2 {
    padding-bottom: 0px;
    margin-bottom: 10px;
    position: relative;
}
.section_title > p {
    font-size: 15px;
    margin: auto;
    margin-top: 29px;
}
.section_title h2 span {
    text-transform: uppercase;
}
.section_title h2 span strong {
    color: #2A2F35;
}

.heading_style {
    display: block;
    border-bottom: 1px solid #2A2F35;
    width: 50px;
    margin: auto;
    margin-bottom: 3px;
    position: relative;
}
.heading_style:before {
    background: #2A2F35 none repeat scroll 0 0;
    content: "";
    height: 1px;
    left: 50%;
    margin: 0 auto;
    position: absolute;
    right: 0;
    top: 5px;
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    width: 80px;
}
.heading_style:after {
    background: #2A2F35 none repeat scroll 0 0;
    content: "";
    height: 1px;
    left: 50%;
    margin: 0 auto;
    position: absolute;
    right: 0;
    top: 10px;
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    width: 50px;
}

/* Разделители */
.short {
    max-width: 50px;
    margin: 3px auto;
    border-width: 1px;
    border-color: #2A2F35;
}
.short-2 {
    max-width: 50px;
    margin: 3px auto;
    border-width: 1px;
    border-color: #2A2F35;
    margin-bottom: 10px;
}
.long {
    max-width: 80px;
    margin: 1px auto;
    border-width: 1px;
    border-color: #2A2F35;
}

/* Кнопки */
button,
a.button,
input[type="submit"],
input[type="button"] {
    padding: 12px 24px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 15px;
    font-weight: 600;
    transition: all 0.3s ease;
    min-width: 120px;
    text-align: center;
    display: inline-block;
    text-decoration: none;
}
a.button { color: inherit; }
button:hover,
a.button:hover,
input[type="submit"]:hover,
input[type="button"]:hover {
    color: white;
    transform: translateY(-2px);
    transition: all 0.3s ease;
}
.btn-black {
    background: #333;
    color: white;
}

.actice-button {
    background: #2A2F35;
    border-color: #2A2F35;
}
.actice-button:hover {
    background: transparent;
    border-color: #fff;
}

.smore {
    color: #797979;
    text-transform: uppercase;
    display: inline-block;
    margin-top: 2px;
    line-height: 30px;
    vertical-align: top;
    font-size: 18px;
    margin-bottom: 8px;
    font-weight: 400;
}
.smore a {
    color: #fff;
    padding: 16px 80px;
    display: block;
    border-radius: 5px;
    -webkit-transition: 1s;
    transition: 1s;
    font-size: 14px;
    margin-right: 10px;
    background: #EE483A;
}
.smore a:hover {
    color: #fff;
    background: #B83847;
    border-color: #B83847;
}

.work-button {
    background-color: transparent;
    border-radius: 5px;
    color: #fff;
    display: inline-block;
    font-weight: 400;
    margin-right: 15px;
    padding: 11px 25px;
    width: 180px;
    font-weight: bold;
    border: 2px solid #fff;
    text-transform: uppercase;
    transition: all .3s ease-in-out;
}
.bg_button { 
    background-color: #1BBC9B;
    border: 2px solid #1BBC9B;
}
.bg_button:hover {
    background-color: transparent;
    border: 2px solid #fff;
}
.work-button:hover {
    background-color: #1BBC9B;
    border-color: #1BBC9B;
    color: #fff;
}

.sbuton {
    background: transparent none repeat scroll 0 0;
    border: 1px solid #ddd;
    color: #666666;
    display: inline-block;
    font-size: 14px;
    font-weight: bold;
    padding: 10px 30px;
    text-transform: uppercase;
    -webkit-transition: all 1s ease 0s;
    transition: all 1s ease 0s;
}
.sbuton:hover {
    background: #2A2F35 none repeat scroll 0 0;
    border-color: #2A2F35;
    color: #fff;
}

/* Формы */
.form-inner { width: 100%; }
.field {
    overflow: hidden;
    padding-bottom: 25px;
    width: 100%;
}
.form-field {
    width: 99%;
    overflow: hidden;
    float: left;
}
.form-field input {
    height: 45px;
    width: 100%;
    border: 1px solid #ddd;
    color: #171313;
    font-size: 16px;
    font-weight: 400;
    padding-left: 10px;
    outline: none;
    -webkit-transition: .5s;
    transition: .5s;
}
.text_area textarea {
    width: 99%;
    border: 1px solid #ccc;
    height: 163px;
    color: #171313;
    font-size: 16px;
    font-weight: 400;
    padding-left: 10px;
    padding-top: 5px;
    outline: none;
    -webkit-transition: .5s;
    transition: .5s;
}
.form-field input:focus,
.text_area textarea:focus {
    color: #2A2F35;
    border: 1px solid #2A2F35;
}
.buttons { margin-top: 7px; }

/* Пагинация */
.paginations {
    text-align: center;
    margin-top: 40px;
}
.paginations a {
    width: 35px;
    height: 35px;
    line-height: 35px;
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
    margin: auto 5px;
    border: 1px solid #ddd;
    color: #888;
}
.paginations a:hover,
.paginations a.current {
    background: #2A2F35;
    border-color: #2A2F35;
    color: #fff;
}

/* Хлебные крошки */
.breadcrumb {
    padding: 75px 15px;
    margin-bottom: 0;
    list-style: none;
    background-color: #f5f5f5;
    border-radius: 4px;
}
.breadcrumbs li {
    display: inline-block;
    margin-right: 5px;
}
.breadcrumbs li,
.breadcrumbs li a {
    color: #fff;
    font-size: 16px;
}

/* Древовидное представление */
.ultra-simple-tree { padding: 20px; }
.tree-path {
    position: relative;
    padding-left: 20px;
}
.tree-path:before {
    content: '';
    position: absolute;
    left: 8px;
    top: 0;
    bottom: 0;
    width: 1px;
    background: #ddd;
}
.path-item {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    position: relative;
}
.path-item:last-child { margin-bottom: 0; }
.path-marker {
    width: 20px;
    height: 20px;
    background: white;
    border: 1px solid #2A2F35;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    color: #2A2F35;
    margin-right: 12px;
    flex-shrink: 0;
    position: relative;
    z-index: 1;
}
.path-text {
    color: #333;
    font-size: 15px;
    padding: 8px 15px;
    background: #f8f9fa;
    border-radius: 6px;
}
.path-item.final .path-marker {
    background: #003e05;
    border-color: #003e05;
    color: white;
}
.path-item.final .path-text {
    background: #ebffed;
    color: #003e05;
    font-weight: 500;
}
.path-item:hover .path-text { background: #e9ecef; }

/* ========== ШАПКА ========== */
.header_top {
    padding: 10px 0;
    background: #f8f8f8;
    transition: all 0.2s ease-in-out;
    overflow: hidden;
}
.header_top p { margin-bottom: 0; }
.header_top p span,
.header_top p a {
    margin-right: 20px;
}
.header_top p span i,
.header_top p a i {
    font-size: 13px;
    color: #2A2F35;
    margin-right: 10px;
}
.header_top p a {
    display: inline-block;
    text-decoration: none;
    transition: all 0.2s ease-in-out;
    color: #666666;
}

.header_top ul.social-icons {
    margin: 0;
    padding: 0;
    text-align: right;
}
.header_top ul.social-icons li {
    display: inline-block;
    margin-left: 9px;
}
.header_top ul.social-icons li a {
    display: inline-block;
    text-decoration: none;
    transition: all 0.2s ease-in-out;
    font-size: 14px;
    color: #666666;
}
.social-icons li a i:hover { color: #2A2F35; }

/* Навигация */
.nav_areas { z-index: 9999999; }
.nav_area {
    background: #fff none repeat scroll 0 0;
    padding: 20px 0;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.menu ul {
    text-align: right;
    margin: 5px 0;
}
.menu ul li { display: inline; }
.menu ul li.active a { color: #2A2F35; }
.menu ul li a {
    display: inline-block;
    padding: 5px 14px 6px;
    font-weight: 500;
    text-transform: uppercase;
    transition: all 0.2s ease-in-out;
    position: relative;
}
.menu ul li:last-child a { padding-right: 0px; }
.menu ul li a:hover { color: #2A2F35; }
.menu ul li a:before {
    background: transparent;
    border-color: transparent transparent #2A2F35 transparent;
    border-style: solid;
    border-width: 6px;
    bottom: -35px;
    content: "";
    left: 50%;
    position: absolute;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    transition: all 0.5s ease-in-out;
    opacity: 0;
}
.menu ul li a:hover:before {
    bottom: -5px;
    content: "";
    opacity: 1;
}
.menu .current > a { color: #2A2F35; }


.postfix { background: #fff; }
.prefix {
    background: #fff none repeat scroll 0 0;
    box-shadow: 0px 1px 5px #ddd;
}

/* Фикс для навигации */
.navbar-collapse { transition: all 0.3s ease; }
.navbar-nav { text-align: center; }
.nav-underline {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 2px;
    background-color: rgba(var(--bs-dark-rgb),var(--bs-bg-opacity))!important;
    transition: width 0.3s ease;
}
.nav-link.active .nav-underline,
.nav-link:hover .nav-underline { width: 80%; }
.navbar { z-index: 1000; position: relative; }

/* Скрываем кнопку на всех устройствах */
.navbar-toggler { display: none !important; }
.navbar-collapse { display: flex !important; }

/* ========== СЛАЙДЕРЫ ========== */
/* Основной слайдер */
.main-slider-area {
    overflow: hidden;
    display: block;
}

.nivo-caption {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    height: 100%;
    opacity: 1;
}

.middle-text {
    position: absolute;
    right: 1%;
    top: 50%;
    transform: translateY(-50%);
    width: 50%;
    max-width: 500px;
    text-align: left;
}
.margin_left { margin-left: 100px; }
.margin_right { margin-right: 100px; }

.cap-title h2 { margin-bottom: 10px; }
.cap-title h2 span {
    display: inline-block;
    font-size: 34px;
    font-weight: 600;
    text-transform: uppercase;
    vertical-align: top;
}
.cap-title h3 { margin-bottom: 8px; }
.cap-title h3 span {
    font-size: 55px;
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    text-transform: uppercase;
    color: #fff;
    z-index: 2;
    text-shadow: 0 0 2px rgba(0, 0, 0, .05);
}
.cap-title h3 span strong { color: #2A2F35; }

.cap-dec { margin-bottom: 21px; }
.cap-dec p {
    color: #fff;
    font-size: 18px;
    font-weight: normal;
    padding-top: 5px;
    padding-bottom: 16px;
}

/* Навигация основного слайдера */
i.nivo-prev-icon,
i.nivo-next-icon {
    font-size: 25px;
    color: #fff;
    border: 1px solid #fff;
    padding: 5px;
    height: 50px;
    width: 50px;
    border-radius: 100%;
    text-align: center;
    line-height: 35px;
    margin-left: 30px;
    margin-right: 30px;
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
    opacity: 0;
}
i.nivo-prev-icon:hover,
i.nivo-next-icon:hover {
    border: 1px solid #e67c8e;
    color: #e67c8e;
}
.slider:hover i.nivo-prev-icon,
.slider:hover i.nivo-next-icon {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

.nivo-controlNav {
    margin-top: -21px;
    position: absolute;
    right: 7%;
    text-align: center;
    top: 50%;
    width: 14px;
}
.nivo-controlNav a {
    background-color: #2A2F35;
    border: 2px solid transparent;
    border-radius: 100%;
    cursor: pointer;
    display: inline-block;
    height: 14px;
    line-height: 10px;
    margin: 0 0 5px;
    position: relative;
    text-indent: -9999px;
    width: 14px;
    z-index: 9;
}
.nivo-controlNav a:hover,
.nivo-controlNav a.active {
    background: transparent none repeat scroll 0 0;
    border-color: #fff;
}
.slider-progress.pos_hover {
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
}

/* ========== СЕКЦИИ ========== */
/* О компании */
.about_area { padding: 95px 0 100px; }
.about_wrap { overflow: hidden; padding: 0px; }
.single_about {
    background: #f9f9f9 none repeat scroll 0 0;
    padding: 30px 10px 17px;
    text-align: center;
    -webkit-transition: .5s;
    transition: .5s;
    height: 320px;
}
.single_about .icon {
    border-radius: 50%;
    color: #2A2F35;
    display: inline-block;
    font-size: 20px;
    height: 100px;
    line-height: 128px;
    margin-bottom: 20px;
    position: relative;
    width: 100px;
    -webkit-transition: .5s;
    transition: .5s;
}
.single_about .icon:before {
    border: 2px solid #2A2F35;
    border-radius: 50%;
    content: "";
    display: block;
    height: 100px;
    left: 0;
    position: absolute;
    top: 0;
    width: 100px;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .5s;
    transition: .5s;
}

/* Навыки */
.progress_area {
    background: #f9f9f9 none repeat scroll 0 0;
    margin: 0;
    padding: 98px 0 85px;
}

.progress_text h3 span { text-transform: uppercase; }
.our_skill h3 {
    margin-bottom: 10px;
    padding: 0 0 10px;
    text-transform: uppercase;
}
.our_skill .skill-wrapper {
    float: left;
    margin: 0 0 22px;
    position: relative;
    width: 100%;
}
.our_skill .skill-wrapper .percent {
    background: #e8e8e8 none repeat scroll 0 0;
    height: 5px;
    margin-bottom: 6px;
    width: 100%;
}
.our_skill .skill-wrapper .percent .percent_color { 
    background: #2A2F35;
    height: 5px;
}
.percent_text {
    margin-bottom: 0;
    color: #666666;
    font-size: 14px;
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    line-height: 18px;
}
.percent_text > span { 
    float: right;
    text-align: right;
}

/* Команда */
.team_area { padding: 94px 0 80px; }
.team_wrap { padding-top: 43px; overflow: hidden; }
.single_team {
    background-color: #ffffff;
    border: 1px solid #dddddd;
    color: #666;
    text-align: center;
    margin-bottom: 20px;
    margin-top: 3px;
}
.team_thumb { position: relative; }
.team_thumb:before {
    position: absolute;
    content: "";
    left: 0px;
    right: 0px;
    bottom: 0px;
    top: 0;
    background: rgba(0, 0, 0, .3);
    z-index: 999;
    opacity: 0;
    transition: all 0.5s ease-in-out;
    z-index: 1;
}
.single_team:hover .team_thumb:before {
    background: rgba(0, 0, 0, .5);
    opacity: 1;
}
.single_team .team_info { padding: 15px 10px 10px; }
.single_team .team_info p { margin: 5px 0 5px; }
.single_team .team_info span.member-name {
    color: #333;
    font-family: "Roboto", sans-serif;
    font-size: 14px;
    text-transform: uppercase;
}
.single_team .team_info span.member-role {
    font-family: "Roboto", sans-serif;
    display: block;
    text-transform: capitalize;
    color: #2A2F35;
}

.team_social_icon {
    left: 0;
    position: absolute;
    right: 0;
    top: 60%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 999;
    opacity: 0;
    -webkit-transition: .5s;
    transition: .5s;
}
.team_social { margin: auto; }
.team_social a { display: inline-block; }
.team_social a i {
    border: 1px solid #fff;
    color: #fff;
    font-size: 14px;
    height: 25px;
    margin: 0 3px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 25px;
    line-height: 23px;
}
.single_team:hover .team_social_icon {
    opacity: 1;
    top: 50%;
}

/* Социальные иконки команды */
.team_social a .fa-facebook:hover { border: 1px solid #3b5998; color: #3b5998; }
.team_social a .fa-twitter:hover { border: 1px solid #00aced; color: #00aced; }
.team_social a .fa-google-plus:hover { border: 1px solid #dd4b39; color: #dd4b39; }
.team_social a .fa-linkedin:hover { border: 1px solid #007bb6; color: #007bb6; }
.team_social a .fa-flickr:hover { border: 1px solid #ff0084; color: #ff0084; }
.team_social a .fa-pinterest:hover { border: 1px solid #C92228; color: #C92228; }

/* Портфолио */
.protfolio_area {
    background: #f9f9f9 none repeat scroll 0 0;
    border-bottom: 1px solid #e1e1e1;
    border-top: 1px solid #e1e1e1;
    padding: 95px 0 100px;
}
.portfolio_nav { padding: 46px 0 50px; }
.portfolio_nav ul { text-align: center; }
.portfolio_nav ul li { display: inline; }
.portfolio_nav ul li.active {
    color: #fff;
    background: #2A2F35;
}
.portfolio_nav ul li {
    display: inline-block;
    padding: 8px 14px 9px;
    text-transform: uppercase;
    color: #323b48;
    font-weight: bold;
    -webkit-transition: .5s;
    transition: .5s;
    line-height: 21px;
    cursor: pointer;
}
.portfolio_nav ul li:hover {
    color: #fff;
    background: #2A2F35;
}
.prot_wrap { overflow: hidden; }
.single_protfolio { position: relative; }
.prot_thumb { position: relative; }
.prot_thumb img {
    width: 100%;
    display: block;
}
.prot_content {
    bottom: 10px;
    left: 10px;
    margin-top: -20px;
    position: absolute;
    right: 10px;
    text-align: center;
    top: 50%;
    opacity: 0;
    -webkit-transition: .8s;
    transition: .8s;
    -webkit-transform: scale(0);
    transform: scale(0);
}
.prot_content h3 {
    margin: 0;
    color: #fff;
    font-size: 18px;
    font-weight: 800;
}
.prot_content p {
    margin: 0px;
    color: #FFF;
}
.single_protfolio .prot_content {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}
.prot_wrap .col-md-3 { padding: 0; }
.prot_wrap .mix { display: none; }

/* Услуги */
.service_area { padding: 95px 0 70px; }
.service_wrap {
    overflow: hidden;
    padding-top: 47px;
}
.single_service {
    position: relative;
    text-align: center;
    -webkit-transition: all 1s ease 0s;
    transition: all 1s ease 0s;
    margin-bottom: 30px;
}
.single_content_text {
    position: relative;
    z-index: 1;
}
.single_content_text:before {
    bottom: 20px;
    content: "";
    left: 10px;
    opacity: 1;
    position: absolute;
    right: 10px;
    top: 20px;
    -webkit-transition: opacity 0.35s ease 0s, -webkit-transform 0.35s ease 0s;
    transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
    border-bottom: 1px solid #2A2F35;
    border-top: 1px solid #2A2F35;
    transform: scale(0, 1);
    z-index: -1;
}
.single_content_text:after {
    bottom: 20px;
    content: "";
    left: 20px;
    opacity: 1;
    position: absolute;
    right: 20px;
    top: 20px;
    -webkit-transition: opacity 0.35s ease 0s, -webkit-transform 0.35s ease 0s;
    transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
    border-left: 1px solid #2A2F35;
    border-right: 1px solid #2A2F35;
    transform: scale(1, 0);
    z-index: -1;
}
.single_content_text {
    padding: 50px 30px 37px;
    background: #f9f9f9 none repeat scroll 0 0;
}
.service_icon { margin-bottom: 18px; }
.service_icon i {
    color: #2A2F35;
    font-size: 40px;
}
.service_content { padding: 0px 0px; }
.service_content h3 {
    color: #2A2F35;
    text-transform: capitalize;
    font-size: 18px;
    margin-bottom: 10px;
}

/* Отзывы */
.testimonial_area {
    background: #3e4756 url("image/6.jpg") no-repeat fixed center center;
    padding: 100px 0 86px;
    position: relative;
    z-index: 1;
}
.testimonial_area:after {
    background: rgba(0, 0, 0, .7);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 1;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
}
.single_testimonial { text-align: center; }
.test_thumb img {
    display: inline-block;
    width: 100px;
}
.test_name h4 {
    color: #fff;
    font-size: 15px;
    margin-bottom: 10px;
    margin-top: 20px;
}
.test_name h4 sup {
    color: #2A2F35;
    font-size: 15px;
    font-style: italic;
    font-weight: bold;
    margin-left: 5px;
}
.test_name p {
    color: #fff;
    font-style: italic;
    margin: auto;
    width: 72%;
}

/* Блог */
.blog_area { padding: 95px 0 80px; }
.blog_wrap { padding-top: 46px; }
.single_blog {
    overflow: hidden;
    padding-bottom: 20px;
}
.blog_thum {
    position: relative;
    overflow: hidden;
}
.blog_thum:before {
    position: absolute;
    content: "";
    left: 0px;
    right: 0px;
    bottom: 0px;
    top: 0;
    background: rgba(0, 0, 0, .5);
    z-index: 999;
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 0;
    transition: all 0.5s ease-in-out;
}
.single_blog:hover .blog_thum:before {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    background: rgba(0, 0, 0, .5);
    opacity: 1;
}
.blog_thum img {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: 1s;
    transition: 1s;
}
.single_blog:hover .blog_thum img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}
.blog_thum img { width: 100%; }

.post_meta { margin-top: 10px; }
.post_meta a {
    border-right: 1px solid #ddd;
    color: #666666;
    font-size: 13px;
    margin-right: 6px;
    padding-right: 10px;
}
.post_meta a:last-child {
    border-right: 0 solid;
    margin-left: -2px;
    margin-right: 0;
    padding-left: 7px;
    padding-right: 0;
}
.post_meta a:hover { color: #2A2F35; }
.post_meta i { margin-right: 2px; }

.blog_content h3 {
    color: #555555;
    font-family: "Roboto", sans-serif;
    font-size: 14px;
    margin-top: 15px;
    text-transform: uppercase;
    transition: all 0.5s ease 0s;
}
.single_blog:hover .blog_content h3 { color: #2A2F35; }
.blog_content p { margin-bottom: 21px; }

.readmore a {
    border: 1px solid #ddd;
    color: #444;
    display: inline-block;
    font-size: 11px;
    font-weight: 400;
    padding: 8px 10px;
    text-transform: uppercase;
    transition: all 0.5s ease 0s;
}
.readmore a:hover {
    border-color: #2A2F35;
    background: #2A2F35;
    color: #fff;
}

/* Счетчики */
.counter_area {
    background: #3e4756 url("image/client.jpg") no-repeat fixed center center;
    padding: 97px 0 86px;
    position: relative;
    z-index: 1;
    background-size: cover;
}
.counter_area:after {
    background: rgba(0, 0, 0, .7);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 1;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
}
.counter_icon p { text-align: center; }
.counter_icon p i {
    color: #2A2F35;
    font-size: 20px;
}
.countr_text {
    border-radius: 100%;
    display: block;
    position: relative;
    text-align: center;
}
.countr_text h1 {
    color: #fff;
    display: inline-block;
    font-size: 27px;
    font-weight: 500;
    margin-bottom: 12px;
    position: relative;
    z-index: 999;
}
.countr_text h3 {
    color: #fff;
    display: inline-block;
    font-size: 27px;
    font-weight: 500;
    margin-bottom: 5px;
    position: relative;
    z-index: 999;
}
.single_counter > p {
    color: #fff;
    font-size: 17px;
    text-align: center;
}

/* Видео галерея */
.vedeo_gallary {
    position: relative;
    z-index: 999;
    padding-top: 20px;
}
.venobox img {
    display: block;
    width: 100%;
    z-index: 666;
}
.venobox_icon {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 40px;
    z-index: 999;
}
.venobox_icon i {
    border: 5px solid #fff;
    border-radius: 50%;
    height: 90px;
    width: 90px;
    line-height: 80px;
    text-align: center;
}

/* ========== ПОДВАЛ ========== */
.footer_top { padding: 95px 0 70px; }
.footer_wrap { padding-top: 42px; }

.whatwe p { margin-top: -7px; margin-bottom: 11px; }
.contact-details { margin: 20px 0 29px; }
.contact-details h4 {
    color: #555555;
    font-size: 15px;
    margin-bottom: 10px;
}
.contact-details h4 span {
    color: #666666;
    font-size: 14px;
    margin-left: 10px;
    font-weight: 400;
}

.google_map { padding-top: 0px; }
#googleMap {
    height: 262px;
    width: 100%;
}

.heading h3,
.whatwe h3 {
    color: #555555;
    padding-bottom: 15px;
    font-size: 20px;
    text-transform: capitalize;
}

.footer_middle {
    background: #1a1a1a none repeat scroll 0 0;
    padding: 95px 0 80px;
}
.f_middle h2 {
    color: #fff;
    text-transform: uppercase;
    margin-bottom: 30px;
    letter-spacing: 10px;
}
.f_middle h2 span { color: #2A2F35; }
.f_middle p {
    color: #fff;
    margin-bottom: 26px;
    margin-left: auto;
    margin-right: auto;
    width: 65%;
    font-size: 15px;
}

.f_social_icon {
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    padding: 10px 0 20px;
    text-align: center;
}
.f_social_icon a { display: inline-block; text-align: center; }
.f_social_icon a i {
    border: 1px solid #2A2F35;
    color: #2A2F35;
    font-size: 16px;
    height: 30px;
    margin: 0 3px;
    padding-top: 6px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 30px;
}
.f_social_icon a .fa-facebook:hover { border: 1px solid #3b5998; color: #3b5998; }
.f_social_icon a .fa-twitter:hover { border: 1px solid #00aced; color: #00aced; }
.f_social_icon a .fa-google-plus:hover { border: 1px solid #dd4b39; color: #dd4b39; }
.f_social_icon a .fa-linkedin:hover { border: 1px solid #007bb6; color: #007bb6; }
.f_social_icon a .fa-flickr:hover { border: 1px solid #ff0084; color: #ff0084; }
.f_social_icon a .fa-pinterest:hover { border: 1px solid #f00; color: #f00; }

.footer_buttom {
    background: #111111;
    padding: 30px 0px 20px;
}
.f_menu {}
.f_menu ul {
    margin: 0;
    padding: 0;
    text-align: right;
}
.f_menu ul li {
    display: inline-block;
    padding: 0px 10px;
}
.f_menu ul li:last-child {
    display: inline-block;
    padding: 0px 0px;
}
.f_menu ul li a {
    color: #fff;
    text-transform: capitalize;
    display: block;
}
.f_menu ul li a:hover { color: #2A2F35; }

.copy_right {}
.copy_right p {
    color: #fff;
    font-size: 14px;
}
.copy_right p a {
    color: #2A2F35;
    font-size: 14px;
}

/* ========== СТИЛИ ДЛЯ ОПЛАТЫ ========== */
.pay_area { padding: 0px 0 70px; }

.pay_content h3 {
    color: #2A2F35;
    text-transform: capitalize;
    font-size: 18px;
    margin-bottom: 10px;
}
.pay_content p { text-align: initial; }

/* ========== УТИЛИТАРНЫЕ КЛАССЫ ========== */
/* Классы отступов */
.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: 5px !important; }
.mb-2 { margin-bottom: 10px !important; }
.mb-3 { margin-bottom: 15px !important; }
.mb-4 { margin-bottom: 20px !important; }
.mb-5 { margin-bottom: 30px !important; }

/* Flex классы */
.d-flex { display: flex !important; }
.flex-column { flex-direction: column !important; }
.justify-content-between { justify-content: space-between !important; }
.align-items-start { align-items: flex-start !important; }
.align-items-center { align-items: center !important; }

/* Области с фоном */
.grey_area {
    background: #f9f9f9 none repeat scroll 0 0;
    border-bottom: 1px solid #e1e1e1;
    border-top: 1px solid #e1e1e1;
    padding: 95px 0 100px;
}
.white_area {
    background: #fff none repeat scroll 0 0;
    border-bottom: 1px solid #fff;
    border-top: 1px solid #fff;
    padding: 95px 0 100px;
}
.policy_area { padding: 40px 0 40px; }

/* Заголовки политики */
.policy-header {
    background-color: #f8f9fa;
    border-bottom: 3px solid #337ab7;
    padding: 30px 0;
    margin-bottom: 30px;
}
.chapter-title {
    color: #2A2F35;
    border-bottom: 2px solid #ddd;
    padding-bottom: 10px;
    margin-top: 40px;
    margin-bottom: 25px;
}



/* ========== СТИЛИ ДЛЯ БЛОГА ========== */
.banner_blog { background: url("image/slider/home-1/5.png"); }
.banner_single_blog {}
.blog-nav-menu.nav_area {
    background: rgba(0, 0, 0, 0) none repeat scroll center top;
    padding: 35px 0 20px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
.blog-nav-menu.nav_area .menu ul li a:before { display: none; }
.blogd-padding h1 {
    color: #fff;
    font-size: 60px;
    padding: 150px 0 150px;
    text-align: center;
    text-transform: uppercase;
}
.blog_nav.menu ul { margin-top: 1px; }
.blog_nav.menu ul li a { color: #fff; }
.blog_nav.menu ul li a:hover { color: #2A2F35; }

.blog_single-content { padding: 98px 0 75px; }
.blog_single-content p {
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 20px;
}
.blog_post_content h4 {
    color: #666666;
    text-transform: capitalize;
    font-weight: 600;
}
.blog_datiles { text-align: center; }
.blog_post_meta { padding: 0 0 42px; }

.m-field {
    border-right: 1px solid #999;
    color: #777;
    margin-right: 10px;
    padding-right: 10px;
}
.m-field:last-child {
    border-right: 0px solid #999;
    margin-right: 0px;
    padding-right: 0px;
}
.m-link { color: #000; }

.blog_img_thumb { padding: 30px 0 44px; }
.blog_img_thumb > img {
    height: auto;
    width: 100%;
}
.bd-title > h2 {
    font-size: 28px;
    font-weight: 600;
    letter-spacing: 3px;
    text-transform: uppercase;
}

.blog_list > ul { margin-left: 65px; }
.blog_list > ul li {
    color: #666666;
    font-size: 18px;
    font-weight: 500;
    list-style: outside none disc;
}

.blog_social {
    padding: 27px 0 44px;
    text-align: center;
}
.blog_social .item {
    color: #fff;
    font-size: 17px;
    font-weight: 400;
    padding-right: 50px;
    text-align: center;
    text-transform: capitalize;
}
.item { background: #364F8F none repeat scroll 0 0; display: inline-block; }
.blog_social .item:nth-child(1) { background: #364F8F; }
.blog_social .item:nth-child(2) { background: #259BDB; }
.blog_social .item:nth-child(3) { background: #C54224; }
.blog_social .item:nth-child(4) { background: #1F70A7; }
.blog_social .item i {
    background: #3d589d none repeat scroll 0 0;
    font-size: 16px;
    height: 40px;
    margin-right: 16px;
    padding: 12px 15px;
    width: 40px;
}
.blog_social .item:nth-child(1) i { background: #3d589d; }
.blog_social .item:nth-child(2) i { background: #29ACF4; }
.blog_social .item:nth-child(3) i { background: #DA4A28; }
.blog_social .item:nth-child(4) i { background: #247DB9; }

.blog_post_comment {}
.blog_post_comment h2 {
    font-size: 28px;
    letter-spacing: 5px;
    padding-bottom: 31px;
    text-transform: uppercase;
}
.blog-index.blog_area { padding: 40px 0 80px; }
.blog-index .single_blog {
    overflow: hidden;
    padding-bottom: 20px;
    margin-bottom: 10px;
}

.breadcrumbs.blogd-padding h1 {
    color: #fff;
    font-size: 60px;
    padding: 150px 0 0;
    text-align: center;
    text-transform: uppercase;
}
.blogd-padding.breadcrumbs {
    text-align: center;
    padding-bottom: 100px;
}

/* Виджеты блога */
.blog-left-side.widget {}
.blog-left-side.widget > div {
    margin-bottom: 30px;
    background: #f9f9f9;
    padding: 15px;
}
.blog-left-side.widget > div:last-child { margin-bottom: 0px; }
.blog-left-side.widget h2 {
    margin-bottom: 20px;
    text-transform: capitalize;
    color: #555555;
    font-weight: 400;
    font-size: 20px;
}

.search {
    background: #f7f7f7;
    position: relative;
}
.search input {
    background: #f7f7f7;
    border: 0;
    width: 100%;
    position: relative;
}
.search input::-ms-input-placeholder,
.search input::-webkit-placeholder,
.search input::-moz-placeholder {
    color: #858585;
    font-size: 14px;
}
.search button {
    position: absolute;
    right: 15px;
    top: 2px;
    padding: 11px 15px;
    background: transparent;
    border: 0;
    font-size: 18px;
    color: #858585;
}

.category {}
.category ul li {
    padding-bottom: 6px;
    padding-left: 25px;
    position: relative;
}
.category ul li a {
    color: #444444;
    font-size: 15px;
    font-weight: 400;
    line-height: 24px;
    margin: 0 0 10px;
    text-transform: capitalize;
}
.category ul li::before {
    position: absolute;
    left: 0px;
    top: 0px;
    content: "\f101";
    font-family: FontAwesome;
    color: #303030;
    font-size: 18px;
}
.category ul li:hover::before,
.category ul li a:hover,
.tags a:hover,
.r-post-content h3:hover,
.r-post-content h3 a:hover { color: #2A2F35; }

.tags {}
.tags a {
    color: #444444;
    font-size: 15px;
    font-weight: 400;
    line-height: 24px;
    margin: 0 0 10px;
    border: 1px solid #444;
    padding: 5px 10px;
    display: inline-block;
}
.tags a:hover {
    border-color: #2A2F35;
    color: #fff;
}

.recent-post {}
.r-post {
    display: flex;
    padding-bottom: 20px;
}
.r-post-image { position: relative; }
.r-post-image::before {
    position: absolute;
    content: "";
    left: 0px;
    top: 0px;
    background: rgba(0,0,0,.8);
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: .5s;
}
.r-post-image:hover::before { opacity: 1; }
.r-post-content { padding-left: 20px; }
.r-post-content p { margin-bottom: 10px; }
.r-post-content h3,
.r-post-content h3 a {
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 0;
}

.instagraph {}
.ins-thumb {}
.ins-thumb a {
    display: inline-block;
    position: relative;
    margin: 0 7px 9px 0;
}
.ins-thumb a:nth-child(3),
.ins-thumb a:nth-child(6),
.ins-thumb a:nth-child(9) { margin-right: 0px; }
.ins-thumb a:nth-child(7),
.ins-thumb a:nth-child(8),
.ins-thumb a:nth-child(9) { margin-bottom: 0px; }
.ins-thumb a::before {
    position: absolute;
    content: "";
    left: 0px;
    top: 0px;
    background: rgba(0,0,0,.8);
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: .5s;
}
.ins-thumb a:hover::before { opacity: 1; }
.ins-thumb img { width: 100%; }

/* ========== АНИМАЦИИ И ЭФФЕКТЫ ========== */
#scrollUp {
    background: #2A2F35 none repeat scroll 0 0;
    bottom: 30px;
    color: #fff;
    font-size: 30px;
    height: 40px;
    line-height: 40px;
    right: 30px;
    text-align: center;
    width: 40px;
}
#scrollUp i { color: #fff; }

.empty-space {
    height: 47px;
    display: block;
}

.panel-default>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #ddd;
    color: #444;
    line-height: 24px;
}

/* ========== МЕДИА-ЗАПРОСЫ ========== */
/* Большие планшеты и маленькие десктопы */
@media (min-width: 992px) and (max-width: 1169px) {
    .menu ul li a {
        padding: 5px 11px 6px;
        font-size: 14px;
    }
    .team_social a i { margin: 0px; }
    .blog_social .item { padding-right: 19px; }
    .nivo-controlNav { top: 30%; }
}

/* Планшеты */
@media (min-width: 768px) and (max-width: 991px) {
    .pay_content{ padding: 0px 20px;}
    
    .protfolio_area { margin-top: 20px; }
    .pay_area { margin-top: 20px; }
    #image_pay { display: none!important; }
    
    .fex-col-lg { gap: initial !important; }
    .section_title > p {
        width: 100%;
        text-align: left;
        padding-left: 20px;
    }
    
    .main-slider-area { display: none !important; }
    .about_area { padding: 40px 0 0px !important; }
    .protfolio_area { padding: 40px 0 10px !important; }
    .service_area { padding: 40px 0 0px !important; }
    .form-area { padding-top: 40px !important; }
    
    .mean-container .mean-bar { background: #2A2F35; }
    .nivo-controlNav { top: 27%; }
    .cap-title h2 span {
        display: inline-block;
        font-size: 22px;
    }
    .cap-title h3 span { font-size: 30px; }
    .menu ul li a {
        padding: 0 4px;
        font-size: 12px;
    }
    .single_about { margin-bottom: 15px; }
    .single_counter { padding-bottom: 30px; }
    .blog_social .item { padding-right: 44px; }
    
    .logo {
        text-align: center;
        margin: 10px 0;
    }
}

/* Телефоны */
@media (max-width: 767px) {
    .m-text-center{
        text-align: center;
        display: block !important;
    }

    .pay_content{ padding: 0px 20px;}


    .protfolio_area { margin-top: 20px; }
    .pay_area { margin-top: 20px; }
    #image_pay { display: none!important; }
    
    .fex-col-lg { gap: initial !important; }
    .section_title > p {
        width: 100%;
        text-align: left;
        padding-left: 20px;
    }
    
    .main-slider-area { display: none !important; }
    .about_area { padding: 40px 0 0px !important; }
    .protfolio_area { padding: 40px 0 10px !important; }
    .service_area { padding: 40px 0 0px !important; }
    .form-area { padding-top: 40px !important; }
    
    .header_top p span,
    .header_top p a {
        display: block;
        margin: auto;
        margin-bottom: 10px;
        text-align: center;
    }
    .header_top ul.social-icons { text-align: center; }
    .nav_area { padding: 0; }
    .margin_left {
        margin-left: auto;
        margin: auto;
        text-align: center;
    }
    .cap-title h2 span {
        display: inline-block;
        font-size: 17px;
    }
    .cap-title h3 span { font-size: 20px; }
    .cap-dec { display: none; }
    .smore { display: none; }
    
    .single_about { margin-bottom: 15px; }
    .portfolio_nav ul li { display: block; }
    .f_middle p { width: 90%; }
    .nivo-controlNav {
        margin-top: -21px;
        position: absolute;
        right: 7%;
        text-align: center;
        top: 30%;
        width: 14px;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        z-index: 9999;
    }
    .cap-dec p { font-size: 12px; }
    .copy_right p { text-align: center; }
    .f_menu ul { text-align: center; }
    
    .prot_wrap .col-md-3 {
        padding: 0 15px;
        width: 100%;
    }
    .prot_thumb > img { width: 100%; }
    .blog_social .item {
        padding-right: 0;
        text-align: left;
        width: 100%;
        margin-bottom: 20px;
    }
    .blog_post_comment h2 { font-size: 21px; }
    
    .f_middle h2 { letter-spacing: 0px; }
    
    /* Специальные стили для мобильного header_top */
 
    .header_top {
        padding: 12px 0;
        background: #1a1a1a;
    }
    .header_top p {
        display: flex;
        overflow-x: auto;
        gap: 8px;
        padding: 5px 0;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    .header_top p::-webkit-scrollbar { display: none; }
    .header_top p span,
    .header_top p a {
        display: inline-flex;
        align-items: center;
        margin: 0;
        padding: 0px 5px;
        background: #333;
        border-radius: 25px;
        white-space: nowrap;
        text-decoration: none;
        transition: all 0.3s ease;
        border: 2px solid transparent;
        flex-shrink: 0;
        border-radius: 6px;
        cursor: pointer;
        text-align: center;
    }
    .header_top p span i,
    .header_top p a i {
        font-size: 14px;
        color: #fff;
        margin-right: 8px;
    }
    .header_top p a { color: #ecf0f1; }
    .header_top p span:hover,
    .header_top p a:hover {
        background: #444;
    }
    .header_top p span:hover i,
    .header_top p a:hover i { color: white; }
    
    /* Адаптивность modern slider */
    .slider-container {
        flex-direction: column;
        min-height: auto;
    }
    
    .foreground-image {
        max-width: 80%;
        max-height: 80%;
    }
    
    .content-section {
        padding: 40px 30px;
    }
    
    .product-title {
        font-size: 40px;
    }
    
    .image-section {
        min-height: 400px;
    }
}

/* Маленькие телефоны */
@media only screen and (min-width: 480px) and (max-width: 767px) {

    .m-text-center{
        text-align: center;
        display: block !important;
    }

    .pay_content{ padding: 0px 20px;}

    .protfolio_area { margin-top: 20px; }
    .pay_area { margin-top: 20px; }
    #image_pay { display: none!important; }
    .fex-col-lg { gap: initial !important; }
    .section_title > p {
        width: 100%;
        text-align: left;
    }
    
    .main-slider-area { display: none !important; }
    .about_area { padding: 40px 0 0px !important; }
    .protfolio_area { padding: 40px 0 10px !important; }
    .service_area { padding: 40px 0 0px !important; }
    .form-area { padding-top: 40px !important; }
    
    .header_top p span,
    .header_top p a {
        display: inline-block;
        margin-right: 9px;
        margin-bottom: 10px;
        text-align: center;
    }
    .header_top ul.social-icons { text-align: center; }
    .nivo-controlNav { top: 25%; }
    .cap-title h2 span { margin-top: 5px; }
    .cap-dec { display: block; }
    .team_social a i {
        height: 28px;
        margin: 0;
        width: 28px;
        line-height: 26px;
        padding-top: 0px;
    }
    
    /* Адаптивность modern slider */
    .product-title {
        font-size: 36px;
    }
    
    .price {
        font-size: 32px;
    }
    
    .features {
        justify-content: center;
    }
    
    .foreground-image {
        max-width: 85%;
        max-height: 85%;
    }
    
    .click-hint {
        font-size: 12px;
        padding: 10px 18px;
        min-width: 180px;
    }
}

/* Десктопная версия flex */
@media (min-width: 768px) {
    .flex-md-row { flex-direction: row !important; }
    .align-items-md-center { align-items: center !important; }
}

/* Мобильная версия навигации */
@media (max-width: 991.98px) {
    .navbar > .container {
        display: flex;
        flex-direction: column;
        padding-right: 0;
        padding-left: 0;
        max-width: 100%;
        width: 100%;
    }
    
    .navbar-brand {
        width: 100%;
        padding: 10px 20px;
        margin: 0;
        border-bottom: 1px solid #eee;
        box-sizing: border-box;
    }
    
    .navbar-collapse {
        width: 100%;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        padding: 10px 0;
        margin: 0;
        flex-wrap: nowrap;
        justify-content: flex-start !important;
        scrollbar-width: thin;
        scrollbar-color: rgb(0 0 0 / 10%) rgba(0, 0, 0, 0.125);
    }
    
    .navbar-collapse::-webkit-scrollbar {
        height: 6px !important;
        display: block !important;
    }
    
    .navbar-collapse::-webkit-scrollbar-track {
        background: #f8f9fa !important;
        border-radius: 3px !important;
        margin: 0 15px !important;
    }
    
    .navbar-collapse::-webkit-scrollbar-thumb {
        background: linear-gradient(90deg, #007bff, #00bfff) !important;
        border-radius: 3px !important;
        border: none !important;
        box-shadow: 0 1px 2px rgba(0,0,0,0.1) !important;
    }
    
    .navbar-collapse::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(90deg, #0056b3, #0099cc) !important;
    }
    
    .navbar-nav {
        flex-direction: row !important;
        flex-wrap: nowrap;
        white-space: nowrap;
        padding-left: 15px;
        padding-right: 15px;
        margin: 0;
        min-width: max-content;
    }
    
    .nav-item {
        display: inline-block;
        float: none;
        margin: 0 3px;
        flex-shrink: 0;
    }
    
    .nav-link {
        padding: 8px 12px !important;
        font-size: 14px;
        text-align: center;
        min-width: max-content;
        border-radius: 4px;
        transition: all 0.2s ease;
    }
    
    .nav-link:hover { background-color: #f8f9fa; }
    .nav-underline {
        position: absolute;
        bottom: 2px;
        left: 50%;
        transform: translateX(-50%);
        width: 0;
        height: 2px;
        background-color: #8a552a;
        transition: width 0.3s ease;
        display: block;
    }
    .nav-link.active .nav-underline { width: 70% !important; }
    
    /* Логотип на мобильных */
    .navbar-brand {
        flex-wrap: wrap !important;
        padding-bottom: 5px !important;
    }
    .navbar-brand img { margin-bottom: 5px; }
    .logo_t {
        min-width: 0;
        flex: 1;
    }
    .logo_t small {
        display: block;
        white-space: normal !important;
        word-wrap: break-word;
        word-break: break-word;
        overflow-wrap: break-word;
        line-height: 1.3;
        margin-top: 2px;
        max-width: 280px;
    }
    
    /* Адаптивность modern slider для маленьких экранов */
    .product-title {
        font-size: 32px;
    }
    
    .product-subtitle {
        font-size: 16px;
    }
    
    .content-section {
        padding: 30px 20px;
    }
    
    .feature {
        font-size: 13px;
        padding: 10px 15px;
    }
    
    .foreground-image {
        max-width: 60%;
        max-height: 60%;
        top: 66px;
        position: relative;
    }
    
    .click-hint {
        font-size: 11px;
        padding: 8px 15px;
        min-width: 184px;
        position: absolute;
        top: 13px;
    }
    
    .image-section {
        min-height: 350px;
    }
}

/* Десктопная версия навигации */
@media (min-width: 992px) {
    .navbar-collapse { justify-content: flex-end !important; }
    .navbar-nav { flex-direction: row; }
    .nav-item { margin: 0; }
    .logo_t small { white-space: nowrap; }
}

/* Убираем все возможные отступы */
.google_map {
    margin: 0 !important;
    padding: 0 !important;
    width: 100%;
    line-height: 0; /* убирает пробелы от inline-элементов */
}

.google_map iframe {
    width: 100%;
    height: 265px;
    border: 0;
    display: block;
    margin: 0;
    padding: 0;
}

/* Для родительских контейнеров */
.row.m-0 {
    margin: 0 !important;
}

.row.m-0 .col-12 {
    padding: 0 !important;
    margin: 0 !important;
}

/* Чтобы footer_middle прилипал вплотную */
.footer_middle {
    margin-top: 0 !important;
    padding-top: 95px; /* ваш существующий padding */
}

/* Убираем любые отступы сверху у footer_middle */
.contact_area + .row.m-0 + .footer_middle,
.google_map + .footer_middle {
    margin-top: 0 !important;
}


/* Убираем стандартные рамки фокуса для всех элементов формы */
#contact-form input:focus,
#contact-form textarea:focus,
#contact-form select:focus,
#contact-form button:focus {
    outline: none !important;
    box-shadow: none !important;
    border-color: inherit !important;
}

/* Или более конкретно для Bootstrap классов */
#contact-form .form-control:focus {
    outline: none !important;
    box-shadow: none !important;
    border-color: #dee2e6 !important; /* или ваш цвет границы */
}

/* Если хотите оставить только легкое выделение без рамки */
#contact-form .form-control:focus {
    outline: none;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.1); /* легкая тень вместо рамки */
    border-color: #80bdff;
}

/* Полное удаление любых эффектов фокуса */
#contact-form *:focus {
    outline: 0 !important;
    box-shadow: none !important;
}

/*****************************************************************************************************
 /* Стили для страницы политики в вашем дизайне */
.policy-page {
    padding: 40px 0;
    background: #f9f9f9;
}

.breadcrumb-policy {
    background: #f5f5f5;
    padding: 15px 0;
    margin-bottom: 30px;
    border-bottom: 1px solid #e1e1e1;
}

.breadcrumb-policy .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.breadcrumb-policy ul {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
}

.breadcrumb-policy ul li {
    margin-right: 5px;
}

.breadcrumb-policy ul li:after {
    content: "/";
    margin-left: 5px;
    color: #666;
}

.breadcrumb-policy ul li:last-child:after {
    content: "";
}

.breadcrumb-policy ul li a {
    color: #666;
    text-decoration: none;
    font-size: 14px;
}

.breadcrumb-policy ul li a:hover {
    color: #2A2F35;
}

.breadcrumb-policy ul li.active a {
    color: #2A2F35;
    font-weight: 600;
}

.print-policy {
    background: #2A2F35;
    color: white;
    border: none;
    padding: 8px 20px;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    transition: all 0.3s ease;
}

.print-policy:hover {
    background: #1a1f25;
    transform: translateY(-2px);
}

.policy-container {
    background: white;
    padding: 40px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    margin-bottom: 40px;
}

.policy-header {
    text-align: center;
    margin-bottom: 40px;
    padding-bottom: 20px;
    border-bottom: 3px solid #2A2F35;
}

.policy-header h1 {
    color: #2A2F35;
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 10px;
}

.policy-header .subtitle {
    color: #666;
    font-size: 18px;
    margin-bottom: 20px;
}

.approval-block {
    background: #f8f9fa;
    padding: 20px;
/*    border-radius: 6px;*/
/*    border-left: 4px solid #2A2F35;*/
    margin-top: 20px;
}

.chapter {
    margin-bottom: 40px;
    padding-bottom: 20px;
    border-bottom: 1px solid #eee;
}

.chapter:last-child {
    border-bottom: none;
}

.chapter-title {
    color: #2A2F35;
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 25px;
    padding-bottom: 10px;
    border-bottom: 2px solid #eaeaea;
    display: flex;
    align-items: center;
    gap: 10px;
}

.chapter-title i {
    color: #2A2F35;
}

.paragraph {
    margin-bottom: 15px;
    line-height: 1.6;
    color: #444;
}

.paragraph-number {
    font-weight: bold;
    color: #2A2F35;
    margin-right: 5px;
}

.data-table-container {
    overflow-x: auto;
    margin: 20px 0;
    border: 1px solid #ddd;
    border-radius: 6px;
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.data-table th {
    background: #2A2F35;
    color: white;
    font-weight: 600;
    padding: 12px 15px;
    text-align: left;
}

.data-table td {
    padding: 10px 15px;
    border-bottom: 1px solid #ddd;
    vertical-align: top;
}

.data-table tr:nth-child(even) {
    background-color: #f9f9f9;
}

.data-table tr:hover {
    background-color: #f5f5f5;
}

.rights-table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
}

.rights-table th {
    background: #2A2F35;
    color: white;
    font-weight: 600;
    padding: 12px 15px;
    text-align: center;
}

.rights-table td {
    padding: 12px 15px;
    border: 1px solid #ddd;
    vertical-align: top;
}

.rights-table tr:nth-child(even) {
    background-color: #f9f9f9;
}

.rights-table td:first-child {
    font-weight: bold;
    background-color: #f8f9fa;
    width: 20%;
}

.contact-info {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 25px;
    margin-top: 30px;
    border-left: 4px solid #2A2F35;
}

.contact-info h3 {
    color: #2A2F35;
    margin-bottom: 20px;
    font-size: 20px;
}

.contact-detail {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin-bottom: 15px;
}

.contact-detail i {
    color: #2A2F35;
    margin-top: 3px;
    min-width: 20px;
}

.contact-detail a {
    color: #2A2F35;
    text-decoration: none;
}

.contact-detail a:hover {
    text-decoration: underline;
}

.policy-navigation {
    position: sticky;
    top: 20px;
    background: white;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    margin-bottom: 30px;
}

.policy-navigation h5 {
    color: #2A2F35;
    margin-bottom: 15px;
    font-size: 16px;
}

.nav-pills-custom .nav-link {
    color: #666;
    padding: 8px 15px;
    margin-bottom: 5px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: all 0.3s ease;
}

.nav-pills-custom .nav-link:hover {
    background-color: #f0f0f0;
    color: #2A2F35;
}

.nav-pills-custom .nav-link.active {
    background-color: #2A2F35;
    color: white;
}

.last-updated {
    color: #666;
    font-style: italic;
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid #eee;
    display: flex;
    align-items: center;
    gap: 10px;
}

.scroll-top-btn {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 40px;
    height: 40px;
    background: #2A2F35;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 2px 10px rgba(0,0,0,0.2);
    opacity: 0;
    transition: all 0.3s ease;
    z-index: 1000;
}

.scroll-top-btn.visible {
    opacity: 1;
}

.scroll-top-btn:hover {
    background: #1a1f25;
    transform: translateY(-3px);
}

@media (max-width: 768px) {
    .policy-container {
        padding: 20px;
    }
    
    .policy-header h1 {
        font-size: 24px;
    }
    
    .policy-header .subtitle {
        font-size: 16px;
    }
    
    .data-table {
        font-size: 12px;
    }
    
    .data-table th,
    .data-table td {
        padding: 8px 10px;
    }
    
}

@media print {
    .header_top,
    .navbar,
    .breadcrumb-policy,
    .policy-navigation,
    .scroll-top-btn,
    .footer_middle,
    .footer_buttom,
    #cookieNotification {
        display: none !important;
    }
    
    .policy-container {
        box-shadow: none;
        padding: 0;
    }
    
    body {
        background: white !important;
    }
    
    .policy-page {
        padding: 0;
        background: white;
    }
}


/**************************************************************************************************************************************************************/
    .video-surveillance-mini {
        position: relative;
        width: 100%;
        border-radius: var(--bs-border-radius) !important;
        overflow: hidden;
        box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1);
    }
    
    .video-mini-bg-wrapper {
        position: relative;
        width: 100%;
        min-height: 450px;
    }
    
    .video-mini-bg-image {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }
    
    .video-mini-blur-overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(255, 255, 255, 0.88);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }
    
    .video-mini-content {
        position: relative;
        z-index: 2;
        padding: 25px;
        min-height: 550px;
        display: flex;
        flex-direction: column;
    }
    
    .video-mini-badge {
        display: inline-block;
        background: linear-gradient(135deg, #2A2F35, #3a4250);
        color: white;
        padding: 8px 16px;
        border-radius: 6px;
        font-weight: 600;
        font-size: 0.9rem;
        margin-bottom: 20px;
        align-self: flex-start;
        box-shadow: 0 4px 12px rgba(42, 47, 53, 0.25);
    }
    
    .video-mini-badge i {
        margin-right: 8px;
    }
    
    .video-mini-title {
        font-size: 1.8rem;
        font-weight: 800;
        color: #2A2F35;
        margin-bottom: 15px;
        line-height: 1.3;
    }
    
    .video-mini-title .video-mini-amp {
        color: #4CAF50;
        font-weight: 900;
    }
    
    .video-mini-description {
        font-size: 0.95rem;
        color: #555;
        line-height: 1.5;
        margin-bottom: 25px;
        flex-grow: 1;
    }
    
    .video-mini-icons {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
        margin-bottom: 25px;
        background: rgba(255, 255, 255, 0.6);
        padding: 15px;
        border-radius: 8px;
        border: 1px solid rgba(0, 0, 0, 0.05);
    }
    
    .video-mini-icon-item {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 0.9rem;
        color: #2A2F35;
    }
    
    .video-mini-icon-item i {
        color: #2A2F35;
        font-size: 1.1rem;
        width: 24px;
        text-align: center;
    }
    
    .video-mini-price {
        background: white;
        padding: 15px;
        border-radius: 8px;
        text-align: center;
        margin-bottom: 20px;
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
        border: 1px solid #eaeaea;
    }
    
    .video-mini-price-main {
        font-size: 1.8rem;
        font-weight: 800;
        color: #2A2F35;
        line-height: 1;
        margin-bottom: 5px;
    }
    
    .video-mini-price-desc {
        font-size: 0.85rem;
        color: #666;
    }
    
    .video-mini-cta {
        margin-bottom: 15px;
    }
    
    .btn-video-mini {
        width: 100%;
        background: linear-gradient(135deg, #2A2F35, #3a4250);
        color: white;
        border: none;
        padding: 14px;
        border-radius: 8px;
        font-size: 1rem;
        font-weight: 600;
        cursor: pointer;
        transition: all 0.3s ease;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        box-shadow: 0 6px 18px rgba(42, 47, 53, 0.25);
    }
    
    .btn-video-mini:hover {
        background: linear-gradient(135deg, #3a4250, #2A2F35);
        transform: translateY(-2px);
        box-shadow: 0 10px 22px rgba(42, 47, 53, 0.3);
    }
    
    .video-mini-phone {
        text-align: center;
        padding-top: 15px;
        border-top: 1px solid rgba(0, 0, 0, 0.1);
    }
    
    .video-mini-phone a {
        color: #2A2F35;
        text-decoration: none;
        font-weight: 600;
        font-size: 1rem;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        transition: all 0.3s ease;
    }
    
    .video-mini-phone a:hover {
        color: #4CAF50;
    }
    
    /* Адаптивность */
    @media (max-width: 768px) {
        .video-surveillance-mini {
            max-width: 400px;
            margin-left: auto;
            margin-right: auto;
        }
    }
    
    @media (max-width: 576px) {
        .video-mini-content {
            padding: 20px;
        }
        
        .video-mini-title {
            font-size: 1.6rem;
        }
        
        .video-mini-price-main {
            font-size: 1.6rem;
        }
    }
    

    /* ========== ШАПКА ========== */
/* ========== МОБИЛЬНАЯ АДАПТАЦИЯ HEADER TOP ========== */
@media (max-width: 991.98px) {
    .mobile-header-scroll {
        padding: 0 5px;
    }
    
    .mobile-row-scroll {
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
        scrollbar-color: #555 transparent;
        padding-bottom: 5px;
    }
    
    .mobile-row-scroll::-webkit-scrollbar {
        height: 4px;
    }
    
    .mobile-row-scroll::-webkit-scrollbar-track {
        background: transparent;
    }
    
    .mobile-row-scroll::-webkit-scrollbar-thumb {
        background-color: #555;
        border-radius: 2px;
    }
    
    /* Первый ряд - контакты */
    .contacts-scroll {
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }
    
    /* Второй ряд - расписание */
    .schedule-scroll {
        margin-top: 8px;
    }
    
    .mobile-row-scroll > .d-flex {
        min-width: max-content;
        padding-right: 20px;
    }
    
    .contact-item, .schedule-item {
        padding: 5px 15px;
        background: rgba(255, 255, 255, 0.1);
        border-radius: 20px;
        white-space: nowrap;
    }
    
    .contact-item a, .schedule-item span {
        font-size: 0.9rem;
    }
    
    /* Убираем старые мобильные стили */
    .header_top p span,
    .header_top p a {
        margin-right: 0;
        margin-bottom: 0;
        text-align: left;
        display: inline;
    }
    
    .fex-col-lg {
        gap: 10px !important;
    }
}

/* Для очень маленьких экранов */
@media (max-width: 575.98px) {
    .contact-item, .schedule-item {
        padding: 4px 12px;
        font-size: 0.85rem;
    }
    
    .mobile-row-scroll > .d-flex {
        gap: 10px !important;
    }
}

/* Десктопные стили остаются без изменений */
.header_top {
    padding: 10px 0;
    background: #f8f8f8;
    transition: all 0.2s ease-in-out;
    overflow: hidden;
}
/* ... остальные ваши десктопные стили остаются без изменений ... */

.custom-pl-20 {
  padding-left: 20px !important;
}