@charset "UTF-8";
/* CSS Document */

 body{
	   /* color transition */ 
	   -webkit-transition: background-color 1s ease-in-out; 
	   -moz-transition: background-color 1s ease-in-out; 
	   -o-transition: background-color 1s ease-in-out; 
	   -ms-transition: background-color 1s ease-in-out; 
	   transition: background-color 1s ease-in-out; 
	   /* initial color */
	   background:none; 
	   background-color:#9AEB9F;
       height:auto;
	   }

#container{
	width:400px;
	height:auto;
	margin-left:auto;
    margin-right:auto;
}
	
   

#topNav{
	/*background-color:#d4dcf7;*/
	height:auto;
	margin-top:0.4%;
	width:90%;
	position:static;
	
}

#titleText{
	width:auto;
	height:auto;
	float:left;
	margin-left:0.2%;	
	font-family:Verdana,Tahoma, sans-serif;
	font-weight:bold;
	font-size:82.5%;
	text-shadow: 2px 2px #000;
	color:#897A78;
}

#titleText a{
	width:auto;
	height:auto;
	float:left;
	margin-left:0.9%;	
	font-family:Verdana, Tahoma, sans-serif;
	font-weight:bold;
	text-decoration:none;
	white-space:pre;
	text-shadow: 2px 2px #000;
	color:#897A78;
	
}

#titleText a:link{
	text-shadow: 2px 2px #000;
	color:#897A78;
}
	

#titleText a:hover{
	color:#06F;
	text-shadow:none;
}

	
.emph{
	font-weight:bold;
}

#navBar{
	/*display:inline-block;*/
	margin-right:25%;
	float:right;
}

.dropDownAndPullOut a{
	display:block;
	color:#888;
	font-variant:small-caps;
	/*background-color:#eee;*/
	padding:.9em 1em;
	/*border-width:3px;*/
	border-color:transparent;
}

.dropDownAndPullOut li a{
	display:block;
	color:#00F;
	/*background:rgba(53,53,53,0.5);*/
	/*border-right-style:solid;*/
	background-clip:padding-box;
	text-decoration:none;
}


.dropDownAndPullOut li ul{
	width:6em;
	color:yellow;
	background:rgba(51,51,51,0.7);
}

.dropDownAndPullOut li ul a{
	color:yellow;
}

.dropDownAndPullOut li ul a:hover{
	display:block;
	color:#0FF;
	/*background:rgba(53,53,53,0.5);*/
	/*border-right-style:solid;*/
	background-clip:padding-box;
	text-decoration:none;
}

#pageText{
	clear:both;
	float:left;
	margin-top:8%;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:0.9%;
	width:90%;
	height:auto;
	background-color:#FFF;
	padding-left:1%;
	padding-right:1%;
}

#pageText h1{
    font-family:Verdana, Tahoma, sans-serif;
	text-align:center;
	font-size:82.5%;
	
}

#pageText h2{
    font-family:Verdana, Tahoma, sans-serif;
	text-align:center;
	font-size:49.5%;
	
}

#pageText p{
	font-family:Verdana, Tahoma, sans-serif;
	font-size:28.05%;
}

figure.historyTop{
	width:90%;
	margin-left:23%;
}

figcaption{
	font-family:Arial, Helvetica, sans-serif;
	font-size:29.7%;
	text-align:center;
	margin-right:49%;
	}
	
.rightInSet{
	margin-left:0.9%;
}
	
.emph{
	font-weight:bold;
}

#navBar{
	/*display:inline-block;*/
	margin-right:15%;
	float:right;
}


.dropDownAndPullOut{
	font:1em helvetica, arial, sans-serif;
	font-weight:bold;
}

.dropDownAndPullOut a{
	display:block;
	color:#FFF;
	font-variant:small-caps;
	/*background-color:#eee;*/
	padding:.9em 1em;
	/*border-width:3px;*/
	border-color:transparent;
}

.dropDownAndPullOut a:hover{
	color:#000;
}

.dropDownAndPullOut a:active{
	background:#FFF;
	color:#000;
}

.dropDownAndPullOut * {
	margin:0;
	padding:0;
}

.dropDownAndPullOut ul{
	float:left;
	
}

.dropDownAndPullOut li{
	float:left;
	list-style-type:none;
	position:relative;
}

.dropDownAndPullOut li a{
	display:block;
	/*border-right-style:solid;*/
	background-clip:padding-box;
	text-decoration:none;
}
.dropDownAndPullOut li:last-child a{
	border-right-style:none;
}

.dropDownAndPullOut li ul{
	display:none;
	
}

/*visual additions*/

.dropDownAndPullOut li ul{
	width:6em;
	background:rgba(51,51,51,0.5);
}


.dropDownAndPullOut li ul a{
	border-right-style:none;
	color:yellow;
}
/*.dropDownAndPullOut li li a{
	border-right-style:none;
	/*border-top-style:solid;*/
/*}*/

/*functional additions*/
.dropDownAndPullOut li li{
	float:none;
}

/*.dropDownAndPullOut li li ul{
	display:none;
}*/
.dropDownAndPullOut li ul{
	width:6em;
	color:yellow;
	background:rgba(51,51,51,0.7);
}

/*.dropDownAndPullOut li ul a{
	color:yellow;
}*/


.dropDownAndPullOut li ul a:hover{
	display:block;
	color:#0FF;
	/*background:rgba(53,53,53,0.5);*/
	/*border-right-style:solid;*/
	background-clip:padding-box;
	text-decoration:none;
}

.dropDownAndPullOut li ul{
	display:none;
	position:absolute;
	left:0;
	top:100%;
	
}

.dropDownAndPullOut li:hover >ul{
	display:block;
}

.dropDownAndPullOut li li ul{
	position:absolute;
	left:100%;
	top:0;
}



#pageTitle{
	float:left;
	clear:both;
	width:100%;
	margin-top:5%;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:5%;
}

   #pageTitle h1{
	font-family:Verdana, Tahoma, sans-serif;
	text-align:center;
}

 #pageTitle p{
	font-family:Verdana, Tahoma, sans-serif;
    font-size:29.7%;
	text-indent:1.5%;
}

 #vidHolder{
	 float:left;
	 /*margin-top:20%;*/
	 /*width:100%;*/
	 height:auto;
	 margin-left:auto;
	 margin-right:auto;
	 margin-bottom:1%;
	}

   video{ 
   /* video border */ 
     border: 1px solid #ccc; 
     padding: 1%;
     border-radius:5px;
	 margin-left:20%;
	 width:211.2px;
	 height:158.4px;
	 
  /* tranzitionstransitions applied to the vodeovideo element */ 
   -moz-transition: all 1s ease-in-out; 
   -webkit-transition: all 1s ease-in-out; 
    -o-transition: all 1s ease-in-out; 
   -ms-transition: all 1s ease-in-out; 
    transition: all 1s ease-in-out; 
    } 

/* background color and gradient */

video, #start, #stop, #pause, #plus, #minus, #mute { 
  /* background color */ background-color: #ffcccc; 
  /* background gradient */ 
  background-image: linear-gradient(top, #e0e0e0, #e0e0e0); 
  background-image: -moz-linear-gradient(top, #e0e0e0, #e0e0e0); 
  background-image: -webkit-linear-gradient(top, #e0e0e0, #e0e0e0); 
  background-image: -o-linear-gradient(top, #e0e0e0, #e0e0e0); 
  background-image: -ms-linear-gradient(top, #e0e0e0, #e0e0e0); 
  }

/* shadows */ 
video, #start, #stop, #pause, #plus, #minus, #mute { 
  box-shadow: 0 0 10px #ccc;
   } 
 video:hover, video:focus, #start:hover, #stop:hover, #pause:hover, #plus:hover, #minus:hover, #mute:hover { 
 /* glow */ 
 box-shadow: 0 0 20px #f88; 
 } 
 
 #controls { 
 display: none; 
 /*margin: 1% 3%; */
 margin-top:0.7%;
 margin-left:30%;
 height:auto;
 } 

 /* style for buttons */
  #start, #stop, #pause, #plus, #minus, #mute { 
  border: 1px solid #ccc; 
  padding: 1px; 
  border-radius: 10px; 
  width: auto;
  margin: 0 1.1% 0 0; 
  }
  
	
  #butterfly{ 
	position: absolute; left: 0; top: -6px; 
	/*background-image: url(images/high_line_05_25_2014_640x480t.jpg); */
	width: 40%; height: 40%; 
	} 


   #progressbar{
	 display: none; 
	 /* size */ 
	 width: 165px; height: 20px; 
	 /* position and border */ 
	 position: relative; 
	 border: 1px solid #ccc; 
	 margin-top: 1%; 
	 margin-left:26%;
	 border-radius: 20px;
	 /* background color */ 
	 background-color: #cccccc; 
	 /* background gradient */ 
	 background-image: linear-gradient(top, #e0e0e0, #e0e0e0); 
	 background-image: -moz-linear-gradient(top, #e0e0e0, #e0e0e0); 
	 background-image: -webkit-linear-gradient(top, #e0e0e0, #e0e0e0); 
	 background-image: -o-linear-gradient(top, #e0e0e0, #e0e0e0); 
	 background-image: -ms-linear-gradient(top, #e0e0e0, #e0e0e0); 
	 /* shadow */ 
	 box-shadow: 0 0 10px #ccc;
	  }
 #loadingprogress{
	  /* border */ 
	  border-radius: 20px; 
	  /* initial size */ 
	  height: 20px; width: 0; 
	  /* background color */ 
	  background-color: #9acd00; 
	  /* background gradient */ 
	  background-image: linear-gradient(top, #45a6ed, #45a6ed); 
	  background-image: -moz-linear-gradient(top, #45a6ed, #45a6ed);     
	  background-image: -webkit-linear-gradient(top, #45a6ed, #45a6ed); 
	  background-image: -o-linear-gradient(top, #45a6ed, #45a6ed); 
	  background-image: -ms-linear-gradient(top, #45a6ed, #45a6ed); 
  }
 
#bottomInfo{
	clear:both;
	/*margin-left:30%;*/
	
	width:auto;
    bottom:0;
	font-family:Verdana, Tahoma, sans-serif;
	font-size:60%;
}

.alignBottomInfo{
	text-align:center;
}