/***********************************************
Copyright (c) 2007-2024, Wide Web. All Rights Reserved.
https://www.WideWeb.com.au
***********************************************/
#notifications {
	position: fixed;
	top: 30px;
	left: 0px;
	right: 0px;
	margin: 0px auto;
	padding: 0px 20px;
	font-family: sans-serif;

	
	list-style-type: none;

	display: inline-block;
	pointer-events: none;
}
#notifications li {
	position: absolute;
	left: 50%;
	margin: 0px auto;
	padding: 0px;

	width: calc(100% - 50px);
	max-width: 600px;
	
	color: #000000;
	background-color: #FFFFFF;
	border-radius: 10px;
	box-shadow: inset 0px 0px 0px 1px rgba(127,127,127,0.1), 0px 0px 0px 0.5px rgba(0,0,0,0.3), 0px 10px 20px 0px rgba(0,0,0,0.1);

	transition: all 0.4s ease-in-out 0.1s;
	opacity: 1;
	transform: translateX(-50%) scale(1,1);
	transform-origin: top center;


	
	display: block;
	z-index: 9000;
	pointer-events: auto;
}
#notifications li[onclick] {
	cursor: pointer;
}


#notifications li.close {
	background-color: #FFFFFF;
	opacity: 0;
	transform: translateX(-50%) scale(0,0);
	pointer-events: none;
}
#notifications li + li {
	margin-top: 40px;
	background-color: #F8F8F8;
	opacity: 1;
	transform: translateX(-50%) scale(0.9,0.9);
	z-index: 8999;
	pointer-events: none;
}
#notifications li.close + li {
	filter: saturate(100%) brightness(100%) brightness(100%);
	opacity: 1;
}
#notifications li + li + li {
	margin-top: 78px;
	background-color: #EEEEEE;
	opacity: 1;
	transform: translateX(-50%) scale(0.8,0.8);
	z-index: 8998;
	pointer-events: none;
}
#notifications li + li + li + li {
	margin-top: 117px;
	background-color: #CCCCCC;
	opacity: 0;
	transform: translateX(-50%) scale(0.7,0.7);
	z-index: 8997;
	pointer-events: none;
}


#notifications li header {
	margin: 0px 0px 5px 0px;
	padding: 0px 0px;
	box-shadow: 0px 2px 0px -1px rgba(0, 0, 0, 0.3);
}


#notifications li header div {
	margin: 0px 20px;
	padding: 0px 0px;
	font-size: 12px;
	font-weight: bolder;
    color: #555555;
    line-height: 47px;
	text-wrap: nowrap;
    float: right;

}


#notifications li header h3 {
	margin: 0px 0px;
	padding: 10px 20px;

}
#notifications li p {
	margin: 0px 0px;
	padding: 10px 20px 20px 20px;
	text-wrap-style: pretty;
}
#notifications li p strong {
	display: inline-block;
}
#notifications li a {
	margin: 0px 20px 20px 0px;
	padding: 10px 15px;
	font-weight: bolder;
    color: #FFF;
    text-decoration: none;
    background-color: #FF3E00;
    border-radius: 5px;
	display: inline-block;
	transition: all .3s ease-in-out .0s;
	float: right;
	cursor: pointer;
}
#notifications li + li a {
	color: #EEEEEE;
	background-color: #DDDDDD;
}