div#blogs {
  background: #fff;
  display: block;
  padding-bottom: 4rem;
}
.blogMenuContainer {
width: 95%;
margin: 0 auto;
}
.blogParentCategories,
.blogChildCategories {
width: auto;
display: flex;
flex-flow: wrap;
justify-content: center;
}
.blogParentCategories {
font-weight: bold;
font-size: 19px;
line-height: 23px;
margin-bottom: 25px;
}
.blogChildCategories {font-size: 16px;line-height: 20px;margin-bottom: 25px;}
.blogCategoryTitle.selected {
border-bottom: 1px solid;
}
.blogCategoryTitle {
padding: 10px 0 3px;
margin: 0 10px;
}
.blogTitle {
font-size: 30px;
line-height: 34px;
margin: -2rem auto 0;
font-weight: bold;
display: block;
width: fit-content;
}
.blogCenteredContent {width: 92%;display: grid;gap: 51px;grid-template-columns: repeat(5, 1fr);margin-bottom: 6rem;}
.dataContainer {letter-spacing: 2px;margin-top: 25px;font-size: 15px;line-height: 19px;}
.blogPostRegular .imgContainer {
  width: 100%;
  margin: auto;
  transition: 0.3s all ease;
  padding-top: 20px;
}
.blogPostRegular {/* border: 1px solid #112F154d; *//* border-radius: 12px; *//* aspect-ratio: 324/422; *//* max-height: 422px; */color: #FFF;/* padding: 20px; */box-sizing: border-box;transition: 0.2s all ease-out;position: relative;}

.blogPostRegular:hover .imgContainer {
  transform:scale(1.05)
}
.ArrowContainer {
    background: #fff;
    border-radius: 100px;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: calc(5% + 5px);
    right: calc(7% + 5px);
    opacity: 0;
    display: none;
}

.ArrowContainer img {
    width: 12px;
    animation: rotate360 1s ease-in-out 0s 1 normal forwards;
}




.blogPostRegular:hover {/* background:#377642; */color:#FFF}
.blogPostRegular:hover .ArrowContainer{
  display:flex;
  opacity:1;
}

.constructionMessageDiv {
width: 90%;
max-width: 760px;
margin: 39px auto;
grid-column-start: 1;
grid-column-end: 5;
grid-row-start: 1;
grid-row-end: 3;
text-align: center;
font-size: 18px;
line-height: 24px;
}

.blogPostRegular .postPreviewFile {
width: 100%;
display: block;
height: auto;
}
.blogPostRegular .postPreviewFile {/* border-radius: var(--border-radius); */background-size: contain;background-repeat: no-repeat;border-radius: 12px;}
.blogPostRegular .postPreviewFile {width: 100%;display: block;aspect-ratio: 436/432;object-fit: contain;overflow: visible;}
.blogPostDate {font-size: 12px;line-height: 17px;padding: 6px 10px 3px;background: #DFE0DB4D;width: fit-content;border-radius: 50px;display: none;}
#novedadesContainer.slick-initialized .slick-slide{
margin: 0 20px;
}
p.verMasBlog {
  display: none;
}
.blogPostTitle {font-size: 14px;line-height: 18px;margin-bottom: 26px;font-weight: 500;margin-top: 14px;width: 100%;text-transform: uppercase;/* letter-spacing: 2px; */}
.blogPostSubtitle {
margin-bottom: 5px;
font-weight: bold;
}
.blogSlider {
  /* background: #fff; */
  float: left;
  width: 92%;
  margin: auto;
  margin: 40px 4% 5rem;
  position: relative;
  opacity: 1;
}
.blogSlider.onViewport {
  -webkit-animation: fade-in-bottom 0.6s cubic-bezier(0.39, 0.575, 0.565, 1) 0.2s
    both;
  animation: fade-in-bottom 0.6s cubic-bezier(0.39, 0.575, 0.565, 1) 0.2s both;
}
#novedadesContainer {
width: 93%;
margin: auto;
margin-bottom: 70px;
position:relative;
}

h1.blogTitle {font-weight: 700;font-size: 22px;margin-top: 1rem;margin-bottom: 3rem;color: #fff;text-transform: uppercase;letter-spacing: 1px;}
.sliderLeftBlog {
position: absolute;
left: calc(5% + 0px);
top: calc(38% + 0px);
z-index: 1;
cursor: pointer;
transition: all 0.2s ease-out;
-moz-transition: all 0.2s ease-out;
-webkit-transition: all 0.2s ease-out;
-o-transition: all 0.2s ease-out;
height: 16px;
width: 16px;
z-index: 3;
background: #377642;
padding: 10px;
border-radius: 50px;
rotate: 180deg;
display: none;
}

.sliderRightBlog {
position: absolute;
right: calc(5% + -4px);
top: calc(38% + 0px);
z-index: 1;
cursor: pointer;
transition: all 0.2s ease-out;
-moz-transition: all 0.2s ease-out;
-webkit-transition: all 0.2s ease-out;
-o-transition: all 0.2s ease-out;
height: 16px;
width: 16px;
display: none;
background: #377642;
padding: 10px;
border-radius: 50px;
}

.blogPostDescription {
  /* display: none; */
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: 0;
}
p.verMasBlog {
  display: none;
}
.centeredContent.blogCenteredContent {
width: var(--web-container);
}
#novedadesContainer {margin: auto;margin-bottom: 3rem;width: 93%;}
.sliderLeftBlog {position: absolute;left: 3.5%;top: calc(50% + 0px);z-index: 1;cursor: pointer;transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;-webkit-transition: all 0.2s ease-out;-o-transition: all 0.2s ease-out;height: 16px;width: 16px;z-index: 3;display: none;}

.sliderRightBlog {position: absolute;right: 3.5%;top: calc(50% + 0px);z-index: 1;cursor: pointer;transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;-webkit-transition: all 0.2s ease-out;-o-transition: all 0.2s ease-out;height: 16px;width: 16px;display: none;}

.blogPostRegular .postPreviewFile {
border-radius: 12px;
}
.viewAllBlogs {
    display: block;
    width: 100%;
    margin: auto;
    text-align: center;
    margin: 2rem auto 4rem;
    color: #377642;
    font-size: 14px;
    font-weight: 400;
    text-decoration: underline;
    text-underline-offset: 2px;
}

@media screen and (max-width: 1100px) {
  .blogCenteredContent {
    grid-template-columns: repeat(2, 1fr);
    width: 90%;
  }
  .blogMenuContainer {
    width: 90%;
  }
  h1.blogTitle {

margin-bottom: 1rem;
}
  #novedadesContainer {
width: 100%;
}
#novedadesContainer.slick-initialized .slick-slide{
margin: 0 10px;
}
  .blogTitle {
    margin-bottom: 15px;
  }
  .blogParentCategories {
    margin-bottom: 15px;
    display: none;
  }
  .blogCategoryTitle {
    padding: 13px 0 2px;
  }
  #novedadesContainer {
  width: 100%;
  }
  .constructionMessageDiv {
    width: 100%;
  }
  .blogSlider {
  border-radius: 30px 30px 0 0;
  margin-top: 0;
  width: 100%;
  margin: 0;
  margin-bottom: 3rem;
}
  .viewAllBlogs {
    margin: 0rem auto 3rem;
}
}
  
@media screen and (max-width: 600px) {
.blogCenteredContent {
  grid-template-columns: repeat(1, 1fr);
}

}
