.amaran {
	width:300px;
	position: relative;
	margin-bottom: 10px;
	color: #333;
}

.amaran-wrapper {position:fixed;z-index:9999;}
.amaran-wrapper *{box-sizing:border-box;}

.amaran-wrapper.top{top:110px;bottom:auto;}
.amaran-wrapper.bottom{bottom:10px;top:auto;}
.amaran-wrapper.left{left:10px;}
.amaran-wrapper.right{right:10px;left:auto;}
.amaran-wrapper.center{width:50%;height:50%;margin:auto;position:fixed;top:0;left:0;bottom:0;right:0;}


.amaran-close{ position:absolute; top: 0; right: 0; display:block; padding: 8px; cursor: pointer; }
.amaran-close:before{ content:"\e931"; font-weight:700; font-family: 'sdelsol_icon' !important; font-size:18px; }


/* ALERTAS */

.msg_alert_content {
	padding: 20px;
	box-shadow: 0 4px 16px 0 rgba(0,0,0,0.15);
}

.msg_alert_content > .title {
	font-size:20px;
	font-weight:bold;
}

.msg_alert_content > .info {
    padding: 10px 0 5px 0;
    margin-top: 10px;
}
 
.msg_alert_content > .msg {
	font-weight: 300;
	padding-top: 5px;
}

.msg_alert_content > .title:before { 
	font-family: 'sdelsol_icon' !important;
	font-size:20px; 
	padding-right: 10px;
}

/* DEFAULT */
	.amaran.default{ background: #F8F8F9;  }
	.amaran.default .amaran-close { color: #ccc; }
	.amaran.default .amaran-close:hover { color: #999; }
	.amaran.default .msg_alert_content > .info { color: rgba(0, 0, 0, 0.4); border-bottom: 1px dashed rgba(0, 0, 0, 0.2); }


/* SUCCESS */
	.amaran.success{ background: #d9edf7; color: #3a87ad; box-shadow: 0 0 0 1px #bce8f1 inset, 0 0 0 0 transparent; }
	.amaran.success .amaran-close { color: #3a87ad; }
	.amaran.success .amaran-close:hover { color: rgba(255, 255, 255, 0.3); }
	.amaran.success .msg_alert_content > .title:before { content:"\e910";  }
	.amaran.success .msg_alert_content > .info { color: #3a87ad; border-top: 1px dashed #3a87ad; }
	
/* ERROR */
	.amaran.error { background: #f2dede; color: #b94a48; box-shadow: 0 0 0 1px #ebccd1 inset, 0 0 0 0 transparent;}
	.amaran.error .amaran-close { color: #b94a48; }
	.amaran.error .amaran-close:hover { color: rgba(255, 255, 255, 0.3); }
	.amaran.error .msg_alert_content > .title:before { content:"\e901";}
	.amaran.error .msg_alert_content > .info { color: #b94a48; border-top: 1px dashed #b94a48 }

	
/* WARNING */
	.amaran.warning{ background: #fcf8e3; color: #c09853; box-shadow: 0 0 0 1px #faebcc inset, 0 0 0 0 transparent; }
	.amaran.warning .amaran-close { color: #c09853; }
	.amaran.warning .amaran-close:hover { color: #b98f12; }
	.amaran.warning .msg_alert_content > .title:before { content:"\e902"; }
	.amaran.warning .msg_alert_content > .info {color: #c09853;border-top: 1px dashed #c09853;}

	
/* INFO */
	.amaran.info{ background: #ddeef8; color: #0082ca; box-shadow: 0 0 0 1px rgba(0, 130, 202, 0.25) inset, 0 0 0 0 transparent;}
	.amaran.info .amaran-close { color: #91c1dc; }
	.amaran.info .amaran-close:hover { color: #0082ca; }
	.amaran.info .msg_alert_content > .title:before { content:"\e920"; }
	.amaran.info .msg_alert_content > .info { color: rgba(0, 130, 202, 0.5);border-top: 1px dashed rgba(0, 130, 202, 0.3);}



	
	
	
	
/* ALERTA USER */

.msg_user_content {
	box-shadow: 0 4px 16px 0 rgba(0,0,0,0.15);
	display: flex;
	align-items: flex-start;
}

.msg_user_content > .contenido { 
	flex: 3; 
	padding: 15px;
}

.msg_user_content > .contenido > .nombre {
	font-size: 17px;
	font-weight:bold;
}

.msg_user_content > .contenido > .email {
    padding: 5px 0;
    margin-bottom: 5px;
}

.msg_user_content > .contenido > .msg {
	padding-top: 5px;
}

.msg_user_content > .imagen {
	flex: 1;
	padding: 0 5px 2px 0;
	border-radius: 0 0 23px 0;
	max-width: 60px;
	min-width: 60px;
}

.msg_user_content > .imagen > img {width: 100%;border-radius: 0 0 20px 0;}


/* USER */

	.amaran.user { background: #fff;color: #333; }
	.amaran.user .amaran-close { color: #ccc; }
	.amaran.user .amaran-close:hover { color: #999; }
	.amaran.user .msg_user_content > .contenido > .email { color: rgba(0, 0, 0, 0.4); border-bottom: 1px dashed rgba(0, 0, 0, 0.2); }

/* USER STATUS */

/* ONLINE */
	.msg_user_content.online { border-top: 4px solid #4CAF50; }
	.msg_user_content.online > .imagen {background: rgba(76, 175, 80, 0.20);}

/* OFFLINE */
	.msg_user_content.offline { border-top: 4px solid #F44336; }
	.msg_user_content.offline > .imagen { background: rgba(244, 67, 54, 0.2); }

/* WARNING */
	.msg_user_content.warning { border-top: 4px solid #ffc107; }
	.msg_user_content.warning > .imagen { background: rgba(255, 193, 7, 0.22); }

/* INFO */
	.msg_user_content.info { border-top: 4px solid #2196F3; }
	.msg_user_content.info > .imagen { background: rgba(33, 150, 243, 0.2); }