@font-face {
    font-family: Cuprum-Regular;
    src: url(../fonts/Cuprum-Regular/CUPRUM.eot);
    src: url(../fonts/Cuprum-Regular/CUPRUM.eot?#iefix) format('embedded-opentype'), url(../fonts/Cuprum-Regular/CUPRUM.woff) format('woff'), url(../fonts/Cuprum-Regular/CUPRUM.ttf) format('truetype'), url(../fonts/Cuprum-Regular/CUPRUM.svg) format('svg');
    font-weight: 700;
    font-style: normal
}

@font-face {
	font-family: 'Century Gothic';
	src: url('../fonts/Century-Gothic/CenturyGothic-Italic.eot');
	src: local('../fonts/Century-Gothic/Century Gothic Italic'), local('CenturyGothic-Italic'),
		url('../fonts/Century-Gothic/CenturyGothic-Italic.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Century-Gothic/CenturyGothic-Italic.woff') format('woff'),
		url('../fonts/Century-Gothic/CenturyGothic-Italic.ttf') format('truetype');
	font-weight: normal;
	font-style: italic;
}

@font-face {
	font-family: 'Century Gothic';
	src: url('../fonts/Century-Gothic/CenturyGothic.eot');
	src: local('../fonts/Century-Gothic/Century Gothic'), local('CenturyGothic'),
		url('../fonts/Century-Gothic/CenturyGothic.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Century-Gothic/CenturyGothic.woff') format('woff'),
		url('../fonts/Century-Gothic/CenturyGothic.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Century Gothic';
	src: url('../fonts/Century-Gothic/CenturyGothic-Bold.eot');
	src: local('../fonts/Century-Gothic/Century Gothic Bold'), local('CenturyGothic-Bold'),
		url('../fonts/Century-Gothic/CenturyGothic-Bold.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Century-Gothic/CenturyGothic-Bold.woff') format('woff'),
		url('../fonts/Century-Gothic/CenturyGothic-Bold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}

@font-face {
	font-family: 'Century Gothic';
	src: url('../fonts/Century-Gothic/CenturyGothic-BoldItalic.eot');
	src: local('../fonts/Century-Gothic/Century Gothic Bold Italic'), local('CenturyGothic-BoldItalic'),
		url('../fonts/Century-Gothic/CenturyGothic-BoldItalic.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Century-Gothic/CenturyGothic-BoldItalic.woff') format('woff'),
		url('../fonts/Century-Gothic/CenturyGothic-BoldItalic.ttf') format('truetype');
	font-weight: bold;
	font-style: italic;
}

body {
    font-family: Century Gothic;
    position: relative;
    color: #5b5b5b
}

@media (max-width: 1100px) and (min-width: 768px) {
    @-ms-viewport {
        width: 1100px
    }body {
    min-width: 970px
}
}

@media (max-width: 767px) and (min-width: 426px) {
    @-ms-viewport {
        width: 767px
    }body {
    min-width: 767px
}
}

@media (max-width: 425px) {
    @-ms-viewport {
        width: 425px
    }body {
    min-width: 425px
}
}

a:active, a:focus, a:hover {
    outline: 0
}

.row {
    margin-left: 0;
    margin-right: 0
}

.container {
    width: 1100px;
    padding: 0 10px
}

@media (max-width: 1100px) and (min-width: 768px) {
    .container {
        width: 970px
    }
}

@media (max-width: 767px) and (min-width: 426px) {
    .container {
        width: 750px
    }
}

@media (max-width: 425px) {
    .container {
        width: 410px
    }
}

h1 {
    font-size: 36px;
    text-align: center
}

h2 {
    font-size: 30px;
    text-align: center
}

@media (max-width: 767px) and (min-width: 426px) {
    h2 {
        font-size: 26px
    }
}

h3 {
    font-size: 24px
}

h3 a, h3 a:hover {
    color: inherit
}

h4 {
    font-size: 22px
}

p {
    font-size: 20px;
    color: #5b5b5b;
    margin: 0
}

@media (max-width: 767px) and (min-width: 426px) {
    p {
        font-size: 18px
    }
}

/*h1, h2, h3 {
    text-transform: uppercase
}*/

h1, h2, h3, h4 {
    margin: 0
}

a {
    color: #002f3d
}

.button {
    text-align: center;
    width: 191px
}

.button a {
    /*text-transform: uppercase;*/
    line-height: 33px;
    font-size: 12px
}

.button.navy {
    background-color: #002f3d
}

.button.red {
    background-color: #e31e24
}

.button a {
    color: #fff
}

.button.white {
    background-color: #fff
}

.button.white a {
    color: #002f3d
}

.left {
    float: left
}

.right {
    float: right
}

.center {
    display: inline-block
}

.column-2 {
    width: 49%
}

.column-2:first-of-type {
    margin-right: 1%
}

.column-2:nth-of-type(2n+1) {
    margin-right: 1%
}

.column-2:nth-of-type(2n) {
    margin-left: 1%
}

@media (max-width: 425px) {
    .column-2 {
        width: 100%
    }

    .column-2:first-of-type {
        margin-right: 0
    }

    .column-2:nth-of-type(2n+1) {
        margin-right: 0
    }

    .column-2:nth-of-type(2n) {
        margin-left: 0
    }

    .column-2 + .column-2 {
        margin-top: 20px
    }
}

.column-3 {
    width: 32%;
    margin: 0
}

.column-3:nth-of-type(2), .column-3:nth-of-type(3n+2) {
    margin-left: 2%;
    margin-right: 2%
}

.column-3:nth-of-type(3) ~ .column-3 {
    margin-top: 20px
}

@media (max-width: 425px) {
    .column-3:not(.sert) {
        width: 100%
    }

    .column-3:not(.sert):nth-of-type(2), .column-3:not(.sert):nth-of-type(3n+2) {
        margin-left: 0;
        margin-right: 0
    }

    .column-3:not(.sert) + .column-3 {
        margin-top: 20px
    }
}

.column-4 {
    width: 23.5%
}

.column-4:not(:last-of-type) {
    margin-right: 2%
}

.column-4 img {
    width: 100%
}

@media (max-width: 767px) and (min-width: 426px) {
    .column-4 {
        width: 48%
    }

    .column-4:first-of-type, .column-4:nth-of-type(2n+1) {
        margin-right: 1%
    }

    .column-4:nth-of-type(2n) {
        margin-left: 1%
    }

    .column-4:nth-of-type(2) ~ .column-4 {
        margin-top: 10px
    }
}

@media (max-width: 425px) {
    .column-4 {
        width: 100%
    }

    .column-4:not(:last-of-type) {
        margin-right: 0
    }

    .column-4 + .column-4 {
        margin-top: 10px
    }
}

.column-5 {
    width: 40%
}

@media (max-width: 425px) {
    .column-5 {
        width: 100%
    }
}

.column-6 {
    width: 60%
}

@media (max-width: 425px) {
    .column-6 {
        width: 100%
    }
}

.column-7 {
    width: 69%
}

@media (max-width: 425px) {
    .column-7 {
        width: 100%
    }
}

.column-10 {
    width: 10%
}

.column-10:not(:first-of-type) {
    padding-left: 10px
}

.column-30 {
    width: 30%;
    padding-left: 10px
}

@media (max-width: 425px) {
    .column-30 {
        padding-left: 0;
        width: 100%
    }

    .column-30 + .column-30 {
        margin-top: 10px
    }
}

.auto {
    width: auto;
    display: inline-block
}

.radio {
    margin: 0
}

.white-part {
    padding: 20px 0 10px;
    text-align: center
}

@media (max-width: 1100px) and (min-width: 768px) {
    .white-part {
        text-align: left
    }
}

.white-part .logo {
    width: 250px;
    padding: 0 35px 0px;
    text-align: left
}

@media (max-width: 1100px) and (min-width: 768px) {
    .white-part .logo {
        padding-left: 25px;
        padding-right: 25px
    }
}

@media (max-width: 767px) and (min-width: 426px) {
    .white-part .logo {
        padding-right: 0
    }
}

@media (max-width: 425px) {
    .white-part .logo {
        padding-left: 0;
        width: auto
    }
}

.white-part .logo > a {
    background-position: 50% 0;
    background-repeat: no-repeat;
    padding-top: 52px;
    padding-left: 12px;
    display: block;
    font-size: 10px;
    color: #002f3d
}

.white-part .logo > a:hover {
    text-decoration: none
}

@media (max-width: 425px) {
    .white-part .logo > a {
        background-size: 100% auto
    }
}

.white-part .logo .geo-ip {
    padding-left: 10px;
    padding-top: 10px
}

.white-part .logo .geo-ip p {
    margin: 0;
    color: #002f3d;
    font-size: 13px
}

.white-part .logo .geo-ip p a {
    color: #002f3d
}

.white-part .contacts {
    width: 200px;
    padding-right: 40px;
    text-align: right;
    font-size: 20px
}

@media (max-width: 425px) {
    .white-part .contacts {
        padding-right: 0;
        width: auto
    }
}

.white-part .contacts .email a, .white-part .contacts .phone a {
    color: #002f3d;
    display: block;
    line-height: 25px
}

.white-part .contacts .phone a:first-of-type {
    color: #e4393e
}

.white-part .contacts .button {
    width: 160px;
    height: 33px;
    margin-top: 5px
}

.white-part .contacts .button a {
    line-height: 33px;
    font-size: 13px
}

.white-part .center {
    max-width: 540px;
    padding-top: 15px;
    font-size: 22px;
    color: #002f3d;
    line-height: 24px;
    text-align: left
}

@media (max-width: 1100px) and (min-width: 768px) {
    .white-part .center {
        max-width: 480px
    }
}

@media (max-width: 767px) and (min-width: 426px) {
    .white-part .center {
        max-width: 260px;
        font-size: 19px
    }
}

@media (max-width: 425px) {
    .white-part .center {
        display: none
    }
}

.dark-part {
    background-color: #002f3d;
    position: relative
}

.dark-part.fixed {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 5
}

.dark-part .navbar {
    border: none;
    min-height: auto;
    margin: 0;
    position: static;
    height: 50px
}

.dark-part .navbar #main-menu {
    box-shadow: none
}

.dark-part .navbar #main-menu .nav li a {
    padding: 15px 11px;
    color: #fff;
    font-size: 14px;
}

@media (max-width: 1100px) and (min-width: 768px) {
    .dark-part .navbar #main-menu .nav li a {
        padding-left: 17px;
        padding-right: 17px
    }
}

.dark-part .navbar #main-menu .nav li a:active, .dark-part .navbar #main-menu .nav li a:focus, .dark-part .navbar #main-menu .nav li a:hover, .dark-part .navbar #main-menu .nav li.open > a:active, .dark-part .navbar #main-menu .nav li.open > a:focus, .dark-part .navbar #main-menu .nav li.open > a:hover {
    background-color: #004054;
    border: none
}

.dark-part .navbar #main-menu .nav .dropdown:hover .dropdown-menu {
    display: block
}

.dark-part .navbar #main-menu .nav .dropdown-menu {
    background-color: #ececec;
    padding: 11px 5px;
    border: none;
    border-radius: 0;
    box-shadow: none;
    width: auto;
}

.dark-part .navbar #main-menu .nav .dropdown-menu.first {
    padding: 8px 0 8px 15px
}

.dark-part .navbar #main-menu .nav .dropdown-menu.first > li {
    position: relative
}

.dark-part .navbar #main-menu .nav .dropdown-menu.first > li > a {
    position: relative;
    /*text-transform: uppercase;*/
    font-size: 13px;
    padding: 3px 0;
    background: 0 0;
    white-space: normal
}

.dark-part .navbar #main-menu .nav .dropdown-menu.first > li > a:before {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background-color: #e31e24;
    left: -8px;
    content: "";
    display: block;
    position: absolute;
    top: 10px
}

.dark-part .navbar #main-menu .nav .dropdown-menu.first > li.parent-point > a:after {
    background: url(../img/general/tick.png) 50% 50% no-repeat;
    width: 8px;
    height: 12px;
    content: "";
    display: inline-block;
    margin-left: 10px
}

.dark-part .navbar #main-menu .nav .dropdown-menu.first > li.parent-point > a:after {
    background: url(../img/general/tick.png) 50% 50% no-repeat;
    width: 8px;
    height: 12px;
    content: "";
    display: inline-block;
    margin-left: 10px
}

.dark-part .navbar #main-menu .inner-menu li.parent-point > a > span {
    margin-right: 10px;
    background: url(../img/general/tick.png) 50% 50% no-repeat;
    width: 8px;
    height: 12px;
    content: "";
    display: inline-block;
    margin-left: 10px
}

.dark-part .navbar #main-menu .nav .dropdown-menu.first li.parent-point:hover > .inner-menu {
    display: block
}

.dark-part .navbar #main-menu .nav .dropdown-menu .inner-menu {
    list-style: none;
    display: none;
    position: absolute;
    width: auto;
    left: 100%;
    border-left: 2px solid #002f3d;
    top: 0;
    padding: 5px 7px;
    background-color: #ececec
}

.dark-part .navbar #main-menu .nav .dropdown-menu .inner-menu a {
    padding: 5px 0;
    display: block;
    text-transform: none;
    font-size: 14px;
    line-height: 12px
}

.dark-part .navbar #main-menu .nav .dropdown-menu .inner-menu a:hover {
    background: 0 0
}

.dark-part .navbar #main-menu .nav .dropdown-menu a {
    color: #002f3d;
    padding-left: 0;
    padding-right: 0
}

@media (max-width: 767px) {
    .dark-part .navbar #main-menu {
        position: absolute;
        width: 100%;
        left: 0;
        top: 100%;
        padding: 0 30px 20px;
        background-color: #002f3d;
        z-index: 2;
        box-shadow: none
    }

    .dark-part .navbar #main-menu .nav {
        margin: 0
    }
}

@media (max-width: 767px) and (min-width: 426px) {
    .dark-part .navbar .navbar-header {
        display: inline-block
    }

    .dark-part .navbar .navbar-header .navbar-toggle {
        margin-left: 30px
    }

    .dark-part .navbar .navbar-header .navbar-toggle span {
        background-color: #fff
    }
}

@media (max-width: 425px) {
    .dark-part .navbar .navbar-header {
        display: inline-block
    }

    .dark-part .navbar .navbar-header .navbar-toggle {
        margin-left: 0
    }

    .dark-part .navbar .navbar-header .navbar-toggle span {
        background-color: #fff
    }
}

.dark-part .search {
    width: 30px;
    height: 50px;
    background: url(../img/general/search.png) 50% 50% no-repeat;
    margin-right: 40px;
    position: relative
}

.dark-part .search a {
    display: block;
    width: 100%;
    height: 100%
}

@media (max-width: 767px) and (min-width: 426px) {
    .dark-part .search {
        margin-top: 8px;
        margin-bottom: 8px
    }
}

@media (max-width: 425px) {
    .dark-part .search {
        margin-right: 0
    }
}

.dark-part .search .search-wrap {
    position: absolute;
    display: none;
    top: 0;
    right: -20px;
    height: 100%;
    padding: 5px 20px 5px 5px;
    width: 190px;
    border: 1px solid navy;
    background: #fff;
    white-space: nowrap
}

.dark-part .search .search-wrap input {
    border: none;
    border-bottom: 1px solid #002f3d;
    outline: 0;
    display: inline-block;
    height: 25px;
    width: 125px;
    box-shadow: none;
    border-radius: 0;
    margin: 0
}

.dark-part .search .search-wrap button {
    display: inline-block;
    border: none;
    background: 0 0;
    box-shadow: none
}

.dark-part .search .search-wrap button img {
    max-width: 19px
}

@media (max-width: 425px) {
    .dark-part .search .search-wrap {
        right: -15px;
        width: 200px
    }
}

.dark-part .search .search-close {
    position: absolute;
    top: 3px;
    right: -15px;
    background: url(../img/general/search-close.png) 50% 50% no-repeat;
    width: 11px;
    height: 11px;
    cursor: pointer;
    display: none
}

@media (max-width: 425px) {
    .dark-part .search .search-close {
        right: -10px
    }
}

.slider-wrap .slider {
    position: relative
}

.slider-wrap .slider .slide {
    height: 480px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover
}

.slider-wrap .slider .slide .container {
    height: 100%;
    position: relative
}

.slider-wrap .slider .slide h1 {
    width: 540px;
    text-align: center;
    margin: 170px auto 130px
}

@media (max-width: 425px) {
    .slider-wrap .slider .slide h1 {
        width: auto;
        margin-bottom: 80px
    }
}

.slider-wrap .slider .slide .button {
    margin: 0 auto
}

@media (max-width: 425px) {
    .slider-wrap .slider .slide .button a {
        font-size: 18px
    }
}

.slider-wrap .slick-dots {
    list-style: none;
    padding: 0;
    margin: 0;
    position: absolute;
    bottom: 20px;
    text-align: center;
    left: 50%;
    transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%)
}

.slider-wrap .slick-dots li {
    display: inline-block;
    width: 15px;
    height: 15px;
    background-color: #002f3d;
    margin: 0 2px;
    cursor: pointer
}

.slider-wrap .slick-dots li.slick-active {
    background-color: #fff
}

.slider-wrap .slick-dots li button {
    display: none
}

.hot-wrap {
    padding-top: 35px
}

.hot-wrap .hot {
    position: relative
}

@media screen and (min-width: 1101px) {
    .hot-wrap .hot {
        width: 28%
    }

    .hot-wrap .hot:nth-of-type(2), .hot-wrap .hot:nth-of-type(3n+2) {
        margin-left: 8%;
        margin-right: 8%
    }

    .hot-wrap .hot h2 {
        font-size: 25px
    }
}

.hot-wrap .hot img {
    width: 100%
}

.hot-wrap .hot h2 {
    padding: 18px;
    line-height: 1;
    background-color: #002f3d;
    color: #fff;
    text-align: center;
    position: relative;
    z-index: 2
}

.hot-wrap .hot .hidden-text {
    position: absolute;
    background: rgba(255, 255, 255, .7);
    padding: 10px;
    color: #002f3d;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    line-height: 25px;
    opacity: 0;
    -webkit-transition: all .5s ease-out 0s;
    -moz-transition: all .5s ease-out 0s;
    -o-transition: all .5s ease-out 0s;
    transition: all .5s ease-out 0s
}

.hot-wrap .hot:hover .hidden-text {
    opacity: 1
}

.wrap {
    padding-top: 35px
}

.wrap .advantages h3 {
    color: #e4393e;
    text-align: center
}

.wrap .advantages ul {
    padding: 25px 0 22px;
    list-style: none;
    margin: 0
}

.wrap .advantages ul li {
    background-repeat: no-repeat;
    background-position: 0 50%;
    display: block;
    height: 70px;
    font-size: 22px;
    line-height: 1;
    padding: 21px 0 21px 95px
}

.wrap .advantages ul li + li {
    margin-top: 5px
}

@media (max-width: 1100px) and (min-width: 768px) {
    .wrap .advantages ul li {
        height: 59px;
        background-size: auto 55px
    }
}

@media (max-width: 767px) and (min-width: 426px) {
    .wrap .advantages ul li {
        height: 43px;
        font-size: 22px;
        background-size: auto 40px
    }
}

.wrap .advantages .button {
    width: 298px;
    margin: 0 auto
}

.wrap .video img {
    width: 100%
}

.wrap .video .button {
    width: 268px;
    margin: 25px auto 0;
    margin-top: 40%;
}

@media (max-width: 767px) and (min-width: 426px) {
    .wrap .video .button {
        margin-top: 28px
    }
}

.realized-wrap {
    padding-top: 35px
}

.realized-wrap h3 {
    color: #002f3d;
    text-align: center
}

.realized-wrap .row {
    padding-top: 10px
}

.realized-wrap .row a {
    color: #fff
}

.realized-wrap .row h4 {
    padding: 14px;
    line-height: 1;
    background-color: #002f3d;
    color: #fff;
    text-align: center;
    position: relative;
    z-index: 2
}

.realized-wrap .text-block {
    padding: 40px 0
}

.realized-wrap .text-block p {
    line-height: 26px;
    font-size: 18px
}

.feedback-wrap {
    background-color: #002f3d;
    padding: 10px 0 35px
}

.feedback-wrap h3 {
    color: #fff;
    margin-bottom: 25px
}

.feedback-wrap .sertificates img {
    width: 100%
}

.feedback-wrap .sertificates .button {
    width: 270px;
    margin: 50px auto 0
}

.feedback-wrap .sertificates .button a {
    font-size: 17px
}

.feedback-wrap .feedback .review {
    padding: 1px 7px 7px;
    background-color: #fff
}

.feedback-wrap .feedback .review h4 {
    color: #002f3d;
    text-transform: uppercase;
    margin-bottom: 5px
}

.feedback-wrap .feedback .review p {
    line-height: 21px
}

.feedback-wrap .feedback .review + .review {
    margin-top: 10px
}

@media (max-width: 767px) and (min-width: 426px) {
    .feedback-wrap {
        padding-top: 35px
    }

    .feedback-wrap .column-2 {
        width: 100%
    }

    .feedback-wrap .column-2 + .column-2 {
        margin-top: 35px
    }
}

footer {
    background-color: #ebecec;
    text-align: center;
    padding: 10px;
    color: #002f3d
}

footer .first {
    width: 335px;
    text-align: left
}

footer .first .red-tick {
    padding: 0 0 0 15px;
    list-style-image: url(../img/general/tick.png);
    margin: 0
}

footer .first .red-tick > li {
    /*text-transform: uppercase;*/
    font-size: 14px
}

footer .first .red-tick > li ul {
    list-style: none;
    padding: 0;
    margin: 0
}

footer .first .red-tick > li ul li {
    width: 50%;
    float: left;
    font-size: 12px
}

footer .first .red-tick > li ul:after {
    content: "";
    clear: both;
    display: block
}

footer .first .red-tick > li + li {
    margin-top: 10px
}

footer .first .red-tick a {
    color: #002f3d
}

footer .first .copyright {
    margin-top: 15px;
    font-size: 12px;
    line-height: 17px;
    color: #e4393e;
    /*text-transform: uppercase*/
}

footer .first .site-map {
    font-size: 10px;
    color: #002f3d;
    /*text-transform: uppercase*/
}

footer .center {
    display: inline-block;
    padding-top: 20px
}

footer .center .button + .button {
    margin-top: 30px
}

footer .center .social {
    margin-top: 15px
}

footer .center .social p {
    font-size: 14px;
/*    text-transform: capitalize;*/
    color: #002f3d
}

footer .center .social ul {
    list-style: none;
    padding: 0;
    margin: 10px 18px 0;
    text-align: justify
}

footer .center .social ul li {
    display: inline-block
}

footer .contacts {
    text-align: left;
    width: 215px;
    font-size: 14px;
    line-height: 17px
}

footer .contacts .email {
    padding-left: 8px
}

footer .contacts .email a {
    color: #e4393e
}

footer .contacts .phone {
    display: table;
    border-collapse: separate;
    border-spacing: 9px 0
}

footer .contacts .phone > div {
    display: table-row
}

footer .contacts .phone > div a {
    display: table-cell;
    text-transform: uppercase;
    color: #002f3d
}

.breadcrumb {
    padding: 20px 0;
    background: 0 0;
    margin: 0
}

.breadcrumb ul {
    list-style: none;
    padding: 0 40px;
    margin: 0
}

@media (max-width: 425px) {
    .breadcrumb ul {
        padding: 0 10px
    }
}

.breadcrumb ul li {
    display: inline-block;
    text-transform: uppercase;
    font-size: 11px;
}

.breadcrumb ul li + li {
    margin-left: 17px;
    position: relative;
    font-size: 11px;
}

.breadcrumb ul li + li:before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 100%;
    position: absolute;
    background: url(../img/general/tick.png) 0 50% no-repeat;
    top: 0;
    left: -14px
}

.breadcrumb ul a {
    color: #002f3d
}

.catalog .container {
    padding: 0 50px
}

@media (max-width: 767px) and (min-width: 426px) {
    .catalog .container {
        padding: 0 30px
    }
}

@media (max-width: 425px) {
    .catalog .container {
        padding: 0 10px
    }
}

.catalog .container .section-part {
    width: 695px;
    padding-bottom: 25px
}

@media (max-width: 1100px) and (max-width: 768px) {
    .catalog .container .section-part {
        width: 69%
    }
}

@media (max-width: 767px) {
    .catalog .container .section-part {
        float: none;
        width: 100%;
        padding-top: 20px
    }
}

.catalog .container .section-part p {
    font-size: 17px;
    color: #000;
    text-align: justify;
}

.catalog .container .section-part p + p {
    margin-top: 10px
}

@media (max-width: 425px) {
    .catalog .container .section-part p {
        font-size: 18px
    }
}

.catalog .container .section-part form p {
    font-size: 17px;
    color: #002f3d;
    line-height: 16px;
    margin: 10px 0
}

.catalog .container .section-part form p.semititle {
    font-size: 18px;
    text-align: center;
    line-height: normal
}

@media (max-width: 425px) {
    .catalog .container .section-part form .input-wrap .column-3 + .column-3 {
        margin-top: 10px
    }
}

.catalog .container .section-part .column-3 {
    width: 32.5%
}

.catalog .container .section-part .column-3:nth-of-type(2), .catalog .container .section-part .column-3:nth-of-type(3n+2) {
    margin-left: 1.25%;
    margin-right: 1.25%
}

@media (max-width: 425px) {
    .catalog .container .section-part .column-3 {
        width: 100%
    }

    .catalog .container .section-part .column-3:nth-of-type(2), .catalog .container .section-part .column-3:nth-of-type(3n+2) {
        margin-left: 0;
        margin-right: 0
    }
}

.catalog .container .section-part > div + div:not(.red-button-wrap) {
    margin-top: 20px
}

.catalog .container .section-part .section-title {
/*    text-transform: uppercase;*/
    font-size: 21px;
    color: #002f3d
}

.catalog .container .section-part .red-form {
    display: inline-block;
    width: 270px
}

.left-wrapper {
    width: 290px
}

@media (max-width: 1100px) and (max-width: 768px) {
    .left-wrapper {
        width: 30%
    }
}

@media (max-width: 767px) {
    .left-wrapper {
        float: none;
        width: 100%
    }
}

.left-wrapper .left-menu {
    padding: 15px 10px;
    background-color: #002f3d
}

@media (min-width: 768px) {
    .left-wrapper .left-menu .menu-head {
        display: none
    }
}

.left-wrapper .left-menu .menu-head {
    color: #fff;
    cursor: pointer
}

.left-wrapper .left-menu > ul {
    padding: 0 0 0 15px;
    margin: 0;
    list-style-image: url(../img/catalog/point.jpg)
}

@media (max-width: 767px) {
    .left-wrapper .left-menu > ul {
        display: none;
        padding-top: 15px
    }
}

/*.left-wrapper .left-menu > ul > li > a {
    text-transform: uppercase
}*/

.left-wrapper .left-menu > ul > li ul {
    padding: 0 0 0 10px
}

.left-wrapper .left-menu > ul > li ul > li > ul {
    padding: 0 0 0 10px;
    list-style: none
}

.left-wrapper .left-menu > ul > li ul {
    display: none
}

.left-wrapper .left-menu > ul li {
    font-size: 16px;
    list-style-image: url(../img/catalog/point.jpg)
}

@media (max-width: 767px) {
    .left-wrapper .left-menu > ul li {
        font-size: 16px
    }
}

.left-wrapper .left-menu > ul li a {
    color: #fff
}

.left-wrapper .left-menu > ul li.parent {
    list-style: url(../img/catalog/point2.jpg)
}

.left-wrapper .left-menu > ul li.parent.open {
    list-style: url(../img/catalog/point.jpg)
}

.left-wrapper .left-menu > ul li.current-link > ul, .left-wrapper .left-menu > ul li.open > ul {
    display: block
}

.left-wrapper > div + div {
    margin-top: 15px
}

.spheres .sphere {
    height: 65px;
    padding: 10px 5px 10px 40px;
    background-color: #002f3d;
    background-repeat: no-repeat;
    background-position: 7px 50%;
    background-size: 28px 35px
}

@media (max-width: 767px) and (min-width: 426px) {
    .spheres .sphere.column-3 {
        width: 100%;
        margin-bottom: 10px
    }

    .spheres .sphere.column-3:nth-of-type(2), .spheres .sphere.column-3:nth-of-type(3n+2) {
        margin-left: 0;
        margin-right: 0
    }
}

@media (max-width: 425px) {
    .spheres .sphere.column-3 {
        background-image: none !important;
        padding: 0;
        text-align: center
    }

    .spheres .sphere.column-3 a {
        line-height: 65px
    }
}

.spheres .sphere a {
    color: #fff;
    text-transform: uppercase;
    font-size: 16px
}

@media (min-width: 768px) {
    .spheres .sphere {
        margin-top: 0 !important;
        margin-bottom: 0 !important
    }
}

.spheres .sphere.inactive {
    background-color: #b2b3b3
}

.equipment .equip a {
    display: block;
    color: #fff
}

.equipment .equip a .bg {
    height: 185px;
    background-position: 50% 50%;
    background-size: cover;
    background-repeat: no-repeat
}

@media (max-width: 425px) {
    .equipment .equip a .bg {
        height: 290px
    }
}

.equipment .equip a .subsection-title {
    padding: 10px 5px;
/*    text-transform: uppercase;*/
    color: #002f3d;
    font-size: 18px;
    background-color: #f9f9f9;
    text-align: center
}

.advantages p {
    text-transform: uppercase;
    margin-bottom: 20px
}

@media (max-width: 425px) {
    .advantages p {
        text-align: center !important;
        font-size: 26px !important
    }
}

.advantages .advantage {
    width: 16%;
    text-align: center;
    padding: 5px 0 25px
}

.advantages .advantage + .advantage {
    margin-left: 5%
}

.advantages .advantage img {
    max-height: 70px
}

.advantages .advantage span {
    display: block;
    margin-top: 5px
}

@media (max-width: 425px) {
    .advantages .advantage {
        width: 49%
    }

    .advantages .advantage + .advantage {
        margin-left: 0
    }

    .advantages .advantage:nth-of-type(2n) {
        margin-left: 2%
    }
}

.red-button-wrap {
    text-align: center;
    margin-top: 35px
}

.faq > div {
    padding: 10px 15px
}

.question {
    background-color: #002f3d;
    color: #fff;
    font-size: 18px;
    cursor: pointer
}

.answer {
    display: none;
    background-color: #d9dbda
}

.answer p {
    color: #5b5b5b
}

.no-answer {
    margin-top: 85px;
    padding: 10px 15px
}

.no-answer p {
    color: #5b5b5b;
    margin-bottom: 25px
}

.page-navigation {
    padding: 25px 0 15px
}

.advantages-description + .red-button-wrap {
    margin-top: 75px
}

.red-form {
    padding: 10px 15px;
    background-color: red;
    text-align: center
}

.red-form a {
    color: #fff;
/*    text-transform: uppercase;*/
    font-size: 19px
}

.page-navigation {
    text-align: center;
    margin-top: 25px
}

.page-navigation ul {
    padding: 0;
    margin: 0;
    list-style: none
}

.page-navigation ul li {
    display: inline-block;
    width: 18px;
    line-height: 18px;
    background-color: #b2b3b3;
    font-size: 14px
}

.page-navigation ul li a {
    color: #002f3d
}

.page-navigation ul li.active {
    background-color: #002f3d;
    color: #fff
}

.documentation .column-3.document.left {
    width: 32%
}

.documentation .column-3.document.left:nth-of-type(2), .documentation .column-3.document.left:nth-of-type(3n+2) {
    margin-left: 2%;
    margin-right: 2%;
    text-align: center
}

.documentation .column-3.document.left:nth-of-type(3n) {
    text-align: right
}

.documentation .column-3.document.left + .document {
    margin-top: 0
}

.documentation .column-3.document.left:nth-of-type(3) ~ .document {
    margin-top: 10px
}

.documentation .column-3.document.left .image-wrap {
    max-width: 200px;
    max-height: 245px;
    height: auto;
    overflow: hidden
}

.documentation .column-3.document.left .image-wrap img {
    width: 100%
}

.usages .usage {
    width: 50%;
    margin: 10px 0
}

.usages .usage a {
    display: block;
    width: 235px;
    margin: 0 auto;
    color: #fff;
    line-height: 1.1
}

.usages .usage a .bg {
    height: 175px;
    background-position: 50% 50%;
    background-size: cover;
    background-repeat: no-repeat
}

.usages .usage a .subsection-title {
    padding: 10px 15px;
    text-transform: uppercase;
    color: #fff;
    font-size: 18px;
    background-color: #002f3d;
    text-align: center
}

@media (max-width: 425px) {
    .usages .usage {
        width: 100%;
        margin: 10px 0
    }

    .usages .usage a {
        width: 100%
    }

    .usages .usage a .bg {
        height: 285px
    }
}

.interesting-wrap {
    padding-top: 25px
}

.interesting-wrap .interesting {
    font-size: 21px;
    text-transform: uppercase;
    color: #002f3d;
    background: #d9dbda;
    text-align: center
}

.interesting-wrap ul {
    padding: 0;
    margin: 15px 0;
    list-style: none
}

.interesting-wrap ul li a {
    color: #b2b3b3;
    text-transform: uppercase;
    font-size: 17px
}

.buttons-row .left {
    width: 50%;
    margin: 10px 0
}

.buttons-row .left a {
    display: block;
    width: 235px;
    margin: 0 auto;
    color: #fff;
    line-height: 1.1
}

.buttons-row .left a .buttons-title {
    padding: 10px 5px;
    text-transform: uppercase;
    color: #fff;
    font-size: 20px;
    background-color: #002f3d;
    text-align: center;
    display: table-cell;
    vertical-align: middle
}

.buttons-row .left:nth-of-type(2) a .buttons-title {
    padding: 10px 25px;
    text-align: left;
    font-size: 14px
}

@media (max-width: 425px) {
    .buttons-row .left:nth-of-type(2) a .buttons-title {
        text-align: center;
        font-size: 18px
    }
}

@media (max-width: 425px) {
    .buttons-row .left {
        width: 100%
    }

    .buttons-row .left a {
        width: 100%;
        display: table
    }

    .buttons-row .left a .buttons-title {
        width: 100%;
        font-size: 24px
    }
}

.reviews-table {
    display: table
}

.reviews-table .review {
    display: table-row
}

.reviews-table .review > div {
    display: table-cell;
    vertical-align: top;
    padding-bottom: 25px
}

.reviews-table .review > div.photo {
    width: 25%;
    padding-right: 25px
}

.reviews-table .review > div.photo img {
    width: 100%;
    margin: 5px 0;
}

@media (max-width: 425px) {
    .reviews-table .review > div.photo {
        display: none
    }
}

.reviews-table .review > div .title {
    font-size: 21px;
    color: #002f3d
}

.reviews-table .review > div .title + p {
    margin-top: 10px
}

.reviews-table.info .review > div {
    padding-bottom: 35px
}

.reviews-table.info .review > div.photo {
    width: 28%
}

.reviews-table.info .review > div .title {
    text-transform: uppercase
}

.species {
    padding: 20px 0
}

.species .spec {
    background: #002f3d;
    padding: 10px 5px;
    text-align: center;
    font-size: 17px
}

.species .spec a {
    color: #fff;
    text-transform: uppercase
}

.contacts .container {
    padding: 0 50px
}

.contacts .map {
    width: 64%;
    height: 400px
}

@media (max-width: 767px) {
    .contacts .map {
        float: none;
        width: 100%
    }
}

.contacts .contacts-text {
    width: 34%
}

.contacts .contacts-text .title {
    text-transform: uppercase
}

@media (max-width: 767px) {
    .contacts .contacts-text .title {
        font-size: 26px
    }
}

.contacts .contacts-text p {
    line-height: 1.2;
    color: #002f3d;
    font-size: 18px
}

.contacts .contacts-text p + p {
    margin-top: 30px
}

@media (max-width: 767px) {
    .contacts .contacts-text {
        float: none;
        width: 100%;
        padding: 35px 0 15px;
        text-align: center
    }
}

.project .project-element {
    text-align: center
}

.project .project-element img {
    display: inline-block
}

.project .slick-next, .project .slick-prev {
    width: 55px;
    height: 56px;
    position: absolute;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    top: 50%;
    transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    cursor: pointer;
    z-index: 2
}

.project .slick-next {
    right: 0;
    background-image: url(../img/element/next.jpg)
}

.project .slick-prev {
    left: 0;
    background-image: url(../img/element/back.jpg)
}

.popup {
    position: fixed;
    right: 0;
    bottom: 0;
    top: 0;
    left: 0;
    z-index: 10;
    display: none;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    background: rgba(0, 0, 0, .5);
}

.popup .popup-shadow {
    width: 100%;
    height: 100%;
}

.popup .popup-shadow .popup-container {
    width: 300px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%)
}

.popup .popup-shadow .popup-container.too-big {
    top: 25px;
    transform: translateX(-50%) translateY(0);
    -moz-transform: translateX(-50%) translateY(0);
    -ms-transform: translateX(-50%) translateY(0);
    -webkit-transform: translateX(-50%) translateY(0);
    -o-transform: translateX(-50%) translateY(0)
}

.popup .popup-shadow .popup-container.survey {
    width: 435px
}

.popup .popup-shadow .popup-container.survey .popup-body {
    padding: 30px 25px
}

@media (max-width: 425px) {
    .popup .popup-shadow .popup-container.survey {
        width: 100%
    }
}

.popup .popup-shadow .popup-container .popup-body {
    background: #eceded;
    padding: 8px 5px
}

.popup .popup-shadow .popup-container .popup-close {
    position: absolute;
    top: 11px;
    right: 7px;
    background: url(../img/general/search-close.png) 50% 50% no-repeat;
    width: 11px;
    height: 11px;
    cursor: pointer
}

.popup .popup-shadow .popup-container h4 {
    font-size: 24px;
    color: #002f3d;
    text-transform: uppercase;
    text-align: center;
    margin-bottom: 15px
}

.popup .popup-shadow .popup-container form .input-wrap + .input-wrap {
    margin-top: 18px
}

form:not(#search, #podborForm) h4 {
    font-size: 18px;
    color: #002f3d;
    text-transform: uppercase;
    text-align: center;
    margin-bottom: 10px
}

form:not(#search, #podborForm) input {
    display: block;
    height: 28px;
    background: #dbdbdb;
    width: 100%;
    border: none;
    padding: 0 5px;
    font-size: 18px;
    color: #212121
}

form:not(#search, #podborForm) input::-webkit-input-placeholder {
    color: #212121
}

form:not(#search, #podborForm) input::-moz-placeholder {
    color: #212121
}

form:not(#search, #podborForm) input:-moz-placeholder {
    color: #212121
}

form:not(#search, #podborForm) input:-ms-input-placeholder {
    color: #212121
}

form:not(#search, #podborForm) label {
    display: block;
    font-size: 17px;
    color: #002f3d;
    margin-bottom: 0
}

form:not(#search, #podborForm) .input-wrap {
    position: relative
}

form:not(#search, #podborForm) textarea {
    display: block;
    background: #dbdbdb;
    width: 100%;
    border: none;
    resize: none;
    height: 60px
}

form:not(#search, #podborForm) input[type=file] {
    position: absolute;
    z-index: 1;
    width: 225px;
    height: 100%;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    opacity: 0;
    filter: alpha(opacity=0)
}

form:not(#search, #podborForm) label[for=file] {
    margin: 0 !important
}

form:not(#search, #podborForm) .download-imitation {
    width: 225px;
    margin: 0 auto;
    padding: 5px 12px;
    background: #dbdbdb
}

form:not(#search, #podborForm) .download-imitation .download {
    padding: 3px 12px;
    color: #747474;
    font-size: 14px;
    background: #eceded;
    line-height: 1
}

form:not(#search, #podborForm) .download-imitation .download-text {
    color: #747474;
    font-size: 14px;
    line-height: 1;
    padding: 3px 0
}

form:not(#search, #podborForm) .captcha {
    text-align: center
}

form:not(#search, #podborForm) button[type=submit] {
    width: 225px;
    margin: 0 auto;
    background: #002f3d;
    color: #fff;
    font-size: 24px;
    text-transform: uppercase;
    height: 40px;
    display: block;
    border: none
}

form:not(#search, #podborForm) .asterisk {
    color: #e31e24;
    font-size: 18px;
    line-height: inherit;
    vertical-align: text-top
}

form:not(#search, #podborForm) .input-table {
    display: table;
    width: 100%
}

form:not(#search, #podborForm) .input-table .input-table-row {
    display: table-row
}

form:not(#search, #podborForm) .input-table label {
    display: table-cell;
    font-size: 17px;
    vertical-align: middle;
    line-height: 16px
}

form:not(#search, #podborForm) .input-table label[for=accept] {
    font-size: 13px;
    line-height: 1;
    padding: 0 5px
}

form:not(#search, #podborForm) .input-table input {
    display: table-cell
}

form:not(#search, #podborForm) .input-table input[type=checkbox] {
    width: 12px;
    vertical-align: middle;
    border: 1px solid #000;
    border-radius: 0;
    margin: 0
}

form:not(#search, #podborForm) .input-table.half-half {
    height: 32px
}

form:not(#search, #podborForm) .input-table.half-half label {
    width: 49%;
    line-height: 16px
}

form:not(#search, #podborForm) .group-input + .group-input {
    margin-top: 10px
}

form:not(#search, #podborForm) input[type=radio] {
    position: absolute;
    opacity: 0;
    height: 100%
}

form:not(#search, #podborForm) input[type=radio] + label {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 1px solid #002f3d;
    padding: 0;
    min-height: initial;
    display: inline-block
}

form:not(#search, #podborForm) input[type=radio] + label.herm {
    vertical-align: middle
}

form:not(#search, #podborForm) input[type=radio] + label.herm + span {
    vertical-align: middle
}

form:not(#search, #podborForm) input[type=radio] + label + span {
    font-size: 17px;
    color: #002f3d;
    display: inline-block;
    vertical-align: text-top;
    max-width: 240px;
    line-height: 16px;
    padding-left: 5px
}

form:not(#search, #podborForm) input[type=radio]:checked + label {
    background: url(../img/general/radio2.png) 50% 50% no-repeat
}

form:not(#search, #podborForm) span {
    font-size: 17px;
    color: #002f3d;
    line-height: 16px;
    vertical-align: middle
}

@media (max-width: 425px) {
    form:not(#search, #podborForm) .input-wrap + .input-wrap {
        margin-top: 10px
    }
}

.auto .string {
    text-align: right
}

.auto .string .letter {
    padding-right: 0
}

.auto .string .letter + .letter {
    margin-left: 15px
}

.string {
    text-align: center
}

.string .letter {
    display: inline-block;
    max-width: 310px;
    text-align: left;
    vertical-align: top;
    padding-right: 30px
}

.string .letter + .letter {
    margin-top: 0 !important
}

@media (max-width: 425px) {
    .string .letter {
        padding-right: 0
    }
}

.string.middle .letter {
    vertical-align: middle
}

.section-part form .input-wrap + .input-wrap {
    margin-top: 0
}

.section-part form label {
    line-height: 1
}

.section-part form .row + .row {
    margin-top: 10px
}

.section-part form .row .input-wrap:not(:first-of-type) {
    margin-top: 10px
}

@media (min-width: 426px) {
    .section-part form .row .input-wrap.left, .section-part form .row .input-wrap.right {
        margin-top: 0
    }

    .section-part form .row .input-wrap.left.column-2:nth-of-type(2n) ~ .column-2, .section-part form .row .input-wrap.right.column-2:nth-of-type(2n) ~ .column-2 {
        margin-top: 10px
    }
}

.section-part form .row .input-wrap:after {
    content: "";
    display: block;
    clear: both
}

.section-part form .row .input-wrap.big label {
    font-size: 17px
}

.section-part form input[type=text]::-webkit-input-placeholder {
    color: #747474;
    font-size: 14px;
    text-align: center
}

.section-part form input[type=text]::-moz-placeholder {
    color: #747474;
    font-size: 14px;
    text-align: center
}

.section-part form input[type=text]:-moz-placeholder {
    color: #747474;
    font-size: 14px;
    text-align: center
}

.section-part form input[type=text]:-ms-input-placeholder {
    color: #747474;
    font-size: 14px;
    text-align: center
}

.topic {
    background: 7px 50% no-repeat #002f3d;
    font-size: 22px;
    padding-left: 65px;
    display: table;
    width: 100%;
    height: 55px
}

.topic + .topic {
    margin-top: 15px
}

.topic a {
    color: #fff;
    text-transform: uppercase;
    line-height: 17px;
    vertical-align: middle;
    padding: 9px 0;
    display: table-cell
}

.topic a small {
    text-transform: none
}

.topic small {
    font-size: 15px
}

.up-link {
    position: fixed;
    left: 87%;
    bottom: 5%;
    display: none
}

.block {
    display: block
}

.table {
    display: table
}

.table .table-cell {
    display: table-cell
}

.with-pad {
    padding-left: 10px
}

@media (max-width: 425px) {
    .with-pad {
        padding: 0
    }
}

.thanks h3 {
    color: #002f3d;
    text-transform: none;
    text-align: center
}

.city-list .popup-shadow .popup-container {
    max-width: 750px;
    width: 90%
}

.city-list .popup-shadow .popup-container .popup-body {
    padding: 10px
}

.city-list .popup-shadow .popup-container h3 {
    text-align: center;
    margin-bottom: 15px
}

.city-list .popup-shadow .popup-container ul {
    column-count: 3;
    -moz-column-count: 3;
    -webkit-column-count: 3;
    list-style: none
}

@media (max-width: 769px) {
    .city-list .popup-shadow .popup-container ul {
        column-count: 2;
        -moz-column-count: 2;
        -webkit-column-count: 2
    }
}

.container .knopka {
    color: #fff; /* цвет текста */
    text-decoration: none; /* убирать подчёркивание у ссылок */
    user-select: none; /* убирать выделение текста */
    background: #ff0000; /* фон кнопки */
    outline: none; /* убирать контур в Mozilla */
    padding: 5px;
}

.knopka a {
    color: #fff;
    font-size: 19px;
    padding: 5px 5px;
    text-decoration: none;
}

.knopka {
    text-align: center;
    padding: 10px 10px;
    background-color: #ff0000;
}

.container .knopka:hover {
    background: #002f3d;
}

/* при наведении курсора мышки */
.container .knopka:active {
    background: #002f3d;
}

/* при нажатии */
.container .knopka a:hover {
    background: #002f3d;
}

/* при наведении курсора мышки */
.container .knopka a:active {
    background: #002f3d;
}

/* при нажатии */

.knopka-otstup {
    text-align: center;
    margin-top: 15px;
    margin-bottom: 15px;
}

.knopka-otstup1 {
    text-align: left;
	margin-left: 5px;
    margin-top: 15px;
    margin-bottom: 0px;
}

.knopka-otstup2 {
    text-align: left;
	margin-left: 10px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.blokprice {
    box-shadow: -2px 30px 50px -20px #333;
    height: 100px;
    width: 250px;
    border: 1px solid #dfdfdf;
    padding: 20px;
    margin: 15px;
}

.video-banner {
    height: 360px;
    display: none;
}

.video-banner iframe {
    width: 100%;
    height: 360px;
}

a.show_result {
    display: none;
}

.box {
    width: 1080px;
    margin: auto;
    margin-bottom: 10px;
    margin-left: 5px;
}

.block {
    width: 33%;
    height: 100px;
    box-sizing: border-box;
    display: inline-block;
}

.block_1 {
    float: none;
}

.block_2 {
    float: left;
}

.block_3 {
    float: right;
}

@media only screen and (max-width: 600px) {
    .block {
        float: none;
        width: 85%;
        margin: 1em auto;
    }
}

.advantages p {
    text-transform: uppercase;
    margin-bottom: 20px;
    color: #002f3d;
}

@media (max-width: 425px) {
    .advantages p {
        text-align: center !important;
        font-size: 26px !important
    }
}

.advantages .advantageabout {
    width: 30%;
    text-align: center;
    padding: 5px 0 25px;
}

.advantages .advantageabout + .advantageabout {
    margin-left: 5%
}

.advantages .advantageabout img {
    max-height: 100%
}

.advantages .advantageabout span {
    display: block;
    margin-top: 5px;
    font-size: 18px !important;
    text-align: center;
}

@media (max-width: 425px) {
    .advantages .advantageabout {
        width: 49%
    }

    .advantages .advantageabout + .advantageabout {
        margin-left: 0
    }

    .advantages .advantageabout:nth-of-type(2n) {
        margin-left: 2%
    }
}

.text {
    font-size: 10px;
    color: #5b5b5b;
    margin: 0;
}

.column-40 {
    width: 25%
}

.advantagespoisk p {
    text-transform: uppercase;
    margin-bottom: 20px;
    color: #002f3d;
}

.advantageswork p {
    text-transform: uppercase;
    margin-bottom: 20px;
    color: #002f3d;
}

@media (max-width: 425px) {
    .advantagespoisk p {
        text-align: center !important;
        font-size: 26px !important
    }
}

.advantagespoisk .advantagepoisk {
    width: 30%;
    text-align: center;
    padding: 5px 0 25px
}

.advantagespoisk .advantagepoisk + .advantagepoisk {
    margin-left: 5%
}

.advantagespoisk .advantagepoisk img {
    max-height: 100%
}

.advantagespoisk .advantagepoisk span {
    display: block;
    margin-top: 5px;
    font-size: 18px !important;
    text-align: center;
}

@media (max-width: 425px) {
    .advantagespoisk .advantagepoisk {
        width: 49%
    }

    .advantagespoisk .advantagepoisk + .advantagepoisk {
        margin-left: 0
    }

    .advantagespoisk .advantagepoisk:nth-of-type(2n) {
        margin-left: 2%
    }
}

.

@media (max-width: 425px) {
    .advantageswork p {
        text-align: center !important;
        font-size: 26px !important
    }
}

.advantageswork .advantagework {
    width: 16%;
    text-align: center;
    padding: 5px 0 25px
}

.advantageswork .advantagework + .advantagework {
    margin-left: 5%
}

.advantageswork .advantagework img {
    max-height: 100%
}

.advantageswork .advantagework span {
    display: block;
    margin-top: 5px;
    font-size: 18px !important;
    text-align: center;
}

@media (max-width: 425px) {
    .advantageswork .advantagework {
        width: 49%
    }

    .advantageswork .advantagework + .advantagework {
        margin-left: 0
    }

    .advantageswork .advantagework:nth-of-type(2n) {
        margin-left: 2%
    }
}

.
.advantages p {
    text-transform: uppercase;
    margin-bottom: 20px;
    color: #002f3d;
}

@media (max-width: 425px) {
    .advantages p {
        text-align: center !important;
        font-size: 26px !important
    }
}

.advantages .advantageaboutdil.advantages .advantageaboutdil + .advantageaboutdil {
    margin-left: 5%
}

.advantages .advantageaboutdil img {
    max-height: 100%;
    margin-left: 50px;
}

.advantages .advantageaboutdil span {
    display: block;
    margin-top: 5px;
    font-size: 18px !important;
    text-align: center;
}

@media (max-width: 425px) {
    .advantages .advantageaboutdil {
        width: 49%
    }

    .advantages .advantageaboutdil + .advantageaboutdil {
        margin-left: 0
    }

    .advantages .advantageaboutdil:nth-of-type(2n) {
        margin-left: 2%
    }
}

{
    width: 21%
;
    text-align: center
;
    padding: 5px 0 25px
;
}
.left-col {
    width: 40%; /* ширина */
    min-width: 180px; /* минимальная ширина сужения */
    height: auto; /* высота */
    box-sizing: border-box;
    float: left; /* плавающие блоки */
}

.right-col /* правая колонка */
{
    width: 60%; /* ширина */
    min-width: 180px; /* минимальная ширина сужения */
    height: auto; /* высота */
    box-sizing: border-box;
    float: left; /* плавающие блоки */
}

.left-col {
    padding-right: 2px; /* отступ справа */
}

.right-col {
    padding-left: 2px; /* отступ слева */
}

<
br > /*Cтили для маленьких мониторов*/

@media (max-width: 479px) {
    .left-col, /* левая колонка */
    .right-col /* правая колонка */
    {
        width: 100%; /* ширина */
    }

    .right-col {
        padding-left: 0px; /* отступ слева */
    }
}

/* clearfix сбрасывает float*/
.clearfix:after {
    content: " ";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.pricingdiv {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    font-family: 'Cuprum-Regular';
}

.pricingdiv ul.theplan {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    border-top-left-radius: 50px;
    border-bottom-right-radius: 50px;
    color: white;
    background: #002f3d;
    position: relative;
    width: 225px; /* width of each table */
    margin-right: 10px; /* spacing between tables */
    margin-bottom: 1em;
    transition: all .5s;
    font-size: 1.05em;
}

.pricingdiv ul.theplan:hover { /* when mouse hover over pricing table */
    transform: scale(1.05);
    transition: all .5s;
    z-index: 100;
    box-shadow: 0 0 10px gray;
}

.pricingdiv ul.theplan li {
    margin: 5px 5px;
    position: relative;
}

.pricingdiv ul.theplan li.title {
    font-size: 150%;
    font-weight: bold;
    text-align: center;
    margin-top: 20px;
    text-transform: uppercase;
    border-bottom: 5px solid white;
}

.pricingdiv ul.theplan:nth-of-type(2) {
    background: #002f3d;
}

.pricingdiv ul.theplan:nth-of-type(3) {
    background: #002f3d;
}

.pricingdiv ul.theplan:last-of-type { /* remove right margin in very last table */
    margin-right: 0;
}

/*very last LI within each pricing UL */
.pricingdiv ul.theplan li:last-of-type {
    text-align: center;
    margin-top: auto; /*align last LI (price botton li) to the very bottom of UL */
}

.pricingdiv a.pricebutton {
    background: white;
    text-decoration: none;
    padding: 10px;
    display: inline-block;
    margin: 10px auto;
    border-radius: 5px;
    color: #002f3d;
    text-transform: uppercase;
}

@media only screen and (max-width: 500px) {
    .pricingdiv ul.theplan {
        border-radius: 0;
        width: 100%;
        margin-right: 0;
    }

    .pricingdiv ul.theplan:hover {
        transform: none;
        box-shadow: none;
    }

    .pricingdiv a.pricebutton {
        display: block;
    }
}

.ball {
    list-style: none;
    margin: 0 20px 20px 20px;
}

.ball a {
    width: 100%;
    color: #000;
    text-decoration: none;
    display: inline-block;
    padding-left: 10px;
    height: 44px;
    font-size: 17px;
    position: relative;
    transition: .3s linear;
    padding-top: 5px;
}

.ball a:before {
    content: "";
    width: 20px;
    height: 20px;
    border-radius: 10%;
    background: #bdbdbd;
    position: absolute;
    left: -30px;
    top: 7px;
}

.ball li {
    position: relative;
}

.ball li:before {
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 30%;
    background: #fff;
    position: absolute;
    top: 12px;
    left: -30px;
    z-index: 2;
    transition: .4s ease-in-out;
}

.ball li:hover:before {
    left: -20px;
}

blockquote {
    background: linear-gradient(135deg, #ececec 50%, #fff 50%);
    padding: 50px 30px;
    text-align: center;
    position: relative;
    color: #49152C;
    padding: 30px 50px;
    font-family: 'Lato', sans-serif;
}

blockquote p {
    font-size: 22px;
    margin-top: 30px;
}

blockquote p:before {
    content: "\201C";
    font-size: 100px;
    color: #f00;
    font-family: serif;
    position: absolute;
    top: 0;
    left: 3%;
    transform: translateX(-50%);
}

blockquote cite {
    font-style: normal;
}


/* Style the Image Used to Trigger the Modal Gallery */
.row > .column {
  padding: 0 8px;
}

.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Create four equal columns that floats next to eachother */
.column {
  float: left;
  width: 25%;
}

/* The Modal (background) */
.modal {
  display: none;
  position: fixed;
  z-index: 1;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: black;
}

/* Modal Content */
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  width: 90%;
  max-width: 700px;
  /*  max-width: 700px; */
}

/* The Close Button */
.close {
  color: white;
  position: absolute;
  top: 10px;
  right: 25px;
  font-size: 35px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #999;
  text-decoration: none;
  cursor: pointer;
}

/* Hide the slides by default */
.mySlides {
  display: none;
}

/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
cursor: pointer;
  background-color: rgba(0, 0, 0, 0.8);
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* Caption text */
.caption-container {
  text-align: center;
  background-color: black;
  padding: 2px 16px;
  color: white;
}

img.demo {
  opacity: 0.6;
}

.active,
.demo:hover {
  cursor: pointer;
  opacity: 1;
}

img.hover-shadow {
  transition: 0.3s;
}

.hover-shadow:hover {
	cursor: pointer;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.ya-share2{
display: none !important;
}

.af__form-calculate-form{
display: none;
}
.af__form-calculate-header{
	cursor: pointer;
	position: relative;
	padding: 0;
	display: inline-block;
}

.af__form-calculate-header:before {
    content: '';
    position: absolute;
  
background-image: url(/local/templates/empty/img/catalog/point2.jpg)  ;
    width: 10px;
    height: 10px;
    right: -25px;
    top: 5px;
}

.af__form-calculate_opened .af__form-calculate-header:before {
	background: url(/local/templates/empty/img/catalog/point.jpg);
}
.af__form-calculate_opened .af__form-calculate-form{
display: block;
}

.wrap .advantages ul {
    display: flex;
    align-items: start;
    gap: 25px;
}
.hot-wrap h3{
	text-align: center;
}
.hot-wrap .hot{
	display: flex;
    flex-direction: column;
}
.hot-wrap .hot h2 {
    font-size: 22px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.realized h4 {
    font-size: 17px;
}
.af__flex-inline{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	flex-wrap: wrap;
}
.af__flex-inline.row:before,
.af__flex-inline.row:after{
	display: none;
}
.af__flex-inline .af__flex-inline-elem{
	display: flex;
	align-items: center;		
	flex: 0 0 32%;
}
.about .content .af__flex-inline.row{
	margin: 0;
}
.af__flex-inline .af__flex-inline-elem .content-wrap{
	display: flex;
	align-items: center;
	margin: 0;
	height: 190px !important;

}

.af__flex-inline .af__flex-inline-elem .img{
	flex: 0 0 90px;
	width: auto;
}	
.af__flex-inline .af__flex-inline-elem .info{
	flex: 1 0 60%;
	width: auto;
}	
ol.vote-answers-list {
    margin-top: 0.55em;
    padding-bottom: 20px!important;
}

@media (max-width: 1100px){
.wrap .advantages ul {
		flex-wrap: wrap;
    align-items: center;
    justify-content: center;

}
.wrap .advantages ul>li {
	flex: 0 0 48%;
}

.af__flex-inline .af__flex-inline-elem{	
	flex: 1 0 45%;
}
}


@media (max-width: 768px){
.wrap .advantages ul>li {
	flex: 0 0 100%;
}
.af__flex-inline .af__flex-inline-elem{	
	flex: 1 0 100%;
}
}