@charset "utf-8";
/* CSS Document */
body{
	margin:0;
	padding:0;}
	img{ width:100%;
			font-family:'oswald' arial, helvetica, sans-serif;
}
.rows{
		display:grid;
		grid-template-areas:
		'c1 c1 c1 c2 c2 c2 c2 c2'
		'c3 c3 c3 c3 c3 c3 c3 c3'
		'c4 c4 c4 c4 c4 c4 c4 c4';
		}

.c1{
			grid-area: c1;
}
.c2{
			grid-area: c2;}
.c3{
			grid-area: c3;
}
.c4{
			grid-area: c4;
}


.load-price a{ text-decoration:none;}
.load{ margin:15px;
order:999;
		display:grid;
		grid-template-areas:
		'load-1 load-2 load-3 load-4 hero feature-1';
		gap:10px;
		}
.load-1{
			grid-area: load-1;
}
.load-2{
			grid-area: load-2;
}
.load-3{
			grid-area: load-3;
}
.load-4{
			grid-area: load-4;
}

.load-a{
		display:grid;
		grid-template-areas:
		'load-a-b load-a-c';
		}
.load-a-b{
			grid-area: load-a-b;
			}
.load-a-c{
grid-area: load-a-c;
}
.load-a b{ text-align:right; padding:10px;}
.cuci{box-shadow:2px 2px 3px rgba(0,0,0,0.5);}
.cuci img{ padding:10px 15px; border-radius:15px;}


/* scrols */
.scrols{ display:grid;
padding:15px;}
.scrols .scrol{
	display:grid; list-style:none;
			 grid-template-columns: repeat(4, 1fr);
			 text-align:center;
			 gap:7px;
}			 

.scrols .scrol li{ background-color:white; border:1px solid rgba(0,0,0,0.3) ; box-shadow:2px 2px 7px rgba(0,0,0,0.5);
padding:10px;}
					.scrols .scrol li img{ max-width:100px;}
.scrols .scrol li a{ text-decoration:none; color:#000;}
.scrols .scrol li a:hover{ text-decoration:none; color:#de0043;}
			 

@media (max-width: 760px){
.rows{
		display:grid;
		grid-template-areas:
		'c1 '
		'c2'
		'c3' 
		'c4'; 
		}
.exnav{ display:none;}
.navi{ background-color:#fff; box-shadow:-2px -2px 3px rgba(0,0,0,0.1); border-top-left-radius:20px;  border-top-right-radius:20px; padding:10px;}
.navi a { text-decoration:none; font-weight:100; color:#16172E;}

.scrols ul{ display:grid; width:100%;
				grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));}
				.scrols .scrol{ background-color:#fff;
				max-width:100%;
				overflow-x:auto;}
				.scrols{ color:#fff;
				line-height:0px;
				overflow:hidden;}
				.scrols a{
					font-size:14px;
					color:#000;
					text-decoration:none;
					padding:10px 13px;
					line-height:1.5em;
					display:block;}
					.scrols a:hover{ background-color:rgba(0,0,0,.25);
					color:#fff;
					text-decoration:none;}
					.scrols ul, .scrols li{
						list-style:none;
						display: inline-block;
						white-space: nowrap;
						padding:0;
						}
					.scrols .scrol li img{ max-width:400px;}
}