:root {
	--brown: rgb(111,81,63);
	--tan: rgb(207,194,171);
}
main{
	position:relative;
	padding:0;
}

@media screen and (orientation: landscape) and (min-width: 800px) {
	main section {
	  min-height: auto;
	  padding: 15% 0;
	}
  }

.hero .intro > div{
	box-sizing: border-box;
}
.hero .intro .product-image img{
	width:100%;
	height: auto;

}

@media (min-width: 800px) {
	/* for screens iPad and larger */
	
	.hero .intro{
		align-items: center;
		gap:2rem;
	}
	.hero .intro .product-image img{
		width:80%;
		height: auto;

	}
	.hero .intro > div{
		width:50%;
	}

}


.hero .prodColors .brown {
	background-color: var(--brown);
	border-width: .05em;
	border-color: rgb(150, 150, 150);
}
.hero .prodColors .tan {
	background-color: var(--tan);
	border-width: .05em;
	border-color: rgb(150, 150, 150);
}
.hero{
	padding:4rem 0;
	margin-bottom: 0;
	background-color: rgb(133,154, 174);
	
}


.hero .feature-icons{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 1rem;
}

.hero .feature-icons li{
	flex: 0 1 calc(33.333% - 1rem); /* 3 per row, accounting for gap */
	box-sizing: border-box;
}

.prod-photos-a {
	background-color: var(--white);
}

@media (min-width: 800px) {
	.prod-photos-a article{
		display: flex;
		flex-wrap:nowrap;
		justify-content: center;
		gap: 1rem;
	}
	.prod-photos-a article div{
		flex: 0 1 calc(33.333% - 1rem); /* 3 per row, accounting for gap */
		box-sizing: border-box;
		
	}
	.prod-photos-a img{
		width:80%;

	}
}
.megapixels{
	background-image:url(../images/megapixels-bg.jpg);
	background-size: cover;
	background-position:bottom right;
}
.megapixels1{
	background-image:url(../images/jim_m-0050e.jpg);
	background-size: cover;
	background-position:center right;
}

.lens{
	color:var(--black);
	background-color: rgb(236,228,180);
}

.lens article{
	width:100%;
display: flex;
flex-direction: column-reverse;
}

.lens article div{	
	padding: 0;
    margin: 0;
}

.lens article .text{
	box-sizing: border-box;
	padding:10%;
}

.lens2{
background-color:#ece4b4;

	padding:0px;
	margin-top:-50px;
	
}


@media (min-width: 800px) {

	.lens{
		padding: 0;
		margin:0;
	}
	.lens *{
		padding: 0;
		margin:0;
	}
	.lens article{
		width:100%;
		max-width:100%;
		flex-direction: row;
	}
	.lens article div{
		width:50%;
	}

	.lens article div:first-of-type{
		padding:15%;
	}
}
.lcd{
	min-height:0;
	padding:0;
	background-color: rgb(130,167,176);

	
}
.lcd img{
	width: 80%;
	height:auto;
}

.hdvideo{
	background-image: url(../images/hdvideo-bg.jpg);
	background-size:cover;
	background-position: 45% center;

}
@media (min-width: 800px) {
	.hdvideo{
		background-position: right center;
	
	}

}
.battery{
	min-height:0;
	padding:0;
	color:var(--black);
	background-color: var(--white);

}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {

	/* for iPad in portrait mode */
	
}


@media (min-width: 800px) {

	/* for screens iPad and larger */


}


@media screen and (orientation: landscape) and (min-width:800px) {

	/* styles for screens in portrait orientation iPad and larger */

}