div.material,div.material_str  	
	{ 
	position:relative; text-align:left; 
	vertical-align:top; display: inline-block;
	box-shadow: inset 0 1px 0 0 #ececec, inset 0 -1px 0 0 #ececec, inset -1px 0 0 0 #ececec, inset 1px 0 0 0 #ececec;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-style: normal;
	text-decoration: none;
	float:left;
	} 
div.material{height: 390px;}
div.material:hover,div.material_str:hover	{box-shadow:0px 5px 30px #CCCCCC, inset -1px 0 0 0 #ececec, inset 1px 0 0 0 #ececec
/* box-shadow:0px 0px 30px #CCCCCC; */
}

div.material_str {
width: 99%;
margin-left: 1%;
margin-bottom: 1%;
}

div.material_inspect
	{
	display: none;width:100%; 
	background:#fff;
	}

div.material:hover div.material_inspect
	{
    display:block;
    position: absolute;
    top: 389px; 
    z-index: 99999;
/* 
    box-shadow:0px 15px 15px #d8d8d8;
 */
   box-shadow:0px 15px 15px #ccc, inset -1px 0 0 0 #ececec, inset 1px 0 0 0 #ececec
    }
/*???*/
/*
div.material:hover div.mi_h
	{
    display:block;
    position: absolute;
    top: 350px; 
    height:20%;
    z-index: 99999;
    box-shadow:0px 15px 15px #d8d8d8;
    margin-top: 10px;
    }
*/
div.img_inner_mimg
{
width:160px;
height:160px;
margin:10% auto;
}
div.img_inner_mimg_str
{
width: 170px;
height: 170px;
margin-left: 20px;
margin-bottom: 20px;
margin-top: 20px;
display: inline-block;
float: left;
}
div.img_inner_mimg, div.img_inner_mimg_str
{
position: relative;
border-radius: 3px;
border: 2px solid white;
box-shadow: 0px 0px 10px #cacaca;
overflow: hidden;
}	
img.mimg
{
width:100%;
position: absolute;
margin: auto;
left: 0;
top: 0;
bottom: 0;
right: 0;
}
img.mimg:hover{ -webkit-filter: brightness(105%);
 -webkit-filter: contrast(115%);  
 transition:0.3s;
 transform: scale(1.05, 1.05);
-ms-transform: scale(1.05, 1.05);
-webkit-transform: scale(1.05, 1.05);
 }
 
 div.name
	{
	height:53px;
	width:92%;
	margin:15px 4% 0 4%;
	text-align: center;
	color: #59f;white-space: normal;padding:0;
	}	
div.name_str{display:inline-block;width:80%;height:25px;line-height:25px;}
div.name,div.name_str{overflow:hidden;text-overflow:ellipsis;}

div.name>a{font-size:15px;-webkit-line-clamp:3;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
line-height:17px;}
div.name_str>a{font-size:20px;}
div.name>a:hover,div.name_str>a:hover{color:#fb5;}
div.price{width:90%;padding:5%;text-align:center;}
div.price_str{margin:10px 0 15px 0;display:inline-block;width:100%;}	
div.price,div.price_str{font-weight:bolder;font-size:17px;}
div.price>i,div.price_str>i{font-size:12px;}

div.m_str{display:flex;opacity:1;transition:0.5s;height:174px;padding:20px;}
div.dsc{display:inline-block;width:100%;max-height:99px;/* font-size:15px; */overflow:hidden;overflow-y:auto;}
div.dsc::-webkit-scrollbar {width:5px;}
div.dsc::-webkit-scrollbar-thumb {border-radius:5px;-webkit-box-shadow: inset 0 0 6px #ccc;}
div.dsc::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px #eee;}
div.companies{width:80%;height:unset;margin:0 10%;padding:0;text-align:center;line-height:20px;}
div.companies_str{width:23%;position:relative;}	
div.companies,div.companies_str
	{
	font-size:12px; 
    overflow:hidden;
    text-overflow:ellipsis;
	}
div.companies>a,div.companies_str>a
	{
	font-weight:bold;
	color:#019642; 
	width:100%;
	float:left;
	}
div.companies>a{-webkit-line-clamp:2;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
line-height:20px;}	
div.companies_str>a{margin-bottom:25px;}
div.companies>a:hover,div.companies_str>a:hover
	{
	color:#fb5; 
	text-decoration:none;	
	}
div.phone 
	{
	display:inline-block;
	cursor:pointer;
	border-bottom: 1px solid transparent;
	color:#019642;
    margin: 0 auto;
    width: max-content;
	line-height:20px;
	}
div.phone:hover 
	{
	cursor:pointer;
	color:#fb5;
	text-decoration: none;
    transition:color 0.3s linear 0s;
	}

div.phone:hover,div.onmap>a:hover,div.addr>a:hover 
	{color:#fb5;	transition: color 0.3s linear 0s;}
div.phone:after,div.onmap>a:after,div.addr>a:after 
	{
	cursor:pointer;
	text-decoration: none;
	display:block;
	content: '';
	border-bottom: 1px dashed;  
	transform: scaleX(0);  
	transition: transform 250ms ease-in-out;
	}
div.phone:hover:after, div.onmap>a:hover:after,div.addr>a:hover:after { transform: scaleX(1); }


div.material div.phone{line-height:19px;
-webkit-line-clamp: 1;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;}	
div.img 
	{
	width:100%;
	min-width:200px; 
	height:270px;
	margin-bottom:15px;
	}
div.img_inner
	{
	width: 80%;
	height: 50%;
	border-radius: 3px;
	border: 2px solid white;
	box-shadow: 0px 0px 10px #cacaca;
	margin-left:9%;
	margin-bottom:5%;
	margin-top:9%;
	}
div.img_inner:hover {
 -webkit-filter: brightness(105%);
 -webkit-filter: contrast(115%);  
}

div.buy {width:70%;margin-left:15%;padding-left:0;}
div.buy_str{position:absolute;width:100%;bottom:40px;left:0;}
div.buy, div.buy_str{text-align:center;display:block;}
/*a из material_detailed.css */
div.buy > a,div.buy_str>a{color:#59f;line-height:13px;font-size: 15px;}
div.about_str{display:inline-block;width:77%;padding-right:20px;}
div.note{width:90%;padding:0;margin:0 5% 20px 5%;text-align:center;height:16px;}	
div.note_str{position:absolute;width:100%;display:inline-block;left:0;bottom:0;}
div.note,div.note_str{color:#019642;}

a.md_buy_link{display:block;padding:7px;color:#5599FF;border-radius: 5px;}
a.md_buy_link:hover{
background-color: #5599FF;
color: #FFF;
text-decoration: none;
transition: background-color 0.5s linear 0s;
cursor: pointer;
border-radius: 5px;
}
div.material div.buy {
padding: 0 0 20px 0;
}

div.like_another_city
	{
	border-radius: 15px;
	width: 15px;
	color: #FFF;
	border: 2px solid red;
	position: absolute;
	display: block;
	text-align: center;
	font-weight: bold;
	background-color: red;
	height: 15px;
	z-index: 99;
    top: 0;
    right: 0;
	}
div.like_another_city:hover{cursor:help;}
div.like_another_city:hover::after{content:"Другой город";color:red;font-style:italic;font-weight:normal;left:-100px;position:absolute;}
div.table_dsc{position:relative;overflow-x:auto;width:100%;max-width:100%;}

@media (max-width: 1000px) and (min-width: 600px)
{
div.companies>a{display:block;overflow:hidden;height:15px;text-overflow: ellipsis;    white-space: nowrap;}
}

@media (max-width: 600px)
{
div.img_inner_mimg{    width: 220px;
    height: 220px;
    margin: 10% auto;}
div.img_inner_mimg>img{display:block;}
div.material:hover div.material_inspect{top:unset;}
div.material_inspect{top:unset;display:block;bottom:0;position:absolute;width:100%;box-shadow:inset 0 0px 0 0 #ececec, inset 0 -1px 0 0 #ececec, inset -1px 0 0 0 #ececec, inset 1px 0 0 0 #ececec;}
div.companies{font-size:13px;}
div.contact{text-align:center;}
div.companies>a{display:block;overflow:hidden;/* height:15px; */text-overflow: ellipsis;    white-space: nowrap;}
/* 
div.phone{margin-top: 5px;}
 */
div.name{white-space:normal;
text-align: center;line-height: 18px;
    overflow: hidden;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;}
div.name>a{font-size:17px;}
div.note{text-align:center;}
div.material{height:500px;}
div.price {padding:2% 5%;}
}

@media (max-width: 1200px) and (min-width: 1100px){div.about_str{width:75%;}div.companies_str{width:25%;}}

@media (max-width: 1100px) and (min-width: 900px)
{
div.material {
max-width: unset;
min-width: unset;
width: 24%;
margin: 0 1% 1% 0;
}
div.material_str{width:99%;}
}

@media (max-width: 900px) and (min-width: 600px)
{
div.material_str{width:100%;}
}

@media (max-width: 1100px) and (min-width: 600px)
{
div.material_str{height: max-content;min-height: 214px;}
div.material_str{margin-left:0;}
}

@media (max-width: 900px) and (min-width: 600px)
{
div.material{width:32%;margin: 0 1% 1% 0;}
}

@media (max-width: 900px) and (min-width: 700px) {div.about_str {width:70%;}div.companies_str{width:30%;}}
@media (max-width: 700px) and (min-width: 600px) {div.about_str {width:60%;}div.companies_str{width:40%;}}

@media (max-width: 470px)
{
div.material,#materials>div.material {width:100%;}
div.img_inner_mimg{width:250px;height:250px;}
}

@media (max-width: 600px) and (min-width: 470px)
{
div.material:hover,div.material_str:hover {box-shadow:0px 0px 10px #CCCCCC, inset -1px 0 0 0 #ececec, inset 1px 0 0 0 #ececec;/* box-shadow:0px 0px 10px #CCCCCC; */}
div.material:hover,div.material_str:hover {box-shadow:0px 0px 10px #CCCCCC, inset -1px 0 0 0 #ececec, inset 1px 0 0 0 #ececec;/* box-shadow:0px 0px 10px #CCCCCC; */}
div.material,#materials>div.material {width:49%; margin:0 1% 1% 0;	}
}