:root {
    --color-secund: #1ca9da;
    --color-secund-osc: #7cb7cc;
    --color-secund-semi: #1ca9da55;
    --fondoEncab: #4e5e69;
}

/* ___________ GENERAL */

.web * {
 font-family:'Poppins';
}

body.fondoAzulOscuro{
 background:#504f4f;
}

.web .df{
 display:inline-flex;
 width:100%;
}

.imgResp{
 background-size:cover;
 background-position:center ;
}

 
.imgCircular{
  border-radius:50%;
}

.well {
    background-color: whitesmoke !important; /*sobreescribo bootstrap, demasiado blanco*/
}

.web #imgFondo{
 
 position:fixed;
 left:0;
 top:0;
 width:100vw;
 height:100vh;
 background-image: url('../img/6-25.jpg');
 background-size:cover;
 background-position:center ;
 filter:opacity( 0.1 );
 z-index: -50;
}

h1{
	width:100%;
	text-align:center;
	color:white;
	padding-top:50px;
	z-index:1000;
	font-size:30px;
	color: var(--color-secund);
}



/* ___________ ENCABEZADO */

.web #encabezadoweb{
 background-color: var(--fondoEncab); /*gris logo*/
 height:60px;
 box-shadow: 2px 2px 5px 0px lightgrey;
 position: fixed;
 z-index: 13; /* ojo, mayor al filtros sticky */
 top: 0;
 left: 0;
 width: 100vw;
 /* overflow: hidden; */
}


.web #encabezadoweb #logo{
 height:60px;
 float:left;
}

.web #encabezadoweb #menuHoriz {
 float: right;
 display:inline-flex;
}

.web #encabezadoweb a{
 text-decoration:none;
 color:#e2dada;
}

.web #encabezadoweb .contItem {
 padding: 20px 20px 0px 20px;
 height:60px;
 font-family:Poppins;
 transition: all .5s ease;
}

.web #encabezadoweb #menuHoriz .contItem {
 border-bottom:8px var(--fondoEncab) solid;
}


.web #encabezadoweb #menuHoriz .contItem:hover {
 padding-top: 25px;
 border-bottom:8px var(--color-secund-semi) solid;
}


.web #encabezadoweb #menuHoriz .contItem.activo {
 font-weight:bold;
 border-bottom:8px var(--color-secund) solid;
}






/* _____________ ENCAB: MENU MOBILE */
.web #menuHamb{
	float:right;
	color:white;
	font-size:30px;
	
}

.web #menuMobile {
	position:absolute;
	top:0;
	right:0;
	width:100vw;
	height:100vh;
	background:black;
	display:flex;
	flex-direction:column;
}

.web #menuMobile div {
	width:100%;
	text-align:center;
	border-bottom:none !important;
	color:lightgray;
	flex:1;
}

.web #menuMobile .fa-times{
	font-size:30px;
	margin:30px;
}

.web #encabezadoweb #menuMobile .contItem.activo {
 font-weight:bold;
 border-left:8px var(--color-secund) solid;
}

.web #encabezadoweb #menuMobile .contItem:hover a {
  color:  var(--color-secund); !important;
}

.web #encabezadoweb #menuMobile .contItem {
 border-left:8px var(--fondoEncab) solid;
}


/* ________________ TIT, SLIDER Y MAPA */

.web .tituloInm{
 margin-top:20px;
 color:  var(--color-secund);
 font-size:24px;
}

.web #slider{
 height: 600px; /* 500 + 100 */
}

.web #mapa{
 height: 600px;
}

.web #mapa iframe{
 width: 100%; 
 height: 100%; 
}

.web #slider .imgMini {
 height:100px !important;
}

.web #wellSliderMapa{
 display:flex;
}


/* ________________ descr y precio */


.web .titSeccion{
 font-weight:bold;
 color: var(--color-secund-osc);
 font-size:16px;
 border-bottom: 1px lightgray solid;
}

.web #contDescripcion {
 height:200px;
 overflow: hidden;
 text-overflow: ellipsis;    
 transition: all .5s ease;
}



.web #descripcion br {
 content: "-" !important;
 display: block !important;
 margin-bottom: 1em !important;
}

.web .precio{
 font-weight:bold;
 color:black;
 font-size:24px;
}


/* ________________ detalles */

.web .divDetallesDerecha {
 overflow:auto;
 max-height:600px;
}

.web .divDetallesDerecha .detalle {
 margin-bottom:20px;
 width: 100%;
 padding: 0;
 display: inline-flex;
}

.web .divDetallesDerecha .contTextoDetalle{
 margin-top:3px;
 flex: 100%;
 position:relative;
}

.web .detalle :is(svg,img){
 color: var(--color-secund);
 fill:var(--color-secund);
 stroke:var(--color-secund-osc);
 height: 30px;
 vertical-align:
 bottom;
}

.web .detalle .contIcono{
 flex: 80px;
 position:
 relative;
 text-align: center;
}

.web .divDetallesDerecha .detalle .dentroIcono {
 position:absolute;
 left:25px;
 top:7px;
 font-size:12px;
 color:var(--color-secund);
 font-weight:bold;
 text-align:center;
}

.web .detalle .dentroIcono {
 color:var(--color-secund);
}

.divDetallesDerecha .subtit {
	border-bottom:1px gray solid;
	text-align:center;
	font-size: 10px;
	text-transform:uppercase;
	padding-top:20px;
}

.web .detalle .valor {
 font-weight: bold;
 color:black;
}


.web .detalle :is(.pre-valor, .post-valor){
 color:gray;
}


.web .divDetallesDerecha .obs {
 color: var(--color-secund-osc);
 font-size:10px;
 padding-top:0;
 position:absolute;
 left:0px;
 bottom:-5px;
 height:14px;
 overflow:hidden;
 text-overflow:ellipsis;
 /* text-shadow: 1px 1px 1px #00000082; */
}



/* ________________ CONTACTO (DPGINPUT) */

.web .dpgInput {
 position:relative;
 margin:30px 5px;
 
}

.web .dpgInput span{
 position:absolute;
 left:10px;
 top:10px;
 font-size:15px;
 color:lightgray;
 transition:all .5s ease;
 pointer-events: none; /*no es clickable*/
}

.web .dpgInput.conValor span{
 top:-13px;
 left:0;
 font-size:10px;
 color: var(--color-secund);						
}

.web .dpgInput :is(input,textarea):focus + span{
 top:-13px !important;
 left:0;
 font-size:10px;
}

.web .dpgInput input {
 height:40px;
}

.web .df button {
 flex:50%;
 height:70px;
}

.web .df button :is(svg,i) {
 margin-right:5px;
 font-size:24px;
 }

.web #mapa{
 height:300px;
}

.web .fotoVendedor{
 height:50px;
 width:50px;
}

.web .centrado {
	margin:auto;
}

.web .centraCont {
	text-align:center;
}

.web .imgResp{
 background-size:cover;
 background-position:center ;
}

.web .imgCircular{
  border-radius:50%;
}

.web .nombreContacto {
  font-weight:bold;
}

.web .infoContacto {
 font-size:12px !important;
 margin-bottom:5px;
}

.web .infoContacto :is(i,svg) {
 margin-right:10px;
 color:#b4b4b4;
 font-size:16px;
}


.web #wellCompartir .btn{
 font-size:11px;
}

.web #wellCompartir button:nth-child(2) :is(i,svg) {
 color:#7171e6 !important;
 font-size:19px;
}

.web #wellCompartir button:nth-child(3) :is(i,svg){
color:#7e8f74 !important;
 font-size:19px;
}

.web .btn-default {
 background-color:#ebebeb !important;
 box-shadow: #858585 2px 2px 2px 0px;
 transition:all .2s ease;
}

.web .btn-default:hover {
 background-color:#d6d6d6 !important;
 box-shadow: #858585 0px 0px 2px 0px;
}




/* NOSOTROS */

#nosotros .row {
 margin-top:60px;
}

#nosotros .imgResp {
 width: 80%;
 height: 300px;
 z-index: 99;
 border: 4px white solid;
 perspective: 20px;
 margin:auto;

 box-shadow: black 10px 9px 12px 6px; 
}

#nosotros #img1{
 transform: perspective(50em) rotateY(10deg) rotateX(4deg);
}

#nosotros #img2{
 transform: perspective(50em) rotateY(-10deg) rotateX(4deg);
}

#nosotros .texto {
 color:#cecece;
 font-size:20px;
 text-align:justify;
}


#nosotros .nosotrosNombre{
 text-align:center;
 color:white;
 margin-top:15px;
 margin-bottom:2px;
}

#nosotros .nosotrosDescr{
 text-align:center;
 color:white;
 margin-bottom:60px;
 color: var(--color-secund);
}

#nosotros .nosotrosPersona{
 background-position: 0px -50px;
 /*
 border-radius:50%;
 width:300px;
 height:300px;
 */
}


#nosotros #contenedorPersonas :nth-child(1) .nosotrosPersona {
 background-position: 0px -90px;
}


.sombra{
	    text-shadow: 2px 3px 4px black;
}


/* FILTROS DE BÚSQUEDA */


#btnBusq {
 margin-top:25px;
 height:40px;
}

#filtros {
	min-height: 70px;
	display: inline-flex;
	width:100%;
	background-color: transparent !important;
}

#filtros .dropdown-toggle{
	display:none;
}

.label_y_filtro{
	flex:100%;
}

.label_y_filtro label {
	font-size:12px;
	font-weight:100;
	color: whitesmoke;
	width: 100%;
	padding-left: 5px;
}

.label_y_filtro :is(.dpgSelect, .dpgDropdown, #valor_label) {
	height:40px;
	width:99%;
}

.dpgDropdown {
	position:relative;
}

.dpgDropdown .dropdown-menu {
	padding:10px;
}

.dpgDropdown .dropdown-menu span {
	font-size:10px;
}

#resultados {
    display: flow-root; /* clearfix */
    margin-bottom: 50px;
}

.cantResultados{
	color:lightgray;
	text-align:right;
}

#obsResultados{
	color:lightgray;
	text-align:center;
}

/* ___________ PIE */

#pie {
	margin-top:50px;
	background:var(--fondoEncab);
	box-shadow: 2px 2px 5px 3px lightgrey;
	color:whitesmoke;
	text-align:center;
	width:100vw;
	position: absolute;
	bottom: 0;
	left: 0;
}

#pie img {
	height:30px;
	margin:10px;
}

#contGral{
    min-height: 100vh;
    position: relative;
}




#barraBtnFiltros{
	background-color: transparent; /* var(--fondoEncab);*/
	position:sticky;
	top:60px;
	left:0;
	width:100%;
	min-height:20px;
	/*border:1px gray solid;*/
	z-index:9;
	text-align:center;
	display:inline-flex;
}

#btnFiltros{
	height:50px;
	width:50px;
	border-radius:50%;
	background-color: var(--fondoEncab);
	
}

#contFiltros{
	position:sticky;
	top:70px;
	z-index:99;
	background-color: var(--fondoEncab) !important;
	left:0;
}

/* ___________ MSJE ERROR */

#div_error{
    margin-top: 200px;
    color: whitesmoke;
    width: 100%;
    text-align: center;	
}

#div_error svg {
	color:gray;
}

#div_error p{
	margin-top:50px;
}



/* __________ CONTACTO */

#contacto .subtitulo{
	text-align:center;
	color:whitesmoke;
}

#contacto #datosContacto{
	padding-top:30px;
}

#contacto .dato{
	display:flex;
}

#contacto .dato_icono {
	color: var(--color-secund);
	font-size:30px;
	padding-right:10px;
	width:50px;
	text-align:center
}

#contacto .dato_texto {
	color: whitesmoke;
	font-size:14px;
	padding-top:10px;
	
}

#contacto .dato_texto a {
	color:inherit;
}

/* ___________ MOBILE */

@media (max-width: 992px) {
	#contFiltros{
		display:none;
		position:fixed;
		z-index:8;
		top:0px;
		left:0;
		width:100%;
		padding:20px;
		padding-top:130px;
	}

	#filtros{
		display:block;
		
	}
}

/* general: textareas no horiz */
textarea {
	resize: vertical !important; 
}