/* ASPECT RATIO MEDIA QUERIES */

/*
	These resize the circular carousel items (that currently only appear in
	Work overlays) based on both the height and width of the browser window.
	They have been carefully calculated and should probably not ever change!
*/

/* Default (1280-1439px) */
.mgb-carousel .item,
.mgb-carousel .viewport {height:474px;}
.mgb-carousel .video-item {width:840px;}

/* Portrait */

/*@media (max-width: 479px) and (max-aspect-ratio: 150/100), (max-height: 509px) and (min-aspect-ratio: 150/100) {
	.mgb-carousel .item {height:180px;}
	.mgb-carousel .viewport {height:180px;}
	
	.mgb-carousel .video-item {width:320px;}
}

@media (min-width: 480px) and (max-aspect-ratio: 150/100) {
	.mgb-carousel .item {height:244px;}
	.mgb-carousel .viewport {height:244px;}
	
	.mgb-carousel .video-item {width:434px;}
}

@media (min-width: 600px) and (max-aspect-ratio: 150/100) {
	.mgb-carousel .item {height:311px;}
	.mgb-carousel .viewport {height:311px;}
	
	.mgb-carousel .video-item {width:553px;}
}*/

/* Switch to desktop version */

/*@media (min-width: 768px) and (max-aspect-ratio: 150/100) {
	.mgb-carousel .item,
	.mgb-carousel .viewport {height:393px;}
	
	.mgb-carousel .video-item {width:699px;}
}

@media (min-width: 1024px) and (max-aspect-ratio: 150/100) {
	.mgb-carousel .item,
	.mgb-carousel .viewport {height:474px;}
	
	.mgb-carousel .video-item {width:844px;}
}

@media (min-width: 1280px) and (max-aspect-ratio: 150/100) {
	.mgb-carousel .item,
	.mgb-carousel .viewport {height:637px;}
	
	.mgb-carousel .video-item {width:1134px;}
}

@media (min-width: 1440px) and (max-aspect-ratio: 150/100) {
	.mgb-carousel .item,
	.mgb-carousel .viewport {height:718px;}
	
	.mgb-carousel .video-item {width:1278px;}
}

@media (min-width: 1680px) and (max-aspect-ratio: 150/100) {
	.mgb-carousel .item,
	.mgb-carousel .viewport {height:881px;}
	
	.mgb-carousel .video-item {width:1568px;}
}

@media (min-width: 1920px) and (max-aspect-ratio: 150/100) {
	.mgb-carousel .item,
	.mgb-carousel .viewport {height:1044px;}
	
	.mgb-carousel .video-item {width:1858px;}
}*/

/* Landscape */
/*
@media (min-height: 510px) and (min-aspect-ratio: 150/100) {
	.landscape .mgb-carousel .item,
	.landscape .mgb-carousel .viewport {height:155px;}
	
	.landscape .mgb-carousel .video-item {width:276px;}
}

@media (min-height: 599px) and (min-aspect-ratio: 150/100) {
	.landscape .mgb-carousel .item,
	.landscape .mgb-carousel .viewport {height:244px;}
	
	.landscape .mgb-carousel .video-item {width:434px;}
}

@media (min-height: 666px) and (min-aspect-ratio: 150/100) {
	.landscape .mgb-carousel .item,
	.landscape .mgb-carousel .viewport {height:311px;}
	
	.landscape .mgb-carousel .video-item {width:553px;}
}

@media (min-height: 748px) and (min-aspect-ratio: 150/100) {
	.landscape .mgb-carousel .item,
	.landscape .mgb-carousel .viewport {height:393px;}
	
	.landscape .mgb-carousel .video-item {width:699px;}
}

@media (min-height: 829px) and (min-aspect-ratio: 150/100) {
	.landscape .mgb-carousel .item,
	.landscape .mgb-carousel .viewport {height:474px;}

	.landscape .mgb-carousel .video-item {width:844px;}
}

@media (min-height: 992px) and (min-aspect-ratio: 150/100) {
	.landscape .mgb-carousel .item,
	.landscape .mgb-carousel .viewport {height:637px;}
	
	.landscape .mgb-carousel .video-item {width:1134px;}
}

@media (min-height: 1073px) and (min-aspect-ratio: 150/100) {
	.landscape .mgb-carousel .item,
	.landscape .mgb-carousel .viewport {height:718px;}
	
	.landscape .mgb-carousel .video-item {width:1278px;}
}

@media (min-height: 1236px) and (min-aspect-ratio: 150/100) {
	.landscape .mgb-carousel .item,
	.landscape .mgb-carousel .viewport {height:881px;}
	
	.landscape .mgb-carousel .video-item {width:1568px;}
}

@media (min-height: 1399px) and (min-aspect-ratio: 150/100) {
	.landscape .mgb-carousel .item,
	.landscape .mgb-carousel .viewport {height:1044px;}
	
	.landscape .mgb-carousel .video-item {width:1858px;}
}*/

/* NEW MEDIA QUERIES! */
@media (max-width: 479px), (min-width: 479px) and (max-height: 624px) {
	.mgb-carousel .item {height:180px;}
	.mgb-carousel .viewport {height:180px;}
	.mgb-carousel .video-item {width:320px;}
}

@media (min-width: 480px) and (max-width: 599px) and (min-height: 625px), (min-width: 599px) and (min-height: 625px) and (max-height: 649px) {
	.mgb-carousel .item {height:244px;}
	.mgb-carousel .viewport {height:244px;}
	.mgb-carousel .video-item {width:432px;}
}

@media (min-width: 600px) and (max-width: 767px) and (min-height: 650px), (min-width: 767px) and (min-height: 650px) and (max-height: 744px) {
	.mgb-carousel .item {height:311px;}
	.mgb-carousel .viewport {height:311px;}
	.mgb-carousel .video-item {width:552px;}
}

@media (min-width: 768px) and (max-width: 1023px) and (min-height: 745px), (min-width: 1023px) and (min-height: 745px) and (max-height: 789px) {
	.mgb-carousel .item {height:393px;}
	.mgb-carousel .viewport {height:393px;}
	.mgb-carousel .video-item {width:696px;}
}

@media (min-width: 1024px) and (max-width: 1279px) and (min-height: 790px), (min-width: 1279px) and (min-height: 790px) and (max-height: 974px) {
	.mgb-carousel .item {height:474px;}
	.mgb-carousel .viewport {height:474px;}
	.mgb-carousel .video-item {width:840px;}
}

@media (min-width: 1280px) and (max-width: 1439px) and (min-height: 975px), (min-width: 1439px) and (min-height: 975px) and (max-height: 1054px) {
	.mgb-carousel .item {height:637px;}
	.mgb-carousel .viewport {height:637px;}
	.mgb-carousel .video-item {width:1128px;}
}

@media (min-width: 1440px) and (max-width: 1679px) and (min-height: 1055px), (min-width: 1679px) and (min-height: 1055px) and (max-height: 1219px) {
	.mgb-carousel .item {height:718px;}
	.mgb-carousel .viewport {height:718px;}
	.mgb-carousel .video-item {width:1272px;}
}

@media (min-width: 1680px) and (min-height: 1220px) {
	.mgb-carousel .item {height:881px;}
	.mgb-carousel .viewport {height:881px;}
	.mgb-carousel .video-item {width:1560px;}
}