body {
  font-family: 'IBM Plex Sans', sans-serif;
  padding: 0;
  margin: 0;
}

@media only screen and (max-width: 600px) {
	body
	{
		background: url('https://dartpedals.b-cdn.net/images/yellow-dart.png?1');
		background-repeat: no-repeat;
		background-position-x: 0;
		background-position-y: 0;
		background-size: 100% auto;
	}
}


.product
{
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: stretch;
	width:100%;
	background: url('https://dartpedals.b-cdn.net/images/yellow-dart.png?1');
	background-position-x: 0;
	background-position-y: 0;
	background-repeat: no-repeat;
	background-size: 60% auto;
}
@media only screen and (max-width: 600px) {
	.product
	{
		background: none;
		flex-direction: column;
	}
}

.product-shot-logo
{
	padding: 1em;
}

.product-shot-logo img
{
	max-width: 100%;
}

.product-shot-name svg
{
	width: 100%;
}

.product-shot
{
	height:100%;
	align-items: center;
	display:flex;
	flex-direction: column;
	justify-content: flex-start;	
	margin-top:2em;
	margin-left:5em;
}
@media only screen and (max-width: 600px) {
	.product-shot
	{
		margin: 1em 2em;
	}
}

.product-shot-pic
{
	position: relative;
}

@media only screen and (max-width: 600px) {
	.product-shot-pic
	{
		width:100%;
	}
	.product-shot-pic img
	{
		width:100%;
	}
}

.product-shot-pic .pic-overlay
{
	position: absolute;
	display:block;
	top:0;
	left:0;
}

.hover-only
{
	opacity: 0;
}
.hover-only:hover
{
	opacity: 100;
}

.product-blurb
{
	height:100%;
	align-items: center;
	display:flex;
	justify-content: flex-start;
	flex-direction: column;
	margin-left:5em;
	margin-right:5em;
	margin-top:2em;
}
@media only screen and (max-width: 600px) {
	.product-blurb
	{
		margin-left:1em;
		margin-right:1em;
		margin-top:2em;
	}
}

.product-blurb
{
	min-width: 0;
}

.product-blurb-name
{
	font-size: 2em;
	margin-bottom: 1em;
	border-bottom: 1px solid black;
}


.product-blurb-specs
{
	margin-top:1em;
	font-size: 2em;
	border-bottom: 1px solid black;
}

.product-blurb .blurb
{
	margin-top:1em;
	
}

.product-blurb .blurb table tr td
{
	padding-right:0.5em;
}


.product-blurb .pic
{
	margin-top:2em;
	margin-left:1em;
	margin-right:1em;
}


.product-blurb .pic img
{
	border: 1px solid black;
}
@media only screen and (max-width: 600px) {
	.product-blurb .pic
	{
		margin-left:0;
		margin-right:0;
	}
	.product-blurb .pic img {
		width:100%;
	}
}

.index-main-menu a 
{
	display: block;
	text-decoration: none;
	color: black;
	margin: 0.5em;
}

.index-main-menu a:hover
{
	text-decoration: underline;
} 

.index-main-menu a:visited
{
	text-decoration: none;
	color: black;
}