body { background:#000 url(/img/pages/links/bgr-wd.jpg) no-repeat fixed center; }

.desktop #bgr_fixed { display:none; }
.mobile #bgr_fixed { background-image: url(/img/pages/links/bgr-m2.jpg); }
#bgr_fixed {
	background-color: #000;
	background-image: url(/img/pages/links/bgr-wd.jpg);
    background-size: cover;
	background-repeat: no-repeat;
	background-position: bottom left;
	height: 100vh;
	width: 100vw;
	max-width: 100vw;
	position: fixed;
}
main section#bgr_fixed { max-width: 100vw !important; }

.mobile h2 { font-size: 1.15em; }

.shadow, .video16x9 { 
	box-shadow: 0 0 0 10px rgba(255,255,255,.1); 
	border-radius: 10px;
}

main section { max-width: 600px !important; }
body.mobile main section { max-width: 100dvw !important; }

#avatar {
	display: block;
	width:150px;
	margin-inline: auto;
}

#avatar img {
	border:5px solid rgba(255,255,255,.2);
	border-radius: 50%;
    box-shadow: 0 0 5px #fff, 0 0 5px #fff, 0 0 10px #e60073, 0 0 20px #e60073, 0 0 15px #e60073, 0 0 20px #e60073, 0 0 25px #e60073;
	transition: all .6s ease-in-out;
}


#logo { margin:0 auto 10px; }
#logo .section { 
	height: 150px;
	display: block;
	align-content: center;
}

#chlogo {
	display: block;
	width:150px;
	margin-inline: auto;
	text-align: center;
}
#chlogo::before { 
	font-size:100px;
    text-shadow: 0 0 10px #fff, 0 0 20px #e60073, 0 0 30px #e60073, 0 0 40px #e60073, 0 0 50px #e60073, 0 0 60px #e60073;
	color:white;
	transition: all .6s ease-in-out;
}

#chlogo_txt { 
	font-family: Times New Roman;
	text-align: center;
	font-size:40px;
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #e60073, 0 0 40px #e60073, 0 0 50px #e60073, 0 0 60px #e60073, 0 0 70px #e60073;
	color:white;
	transition: all .6s ease-in-out;
	display: none;
	margin-top: 10px;
	font-size: 20px;
}

.video16x9 { display:block; }
.rounded { border-radius: 10px; }
.glow { transition:all .5s ease-in-out; }

@media (hover: hover) { 
	#chlogo:hover::before { 
	    text-shadow: 0 0 20px #fff, 0 0 30px #ff4da6, 0 0 40px #ff4da6, 0 0 50px #ff4da6, 0 0 60px #ff4da6, 0 0 70px #ff4da6, 0 0 80px #ff4da6;
	}
	.glow:hover {
		box-shadow: 0 0 5px #fff, 0 0 5px #ff4da6, 0 0 10px #ff4da6, 0 0 15px #ff4da6, 0 0 12px #ff4da6, 0 0 16px #ff4da6, 0 0 16px #ff4da6;
	}
	#avatar:hover img {
		box-shadow: 0 0 10px #fff, 0 0 10px #ff4da6, 0 0 20px #ff4da6, 0 0 30px #ff4da6, 0 0 25px #ff4da6, 0 0 35px #ff4da6, 0 0 35px #ff4da6;
	}
	#lsocial .social-links a:hover i::before {
		text-shadow: 0 0 5px rgba(255,255,255,.6), 0 0 5px rgba(255,255,255,.6), 0 0 10px #e60073, 0 0 20px #e60073, 0 0 15px #e60073, 0 0 20px #e60073, 0 0 25px #e60073;
	}
}

#lsocial { margin-bottom:0; }
#lsocial .social-links { margin-top:0; }
#lsocial .social-links a {
	color: rgba(255,255,255,.9);
	transition: all .5s ease;
}

.box {
	background-color: rgba(42, 42, 42, .8);
	border-radius: 15px;
}
.box.top img { border-radius:15px 15px 0 0; }
.box .text { color:var(--white); padding:20px; }


/* --~~ Slides ~~--*/

main h2 {
	color:var(--white);
	text-transform: uppercase;
	font-size: 14px;
	font-weight: normal;
	font-family: var(--roboto);
	font-style: normal;
	text-align: center;
}

.slides {
	overflow: hidden;
	width: 100%;
}

div.slides-wrapper { display: flex; gap:10px; }
.swiper-initialized div.slides-wrapper { gap:0; }

div.slide {
	background: rgba(42, 42, 42, .8);
	border-radius: 15px;
	height: 140px;
	display: flex;
	color:var(--white);
	flex-shrink: 0;
}
.slides-wrapper.w180 .slide .content { width: 180px; }
.slides-wrapper.one .slide { width: 100%; }
.slides-wrapper.two .slide { width: calc(50% - 5px); }
.slides-wrapper.three .slide { width: calc(33% - 5px); }

div.slide .img { width:140px; }
div.slide .img img {
	border-radius: 15px 0 0 15px;
	display: block;
	max-width: unset;
}

div.slide .content {
	display:block;
	align-content:center;
	padding-inline: 20px;
	position: relative;
}

div.slide button {
	border:0;
	outline:none;
	position: absolute;
	bottom:5px;
	right:10px;
	padding-inline: 10px;
	height: 30px;
	border-radius: 5px;
	background-color: rgba(0,0,0,.5);
	color:var(--white);
	text-transform: uppercase;
	font-size: 11px;
	cursor: pointer;
	transition: all .3s ease-in-out;
}

a.glowlink, 
div.slide .content a {
	display: inline-block;
	margin-top: 8px;
	color:rgba(0, 169, 197, 1.00);
	transition: all .3s ease-in-out;
	border:0;
	outline:none;
	padding-inline: 8px;
	height: 24px;
	line-height: 24px;
	border-radius: 5px;
	background-color: rgba(0,0,0,.5);
	color:var(--white);
	text-transform: uppercase;
	font-size: 11px;
	cursor: pointer;
}

a.glowlink {
	display: block;
	margin-inline: auto;
	width: fit-content;
}

@media (hover: hover) { 
	div.slide button:hover {
		background-color: rgba(0,0,0,.3);
		box-shadow: 0 0 5px #fff, 0 0 5px #ff4da6, 0 0 10px #ff4da6, 0 0 10px #ff4da6, 0 0 10px #ff4da6;
	}
	a.glowlink:hover, 
	div.slide .content a:hover {
		box-shadow: 0 0 3px #fff, 0 0 3px #ff4da6, 0 0 6px #ff4da6, 0 0 6px #ff4da6, 0 0 6px #ff4da6;
	}
}

/* --------~~~~{}~~~~-------- */

.swiper-wrapper { display: flex; }

.swiper {
	width: 100%;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: move;
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}

.swiper-slide button {
	font-size: 18px;
	padding: 0 20px;
	border: 0;
	background: rgba(0,0,0,.15);
	color: rgba(255,255,255,.75);
	display: block;
	align-content: center;
	height: 100%;
	cursor: pointer;
	border-radius: 5px;
	transition: all .4s ease-in-out;
}

.swiper-slide button.active { 
	background: rgba(0,0,0,.65);
	color:rgba(255,255,255,.8);
}

@media (hover: hover) { 
	.swiper-slide button:hover {
		background: rgba(0,0,0,.65);
		color:rgba(255,255,255,.8);
	}
}

.swiper-slide {
	width: fit-content !important;
	padding:0;
	background: unset;
}

footer { border-top: 8px solid #241c16; }