/* 
    Document   : toolbar
    Created on : 9/04/2013, 11:54:54 AM
    Author     : dacevedo
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/
/*contenedor global*/
body{
  margin: 0px;
  padding: 0px;
  font-family: Verdana, Helvetica;
}


/* Contenedor del menu izquierdo */
#menuMetadatos {
  float:right;
  width:300px;;
  height: 100%;
}
/*div que se situa en el centro y contiene unas ligas */
#menuShared{
  float:left;
  height: 100%;
}

.options{
  width: 120px;
  display: inline-block;
  float: left;
  height: 25px;
}

.action_menu:hover{
  cursor: pointer;
  background-color: #325594;
}

.tool-options{
  color: white;
  padding-left: 10px;
}
/*contenedor de los acordeones */
#contMetadatos{
  width: 100%;
  right: 0px;
  height: 40px;
  position: absolute;
  float: left;
  padding: 0px;
  font-family: Verdana, Helvetica;
  z-index: 1000;
  bottom: 0px;
  background-color: white;
}
/*Es el contenedor principal contiene a los divs menulayers, menumetadatos,menushared*/
#tool-bar{
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 25px;
  background-color: #002B7A;
}
/*Contenedor general contiene un boton para el toggle */
#menuLayers{
  /*  float: right;
    width: 300px;
    height: 100%;*/
  display: none;
}

/*Contenedor general, que contiene capas base, busqueda y listado de capas */
#cont_capas{
  /*    height: 850px;*/
  /*  max-height: 850px;*/
  /*    overflow: auto;*/

  /*  height:100%;
    width: 25%;
    top: 25px;
    position: absolute;
    z-index: 1;*/
}
/*Contenedor de las capas base */
/*#capas_base {
  background: #F4ABF2;
  height:200px;
  width: 100%;

}
contenedor del buoton buscar y el input
#buscar{
  background:aquamarine;
  height:50px;
  width: 100%;
}
 Contiene el listado de las listas que se cargan
#res_busqueda{
  background:brown;
  height:500px;
  width: 100%;
}*/
/*
Aplica un tamaño específico a cada una de las imagenes de la barra.
*/
.img-menu{
  width: 20px;
  height: 18px;
  margin-right: 5px;
  margin-top: 4px;
}
/*
Aplica tamaño específico a las flechas de despliegue.
*/
.arow-up, .arow-down{
  width: 35px;
  height: 25px;
}

.text{
  margin-top: 2px;
  position: absolute;
  text-decoration: underline;
}

#img-metadata{
  width: 20px;
  height: 22px;
  margin-right: 5px;
}

.select-dialog-wms{
  height: 240px;
  width: auto;
  overflow: auto;
}

#shared{
  display: none;

}


.list-add{
  height: 15px;
}

abbr{
  border-bottom: 0px solid white;
}


.carita{
  float: right;
  padding-right: 10px;
}

.mouseOver{
  width: 120px;
  display: inline-block;
  float: left;
  height:25px;
  cursor: pointer;
  background-color: #325594;
}
#buscador_filter{
  border: none;
  width: 100%;
  height: 50px;
  position: relative;
  float: left;
  border-bottom: 1px solid #bbb;
  z-index: 1000;
  background-color: white;
}
#slidebanner{
  position: relative;
  top: 160px;
  float: right;
  /*    right: -300px;*/
  z-index: 1;
}
#zoomin{
  margin-top: 10px;
  background-color: black;
  margin-bottom: 0px;
  width: 40px;
  height: 40px;
  /*    border-bottom-right-radius: 5px;
      border-bottom-left-radius: 5px;*/
  /*    border-top-right-radius: 5px;*/
  border-top-left-radius: 5px;
  opacity: 0.5;
  cursor: pointer;
  background-image: url("../../img/imagesMenu/zoomin.png");
}
#zoomout{
  background-color: black;
  /*    margin-bottom: 10px;*/
  width: 40px;
  height: 40px;
  /*    border-bottom-right-radius: 5px;*/
  border-bottom-left-radius: 5px;
  /*    border-top-right-radius: 5px;
      border-top-left-radius: 5px;*/
  opacity: 0.5;
  cursor: pointer;
  background-image: url("../../img/imagesMenu/zoomout.png");
}
#base_layers{
  background-color: black;
  margin-top: 10px;
  width: 40px;
  height: 40px;
  /*    border-bottom-right-radius: 5px;*/
  border-bottom-left-radius: 5px;
  /*    border-top-right-radius: 5px;*/
  border-top-left-radius: 5px;
  opacity: 0.5;
  cursor: pointer;
  background-image: url("../../img/imagesMenu/baselayers.png");
}
#catalog_layers{
  background-color: black;
  margin-top: 10px;
  width: 40px;
  height: 40px;
  /*    border-bottom-right-radius: 5px;*/
  border-bottom-left-radius: 5px;
  /*    border-top-right-radius: 5px;*/
  border-top-left-radius: 5px;
  opacity: 0.5;
  cursor: pointer;
  background-image: url("../../img/imagesMenu/availablelayers.png");
}
.open-street{
  border: 2px solid white;
  background-image: url("../../img/imagesMenu/ostreet.png");
  background-repeat: no-repeat;
}
.google-streets{
  border: 2px solid white;
  background-image: url('../../img/imagesMenu/gc.png');
  background-repeat: no-repeat;
}
.google-phisical{
  border: 2px solid white;
  background-image: url('../../img/imagesMenu/gf.png');
  background-repeat: no-repeat;
}
.google-satellite{
  border: 2px solid white;
  background-image: url('../../img/imagesMenu/gs.png');
  background-repeat: no-repeat;
}
.google-hybrid{
  border: 2px solid white;
  background-image: url('../../img/imagesMenu/gh.png');
  background-repeat: no-repeat;
}

.mapbox-basic{
  border: 2px solid white;
  background-image: url('../../img/imagesMenu/mbbasico.png');
  background-repeat: no-repeat;
}
.mapbox-terrain{
  border: 2px solid white;
  background-image: url('../../img/imagesMenu/mbterreno.png');
  background-repeat: no-repeat;
}
.mapbox-satellite{
  border: 2px solid white;
  background-image: url('../../img/imagesMenu/mbsatelite.png');
  background-repeat: no-repeat;
}
.pushed{
  background-color: #F66A0B;
}

.card_type_title {
  color: #fff;
  display: inline-block;
  /** font-weight: bold;**/
  font-family: Verdana,Arial,Helvetica,serif;
  font-size: 16px;
  padding: 10px 0 5px 4.5px; /*para mozilla ,chrome, explorer 5*/
  position: absolute;
}
.inputs-wrapper{
  position: absolute;
  left: 20px;
  right: 20px;
  top:12px;
  /*  height: 30px;*/
}

#filter{
  border-top: 1px solid #DDD;
  border-right: 1px solid #DDD;
  border-bottom: 1px solid #DDD;
  border-left: none;
  outline:0;
  height:20px;
  width: 100%;
  /*  box-shadow: 0 2px 2px #BBB;*/
  position: relative;
  float: left;
}
#input-container{
  position: absolute;
  left: 20px;
  right: 0px;
}
#search-icon{
  background-image: url("../../img/search.png");
  background-repeat:no-repeat;
  background-position: 50% 50%;
  position: relative;
  float: left;
  height: 22px;
  width: 20px;
  border-bottom:1px solid #DDD;
  border-left:1px solid #DDD;
  border-top:1px solid #DDD;
  border-right:none;
}
#buscador{
  background-color: #f66a0b;
  border: 0px solid #f66a0b;
  color: white;
  height: 24px;
  width: 28%;
  box-shadow: 0 2px 2px #BBB;
}

#buscador:hover{
  background-color: #F6470B;
  box-shadow: 0 2px 6px #999;
}
/*menu izquierdo: historial del mapa*/
#mstack{
  width: 235px;
  position: absolute;
  top: 95px;
  margin-left: 135px;
  margin-top: 30px;
  box-shadow: 1px 1px 20px #818585;
  height: 30px;
  background-color: #f66a0b;
}
#menustack {
  width: 235px;
  background-color:#F66A0B;
  height:35px;
  z-index: 1000;
  /*  border-top-right-radius: 5px;*/
  /*  opacity: 0.5;*/

}

.menustackp {
  width: 235px;
  color:white;
  background-color: rgba(0, 0, 0, 0.3);
  height:35px;
  z-index: 1000;
  border-top-right-radius: 5px;
  animation: parpadeo .5s;
  -webkit-animation: parpadeo .5s;
  -moz-animation: parpadeo .5s;
  animation-iteration-count:infinite;
  -webkit-animation-iteration-count:infinite;
  -moz-animation-iteration-count:infinite;

}

@keyframes parpadeo {
  0% {background-color: black}
100%{background-color:#f66a0b }
}

@-webkit-keyframes parpadeo {
  0% {background-color: black}
100%{background-color: #f66a0b}
}

#column_name{
  width: 205px;
  position: absolute;
  color: white;
  font-family: Arial!important;
  font-size:small;
  margin-top: 10px;
  margin-left: 5px;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.button-text{
  
  padding-top: 4px;
}

.seestack {
  width: 234px;
  background-color:white;
  height:auto;
  /*  cursor: pointer;*/
  /*  display: none;*/
  z-index: 1000;
  overflow: visible;
}

.seestackscrool{
  width: 235px;
  background-color:white;
  max-height: 240px;
  border-bottom-right-radius: 5px;
  /*  cursor: pointer;*/
  display: none;
  z-index: 1000;
  overflow:auto;
  overflow-x: hidden;
}

#menustack a {
  float: right;
  background-image: url("../../img/imagesMenu/flecha.png");
  background-repeat:no-repeat;
  width: 24px;
  height: 24px;
  margin-top: 5px;
  margin-right: 5px;
  /*  padding: 5px 5px 5px 5px;*/
}

#seestack h2{
  color: #444;
  font-size:small;
  margin-top: 7px;
  /*  text-align: center;*/
  font-weight: normal;
}

.class-meta-active-column:hover{

  /*  background-color:#F66A0B;
    opacity:.9;*/
}

/*#layername{
  overflow:hidden;
}*/

#ghost{

  position: absolute;
  /*          top:400px;*/
  /*          right: 600px;*/
  /*          left: 1000px;*/
  width: 235px;
  height: 35px;
  background-color:#F66A0B;
  opacity:0.5;
  -webkit-transform-origin: right center;
  -webkit-transform-style: preserve-3d;
  -webkit-transform-transition: -webkit-transform 0.5s ease-in-out;
  z-index: 1099;

}



.metadato-dialog{
  height: 100%;
  width: 100%;
  z-index: 10;
 position: absolute;
  background: black;
  opacity: 0.7;
  z-index: 100;
/* display: none;*/
}

#navpda{
  width:150px;
  height: 300px;
  position: absolute;
  height: 30px;
  padding-top: 15px;
/*  padding-left: 45px;*/
  font-family: Arial!important;
  font-size:small;
  z-index: 1;

}

#canvas_s_sh {
  border: 1px solid #222;
  margin: 10px;
  width: 200px;
}

#report-error {
    background:  black url(../../img/report_problem.svg) no-repeat center center;
  background-position-x: 8px;
  -ms-background-position-x: 8px;
  -moz-background-position-x: 8px;
  -o-background-position-x: 8px;
  -webkit-background-position-x: 8px;
  background-position-y: 7px;
  -ms-background-position-y: 7px;
  -moz-background-position-y: 7px;
  -o-background-position-y: 7px;
  -webkit-background-position-y: 7px;
  border-radius: 5px 0 0 5px;
  cursor: pointer;
  height: 40px;
  opacity: 0.5;
  right: 0;
  width: 40px;
  z-index: 2;
  position: absolute;
  bottom: 0px;
}

#report-error:hover {
  opacity: 1;
}

#screenshot {
  display: none;
}