.noticejs-top {
	top: 0;
	width: 100%
}

.noticejs-top .item {
	border-radius: 0!important;
	margin: 0!important
}

.noticejs-topRight {
	top: 10px;
	right: 10px
}

.noticejs-topLeft {
	top: 10px;
	left: 10px
}

.noticejs-topCenter {
	top: 10px;
	left: 50%;
	transform: translate(-50%)
}

.noticejs-middleLeft,.noticejs-middleRight {
	right: 10px;
	top: 50%;
	transform: translateY(-50%)
}

.noticejs-middleLeft {
	left: 10px
}

.noticejs-middleCenter {
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%)
}

.noticejs-bottom {
	bottom: 0;
	width: 100%
}

.noticejs-bottom .item {
	border-radius: 0!important;
	margin: 0!important
}

.noticejs-bottomRight {
	bottom: 10px;
	right: 10px
}

.noticejs-bottomLeft {
	bottom: 10px;
	left: 10px
}

.noticejs-bottomCenter {
	bottom: 10px;
	left: 50%;
	transform: translate(-50%)
}

.noticejs {
	font-family: Helvetica Neue,Helvetica,Arial,sans-serif
}

.noticejs .item {
	margin: 0 0 10px;
	border-radius: 3px;
	overflow: hidden
}

.noticejs .item .close {
	float: right;
	font-size: 18px;
	font-weight: 700;
	line-height: 1;
	color: #fff;
	text-shadow: 0 1px 0 #fff;
	opacity: 1;
	margin-right: 7px
}

.noticejs .item .close:hover {
	opacity: .5;
	color: #000
}

.noticejs .item a {
	color: #fff;
	border-bottom: 1px dashed #fff
}

.noticejs .item a,.noticejs .item a:hover {
	text-decoration: none
}

.noticejs .success {
	background-color: #003C78
}

.noticejs .success .noticejs-heading {
	background-color: #e6e6e6;
	color: #fff;
	padding: 10px
}

.noticejs .success .noticejs-body {
	color: #fff;
	padding: 10px
}

.noticejs .success .noticejs-body:hover {
	visibility: visible!important
}

.noticejs .success .noticejs-content {
	visibility: visible
}

.noticejs .info {
	background-color: #3ea2ff
}

.noticejs .info .noticejs-heading {
	background-color: #067cea;
	color: #fff;
	padding: 10px
}

.noticejs .info .noticejs-body {
	color: #fff;
	padding: 10px
}

.noticejs .info .noticejs-body:hover {
	visibility: visible!important
}

.noticejs .info .noticejs-content {
	visibility: visible
}

.noticejs .warning {
	background-color: #ff7f48
}

.noticejs .warning .noticejs-heading {
	background-color: #f44e06;
	color: #fff;
	padding: 10px
}

.noticejs .warning .noticejs-body {
	color: #fff;
	padding: 10px
}

.noticejs .warning .noticejs-body:hover {
	visibility: visible!important
}

.noticejs .warning .noticejs-content {
	visibility: visible
}

.noticejs .error {
	background-color: #e74c3c
}

.noticejs .error .noticejs-heading {
	background-color: #ba2c1d;
	color: #fff;
	padding: 10px
}

.noticejs .error .noticejs-body {
	color: #fff;
	padding: 10px
}

.noticejs .error .noticejs-body:hover {
	visibility: visible!important
}

.noticejs .error .noticejs-content {
	visibility: visible
}

.noticejs .progressbar {
	width: 100%
}

.noticejs .progressbar .bar {
	width: 1%;
	height: 30px;
	background-color: #4caf50
}

.noticejs .success .noticejs-progressbar {
	width: 100%;
	background-color: #003C78;
	margin-top: -1px
}

.noticejs .success .noticejs-progressbar .noticejs-bar {
	width: 100%;
	height: 5px;
	background: #e6e6e6;
}

.noticejs .info .noticejs-progressbar {
	width: 100%;
	background-color: #3ea2ff;
	margin-top: -1px
}

.noticejs .info .noticejs-progressbar .noticejs-bar {
	width: 100%;
	height: 5px;
	background: #067cea
}

.noticejs .warning .noticejs-progressbar {
	width: 100%;
	background-color: #ff7f48;
	margin-top: -1px
}

.noticejs .warning .noticejs-progressbar .noticejs-bar {
	width: 100%;
	height: 5px;
	background: #f44e06
}

.noticejs .error .noticejs-progressbar {
	width: 100%;
	background-color: #e74c3c;
	margin-top: -1px
}

.noticejs .error .noticejs-progressbar .noticejs-bar {
	width: 100%;
	height: 5px;
	background: #ba2c1d
}

@keyframes noticejs-fadeOut {
	0% {
		opacity: 1
	}

	to {
		opacity: 0
	}
}

.noticejs-fadeOut {
	animation-name: noticejs-fadeOut
}

@keyframes noticejs-modal-in {
	to {
		opacity: .3
	}
}

@keyframes noticejs-modal-out {
	to {
		opacity: 0
	}
}

.noticejs {
	position: fixed;
	z-index: 10050;
	width: 320px
}

.noticejs ::-webkit-scrollbar {
	width: 8px
}

.noticejs ::-webkit-scrollbar-button {
	width: 8px;
	height: 5px
}

.noticejs ::-webkit-scrollbar-track {
	border-radius: 10px
}

.noticejs ::-webkit-scrollbar-thumb {
	background: hsla(0,0%,100%,.5);
	border-radius: 10px
}

.noticejs ::-webkit-scrollbar-thumb:hover {
	background: #fff
}

.noticejs-modal {
	position: fixed;
	width: 100%;
	height: 100%;
	background-color: #000;
	z-index: 10000;
	opacity: .3;
	left: 0;
	top: 0
}

.noticejs-modal-open {
	opacity: 0;
	animation: noticejs-modal-in .3s ease-out
}

.noticejs-modal-close {
	animation: noticejs-modal-out .3s ease-out;
	animation-fill-mode: forwards
}