/*
Theme Name:           Flatsome
Theme URI:            http://flatsome.uxthemes.com
Author:               UX-Themes
Author URI:           https://uxthemes.com
Description:          Multi-Purpose Responsive WooCommerce Theme
Version:              3.19.5
Requires at least:    6.4
Requires PHP:         7.4
WC requires at least: 8.3
Text Domain:          flatsome
License:              https://themeforest.net/licenses
License URI:          https://themeforest.net/licenses
*/

/***************
All custom CSS should be added to Flatsome > Advanced > Custom CSS,
or in the style.css of a Child Theme.
***************/


.col-plus {
    position: relative;
}

.col-plus:not(:last-child)::after {
    content: '+';
    font-size: 80px;
    color: yellow;
    position: absolute;
    right: -20px; /* Adjust spacing as needed */
    top: 50%;
    transform: translateY(-50%);
}

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


.ux-maintenance-mode banner {
  background-color: black !important;
}

.loopButtonPrimary, 
.submit,
button {
  background-color: #fffc10 !important;
  color: black !important;
}

h1 {
  text-align: center;
  margin: 40px 0;
  font-size: 40px;
  font-family: sans-serif;
  text-transform: uppercase;
  font-weight: bold;
}
.slick-slide .inner {
  margin: 0 15px;
  background: white;
}

.quote {
  font-weight: 100 !important;
  font-style: italic !important;
  text-align: center !important;
}

.header-inner {
  padding-left: 4rem;
}

.bannerPrincipal {
  padding-left: 4rem;
  padding-right: 4rem;
}

.slick-slide .inner {
  background-color: black;
  margin: 0 15px;
}

.lead {
  position: relative;
  font-size: 2rem !important; /* Example font size, adjust as needed */
  text-align: center;
  padding-left: 2rem; /* Space for the left bracket */
  padding-right: 2rem; /* Space for the right bracket */
  font-style: italic !important;
}

.lead::before,
.lead::after {
  font-size: 2rem; /* Adjust size as needed */
  position: absolute;
  top: 0;
  height: 100%; /* Adjust height to match the full paragraph */
  display: flex;
  align-items: center; /* Center the brackets vertically */
}



.wrapper{
	width: 100%;
	position: relative;
	margin: 0 auto;
  font-size:1rem;

}
.sentence{
	margin: 0 auto;
	text-align: left;
	
}
.sentence span{
	color: white;
	font-size: 3em;
	font-weight: 300;
  	
}
.words{
	display: inline;
	text-indent: 10px;
}
.words span{
	position: absolute;
	opacity: 0;
	overflow: hidden;
	width: 100%;
  font-weight: 700;
}
.rotate span{
	-webkit-animation:  rotateWord 5s linear infinite;
	        animation:  rotateWord 5s linear infinite;
}
.words span:nth-child(1) {
	color: #FFFF13;
}
.words span:nth-child(2) { 
	color: #FFFF13;
	-webkit-animation-delay: 3s; 
	        animation-delay: 3s; 
}
.words span:nth-child(3) { 
	color: #FFFF13;
	-webkit-animation-delay: 6s; 
	        animation-delay: 6s; 
}
.words span:nth-child(4) {
	color: #FFFF13; 
	-webkit-animation-delay: 9s; 
	        animation-delay: 9s; 
}
.words span:nth-child(5) {
	color: #FFFF13;
	-webkit-animation-delay: 12s; 
	        animation-delay: 12s; 
}
.words span:nth-child(6) {
	color: #FFFF13;
	-webkit-animation-delay: 15s; 
	        animation-delay: 15s; 
}
@-webkit-keyframes rotateWord {
    0% { opacity: 0; }
    2% { opacity: 0; -webkit-transform: translateY(-30px); }
	5% { opacity: 1; -webkit-transform: translateY(0px);}
    25% { opacity: 1; -webkit-transform: translateY(0px); }
	27% { opacity: 0; -webkit-transform: translateY(30px); }
	80% { opacity: 0; }
    100% { opacity: 0; }
}
@-ms-keyframes rotateWord {
    0% { opacity: 0; }
    2% { opacity: 0; -ms-transform: translateY(-30px); }
	5% { opacity: 1; -ms-transform: translateY(0px);}
    17% { opacity: 1; -ms-transform: translateY(0px); }
	20% { opacity: 0; -ms-transform: translateY(30px); }
	80% { opacity: 0; }
    100% { opacity: 0; }
}
@keyframes rotateWord {
    0% { opacity: 0; }
    2% { opacity: 0; -webkit-transform: translateY(-30px); transform: translateY(-30px); }
	5% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px);}
    17% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); }
	20% { opacity: 0; -webkit-transform: translateY(30px); transform: translateY(30px); }
	80% { opacity: 0; }
    100% { opacity: 0; }
}
@media screen and (max-width: 420px) {
    .words{
	display: block;
	text-indent: 0px;
}
}