/* PORTFOLIO OVERLAY AND SLIDESHOW STYLES ---- */


/* ID'S ------------------------ */

#overlay {height: 100%;
	width: 100%;
	background-image: url('images/overlay-bg.png');
	opacity: 0;
	position: fixed;
	z-index: 100;
	display: none;
	}

#p-ads {display: none;}

#p-espn {display: none;}

#p-twdc {display: none;}

#p-pt {display: none;}

#p-swfl {display: none;}

#p-blip {display: none;}

#p-nags {display: none;}

#p-ck {display: none;}



/* CLASSES --------------------- */

.close-button {cursor: pointer;
	height: 30px;
	width: 30px;
	background: url('images/close-button.svg') no-repeat;
	background-size: cover;
	float: right;
	margin: -15px -17px -15px 0px;
	position: relative;
	}

.close-button-hover {opacity: 0;
	transition-property: opacity;
	transition-delay: .1s;
	transition-duration: .4s;
	}

.close-button:hover > img {opacity: 1;}

.work-display {width: 700px;
	background-color: #000;
	margin: 3% auto 0px auto;
	border-radius: 5px;
	padding: 50px;
	}

.p-cta {font-size: 9px;
	font-weight: 600;
	color: #00a0ff;
	background-color: #000;
	padding: 0px 5px;
	margin: -5px 0px 0px 10px;
	line-height: 10px;
	letter-spacing: 1px;
	height: 13px;
	position: absolute;
	transition-property: color;
	transition-delay: .2s;
	transition-duration: .4s;
	}

.p-cta-bottom {position: relative;
	float: right;
	margin-top: -7px;
	margin-right: 8px;
	rotate: 180deg;
	}

.p-desc {font-size: 13px;
	line-height: 18px;
	font-weight: 200;
	}

.p-image {width: 700px;
	height: 500px;
	background-color: #333;
	margin: auto;
	border: 1px #00a0ff solid;
	display: flex;
	overflow-x: scroll;
	scrollbar-color: transparent transparent;
	scrollbar-width: none;
	scroll-behavior: smooth;
	scroll-snap-type: x mandatory;
	transition-property: border-color;
	transition-delay: .2s;
	transition-duration: .4s;
	}

.p-image::-webkit-scrollbar {
  display: none;
  width: 0px;
  height: 0px;
}

.p-image:hover {border-color: #c4e500;
	}

.p-image:hover + .p-cta, .p-image:hover > .p-cta {color: #c4e500;}

.slide-image {height: 100%;
	aspect-ratio: 1.4/1;
	scroll-snap-align: start;
	}


/* SLIDE IMAGES ---------------- */


/* CUSTOM ADS SLIDES */

#slide-ads-1 {background: url('images/slides/ads-1.jpg') no-repeat;
	background-size: cover;
	}

#slide-ads-2 {background: url('images/slides/ads-2.jpg') no-repeat;
	background-size: cover;
	}

#slide-ads-3 {background: url('images/slides/ads-3.jpg') no-repeat;
	background-size: cover;
	}

#slide-ads-4 {background: url('images/slides/ads-4.jpg') no-repeat;
	background-size: cover;
	}

#slide-ads-5 {background: url('images/slides/ads-5.jpg') no-repeat;
	background-size: cover;
	}


/* ESPN SLIDES */

#slide-espn-1 {background: url('images/slides/espn-1.jpg') no-repeat;
	background-size: cover;
	}

#slide-espn-2 {background: url('images/slides/espn-2.png') no-repeat;
	background-size: cover;
	}

#slide-espn-3 {background: url('images/slides/espn-3.png') no-repeat;
	background-size: cover;
	}

#slide-espn-4 {background: url('images/slides/espn-4.png') no-repeat;
	background-size: cover;
	}

#slide-espn-5 {background: url('images/slides/espn-5.png') no-repeat;
	background-size: cover;
	}

#slide-espn-6 {background: url('images/slides/espn-6.png') no-repeat;
	background-size: cover;
	}

#slide-espn-7 {background: url('images/slides/espn-7.png') no-repeat;
	background-size: cover;
	}

#slide-espn-8 {background: url('images/slides/espn-8.jpg') no-repeat;
	background-size: cover;
	}

#slide-espn-9 {background: url('images/slides/espn-9.jpg') no-repeat;
	background-size: cover;
	}

#slide-espn-10 {background: url('images/slides/espn-10.jpg') no-repeat;
	background-size: cover;
	}


/* TWDC SLIDES */

#slide-twdc-1 {background: url('images/slides/twdc-1.png') no-repeat;
	background-size: cover;
	}

#slide-twdc-2 {background: url('images/slides/twdc-2.png') no-repeat;
	background-size: cover;
	}

#slide-twdc-3 {background: url('images/slides/twdc-3.png') no-repeat;
	background-size: cover;
	}

#slide-twdc-4 {background: url('images/slides/twdc-4.png') no-repeat;
	background-size: cover;
	}


/* PRESTIDIGITATION SLIDES */

#slide-pt-1 {background: url('images/slides/pt-1.jpg') no-repeat;
	background-size: cover;
	}

#slide-pt-2 {background: url('images/slides/pt-2.jpg') no-repeat;
	background-size: cover;
	}

#slide-pt-3 {background: url('images/slides/pt-3.jpg') no-repeat;
	background-size: cover;
	}

#slide-pt-4 {background: url('images/slides/pt-4.png') no-repeat;
	background-size: cover;
	}


/* SWFL SLIDES */

#slide-swfl-1 {background: url('images/slides/swfl-1.png') no-repeat;
	background-size: cover;
	}

#slide-swfl-2 {background: url('images/slides/swfl-2.png') no-repeat;
	background-size: cover;
	}

#slide-swfl-3 {background: url('images/slides/swfl-3.png') no-repeat;
	background-size: cover;
	}

#slide-swfl-4 {background: url('images/slides/swfl-4.jpg') no-repeat;
	background-size: cover;
	}


/* BLIPSHIFT SLIDES */

#slide-blip-1 {background: url('images/slides/blip-1.jpg') no-repeat;
	background-size: cover;
	}

#slide-blip-2 {background: url('images/slides/blip-2.jpg') no-repeat;
	background-size: cover;
	}

#slide-blip-3 {background: url('images/slides/blip-3.jpg') no-repeat;
	background-size: cover;
	}

#slide-blip-4 {background: url('images/slides/blip-4.jpg') no-repeat;
	background-size: cover;
	}


/* THE NAGS SLIDES */

#slide-nags-1 {background: url('images/slides/nags-1.jpg') no-repeat;
	background-size: cover;
	}

#slide-nags-2 {background: url('images/slides/nags-2.jpg') no-repeat;
	background-size: cover;
	}

#slide-nags-3 {background: url('images/slides/nags-3.jpg') no-repeat;
	background-size: cover;
	}

#slide-nags-4 {background: url('images/slides/nags-4.jpg') no-repeat;
	background-size: cover;
	}


/* CAP & KREWE SLIDES */

#slide-ck-1 {background: url('images/slides/ck-1.jpg') no-repeat;
	background-size: cover;
	}

#slide-ck-2 {background: url('images/slides/ck-2.jpg') no-repeat;
	background-size: cover;
	}