/*
You can add your own CSS here.

Click the help icon above to learn more.
*/

.products {
	display: flex;
	flex-wrap: wrap;
}

.badges {
	display: flex;
	flex-wrap: wrap;
}

.videos {
	display: flex;
	flex-wrap: wrap;
}


.product-card {
	display: flex;
	flex-direction: column;
  min-width:250px;
	max-width:250px;
	
	padding: 2%;
	flex: 1 16%;
	
	background-color: #FFF;
	box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.25);
}

.product-image img {
	width: 100%;
}

.video-image img {
	width: 100%;
}


.video {
	display: flex;
	flex-direction: column;
  min-width:385px;
	max-width:385px;
	
	padding: 2%;
	flex: 1 16%;
	
	background-color: #FFF;
	box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.25);
}

.video-info {
	margin-top: none;
	padding-top: 20px;
	text-align: center;
}

.product-info {
	margin-top: none;
	padding-top: 20px;
	text-align: center;
}



@media ( max-width: 400px ) {
	
	.product-card {
		flex: 1 21%;
	}
	
	.products .product-card:first-child, 
	.products .product-card:nth-child(2) {
		flex: 2 46%;
	}
	
}

@media ( max-width: 400px ) {
	
	.product-card {
		flex: 1 46%;
	}
	
}

@media ( max-width: 400px ) {
	
	h1 {
		margin-bottom: 20px;
	}
	
	.product-filter {
		flex-direction: column;
	}
	
	.sort {
		align-self: flex-start;
	}
	
}

.wrapper{
    clear:both;
}

.iframe-container {
  overflow: hidden;
  padding-top: 56.25%;
  position: relative;
}

.iframe-container iframe {
   border: 0;
   height: 100%;
   left: 0;
   position: absolute;
   top: 0;
   width: 100%;
}





.badge-card {
	display: flex;
	flex-direction: column;
  min-width:350px;
	max-width:392px;
	
	padding: 2%;
	flex: 1 16%;
	
	background-color: #FFF;
	box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.25);
}

.badge-image img {
	width: 200px;
}

.badge-info {
	margin-top: none;
	padding-top: 20px;
	text-align: left;
	background-color: #FFF;
}


@media ( max-width: 392px ) {
	
	.badge-card {
		flex: 1 21%;
	}
	
	.badges .badge-card:first-child, 
	.badges .badge-card:nth-child(2) {
		flex: 2 46%;
	}
	
}

@media ( max-width: 392px ) {
	
	.badge-card {
		flex: 1 46%;
	}
	
}