/* Topnav */
nav.topnav{
	position:fixed; top:0; left:0; width:100%; z-index:90;
	background-image:linear-gradient(to right,
		#a12764 0%, #a12764 30%, #852c98 50%, #493bce 75%, #150f4b 100%);
}
nav.topnav > .container{position:relative;}
nav.topnav > .container::before{
	content:''; position:absolute; top:0; bottom:0; right:100%; width:calc(50vw - 50%);
	background:#ffffff;
}
nav.topnav .topnav-wrapper{width:100%; display:flex;}
nav.topnav .logo{
	position:relative; display:flex; align-items:center; height:4.5rem;
	background:#ffffff; padding:0 0 .5rem 0; transition:height .25s, color .25s;
}
nav.topnav .logo::before{
	content:''; position:absolute; top:0; bottom:0; left:0; width:calc(100% + 7rem);
	background:#ffffff; clip-path:polygon(0 0, 100% 0, calc(100% - 4rem) 100%, 0 100%);
}
nav.topnav .logo > .wrapper{position:relative; display:flex; align-items:flex-end;}
nav.topnav .logo .ptt{display:block; height:3rem; width:auto;}
nav.topnav .logo .slogan{padding:0 0 0 .625rem; text-align:center; transform:translateY(.4375rem);}
nav.topnav .logo .title, nav.topnav .logo .desc{
	font-size:2.25rem; font-weight:900; line-height:.85; color:#ffffff;
}
nav.topnav .logo .desc{font-size:.6875rem; font-weight:700;}
nav.topnav .logo .hero{
	display:block; height:2.375rem; width:auto; margin:0 0 0 .75rem; transform:translateY(.125rem);
}
@keyframes sloganShine {
    0% { background-position:0% 50%; }
    100% { background-position:100% 50%; }
}
@media screen and (min-width:992px){
	nav.topnav .logo .title, nav.topnav .logo .desc{
		background-image:linear-gradient(to right,
			#ffae00, #ff2784, #ff2484, #6732fe, #6334fe, #04edd8);
		-webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
		background-size:500% auto; animation:sloganShine 7s ease-in-out infinite alternate;
	}
}

nav.topnav .menu-container{display:flex; margin:0 0 0 auto;}
nav.topnav .menu{display:flex; align-items:center; margin:0 0 0 .75rem;}
nav.topnav .menu .MuiButtonBase-root.MuiButton-root:not(.MuiButton-containedPrimary){
	background:transparent!important; color:#ffffff!important;
}
nav.topnav .menu .MuiButtonBase-root.MuiButton-root.disabled{color:rgba(255,255,255,.4)!important;}

nav.topnav .options{display:flex; margin:0 0 0 1rem;}
nav.topnav .option{position:relative; display:flex; align-items:center;}
nav.topnav .option > .dropdown{
	display:block; position:absolute; top:calc(100% + .5rem); right:0; z-index:1;
	padding:.5rem 0; opacity:0; pointer-events:none; background:#ffffff;
	transition:top .25s, opacity .25s;
}
nav.topnav .option:hover > .dropdown{top:100%; opacity:1; pointer-events:auto;}
nav.topnav .avatar-title{
	width:4.625rem; text-align:center;
	display:block; text-overflow:ellipsis; overflow:hidden;
    -webkit-box-orient:vertical; -webkit-line-clamp:1;
}

nav.topnav + .topnav-spacer{display:block; width:100%; height:4.5rem;}
.topnav-pattern{
	position:fixed; top:0; left:0; width:100%; height:100vh; z-index:89;
	clip-path:polygon(0 0, 1.5rem 0, 1.5rem calc(100% - 1rem), 
		calc(100% - 1.5rem) calc(100% - 1rem), calc(100% - 1.5rem) 0, 
		100% 0, 100% 100%, 0 100%);
	pointer-events:none; background-size:cover; background-position:center;
}

@media screen and (max-width:1199.98px){
	nav.topnav .logo::before{
		width:calc(100% + 2.5rem); clip-path:polygon(0 0, 100% 0, calc(100% - 2rem) 100%, 0 100%);
	}
	nav.topnav .options{margin:0;}
}
@media screen and (max-width:991.98px){
	nav.topnav > .container::before{display:none;}
	nav.topnav .logo{height:4rem; margin:0 auto; background:transparent;}
	nav.topnav .logo::before{display:none;}
	nav.topnav .logo .ptt{height:2.75rem;}
	nav.topnav .logo .slogan{padding:0 0 0 .5rem; transform:translateY(.5625rem);}
	nav.topnav .logo .title{font-size:2rem; line-height:.95;}
	nav.topnav .logo .desc{font-size:.625rem; line-height:.95;}
	nav.topnav .options{margin:unset;}
	nav.topnav .menu-container{display:none;}
	nav.topnav + .topnav-spacer{height:4rem;}
	.topnav-pattern{
		clip-path:polygon(0 0, 1rem 0, 1rem calc(100% - 1rem), 
			calc(100% - 1rem) calc(100% - 1rem), calc(100% - 1rem) 0, 
			100% 0, 100% 100%, 0 100%);
	}
	nav.topnav .hide-tablet{display:none!important;}
}
@media screen and (max-width:767.98px){
	nav.topnav .logo{height:3.5rem;}
	nav.topnav .logo .ptt{height:2.5rem;}
	nav.topnav .logo .slogan{padding:0 0 0 .375rem; transform:translateY(.4375rem);}
	nav.topnav .logo .title{font-size:1.75rem;}
	nav.topnav .logo .desc{font-size:.5625rem;}
	nav.topnav + .topnav-spacer{height:3.5rem;}
	.topnav-pattern{display:none;}
}
@media screen and (min-width:992px){
	nav.topnav .show-tablet{display:none!important;}
}
@media screen and (min-width:992px) and (max-width:1199.98px){
	nav.topnav > .container{max-width:960px; width:auto;}
}


/* Footer */
nav.footer{
	display:flex; align-items:center; height:3.5rem; text-align:center;
	position:absolute; bottom:0; left:0; width:100%; margin:0 0 1rem 0;
	color:#ffffff; background:hsl(233,10%,10%);
}
@media screen and (max-width:991.98px){
	nav.footer{margin:0; color:#000000; background:#ffffff;}
}


/* Mobile Nav */
nav.mobile-nav{
  	position:fixed; display:none!important; bottom:0; left:0; width:100vw; z-index:90;
	box-shadow:rgba(0,0,0,.06) 0px -3px 8px; background:hsl(233,10%,10%);
}
nav.mobile-nav .items{position:relative; display:flex; width:100%;}
nav.mobile-nav .item{
  	position:relative; display:flex; align-items:center; justify-content:center;
	width:calc(50% - 2.5rem); cursor:pointer; padding:1rem 0 2rem 0;
	color:#ffffff; transition:color .25s;
}
nav.mobile-nav .item.ml-auto{margin-left:auto;}
nav.mobile-nav .item:hover, nav.mobile-nav .item.active{color:#00aeef;}
nav.mobile-nav .item::before{
  content:''; position:absolute; top:0; right:0; width:0; height:.1875rem;
  background:#00aeef; transition:width .25s;
}
nav.mobile-nav .item.active::before{left:0; right:unset; width:100%;}
nav.mobile-nav .item.disabled{
	pointer-events:none!important; color:rgba(255,255,255,.4)!important;
}
nav.mobile-nav + .mobile-nav-spacer{display:none!important; width:100%; height:6.5rem;}

nav.mobile-nav .uploader{
	position:absolute; top:-1.5rem; left:calc(50% - 2.5rem); padding:.5rem;
	background:hsl(233,10%,10%); border-radius:1000em;
}
nav.mobile-nav .uploader .MuiButtonBase-root{
	display:flex; align-items:center; justify-content:center; padding:0;
	min-width:0; width:4rem; height:4rem; border-radius:1000em;
}
.mobile-uploader-backdrop{
	position:fixed; display:none!important;
	bottom:calc(1.5rem - 1px); left:calc(50% - 2.5rem - 1px);
	background:#ffffff; box-shadow:rgba(0,0,0,.06) 0px -3px 8px;
	width:calc(5rem + 2px); height:calc(5rem + 2px); border-radius:1000em;
}

@media screen and (max-width:991.98px){
  nav.mobile-nav{display:block!important;}
  nav.mobile-nav + .mobile-nav-spacer{display:block!important;}
	.mobile-uploader-backdrop{display:block!important;}
}


/* Global Search */
.global-search{display:block; width:100%;}
.global-search .search-header{
  display:flex; align-items:center; width:100%; height:4.5rem; padding:0; overflow:hidden;
}
.global-search .search-header > .container{position:relative;}
.global-search .search-body{
	display:block; width:100%; max-height:calc(100dvh - 16rem);
	overflow-x:hidden; overflow-y:auto;
}
.global-search .search-footer{
  display:flex; align-items:center; width:100%; overflow:hidden; padding:.25rem 0;
}

.global-search .search-box{display:flex; align-items:center; width:100%;}
.global-search .search-box .icon{display:flex; align-items:center; margin:0 1rem 0 0;}
.global-search .search-box .icon svg{font-size:2rem;}
.global-search .search-box input[type=text]{
  display:block; width:100%; padding:0; margin:0 .75rem 0 0; border:none;
  font-size:1.375rem; font-weight:500; line-height:3rem; box-shadow:none; 
}
.global-search .info-wrapper{width:100%; padding:1rem 0 1.75rem 0;}

.global-search .results{display:block; width:100%;}
.global-search .result{display:block; width:100%;}

@media screen and (max-width:991.98px){
  .global-search .search-header{height:4rem;}
  .global-search .search-body{
		height:calc(100dvh - 4rem - 2px); max-height:calc(100dvh - 4rem - 2px);
		overflow-x:hidden; overflow-y:auto;
	}
  .global-search .search-box .icon svg{font-size:1.75rem;}
  .global-search .search-box input[type=text]{font-size:1.25rem;}
  .global-search .info-wrapper{padding:2.5rem 0 0 0;}
}
@media screen and (max-width:767.98px){
  .global-search .search-box .icon{margin:0 .75rem 0 0;}
  .global-search .search-box .icon svg{font-size:1.625rem;}
  .global-search .search-box input[type=text]{font-size:1.125rem;}
}


/* Global Loader */
.global-loader{
	position:fixed; top:0; left:0; width:100%; height:100dvh; z-index:1400;
	display:flex; align-items:center; justify-content:center; pointer-events:none;
	opacity:0; background:rgba(0,0,0,.4); transition:opacity .25s;
}
.global-loader.active{opacity:1; pointer-events:auto;}
.global-loader .loader-wrapper, .global-loader-wrapper{
	display:flex; align-items:center; justify-content:center; width:12rem; height:12rem;
	background:#ffffff; border-radius:50%; border:.75rem solid #bb1d3f; color:#bb1d3f;
	font-size:1.1875rem; font-weight:900; line-height:1; padding:.25rem 0 0 0;
}
.global-loader .arrow, .global-loader-wrapper .arrow{
	position:relative; display:flex; font-size:1.375rem; font-weight:900;
	margin:0 0 .125rem 0;
}
.global-loader .arrow::before, .global-loader .arrow::after,
.global-loader-wrapper .arrow::before, .global-loader-wrapper .arrow::after{
	content:'‹'; font-size:1.375rem; font-weight:900; margin:0;
}
.global-loader .arrow.next, .global-loader-wrapper .arrow.next{transform:scaleX(-1);}
.global-loader .text, .global-loader-wrapper .text{animation:loaderText 1s infinite;}
@keyframes loaderText {
	0%{margin:0 .25rem;} 50%{margin:0 .5rem;} 100%{margin:0 .25rem;}
}

/* Page Loader */
.page-loader{
	position:fixed; top:0; left:0; width:100%; height:100dvh; z-index:1500;
	display:flex; align-items:center; justify-content:center; pointer-events:all;
}