/********** columnsBlocks ****************/

.thera-flex {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
  flex-flow: row wrap;
	margin: 0 -10px;
	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
  justify-content: space-between;
	-webkit-align-content: space-around;
  align-content: space-around;
	/*for IE 9- */
	text-align: center;
}

.thera-flexbox {
  -webkit-box-flex: 1 0 0;
  -moz-box-flex: 1 0 0;
  -webkit-flex: 1 0 0;
  -ms-flex: 1 0 0;
	-moz-flex: 1 0 0;
	flex: 1 0 0;
	min-width: 250px;
  margin: 10px;
	padding: 15px 1% 1%;
	text-align: left;
	/* For IE 9- */
	display: inline-block;
	vertical-align: top;

}


/*********** Animations IDD ********/

.animated-background {
	position: absolute;
	top: 18em;
	left: 0;
	width: 100%;
	height: calc(100% + 114px - 30em);
	overflow: hidden;
}

/* Taille, forme, couleur... */
.animated-background p {
	position: absolute;/*! display: inline-block; */
  font-size: 4em;
	font-weight: 500;
  margin: 0;
	color: #91b6d3;
	color: rgba(0,32,61,0.2);
	animation-iteration-count: infinite;
  animation-direction: alternate;
	animation-timing-function: linear;
}

.animated-background p.big {
	font-size: 6em;
	font-weight: 300;
}

.animated-background p.small {
	font-size: 3em;
}

.animated-background p.red {
	color: #ec9409;
	color: rgba(77,0,0,0.2)
}

.animated-background p.green {
	color: #88b946;
	color: rgba(0,35,0,0.2);
}

.animated-background p.yellow {
	color: #e6df00;
	color: rgba(80,73,0,0.2);
}

.animated-background p.light {
	font-weight: 300;
}

/* Position */

.animated-background .odd1 {
	left: 3vw;
	top: -3%;
	animation-duration: 120s;
	animation-delay: -5s;
}

.animated-background .qppv {
    top: 2%;
    left: 15vw;
		animation-duration: 180s;
		animation-delay: -138s;
}

.animated-background .pil {
    top: 38%;
    left: 4vw;
		animation-duration: 150s;
		animation-delay: -20s;
}

.animated-background .ctd {
    top: 25%;
    left: 10vw;
		animation-duration: 150s;
		animation-delay: -47s;
}

.animated-background .rmp {
    top: 22%;
    left: 20vw;
		animation-duration: 90s;
		animation-delay: -87s;
}

.animated-background .impd {
    top: 38%;
    left: 12vw;
		animation-duration: 150s;
		animation-delay: -34s;
}

.animated-background .ma {
    top: 51%;
    left: 3vw;
		animation-duration: 120s;
		animation-delay: -116s;
}

.animated-background .impd2 {
    top: 82%;
    left: 10vw;
		animation-duration: 120s;
		animation-delay: -111s;
}

.animated-background .ectd {
    top: 68%;
    left: 15vw;
		animation-duration: 180s;
		animation-delay: -42s;
}

.animated-background .odd2 {
    top: 3%;
    right: 14vw;
		animation-duration: 120s;
		animation-delay: -94s;
}

.animated-background .qppv2 {
    top: 26%;
    right: 4vw;
		animation-duration: 180s;
		animation-delay: -2s;

}

.animated-background .ctd2 {
    top: 14%;
    right: 4vw;
		animation-duration: 120s;
		animation-delay: -114s;
}

.animated-background .pip {
    top: 54%;
    right: 7vw;
		animation-duration: 90s;
		animation-delay: -19s;
}

.animated-background .ctd3 {
    top: 44%;
    right: 15vw;
		animation-duration: 150s;
		animation-delay: -98s;

}

.animated-background .psur {
    top: 62%;
    right: 18vw;
		animation-duration: 180s;
		animation-delay: -3s;

}

.animated-background .pil2 {
    top: 76%;
    right: 1vw;
		animation-duration: 90s;
		animation-delay: -114s;
}

.animated-background .rmp2 {
    top: 68%;
    right: 10vw;
		animation-duration: 150s;
		animation-delay: -4s;

}

/* Animation */

p.ani-left {
	animation-name: moveRight, brightness;
}

p.ani-right {
	animation-name: moveLeft, brightness;
}

.animated-background p.ani-reverse {
	animation-direction: alternate-reverse;
}


@keyframes moveRight {
 from {
	 left: 0;
 }
 50% {
	 left: 25vw;
 }
 55% {
	 left: 60vw;
 }
 to {
	 left: 90vw;
 }
}

@keyframes moveLeft {
	from {
		right: 0;
	}
	50% {
		right: 25vw;
	}
	55% {
		right: 60vw;
	}
	to {
		right: 90vw;
	}
}