/******************************* FUENTES PERSONALIZADAS *****************************************************/
@font-face {
  font-family: 'Ubuntu';
  src: url('../fonts/patrick_hand.woff2') format('woff2');
}
@font-face {
  font-family: 'Economica';
  src: url('../fonts/economica.woff') format('woff');
}
@font-face {
  font-family: 'Pass';
  src: url('../fonts/simbolos.woff') format('woff');
}
@font-face {
  font-family: 'DroidSans';
  src: url('../fonts/droidsans.woff') format('woff');
} 
@font-face {
  font-family: 'OpenSans';
  src: url('../fonts/opensans.woff') format('woff');
}
@font-face {
  font-family: 'WireOne';
  src: url('../fonts/wireone.woff') format('woff');
}
@font-face {
  font-family: 'Aladin';
  src: url('../fonts/aladin.woff') format('woff');
}
@font-face {
  font-family: 'Cabin';
  src: url('../fonts/Cabin.woff') format('woff');
}
@font-face {
  font-family: 'Dosis';
  src: url('../fonts/dosis.woff') format('woff');
}

/*********************************************************
  RESETEO
*********************************************************/

body {margin:  0px; font: 100% Dosis; background-color: #fff; }
img, fieldset {border: 0;}

/* set image max width to 100% */
img {
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
}

figure {margin:  0px;}
a {text-decoration: none;}

/* set html5 elements to block */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}


/************************************************************************************
  ESTILO GENERAL
*************************************************************************************/

/********************************* BARRA MENU ***************************************************/


#DivBloqueSesion {
  position: fixed;
  right: 5px;
  top: 0px;
  height: 45px;
  background-color: #FFE77F;
		border: 0px solid #000;
		width:  auto;
		text-align: right;
  border-radius: 0 0 4px 4px;
  box-shadow: 2px 2px 4px #888;
  overflow: hidden;
  z-index: 50;
}

#DivBarraSesion {
  display: block;
		border:  0px solid green;
  width: 150px;
  height: 35px;
  margin: 0px;
  padding: 2px;
  padding-top: 10px;
  text-align: center;
}

#DivBarraSesionIniciada {
  display: inline-block;
  width: 150px;
  height: 35px;
  padding: 2px;
  padding-left: 5px;
  padding-bottom: 5px;
  text-align: left;
		border: 0px solid red;
  transition: 0.25s;
  text-align: right; 
}

#bSesion1 {float: left; width: 120px; }
#bSesion2 {padding-top: 13px; padding-left: 5px; }


.Etiqueta{
		border-radius: 2px;
		padding: 3px;
		padding-top: 1px;
		padding-bottom: 1px;
		color: #fff;
		font-weight: bold;
		font-size: 85%;
		margin: 1px;
		margin-top: 4px;
		display: inline-block;
		cursor: pointer;
		transition: 0.25s;
}

.Etiqueta:hover {box-shadow: 0 0 4px #888; transition: 0.25s;}
.TagGris:hover {background-color: #73C46B; color: #fff; transition: 0.25s;}

.SpanNotificacion{
		border-radius: 2px;
		padding: 3px;
		padding-top: 1px;
		padding-bottom: 1px;
		color: #fff;
		font-weight: bold;
		font-size: 85%;
		margin: 1px;
		margin-top: 4px;
		display: inline-block;
		transition: 0.25s;
}

/*********************************  MAIN LAYOUT  ***************************************************/
#container {width: 100%; margin: 0 auto; overflow: hidden;}
#content {width: 100%; margin: 0 auto; border:  0px ;  padding-top: 0px; clear: both; ; opacity: 1;}
#header {width: 100%; height: 75px; opacity: 0.95; background-color: #FFD416; border-top: 0px solid #404040; border-bottom: 1px solid #c0c0c0; z-index:  115;  overflow: hidden;}

.Sombra {box-shadow: 4px 4px 8px #444; }

#pie {
  width: 100%;
  background-color: #D8B100;
  font-size:  100%;
  border-top: 1px solid #C4A000;
  padding-top: 50px;
  overflow: hidden;
}

.spanContacto:hover {text-decoration: underline;}
/*********************************** PLACEHOLDER ****************************************/
:-moz-placeholder { color: #888; }
::-moz-placeholder { color: #888; }
:-ms-input-placeholder { color: #888; }
::-webkit-input-placeholder { color: #888;}

/********************************* BUSQUEDA PRINCIPAL ********************************************/
.ul_Header { list-style: none; width: 100%; margin: 0px; padding: 0px; }
.ul_Header li{ float: left; border: 0px solid red;}
#liLogo {width: 30%; border: 0px solid #000;}
#liBuscar{width: 44%; border: 0px solid #000;}

#ImgLogo {padding: 5px; padding-left: 10px; }
#ImgLogo2 {padding: 2px; display:none;}
#ImgLogo3 {padding: 2px; display:none;}

#DivRosarioMascotas {position: absolute; font-size: 80%; font-weight: bold; left: 0%; top: 0px; visibility: hidden; }
#DivRosarioMascotas a {color: #000;}

#SpanNombreUsuario {position: absolute; font-size: 80%; right: 0%; top: 0px; visibility: hidden; padding-right: 2px; height: 15px; width: 250px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.Btn_VerSesion {display: inline-block; float:right; width: 32px; height: 32px; border-radius: 2px ; border: 1px solid #C93A3A; background: #FFB200 url(../images/sprites.png) -190px 4px no-repeat; visibility: hidden; cursor: pointer; margin-left: 2px; margin-top: 15px;}
.CantNotif {position: absolute; text-align: center; padding: 2px; border-radius: 20px; font-size: 80%; background-color: #EF2E2B; color: #fff; font-weight: bold; margin-top: 20px; margin-left: 20px; width: 16px; height: 16px;}
.CantNotif2 {position: absolute; text-align: center;  padding: 2px; border-radius: 20px; font-size: 80%; background-color: #EF2E2B; color: #fff; font-weight: bold; margin-top: -10px; margin-left: 32px; width: 16px; height: 16px;}
.CantNotif3 {position: absolute; text-align: center;  padding: 2px; border-radius: 20px; font-size: 70%; background-color: #EF2E2B; color: #fff; font-weight: bold; margin-left: 8px; width: 16px; height: 16px;}

.DivBuscar2 {
  width: 80%;
  background-color: transparent;
  border-radius: 0px;
  padding: 0px;
  margin: 0px;
  margin-top: 20px;
  padding-left: 30px;
  text-align: left;
  overflow: hidden;
}

.TxtBuscar {border-top-right-radius: 0px; border-bottom-right-radius: 0px; width: 80%; height: 20px; }
.CmdBuscar { background: #f0f0f0 url(../images/sprites.png) -177px -55px no-repeat ; width: 30px; padding: 2px; border-top-left-radius: 0px; border-bottom-left-radius: 0px; border-left: 0px; background-color: #f0f0f0; height: 30px; }
.CmdBuscar:hover { background-color: #fcfcfc;}
#TxtBuscar {padding: 8px; }


.IconHelpBuscar {margin-left: 5px; cursor: pointer; display: inline-block; width: 16px; height: 17px; background: url(../images/sprites.png) -80px -40px no-repeat; }
.SpanOpciones{ float:  right; font-size: 80%; padding-top:  10px; padding-right: 10px; cursor: pointer; text-decoration: underline; display: none;}

.DivCompartirPublicacion {float: left; width: 45%; text-align: center; padding: 10px; }

/********************************* PUBLICAR MASCOTAS ********************************************/
.DivRegistrarse {
  width: 600px;
  margin: 0px;
  background-color: #F7F1D2;

  border-radius: 0px;
  padding: 0px;
		padding-top:  0px;
		padding-bottom: 25px;
  text-align: center;
  font-size: 100%;
  overflow: hidden;
}

.DivRegistrarse .Titulo {
		width: 99%;
		font-size: 120%;
		color: #000;
		margin:  0px;
		margin-bottom: 25px;
		padding:  7px;
		text-align: left;
  font-weight: bold;
  
}

.DivTerminos {
  width: 99%;
  height: 300px;
  background-color: #fff;
  border: 1px solid #888;
  border-radius: 4px;
  overflow-y:  scroll;
  font-size:  100%;
  padding: 2px;
}

.DivIniciarSesion {
  width: 480px;
  margin: 10px;
  margin-left: auto;
  margin-right: auto;
  
  background-color: #FFFDC6;
  border: 1px solid #FFAE00;
		padding-top: 0px;
		padding-bottom: 25px;
  font-size: 100%;
  border-radius: 3px; 
}

.DivIniciarSesion .Titulo {
		font-size: 120%;
		color: #000;
		margin:  0px;
		margin-bottom: 15px;
		padding:  5px;
		text-align: left;
}
.DivIniciarSesion .Titulo:before { content:  '• '; }

.DivPublicar {
  width: 1024px;
		padding:  15px 0 0 5px;
  text-align: left;
  font-size: 100%;
}

.DivPublicar .Titulo {
		font-size: 120%;
		color: #444;
  width: 90%;
		margin:  0px;
		margin-bottom: 15px;
		margin-top: 15px;
		padding:  5px;
  border-bottom: 1px solid #ccc;
  font-weight: bold;
}


.TabDivPublicar {width: 75%; margin-left: auto; margin-right: auto;}
.SpanAccion {cursor: pointer; color: #000; border-radius: 2px; padding: 4px; padding-left: 4px; background-color: transparent; border: 0px solid #888; margin-right: 2px;}
.SpanAccion:hover {background-color: #fff; border-color: #fff; transition: 0.25s;}

.SpanAccionRojo {cursor: pointer; color: #fff; border-radius: 3px; background-color: #0029de; padding: 2px 4px 2px 4px; margin-left: 2px; font-size: 90%; text-align: center; transition: 0.25s; font-weight: bold; }
.SpanAccionRojo:hover {background-color: #fff; color: #000; transition: 0.25s;}
#SpanPublicarMascota { display: inline-block;}
#SpanPublicarMascota_Menu {display:none;}
.CenterBox {margin-left:auto; margin-right: auto;}
.placeholder { color: #aaa; }

input {border: 1px solid #c0c0c0; color: #000;  background-color: #fafafa; border-radius: 2px; padding: 4px; font-size: 100%; transition: 0.25s;}

select {border: 1px solid #c0c0c0; background-color: #fafafa; border-radius: 2px; padding: 4px; font-size: 100%;}
select:disabled {background-color:  #eee;}
textarea {border: 1px solid #c0c0c0; color: #000;  background-color: #fafafa; border-radius: 2px; padding: 4px; font-size: 100%; font-family: Dosis, sans-serif, Arial;}

.ContentCarousel {width: 100%; border: 0px solid #49B52B; border-radius: 0px;}

#GoTop {position: fixed; right: 0px; bottom: 0px; width: 50px; height: 50px; background: transparent url(../images/sprites.png) -230px 0 no-repeat; visibility: hidden; transition: 1s; opacity: 0; cursor: pointer; z-index: 5;}

.Corazon {position: absolute; visibility: hidden;  z-index: 1; left: 0px; top: 0px; transition: 2.5s; transition-delay: 1s; }
.OcultarCorazon {display: none; }

.AnimarFinalFeliz{ animation: KeyFrameAnimarFinalFeliz 1s; }
@keyframes KeyFrameAnimarFinalFeliz{
  5%   { opacity: 1; }
  20%   { opacity: 0; }
  25%   { opacity: 1; }
  45%   { opacity: 0; }
  50%   { opacity: 1; }
  70%   { opacity: 0; }
  75%   { opacity: 1; }
  95%   { opacity: 0; }
  100% { opacity: 1; }
}

/********************************* OTROS RESULTADOS********************************************/
.ContenedorOtrosAvisos {background-color: transparent; width: 100%; height: 225px; padding: 0px; overflow: hidden; }
.ContenedorOtrosAvisos .FlechaMenos {position: absolute; width:  50px; height: 50px; margin-top: 50px; margin-left: 0px; z-index: 10;  background: #fff url(../images/flechaizq_2.png) center center no-repeat;  cursor: pointer; border-radius: 60px; box-shadow: 2px 2px 4px #444; opacity:0.45; transition: 0.25s;}
.ContenedorOtrosAvisos  .FlechaMas { position: absolute; width:  50px; height: 50px; margin-top: 50px; margin-left:  76%; z-index: 10; background: #fff url(../images/flechader_2.png) center center no-repeat; cursor: pointer; border-radius: 60px; box-shadow: 2px 2px 4px #444; opacity:0.45; }
.ContenedorOtrosAvisos:hover .FlechaMenos {opacity: 1;}
.ContenedorOtrosAvisos:hover .FlechaMas {opacity: 1;}
 
.ContenedorOtrosAvisos:active .FlechaMenos {opacity: 1;}
.ContenedorOtrosAvisos:active .FlechaMas {opacity: 1;}

.SliderOtrosAvisos{height: 100%; }
.AnuncioOtrosAvisos{ float: left; width: 200px; padding: 0px; margin: 5px; background-color: transparent; transition: 0.25s; overflow: hidden;}


/********************************* PERFIL USUARIO ********************************************/
.DivMenuAdmin {margin: 0px; background-color: #FFC849;  border: 0px solid #E8AD2E; border-radius: 0px; padding: 4px; padding-bottom:  14px; text-align: left; }
.DivMenuAdmin .Titulo {display: inline-block; font-size: 18px; color: #1E331C; margin-top: 10px;}

.DivMenuUsuario{ margin: 0px; background-color: #F9F32C;  border: 0px solid #D6D615; border-radius: 0px; padding: 4px; text-align: left; width: 480px;}
.DivMenuUsuario .Titulo {display: inline-block; font-size: 16px; color: #1E331C; padding: 6px;}

.DivMenuUsuarioRojo{ margin: 0px; background-color: #EF7353;  border: 1px solid #BF9C11; border-radius: 0px; padding: 0px; text-align: left;}
.DivMenuUsuarioRojo .Titulo {font-size: 16px; color: #1E331C; padding: 3px; margin: 0px;}

.SpanBoton {display: inline-block; padding: 6px; border: 0px solid #ddd; background-color: #ddd; text-align: center; border-radius: 2px; width: 200px; margin: 2px; transition: 0.25s; }
.SpanBoton:hover {box-shadow:  0 0 2px #aaa; transition: 0.25s;}

.DivHostNames {height: 200px; overflow-y: scroll; border: 1px solid #ccc; border-radius: 2px; margin: 4px; text-align: left;}
.Span_VerMas {display: block; margin-top: -18px; margin-right: 25px; padding-bottom: 15px; cursor: pointer; }

.Div_BtnPerfil {
		background-color: #fff;
		border: 0px solid #ccc;
		float: left;
		border-radius: 4px;
		width:  200px;
		height: 220px;
		padding: 6px;
		margin:  10px;
		transition: 0.25s;		
}
.Div_BtnPerfil:hover {background-color: #fff; box-shadow: 0 0 0px #ccc; padding: 10px; margin: 6px; opacity: 0.5; transition: 0.25s;}

.Ul_MiPublicacion {list-style: none;  background-color: transparent; width: 99%; font-size: 80%; padding: 0px;}
.Ul_MiPublicacion li { background-color:  #fff; border: 1px solid #aaa; border-radius: 0px; margin: 0px; margin-top: 10px; transition: 0.25s;}
.Ul_MiPublicacion li:hover{background-color: #fafafa; transition: 0.25s;}
.Ul_MiPublicacion .Titulo {margin: 1px; font-size: 14px; font-weight: bold; border-radius: 2px; padding: 2px; height: 20px; line-height: 20px;}

.Ul_MiPublicacion .Fecha {font-size: 11px; margin: 2px; text-align: right; float: right;}
.Ul_MiPublicacion .Foto {width: 220px;  border: 0px solid #9B9B9B; border-radius: 0px; margin: 0px; margin-top: 0px; margin-left:0px; box-shadow: 0 0 0px #ccc; padding:  0px; background-color: #fff;}
.Ul_MiPublicacion .Descripcion {font-size:  100%; width: 99%; background-color: transparent; padding: 4px;}

.Ul_MiPublicacion .DivFoto {float:left; width: 240px; }
.Ul_MiPublicacion .DivDescripcion {float:left; width: 80%; padding-top: 10px;}

.DivEliminarPublicacion {border: 1px solid #ccc;  border-radius: 4px; background-color:  #fafafa;  width: 300px; margin: 2px; font-size: 14px;}
.DivEliminarPublicacion .Titulo {margin: 1px; font-size: 14px; font-weight: bold; border-radius: 2px; padding: 5px;}
.DivEliminarPublicacion .Fecha {font-size: 11px; margin: 2px; text-align: right; float: right;}
.DivEliminarPublicacion .Caract { height: 18px; display:  inline-block;  width: 150px; background-color:  #fff; color:  #000; border-radius: 2px; padding: 2px; margin-top:2px; border: 1px solid #ddd; transition: 0.25s; }
.DivEliminarPublicacion .Caract:hover {background-color: #f0f0f0; border-color: #ccc; box-shadow: 0 0 4px #ccc; transition: 0.25s; }
.DivEliminarPublicacion .Foto {width: 160px;  border: 1px solid #ccc; border-radius: 4px; margin:  4px;}

.DivReencontrado {padding: 0px;}
.DivBotoneraPublicacion {text-align: right; margin-top: 10px;}

.FormPopUp {width: 400px; overflow-x: hidden;}
.DivFinalFeliz {border: 1px solid #ccc; border-radius: 2px; background-color:  #fff;  width: 99%; margin: 2px; font-size: 100%; }
.DivFinalFeliz .Titulo {margin: 1px; font-size: 14px; font-weight: bold; border-radius: 2px; padding: 2px;}
.DivFinalFeliz .Fecha {font-size: 11px; margin: 2px; text-align: right; float: right;}
.DivFinalFeliz .Foto {width: 240px;  border: 0px solid #ccc; background-color: #fff ; border-radius: 0px; margin: 0px; padding: 0px; }

.BanderaFinalFeliz {width: 162px; height: 161px;  background: transparent url(../images/sprites.png) 0 -511px no-repeat; position: absolute; margin-top: 0px; margin-left: 0px; transition: 0.5s; transition-delay: 0.5s;}
.BanderaFinalFelizG {width: 267px; height: 268px; background: transparent url(../images/sprites.png) 0 -241px no-repeat; position: absolute; margin: 0px; margin-top: 0px; z-index: 7; }
.NotaAgradecimiento { width: 80%; margin: 0px; margin-left: auto; margin-right: auto; margin-top: 15px; background-color: #FFB600; opacity:  0.9; color: #000; font-size: 16px; border-radius: 2px; padding: 8px; }
.NotaAgradecimiento .VerMasTexto{position: absolute; right: 0px; bottom: 0px; background-color: #888; padding: 5px; cursor: pointer; font-weight: bold; font-size: 70%; color: #fff; display: none;}

.SpanTiempoTrancurrido {position: absolute; margin-right: 0; color: #fff; font-weight: bold; font-size: 80%; border-radius: 2px; background-color: #222; padding: 2px; margin: 2px;}

.BanderaRepublicado {position: absolute; width: 58px; height: 58px; margin-left: 372px; margin-top: 266px;}
.Rep1 {background: url(../images/sprites.png) 0px -180px no-repeat;}
.Rep2 {background: url(../images/sprites.png) -58px -180px no-repeat;}
.Rep3 {background: url(../images/sprites.png) -116px -180px no-repeat;}

/********************************* BUSQUEDA DE MASCOTAS ********************************************/

.ListaMascotas {list-style: none; margin: 0px; padding: 0 0 0 10px; width: 100%; }
.ListaMascotas li {float:left; padding: 0px; }

.Imusita {position: absolute; width: 80px; height: 20px; background-color: #F90202; color: #fff; font-family: arial; font-weight: bold; line-height: 20px; letter-spacing: 2px; margin-top: 55px; margin-left: 0px; text-align: center; box-shadow: 2px 2px 4px #444;}
.DivImusita {position: absolute; width: 80px; height: 20px; background-color: #F90202; color: #fff; font-family: arial; font-weight: bold; line-height: 20px; letter-spacing: 2px; margin-top: -15px; margin-left: 0px; text-align: center; box-shadow: 2px 2px 4px #444;z-index: 100;}
.BgMarcha {width: 100%; height: 200px; background: #FFEB7C url(../images/marcha1.png) center center no-repeat; padding-left: 5px;}
.BgFinalFeliz1 {width: 100%; height: 200px; background: #fff url(../images/bgfeliz1.png) center right no-repeat; padding-left: 5px;}
.BgImusita1 {width: 100%; height: 200px; background: #fff url(../images/imusitas1.png) center right no-repeat; padding-left: 5px;}
.BgImusita2 {width: 100%; height: 200px; background: #fff url(../images/imusitas2.png) center right no-repeat; padding-left: 5px;}
.TituloImusita {margin: 0px; font-weight: bold; text-decoration: underline; font-size: 150%; padding-top: 20px}
.TextoImusita {padding: 5px; background-color: rgba(0,0,0,0); width: auto; display: inline-block; color: #000;}

.DatosUsuario {
  border: 1px solid #E0D97B;
  background-color: #fffed3;
  text-align: left;
  color: #444;
  font-size: 14px;
  padding:  8px;
  margin:  0px;
  border-radius: 4px;
  width:  97%;
  margin-left:  auto;
  margin-right:  auto;
}
.SinResultados {border: 1px solid #ED1010;  background-color: #FF9393; text-align: left; color: #000; padding: 8px; margin: 0 auto o auto; border-radius: 4px;  width:  95%; }

.DivRecuadro {border-bottom: 1px dashed #ddd; border-radius: 2px; box-shadow: 0 0 0px #eee; background-color: #F8F8F8 ; width: 430px; height: 480px; margin-left: 0px; margin: 5px; font-size: 14px; float:left; transition: 0.25s; overflow: hidden}
.DivRecuadro:hover { background-color: #FCF9AE; border-bottom: 1px solid #FCF9AE; transition: 0.25s; box-shadow: 0 0 12px #888;  z-index: 0;}
.DivRecuadro:hover .Caract {background-color: #888;  color: #fff; }

.DivRecuadro .Titulo {margin:0px; font-size: 14px; font-weight: bold; border-radius: 0px; padding: 6px; border-bottom: 0px dotted #ccc; text-align: center;}
.DivRecuadro .FechaSuceso { font-size: 12px; font-weight: bold; border: 0px dotted #ccc; border-left: 0px; border-right: 0px; color: #000; margin: 4px;		padding: 4px;	transition: 0.25s; }

.DivRecuadro .Fecha {color: #000; font-size: 11px; margin: 2px; text-align: right; float: right; font-weight: normal;}
.Caract {display: inline-block; border: 0px solid #f0f0f0; background-color: transparent; color: #000000; font-weight: bold; border-radius: 2px; padding: 3px; margin: 1px;  font-size: 80%; text-transform: uppercase; transition: 0.25s;}
.DivRecuadro .Foto {width: 100%; margin: 0px; padding: 0px; background-color: #fff; }
.DivRecuadro .Descripcion { font-size:  12px; border-top: 1px dotted #ccc;  border-bottom: 1px dotted #ccc; width:  90%; overflow: hidden; height: 50px; background-color: transparent; padding: 4px; margin:  auto;}
.DivRecuadro .Ubicacion { background-color: #aaa; border-radius: 2px;  color:  white; font-size:  12px; padding: 2px; margin: 2px; font-weight: bold; }
.DivRecuadro .OtrosDatos{ width: 100%; padding: 2px; margin:0px; }
.DivRecuadro .SpanBoton {display: inline-block; padding: 4px; border: 1px solid #EFEEBA; text-align: center; background-color: #FFFDE5; border-radius: 2px; width: 90%; margin: 2px; }

.ContDatosMascota { display: inline-block; margin-right: 30px; margin-top: 20px;}
.DataMascota {display: inline-block; width: auto; background-color: #ddd; font-weight: bold; padding: 3px; border-radius: 2px 0px 0px 2px; padding-right: 8px;}
.DatosMascota {padding: 3px; border-radius: 0px 2px 2px 0px; font-weight: bold; text-transform: uppercase; background-color: #888; color: #fff; padding-left: 8px;}

.Chat{ display: inline-block; width: 14px; height: 14px; background: url(../images/sprites.png) 0px -23px no-repeat; }
.Ojo{ display: inline-block; width: 14px; height: 14px; background: url(../images/sprites.png) -15px -23px no-repeat; }

.DivNotificacionesUsuario {max-height: 200px; overflow-y: scroll;}
.IconoPublicaciones {display: inline-block; width: 16px; height: 16px; background: url(../images/sprites.png) 0px -40px no-repeat; }
.IconoEditarDatos {display: inline-block; width: 16px; height: 16px; background: url(../images/sprites.png) -16px -40px no-repeat; }
.IconoMensajes {display: inline-block; width: 16px; height: 16px; background: url(../images/sprites.png) -32px -40px no-repeat; }
.IconoHerramientas {display: inline-block; width: 16px; height: 16px; background: url(../images/sprites.png) -48px -40px no-repeat; }
.IconoSalir {display: inline-block; width: 16px; height: 16px; background: url(../images/sprites.png) -64px -40px no-repeat; }

.Icon_facebook{display: inline-block; width: 24px; height: 24px; background: url(../images/sprites.png) 0px -58px no-repeat; vertical-align: middle;}
.Icon_twitter{display: inline-block; width: 24px; height: 24px; background: url(../images/sprites.png) -23px -58px no-repeat; vertical-align: middle;}
.Icon_whatsapp{display: inline-block; width: 24px; height: 24px; background: url(../images/sprites.png) -47px -58px no-repeat; vertical-align: middle;}
 
.TildeOk{display: inline-block; width: 16px; height: 16px; background: url(../images/sprites.png) -34px -23px no-repeat; vertical-align: middle;}
.TildeError{display: inline-block; width: 18px; height: 17px; background: url(../images/sprites.png) -52px -21px no-repeat; vertical-align: middle;}

.Icon_Ayuda{display: inline-block; width: 64px; height: 64px; background: url(../images/sprites.png) 0px -109px no-repeat; }
.Icon_Consultas{display: inline-block; width: 64px; height: 64px; background: url(../images/sprites.png) -65px -109px no-repeat; }
.Icon_Terminos{display: inline-block; width: 64px; height: 64px; background: url(../images/sprites.png) -130px -109px no-repeat; }

.IconoErrorPagina {display: inline-block; width: 32px; height: 32px; background: url(../images/sprites.png) -230px -54px no-repeat; }
.IconoUsuario {display: inline-block; width: 40px; height: 25px; background: url(../images/sprites.png) -72px -58px no-repeat; }


#Filtros {font-size: 90%; border-radius: 0px; padding:  2px; width: 200px; background-color: transparent; text-align: left; float: right; }
#Filtros .Titulo {font-weight: bold; font-size:  14px; color: #000;}

.ListaFiltros {padding-left: 0px; list-style: none; margin-bottom: 15px;}
.ListaFiltros li {width: 90%; padding: 3px; }
.ListaFiltros a {color:  #000; font-size: 100%; padding: 0px; transition: 0.25s; }
.ListaFiltros a li {padding-left: 15px; padding-top: 2px;} /* para tabular hacia la derecha la lista de filtros*/
.ListaFiltros a:hover {color: #000; text-decoration: underline; transition: 0.25s;} 
.ListaFiltros .Selected {background: #FFC32B url(../images/cruz.png) no-repeat right; border: 0px solid #EDBE34; border-radius: 2px; padding: 3px; }
.ListaFiltros a .Selected  {color:  #444; transition: 0.25s;}
.ListaFiltros a1 .Selected:hover {color: #E2DC18; transition: 0.25s;}

.VerMas {max-height: 198px; overflow: hidden;}
#ImgFotoRaza {position: absolute; left: 100px; display: none; width: 120px; height: 100px; border: 2px solid #FFC300; box-shadow: 2px 2px 8px #888; border-radius: 2px; z-index: 2;}

.FlechaDown {border-top: 1px dashed #ddd; display: inline-block; width: 90%; height: 11px; background: transparent url(../images/sprites.png) -256px -89px no-repeat; padding-left: 16px; opacity: 0.50; cursor: pointer; transition: 0.25s;}
.FlechaDown:hover {opacity: 1; transition: 0.25s;}
 

.BotonCompartir {background-color: #FFEEB7; display: inline-block; width: 180px; border-radius: 3px; border: 0px solid #ccc; margin-left: auto; margin-right: auto; padding: 4px; margin-top: 10px; text-align: center; transition: 0.25s}
.BotonCompartir:hover { background-color: #FFDA60; transition: 0.25s;}
.MobileAction {display: none;}

.TituloPrincipal {display: block; width: 240px; border-radius: 2px; background-color: #FFC300; font-weight: bold; padding: 4px; color: #000; margin: 10px; font-size: 100%; text-transform: uppercase;}

#Paneles {list-style: none; padding:0px; margin: 0px; margin-top: 10px; border: 0px solid red;}
#PanelIzq {background-color: #fff; float:left; width: 220px; border: 1px solid #fff; padding-right: 2px; }
#PanelDer {float:left; border: 0px solid green; width: 82%; padding-left: 2px; border-left: 1px dashed #ccc; }
#PanelPie {clear:both; width: 99%; }
#DivPanelIzqFloat{ background-color: #fff; width: 270px; height: 100%; position: absolute; top:0; z-index: 98; left: -270px;}

#ExpandPanelIzq {background: #444 url(../images/menu_v_filtros3.png) right center no-repeat ; width: 30px; height: 80px; position: fixed; left: 0px; top: 80px; border-radius: 0 2px 2px 0; cursor: pointer; display: none; z-index: 11;}
#ExpandPanelIzq:hover { box-shadow: 0 0 4px #000; }
#DivFondoPanelIzq {background-color: #000;  left:0; top:0px; width:0px; height:0px; position: absolute; display: none; z-index:90; opacity: 0.85;}


/********************************* DETALLE PUBLICACION ********************************************/

.DivVerPopUp {width: 90%; background: #fff url(../images/body1.png); overflow: hidden;}

.DivDetallePublicacion {border: 0px solid #ddd; border-radius: 3px; width: 800px; margin: 0px; font-size: 100%; overflow: hidden; opacity: 0;}
.DivDetallePublicacion .Titulo {margin: 2px; font-size: 100%; font-weight: bold; border-radius: 2px; padding: 4px; padding-top: 8px; padding-bottom: 8px; border-bottom: 0px dotted #ccc; }
.DivDetallePublicacion .Fecha {color:  #444; font-size: 90%; margin: 2px; text-align: right; float: right; }
.DivDetallePublicacion .PublicadoPor { color: #000; background-color: #bbb; border-radius: 3px;  padding: 3px; font-weight: bold;}
.DivDetallePublicacion .DenunciarPublicacion {float: right; background-color: #DB2E2E;  color: #fff; font-weight: bold; cursor: pointer; padding: 4px; font-size: 90%; transition: 0.25s; border-radius: 3px; margin-right: 10px;}
.DivDetallePublicacion .DenunciarPublicacion:hover { background-color: #AF6E6E; transition: 0.25s;}
.DivDetallePublicacion .Descripcion {font-size: 110%; width: 100%; padding: 4px; background-color: #fff;}

.DivReacciones {width: 100%; height: 22px; padding: 0px; margin-top: 15px; border-top: 1px dashed #A5750E; text-align: left; line-height: 15px; padding-top: 8px; transition: 0.25s;}

#ImgEnviarCorazon {display: inline-block; width: 19px; height: 19px; background: url(../images/reacciones.png) -26px 0 no-repeat; margin: 2px; vertical-align: middle; transition: 0.25s; cursor: pointer;}
#SpanEnviarCorazon {display: inline-block; cursor: pointer; transition: 0.25s}
#SpanEnviarCorazon:hover { transform: scale(1.1);}

.DivCorazonCounter {float: right; text-align: right; width: 50px; }
.SpanCorazon {display: inline-block; vertical-align: middle; width: 24px; height: 24px; background: url(../images/reacciones.png) 0px 0 no-repeat; transition: 0.25s; }


.DivDetallePublicacion .Ubicacion { background-color: #DBC925; border-radius: 4px;  color: white; font-size:  100%; padding: 4px; margin: 2px; font-weight: bold; }
.DivDetallePublicacion .Ubicacion:before {content:  '• '} 
.DivDetallePublicacion .OtrosDatos { width: 100%; padding: 2px; margin:0px; }
.DivDetallePublicacion .OtrosDatos .Dato  {display:  inline-block; width: 100%; font-size: 80%; margin-bottom: 2px; color: #888; }
.DivDetallePublicacion .OtrosDatos .Dato:before {content: '» '; }  

.DivDetallePublicacion .OtrosDatos .Valor { font-size: 90%; font-weight: bold; padding-left: 6px; transition: 0.25s;}
.DivDetallePublicacion .OtrosDatos .Valor:hover {background-color: #888; border-radius: 2px; padding: 2px; padding-left: 6px; color: #fff; transition: 0.25s;}

.DivDetallePublicacion #S1 {width: 80%; float: none; padding-top: 20px;}
.DivDetallePublicacion #S2 {width: 99%; float: none; padding-top: 30px;}

.TituloSeccion {font-size: 100%; font-weight: bold; background-color: #FFD77A; padding: 4px; border-radius: 3px; text-transform: uppercase;}
.Cerrar {float: right; cursor: pointer; margin-top: -5px; width: 28px; height: 28px; background: transparent url(../images/sprites.png) -176px -29px no-repeat;}

#DetallePublicacion {list-style: none; padding:0px; margin: 0px;}
#DetallePublicacion #li_Datos {width: 250px; float: left; }
#DetallePublicacion #li_Foto {width: 60%; float: left;}
#DetallePublicacion #li_FotosMini {width: 160px; float: left;}

.DivUbicacion {border:  0px solid #ccc; border-radius: 4px; margin-top:  4px; }

.DivPopUpDenunciarMensaje, .DivPopUpDenunciarPublicacion {width: 480px;}
.DivMensajes {margin:  4px; }
.DivMensajes .Titulo { background-color: #DBC925; border-radius: 4px;  color:  white; font-size:  14px; padding: 4px; margin: 2px; font-weight: bold; }

.UlMensajes {list-style: none; border: 0px solid red; margin: 0px; padding:  0px;}
.UlMensajes li {width: 99%; font-size: 110%;}

.MsgUser {border-bottom: 0px solid #ccc; background-color: #fff; padding: 2px; border-radius: 2px; margin: 2px; transition: 0.25s; font-size: 120%;}
.MsgUser .Usuario {margin: 0px; font-weight: bold; font-size:  80%;}
.MsgUser .Mensaje {background-color: #f0f0f0; border-radius: 3px; border: 0px solid #ccc;  margin: 2px; margin-top: 10px; margin-left: 16px; padding: 4px; padding-bottom: 15px ;font-size: 90%;}
.MsgUser .MensajeEliminado {margin: 2px; border:  0px solid #933939; border-radius: 4px; padding: 2px; color: #D81A1A; font-size: 90%;}
.MsgUser .Mensaje .BarraBotones {opacity: 0; color: blue; float: right; font-size: 80%;  transition: 0.25s;}
.MsgUser:hover >.Mensaje .BarraBotones {opacity:  1; transition: 0.25s;}

.MsgUser .Fecha {float: right; font-size: 12px; color: #444;}

.WrapWord{
white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */
white-space: -pre-wrap;      /* Opera 4-6 */
white-space: -o-pre-wrap;    /* Opera 7 */
white-space: pre-wrap;       /* css-3 */
word-wrap: break-word;       /* Internet Explorer 5.5+ */
white-space: -webkit-pre-wrap; /* Newer versions of Chrome/Safari*/
word-break: break-all;
white-space: normal;
}

.TablaMensajes {background-color: #fafafa; border:  1px solid #ccc; width: 100%; border-radius: 2px;} 
#TxtMensaje {resize: none; border: 0px; border-radius: 0px; border-left: 0px dotted #ccc; border-right:  0px dotted #ccc; width: 99%; height: 80px; padding: 1px; font-size: 110%;}
#LblAvisoAjax{display: inline-block; font-weight: normal; text-align: left; padding-left: 5px; margin: 5px;}

.MensajeOK {border: 0px solid #429642; color: #5AAD5A; font-size: 100%; padding: 5px; font-weight:bold;}
.MensajeInfo {border: 0px solid #606060; color: #4d4d4d; font-size: 90%; padding: 5px; font-weight:bold;}
.MensajeError {border: 1px solid #914B4B; background-color: #D37878; color: #fff; font-size: 12px; padding: 2px; font-weight: normal; border-radius: 2px;}
.MensajeInvisible {background-color: transparent; color: transparent;}
.FrameSubirArchivo {border: 1px solid #EFD617; width: 180px; height: 150px; border-radius: 4px;}

/********************************* OTROS RESULTADOS ***************************************************/
.DivOtrosResultados {background-color: #fff; width:  200px; border: 1px solid #ccc; border-radius: 4px; margin-top: 8px; box-shadow: 0 0 4px #eee; text-align: left; float: left; transition: 0.25s;}
.DivOtrosResultados:hover {box-shadow:  0 0  2px #E0E0E0;  background-color: #fafafa; border:  1px solid #CECECE; transition: 0.25s; }

.DivOtrosResultados .Titulo {margin:2px; color: #404040; font-size: 11px; font-weight: bold; border-radius: 2px; padding: 4px; }

.DivOtrosResultados .Fecha {font-size: 10px; margin: 2px; text-align: right; float: right;}
.DivOtrosResultados .Caract1 {display: inline-block; background-color:  #EFEFEF; color: #444; font-size: 12px; border-radius: 2px; padding: 2px; margin-top: 1px; border: 1px solid #A5A5A5;  overflow: hidden;}
.DivOtrosResultados .Foto {width:  180px; border: 1px solid #898989; border-radius: 4px; margin:  4px;}
.DivOtrosResultados .Descripcion { font-size:  12px; border:1px solid #ccc; border-radius: 4px; width:  96%; overflow: hidden; height: 50px; background-color: #fff; padding: 4px;}

.DivLateralOtrosResultados {overflow-y: scroll; width: 100%; height: 1200px;}

.DivCantResultados {padding: 8px; border-radius: 2px; border:  1px solid #ccc; background-color: #f4f4f4; margin: 8px; margin-left: 0px; margin-right: 0px; transition: 0.25s; }
.DivCantResultados:hover {box-shadow: 0 0 4px #dadada; transition: 0.25s; }
.DivCantResultados .DivPaginador {float: right; }
.DivCantResultados .Pagina {border-radius:  2px; color: #000; margin-right: 2px; background-color: #fff; font-size:  12px; border:  1px solid #ccc; padding: 4px; padding-left: 8px; padding-right: 8px; transition: 0.25s;}
.DivCantResultados .Pagina:hover {box-shadow: 0 0 2px #888; background-color: #E8C83A; color: #fff; border: 1px solid #BCAF21; font-weight: bold; transition: 0.25s;}

.DivCantResultados .PaginaSel {border-radius: 2px; color: #fff; margin-right: -2px; font-weight: bold; background-color: #E8C83A; border: 1px solid #BCAF21; padding: 4px; padding-left: 8px; padding-right: 8px; transition: 0.25s;}
.DivCantResultados .PaginaSel:hover {box-shadow: 0 0 2px #A0881C; transition: 0.25s;}
.BtnOtrosResultados {color: #898989; font-weight: bold; width: 200px; text-align: center; font-size:  70%; border-radius: 2px; background-color: #fafafa; padding: 8px; border: 1px solid #ddd; transition: 0.25s;}
.BtnOtrosResultados:hover {background-color:  #f8f8f8;  color: #888; box-shadow:  0 0 6px #ccc; transition: 0.25s; }
.BtnOtrosResultados .ResaltarCantidad {border-radius: 8px; background-color: #888; color: #fff; padding:  2px; padding-left: 6px; padding-right: 6px;}

.IconosGrandes {width: 240px; display: inline-block; padding-top: 5px; text-align: left; border: 0px solid red;}
.IconoCirculo {width: 80px;}
.TituloCirculo {font-size: 120%; color: black;}
.DetalleCirculo {font-size: 70%;}

.Similares_container {overflow-y: scroll; height: 400px; width: 800px;}

.Ul_Similar {list-style: none;  background-color: #fff; width: 99%; font-size: 80%; padding: 0px;}
.Ul_Similar li { background-color:  #fff; border-bottom: 1px solid #ccc; border-radius: 0px; margin: 8px; transition: 0.25s;}
.Ul_Similar li:hover{background-color: #fafafa;  box-shadow: 0 0 0px #ccc; transition: 0.25s;}
.Ul_Similar .Titulo {margin: 1px; font-size: 14px; font-weight: bold; border-radius: 2px; padding: 2px;}

.Ul_Similar .Fecha {font-size: 11px; margin: 2px; text-align: right; float: right;}
.Ul_Similar .Foto {width:  140px;  border: 1px solid #9B9B9B; border-radius: 4px; margin: 4px; margin-top: 6px; margin-left:6px; box-shadow: 0 0 8px #ccc; padding:  4px; background-color: #fff;}
.Ul_Similar .Descripcion {font-size:  12px; width:  99%; height: 50px; overflow: hidden; background-color: transparent; padding: 4px;}


#ul_QueHacer {padding:0 0 50px 0; margin: 0; list-style: none; font-size: 100%; width: 95%; margin-top: 10px;}
#ul_QueHacer li {float: left; cursor: pointer; width: 20%; padding: 0; padding: 10px 0 10px 0; text-align: center; transition: 0.25s;}
#ul_QueHacer li img {width: 150px; transition: 0.25s;}

#ul_QueHacer li:hover {background-color: #fff; transform: scale(1.1);}

.ul_Pasos {padding: 0 ; margin: 0; list-style: none; font-size: 100%; width: 1000%;}
.ul_Pasos li {float:left; width: 800px; opacity: 0; transition: 0.5s;}
.Pasos {position: absolute; width: 640px; opacity: 0; transition: 0.5s;}

.SpanFiltros {display: inline-block; height: 20px; cursor: pointer; font-weight: bold; padding-right: 25px; background: url(../images/updown.png) right  0 no-repeat;  transition: 0.25s;}
.Up{ background: url(../images/updown.png) right -20px no-repeat !important; transition: 0.25s;}

.u_Filtros {padding:0 ; margin: 0; list-style: none; width: 100%; }
.u_Filtros li{float: left; width: 32%; padding: 10px 10px 0 0;}

/************************************ FORMATO PARA TABLAS *******************************************/
.ul_Tabla {padding:0; margin: 0; list-style: none; font-size: 80%; width: 99%; }
.ul_Tabla li {padding-left:  10px; height: 35px; border-bottom: 1px solid #f0f0f0; text-align: center; transition: 0.25s;}
.ul_Tabla li:hover {background-color: #fafafa; transition: 0.25s;} 

table {margin-left:auto;margin-right: auto; border-spacing:0px;}
table td {padding-left:5px; vertical-align: middle;}

.Tabla {border: 1px solid #c0c0c0; font-size: 12px; border-collapse: collapse;}
.Tabla thead td {
  background-color: #fafafa;
  height: 28px;
  border-bottom: 1px solid #c0c0c0;
  font-weight: normal;
  line-height: 30px;
  background: -webkit-linear-gradient(#fafafa, #E5E5E5); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(#fafafa, #E5E5E5); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(#fafafa, #E5E5E5); /* For Firefox 3.6 to 15 */
  background: linear-gradient(#fafafa, #E5E5E5); /* Standard syntax */
}
.Tabla tbody td {
  font-size: 90%;
  height: 28px;
  overflow: hidden;
  border-bottom: 1px solid #eaeaea;
  padding-right: 5px;
}

.Tabla tfoot td { background-color: #f8f8f8; font-weight:bold; padding-right: 5px; height:28px;}
.Tabla tbody tr {background-color: #fff; color: black;  transition: 0.25s;}
.Tabla tbody tr:hover {background-color: #fafafa; color: #000; transition: 0.25s;}

.Ul_MisMensajes {list-style: none;  background-color: transparent; border:  0px solid #ccc; width: 99%; border-radius: 4px; font-size: 80%; padding: 0px; overflow-y: scroll; overflow-x: hidden; height: 500px;}
.Ul_MisMensajes li {border:  1px solid #ccc; background-color: #fff; margin-top: 5px; transition: 0.25s; }
.Ul_MisMensajes1 li:hover{background-color: #fafafa; transition: 0.25s;}
.Ul_MisMensajes .Fecha {display: inline-block; font-size: 80%; margin-top: 4px;  margin-bottom: 4px; }
.Ul_MisMensajes .SpanLeido {display: block; width: 32px; height: 25px; background: url(../images/sprites.png) -100px -32px no-repeat; cursor: pointer; transition: 0.25s;}
.Ul_MisMensajes .SpanNoLeido {display: block; width: 32px; height: 25px; background: url(../images/sprites.png) -100px 0 no-repeat; cursor: pointer; transition: 0.25s;}
.Ul_MisMensajes .SpanIrPublicacion{color: #B7B41B; transition: 0.25s;}
.Ul_MisMensajes .SpanIrPublicacion:hover {color: #AD9811; border-bottom:  1px dotted #444; transition: 0.25s;}
.Ul_MisMensajes .Mensaje{float: left; width: 60%; border: 0px solid red; margin-left: 5px;}
.Ul_MisMensajes .VerPublicacion {float:right; visibility: visible; color: #444; border-radius: 2px; margin-right: 10px;  padding: 2px; transition: 0.25s;}
.Ul_MisMensajes .SinLeer {background-color: #FFFDA3;}   
.Ul_MisMensajes .FotoMini {width: 80px; float: left; background-color:  #fff; border: 0px solid #ccc; border-radius: 2px; padding: 0px; margin: 2px; }

.DivCentroMensajes {width: 800px; min-height: 500px; opacity: 0;}

.DivPopUpMensajes {width: 600px; height: 400px; overflow-y: scroll; font-size: 0.9em; padding: 4px; padding-top: 0px;}
.DivPopUpMensaje {background-color: #fff; border-bottom:  1px dashed #ccc; transition: 0.25s; padding-top: 5px; padding-bottom: 5px;}
.DivPopUpMensaje:hover{background-color: #fafafa; transition: 0.25s;}
.DivPopUpMensaje .Fecha {display: inline-block; font-size: 80%; margin-top: 4px;  margin-bottom: 4px; }

.SinLeer {background-color: #FFFCD3;}
.DivPopUpMensaje .SpanLeido {color: #888; cursor: pointer; transition: 0.25s;}
.DivPopUpMensaje .SpanLeido:hover {color: #000; border-bottom:  1px dotted #444; transition: 0.25s;}

/* para resaltar los usuarios y comentaristas en los mensajes*/
.ResalteDato{ color: #000; font-weight: bold;}
 
.ErrorPublicacion {
  text-align: left;
  width: 90%;
  background-color: #fff;
  border: 0px solid #FF9E9E;
  border-radius:  4px;
  box-shadow: 0 0 0px #F9C2C2;
  font-size: 100%;
  padding: 10px;
}

/********************************* ANCHO Y ALTO ***************************************************/
.w25px {width: 25px;}
.w30px {width: 30px;}
.w40px {width: 40px;}
.w50px {width: 50px;}
.w75px {width: 75px;}
.w100px {width: 100px;}
.w120px {width: 120px;}
.w150px {width: 150px;}
.w160px {width: 172px;}
.w180px {width: 180px;}
.w200px {width: 200px;}
.w220px {width: 220px;}
.w240px {width: 240px;}
.w250px {width: 250px;}
.w300px {width: 300px;}
.w340px {width: 340px;}
.w350px {width: 350px;}
.w400px {width: 400px;}
.w450px {width: 450px;}
.w500px {width: 500px;}
.w550px {width: 550px;}
.w600px {width: 600px;}
.w640px {width: 640px;}
.w750px {width: 750px;}
.w800px {width: 800px;}
.w940px {width: 940px}

.w10_ {width: 10%;}
.w20_ {width: 20%;}
.w25_ {width: 25%;}
.w33_ {width: 33%;}
.w40_ {width: 40%;}
.w50_ {width: 50%;}
.w60_ {width: 60%;}
.w70_ {width: 70%;}
.w75_ {width: 75%;}
.w95_ {width: 95%;}
.w90_ {width: 90%;}
.w99_ {width: 99%;}
.w100_ {width: 100%;}
.wm300px {max-width: 300px; width: 100%;}
.wm500px {max-width: 550px; width: 100%;}
.wmax800px {max-width: 800px; width: 100%;}
.wmax100_ {max-width: 100%; }

.h18px {height: 18px;}
.h20px {height: 20px;}
.h25px {height: 25px;}
.h30px {height: 30px;}
.h40px {height: 40px;}
.h45px {height: 45px;}
.h50px {height: 50px;}
.h75px {height: 75px;}
.h55px {height: 85px;}
.h100px {height: 100px;}
.h200px {height: 200px;}
.h300px {height: 300px;}
.h400px {height: 400px;}
.h500px {height: 500px;}
.h130px {height: 130px;}
.h150px {height: 150px;}
.h600px {height: 600px;}

.Required {display: none;}
/********************************* OTROS ***************************************************/
h2 {padding: 5px; padding-left: 0px; margin: 0px; color: #49B52B; font-size: 150%;}
h3 {padding:  5px; padding-left: 0px; margin: 0px; color: black; font-size: 120%;}
.fColor1 {background-color: #90FF7A; } /* mascota encontrada*/
.fColor2 {background-color: #FF7F7F; } /* mascota perdida*/
.fColor3 {background-color: #F7EA5D; } /* mascota en adopcion*/
.fColor4 {background-color: #99B9FF; } /* mascota transito*/

.DivMsgDenunciada{ height: 200px; text-align: center; padding-top: 100px;}

.br1pxg {border-right: 1px solid  #AAA;}

.bl1_d_g {border-left: 1px dashed #ccc;}
.bt1_d_g {border-top: 1px dashed #444;}
.bt1pxGris {border-top: 1px solid #ccc;}
.BtnVerde {background-color:  #CBEA75; border: 1px solid #AED350; font-size: 100%;}
.BtnAmarillo {background-color:  #F7CE02; border:  0px solid #DDD835; font-size: 100%;}
.BtnNaranja {background-color:  #F2C548; border:  0px solid #DBA634; font-size: 100%;}
.BtnMasPublicaciones {background-color:  #FFBB00; border: 0px solid #dba634; font-size: 100%; padding: 6px; border-radius: 3px; cursor: pointer; transition: 0.25s;}
.BtnMasPublicaciones:hover {background-color:  #FFE399; transition: 0.25s;}
.BtnGris {background-color: #383838;  border: 0px; font-size: 100%; color: #fff; }
.BtnAzul {background-color: #0029de;  border: 0px; font-size: 100%; color: #fff; }
.BtnRojo {background-color: #AF1F22;  border: 0px; font-size: 100%; color: #fff; }
.BtnVerde2 {background-color: #19BC00;  border: 0px; font-weight: bold; font-size: 100%; color: #fff; }

.fPass {font: 100% Pass !important;}
.fBlanco {background-color: white;}
.fVerde {background-color:  #9ECE25;}
.fAmarillo {background-color: #F7CE02;}
.fNaranja {background-color: #FFC849;}
.fGris2{background-color:  #D3D3D3;}
.fRojo {background-color:  #EF7353;} /*C46D6B;}*/
.fGris {background-color:  #E5E5E5;}
.fGrisClaro {background-color:  #fafafa;}

.tAzul{color:  #00f;}
.tBlanco {color:  #ffffff;}
.tVerde {color:  #49b52b;}
.tMarron {color: #d52b2b}
.tNaranja {color:  #E89B17}
.tGris {color:  grey;}
.tNegro {color:  black;}

.b0px {border: 0px;}
.bt5pxVerde {border-top: 5px solid #49b52b;}
.bGris {border:  1px solid #c0c0c0;}
.bR_1d_G {border-right: 1px dashed #ccc;}
.b1pxNegro {border: 1px solid black;}
.b1pxGris {border: 1px solid grey;}
.bR2px {border-radius: 6px;}
.p2px {padding: 2px;}
.p5px {padding: 5px;}
.p20px {padding: 20px;}
.p10px {padding: 10px;}
.pt5px {padding-top: 5px;}
.pt10px {padding-top: 10px;}
.pt20px {padding-top: 20px;}
.pt50px {padding-top: 50px;}

.pr15px{padding-right: 15px;}

.pl5px{padding-left: 5px;}
.pl10px{padding-left: 10px;}
.pl15px{padding-left: 15px;}
.pl30px{padding-left: 30px;}

.mt10px {margin-top:  10px;}
.mt20px {margin-top:  20px;}
.mt50px {margin-top:  50px;}
.mt100px {margin-top:  100px;}
.mr10px {margin-right:  10px;}
.mt0px {margin-top:  0px;}
.mb15px {margin-bottom:  15px;}
.m0px {margin:  0px;}
.m1px {margin:  1px;}
.m2px {margin:  2px;}
.m5px {margin:  5px;}
.c {font-style: italic;}
.n {font-weight: bold;}
._n {font-weight: normal;}
.u {text-decoration: underline;}
.fLeft {float: left;}
.fwn {font-weight: normal;}
.fRight {float: right;}
.center {text-align: center;}
.left {text-align: left;}
.right {text-align: right;}
.cBoth {clear:  both;}
.dInLine {display: inline-block;}
.dNone {display: none;}
.dBlock {display: block;}
.Hidden {visibility: hidden ;}
.oHidden {overflow: hidden ;}
.oScrollY {overflow-y: scroll}
.Visible {visibility: visible ;}
.vAlignB {vertical-align:  bottom;}
.vAlignT {vertical-align:  Top;}
.vAlignM {vertical-align:  middle;}
.cPointer {cursor: pointer;}

.ev_mm_u:hover {text-decoration: underline; }

.BtnAgregar{
  width:  24px;
  height: 20px;
  background: transparent url(../images/sprites.png) 2px 0  no-repeat;
  display: inline-block;
  cursor: pointer;
}
.BtnEditar {
  width:  24px;
  height: 20px;
  background: transparent url(../images/sprites.png) -22px 0 no-repeat;
  display: inline-block;
  cursor: pointer;
}

.BtnEliminar {
  width:  24px;
  height: 20px;
  background: transparent url(../images/sprites.png) -46px 0 no-repeat;
  display: inline-block;
  cursor: pointer;
}

/* ============ CSS para el PopUp de ventanas ============= */
#DivFondoConsulta {background-color: #000;  left:0; top:0px; width:0px; height:0px; position: absolute; display: none; z-index:1000; opacity: 0.75;}
#DivPanelRightFloat{ background-color: #fff; width: 0px; height: 100%; position: fixed; top:0; z-index: 1001; right: 0px; overflow: hidden; display: none}
.FondoMenuSesion {background: transparent url(../images/fmenusesion.jpg) center center no-repeat; width: 100%; height: 200px; border-top: 1px solid #fff; margin-bottom: 8px;}
.FondoMenuSesion_bw {background: transparent url(../images/fmenusesion_bw.jpg) center center no-repeat; width: 100%; height: 200px; border-top: 1px solid #fff; margin-bottom: 8px;}

#DivFondo{background-color: #000;  left:0; top:0px; width:0px; height:0px; position: absolute; display: none; z-index:100; opacity: 0.75;}
#ImgProgreso {position: absolute; visibility: hidden; z-index: 103; border: 0px solid #404040; background-color: transparent; border-radius: 3px;}
#FrameData {position: absolute; border-radius: 0px; margin:0px; padding: 0px; display: none; z-index: 116; background-color: #fff; box-shadow: 25px 25px 25px #000; }

#DivFondo2{background-color: #000;  left:0; top:0px; width:0px; height:0px; position: absolute; display: none; z-index:120; opacity: 0.75;}
#FrameData2 {position: absolute; border-radius: 0px; margin:0px; padding: 0px; display: none; z-index: 121; background-color: #fff;}

#DivFondoIFrame{background-color: #000;  left:0; top:0px; width:0px; height:0px; position: absolute; display: none; z-index:90; opacity: 0.75;}
#IFrame {position: absolute; border-radius: 0px; padding: 0px; margin: 0px; display: none; z-index: 91; background-color: #fff; box-shadow: 50px 50px 50px #000;}

#DivFondoHelp {background-color: #000; left:0; top:0px; width:0px; height:0px; position: absolute; display: none; z-index:110; opacity: 0.25;}
#DivHelp {border: 0px solid #888;  position: absolute; border-radius: 5px; padding: 3px; margin: 0px; display: none; z-index: 111; background-color: #fff; box-shadow: 2px 2px 4px #888;}
.FlechaPopUp {display: block; position: absolute;  width: 19px; height: 13px; background: transparent url('../images/sprites.png') -141px -31px no-repeat; margin-top: -16px; left: 0px;}

#DivBubble {border: 0px solid #888;  position: absolute; border-radius: 5px; padding: 3px; margin: 0px; display: none; z-index: 111; background-color: #ffd52d; box-shadow: 2px 2px 4px #888;}
.FlechaBubbleLeft {display: none; position: absolute;  width: 20px; height: 29px; background: transparent url('../images/sprites.png') -140px 0 no-repeat; margin-top: 0px; left: -20px; }
.FlechaBubbleTop {display: none; position: absolute;  width: 29px; height: 20px; background: transparent url('../images/sprites.png') -163px 0 no-repeat; margin-top: -20px; left: 0px;}

#BtnCerrarPopUp {display: none; position: fixed; top: 5px; right: 5px; width: 50px; height: 50px; background: url(../images/sprites.png) -220px -120px no-repeat ; z-index: 120; cursor:pointer;}
/* ======================================================== */

.DLLista {list-style-position: outside; margin: 0px;}
.DLLista dt{color: black; font-weight: normal; cursor: pointer; text-decoration: none; background-color: #fff; transition: 0.25s;}
.DLLista dd{background-color: #f0f0f0; margin:0px; padding: 2px; margin-left: 2px; cursor: pointer; }
.pMensaje {margin: 0px; padding: 2px; margin-top: 0px;}
.pMensaje:hover {background-color: #ddd;} 
.pMensaje .MarcarLeido {float: right; display: block; width: 8px; height: 8px; background-color: #666; border-radius: 4px; }

/********************************* FOOTER ***************************************************/
.ul_Pie {list-style: none; padding:  0px; margin:  0px; width: 100%; overflow: hidden;}
.ul_Pie li {float: left; width: 30%; height: 120px; padding: 5px; border: 0px solid red;}


.TagAmarillo {background-color: transparent; border-radius: 2px; padding: 3px; font-weight: bold; color: #444; font-size: 90%; margin: 1px; display: inline-block; transition: 0.25s;}
.TagAmarillo:hover {background-color: #808080; color:  #fff; transition: 0.25s;} 

#RMPie {font-size: 200%; color: black; font-weight: bold;}

/********************************* AYUDA ***************************************************/
dt {color:  #50C950; font-size: 110%; cursor: pointer;}
dd {font-size: 90%; padding-top:  15px;}

.Seccion {padding-top: 5px; padding-bottom: 5px; width: 98%; cursor: pointer; border-radius: 2px; padding-left: 4px;}
.Seccion:hover {background-color: #FFF09B; }
.Seccion_Selected {background-color: #FFE630; }

.DataSeccion {font-size: 14px; line-height: 25px; }
.DataSeccion p {margin: 5px; }

.SpashSitio {width: 400px; background-color: #fff;}
/********************************* PUBLIC USER PROFILE***************************************************/

.InfoUsuario{
  border: 1px solid #ddd;
  border-radius: 4px;
  background-color: #fafafa;
  width: 99%;
  margin: 2px;
  font-size: 14px;
  margin-left:  auto;
  margin-right: auto;
  }
.InfoUsuario .Titulo {margin: 2px; font-size: 16px; font-weight: bold; border-radius: 2px; padding: 8px; border-bottom: 0px dotted #ccc; background-color: #ddd;}
.InfoUsuario .Fecha {color:  #444; font-size: 14px; margin: 2px; text-align: right; float: right; font-size:  12px;}
.InfoUsuario .Barra {background-color: #DBC925; border-radius: 4px;  color:  white; font-size:  14px; padding: 4px; margin: 2px; font-weight: bold; }

.ListPUser .DivRecuadro {border: 1px solid #ccc; border-radius: 4px; box-shadow:  0 0 8px #eee; background-color:  #fcfcfc;  width: 300px; height: 420px; margin: 20px; font-size: 14px; float:left; transition: 0.25s; }
.ListPUser .DivRecuadro:hover {box-shadow:  0 0 4px 2px #E8DD12; background-color: #fffed3; border:  1px solid #DBD11A; transition: 0.25s; }
.ListPUser .DivRecuadro .Titulo {margin:2px; font-size: 14px; font-weight: bold; border-radius: 2px; padding: 4px; border-bottom:  1px dotted #ccc; }

.ListPUser .DivRecuadro .Fecha {color: #444; font-size: 11px; margin: 2px; text-align: right; float: right;}
.ListPUser .Caract {display: inline-block; border: 0px solid #f0f0f0; background-color: #D6CF4D; color: #fafafa; font-weight: bold; border-radius: 2px; padding: 2px; padding-left: 5px; padding-right: 5px; margin: 1px;  font-size: 80%; transition: 0.25s;}
.ListPUser .Caract:hover {background-color: #888; color: #fff; border-color: #888; box-shadow: 0 0 4px #ccc; transition: 0.25s;}
.ListPUser .DivRecuadro .Foto {width:  270px; border: 1px solid #C0C0C0; border-radius: 4px; margin:  6px; box-shadow: 0 0 10px #ccc; padding: 5px; background-color:  #fff; }
.ListPUser .DivRecuadro .Descripcion { font-size:  12px; border-top: 1px dotted #ccc;  border-bottom: 1px dotted #ccc; width:  90%; overflow: hidden; height: 50px; background-color: transparent; padding: 4px; margin:  auto;}
.ListPUser .DivRecuadro .Ubicacion { background-color: #aaa; border-radius: 2px;  color:  white; font-size:  12px; padding: 2px; margin: 2px; font-weight: bold; }
.ListPUser .DivRecuadro .OtrosDatos{ width: 100%; padding: 2px; margin:0px; }
.ListPUser .DivRecuadro .SpanBoton {display: inline-block; padding: 4px; border: 1px solid #EFEEBA; text-align: center; background-color: #FFFDE5; border-radius: 2px; width: 90%; margin: 2px; }

.b2pxNaranja {border: 2px solid #FFAE00;}

.t200_ { font-size: 200%;}
.t150_ { font-size: 150%;}
.t130_ { font-size: 130%;}
.t120_ { font-size: 120%;}
.t110_ { font-size: 110%;}
.t100_ { font-size: 100%;}
.t90_ { font-size: 90%;}
.t80_ { font-size: 80%;}
.t70_ { font-size: 70%;}

.t18px { font-size: 120%;}
.t16px { font-size: 100%;}
.t14px { font-size: 90%;}
.t12px { font-size: 80%;}
.t11px { font-size: 75%;}
.t10px { font-size: 60%;}

.t100_ {font-size: 100%;}
.t90_ {font-size: 90%;}
.t80_ {font-size: 80%;}
.t70_ {font-size: 70%;}

.DivLateral {border-left: 0px dashed #ccc; padding-left: 4px; width: 100%; }
.DivLateral2 {border-left: 1px dashed #ccc; background-color: #fff;  padding-left: 4px; overflow-y: scroll; width: 100%; height: 100%;}

.ContMensajesNuevos {visibility: hidden;}
/* ======================================================================
  ESTILOS PARA EL DATEPICKER
  =======================================================================*/
.SpanDatePicker{display: inline-block;  width: 16px; height: 16px; background: transparent url(../images/datepicker.gif) no-repeat; margin-left: 5px;}
div.datepicker {position: relative; z-index: 1005; font-family: Arial, Helvetica, sans-serif; width: 196px; height: 147px; position: absolute; cursor: default; top: 0; left: 0; display: none;}
.datepickerContainer { border: 1px solid #808080; background: #fafafa; position: absolute; top: 10px; left: 10px;  padding:  4px; border-radius: 3px; box-shadow: 2px 2px 4px #c0c0c0}
.zdatepickerBorderT { position: absolute; left: 10px; top: 0; right: 10px; height: 10px;}
.zdatepickerBorderB { position: absolute; left: 10px; bottom: 0; right: 10px; height: 10px;}
.zdatepickerBorderL { position: absolute; left: 0; bottom: 10px; top: 10px; width: 10px;}
.zdatepickerBorderR { position: absolute; right: 0; bottom: 10px; top: 10px; width: 10px;}
.zdatepickerBorderTL { position: absolute; top: 0; left: 0; width: 10px; height: 10px;}
.zdatepickerBorderTR { position: absolute; top: 0; right: 0; width: 10px; height: 10px;}
.zdatepickerBorderBL { position: absolute; bottom: 0; left: 0; width: 10px; height: 10px;}
.zdatepickerBorderBR { position: absolute; bottom: 0; right: 0; width: 10px; height: 10px;}
.datepickerHidden { display: none; }
div.datepicker table { border-collapse:collapse;}
div.datepicker a { color: #444; text-decoration: none; cursor: default; outline: none;}
div.datepicker table td { text-align: right; padding: 0; margin: 0;}
div.datepicker th { text-align: center; color: #000; font-weight: normal; background: #C4C423;} /*  */
div.datepicker tbody th {	text-align: left;}
div.datepicker tbody a { display: block;}
.datepickerDays a { width: 24px; line-height: 16px; height: 20px; text-align: center; font-size:  13px;}
.datepickerYears a, .datepickerMonths a{ width: 44px; line-height: 36px; height: 36px; text-align: center; }
td.datepickerNotInMonth a { color: #a0a0a0; }
tbody.datepickerDays td.datepickerSelected { background: #136A9F;}
tbody.datepickerDays td.datepickerSelected a{ color: white; font-weight: bold;}
tbody.datepickerDays td.datepickerNotInMonth.datepickerSelected { background: #17384d; }
tbody.datepickerYears td.datepickerSelected, tbody.datepickerMonths td.datepickerSelected {background: #17384d;}
div.datepicker a:hover, div.datepicker a:hover { color: white; font-weight: bold; background-color: #404040; transition: 0.25s;}
div.datepicker td.datepickerNotInMonth a:hover { color: white; background-color:  #c0c0c0; transition: 0.25s;}
div.datepicker tbody th { text-align: left;}
.datepickerSpace div { width: 20px;}
.datepickerGoNext a, .datepickerGoPrev a, .datepickerMonth a { text-align: center; height: 20px; line-height: 20px;}
.datepickerGoNext a { float: right; width: 20px;}
.datepickerGoPrev a { float: left; width: 20px;}
table.datepickerViewDays tbody.datepickerMonths, table.datepickerViewDays tbody.datepickerYears { display: none;}
table.datepickerViewMonths tbody.datepickerDays, table.datepickerViewMonths tbody.datepickerYears, table.datepickerViewMonths tr.datepickerDoW { display: none;}
table.datepickerViewYears tbody.datepickerDays, table.datepickerViewYears tbody.datepickerMonths, table.datepickerViewYears tr.datepickerDoW { display: none;}
td.datepickerDisabled a, td.datepickerDisabled.datepickerNotInMonth a{ color: #333; transition: 0.25s;}
td.datepickerDisabled a:hover { color: #333; transition: 0.25s;}
td.datepickerSpecial a { background: #700;}
td.datepickerSpecial.datepickerSelected a { background: #a00;}

/********************************* IMPRIMIR CARTEL ***************************************************/
.Imprimir_Anuncio {border: 0px solid #c0c0c0; width: 800px;}
.Imprimir_Anuncio td{padding: 4px;}
.Imprimir_Anuncio .Imagen {border: 1px solid #c0c0c0; width: 82px; height: 61px; margin-top: 2px; cursor: pointer;}
.Imprimir_Anuncio #ImgPrincipal {border: 2px solid #D6B10E; width:640px; }
.Imprimir_Anuncio .Titulo {display: inline-block; width:550px; color: black; font-size: 20px; text-align: center;}
.Imprimir_Anuncio .Subtitulo {border-bottom: 1px solid #c0c0c0; font-weight: bold; font-size: 14px; margin-bottom: 5px; display: inline-block; width: 98%; margin-left: 0px; text-align: center;}
.Imprimir_Anuncio .Descripcion {display: inline-block; width: 720px; font-size: 13px; color: black;}
.Imprimir_Anuncio .Valor { font-size: 110%; font-weight: bold; padding: 10px;}
.Imprimir_Anuncio .Caract{ font-size: 110%; font-weight: bold; padding: 10px;}
.Imprimir_Anuncio .Seccion { font-size: 110%; padding-top: 20px; border-bottom:  1px solid #ccc;}

/********************************* Leaflet MAPAS ***************************************************/
.BtnVerMapa {padding: 5px; background-color: #cacaca; border: 1px solid #444; box-shadow: 0 0 8px #444; cursor: pointer;}
#DivMapa {height: 300px; z-index:0;}


.leaflet-pane,
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-tile-container,
.leaflet-pane > svg,
.leaflet-pane > canvas,
.leaflet-zoom-box,
.leaflet-image-layer,
.leaflet-layer {
	position: absolute;
	left: 0;
	top: 0;
	}
.leaflet-container {
	overflow: hidden;
	}
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow {
	-webkit-user-select: none;
	   -moz-user-select: none;
	        user-select: none;
	  -webkit-user-drag: none;
	}
/* Safari renders non-retina tile on retina better with this, but Chrome is worse */
.leaflet-safari .leaflet-tile {
	image-rendering: -webkit-optimize-contrast;
	}
/* hack that prevents hw layers "stretching" when loading new tiles */
.leaflet-safari .leaflet-tile-container {
	width: 1600px;
	height: 1600px;
	-webkit-transform-origin: 0 0;
	}
.leaflet-marker-icon,
.leaflet-marker-shadow {
	display: block;
	}
/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */
/* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */
.leaflet-container .leaflet-overlay-pane svg,
.leaflet-container .leaflet-marker-pane img,
.leaflet-container .leaflet-shadow-pane img,
.leaflet-container .leaflet-tile-pane img,
.leaflet-container img.leaflet-image-layer {
	max-width: none !important;
	max-height: none !important;
	}

.leaflet-container.leaflet-touch-zoom {
	-ms-touch-action: pan-x pan-y;
	touch-action: pan-x pan-y;
	}
.leaflet-container.leaflet-touch-drag {
	-ms-touch-action: pinch-zoom;
	/* Fallback for FF which doesn't support pinch-zoom */
	touch-action: none;
	touch-action: pinch-zoom;
}
.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
	-ms-touch-action: none;
	touch-action: none;
}
.leaflet-container {
	-webkit-tap-highlight-color: transparent;
}
.leaflet-container a {
	-webkit-tap-highlight-color: rgba(51, 181, 229, 0.4);
}
.leaflet-tile {
	filter: inherit;
	visibility: hidden;
	}
.leaflet-tile-loaded {
	visibility: inherit;
	}
.leaflet-zoom-box {
	width: 0;
	height: 0;
	-moz-box-sizing: border-box;
	     box-sizing: border-box;
	z-index: 800;
	}
/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
.leaflet-overlay-pane svg {
	-moz-user-select: none;
	}

.leaflet-pane         { z-index: 400; }

.leaflet-tile-pane    { z-index: 200; }
.leaflet-overlay-pane { z-index: 400; }
.leaflet-shadow-pane  { z-index: 500; }
.leaflet-marker-pane  { z-index: 600; }
.leaflet-tooltip-pane   { z-index: 650; }
.leaflet-popup-pane   { z-index: 700; }

.leaflet-map-pane canvas { z-index: 100; }
.leaflet-map-pane svg    { z-index: 200; }

.leaflet-vml-shape {
	width: 1px;
	height: 1px;
	}
.lvml {
	behavior: url(#default#VML);
	display: inline-block;
	position: absolute;
	}


/* control positioning */

.leaflet-control {
	position: relative;
	z-index: 800;
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}
.leaflet-top,
.leaflet-bottom {
	position: absolute;
	z-index: 1000;
	pointer-events: none;
	}
.leaflet-top {
	top: 0;
	}
.leaflet-right {
	right: 0;
	}
.leaflet-bottom {
	bottom: 0;
	}
.leaflet-left {
	left: 0;
	}
.leaflet-control {
	float: left;
	clear: both;
	}
.leaflet-right .leaflet-control {
	float: right;
	}
.leaflet-top .leaflet-control {
	margin-top: 10px;
	}
.leaflet-bottom .leaflet-control {
	margin-bottom: 10px;
	}
.leaflet-left .leaflet-control {
	margin-left: 10px;
	}
.leaflet-right .leaflet-control {
	margin-right: 10px;
	}


/* zoom and fade animations */

.leaflet-fade-anim .leaflet-tile {
	will-change: opacity;
	}
.leaflet-fade-anim .leaflet-popup {
	opacity: 0;
	-webkit-transition: opacity 0.2s linear;
	   -moz-transition: opacity 0.2s linear;
	     -o-transition: opacity 0.2s linear;
	        transition: opacity 0.2s linear;
	}
.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
	opacity: 1;
	}
.leaflet-zoom-animated {
	-webkit-transform-origin: 0 0;
	    -ms-transform-origin: 0 0;
	        transform-origin: 0 0;
	}
.leaflet-zoom-anim .leaflet-zoom-animated {
	will-change: transform;
	}
.leaflet-zoom-anim .leaflet-zoom-animated {
	-webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);
	   -moz-transition:    -moz-transform 0.25s cubic-bezier(0,0,0.25,1);
	     -o-transition:      -o-transform 0.25s cubic-bezier(0,0,0.25,1);
	        transition:         transform 0.25s cubic-bezier(0,0,0.25,1);
	}
.leaflet-zoom-anim .leaflet-tile,
.leaflet-pan-anim .leaflet-tile {
	-webkit-transition: none;
	   -moz-transition: none;
	     -o-transition: none;
	        transition: none;
	}

.leaflet-zoom-anim .leaflet-zoom-hide {
	visibility: hidden;
	}


/* cursors */

.leaflet-interactive {
	cursor: pointer;
	}
.leaflet-grab {
	cursor: -webkit-grab;
	cursor:    -moz-grab;
	}
.leaflet-crosshair,
.leaflet-crosshair .leaflet-interactive {
	cursor: crosshair;
	}
.leaflet-popup-pane,
.leaflet-control {
	cursor: auto;
	}
.leaflet-dragging .leaflet-grab,
.leaflet-dragging .leaflet-grab .leaflet-interactive,
.leaflet-dragging .leaflet-marker-draggable {
	cursor: move;
	cursor: -webkit-grabbing;
	cursor:    -moz-grabbing;
	}

/* marker & overlays interactivity */
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-image-layer,
.leaflet-pane > svg path,
.leaflet-tile-container {
	pointer-events: none;
	}

.leaflet-marker-icon.leaflet-interactive,
.leaflet-image-layer.leaflet-interactive,
.leaflet-pane > svg path.leaflet-interactive {
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}

/* visual tweaks */

.leaflet-container {
	background: #ddd;
	outline: 0;
	}
.leaflet-container a {
	color: #0078A8;
	}
.leaflet-container a.leaflet-active {
	outline: 2px solid orange;
	}
.leaflet-zoom-box {
	border: 2px dotted #38f;
	background: rgba(255,255,255,0.5);
	}


/* general typography */
.leaflet-container {
	font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
	}


/* general toolbar styles */

.leaflet-bar {
	box-shadow: 0 1px 5px rgba(0,0,0,0.65);
	border-radius: 4px;
	}
.leaflet-bar a,
.leaflet-bar a:hover {
	background-color: #fff;
	border-bottom: 1px solid #ccc;
	width: 26px;
	height: 26px;
	line-height: 26px;
	display: block;
	text-align: center;
	text-decoration: none;
	color: black;
	}
.leaflet-bar a,
.leaflet-control-layers-toggle {
	background-position: 50% 50%;
	background-repeat: no-repeat;
	display: block;
	}
.leaflet-bar a:hover {
	background-color: #f4f4f4;
	}
.leaflet-bar a:first-child {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	}
.leaflet-bar a:last-child {
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	border-bottom: none;
	}
.leaflet-bar a.leaflet-disabled {
	cursor: default;
	background-color: #f4f4f4;
	color: #bbb;
	}

.leaflet-touch .leaflet-bar a {
	width: 30px;
	height: 30px;
	line-height: 30px;
	}
.leaflet-touch .leaflet-bar a:first-child {
	border-top-left-radius: 2px;
	border-top-right-radius: 2px;
	}
.leaflet-touch .leaflet-bar a:last-child {
	border-bottom-left-radius: 2px;
	border-bottom-right-radius: 2px;
	}

/* zoom control */

.leaflet-control-zoom-in,
.leaflet-control-zoom-out {
	font: bold 18px 'Lucida Console', Monaco, monospace;
	text-indent: 1px;
	}

.leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out  {
	font-size: 22px;
	}


/* layers control */

.leaflet-control-layers {
	box-shadow: 0 1px 5px rgba(0,0,0,0.4);
	background: #fff;
	border-radius: 5px;
	}
.leaflet-control-layers-toggle {
	background-image: url(images/layers.png);
	width: 36px;
	height: 36px;
	}
.leaflet-retina .leaflet-control-layers-toggle {
	background-image: url(images/layers-2x.png);
	background-size: 26px 26px;
	}
.leaflet-touch .leaflet-control-layers-toggle {
	width: 44px;
	height: 44px;
	}
.leaflet-control-layers .leaflet-control-layers-list,
.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
	display: none;
	}
.leaflet-control-layers-expanded .leaflet-control-layers-list {
	display: block;
	position: relative;
	}
.leaflet-control-layers-expanded {
	padding: 6px 10px 6px 6px;
	color: #333;
	background: #fff;
	}
.leaflet-control-layers-scrollbar {
	overflow-y: scroll;
	overflow-x: hidden;
	padding-right: 5px;
	}
.leaflet-control-layers-selector {
	margin-top: 2px;
	position: relative;
	top: 1px;
	}
.leaflet-control-layers label {
	display: block;
	}
.leaflet-control-layers-separator {
	height: 0;
	border-top: 1px solid #ddd;
	margin: 5px -10px 5px -6px;
	}

/* Default icon URLs */
.leaflet-default-icon-path {
	background-image: url(../images/marker-icon.png);
	}


/* attribution and scale controls */

.leaflet-container .leaflet-control-attribution {
	background: #fff;
	background: rgba(255, 255, 255, 0.7);
	margin: 0;
	}
.leaflet-control-attribution,
.leaflet-control-scale-line {
	padding: 0 5px;
	color: #333;
	}
.leaflet-control-attribution a {
	text-decoration: none;
	}
.leaflet-control-attribution a:hover {
	text-decoration: underline;
	}
.leaflet-container .leaflet-control-attribution,
.leaflet-container .leaflet-control-scale {
	font-size: 11px;
	}
.leaflet-left .leaflet-control-scale {
	margin-left: 5px;
	}
.leaflet-bottom .leaflet-control-scale {
	margin-bottom: 5px;
	}
.leaflet-control-scale-line {
	border: 2px solid #777;
	border-top: none;
	line-height: 1.1;
	padding: 2px 5px 1px;
	font-size: 11px;
	white-space: nowrap;
	overflow: hidden;
	-moz-box-sizing: border-box;
	     box-sizing: border-box;

	background: #fff;
	background: rgba(255, 255, 255, 0.5);
	}
.leaflet-control-scale-line:not(:first-child) {
	border-top: 2px solid #777;
	border-bottom: none;
	margin-top: -2px;
	}
.leaflet-control-scale-line:not(:first-child):not(:last-child) {
	border-bottom: 2px solid #777;
	}

.leaflet-touch .leaflet-control-attribution,
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	box-shadow: none;
	}
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	border: 2px solid rgba(0,0,0,0.2);
	background-clip: padding-box;
	}


/* popup */

.leaflet-popup {
	position: absolute;
	text-align: center;
	margin-bottom: 20px;
	}
.leaflet-popup-content-wrapper {
	padding: 1px;
	text-align: left;
	border-radius: 12px;
	}
.leaflet-popup-content {
	margin: 13px 19px;
	line-height: 1.4;
	}
.leaflet-popup-content p {
	margin: 18px 0;
	}
.leaflet-popup-tip-container {
	width: 40px;
	height: 20px;
	position: absolute;
	left: 50%;
	margin-left: -20px;
	overflow: hidden;
	pointer-events: none;
	}
.leaflet-popup-tip {
	width: 17px;
	height: 17px;
	padding: 1px;

	margin: -10px auto 0;

	-webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	     -o-transform: rotate(45deg);
	        transform: rotate(45deg);
	}
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
	background: white;
	color: #333;
	box-shadow: 0 3px 14px rgba(0,0,0,0.4);
	}
.leaflet-container a.leaflet-popup-close-button {
	position: absolute;
	top: 0;
	right: 0;
	padding: 4px 4px 0 0;
	border: none;
	text-align: center;
	width: 18px;
	height: 14px;
	font: 16px/14px Tahoma, Verdana, sans-serif;
	color: #c3c3c3;
	text-decoration: none;
	font-weight: bold;
	background: transparent;
	}
.leaflet-container a.leaflet-popup-close-button:hover {
	color: #999;
	}
.leaflet-popup-scrolled {
	overflow: auto;
	border-bottom: 1px solid #ddd;
	border-top: 1px solid #ddd;
	}

.leaflet-oldie .leaflet-popup-content-wrapper {
	zoom: 1;
	}
.leaflet-oldie .leaflet-popup-tip {
	width: 24px;
	margin: 0 auto;

	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
	filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);
	}
.leaflet-oldie .leaflet-popup-tip-container {
	margin-top: -1px;
	}

.leaflet-oldie .leaflet-control-zoom,
.leaflet-oldie .leaflet-control-layers,
.leaflet-oldie .leaflet-popup-content-wrapper,
.leaflet-oldie .leaflet-popup-tip {
	border: 1px solid #999;
	}


/* div icon */

.leaflet-div-icon {
	background: #fff;
	border: 1px solid #666;
	}


/* Tooltip */
/* Base styles for the element that has a tooltip */
.leaflet-tooltip {
	position: absolute;
	padding: 6px;
	background-color: #fff;
	border: 1px solid #fff;
	border-radius: 3px;
	color: #222;
	white-space: nowrap;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	pointer-events: none;
	box-shadow: 0 1px 3px rgba(0,0,0,0.4);
	}
.leaflet-tooltip.leaflet-clickable {
	cursor: pointer;
	pointer-events: auto;
	}
.leaflet-tooltip-top:before,
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	position: absolute;
	pointer-events: none;
	border: 6px solid transparent;
	background: transparent;
	content: "";
	}

/* Directions */

.leaflet-tooltip-bottom {
	margin-top: 6px;
}
.leaflet-tooltip-top {
	margin-top: -6px;
}
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-top:before {
	left: 50%;
	margin-left: -6px;
	}
.leaflet-tooltip-top:before {
	bottom: 0;
	margin-bottom: -12px;
	border-top-color: #fff;
	}
.leaflet-tooltip-bottom:before {
	top: 0;
	margin-top: -12px;
	margin-left: -6px;
	border-bottom-color: #fff;
	}
.leaflet-tooltip-left {
	margin-left: -6px;
}
.leaflet-tooltip-right {
	margin-left: 6px;
}
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	top: 50%;
	margin-top: -6px;
	}
.leaflet-tooltip-left:before {
	right: 0;
	margin-right: -12px;
	border-left-color: #fff;
	}
.leaflet-tooltip-right:before {
	left: 0;
	margin-left: -12px;
	border-right-color: #fff;
	}