/* css RESET
 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  font-size:100%;
  font:inherit;
  vertical-align:baseline;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display:block;
}
body {
  line-height:1;
}
ol, ul {
  list-style:none;
}
blockquote, q {
  quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content:'';
  content:none;
}
table {
  border-collapse:collapse;
  border-spacing:0;
}



/* Typography & Base styles
*/
body,
input,
textarea {
  font:14px/21px 'Droid Sans', sans-serif;
  color: #0d5ca8;
  -webkit-font-smoothing:antialiased;
}
em{
  font-weight: bold;
}
pre,
code { font:normal 12px/20px monospace; }

h1, h2, h3, h4, h5, h6 {
  margin:0 0 10px 0;
}
p{
  color: #0d5ca8;
}

p { margin-bottom:20px;}
strong { font-weight:bold; }
a, a:link, a:visited, a:active{
  color: #0d5ca8;
  text-decoration:underline;
}
a:hover{
  color: #2c91f3;
}
/* General styles
*/
.element-invisible {
  /* For hiding elements but keeping them indexable */
  position: absolute !important;
  height: 1px; width: 1px; 
  overflow: hidden;
  clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
  clip: rect(1px, 1px, 1px, 1px);
}
/* Clearfix */

.clearfix:after {
 visibility: hidden;
 display: block;
 font-size: 0;
 content: " ";
 clear: both;
 height: 0;
}
.clearfix { display: inline-block; }

/* CloseIcon in detail view
*/
.closeWindow{
  position: absolute;
  right: 3px;
  top: 7px;
  width:20px;
  color: rgb(68, 68, 68);
  cursor:pointer; z-index: -1;
  font-size:16px;
}
.closeWindow:link, .closeWindow:active, .closeWindow:visited{
  text-decoration: none;
} 
.closeWindow:hover{
  color: #2c91f3;
}

/* Intro sidebar with project description
*/
/* Main branding title
*/
h1 {
  background:url(../img/disponibleEnCordoba.png) top center no-repeat;
  background-size: contain;
  width: 290px;
  height: 70px;
  box-sizing:border-box;
  -moz-box-sizing:border-box; /* Firefox */
  -webkit-box-sizing:border-box; /* Safari */
  font-family: 'ColaborativaSemibold';
  line-height: 2.0em;
  font-size: 1.8em;
  margin-bottom: 0px;
  margin-left: -10px;
  padding: 5px 0 5px 5px;
  color: #0d5ca8;
  z-index: 1000;
}
/* Subtitle
*/
h2 {
  color: #0d5ca8;
  line-height:1.5em;
  font-size:1.2em;
  font-family: 'Droid Sans', sans-serif;
  padding-bottom: 25px;
  margin-bottom: 0px;
}
.footer{
  margin-top: 20px;
  font-size:0.9em;
  line-height: 1.3em;
}


/* Marker POPUP
*/

.marker-popup::before {
  border-top-color: #999!important;
  border-width: 16px!important;
  margin-left: -16px!important;
}
.marker-popup{
  border: none!important;
  border-radius: 8px!important;
  background: #FFFFFF!important;
  -moz-box-shadow:    0px 0px 2px 0 rgba(0,0,0,0.50)!important;
  -webkit-box-shadow: 0px 0px 2px 0 rgba(0,0,0,0.50)!important;
  box-shadow:         0px 0px 2px 0 rgba(0,0,0,0.50)!important;
  width: 320px!important;
}
.marker-popup h2{
  color: #0d5ca8;
  line-height:1.4em;
  font-size:1.2em;
  font-family: 'Droid Sans', sans-serif;
  padding-bottom: 5px;
  margin-bottom: 0px;
}
.marker-popup h3{
  color: #0d5ca8;
  line-height:1.4em;
  font-size:1em;
  font-family: 'Droid Sans', sans-serif;
  -webkit-font-smoothing:antialiased;
  padding-bottom: 0px;
  margin-bottom: 0px;
}

/* Layout 
*/
body > div {
  position:relative;
  z-index:1;
}
.map {
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  left:340px;
  height:100vh;
  z-index:0;
}
a.zoomer {
  position: absolute;
  top: 10px;
}
.left #header .limiter {
  width:480px;
}
.left #content,  .left #contentDetail{
  left:0;
  right:auto;
  border-left:none;
  border-right:1px solid #ccc;
}
.left .wax-attribution {
  left:320px;
}
.left a.zoomin {
  left:39px;
}
.left a.zoomout {
  left:10px;
}
#content, #contentDetail {
  position:absolute;
  top:0px;
  right:0;
  bottom:0;
  width:279px;
  background:rgb(250,250,250);
  border-left:1px solid #ccc;
  overflow-x:hidden;
  overflow-y:auto;
  padding:30px;
  background-image:url(../img/background-2.png) repeat;
  -moz-box-shadow: 5px 0px 10px rgba(0,0,0,0.1);
  -webkit-box-shadow: 5px 0px 10px rgba(0,0,0,0.1);
  box-shadow: 5px 0px 10px rgba(0,0,0,0.1);
}
#contentDetail.activo{
  display: block;
}
#contentDetail.inactivo{
  display: none;
}
#contentDetail h2{
  padding-bottom: 5px;
}
#contentDetail .imagen img{
  width: 100%;
  margin-top: 3px;
  margin-bottom: 20px;
  border: 1px solid #4B7CAB;
}
.section {
  width: 249px;
  background: #B6CEE5;
  border-radius: 5px;
  -moz-border-radius: 5px;
  padding: 15px;
}

/* Formulario de entrada DESACTIVADO
*/

form.geocode input[type=text] {
  color: #0d5ca8;
  height: 20px;
  display: block;
  border: 1px solid #4B7CAB;
  padding: 5px;
  float: left;
  width: 185px;
  margin: 0px 5px;
  line-height: 12px;
}
form.geocode input[type=submit] {
  background:url(../img/map.png) no-repeat -121px -0px #fff;
  text-indent:-9999px;
  width:32px;
  height:32px;
  display:block;
  border:1px solid  #4B7CAB;
  border-radius:3px;
  -moz-border-radius:3px;
  -webkit-border-radius:3px;
  box-shadow:rgba(0,0,0,0.1) 0px 1px 3px;
  -moz-box-shadow:rgba(0,0,0,0.1) 0px 1px 3px;
  -webkit-box-shadow:rgba(0,0,0,0.1) 0px 1px 3px;
  margin: 0px 5px;
  padding:11px;
  float:left;
}
form.geocode input[type=submit]:active {
  border-color:#4B7CAB;
  background-color:#ddd;
  box-shadow:inset rgba(0,0,0,0.1) 0px 1px 3px;
  -moz-box-shadow:inset rgba(0,0,0,0.1) 0px 1px 3px;
  -webkit-box-shadow:inset rgba(0,0,0,0.1) 0px 1px 3px;
}
form.geocode.loading input[type=submit] {
  background:url(../img/ajax-loader.gif) no-repeat 50% 50%;
  border-color:#4B7CAB;
  background-color:#ddd;
  box-shadow:inset rgba(0,0,0,0.1) 0px 1px 3px;
  -moz-box-shadow:inset rgba(0,0,0,0.1) 0px 1px 3px;
  -webkit-box-shadow:inset rgba(0,0,0,0.1) 0px 1px 3px;
}
#geocode-error {
  display:none;
  position:relative;
  top:1em;
  clear:both;
  color:#a21a1a;
  font-size:11px;
}

/* Animation */

.map-tile-loaded {
  -webkit-animation-name:fade-in;
  -moz-animation-name:fade-in;
  -ms-animation-name:fade-in;
  -o-animation-name:fade-in;
  -webkit-animation-timing-function:linear;
  -moz-animation-timing-function:linear;
  -ms-animation-timing-function:linear;
  -o-animation-timing-function:linear;
  -webkit-animation-duration:0.2s;
  -moz-animation-duration:0.2s;
  -ms-animation-duration:0.2s;
  -o-animation-duration:0.2s;
}

@-webkit-keyframes fade-in { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fade-in { from { opacity:0; } to { opacity:1; } }
@-ms-keyframes fade-in { from { opacity:0; } to { opacity:1; } }
@-o-keyframes fade-in { from { opacity:0; } to { opacity:1; } }



/* touch tweaks */

* {
  /* prevent callout when holding tap on links (the native dialog that comes up) */
  -webkit-touch-callout:none;

  /* make transparent link selection, adjust last value opacity 0 to 1.0 */
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  }

@media only screen and (max-device-width: 480px) {
  .map {
      bottom:auto !important;
      height:200px !important;
    }
  #content {
    border-left:0 !important;
    border-top:1px solid #ccc;
    top:200px !important;
    overflow-y:visible !important;
    }

  }
