*{
	margin:0;
	padding:0;
	text-decoration: none;
	list-style: none;
	box-sizing: border-box;
}
 body {
	font: 1em sans-serif;
	background-color:white;
	min-height: 100vh;
    }

nav{
	background: black;
	height: 70px;
	width: 100%;
    position: fixed;
	box-shadow: 1px 1px 15px #888888;
}
.logo{
	height: 70px;
	padding: 5px;
}
nav ul{
	float: right;
	margin-right:20px;
	}
nav ul li{
		display: inline-block;
		line-height:70px;
		margin:0 5px	;
		}
nav ul li a{
	color:white;
	font-size:17px;
	padding: 7px 13px;
	border-radius: 3px;
	font-weight: bold;
	text-transform: uppercase;
	}
a.active, a:hover{
	background: #222222;
	color: white;
	padding: 7px;
	border-radius: 5px;
	transition: .5s;
	}
.checkbtn{
	font-size: 30px;
	float: right;
	line-height: 80px;
	margin-right: 40px;
	cursor: pointer;
	display: none;	
}

#check{
	display: none;
}
@media (max-width: 952px){
	label.logo{
		font-size: 30px;
		padding-left: 50px;
	}
	nav ul li a{
		font-size: 16px;
	}
}
@media (max-width: 858px){
	.checkbtn{
		display: block;
	}
	ul{
		position: fixed;
		width: 50%;
		height: 100vh;
		top: 70px;
		left: -100%;
		transition: all.5s;
		text-align: center;
		background: rgba(0, 0, 0, 0.9);
	}
	
	nav ul li{
		display:block;
		margin: 30px 0px;   
		line-height: 30px;

	}
	nav ul li a{
		font-size:20px;
	}
	a:hover, a.active{
		background: #222222;
		color: white;
		padding: 7px;
		border-radius: 5px;
	}
	#check:checked~ul{
		left: 0;
		
	}
}

.featuring{
	margin:0px 10px 0px 10px;
	padding:90px 15px;
	background-color: white;
	min-height: 80vh;
	border: 1px solid rgb(200, 200, 200);
	box-shadow: 1px 1px 15px #888888;
}
h2{
	text-align: left;
	margin: 15px;
}
.newproducts{
	width: 100%;
	height: auto;
	padding: 5px;
	margin-bottom: 10px;
	border-radius: 20px;
	border-radius: 15px;
	background-color: white;
	box-shadow: 1px 1px 15px #888888;
}
.producttitlebox{
	color: white;
	padding: 10px;
	height: auto;	
	display:flex;
	
}
.productname{
	color: black;
	font-weight: bold;
	padding: 10px 5px 5px 5px ;
	font-size: medium;
	margin-bottom:10px;
}
.productdesc{
	color: black;
	padding: 5px;
	margin-bottom: 10px;
	height: fit-content;
}
.producticon{
	float: left;
	margin: 10px;
	border-radius: 50px;
}
.producticon img{
	border-radius: 20px;
	width: 90px;
}
.downloadbtn{
	height:fit-content ;
	width: fit-content;
	padding:10px;
	font-size:11px;
	margin-bottom: 10px;
	background-color: rgb(224, 224, 224);
	color: white;
	border: 1px solid rgb(46, 46, 46);
	border-radius: 10px;
	font-weight: bold;
	box-shadow: 1px 1px 5px #888888;
}

.productytvideo{
	margin: 2px 2px 5px 2px;
}
.productytvideo iframe {
	border-radius: 15px;
	aspect-ratio: 16 / 9;
	width: 100%;
	height: 250px;
	box-shadow: 1px 1px 15px #888888;
  }

p{
	font-size: medium;
}
.card{
	padding: 10px;
	margin: 2px;
	display: block;
	height: auto;
	text-size-adjust:none;
	border-radius: 10px;
	background-color: white;
	box-shadow: 1px 1px 15px #888888;
}
.hrimgcard{
	max-height: 70%;
	display: flex;
	flex-direction: row;
	overflow-x: auto;
}
.hrimgcard .hrimg{
	width: 95%;
	height: 200px;
	margin: 5px;
	background-size: contain;
	box-shadow: 1px 1px 15px #888888;
}
.hrimgcard .vrimg{
	width: fit-content;
	height: 200px;
	margin: 5px;
	background-size: contain;
	box-shadow: 1px 1px 15px #888888;
}

  footer{
	background-color: rgb(222, 222, 222);
	box-shadow: 1px 1px 15px #888888;
	display: flex;
	position: relative;
	bottom: 0;
	width: 100%;
	flex-wrap: wrap;
  }
  .foots{
	color: black;
	padding: 15px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: smaller;
  }