/*DESKTOP FORMATTING*/
body {
	cursor: default;
	font-family: helvetica;
	overflow: scroll;
	padding-top: 5px;
	-webkit-user-select: none;

	animation-name: fadeIn;/*fade-in on page load*/
	animation-duration: 5s;
	animation-iteration-count: 1;
	animation-delay: none;
}

	@keyframes fadeIn {/*fade-in opacity settings*/
		from {
			opacity: 0;
		}

		to {
			opacity: 1;
		}
	}



.footer {/*Footer for my copyright info*/
	bottom: 0;
	color: rgb(230, 230, 230);
	cursor: default;
	font-size: 12px;
	left: 0;
	padding-bottom: 5px;
	padding-left: 40px;
  	position: scroll;
  	right: 0; 
}

hr {/*style for animated rainbow hr*/
	border-color: black;
	float: left;
	width: 5em;

	animation-name: hranimate;
	animation-duration: 20s;
	animation-iteration-count: infinite;
	animation-delay: none;
	animation-direction: alternate-reverse;
}
	@keyframes hranimate {/*hr animation*/
		0% {border-color: rgb(255, 255, 0);}/*last*/
		15.7% {border-color: rgb(102, 255, 51);}
		31.4% {border-color: rgb(51, 204, 255)}
		47.1% {border-color: rgb(153, 51, 255)}
		62.8% {border-color: rgb(255, 51, 204)}
		78.5% {border-color: rgb(255, 0, 102)}
		94.2% {border-color: rgb(255, 0, 0)}
		100% {border-color: rgb(255, 153, 0)}
	}

iframe {
	width: 75%;
}

img {
	pointer-events: none; /*disables dragging and dropping images into desktop*/
	padding-left: 40px;
}



#title {/*Style for my name, upper left-hand corner*/
	color: rgb(38, 38, 38);
	font-size: 23px;
	letter-spacing: 1px;
	padding-bottom: 10px;
	padding-left: 40px;
}

.project-description {/*Project description in a div with this class*/
	width: 75%;
	padding-left: 40px;
}

#workTitle {/*Style for title of work, next to my name*/
	color: grey;
	font-size: 23px;
	letter-spacing: 1px;
}

.captions {/*image captions*/
	color: grey;
	cursor: pointer;
	font-size: 12px;
	letter-spacing: 0px;
	line-height: 15px;
	padding-left: 40px;
}
/*END DESKTOP FORMATTING*/