/* 

Julia Haas Design
juliahaas.com

NOTES 
Hover: #791313

*/

/* POP-UP DESC'S */

#note {
	position: absolute;
	margin-top: 250px;
	margin-left: 270px;
	z-index: 3;
}
#note img {
	border: 1px solid black;
}

.description, .leftdesc, .rightdesc, .upperleftdesc, .lowerleftdesc, .upperrightdesc, .lowerrightdesc, .bottomrightrdesc, .bottomrightldesc, .centerdesc {
	display: none;
}
.description img, .leftdesc img, .rightdesc img, .upperleftdesc img, .lowerleftdesc img, .upperrightdesc img, .lowerrightdesc img, .bottomrightrdesc img, .bottomrightldesc img, .centerdesc img {
	border: 1px solid black;
}

.left {
	width: 400px;
	height: 500px;
	position: absolute;
	margin-top: -500px;
}
.right {
	width: 400px;
	height: 500px;
	position: absolute;
	margin-top: -500px;
	margin-left: 400px;
}
.center {
	width: 150px;
	height: 500px;
	position: absolute;
	margin-top: -500px;
	margin-left: 314px;
}

.upperleft {
	width: 310px;
	height: 250px;
	position: absolute;
	margin-top: -500px;
}
.lowerleft {
	width: 310px;
	height: 250px;
	position: absolute;
	margin-top: -250px;
}

.upperright {
	width: 330px;
	height: 250px;
	position: absolute;
	margin-top: -500px;
	margin-left: 470px;
}
.lowerright {
	width: 330px;
	height: 250px;
	position: absolute;
	margin-top: -250px;
	margin-left: 470px;
}
.bottomrightr {
	width: 200px;
	height: 250px;
	position: absolute;
	margin-top: -250px;
	margin-left: 600px;
}
.bottomrightl {
	width: 200px;
	height: 250px;
	position: absolute;
	margin-top: -250px;
	margin-left: 400px;
}


/* COLLECTION 1 */

#collection1 #item1:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection1 #item2:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -278px;
	z-index: 3;
}

#collection1 #item3 .right:hover .rightdesc {
	display: block;
	position: absolute;
	margin-top: 240px;
	margin-left: -1px;
	z-index: 3;
}

#collection1 #item3 .left:hover .leftdesc {
	display: block;
	position: absolute;
	margin-top: 240px;
	margin-left: -1px;
	z-index: 3;
}

#collection1 #item4 .right:hover .rightdesc {
	display: block;
	position: absolute;
	margin-top: 240px;
	margin-left: -1px;
	z-index: 3;
}

#collection1 #item4 .left:hover .leftdesc {
	display: block;
	position: absolute;
	margin-top: 240px;
	margin-left: -1px;
	z-index: 3;
}

#collection1 #item5 .right:hover .rightdesc {
	display: block;
	position: absolute;
	margin-top: 240px;
	margin-left: -1px;
	z-index: 3;
}

#collection1 #item5 .left:hover .leftdesc {
	display: block;
	position: absolute;
	margin-top: 240px;
	margin-left: -1px;
	z-index: 3;
}

#collection1 #item6 .upperright:hover .upperrightdesc {
	display: block;
	position: absolute;
	margin-top: 240px;
	margin-left: -1px;
	z-index: 3;
}

#collection1 #item6 .bottomrightr:hover .bottomrightrdesc {
	display: block;
	position: absolute;
	margin-top: -100px;
	margin-left: -201px;
	z-index: 3;
}

#collection1 #item6 .bottomrightl:hover .bottomrightldesc {
	display: block;
	position: absolute;
	margin-top: -100px;
	margin-left: -1px;
	z-index: 3;
}

#collection1 #item7 .upperright:hover .upperrightdesc {
	display: block;
	position: absolute;
	margin-top: 260px;
	margin-left: -1px;
	z-index: 3;
}
#collection1 #item7 .lowerright:hover .lowerrightdesc {
	display: block;
	position: absolute;
	margin-top: -120px;
	margin-left: -1px;
	z-index: 3;
}

#collection1 #item7 .upperleft:hover .upperleftdesc {
	display: block;
	position: absolute;
	margin-top: 260px;
	margin-left: -1px;
	z-index: 3;
}
#collection1 #item7 .lowerleft:hover .lowerleftdesc {
	display: block;
	position: absolute;
	margin-top: -120px;
	margin-left: -1px;
	z-index: 3;
}


/* COLLECTION 2 */

#collection2 #item1:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection2 #item3:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection2 #item4:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection2 #item5:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection2 #item7:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection2 #item8:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

/* COLLECTION 3 */

#collection3 #item1:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection3 #item2 .upperright:hover .upperrightdesc {
	display: block;
	position: absolute;
	margin-top: 260px;
	margin-left: -1px;
	z-index: 3;
	
}
#collection3 #item2 .lowerright:hover .lowerrightdesc {
	display: block;
	position: absolute;
	margin-top: -120px;
	margin-left: -1px;
	z-index: 3;
}
#collection3 #item2 .upperleft:hover .upperleftdesc {
	display: block;
	position: absolute;
	margin-top: 260px;
	margin-left: -1px;
	z-index: 3;
}
#collection3 #item2 .lowerleft:hover .lowerleftdesc {
	display: block;
	position: absolute;
	margin-top: -120px;
	margin-left: -1px;
	z-index: 3;
}
#collection3 #item2 .center:hover .centerdesc {
	display: block;
	position: absolute;
	margin-top: 200px;
	margin-left: -1px;
	z-index: 3;
}

#collection3 #item3:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection3 #item4:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection3 #item5:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection3 #item7:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection3 #item8:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection3 #item9:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection3 #item10:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection3 #item11:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection3 #item12:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection3 #item13:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

/* COLLECTION 4 */

#collection4 #item1:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection4 #item2:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection4 #item3:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection4 #item5:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection4 #item7:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection4 #item8:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection4 #item10:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

#collection4 #item11:hover .description {
	display: block;
	position: absolute;
	margin-left: 399px;
	margin-top: -300px;
	z-index: 3;
}

/* GENERAL */

* {
    padding: 0;
    margin: 0;
}

html {
    height: 100%;
    min-height: 100%;
}

body {
	font-family: Palatino, "Palatino Linotype", Georgia, Times, "Times New Roman", serif;
	margin: 0;
	padding: 0;
	font-size: 9pt;
	letter-spacing: 0.083em;
}

h1 {
	font-size: 100%;
	font-weight: normal;
	margin: 0 0 0 0;
}

h2 {
	font-size: 100%;
	font-weight: normal;
	margin: 0 0 2em 0;
}

p {
	font-size: 83.3%;
	font-weight: normal;
}

a {
	color: black;
	text-decoration: none;
	outline: none;
}

a:link {
   text-decoration: none;
   color: black;
}

a:hover {
	color: #595454;
	cursor: pointer;
}
a img {
	border: none;
}
#next:hover, #previous:hover {
 cursor: pointer;
}
 
#everything {
   width: 800px;
   margin-left: auto;
   margin-right: auto;
   margin-bottom: 1.875em;
}

/* MAINBOX */

#box {
	width: 800px;
	height: 500px;
	background-color: white;
    border: 1px solid black;
    margin: 1.25em 0 0 0;
}

#logo {
	position: absolute;
	margin: 1em 0 0 0;
}

/* MENU */

#collectionslink {
	position: absolute;
	height: 1.667em;
	margin: 0.6em 0 0 26.5em;
	z-index: 2;
}

#dot1 {
	position: absolute;
	height: 1.667em;
	margin: 0.6em 0 0 34.4em;
}

#aboutlink {
	position: absolute;
	height: 1.667em;
	margin: 0.6em 0 0 35.3em;
}

#dot2 {
	position: absolute;
	height: 1.667em;
	margin: 0.6em 0 0 39.2em;
}

#presslink {
	position: absolute;
	height: 1.667em;
	margin: 0.6em 0 0 40.1em;
}

#dot3 {
	position: absolute;
	height: 1.667em;
	margin: 0.6em 0 0 43.95em;
}

#contactlink {
	position: absolute;
	height: 1.667em;
	margin: 0.6em 0 0 44.9em;
}

#dot4 {
	position: absolute;
	height: 1.667em;
	margin: 0.6em 0 0 50.2em;
}

#visityarbielink {
	position: absolute;
	height: 1.667em;
	margin: 0.6em 0 0 51.1em;
}
	
/* COLLECTION MENU */

#collectionNav {
	display: none;
}

#line {
	position: absolute;
	margin: 2.1em 0 0 319px;
}

#collectionone {
	position: absolute;
	height: 1.667em;
	margin: 2.7em 0 0 26.5em;
}

#dot5 {
	position: absolute;
	height: 1.667em;
	margin: 2.7em 0 0 29em;
}

#collectiontwo {
	position: absolute;
	height: 1.667em;
	margin: 2.7em 0 0 29.9em;
}

#dot6 {
	position: absolute;
	height: 1.667em;
	margin: 2.7em 0 0 32.4em;
}

#collectionthree {
	position: absolute;
	height: 1.667em;
	margin: 2.7em 0 0 33.4em;
}

#dot7 {
	position: absolute;
	height: 1.667em;
	margin: 2.7em 0 0 36.95em;
}

#collectionfour {
	position: absolute;
	height: 1.667em;
	margin: 2.7em 0 0 37.9em;
}

#previous {
	position: absolute;
	height: 1.667em;
	margin: 2.7em 0 0 57.4em;
}

#dot8 {
	position: absolute;
	height: 1.667em;
	margin: 2.7em 0 0 63.2em;
}

#next {
	position: absolute;
	height: 1.667em;
	margin: 2.7em 0 0 64.2em;
}

/* INDEX PAGE SLIDESHOW NAV */

#buttonstart {
	width: 120px;
	height: 120px;
	position: absolute;
	margin: -490px 0 0 666px;
	z-index: 2;
}

#buttonstart2 {
	width: 120px;
	height: 120px;
	position: absolute;
	margin: -318px 0 0 325px;
	z-index: 2;
}

#homeslidenav {
	display: none;
}

#homeslidenav #previous {
	position: absolute;
	height: 1.667em;
	margin: -22px 0 0 750px;
    font-size: 14px;
}

#homeslidenav #next {
	position: absolute;
	height: 1.667em;
	margin: -22px 0 0 780px;
	font-size: 14px;
}

/* COLLECTIONS */

#collectionTable {
	margin: 6px 0 0 4px;
}
#collect1,#collect2, #collect3, #collect4 {
	border: 1px solid black;
}
/* SLIDESHOW */

#slideshow {
	width: 800px;
	height: 500px;
}
#slideshow > div {
	display: none;
}
#slideshow #item0 {
	display: block;
}

#homepageSlideshow {
	width: 800px;
	height: 500px;
}

#rewind {
	position: absolute;
	width: 50px;
	height: 35px;
	margin: -430px 0 0 727px;
}
#rewind:hover {
	cursor: pointer;
}

/* ABOUT */

#about {
	height: 445px; 
	width: 800px;
	margin-top: 55px;
}

#bio {
	width: 400px;
	height: 400px;
	font-size: 12px;
	line-height: 13px;
	margin: 0 6em 0 0;
	float: right;
}

#about img {
	float: left;
	margin: 28px 0 0 76px;
	border: 1px solid black;
	padding: 2px;
}

/* CONTACT */

#contact {
	font-size: 10px;
	line-height: 14px;
	width: 360px;
	float: right;
	margin: 26px 1.5em 0 0;
}

#contact h1 {
	margin: 0 0 8px 0;
}

#contact ul {
	list-style: none;
}

#contactImg {
	float: left;
}

#contactImg img {
	margin: 11em 0 0 7em;
}