html{
scroll-behavior: smooth;
}
body{
margin: 0;
padding:0;
}
.workspace{
	width: 1012px;
    position: relative;
    margin: 0 auto;
}
.p64 {
    padding-top: 64px;
    padding-bottom: 64px;
}
.null {
    height: 0px;
    min-height: 0px;
    line-height: 0px;
    font-size: 0px;
    overflow: hidden;
    clear: both;
}
p{

}

/*главная*/
#header{
height: 717px;
}
.h_bg1{
background: url(design/main_bg.jpg);

background-size: cover;
background-repeat: no-repeat;
height: 717px;

}

.h_bg2{
background: url(design/udobno_bg.jpg);

background-size: cover;
background-repeat: no-repeat;
height: 717px;

}
.h_line1{
display: flex;
justify-content: space-between;
padding-top: 42px;
}
.h_logo{
background: url(design/logo.svg);
width: 237px;
height: 48px;
background-repeat: no-repeat;
background-size: cover;
}
.h_phone{
font-family: Roboto;
font-style: normal;
font-weight: 500;
font-size: 20px;
line-height: 0px;

color: #FFFFFF;
text-decoration: none;
padding-bottom: 10px;
}
.h_phone_img{
background: url(design/phone.svg);
width: 10px;
height: 17px;
background-repeat: no-repeat;
background-size: cover;
position: relative;
    top: 15px;
    left: -20px;
}
.h_mail{
font-family: Roboto;
font-style: normal;
font-weight: 500;
font-size: 20px;
line-height: 0px;

color: #FFFFFF;
text-decoration: none;
}
.h_mail_img{
background: url(design/mail.svg);
width: 16px;
height: 18px;
background-repeat: no-repeat;
background-size: cover;
position: relative;
    top: 15px;
left: -25px;
}
.phone_block{
position: relative;
    right: -150px;
}
.mail_block{

}

.h_ph_cb{
margin-top: 12px;
font-family: Roboto;
font-style: normal;
font-weight: 500;
font-size: 16px;
line-height: 0px;

color: #FECC13;
width: max-content;
    line-height: 1.5;
    text-decoration: none;
    cursor: pointer;
    position: relative;
}

.h_ph_cb:hover{

}
.h_ph_cb:after {
    display: block;
    content: "";
    background-color: #FECC13;
    height: 2px;
    width: 0%;
    left: 50%;
    position: absolute;
    -webkit-transition: width .3s ease-in-out;
    -moz--transition: width .3s ease-in-out;
    transition: width .3s ease-in-out;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    transform: translateX(-50%);
}
.h_ph_cb:hover:after,
.h_ph_cb:focus:after {
    width: 100%;
}


.h_line2{
margin-top: 78px;
margin-bottom: 51px;
display: flex;
justify-content: space-between;
}
.h_line2_txt{
font-family: Roboto;
font-style: normal;
font-weight: bold;
font-size: 18px;
line-height: 57px;/* identical to box height */
letter-spacing: 0.1em;
text-decoration: none;
transition: all 0.2s ease;
color: #FFFFFF;
text-align: center;

}
.h_line2_bg:hover {
background: #FECC13;
}
.h_line2_bg{
cursor: pointer;
text-align: center;
transition: all 0.15s ease;
 background: rgba(255, 0, 0, 0);
box-sizing: border-box;
width: 211px;
height: 60px;
}

.ch_arrow{
position: absolute;
    right: 268px;
    bottom: 96px;
    background: url(design/ch_arrow.svg);
    width: 33px;
    height: 21px;
    background-repeat: no-repeat;
}

.h_zag{
font-family: Roboto;
font-style: normal;
font-weight: bold;
font-size: 30px;
line-height: 35px;/* identical to box height */
text-transform: uppercase;
text-align: center;
color: #FFFFFF;
padding-bottom: 32px;
}

.h_slider{
    padding-bottom: 74px;
}
.h_prev{
background: url(design/slide.svg);
width: 10px;
height: 20px;
background-repeat: no-repeat;
transition: all 0.2s ease;
position: absolute;
left: 0px;
margin-top: 53px;
    left: -40px;
cursor: pointer;
}
.h_prev:hover{
background: url(design/slide_a.svg);
}
.h_next{
transform: rotate(.5turn);
background: url(design/slide.svg);
width: 10px;
height: 20px;
background-repeat: no-repeat;
transition: all 0.2s ease;
position: absolute;
right: -40px;
margin-top: 53px;
cursor: pointer;
}
.h_next:hover{
background: url(design/slide_a.svg);
}
.h_s_txt{
font-family: Scada;
font-style: normal;
font-weight: bold;
font-size: 40px;
line-height: 44px;
letter-spacing: 0.1em;
width: 516px;
height: 156px;
color: #FFFFFF;
}

/*производство*/
.pr_box{
display: flex;
justify-content: space-between;
margin-bottom: 106px;
}
.pr_block{
width: 324px;
height: 220px;
}
.pr_block:hover .pr_txt{
background: #FECC13;
color: #242424;
}
.pr_img{
width: 324px;
height: 220px;
}
.pr_txt{
    position: absolute;
    bottom: 0px;
width: 324px;
height: 60px;
background: #242424;
font-family: Roboto;
font-style: normal;
font-weight: bold;
font-size: 18px;
line-height: 60px;

text-align: center;
letter-spacing: 0.1em;
transition: all 0.2s ease;
color: #FFFFFF;
}

/*удобно*/
#udobno{
background: url(design/udobno_bg.jpg);
background-repeat: no-repeat;
background-size: cover;
}
.ud_zag{

font-family: Roboto;
font-style: normal;
font-weight: bold;
font-size: 30px;
line-height: 35px;
text-align: center;
letter-spacing: 0.1em;
padding-bottom: 100px;
color: #FFFFFF;
padding-top: 82px;

}
.ud_zag2{
padding-bottom: 30px;
font-family: Roboto;
font-style: normal;
font-weight: 500;
font-size: 30px;
line-height: 35px;
text-align: center;
padding-bottom: 100px;
padding-top: 89px;
color: #FFFFFF;
}
.ud_cb{
padding-bottom: 80px;
    width: 780px;
    margin: 0 auto;
}
/*каталог*/
#catalog{

}
.cat_block{
width: 496px;
}
.cat_img{

}
.cat_name{
margin-top: 100px;
font-family: Roboto;
font-style: normal;
font-weight: 500;
font-size: 30px;
line-height: 53px;/* identical to box height */
text-align: center;
color: #242424;
}
.cat_opis{
font-family: Roboto;
font-style: normal;
font-weight: 500;
font-size: 21px;
line-height: 25px;/* identical to box height */
text-align: center;
color: #747575;
}
.cat_box{
display: flex;
justify-content: space-between;
flex-wrap: wrap;

}

/*наши услуги*/
#us_uslugi{
background: url(design/us_usl_bg.jpg);
background-repeat: no-repeat;
background-size: cover;
}
.uu_zag{
padding-top: 82px;
padding-bottom: 87px;
font-family: Roboto;
font-style: normal;
font-weight: bold;
font-size: 30px;
line-height: 35px;
text-align: center;
letter-spacing: 0.1em;

color: #FFFFFF;

}
.uu_cont{
display: flex;
justify-content: space-between;
}
.uu_left{
width: 390px;
box-sizing: border-box;
    height: 200px;
}
.uu_right{
width: 400px;
    height: 200px;
box-sizing: border-box;
}
.uu_txt{

font-family: Roboto;
font-style: normal;
font-weight: bold;
font-size: 20px;
line-height: 35px;
letter-spacing: 0.1em;
padding-left: 27px;
color: #FFFFFF;
display: inline-block;
padding-bottom: 25px;
}
.uu_arrow1{
display: inline-block;
}
.uu_arrow2{
display: inline-block;
}
.uu_txt1{
display: inline-block;
}
.uu_arrow{
background: url(design/usl_arrow.svg);
width: 13px;
height: 13px;
background-repeat: no-repeat;
position: relative;
margin-bottom: 25px;

}
.uu_zag2{
padding-top: 87px;
padding-bottom: 75px;
font-family: Roboto;
font-style: normal;
font-weight: bold;
font-size: 30px;
line-height: 35px;
text-align: center;
letter-spacing: 0.1em;
text-transform: uppercase;

color: #FFFFFF;
}

.u_cb_but{
background: #242424;
border: 1px solid #242424;
transition: all 0.2s ease;
box-sizing: border-box;
cursor: pointer;
padding: 0;
width: 238px;
height: 60px;
margin: 0 auto ;
}
.u_cb_txt{
font-family: Roboto;
font-style: normal;
font-weight: bold;
font-size: 16px;
line-height: 56px;
letter-spacing: 0.13em;
transition: all 0.2s ease;
color: #FFFFFF;
text-align: center;

}
.u_cb_but:hover{
background: #FECC13;
border: 1px solid #FECC13;
}
.u_cb_but:hover .u_cb_txt{
color: #000000;

}

/*наши преимущества*/
#us_plus{

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

}

.u_block{
width: 337px;
margin-bottom: 95px;
}
.u_img{

}
.u_b_zag{
padding-top: 180px;
font-family: Roboto;
font-style: normal;
font-weight: bold;
font-size: 20px;
    line-height: 47px;
text-align: center;
letter-spacing: 0.1em;
padding-bottom: 30px;
height: 47px;
color: #000000;

}
.u_b_txt{
font-family: Roboto;
font-style: normal;
font-weight: normal;
font-size: 18px;
line-height: 21px;
text-align: center;
letter-spacing: 0.1em;
height: 64px;
color: #747575;
}

/*кб у футера*/
#cb_b1{
background: url(design/cb_bg1.jpg);
background-repeat: no-repeat;
background-size: cover;
height: 412px;
}
.cb_b1_left{
padding-top: 145px;
}
.cb_b1_zag{
width: 666px;
height: 105px;
font-family: Roboto;
font-style: normal;
font-weight: bold;
font-size: 25px;
line-height: 35px;

letter-spacing: 0.1em;
text-transform: uppercase;
padding-bottom: 20px;
color: #FEFEFE;
}

.cb_na{
background: #242424;
border: 1px solid #242424;
transition: all 0.2s ease;
box-sizing: border-box;
cursor: pointer;
padding: 0;
width: 238px;
height: 60px;
}
.cb_natxt{
font-family: Roboto;
font-style: normal;
font-weight: bold;
font-size: 16px;
line-height: 26px;
letter-spacing: 0.13em;
transition: all 0.2s ease;
color: #FFFFFF;

}
.cb_na:hover{
background: #FECC13;
border: 1px solid #FECC13;
}
.cb_na:hover .cb_natxt{
color: #000000;

}

/*акции*/
#akcii{

}
.zag_wl{
    margin: 82px auto 74px auto;

}

.ak_zag{
font-family: Roboto;
font-style: normal;
font-weight: bold;
font-size: 30px;
line-height: 35px;
text-align: center;
letter-spacing: 0.1em;
margin-bottom: 17px;
color: #000000;
}
.ak_line{
height: 2px;

    background: linear-gradient(90deg, #333333 0%, #C4C4C4 60%, #FECC13 90%);
}

.akcii_box{
display: flex;
justify-content: space-between;
padding-bottom: 159px;
}
.ak_block{
height: 360px;
width: 238px;
}

.ak_img{
background: url(design/ak_img1.jpg);
background-repeat: no-repeat;
background-size: cover;
width: 238px;
height: 220px;
margin-bottom: 15px;
}

.ak_b_zag{
font-family: Roboto;
font-style: normal;
font-weight: bold;
font-size: 18px;
line-height: 21px;
text-align: center;
letter-spacing: 0.1em;
text-transform: uppercase;
height: 44px;
color: #242424;
margin-bottom: 19px;
}
.ak_b_txt{
    font-family: Roboto;
font-style: normal;
font-weight: bold;
font-size: 15px;
line-height: 18px;
text-align: center;
letter-spacing: 0.1em;

color: #747575;
height: 50px;
}

/*мапа*/
#map{
height: 527px;
}

.contact_box{
background: #FECC13;
position: absolute;
z-index: 20;
right: 0;
width: 410px;
height: 460px;
top: 30px;
}

.ctxt_1{

font-family: Roboto;
font-style: normal;
font-weight: bold;
font-size: 25px;
line-height: 29px;/* identical to box height */
text-transform: uppercase;
margin-bottom: 23px;
color: #242424;
}
.ctxt_2{

font-family: Roboto;
font-style: normal;
font-weight: normal;
font-size: 15px;
line-height: 18px;
display: flex;
align-items: flex-end;
text-align: center;
margin-bottom: 23px;
color: #242424;
}
.cb_no{
background: #FFFFFF;
transition: all 0.2s ease;
box-sizing: border-box;
border:none;
margin: 0 auto;
cursor: pointer;
padding: 0;
width: 238px;
height: 60px;
    margin: 0px 3px;
}
.cb_notxt{
font-family: Roboto;
font-style: normal;
font-weight: bold;
font-size: 16px;
line-height: 26px;
letter-spacing: 0.13em;
transition: all 0.2s ease;
color: #242424;
}
.cb_no:hover{
background: #242424;
}
.cb_no:hover .cb_notxt{
color: #FFFFFF;
}
/*футер*/
#footer{
background: #343434;
}
.f_fline{
display: inline-block;
padding-top: 81px;
padding-bottom: 81px;
width: 770px;
}
.f_rline{
    position: absolute;
    bottom: 100px;
    right: 0px;
}
.f_fl1{
display: flex;
justify-content: space-between; 
padding-bottom: 48px;
}
.f_fl1txt{
font-family: Roboto;
font-style: normal;
font-weight: normal;
font-size: 16px;
line-height: 23px;

color: #FFFFFF;
}


.f_fl2{
display: flex;
justify-content: space-between;

}
.f_fl2_block{

}
.f_fl2txt{
font-family: Roboto;
font-style: normal;
font-weight: normal;
font-size: 16px;
line-height: 23px;

text-decoration: none;

}

.f_fl2_block a{
text-decoration: none;
}

.f_fl2_block a:f_fl2txt { color: blue; text-decoration: none; }
.f_fl2_block a:hover { color: #FECC13; text-decoration: underline; }
.f_fl2txt {color: #FFFFFF;}


.f_up{
width: 42px;
height: 42px;
background: url(design/up.svg);
background-repeat: no-repeat;
transition: all 0.2s ease;
border-radius: 50%;
    margin-bottom: 56px;
    margin-left: 40px;
}
.f_up:hover{
background: url(design/up_a.svg);   
background-repeat: no-repeat;
}
.mz_gif{
    margin-right: 40px;
}