/* ----------- iPad 1, 2, Mini and Air ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 1) {
	.contentHeading, h1{
		font-size: 2em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	
	.cvDesktop{
		
		display:block;
		
	}
	
	.cvMobile{
		display:none;
		
	}
}

/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* ----------- iPad 3, 4 and Pro 9.7" ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 2) {
	.contentHeading, h1{
		font-size: 2.5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	
	.cvDesktop{
		
		display:block;
		
	}
	
	.cvMobile{
		display:none;
		
	}
}

/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* ----------- iPad Pro 10.5" ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 834px) 
  and (max-device-width: 1112px)
  and (-webkit-min-device-pixel-ratio: 2) {
	.contentHeading, h1{
		font-size: 2.5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	
	.cvDesktop{
		
		display:block;
		
	}
	
	.cvMobile{
		display:none;
		
	}
}

/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
  and (min-device-width: 834px) 
  and (max-device-width: 834px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Landscape */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
  and (min-device-width: 1112px) 
  and (max-device-width: 1112px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* ----------- iPad Pro 12.9" ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1366px)
  and (-webkit-min-device-pixel-ratio: 2) {
	.contentHeading, h1{
		font-size: 2.5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	
	.cvDesktop{
		
		display:block;
		
	}
	
	.cvMobile{
		display:none;
		
	}
}

/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Landscape */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
  and (min-device-width: 1366px) 
  and (max-device-width: 1366px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* ----------- Galaxy Tab 2 ----------- */

/* Portrait and Landscape */
@media 
  (min-device-width: 800px) 
  and (max-device-width: 1280px) {
	.contentHeading, h1{
		font-size: 2.5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	
	.cvDesktop{
		
		display:block;
		
	}
	
	.cvMobile{
		display:none;
		
	}
}

/* Portrait */
@media 
  (max-device-width: 800px) 
  and (orientation: portrait) { 

}

/* Landscape */
@media 
  (max-device-width: 1280px) 
  and (orientation: landscape) { 

}

/* ----------- Galaxy Tab S ----------- */

/* Portrait and Landscape */
@media 
  (min-device-width: 800px) 
  and (max-device-width: 1280px)
  and (-webkit-min-device-pixel-ratio: 2) {
	.contentHeading, h1{
		font-size: 2.5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	
	.cvDesktop{
		
		display:block;
		
	}
	
	.cvMobile{
		display:none;
		
	}
}

/* Portrait */
@media 
  (max-device-width: 800px) 
  and (orientation: portrait)
  and (-webkit-min-device-pixel-ratio: 2) { 

}

/* Landscape */
@media 
  (max-device-width: 1280px) 
  and (orientation: landscape)
  and (-webkit-min-device-pixel-ratio: 2) { 

}

/* ----------- Nexus 7 ----------- */

/* Portrait and Landscape */
@media screen 
  and (device-width: 601px) 
  and (device-height: 906px) 
  and (-webkit-min-device-pixel-ratio: 1.331) 
  and (-webkit-max-device-pixel-ratio: 1.332) {
	.contentHeading, h1{
		font-size: 2.5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	
	.cvDesktop{
		
		display:block;
		
	}
	
	.cvMobile{
		display:none;
		
	}
}

/* Portrait */
@media screen 
  and (device-width: 601px) 
  and (device-height: 906px) 
  and (-webkit-min-device-pixel-ratio: 1.331) 
  and (-webkit-max-device-pixel-ratio: 1.332) 
  and (orientation: portrait) {

}

/* Landscape */
@media screen 
  and (device-width: 601px) 
  and (device-height: 906px) 
  and (-webkit-min-device-pixel-ratio: 1.331) 
  and (-webkit-max-device-pixel-ratio: 1.332) 
  and (orientation: landscape) {

}

/* ----------- Nexus 9 ----------- */

/* Portrait and Landscape */
@media screen 
  and (device-width: 1536px) 
  and (device-height: 2048px) 
  and (-webkit-min-device-pixel-ratio: 1.331) 
  and (-webkit-max-device-pixel-ratio: 1.332) {
	.contentHeading, h1{
		font-size: 2.5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	
	.cvDesktop{
		
		display:block;
		
	}
	
	.cvMobile{
		display:none;
		
	}
}

/* Portrait */
@media screen 
  and (device-width: 1536px) 
  and (device-height: 2048px) 
  and (-webkit-min-device-pixel-ratio: 1.331) 
  and (-webkit-max-device-pixel-ratio: 1.332) 
  and (orientation: portrait) {

}

/* Landscape */
@media screen 
  and (device-width: 1536px) 
  and (device-height: 2048px) 
  and (-webkit-min-device-pixel-ratio: 1.331) 
  and (-webkit-max-device-pixel-ratio: 1.332) 
  and (orientation: landscape) {

}

/* ----------- Kindle Fire HD 7" ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 800px) 
  and (max-device-width: 1280px) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
	.contentHeading, h1{
		font-size: 2em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	
	.cvDesktop{
		
		display:block;
		
	}
	
	.cvMobile{
		display:none;
		
	}
}

/* Portrait */
@media only screen 
  and (min-device-width: 800px) 
  and (max-device-width: 1280px) 
  and (-webkit-min-device-pixel-ratio: 1.5) 
  and (orientation: portrait) {
}

/* Landscape */
@media only screen 
  and (min-device-width: 800px) 
  and (max-device-width: 1280px) 
  and (-webkit-min-device-pixel-ratio: 1.5) 
  and (orientation: landscape) {

}

/* ----------- Kindle Fire HD 8.9" ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
	.contentHeading, h1{
		font-size: 2.5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	
	.cvDesktop{
		
		display:block;
		
	}
	
	.cvMobile{
		display:none;
		
	}
}

/* Portrait */
@media only screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 1.5) 
  and (orientation: portrait) {
}

/* Landscape */
@media only screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 1.5) 
  and (orientation: landscape) {

}



/* ----------- iPhone 4 and 4S ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2) {
		
.contentHeading, h1{
		font-size: 1em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	.overlay-content {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width : 100%;
	}

	/* Ensure .btn-close is visible on the dark background */
	.btn-close {
	  filter: invert(1);
	  float:right;
	  margin-right:5%;

	}

	.overlay {
		/* Other styles */
		height:0px;
		transition: height 1s;
	}

	.activeImg {
		height: 100vh;
		transition: height 1s;
	}

	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;
		max-width: 21vw;
		max-height: 10vh;
		height:20vh;
		width:auto;

	}

	.thumbnails{
		position: relative; 
		width: 100%; 
		display:inline-block;
	}

	.activeThumb{
		border: 1px solid black;

	}
	#displayImg{
		
		max-width:90vw;
		max-height:50vh;
		height: auto;
		width:auto;
		
		 object-fit: contain;
		
	}
	.displayImg{
	text-align: center;
	display: inline-block;
	
	
	
	}
	.cvDesktop{
		
		display:none;
		
	}
	
	.cvMobile{
		display:block;
		
	}
	
	.filterIcon{
		
		float:right;
		color:#000;;
	}
}

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {

}

/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {

}

/* ----------- iPhone 5, 5S, 5C and 5SE ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) {
	
.contentHeading, h1{
		font-size: 1.5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	.overlay-content {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width : 100%;
	}

	/* Ensure .btn-close is visible on the dark background */
	.btn-close {
	  filter: invert(1);
	  float:right;
	  margin-right:5%;

	}

	.overlay {
		/* Other styles */
		height:0px;
		transition: height 1s;
	}

	.activeImg {
		height: 100vh;
		transition: height 1s;
	}

	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;
		max-width: 21vw;
		max-height: 10vh;
		height:20vh;
		width:auto;

	}

	.thumbnails{
		position: relative; 
		width: 100%; 
		display:inline-block;
	}

	.activeThumb{
		border: 1px solid black;

	}
	#displayImg{
		
		max-width:90vw;
		max-height:50vh;
		height: auto;
		width:auto;
		
		 object-fit: contain;
		
	}
	.displayImg{
	text-align: center;
	display: inline-block;
	
	
	
	}
	.cvDesktop{
		
		display:none;
		
	}
	
	.cvMobile{
		display:block;
		
	}
	
	.filterIcon{
		
		float:right;
		color:#000;
	}
}

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
}

/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {

}

/* ----------- iPhone 6, 6S, 7 and 8 ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2) { 
  	
.contentHeading, h1{
		font-size: 1.5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	.overlay-content {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width : 100%;
	}

	/* Ensure .btn-close is visible on the dark background */
	.btn-close {
	  filter: invert(1);
	  float:right;
	  margin-right:5%;

	}

	.overlay {
		/* Other styles */
		height:0px;
		transition: height 1s;
	}

	.activeImg {
		height: 100vh;
		transition: height 1s;
	}

	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;
		max-width: 21vw;
		max-height: 10vh;
		height:20vh;
		width:auto;

	}

	.thumbnails{
		position: relative; 
		width: 100%; 
		display:inline-block;
	}

	.activeThumb{
		border: 1px solid black;

	}
	#displayImg{
		
		max-width:90vw;
		max-height:50vh;
		height: auto;
		width:auto;
		
		 object-fit: contain;
		
	}
	.displayImg{
	text-align: center;
	display: inline-block;
	
	
	
	}
	.cvDesktop{
		
		display:none;
		
	}
	
	.cvMobile{
		display:block;
		
	}
	
	.filterIcon{
		
		float:right;
		color:#000;;
	}

}

/* Portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) { 

}

/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) { 

}

/* ----------- iPhone 6+, 7+ and 8+ ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3) { 
  	
	.contentHeading, h1{
		font-size: .5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	.overlay-content {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width : 100%;
	}

	/* Ensure .btn-close is visible on the dark background */
	.btn-close {
	  filter: invert(1);
	  float:right;
	  margin-right:5%;

	}

	.overlay {
		/* Other styles */
		height:0px;
		transition: height 1s;
	}

	.activeImg {
		height: 100vh;
		transition: height 1s;
	}

	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;
		max-width: 21vw;
		max-height: 10vh;
		height:20vh;
		width:auto;

	}

	.thumbnails{
		position: relative; 
		width: 100%; 
		display:inline-block;
	}

	.activeThumb{
		border: 1px solid black;

	}
	#displayImg{
		
		max-width:90vw;
		max-height:50vh;
		height: auto;
		width:auto;
		
		 object-fit: contain;
		
	}
	.displayImg{
	text-align: center;
	display: inline-block;
	
	
	
	}
	.cvDesktop{
		
		display:none;
		
	}
	
	.cvMobile{
		display:block;
		
	}
	
	.filterIcon{
		
		float:right;
		color:#000;;
	}

}

/* Portrait */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 

}

/* Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 

}

/* ----------- iPhone X ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3) { 
		
	.contentHeading, h1{
		font-size: 1.5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	.overlay-content {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width : 100%;
	}

	/* Ensure .btn-close is visible on the dark background */
	.btn-close {
	  filter: invert(1);
	  float:right;
	  margin-right:5%;

	}

	.overlay {
		/* Other styles */
		height:0px;
		transition: height 1s;
	}

	.activeImg {
		height: 100vh;
		transition: height 1s;
	}

	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;
		max-width: 21vw;
		max-height: 10vh;
		height:20vh;
		width:auto;

	}

	.thumbnails{
		position: relative; 
		width: 100%; 
		display:inline-block;
	}

	.activeThumb{
		border: 1px solid black;

	}
	#displayImg{
		
		max-width:90vw;
		max-height:50vh;
		height: auto;
		width:auto;
		
		
		 object-fit: contain;
	}
	.displayImg{
	text-align: center;
	display: inline-block;
	
	
	
	}
	.cvDesktop{
		
		display:none;
		
	}
	
	.cvMobile{
		display:block;
		
	}
	
	.filterIcon{
		
		float:right;
		color:#000;;
	}
}

/* Portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 

}

/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 
 
	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;
		max-width: 10vw;
		max-height: 10vh;
		height:20vh;
		width:auto;

	}
	
	
	.thumbnails{
		position: relative; 
		width: 100%; 
		display:inline-block;
	}
}



/* ----------- Galaxy S3 ----------- */

/* Portrait and Landscape */
@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 2) {
	.contentHeading, h1{
		font-size: 1.5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	.overlay-content {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width : 100%;
	}

	/* Ensure .btn-close is visible on the dark background */
	.btn-close {
	  filter: invert(1);
	  float:right;
	  margin-right:5%;

	}

	.overlay {
		/* Other styles */
		height:0px;
		transition: height 1s;
	}

	.activeImg {
		height: 100vh;
		transition: height 1s;
	}

	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;
		max-width: 21vw;
		max-height: 10vh;
		height:20vh;
		width:auto;

	}

	.thumbnails{
		position: relative; 
		width: 100%; 
		display:inline-block;
	}

	.activeThumb{
		border: 1px solid black;

	}
	#displayImg{
		
		max-width:90vw;
		max-height:50vh;
		height: auto;
		width:auto;
		
		 object-fit: contain;
		
	}
	.displayImg{
	text-align: center;
	display: inline-block;
	
	
	
	}
	.cvDesktop{
		
		display:none;
		
	}
	
	.cvMobile{
		display:block;
		
	}
	
	.filterIcon{
		
		float:right;
		color:#000;;
	}
}
}

/* Portrait */
@media screen 
  and (device-width: 320px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 2) 
  and (orientation: portrait) {

}

/* Landscape */
@media screen 
  and (device-width: 320px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 2) 
  and (orientation: landscape) {

}

/* ----------- Galaxy S4, S5 and Note 3 ----------- */

/* Portrait and Landscape */
@media screen 
  and (device-width: 320px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) {
.contentHeading, h1{
		font-size: 1.5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	.overlay-content {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width : 100%;
	}

	/* Ensure .btn-close is visible on the dark background */
	.btn-close {
	  filter: invert(1);
	  float:right;
	  margin-right:5%;

	}

	.overlay {
		/* Other styles */
		height:0px;
		transition: height 1s;
	}

	.activeImg {
		height: 100vh;
		transition: height 1s;
	}

	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;
		max-width: 21vw;
		max-height: 10vh;
		height:20vh;
		width:auto;

	}

	.thumbnails{
		position: relative; 
		width: 100%; 
		display:inline-block;
	}

	.activeThumb{
		border: 1px solid black;

	}
	#displayImg{
		
		max-width:90vw;
		max-height:50vh;
		height: auto;
		width:auto;
		
		 object-fit: contain;
		
	}
	.displayImg{
	text-align: center;
	display: inline-block;
	
	
	
	}
	.cvDesktop{
		
		display:none;
		
	}
	
	.cvMobile{
		display:block;
		
	}
	
	.filterIcon{
		
		float:right;
		color:#000;;
	}
}
}

/* Portrait */
@media screen 
  and (device-width: 320px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) 
  and (orientation: portrait) {

}

/* Landscape */
@media screen 
  and (device-width: 320px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) 
  and (orientation: landscape) {

}

/* ----------- Galaxy S6 ----------- */

/* Portrait and Landscape */
@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 4) {
.contentHeading, h1{
		font-size: 1.5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	.overlay-content {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width : 100%;
	}

	/* Ensure .btn-close is visible on the dark background */
	.btn-close {
	  filter: invert(1);
	  float:right;
	  margin-right:5%;

	}

	.overlay {
		/* Other styles */
		height:0px;
		transition: height 1s;
	}

	.activeImg {
		height: 100vh;
		transition: height 1s;
	}

	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;
		max-width: 21vw;
		max-height: 10vh;
		height:20vh;
		width:auto;

	}

	.thumbnails{
		position: relative; 
		width: 100%; 
		display:inline-block;
	}

	.activeThumb{
		border: 1px solid black;

	}
	#displayImg{
		
		max-width:90vw;
		max-height:50vh;
		height: auto;
		width:auto;
		
		 object-fit: contain;
		
	}
	.displayImg{
	text-align: center;
	display: inline-block;
	
	
	
	}
	.cvDesktop{
		
		display:none;
		
	}
	
	.cvMobile{
		display:block;
		
	}
	
	.filterIcon{
		
		float:right;
		color:#000;;
	}
}
}

/* Portrait */
@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 4) 
  and (orientation: portrait) {

}

/* Landscape */
@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 4) 
  and (orientation: landscape) {

}

/* ----------- HTC One ----------- */

/* Portrait and Landscape */
@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) {
.contentHeading, h1{
		font-size: 1.5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	.overlay-content {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width : 100%;
	}

	/* Ensure .btn-close is visible on the dark background */
	.btn-close {
	  filter: invert(1);
	  float:right;
	  margin-right:5%;

	}

	.overlay {
		/* Other styles */
		height:0px;
		transition: height 1s;
	}

	.activeImg {
		height: 100vh;
		transition: height 1s;
	}

	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;
		max-width: 21vw;
		max-height: 10vh;
		height:20vh;
		width:auto;

	}

	.thumbnails{
		position: relative; 
		width: 100%; 
		display:inline-block;
	}

	.activeThumb{
		border: 1px solid black;

	}
	#displayImg{
		
		max-width:90vw;
		max-height:50vh;
		height: auto;
		width:auto;
		
		 object-fit: contain;
		
	}
	.displayImg{
	text-align: center;
	display: inline-block;
	
	
	
	}
	.cvDesktop{
		
		display:none;
		
	}
	
	.cvMobile{
		display:block;
		
	}
	
	.filterIcon{
		
		float:right;
		color:#000;;
	}
}
}

/* Portrait */
@media screen 
  and (device-width: 320px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) 
  and (orientation: portrait) {

}

/* Landscape */
@media screen 
  and (device-width: 320px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) 
  and (orientation: landscape) {

}

/* ----------- Galaxy S6 ----------- */

/* Portrait and Landscape */
@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 4) {
.contentHeading, h1{
		font-size: 1.5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	.overlay-content {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width : 100%;
	}

	/* Ensure .btn-close is visible on the dark background */
	.btn-close {
	  filter: invert(1);
	  float:right;
	  margin-right:5%;

	}

	.overlay {
		/* Other styles */
		height:0px;
		transition: height 1s;
	}

	.activeImg {
		height: 100vh;
		transition: height 1s;
	}

	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;
		max-width: 21vw;
		max-height: 10vh;
		height:20vh;
		width:auto;

	}

	.thumbnails{
		position: relative; 
		width: 100%; 
		display:inline-block;
	}

	.activeThumb{
		border: 1px solid black;

	}
	#displayImg{
		
		max-width:90vw;
		max-height:50vh;
		height: auto;
		width:auto;
		
		 object-fit: contain;
		
	}
	.displayImg{
	text-align: center;
	display: inline-block;
	
	
	
	}
	.cvDesktop{
		
		display:none;
		
	}
	
	.cvMobile{
		display:block;
		
	}
	
	.filterIcon{
		
		float:right;
		color:#000;;
	}
}
}

/* Portrait */
@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) 
  and (orientation: portrait) {

}

/* Landscape */
@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) 
  and (orientation: landscape) {

}

/* ----------- Google Pixel ----------- */

/* Portrait and Landscape */
@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) {
	.contentHeading, h1{
		font-size: 1.5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	.overlay-content {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width : 100%;
	}

	/* Ensure .btn-close is visible on the dark background */
	.btn-close {
	  filter: invert(1);
	  float:right;
	  margin-right:5%;

	}

	.overlay {
		/* Other styles */
		height:0px;
		transition: height 1s;
	}

	.activeImg {
		height: 100vh;
		transition: height 1s;
	}

	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;
		max-width: 21vw;
		max-height: 10vh;
		height:20vh;
		width:auto;

	}

	.thumbnails{
		position: relative; 
		width: 100%; 
		display:inline-block;
	}

	.activeThumb{
		border: 1px solid black;

	}
	#displayImg{
		
		max-width:90vw;
		max-height:50vh;
		
		 object-fit: contain;
		
	}
	.displayImg{
	text-align: center;
	display: inline-block;
	
	
	
	}
	.cvDesktop{
		
		display:none;
		
	}
	
	.cvMobile{
		display:block;
		
	}
	
	.filterIcon{
		
		float:right;
		color:#000;;
	}
}

/* Portrait */
@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) 
  and (orientation: portrait) {

}

/* Landscape */
@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) 
  and (orientation: landscape) {

}

/* ----------- Google Pixel XL ----------- */

/* Portrait and Landscape */
@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 4) {
.contentHeading, h1{
		font-size: 1.5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	.overlay-content {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width : 100%;
	}

	/* Ensure .btn-close is visible on the dark background */
	.btn-close {
	  filter: invert(1);
	  float:right;
	  margin-right:5%;

	}

	.overlay {
		/* Other styles */
		height:0px;
		transition: height 1s;
	}

	.activeImg {
		height: 100vh;
		transition: height 1s;
	}

	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;
		max-width: 21vw;
		max-height: 10vh;
		height:20vh;
		width:auto;

	}

	.thumbnails{
		position: relative; 
		width: 100%; 
		display:inline-block;
	}

	.activeThumb{
		border: 1px solid black;

	}
	#displayImg{
		
		max-width:90vw;
		max-height:50vh;
		
		 object-fit: contain;
		
	}
	.displayImg{
	text-align: center;
	display: inline-block;
	
	
	
	}
	.cvDesktop{
		
		display:none;
		
	}
	
	.cvMobile{
		display:block;
		
	}
	
	.filterIcon{
		
		float:right;
		color:#000;;
	}
}

/* Portrait */
@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 4) 
  and (orientation: portrait) {

}

/* Landscape */
@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 4) 
  and (orientation: landscape) {

}

/* ----------- Nexus 4 ----------- */

/* Portrait and Landscape */
@media screen 
  and (device-width: 384px) 
  and (device-height: 592px) 
  and (-webkit-device-pixel-ratio: 2) {
.contentHeading, h1{
		font-size: .5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	.overlay-content {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width : 100%;
	}

	/* Ensure .btn-close is visible on the dark background */
	.btn-close {
	  filter: invert(1);
	  float:right;
	  margin-right:5%;

	}

	.overlay {
		/* Other styles */
		height:0px;
		transition: height 1s;
	}

	.activeImg {
		height: 100vh;
		transition: height 1s;
	}

	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;
		max-width: 21vw;
		max-height: 10vh;
		height:20vh;
		width:auto;

	}

	.thumbnails{
		position: relative; 
		width: 100%; 
		display:inline-block;
	}

	.activeThumb{
		border: 1px solid black;

	}
	#displayImg{
		
		max-width:90vw;
		max-height:50vh;
		
		 object-fit: contain;
		
	}
	.displayImg{
	text-align: center;
	display: inline-block;
	
	
	
	}
	.cvDesktop{
		
		display:none;
		
	}
	
	.cvMobile{
		display:block;
		
	}
	
	.filterIcon{
		
		float:right;
		color:#000;;
	}
}

/* Portrait */
@media screen 
  and (device-width: 384px) 
  and (device-height: 592px) 
  and (-webkit-device-pixel-ratio: 2)
  and (orientation: portrait) {

}

/* Landscape */
@media screen 
  and (device-width: 384px) 
  and (device-height: 592px) 
  and (-webkit-device-pixel-ratio: 2)
  and (orientation: landscape) {

}

/* ----------- Nexus 5 ----------- */

/* Portrait and Landscape */
@media screen 
  and (device-width: 360px) 
  and (device-height: 592px) 
  and (-webkit-device-pixel-ratio: 3) {
.contentHeading, h1{
		font-size: .5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	.overlay-content {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width : 100%;
	}

	/* Ensure .btn-close is visible on the dark background */
	.btn-close {
	  filter: invert(1);
	  float:right;
	  margin-right:5%;

	}

	.overlay {
		/* Other styles */
		height:0px;
		transition: height 1s;
	}

	.activeImg {
		height: 100vh;
		transition: height 1s;
	}

	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;
		max-width: 21vw;
		max-height: 10vh;
		height:20vh;
		width:auto;

	}

	.thumbnails{
		position: relative; 
		width: 100%; 
		display:inline-block;
	}

	.activeThumb{
		border: 1px solid black;

	}
	#displayImg{
		
		max-width:90vw;
		max-height:50vh;
		
		 object-fit: contain;
		
	}
	.displayImg{
	text-align: center;
	display: inline-block;
	
	
	
	}
	.cvDesktop{
		
		display:none;
		
	}
	
	.cvMobile{
		display:block;
		
	}
	
	.filterIcon{
		
		float:right;
		color:#000;;
	}
}

/* Portrait */
@media screen 
  and (device-width: 360px) 
  and (device-height: 592px) 
  and (-webkit-device-pixel-ratio: 3)
  and (orientation: portrait) {

}

/* Landscape */
@media screen 
  and (device-width: 360px) 
  and (device-height: 592px) 
  and (-webkit-device-pixel-ratio: 3)
  and (orientation: landscape) {

}

/* ----------- Nexus 6 and 6P ----------- */

/* Portrait and Landscape */
@media screen 
  and (device-width: 360px) 
  and (device-height: 592px) 
  and (-webkit-device-pixel-ratio: 4) {
.contentHeading, h1{
		font-size: .5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	.overlay-content {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width : 100%;
	}

	/* Ensure .btn-close is visible on the dark background */
	.btn-close {
	  filter: invert(1);
	  float:right;
	  margin-right:5%;

	}

	.overlay {
		/* Other styles */
		height:0px;
		transition: height 1s;
	}

	.activeImg {
		height: 100vh;
		transition: height 1s;
	}

	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;
		max-width: 21vw;
		max-height: 10vh;
		height:20vh;
		width:auto;

	}

	.thumbnails{
		position: relative; 
		width: 100%; 
		display:inline-block;
	}

	.activeThumb{
		border: 1px solid black;

	}
	#displayImg{
		
		max-width:90vw;
		max-height:50vh;
		
		 object-fit: contain;
		
	}
	.displayImg{
	text-align: center;
	display: inline-block;
	
	
	
	}
	.cvDesktop{
		
		display:none;
		
	}
	
	.cvMobile{
		display:block;
		
	}
	
	.filterIcon{
		
		float:right;
		color:#000;;
	}
}

/* Portrait */
@media screen 
  and (device-width: 360px) 
  and (device-height: 592px) 
  and (-webkit-device-pixel-ratio: 4)
  and (orientation: portrait) {

}

/* Landscape */
@media screen 
  and (device-width: 360px) 
  and (device-height: 592px) 
  and (-webkit-device-pixel-ratio: 4)
  and (orientation: landscape) {

}

/* ----------- Windows Phone ----------- */

/* Portrait and Landscape */
@media screen 
  and (device-width: 480px) 
  and (device-height: 800px) {
.contentHeading, h1{
		font-size: .5em;
	}
	
	#desktopCarousel{
		display:none;
	
	}
	#mobileCarousel{
		display:block;
		
	}
	.overlay-content {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width : 100%;
	}

	/* Ensure .btn-close is visible on the dark background */
	.btn-close {
	  filter: invert(1);
	  float:right;
	  margin-right:5%;

	}

	.overlay {
		/* Other styles */
		height:0px;
		transition: height 1s;
	}

	.activeImg {
		height: 100vh;
		transition: height 1s;
	}

	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;
		max-width: 21vw;
		max-height: 10vh;
		height:20vh;
		width:auto;

	}

	.thumbnails{
		position: relative; 
		width: 100%; 
		display:inline-block;
	}

	.activeThumb{
		border: 1px solid black;

	}
	#displayImg{
		
		max-width:90vw;
		max-height:50vh;
		 object-fit: contain;
		
	}
	.displayImg{
	text-align: center;
	display: inline-block;
	
	
	
	}
	.cvDesktop{
		
		display:none;
		
	}
	
	.cvMobile{
		display:block;
		
	}
	
	.filterIcon{
		
		float:right;
		color:#000;;
	}
}

/* Portrait */
@media screen 
  and (device-width: 480px) 
  and (device-height: 800px)  
  and (orientation: portrait) {

}

/* Landscape */
@media screen 
  and (device-width: 480px) 
  and (device-height: 800px) 
  and (orientation: landscape) {

}

/* ----------- Non-Retina Screens ----------- */
@media screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 1) { 
  
 
  .contentHeading,h1{
		font-size: 3em;
	}
	#desktopCarousel{
		display:block;
	
	}
	#mobileCarousel{
		display:none;
		
	}
	
	.mobileWorks{
		
		height:40vh;
		
	}
	.overlay {
	  position: fixed;
	  top: 0;
	  left: 0;
	  right: 0;
	  bottom: 0;
	  background-color: white;
	  z-index: 1051; /* Above Bootstrap's modal overlay */
	  overflow:hidden;
	}

	.overlay-content {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width : 71%;
	}

	/* Ensure .btn-close is visible on the dark background */
	.btn-close {
	  filter: invert(1);
	  float:right;

	}

	.overlay {
		/* Other styles */
		height:0px;
		transition: height 1s;
	}

	.activeImg {
		height: 100vh;
		transition: height 1s;
	}

	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;

	}

	.thumbnails{
		position: relative; 
		bottom: 0; 
		width: 50%; 
		height: auto; 
		display: block;
	}

	.activeThumb{
		border: 1px solid black;

	}
	.displayImg{
		text-align: center;
		display: inline-block;
		
		 object-fit: contain;
		
	}
	#displayImg{
		
		max-height: 75vh;
		max-width:50vw;
	}
	.cvDesktop{
		
		display:block;
		
	}
	
	.cvMobile{
		display:none;
		
	}
}
/* ----------- Retina Screens ----------- */
@media screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (min-resolution: 192dpi) { 
  
  .contentHeading,h1{
		font-size: 3em;
	}
	#desktopCarousel{
		display:block;
	
	}
	#mobileCarousel{
		display:none;
		
	}
	
	.mobileWorks{
		
		height:40vh;
		
	}
	.overlay {
	  position: fixed;
	  top: 0;
	  left: 0;
	  right: 0;
	  bottom: 0;
	  background-color: white;
	  z-index: 1051; /* Above Bootstrap's modal overlay */
	  overflow:hidden;
	}

	.overlay-content {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width : 71%;
	}

	/* Ensure .btn-close is visible on the dark background */
	.btn-close {
	  filter: invert(1);
	  float:right;

	}

	.overlay {
		/* Other styles */
		height:0px;
		transition: height 1s;
	}

	.activeImg {
		height: 100vh;
		transition: height 1s;
	}

	#thumbDetail1, #thumbDetail2, #thumbDetail3, #thumbDetail4  {
		padding: 5px;

	}

	.thumbnails{
		position: relative; 
		bottom: 0; 
		width: 50%; 
		height: auto; 
		display: block;
	}

	.activeThumb{
		border: 1px solid black;

	}
	.displayImg{
		text-align: center;
		display: inline-block;
		
		
		
	}
	#displayImg{
		
		max-height: 75vh;
		max-width:50vw;
		
		 object-fit: contain;
	}
	.cvDesktop{
		
		display:block;
		
	}
	
	.cvMobile{
		display:none;
		
	}
}