html>body, body {
	font:100% 'Questrial', Arial, Helvetica, sans-serif;
	font-family:'Questrial', Arial, Helvetica, sans-serif;
	background:#000;
	margin:0;
	padding:0;
	text-align:center;
	color:#CCC;
}

#container { margin:0 auto; overflow:hidden; }

#header { border-bottom:#09C solid 1px; padding:.5em 0; }

#main-content { margin:0 auto; padding:0; }

#image-holder { background:#000; text-align:center; margin:0; }

#media-holder { background:#000; padding:0 0 10px 0; text-align:center; margin:0 0 30px 0; }

#media-holder ul { margin:0; padding:0; }
#media-holder li {  margin:10px 0; margin:0 auto; }
#media-holder li div { margin-top:1px; }
#media-holder p { font-size:.8em; font-weight:normal; margin:0 auto; padding:1em 0; }

.media-slide-nav {
	background:#09C;
	color:#FFF;
	padding:5px 20px;
	font-size:14px;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;	
	cursor:pointer;
	margin:0 5px;
}

.blue { color:#09C; }
.red { color:#F00; }
.green { color:#090; }

.clear { clear:both; }

#footer { border-top:#09C solid 1px; padding: 20px 20px 50px 20px; }
#logo { float:left; text-align:left; }

#privacy { float:right; text-align:right; }
#privacy li { display:inline-block; font-size:14px; list-style:none; margin:0 3px; text-align:right; }
#privacy a:link { color:#FFF; text-decoration:none; }
#privacy a:visited { color:#09C; text-decoration:none; }
#privacy a:hover  { color:#09C; text-decoration:none; }
#privacy a:active { color:#FFF; text-decoration:none; }

a:link { color:#FFF; outline:none; text-decoration:none; border-bottom: 0px solid white;}
a:visited { color:#FFF; outline:none; text-decoration:none; }
a:hover { color:#FFF; outline:none; text-decoration:none; }
a:active { color:#FFF; outline:none; text-decoration:none; border-bottom: 0px solid white;}

.mobile-button, .navigation#map-title { display:none; visibility:hidden; }

.tablet-button { background:#09C; border-radius:50%; color:#FFF; clear:both; cursor:pointer; display:block; height:70px; left:10px; position:fixed; top:27px; width:70px; z-index:1000; }

a.tablet-button { color:#FFF; text-decoration:none; border-bottom: 0px solid white;}

.tablet-button span {	color:#FFF; display:block; font-size:1.25em; margin:25px 0 0 0; padding:0 0 0 2px;	}

#menu-holder { background:#09C; background-color:rgba(0, 153, 204, .9); border-radius:50%; display:none; height: 800px; left:-400px; position:fixed; top:45px; width: 800px; z-index:990; }

.nav-menu { clear:both; display:none; position:fixed; text-align:left; top:115px; z-index:991; }
ul.nav-menu, .nav-menu li { list-style:none; margin:0; padding:0; }
ul.nav-menu { clear:both; margin-top:6px; padding:6px 6px; }
.nav-menu li a { border-top:solid 1px #DEDEDE; color:#FFF; display:block; font-size:17px; padding:12px 4px; text-decoration:none; }
.nav-menu li a:hover { color:#033; }

#yupik { width:250px; }
#yakama { width:265px; }
#cubeo { width:300px; }
#yoreme { width:325px; }
#mapuche { width:340px; }
#tlingit { width:355px; }
#lakota { width:365px; }
#seminole { width:370px; }
#hopi { width:367px; }
#quechua { width:355px; }		

#dance-title { font-size:1.25em; margin:0 1em; padding:.5em 0; }

#about-content, #essay-content, #bio-content, #media-content, #acknowledgments-content, #sources-content { color:#CCC; line-height:1.5em; margin:5% 10%; text-align:justify; }

#credits-content { line-height:1.5em; margin:5% 10%; text-align:left; }

#about-content { padding:0 0 20px 0; }

#sources-content li { font-size:.7em; line-height:1.25em; padding:0 0 1em 0; }

.navigation { list-style:none; }

.navigation#essay-title, .navigation#about-title, .navigation#media-title, .navigation#acknowledgments-title, .navigation#sources-title, .navigation#credits-title, .navigation#bio-title { color:#09C; display:block; margin:5% 10%; position:relative; text-align:left; top:50px; visibility:visible; }

.navigation#essay-title span, .navigation#about-title span, .navigation#media-title span, .navigation#acknowledgments-title span, .navigation#sources-title span, .navigation#credits-title span, .navigation#bio-title span { font-size:19px; margin:0; padding:0; }

#house { background:#FFF; border-radius:1em; color:#090; font-size:.8em; margin:0; -moz-border-radius:1em; padding:1em 2em; text-align:left; -webkit-border-radius:1em; width:340px; }

#house h3 { font-weight:normal;  }

#raven-crow li, #eagle-wolf li { list-style:none; text-indent:-40px; }

#sub-nav { clear:both; display:block; left:170px; top:220px; position:absolute; visibility:visible; }

.sub-navigation { border-radius:50%; clear:both; cursor:pointer; display:block; line-height:16px; position:relative; visibility:visible;}

#essay-button { background-color:rgba(0, 153, 204, 0.6); height:120px; left:0; top:0; width:120px; z-index:1002; }
#about-button { background-color:rgba(0, 153, 204, 0.7); height:100px; left:95px; top:-65px; width:100px; z-index:1003; }
#media-button { background-color:rgba(0, 153, 204, 0.9); height:70px; left:-30px; top:-130px; width:70px; z-index:1004; }
#map-button { background-color:rgba(0, 153, 204, 0.8); height:50px; left:100px; top:-300px; width:50px; z-index:1004; }

#essay-button span { display:block; font-size:20px; margin:0; padding:53px 0 0 0; }
#about-button span { display:block; font-size:16px; margin:0; padding:37px 0 0 3px; }
#media-button span { display:block; font-size:16px; margin:0; padding:27px 0 0 0; }
#map-button span { display:block; font-size:15px; margin:0; padding:17px 0 0 0; }


#map-nav { background-image:url(../images/map-cubeo.jpg); background-repeat:no-repeat; margin:0 auto; width:800px; height:1200px; }
#yupik-button { background-color:#09C; height:30px; left:40px; top:120px; width:30px; z-index:1002; }
#yupik-button span { display:block; font-size:24px; margin:0; padding:5px 100px 0 40px; }

@media screen and (max-device-width: 480px) {
	
	#about-this-object { display:none; }
	
	#identity, #slideshow, .sub-navigation, .media-slide-nav { display:none; visibility:hidden; }
	
	#header { background-color: rgba(0, 153, 204, 0.6); text-align:right; }
	
	#menu-button-2 { display:none; visibility:hidden; }
	
	#header img { margin:0 1em; width:60%; }

	#dance-title { font-size:.8em; text-align:right; margin-left:50px; }

	#about-content, #essay-content, #bio-content, #media-content, #media-holder, #acknowledgments-content, #sources-content { display:none; font-size:1em; line-height:1.25em; margin:0 1em;  text-align:left; }

	#image-holder img { width:50%; }

#media-holder { padding:10px 0; }
#media-holder ul { margin:0; padding:0; }
#media-holder li {  margin:0 0; margin:0 auto; display:block!important; text-align:center; }

#media-holder p { font-size:1em; font-weight:normal; margin:0 auto; padding:.5em 0em 1em 0; text-align:left; }


.mobile-button { background:#09C; border-radius:50%; clear:both; color:#FFF; cursor:pointer; display:block; height:70px; left:10px; position:absolute; top:-10px; visibility:visible; width:70px; z-index:1000; }

.mobile-button span { display:block; margin-top:28px; padding:0 0 0 3px; }


.navigation#essay-title, .navigation#about-title, .navigation#bio-title, .navigation#media-title, .navigation#acknowledgments-title, .navigation#sources-title { color:#FFF; left:0px; margin:0; top:0px; }

.navigation, #bio-title, .navigation#map-title {
	color:#FFF;
	font-size:18px;
	display:block;
	text-decoration:none;
	position:relative;
	bottom:0;
	left:0;
	background:#09C;
	background-color:#09C;
	margin:0;
	padding:.5em 1em;
	border-top:1px solid #3CF;
	text-align:left;
	cursor:pointer;
	visibility:visible;
	width:auto;
	border-radius:0px;
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
}

.navigation#credits-title { background:none;	background-color:none; border-top:none; color:#09C;  display:block; text-align:left; left:12px; margin:0; top:20px; }
#house { width:240px; }
	
}

@media screen and (max-device-width: 480px) and (orientation: portrait) {
		
	#media-holder img { max-height:181px; max-width:290px; }
	#media-holder p { }
}

@media screen and (max-device-width: 480px) and (orientation: landscape) {
		
	#media-holder img { max-height:281px; max-width:450px; }
	#media-holder p {  }
}


@media screen and (min-device-width: 768px) and (max-device-width: 1024px) {

	
	#essay-content, #about-content, #media-content, #bio-content, #acknowledgments-content, #sources-content, #credits-content { font-size:1.2em; line-height:1.75em; }
		
	.swipe { padding-bottom:20px;}
	.swipe li div, .swipe div div div {
  margin:0 auto;
  padding:0;
  background:none;
  font-weight:bold;
  color:#fff;
  font-size:20px;
  text-align:center;
}

	.navigation#essay-title, .navigation#about-title, .navigation#media-title, .navigation#acknowledgments-title, .navigation#sources-title, .navigation#credits-title, .navigation#bio-title { margin:0; }

	.navigation#essay-title span, .navigation#about-title span, .navigation#media-title span, .navigation#acknowledgments-title span, .navigation#sources-title span, .navigation#credits-title span, .navigation#bio-title span { font-size:23px }
	
	
	#media-holder p { color:#CCC; font-size:1em; font-weight:normal; margin:0 auto; padding:1em 5em; }
	
	#house { width:400px; }
}

@media screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {

	
	.navigation#essay-title,	.navigation#about-title, .navigation#media-title, .navigation#acknowledgments-title, .navigation#sources-title, .navigation#credits-title, .navigation#bio-title { left:100px; top:40px; }
	.navigation#media-title { left:110px; top:-10px; }
	
	
	
}

@media screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
	#essay-content, #bio-content, #about-content, #media-content, #acknowledgments-content { line-height:1.25em; margin:5% 12%; }

	
	#sub-nav { left:70px; top:220px; }
	
	.navigation#essay-title,	.navigation#about-title, .navigation#media-title, .navigation#acknowledgments-title, .navigation#sources-title, .navigation#credits-title, .navigation#bio-title { left:90px; top:30px; }
	.navigation#media-title { top:-10px; }
	
	.navigation#credits-title { left:75px; top:35px; }
		
	#media-holder img { max-height:380px; max-width:608px; }
	#media-holder p { width:76%; }
	
}