/* PROJECT OVERVIEW */
.proj-overview { border-bottom: solid 1px #eee; }

/* CATEGORY DETAILS */
.proj-details .link { text-decoration: underline; }

/* SHOWCASE IMAGES */
.showcase img { display: block; width: 98%; margin: 0 auto 30px; border: solid 1px #eee; }

/* SHOWCASE VIDEO */
.showcase .video { position: relative; width: 98%; margin: 0 auto 30px; padding-bottom: 55.5%; }
.showcase .video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0 auto; }

/* DEVICES SWAP */
.swap-devices { width: 100%; margin: 0 auto 20px; }
.swap-devices .desktop, .swap-devices .tablet, .swap-devices .phone { height: 0; transition: height .4s ease; }
.swap-devices .desktop.visible, .swap-devices .tablet.visible, .swap-devices .phone.visible { height: 45vw; }
.device-options { text-align: center; }
.device-options .icon-device { display: inline-block; margin: 0 10px; opacity: .75; cursor: pointer; }
.device-options .icon-device:hover { opacity: 1; }
.device-options .icon-device.selected { color: #d24c42; opacity: 1; cursor: auto; }
.view-live { margin-top: 10px; text-align: center; }

/* DEVICE IMAGES */
.swap-devices .desktop { background: url(../img/device/desktop.jpg) 50% 50% no-repeat; background-size: contain; }
.swap-devices .tablet { background: url(../img/device/tablet.jpg) 50% 50% no-repeat; background-size: contain; }
.swap-devices .phone { background: url(../img/device/mobile_phone.jpg) 50% 50% no-repeat; background-size: contain; }
.swap-devices.pd-home .desktop { background-image: url(../portfolio/prime-delivery/img/home_desktop.jpg); }
.swap-devices.pd-home .tablet { background-image: url(../portfolio/prime-delivery/img/home_tablet.jpg); }
.swap-devices.pd-home .phone { background-image: url(../portfolio/prime-delivery/img/home_phone.jpg); }
.swap-devices.fm-whats-new .desktop { background-image: url(../portfolio/filemaker/img/whats_new_desktop.jpg); }
.swap-devices.fm-whats-new .tablet { background-image: url(../portfolio/filemaker/img/whats_new_tablet.jpg); }
.swap-devices.fm-whats-new .phone { background-image: url(../portfolio/filemaker/img/whats_new_phone.jpg); }
.swap-devices.fm-industry .desktop { background-image: url(../portfolio/filemaker/img/industry_desktop.jpg); }
.swap-devices.fm-industry .tablet { background-image: url(../portfolio/filemaker/img/industry_tablet.jpg); }
.swap-devices.fm-industry .phone { background-image: url(../portfolio/filemaker/img/industry_phone.jpg); }
.swap-devices.fm-usercase .desktop { background-image: url(../portfolio/filemaker/img/usercase_desktop.jpg); }
.swap-devices.fm-usercase .tablet { background-image: url(../portfolio/filemaker/img/usercase_tablet.jpg); }
.swap-devices.fm-usercase .phone { background-image: url(../portfolio/filemaker/img/usercase_phone.jpg); }
.swap-devices.fm-partner .desktop { background-image: url(../portfolio/filemaker/img/partner_desktop.jpg); }
.swap-devices.fm-partner .tablet { background-image: url(../portfolio/filemaker/img/partner_tablet.jpg); }
.swap-devices.fm-partner .phone { background-image: url(../portfolio/filemaker/img/partner_phone.jpg); }
.swap-devices.fm-academy .desktop { background-image: url(../portfolio/filemaker/img/academy_desktop.jpg); }
.swap-devices.fm-academy .tablet { background-image: url(../portfolio/filemaker/img/academy_tablet.jpg); }
.swap-devices.fm-academy .phone { background-image: url(../portfolio/filemaker/img/academy_phone.jpg); }

/* PROJECT LINKS */
.proj-links { border-bottom: solid 1px #eee; }
.proj-links .column:nth-child(2) { text-align: center; }
.proj-links .column:last-child { text-align: right; }
.proj-links .fa-angle-left { margin-right: 5px; }
.proj-links .fa-angle-right { margin-left: 5px; }
.proj-links #to-top { cursor: pointer; }

/* LARGE AND MEDIUM SCREEN SIZES */
@media screen and (min-width: 641px) {
	/* CATEGORY DETAILS */
	.proj-details .proj-desc { margin-right: 30px; }

	/* SHOWCASE IMAGES */
	.showcase .large-3:first-child img, .showcase .large-6:first-child img, .showcase .medium-3:first-child img, .showcase .medium-6:first-child img { float: left; }
	.showcase .large-3:last-child img, .showcase .large-6:last-child img, .showcase .medium-3:last-child img, .showcase .medium-6:last-child img { float: right; }
	.showcase .column-center img { max-width: 100%; }

	/* SHOWCASE VIDEO */
	.showcase .large-6:first-child .video, .showcase .medium-6:first-child .video { float: left; }
	.showcase .large-6:last-child .video, .showcase .medium-6:last-child .video { float: right; }

	/* DEVICES SWAP */
	.swap-devices { max-width: 800px; }
}

/* MEDIUM SCREEN SIZES */
@media screen and (max-width: 960px) {
	.swap-devices .desktop.visible, .swap-devices .tablet.visible, .swap-devices .phone.visible { height: 50vw; }
}

/* SMALL SCREEN SIZES */
@media screen and (max-width: 640px) {
	/* CATEGORY DETAILS */
	.proj-details { text-align: center; }
	.proj-details .proj-desc { margin-bottom: 30px; }

	/* SHOWCASE IMAGES */
	.showcase .small-12 img { width: 100%; }
	.showcase .small-6:first-child img { float: left; }
	.showcase .small-6:last-child img { float: right; }

	/* SHOWCASE VIDEO */
	.showcase .video { width: 100%; }

	/* DEVICES SWAP */
	.swap-devices .desktop.visible, .swap-devices .tablet.visible, .swap-devices .phone.visible { height: 70vw; }
}