@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');
@font-face {
  font-family: 'Gotham';
  src: url('../fonts/Matsuri/Gotham/Gotham-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Gotham";
  src: url("../fonts/Matsuri/Gotham/Gotham-Light.otf") format("opentype");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: "Gotham";
  src: url("../fonts/Matsuri/Gotham/Gotham-Book.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "Gotham";
  src: url("../fonts/Matsuri/Gotham/Gotham-Medium.otf") format("opentype");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "Gotham";
  src: url("../fonts/Matsuri/Gotham/Gotham-Bold.otf") format("opentype");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "Gotham";
  src: url("../fonts/Matsuri/Gotham/Gotham-Black.otf") format("opentype");
  font-weight: 900;
  font-style: normal;
}

/* COLORS */
:root { 
	--dblue: #221C43; 
	--cred: #C0282E;
	--cgold: #CE861D;
	--wwhite: #FFFFFF;
	--lblack: #3C3C3B; 
	--2blue: #39558B;
	--2gold: #FFCC88;
	--lpink: #F4CFCE;
	--dgrey: #BDBCC9;
	--lgrey: #EAEAF4;
	--3blue: #06b4cb;
	--font-family: "Gotham", "Noto Sans JP", "Gotham", sans-serif;
	--font-tittle: "Gotham";
}

.ff {
	font-family: var(--font-family);
}
.ft {
	font-family: var(--font-tittle);
}
/* ------ */
/* BOTON MATSURI HAMBURGESA */
.navbar-toggler .navbar-toggler-icon {
	background-image: url("./../img/png/hamburger.png");
	/* scale: calc(1.5); */
}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
	background-image: url("./../img/png/hamburger2.png");
	/* scale: calc(1.5); */
}
/* ------------------------ */
/* nav and more */
.ard{
	height: 12px;
}
.navmenu, .btn.dropdown-toggle {
	font-size: 1.17rem;
	font-weight: 700;
	line-height: 1.2;
	font-family: var(--font-family);
}
.dropdown-toggle::after {
	content: "";
	display: inline-block;
	width: 1rem;
	height: 1rem;
	margin-left: 0.4rem;
	vertical-align: middle !important;
	background-image: url("../img/png/downarrow.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	border: none !important;
}
.navbar.d-md-none .nav-link.dropdown-toggle,
.navbar.d-md-none .nav-link.itemColor,
.navbar.d-md-none .dropdown-item {
	border-top: 1px solid var(--dgrey);
	margin: 2px;
}
.nav-link.dropdown-toggle::after {
	transform: rotate(270deg);
}
.nav-link[aria-expanded="true"].dropdown-toggle::after {
	transform: rotate(0deg);
}
/* .dropdown-toggle:hover + .dropdown-menu,
.dropdown-menu:hover {
    display: block;
} */
.dropdown-menu {
	min-width: 7.5rem !important;
}

.dropdown-item {
	font-weight: 600 !important;
	font-size: large;
}

.dropdown-item:active {
	background-color: var(--lgrey) !important;
	color: var(--dblue) !important;
}

.langBtn {
	border: none;
	background: transparent;
}

/* ------------ */
/* IMAGEN INTRO */
.homephoto {
    /* background-image: linear-gradient( to right, var(--dblue) 0%,
		transparent 45%, transparent 100%),
		url("./../img/Stage/stage_ncrowd.jpg"); */
	background-image: url(./../img/png/Foto\ Home\ Banner\ matsuri_web.png);
	/* background-image: url(./../img/png/Fondo\ home\ matsuri\ foto\ estrecho.png); */
    width: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
@media (max-width: 576px) {
	.titleMatsuri {
		width: 95vw;
		font-size: 6.5vw;
	}
	.subtitleMatsuri {
		font-size: 3.5vw;
	}
	.homephoto {
		height: 50vh;
	}
	.separation {
		margin-bottom: 2vh;
	}
	.logo {
		width: 42vw;
		margin: 1rem 0 1.2rem;
	}
}
@media (min-width: 576px) {
	.titleMatsuri {
		width: 70vw;
		font-size: 7vw;
	}
	.homephoto {
		height: 60vh;
	}
	.separation {
		margin-bottom: 2vh;
	}
	.logo {
		width: 42vw;
		margin: 1rem 0 1.2rem;
	}
}
@media (min-width: 768px) {
	.titleMatsuri {
		width: 60vw;
		font-size: 4vw;
	}
	.homephoto {
		height: 55vh;
	}
	.separation {
		margin-bottom: 2vh;
	}
	.logo {
		width: 42vw;
		margin: 1rem 0 1.2rem;
	}
	.navmenu, .btn.dropdown-toggle {
		font-size: 1rem;
		font-weight: 600;
		line-height: 1.2;
		font-family: var(--font-family);
	}
	.logo {
		width: 25vw;
	}
}
@media (min-width: 992px) {
	.titleMatsuri {
		width: 60vw;
		font-size: 3.2vw;
	}
	.homephoto {
		height: 60vh;
	}
	.separation {
		margin-bottom: 5vh;
	}
	.navmenu, .btn.dropdown-toggle {
		font-size: 1rem;
		font-weight: 700;
		line-height: 1.2;
		font-family: var(--font-family);
	}
	.logo {
		width: 20vw;
	}
}
@media (min-width: 1200px) {
	.titleMatsuri {
		width: 55vw;
		font-size: 3vw;
	}
	.homephoto {
		height: 60vh;
	}
	.separation {
		margin-bottom: 7vh;
	}
}
@media (min-width: 1400px) {
	.titleMatsuri {
		width: 45vw;
		font-size: 3.4vw;
	}
	.homephoto {
		height: 60vh;
	}
	.separation {
		margin-bottom: 5vh;
	}
	.logo {
		width: 15vw;
	}
}

.titleMatsuri {
	/* font-family: var(--font-family) !important; */
	font-family: var(--font-tittle) !important;
	padding: 1.5vh 2.5vw 0;
	color: var(--wwhite);
	text-shadow: 2px 2px 4px var(--grey),
			-1px -1px 0 black,
			-1px  1px 0 black,
			1px -1px 0 black,
			1px  1px 0 black,
			-1px  0px 0 black,
			1px  0px 0 black,
			0px -1px 0 black,
			0px  1px 0 black;
	font-weight: 300;
}

.subtitleMatsuri {
	/* font-family: var(--font-family) !important; */
	font-family: var(--font-title) !important;
	padding: 0 2.5vw 0;
	color: var(--wwhite);
	text-shadow: 2px 2px 4px var(--grey),
			-1px -1px 0 black,
			-1px  1px 0 black,
			1px -1px 0 black,
			1px  1px 0 black,
			-1px  0px 0 black,
			1px  0px 0 black,
			0px -1px 0 black,
			0px  1px 0 black;
	font-size: 0.6 em;
	font-weight: 300;
}

/* NAV-BUTTONS */
.tickets-nav:hover {
	animation: move-bg .35s linear infinite;
}
.tickets-nav {
	background-color: var(--cred);
	color: var(--wwhite);
	border-width: 0;
	transition: background-color 0.3s ease, transform 0.3s ease;
}
.tickets-nav,
.normal_btn-nav {
	border-radius: 50vh;
	padding: 0.3em;
	width: 10vw;
	font-size: 1em;
	font-family: var(--font-family);
	font-weight: bold;
}
/* ----------- */
/* Buttons */
.tickets {
	background-color: var(--cred);
	color: var(--wwhite);
	border-width: 0;
	transition: background-color 0.3s ease, transform 0.3s ease;
}
.tickets:hover {
	animation: move-bg .35s linear infinite;
}

@keyframes move-bg {
	0%{
		background: linear-gradient(45deg,
		red 0%, 
		rgba(192, 40, 46, 1) 33%, 
		rgba(192, 40, 46, 1) 63%, 
		rgba(192, 40, 46, 1) 100%);
	}
	25% {
		background: linear-gradient(45deg,
		rgba(192, 40, 46, 1) 0%, 
		red 33%, 
		rgba(192, 40, 46, 1) 63%, 
		rgba(192, 40, 46, 1) 100%);
	}
	50% {
		background: linear-gradient(45deg,
		rgba(192, 40, 46, 1) 0%, 
		rgba(192, 40, 46, 1) 33%, 
		red 63%, 
		rgba(192, 40, 46, 1) 100%);
	}
	75% {
		background: linear-gradient(45deg,
		rgba(192, 40, 46, 1) 0%, 
		rgba(192, 40, 46, 1) 33%, 
		rgba(192, 40, 46, 1) 63%, 
		red 100%);
	}
	100% {
		background: linear-gradient(45deg,
		rgba(192, 40, 46, 1) 0%, 
		rgba(192, 40, 46, 1) 33%, 
		rgba(192, 40, 46, 1) 63%, 
		rgba(192, 40, 46, 1) 100%);
	}
}

/* .anuncio-text {
	width: max-content;
    animation: anuncio 20s linear infinite;
}
.anuncio-text p {
    white-space: nowrap;
    margin: 0;
    padding-right: 3rem;
    color: #fff;
}
@keyframes anuncio {
    0%   { transform: translateX(0%); }
    100% { transform: translateX(-50%); }
} */

.specialFadeBtn {
	background-color: transparent !important;
	color: var(--wwhite) !important;
	border-color: var(--wwhite);
	border-style: solid;
	border-width: 0.15rem;
}
.normal_btn {
	background-color: var(--wwhite);
	color: var(--dblue);
}
.tickets,
.normal_btn {
	margin: 2px 2.5vw 2px;
	border-radius: 50vh;
	padding: 0.3em;
	width: 10em;
	font-size: 1em;
	font-family: var(--font-family);
	font-weight: bold;
}

.crowd_btn {
	margin: 2px 2.5vw 2px;
	border-radius: 50vh;
	padding: 0.01em 0.3em;
	width: 12em;
	font-size: 1em;
	font-family: var(--font-family);
	font-weight: bold;
}

.small_btn {
	margin: 2px 0vw;
	border-radius: 50vh;
	padding: 0.01em 0.1em;
	width: 9em;
	height: 2.2rem;
	font-size: 1em;
	font-family: var(--font-family);
	font-weight: bold;
	color: var(--lblack) !important;
	border: none;
}

.small_btnGold {
	margin: 2px 0vw;
	border-radius: 50vh;
	padding: 0.01em 0.1em;
	width: 9em;
	height: 2.2rem;
	font-size: 1em;
	font-family: var(--font-family);
	font-weight: bold;
	color: var(--lgrey) !important;
	border: none;
}

.small_btnGold:hover {
	scale: calc(1.1);
	color: var(--wwhite) !important;
}

.aniBtn:hover {
	scale: calc(1.1);
	color: black !important;
}

.aniBtnTkt:hover {
	scale: calc(1.1);
	color: var(--wwhite) !important;
}

.help {
	scale: calc(0.8);
}

.itemColor {
	color: var(--dblue) !important;
	font-family: var(--font-family) !important;
	font-weight: 400;
}
/* ------------ */
/* SPONSORS */
.slider {
    overflow: hidden;
}
.slider-track {
    display: flex;
    width: max-content;
    width: calc(200px * 11);
    animation: scroll 20s linear infinite;
}
.slider-track > img {
    width: 150px;
    height: auto;
    margin-left: 40px;
    object-fit: contain;
}
@keyframes scroll {
    0% {
        transform: translateX(0);
    } 
    100% {
        transform: translateX(-95%);
    }
}
.sponsor-img {
    height: 160px;
}
/* -------- */
/* SEPARADORES */
.nuvesRosas {
	height: 4.8rem;
	border: none;
	background-image: url("./../img/png/Separador\ olas\ part_Top\ pink.png");
	background-repeat: repeat-x;
	background-position: center;
	opacity: 1;
}
.nuvesRojas {
	height: 4.8rem;
	border: none;
	background-image: url("./../img/png/Separador\ olas\ part_Top.png");
	background-repeat: repeat-x;
	background-position: center;
	opacity: 1;
}
.olasRojas {
	height: 4.8rem;
	border: none;
	background-image: url("./../img/png/Separador\ olas\ part_Bottom.png");
	background-repeat: repeat-x;
	background-position: center;
	opacity: 1;
}

.separador {
	height: 4.8rem;
	border: none;
	/* background-image: url("./../img/png/Separador\ logo\ dorado\ matsuri.png"); */
	background-image: url("./../img/b_Separadores/separador_isologo_dorado_1980.png");
	background-repeat: repeat-x;
	background-position: center;
	opacity: 1;
}
/* .separadorOk {
	height: 4.8rem;
	border: none;
	background-image: url("./../img/b_Separadores/separador_isologo_dorado_1980.png");
	background-image: url("./../img/b_Separadores/separador_isologo_dorado_1980.png");
	background-repeat: repeat-x;
	background-position: center;
	opacity: 1;
} */

.tejas {
	height: 4.8rem;
	border: none;
	background-image: url("./../img/png/Separador\ olas\ 2_gris.png");
	background-repeat: repeat-x;
	opacity: 1;
}
.escamasAzules {
	height: 4.8rem;
	border: none;
	background-image: url("./../img/b_Separadores/Separador\ escamas_azul.png");
	background-repeat: repeat-x;
	opacity: 1;
}
.escamasRojas {
	height: 4.8rem;
	border: none;
	background-image: url("./../img/b_Separadores/Separador\ escamas_rojo.png");
	background-repeat: repeat-x;
	opacity: 1;
}
.floresDoradas {
	height: 4.8rem;
	border: none;
	background-image: url("./../img/b_Separadores/separador\ flores_dorado.png");
	background-repeat: repeat-x;
	opacity: 1;
}
/* ----------- */


/* ¿MATSURI? */
.img50 {
	width: 70%;
	max-width: 17rem;
	min-width: 17rem;
	height: 45vh;
	min-height: 40vh;
	/* background-image: url("./../img/other/yukataplp1.jpg"); */
	background-image: url("./../img/austinPictures/MATSURI25-092.jpg");
	/* background-image: url("./../img/austinPictures/MATSURI25-100.jpg"); */
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	object-fit: cover;
}
/* --------- */
/* CAROUSEL */
.carousel-control-prev, .carousel-control-next {
	align-self: center;
}
.mySwiper {
	position: relative;
	background-color: var(--dblue);
}
.swiper-button-next, .swiper-button-prev {
	width: 1.2rem !important;
	color: var(--wwhite) !important;
	height: 10% !important;
}
.swiper-button-next {
	translate: calc(.4rem);
}
.swiper-button-prev {
	translate: calc(-.4rem);
}
.carousel-control-prev-icon {
  background-image: url("./../img/png/right-arrow.png");
}

.carousel-control-next-icon {
  background-image: url("./../img/png/left-arrow.png");
}
/* -------- */
/* containers */
.bg-container-animation:hover {
	animation: blub .5s linear;
}
@keyframes blub {
    0% {transform:calc(0%); background: linear-gradient(0deg,rgba(34, 28, 67, 0.2) 60%, rgba(72, 72, 163, 0.2) 100%);}
    5% {transform: calc(5%); background: linear-gradient(10deg,rgba(34, 28, 67, 0.2) 84%, rgba(72, 72, 163, 0.2) 100%);}
    10% {transform: calc(10%); background: linear-gradient(20deg,rgba(34, 28, 67, 0.2) 97%, rgba(72, 72, 163, 0.2) 100%);}
    15% {transform: calc(15%); background: linear-gradient(30deg,rgba(55, 43, 138, 0.2) 3%, rgba(34, 28, 67, 0.2) 100%, rgba(72, 72, 163, 0.2) 100%);}
    20% {transform: calc(20%); background: linear-gradient(40deg,rgba(55, 43, 138, 0.2) 0%, rgba(34, 28, 67, 0.2) 0%, rgba(72, 72, 163, 0.2) 57%);}
    25% {transform: calc(25%); background: linear-gradient(50deg,rgba(55, 43, 138, 0.2) 0%, rgba(34, 28, 67, 0.2) 7%, rgba(72, 72, 163, 0.2) 57%);}
    30% {transform: calc(30%); background: linear-gradient(60deg,rgba(55, 43, 138, 0.2) 0%, rgba(34, 28, 67, 0.2) 17%, rgba(72, 72, 163, 0.2) 57%);}
    35% {transform: calc(35%); background: linear-gradient(70deg,rgba(55, 43, 138, 0.2) 0%, rgba(34, 28, 67, 0.2) 27%, rgba(72, 72, 163, 0.2) 71%);}
    40% {transform: calc(40%); background: linear-gradient(80deg,rgba(55, 43, 138, 0.2) 0%, rgba(34, 28, 67, 0.2) 38%, rgba(72, 72, 163, 0.2) 71%);}
    45% {transform: calc(45%); background: linear-gradient(90deg,rgba(55, 43, 138, 0.2) 0%, rgba(34, 28, 67, 0.2) 48%, rgba(72, 72, 163, 0.2) 66%);}
    50% {transform: calc(50%); background: linear-gradient(100deg,rgba(55, 43, 138, 0.2) 0%, rgba(34, 28, 67, 0.2) 56%, rgba(72, 72, 163, 0.2) 63%);}
    55% {transform: calc(55%); background: linear-gradient(110deg,rgba(55, 43, 138, 0.2) 0%, rgba(34, 28, 67, 0.2) 59%, rgba(72, 72, 163, 0.2) 53%);}
    60% {transform: calc(60%); background: linear-gradient(120deg,rgba(55, 43, 138, 0.2) 0%, rgba(34, 28, 67, 0.2) 66%, rgba(72, 72, 163, 0.2) 100%);}
    65% {transform: calc(65%); background: linear-gradient(130deg,rgba(55, 43, 138, 0.2) 0%, rgba(34, 28, 67, 0.2) 77%, rgba(72, 72, 163, 0.2) 100%);}
    70% {transform: calc(70%); background: linear-gradient(140deg,rgba(55, 43, 138, 0.2) 30%, rgba(34, 28, 67, 0.2) 85%, rgba(72, 72, 163, 0.2) 100%);}
    75% {transform: calc(75%); background: linear-gradient(150deg,rgba(55, 43, 138, 0.2) 38%, rgba(34, 28, 67, 0.2) 92%, rgba(72, 72, 163, 0.2) 100%);}
    80% {transform: calc(80%); background: linear-gradient(160deg,rgba(55, 43, 138, 0.2) 44%, rgba(34, 28, 67, 0.2) 99%, rgba(72, 72, 163, 0.2) 100%);}
    85% {transform: calc(85%); background: linear-gradient(170deg,rgba(55, 43, 138, 0.2) 55%, rgba(34, 28, 67, 0.2) 99%, rgba(72, 72, 163, 0.2) 100%);}
    90% {transform: calc(90%); background: linear-gradient(180deg,rgba(55, 43, 138, 0.2) 69%, rgba(34, 28, 67, 0.2) 99%, rgba(72, 72, 163, 0.2) 100%);}
    95% {transform: calc(95%); background: linear-gradient(190deg,rgba(55, 43, 138, 0.2) 100%, rgba(34, 28, 67, 0.2) 100%, rgba(72, 72, 163, 0.2) 100%);}
    100% {transform: calc(100%);background: linear-gradient(200deg,rgba(55, 43, 138, 0.2) 100%, rgba(34, 28, 67, 0.2) 100%, rgba(72, 72, 163, 0.2) 100%);}
}
/* ---------- */

/* backgrounds */
.bg-cred {
	--bg-opacity: 1;
	background-color: var(--cred) !important;
	color:var(--wwhite);
	font-family: var(--font-family);
}

.bg-cgold {
	--bg-opacity: 1;
	background-color: var(--cgold) !important;
	color:var(--wwhite) !important;
	font-family: var(--font-family);
}

.bg-dblue {
	background-color: var(--dblue) !important;
	color:var(--wwhite);
	font-family: var(--font-family);
}

.bg-dgrey {
	background-color: var(--dgrey) !important;
	color:var(--lblack);
	font-family: var(--font-family);
}

.bg-lgrey {
	background-color: var(--lgrey) !important;
	color:var(--lblack);
	font-family: var(--font-family);
}

.bg-eventInfo {
	background: url("./../img/png/Pastilla\ fondo\ isologo\ matsuri\ azul.png");
	background-repeat: no-repeat !important;
	background-position-x: left;
	background-position-y: top;
	color:var(--wwhite);
	font-family: var(--font-family);
}

.bg-location {
	background: url("./../img/png/Isologo\ transparencia\ corte\ esquina.png");
	background-repeat: no-repeat !important;
	background-position-x: right;
	background-position-y: bottom;
	color:var(--wwhite);
	font-family: var(--font-family);
}

.bg-2blue {
	background-color: var(--2blue) !important;
	color:var(--wwhite);
	font-family: var(--font-family);
}

.bg-3blue {
	background-color: var(--3blue) !important;
	color:var(--wwhite);
	font-family: var(--font-family);
}

.bg-wwhite {
  --bg-opacity: 1;
  background-color: var(--wwhite) !important;
}
/* ----------- */
/* colors letters */
.text-wwhite {
	--text-opacity: 1;
	color: var(--wwhite) !important;
}

.text-cred {
	--text-opacity: 1;
	color: var(--cred) !important;
}

.text-dblue {
	--text-opacity: 1;
	color: var(--dblue) !important;
}

.text-cgold {
	--text-opacity: 1;
	color: var(--cgold) !important;
}

.text-2gold {
	--text-opacity: 1;
	color: var(--2gold) !important;
}
.text-bg-cred {
	color: #FFFFFF !important;
	background-color: var(--cred), var(--bg-opacity,1) !important;
}

.text-bg-dblue {
	color: #FFFFFF !important;
	background-color: var(--dblue), var(--bg-opacity,1) !important;
}
/* -------------- */
/* WHANT HELP */
.animation-funny:hover {
	/* display: inline-flex; */
	/* align-items: center; */
    /* font-weight: bold; */
    /* -webkit-background-clip: text !important; */
    /* background-clip: text !important; */
    /* color: transparent !important; */
	color: var(--lgrey) !important;
	/* margin-bottom: 0 !important; */
    /* animation: pasada 1.4s linear infinite !important; */
}
/* .animation-funny:hover > img { */
	/* padding-left: 10px; */
	/* display: inline-flex; */
	/* align-items: center; */
	/* animation: move-move 1.4s linear infinite !important; */
/* } */

@keyframes move-move {
	0% {
		padding-left: 0vw;
		padding-right: 0px;
		rotate: calc(0deg);
		transform: scale(1.3);
	} 50% {
		padding-left: 20px;
		padding-right: 20px;
		rotate: calc(180deg);
		transform: scale(1);
	} 100% {
		padding-left: 0vw;
		padding-right: 0px;
		rotate: calc(360deg);
		transform: scale(1.3);
	}
}
@keyframes pasada {
	0% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(9, 9, 121, 1) 0%, rgba(0, 210, 254, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(248, 254, 255, 1) 100%, rgba(0, 212, 255, 1) 100%); padding-left: 1px;}
	5% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(9, 9, 121, 1) 0%, rgba(0, 210, 254, 1) 8%, rgba(255, 255, 255, 1) 42%, rgba(248, 254, 255, 1) 100%, rgba(0, 212, 255, 1) 100%); padding-left: 2px;}
	10% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(9, 9, 121, 1) 0%, rgba(0, 210, 254, 1) 43%, rgba(255, 255, 255, 1) 71%, rgba(248, 254, 255, 1) 100%, rgba(0, 212, 255, 1) 100%); padding-left: 3px;}
	15% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(9, 9, 121, 1) 0%, rgba(0, 210, 254, 1) 62%, rgba(255, 255, 255, 1) 97%, rgba(248, 254, 255, 1) 100%, rgba(0, 212, 255, 1) 100%); padding-left: 4px;}
	20% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(9, 9, 121, 1) 31%, rgba(0, 210, 254, 1) 74%, rgba(255, 255, 255, 1) 100%, rgba(248, 254, 255, 1) 100%, rgba(0, 212, 255, 1) 100%); padding-left: 5px;}
	25% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(248, 254, 255, 1) 0%, rgba(9, 9, 121, 1) 50%, rgba(0, 210, 254, 1) 90%, rgba(255, 255, 255, 1) 100%, rgba(248, 254, 255, 1) 100%, rgba(0, 212, 255, 1) 100%); padding-left: 6px;}
	30% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(248, 254, 255, 1) 0%, rgba(9, 9, 121, 1) 72%, rgba(0, 210, 254, 1) 97%, rgba(255, 255, 255, 1) 100%, rgba(248, 254, 255, 1) 100%, rgba(0, 212, 255, 1) 100%); padding-left: 7px;}
	35% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(248, 254, 255, 1) 0%, rgba(0, 210, 254, 1) 3%, rgba(9, 9, 121, 1) 83%, rgba(0, 210, 254, 1) 98%, rgba(255, 255, 255, 1) 100%, rgba(248, 254, 255, 1) 100%, rgba(0, 212, 255, 1) 100%); padding-left: 8px;}
	40% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(248, 254, 255, 1) 0%, rgba(0, 210, 254, 1) 3%, rgba(2, 0, 36, 1) 100%, rgba(9, 9, 121, 1) 93%, rgba(0, 210, 254, 1) 98%, rgba(255, 255, 255, 1) 100%, rgba(248, 254, 255, 1) 100%, rgba(0, 212, 255, 1) 100%); padding-left: 6px;}
	45% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(248, 254, 255, 1) 0%, rgba(0, 210, 254, 1) 39%, rgba(2, 0, 36, 1) 100%, rgba(9, 9, 121, 1) 100%, rgba(255, 255, 255, 1) 100%, rgba(248, 254, 255, 1) 100%, rgba(0, 212, 255, 1) 100%); padding-left: 4px;}
	50% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(248, 254, 255, 1) 0%, rgba(0, 210, 254, 1) 54%, rgba(255, 255, 255, 1) 100%, rgba(248, 254, 255, 1) 91%, rgba(0, 212, 255, 1) 95%); padding-left: 2px;}
	55% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(248, 254, 255, 1) 0%, rgba(0, 210, 254, 1) 78%, rgba(255, 255, 255, 1) 100%); padding-left: 0px;}
	60% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(248, 248, 249, 1) 0%, rgba(255, 255, 255, 1) 42%, rgba(0, 212, 255, 1) 70%, rgba(254, 254, 255, 1) 92%, rgba(254, 254, 255, 1) 96%); padding-left: 1px;}
	65% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(248, 248, 249, 1) 0%, rgba(255, 255, 255, 1) 53%, rgba(0, 212, 255, 1) 88%, rgba(254, 254, 255, 1) 92%, rgba(254, 254, 255, 1) 96%); padding-left: 2px;}
	70% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(248, 248, 249, 1) 0%, rgba(255, 255, 255, 1) 81%, rgba(0, 212, 255, 1) 100%, rgba(254, 254, 255, 1) 92%, rgba(254, 254, 255, 1) 96%); padding-left: 3px;}
	75% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(248, 248, 249, 1) 0%, rgba(0, 212, 255, 1) 0%, rgba(11, 214, 255, 1) 4%, rgba(254, 254, 255, 1) 66%, rgba(255, 255, 255, 1) 96%, rgba(254, 254, 255, 1) 100%); padding-left: 4px;}
	80% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(248, 248, 249, 1) 0%, rgba(0, 212, 255, 1) 0%, rgba(254, 254, 255, 1) 0%, rgba(11, 214, 255, 1) 62%, rgba(99, 229, 255, 1) 66%, rgba(255, 255, 255, 1) 78%, rgba(254, 254, 255, 1) 100%); padding-left: 5px;}
	85% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(248, 248, 249, 1) 0%, rgba(0, 212, 255, 1) 0%, rgba(254, 254, 255, 1) 0%, rgba(11, 214, 255, 1) 100%, rgba(99, 229, 255, 1) 86%, rgba(255, 255, 255, 1) 92%, rgba(254, 254, 255, 1) 100%); padding-left: 6px;}
	90% {background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(248, 248, 249, 1) 0%, rgba(0, 212, 255, 1) 0%, rgba(254, 254, 255, 1) 0%, rgba(244, 252, 255, 1) 59%, rgba(99, 229, 255, 1) 92%, rgba(255, 255, 255, 1) 100%, rgba(11, 214, 255, 1) 100%, rgba(254, 254, 255, 1) 100%); padding-left: 4px;}
	95% {background: linear-gradient(90deg,rgba(55, 221, 255, 1) 0%, rgba(255, 255, 255, 1) 93%, rgba(255, 255, 255, 1) 100%, rgba(0, 212, 255, 1) 100%); padding-left: 2px;}
	100% {background: linear-gradient(90deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 93%, rgba(255, 255, 255, 1) 100%, rgba(200, 232, 255, 1) 100%); padding-left: 0px;}
}

.lupa {
  overflow: hidden;
  position: relative;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}

.lupa>img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform-origin: center;
  transition: transform 0.1s;
}
/* ---------- */
/* SOCIAL NETWORKS */
.socialNetworks img {
	/* height: 3vw; */
	/* width: 1rem; */
	/* max-width: 24px; */
	width: 1.8rem;
}
.instagram:hover {
	transform: scale(1.1);
	background: linear-gradient(121deg,rgba(131, 58, 180, 1) 0%, rgba(253, 29, 29, 1) 30%, rgba(252, 176, 69, 1) 100%);
	border-radius: 0.5rem;
}
.youtube:hover {
	transform: scale(1.1);
	background: radial-gradient(circle,rgba(255, 0, 0, 1) 0%, rgba(34, 28, 67, 1) 100%);
	border-radius: 0.5rem / 0.5rem;
}
.facebook:hover {
	transform: scale(1.1);
	background: linear-gradient(135deg,rgba(2, 0, 36, 1) 0%, rgba(9, 9, 121, 1) 35%, rgba(0, 212, 255, 1) 100%);
	border-radius: 0.5rem / 0.5rem;
}
/* --------------- */