/* GENERIC */
	/* Titles */
	/* Underline animation */
/* SLIDER */
/* INTRO */
/* CITY ROADS */
/* FEATURES */
	/* Features map */
/* CATALOG */
	/* Product */
/* ANIMATIONS */
	/* Show on scroll */
/* MEDIA QUERIES */


/* -------------------------------------------------- SWITCHER TABS SPECS ---------- */

.tab-slider--nav {
    width: 100%;
    display: flex;
    margin: auto;
    justify-content: center;
}

.tab-slider--tabs{
	display: block;
	float: left;
	margin: 0;
	padding: 0;
	list-style: none;
	position: relative;
	border-radius: 35px;
	overflow: hidden;
	background: #fff;
	height: 35px;
	user-select: none; 
	&:after{
		content: "";
		width: 50%;
		background: #417a50;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		transition: all 250ms ease-in-out;
		border-radius: 35px;
	}
	&.slide:after{
		left: 50%;
	}
}

.tab-slider--trigger {
    font-size: 15px;
    font-family: 'Gotham-Bold';
    line-height: 1;
    font-weight: bold;
    color: #78a884;
    text-align: center;
    padding: 15px 6px;
    position: relative;
    z-index: 2;
    cursor: pointer;
    display: inline-block;
    transition: color 250ms ease-in-out;
    user-select: none;
    width: 110px;
}
li.tab-slider--trigger.active {
    color: #fff;
}
.tab-slider--body{
}

/* -------------------------------------------------- GENERIC ---------- */
body#fabric-mini-light *,
body#fabric-mini-light *:before,
body#fabric-mini-light *:after{
	font-family: Gotham;
	line-height: initial;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
}

/* Layout */
body#fabric-mini-light,
#fabric-mini-light #center_column{font-size: 1em !important;}

body#fabric-mini-light,
#fabric-mini-light #vp_wapper_head{background: #000;}

#fabric-mini-light #vp_wapper_head > .vp_container.clearfix{font-size: 12px;}

#fabric-mini-light #vp_wapper_head > #vp_waper_columns{
	/*background: url(styles/breadcrumb_style1.jpg) left top repeat-x #fff;*/
	background: #000;
	padding-top: 0;
}
#fabric-mini-light #vp_wapper_head > #vp_waper_columns > #columns{
	width: 100% !important;
	padding: 0;
}
#fabric-mini-light #menu-option span{background: url(../img/nav.png) 6px 4px no-repeat;}

/* Tags */
#fabric-mini-light section,
#fc-slider > .swiper-container{
	position: relative;
	background-color: #000;
	padding-top: 15vh; /* 10em */
	padding-bottom: 15vh;
}
#fabric-mini-light section p,
#fabric-mini-light section a{
	line-height: 1.8em;
	letter-spacing: 0.07em;
	margin-bottom: 1.5em;
}
#fabric-mini-light section p{
	font-size: 1.1em;
	padding: 0;
}

#fabric-mini-light section a{
	text-decoration: none;
	-webkit-tap-highlight-color: transparent;
}
#fabric-mini-light section ul{position: relative;}

#fabric-mini-light section li{list-style: none;}

/* Section content */
#fabric-mini-light section .section-content{
	width: 1200px;
	margin: auto;
}

/* Unselectable */
#fabric-mini-light .unselectable{
	cursor: default;
	-webkit-user-select: none;
	-moz-user-select: none;
	-webkit-tap-highlight-color: transparent;
}

/* Language selector */
#fabric-mini-light #languages_block_top #countries .countries_ul_hover{box-sizing: initial;}
#fabric-mini-light #languages_block_top #countries .countries_ul_hover > li{line-height: 25px;}

/* Live chat */
#fabric-mini-light .mylivechat_inline{display: none;}

/* --------------------------------- GENERIC - TITLES */
#fabric-mini-light section h1,
#fabric-mini-light section h2,
#fabric-mini-light section h3,
#fabric-mini-light section h4{
	display: inline-block;
	width: 100%;
	font-weight: bold;
    letter-spacing: 0.05em;
	line-height: 1.5em;
	text-align: center;
	text-transform: uppercase;
	color: #fff;
	margin: 0 0 1em 0;
}
#fabric-mini-light section h1{font-size: 3em !important;}
#fabric-mini-light section h2{font-size: 2.5em !important;}
#fabric-mini-light section h3{font-size: 2em !important;}
#fabric-mini-light section h4{font-size: 1.5em !important;}

/* --------------------------------- GENERIC - UNDERLINE ANIMATION */
#fabric-mini-light .underline-animation{
	display: inline-block;
	font-size: 1em;
	font-weight: bold;
	text-transform: uppercase;
}
#fabric-mini-light .underline-animation > span{display: inline-block;}

#fabric-mini-light.underline-animation > span > span{
	display: block;
	font-size: 1em;
	line-height: 1.8em;
	letter-spacing: 0.15em;
	margin: 0;
}
#fabric-mini-light .underline-animation > span:after{
	content: '';
	display: block;
	border-bottom: 2px solid;
	opacity: 0.5;
	margin-top: 0.5em;
}
#fabric-mini-light .underline-animation > span > span,
#fabric-mini-light .underline-animation > span:after{
	transition:
		transform 0.3s cubic-bezier(0.5, 0.6, 0.3, 1),
		opacity 0.3s cubic-bezier(0.5, 0.6, 0.3, 1);
    -webkit-transition:
		transform 0.3s cubic-bezier(0.5, 0.6, 0.3, 1),
		opacity 0.3s cubic-bezier(0.5, 0.6, 0.3, 1);
    -moz-transition:
		transform 0.3s cubic-bezier(0.5, 0.6, 0.3, 1),
		opacity 0.3s cubic-bezier(0.5, 0.6, 0.3, 1);
}
#fabric-mini-light .underline-animation:hover > span > span,
#fabric-mini-light a:hover > .underline-animation > span > span{
	transform: translateY(0.25em);
	-webkit-transform: translateY(0.25em);
	-moz-transform: translateY(0.25em);
}
#fabric-mini-light .underline-animation:hover > span:after,
#fabric-mini-light a:hover > .underline-animation > span:after{
	opacity: 1;
	transform: translateY(-0.25em);
	-webkit-transform: translateY(-0.25em);
	-moz-transform: translateY(-0.25em);
}

/* -------------------------------------------------- SLIDER ---------- */
section#fc-slider{padding: 0 !important;}

#fc-slider .swiper-container{
    width: 100%;
    height: calc(100vh - 170px);
	min-height: 300px;
}
#fc-slider .swiper-container:after{
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 50;
	width: 100%;
	height: 100%;
	opacity: 0.5;
}

/* Slides wrapper */
#fc-slider .swiper-wrapper{
	position: absolute;
	top: 0;
	left: 0;
	background-color: #fff;
}
#fc-slider .swiper-wrapper > .swiper-slide{opacity: 1;}

#fc-slider #first-slide{background: url(https://fabricbike.com/themes/fabricbivp_handbag/img/fabric-mini-light/slide1-bici-paseo-hombre.jpg) no-repeat center center / cover;}
#fc-slider #second-slide{background: url(https://fabricbike.com/themes/fabricbivp_handbag/img/fabric-mini-light/slide2-bici-paseo-hombre.jpg) no-repeat center center / cover;}
#fc-slider #third-slide{background: url(https://fabricbike.com/themes/fabricbivp_handbag/img/fabric-mini-light/slide3-bici-paseo-hombre.jpg) no-repeat center center / cover;}

/* Progress bar */
#fc-slider .swiper-pagination-progress{
	z-index: 100;
	height: 8px;
	background-color: rgba(201, 241, 232, 0); /* +20pt */
}
#fc-slider .swiper-pagination-progress > span{background-color: rgba(0, 0, 0, 0);}

/* Info */
#fc-slider .slider-info{
	position: relative;
	z-index: 100;
}
#fc-slider .slider-info > article{
	width: 100%;
	max-width: 25em;
}
#fc-slider .slider-info > article > *{color: #fff;}

#fc-slider .slider-info > article > h1{
	text-align: left;
	margin-bottom: 0.5em;
}
#fc-slider .slider-info > article > h1:after{content: '.';}

#fc-slider .slider-info > article > p{
	font-size: 1.5em;
    font-style: italic;
	margin-bottom: 1em;
}

/* Controllers */
#fc-slider .prev-button,
#fc-slider .next-button{
	display: flex;
	align-items: center;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	width: 5em;
	height: 100%;
	text-align: center;
	stroke: rgba(255,255,255,0.3);
	transition: stroke 0.5s ease;
    -webkit-transition: stroke 0.5s ease;
    -moz-transition: stroke 0.5s ease;
}
#fc-slider .next-button{
	left: auto;
	right: 0;
}
#fc-slider .prev-button:hover,
#fc-slider .next-button:hover{stroke: rgba(255,255,255,1);}

#fc-slider .prev-button > svg,
#fc-slider .next-button > svg{width: 100%;}

/* Show more */
#fc-slider .show-more{
	position: absolute;
	bottom: 0;
	left: calc(50% - 5em);
	z-index: 100;
	display: inline-block;
	width: 10em;
	height: 10em;
	margin: auto;
}
#fc-slider .show-more:after{
	content: '';
	display: block;
	position: absolute;
	top: 20%;
	left: 20%;
	z-index: 100;
	width: 60%;
	height: 60%;
	background: url(../img/fabric-mini-light/logo-city-classic.png) no-repeat center center / 100% auto;
	transition: transform 0.2s ease;
    -webkit-transition: transform 0.2s ease;
    -moz-transition: transform 0.2s ease;
}
#fc-slider .show-more:hover:after{
	animation: zoomBounce 0.8s linear;
	-webkit-animation: zoomBounce 0.8s linear;
	-moz-animation: zoomBounce 0.8s linear;
}

/* -------------------------------------------------- INTRO ---------- */
section#fc-intro{
    padding-top: 40px;
}

/*#fc-intro article{text-align: center;}*/

#fc-intro img {
    width: 55%;
    display: block;
    max-width: 750px;
    margin: 0px auto 40px auto;
    position: relative;
    padding-top: 0px;
    padding-bottom: 0px;
    background: #00000000;
}


img.mini-bike {
    border-radius: 40px;
}


#fc-intro p.quote{
	position: relative;
	width: 100%;
	max-width: 26em;
	font-size: 1.3em;
	font-style: italic;
	text-align: center;
	color: #767688;
	padding: 1.5em;
	margin-left: auto;
	margin-right: auto;
}
#fc-intro p.quote:before{
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 1.5em;
	z-index: -1;
	width: 2em;
	height: 1.2em;
	background: url(../img/fabric-mini-light/quotes.png) no-repeat center center / auto 100%;
	opacity: 0.5;
}
#fc-intro .info{
	overflow: hidden;
	text-align: center;
	padding-bottom: 40px;
}
#fc-intro .info > p{
	text-align: left;
	color: #9797a5;
}
#fc-intro .info > p > a{
	display: inline-block;
	position: relative;
	color: #9797a5;
	margin: 0;
	transition: color 0.3s ease;
    -webkit-transition: color 0.3s ease;
    -moz-transition: color 0.3s ease;
}
#fc-intro .info > p > a:after{
	content: '';
	display: block;
	position: absolute;
	left: 0;
	width: 100%;
	border-bottom: 1px solid #dddde3;
	transition:
		border-color 0.3s ease,
		transform 0.3s ease;
    -webkit-transition:
		border-color 0.3s ease,
		transform 0.3s ease;
    -moz-transition:
		border-color 0.3s ease,
		transform 0.3s ease;
}
#fc-intro .info > p > a:hover{color: #767688;}
#fc-intro .info > p > a:hover:after{
	border-color: #767688;
	transform: translateY(-0.1em);
	-webkit-transform: translateY(-0.1em);
	-moz-transform: translateY(-0.1em);
}

#fc-intro .underline-animation{
	color: rgba(193, 193, 193, 0.62);
	margin: 3em 6em 0 0;
}
#fc-intro .underline-animation:last-of-type{margin: 1em 0;}

/* -------------------------------------------------- CITY ROADS ---------- */
#fabric-mini-light #city-roads{
	position: relative;
	z-index: 100;
	width: 100%;
	background: url(/themes/ayon/img/fabric-mini-light/GRADING-SOLAPAS-FABRIC-MINI.jpg) repeat-x top rgba(0, 0, 0, 0);
	background-size: 20% auto;
	opacity: 1 !important;
}


div#transicion {
    background: linear-gradient(1deg, #000000, transparent);
    margin-top: 0px;
	padding-bottom: 60px;
}


.background-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin: 0 0 auto;
    border-radius: 40px;
    margin-top: 40px;
}

.contenedor {
	position: relative;
    max-width: 900px;
    margin: auto;
    padding-right: 40px;
    padding-left: 40px;
}

.play-pause-btn {
  position: absolute;
  bottom: 30px;
  right: 65px;
  width: 45px;
  height: 45px;
  border: none;
  border-radius: 50%;
  background: white;
  cursor: pointer;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 40%;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

/* Hover en escritorio */
.contenedor:hover .play-pause-btn {
  opacity: 1;
  pointer-events: auto;
}

/* En móvil siempre visible */
@media (max-width: 768px) {
    .play-pause-btn {
		opacity: 1 !important;
		pointer-events: auto !important;
		bottom: 20px;
		right: 55px;
    }
	.contenedor {
		padding-right: 20px;
		padding-left: 20px;
	}
	.play-pause-btn {
        bottom: 20px;
        right: 32px;
        background-color: #ffffff7d;
    }
	.background-video {
		height: 500px;
	}
}

/* Icono de pausa */
.play-pause-btn.pause {
  background-image: url('data:image/svg+xml;utf8,<svg fill="black" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><rect x="6" y="4" width="4" height="16"/><rect x="14" y="4" width="4" height="16"/></svg>');
}

/* Icono de play */
.play-pause-btn.play {
  background-image: url('data:image/svg+xml;utf8,<svg fill="black" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><polygon points="5,3 19,12 5,21"/></svg>');
}


/* -------------------------------------------------- FEATURES ---------- */
section#fc-features{
	background-color: rgba(0, 0, 0);
	text-align: center;
	/*background: url(../img/fabric-mini-light/city18.png) no-repeat bottom rgba(193, 193, 193, 0.62) / 100% auto;*/
}
section#fc-features h2{color: #fff;font-size: 38px !important;}

/* --------------------------------- FEATURES - FEATURES MAP */
#fc-features .features-map{
	margin: auto;
	width: 50%;
	}

@media (max-width:768px){
	
	#fc-features .features-map{
		margin: auto;
		width: 85%;
	}
	section#fc-features h2{
		font-size: 28px !important;
	}
	section#fc-features {
		padding-top: 0px !important;
	}

}

/* Controllers */
#fc-features .features-map > .controllers{
	position: relative;
	margin: 5vh 0 0;
}
#fc-features .features-map > .controllers > ul{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	width: 100%;
	height: 100%;
	opacity: 0;
}
#fc-features .features-map[data-show="true"] > .controllers > ul{
	opacity: 1;
	transition: opacity 0.6s ease 1.2s;
	-webkit-transition: opacity 0.6s ease 1.2s;
	-moz-transition: opacity 0.6s ease 1.2s;
}
#fc-features .features-map > .controllers > ul > li{
	position: absolute;
	width: 50px;
	height: 50px;
	background-color: rgba(68, 68, 68, 0.33);
	border: 2px solid rgba(255,255,255,0.5);
	border-radius: 999em;
	transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	transition:
		border 0.3s ease,
		background-color 0.3s ease,
		transform 0.3s ease;
	-webkit-transition:
		border 0.3s ease,
		background-color 0.3s ease,
		transform 0.3s ease;
	-moz-transition:
		border 0.3s ease,
		background-color 0.3s ease,
		transform 0.3s ease;
}
#fc-features .features-map > .controllers > ul > li:hover,
#fc-features .features-map > .controllers > ul > li.active{
	border-color: #fff;
	background-color: rgba(245, 245, 245, 0.33);
	transform: translateX(-50%) translateY(-50%) scale(1.3);
	-webkit-transform: translateX(-50%) translateY(-50%) scale(1.3);
	-moz-transform: translateX(-50%) translateY(-50%) scale(1.3);
}
#fc-features .features-map > .controllers > ul > li.active{}

#fc-features .features-map > .controllers > ul > li[data-target="feature1"]{top: 55%;left: 40%;}
#fc-features .features-map > .controllers > ul > li[data-target="feature2"]{top: 47%;left: 12%;}
#fc-features .features-map > .controllers > ul > li[data-target="feature3"]{top: 51%;left: 57%;}
#fc-features .features-map > .controllers > ul > li[data-target="feature4"]{top: 46%;left: 73%;}
#fc-features .features-map > .controllers > ul > li[data-target="feature5"]{top: 37%;left: 29%;}
#fc-features .features-map > .controllers > ul > li[data-target="feature6"]{top: 74%;left: 45%;}
#fc-features .features-map > .controllers > ul > li[data-target="feature7"]{top: 7%;left: 70%;}
#fc-features .features-map > .controllers > ul > li[data-target="feature8"]{top: 67%;left: 91%;}
#fc-features .features-map > .controllers > ul > li[data-target="feature9"]{top: 64%;left: 31%;}
#fc-features .features-map > .controllers > img{width: 100%;}

/* Info */
#fc-features .features-map > .info{
	position: relative;
	width: 50%;
	margin: auto;
}
#fc-features .features-map > .info *{color: #fff;}

#fc-features .features-map > .info > .info-controllers{
	position: relative;
	width: 16em;
	height: 3em;
	margin: 0 auto 1em auto;
}
#fc-features .features-map > .info > .info-controllers > *{
	float: left;
	height: 100%;
	text-align: center;
}
#fc-features .features-map > .info > .info-controllers > .position{
	position: absolute;
	top: 0;
	left: calc(50% - 1.5em);
	width: 3em;
}
#fc-features .features-map > .info > .info-controllers > .position:before{
	content: '';
	display: block;
	position: absolute;
	top: 1.5em;
	left: 0;
	width: 3em;
	border-bottom: 2px solid #787878;
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}
#fc-features .features-map > .info > .info-controllers > .position > span{
	position: absolute;
	width: 50%;
	font-weight: bold;
	color: #787878;
	transition: opacity 0.3s ease;
	-webkit-transition: opacity 0.3s ease;
	-moz-transition: opacity 0.3s ease;
}
#fc-features .features-map > .info > .info-controllers > .position > span.fade-out{opacity: 0;}

#fc-features .features-map > .info > .info-controllers > .position > span:first-of-type{
	top: -0.5em;
    left: 0;
    display: block;
}
#fc-features .features-map > .info > .info-controllers > .position > span:last-of-type{
	bottom: -0.5em;
    right: 0;
    display: initial;
    z-index: 1000;
 
}
#fc-features .features-map > .info > .info-controllers > .prev-button,
#fc-features .features-map > .info > .info-controllers > .next-button{
	width: 6em;
	height: 3em;
	padding: 0 1em;
	transition: padding 0.3s cubic-bezier(0.9, 0, 0.3, 1);
	-webkit-transition: padding 0.3s cubic-bezier(0.9, 0, 0.3, 1);
	-moz-transition: padding 0.3s cubic-bezier(0.9, 0, 0.3, 1);
}
#fc-features .features-map > .info > .info-controllers > .next-button{float: right;}

#fc-features .features-map > .info > .info-controllers > .prev-button > svg,
#fc-features .features-map > .info > .info-controllers > .next-button > svg{
	stroke: #787878; /* +40pt */
	position: relative;
	top: 0.9em;
	transition: stroke 0.3s cubic-bezier(0.9, 0, 0.3, 1);
	-webkit-transition: stroke 0.3s cubic-bezier(0.9, 0, 0.3, 1);
	-moz-transition: stroke 0.3s cubic-bezier(0.9, 0, 0.3, 1);
}
#fc-features .features-map > .info > .info-controllers > .prev-button:hover{padding-left: 0;}
#fc-features .features-map > .info > .info-controllers > .next-button:hover{padding-right: 0;}

#fc-features .features-map > .info > .info-controllers > .prev-button:hover > svg,
#fc-features .features-map > .info > .info-controllers > .next-button:hover > svg{stroke: #fff;}

#fc-features .features-map > .info > ul > li{
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	pointer-events: none;
	transform: translateY(-25px);
	-webkit-transform: translateY(-25px);
	-moz-transform: translateY(-25px);
	transition: opacity 0.3s ease;
	-webkit-transition: opacity 0.3s ease, transform 0.3s ease;
	-moz-transition: opacity 0.3s ease;
}
#fc-features .features-map > .info > ul > li.largest{position: relative;}

#fc-features .features-map > .info > ul > li.active{
	opacity: 1;
	transform: translateY(0);
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	pointer-events: initial;
	transition-delay: 0.3s;
	-webkit-transition-delay: 0.3s;
	-moz-transition-delay: 0.3s;
}
#fc-features .features-map > .info > ul > li.fade-out{
	opacity: 0;
	transform: translateY(25px);
	-webkit-transform: translateY(25px);
	-moz-transform: translateY(25px);
}
#fc-features .features-map > .info > ul > li > h4{margin: 1em 0px 0.5em 0;}

#fc-features .features-map > .info > ul > li > p{
	font-size: 1.2em;
	color: #fff;
}

/* -------------------------------------------------- GALLERY ---------- */
section#fc-gallery{
	overflow: hidden;
	padding: 0 !important;
}

section#fc-gallery > img{
	float: left;
	width: 50%;
}
section#fc-gallery > img:first-of-type{width: 100%; display: none;}

/* -------------------------------------------------- CATALOG ---------- */

section#fc-catalog {
    background: #ffdda4;
}

h3.tallas {
    color: #fe6b19;
}

/* --------------------------------- CATALOG - PRODUCT LIST */
#fc-catalog .product-list{
	width: 90%;
	margin: 5vh auto 0 auto;
	padding-bottom: 50px;
}
#fc-catalog .product-list > .product{
	display: inline-block;
	position: relative;
	width: 50%;
	text-align: center;
	padding: 2em 2.5vw;
}
#fc-catalog .product-list > .product > a{
	display: block;
	position: relative;
	padding: 2em 2.5vw;
}

/* Image wrapper */
#fc-catalog .product-list > .product > a > .image-wrapper{
	transition: transform 0.5s linear;
    -webkit-transition: transform 0.5s linear;
    -moz-transition: transform 0.5s linear;
}
#fc-catalog .product-list > .product > a:hover > .image-wrapper{
	transform: scale(1.05);
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
}
#fc-catalog .product-list > .product > a > .image-wrapper > img{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	opacity: 0;
	transition: opacity 0.4s cubic-bezier(0.7, 0.2, 0.8, 1);
    -webkit-transition: opacity 0.4s cubic-bezier(0.7, 0.2, 0.8, 1);
    -moz-transition: opacity 0.4s cubic-bezier(0.7, 0.2, 0.8, 1);
}
#fc-catalog .product-list > .product > a > .image-wrapper > img:first-of-type{
	position: relative;
	opacity: 1;
	transition-delay: 0.1s;
    -webkit-transition-delay: 0.1s;
    -moz-transition-delay: 0.1s;
}
#fc-catalog .product-list > .product > a:hover > .image-wrapper > img:first-of-type{opacity: 0;}

#fc-catalog .product-list > .product > a > .image-wrapper > img:last-of-type{opacity: 0;}
#fc-catalog .product-list > .product > a:hover > .image-wrapper > img:last-of-type{
	opacity: 1;
	transition-delay: 0.1s;
    -webkit-transition-delay: 0.1s;
    -moz-transition-delay: 0.1s;
}

/* Product name */
#fc-catalog .product-list > .product > a > p{
	position: relative;
	z-index: 100;
	color: #9e9e9e;
	margin: 2em 0 1em 0;
}
#fc-catalog .product-list > .product > a > p.underline-animation > span:after{opacity: 0;}
#fc-catalog .product-list > .product > a:hover > p.underline-animation > span:after{opacity: 1;}

#fc-catalog .product-list > .product > a > p.underline-animation > span > span, #fc-catalog .product-list > .product > a > p.underline-animation > span:after {
    transition-duration: 0.5s;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    color: #333;
    line-height: 2.8em;
    letter-spacing: 0.0em;
    margin-bottom: 0.5em;
    font-size: 1.1em;
    padding: 28px 38px 19px 38px;
    background-color: #191919;
    color: #fff;
    border-radius: 30px;
    font-family: gotham-book;
	box-shadow: 2px 6px 12px -6px #bfab7a;
}

/* -------------------------------------------------- ANIMATIONS ---------- */
/* --------------------------------- ANIMATIONS - FADE IN/OUT */
.dir-top{
	opacity: 0;
	transform: translateY(-25px);
	-webkit-transform: translateY(-25px);
	-moz-transform: translateY(-25px);
}
.dir-right{
	opacity: 0;
	transform: translateX(25px);
	-webkit-transform: translateX(25px);
	-moz-transform: translateX(25px);
}
.dir-bottom{
	opacity: 0;
	transform: translateY(25px);
	-webkit-transform: translateY(25px);
	-moz-transform: translateY(25px);
}
.dir-left{
	opacity: 0;
	transform: translateX(-25px);
	-webkit-transform: translateX(-25px);
	-moz-transform: translateX(-25px);
}
.trans-in{
	opacity: 1;
	transform: translate3d(0, 0, 0);
	-webkit-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	transition:
		transform 300ms cubic-bezier(0.215, 0.61, 0.355, 1),
		opacity 300ms cubic-bezier(0.215, 0.61, 0.355, 1);
	-webkit-transition:
		-webkit-transform 300ms cubic-bezier(0.215, 0.61, 0.355, 1),
		opacity 300ms cubic-bezier(0.215, 0.61, 0.355, 1);
	-moz-transition:
		-webkit-transform 300ms cubic-bezier(0.215, 0.61, 0.355, 1),
		opacity 300ms cubic-bezier(0.215, 0.61, 0.355, 1);
}
.trans-out{
	opacity: 0;
	pointer-events: none;
	transition:
		transform 300ms cubic-bezier(0.55, 0.055, 0.675, 0.19),
		opacity 300ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	-webkit-transition:
		-webkit-transform 300ms cubic-bezier(0.55, 0.055, 0.675, 0.19),
		opacity 300ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	-moz-transition:
		-webkit-transform 300ms cubic-bezier(0.55, 0.055, 0.675, 0.19),
		opacity 300ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

/* Show on scroll */
.dir-top[data-show]{
	transform: translateY(-100px);
	-webkit-transform: translateY(-100px);
	-moz-transform: translateY(-100px);
}
.dir-right[data-show]{
	transform: translateX(100px);
	-webkit-transform: translateX(100px);
	-moz-transform: translateX(100px);
}
.dir-bottom[data-show]{
	transform: translateY(100px);
	-webkit-transform: translateY(100px);
	-moz-transform: translateY(100px);
}
.dir-left[data-show]{
	transform: translateX(-100px);
	-webkit-transform: translateX(-100px);
	-moz-transform: translateX(-100px);
}
.dir-top[data-show="true"],
.dir-right[data-show="true"],
.dir-bottom[data-show="true"],
.dir-left[data-show="true"]{
	opacity: 1;
	transform: translate3d(0, 0, 0);
	-webkit-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	transition:
		transform 1200ms cubic-bezier(0.215, 0.61, 0.355, 1),
		opacity 1200ms cubic-bezier(0.215, 0.61, 0.355, 1);
	-webkit-transition:
		-webkit-transform 1200ms cubic-bezier(0.215, 0.61, 0.355, 1),
		opacity 1200ms cubic-bezier(0.215, 0.61, 0.355, 1);
	-moz-transition:
		-webkit-transform 1200ms cubic-bezier(0.215, 0.61, 0.355, 1),
		opacity 1200ms cubic-bezier(0.215, 0.61, 0.355, 1);
}
.dir-top[data-show="false"],
.dir-right[data-show="false"],
.dir-bottom[data-show="false"],
.dir-left[data-show="false"]{
	opacity: 0;
	pointer-events: none;
	transition:
		transform 600ms cubic-bezier(0.215, 0.61, 0.355, 1),
		opacity 600ms cubic-bezier(0.215, 0.61, 0.355, 1);
	-webkit-transition:
		-webkit-transform 600ms cubic-bezier(0.215, 0.61, 0.355, 1),
		opacity 600ms cubic-bezier(0.215, 0.61, 0.355, 1);
	-moz-transition:
		-webkit-transform 600ms cubic-bezier(0.215, 0.61, 0.355, 1),
		opacity 600ms cubic-bezier(0.215, 0.61, 0.355, 1);
}

/* --------------------------------- ANIMATIONS - KEYFRAMES */
/* Zoom bounce */
@keyframes zoomBounce{
	25%{transform: scale(1.2) rotate(10deg);}
	55%{transform: scale(1.1) rotate(-5deg);}
	85%{transform: scale(1.05) rotate(5deg);}
	40%, 70%{transform: scale(1);}
	100%{transform: scale(1) rotate(0);}
}
@-webkit-keyframes zoomBounce{
	25%{-webkit-transform: scale(1.2) rotate(10deg);}
	55%{-webkit-transform: scale(1.1) rotate(-5deg);}
	85%{-webkit-transform: scale(1.05) rotate(5deg);}
	40%, 70%{-webkit-transform: scale(1);}
	100%{-webkit-transform: scale(1) rotate(0);}
}
@-moz-keyframes zoomBounce{
	25%{-moz-transform: scale(1.2) rotate(10deg);}
	55%{-moz-transform: scale(1.1) rotate(-5deg);}
	85%{-moz-transform: scale(1.05) rotate(5deg);}
	40%, 70%{-moz-transform: scale(1);}
	100%{-moz-transform: scale(1) rotate(0);}
}

/* Blink */
@keyframes blink{
	50%{opacity: 0;}
	0%, 100%{opacity: 1;}
}
@-webkit-keyframes blink{
	50%{opacity: 0;}
	0%, 100%{opacity: 1;}
}
@-moz-keyframes blink{
	50%{opacity: 0;}
	0%, 100%{opacity: 1;}
}

/* -------------------------------------------------- MEDIA QUERIES ---------- */
@media screen and (max-width: 1500px){
	/* -------------------------------------------------- GENERIC ---------- */	
	/* Layout */
	body#fabric-mini-light,
	#fabric-mini-light #center_column{font-size: 0.95em !important;}
	
	/* Section content */
	#fabric-mini-light section .section-content{
		width: 80%;
		max-width: 980px;
	}
	
	/* -------------------------------------------------- FEATURES ---------- */
	/* --------------------------------- FEATURES - FEATURES MAP */
	/* Controllers */
	#fc-features .features-map > .controllers > ul > li{
		width: 40px;
		height: 40px;
	}
	
	/* -------------------------------------------------- CATALOG ---------- */	
	/* --------------------------------- CATALOG - PRODUCT LIST */
	#fc-catalog .product-list > .product{padding: 0 2.5vw;}
}
@media screen and (max-width: 980px){
	/* -------------------------------------------------- GENERIC ---------- */
	/* Section content */
	#fabric-mini-light section .section-content{
		width: 82%;
		max-width: 750px;
	}
	
	/* -------------------------------------------------- SLIDER ---------- */
	#fc-slider .swiper-container{height: calc(100vh - 155px);}
	
	/* Controllers */
	#fc-slider .prev-button,
	#fc-slider .next-button{width: 4em;}
	
	#fc-slider .prev-button > svg,
	#fc-slider .next-button > svg{height: 30px;}
	
	/* -------------------------------------------------- INTRO ---------- */
	#fc-intro img{/*    width: 70%;
		width: 70%;
		display: block;
		max-width: 600px;
		margin: 0 auto auto;
		position: relative;
		padding-top: 5vh;
		padding-bottom: 0vh; */
	}
	
	/* -------------------------------------------------- CITY ROADS ---------- */
	#fabric-mini-light #mini-roads{background-size: 25% auto;}
	
	/* -------------------------------------------------- FEATURES ---------- */
	/* --------------------------------- FEATURES - FEATURES MAP */
	#fc-features .features-map > .controllers > ul > li{
		width: 30px;
		height: 30px;
	}
	
	/* Info */
	#fc-features .features-map > .info{width: 80%}
}


@media screen and (min-width: 768px){
	#fc-intro > div > div > p.mini-text {
		width: 60%;
  		margin-left: 20%;	
}
}

@media screen and (max-width: 768px){
	/* -------------------------------------------------- GENERIC ---------- */	
	/* Layout */
	body#fabric-mini-light,
	#fabric-mini-light #center_column{font-size: 0.9em !important;}
	

	/* Tags */
	#fabric-mini-light section,
	#fc-slider > .swiper-container{
		padding-top: 9em;
		padding-bottom: 9em;
	}
	
	/* Section content */
	#fabric-mini-light section .section-content{
		width: 80%;
		max-width: 475px;
	}
	
	/* --------------------------------- GENERIC - UNDERLINE ANIMATION */
	#fabric-mini-light .underline-animation:hover > span > span,
	#fabric-mini-light a:hover > .underline-animation > span > span{
		transform: none;
		-webkit-transform: none;
		-moz-transform: none;
	}
	#fabric-mini-light .underline-animation.tapping > span > span,
	#fabric-mini-light a.tapping > .underline-animation > span > span{
		transform: translateY(0.25em);
		-webkit-transform: translateY(0.25em);
		-moz-transform: translateY(0.25em);
	}
	#fabric-mini-light .underline-animation:hover > span:after,
	#fabric-mini-light a:hover > .underline-animation > span:after{
		opacity: 0.5;
		transform: none;
		-webkit-transform: none;
		-moz-transform: none;
	}
	#fabric-mini-light .underline-animation.tapping > span:after,
	#fabric-mini-light a.tapping > .underline-animation > span:after{
		opacity: 1;
		transform: translateY(-0.25em);
		-webkit-transform: translateY(-0.25em);
		-moz-transform: translateY(-0.25em);
	}
	
	/* -------------------------------------------------- SLIDER ---------- */
	#fc-slider .swiper-container{height: calc(100vh - 234px);}
	
	/* Info */
	#fc-slider .slider-info > article{
		max-width: 100%;
		text-align: center;
		margin: auto;
	}
	#fc-slider .slider-info > article > h1{text-align: center;}
	
	#fc-slider .slider-info > article > h1:after,
	#fc-slider .slider-info > article > a{display: none;}
	
	/* Controllers */
	#fc-slider .prev-button,
	#fc-slider .next-button{
		top: auto;
		bottom: 0;
		width: calc(50% - 5em);
		height: 10em;
		stroke: #fff;
	}
	#fc-slider .prev-button > svg,
	#fc-slider .next-button > svg{height: 25px;}
	
	/* Show more */
	#fc-slider .show-more:hover:after{
		animation: none;
		-webkit-animation: none;
		-moz-animation: none;
	}
	#fc-slider .show-more.tapping:after{
		transform: scale(1.2);
		-webkit-transform: scale(1.2);
		-moz-transform: scale(1.2);
	}
	
	/* -------------------------------------------------- INTRO ---------- */
	#fc-intro img{
    width: 90%;
	}
	
	#fc-intro .info > p > a:hover{color: #c071ae;}
	#fc-intro .info > p > a.tapping{color: #bf50a6;}
	
	#fc-intro .info > p > a:hover:after{
		border-color: #dddde3;
		transform: none;
		-webkit-transform: none;
		-moz-transform: none;
	}
	#fc-intro .info > p > a.tapping:after{
		border-color: #c2c2c2;
		transform: translateY(-0.2em);
		-webkit-transform: translateY(-0.2em);
		-moz-transform: translateY(-0.2em);
	}
	
	#fc-intro .underline-animation{margin: 1em 4em 1em 0;}
	
	/* -------------------------------------------------- CITY ROADS ---------- */
	#fabric-mini-light #city-roads{background-size: 33.3% auto;}
	
	/* -------------------------------------------------- FEATURES ---------- */
	/* --------------------------------- FEATURES - FEATURES MAP */
	/* Controllers */
	#fc-features .features-map > .controllers{margin: 3em 0;}
	
	#fc-features .features-map > .controllers > ul > li{
		opacity: 0;
		pointer-events: none;
		transition:
			border 0.3s ease,
			background-color 0.3s ease,
			opacity 0.3s ease,
			transform 0.3s ease;
		-webkit-transition:
			border 0.3s ease,
			background-color 0.3s ease,
			opacity 0.3s ease,
			transform 0.3s ease;
		-moz-transition:
			border 0.3s ease,
			background-color 0.3s ease,
			opacity 0.3s ease,
			transform 0.3s ease;
	}
	#fc-features .features-map > .controllers > ul > li.active{opacity: 1;}

	/* Info */
	#fc-features .features-map > .info{width: 100%}
	
	#fc-features .features-map > .info > .info-controllers > .prev-button > svg,
	#fc-features .features-map > .info > .info-controllers > .next-button > svg{
		transition: padding 0.2s ease;
		-webkit-transition: padding 0.2s ease;
		-moz-transition: padding 0.2s ease;
	}
	#fc-features .features-map > .info > .info-controllers > .prev-button:hover,
	#fc-features .features-map > .info > .info-controllers > .next-button:hover{padding: 0 1em;}
	#fc-features .features-map > .info > .info-controllers > .prev-button.tapping{padding-left: 0;}
	#fc-features .features-map > .info > .info-controllers > .next-button.tapping{padding-right: 0;}
	
	#fc-features .features-map > .info > .info-controllers > .prev-button > svg,
	#fc-features .features-map > .info > .info-controllers > .next-button > svg{
		transition: stroke 0.2s ease;
		-webkit-transition: stroke 0.2s ease;
		-moz-transition: stroke 0.2s ease;
	}
	#fc-features .features-map > .info > .info-controllers > .prev-button:hover > svg,
	#fc-features .features-map > .info > .info-controllers > .next-button:hover > svg{stroke: #424242;}
	#fc-features .features-map > .info > .info-controllers > .prev-button.tapping > svg,
	#fc-features .features-map > .info > .info-controllers > .next-button.tapping > svg{stroke: #fff;}
	
	/* -------------------------------------------------- CATALOG ---------- */
	/* --------------------------------- CATALOG - PRODUCT LIST */
	#fc-catalog .product-list{
		width: 80%;
		max-width: 475px;
	}
	#fc-catalog .product-list > .product{
		width: 100%;
		padding: 0;
	}
	#fc-catalog .product-list > .product > a{padding: 2em 0vw;}
	
	/* Image wrapper */
	#fc-catalog .product-list > .product > a:hover > .image-wrapper{
		transform: none;
		-webkit-transform: none;
		-moz-transform: none;
	}
	#fc-catalog .product-list > .product > a.tapping > .image-wrapper{
		transform: scale(1.05);
		-webkit-transform: scale(1.05);
		-moz-transform: scale(1.05);
	}
	#fc-catalog .product-list > .product > a:hover > .image-wrapper > img:first-of-type{opacity: 1;}
	#fc-catalog .product-list > .product > a.tapping > .image-wrapper > img:first-of-type{opacity: 0;}
	
	#fc-catalog .product-list > .product > a:hover > .image-wrapper > img:last-of-type{
		opacity: 0;
		transition-delay: initial;
		-webkit-transition-delay: initial;
		-moz-transition-delay: initial;
	}
	#fc-catalog .product-list > .product > a.tapping > .image-wrapper > img:last-of-type{
		opacity: 1;
		transition-delay: 0.1s;
		-webkit-transition-delay: 0.1s;
		-moz-transition-delay: 0.1s;
	}
	
#fc-catalog > h2.dir-bottom {
	color: #fff;
    font-family: gotham-bold;
    font-size: 2.5em !important;
    display: inline;
    width: 100%;
    letter-spacing: 0.05em;
    line-height: 1.5em;
    text-align: center;
    text-transform: uppercase;
    margin: 0px 0 0em 0;
    opacity: 1;
    line-height: 76px;
	}
	
	/* Product name */
	#fc-catalog .product-list > .product > a:hover > p.underline-animation > span:after{opacity: 0;}
	#fc-catalog .product-list > .product > a.tapping > p.underline-animation > span:after{opacity: 1;}
}
@media screen and (max-width: 480px){
	/* -------------------------------------------------- GENERIC ---------- */	
	/* Layout */
	body#fabric-mini-light,
	#fabric-mini-light #center_column{font-size: 0.9em !important;}
	
	/* Tags */
	#fabric-mini-light section,
	#fc-slider > .swiper-container{
		padding-top: 6em;
		padding-bottom: 6em;
	}
	
	/* Section content */
	#fabric-mini-light section .section-content{
		width: 100%;
		max-width: none;
		padding: 0 2em;
	}
	
	/* --------------------------------- GENERIC - TITLES */
	#fabric-mini-light section h1{font-size: 2.5em !important;}
	#fabric-mini-light section h2{font-size: 2em !important;}
	#fabric-mini-light section h3{font-size: 1.6em !important;}
	#fabric-mini-light section h4{font-size: 1.3em !important;}
	
	/* -------------------------------------------------- SLIDER ---------- */
	#fc-slider .swiper-container{height: calc(100vh - 223px);}
	
	/* -------------------------------------------------- INTRO ---------- */
	#fc-intro img{width: 90%; }
	
	#fc-intro p.quote{font-size: 1.1em;}
	
	#fc-intro .underline-animation{
		width: 50%;
		float: left;
		font-size: 0.85em;
		margin: 1em 0;
	}
	
	/* -------------------------------------------------- FEATURES ---------- */
	/* --------------------------------- FEATURES - FEATURES MAP */
	/* Controllers */
	#fc-features .features-map > .controllers{margin: 2em 0;}
	
	/* -------------------------------------------------- CATALOG ---------- */
	/* --------------------------------- CATALOG - PRODUCT LIST */
	#fc-catalog .product-list{
		width: 100%;
		max-width: none;
		padding: 0 3em;
	}

#fc-intro > div > div > a > span {
	display: inline-block;
    font-size: 1em;
    font-weight: bold;
    text-transform: uppercase;
	color: rgba(193, 193, 193, 0.62);
    font-family: gotham-bold;
}

#fc-intro > div > div > a > span:after {
	content: '';
    display: block;
    border-bottom: 2px solid;
    opacity: 0.5;
    margin-top: 0.5em;
    font-family: Gotham-bold;
    line-height: initial;
    box-sizing: border-box;
    text-transform: uppercase;
}


#fc-intro > div > div > h2.step-text {
    color: #fff;
    font-family: gotham-bold;
    font-size: 2.5em !important;
    display: inline-block;
    width: 100%;
    letter-spacing: 0.05em;
    line-height: 1.5em;
    text-align: center;
    text-transform: uppercase;
    margin: 30px 0 1em 0;
	
	
}
}


@media screen and (max-width: 480px){
#fc-intro > div > div > p {
       font-size: 1.2em !important;
}
}


						<!----------------------------------------------------- CSS FABRICBIKE mini --------------------------------------------------->

					/*************************** CSS PERSONALIZADO PARA FABRICBIKE mini ***************************/


@media (min-width: 480px){
#fc-intro > div > div > a > span.btn-mini {
    border: 2px solid #debc90;
    border-radius: 23px;
    padding: 23px 20px 15px 20px;
    letter-spacing: 0.1em;
    margin: 40px;
    color: #d1ae81;
    font-family: gotham-bold;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
    display: inline-block;
    font-size: 1em;
    bottom: 4em;
    text-transform: uppercase;
}

}

@media (max-width: 480px) { 
#fc-intro > div > img.mini-img {
		max-width: 130px !important;
		background-color: #ffffff00;
}

#fc-intro > div > img.mini-logo {
		max-width: 80% !important;
		background-color: #ffffff00;
		margin-top: -180px !important;

}

#fc-intro > div > div > p.mini-text {
		text-align: left;
  	    color: #fff;
		line-height: 1.8em;
		letter-spacing: 0.07em;
		margin-bottom: 1.5em;
		font-size: 1.23em;
		padding: 0;
		font-family: gotham-light;
		width: 83%;
}


    #fc-intro > div > div > a > span.btn-mini {
        border-radius: 30px;
        padding: 27px 30px 18px 30px;
        margin: 10px;
        color: #ffffff;
        text-transform: uppercase;
        background-color: #454545;
        letter-spacing: 0.1em;
        margin: 7px;
    }

	section#fc-gallery > img {
    	width: 100%;
	}

}

@media (min-width: 480px) { 
#fc-intro > div > img.mini-img {
		max-width: 140px;
 	    background-color: #ffffff00;
}

#fc-intro > div > img.mini-logo {
		width: 90% !important;
		margin-top: -44px !important;
		background-color: #ffffff00;
}

	#fc-intro > div > div > p.mini-text {
		text-align: center;
			color: #ffffff;
			line-height: 1.8em;
			letter-spacing: 0.07em;
			margin-bottom: 0.4em;
			font-size: 1.23em;
			padding: 0;
			font-family: gotham-light;
	}

    #fc-intro > div > div > a > span.btn-mini {
        border-radius: 30px;
        padding: 27px 30px 18px 30px;
        margin: 10px;
        color: #ffffff;
        text-transform: uppercase;
        background-color: #454545;
    }

}

#fc-intro > div > div > a > span.btn-mini:after {
		display: none;
}

div#mini-roads{
	position: relative;
	z-index: 100;
	width: 100%;
	background: url(/themes/ayon/img/fabric-mini-light/pattern.png) repeat-x top #3abcd2;
	background-size: 20% auto;
	opacity: 1 !important;
	display: block;
	margin-top: 60px;
} 

#idTab15 > div.mini-roads {
    display: none;
}

#fc-intro > div > div > h2.mini-text {
    color: #ffffff;
    font-family: gotham-bold;
    font-size: 3.5em !important;
    display: inline-block;
    max-width: 700px;
    letter-spacing: 0.01em;
    line-height: 1em;
    text-align: center;
    margin: 53px 0 0.4em 0;
}

@media (max-width: 768px){
#fc-intro > div > div > h2.mini-text {
	font-family: gotham-bold;
    font-size: 2.9em !important;
    display: inline-block;
    width: 80%;
    letter-spacing: 0.01em;
    text-align: left;
	margin: 20px 0 0.4em 0;

}
}


#idTab15 > div.mini-roads > img {
    position: relative;
    z-index: 100;
    width: 100%;
    background-size: 20% auto;
    opacity: 1 !important;
    display: block;
    margin-top: 10px;
    padding-bottom:6%;
}

@media (min-width: 768px){
#banner-1 {
	display: block;
}

#banner-2 {
	display: none;
}	
	
#banner-green-1 {
	display: block;
}

#banner-green-2 {
	display: none;
}	
}

@media (max-width: 768px){
	#banner-1 {
		display: none;
	}
	#banner-2 {
		display: block;
	}

	#banner-green-1 {
		display: none;
	}
	#banner-green-2 {
		display: block;
	}
	#fc-intro > div > div > p.mini-text {
        text-align: left;
	}

}


#banner-1 > div {
	position: relative;
    text-align: center;
}

#banner-1 > div > div{
    position: absolute;
    bottom: 15%;
    left: 7%;
	text-align: left;
}

#banner-1 > div > div > p {
    text-align: left;
    color: #ffffff;
    line-height: 1.8em;
    letter-spacing: 0.0em;
    margin-bottom: 0.5em;
    font-size: 1.3em;
    padding: 0;
    font-family: gotham;
}

#banner-1 > div > div > h3 {
    color: #fff;
    font-family: gotham-bold;
    font-size: 3.3em !important;
    letter-spacing: 0.0em;
    line-height: 1em;
    width: 302px;
    text-align: left;
    margin: 0px 0 0em 0;
}

#banner-1 > div > div > a {
    color: #333;
    line-height: 2.8em;
    letter-spacing: 0.0em;
    margin-bottom: 0.5em;
    font-size: 1.3em;
    padding: 18px 28px 16px 28px;
    background-color: #fff;
    border-radius: 30px;
}

#banner-2 > div {
	position: relative;
    text-align: center;
}

#banner-2 > div > div{
    position: absolute;
    top: 6%;
    left: 7%;
    text-align: left;
}

#banner-2 > div > div > p {
    text-align: left;
    color: #ffffff;
    line-height: 1.8em;
    letter-spacing: 0.0em;
    margin-bottom: 0.5em;
    font-size: 1.1em;
    padding: 0;
    font-family: gotham-book;
}

#banner-2 > div > div > h3 {
    color: #fff;
    font-family: gotham-bold;
    font-size: 2.9em !important;
    letter-spacing: 0.0em;
    line-height: 1.1em;
    width: 289px;
    text-align: left;
    margin: 0px 0 0em 0;
}

#banner-2 > div > div > a {
    color: #333;
    line-height: 2.8em;
    letter-spacing: 0.0em;
    margin-bottom: 0.5em;
    font-size: 1.3em;
    padding: 18px 28px 16px 28px;
    background-color: #fff;
    border-radius: 30px;
}

span.btn-banner {
    font-family: gotham-book;
	font-weight: bold;
}


#banner-green-1 > div {
	position: relative;
    text-align: center;
}

#banner-green-1 > div > div{
    position: absolute;
    bottom: 30%;
    left: 12%;
    text-align: left;
}

#banner-green-1 > div > div > p {
    color: #ffffff;
    line-height: 1.4em;
    letter-spacing: 0.0em;
    font-size: 1.1em;
    font-family: gotham-book;
    width: 333px;
}

#banner-green-1 > div > div > h3 {
    color: #fff;
    margin-top: 24px !important;
    font-family: gotham-bold;
    font-size: 3.7em;
    letter-spacing: -0.04em;
    line-height: 1em;
    width: 316px;
    margin: 0px 0 0em 0;
}

#banner-green-1 > div > div > a {
    color: #000;
    line-height: 2.8em;
    letter-spacing: 0.0em;
    margin-bottom: 0.5em;
    font-size: 1.3em;
    padding: 18px 28px 16px 28px;
    background-color: #fff;
    border-radius: 30px;
}

#banner-green-2 > div {
	position: relative;
    text-align: center;
}

#banner-green-2 > div > div {
    position: absolute;
    bottom: 7%;
    left: 8%;
    text-align: left;
}

#banner-green-2 > div > div > p {
    color: #ffffff;
    letter-spacing: 0.0em;
    font-size: 1.1em;
    font-family: gotham-book;
	margin-bottom: 30px;
}

#banner-green-2 > div > div > h3 {
    color: #fff;
    font-family: 'Gotham-Bold';
    font-size: 3em;
    letter-spacing: -0.04em;
    line-height: 0.9em;
    width: 240px;
    text-align: left;
    margin-top: 22px;
}

#banner-green-2 > div > div > a {
    color: #000;
    font-family: 'Gotham-Book';
    letter-spacing: 0.0em;
    font-size: 1.3em;
    padding: 29px 31px 18px 28px;
    background-color: #fff;
    border-radius: 30px;
}

span.btn-banner-black {
    font-family: gotham-light;
	font-weight: bold;
	color: #fff;
}

p.mini-logo-green {
    width: 45px;
}
#banner-green-1 > div > div > p.mini-logo-green {
    width: 45px;
	
}

ul.conmutador {
    display: flex;
    margin: auto;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}


p.btn-tutorial {
    position: relative;
    height: 50px;
    border-radius: 25px;
    width: 200px;
    margin: auto;
    color: #000;
    margin-bottom: 40px;
    margin-top: -25px;
    text-align: center;
    padding-top: 21px;
    font-size: 1.3em;
    font-family: gotham-book;
    text-decoration: none;
    border: 3px solid #000;
}

p.btn-mini {
	border-radius: 30px;
    padding: 20px 30px 11px 30px;
    color: #2c2c2c;
    text-transform: uppercase;
    background-color: #fff;
    width: 200px;
    font-family: 'Gotham-Bold';
    text-align: center;
    margin: auto;
    margin-bottom: 12px;
}

p.btn-mini-2 {
	border-radius: 30px;
    padding: 20px 30px 11px 30px;
    color: #ffffff;
    text-transform: uppercase;
    background-color: #454545;
    width: 200px;
    font-family: 'Gotham-Bold';
    text-align: center;
    margin: auto;
}


#idTab15 > h3.title-final {
    font-size: 22px;
    font-family: gotham-bold;
    line-height: 1.2;
    text-align: center;
    width: 200px;
    margin: auto;
    margin-top: 30px;
    color: #fff;
}