body{
	margin:0;
	font-family: Arial;
}

.container{
	width:80%;
	margin:auto;
}

#top-bar{
	background:green;
	color:white;
	padding:10px 0;
}
.left{float:left;}
.right{float:right;}
#top-bar::after{content:"";display:block;clear:both;}
a{color:white;text-decoration:none;}

#banner{
	padding:20px 0;
}
.banner-flex{
	display:flex;
	align-items:center;
	justify-content:space-between;
}
.logo{
	width:120px;
}
.banner-item{
	display:flex;
	align-items:center;
	gap:10px;
}
.banner-item img{
	width:40px;
}
.cart{
	font-weight:bold;
}

#menu{
	background:green;
}
#menu ul{
	display:flex;
	list-style:none;
	margin:0;
	padding:0;
}
#menu li{
	padding:15px 20px;
	color:white;
}

.main{
	display:flex;
	gap:20px;
	margin-top:20px;
	align-items:flex-start;
}

.sidebar{
	width:25%;
	border:1px solid #ccc;
	flex-shrink:0;
}
.sidebar h3{
	background:green;
	color:white;
	margin:0;
	padding:10px;
	text-align:center;
}
.sidebar ul{
	list-style:none;
	padding:0;
	margin:0;
}
.sidebar li{
	padding:10px;
	border-bottom:1px solid #ccc;
}

.content{
	width:75%;
}

.slide{
	width:100%;
	height:300px;
	object-fit:cover;
}

.ads{
	display:flex;
	gap:10px;
	margin:20px 0;
}
.ads img{
	width:33.33%;
	height:120px;
	object-fit:cover;
}

.title{
	background:green;
	color:white;
	padding:10px;
	width:200px;
	text-align:center;
}

.products{
	display:flex;
	gap:20px;
	margin-top:20px;
}
.item{
	border:1px solid #ccc;
	padding:10px;
	text-align:center;
	flex:1;
}
.item img{
	width:100%;
	height:150px;
	object-fit:cover;
}
.item p{
	color:orange;
	font-weight:bold;
}

#footer{
	background:green;
	color:white;
	margin-top:30px;
}
.footer-flex{
	display:flex;
	justify-content:space-between;
	padding:20px 0;
}
.footer-bottom{
	background:#2e6b3f;
	text-align:center;
	padding:10px;
}