body{
	padding: 0;
	margin: 0;
}
.left{float: left;}
.right{float: right;}
.container{padding-left: 7%;padding-right: 7%;}
.navbar{
	width: 100%;
	height: auto;
	padding-top: 1vh;
	padding-bottom: 1vh;
	background-color: #FFFDD0;
	box-shadow: rgba(0,0,0,0.2) 0px 10px 20px -10px;
	position: fixed;
}
.logohomepage{
	width: 10%;
	height: auto;
	font-family: poppins;
	font-weight: bold;
	padding-top: 2vh;
	padding-bottom: 2vh;
}
.navigation{
	width: 80%;
	height: auto;
	text-align: right;
	font-family: poppins;
}
.navigation ul{
	list-style: none;
}
.navigation ul li{
	display: inline-block;
	margin-right: 7px;
}
.navigation ul li a{
	text-decoration: none;
	color: black;
}
.content{
	width: 100%;
	height: auto;
	padding-top: 10vh;
	padding-bottom: 10vh;
	margin-top: 2vh;
}
.category{
	width: 20%;
	height: auto;
	border: rgb(210,210,210) solid 1px;
	border-radius: 7px;
	margin-bottom: 3vh;
	}
.category p{
	font-family: poppins;
	font-weight: bold;
	font-size: large;
	padding-left: 10%;
	padding-right: 10%;
}
.category ul{list-style: none;padding: 0;}
.category ul li{
	font-family: poppins;
	border-bottom: rgb(210,210,210) solid 1px;
	padding-left: 10%;
	padding-right: 10%;
	padding-top: 1vh;
	padding-bottom: 1vh;
}
.category ul li:first-child{
	border-top: rgb(210,210,210) solid 1px;
}
.category ul li:last-child{
	border-bottom: none;
	padding-bottom: 0;
}
.items{width: 75%;height: auto;}
.boxItems{
	width: 30%;
	height: auto;
	display: inline-block;
	padding-bottom: 1vh;
	margin: 1vh;
	border: rgb(210,210,210) solid 1px;
	border-radius: 7px;
	overflow: hidden;
	
}
.boxItems img{width: 100%; height: 240px}
.boxLogin{
	width: 40%;
	height: auto;
	border: rgb(200,200,200) solid 1px;
	margin: auto;
	border-radius: 7px;
	margin-top: 5vh;
	font-family: poppins;
	padding-top: 3vh;
	padding-bottom: 3vh;
}
.boxLogin h3, .boxLogin p{
	margin: 0;
}
.boxLogin table{width: 100%;margin-top: 3vh}
.textfield{
	width: 95%;
	height: auto;
	font-family: poppins;
	padding-left: 2%;
	padding-right: 2%;
	padding-top: 9px;
	padding-bottom: 9px;
	border: none;
	border-radius: 100rem;
	border: rgb(200,200,200) solid 1px;
	outline-width: 0;
}
.textfield:focus{border: #039983 solid 1px;}
.textfield-unborder{
	width: 95%;
	height: auto;
	font-family: poppins;
	padding-left: 2%;
	padding-right: 2%;
	padding-top: 9px;
	padding-bottom: 9px;
	border: none;
	border-radius: 7px;
	border: rgb(200,200,200) solid 1px;
	outline-width: 0;
}
.textfield-unborder:focus{border: #039983 solid 1px;}
.btn-default{
	width: auto;
	height: auto;
	border: none;
	padding: 13px;
	background-color: #039983;
	color: white;
	border-radius: 100rem;
	font-family: poppins;
	cursor: pointer;
}
.tbl-default{border-collapse: collapse;}
.tbl-default tr th{
	background-color: #039983;
	color: white;
	padding: 1vh;
	font-family: poppins;
}
.tbl-default tr td{
	padding: 0.7vh;
	font-family: poppins;
	border-bottom: rgb(200, 200, 200) solid 1px;
}
.imgsproduct{
	width: 25%;
	height: auto;
	border-radius: 7px;
	overflow: hidden;
}
.imgsproduct img{
	width: 100%;
}
.contentproduct{
	width: 70%;
	height: auto;
	padding-bottom: 4vh;
	text-align: left;
	font-family: poppins;
}
.detailproduct{
	width: 95%;
	padding-top: 1vh;
	padding-bottom: 1vh;
	padding-left: 2%;
	padding-right: 2%;
	border: rgb(200, 200, 200) solid 1px;
	border-radius: 7px;
}
.navigationmobile{
	display: none;
	font-size: xx-large;
	font-weight: bold;
	margin-top: 1vh;

}
.modal{
	display: none;
	position: fixed;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	width: auto;
	height: auto;
	z-index: 800;
	background-color: rgba(0, 0, 0, 0.2);
}
.navlistmodal{
	width: 80%;
	height: auto;
	background-color: white;
	margin: auto;
}
.navlistmodal ul{list-style: none; text-align: center; padding: 0;}
.navlistmodal ul li{
	padding-top: 1.5vh;
	padding-bottom: 1.5vh;
	border-bottom: rgb(200, 200, 200) solid 1px;
}
@media screen and (max-width: 480px){
	.items, .boxItems{width: 100%;}
	.category{width: 100%;}
	.navigation{display: none;}
	.logohomepage{width: 30%;}
	.navigationmobile{display: block;}
	.boxLogin{width: 100%;}
	.imgsproduct{width: 90%; text-align: center;}
	.contentproduct{width: 100%;}
}