*{
	box-sizing: content-box;
}

.page{
	margin: 0 !important;
}

.title{
	font-family: 'GROBOLD', sans-serif !important;
}

a{
	color: white !important;
}

a:visited{
	color: white !important;
}

html{
	background: black;
}

body{
	/*font-family: 'Roboto', sans-serif !important;*/
	font-family: 'Montserrat', sans-serif !important;
	background: black;
}

html,body {
	height:100%;
}

h2{
	font-size: 40px;
	font-family: 'GROBOLD', sans-serif !important;
	color: white;
	text-shadow: 0 0 30px #00000080;
}

h3{
	font-size: 30px;
	font-family: 'GROBOLD', sans-serif !important;
}

.bot, .bot:visited{
	background: white !important;
	color: black !important;
	border-radius: 50px;
	padding: 12px 30px 10px;
	transition: all .3s ease-in-out;
	display: inline-block;
	margin: 0 10px 10px;
	font-family: 'GROBOLD', sans-serif !important;
	text-transform: uppercase;
	text-decoration: none;
	border: none !important;
}

.bot.active, .bot:hover{
	background: #FCD700 !important;
}

.bot:focus {
	outline: none !important;
}

.bot-social, .bot-social:visited{
	background: white !important;
	color: black !important;
	border-radius: 10px;
	display: inline-block;
	margin: 0 10px 10px;
	font-family: 'GROBOLD', sans-serif !important;
	text-transform: uppercase;
	text-decoration: none;
	border: none !important;
	font-size: 30px;
	width: 55px;
	height: 55px;
	text-align: center;
	padding-top: 7px;
	transition: all .3s ease-in-out;
}

.bot-social:hover{
	opacity: .7;
}

.yellow{
	color: #FCD700 !important;
}

.grobold{
	font-family: 'GROBOLD', sans-serif !important;
}

.blue{
	color: #00AEEF !important;
}

.site-header{
	transition: all .3s ease-in-out;
	z-index: 1001;
	position: relative;
}

.site-header.sticky{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1001;
	/*background: #ffffffc9;*/
	background: white;
}

.logo{
	background: url(./img/LOGO-SWAP-RIDERS.png) no-repeat;
	background-size: contain;
	height: 100px;
	width: 210px;
	display: block;
	text-indent: -10000px;
	overflow: hidden;
}

.site-main{
	background: url(./img/BSG-MAIN-BACKGROUND.jpg) no-repeat center;
	background-size: cover;
	background-color: #FF9500;
	font-size: 18px;
	color: black;
	padding-bottom: 300px;
	padding-top: 150px;
}

.site-main h1{
	font-weight: bold;
	font-size: 22px;
}

.site-header.sticky .logo{
	background: url(./img/LOGO-SWAP-RIDERS.png) no-repeat;
	background-size: contain;
	height: 80px;
	width: 174px;
	display: block;
	text-indent: -10000px;
	overflow: hidden;
}

.site-header.sticky h1{
	margin: 0;
}

.site-header.sticky .menu-item{
	margin: 25px 18px 0;
}

.hero{
	background: url(./img/Fondo.jpg) no-repeat center;
	background-size: cover;
	height: 100vh;
	position: relative;
}

.main-navigation ul {
	justify-content: end;
}

.menu-item{
	font-size: 18px;
	font-family: 'GROBOLD', sans-serif !important;
	color: black;
	margin: 40px 18px;
}

.menu-item a{
	color: black !important;
	text-transform: uppercase;
	transition: all .3s ease-in-out;
}

.menu-item a:hover{
	color: white !important;
}

.site-header.sticky .menu-item a:hover{
	color: #ed8c08 !important;
}


.close-menu{
	color: white;
	font-size: 30px;
	cursor: pointer;
}

.menu-button{
	width: 69px;
	height: 69px;
	background: black;
	position: absolute;
	top: 20px;
	right: 20px;
	z-index: 100;
	color: white;
	border-radius: 50%;
	font-size: 40px;
	text-align: center;
	padding-top: 6px;
}

.menu-mobile{
	width: 100%;
	height: 100vh;
	background: url(./img/Fondo.jpg) no-repeat center;
	background-size: cover;
	display: none;
	position: fixed;
	z-index: 3000;
	top: 0;
}

.main-navigation-mobile ul{
	margin: 0;
	padding: 0;
}

.main-navigation-mobile li{
	list-style: none;
	margin: 0;
}

.main-navigation-mobile a{
	font-size: 29px;
	color: white !important;
	text-decoration: none;
	margin: 30px 0 10px 0 !important;
	display: block;
}

.main-navigation-mobile a:hover{
	color: black !important;
}

.site-header.sticky .menu-button{
	width: 59px;
	height: 59px;
	background: black;
	position: absolute;
	top: 10px;
	right: 20px;
	z-index: 100;
	color: white;
	border-radius: 50%;
	font-size: 35px;
	text-align: center;
	padding-top: 4px;
}


.riders{
	background: url(./img/Riders.png) no-repeat center;
	background-size: contain;
	height: 80vh;
	width: 80vw;
	position: absolute;
	top: 10vh;
	left: 10vw;
	z-index: auto;
}

/*.herologo{*/
/*	width: 736px;*/
/*	height: 354px;*/
/*	position: absolute;*/
/*	top: 50%;*/
/*	left: 50%;*/
/*	margin-top: -177px;*/
/*	margin-left: -368px;*/
/*	z-index: 99;*/
/*	background: url(./img/LOGO-SWAP-RIDERS.png) no-repeat;*/
/*	background-size: contain;*/
/*}*/

.herologo {
	width: 549px;
	height: 262px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -48px;
	margin-left: -290px;
	z-index: 99;
	background: url(./img/LOGO-SWAP-RIDERS.png) no-repeat;
	background-size: contain;
}

footer .separator{
	background: url(./img/BSG-SPLASH-GRAPHIC-COMPOSITIONS.png) no-repeat center;
	background-size: cover;
	height: 100px;
	width: 100%;
	display: block;
	margin-top: -100px;
	position: relative;
	z-index: 200;
}

.separator img{
	margin-top: -200px;
	position: relative;
	z-index: 300;
}

.footer-content{
	background: black;
	padding: 140px 40px 40px 40px;
}

.sub-footer{
	background: #1F1F1F;
	width: 100%;
	padding: 20px;
	font-size: 14px;
	color: white;
}

.sub-footer a, .menu-footer-container a{
	display: inline-block;
	text-decoration: underline;
	font-family: 'Montserrat', sans-serif !important;
	color: white !important;
	margin-left: 30px;
	text-transform: none;
}

.menu-footer-container ul{
	margin: 0;
}

.menu-footer-container li{
	list-style: none;
	font-size: 14px;
	margin: 0;
	display: inline-block;
}


.section-riders{
	background: url(./img/BSG-SECONDARY-BLUR.png) no-repeat center;
	background-size: cover;
	width: 100%;
	position: relative;
}

.section-riders .bg{
	background: url(./img/mascara.png) no-repeat top center;
	background-size: cover;
	padding-top: 150px;
	padding-bottom: 100px;
}

.section-riders .header{
	min-height: 150px;
	padding-top: 50px;
	width: 100%;
	position: absolute;
	background: rgb(0,0,0);
	background: linear-gradient(180deg, rgba(0,0,0,1) 32%, rgba(0,0,0,0) 100%);
}

a.rider-link{
	text-decoration: none;
}

.rider-link:hover .title{
	color: #FCD700 !important;
}

.rider{
	background: center;
	background-size: cover;
	border-radius: 20px;
	border: 3px solid #fff;
}

.rider .titular{
	font: 35px 'GROBOLD', sans-serif !important;
	color: white;
	text-transform: uppercase;
	text-decoration: none;
	display: block;
}

.rider .image2{
	display: none;
}

.rider:hover .image1{
	display: none;
}
.rider:hover .image2{
	display: block;
}
.rider:hover .titular{
	color: #FCD700 !important;
}

.h-full{
	height: 100%;
}

.wrap-slider{
	position: relative;
}

.section-juguetes{
	background: url(./img/BSG-MAIN-BACKGROUND.jpg) no-repeat center;
	background-size: cover;
	width: 100%;
	position: relative;
	padding-top: 100px;
	padding-bottom: 80px;
}

.section-juguetes .circle{
	border: 6px solid #000;
	background: #fff;
	box-shadow: 10px 10px 6px #00000033;
	opacity: 1;
	aspect-ratio: 1 / 1;
	width: 80%;
	position: absolute;
	border-radius: 100%;
	z-index: 1;
	top: 10px;
	left: 50%;
	transform: translate(-50%, 0);
}

.section-juguetes img{
	position: relative;
	z-index: 2;
	margin-bottom: 30px;
}

.section-juguetes .title{
	font-size: 35px;
	font-family: 'GROBOLD', sans-serif !important;
	color: white;
	text-shadow: 0 0 30px #00000080;
	width: 100%;
	display: block;
	text-align: center;
	text-transform: uppercase;
	position: relative;
	bottom: 0;
}


.arrow{
	color: #fff;
	opacity: 1;
	font-size: 40px;
	transition: all .3s ease-in-out;
}

.arrow.black, .arrow.black:active{
	color: #333;
	opacity: 1;
	font-size: 40px;
	transition: all .3s ease-in-out;
}

.arrow:hover{
	opacity: 0.7;
	color: #fff;
}

.arrow.black:hover{
	opacity: 0.7;
	color: #333;
}

.next{
	position: absolute;
	right: -10px;
	top: 40%;
	transform: translate(0,-50%);
}

.previous{
	position: absolute;
	left: -10px;
	top: 40%;
	transform: translate(0,-50%);
}



.section-serie{
	background: url(./img/BSG-SCENARY-HEAVY-WEST.png) no-repeat center;
	background-size: cover;
	width: 100%;
	position: relative;
	padding-top: 100px;
	color: white;
	font-size: 20px;
	font-weight: bold;
	padding-bottom: 20px;
	background-size: cover;
	background-position: top;
	background-color: #edad4f;
}

.video{
	aspect-ratio: 16 / 9;
}

.logo-serie{
	position: relative;
	z-index: 2;
	margin-top: -100px;
	margin-left: -100px;
}

.img-footer {
	margin-top: -259px;
	position: absolute;
	z-index: 1000;
	left: 50%;
	transform: translate(-50%, 0);
}

.section-tuning{
	background: url(./img/Fondo-modulo-tuning.png) no-repeat center;
	background-size: cover;
	width: 100%;
	position: relative;
	padding-top: 100px;
	padding-bottom: 80px;
	font-size: 20px;
	color: white;
	font-weight: bold;
}

.section-game{
	background: url(./img/BSG-MAIN-BACKGROUND.jpg) no-repeat center;
	background-size: cover;
	width: 100%;
	position: relative;
	padding-top: 100px;
	padding-bottom: 380px;
	font-size: 20px;
	color: black;
	font-weight: bold;
}


.cookie-window{
	position:fixed; z-index:50000; padding:25px; bottom:20px; left:20px; background:#ffffff; color:#000; border:3px solid #000; border-radius: 10px; width:459px; font-size:15px;
}


.scale-up-center {
	-webkit-animation: scale-up-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	animation: scale-up-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.slide-in-blurred-left {
	-webkit-animation: slide-in-blurred-left 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
	animation: slide-in-blurred-left 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
}

/* ----------------------------------------------
 * Generated by Animista on 2023-6-25 11:46:2
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info.
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation scale-up-center
 * ----------------------------------------
 */
@-webkit-keyframes scale-up-center {
	0% {
		-webkit-transform: scale(0.5);
		transform: scale(0.5);
	}
	100% {
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}
@keyframes scale-up-center {
	0% {
		-webkit-transform: scale(0.5);
		transform: scale(0.5);
	}
	100% {
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}

/* ----------------------------------------------
 * Generated by Animista on 2023-6-25 11:51:6
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info.
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation slide-in-blurred-left
 * ----------------------------------------
 */
@-webkit-keyframes slide-in-blurred-left {
	0% {
		-webkit-transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
		transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
		-webkit-transform-origin: 100% 50%;
		transform-origin: 100% 50%;
		-webkit-filter: blur(40px);
		filter: blur(40px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0) scaleY(1) scaleX(1);
		transform: translateX(0) scaleY(1) scaleX(1);
		-webkit-transform-origin: 50% 50%;
		transform-origin: 50% 50%;
		-webkit-filter: blur(0);
		filter: blur(0);
		opacity: 1;
	}
}
@keyframes slide-in-blurred-left {
	0% {
		-webkit-transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
		transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
		-webkit-transform-origin: 100% 50%;
		transform-origin: 100% 50%;
		-webkit-filter: blur(40px);
		filter: blur(40px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0) scaleY(1) scaleX(1);
		transform: translateX(0) scaleY(1) scaleX(1);
		-webkit-transform-origin: 50% 50%;
		transform-origin: 50% 50%;
		-webkit-filter: blur(0);
		filter: blur(0);
		opacity: 1;
	}
}

/* Firefox */
* {
	scrollbar-width: thin;
	scrollbar-color: #FCAB1E #191A1A;
}

/* Chrome, Edge and Safari */
*::-webkit-scrollbar {
	width: 10px;
	width: 10px;
}
*::-webkit-scrollbar-track {
	border-radius: 4px;
	background-color: #191A1A;
}

*::-webkit-scrollbar-track:hover {
	background-color: #B8C0C2;
}

*::-webkit-scrollbar-track:active {
	background-color: #B8C0C2;
}

*::-webkit-scrollbar-thumb {
	border-radius: 6px;
	background-color: #FCAB1E;
}

*::-webkit-scrollbar-thumb:hover {
	background-color: #A35404;
}

*::-webkit-scrollbar-thumb:active {
	background-color: #FFD015;
}

@media (max-width: 640px){

	.hero{
		height: 100%;
	}

	.herologo{
		width: 100%;
		margin-left: 0;
		left: 0;
	}

	.wrap-juguete .content, .wrap-rider .content{
		height: 100vh;
		overflow: auto !important;
		border-radius: 0 !important;
	}

	.section-serie{
		background-size: auto;
		padding-top: 38px;
	}

	.menu-footer-container li{
		display: block;
		width: 100%;
	}

	.sub-footer a, .menu-footer-container a{
		display: block;
		text-decoration: underline;
		font-family: 'Montserrat', sans-serif !important;
		color: white !important;
		margin-left: 0;

		text-transform: none;
	}

	.img-footer{
		margin-top: -140px;
		z-index: 1000;
	}

	.footer-content {
		background: black;
		padding: 26px 40px 40px 40px;
	}

	.rider .titular {
		font: 19px 'GROBOLD', sans-serif !important;
	}

	.cookie-window{
		width: 90%;
	}

}