@charset "utf-8";

/*@import "../node_modules/normalize.css/normalize.css";*/

@import "../node_modules/slick-carousel/slick/slick.css";
@import "../node_modules/magnific-popup/dist/magnific-popup.css";
@import "callback-btn.css";
@import "callback-modal.css";
@import "typography.css";

/* Класс для увеличения картинки */

.zoom-img {}


/* Класс для галлереи */

.gallery {}


/* Класс для формы */

.form-submit-toggle {}


/* Класс для кнопки заказать звонок */

.callback-toggle {}


/******** Magnific-Popup *********/

.mfp-fade.mfp-bg {
    opacity: 0;
    transition: all 0.15s ease-out;
}

.mfp-fade.mfp-bg.mfp-ready {
    opacity: 0.8;
}

.mfp-fade.mfp-bg.mfp-removing {
    opacity: 0;
}

.mfp-fade.mfp-wrap .mfp-content {
    opacity: 0;
    transition: all 0.15s ease-out;
}

.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
    opacity: 1;
}

.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
    opacity: 0;
}


/**********************************/

.main {
    display: flex;
}

.component {
    width: 100%;
}

.left,
.right {
    width: 30%;
}

@font-face {
    font-family: 'Roboto-Bold';
    src: url(../fonts/Roboto-Bold.ttf) format('truetype');
}

@font-face {
    font-family: 'Roboto-Light';
    src: url(../fonts/Roboto-Light.ttf) format('truetype');
}

@font-face {
    font-family: 'Roboto-Medium';
    src: url(../fonts/Roboto-Medium.ttf) format('truetype');
}

@font-face {
    font-family: 'Roboto-Regular';
    src: url(../fonts/Roboto-Regular.ttf) format('truetype');
}

body {}

body p {
    margin-top: 0;
    font-family: "Roboto-Light";
    font-size: 16px;
    margin-bottom: 10px;
    color: #000;
    line-height: 1.3;
}

p.h1,
h1 {
    text-align: center;
    font-family: "Roboto-Medium";
    font-size: 30px;
    color: #000;
    margin-bottom: 35px;
    text-transform: uppercase;
    position: relative;
    padding-bottom: 22px;
}

p.h1:after,
h1:after {
    position: absolute;
    content: '';
    width: 225px;
    height: 3px;
    background: #f0a100;
    bottom: 0;
    left: calc(50% - 113px);
}

.wrapper {
    margin: 0 auto;
    min-height: 100%;
    position: relative;
    width: 100%;
    max-width: 1920px;
    min-width: 1200px;
    overflow: hidden;
}

.wrapper img {
    max-width: 100%;
}

.wrapper .container {
    width: 1170px;
}

.flexSA {
    display: flex;
    justify-content: space-around;
}

.flexSB {
    display: flex;
    justify-content: space-between;
}

.flexCenter {
    display: flex;
    justify-content: center;
}

.flexAI {
    display: flex;
    align-items: center;
}

.flexW {
    display: flex;
    flex-wrap: wrap;
}

.flexColumn {
    display: flex;
    flex-direction: column;
}

.flexStart {
    display: flex;
    justify-content: flex-start;
}

.flexEnd {
    display: flex;
    justify-content: flex-end;
}


/*Header*/

.topLine {
    padding: 15px;
}

.topLine p {
    margin-bottom: 0;
}

.infoNav {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.infoNav .imgW,
.phoneBlock .imgW {
    width: 23px;
    margin-right: 12px;
    text-align: center;
}

.infoNav a {
    font-size: 16px;
    color: #000;
    font-family: "Roboto-Light";
    text-decoration: none;
}

.phoneBlock {
    margin-left: 65px;
}

.mainWrap {
    background: #2d2d2d;
}

.phoneBlock p {
    font-family: "Roboto-Medium";
}

p.callback-toggle {
    font-family: "Roboto-Medium";
    color: #fff;
    padding: 12px 0;
    width: 195px;
    text-align: center;
    background: #f0a100;
    margin-bottom: 0;
    text-transform: uppercase;
    margin-top: 13px;
    cursor: pointer;
}

.mainWrap ul {
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0;
}

.mainWrap ul li {
    padding: 20px 0;
}

.mainWrap ul li a {
    font-size: 16px;
    color: #fff;
    text-transform: uppercase;
    display: block;
    text-align: center;
    text-decoration: none;
    font-family: "Roboto-Medium";
}


/*End Header*/


/*sliderTop*/

.sliderTop {
    position: relative;
    margin-bottom: 55px;
}

.topSlide {
    position: relative;
}

.sliderTop .slick-arrow {
    position: absolute;
    font-size: 0;
    border: none;
    width: 17px;
    height: 29px;
    top: calc(50% - 15px);
    z-index: 15;
}

.sliderTop .slick-next {
    background: url(../images/topSliderNext.png) no-repeat;
    right: 25px;
}

.sliderTop .slick-prev {
    background: url(../images/topSliderPrev.png) no-repeat;
    left: 25px;
}

.txtBlockAbs {
    position: absolute;
    left: 0;
    width: 100%;
}

.firstSlide {
    top: 55px;
}

.txtBlockAbs p {
    font-size: 30px;
    margin-bottom: 0;
    text-transform: uppercase;
}

.txtBlockAbs p.name {
    font-family: "Roboto-Bold";
}

.txtBlockAbs p.callback-toggle {
    font-size: 16px;
    margin-top: 30px;
}

.firstSlide .txtBlock {
    padding: 25px 30px 25px 40px;
    margin-left: -40px;
    border: 3px solid #f0a100;
}

.txtBlockAbs span {
    color: #fff;
    font-family: "Roboto-Bold";
    margin-bottom: 0;
}

.secondSlide {
    background: url(../images/slide2BG.png) no-repeat;
    padding: 30px 0 50px;
    top: 50px;
    background-position: left;
    background-size: auto 100%;
}

.secondSlide.txtBlockAbs p.callback-toggle {
    background: #fff;
    color: #f0a100;
}

.secondSlide .txtBlock p span {
    color: #fff;
    font-size: 44px;
    line-height: 1;
}

.threedSlide {
    top: 15px;
}

.threedSlide.txtBlockAbs p.callback-toggle {
    background: #fff;
    color: #f0a100;
}


/*End sliderTop*/


/*servicesBlock*/

.wrapNucServ {
    padding: 0 100px;
}

.wrapNucServ {
    margin-bottom: 30px;
}

.nucServ:hover {
    text-decoration: none;
}

.nucServ {
    text-align: center;
    width: 25%;
    margin-bottom: 15px;
}

.nucServ img {
    margin-bottom: 20px;
}

.nucServ p {
    font-family: "Roboto-Regular";
    text-transform: uppercase;
}


/*End servicesBlock*/


/*guardHomeBlock*/

.guardHomeBlock {
    background: #e8e8e8;
    min-height: 500px;
    padding: 40px 0 0;
    width: 100%;
    margin-bottom: 55px;
    /*overflow: hidden;*/
}

.rel {
    position: relative;
}

.leftGuard {
    position: absolute;
    bottom: 0;
    right: calc(50% + 375px);
}

.rightGuard {
    position: absolute;
    bottom: 0;
    left: calc(50% + 375px);
}

.guardHomeBlock .txtBlock {
    width: 585px;
    margin: 0 auto;
}

.guardHomeBlock .txtBlock p {
    text-align: justify;
}


/*End guardHomeBlock*/


/*whyChoiceUsBlock*/

.wrapNucChoice {
    margin-bottom: 55px;
}

.bgNucChoice {
    background: url(../images/whyChoiceUsBlockBg.png) no-repeat;
    background-position: left 55px;
}

.nucChoice {
    text-align: center;
}

.nucChoice img {
    margin-bottom: 40px;
}

.nucChoice p {
    font-family: "Roboto-Regular";
    padding-bottom: 22px;
    margin-bottom: 0;
    position: relative;
    height: 85px;
}

.nucChoice p:after {
    position: absolute;
    content: '';
    width: 145px;
    height: 3px;
    background: #f0a100;
    bottom: 0;
    left: calc(50% - 72px);
}


/*End whyChoiceUsBlock*/


/*reviewsBlock*/

.reviewsBlock {
    margin-bottom: 50px;
}

.slideRev p {
    margin-bottom: 0;
}

.reviewsBlock a.rev {
    width: 255px;
    display: block;
    margin: 30px 15px 0;
    text-align: center;
    color: #fff;
    font-family: "Roboto-Medium";
    padding: 12px 0;
    background: #f0a100;
    text-transform: uppercase;
}

.topInfo {
    display: flex;
    justify-content: space-between;
    padding: 0 0 10px;
    border-bottom: 3px solid #f0a100;
    align-items: flex-end;
}

.topInfo p.name {
    font-family: "Roboto-Bold";
    font-size: 24px;
}

.slideRev {
    background: #e8e8e8;
    padding: 15px;
    margin: 0 18px 15px;
    position: relative;
}

.slideRev:after {
    height: 100%;
    position: absolute;
    width: calc(100% + 26px);
    left: -13px;
    content: '';
    bottom: -15px;
    border: 3px solid #f0a100;
    z-index: -1;
}

.contentRev {
    padding: 10px 0;
}

.sliderRev {
    position: relative;
}

.sliderRev .slick-arrow {
    position: absolute;
    font-size: 0;
    border: none;
    width: 17px;
    height: 29px;
    top: calc(50% - 15px);
    z-index: 15;
}

.sliderRev .slick-next {
    background: url(../images/revSliderNext.png) no-repeat;
    right: -30px;
}

.sliderRev .slick-prev {
    background: url(../images/revSliderPrev.png) no-repeat;
    left: -30px;
}


/*End reviewsBlock*/


/*footer*/

footer {
    background: #2d2d2d;
    padding: 25px 0 20px;
}

footer p {
    color: #fff;
}

footer a {
    color: #fff;
}

.leftFooter p:first-child {
    font-family: "Roboto-Light";
}

.leftFooter p,
.leftFooter a {
    font-family: "Roboto-Regular";
    font-size: 16px;
    text-decoration: none;
}

.footInfoWrap .imgW {
    width: 23px;
    margin-right: 12px;
    text-align: center;
}

.footInfoWrap .infoNav a {
    color: #fff;
}

.footInfoWrap p {
    margin-bottom: 0;
}

.footInfoWrap .phoneBlock {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}


/*End footer*/


/*homepage*/

.homepage ul li {
    list-style-type: none;
}

.homepage ul {
    padding: 0;
}

.callback-button__circle-phone,
.callback-button__circle-fill {
    display: none;
}

.callback-button__img-circle {
    background: none;
    width: 100px;
    height: 100px;
}

.callback-button__circle-block {
    width: 100px;
    height: 100px;
    background-size: 100% 100%;
}


/*End homepage*/


/*ModalForm*/

.modalForm {
    background: #f0a100;
    max-width: 615px;
    border-radius: 5px;
    border: 2px solid #e8e8e8;
    text-align: center;
    padding: 30px 20px 20px;
}

.mfp-bg {
    background: #fff;
}

.callback-modal__headline {
    font-size: 30px;
    font-family: "Roboto-Medium";
    margin-bottom: 20px;
    color: #000;
}

.modalForm input {
    width: 100%;
    background: #fff;
    border: none;
    padding: 10px 25px;
    font-size: 16px;
    font-family: "Roboto-Regular";
    color: #000;
    margin-bottom: 15px;
}

.modalForm .callback-modal__concert-input {
    display: none;
}

.modalForm .callback-modal__concert-label {
    position: relative;
    padding-left: 50px;
    margin-top: 10px;
}

.modalForm .callback-modal__concert-label,
.modalForm .callback-modal__concert-label a {
    font-size: 16px;
    font-family: "Roboto-Light";
    color: #000;
    text-align: left;
    width: 100%;
}

.modalForm label:before {
    content: "";
    background: #fff;
    display: inline-block;
    width: 33px;
    height: 33px;
    margin-right: 10px;
    position: absolute;
    left: 0px;
    bottom: calc(50% - 16px);
}

.modalForm input[type="checkbox"]:checked+label::before {
    font-size: 40px;
    color: #000;
    text-align: center;
    content: "\2713";
    line-height: 33px;
}

.modalForm .callback-modal__button {
    font-size: 16px;
    font-family: "Roboto-Medium";
    width: 235px;
    padding: 15px 0;
    background: none;
    border: 3px solid #fff;
    color: #fff;
    margin-top: 25px;
    transition: all 0.3s;
}

.modalForm .callback-modal__button:hover {
    background: #fff;
    color: #f0a100;
}

.callback-button {
    bottom: 200px;
}

.callBackJob {
    position: fixed;
    bottom: 120px;
    right: 100px;
    font-size: 16px;
    font-family: "Roboto-Medium";
    color: #000;
    padding: 10px;
    width: 200px;
    background: #ffc100;
    text-align: center;
    text-transform: uppercase;
    cursor: pointer;
}

.page-header {
    margin: 0;
    border-bottom: none;
}

.page-header h2 {}

.page-header h2 {
    text-align: center;
    font-family: "Roboto-Medium";
    font-size: 26px;
    color: #000;
    margin-bottom: 35px;
    text-transform: uppercase;
    position: relative;
    padding-bottom: 22px;
}

.page-header h2:after {
    position: absolute;
    content: '';
    width: 225px;
    height: 3px;
    background: #f0a100;
    bottom: 0;
    left: calc(50% - 113px);
}

.insidepage .item-page {
    margin-bottom: 30px;
}


/*End ModalForm*/


/*item-page*/

.item-page li,
.homepage .item-page li {
    list-style-type: disc;
}

.homepage .item-page ul {
    padding-left: 15px;
}

.item-page li p,
.homepage .item-page li p {
    text-indent: 0;
}

.homepage .item-page p,
.item-page p {
    text-indent: 20px;
    /* Отступ первой строки в пикселах */
    text-align: justify;
}


/*End item-page*/


/* --- Media styles --- */

@media screen and (min-width:1200px) {}

@media screen and (max-width:1199px) {}

@media screen and (max-width:1024px) {}

@media screen and (max-width:991px) {}

@media screen and (max-width:767px) {}

@media screen and (max-width:675px) {}

@media screen and (max-width:640px) {}

@media screen and (max-width:600px) {}

@media screen and (max-width:485px) {}

@media screen and (max-width:425px) {}

@media screen and (max-width:400px) {}

@media screen and (max-width:370px) {}