/*
This code file was developed by Delenn Chin between 2014 and 2016 at Stanford University.  The copyright to this document is held by Stanford University.  This file is licensed under the creative Commons License CC BY-NC-ND 4.0. For more information and the complete text of the license please go to https://creativecommons.org/licenses/by-nc-nd/4.0/
Please contact Stanford University Press if you have any questions regarding the reproduction of material included in this document and/or for all requests that don't meet the Creative Commons License CC BY-NC-ND 4.0 requirements.
*/

* {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box
}
*:before, *:after {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box
}
a {
		text-align:left;
		color:#7f1418;
}
a:hover {
		color:#7f1418;
		text-decoration:none;
}
footer span a {
		color:#7f1418;
}
footer span a:hover {
		color:#7f1418;
		text-decoration: none;
}
html,body {
		height:100%;
		margin:0;
		font-size:12pt;
}
body {
		background-color: #D4D4D2;
		font-family: 'Georgia', serif;
		font-size: 1em;
		background-image:url("http://enchantingthedesert.com/images/misc/browser_background_III.jpg");
		background-repeat:no-repeat;
		background-position:center;
		background-size:cover;
}
#main {
		margin:0 auto;
		width:98vw;
		height:73.5vw;
		max-width:133.33vh;
		max-height:100vh;
		min-width:880px;
		min-height:660px;
		position:relative;
		background-color:#F7F7F7;
		overflow:hidden;
}
#header_menu {
		display:inline-block;
		width:100%;
		height:40px;
		background-image:url("http://enchantingthedesert.com/images/misc/Banner_photo_BG_2-24-16.png");
		background-repeat:no-repeat;
		background-size:cover;
}
#header_menu nav {
		font-family: arial;
		font-size:0.9em;
}
#header_topics {
		height:4%;
		border-top: 1px solid #EBEBEB;
		border-bottom: 1px solid #EBEBEB;
		background-color: white;
}
.topic {
		height:100%;
		position:relative;
		display:inline-block;
		width:15%;
		margin-left:.8333333%;
		margin-right:.8333333%;
		float:left;
		text-align: center;
		cursor:pointer;
		font:1.2em arial;
		line-height:100%;
		border-radius: 17px; 
		-moz-border-radius: 17px; 
		-webkit-border-radius: 17px;
		opacity: .5;
}
.topic:hover {
		opacity:1;
}
.topic_text {
		width:100%;
		display:inline-block;
		margin:0;
		position:absolute;
		top:0;
		left:0;
}

.topic_selected {
		opacity: 1;
}

#singularity_content {
		position:relative;
		height: calc(93.72% - 70px);
}
.console {
		position:relative;
		display:inline-block;
		border: 1px solid #D2D2D2;
}
#menu, #index {
		-webkit-box-shadow: 14px 0px 14px 1px rgba(80,80,80,0.7);
		-moz-box-shadow: 14px 0px 14px 1px rgba(80,80,80,0.7);
		box-shadow: 14px 0px 14px 1px rgba(80,80,80,0.7);
		background-color:rgba(51,51,51,1);
		width:350px;
}
.mm-panel::-webkit-scrollbar { 
		display: none; 
}
.toc-link:hover, .index-titlelink:hover {
		cursor:pointer;
}
#menu .mm-listview>li>.toc-link, #index .mm-listview>li>.mm-next+a {
		margin-right:0;
}
#menu .mm-listview>li.mm-opened.mm-vertical>.mm-panel {
		background-color:inherit;
}
#index .mm-listview>li.mm-opened.mm-vertical>.mm-panel, #index .mm-listview>li.mm-opened>a.mm-next {
		background-color:transparent;
}
#index .mm-listview .mm-vertical .mm-panel, .mm-vertical .mm-listview .mm-panel {
		padding:10px 0 10px 30px;
}
#menu ul > li, #index ul > li {
		font-size:16px;
		font-weight:bold;
}
#menu ul li ul > li, #index ul li ul > li {
		background-color:#ebebeb;
		color:#7f1418;
		font-size:14px;
		font-weight:normal;
}
#menu li { /*DOESNT WORK*/
		-webkit-transition: height .5s;
		-moz-transition: height .5s;
		-o-transition: height .5s;
		-ms-transition: height .5s;
		transition: height .5s; 
}
#menu ul li > a.mm-next, #index ul li > a.mm-next {
		display:none;
}
#menu ul li ul li > a.mm-next, #index ul li ul li > a.mm-next {
		display:initial;
		border-color:transparent;
}
#menu ul li ul li > a.mm-next:after {
		border-color:grey;
}
#index ul li ul li > a.mm-next:after {
		border-color:white;
}
#menu ul li ul li ul > li {
		color:#383838;
		font-style: italic;
}
#index>div>div>ul>li>div.mm-panel li {
		background: -moz-linear-gradient(left, rgba(255,255,255,0.05) 0%, rgba(0,0,0,0.65) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(left, rgba(255,255,255,0.05) 0%,rgba(0,0,0,0.65) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to right, rgba(255,255,255,0.05) 0%,rgba(0,0,0,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		background-color:#ebebeb;
}
#alpha_console {
		left:0;
		top:0;
		width:64%;
		height:100%;
		left:1%;
		border:none;
		overflow:hidden;
}
#alpha {
		left:0;
		top:0;
		width:100%;
		padding:5px;
}
#control_bar {
		left:0;
		top:0;
		width:100%;
		height:calc(25% - 5px);
		position:relative;
		margin-top:5px;
		background-image:url('http://enchantingthedesert.com/images/misc/control_bar_background.png');
		background-repeat:no-repeat;
		background-size: 100% 100%;
		width: 100%;
}
.hidden_control_col {
		padding-top:1%;
		padding-left:1%;
		float:left;
		opacity: 1;
}

.control_col {
		padding-top: 1%;
		padding-left: 1%;
}

.control_bar_col1 {
		width:25%;
}
.control_bar_col2 {
		width:45%;
}
.control_bar_col3 {
		width:30%;
		padding-left:.5%;
		padding-right:.5%;
}
.control_checkbox {
		display: block;
		margin-bottom: 0;
		vertical-align: middle;
		font-weight: normal;
		cursor: pointer;
}
label.control_checkbox span {
		margin-left:3px;
}
span.control_col > * {
		padding-bottom:3px;
}
span.control_bar_col3 div {
		border-left: solid 1px rgba(176,224,230, 0.6);
		padding-left: 10px
}
.alpha {
		left:0;
		top:0;
		width:100%;
		height:100%;
		border:none;
}
#alpha_photo {
		height:100%;
}
#alpha_essay {
		height:100%;
		overflow:hidden;
}

.side_window {
		width:33.5%;
		float:right;
		clear:right;
		right:1%;
		background-color:#FFFFFF;
		padding:3px;

		-webkit-transition: max-height 1s; 
		-moz-transition: max-height 1s; 
		-ms-transition: max-height 1s; 
		-o-transition: max-height 1s; 
		transition: max-height 1s;  
}
#bravo.side_window {
		height:49%;
		max-height:49%;
}
#charlie.side_window {
		height:40%;
		max-height:40%;
		overflow:hidden;
}
#delta.side_window {
		height:calc(47% - 10px );
		max-height:calc(47% - 10px );
		overflow:hidden;
}

#bravo.side_window_selected {
		max-height:13%;
}
#charlie.side_window_selected {
		max-height:4%;
}
#delta.side_window_selected {
		max-height:calc(11% - 10px);
}

#bravo {
		margin-bottom: 5px;
}
#charlie {
		margin-bottom: 5px;
		background-size:initial;
}
#delta {
		background-color:#FFFFFF;
		font-size:0.7em;
		overflow:hidden;
		cursor:pointer
}
.center-this {
		top:0;
		bottom:0;
		margin:auto;
		overflow:hidden;
		position:absolute;
}
#map_controls {

}
#photo_controls {

}
#heatmap_text {
		text-align: middle;
}

.essay_txt {
		cursor:pointer;
		color:#337ab7;
}
.background_img {
		background-size:'contain';
		background-repeat:'no-repeat';
		background-position:'center';
}

.side_text {
		font-size:0.8em;
		color: grey;
		font-style:italic;
		display:'initial';
		font-variant:small-caps;
		font-family:'Arial';
}
.side_window_selected .side_text {
		display:none;
}

#bravo_background {
		width:100%;
		height:100%;
		position:relative;
}

#bravo.side_window_selected #bravo_background {
		background-repeat:'repeat';
		overflow:hidden;
		padding-bottom:2px;
		cursor:default;
		opacity:1;
}

#bravo.side_window_selected #bravo_text {
		display:none;
}

#bravo_image {
		width:100%;
		height: 80%;
		position:relative;
		opacity:1;
		padding-bottom:0px;
		cursor:pointer;
}
#bravo.side_window_selected #bravo_image {
		height:100%;
		background-size:'initial';
		opacity:0.5;
		padding-bottom:2px;
		cursor:default;
}

#bravo_arrows, #essay_arrows {
		position:absolute;
		width:100%;
		margin:0 auto;
		height:28%;
		top:40%;
		display:'initial';
}
#bravo.side_window_selected #bravo_arrows {
		height:20%;
}
#bravo.lm_selected #bravo_arrows {
		display:none;
}
.arrow {
		position:absolute;
		height:100%;
		width:6%;
}
#bravo.side_window_selected .bravo_arrow {
		width:5%;
}
#bravo_prev_arrow, #essay_prev_arrow {
		left:10%;
}
#bravo.side_window_selected #bravo_prev_arrow {
		left:15%;
}
#bravo_next_arrow, #essay_next_arrow {
		right:10%;
}
#bravo.side_window_selected #bravo_next_arrow {
		right:15%;
}
#essay_next_arrow span, #bravo_next_arrow span {
		-webkit-transform: rotate(180deg);
		transform: rotate(180deg);
}
.bravo_arrow img {
		position:absolute;
		top:0;
		left:0;
		height:100%;
		opacity:0;
		-webkit-transition: opacity .2s ease-in-out;
		-moz-transition: opacity .2s ease-in-out;
		-ms-transition: opacity .2s ease-in-out;
		-o-transition: opacity .2s ease-in-out;
		transition: opacity .2s ease-in-out;
}
.bravo_arrow:hover img {
		opacity:1;
		cursor:pointer;
}
.bravo_arrow:hover span {
		display:none;
}
.arrow span::before {
		-webkit-transform: translateX(-50%) rotate(30deg);
		transform: translateX(-50%) rotate(30deg);
		-webkit-transform-origin: 0 100%;
		transform-origin: 0 100%;
}
.arrow span::after {
		top: 50%;
		-webkit-transform: translateX(-50%) rotate(-30deg);
		transform: translateX(-50%) rotate(-30deg);
		-webkit-transform-origin: 0 0;
		transform-origin: 0 0;
}
.arrow span::before, .arrow span::after {
		position: absolute;
		left: 50%;
		width: 3px;
		height: 50%;
		background: #7f1418;
		content: '';
}
.arrow span {
		position: relative;
		display: block;
		width: 100%;
		height: 100%;
}

#bravo_show {
		position:relative;
		height:20%;
		display:'initial';
}
#bravo.side_window_selected #bravo_show {
		display:none;
}

#bravo_title {
		width: 60%;
		position: absolute;
		left: 20%;
		text-align:center;
		font-size: 1em;
		top:30%;
		display:'initial';
}
#bravo.lm_selected #bravo_title {
		display:none;
}

#bravo_curr_stationpt {
		width:10%;
		margin-right:.5%;
		float:left;
		display:'initial';
}
#bravo_photo_title {
		width:89.4%;
		position:relative;
		float:left;
}
#bravo.side_window_selected #bravo_curr_stationpt {
		display:none;
}

#bravo_stationpt {
		position:absolute;
		top:35%;
		left:45%;
		width: 10%;
		display:none;
}
#bravo.side_window_selected #bravo_stationpt {
		display:'initial';
}

#bravo_lmtext {
		position:absolute;
		left:1%;
		top:20%;
		width:33%;'
		margin-right:1%;
		text-align:right;
		font-size:1.2em;
		line-height:1.1;
		color:black;
		display:'initial';
		padding-top:1%;
}
#bravo:not(.lm_selected) #bravo_lmtext {
		display:none;
}
#bravo_stationpts_container {
		display:'initial';
		position:relative;
		left:35%;
		height:25%;
		width:65%;
		display:inline-block;
		margin-top:3%;
} 
#bravo:not(.lm_selected) #bravo_stationpts_container {
		display:none;
}
.bravo_lmstationpts {
		height:100%;
		display:inline-block;
		cursor:pointer;

		-webkit-transition: height .2s; 
		-moz-transition: height .2s; 
		-ms-transition: height .2s; 
		-o-transition: height .2s; 
		transition: height .2s;  
}

#charlie_basemap {
		overflow:'hidden';
		height:100%;
		top:0;
		padding-top:3px;
		padding-bottom:3px;
		opacity:1;
		cursor:pointer;
}
#charlie.side_window_selected #charlie_basemap {
		top:0;
		height:auto;
		opacity:0.5;
		cursor:default;
}

#charlie_viewshed {
		display:'initial';
		overflow:'hidden';
		top:0;
		height:100%;
		padding-top:3px;
		padding-bottom:3px;
		opacity':1;
		cursor:pointer;
}
#charlie.side_window_selected #charlie_viewshed {
		display:none;
		cursor:default;
}

#charlie_text {
		position:absolute;
		z-index:3;
		bottom:3px;
		left:3px;
}

#delta_preview {
		height:100%;
		width:100%;
		position:relative;
		overflow:hidden;
		cursor:pointer;
		display:'initial';
}
#delta.side_window_selected #delta_preview {
		cursor:default;
		/*display:none;*/
}

#text-holder {
		padding:10px;
}
#delta.side_window_selected #text-holder{
		display:none;
}

#delta.side_window_selected #delta_continue_reading{
		display:none;
}

#delta.side_window_selected #delta_continue_reading{
		display:none;
}
#delta.side_window_selected #delta_delta_text {
		display:initial;
}
#delta_continue_reading {
		position:absolute;
		bottom:3px;
		right:3px;
		color:#7f1418;
		font-size: 1.2em;
		cursor:inherit;
}
#delta_controls {
		width:100%;
		height:19%;
}
#delta.side_window_selected #delta_controls {
		height:100%;
}
.delta_control {
		height:100%;
		width:33.3333%;
		position:relative;
		float:left;
}
.delta_arrow {
		background-color:green;
		cursor:pointer;
}
.delta_title {
		text-align: center;
		font-weight:bold;
		font-style:italic;
		font-size:1.5em;
		margin-top:1%;
		padding:0% 4%;
		line-height:1;
		position:relative;
		cursor:inherit;
}
.delta_text {
		text-align: center;
		font-style:italic;
		width:100%;
		position:absolute;
		bottom:1%;
		cursor:inherit;
}
#delta_curr_title {
		font-size:2em;
}
#delta_delta_text {
		position:absolute;
		left:56px;
		top:20%;
		width:calc(100% - 100px);
		height:60%;
		text-align:center;
		font-family:arial;
		color:grey;
		display:none;
}
#essay_arrows {
		height:40%;
		top:30%;
}
.essay_arrow span::before, .essay_arrow span::after {
		-webkit-transition: -webkit-transform 0.3s;
		transition: transform 0.3s;
}
.essay_arrow span:hover::before {
		-webkit-transform: translateX(-50%) rotate(45deg);
		transform: translateX(-50%) rotate(45deg);
}
.essay_arrow span:hover::after {
		-webkit-transform: translateX(-50%) rotate(-45deg);
		transform: translateX(-50%) rotate(-45deg);
}
.text {
		font-family: arial;
		/*font-size:.9em;*/
		display:block;
		margin-left: 10px;
		padding-left: 10px;
		width:95%;
		font-size: 0.75em;
		margin-bottom: 3%;
}
.control_col_title {
		font-size: 1em;
}
#control_narration_text {
		margin-left:0;
		padding-left:0;
		width:100%;
}
#title {
		/*font-variant: small-caps;*/
		color:#7f1418;
		float: left;
		margin: 0;
		padding-left: 10%;
}
nav {
		float: right;
		text-align: right;
		padding-right: 10px;
		padding-top:10px;
}

nav ul {
		list-style: none;
}

nav li {
		display: inline-block;
		margin-left: 10px;
}
footer {
		padding: 0px 10px;
		height: 25px;
		font-family: Helvetica, Arial, serif;
}

footer img {
		max-height: 19px;
}
footer span {
		line-height:21px;
		font-size:.8em;
}
span.sup {
  float: right;
  font-family: Helvetica, Arial, serif;
  display: inline-block;
  margin: 0;
}
#sup-text {
  text-transform: uppercase;
  font-size: 10px;
  letter-spacing: 2px;
  line-height:21px;
}
span.sup ul {
		list-style: none;
		margin: 0;
}

span.sup li {
		display: inline-block;
}

.noselect {
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		-khtml-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
}
.sound_icon_style{
		float: left;
		position: absolute;
		padding-top: 40px;
		padding-bottom: 20px;
		padding-right: 10px;
		left: 0%;
}

.narration_text_style{
		float:left;
		text-align:justify;
		position: absolute;
		padding-top: 20px;
		padding-bottom: 20px;
		padding-left: 10px;
		left:30%;
}

.reading_style {
		right:0;
		display: inline;
		position: absolute;
		z-index: 999;
}

.reading_image:hover {
		transform: scale(1.1, 1.1);
		-ms-transform: scale(1.1, 1.1); /* IE 9 */
		-webkit-transform: scale(1.1, 1.1); /* Safari and Chrome */
		-o-transform: scale(1.1, 1.1); /* Opera */
		-moz-transform: scale(1.1, 1.1); /* Firefox */
}

#photoRibbon {
		background-color:#FFF;
		width:100%;
		position:relative;
		margin:0 auto;
		margin-bottom:5px;
}
.ribbonDivs {
		display:inline-block;
		position:relative;

		width:100%;
		cursor:pointer;
		height:100%;
		background-position: 0 0;
		background-size:100%, 400%;
		background-repeat:no-repeat;
}

.ribbonContainers{
		float:left;
		display:inline-block;
		position:relative;
}


.tinted, .ribbon {
		position:absolute;
		top:0px;
		left:0px;
}
.highlight {
		box-sizing:border-box;
		-moz-box-sizing:border-box;
		-webkit-box-sizing:border-box;
		-webkit-box-shadow: 0px 0px 11px 8px rgba(0,0,0,1);
		-moz-box-shadow: 0px 0px 11px 8px rgba(0,0,0,1);
		box-shadow: 0px#ADD8E6 0px 11px 8px rgba(0,0,0,1);
		border:solid white 1px;
		z-index:2;
}
#loader, #delta_loader {
		display:    none;
		position:   absolute;
		z-index:    1000;
		top:        0;
		left:       0;
		height:     100%;
		width:      100%;
		background: rgba( 255, 255, 255, 1) 
		url('http://enchantingthedesert.com/images/misc/ajax-loader.gif') 
		50% 50% 
		no-repeat;
}

.control_box{
		width:3%;
		min-width:10px;
		height:5%;
		padding: 1%;
		border-radius:3px;
		cursor:inherit;
		float:left;
		margin-top:1.5%;
		vertical-align: bottom;
}

body.loading #loader, #bravo_image.loading #bravo_loader, #delta_preview.loading #delta_loader {
		display:block;
}
.stationptTint{
		opacity: 0.7;
		text-align: center;
}

.fade_out:before {
		content:'';
		width:100%;
		height:100%;    
		position:absolute;
		left:0;
		top:0;
		background: rgba(237,237,237,0);
		background: -moz-linear-gradient(top, rgba(237,237,237,0) 0%, rgba(255,255,255,1) 100%);
		background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(237,237,237,0)), color-stop(100%, rgba(255,255,255,1)));
		background: -webkit-linear-gradient(top, rgba(237,237,237,0) 0%, rgba(255,255,255,1) 100%);
		background: -o-linear-gradient(top, rgba(237,237,237,0) 0%, rgba(255,255,255,1) 100%);
		background: -ms-linear-gradient(top, rgba(237,237,237,0) 0%, rgba(255,255,255,1) 100%);
		background: linear-gradient(to bottom, rgba(237,237,237,0) 0%, rgba(255,255,255,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#ffffff', GradientType=0 );
}


.control_text {
		cursor:inherit;
		padding-left: 20px;
		color:black;
		font-weight:normal;
}
.control_text.text_selected {
		color:#7f1418;
		font-weight:bold;
}

#instructions_text {
		bottom: 0px;
}

#photo_credits{
		padding-right: 5px;
		right: 0px;
		position:absolute;
		bottom:10%;
		font-size:.75em;
}

#delta_preview{
		background-image: url('http://enchantingthedesert.com/images/misc/delta_preview_bkg.jpg');
		background-repeat:no-repeat;
		background-size:cover;
}

#hidden_control{
		position:absolute;
		bottom:0%;
		visibility: hidden;
		z-index: 2;
		width: 98%;
		left: 1%;
		margin-bottom: 15px;
		padding-top: 1%;
		padding-bottom: 6%;
		background-image: url('http://enchantingthedesert.com/images/misc/Hidden_Popup.png');
		background-repeat:no-repeat;
		background-size:cover;
}

#hidden_more_tips{
		position:absolute;
		padding-top: 1%;
		left: 68%;
		height: 100%;
		width: 30%;
}

.hidden_left_col{
		width: 65%;
}

.tool_titles{
		color: #7f1418;
}
.tool_line {
	padding-right:10px;
	border-style:solid;
		border-width:0px 1px 0px 0px;
		border-color:grey;
}
.tool_heading {
	margin-right:10px;
	font-family:arial;
	border-style:solid;
	border-width: 0px 0px 1px 0px;
	border-color:grey;
}
.tool_tip {
	display:list-item;
}
#hidden_control.slide-up {
		z-index:1100;
		visibility: visible;
		bottom:100%;
		transition: all 1s ease;
		-ms-transition: all 1s ease; /* IE 9 */
		-webkit-transition: all 1s ease; /* Safari and Chrome */
		-o-transition: all 1s ease; /* Opera */
		-moz-transition: all 1s ease; /* Firefox */
}

#show-hidden{
		position: absolute;
		right: 10px;
		top: 5px;

}

#show-hidden:hover{
		cursor:pointer; 
}

.control_col1{
		position: absolute;
		left: 1%;
		margin-top: 20px;
		padding-top: 2%;
		width: 50%;
}

.control_col2{
		width: 40%;
		position:absolute;
		left: 55%;
		margin-top: 20px;
		padding-top: 2%;
}

.photo_controls{
		margin-top: 5%;
}

.control_col2.photo_controls {
		width:25%;
}

#audio_narration{
		margin-left: 10%;
}

#html5Loader{
	top:0;
	left:0;
	background:#545454;
	background:-webkit-gradient(radial, 50% 50%, 0, 50% 50%, 960, from(#B0B0B0), to(#545454)) no-repeat #00406E;
	background: -moz-radial-gradient(50% 50% 0deg,ellipse farthest-corner, #B0B0B0, #545454, #545454 170%);
	background: -o-radial-gradient(50% 50%, #B0B0B0, #545454);
	margin:0;
	position:fixed;
	z-index:1999;
}




/*=============SINGULARITY_MAP=============*/

img { pointer-events: all; }
.zoomable_element a:visited { color:green; }
.zoomable_element a:link { color:green; }

div {
	cursor:default;
}

#instructions_text {
	position:absolute;
	z-index:1000;
	font-family:arial;
	font-size:.6em;
	left: 1%;
}

#Zoom_In_Button {
	bottom:46px;left:10px;
	background-image: url(http://enchantingthedesert.com/images/misc/zoom_in_sprite.jpg);
}
#Zoom_Out_Button {
	bottom:15px;left:10px;
	background-image: url(http://enchantingthedesert.com/images/misc/zoom_out_sprite.jpg);
}
.zoom_button {
	position:absolute;
	width:30px;height:30px;
	z-index:1000;
	cursor:pointer;
	background-position: 0 0;
	background-size:100% 400%;
	background-repeat:no-repeat;
}

#container {
	position:relative;
	width:100%;
	top:0px;left:0px;
	z-index:2;
}
#parent {
	position:relative;
	width:100%;
	display:inline-block;
	z-index:2;
	background-color:#FFF;
}
#basemap {
	opacity:1;
}
.base_layer {
	position: absolute;
	top:0px;left:0px;
	width: 100%;
	z-index:2;
	opacity:0;
}
.visible_base_layer { /* For fade in/out transitions */
transition: opacity .15s linear;
		-moz-transition: opacity .15s linear;
		-webkit-transition: opacity .15s linear;
}
#panzoom {
	position: relative;
	margin: 0 auto;
	top:0px;left:0px;
	z-index:2;
}
.panzoom {
-webkit-backface-visibility: initial !important;
-webkit-transform-origin: 50% 50%;
}

/* Set styles for viewsheds */
.ViewshedDivs {
	width:100%;
	height:100%;
	position: absolute;
	top:0px;left:0px;
	user-select: none;
	-webkit-user-select:none;
	-moz-user-select: none;
}
.ViewshedPNG {
	position: absolute;
	top:0px;left:0px;
	width: 100%;
	opacity:0;
	z-index: 10;
}

/* Station points */
#StationPtsSVGLayer {
	width: 100%;
	height:100%;
	position: absolute;
	top:0px;left:0px;
	z-index: 501;
}
.stationpt_svg { opacity:0; }

/* Div for station point labels' default and rollover icons */
#StationPtsIconsDiv {
	width: 100%;
	height:100%;
	position: absolute;
	top:0px;left:0px;
	z-index: 150;
}

#ViewshedAnglesLayer {
	z-index:3;
}
.Viewsheds {
	width:100%;
	height:100%;
}
#StationPtsSVGLayerName {
	width:100%;
	height:100%;
}
#Stationpoints_x5F_Cropped_xA0_Image_1_ {
	width:100%;
	height:100%;
}
#canvas {
	position:absolute;
	top:0px;
	left:0px;
	display:inline-block;
	z-index:100;
}
img {
	cursor:default;
}

.landmark_layer {
	z-index:50;
}

#landmarks_cat1_img {
	z-index:11;
}

#landmarks_cat1, #trails_artwork, #landmarks_trails {
	opacity:1;
	visibility:hidden;
	z-index:500;
	height:100%;
}

#trails_artwork_img {
	z-index:4;
}

/*=============SINGULARITY_PHOTO=============*/
#photo_photo, #transparent_layer, .photo_layer {
	top:0;
	bottom:0;
	left:0;
	right:0;
	margin:auto;
	position:absolute;
	max-width: 100%;
	max-height: 100%;
}
#photo_wrapper {
	height:100%;
	width:100%;
}
#photo_title {
	font-size:1.5em;
	float:left;
	width:100%;
	height:27%;
	font-family:arial;
	padding:2%;
}
#photo_title_icon {
	height:100%;
	float:left;
}
#photo_title_wrapper {
	overflow:hidden;
}
#photo_title_text {
	width:100%;
	font-family:Georgia;
}
#photo_container {
	height:100%;
}

#transparent_layer {
	z-index:0;
}

/*=============SINGULARITY_ESSAY=============*/
.selectable {
	-webkit-touch-callout: text;
	-webkit-user-select: text;
	-khtml-user-select: text;
	-moz-user-select: text;
	-ms-user-select: text;
	user-select: text;
}
#essay_wrapper {
	width:100%;
	height:100%;
	overflow:auto;
	color:#434343;
	position:absolute;
	background-color:#fafafa;
}
#essay_second_wrapper {
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	right:0;
	margin-top:25px;
}
#sidenotes_wrapper {
	font-size: small;
	visibility: hidden;
	width:25%;
	overflow:scroll;
	height:100%;
	position:absolute;
	left:0;
	color:#434343;
	position:absolute;
	padding-left: 10px;
	padding-right:15px;
	background-color:#f6f6f6;
}
#sidenotes_wrapper::-webkit-scrollbar { 
	display: none; 
}
#side_notes, #main_essay {
	position:absolute;
	width:100%;
	top:0;
	left:0;
	padding-left:15px;
	padding-right:15px;
}

@media screen and (min-width: 1100px) {
	#essay_wrapper {
		width: 75%;
		/*left:0%;*/
		right:0;
	}
	#buttonBox {
		padding: 0px 10px;
	}
	.cite_share {
		margin-right:10px;
	}
	#sidenotes_wrapper {
		visibility: visible;
	}
	.footnotes {
		display: none;
	}
		#essayTitle {
		display:none;
	}
	#essay_second_wrapper {
		margin-top:0px;
	}
}
#essayTitle {
	display: none;
	position:absolute;
	left:25%;
	background-color:white;
	width:100%;
	z-index:499;
	padding-left:10px;
	-webkit-box-shadow: 0px 4px 5px 0px rgba(100,100,100,0.75);
	-moz-box-shadow: 0px 4px 5px 0px rgba(100,100,100,0.75);
	box-shadow: 0px 4px 5px 0px rgba(100,100,100,0.75);
}
.boxed {
	position:absolute;
	left:29%;
	top:25px;
	width:70%;
	z-index:9000;
	background-color: #EBEBEB;
	-webkit-box-shadow: 0px 0px 13px 1px rgba(0,0,0,1);
	-moz-box-shadow: 0px 0px 13px 1px rgba(0,0,0,1);
	box-shadow: 0px 0px 13px 1px rgba(0,0,0,1);
	display:block;
	padding-bottom:10px;
}

#buttonBox{
	background-color: #fafafa;
	width: 25%;
	left:0;
	top:0;
	margin-right:0px;
	position:absolute;
	padding:0px 5px;
	z-index:500;
}
#boxURL {
	width:90%;
	margin:0 auto;
	overflow:auto;
	height:80%;
	background-color:#FFFFFF;
	padding:5px;
	-webkit-box-shadow: 0px 0px 2px 2px rgba(101,154,203,0.9);
	-moz-box-shadow: 0px 0px 2px 2px rgba(101,154,203,0.9);
	box-shadow: 0px 0px 2px 2px rgba(101,154,203,0.9);
}
#citeButton:hover, #shareButton:hover, #printButton:hover {
	cursor:pointer;
	text-decoration:none;
}
#citeButton, #shareButton, #printButton {
	color:#7f1418;
}

.cite_share {
	position:relative;
	margin-right:5px;
}

.all_sidenotes {
	word-wrap: break-word;         /* All browsers since IE 5.5+ */
	overflow-wrap: break-word;     /* Renamed property in CSS3 draft spec */
	width: 90%;
	cursor:text;
}

#close-button {
	position: absolute;
	right: 8px;
	cursor: pointer;
}

/* FOR PHOTO 37 CAROUSEL */
/*
  Bootstrap Carousel Fade Transition (for Bootstrap 3.3.x)
  CSS from:       http://codepen.io/transportedman/pen/NPWRGq
  and:            http://stackoverflow.com/questions/18548731/bootstrap-3-carousel-fading-to-new-slide-instead-of-sliding-to-new-slide
  Inspired from:  http://codepen.io/Rowno/pen/Afykb 
*/
#myCarousel {
	width:100%;
}
.carousel-fade .carousel-inner .item {
  -webkit-transition-property: opacity;
  transition-property: opacity;
}
.carousel-fade .carousel-inner .item,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  opacity: 0;
}
.carousel-fade .carousel-inner .active,
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}
.carousel-fade .carousel-inner .next,
.carousel-fade .carousel-inner .prev,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}
.carousel-fade .carousel-control {
  z-index: 2;
}

.photo_image {
	max-height:700px;
	max-width:100%;
}