#map-main-wrapper {
	float: left;
	width: 100%;
	border: 1px dotted red;
}

#mountain-data {
	float: right;
	width: 314px;
	border: 1px solid black;
}

#delete-mountain {
	float: left;
	text-align: right;
	width: 49%;
	margin-top: 5px;
}

#new-mountain {
	float: left;
	margin: 5px;
	text-align: right;
	width: 45%;
}

#history {
	font-size: 75%; 
	height: 210px; 
	overflow: auto;
}

.history-title{
	display: block; 
	font-weight: bold;
}

.history-text{
	display: block; 
	font-weight: normal;
}

#datum-selector {
	float: right;
	width: 40%;
}

#location-title {
	float: left; 
	width: 55%;
}

#latitude, #longitude{
	display: none;
}

#nearest-mountains {
	font-size: 10px;
	height: 100px;
	width: 270px;
	overflow: auto;
	box-sizing: content-box;
}

#nearest-mountains td{
    width: 20%;
	text-align: right;
}

#nearest-mountain-table th:first-child, #nearest-mountains td:first-child {
	text-align: left;
	width: 48%;
}

#nearest-mountain-table th:nth-child(3), #nearest-mountains td:nth-child(3){
	text-align: right;
	padding-left: 3px;
}

#nearest-mountains-table th:last-child, #nearest-mountains td:last-child {
	text-align: left;
	padding-left: 5px;
}

#nearest-mountains-table thead {
	display: none;
}

#nearest-mountains-table {
	border-spacing: 0;
    border-collapse: collapse;
}

#nearest-mountains-table tbody tr:hover  {
	background-color: #c9ecf8;
}

#nearest-mountains-table a {
	color: #996666;
	margin-left: 0px;
}

table#authorship {
	width: 100%;
}

table#authorship tr td:first-child {
	width: 100%;
}

table#authorship tr td:second-child {
	width: 120px;
}

#social-networks {
	float:left;
}

#climbs-counter {
	font-family: Trebuchet MS, sans-serif;
	background: green;
	color: white;
	clear:both;
	margin-left:-30px;
	border-radius: 3px;
	padding: 4px 6px 3px;
	font-size: 12px;
}

#climbs-counter img {
	height: 11px;
	vertical-align: middle;
}

#lang-translations {
	float: right;
}

#lang-translations img {
	width: 36px;
	margin-right: 5px;
}

#lang-translations img:hover {
	opacity: 0.7;
}

.translate-to {
	margin-left: 5px;
}


.sidebar_item .data-title {	
	margin: 0;
	padding: 0;
	text-shadow: 1px 1px black;
}

.sidebar_item .data-value {	
	width: 105%;
	min-height: 24px;
	margin-bottom: 10px;
	margin-top: 0;
	padding: 3px 3px 3px 10px;
	vertical-align: middle;
	border-radius: 4px;
	background: #7bacb9;
	color: #353738;
}

.sidebar_item .data-value[contenteditable="true"] {	
	width: 105%;
	min-height: 24px;
	margin-bottom: 10px;
	margin-top: 0;
	padding: 3px 3px 3px 10px;
	vertical-align: middle;
	border-radius: 4px;
	background: #eaf478;
	color: #353738;
}

.sidebar_item .half {	
	width: 42%;
}

.sidebar_item .left {	
	float: left;
	margin-right: 20px;
}


.sidebar_item .data-astronomical {
	width: 25%;
	color: white;
	float: left;
	text-align: center;
	text-shadow: 1px 1px black;
}

.sidebar_item .data-orometry-main {
	width: 25%;
	color: white;
	float: left;
	text-align: center;
	text-shadow: 1px 1px black;
}

.description-title {
	clear: left;
	margin: 10px 0 0 0;
	font-weight: bold;
	-webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
	-moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
	box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px; 
	border-radius: 4px;
	width: 400px;
	height: 24px;
	line-height: 24px;
	padding-left: 10px;
	background: #7bacb9;
	color: #353738;
}

figure.figure-left{
	float: left; 
	max-width: 350px;
	margin: 5px 5px 5px 0;
}

figure.figure-left p {
	line-height: 0;
	padding: 0;
}

figure.figure-left img  {
	max-width:100%;
	height:auto;
	border-radius: 12px;
	box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px; 
}

figure.figure-left figcaption {
	font-size: 75%; 
	text-align: center;
}

#map-container {
	float: left;
	width: 100%;
}

.map {
	width: 100%;
	height: 500px;
	border-radius: 10px; 
	margin: 10px 10px 20px 0;
	-webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
	-moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
	box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px; 
}

#nearest-mountains-title {
	float: left;
	width: 175px;
	height: 40px;
	line-height: 54px;	
}

#slider-radius{
	float: left;
}

#slider-radius .rs-range-color  {
    background: radial-gradient(ellipse at bottom, rgba(0, 0, 0, 1) 0%, rgba(48, 7, 36, 1) 34%, rgba(255, 255, 255, 1) 66%, rgba(0, 0, 0, 1) 100%);
}
#slider-radius .rs-path-color  {
    background: radial-gradient(ellipse at bottom, rgba(255, 255, 255, 1) 0%, rgba(169, 173, 174, 1) 34%, rgba(255, 255, 255, 1) 66%, rgba(5, 0, 0, 1) 100%);
}
#slider-radius .rs-handle  {
    background: radial-gradient(ellipse at center, rgba(228, 228, 228, 1) 0%, rgba(179, 179, 179, 1) 34%, rgb(102, 91, 98) 100%);
}
#slider-radius .rs-border  {
    border-color: #557881;
}

#slider-radius .rs-tooltip  {
    font-size: 10px;
}

#slider-radius .rs-bg-color  {
    background: #557881;
}

#popup-title {
	font-weight: bold;
	color: orange;
	
}

#popup-position {
	font-size: 10px;
	text-align: right;
}

#popup-link {
	text-align: right;
}

a img:hover {
	opacity: 0.7;
	transition: opacity 0 ease-in-out;
}

.tooltip-label {
	background: #f1f885;
}

article {
	margin-bottom: 20px;
}


.image-hidden {
	display: none;
}

.image-author {
	color: orange;
	font-weight: bold;

}

.image-date {
	color: green;
	font-weight: bold;
	text-align: right;
	cursor: pointer;
}

.image-date-no-editable {
	color: green;
	text-align: right;
}

.image-date:hover {
	color: #003300;
}

.image-data {
	width: 50%;
	float: left;
}

.image-controls {
	width: 45%;
	float: right;
	text-align: right;
}

.image-text {
	clear: both;
}

.image-opacity {
	opacity: 0.35;
}

.author {
	float: left;
	width: 100px;
}


.author-image {
	float: left;
	width: 80px;
}

.author-remove-button {	
	position: relative;
	right: 20px;
	float: left;
	opacity: 0.5;
}

.author-name {
	clear: both;
	width: 80px;
	font-size: 10px;
	color: grey;
	font-style: italic;
	margin-top: 5px;
	text-align: center;
}


.edition-data  {
	font-size: 12px;
	font-weight: bold;
	color: #648ec8;
}

#edit-button {
	margin-bottom: 10px;
	font-size: 150%;
}

#edition-blocked {
	float: right;
	width: 150px;
	color: #d83a63;
	font-weight: bold;
}

#creation-date, #modification-date {
	font-size: 12px;
	color: grey;
	margin-bottom: 10px;
}

#edition-data {
	width:  150px;
	text-align: right;
	float: right;
}

#utm-position {
	 text-transform: uppercase;
}

#description {
	clear: left;
	width: 100%;
	text-align: justify;
	font-size: 120%;
	padding-right: 2px;
}

#description img[style*="margin-right: auto"] {
	width: auto;
	height: auto;
	max-width: 100%;
}

#tracks{
	width: 100%;
	text-align: center;
	margin-top: 5px;
}

#tracks table{
	width: 100%;
}


#tracks table tr:first-child td:nth-child(3){
	width: 100px;
	font-size: 12px;
	color: orange;
}

#tracks table tr:nth-child(2) td:nth-child(2){
	width: 100px;
	font-size: 12px;
	color: orange;
}

#tracks table tr:nth-child(3) td:first-child {
	color: green;
}

#tracks table tr:nth-child(3) td:nth-child(2){
	width: 100px;
	font-size: 12px;
}

.adsense-aside-block {
	padding: 5px 5px 0 0;
	text-align: center;
}

.track {
    clear: both;
	width: 80%;
	height: auto;
	margin-top: 3px;
	padding: 0;
}

.track-user-image {
	width: 24px;
}

.track-hidden {
	display: none;
}

#show-more-tracks {
	margin-top: 5px;
}

#photogallery {
	clear: both;
	width: 100%;
}

#gallery {
	float: left;
	list-style-type: none;
}

#gallery li {
	float: left;
	margin: 2px;
}

#upload-images {
	float: left;
	width: 100%;
	text-align: right;
	margin: 0
	
}

#image-upload {
	display: none;
}

.image-in-progress {
	display: inline;
	width: 100px;
	height: 100px;
	border: 2px;
	text-align: center;
	border-radius: 4px;
	box-shadow: 2px 2px 5px #999;
}

.image-in-progress img {
	width: 100px;
	height: 100px;
	opacity: 0.25; 
}

ul#map-links{
	float: left;
	padding: 0;
	margin: 0;
	width: 100%;
	list-style-type: none;
}

ul#map-links li {
	float: left;
}

ul#map-links li:not(:last-child) {
	margin-right: 5px;
}

#climbed-wrapper {
	text-align: right;
	margin-top: 10px;
}

.dropzone {
	width: 100%;
	padding: 10px;
	text-align: left;
	background-color: rgba(153, 204, 255, 0.2);
	border-radius: 16px;
}

#upload-track {
	clear: both;
	width: 100%;
	text-align: right;
	margin-top: 5px;
}

#trackgallery {
	clear: both;
	width: 100%;
}

#track-example {
	width: 100%;
	text-align: center;
}
#track-example img {
	border-radius: 8px;
	box-shadow: 2px 2px 5px #999;	
}

#track-file {
	display: none;
}

#progress-bar {
	width: 0%;
	height: 8px;
	text-align: left;
	background: rgba( 10,30,200, 0.5);
	border-radius: 4px;
	margin: 4px;
}

#requeriment-list{
	list-style-type: square;
}

#commentgallery {
	float: left;
	clear: both;
	width: 100%;
}

ul#comments {
	list-style-type: none;
	padding: 0;
	margin-bottom: 100px;
	
}

li.comment-item {
	margin: 0 auto;
	width: 100%;
	max-width: 875px;
	display: block;
}

li.comment-item .comment-image-user img {
	width: 50px;
	border-radius: 4px;
	float: left;
}

li.comment-item .comment-user {
	font-size: 15px;
	color: #444;
	font-weight: 500px;
	float: left;
	display: block;
	margin: 0 0 10px 10px;
	width: 815px;
	width: calc( 100% - 60px);
}

li.comment-item .comment-date, .comment-date-deleted {
	color: grey;
	float: left;
	margin: 0 0 10px 10px;
	width: 250px;
}

li .comment-date-deleted {
	color: red;	
}

li.comment-item .comment-text {
	float: left;
	width: 815px;
	width: calc( 100% - 60px);
	min-height: 80px;
 	line-height: 1.7em;
	background: rgba( 200, 200, 200, .2);
	font-style: italic;
	color: #5a6c7b;
	border: 1px dashed #ccc;
	margin: 0 0 30px 60px;
	padding: 5px;
}

.comment-deleted {
	opacity: 0.5;
}

.comment-text img {
	width: auto;
	height: auto;
	max-width: 100%;
}

.comment-fix-image {
	margin-left: -10px;
	vertical-align: middle;
} 

li:last-child.comment-item .comment-text{
	margin-bottom: 50px;
} 

li.comment-item iframe {
	width: 100%;
	height: auto;
	min-height: 400px;
	text-align: center;
}

li.comment-item .comment-actions {
	float: left;
	width: 635px;
	width: calc( 100% - 310px);
	text-align: right;
	margin-top: -8px;
}

[contenteditable="true"] {
	border: 2px dashed #CCC;
	background-color: #e2e67f !important;
	padding: 7px;
}

[contenteditable="true"] p {
	color: black;
}

[contenteditable="false"] {
	border: none;
}

[contenteditable="false"]  p{
	color: black;
}

#change-regions {
	width: 260px;
	margin-bottom: 10px;
}

#country-selector {
	width: 340px;
}

#country {
	width: 160px;
}	

#region-selector {
	float: left;
	height: 180px;
	width: 160px;
	margin-top: 5px;
	overflow: auto;
	border: 1px dashed grey;
	background: #c9f8c4;
	cursor: pointer;
}

#region-selector ul {
	list-style-type: none;
	margin: 5px;
	padding: 0;
}

#region-selector li:hover {
	background: #99d394;
	font-weight: bold;
}

#region-controls {
	float: left;
	height: 120px;
	width: 40px;
	margin-top: 5px;
	text-align: center;
	padding-top: 60px;
}

#region-container {
	float: left;
	height: 180px;
	width: 160px;
	margin-top: 5px;
	border: 1px dashed grey;
	background: #f8f991;
	cursor: pointer;
}

#region-container li:hover{
	background: #c7c91b;
	font-weight: bold;
}

#region-container ul {
	list-style-type: none;
	margin: 5px;
	padding: 0;
}

#selected-regions-label{
	margin-left: 200px;
	text-align: left;
	color: #00708c;
	font-weight: bold;
}

#list-of-regions .ui-selected { background: #99d394; font-weight: bold; }
#selected-regions .ui-selected { background: #c7c91b; font-weight: bold; }

#region-controls button {
	width: 24px;
	height: 24px;
	color: blue;
	cursor: pointer;
}

[data-placeholder]:empty:not(:focus):before {
	font-size: 85%;
	color: #b80000;
	opacity: 0.5;
    content: attr( data-placeholder);
}

#catalogs {
	clear: both;
	height: 150px;
	width: 100%;
	margin: 10px 0 10px 0;
}

#catalogs h3{
	margin-bottom: 10px;
}

.catalog{
	float: left;
	margin: 0 10px 0 0;
}

.catalog-poster {
	width: 120px;
    -webkit-box-shadow: 4px 4px 2px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 4px 4px 2px 0px rgba(0,0,0,0.75);
	box-shadow: 4px 4px 2px 0px rgba(0,0,0,0.75);
}

.catalog-poster:hover {
	opacity: 0.5;
}

#user-list {
	margin-top: 10px;
}

table#users-list tr td:nth-child(2) {
	padding-left: 30px;
}


/**
 *	Main wrapper
 *	Map links + Map + Description
 *
 */

#main-wrapper {
	overflow: hidden;
	min-width: 300px;	
}

/**
 * Modals
 *
 */

#modal-upload-track-dialog {
	width: 480px;
	top: 5%;
}

/**
 *	Media queries
 *
 *	
 *
 */

 
@media (max-width: 1000px) { 

	#description {
		font-size: 100%;
	}

	.track {
		width: 100%;
	}	
 
}
  
@media (max-width: 800px) { 

	aside {
		display: inline-block;
		clear: both;
		float: none;
		margin: 0;
		width: 100%;
		max-width: 360px;
	}
	
	#main-wrapper {
		max-width: 100%;
	}

}

@media (max-width: 700px) {
	
	li.comment-item .comment-text {
		margin-left: 0;
		width: 100%;
	}
	
}

@media (max-width: 600px) { 
	
	#authors {
		zoom: 0.8;
	}
	
	ul#map-links li:not(:last-child) {
		zoom: 0.8;
	}
	
	#description {
		text-align: left;
	}

	.dropzone img {
		width: 60px;
	}
	
	.comment-item img.circle {
		width: 60px;
	}
		
	.track-image {
		vertical-align: top;
	}
	
	.track-image img{
		width: 50px;
	}

	#modal-upload-track-dialog {
		width: auto;
	}
	
}

@media (max-width: 500px) {
	
	#climbed-wrapper, #climb-button {
		clear: both;
		width: 100%;
	}
		
}

@media (max-width: 450px) { 

	li.comment-item .comment-actions {
		float: left;
		width: calc( 100% - 60px );
		text-align: right;
		margin: 0 0 10px 60px;
	}
	
}
