@charset "UTF-8";

/*reglas generales*/



h5 {color: black
    text-align: left;
    background-color:#c4c4c4;
font-weight: normal;}

h6 {color: black
    text-align: left;
    margin: 0.3em 0 0.5em 0;
    font-weight: normal;}


body {background-color:#EAEDED;
font-family: sans-serif;}



/*footer*/


#logofacebook{
  height: 35px;
  width: 35px;
  padding: 0 25px 0 25px;
text-align: center;
margin: auto;
align-items: center;}

#logotwitter{
  height: 30px;
  width: 50px;
  padding: 0 25px 0 25px;
text-align: center;
margin: auto;
align-items: center;}

#logoinstagram{
  height: 30px;
  width: 30px;
    margin: 0em 0em 0em 0em;
  padding: 0 25px 0 25px;
  text-align: center;
margin: auto;
align-items: center;}

/**BARRA BUSCAR**/

@import "compass/css3";

.flexsearch--wrapper {
height: auto;
width: auto;
max-width: 100%;
overflow: hidden;
background: transparent;
margin: 0;
position: static;}

.flexsearch--form {
overflow: hidden;
position: relative;}

.flexsearch--input-wrapper {
padding: 0 66px 0 0; /* Right padding for submit button width */
overflow: hidden;}

.flexsearch--input {
  width: 100%;}

 .flexsearch {
   padding: 0 25px 0 25px; /* Padding for other horizontal elements */}

.flexsearch--input {
  -webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
  height: 30px;
  padding: 0 10px 0 15px;
border-color: #888;
  border-radius: 15px;
  border-style: solid;
border-width: 5px;
  margin-top: 15px;
  color: #333;
  font-family: 'Helvetica', sans-serif;
font-size: 14px;
-webkit-appearance: none;
-moz-appearance: none;}

.flexsearch--submit {
  position: absolute;
right: 0;
top: 0;
display: block;
width: 100px;
height: 30px;
  padding: 0;
  border: none;
margin-top: 10px; /* margin-top + border-width */
  margin-right: 10px; /* border-width */
  margin-bottom: 18px;
background: transparent;
  color: #888;
  font-family: 'Helvetica', sans-serif;
  font-size: 22px;
  line-height: 50px;}

.flexsearch--input:focus {
  outline: none;
  border-color: #333;}

.flexsearch--input:focus.flexsearch--submit {
  color: #333;}

.flexsearch--submit:hover {
  color: #333;
  cursor: pointer;}

::-webkit-input-placeholder {
color: #888;}

input:-moz-placeholder {
  color: #888}


/*inicio*/

#queestasbuscando{
  text-align: center;}

#queestasbuscando h3 {
    text-align: center;}

#queestasbuscando h1{
  color:#626567;}

#logo, header{
    width: auto;
    border-radius: 15px;
    align-items: center;
    text-align: center}

.video1-responsive {
    position: relative;
    padding-bottom: 56.25%; /* 16/9 ratio */
    padding-top: 30px; /* IE6 workaround*/
    height: 0;
    overflow: hidden;}

.video1-responsive iframe,
    .video1-responsive object,
    .video1-responsive embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;}


#caucepersona {
    display: block;
    margin: auto;
    margin-bottom: 0;
    width:100%;
    height:auto;
    max-width: 90em;
    vertical-align: center;
    text-align: center;
    margin: 0.8em 0 0.8em 0;
    border-radius:15px;}

/*hamburguesa*/

.dropbtn {
  background-color: #b9b9b9 ;
  color: white;
  padding: 16px;
  font-size: 16px;
  border-radius: 15px;
  cursor: pointer;
  z-index: 9999;}

.dropdown {
  position: relative;
  display: inline-block;
  z-index: 9999;}

.dropdown-content {
  display: none;
  position: absolute;
  right: 0;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 9999;}

.dropdown-content a {
  color: 4D5656;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  z-index: 9999;}

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
  display: block;}

.dropdown:hover .dropbtn {
  background-color: #4D5656;}

img{
  border-radius: 15px}

#logo{
  max-width: 1000px}

#videoinicio h1{
    color: #EAEDED;
    line-height: 1em;
    text-align: center;
    background-color:#009ABE;
    padding: 0.3em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius:15px;
    box-shadow: 2px 2px 5px #3498DB;}

#videoinicio{
    line-height: 1em;
    text-align: left;
    background-color:#CACFD2;
    padding: 0.3em 1em 0.3em 1em;
    margin: 1.5em 0.02em 1em 0.02em;
    border-radius:15px;
    box-shadow: 5px 5px 5px #999;}

#novedadesinicio{
    line-height: 1em;
    text-align: left;
    background-color:#c4c4c4;
    padding: 0.3em 1em 0.3em 1em;
    margin: 1.5em 0.02em 1em 0.02em;
    border-radius:15px;
    box-shadow: 5px 5px 5px #999;}

#novedadesinicio h1{
    color: #EAEDED;
    line-height: 1em;
    text-align: center;
    background-color:#626567;
    padding: 0.3em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius:15px;
    font-size: 18pt;
    box-shadow: 2px 2px 5px #797D7F ;}

#novedadesinicio h3{
    line-height: normal;}

#novedadesinicio h5{
    margin: 0 0 0 0;
    padding: 0.5em 0 0 0;}

#textonovedadesinicio{
    margin: 1em 0 0 0;
    padding: 0 0 0 0;}


.fotitoscolumna .columna {
    display: grid;}
@media(min-width:330px) {
    .fotitoscolumna .columna {
        grid-template-columns: repeat(2,50%);}
}

@media(min-width:580px) {
    .fotitoscolumna .columna {
        grid-template-columns: repeat(3,33.3%);
    }
}

@media(min-width:1024px) {
    .fotitoscolumna .columna {
        grid-template-columns: repeat(4,25%);
    }
    .columna{
        width: 1024px;
    }
}



.fotitoscolumna img  {
    object-fit: cover;
    object-position: left center;
    width: 40vmin;
    height: 35vmin;
    margin: 0.5em;
  }


#foto1{
    display: block;
    margin-bottom: 0;
    width: 100%;
    height: auto;
    max-width: 90em;
    vertical-align: center;
    text-align: center;
    margin: 0.8em 0 0.8em 0;
    border-radius: 15px;}

#quienessomosinicio{
    line-height: 1em;
    text-align: left;
    background-color:#c4c4c4;
    padding: 0.3em 1em 0.3em 1em;
    margin: 1em 0.02em 1em 0.02em;
    border-radius:15px;
    box-shadow: 5px 5px 5px #999;}

#quienessomosinicio h1{
    color: #EAEDED;
    line-height: 1em;
    text-align: center;
    background-color:#d8324a;
    padding: 0.3em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius:15px;
    font-size: 18pt;
    box-shadow: 2px 2px 5px #CB4335 ;}

  #quienessomosinicio h3{
    line-height: normal;
      margin: 0.9em 0em 0.3em 0em;}


#quienessomosinicio h5{
    margin: 0 0 0 0;
    padding: 0.5em 0 0 0;}

#galeríainicio{
    line-height: 1em;
    text-align: left;
    background-color:#c4c4c4;
    padding: 0.3em 1em 0.3em 1em;
    margin: 1em 0.02em 1em 0.02em;
    border-radius:15px;
    box-shadow: 5px 5px 5px #999;}

#galeríainicio h1{
    color: #EAEDED;
    line-height: 1em;
    text-align: center;
    background-color:#45bb8b;
    padding: 0.3em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius:15px;
    font-size: 18pt;
    box-shadow: 2px 2px 5px #28B463  ;}

  #galeríainicio h3{
    line-height: normal;}

#foto3{
    display: block;
    margin-bottom: 0;
    width:100%;
    height:auto;
    max-width: 90em;
    vertical-align: center;
    text-align: center;
    margin: 0.8em 0 0.8em 0;
    border-radius:15px;}

#consultasinicio{
    line-height: 1em;
    text-align: left;
    background-color:#c4c4c4;
    padding: 0.3em 1em 0.3em 1em;
    margin: 1em 0.02em 1em 0.02em;
    border-radius:15px;
    box-shadow: 5px 5px 5px #999;
  }

#consultasinicio h1{
    color: #EAEDED;
    line-height: 1em;
    text-align: center;
    background-color:#009ABE;
    padding: 0.3em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius:15px;
    font-size: 18pt;
    box-shadow: 2px 2px 5px #3498DB   ;}

#consultasinicio h3{
    color: #000000;
    line-height: 1em;
    text-align: left;
    background-color:#c4c4c4;
    padding: 0.3em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius:15px;
    line-height: normal;
text-align: center;}

  #enviar1 p{
    text-align: left;}

  #enviar1 .botonenviar1{
    text-decoration: none;
    padding: 3px;
    padding-left: 10px;
    padding-right: 10px;
    font-family: helvetica;
    font-weight: 300;
    font-size: 15px;
    font-style: italic;
    color: black;
    background-color: #a0a0a0;
    border-radius: 7px;
    border: 3px double #CACFD2;
    text-align: left;}


/*novedades*/

#novedades h1{
    color: #EAEDED;
    line-height: 1em;
    text-align: center;
    background-color:#626567;
    padding: 0.3em 1em 0.3em 1em;
    margin: auto;
    border-radius:15px;
    box-shadow: 2px 2px 5px #797D7F;}

#reunion a{
    text-decoration: none;
    padding: 3px;
    padding-left: 10px;
    padding-right: 10px;
    font-family: helvetica;
    font-weight: 300;
    font-size: 15px;
    font-style: italic;
    color: black;
    background-color: #CACFD2 ;
    border-radius: 7px;
    border: 3px double #CACFD2 ;}

#reunion a:hover{
    opacity: 0.7;
    text-decoration: none;}

#reunion{
  line-height: 1em;
  text-align: left;
  background-color: #c4c4c4;
  padding: 0.3em 1em 0.8em 1em;
  margin: 1.5em 0.02em 1.5em 0.02em;
  border-radius: 15px;
  box-shadow: 5px 5px 5px #999;}

#comenzamos{
  line-height: 1em;
  text-align: left;
  background-color: #c4c4c4;
  padding: 0.3em 1em 0.8em 1em;
  margin: 1.5em 0.02em 1.5em 0.02em;
  border-radius: 15px;
  box-shadow: 5px 5px 5px #999;}

#comenzamos a{
  text-decoration: none;
  padding: 3px;
  padding-left: 10px;
  padding-right: 10px;
  font-family: helvetica;
  font-weight: 300;
  font-size: 15px;
  font-style: italic;
  color: black;
  background-color: #CACFD2 ;
  border-radius: 7px;
  border: 3px double #CACFD2 ;}

#comenzamos a:hover{
  opacity: 0.7;
  text-decoration: none;}

#comenzamos h5{
    margin: 0 0 0 0;
    padding: 0.5em 0 0 0;}

#comenzamos h4{
    margin: 0 0 0 0;
    padding: 0 0 0 0;}

#comenzamos h3{
    color: #EAEDED;
    text-align: center;
    background-color:#818181;
    padding: 0.5em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius: 15px;
    box-shadow: 2px 2px 5px #797D7F;}

footer nav{
  padding: 1em;
    align-items: center;}

footer p{
  padding: 0.3em 1em 1em 1em;
  font-size: 7.5pt;}

#comenzamos  h5, h3{
    border-radius: 15px;
    text-align: left;
    line-height: normal;}

#monitoreo a{
    text-decoration: none;
    padding: 3px;
    padding-left: 10px;
    padding-right: 10px;
    font-family: helvetica;
    font-weight: 300;
    font-size: 15px;
    font-style: italic;
    color: black;
    background-color: #CACFD2 ;
    border-radius: 7px;
    border: 3px double #CACFD2 ;}

#monitoreo a:hover{
    opacity: 0.7;
    text-decoration: none;}

#monitoreo h5{
    margin: 0 0 0 0;
    padding: 0.5em 0 0 0;}

#monitoreo h4{
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    color: 626567;
    text-align: left;}

#monitoreo h5, h3{
    border-radius: 15px;
    text-align: left;}

#monitoreo h3{
    color: #EAEDED;
    text-align: center;
    background-color:#818181;
    padding: 0.5em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius: 15px;
    box-shadow: 2px 2px 5px #797D7F;}

#foto2 {
    margin: 0.1em 0em 0.7em 0em;}

#reunion h3{
    color: #EAEDED;
    text-align: center;
    background-color:#818181;
    padding: 0.5em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius: 15px;
    box-shadow: 2px 2px 5px #797D7F;}

#reunion h4{
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    color: 626567;
    text-align: left;}

#reunion h5{
    margin: 0 0 0 0;
    padding: 0.5em 0 0 0;}

#monitoreo{
  line-height: 1em;
  text-align: left;
  background-color: #c4c4c4;
  padding: 0.3em 1em 0.8em 1em;
  margin: 1.5em 0.02em 1.5em 0.02em;
  border-radius: 15px;
  box-shadow: 5px 5px 5px #999;}


/*quienes somos*/

#foto5{
    display: block;
    margin-bottom: 0;
    width:100%;
    height:auto;
    max-width: 90em;
    vertical-align: center;
    text-align: center;
    margin: 0.8em 0 0.8em 0;
    border-radius:15px;}

#quienessomos h1{
    color: #EAEDED;
    line-height: 1em;
    text-align: center;
    background-color:#d8324a;
    padding: 0.3em 1em 0.3em 1em;
    margin: auto;
    border-radius:15px;
    box-shadow: 2px 2px 5px #CB4335;}

#cuencamatanza h3{
    color: #d66777;
    text-align: center;
    background-color:#626567;
    padding: 0.5em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius: 15px;
    box-shadow: 2px 2px 5px #797D7F;}

#parrafocuencamatanza {
    line-height: 1em;
    text-align: left;
    background-color:#c4c4c4;
    padding: 0.3em 1em 0.3em 1em;
    margin: 1.5em 0.02em 1.5em 0.02em;
    border-radius:15px;
    box-shadow: 5px 5px 5px #999;}

#parrafocuencamatanza h5{
    margin: 0 0 0 0;
    padding: 0.5em 0 0 0;}

#historia h3{
    color: #d66777;
    text-align: center;
    background-color:#626567;
    padding: 0.5em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius: 15px;
    box-shadow: 2px 2px 5px #797D7F;}

#parrafohistoria {
    line-height: 1em;
    text-align: left;
    background-color:#c4c4c4;
    padding: 0.3em 1em 0.3em 1em;
    margin: 1.5em 0.02em 1.5em 0.02em;
    border-radius:15px;
    box-shadow: 5px 5px 5px #999;}

#parrafohistoria h5{
    margin: 0 0 0 0;
    padding: 0.5em 0 0 0;}

#lugar h3{
    color: #d66777;
    text-align: center;
    background-color:#626567;
    padding: 0.5em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius: 15px;
    box-shadow: 2px 2px 5px #797D7F;}

#parrafolugar{
    line-height: 1em;
    text-align: left;
    background-color:#c4c4c4;
    padding: 0.3em 1em 0.3em 1em;
    margin: 1em 0 1em 0;
    border-radius:15px;
    box-shadow: 5px 5px 5px #999;}

#parrafolugar h5{
    margin: 0 0 0 0;
    padding: 0.5em 0 0 0;}

#foto4 {
    display: block;
    margin-bottom: 0;
    width:100%;
    height:auto;
    max-width: 90em;
    vertical-align: center;
    text-align: center;
    margin: 0.8em 0 0.8em 0;
    border-radius:15px;}


#vistadelcauce{
    text-decoration: none;
    margin: 1em 0 1em 0;
    padding: 3px;
    padding-left: 10px;
    padding-right: 10px;
    font-family: helvetica;
    font-weight: 300;
    font-size: 15px;
    font-style: italic;
    color: black;
    background-color: #CACFD2 ;
    border-radius: 15px;
    border: 3px double #CACFD2;}

header {
    background-color: #e0e0e0;
    color: #313835;
    margin: 0 0 2em 0;}

footer {
    background-color: #e0e0e0;
    color: #313835;
    margin: 0 0 0 0;
    border-radius:30px;
    align-items: center;}


/*consultas*/


#cuadrogris{
    line-height: 1em;
      text-align: left;
      background-color: #c4c4c4;
      padding: 0.3em 1em 0.8em 1em;
      margin: 1em 0 1em 0;
      border-radius: 15px;}

#consultas h1{
    color: #EAEDED;
    line-height: 1em;
    text-align: center;
    background-color:#009ABE;
    padding: 0.3em 1em 0.3em 1em;
    margin: auto;
    border-radius:15px;
    box-shadow: 2px 2px 5px #3498DB;}

h5 {color: black
    text-align: left;
    background-color:#c4c4c4;
    padding: 0.3em 1em 0.3em 1em;
    margin: 0 0 0 0;}

#preguntasfrecuentes h3{
    color: #44acc4;
    text-align: center;
    background-color:#626567;
    padding: 0.5em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius: 15px;
    box-shadow: 2px 2px 5px #797D7F;}

body {background-color:#EAEDED ;}
#wrap{
  margin: 0 auto;
  width: 500px;}

  details{
  border: 3px solid #009ABE;
  padding: 5px;
  font-family: Arial;
  width:300px;
  background-color: #EEE;
  text-decoration: none;
  display: block
  line-height: 1em;
  text-align: center;
  background-color:
  padding: 0.3em 1em 0.3em 1em;
  margin: 1em 0  ;
  border-radius:15px;
  display: block;
  margin-left: auto;
  margin-right: auto;}

/*flechitas*/

details summary::-webkit-details-marker {
  color: #009ABE;}

summary{
  font-weight: bold;
  color: #009ABE;
  font-size: 12px;
  cursor: pointer;
  text-decoration: none;
  display: block;
  line-height: 1em;
  text-align: center;}

summary:hover{
    background-color: #96e6f8;}

p, a, span{
  font-size: 12px;
  color: #666;
  text-decoration: none;
  text-align: center;}

details summary:-webkit-details-marker {
  color: #009ABE;
  text-decoration: none;}

h2{
  color: #009ABE;
  font-size: px;
  font-family: Helvetica;
  text-align: center;}

textarea{
  color:#009ABE;
  text-align:center;
  display: block;
  margin-left: auto;
  margin-right: auto;}

input{
  margin-left: auto;
  margin-right: auto;}

#enviar .botonenviar{
  text-decoration: none;
  padding: 3px;
  padding-left: 10px;
  padding-right: 10px;
  font-family: helvetica;
  font-weight: 300;
  font-size: 15px;
  font-style: italic;
  color: black;
  background-color: #CACFD2;
  border-radius: 7px;
  border: 3px double #CACFD2;}


footer {
    background-color: #e0e0e0;
    color: #313835;
    margin: 0 0 0 0;
    border-radius:30px;}

  footer .redes {
      background-color: #e0e0e0;
      color: #313835;
      margin: 0 0 0 0;
      border-radius:30px;
      text-align: center;}


/*contacto*/

#cuadrogris{
    line-height: 1em;
      text-align: left;
      background-color: #c4c4c4;
      padding: 0.3em 1em 0.8em 1em;
      margin: 1em 0 1em 0;
      border-radius: 15px;
    box-shadow: 2px 2px 5px #797D7F;}

#contacto h1{
    color: #EAEDED;
    line-height: 1em;
    text-align: center;
    background-color:#EFA317;
    padding: 0.3em 1em 0.3em 1em;
    margin: auto;
    border-radius:15px;
    box-shadow: 2px 2px 5px #F5B041;}

#telefonosutiles h3{
    color: #EFA317;
    text-align: center;
    background-color:#626567;
    padding: 0.5em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius: 15px;
    box-shadow: 2px 2px 5px #797D7F;}

  #telefonosutiles p{
    font-size: 12pt;
    line-height: normal;}

#telefonosutiles h4{
    color: #000000;
    text-align: center;}

#correos h3{
    color: #EFA317;
    text-align: center;
    background-color:#626567;
    padding: 0.5em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius: 15px;
    box-shadow: 2px 2px 5px #797D7F;}

  #correos p{
    font-size: 12pt;}


#correos h4{
    color: #000000;
    text-align: center;}

#ubicacion h3{
    color: #EFA317;
    text-align: center;
    background-color:#626567;
    padding: 0.5em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius: 15px;
    box-shadow: 2px 2px 5px #797D7F;}

  #ubicacion p{
    font-size: 12pt;}

#ubicacion h4{
    color: #000000;
    text-align: center;}

#redessociales h3{
    color: #EFA317;
    text-align: center;
    background-color:#626567;
    padding: 0.5em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius: 15px;}

#foto20{
    display: block;
    margin-bottom: 0;
    width:100%;
    height:auto;
    max-width: 90em;
    vertical-align: center;
    text-align: center;
    margin: 0.8em 0 0.8em 0;
    border-radius:15px;}


/*galeria*/

h1 {color: #313835;
    text-align: center;}

h5 {color: black
    text-align: left;
    background-color:#c4c4c4;
    padding: 0.3em 1em 0.3em 1em;
    margin: 0 0 0 0;}

.textossobreimg{
    color: #626567;
    display: block;
    margin-bottom: 0;
    height:auto;
    vertical-align: center;
    text-align: left;
    margin: 0.8em 0 0.8em 0;
    border-radius:15px;}

body{
  background-color: #EAEDED;
  font-family: sans-serif;}

/* */

#galería h1 {
    color: #EAEDED;
    line-height: 1em;
    text-align: center;
    background-color:#45bb8b;
    padding: 0.3em 1em 0.3em 1em;
    margin: 1em 0 0 0;
    border-radius:15px;
    box-shadow: 2px 2px 5px #45bb8b;}

#recoleccion h3{
    color: #45bb8b;
    text-align: center;
    background-color:#626567;
    padding: 0.5em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;}

#destacados h3{
    color: #45bb8b;
    text-align: center;
    background-color:#626567;
    padding: 0.5em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius: 15px;}

#limpieza h3{
    color: #45bb8b;
    text-align: center;
    background-color:#626567;
    padding: 0.5em 1em 0.3em 1em;
    margin: 0.5em 0 0.5em 0;
    border-radius: 15px;}

#textogaleria{
    line-height: 1em;
    text-align: left;
    background-color:#c4c4c4;
    padding: 0.3em 1em 0.3em 1em;
    margin: 0.5em 0 0 0;
    border-radius:15px;
    box-shadow: 2px 2px 5px #797D7F;}

#textogaleria h5{
    margin: 0 0 0 0;
    padding: 0.5em 0 1em 0;}

#textovideo{
    line-height: 1em;
    text-align: left;
    background-color:#c4c4c4;
    padding: 0.3em 1em 0.3em 1em;
    margin: 1em 0em 1em 0em;
    border-radius:15px;
box-shadow: 2px 2px 5px #797D7F;}

#textovideo h5{
    margin: 0 0 0 0;
    padding: 0.5em 0 1em 0;}

#carousel{
    line-height: 1em;
    text-align: left;
    background-color: #c4c4c4;
    padding: 0.3em 1em 0.8em 1em;
    margin: 1em 0 1em 0;
    border-radius: 15px;}

.fotos {
    line-height: 1em;
    text-align: left;
    background-color: #c4c4c4;
    padding: 0.3em 1em 0.8em 1em;
    margin: 1em 0 1em 0;
    border-radius: 15px;
    box-shadow: 2px 2px 5px #797D7F;}

#videogaleria{
      line-height: 1em;
      text-align: left;
      background-color: #c4c4c4;
      padding: 0.3em 1em 0.8em 1em;
      margin: 1em 0 1em 0;
      border-radius: 15px;}


.video-responsive {
position: relative;
padding-bottom: 56.25%; /* 16/9 ratio */
padding-top: 30px; /* IE6 workaround*/
height: 0;
overflow: hidden;}

.video-responsive iframe,
.video-responsive object,
.video-responsive embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;}


.carousel {
    position: relative;
    margin-top: 26px;}

.carousel-inner {
    position: relative;
    overflow: hidden;
    width: 100%;}

.carousel-open:checked + .carousel-item {
    position: static;
    opacity: 100;}

.carousel-item {
    position: absolute;
    opacity: 0;
    -webkit-transition: opacity 0.6s ease-out;
    transition: opacity 0.6s ease-out;}

.carousel-item img {
    display: block;
    height: auto;
    max-width: 100%;}

.carousel-control {
    background: rgba(0, 0, 0, 0.28);
    border-radius: 50%;
    color: #EAEDED;
    cursor: pointer;
    display: none;
    font-size: 40px;
    height: 40px;
    line-height: 35px;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    cursor: pointer;
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    text-align: center;
    width: 40px;
    z-index: 10;}

.carousel-control.prev {
    left: 2%;}

.carousel-control.next {
    right: 2%;}

.carousel-control:hover {
    background: rgba(0, 0, 0, 0.8);
    color: #aaaaaa;}

#carousel-1:checked ~ .control-1,
#carousel-2:checked ~ .control-2,
#carousel-3:checked ~ .control-3,
#carousel-4:checked ~ .control-4 {
    display: block;}

.carousel-indicators {
    list-style: none;
    margin: 0;
    padding: 0;
    position: inherit;
    bottom: 2%;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 10;}

.carousel-indicators li {
    display: inline-block;
    margin: 0 5px;}

.carousel-bullet {
    cursor: pointer;
    display: block;
    font-size: 35px;}

.carousel-bullet:hover {
    color: #aaaaaa;}

#carousel-1:checked ~ .control-1 ~ .carousel-indicators li:nth-child(1) .carousel-bullet,
#carousel-2:checked ~ .control-2 ~ .carousel-indicators li:nth-child(2) .carousel-bullet,
#carousel-3:checked ~ .control-3 ~ .carousel-indicators li:nth-child(3) .carousel-bullet,
#carousel-4:checked ~ .control-4 ~ .carousel-indicators li:nth-child(4) .carousel-bullet

.columna {
    width: 100%;
    margin: auto;
}

img{
    width: 100%;
}

.fotoscolumna {
    margin:5px;
}

.fotos .columna {
    display: grid;
}
@media(min-width:330px) {
    .fotos .columna {
        grid-template-columns: repeat(2,50%);
    }
}

@media(min-width:580px) {
    .fotos .columna {
        grid-template-columns: repeat(3,33.3%);
        padding-left: 0em;
        padding-right: 0em;
    }
}

@media(min-width:1024px) {
    .columna{
        width: 1024px;
        padding-left: 9em;
    }
}

@media(min-width:1200px) {
    .columna {
        width: 1200px;

    }
}

.fotos img  {
    object-fit: cover;
    object-position: left center;
    width: 40vmin;
    height: 20vmin;
    /* para que "desaparezca" el espacio que queda debajo de la imagen */
    display: block;
}




  @media (min-width: 768px){
   #contacto {
    width: 100%;
    margin: 1em 0 0 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    }}

    @media (min-width: 768px){
     #cuadrogris {
      width: 80%;
      margin: 1em 0 0 0;
      display: flex;
      justify-content: space-between;
      margin-left: auto;
      margin-right: auto;
      text-align: center;
      margin-bottom: 4em;
      }}

      @media (min-width: 768px){
       #telefonosutiles {
        width: 80%;
        margin: 1em 0 0 0;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        padding: inherit;
        }}

        @media (min-width: 768px){
         #correos {
          width: 80%;
          margin: 1em 0 0 0;
          display: inline-block;
          flex-direction: column;
          justify-content: space-between;
          align-items: center;
          padding: inherit;
          }}

          @media (min-width: 768px){
           #ubicacion {
            width: 80%;
            margin: 1em 0 0 0;
            flex-direction: column;
            justify-content: space-between;
            align-items: center;
            padding: inherit;
            }}

      @media (min-width: 768px){
       #foto20 {
        width: 40%;
        margin: 1em 0 0 0;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
        }}

        @media (min-width: 768px){
         #preguntasfrecuentes {
          width: 40%;
          margin: 1em 0 0 0;
          flex-direction: column;
          justify-content: space-between;
          align-items: center;
          margin-left: auto;
          margin-right: auto;
          text-align: center;
          }}

          @media (min-width: 768px){
           #comenzamos {
            width: 40%;
            margin: 1em 0 0 0;
            flex-direction: column;
            justify-content: space-between;
            align-items: center;
            margin-left: auto;
            margin-right: auto;
            text-align: center;
            }}
            @media (min-width: 768px){
             #preguntasfrecuentes {
              width: 40%;
              margin: 1em 0 0 0;
              flex-direction: column;
              justify-content: space-between;
              align-items: center;
              margin-left: auto;
              margin-right: auto;
              text-align: center;
              }}

              @media (min-width: 768px){
               #preguntasfrecuentes {
                width: 40%;
                margin: 1em 0 0 0;
                flex-direction: column;
                justify-content: space-between;
                align-items: center;
                margin-left: auto;
                margin-right: auto;
                text-align: center;
                }}

                @media (min-width: 768px){
                 #monitoreo {
                  width: 40%;
                  margin: 1em 0 0 0;
                  flex-direction: column;
                  justify-content: space-between;
                  align-items: center;
                  margin-left: auto;
                  margin-right: auto;
                  text-align: center;
                  }}

                  @media (min-width: 768px){
                   #reunion {
                    width: 40%;
                    margin: 1em 0 0 0;
                    flex-direction: column;
                    justify-content: space-between;
                    align-items: center;
                    margin-left: auto;
                    margin-right: auto;
                    text-align: center;
                    }}


                    @media (min-width: 768px){
                     #textovideo {
                      width: 40%;
                      margin: 1em 0 1em 0;
                      flex-direction: column;
                      justify-content: space-between;
                      align-items: center;
                      margin-left: auto;
                      margin-right: auto;
                      text-align: center;
                      }}

                      @media (min-width: 768px){
                       #destacados {
                        width: 40%;
                        margin: 1em 0 0 0;
                        flex-direction: column;
                        justify-content: space-between;
                        align-items: center;
                        margin-left: auto;
                        margin-right: auto;
                        text-align: center;
                        }}

                        @media (min-width: 768px){
                         #textogaleria {
                          width: 40%;
                          margin: 1em 0 0 0;
                          flex-direction: column;
                          justify-content: space-between;
                          align-items: center;
                          margin-left: auto;
                          margin-right: auto;
                          text-align: center;
                          }}

                          @media (min-width: 768px){
                           .fotos {
                            width: 80%;
                            margin: 1em 0 0 0;
                            flex-direction: column;
                            justify-content: space-between;
                            align-items: center;
                            margin-left: auto;
                            margin-right: auto;
                            text-align: center;
                            }}