* {

	margin:0;
	padding: 0;
	box-sizing: border-box;
}

body {
	font-family: 'Montserrat', sans-serif;
	color: #4E5868;
	background-image:url("../img/Background1.jpg");

}

p {
}

.divvideo{
  width: 50%;
  margin: auto;

}

.divbienvenida{
  width: 100vw;
  padding: 1em;
}

.divbienvenida h2{
  width: 60%;
  text-align: center;
}

.divbienvenida video{
  width: 100%;
}

.divtitulobienvenida{
  width: 50%;
  margin: auto;

}

.contenedorhome {
  text-align: center;
  justify-content: center;
  font-size: 0.8em;
  width: 50vw;
}


.divtituloylogo{
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  width: 20vw;

}

.divlogoemja{
  padding: 0.5em;
  height: 10em;
}

.divlogoemja img{
  height: 100%;
}

.divtitulo{
  padding: 0.5em;

}

.divtitulo h1{
  font-size: 1em;
  font-weight: bolder;
}

.banner_header {
  padding: 2em 3em 1em 3em;
	text-align: center;
  width: 100vw;
	border-bottom: solid 2px #27c104;
  text-align: center;
}

.divimagtrabajo {
  width: 50%;
  padding: 1em;
  margin: auto;

}

.divimagtrabajo img {
  width: 100%;
}

.banner_header p{
	font-size: 1rem;
}

.banner_header h2{
	text-transform: uppercase;
	font-weight: 700;
}

.divtextotrabajo {
  width: 70vw;
  padding: 1em;
  margin: auto;
}

header {
  width: 100%;
}

  header nav ul {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  }
  

header nav {

	width: 100%;
	background-color: #53c97d;
	justify-content: space-around;



}

nav  li {
	text-align: center;
	flex-grow: 1;
	padding: 1em;
	list-style: none;
	text-transform: uppercase;
}
nav li:hover {

	background-color: #1D8348;
}


nav li a{

	text-decoration: none;
	color: white;
}

main {
	text-align: center;
	display: flex;
  justify-content: center;
	flex-direction: column;
  border-bottom: solid 1px #4E5868;

}

.mainquienessomos{
  width: 100%;
  padding: 1em;
  margin: auto;
}

.main_card {
	padding: 1em;
  width: 100%;

}

section h2 {
  padding: 1em;
}

.contenedor_section {
  padding: 1em;
	justify-content: space-around;
	border-bottom: solid 1px #4E5868;
  width: 100vw; 
}

  .section_card {
    padding: 1em;
    width: 100%;
  }

  .imagenesnoticias{
    display: flex;
    width: 50%;

  }
  
  .imagenesnoticias img{
    width: 100%;
  }

.divsubtitulo {
    display: flex;
    margin: 1em;
    text-align: left;
}

.divimagenagenda {
    width: 100%;
    height: auto;
}

.divimagenagenda img {
    width: 100%;
    height: auto;
}

h4 {
    display: block;
    font-weight: bold;
    font-size: 1.3em;
    margin: 0.5em;
}

.contenedordep{
  padding: 0.5em;
  width: 100%;
}

img:hover {

	transform: scale(1.1);
	opacity: 50%;
}

/* News Cards agenda*/
.news-cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 25px;
  padding: 1em;
}

.news-cards img {
  width: 100%;
  height: 180px;
}

.news-cards h3 {
  font-size: 1.5em;
  padding: 2em;
  }

.news-cards a {
  padding: 10px 0;
  color: #f2f2f2;
  text-transform: uppercase;
  display: inline-block;
  font-weight: bold;
}
/* /////////////////// */

  .contenedor {
    width: 100%;
    overflow: hidden;
    position: relative;
    display: flex;
    margin: auto;
  }

  .contenedor p{
    text-align: center;
    color: white;
  }

.slider-contenedor{
    width: 100%;
    display: flex;
}

.slider-contenedor .btn-next {
  position: absolute;
    right: 0;
    height: 600px;
    background-color: #00000014;
    color: #ffffff3b;
    padding: 1rem;
    border: none;
    transition: all 0.5s ease-out;
    cursor: pointer;
}

.slider-contenedor .btn-prev {
  position: absolute;
    left: 0;
    height: 600px;
    background-color: #00000014;
    color: #ffffff3b;
    padding: 1rem;
    border: none;
    transition: all 0.5s ease-out;
    cursor: pointer;
}

.slider-contenedor .btn-prev:hover, .slider-contenedor .btn-next:hover  {
    background-color: #0000008c;
    color: white;
    transition: all 0.5s ease-out;
}

.slider-contenedor .btn-prev:focus, .slider-contenedor .btn-next:focus  {
  outline: 0;
  border: none;
}

.contenido-slider{
    width: 100%;
    height: 600px;
    justify-content: space-around;
    align-items: center;
    flex-shrink: 0;
    background-color: #6c63ff;
    color: white;
    text-align: center;
    display: none;
    transition: all 0.5s ease-out;
}

.contenido-slider.active{
  opacity: 1;
  display: block;
  transition: all 0.5s ease-out;
}

.contenido-slider:nth-child(2){
    background: #332863;
    color: #fff;
}

.contenido-slider:nth-child(3){
    background: #611a68;
}

.contenido-slider > img{
    width: 250px;
}

.contenido-slider > div{
    width: 40%;
}

.contenido-slider h2{
    font-weight: 300;
    text-align: center;
    line-height: 30px;
     font-size: 23px;

}

.contenido-slider a{
  color: #fff;
  background: #332863;
  width: 100px;
  display: block;
  padding: 15px 0;
  text-align: center;
  border-radius: 3px;
  text-decoration: none;
  margin: auto;
  margin-top: 20px;
  margin-bottom: 2rem;

}

.contenido-slider:nth-child(2) a{
    background: #fff;
    color: #332863;

}

/* agenda css */
.cards-banner-a {
	text-align: center;
	color: #fff;
  width: 100%;
  height: 350px;
  margin-bottom: 0.8em;
	border-bottom: solid 1px #27c104;
}

.cards-banner-a .contenedor {
  width: 40%;
  padding: 90px 0 0 30px;
  color: #000;
}

.cards-banner-a p,

/*  background: url("../img/img02.jpg") no-repeat;
 /////////////////// */



/* Dropdown Button */

.dropbtn {

    appearance: none;
    background: transparent;
    border: transparent;
    color: white;
    font-size: 20px;
    text-transform: uppercase;


}

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: relative;
  display: inline-block;
  background-color:#53c97d;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: absolute;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  background-color:#53c97d;
  color: white;
}

/* Links inside the dropdown */
.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #ddd;}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {display: block;}

/* Change the background color of the dropdown button when the dropdown content is shown */
 .dropdown:hover .dropbtn {  background-color:#53c97d; ;}

/* agregado */

.divtextocontacto{
  padding: 1em;
  width: 50%;
}

.divcontacto{
  display: flex;
  padding: 2em;
  width: 100vw;
}

.divfotocontacto{
  width: 50%;
}
.divfotocontacto img{
  width: 100%;  
}

.footerclass{
  background-color: #00ca79;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
}

.pastofooter{
  width: 100%;
  margin: 0;
}

.pastofooter img{
  width: 100vw;
  margin: 0;
}

.divtextopie {
  width: 50%;
  padding: 3em 1em 1em 1em;
  font-size: 0.7em;
}

.textofooter{
  font-size: 0.6em;
}
.divcontacumar{
  width: 50%;
  padding: 1em;
}

.imagenAcumar{
  width: 7em;
  padding: 1em 0 1em 0;
}



@media screen and (min-width:600px){
  .contenido-slider{
     flex-direction: column-reverse;
  }

  .contenido-slider > div{
      width: 80%;
  }

  .section_card {
    padding: 1em;
    width: 50%;
  }

  .contenedor_section {
    display: flex;
    flex-wrap: wrap;
  }

  .main_card {
    padding: 1em;
    width: 50%;
    display: block;

  }
  .divflex{
    display: flex;
    flex-wrap: wrap;
  }

  .divtituloylogo {
    width: 50vw;
  }


}


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

  .contenido-slider > img{
      width: 400px;
  }

  .contenido-slider > div{
      width: 40%;
  }

  .contenido-slider h2{
      font-weight: 300;
      text-align: center;
      line-height: 30px;
  }

  nav#Nav1 ul {
    display: flex;
  }


}