@charset "UTF-8";

html, body {
    margin: 0;
    padding: 0;
}

#bar {
	position: fixed;
	top: 10%;
	left: 0;
	width: 190px;
	height: 80%;
	min-height: 400px;
	z-index: 10;
}

#logo {
	position: absolute;
	top: 0px;
	left: 0px;
}

#nav {
	position: fixed;
	width: inherit;
	top: 180px;
}

a:link {
	text-decoration: none;
	color: #000;
} 
a:visited {
	color:#000;
}
  
a:hover {
	color: #666;
	} 
a.active {
	color: #999;
} 

li {
	list-style-type: none;
	float: right;
	clear: both;
	font-family: sans-serif;
	font-weight: 100;
	color: #F36;
	font-size: 15px;
	padding: 2px;
}

#barback {
	position: fixed;
	top: 10%;
	left: 0;
	width: 210px;
	height: 90%;
	min-height: 400px;
	z-index: 8;
	background-color:#FFF;
	opacity: 0.7;
}

#cont{
	position: fixed;
	top: 10%;
    width: 100%;
    height: 90%;
	min-height: 400px;
    overflow-x: scroll;
    white-space: nowrap;
}

.pictures {
	height: 90%;
	display: inline-block;
	margin-right: 10px;
}

#space {
	width: 210px;
}



#nav2 {
	position: fixed;
	width: inherit;
	bottom: 110px;
}

#social {
	position: fixed;
	width: 60px;
	display: block;
	left: 120px;
	bottom: 80px;
	}

   
a#facebook {/*facebook button*/
	background-image: url(../images/social.png);
    text-indent: -9999px;
    display: inline-block;
    width: 20px;
	height: 20px;
    background-position: 0px 0px;
}

	
a#facebook:hover {
    background-position: 0px -20px;
}
	
	
	
a#instagram {/* instagram button*/
    background-image: url(../images/social.png);
    text-indent: -9999px;
    display: inline-block;
	 width: 20px;
	height: 20px;
    background-position: 40px 0px;
}
	
a#instagram:hover {
    background-position: 40px -20px;
}
	
	
a#tumblr {/* tumblr button*/
    background-image: url(../images/social.png);
    text-indent: -9999px;
    display: inline-block;
    width: 20px;
	height: 20px;
    background-position: 20px 0px;
}
    
a#tumblr:hover {
    background-position: 20px -20px;
}
	
	
a#rewind {
	position: absolute;
	top: 5%;
	right: 10px;
	width: 20px;
	height: 20px;
	background-image: url(../images/rewind.png);
	background-position: 0px 0px;
}

a#rewind:hover {
	background-position: 0px 20px;
}


h3 {
	position: fixed;
	right: 15px;
	bottom: 3px;
	font-family: sans-serif;
	font-weight: 100;
	font-size: 15px;
	color: #666;
}

h2 {
	position: absolute;
	top: 100px;
	left: 350px;
	font-family: sans-serif;
	font-weight: 100;
	font-size: 15px;
	color: #333;
}