body{
		margin: 0;
		padding: 0;
		height: 100vh;
		overflow: hidden;
	}

	h1, h2, h3{
		font-family: 'Anton', sans-serif;
        padding-bottom: 20px;
        margin-bottom: 30px;
        border-bottom: 1px dotted #ccc;
        margin-top: 70px;
        color: #f00;
	}

    p{
        font-family: 'Maven Pro', sans-serif;
        color: #333;
        font-weight: 300;
        color: #565555;
        font-weight: 300;
        line-height: 24px;
    }

	#map { 
    width: 100%;
    height: 100vh;
    position: relative;
 	}

 .ventana{
    position: absolute;
    top: 0;
    right: -460px;
    z-index: 1000;
    background: #fff;
    padding: 30px;
    width: 400px;
    height: 100vh;
   	-webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+11,ffffff+100&0.81+0,0.95+11,1+100 */
background: -moz-linear-gradient(left,  rgba(255,255,255,0.81) 0%, rgba(255,255,255,0.95) 11%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(255,255,255,0.81) 0%,rgba(255,255,255,0.95) 11%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(255,255,255,0.81) 0%,rgba(255,255,255,0.95) 11%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cfffffff', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */

}

h1.title{
    position: absolute;
    z-index: 1010;
    text-transform: uppercase;
    padding-left: 50px;
    font-size: 50px;
    width: 400px;
    line-height: 50px;
    top: 35%;
    color: #0f4069;
    transform: translateY(-50%);
}

h1.title span{
    display: block;
    font-size: 37.5px;
        color: #ecf0f1;
    letter-spacing: 2px;
}

.ventana-open{
	right: 0;
}

.zona{
	color:#f49630!important;

}

.triangulo {
    width: 100vh;
    height: 100vh;
    display: block;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg) translate(-50%, -50%);
    transform: rotate(45deg) translate(-50%, -50%);
    position: absolute;
    top: 70%;
    right: 71%;
    background: rgba(38, 127, 202, 0.65);
    z-index: 1001;
}

.triangulo.logo{
    top: 155%;
    left: 68%;
    background: #0f4069!important;
}

.ventana h1{
    color: #2b82cb;
    text-transform: uppercase;
    letter-spacing: 1px;
        margin-top: 0!important;
}

.ventana h1:after{
	font: normal normal normal 38px FontAwesome;
	    content: "\f041";
	    float: right;
}

.etiqueta{
    margin-top: 100px;
    display: block;
    font-family: 'Maven Pro', sans-serif;
    font-weight: bold;
    color: #333!important;
}

#icono-principal{
	display: block;
	margin-bottom: 30px;
}

.leaflet-popup-content-wrapper, .leaflet-popup-tip{
	    background: #0f4069!important;
	    padding: 20px 30px;
	    color: #fff;
}

.leaflet-popup-content-wrapper p, .leaflet-popup-tip p{
	    color: #fff!important;
	    text-decoration: none;
	    font-size: 18px;
}

.leaflet-container a.leaflet-popup-close-button{
	display: none!important;
}


/*
Author: L. Voogdt
License: MIT
Version: 1.0
*/

/* Marker setup */
.awesome-marker {
  background: url('../img/markers-soft.png') no-repeat 0 0;
  width: 35px;
  height: 46px;
  position:absolute;
  left:0;
  top:0;
  display: block;
  text-align: center;
}

.awesome-marker-shadow {
  background: url('../img/markers-shadow.png') no-repeat 0 0;
  width: 36px;
  height: 16px;
}

/* Retina displays */
@media (min--moz-device-pixel-ratio: 1.5),(-o-min-device-pixel-ratio: 3/2),
(-webkit-min-device-pixel-ratio: 1.5),(min-device-pixel-ratio: 1.5),(min-resolution: 1.5dppx) {
 .awesome-marker {
  background-image: url('../img/markers-soft@2x.png');
  background-size: 720px 46px;
 }
 .awesome-marker-shadow {
  background-image: url('../img/markers-shadow@2x.png');
  background-size: 35px 16px;
 }
}

.awesome-marker i {
  color: #333;
  margin-top: 10px;
  display: inline-block;
  font-size: 14px;
}

.awesome-marker .icon-white {
  color: #fff;
}

/* Colors */
.awesome-marker-icon-red {
  background-position: 0 0;
}

.awesome-marker-icon-darkred {
  background-position: -180px 0;
}

.awesome-marker-icon-lightred {
  background-position: -360px 0;
}

.awesome-marker-icon-orange {
  background-position: -36px 0;
}

.awesome-marker-icon-beige {
  background-position: -396px 0;
}

.awesome-marker-icon-green {
  background-position: -72px 0;
}

.awesome-marker-icon-darkgreen {
  background-position: -252px 0;
}

.awesome-marker-icon-lightgreen {
  background-position: -432px 0;
}

.awesome-marker-icon-blue {
  background-position: -108px 0;
}

.awesome-marker-icon-darkblue {
  background-position: -216px 0;
}

.awesome-marker-icon-lightblue {
  background-position: -468px 0;
}

.awesome-marker-icon-purple {
  background-position: -144px 0;
}

.awesome-marker-icon-darkpurple {
  background-position: -288px 0;
}

.awesome-marker-icon-pink {
  background-position: -504px 0;
}

.awesome-marker-icon-cadetblue {
  background-position: -324px 0;
}

.awesome-marker-icon-white {
  background-position: -574px 0;
}

.awesome-marker-icon-gray {
  background-position: -648px 0;
}

.awesome-marker-icon-lightgray {
  background-position: -612px 0;
}

.awesome-marker-icon-black {
  background-position: -682px 0;
}

#controles{
    width: 150px;
    position: absolute;
    z-index: 1002;
    top: 20px;
    left: 20px;
}

#controles .leaflet-control-layers {
    box-shadow: none!important; 
    background: none!important;
    border-radius: 0!important;
        position: relative;
    z-index: 2;
}

#controles .leaflet-control-layers .leaflet-control-layers-list{
	background: #0f4069!important;
    padding: 20px;
    color: #fff;
    font-family: 'Maven Pro', sans-serif;

}
.lista{
	padding-left: 20px;
	display: block;
}

.convenciones{
    border-top: 1px dotted #ccc;
    margin-top: 60px;
}

.convenciones p{
    font-size: 12px;
    display: block;
}

#controles:after{
    content: " ";
    width: 0;
    height: 0;
    border-top: 100px solid #0f4069;
    border-right: 100px solid transparent;
    position: absolute;
    top: 0;
    z-index: 1;
}

#controles .leaflet-control-layers-toggle {
    width: 36px;
    height: 36px;
    margin-top: 10px;
    margin-left: 10px;
}

#logo{
    position: absolute;
    bottom: 40px;
    right: 40px;
    z-index: 1005;
    /* width: 100px; */
}

.link{
    font-size: 15px;
    font-family: 'Maven Pro', sans-serif;
    text-decoration: none;
    background: #f49630;
    color: #0f4069;
    padding: 10px 20px;
}

.contet-ventana{
  height: 100vh;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
      overflow-x: hidden;
      display: none;
}

.block{
  display: block;
}

@media (max-width: 700px) { 
  h1.title{
    background: #0f4069;
    position: relative;
    text-transform: uppercase;
    padding-left: 0px;
    padding: 20px;
    font-size: 18px;
    max-width: calc(100% - 40px);
    line-height: 22px;
    top: 0!important;
    color: #fff;
    transform: none!important;
    margin-bottom: 0;
    margin-top: 0;
    text-align: center;
}

#controles{
  display: none;
 }

 .triangulo.logo, .triangulo{
  display: none!important;
 }

 #logo{
      position: relative;
    background: #0f4069;
    bottom: 0;
    text-align: center;
    padding: 8px 20px;
    width: 100%;
 }

  #logo img{
width: 80px!important;
    margin-left: 20px;
  }

  h1.title span {
    display: inline!important;
    font-size: 18px;
    color: #ecf0f1;
    max-width: calc(100% - 40px);
    letter-spacing: 2px;
}

#icono-principal {
    display: block;
    margin-bottom: 30px;
    width: 76px;
    margin: 0 auto 21px;
}

.link {
    font-size: 12px;
    font-family: 'Maven Pro', sans-serif;
    text-decoration: none;
    background: #f49630;
    color: #0f4069;
    padding: 10px 20px;
    display: inline-block;
    margin-top: 20px;
}

.contet-ventana{
position: fixed!important;
top: 0;
left: 0;
width: 100%;
height: 100vh;
z-index: 2000;
}

.ventana {
    background: rgba(255, 255, 255, 0.99)!important;
    width: calc(100% - 60px);
}

}