/* /-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/- */

/* Agrego estilo a los botones de acción */


main{
  width: 95%;
  margin: 0 auto;
}



section a {

	/* font-weight: bold; */
	color: #ffffff;
	background-color: #0006cc;
	width:200px;
	height: 50px;
	text-align: center;
	padding: 4px;
	text-decoration:none;
	margin:0 auto;
	margin-top:10px;
	border-radius: 20px;
    /* font-variant: small-caps; */

    /* Estos tres son para darle centrado al boton */
    display: flex;
    justify-content: center;
    align-items: center;
    
}

section a:hover{
	background: #B3B3B3;
	color: #0006CC;
}

section a:focus{
	background: #B3B3B3;
	color: #0006CC;
}

/* /-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/- */


/* /-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/- */
/*texto chat gpt*/
header {
    display: flex;
    justify-content: space-between;
    align-items: center; /* agregado por seba*/
    padding: 20px;
    /* background-color: #fff; */
    box-shadow: 0 0 10px rgba(0, 0, 0, 1.2);
    text-align: center;
    /* display:inline-block; */
  }
  
  .logo img {
    max-width: 100%;
    height: auto;
  }
 
  .section1 h1 {
    margin: 0;
    font-size: 36px;
    color:rgb(1, 1, 44)
  }
  
  .section1 p, .section2 p, .section1 h3 {
    margin: 0;
    font-size: 16px;
  }
  
 /*texto chat gpt*/ 

 /*este bloque es del capítulo de nav bar*/
 /*
 nav  {
  box-sizing: border-box;
  border: 1px solid #06425c;
  background-color:#486B02;
  display: inline-block;
  width: 20%;
  min-width:125px;
  margin-right:15px;
  height: 100vh;
  overflow: auto;

}
*/ 
nav a {
	display: inline;
	font-weight:normal;
	color: #ffffff;
	background-color: #0006cc;
	/* width:1000px; */   /*es al pedo el width si es inline*/
	text-align: center;
	padding: 4px;
	text-decoration:none;
	margin:0 auto;
	margin-top:10px;
    /* font-variant: small-caps; */
    border-radius: 20px;
}

nav a:hover{
	background: #ebdbdb;
	color: #0006CC;
}

nav a:focus{
	background: #B3B3B3;
	color: #0006CC;
}


header, footer{
	background-color: rgb(34, 151, 241);
	background: linear-gradient(to right, #ffffff, #00b7ea ); 
}






.buttonSus {
    display: inline-block;
    background-color: #0d0d0e;
    color: #fff;
    padding: 10px 20px;
    text-decoration: none;
    border-radius: 5px;
    font-size: 16px;
    font-weight: bold;
  }
  



  /*gpt para fondo*/

  body {
    margin: 0;
    padding: 0;
    background: url("../images/fachada.jpeg") no-repeat center center fixed;
    background-size: cover;
  }
  
  .content {
    max-width: 1800px;
    max-height: 1800px;
    margin: 0 auto;
    padding: 20px;
    background-color: rgba(255, 255, 255, 0.7); /*el 0.7 final setea la transparencia */
  }

  .button{
    color:rgb(250, 252, 253);
  }


  .imagen-container {
    max-width: 600px; /* ajusta el ancho máximo según tu diseño */
    margin: 0 auto; /* centra el contenedor */
  }
  
  .imagen-container img {
    width: 40%;
    height: auto; /* ajusta la altura proporcionalmente */
    display: block; /* elimina el espacio adicional debajo de la imagen */
    margin: 0 auto; /* centra la imagen */
    max-width: 100%; /* asegura que la imagen no se desborde del contenedor */
  }
  


  
  .section {
    /* width: 40%; */
    /* min-width: 30%px; */
    margin-bottom: 2%;
    border: 10px solid #080808;
    padding: 20px;
    display:inline-block;

  }
  
  .button-container {
    display: flex;
    flex-direction: column;
  }
  
  .button {
    color: #ffffff;
    background-color: #0006cc;

    text-align: center;
    padding: 4px;
    text-decoration: none;
    margin-top: 10px;
    border-radius: 20px;


    /* Suspendo estas características q mando gpt */
    /* display: block; */
    /* margin-bottom: 10px; */

    /*y las cambio por estas otras*/

    width:200px;
    height: 50px;
    margin:0 auto;
  

  
    /* Estos tres son para darle centrado al boton */
    display: flex;
    justify-content: center;
    align-items: center;



    /* Prueba Transición */
    transition-property: color, width, border-radius, background;
    transition-duration: 1s;
    transition-timing-function:linear;
    transition-delay: 0.5s;





  }
  
  .button:hover {
    background: #B3B3B3;
    color: #0006CC;

    /* Prueba Transición */   
    width: 250px;
    border-radius: 30px;
  }

  .button:focus {
    background: #B3B3B3;
    color: #0006CC;

    /* Prueba Transición */ 
    width: 250px;
    border-radius: 30px; 
  }

  
  @media only screen and (max-width: 600px) {
    .section {
      width: 100%;
    }
  }
  

  /* /-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/- */

/* Esto acá abajo es para el container del horario y google maps */

  .containerHor {
    display: flex;
    flex-wrap: wrap;
    height: 100vh;
  }
      
  .sectionHor {
    width: 25%;
    height: 100%;
    box-sizing: border-box;
    padding: 20px;
  }
      
  .sectionHor img {
    max-width: 100%;
    height: auto;
  }

    /* /-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/- */


    
/* Estilos para el footer  desde gpt */
footer {
  /* background-color: #6495ed; */
  /* color: #fff; */
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
}


.footer-container {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.social {
  display: flex;
  align-items: center;
}

.social span {
  margin-right: 10px;
}

.social a {
  margin-right: 10px;
}

.social img {
  width: 30px;
  height: 30px;
}




@media screen  and (min-width:778px){
  

  .section {
    width: 40%;
    min-width: 30%px;
    margin-bottom: 2%;
    border: 10px solid #080808;
    padding: 20px;
    display:inline-block;

  }


  .container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
  }


}