body{
	background: url(/assets/images/background/space-min.webp) no-repeat 50% 50%;
	background-size: cover;
	background-attachment: fixed;
}
body .app-footer{
	min-height: 12px;
}

body .app-header{
	background: rgba(255, 255, 255, 0.2); 
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	
    
}

body .bg-body{
	background-color: rgba(255,255,255,0.1) !important;
	color: #fff;
	border: none !important;
}
body .bg-body .nav-link{
	color: #fff;
}

body .sidebar-brand .brand-link .brand-image{
	max-height: 20px;
}
body aside.app-sidebar{
	background-color: rgba(255,255,255,0.1) !important;
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
}
body .sidebar-brand{
	border: none;
	justify-content: center;
	position: relative;
}
body .sidebar-brand:after{
	content: "";
	width: 80%;
	height: 1px;
	background: rgba(255, 255, 255, 0.08);
	position: absolute;
	bottom: 0;
	left: 10%;
	display: block;
	
}
body aside .sidebar-wrapper{
	padding-left: 16px;
	padding-right: 16px;
}


.left-nav{
	background-color: rgba(255, 255, 255, 0.08);
	border-radius: 10px;
	border: 1px solid rgba(255, 255, 255, 0.15);
}

body .sidebar-menu > .nav-header{
	font-size: 16px;
	font-weight: 600;
}


.header-bar{
	display: flex;
	gap: 24px;
	align-items: flex-end;
}

.start-nav{
	color: #fff;
}


.floating-search{
	background-color: rgba(255, 255, 255, 0.12);
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    color: #fff;
    min-width: 380px;
    height: 36px;
    display: flex;
    align-items: center;
    position: relative;
    padding: 2px 
}

#fast-search-box{
	height: 30px;
	border: none;
	border-radius: 6px;
	background-color: rgba(255, 255, 255, 0.02);
	-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px);
	outline: none;
	color: #fff;
	padding-left: 6px;
	font-weight: 300;
	flex-grow: 1;
}
#fast-search-box::placeholder{
	color: #ffffffaa;
}
#fast-search-box:focus{
	background-color: rgba(255, 255, 255, 0.08);
}

.floating-search>span{
	display: inline-flex;
	width: 32px;
	height: 32px;
	cursor: pointer;
	position: relative;
	background-color: #ffffffaa;
	transition: background-color 0.3s;
}


.fast-search-clear{
    -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23333' d='M7.495 6.505a.7.7 0 1 0-.99.99L11.01 12l-4.505 4.505a.7.7 0 0 0 .99.99L12 12.99l4.504 4.504a.7.7 0 1 0 .99-.99L12.99 12l4.504-4.505a.7.7 0 0 0-.99-.99L12 11.01z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23333' d='M7.495 6.505a.7.7 0 1 0-.99.99L11.01 12l-4.505 4.505a.7.7 0 0 0 .99.99L12 12.99l4.504 4.504a.7.7 0 1 0 .99-.99L12.99 12l4.504-4.505a.7.7 0 0 0-.99-.99L12 11.01z'/%3E%3C/svg%3E");
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: 70%;
}
.fast-search-btn{
	-webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none'%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='M9.022 14.604c1.333 0 2.56-.46 3.527-1.23l3.288 3.288a.583.583 0 0 0 .825-.825l-3.279-3.278a5.671 5.671 0 1 0-4.361 2.046zm0-1.166a4.505 4.505 0 1 0 0-9.01 4.505 4.505 0 0 0 0 9.01' clip-rule='evenodd'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none'%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='M9.022 14.604c1.333 0 2.56-.46 3.527-1.23l3.288 3.288a.583.583 0 0 0 .825-.825l-3.279-3.278a5.671 5.671 0 1 0-4.361 2.046zm0-1.166a4.505 4.505 0 1 0 0-9.01 4.505 4.505 0 0 0 0 9.01' clip-rule='evenodd'/%3E%3C/svg%3E");
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: 70%;
}

.floating-search>span:hover{
	background-color: #fff;
}

.filter-group{
	display: inline-flex;
	height: 28px;
	font-size: 14px;
	font-weight: 200;
	
	background-color: rgba(255, 255, 255, 0.08);
	-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px);
	color: #ffffffba;
	border-radius: 5px;
}

.filter-group>span{
	display: inline-flex;
	height: 100%;
	padding: 0 10px;
	align-items: center;
	white-space: nowrap;
	Xcursor: pointer;
	transition: color 0.3s;
}
.filter-group>span a{
	display: inline-block;
	Xpadding: 3px 0;
}
.filter-group>span.active{
	background-color: #ffffff29;
	color: #fff;
}
.filter-group>span:first-child{
	border-radius: 5px 0 0 5px; 
}
.filter-group>span:last-child{
	border-radius: 0 5px 5px 0;
}
.filter-group:not(.active)>span:hover{
	color: #fff;
}

h3.mb-0{
	color: #fff;
}



.author-name{
	Xpadding-bottom: 5px;
	Xpadding-left: 6px;
	font-size: 13px;
}

.btn-outline-primary{
	background: #ece8fa;
}

.breadcrumb-item, .breadcrumb-item + .breadcrumb-item::before{
	color: #fff;
}
.breadcrumb-item.active{
	color: #ffc4cd;
}

.btn-sm.btn-secondary{
	border-color: #fff;
	background: #8495ee;
}

body .app-footer{
	background: #5738605c;
    color: #fff;
    border: none;
}

.cardpost-data{
	background: transparent;
}
.card-post{
	background: #ffffffb5;
    backdrop-filter: blur(10px);
}

.sidebar-wrapper a{
	color: #e8eaef;
	
}

body .nav-link.active{
	background-color: #ffffff14 !important;
}

.card-post a:before{
	border-radius: 6px;
}

.page-text {
	    background-color: #ffffffd9;
	    border: 1px solid rgba(0, 0, 0, .125);
	    position: relative;
	    backdrop-filter: blur(10px);
	    border: 1px solid rgb(171 151 217);
	    border-radius: 10px;
	}

@media(max-width: 991.98px){
	.sidebar-wrapper{
		background-color: #3f5ab2c2;
	}
	.sidebar-wrapper a{
		color: #fff;
	}
	
	.container, .container-fluid, .container-xl, .container-lg, .container-md, .container-sm{
		padding-left: 1rem;
		padding-right: 1rem;
	}
	.author-name{
		padding-bottom: 5px;
		padding-left: 6px;
		font-size: 13px;
	}
	
	
	
	

	
}












