body			{ background-image: url("/vue/images/fond.png"); background-repeat: repeat-x; background-attachment:fixed;}
.alertError		{ display: none;}
.alert-danger	{ background: darkred; color: red; border:red;}
.jumbotron		{ background-color: rgba(25, 70, 109, 0.7); color: #ffffff;}
.clearfix 		{ overflow: auto; zoom: 1;}
.inDev 			{ padding: 5em 0; text-align: center;}
.inDev>span 		{font-size: 30px; vertical-align:middle;}
h2				{ background: #ffffff; color: #214F75; font-style: italic; border: 5px solid #214F75;
				border-radius: 50px; text-align: center; padding: 0.5em; text-shadow: 2px 2px 4px #000000;}
				
/*-----------------------------------------------------------------------------*/
/* Le switcher */
/*
#select
{
background-color: #519FC8;
color: #fff;
}
#switcher
{
float: left;
margin-top: 5px;
}

#switcher a:link
{
text-decoration: none;
}

#switcher img
{
border-style: none;
}
*/


/*-----------------------------------------------------------------------------*/
/* Le barre d'utilisateur */
/*.userBar		{ float: right; width: 140px; background: #35537a; border-radius: 100px; font-size: 2em; text-align: right; padding: 0 0.3em;}*/
.userBar		{ position: fixed; top: 10px; right: 10px; /*width: 140px;*/ background: #35537a; border-radius: 100px; font-size: 2em; text-align: right; padding: 0 0.3em; z-index: 100;}
.userBar img		{ position: relative; /*top: -2px;*/ left: -10px; width: 50px; height: 50px; border-radius: 100px;}
.userBar a 		{ position: relative; top: 5px; color: #ffffff;}
.userBar a:hover { color: #779ac5; text-decoration: none;}
.userBar .logout { color: darkred;}
.userBar .logout:hover { color: red;}

.activNotif		{ position: fixed; width: 100%; top: 60px; left: 0; display: none; z-index: 1000;}
.activNotif a	{ width: 100%; background: #dedcc1; padding: 2em; word-spacing: -10px;}
.activNotif a:hover			{ background: #bcb99e; text-decoration: none;}
.activNotif a:nth-child(2)	{ width: 100%; background: #dec1bd; padding: 2em; word-spacing: -10px;}


/*-----------------------------------------------------------------------------*/
/* Le logo */

.logo { text-align: center;}


/*-----------------------------------------------------------------------------*/
/* Le corps de la page */
.page 				{ width: 1000px; margin: 100px auto;}
/* Menu du site */
.onglets			{ display:inline-block; width: 110px; height: auto; vertical-align: top;}
.onglet a			{ width: 100px; height: 100px; background: #174a75; color: #ffffff; font-size:2em; text-align: center; line-height: 100px; margin: 0 10px 10px 0; text-decoration: none; border: 1px solid #0c284d;}
.onglet a:hover 		{ background: #113859; color: #ffffff;}
.activeOnglet a		{ background: #ffffff; color: #113859;}
/* Sous-menu */
.ongletsLvl2		{ display:inline-block; width: 60px; height: auto; vertical-align: top;}
.ongletLvl2 a		{ width: 50px; height: 50px; background: #174a75; color: #ffffff; font-size:2em; text-align: center; line-height: 50px; margin: 0 10px 10px 0; text-decoration: none; border: 1px solid #0c284d;}
.ongletLvl2 a:hover 	{ background: #113859; color: #ffffff;}
.activeOngletLvl2 a	{ background: #ffffff; color: #113859;}
.irlLvl2			{ display: none;}

/* Menu pour l'inscription */
.ongletGames img		{ width: 100px; height: 100px; background: #174a75; color: #ffffff; font-size:2em; text-align: center; line-height: 100px; margin: 0 10px 10px 0; text-decoration: none; border: 1px solid #0c284d;}
.ongletGames img:hover { background: #113859; color: #ffffff;}


.ongletContainer	{ display:inline-block; width: 830px; height: auto;}
.topContainer	{ width: 100%; height: 50px; border-radius: 20px 20px 0 0; margin: auto; /*border-left: 1px solid rgba(153,191,232,0.3);*/
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#99bfe8+0,4b779e+11,154d77+44,182f56+100 */
background: rgb(153,191,232); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(153,191,232,0.3) 0%, rgba(75,119,158,0.3) 11%, rgba(21,77,119,0.3) 44%, rgba(24,47,86,0.3) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(153,191,232,0.3) 0%,rgba(75,119,158,0.3) 11%,rgba(21,77,119,0.3) 44%,rgba(24,47,86,0.3) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(153,191,232,0.3) 0%,rgba(75,119,158,0.3) 11%,rgba(21,77,119,0.3) 44%,rgba(24,47,86,0.3) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#99bfe8', endColorstr='#182f56',GradientType=0 ); /* IE6-9 */
}
.middleContainer	{  width: 100%; height: auto; margin: auto; background: rgba(24,47,86,0.3); color: #ffffff; padding: 1em; /*border-left: 1px solid rgba(153,191,232,0.3);*/}
.bottomContainer	{ width: 100%; height: 50px; border-radius: 0 0 20px 20px; margin: auto; /*border-left: 1px solid rgba(153,191,232,0.3);*/
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#182f56+0,154d77+56,4b779e+89,99bfe8+100 */
background: rgb(24,47,86); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(24,47,86,0.3) 0%, rgba(21,77,119,0.3) 56%, rgba(75,119,158,0.3) 89%, rgba(153,191,232,0.3) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(24,47,86,0.3) 0%,rgba(21,77,119,0.3) 56%,rgba(75,119,158,0.3) 89%,rgba(153,191,232,0.3) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(24,47,86,0.3) 0%,rgba(21,77,119,0.3) 56%,rgba(75,119,158,0.3) 89%,rgba(153,191,232,0.3) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#182f56', endColorstr='#99bfe8',GradientType=0 ); /* IE6-9 */
}

/* Event */
.formFacebook		{ text-align: center;}
.formFacebook textarea { display: none;}
.formFacebook button	{ display: block; margin: 1em auto;}
.postEvent 			{ margin: 0 0 6em;}
.postEvent figure		{ text-align: center; margin: 3em;}
.postEvent .bold		{ font-weight: bold; font-style: italic;}
.postEvent .left		{ float: left;}
.postEvent .right	{ float: right;}

/* Photos */
.badgePhotos 		{ text-align: center;}
.pictureId2			{ width: 100%;}
.modal-body img		{ width: 100%;}


/* Page paramètres */
.avatar 			{ margin-bottom: 2em;}
.avatar img 		{ width: 90%; height: auto;}


/*-----------------------------------------------------------------------------*/
/*login&mdp et inscription*/
.login			{ font-family: Comic Sans MS, "Times New Roman", Times, serif; font-size: medium; color: #fff;}
.forgetPassword 	{ text-align: center;}
.forgetPassword a:hover { color: #ffffff; text-decoration: none;}
.blockSubscribe 	{ margin: 3em 0; padding: 4em 0 4em 2em; border-top: 0; border-left: 1px solid #ffffff;}
.alerte			{ color: #c53c3c;}
.formSubscribeResponsive 	{ display: none;}
.validform
{
/*width: 160px;
padding: 6px ;
background-image: url("/vue/images/menus2.png");
background-repeat: no-repeat;
background-color:transparent;
border:none;
color: #fff;*/
 border: 3px solid #aac1d0;
   background: #1f4865;
   background: -webkit-gradient(linear, left top, left bottom, from(#4394c3), to(#1f4865));
   background: -webkit-linear-gradient(top, #4394c3, #1f4865);
   background: -moz-linear-gradient(top, #4394c3, #1f4865);
   background: -ms-linear-gradient(top, #4394c3, #1f4865);
   background: -o-linear-gradient(top, #4394c3, #1f4865);
   background-image: -ms-linear-gradient(top, #4394c3 0%, #1f4865 100%);
   -webkit-border-radius: 30px;
   -moz-border-radius: 30px;
   border-radius: 30px;
   -webkit-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
   -moz-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
   box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
   text-shadow: #000000 0 1px 0;
   color: #ffffff;
   font-family: helvetica, serif;
   padding: 8.5px 18px;
   font-size: 14px;
   text-decoration: none;
   vertical-align: middle;
}
.validform:hover	{ color: #adadad;}
.validformFull 		{ width: 100%;}
.deleteform
{
/*width: 160px;
padding: 6px ;
background-image: url("/vue/images/menus2.png");
background-repeat: no-repeat;
background-color:transparent;
border:none;
color: #fff;*/
 border: 3px solid #aac1d0;
   background: #961414;
   background: -webkit-gradient(linear, left top, left bottom, from(#ce8f8f), to(#961414));
   background: -webkit-linear-gradient(top, #ce8f8f, #961414);
   background: -moz-linear-gradient(top, #ce8f8f, #961414);
   background: -ms-linear-gradient(top, #ce8f8f, #961414);
   background: -o-linear-gradient(top, #ce8f8f, #961414);
   background-image: -ms-linear-gradient(top, #ce8f8f 0%, #961414 100%);
   -webkit-border-radius: 30px;
   -moz-border-radius: 30px;
   border-radius: 30px;
   -webkit-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
   -moz-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
   box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
   text-shadow: #000000 0 1px 0;
   color: #ffffff;
   font-family: helvetica, serif;
   padding: 8.5px 18px;
   font-size: 14px;
   text-decoration: none;
   vertical-align: middle;
}
.deleteform:hover	{ color: #adadad;}

.txtpass			{border: 3px solid #aac1d0; background: #1f4865; border-radius: 15px; color: #adadad; padding: 5px 10px; margin-bottom:20px;
					-webkit-box-shadow: rgba(255,255,255,0.4) 0 0px 0, inset rgba(000,000,000,0.7) 0 1px 1px;
					-moz-box-shadow: rgba(255,255,255,0.4) 0 0px 0, inset rgba(000,000,000,0.7) 0 1px 1px;
				   box-shadow: rgba(255,255,255,0.4) 0 0px 0, inset rgba(000,000,000,0.7) 0 1px 1px;}
					   
				   
/*-----------------------------------------------------------------------------*/
/* Chat MMO2D */
.pad				{ width: 100px; height: 100px; position: relative; top: 470px; left: 10px;}
.pad #up				{ display: block; text-align: center;}
.pad #down			{ position: absolute; top:85%; left: 42%; }
.pad #left			{ position: absolute; top:42%; left: 0; }
.pad #right			{ position: absolute; top:42%; left: 85%; }
				   
/*-----------------------------------------------------------------------------*/
/* Banque de guilde */	
.BDG 				{ position: relative; top: -50px; width: 780px; height: auto; margin: auto; cursor: url("/vue/images/cursorMetin.png"), pointer;}
.logoBDG			{ position: relative; top: 55px; width: 200px; height: auto; margin: auto;}
.logoBDG img			{ width: 100%; height: auto;}
.hautBDG 			{ width: 100%; height: 32px;}
.hautGaucheBDG		{ float: left; width: 32px; height: 32px; background-image: url("/vue/images/hautGaucheBDG.png"); background-repeat: no-repeat;}
.hautMillieuBDG		{ display: inline-block; width: 716px; height: 32px; background-image: url("/vue/images/hautMillieuBDG.png"); background-repeat: repeat-x;}
.hautDroiteBDG		{ float: right; width: 32px; height: 32px; background-image: url("/vue/images/hautDroiteBDG.png"); background-repeat: no-repeat;}

.millieuBDG 			{ width: 100%; height: 32px;}
.recipeBDG			{ position: relative;}
.bordureGaucheBDG	{ float: left; width: 6px; height: 32px; background-image: url("/vue/images/bordureGaucheBDG.png"); background-repeat: no-repeat;}
.caseBDG			{ display: inline-block; width: 768px; height: 32px; background-image: url("/vue/images/caseBDG.png"); background-repeat: repeat-x;}
.bordureDroiteBDG	{ float: right; width: 6px; height: 32px; background-image: url("/vue/images/bordureDroiteBDG.png"); background-repeat: no-repeat;}

.basBDG 				{ width: 100%; height: 8px;}
.basGaucheBDG		{ float: left; width: 36px; height: 8px; background-image: url("/vue/images/basGaucheBDG.png"); background-repeat: no-repeat;}
.basMillieuBDG		{ display: inline-block; width: 708px; height: 8px; background-image: url("/vue/images/basMillieuBDG.png"); background-repeat: repeat-x; vertical-align: top;}
.basDroiteBDG		{ float: right; width: 36px; height: 8px; background-image: url("/vue/images/basDroiteBDG.png"); background-repeat: no-repeat;}

.itemBDG			{ position: absolute;}
.dataIrlToChange 	{ display: none;}
/* Infobule metin */
a.info 				{ position:relative; text-decoration: none; }
a:hover.info 		{ text-decoration: underline; background: none;}
a.info > span 			{ display: none;}
a:hover.info > span 	{ display: inline; position: absolute; top:2em; left:0.5em; z-index: 20; color: #fff; border:1px solid #666; width:150px;
					text-align:center; font-weight:normal; font-size: 10px; line-height:12px; padding:2px 4px;
					border-style: solid; border-width: 14px 17px 14px 15px; -moz-border-image: url(/vue/images/fondstuffmetin.png) 14 17 14 15 repeat; 
					-webkit-border-image: url(/vue/images/fondstuffmetin.png) 14 17 14 15 repeat; -o-border-image: url(/vue/images/fondstuffmetin.png) 14 17 14 15 repeat; 
					border-image: url(/vue/images/fondstuffmetin.png) 14 17 14 15 fill repeat;}
.nameObject			{ color: #cbba2c; font-weight: bold; margin-bottom: 2em; }
.quantity			{ position: relative; top: -20px; left: 18px; background-color: #000000; font-size: 0.65em; }
				   

/*-----------------------------------------------------------------------------*/
/* Le tableau de bord */				   
/* .pic-container 		{ float: left; width: 30%; height: 500px; overflow-x: hidden; overflow-y: scroll;} */
.pic-container 		{ width: 100%; height: 200px; overflow-x: hidden; overflow-y: scroll;}
.tabDashboard		{ margin: 1em;}
.createDashboard	{ margin: 2em 0;}
.dataDashboard		{ display: inline-block; width: 50%; vertical-align: top; padding: 0 1em;}
.dataDashboard100	{ width: 100%; padding: 1em;}
.table-striped > tbody > tr:nth-of-type(2n+1) { background-color: #262e42;}
.tableDashboardMember th,
.tableDashboardMember td	{ width: 33%;}
.tableDashboardMember td a{ color: #ffffff; padding: 1em 100% 1em 0;}
.tableDashboardMember td a:hover{ text-decoration: none; color: #80d1fe}
.icodashboard 		{ font-size: 1.8em; text-decoration: none; background: none; border: 0; padding: 2px;}
.icodashboard:hover	{ text-decoration: none;}
.glyphicon-remove-circle 		{ color: #e06a6a;}
.glyphicon-remove-circle:hover 	{ color: #ab1616;}
.avatarDashboard	{ width: 50px; height: 50px; border-radius: 100px;}
.badgeGroup			{ position: relative; display: inline-block; width: 79px; height: auto; text-align: center; margin: 1em 0}
.positionBadge		{ position: relative; left: -15px; top: 10px;}
.positionBadgePlus	{ position: absolute; top: 5px; left: 40px; color: #31c94e; text-decoration: none;}
.positionBadgePlus:hover 	{ color: #3e924e; text-decoration: none;}
.positionBadgeMinus	{ position: absolute; top: 5px; left: 0px; color: #e06a6a; text-decoration: none;}
.positionBadgeMinus:hover 	{ color: #ab1616; text-decoration: none;}
.modal-dialog 		{ color: #000000;}
.addBadge			{ margin: 2em;}
/* .addBadge select		{ display: inline-block; width: 60%;} */
/* .addBadge button		{ width: 30%;} */

/*-----------------------------------------------------------------------------*/
/* Le pied de page */

.footer 					{ /*position: fixed;*/ width: 100%; height: 70px; bottom: 0; text-align: center; color: #ffffff; background-image: url("../images/fond_pied.png"); background-repeat: repeat-x;}
.textepiedpage a			{ color: #779ac5;}
.textepiedpage a:hover	{ color: #ffffff; text-decoration: none;}
.navigateur				{ position: absolute; /*top: -10px;*/ left: 10px; font-size: 10px; /*color: white;*/}
.navigateur a			{ text-decoration: none;}
/*.logonavi				{ height :20px; margin-top: 5px;}*/
a.firefox				{ background-image: url(../images/logofirefox.png); background-repeat: no-repeat; position: absolute; bottom: 1px; left: 10px; height: 20px; width: 20px; }
/*a.chrome				{ background-image: url(../images/logochrome.png); background-repeat: no-repeat;position: fixed; bottom: 35px; left: 35px; height: 20px; width: 20px; }
a.ie					{ background-image: url(../images/logoie.png); background-repeat: no-repeat;position: fixed; bottom: 35px; left: 60px; height: 20px; width: 20px; }*/
a.android				{ background-image: url(../images/logoandroid.png); background-repeat: no-repeat; position: absolute; bottom: -20px; left: 10px; height: 20px; width: 20px; }
/*a.ios					{ background-image: url(../images/logoios.png); background-repeat: no-repeat;position: fixed; bottom: 10px; left: 35px; height: 20px; width: 20px; }*/

/*.validw3c				{position: absolute;top: -10px;right: 30px;font-size: 10px;color: white;}*/
.validw3c				{/*position: relative;*/ bottom: 10px; right: 30px; font-size: 10px; color: white;}
.validw3c a				{color: white;}
a.imgvalidw3c			{background-image: url(../images/valid-w3c-blue.png);background-repeat: no-repeat;position: fixed; bottom: 20px; right: 20px;height: 31px; width: 88px; }


/*-----------------------------------------------------------------------------*/
/* Responsive */
@media screen and (max-width: 1100px) {
	.page,
	.txtpass,
	.validform,
	.dataDashboard,
	figure img				{ width: 100%;}
	.inDev>span 			{font-size: 20px; vertical-align:middle;}
	.onglets 			{ display: block; width: 100%; text-align: center;}
	.onglets>div 			{ display: inline-block;}
	.onglet a			{ width: 50px; height: 50px; line-height: 50px;}
	.ongletsLvl2		{ display:block; width: 100%; text-align: center;}
	.ongletsLvl2>div>div 	{ display: inline-block;}
	.ongletLvl2 a		{ width: 50px; height: 50px; line-height: 50px;}
	
	.ongletGames img		{ width: 70px; height: 70px; line-height: 70px;}
	.ongletContainer 	{ display: block; width: 100%; /*margin:0.5em auto;*/}
	.footer 				{ display: none;}
	.blockSubscribe 		{ margin: 3em 0; padding: 4em 0 4em 0; border-top: 1px solid #ffffff; border-left: 0;}
	.formSubscribeResponsive 	{ display: block;}
	.formSubscribe,
	.displayResponsive	{ display: none;}

	/* Banque de guilde */	
	.BDG 				{ position: relative; top: -50px; width: 172px; height: auto; margin: auto;}
	.logoBDG			{ position: relative; top: 51px; width: 172px; height: auto; margin: auto;}
	.logoBDG img			{ width: 100%; height: auto;}
	.hautBDG 			{ width: 100%; height: 32px;}
	.hautGaucheBDG		{ float: left; width: 32px; height: 32px; background-image: url("/vue/images/hautGaucheBDG.png"); background-repeat: no-repeat;}
	.hautMillieuBDG		{ display: inline-block; width: 108px; height: 32px; background-image: url("/vue/images/hautMillieuBDG.png"); background-repeat: repeat-x;}
	.hautDroiteBDG		{ float: right; width: 32px; height: 32px; background-image: url("/vue/images/hautDroiteBDG.png"); background-repeat: no-repeat;}

	.millieuBDG 			{ width: 100%; height: 32px;}
	.bordureGaucheBDG	{ float: left; width: 6px; height: 32px; background-image: url("/vue/images/bordureGaucheBDG.png"); background-repeat: no-repeat;}
	.caseBDG			{ display: inline-block; width: 160px; height: 32px; background-image: url("/vue/images/caseBDG.png"); background-repeat: repeat-x;}
	.bordureDroiteBDG	{ float: right; width: 6px; height: 32px; background-image: url("/vue/images/bordureDroiteBDG.png"); background-repeat: no-repeat;}

	.basBDG 				{ width: 100%; height: 8px;}
	.basGaucheBDG		{ float: left; width: 36px; height: 8px; background-image: url("/vue/images/basGaucheBDG.png"); background-repeat: no-repeat;}
	.basMillieuBDG		{ display: inline-block; width: 100px; height: 8px; background-image: url("/vue/images/basMillieuBDG.png"); background-repeat: repeat-x; vertical-align: top;}
	.basDroiteBDG		{ float: right; width: 36px; height: 8px; background-image: url("/vue/images/basDroiteBDG.png"); background-repeat: no-repeat;}
	
	/* Event Facebook */
	.postEvent figure		{ margin: 0; margin-bottom:	4em;}
}