/* Estilo general del contenedor y sus media query */
[data-notify="container"][class*="alert-pastel-"] {
	background-color : #FFFFEE;
	border-radius    : 0;
	border-width     : 0px;
	box-shadow       : 0px 0px 5px rgba(51, 51, 51, 0.3);
	font-family      : 'Arial', 'Helvetica', sans-serif;
	font-size        : 14px;
	margin-bottom    : 20px;
	padding          : 10px;
	width            : 90%;
}

@media (min-width: 768px) {
	[data-notify="container"][class*="alert-pastel-"] {
		width : 20%;
	}
}

@media (min-width: 992px) {
	[data-notify="container"][class*="alert-pastel-"] {
		width : 30%;
	}
}

/* Colores disponibles para las alertas */
[data-notify="container"].alert-pastel-info {
	border-left : 1em solid #523E7C;
}

[data-notify="container"].alert-pastel-success {
	border-left : 1em solid #8BBE67;
}

[data-notify="container"].alert-pastel-danger {
	border-left : 1em solid #E25C63;
}

[data-notify="container"].alert-pastel-warning {
	border-left : 1em solid #FFAE4F;
}

/* Estilos del ícono */
[data-notify="container"][class*="alert-pastel-"] > [data-notify="icon"] {
	/* Esto es para que esté en la misma línea que el título */
	display      : inline-block;
	font-size    : 1.3em;
	margin-right : .3em;
}

/* Estilos para el título */
[data-notify="container"][class*="alert-pastel-"] > [data-notify="title"] {
	color         : rgb(80, 80, 57);

	/* Esto es para que esté en la misma línea que el ícono */
	display       : inline-block;
	font-weight   : 700;
	margin-bottom : 5px;
}

/* Estílos para el mensaje */
[data-notify="container"][class*="alert-pastel-"] > [data-notify="message"] {
	/* Esto es para que esté en una línea diferente al título */
	display     : block;
	font-weight : 400;
}

/* Estilos para el botón CLOSE */
[data-notify="container"][class*="alert-pastel-"] > [data-notify="dismiss"].close {
	background         : transparent;
	border             : 0;
	color              : #000;
	cursor             : pointer;
	filter             : alpha(opacity=20);
	float              : right;
	font-family        : 'Arial', 'Helvetica', sans-serif;
	font-size          : 2em;
	font-weight        : 600;
	line-height        : 1;
	opacity            : .2;
	padding            : 0;
	text-shadow        : 0 1px 0 #fff;
	-webkit-appearance : none;
}

[data-notify="container"][class*="alert-pastel-"] > [data-notify="dismiss"].close:hover,
[data-notify="container"][class*="alert-pastel-"] > [data-notify="dismiss"].close:focus {
	color           : #000;
	cursor          : pointer;
	filter          : alpha(opacity=50);
	opacity         : .5;
	text-decoration : none;
}

/* Divisor entre el mensaje y los botones de confirmación */
[data-notify="container"][class*="alert-pastel-"] > .notify-divider {
	border        : 1px solid #e4e1e1;
	margin-top    : 1em;
	margin-bottom : .5em;
}

/* Estilos para los botones de confirmación */
[data-notify="container"][class*="alert-pastel-"] > [data-notify="buttons"] {
	float : right
}

[data-notify="container"][class*="alert-pastel-"] > [data-notify="buttons"] > [class*="btn-notify-"] {
	background-image : none;
	border           : 1px solid transparent;
	color            : #fff;
	cursor           : pointer;
	display          : inline-block;
	font-weight      : normal;
	font-size        : 12px;
	padding          : .6em 1.2em;
	margin-left      : .5em;
	text-align       : center;
	vertical-align   : middle;
}

[data-notify="container"][class*="alert-pastel-"] > [data-notify="buttons"] > .btn-notify-accept {
	background-color : #2EB99A;
}

[data-notify="container"][class*="alert-pastel-"] > [data-notify="buttons"] > .btn-notify-cancel {
	background-color : #E25C63;
}

[data-notify="container"][class*="alert-pastel-"] > [data-notify="buttons"] > .btn-notify-accept:focus,
[data-notify="container"][class*="alert-pastel-"] > [data-notify="buttons"] > .btn-notify-accept:active:focus{
	outline        : thin dotted;
	outline        : 5px auto #2EB99A;
	outline-offset : -2px;
}

[data-notify="container"][class*="alert-pastel-"] > [data-notify="buttons"] > .btn-notify-cancel:focus,
[data-notify="container"][class*="alert-pastel-"] > [data-notify="buttons"] > .btn-notify-cancel:active:focus {
	outline        : thin dotted;
	outline        : 5px auto #E25C63;
	outline-offset : -2px;
}

.notify-overlay {
	background-color : rgba(0, 0, 0, .5);
	height           : 100%;
	left             : 0;
	position         : absolute;
	top              : 0;
	width            : 100%;
	z-index          : 1030;
}