@keyframes opIm{
  0% {
      opacity: 0.01;
  }
  
  100% {
      opacity: 1;
  }
  }

@keyframes waveAnimation{
  0% {
    background-position-x: 0%;
  }
  100% {
    background-position-x: 200%;
  }
}


@keyframes afterOut{
0%{
  opacity:1;
}

100%{
  opacity:0;
}
}

:root{
  --afterAnimation:none;
  --afterContent:"";
}
.cardText a {
  margin: 1.5em auto!important;
}


.flexContainer1 .text1 >*{
  text-shadow: 0em 0.06em 0.3em rgba(0,0,0,0.5);
}
.cards2>div:nth-of-type(1) img {
  object-position: 1% 57%;
}
.cards2>div:nth-of-type(2) img {
  object-position: 1% 79%;
}

.cardImage img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.textinImage>* {
  font-family: 'Montserrat';
  color: white;
  text-align: center;
  font-weight: 700;
  font-size: 1.7em;
  text-shadow: 0em 0.06em 0.3em rgba(0,0,0,0.5);
  margin:0;
  padding:0;
}

.textinImage {
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    backdrop-filter: blur(1px);
    transform: translateY(-100%);
    background-color: #5D8C88;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.textinImage a {
  font-family: 'Montserrat';
  text-decoration: none;
  font-size: 0.8em;
  text-shadow: none;
  color: #5D8C88;
  border-radius: 25px;
  padding-left: 40px;
  padding-right: 40px;
  padding-bottom: 10px;
  padding-top: 10px;
  background-color: #A8D6C3!important;
  width: fit-content;
  height: fit-content;
  margin: 1% 0 0.5%;
}
 .cardText a {
    font-family: 'Montserrat';
    text-decoration: none;
    text-shadow: none;
    color: #5D8C88;
    border-radius: 25px;
    padding-left: 40px;
    padding-right: 40px;
    padding-bottom: 10px;
    padding-top: 10px;
    background-color: #A8D6C3!important;
	display:block;
    width: fit-content;
    height: fit-content;
    margin: 4% 0 2%;
}

.image3 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}



.wave {
  background-clip: border-box;
  background-size: 200% 100%;
  background-position-x: 0;
  background-position-y: 4em;
  transition: background-position-y 0.6s ease, color 0.25s ease-in-out;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1600' height='198'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='50%25' x2='50%25' y1='-10.959%25' y2='100%25'%3E%3Cstop stop-color='%2357BBC1' stop-opacity='.25' offset='0%25'/%3E%3Cstop stop-color='%23015871' offset='100%25'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill='url(%23a)' fill-rule='evenodd' d='M.005 121C311 121 409.898-.25 811 0c400 0 500 121 789 121v77H0s.005-48 .005-77z' transform='matrix(-1 0 0 1 1600 0)'/%3E%3C/svg%3E");
  animation: waveAnimation 4s infinite linear;
  background-repeat: repeat-x;
  cursor: pointer;
}



.wave:hover {
  background-color: #A8D6C3;

  background-position-x: 0;
  background-position-y: 0;
  color: white;

}


body {
    margin: 0;
    background-color: #EEEDE9;
}
a.post-edit-link {
    display: none;
}

.bgLogo {
  position: absolute;
  width: 140px;
  height: 140px;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  filter: drop-shadow(2px 4px 6px black);
}

.bgLogo rect {
  width: revert-layer!important;
}

.bgLogo svg{
  width: 100%;
  height: 100%;
  object-fit: cover;
}


.entry-content {
    overflow-x: clip;
}

.bgImage {
    width: 100%;
    height: 90vh;
  	animation: opim 1s ease-in-out;
	display: none;
}

.view{
	display:block;
	animation: opIm 1s ease-in-out;
}


.swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.swiper-main {
    overflow: hidden;
}



@media only screen and (min-width:1100px) and (max-width:1600px){
  html body .flexContainer1 {
    top: 69%;

}
  .cards2>div:nth-of-type(1) img {
    object-position: 53% 0%;
}
  html body .flexContainer6>div {
    padding-left: 1%;
    padding-right: 1%;
}

  html .flexContainer3>div {
    padding-right: 0;
}
html body .cards2 {
  padding-left: 0.5%;
  padding-right: 0.5%;
}
html body .cardText a {
  font-size: 0.9em;
  margin:0.2em auto!important;
}
}
@media only screen and (min-width:1600px){
  

    .swiper-wrapper {
        gap: 1em;
    }
}


@media only screen and (max-width:1100px){  
  html body .row1 .buttons1 {
    justify-content: flex-start!important;
}


  .anchor3 {
    padding-left: 0!important;
    display: flex;
    justify-content: center;
}

  .text6 p {
    font-size: 2.2em;
}
  .row6 {
    margin-top: 5em;
}

  .stuck {
    padding: 5% 2%!important;
    background: #EEEDE9;
    border-bottom: #5D8C88 2px solid;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}


  html .blurbBlueprint {
    padding-left: 5%;
}

  html body  .buttons5 {
    flex-direction: row;
    gap: 2em;
    flex-wrap: wrap;
    justify-content: center;
    padding: 0 1%;
    position: sticky;
    top: 0;
    z-index: 10;
    transition: all 0.25s ease-in-out;
}

  html body .cards2 {
    gap: 0;
}
  html body .cards2 {
    flex-direction: column-reverse;
}
}








.bgImage img {
    width: 100%;
    height: 100%;
    object-fit: cover;

}


.flexContainer1 {
    display: flex;
    flex-direction: row;
    position: absolute;
    z-index: 1;
    top: 77%;
    width: 100%;
}

.flexContainer1>div {
    display: flex;
    flex: 1;
    padding: 0;
    margin: 0;
    justify-content: center;
    align-items: flex-start;
}

.text1 h3 {
    font-family: 'Montserrat';
    color: white;
    font-size: 2.3em;
    font-weight: bold;
    padding-left: 13%;
    margin: 0;
}

.text1 h1 {
  display: inline;
  color: white;
  font-family: 'Montserrat';
  font-weight: 300;
  line-height: 1.5em;
  font-size: 1.1em;
  margin: 0;
}

.text1 span {
    color: white;
    font-family: 'Montserrat';
    font-weight: 300;
    font-size: 1.1em;
    padding-right: 9em;
    line-height: 1.5em;
    padding-left: 13%;
    padding-right: 30%;
    margin: 0;
    padding-top: 2%;
}

.buttons1 {
  justify-content:center !important;
  align-items: center !important;
}

.text1 {
  flex-direction: column;
  align-items: flex-start !important;
}

.buttons1 a {
  font-family: 'Montserrat';
    text-decoration: none;
    color: #5D8C88;
    border-radius: 25px;
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 12px;
    padding-top: 12px;
    background-color: #A8D6C3!important;
    margin-right: 4%;
    width: fit-content;
}

.buttons1 a:nth-child(even):hover {
  color: white!important;
}

.buttons1 a:nth-child(even) {
  background-color: #5D8C88!important;
  color: #A8D6C3!important;
}



.text2 p {
  color: white;
    font-family: 'Montserrat';
    font-size: 1.2em;
    font-weight: 340;
    padding-left: 23%;
    padding-right: 23%;
    margin-bottom: 1.5%;
    text-align: center;
}

.text21 p {
    font-family: 'Montserrat';
    font-weight: 350;
    padding-top: 2em;
    padding-left: 24%;
    padding-right: 24%;
    margin: 0;
    text-align: center;
    color: white;
    font-size: 1.2EM;
}



.cards2 {
  display: flex;
  flex-direction: row;
  justify-content: center;
  gap: 3em;
  padding-left: 5%;
  padding-right: 5%;
  margin-top: 3%;
  margin-bottom: 3%;
}
.card {
  overflow: hidden;
  position: relative;
  display: flex;
  flex: 1;
}

.cardText {
  padding: 20px;
  background-color: rgba(255, 255, 255, 0.8);
  border: 1px solid #A8D6C3;
  border-radius: 26px;
  height: 470px;
  padding-left: 10%;
  padding-right: 13%;
  box-sizing: border-box;
}

.cardImage {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    transition: transform 0.5s ease;
    background-color: #EEEDE9;
    border-radius: 23px;
}



.cardText h2 {
  margin-top: 4%;
  font-family: 'Montserrat';
  color: #5D8C88;
  font-size: 2.7em;
  margin-bottom: 0;
}

.cardText p {
  font-family: 'Montserrat';
  font-size: 1em;
  font-weight: 300;
  line-height: 1.9em;
}

.row3 {
    padding-top: 5%;
}

.flexContainer3 {
    display: flex;
    flex-direction: row;
}
.flexContainer3>div {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding-left: 3.5%;
    padding-right: 6%;
}

.panel {
    padding-left: 10%;
}


.acorde {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}


.btnSvg {
    width: 52px;
    height: 46px;
    background: none;
    z-index: 1;
    position: relative;
    left: 53%;
}

.svg {
    width: fit-content;
    height: fit-content;
    cursor: pointer;
}

.svg svg.activeSVG path {
  fill: #5D8C88; 
	  transition: color 0.3s ease;
}


.rotate{
  animation: rotateAnimation 0.25s forwards !important;
}

@keyframes rotateAnimation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(90deg);
  }
}

.inRotate {
  animation: rotateInAnimation 0.25s forwards ;

}

@keyframes rotateInAnimation {
  0% {
      transform: rotate(90deg);
  }
  100% {
      transform: rotate(0deg);
     
  }
}


.title.activeTitle {
  color:  #5D8C88;
}

.colorTitle.active {
    color: #5D8C88; /* Cambia esto al color que desees */
}

.blurbBlueprint>div {
    display: flex;
    flex: 1;
    flex-direction: column;
}

.title{
    font-family: 'Montserrat';
    font-size: 1.8em;
    color:black;
	cursor: pointer;
	 transition: color 0.3s ease;
}

.calidad-content p, .diseno-content p, .innovacion-content p {
    font-family: 'Montserrat';
    font-size: 1.1em;
    font-weight: 300;
    line-height: 1.7em;
    color: #232323;
    padding-right: 15%;
}


.anchor3 {
    padding-top: 4%;
    padding-left: 10%;
}

.anchor3 a {
  font-family: 'Montserrat';
  text-decoration: none;
  color: #5D8C88;
  border-radius: 25px;
  padding-left: 40px;
  padding-right: 40px;
  padding-bottom: 10px;
  padding-top: 10px;
  background-color: #A8D6C3!important;
  display: block;
  width: fit-content;
  height: fit-content;
}

.paragraph3 {
    padding-top: 3%;
}

.paragraph3 p {
    font-family: 'Montserrat';
    font-size: 1.1em;
    font-weight: 300;
    padding-right: 20%;
    padding-left: 5%;
    line-height: 1.3em;
    color:#232323;
}

.row1{
  position: relative;
}

.row4 {
  padding-top: 4%;
  margin-top: 5%;
}
.row5 {
    padding-top: 5%;
}

.buttons5 {
  display: flex;
  flex-direction: row;
  padding-left: 12%;
  padding-right: 12%;
  justify-content: space-between;
}

.button {
  position: relative;
 cursor: pointer;
}

.active{

  transform: none!important;
}
.button.active::after {
    content: '';
    display: block;
    width: 86px;
    height: 25px;
    background-position: center;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    background-image: url('https://boathouseco.com/wp-content/uploads/2024/04/linea.webp');
    background-repeat: no-repeat;
    background-size: contain;
}

.shortRow {
  background-color: #5D8C88;
  padding: 2% 29% 2% 29%;
  margin-top: 8em;
  display: flex;
  flex-direction: column;
  gap: 0.5em;
}


.shortRow p {
  color: white;
  text-align: center;
  font-size: 1.2em;
  font-family: 'Montserrat';
  font-weight: 300;
}


.text5 {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.7em;
}

.buttons5 p {
  color: #5D8C88;
  font-family: 'Montserrat';
  font-size: 1.5em;
  font-weight: bold;
  width: fit-content;
  transition: all 0.25s ease-in-out;
}
.button:hover {
  transform: scale(1.15);
}

.text5 h3 {
  color: #5D8C88;
  font-family: 'Montserrat';
  font-size: 1.9em;
  font-weight: bold;
  width: fit-content;
}



.blurbsContainer {
    display: flex;
    flex-direction: column;
}


.blurbBlueprint {
  padding-left: 10%;
  padding-right: 5%;
  padding-top: 2%;
  display: flex;
  flex-direction: row;
  gap: 10em;
  align-items: center;
  margin: 5em 0;
}

.blurbBlueImagen img {
    width: 100%;
    height: fit-content;
}
.blurbText p {
    font-family: 'Montserrat';
    font-size: 1.2em;
    font-weight: 300;
    line-height: 1.3em;
    padding-right: 30%;
}


.button52 {
    padding-top: 5%;
    text-align: center;
    padding-bottom: 5%;
}

.button52 a {
  font-family: 'Montserrat';
    text-decoration: none;
    color: #A8D6C3;
    border-radius: 25px;
    padding-left: 10px;
    padding-right: 15px;
    padding-bottom: 10px;
    padding-top: 10px;
    background-color: #5D8C88!important;
}
.row6 {
    padding-top: 5%;
}

.text6 p {
    text-align: center;
    font-family: 'Montserrat';
    font-size: 1.3em;
    font-weight: 800;
    color: #5D8C88;
}

.flexContainer6 {
    display: flex;
    flex-direction: column;
    padding-bottom: 7%;
    position: relative;
}

.flexContainer6>div {
    display: flex;
    flex: 1;
    flex-direction: row;
    padding-right: 10%;
    padding-left: 10%;
}
svg, path {
    pointer-events: none;
}

.text {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 70%;
  position: relative;
}

.text h3 {
  font-size: 10em;
  font-weight: bold;
  margin: 0;
  font-family: 'Montserrat';
}

.text h4 {
  font-family: 'Montserrat';
  font-size: 1.5em;
  font-weight: 600;
  margin: 0;
  text-align: center;
  color: #5D8C88;
  padding-bottom: 5%;
}


.text p {
  font-family: 'Montserrat';
  font-size: 1em;
  font-weight: 300;
  padding-left: 20%;
  padding-right: 20%;
  text-align: center;
  margin: 0;
  flex: 1;
}

.text img {
  align-items: center;
  justify-content: space-between;
  padding-top: 10%;
}

.text:last-child h3 {
    color: #A8D6C3;
}
.text:nth-child(2) h3 {
    color: #5D8C88;
}


.swiper-pagination {
  top: 102.5%!important;
}
.swiperContainer4 {
    position: relative !important;
    padding-left: 2%;
    padding-right: 2%;
}

/* Agrega estilos de visualización predeterminados y oculta todos los blurbs */
.blurb {
    display: none;
}

/* Muestra el blurb activo */
.activeBlurb {
    display: block;
}



.panel-content.activePanel {
    display: block;
    max-height: 350px;
}

.panel-content {
    transition: all 0.35s ease-in-out;
    max-height: 0;
    overflow: hidden;
}
html body .swiper-pagination-bullet-active {
	   background-color: #A8D6C3 !important;
}


html body .row4 span.swiper-pagination-bullet {
  background: transparent;
  border: #A8D6C3 2px solid;
  opacity: 1;
  transition: all 0.25s ease-in-out;
}



.opacity1 {
    animation: opIn ease-in-out 0.6s forwards;
}

@keyframes opIn {

    0% {
        display: flex;
        opacity: 0.01;
    }
    
}


.text:not(:last-child)>h3:after {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.0' width='84.000000pt' height='20.000000pt' viewBox='0 0 84.000000 20.000000' preserveAspectRatio='xMidYMid meet'%3E%3Cg transform='translate(0.000000,20.000000) scale(0.100000,-0.100000)' fill='%23000000' stroke='none'%3E%3Cpath d='M670 186 c0 -2 7 -20 15 -40 l15 -36 -350 0 c-227 0 -350 -4 -350 -10 0 -6 122 -10 346 -10 l346 0 -6 -24 c-3 -13 -9 -31 -12 -40 -4 -11 12 -5 50 18 30 18 69 39 86 46 l30 13 -51 23 c-28 13 -63 33 -79 44 -27 19 -40 24 -40 16z'/%3E%3C/g%3E%3C/svg%3E");
  width: 115px;
  height: 40px;
  background-repeat: no-repeat;
  position: absolute;
  top: 12%;
  left: 100%;
  background-position: center;
  background-size: contain;
  transform: translateX(-50%);
}



@media screen and (min-width: 500px)  and  (max-width: 1100px) {

  html .shortRow {
    padding: 6% 2% 6% 2%;
    gap: 1.8em;
}

  .text5 {
    margin-bottom: 3em;
}

  .blurbImage {
    margin-top: 2em;
}

  html body .cardText {
 
    display: flex;
    flex-direction: column;
    gap: 1em;
}

  .text1>* {
    padding-left: 0!important;
}
.buttons1 {
    padding-left: 2%!important;
}

.buttons1 a {
    text-wrap: nowrap;
    white-space: nowrap;
}




  .row5 {
    margin-top: 4em;
}

  * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    width: 100%;
}


.flexContainer1 {
    top: 67%;
    width: 80%;
    flex-direction: column;
}

.text2 p {
  text-align: center;
  padding: 0;
}

.cards2 {
  align-items: center;
  padding-top: 4%;
  flex-direction: column;
}

.text21 p {
  padding: 0;
}

.btnSvg {
  left: 0%;
}
	.svg {
    right: 20%;
}
	
.title {
    width: fit-content;
}
	
.flexContainer3 {
  display: flex;
  flex-direction: column;
}
.flexContainer3>div {
  padding-bottom: 6%;
}


.image3 {
  margin-left: 5%;
}



.paragraph3 p {
  text-align: center;
  padding: 0;
}




.blurbBlueprint {
  flex-direction: column;
  gap: 5em;
}

.blurbBlueImagen {
  width: 100%;
}
.flexContainer6>div {
  flex-direction: column;
  gap: 8em;
}

.text {
  width: 100%;
  text-align: center;
}

.text:not(:last-child)>h3:after {
  top: 100%;
  left: 50%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19.02 83.56'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:none;stroke:%231a1a1a;stroke-miterlimit:10;stroke-width:2px;%7D.cls-2%7Bfill:%231a1a1a;%7D%3C/style%3E%3C/defs%3E%3Cg id='Capa_2' data-name='Capa 2'%3E%3Cg id='Capa_6' data-name='Capa 6'%3E%3Cline class='cls-1' x1='9.51' x2='9.51' y2='71.49'/%3E%3Cpath class='cls-2' d='M9.51,83.56C7.4,77.88,3.81,70.83,0,66.46L9.51,69.9,19,66.46C15.21,70.83,11.62,77.88,9.51,83.56Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  height: 115px;
  width: 40px;
  transform: translate(-50%, 25%);
}

.acorde {
  margin-bottom: 1em;
}

.text img {
  padding-top: 10%;
  width: 20%;
}
.row6 {
  margin-bottom: 3em;
}
.blurbText p {
  padding-right: 0;
  text-align: center;
}
.accordion {
  gap: 2em;
}
html body .cards2 {
  gap: 2em!important;
}


}



@media screen and (min-width: 200px)  and (max-width: 500px) {
  html body .blurbBlueprint {
    margin-bottom: 1em;
}
.button52 {
  margin-bottom: 1em;
}
 
  .cardText a{
    font-size: 0.8em!important;
    white-space: nowrap!important;
    text-wrap: nowrap!important;
  }

  html .card{
    margin: 10px;
  }

  html body .buttons1 a {
    font-size: 0.8em;
}

  .anchor3 {
    margin-top: 1.2em;
    margin-bottom: 0.5em;
}
 
  .blurbText p {
    padding: 3px 3%;
    text-align: center;
    line-height: 1.4em;
}
  html .shortRow {
    padding: 4% 2% 4% 2%;
}

  html body .row4 .swiperContainer4 span.swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    margin-left: 5px;
    margin-right: 5px;
}
html .bgLogo {
  top: 22%;
}
  .row5 {
    margin-top: 4em;
}

    .text1>* {
        filter: drop-shadow(2px 4px 6px black);
    }

    html body .buttons1 {
        flex-direction: column;
        gap: 1em;
        align-items: flex-start!important;
        padding-left: 5%!important;
    }
    html .text1 h3{
        padding-left:5%;
    }
    html body .text1 span {
        padding-left: 5%;
    }
    .flexContainer1 {
      top: 30%!important;
      width: 90%;
      flex-direction: column;
      gap: 1em;
  }
    .card {
        width: fit-content;
        margin: 20px;
        overflow: hidden;
        position: relative;
        height: 60vh;
        border-radius: 20px;
    }



.flexContainer1 {
  top: 52%;
  width: 90%;
  flex-direction: column;
}


.text2 p {
  text-align: center;
  padding-left: 5%;
  padding-right: 5%;
}

.cards2 {
  flex-direction: column;
}


.row3 {
  padding-top: 10%;
}

.flexContainer3 {
  flex-direction: column;
}

.btnSvg {
  left: 15%;
}
.svg {
  right: 9%;
}
.panel-content.activePanel {
  max-height: 570px;
}

.image3 {
  width: 100%;
  object-fit: cover;
}

.image3 img {
  width: 107%;
  height: 100%;
  object-fit: cover;
}



.paragraph3 p {
  padding-right: 5%;
  padding-left: 5%;
  text-align: center;
}

.buttons5 p {
  margin: 0;
}



.blurbBlueprint {
  padding-left: 5%;
  padding-right: 5%;
  padding-top: 2%;
  display: flex;
  flex-direction: column;
  gap: 0em;
}
.blurbBlueImagen {
  width: 100%;
}

.blurbImage img {
  width: 100%;
}

	 .row6 {
    margin-bottom: 3em;
}
	
.flexContainer6>div {
  flex-direction: column;
  padding-right: 0;
  padding-left: 0;
  align-items: center;
  justify-content: center;
  gap: 10em;
}

.text {
  width: 100%;
}

.text:not(:last-child)>h3:after {
  top: 100%;
  left: 50%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19.02 83.56'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:none;stroke:%231a1a1a;stroke-miterlimit:10;stroke-width:2px;%7D.cls-2%7Bfill:%231a1a1a;%7D%3C/style%3E%3C/defs%3E%3Cg id='Capa_2' data-name='Capa 2'%3E%3Cg id='Capa_6' data-name='Capa 6'%3E%3Cline class='cls-1' x1='9.51' x2='9.51' y2='71.49'/%3E%3Cpath class='cls-2' d='M9.51,83.56C7.4,77.88,3.81,70.83,0,66.46L9.51,69.9,19,66.46C15.21,70.83,11.62,77.88,9.51,83.56Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  height: 115px;
  width: 40px;
  transform: translate(-50%, 25%);
}

html body .cards2 {
  padding: 0;
}
html body .cards2 .textinImage>p {

  font-size: 1.2em;

}
.cards2>div:nth-of-type(1) img {
  object-position: 81%!important;
}
	
	.textinImage a {
		display:block;
	}
	.cardText a {
		font-size: 0.8em;
	}



}



@media only screen and (min-width:200px) and (max-width:1100px){
  .text21 p {
    padding-top: 10%;
    padding-left: 5%;
    padding-right: 5%;
  }
  html body .textinImage {
    padding-bottom: 0.3em;
    padding-top: 0.3em;
}

}




@media only screen and (min-width:1000px) and (max-width:1300px){
  .textinImage>* {
    font-size: 1.2em!important;
}
}



.text21 {
  padding-bottom: 2em;
  background-color: #5D8C88;
}
.text2 {
  padding: 2em 0;
  background-color: #5D8C88;
}


/*
BG IMAGES OBJECT POSITION
*/

.bgImage1 img {
  object-position: 0% 98%;
}
.bgImage3 img {
  object-position: 0% 71%;
}
.bgImage4 img {
  object-position: 0% 60%;
}
.bgImage5 img {
  object-position: 0% 60%;
}



@media only screen and (min-width:200px) and (max-width:1100px){
  .bgImage1 img {
    object-position: 71% 0%;
}
.bgImage2 img {
  object-position: 50% 0%;
}
.bgImage3 img {
  object-position: 80% 0%;
}
.bgImage4 img {
  object-position: 95% 0%;
}
.bgImage5 img {
  object-position: 30% 0%;
}

}

/*
*/