@charset "UTF-8";

body {
	
	background-color: #fadde1;
}

nav {
	width: 750px;
	margin: 100px auto 0 auto;
	
}
#mickey, #flowers, #headshot, #projects {
	width: 150px;
	margin-right: 50px;
	position: relative;
	float: left;	
}
#projects {
	margin: 0;
}


.mickey-icon, .resources-flowers-icon, .resources-headshot-icon,.resources-projects-icon {
	width: 150px;
	height: 150px;
	background-image: url("../images/kenziemadewell.png");
	background-repeat: no-repeat;	
	overflow: hidden;
}

.mickey-icon{
	background-position: 0 0;
	transition: all .7s ease-in-out;
}

.mickey-icon:hover {
background-position: 0px -150px;
	transition: all .7s ease-in-out;	
	
}

.resources-flowers-icon {
background-position: -200px 0;
transition: all .7s ease-in-out;

	
}


.resources-flowers-icon:hover{
background-position: -200px -150px;
	transition: all .7s ease-in-out;	
}


.resources-headshot-icon {
	background-position: -400px 0;
	transition: all .7s ease-in-out;
}

.resources-headshot-icon:hover {
background-position: -400px -150px;
	transition: all .7s ease-in-out;	
	
}
.resources-projects-icon {
	background-position: -600px 0;
	transition: all .7s ease-in-out;
}

.resources-projects-icon:hover {
	background-position: -600px -150px;
	transition: all .7s ease-in-out;
	
	
}



li a {
	display:block;
	width: 140px;
	padding-left: 10px;
	font-family: "Emilys Candy", serif;
  	font-weight: 400;
  	font-style: normal;
	font-size: .8em;
	text-transform: uppercase;
	line-height: 34px;
	background-color: #ff477e;
	color: white;
	border-bottom: 2px solid #ff477e;
	
}


a.inspirational {
	background-color:#FFC2D1;
	border-bottom: none;
	
}
	

a.web {
	background-color:#FFB3C6; 
	border-bottom: none;

}

	

a.other {
	background-color:#FF8FAB;
	border-bottom: none;
	
}

a.projects{
	background-color:#FB6F92;
	border-bottom: none;
	
}

a.inspirational:hover, a.web:hover, a.other:hover,a.projects:hover {
	background-color: black;
	
}


ul.submenu{
	position: absolute;
	left: -9000em;
	height: 0;
	transition: height 1.5s ease-in-out; 
	overflow: hidden;


}

.topmenu li:hover ul.submenu{
 left: 0;
 height: 500px;	
}


ul.submenu li a:hover {
	background-color:#ff87ab;
	border-bottom: 2px solid #ff87ab; 
	
}


li:hover a.inspirational, li:hover a.web, li:hover a.other, li:hover a.projects{
	background-color: #cdb4db;
}