.bloc-notifications{
	width: 100%;
	position: fixed;
	z-index: 50000;
	margin: 0;
	padding: 0;
}
.bloc-notifications.bloc-notifications-top{
	top: 0;
}
.bloc-notifications.bloc-notifications-bottom{
	bottom: 0;
}

.bloc-notifications .notification{
	position: relative;
	width: 940px;
	margin: 0 auto;
	padding: 5px 30px;
}

.bloc-notifications .message_area span.link_ribbon{
	color: #999999;
	text-decoration: underline;
	cursor: pointer;
}
.bloc-notifications .btn-close{
	position: absolute;
	right: 10px;
	top: 10px;
	width: 10px;
	height: 10px;
	cursor: pointer;
}
.info_more_descrption{
	display: none;
	width: 950px;
	height: 300px;
	background: #fff;
	margin: 0 auto;
	padding: 10px;
	background: #fbfbfb;
	overflow: auto;
}

/* Erreur */
.notification.error_bg{
	background-color: #F2DEDE;
	border: 1px solid #EBCCD1;
	color: #B94A48;
}
.notification.error_bg .message_area{ 
}
.notification.error_bg .btn-close{
	background: url('./images/jquery-notification/close.png') 0 0 no-repeat;
}
.notification.error_bg .info_more_descrption{

	-moz-box-shadow: 0 0 5px #b2495b;
	-webkit-box-shadow: 0 0 5px #b2495b;
	box-shadow: 0 0 5px #b2495b;
}

/* Success */
.notification.succ_bg{
	background-color: #DFF0D8;
	border: 1px solid #D6E9C6;
	color: #468847;
}
.notification.succ_bg .message_area{
}
.notification.succ_bg .btn-close{
	background: url('./images/jquery-notification/close.png') 0 0 no-repeat;
}
.notification.succ_bg .info_more_descrption{    
	-moz-box-shadow: 0 0 5px #56a25e;
	-webkit-box-shadow: 0 0 5px #56a25e;
	box-shadow: 0 0 5px #56a25e;
}

/* Info */
.notification.info_bg{
	background-color: #D9D9D9;
	color: #555555;
    height: 15px;
    width: 100%;
    font-family: Arial,sans-serif;
    font-size: 11px;
}

.notification.info_bg p {
    text-align: center;
    line-height: 15px;
    margin-left: -58px;
    margin-top: -8px;
    font-family: Arial,sans-serif;
}

/*
 * ==================================================================
 * =========== MEDIA QUERIES POUR LES APPAREILS MOBILES =============
 * ==================================================================
 */

/** 
 * Iphone : 3GS, 4, 5 
 * Google Nexus S 
 * HTC : Evo, Touch HD, Desire HD, Desire 
 * LG : Optimus 2X, Optimus 3D, Optimus Black
 * Motorola : Defy, Droid, Droid X, Milestone
 * Nokia : Lumia 7X0, Lumia 8XX, Lumia 900, N800, N810, N900
 * Samsung : Galaxy S, SII, W
 * -------------------------------------------------------------------
 * Tous les devices ayant une largeur de 320px 
 */
@media screen and (device-width: 320px) {
    .notification.info_bg{
		height: 60px;
    }

	.notification.info_bg p {
	    width: 300px;
	    margin-left: -20px;
	}
}

/* 
 * BlackBerry Z30
 * Google Nexus 5, 
 * HTC : One X, EVO LTE, Sensation, EVO 3D
 * Nokia : C5, C6, C7, N97, N8, X7 
 * Samsung : Galaxy Note II, Galaxy S3, Galaxy S4, Galaxy Nexus
 * Sony : Xperia S, Xperia Ion, Xperia Z, Xperia Z1
 * -------------------------------------------------------------------
 * Tous les devices ayant une largeur de 360px 
 */
@media screen and (device-width: 360px) {
    .notification.info_bg{
		height: 60px;
    }

	.notification.info_bg p {
	    width: 325px;
	    margin-left: -10px;
	}
}

/*
 * Iphone 6 
 * BlackBerry Z10
 * Google Nexus 4
 * LG Optimus G
 * -------------------------------------------------------------------
 * Tous les devices ayant une largeur comprise entre 375px et 384px 
 */
@media screen and (min-device-width: 375px) and (max-device-width: 384px) {
    .notification.info_bg{
		height: 45px;
    }

	.notification.info_bg p {
		margin-left: -22px;
	    width: 364px;
	}
}

/* 
 * Iphone 6 Plus
 * LG Optimus LTE
 * Optimus 4X HD 
 * -------------------------------------------------------------------
 * Tous les devices ayant une largeur comprise entre 414px et 424px 
 */
@media screen and (min-device-width: 414px) and (max-device-width: 424px)  {
    .notification.info_bg{
		height: 45px;
    }

	.notification.info_bg p {
	    margin-left: 0px;
	    width: 360px;
	}
}

/* 
 * Motorola : Droid 3, Droid 4, Droid Razr
 * Atrix 4G, Atrix 2 
 * -------------------------------------------------------------------
 * Tous les devices ayant une largeur de 540px 
 */
@media screen and (device-width: 540px) {
    .notification.info_bg{
		height: 30px;
    }

	.notification.info_bg p {
	    margin-left: -10px;
	    width: 500px;
	}
}

/* 
 * Motorola Droid Razr HD 
 * -------------------------------------------------------------------
 * Tous les devices ayant une largeur de 720px 
 */
@media screen and (device-width: 720px) {
    .notification.info_bg{
		height: 30px;
    }

	.notification.info_bg p {
	    margin-left: -20px;
	    width: 700px;
	}
}

/* 
 * Samsung Galaxy Note 
 * -------------------------------------------------------------------
 * Tous les devices ayant une largeur de 400px 
 */
@media screen and (device-width: 400px) {
    .notification.info_bg{
		height: 45px;
    }

	.notification.info_bg p {
	    margin-left: -18px;
	    width: 380px;
	}
}

/* 
 * Sony Xperia Sola, U 
 * -------------------------------------------------------------------
 * Tous les devices ayant une largeur de 480px 
 */
@media screen and (device-width: 480px) {
    .notification.info_bg{
		height: 45px;
    }

	.notification.info_bg p {
	    margin-left: -15px;
	    width: 450px;
	}
}

/* 
 * Google Nexus 7, Nexus 7 version 2 
 * -------------------------------------------------------------------
 * Tous les devices ayant une largeur comprise entre 960px et 980px 
 */
@media screen and (min-device-width: 960px) and (max-device-width: 980px) {
    .notification.info_bg{
		height: 30px;
    }

	.notification.info_bg p {
	    margin-left: 15px;
	    width: 900px;
	}
}

/* 
 * Nexus 10
 * Samsung Galaxy : Tab 10.1, Tab 2 10.1, Tab 3 10.1, Tab 7.7, Tab 8.9 
 * Sony : Tablet S, Xperia Tablet Z
 * Motorola : Xoom, Xoom 2
 * ASUS : Transformer Pad TF300T, Transformer TF101, Padfone 
 * Acer : Iconia Tab A100, Iconia Tab A200, Iconia Tab A501
 * -------------------------------------------------------------------
 * Tous les devices ayant une largeur de 800px 
 */
@media screen and (device-width: 800px)  {
    .notification.info_bg{
		height: 30px;
    }

	.notification.info_bg p {
	    margin-left: -15px;
	    width: 780px;
	}
}

/* 
 * Kindle 3
 * Samsung Galaxy : Tab 10.1, Tab 2 7.0, Tab 3 7.0, Tab 3 Kids, Tab 7.0 Plus 
 * BlackBerry PlayBook
 * Nexus 7, Nexus 7 version 2
 * ASUS : Fonepad, B1-A71, MeMo Pad ME172V
 * -------------------------------------------------------------------
 * Tous les devices ayant une largeur comprise entre 600px et 603px 
 */
@media screen and (min-device-width: 600px) and (max-device-width: 603px) {
    .notification.info_bg{
		height: 30px;
    }

	.notification.info_bg p {
	    margin-left: -18px;
	    width: 580px;
	}
}

/* 
 * HP Touchpad
 * Apple : Ipad, Ipad 2, Ipad 3, Ipad Air
 * -------------------------------------------------------------------
 * Tous les devices ayant une largeur de 800px 
 */
@media screen and (device-width: 768px)  {
    .notification.info_bg{
		height: 30px;
    }

	.notification.info_bg p {
	    margin-left: -20px;
	    width: 748px;
	}
}

/*
 * ==================================================================
 * ======================= FIN DES MEDIA QUERIES  ===================
 * ==================================================================
 */

.notification.info_bg p button {
	font-family: Arial,sans-serif;
	cursor: pointer;
}

.notification.info_bg p button:hover {
	background-color:  #999;
}

.notification.info_bg p span {
	font-family: Arial,sans-serif;
	cursor: pointer;
}

.notification.info_bg p span:hover {
	background-color:  #999;
}

.notification.info_bg a{
    text-decoration: underline;
    font-weight: normal;
    color: #555555;
}


/* CSS bouton */
.white-button {
    background: #FFF;
    font-weight: normal;
    color: #3b3b3b;
    border: 1px solid #DDD;
    box-shadow: 0 0 2px #ccc;
    font-family: MV boli,Tahoma;
    margin: 5px;
    padding: 2px 10px 2px 10px;
    font-size: 11px;
}

.positive4:hover {
    background: #2E9AFE;
    box-shadow: inset 2px -7px 11px rgba(80, 92, 51, 0.17);
}

.positive4 :active {
    border-bottom-color: #999;
    box-shadow: inset 0 3px 3px rgba(0, 0, 0, .2) !important;
}

.positive4:active {
    border-bottom-color: #999;
    box-shadow: inset 0 3px 3px rgba(0, 0, 0, .2) !important;
}


.notification.info_bg .message_area{
}
.notification.info_bg .btn-close{
	background: url('./images/jquery-notification/close.png') 0 0 no-repeat;
}

/* Warning */
.notification.warn_bg{
	background-color: #FCF8E3;
	border: 1px solid #FAEBCC;
	color: #C09853;
}
.notification.warn_bg .message_area{
}
.notification.warn_bg .btn-close{
	background: url('./images/jquery-notification/close.png') 0 0 no-repeat;
}