@charset "utf-8";
/* МастерБетон — luybercy-beton-zavod.ru */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font:14px/1.6 Arial,Tahoma,"Helvetica Neue",sans-serif;color:#444;background:#eceee9}
img{max-width:100%;height:auto;border:0;display:block}
a{color:#4a7c1f;text-decoration:underline}
a:hover{text-decoration:none}
h1,h2,h3,h4{font-family:Ubuntu,Arial,sans-serif;font-weight:700;color:#33372f;margin:0 0 14px}
h1{font-size:34px;line-height:1.2}
h2{font-size:26px;line-height:1.25}
h3{font-size:18px}
p{margin:0 0 12px}
.wrap{width:1000px;max-width:100%;margin:0 auto;padding:0 12px}
.clr:after{content:"";display:table;clear:both}
.page{background:#fff;box-shadow:0 0 14px rgba(0,0,0,.12);margin:0 auto}
.sec{padding:38px 0;border-bottom:1px solid #e6e8e2}
.sec-gray{background:#f6f7f4}
.sec h2{padding-bottom:12px;border-bottom:2px solid #4a7c1f;display:inline-block}
.intro{color:#6b7065;margin-bottom:24px;max-width:800px}

/* ---- шапка ---- */
.head{background:#fff;padding:16px 0}
.logo{float:left;text-decoration:none}
.logo:hover{text-decoration:none}
.logo table{border-collapse:collapse}
.logo td{padding:0 0 0 11px;vertical-align:middle}
.logo td:first-child{padding:0}
.logo svg{width:48px;height:48px}
.logo b{display:block;font-family:Ubuntu,Arial,sans-serif;font-size:23px;color:#33372f;line-height:1.1}
.logo b i{font-style:normal;color:#4a7c1f}
.logo span{display:block;font-size:11px;color:#8b9184;letter-spacing:.4px}
.head-c{float:left;margin-left:34px;font-size:12px;color:#7c8278;line-height:1.5;max-width:230px;padding-top:4px}
.head-r{float:right;text-align:right}
.head-r .tel{font-family:Ubuntu,Arial,sans-serif;font-size:24px;color:#33372f;text-decoration:none;display:block}
.head-r .tel:hover{color:#4a7c1f}
.head-r .zv{display:inline-block;margin-top:7px;font-size:12px;color:#4a7c1f;
	border-bottom:1px dashed #4a7c1f;text-decoration:none}

/* ---- меню ---- */
.nav{background:#4a7c1f;background:linear-gradient(#5d9527,#3f6c19);border-top:1px solid #6fa634;
	border-bottom:1px solid #2f5412}
.nav ul{list-style:none;margin:0;padding:0;display:flex;overflow-x:auto;-webkit-overflow-scrolling:touch}
.nav li{flex:0 0 auto;border-right:1px solid rgba(255,255,255,.18)}
.nav li:first-child{border-left:1px solid rgba(255,255,255,.18)}
.nav a{display:block;padding:12px 20px;color:#fff;text-decoration:none;font-size:13px;
	font-weight:bold;text-shadow:0 1px 0 rgba(0,0,0,.25);white-space:nowrap}
.nav a:hover{background:rgba(0,0,0,.14)}

/* ---- кнопки ---- */
.btn{display:inline-block;padding:11px 26px;font-family:Ubuntu,Arial,sans-serif;font-size:14px;
	border-radius:4px;text-decoration:none;border:1px solid #35600f;cursor:pointer;
	background:linear-gradient(#65a129,#47771b);color:#fff;text-shadow:0 1px 0 rgba(0,0,0,.28);
	box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 1px 2px rgba(0,0,0,.2)}
.btn:hover{background:linear-gradient(#72b32f,#4f8420);text-decoration:none;color:#fff}
.btn-o{background:linear-gradient(#fff,#eceee9);color:#41531f;border-color:#c3c8bb;
	text-shadow:0 1px 0 #fff}
.btn-o:hover{background:linear-gradient(#fff,#e2e5dd);color:#41531f}

/* ---- hero ---- */
.hero{background:#33372f url(../img/hero.jpg) center/cover no-repeat;padding:44px 0}
.hero-box{background:rgba(30,36,26,.8);border:1px solid rgba(255,255,255,.18);border-radius:5px;
	padding:28px 30px;max-width:600px;color:#e8eae4;box-shadow:0 2px 8px rgba(0,0,0,.3)}
.hero-box h1{color:#fff;font-size:31px;margin-bottom:12px}
.hero-box p{color:#cdd2c6;margin-bottom:18px}
.hero-box .btn{margin:0 8px 8px 0}
.hero-box ul{list-style:none;margin:16px 0 0;padding:0;font-size:13px;color:#b9c0b0}
.hero-box li{padding:0 0 5px 20px;position:relative}
.hero-box li:before{content:"";position:absolute;left:0;top:7px;width:8px;height:8px;
	background:#8bc34a;border-radius:2px}

/* ---- панели ---- */
.panel{border:1px solid #d7dbd1;border-radius:5px;background:#fff;margin-bottom:20px;overflow:hidden;
	box-shadow:0 1px 2px rgba(0,0,0,.05)}
.panel-h{background:linear-gradient(#f3f5f0,#e4e8dd);border-bottom:1px solid #d7dbd1;
	padding:11px 16px;font-family:Ubuntu,Arial,sans-serif;font-size:15px;color:#33372f;font-weight:700}
.panel-b{padding:16px}
.panel-green .panel-h{background:linear-gradient(#5d9527,#42711a);color:#fff;border-bottom-color:#35600f;
	text-shadow:0 1px 0 rgba(0,0,0,.25)}

/* ---- продукция ---- */
.prods{display:flex;flex-wrap:wrap;gap:16px}
.prod{flex:1 1 300px;min-width:0;border:1px solid #d7dbd1;border-radius:5px;background:#fff;
	overflow:hidden;display:flex;flex-direction:column;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.prod .t{background:linear-gradient(#f3f5f0,#e4e8dd);border-bottom:1px solid #d7dbd1;padding:10px 14px;
	font-family:Ubuntu,Arial,sans-serif;font-weight:700;font-size:15px;color:#33372f}
.prod .b{padding:13px 14px 15px;font-size:13px;color:#6b7065;flex:1 1 auto}
.prod .f{padding:0 14px 14px;font-family:Ubuntu,Arial,sans-serif;font-size:17px;color:#4a7c1f}
.prod .f small{display:block;font-family:Arial,sans-serif;font-size:11px;color:#9aa093}

/* ---- таблицы ---- */
/* правила только для прайсов: глобальный селектор table цеплял
   и вёрсточную таблицу логотипа, из-за чего на 375px вылезал скролл */
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.table-wrap table{border-collapse:collapse;width:100%;min-width:520px;font-size:13px}
.table-wrap th{background:linear-gradient(#f3f5f0,#e4e8dd);color:#33372f;font-family:Ubuntu,Arial,sans-serif;
	font-size:12px;padding:10px 14px;text-align:left;border-bottom:1px solid #d7dbd1;font-weight:700}
.table-wrap td{padding:9px 14px;border-bottom:1px solid #edefe9}
.table-wrap tbody tr:nth-child(odd){background:#fafbf8}
.table-wrap tr:last-child td{border-bottom:0}
.table-wrap td.n{font-weight:bold;color:#33372f}
.table-wrap td.p{font-family:Ubuntu,Arial,sans-serif;font-size:15px;color:#4a7c1f;white-space:nowrap;text-align:right}
.pnote{background:#fbfaef;border:1px solid #e7e3c4;border-radius:4px;padding:12px 16px;font-size:13px;
	margin-bottom:20px}

/* ---- колонки ---- */
.cols{display:flex;flex-wrap:wrap;gap:26px;align-items:flex-start}
.col{flex:1 1 380px;min-width:0}
.col-n{flex:0 1 300px;min-width:0}
ul.ch{list-style:none;margin:0 0 16px;padding:0}
ul.ch li{position:relative;padding:0 0 9px 24px;font-size:14px}
ul.ch li:before{content:"";position:absolute;left:2px;top:6px;width:10px;height:10px;border-radius:2px;
	background:linear-gradient(#8bc34a,#5d9527)}

/* ---- плашки объёмов ---- */
.vols{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.vol{flex:1 1 90px;text-align:center;border:1px solid #d7dbd1;border-radius:4px;
	background:linear-gradient(#fff,#f2f4ee);padding:12px 6px}
.vol b{display:block;font-family:Ubuntu,Arial,sans-serif;font-size:21px;color:#4a7c1f}
.vol span{font-size:11px;color:#8b9184}

/* ---- бетононасосы ---- */
.pumps{display:flex;flex-wrap:wrap;gap:16px}
.pump{flex:1 1 260px;min-width:0;border:1px solid #d7dbd1;border-radius:5px;background:#fff;
	padding:20px 18px;text-align:center;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.pump b{display:block;font-family:Ubuntu,Arial,sans-serif;font-size:30px;color:#4a7c1f;line-height:1}
.pump u{display:block;text-decoration:none;font-family:Ubuntu,Arial,sans-serif;font-size:14px;
	color:#33372f;margin:7px 0 8px}
.pump span{font-size:13px;color:#6b7065}

/* ---- контакты ---- */
.kont dl{margin:0}
.kont dt{font-size:11px;text-transform:uppercase;letter-spacing:.7px;color:#9aa093;margin-top:14px}
.kont dd{margin:2px 0 0;font-size:16px;color:#33372f}
.kont dd a{color:#33372f}
.map{border:1px solid #d7dbd1;border-radius:5px;overflow:hidden;margin-top:22px;background:#eceee9}
.map iframe{display:block;width:100%;height:380px;border:0}
form label{display:block;font-size:12px;color:#7c8278;margin:0 0 4px}
form input,form textarea{width:100%;padding:9px 11px;border:1px solid #ccd1c6;border-radius:3px;
	font:14px/1.4 Arial,sans-serif;color:#444;margin-bottom:13px;background:#fdfdfc;
	box-shadow:inset 0 1px 2px rgba(0,0,0,.05)}
form input:focus,form textarea:focus{outline:0;border-color:#7aa93f;background:#fff}
form textarea{height:88px;resize:vertical}
form .sm{font-size:11px;color:#9aa093;margin:9px 0 0}
.hp{position:absolute;left:-9999px}

/* ---- призыв ---- */
.cta{background:linear-gradient(#5d9527,#42711a);color:#fff;padding:26px 0;text-align:center;
	border-bottom:1px solid #35600f}
.cta b{display:block;font-family:Ubuntu,Arial,sans-serif;font-size:22px;margin-bottom:5px;
	text-shadow:0 1px 0 rgba(0,0,0,.22)}
.cta p{color:#dceac6;margin-bottom:16px}
.cta .btn{margin:0 5px 6px}

/* ---- подвал ---- */
.foot{background:#33372f;color:#9ea497;font-size:13px;padding:28px 0 18px}
.foot a{color:#c3cbb8}
.foot h4{color:#fff;font-size:13px;margin:0 0 10px;font-family:Ubuntu,Arial,sans-serif}
.foot-c{float:left;width:33.33%;padding-right:22px}
.foot ul{list-style:none;margin:0;padding:0}
.foot li{padding:0 0 6px}
.foot-b{clear:both;border-top:1px solid #454a40;margin-top:20px;padding-top:14px;font-size:12px;color:#7b8177}

/* ---- адаптив ---- */
@media (min-width:981px){
	.prod{max-width:calc((100% - 32px)/3)}
	.pump{max-width:calc((100% - 32px)/3)}
}
@media (max-width:980px){
	h1,.hero-box h1{font-size:25px}
	h2{font-size:21px}
	.head-c{display:none}
	.sec{padding:30px 0}
}
@media (max-width:700px){
	.logo,.head-r{float:none;text-align:left}
	.head-r{margin-top:12px}
	.foot-c{float:none;width:100%;padding:0 0 18px}
	.hero{padding:26px 0}
	.hero-box{padding:20px 18px}
	.btn{display:block;width:100%;margin:0 0 8px}
	.hero-box .btn,.cta .btn{margin:0 0 8px}
	.map iframe{height:300px}
}
