/* INTRO DISCLAIMER AND TOUR */
/* INTRO DISCLAIMER AND TOUR */
/* INTRO DISCLAIMER AND TOUR */

/* Move project name / globesar logo to the left */
/* (space occupied by projects/users button) */
.zero-left {
	left: 0 !important;
	}

/* The translusent black background */
.guide-fullscreen-block {
    	position: absolute;
    	width: 100%;
    	height: 100%;
    	top: 0;
    	left: 0;
    	background: rgba(0,0,0,0.75);
    	z-index: 999999999;
    	opacity: 0;
	transition: opacity 500ms ease;
	-webkit-transition: opacity 500ms ease;
	}

/* The container */
.guide-container {
	padding: 20px 12px;
	background: white;
	position: relative;
	margin: auto;
	width: 606px;
	height: 250px;
	text-align: center;
	opacity: 0;
	z-index: 9999999999;
	transition: width 500ms ease, height 500ms ease, top 500ms ease, opacity 500ms ease;
	-webkit-transition: width 500ms ease, height 500ms ease, top 500ms ease, opacity 500ms ease;
	top: 230px;
	}

/* Big button */
.tour-button {
	border: 0;
	background: #00354E;
	color: white;
	padding: 6px 9px;
	font-weight: bold;
	font-size: 15px;
	margin: 5px;
	text-decoration: none;
	display: inline-block;
	position: relative;
	cursor: pointer;
	box-shadow: 1px 0px #000,
		    0px 1px #000,
	            2px 1px #000, 
	            1px 2px #000,
	            3px 2px #000, 
	            2px 3px #000,
	            3px 3px #000;

}

.tour-button:hover, .tour-button:focus {
	transform: translate(2px, 2px);
	box-shadow: 1px 0px #000, 
		    0px 1px #000,
	      	    2px 1px #000, 
	      	    1px 2px #000,
	      	    2px 2px #000;
}

.tour-button:active,
.tour-button.active {
	transform: translate(4px, 4px);
	box-shadow: 1px 0px #000, 
		    0px 1px #000,
		    1px 1px #000;
}



/* WELCOME BOX */
/* WELCOME BOX */
/* WELCOME BOX */

/* Welcome outer container */
.tour-welcome-outer-container {
	opacity: 1;
	transition: opacity 500ms ease;
	-webkit-transition: opacity 500ms ease;
	}

/* Welcome inner container */
.tour-container,
.tour-terms-container {
	opacity: 0;
	transition: opacity 500ms ease;
	-webkit-transition: opacity 500ms ease;
	}

/* Welcome text */
.welcome-text {
	top: 0 !important;
	height: auto !important;
	}

/* Welcome header */
.welcome-text h3 {
	padding: 0;
	margin: 0;
	margin-bottom: 24px;
    	font-size: 30px;
    	color: #00354E;	
	}

/* Welcome buttons container */
.tour-welcome-buttons-container {
	/*position: relative;*/
	/*margin-top: 13px;*/
	left: 0;
	position: relative;
	margin-top: 13px;
	text-align: center;	
	}

.tour-welcome-buttons-container .smooth-button {
	float: none;
	display: inline-block;
	text-align: center;
	margin: auto;
	margin-bottom: 10px;
	margin-left: 3px;
	margin-right: 3px;
	}	

/* Disclaimer, one liner */
.tour-welcome-disclaimer {
	margin-top: 20px;
	margin-bottom: 10px;	
	color: #999;
	}

.tour-welcome-disclaimerText,
.tour-welcome-disclaimer-terms {
    	display: inline-block;
    	font-style: italic;	
	}

.tour-welcome-disclaimer-terms {
	text-decoration: underline;
	}	

/* Contact text */
.tour-welcome-contact-text {
    	border-top: 1px solid #ccc;
    	padding-top: 10px;
    	position: relative;
    	top: 10px;
	}
	
.tour-welcome-disclaimerText {
	padding-top: 15px;
}


/* TERMS */
/* TERMS */
/* TERMS */

/* Terms container */
.tour-terms-container {
    	position: relative;
    	z-index: 999999999999;
    	height: 100%;
    	}

/* Terms text */
.tour-terms-text-area {
	padding-top: 20px;
	font-size: 12px;
    	text-align: left;
	}

/* Terms button container */
.tour-terms-button-container {
    	position: absolute;
    	width: 100%;
    	left: 0;
    	bottom: 30px;	
    	text-align: center;
	}

.terms-ok.smooth-button {
	margin: auto;
	position: relative;
	display: inline-block;	
	float: none;
	}




/* GUIDE */
/* GUIDE */
/* GUIDE */

/* Guide: buttons container */
.tour-buttons-container {
	position: absolute;
	bottom: 20px;
	width: 100%;
	left: 0;
	}

/* Container for GIF files + static image */
.guide-images {
    	position: relative;
    	width: 582px;
    	height: 326px;
    	margin: auto;
	}

/* Container for static background image */
.guide-background {
    	position: absolute;
    	top: 0;
    	left: 0;
    	width: 582px;
    	height: 326px;    
	}

/* Container for GIF files */
.guide-foreground {
    	position: absolute;
    	top: 0;
    	left: 0;
    	width: 582px;
    	height: 326px;
	}

/* Text area for guide */
.tour-text-area {
    	height: 78px;
	padding: 10px;
	line-height: 1.7;
	font-size: 14px;
	color: #666;
	font-weight: 600;
	opacity: 1;
	transition: opacity 500ms;
	-webkit-transition: opacity 500ms;
	padding-bottom: 10px;
	position: relative;
	top: 15px;
	}

/* The dots under the GIF's to show progress */
.tour-guide-dots-container {
    	height: 20px;
    	text-align: center;
    	position: relative;
    	top: 9px;
	}

/* Each progress dot */
.tour-dot {
	width: 10px;
	height: 10px;
	border-radius: 10px;
	background: #ddd;
	display: inline-block;
	margin: 8px;
	}

/* Active progress dot */
.active-dot {
	background-color: #109286;
	}




/* DESCRIPTION/LEGEND ADJUSTMENTS */
/* DESCRIPTION/LEGEND ADJUSTMENTS */
/* DESCRIPTION/LEGEND ADJUSTMENTS */

/* Satellite SVG path & angle titles */
.d3-satellite-title {
	font-size: 11px;
	}

/* Special adjustments for satellite angle SVG */
#d3-satellite-angle-container .d3-satellite-title {
    	position: relative;
    	top: -7px;	
	}

/* Adjust the position of the SVG's */
#d3-satellite-compass-container, 
#d3-satellite-angle-container {
    	margin-right: 12px;
    	margin-left: 12px;
    	margin-top: 5px;    	    	
	}

/* Adjust opacity slider title */
.description-control-opacity-title {
    	padding-top: 20px;
    	opacity: 0.4;
    	font-size: 11px;	
	}

/* Opacity slider handle adjustments */
.description-control-opacity-container .noUi-horizontal .noUi-handle {
    width: 14px !important;
    height: 15px !important;
    left: -11px !important;
    top: -6px !important;
}

/* Opacity slider handle adjustments */
.description-control-opacity-container .noUi-handle {
    	box-shadow: none;
    	border: none;
    	border-radius: 10px;	
	}

/* Opacity slider handle adjustments */
.noUi-handle:after, .noUi-handle:before {
	display: none !important;
	}




/* Ceralized caption above legend */
/* ... "Velocity in mm per. year" */
.info-legend-globesar,
.info-legend-header {
    	position: absolute;
    	top: -18px;
    	width: 100%;
    	text-align: center;
    	font-size: 10px;
    	color: #666;	
	}


/* Legend description container */
/* ... line under legend explaining if dot is moving towards or from satellite */
.info-legend-gradient-bottomline,
.info-legend-gradient-bottomline {
	height: auto;
	font-size: 10px;
    	color: #999;
    	font-weight: 500;
	}

/* Container holding Globesar specific legend information */
.globesar-specific-legend-container,
.legend-gradient-footer {
	margin-top: 4px;
	}

/* The part with the text "Deformasjon i sikteretning til satellitten" */	
.globesar-specific-legend-top,
.legend-gradient-footer-top {
    	text-align: center;
    	position: relative;
    	top: 3px;
	}

/* Container for arrow line under legend*/
.globesar-specific-legend-line-container,
.legend-gradient-footer-line-container {
    	height: 6px;
    	padding-left: 6px;
    	padding-right: 6px;
    	margin-left: 3px;
    	margin-right: 0px;
	}

/* Horizontal line */
.globesar-specific-legend-line,
.legend-gradient-footer-line {
    	height: 1px;
    	position: relative;
    	top: 5px;
    	background-color: #6066B3;
	}	

/* Left and right arrow at the end of line under legend */
.globesar-specific-legend-arrow-left,
.globesar-specific-legend-arrow-right,

.legend-gradient-footer-arrow-left,
.legend-gradient-footer-arrow-right {
    	width: 10px;
    	height: 9px;
    	position: absolute;
    	overflow: hidden;
	}


.globesar-specific-legend-arrow-left:before,
.globesar-specific-legend-arrow-right:before,	

.legend-gradient-footer-arrow-left:before,
.legend-gradient-footer-arrow-right:before {
	content: '';
	width: 9px;
	height: 9px;
	background: #6066B3;
	position: absolute;
	-webkit-transform: rotate(45deg);
	left: 7px;
	top: 0px;
	}

.globesar-specific-legend-arrow-left:before,
.legend-gradient-footer-arrow-left:before {
	left: 7px;
	}

.globesar-specific-legend-arrow-right:before,
.legend-gradient-footer-arrow-right:before {
	left: -6px;
	}

.globesar-specific-legend-arrow-left,
.legend-gradient-footer-arrow-left {
	left: -1px;
	}

.globesar-specific-legend-arrow-right,
.legend-gradient-footer-arrow-right {
	right: -4px;
	}

/* Little line showing the middle of the line under legend */ 
.globesar-specific-legend-middle-line,
.legend-gradient-footer-middle-line {
    	height: 9px;
    	width: 1px;
    	background: #6066B3;
    	position: absolute;
    	left: 50%;	
	}

/* The "Mot satellitten" and "Fra satellitten" text under legend info line */
.globesar-specific-legend-toward,
.globesar-specific-legend-from,

.legend-gradient-footer-toward,
.legend-gradient-footer-from {
	width: 49%;
	text-align: center;
	display: inline-block;
	}