@mixin base-notification($primaryStyleName : v-Notification) {

.#{$primaryStyleName} {
	background: #999;
	color: #fff;
	cursor: pointer;
	overflow: hidden;
	padding: 1em;
	max-width:85%;
	opacity: .9;
	filter: alpha(opacity=90);
}
.#{$primaryStyleName}-caption,
.#{$primaryStyleName}-description,
.#{$primaryStyleName}-details {
	display: inline;
	margin: 0 0.5em 0 0;
}
.#{$primaryStyleName}-warning {
	background: orange;
}
.#{$primaryStyleName}-error {
	background: red;
}
.#{$primaryStyleName}-tray {
	.#{$primaryStyleName}-caption,
	.#{$primaryStyleName}-description {
		display: block;
	}
}
.#{$primaryStyleName}-system {
	background-color: red;
}
.#{$primaryStyleName}-system .#{$primaryStyleName}-caption {
	display: block;
	margin: 0;
}
.#{$primaryStyleName}-animate-out {
	@include animation(v-notification-animate-out 400ms);
}

.#{$primaryStyleName} {
  &.v-position-top {
    top: 0;
  }
  &.v-position-right {
    right: 0;
  }
  &.v-position-bottom {
    bottom: 0;
  }
  &.v-position-left {
    left: 0;
  }
  &.v-position-assistive {
    top: -9999px;
    left: -9999px;
  }
}

}

@include keyframes(v-notification-animate-out) {
  100% {
   opacity: 0;
  }
}