.animToRight-animation {
    animation-name: paraDireita;
    animation-duration: 2s;
    /*--*/
    animation-delay: 0s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-timing-function:ease;
    animation-fill-mode: both;
    /*animation-play-state: running;*/

}
.animToLeft-animation {
    animation-name: paraEsquerda;
    animation-duration: 2s;
    }
.animToBottom-animation {
    animation-name: paraBaixo;
    animation-duration: 2s;
}
.animToTop-animation {
    animation-name: paraCima;
    animation-duration: 2s;
}
.animFadeIn-animation {
    animation-name: fadeIn;
    animation-duration: 3s;
}
.animSwingX-animation {
    animation-name: swingX;
    animation-duration: 1.0s;
}
@keyframes paraDireita {
    from {
        left: -40em;
    }
    to {
        left: 0px;
    }
}
@keyframes paraEsquerda {
    from {
        left: +40em;
    }
    to {
        left: 0px;
    }
}
@keyframes paraBaixo {
    from {
        bottom: 40em;
    }
    to {
        bottom: 0px;
    }
}
@keyframes paraCima {
    from {
        bottom: -40em;
    }
    to {
        bottom: 0px;
    }
}
@keyframes fadeIn {
    from {
        opacity: 0%;
    }
    to {
        opacity: 100%;
    }
}
@keyframes wiggle {
    0%, 7% {
      transform: rotateZ(0);
    }
    15% {
      transform: rotateZ(-15deg);
    }
    20% {
      transform: rotateZ(10deg);
    }
    25% {
      transform: rotateZ(-10deg);
    }
    30% {
      transform: rotateZ(6deg);
    }
    35% {
      transform: rotateZ(-4deg);
    }
    40%, 100% {
      transform: rotateZ(0);
    }
  }

@keyframes swingX {
  0% {
   opacity: 0%;
  }
	12%, 67% {
		/* transform: rotateX(20deg); */
		transform: rotate3d(1,0,0.1,20deg); 
	}
	25%, 75% {
		/* transform: rotateX(0deg); */
		transform: rotate3d(0,0,0,0deg); 
  }
  50% {
    transform: rotate3d(0,0,0,0deg); 
    opacity: 50%;
  }
  37%, 87% {
		/* transform: rotateX(-20deg); */
		transform: rotate3d(1,0,0.1,-20deg); 
	}
}  

.tituloWrapper{
    width: 100%;
    height: 200px;
    background-image: url("/Images/Flor_da_vida.jpg");
    background-repeat: repeat;
    background-size:47.6px;
    display:flex;
    justify-content: center;
  }
.tituloCapa {
  flex-grow: 1;
  align-self: flex-start;
  margin: 20px;
  background-color: white;
  display:flex;
  justify-content: center;
}
.imgTituloCapa {
  margin-top: 8px;
  margin-bottom: 4px;
  margin-right: 24px;
  margin-left: 8px;
}
.txtTituloCapa {
  margin-right: 8px;
}
.parte1TituloCapa {
    margin-top: 1em;
    text-align: center;
    font-size: 2.0em;
    font-weight: bold;
    }
.parte2TituloCapa {
    margin-top: 1em;
    margin-bottom: 1em;
    text-align: center;
    font-size: 1.5em;
    }
.titulo {
    margin-top: 1em;
    font-weight:600;
    font-size: 2em;
}
.subTitulo {
    margin-top: 0.5em;
    font-size: 1.5em;
    color: rgb(115, 168, 163);
    /*color: rgb(144, 210 204);*/ /* green text */
}
.boxContainer {
    margin-top: 1em;;
    background-color: white;
}
.box {
    margin: 1em;
    border-color: white;
    background-color:rgb(242, 250, 249); /*light green*/
    text-align: left;
}
.boxTitulo {
    margin: 1em;
    font-size: 1.5em;
    color: rgb(115, 168, 163); /* Green */
}
.boxTexto {
    text-align: left;
    margin: 1em;
    font-size: 1.2em;
}
.texto {
    display: table-cell;
    text-align: left;
    line-height: 1.5em;
    vertical-align: middle;
    font-weight: 500;
    font-size: 1.2em;
}
.textoContatos {
    margin: 1em;
    text-align: center;
    line-height: 1.5em;
    vertical-align: middle;
    font-weight: 500;
    font-size: 1.2em;
}
.lista {
    margin-block: 0;
    text-align: left;
    font-size: 1.5em;
}
.barraExpande {
    height: 4em;
}
.barraExpande:hover {
    height: 4em;
}

/* .sibling-hover:hover ~ .sibling-highlight {
    display:block;
}
.sibling-hover2:hover ~ .sibling-highlight2 {
    display:block;
}
.sibling-hover3:hover ~ .sibling-highlight3 {
    display:block;
} */

.button {
    background-color: rgb(115, 168, 163); /* Green */
    margin: 1em;
    margin-top: 0;
    border: none;
    color: white;
    padding: 10px 32px;
    text-align: center;
    text-decoration: none;
    font-size: 16px;
    cursor: pointer;
  }
.link {
    margin-top: 2em;;
    line-height: 2em;
    padding: 10px 6em;
    text-align: center;
    display: inline-block;
  }
.whiteBoxContainer {
    margin: 1em;
    background-color:rgb(242, 250, 249); /*light green*/
    padding: 1em;
}
.whiteBox {
    margin: 1em;
    border-color: white;
    background-color:white;
    text-align: left;
}
.lightgreen {
    background-color:rgb(242, 250, 249); /*light green*/
}
.rodape {
    margin: 1em;
    vertical-align: middle;
    line-height: 2em;
    background-color: rgb(115, 168, 163); /* Green */
}
/* For mobile phones: */
/* @media only screen and (min-width: 425px) { */
    /* sbys... */
    [class*="sbys"] {
        float: left;
        position: relative;
        }
    .sbys100 {width: 100%;}
    .sbys95 {width: 95%;}
    .sbys90 {width: 95%;}
    .sbys80 {width: 95%;}
    .sbys75 {width: 95%;}
    .sbys70 {width: 95%;}
    .sbys67 {width: 95%;}
    .sbys65 {width: 95%;}
    .sbys60 {width: 95%;}
    .sbys55 {width: 95%;}
    .sbys50 {width: 95%;}
    .sbys45 {width: 95%;}
    .sbys41 {width: 70%;}
    .sbys40 {width: 95%;}
    .sbys33 {width: 95%;}
    .sbys30 {width: 95%;}
    .sbys25 {width: 95%;}
    .sbys20 {width: 95%;}
    .sbys24 {width: 50%;}
    .sbys10 {width: 10%;}
    .sbys5 {width: 5%;}
/* } */
  
/* For wide screens: */
@media only screen and (min-width: 768px) {
    /* sbys... */
    [class*="sbys"] {
        float: left;
        position: relative;
        }
    .sbys100 {width: 100%;}
    .sbys95 {width: 95%;}
    .sbys90 {width: 90%;}
    .sbys80 {width: 80%;}
    .sbys75 {width: 75%;}
    .sbys70 {width: 70%;}
    .sbys67 {width: 66.66%;}
    .sbys65 {width: 65%;}
    .sbys60 {width: 60%;}
    .sbys55 {width: 55%;}
    .sbys50 {width: 50%;}
    .sbys45 {width: 45%;}
    .sbys41 {width: 41%;}
    .sbys40 {width: 40%;}
    .sbys33 {width: 33.33%;}
    .sbys30 {width: 30%;}
    .sbys25 {width: 25%;}
    .sbys24 {width: 24%;}
    .sbys20 {width: 20%;}
    .sbys10 {width: 10%;}
    .sbys5 {width: 5%;}
}