@charset "utf-8";
/* CSS Document */

:root {
    --bg: #1a1e24;
    --color: #009abf;
    --colorclaro: #ffffff;
    --colorsec: #ed713c; /*ea7f15*/
    --colorter: #949799;
    --font-family: 'Montserrat', Roboto, Helvetica, Arial, sans-serif;
}


header{
margin-top: 50px;
}
/*
@font-face {font-family: 'Hurme Geometric Sans 4'; src: url("//db.onlinewebfonts.com/t/379318324cafdcaafd6f5ca625146e49.eot"); src: url("//db.onlinewebfonts.com/t/379318324cafdcaafd6f5ca625146e49.eot?#iefix") format("embedded-opentype"), url("//db.onlinewebfonts.com/t/379318324cafdcaafd6f5ca625146e49.woff2") format("woff2"), url("//db.onlinewebfonts.com/t/379318324cafdcaafd6f5ca625146e49.woff") format("woff"), url("//db.onlinewebfonts.com/t/379318324cafdcaafd6f5ca625146e49.ttf") format("truetype"), url("//db.onlinewebfonts.com/t/379318324cafdcaafd6f5ca625146e49.svg#Hurme Geometric Sans No.4") format("svg"); }

@font-face {
  font-family: "Hurme";
  src: url('fonts/HurmeGeometricSans4.otf') format('opentype');
}
*/
/*
Full screen Modal
*/



.container h1{
margin-top: 30px;
margin-bottom: 30px;

font-size: 2em;
color: #FFFFFF;
text-align: center;
	font-weight:500;
/*	text-shadow: -1px 3px 0px rgba(66,66,66,0.97);*/
font-family: "Montserrat",  Helvetica, Arial, sans-serif;


}
.container-fluid h1{
margin-top: 30px;
margin-bottom: 30px;

font-size: 3em;
color: #FFFFFF;
text-align: center;
	font-weight:500;
/*	text-shadow: -1px 3px 0px rgba(66,66,66,0.97);*/
font-family: "Montserrat",  Helvetica, Arial, sans-serif;


}

.video {
	padding: 0!important;
  z-index: 1;
  min-width: 100%;
  min-height: 100%;
  height: auto;
	margin-top: 20px;
}



.navbar-dark ul.navbar-nav li.nav-item a{
/*    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;*/
 /*   font-family: "Hurme Geometric Sans 4",  Helvetica, Arial, sans-serif;*/
   font-family: "Montserrat",  Helvetica, Arial, sans-serif;
   font-size: .9em;
		color: #FFFFFF;
	font-weight: 400;
}

.navbar-dark ul.dropdown-menu {
		background-color: #009abf;
}

.navbar-dark ul.dropdown-menu li a{
/*		color: #ed713c!important;
		font-weight: 500!important;*/
	color: #FFFFFF;
/*text-shadow: 1px 1px 0 #ed713c, 1px -1px 0 #ed713c, -1px 1px 0 #ed713c, -1px -1px 0 #ed713c, 1px 0px 0 #ed713c, 0px 1px 0 #ed713c, -1px 0px 0 #ed713c, 0px -1px 0 #ed713c;*/


}

.navbar-dark ul.dropdown-menu li a:hover{
/*		color: #ed713c!important;
		font-weight: 500!important;*/
	color: #ed713c!important;
	font-weight: 700!important;
/*text-shadow: 1px 1px 0 #ed713c, 1px -1px 0 #ed713c, -1px 1px 0 #ed713c, -1px -1px 0 #ed713c, 1px 0px 0 #ed713c, 0px 1px 0 #ed713c, -1px 0px 0 #ed713c, 0px -1px 0 #ed713c;*/


}


.navbar-dark {
	background-color: #ed713c!important;
	background-color: #009abf!important;
}

.navbar.navbar-dark.bg-dark {
	background-color: #ed713c!important;
}


.check{
	position: fixed;
	margin-top: 50px;
/*	background-color: #ed713c;*/
	z-index: 2000;
}
.ul-vertical {
	list-style: none;
	margin: 00px;
	padding: 8px;
	display: block;
	text-align: center;
	list-style-type: none;
	z-index: 1001;


}
.ul-vertical li {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;

}
.ul-vertical li+li {
	margin-top: 8px;

}

.ul-vertical li p {
color:white;
}


.ul-vertical li img {
width: 80px;
}

.ul-vertical li img:hover {
    -webkit-transform:scale(1.5);
    -moz-transform:scale(1.5);
    -ms-transform:scale(1.5);
    -o-transform:scale(1.5);
    transform:scale(1.5);
}

.ul-vertical i{
    color: var(--color);

	font-size: 2rem;

}

.ul-vertical i:hover{
	font-size: 2.5rem;
  font-family: "Montserrat",  Helvetica, Arial, sans-serif;


}




.vertical label{
	color: white;
	margin-top: 2.5%;
	display: block;

}
.my-fixed-item {
	text-align: center;
position: fixed;


}


.vertical h2 {
	padding-top: 15px;
	padding-bottom: 5px;
	color: black;
	font-size:1rem;
  font-family: "Montserrat",  Helvetica, Arial, sans-serif;
  
}


.ul-vertical img{width:50px }

.video-container
{
margin-top: 5px;
top: 0%;
width: 100%;
height: auto;
float:right;
overflow: hidden;
border-radius: 10px;
box-shadow: 0 0 15px #3f4040;
background: #000000;
z-index: 2;

}


.caja-texto-encima{
    position: relative;
    display: inline-block;

}

.card h1 {
  color: var(--colorsec);
font-family: "Montserrat";	font-weight:800;
/*	text-shadow: -1px 4px 0px rgba(66,66,66,0.97);*/
	font-size: 3em;

}

.texto-encima2 {
  position: relative;
  top: 20%;
font-family: "Montserrat";
	font-size: 1.5em;
/*	color: rgba(255,104,1,0.97);*/
color: var(--colorter);
font-weight: 700;

}

.card-img-overlay fancybox a {
height: 25px;
line-height: 25px;
text-align: left;
text-decoration: none;
padding: 4px;
color: black;
font-family: "Montserrat",  Helvetica, Arial, sans-serif;

}

.card-img-overlay fancybox a:after {
border-color: transparent transparent transparent #009be0;
border-style: solid;
border-width: 16px 13px 13px 13px ;
content: "";
float: right;
right:-26px;
height: 0;
top: 0;
width: 0;
}

.contenidocel {
	display: none;
	margin: 0;
	width: 100%;
}

.centradocultura {
  margin: 1rem;
  padding: 1rem;
  /* IMPORTANTE */
  text-align: center;
	width: 100%;
  border-radius: 5%;
  font-family: "Montserrat",  Helvetica, Arial, sans-serif;

 /* background: radial-gradient(#805d78,rgba(0,0,0,0) 70%);*/


}

.centradorecomenda {
  margin-top: -20px;
  margin: 0px;
  padding: 0rem;
  text-align: center;
	width: 90%;
  float: right;
  font-family: "Montserrat",  Helvetica, Arial, sans-serif;

}

.centradocultura img {
  width: 300px;
  height: 300px;
  border-radius: 50%;
	padding: 5px;
  background: radial-gradient(#805d78,rgba(255, 255, 255) 10%);
filter: drop-shadow(-2px 2px 15px rgba(255, 255, 255, 1.0));

}

.centradosinfondo {
  margin: 1rem;
  padding: 1rem;
  /* IMPORTANTE */
  text-align: center;
	width: 100%;
  font-family: "Montserrat",  Helvetica, Arial, sans-serif;

}

.centradosinfondo img {
	width: 500px;
	height:500px;
	padding-bottom: 20px;
}


.centradoac {
  margin: 1rem;
  padding: 1rem;
  /* IMPORTANTE */
  text-align: center;
	width: 100%;
  font-family: "Montserrat",  Helvetica, Arial, sans-serif;

}

.centradoac img {
	width: 150px;
	height:150px;

}

.centrado {
  margin: 1rem;
  padding: 1rem;
  /* IMPORTANTE */
  text-align: center;
  font-family: "Montserrat",  Helvetica, Arial, sans-serif;

}

.centrado img {
	width: 100%;
}

.cajared {
  margin: 1rem;
  padding: 1rem;
  /* IMPORTANTE */
  text-align: center;
	width: 100%;
background-color: #009abf;
	-moz-transform: rotate(2deg);
-webkit-transform: rotate(2deg);
-o-transform: rotate(2deg);
-ms-transform: rotate(2deg);
transform: rotate(2deg);
-webkit-box-shadow: 0px 8px 19px 7px rgba(237,113,60,0.8);
box-shadow: 0px 8px 19px 7px rgba(4,17,62,0.8);
border: 5px inset #ed713c;
border-radius: 14px 0px 0px 17px;

}

.cajared:hover {

-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
-ms-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-box-shadow: 0px 8px 19px 7px rgba(4,17,62,0.8);
box-shadow: 0px 8px 19px 7px rgba(4,17,62,0.8);
border: 5px inset #ed713c;
border-radius: 14px 0px 0px 17px;
}


.cajared2 {
  margin: 1rem;
  padding: 1rem;
  /* IMPORTANTE */
  text-align: center;
	width: 100%;
background-color: #009abf;
-moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
-o-transform: rotate(-2deg);
-ms-transform: rotate(-2deg);
transform: rotate(-2deg);
-webkit-box-shadow: 0px 8px 19px 7px rgba(237,113,60,0.8);
box-shadow: 0px 8px 19px 7px rgba(4,17,62,0.8);
border: 5px inset #ed713c;
border-radius: 14px 0px 0px 17px;


}

.cajared2:hover {


-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
-ms-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-box-shadow: 0px 8px 19px 7px rgba(4,17,62,0.8);
box-shadow: 0px 8px 19px 7px rgba(4,17,62,0.8);
border: 5px inset #ed713c;
border-radius: 14px 0px 0px 17px;
}

.fb-post{
width: 100%!important;

}



@media only screen and (min-width:1024px) {
.centradoac {
    background:rgba(0, 154, 191);

}

	.fancybox p{display: none;}
}


.fancybox {

padding: .7em;

}

	.fancybox p{
		padding-bottom: 2em;
		text-align: center;
		line-height: normal;
color: var(--colorter)	;
		font-weight: 500;
}



.photos {
    position:absolute;
	display: block;
	margin-top: 0px;
}
.photos > div {
	background: #009abf;
    border: 2px solid #ffffff;
	opacity: .5;
    height: 150px;
    margin: 10px;
    overflow: hidden;
    position: relative;
    width: 100%;
    z-index: 1;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
     -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
	   cursor: pointer;

}

.photos > div img{
    width: 100%;
}
.photos > div:hover{
	margin-top: 200px;
	margin-left: 200px;
	opacity: 1;
	height: 90%;/* tamaño al pasar el mouse*/
    z-index: 10;
    -webkit-transform:scale(2);
    -moz-transform:scale(2);
    -ms-transform:scale(2);
    -o-transform:scale(2);
    transform:scale(2);
}
.campana img:hover{
	margin-top: 50px;
	margin-left: -10px;
	opacity: 1;
	height: 90%;/* tamaño al pasar el mouse*/
    z-index: 99999999;
    -webkit-transform:scale(1.5);
    -moz-transform:scale(1.5);
    -ms-transform:scale(1.5);
    -o-transform:scale(1.5);
    transform:scale(1.5);
}
/*
.photos > div div {
	
    background: url(../images/hover.gif) repeat scroll 0 0 transparent;
    cursor: pointer;
    height: 100%;
    margin-left: 200;
    opacity: 0.5;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 15;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
	
}


.photos > div:nth-child(1):hover div {


    height: 0%;
}

*/
.photos > div:nth-child(2):hover {
    height: 0%;
    margin-top: 50px;
}
.photos > div:nth-child(3):hover  {
    margin-left: 200px;
   margin-top: -100px;

}
.photos > div:nth-child(4):hover {
    margin-left: 200px;
   margin-top: -250px;
}
.photos > div.pair div {
    width: 50%;
}
.photos > div.pair div:nth-child(odd) {
    margin-left: 150px;
}
.photos > div.pair:hover div {
    width: 0%;
}
.photos > div.pair:hover div:nth-child(odd) {
    margin-left: 300px;
}


.photos .mascara {
opacity: 0;
background-color: rgba(46,157,120, 0.7);
transition: all 0.3s ease-in-out;
}
.photos h2 {
font-size: .7em;
color: #edbb07;
font-weight: bold;
transform: translateX(-200px);/*Desplazamos a la izquierda*/
opacity: 0;
transition: all 0.7s ease-in-out;
}
.photos p {
margin-top: 5px;
margin-left: 10px;
margin-right: 10px;
text-align: justify;
line-height: 140%;
font-size: .4em;
color: white;
transform: translateX(200px);/*Desplazamos a la derecha*/
opacity: 0;
transition: all 0.4s linear;
}
.photos a.link{
margin-top: -10%;
font-size: .5em;
opacity: 0;
transition: all 0.4s ease-in-out;
transform: translateY(100px)/*Desplazamos para abajo*/
}
/*
.photos:hover img {
transform: scale(1.1);
}
*/
.photos:hover .mascara {
opacity: 1;
}
.photos:hover h2,
.photos:hover p,
.photos:hover a.link {
opacity: 1;
transform: translateX(0px);/*Regresamos a las posiciones originales*/
}
.photos:hover p {
transition-delay: 0.1s;
}
.photos:hover a.link {
transition-delay: 0.2s; /*Aplicamos un pequeño retardo para que se muestre al final*/
transform: translateY(0px);
}

.simplescrollup__button {
    position: fixed;
	cursor: pointer;
    bottom: 3rem;
    right: 3rem;
    transition: 1s all;
    z-index: 100;
}
.simplescrollup__button--show {
    transform: translateX(0);
}
.simplescrollup__button--hide {
    transform: translateX(100px);
}


/*campaña*/

        #galeria {
            margin: 1rem auto;
           /* padding:0px 20px 20px;*/
            box-sizing: border-box;
            column-count: 3;

            /* Espacio entre columnas */
            -moz-column-gap: 20px;
            -webkit-column-gap: 20px;
            column-gap: 20px;
			background-color: rgba(255, 0, 0, 0.0);


            /* Filete entre columnas */
            /*-moz-column-rule: 1px solid #bbb;
            -webkit-column-rule: 1px solid #bbb;
            column-rule: 1px solid #bbb;*/


        }

        #galeria header {
            -webkit-column-span:all;
            column-span:all;
        }

        article {
            background:#fff;
            border-radius:5px;
            border:1px solid #ccc;
            margin:0 0 20px 0;
            text-align: center;
            max-width: 100%;
            filter: opacity(100%);

            /*Evitamos que se corte al cambiar de columna*/
            break-inside: avoid;
            page-break-inside: avoid;

        }

        article img {
            width:100%;
        }

        article span {
		float: right;

        }

        article:hover {
            transition: .5s ease;
            filter: opacity(100%);

        }


        figure {
            padding:1rem;
            box-sizing: border-box;
        }


        /* Móviles en horizontal o tablets en vertical */
        @media (max-width: 767px) {
            #galeria {
                columns:2;
            }

        }

        /* Móviles en vertical */

        @media (max-width: 480px) {
            #galeria {
                columns: 1;
            }
        }

/* accordion */

/* Accordion styles */



/*   celular*/
@media only screen and (max-width:768px) {
/* celular fila de imagenes*/




}/*Fin Celular*/



.accordion-container {
	width: 100%;
	margin: 0 0 20px;
	clear:both;
}

.accordion-titulo {
	position: relative;
	display: block;
	padding: 20px;
	font-size: 20px;
	font-weight: 300;
	background: #FFFFFF;
	color: #f18a0a;
	text-align: left;
	font-weight: 500;
	text-decoration: none;
}
.accordion-titulo.open {
	background: #f7830a;
	color: #fff;
}
.accordion-titulo:hover {
	background: var(--colorsec);
	color: #fff;
}

.accordion-titulo span.toggle-icon:before {
	content:"+";
}

.accordion-titulo.open span.toggle-icon:before {
	content:"-";
}

.accordion-titulo span.toggle-icon {
	position: absolute;
	top: 10px;
	right: 20px;
	font-size: 38px;
	font-weight:bold;

}

.accordion-content {
	display: none;
	padding: 25px;
	overflow: auto;
	text-align: left;
	background: #f7f7f7;
}

.accordion-content p{
	margin:0;
}
.accordion-content ul {
  list-style-image: url("../waterlist.png");
	margin-left: 20px;
	padding: 10px;
}
.accordion-content img {
	float: left;
	margin: 0;
	width: 20%;
	height: auto;
	padding-right: 30px;
}


@media (max-width: 767px) {
	.accordion-content {
		padding: 10px 0;
	}
}


* {
  box-sizing: border-box;
}


/*Para tablas*/

.rwd-table {
  margin: auto;
  min-width: 100%;
  max-width: 100%;
	height: auto;
  border-collapse: collapse;
}

.rwd-table tr:first-child {
  border-top: none;
  background-color: #FFFFFF;
  color: var(--colorsec);
}

.rwd-table tr {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  background-color: var(--color);
  color: var(--colorsec);
}

.rwd-table tr:nth-child(odd):not(:first-child) {
  background-color: var(--color);
}

.rwd-table th {
  display: none;
}

.rwd-table td {
  display: inline-block;
  color: #FFFFFF;
}

.rwd-table td a {
  color: #FFFFFF;
	text-align: center!important;
}



.rwd-table td:first-child {
  margin-top: .5em;
}

.rwd-table td:last-child {
  margin-bottom: .5em;
}

.rwd-table td:before {
  content: attr(data-th) " ";
  font-weight: bold;
  width: 100%;
  display: inline-block;
  color: #000;
	text-align: left;
}

.rwd-table th {
  text-align: center;
	padding: 10px!important;
}

.rwd-table td {
  text-align: left;
	padding: 10px!important;
}

.rwd-table td a {
  text-align: center!important;
}

.rwd-table {
  color: #333;
  border-radius: .4em;
  overflow: hidden;
}

.rwd-table tr {
  border-color: #bfbfbf;
}

.rwd-table th,
.rwd-table td {
  padding: .5em 1em;
	height: auto;
}



@media screen and (max-width: 601px) {
  .rwd-table tr:nth-child(2) {
    border-top: none;
  }
}



@media screen and (min-width: 600px) {
  .rwd-table tr:hover:not(:first-child) {
    background-color: var(--colorsec);
  }
  .rwd-table td:before {
    display: none;
  }
  .rwd-table th,
  .rwd-table td {
    display: table-cell;
    padding: .5em .5em;
	padding-bottom: .5em;
  }
  .rwd-table th:first-child,
  .rwd-table td:first-child {
    padding-left: 0;
  }
  .rwd-table th:last-child,
  .rwd-table td:last-child {
    padding-right: 0;
  }
  /*
  .rwd-table th,
  .rwd-table td {
  }
  */
}

#botonmenu {
padding: 0;
background-color: #FFFFFF;
}

#botonmenu li {
display: inline;
}

#botonmenu li a {
font-family: Arial;
font-size:11px;
text-decoration: none;
float:left;
padding: 10px;
background-color: #f7830a;
color: #fff;
}

#botonmenu li a:hover {
background-color: #b9a59d;
margin-top:-2px;
padding-bottom:12px;
}

.fotterfinal {
background: url(../footer.png);
}


/* footer */

footer {
	padding-top:10px;
	color:#ed713c;
	text-align: center;
	background-color: #FFFFFF;

}

footer img {

	width: 50%;
	height: auto;
}


footer h1, footer h2, footer h3, footer h4, footer h5, footer h6 {
	color:#ed713c;
}

footer .block-a {
	background:#bcab37;
}

footer a, footer a:hover {
	color:#ed713c;
}

footer a:hover {
	text-decoration:underline;
}


footer .verybottom {
	padding-top:30px;
	background:#0f0f0f;
}

footer .nav-list li, footer .nav-list li a, footer .nav-list li.nav-header {
	text-shadow:none;
	color:#f6f6f6;
}

footer .nav-list li a {
	text-shadow:none;
}

footer .nav-list.regular .nav-header {
  padding: 3px 0;
}

footer .nav-list.regular > .active > a,
.nav-list.regular > .active > a:hover {
  text-shadow: none;
  background-color: transparent;
}

footer .nav-list.regular li a:hover {
  background-color: transparent;
}

footer .nav-list.regular > li > a {
  padding: 0;
}

footer .nav-list li.divider {
	text-shadow:none;
  width: 100%;
  height: 1px;
  margin: 9px 1px;
  margin: -5px 0 5px;
  overflow: hidden;
  background-color: #222;
  border-bottom: none;
}

footer .twitter li{
    border-bottom: 1px dashed #2d2d2d;
    padding-bottom: 20px;
    margin-bottom: 20px;
    list-style: none;
}

footer.footer .input-append button, footer.footer .input-append input {
	border:none;
}


.widget {
  width: 100%;
  height: auto;
  position: relative;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.widget p {
  display: inline;
  line-height: .2em;
}
.fecha {
  font-family: arial;
  text-align: center;
  font-size: 1.2rem;
	color:var(--color);
  width: 100%;
	padding-top:30px;
}

.reloj {
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
	color:#ed713c;
  width: 100%;
  padding: 10px;
  font-size: 1.2rem;
  text-align: right;
}
.reloj .cajaSegundos {
  display: inline;
}
.reloj .ampm, .reloj .segundos{

  display: inline;
  font-size: 1.2rem;
	color:#ed713c;
}

.cajacristal {
  width: 100%;
  height: auto;
  box-shadow: 0 0 1rem 0 rgba(0, 0, 0, .2);
  border-radius: 5px;
  background-color: rgba(255, 255, 255, .15);

  backdrop-filter: blur(5px); }

.cajacristalayto {
  width: 100%;
  height: auto;
	padding-top: 20px;
  box-shadow: 0 0 1rem 0 rgba(0, 0, 0, .2);
  border-radius: 5px;
  background-color: rgba(255, 255, 255, .15);
  backdrop-filter: blur(5px);
	padding: 20px;
}






.wrapper {
   filter: url('#goo');
	position: relative;
	  margin: 1rem;
  padding: 1rem;
  /* IMPORTANTE */
  text-align: center;


}

.button {
	    text-decoration: none;
    display: inline-block;
    background: var(--color);
	font-family: var(--font);
	color: white;
	font-weight:400;
 	 padding: 20px;
    line-height: 1;
    border-radius: 0;
    position: relative;
    min-width: 100%;
	font-size: 1.2em;
	width: 100%;

}


.button:before,
.button:after {
    width: 15em;
    height: 5em;
    position: absolute;
    content: "";
    display: inline-block;
    background: var(--color);
    border-radius: 50%;
    transition: transform .7s ease;
    transform: scale(.5);
    z-index: -1;
}

.button:before {
    top: -35%;
    left: 10%;
}

.button:after {
    bottom: -35%;
    right: 10%;
}

.button:hover:before,
.button:hover:after {
    transform: none;
}

/*   celular horizontal*/
@media only screen and (max-width:1200px) {
/* celular fila de imagenes*/

	.photos > div {
    border: 2px solid #ffffff;
	opacity: .5;
    height: 100px;
    margin: 2px;
    overflow: hidden;
    position: relative;
    width: 100px;
}


}




.listas ul {
	color:#f18a0a;
list-style-type: none;
list-style-position: inside;
/*list-style-image:url("waterlist.png");*/
	}

	#lista3 ul {
	line-height: normal!important;
padding-top: 10px;
padding-bottom: 2px;
	}
	#lista3 {
    counter-reset: li;
    list-style: none;
 /*   *list-style: decimal; */
    font: 1.2rem ;
    padding: 0;
    margin-bottom: 4em;
	color: white;
/*    text-shadow: 0 1px 0 rgba(0,0,0,.2);*/
		background-color: #009abf;
		padding: 20px;
}

#lista3 ol {
    margin: 0 0 0 2em;
}

#lista3 li a{
 /*   color: #FFFFFF;*/
	color:#dad9d9;
    font-weight: bold;
	padding: 20px;
 }


#lista3 li{
    position: relative;
    display: block;
    padding: .4em .4em .4em .8em;
    margin: .5em 0 .5em 2.5em;
/*    background: #f18a0a;*/
    color: #444;
    text-decoration: none;
 /*   transition: all .3s ease-out;   */
}

#lista3 li:hover{
    background: #373838;
}



#lista3 li:hover:after{
    left: -.5em;
    border-left-color: #FFFFFF;
}

#lista3 li p {
display: block;
font-size: 1.2em!important;
color: #E9E9E9;
text-align: left;
	font-style: italic;
 }


@media only screen and (max-width:768px) {
/* celular fila de imagenes*/

#lista3 li a{
	font-size: 1.2rem;
	padding: 0;
	padding-bottom: 8px;
	margin-right: 8px;
	display: inline-block;
 }
#lista3 li {
	/*margin: 00px!important;*/
    margin: 0 0 .5em 0;
	display:list-item;
	width: 100%;
 }

#lista3 li p {
display: block;
font-size: 1.2em!important;
color: #E9E9E9;
text-align: left;
	font-style: italic;
 }




}/*Fin Celular*/



/*barra lateral redes*/

sticky-container{
    padding:0px;
    margin:0px;
    position:fixed;
    right:-130px;
    top:230px;
    width:210px;
    z-index: 1100;
}
.sticky li{
    list-style-type:none;
    background-color:#fff;
    color:#efefef;
    height:43px;
    padding:0px;
    margin:0px 0px 1px 0px;
    -webkit-transition:all 0.25s ease-in-out;
    -moz-transition:all 0.25s ease-in-out;
    -o-transition:all 0.25s ease-in-out;
    transition:all 0.25s ease-in-out;
    cursor:pointer;
}
.sticky li:hover{
    margin-left:-115px;
}
.sticky li img{
    float:left;
    margin:5px 4px;
    margin-right:5px;
}
.sticky li p{
    padding-top:5px;
    margin:0px;
    line-height:16px;
    font-size:11px;
}
.sticky li p a{
    text-decoration:none;
    color:#2C3539;
}
.sticky li p a:hover{
    text-decoration:underline;
}





 /* Fixed/sticky icon bar (vertically aligned 50% from the top of the screen) */
.icon-bar {
  position: fixed;
  top: 40%;
	left: 0%!important;
  
  -webkit-transform: translateY(50%);
  -ms-transform: translateY(50%);
  transform: translateY(50%);
  
}

/* Style the icon bar links */
.icon-bar a {
  display: block;
  text-align: center;
  padding: 5px;
  transition: all 0.4s ease;
  font-size: .8rem;
border: 1px inset #e3e3e3;
	background-color: rgba(0, 155, 195, 0.8);
color: rgba(0, 155, 195, 0.5);

}

/* Style the social media icons with color, if you want */
.icon-bar a:hover {
  background-color: #000;
}

.ocultar {
  background-color: #ad0101!important;
  color: white!important;
}

.mostrar {
  margin-top: 40%!important;
	left: 0%!important;

  background-color: #024704!important;
color: var(--colorclaro)!important;
}

.facebook  {
background: var(--color);
font-size: 1.2rem;
  color: var(--colorclaro)!important;
}

.twitter {
background: var(--color);
color: var(--colorclaro)!important;
font-size: 1.2rem;

}

.conagua {
background: var(--color);
font-size: 1.2rem;
  color: var(--colorclaro)!important;
}

.ayuntamiento {
background: var(--color);
font-size: 1.2rem;
  color: var(--colorclaro)!important;
}

.dif {
background: var(--color);
font-size: 1.2rem;
  color: var(--colorclaro)!important;
}




.button-73 {
  appearance: none;
  background-color: #FFFFFF;
  border-radius: 40em;
  border-style: none;
  box-shadow: #ADCFFF 0 -12px 6px inset;
  box-sizing: border-box;
  color: #000000;
  cursor: pointer;
  display: inline-block;
  font-family: -apple-system,sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: -.24px;
  margin: 0;
  outline: none;
  padding: 1rem 1.3rem;
  quotes: auto;
  text-align: center;
  text-decoration: none;
  transition: all .15s;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
}

.button-73:hover {
  background-color: #FFC229;
  box-shadow: #FF6314 0 -6px 8px inset;
  transform: scale(1.125);
}

.button-73:active {
  transform: scale(1.025);
}

@media (min-width: 768px) {
  .button-73 {
    font-size: 1.5rem;
    padding: .75rem 2rem;
  }
}



.item {
    width: 10%;
    float: left;
    background-color: #95a5a6;
    border: 1px solid #7f8c8d;
    height: 50px;
    line-height: 57px;
    cursor: pointer;
	font-size: 1rem;
	color: white;
}


.info {
    width: 100%;
    float: left;
    background-color: #ecf0f1;
    color: #222;
    height: 50px;
    display: none
}