* {
    margin: 0;
    padding: 0;
}

header.transparent{
    box-shadow: 0px 4px 44px rgb(0 0 0 / 4%);
  }

h1 {
    font-family: "Neue Medium Italic";
    color: #0F4F3E;
    font-size: 42px;
    margin: 5rem 0 3rem;
}

span {
    font-family: "Neue Medium Italic";
    font-size: 14px;
    color: #0F4F3E;
}

.fecha-responsive{
    display:none;
}

.containerImgResponsive{
    display:none;
}

.hero-background {
    background: #F2F1ED;
    margin-bottom: 6rem;
}

.containerImg {
    display: flex;
    justify-content: center;
    padding-top: 7rem;
    width: 70%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 30px;
}

.hero-background>div>div img {
    width: 100%;
}

.containerTitlePost, .containerPost {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
}

.containerTitlePost {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.containerTitlePost h1{
    font-weight: 900;
    text-transform: uppercase;
}

.containerPost {
    display: flex;
    justify-content: space-between;
}

.containerPost div {
    width: 100%;
    font-family: "Neue Medium";
    font-size: 16px;
    line-height: 22.66px;
    color: #0F4F3E;
}

.containerPost p{
    line-height: 23px; 
}


@media only screen and (max-width: 768px) {

    /* Imagen primera */
    .containerImg img:nth-of-type(1), .containerImg img:nth-of-type(3){
        display: block;
    }
    .hero-background>div>div img {
        width: 90%;
        margin-left: 5%;
    }

    .containerImg img:nth-of-type(2){
        width: 100%;
    }

    .containerImg{
        display:block;
    }


    /* Contenido Titulo & Fecha*/

   .fecha-deskopt{
       display:none;
   } 

   .fecha-responsive{
       display:block;
       text-align: end;
       margin-top: 2rem;
   }

   .containerTitlePost{
       display:block;
   }

   .containerTitlePost h1{
       font-size: 25px;
       margin: 1rem 0 2rem;
   }

   .containerTitlePost, .containerPost{
       width: 80%;
   }

    /* Contenido Parrafo & Imagen*/

   .containerPost{
       display: block;
   }

   .containerPost div{
       width: 100%;
   }

   .containerImgResponsive{
       display: block;
   }

   .containerImgResponsive img{
       width: 100% !important;
   }
}