body {
	font-family: arial;
	padding: 10;
	margin: 0;
	width: auto;
	height: auto;

	background-image: url(pics/bluebackground.jpeg);
	background-size: 100%;

}

div {

	padding: 0;
	margin: 0;
	
}

canvas {
    left:0;
    top:0;
    width:100%;
    height:100%;
    position: relative;
}

form{
	width: 25%;
	float: right;
	position:relative;
	z-index:2;
	color: white;
	
}
input:focus {
    border: 3px solid #555;
}



#canvasbackground {
    left:0;
    top:0;
    width:100%;
    height:100%;
    position: relative;
}

#banner	{
	width: auto;
}

#livingBackground {
	width: auto;
	height: auto;
	position: absolute;
	right: 0;

}


#parent
{
	overflow: hidden;
	position: relative;
	width: 100%;
	height: 50%;
}

#paragraphs {
	float: left;
	width: 25%;
	padding-bottom: 105px;

}

#paragraphsPROJ {
	float: left;
	height: 50%;
	width: 25%;
	padding-right: 2.5%;
	padding-bottom: 105px;


}

#paragraphsMUS {
	float: left;
	width: 25%;
	padding-right: 2.5%;
	padding-bottom: 105px;
}

#descriptions	{
	float: right;
	height: 75%;
	width: 25%;
	border-radius: 15px 0px 0px 15px;
	background: black;
	opacity: .6;
	color: white;
    position: absolute;
    right: 0;
    top: 0;
    padding-left: 5px;
    overflow:auto;
    overflow-x:hidden;
   
}

#image	{
	float: right;
	height: 75%;
	width: 50%;
	background: black;
	opacity: .7;
	color: white;
    position: absolute;
    right: 0;
    top: 0;
    overflow:auto;
    overflow-x:hidden;
	border-radius: 15px 0px 0px 15px;

}


.homePics {
	padding-right: 2.5%;
	opacity: 1;

}

.pic {
	transition: transform .2s;
	padding-top: 6%;
	padding-bottom: 6%;
	padding-right: 2.5%;
	cursor:pointer;
}
.pic:hover {
	position: relative;
	transform: scale(2);
	
}

.picDiv {
	padding-top: 2.5%;
	padding-bottom: 2.5%;

}

.vid {
	float: left;
   	display: block;
    right: 0;
    top: 0;
}

#info {
	background-color: black;
	text-align: center;
	color: white;
    position: fixed;
    bottom: 0;
    width: 100%;
    opacity: .6;

}

h1, h2{
	color: white;
}

a { 
	color: white;
}

a:link {
    text-decoration: none;
}

a:visited {
    text-decoration: none;
}

hr {
	border-color:  white;
}

p {
	cursor:pointer;
	opacity: .7;
	color: white;
	padding: 15px 0px;
	border-radius: 0px 15px 15px 0px;
    padding-left: 3.7%;	

}

p:hover {
	background: #999;
	color: #00FFFF;
}

p.light{
	background: #777;
	
}

p.dark{
	background: #333;
}

/* width */
::-webkit-scrollbar {
    width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #f1f1f1; 
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #888; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #555; 
}