@font-face {
    font-family: Comforta;
    src: url("../fonts/Comforta/Comfortaa-VariableFont_wght.ttf") format("truetype");
}
html,
body {
    height: 100%;
    font-size: 18px;
}
h1,h2,h3,h4  {
    font-family: Comforta, cursive;
}


/* COLORS */
.mc {
    color: #FF7F1C;
}

.bmc {
    background-color: #FF7F1C;
}

.marked-black {
    color: black !important;
}

.m-bg {
background-color: #FF7F1C;
}

.m-link-color-black {
    color: black;

}

.m-link-color-black:hover {
    color: white;
    text-decoration: none;
}
/* Прижимаем футер */


.wrapper {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}
.content {
    flex: 1 0 auto;
}
.footer {
    flex: 0 0 auto;
}
/* & */

/* Выравнивание текста */
.text-start {
    text-align: start;
}

.text-end {
    text-align: end;
}

.text-center {
    text-align: center;
}
/* & */

/* CUSTOM SLICK CSS*/
.slick-slide {
    outline: none;
    min-height: 450px;

}
.slick-prev {
    left: 50px;
    z-index: 100;
}

.slick-next {
    right: 50px;
    z-index: 100;
}

.slick-prev:before, .slick-next:before {
    color: #FF7F1C;
}

.slick-dots li button:before {
    color: #FF7F1C;
    opacity: 0.4;
    font-size: 14px;
}

.slick-dots li.slick-active button:before {
    color: #FF7F1C;
}

.bg-slide1 {
    background: url("../img/slide1.png") 85% 62% no-repeat;
    background-size: 33%;
}
.bg-slide2 {
    background: url("../img/slide2.png") 20% 55% no-repeat;
    background-size: 24%;
}
.bg-slide3 {
    background: url("../img/slide3.png") 86% 55% no-repeat;
    background-size: 40%;
}

/*
.bg-slide4 {
    background: url("../img/") center no-repeat;
    background-size: cover;
}
*/

.topSlider {
    margin-top: 50px;
}

h1.sliderContent {
    color: #FF7F1C;
    font-size: 36px;
    font-weight: 400;
    text-shadow: 1px 1px 1px black;
}


/*ТОП МЕНЮ*/

.header {
    position: fixed;
    z-index: 99999;
    width: 100%;
    top: 0;
}

.menu-font-fix {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    text-transform: uppercase;
}

.menu {
    display: flex;
    justify-content: center;
    width: 100%;
    height: 50px;
    background-color: #FF7F1C;
    box-shadow: 0 0 4px 0 black;

/* Перенести на элементы меню ?*/
    color: white;
    text-shadow: 1px 1px 1px black;
    font-size: 18px;
    font-weight: 300;
    text-transform: uppercase;
}
.menu> div {
    margin: 10px auto;
}
.menu a {
    color: white;
    outline: none;
    text-decoration: none;
    transition: text-shadow 0.5s ease-in-out;
}

.menu a:hover {
    text-shadow: 0 0 3px white;
}


/* About */

.about-img {
    background: url("../img/about-img-new.jpg") center no-repeat;
    background-size: contain;
    width: 100%;
    height: 100%;
    min-height: 300px;
}

/*Paralax*/

.paralax-wrap {
    position: relative;
    width: 100%;
    min-height: 300px;
}
.parallax-text {
    position: absolute;
    width: 100%;
    min-height: 300px;
    color: white;
    text-shadow: 0 0 4px #ef8c0b;
}


.parallax-text>.row {
    min-height: 300px;
}

.parallax {
    width: 100%;
    background: linear-gradient(0deg, #43403b, #43403b), url(../img/paralax.jpg) fixed center no-repeat;
    min-height: 300px;
    background-size: cover;
    filter: blur(8px);
    -webkit-filter: blur(1px);
    background-blend-mode: overlay;
    -webkit-box-shadow: inset 0 0 15px 3px rgba(0,0,0,0.75);
    -moz-box-shadow: inset 0 0 15px 3px rgba(0,0,0,0.75);
    box-shadow: inset 0 0 15px 3px rgba(0,0,0,0.75);
    position: absolute;
}

/*Paralax2*/

.paralax-wrap2 {
    position: relative;
    width: 100%;
    min-height: 200px;
}
.parallax-text2 {
    position: absolute;
    width: 100%;
    min-height: 200px;
    color: white;
    text-shadow: 0 0 4px #ef8c0b;
}


.parallax-text2>.row {
    min-height: 200px;
}

.parallax2 {
    width: 100%;
    background: linear-gradient(0deg, #43403b, #43403b), url(../img/paralax2.jpg) fixed center no-repeat;
    min-height: 200px;
    background-size: cover;
    filter: blur(8px);
    -webkit-filter: blur(1px);
    background-blend-mode: overlay;
    -webkit-box-shadow: inset 0 0 15px 3px rgba(0,0,0,0.75);
    -moz-box-shadow: inset 0 0 15px 3px rgba(0,0,0,0.75);
    box-shadow: inset 0 0 15px 3px rgba(0,0,0,0.75);
    position: absolute;
}

h1.w-32 {
    width: 32%;
}


/* Services */
.s-img {
    width: 100%;
    min-height: 300px;
    background: url("../img/electro-transport.png") center no-repeat;
    background-size: contain;
}

.s-img2 {
    width: 100%;
    min-height: 300px;
    background: url("../img/test.jpg") center no-repeat;
    background-size: contain;
}

.s-img3 {
    width: 100%;
    min-height: 300px;
    background: url("../img/slide3.png") center no-repeat;
    background-size: contain;

}
.s-img4 {
    width: 93%;
    min-height: 300px;
    background: url("../img/kolyaska.jpg") center no-repeat;
    background-size: contain;

}

.s-img5 {
    width: 100%;
    min-height: 300px;
    background: url("../img/plata.jpg") center no-repeat;
    background-size: contain;

}

.s-img6 {
    width: 100%;
    min-height: 300px;
    background: url("../img/solar.jpg") center no-repeat;
    background-size: contain;
}

.s-img7 {
    width: 100%;
    min-height: 300px;
    background: url("../img/tools-icon.png") center no-repeat;
    background-size: contain;
}

.swc {
    box-shadow: 0 2px 3px black;
}




.price {
    background-color: rgba(255, 255, 255, 1);
    border-radius: 5px;
    color: #212529;
    text-shadow: none;
    font-weight: 600;
}

.price>.row>.col> span {
    white-space: nowrap;
    box-shadow: inset 0 0 1px 1px black;
    padding: 4px;
}
tbody {
    padding: 5px 15px;
}

tr {
    background-color: white;
    font-size: 18px;
    font-weight: 600;
    color: #212529;
    text-shadow: none;
    transition: all 0.5s ease-in-out;

}

td {
    text-align: center;
    padding: 5px 10px;
    border-bottom: 1px solid #212529;
}
tr:hover {
    cursor: pointer;
    color: #FF7F1C;
}
td:last-child {
    text-align: left;
}

.m-table td {
    text-align: left;
    padding: 5px 5px;
    border-bottom: 1px solid #212529;
}

.logo-footer {
    background: url("../img/tools-icon.png") center ;
    background-size: contain;
    width: 150px;
    height: 150px;
}
.m-logo-footer {
    background: url("../img/tools-icon.png") center ;
    background-size: contain;
    width: 100px;
    height: 100px;
}

.contact-footer>a {
    color: #FF7F1C;
    cursor: pointer;
    text-decoration: none;
    font-size: 18px;
    font-weight: bold;
}


.contact-footer a:hover {
    text-shadow: 0 0 2px #ff9f6a;
}

.brands div {
 margin: 0 10px;
}

.img-brands {
    width: 130px;
    height: 100px;
}

.img-brands:nth-child(1) {
    background: url("../img/1.png") no-repeat;
    background-size: contain;

}
.img-brands:nth-child(2) {
    background: url("../img/2.jpg") no-repeat;
    background-size: contain;

}
.img-brands:nth-child(3) {
    background: url("../img/3.png") no-repeat;
    background-size: contain;

}
.img-brands:nth-child(4) {
    background: url("../img/4.png") no-repeat;
    background-size: contain;

}
.img-brands:nth-child(5) {
    background: url("../img/5.png") no-repeat;
    background-size: contain;

}
.img-brands:nth-child(6) {
    background: url("../img/6.png") no-repeat;
    background-size: contain;

}
.img-brands:nth-child(7) {
    background: url("../img/7.png") no-repeat;
    background-size: contain;

}
.img-brands:nth-child(8) {
    background: url("../img/8.jpg") no-repeat;
    background-size: contain;

}
.img-brands:nth-child(9) {
    background: url("../img/9.jpg") no-repeat;
    background-size: contain;

}
.img-brands:nth-child(10) {
    background: url("../img/10.jpg") no-repeat;
    background-size: contain;

}
.img-brands:nth-child(11) {
    background: url("../img/11.jpg") no-repeat;
    background-size: contain;

}
.img-brands:nth-child(12) {
    background: url("../img/12.png") no-repeat;
    background-size: contain;

}

.id3 {
    height: 25px;
}

.id1 {
    height: 1px;
}
.id4{
    height: 1px;
}


.m-phone-button {
    background-color: #00c91b;
    padding: 10px 0px 10px 0px;
    border: 0;
    border-radius: 1.5em;
    font-weight: 500;
    color: white;
    box-shadow: 0 3px 7px #212529;
    transition: ease-in-out 0.2s;
}

.m-phone-button:hover {
    text-decoration: none;
    color: white;
    box-shadow: none;
}



.m-vk-button {
    background-color: #007bff;
    padding: 10px 0px 10px 0px;
    border: 0;
    border-radius: 1.5em;
    font-weight: 500;
    color: white;
    box-shadow: 0 3px 7px #212529;
    transition: ease-in-out 0.2s;
    
}

.m-vk-button:hover {
    text-decoration: none;
    color: white;
    box-shadow: none;
}

.m-h2 {
    color: #FF7F1C;
    font-weight: 600;
    text-shadow: 1px 1px 1px black;
}