* {
 /* box-sizing: content-box;*/
}
body{margin-top:50px;margin:0;font: 13px Verdana, Arial, Helvetica, sans-serif;background:#f2f2f2;color:#333} /* anciennement 18 px et background:#2e2a2b */
#page,#topmenu,#bottom-pagetools{background-color:white}
body.admin .post.alerted{background:#FBE3E4;}
/*#body{padding-top:20px}*/

ul{padding-left:0;margin:0}
a{color:#3c8fb0}
 a:hover,input:hover{opacity:.7;transition:.3s}
h1{
	font-size: 15px;
	  margin-bottom: 0px;
font-weight: normal;}

h1::first-letter{ text-transform: capitalize}


body.noscroll,html body.noscroll{overflow:hidden !important;overflow-x:hidden !important}
#page,#footer{overflow-x:hidden;}
#page{width:100%;margin:auto;margin-top:50px}

#sidebar{display:none}

/*#backhomebtn {float:left;font-size:27px;width:43px;color:black;padding:6px 0}*/
#backhomebtn {
float: left;
   
    /* width: 43px; */
    color: black;
    
    border: 1px solid black;
    border-radius: 4px;
    text-align: center;
    margin: 10px 0;
    margin-right: 10px;
    text-decoration: none;
}

#backhomebtn .txt-menu{
display: block;
    font-size: 10px;
    padding: 8px 6px;
}

#backhomebtn .icon-home{display:none}



#logoforum{float:left;width:200px; height: 0;
	text-indent:-9999px;
background: url("../../ui/logo-vlr-forum-200X21.png");
background-repeat: no-repeat;
    
 background-position: center;
  width:200px;
height:21px;
padding:17px 0;
margin-top:-5px}

input[type='submit']{
-webkit-appearance: none;
}


button, input, select, textarea,.btn{

   font-size:16px;
    vertical-align: inherit;	
    padding: 0 5px;
    border: 1px solid lightgrey;
    background-color: white;
    border-radius: 4px;
}







select, input,.btn {	  
    line-height: 30px;
}

select{height:30px}
input[type='text'],input[type='password']{box-sizing:border-box;width:100%;height:40px;text-indent:3px;}

textarea{padding:8px;margin:5px 0}
textarea:focus,input:focus,select:focus{outline:none;/*border:1px solid rgba(28, 154, 204, 0.61);*/box-shadow: inset 0px 0px 0px 3px rgba(28, 154, 204, 0.61);transition:.2s}
.btn{text-decoration:none;color:black;background-color:#f2f2f2;padding:5px 8px;cursor:pointer;
	
    box-sizing: border-box;
    text-align: center;	
	}


.hidden-phonexs{display:none}


.pseudo-avatar,  .av,.mp_hosts .pseudo-avatar, .mp_hosts   .av{float: left;margin-bottom:0;width:34px;height:34px; border-radius: 100px}
.pseudo-avatar div,.mp_hosts .pseudo-avatar div{text-align:center;font-weight:bold;opacity:0.3;font-size:22px;padding-top:8px}
.username{overflow:hidden}
.un{text-transform:capitalize}
.av{background-color:lightgrey; background-image: url("../../ui/default_avatar.gif");}
.pseudo-avatar,  .av{margin-right:20px;cursor:pointer}
.pseudo-avatar, .av, .mp_hosts .pseudo-avatar, .mp_hosts   .av{width:65px;height:65px;}
.pseudo-avatar div,.mp_hosts .pseudo-avatar div{padding-top:22px}
.pseudo-avatar div{font-size:40px}
.post .username{color:#333;font-size:15px;text-transform:capitalize;}
.pseudo-avatar{ float:left;border-radius: 100px;font-size: 14px;line-height: 20px;}
.fa-venus{color:#ff0033}
.fa-mars{color:lightblue}
.vdthumb{margin:10px 0;min-height:110px}





strong.pq{display:block;margin-top:20px}




#bottom-pagetools select{width:60px;height:30px;margin-top:8px}

#bottom-pagetools,#topmenu{position:fixed;height:50px;max-width:1200px;z-index:9999999999999;width:inherit;box-sizing:border-box;}
#topmenu{padding:0 10px}
/*#bottom-pagetools{background:#f2f2f2}*/
#topmenu{top:0;left:0}
#bottom-pagetools{bottom:0;}

#bottom-pagetools .btn,#top_connect{
	/*font-size: 20px;*/
    padding: 10px;
float:right;
   border-radius:0;
 border: none;
width:50px;
height: 50px;
border:none;
}

#top_connect{
    color:white;
    margin-right: -10px;
    background: #4267B2;

}
#top_connect i{font-size:30px;margin-left:-6px;}

@media(min-width:524px){
.hidden-phonexs{display:initial}
#bottom-pagetools .btn,#top_connect{width:auto}	
#top_connect i{margin-left:0}
#top_connect .hidden-phonexs{vertical-align:super}
}


	
	

#topmenu .av, #topmenu  .pseudo-avatar{width:40px;height:40px;margin-top:5px;margin-left:15px;cursor:pointer;position:absolute;top:0}
#topmenu  .pseudo-avatar div{font-size:26px;padding-top:11px}

#bottom-pagetools i{
font-size: 20px;
    line-height: 0px;
}
#bottom-pagetools i.icon-plus{
	margin-left: -6px;
	    font-size: 7px;
	    vertical-align: super;
	  
	    position: absolute;
}
#bottom-pagetools .prevnext i{font-size:inherit}


#topmenu .connect{float:right;}
body.connected #topmenu .connect{width:50px;height:50px}

#topmenu .dropdown-content{top:43px}
#topmenu .dropdown-content i{font-size:inherit}
#topmenu .dropdown-content a{padding:12px 16px;display:block;}

#topmenu .searchbar{display:none}

#hero{text-align:center;margin:0;margin-bottom:0; position:relative;
height:210px;}

/*body.hp #hero{margin-bottom:30px}*/

#hero .bg{
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	bottom:0;
	
background-repeat:no-repeat;
	background-image: url("../../ui/groupe3.jpg");
	background-size: 100% auto;
	
   
	/*opacity:.2;*/

}
#hero .content{padding:40px;

	box-sizing:border-box;
	width:100%;
	height:100%;
	top:0;
	bottom:0;
	z-index:1}
#hero .desc{font-size:12px;text-align: left;
    width: 500px;
    margin: auto;
padding:20px;

text-align:center;


    /* Rotate div */
    -ms-transform: rotate(-3deg); /* IE 9 */
    -webkit-transform: rotate(-3deg); /* Chrome, Safari, Opera */
    transform: rotate(-3deg);

    margin-top: 42px;

}


#hero .desc span{background-color: white;padding:10px}

#hero .join{margin-top:20px}
/*#hero .desc span{background:white}*/


#hero .dismiss{position:absolute;top:5px;right:5px;font-size:10px}

.fblogbig{border-radius:4px;font-size:25px;display:inline-block;padding:8px 16px;vertical-align:middle;color:white;background:#4267B2;cursor:pointer;text-decoration:none}
.fblogbig:visited{color:white;text-decoration:none}
.fblogbig:hover{text-decoration:none;color:white;background:#3B5998}
.fblogbig:active,.fblogbig:focus{text-decoration:none}
	
/* border-bottom: 2px solid #2a8bcc;*/

@media(max-width:500px){
#hero{margin:0;height:170px}

#hero .desc{width:auto;padding:10px;margin-top:54px}
#hero .content{padding:10px}
#hero .join {margin-top: 10px;}
}

#introjsintro{opacity:.6;cursor:pointer}
#introjsintro{padding: 8px 35px 8px 14px;}
#introjsintro:hover{opacity:1}
@media(max-width:320px){
#hero .desc{font-size:9px}


}




.searchbar{position:relative;-webkit-box-sizing: border-box; -moz-box-sizing: border-box;  box-sizing: border-box;padding:0 10px}
.searchbar .searchinput{position:relative;padding-right:30px}
.searchbar i{font-size:32px;}
.searchbar .ctrl i{font-size:inherit}
.searchbar#search_uservd{float:right}
#sidesearch .searchinput{width:100%}

.searchbar .ctrl{
	font-size:22px;
	position: absolute;  

 text-align: center;   
    width: 40px;
    height: 40px;
top: 6px;
}

.topsearch .ctrl:hover{
	cursor:pointer;
}

.searchbar .send{
right: 7px;
}

.searchbar .cancel{
display:none;	
color:rgba(68, 68, 68, 0.31)
}

.searchbar .cancel{
	right: 30px;
}


#sidesearch .searchbar{padding:0}
#sidesearch .searchbar .send{right:-4px}
#sidesearch .searchbar .cancel{right:20px}
#sidesearch .topsearch .cancel{
	right: 70px;
}

#sidesearch .topsearch .ctrl{
top: 26px;
right:50px;
}














/* BREADCRUMB */


#forum_header{padding:20px 10px;text-align:center;margin-bottom:10px;}
#forum_header .bc a{padding:3px 5px;border-radius:4px;font-weight:bold;color:inherit}
#forum_header .bc a:hover{text-decoration:underline}
#forum_header .bc a.ivt{margin-right:10px}
#forum_header .bc {font-size:13px}
#forum_header .bc li{display:inline;bullet-style:none}



.row{clear:both}




/* Topic list */





#posts-order{width:180px;margin-left:10px}
option .expl{color:rgba(68, 68, 68, 0.31);}

body.newtopic_forum_choose #menu-forums{width:300px;margin:auto}
#menu-forums{margin:0}
#menu-forums li{	list-style:none;display:block;}
/*ul#cats{margin-left:30px}*/
#menu-forums a{color:#667d99;text-decoration:none;padding:3px}
#menu-forums a:hover{color:black}
#menu-forums ul#cats li.cat{margin-bottom:20px}

#bodywrap{padding:10px;margin-bottom:200px}


#menu-forums .ficon{height:16px;width:16px;display:inline-block;vertical-align:middle;margin-right:10px;border-radius:4px}


#sb-toplinks a{display:block;padding:6px 0;text-decoration:none}

#menu-forums ul#cats li.cat.active a.cat-link{font-weight:bold;}
#menu-forums ul#subforums li.active a{font-weight:bold}
#menu-forums ul#subforums  li.divider{width:70%;height:1px;margin:10px 0; border-top:1px solid #eee}
#menu-forums ul#cats li#cat-600:not(.active) a{font-weight:bold}
#subforums{margin-left:26px!important}
#subforums li{margin-top:10px}
#menu-deactivated-forums{
	opacity:.3;
	margin-top:60px;
	margin-left:20px;
}
#menu-deactivated-forums a{text-decoration:none}








/*.forum #sidebar,.topic #sidebar,#slider{padding-top:10px}*/
body.hp #sidebar{padding-top:60px}

#sidebar .content-block,#slider .content-block  {
   margin-bottom:30px;
}



#slider{background-color:white;padding:20px; }
#slidercontent{margin:50px 0;overflow-y:scroll;z-index:99999999 !important}


/* Dropdown Button */
.dd {
  position:absolute;right:10px;
}




/* Dropdown Content (Hidden by Default) */
.dropdown-content {

  display: none;
    position: absolute;
right:0;
top:0;
 z-index: 1;	
}

.dropdown-content h4{margin:10px 20px}

.dropdown-content .content{
		border-radius:4px;
	
	    background-color: white;
	    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
		text-align:right !important;
	   
	
}

/* Links inside the dropdown */
.dropdown-content a {
   
    padding: 12px 16px;
    text-decoration: none;
    display: block;
	white-space: nowrap; 
	
}

/* Show the dropdown menu on hover */
.dd:hover .dropdown-content {
    display: block;

}
.dd:hover{
opacity:1;
}



#bottom_pagination ul.pagination{display:none}




#bottom_pagination ul{

text-align:center;
height:50px;
padding-top:2px;
	
}
#bottom_pagination li{display:inline-block;;position:relative;vertical-align:bottom}





	#bottom-pagetools .prevnext a{font-size: 30px;
		padding:5px;
		color:#666;
		background: none !important;
	}










.usermenu-block{display:inline;margin-right:40px}



#message-wrapper{position:relative}


/* SUPER SIMPLE POP OVER */
#sspo-bg{display:none;position:fixed;width:100%;height:100%;top:0;bottom:0;left:0;right:0;background:black;opacity:.5;}
#sspo{display:none;position:fixed;z-index:10000000001;top:0;left:0;bottom:0;right:0}
#sspo-content{box-sizing:border-box;position:relative;width:100%;height:100%;/*background:white;padding:20px;border-radius:4px*/}
#sspo-close{display:none;position:absolute;top:0;right:0;font-size:20px}
#sspo-content .row,#sspo-content .span*#sspo-content .offset* {width:100% !important;margin-left:0 !important}

#sspo input{margin-bottom:10px}

.slide-reveal-overlay{opacity:0}






/* Helpers and elements styles */

.shaded{box-shadow: 0px 4px 4px 4px rgba(0,0,0,0.2);}

#sysmsg {border-radius:4px;padding:10px;width:50%;margin:100px auto;border:2px solid #ebebeb}
#sysmsg form{margin-top:20px}

.error, .notice, .success {padding:.8em;border:2px solid #ddd;}
.error {background:#FBE3E4;color:#8a1f11;border-color:#FBC2C4;}
.notice {background:#FFF6BF;color:#514721;border-color:#FFD324;}
.success {background:#E6EFC2;color:#264409;border-color:#C6D880;}
.error a {color:#8a1f11;}
.notice a {color:#514721;}
.success a {color:#264409;}
.strike{text-decoration:line-through}




.alert a{text-decoration:underline}
.notif-bubble{padding:3px 7px;background:red;position:absolute;top:2px;right:2px;text-align:center;border-radius:10px;color:white}


ul.tabs{list-style:none;margin-left:10px;margin-top:10px;font-size:10px;opacity:.8}
ul.tabs li{display:block;margin-right:10px;padding:5px 0}
ul.tabs li label{display:inline;}
ul.tabs li .checkbox input[type="checkbox"]{vertical-align:text-top}
/* Main table cell colours and backgrounds */
.nopadding,.nopadding td,.nopadding tr td{padding:0px;}

a.neutral{color:rgba(68, 68, 68, 0.31);opacity:.4}
a.neutral.selected,a.neutral:hover{opacity:1}
a.neutral i{vertical-align:middle;font-size:18px}



	/**
	 * Tooltip Styles
	 */

	/* Base styles for the element that has a tooltip */
	[data-tooltip],
	.tooltip {
	  position: relative;
	  cursor: pointer;
	}

	/* Base styles for the entire tooltip */
	[data-tooltip]:before,
	[data-tooltip]:after,
	.tooltip:before,
	.tooltip:after {
	  position: absolute;
	  visibility: hidden;
	  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	  opacity: 0;
	  -webkit-transition: 
		  opacity 0.2s ease-in-out,
			visibility 0.2s ease-in-out ,
			-webkit-transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);
		-moz-transition:    
			opacity 0.2s ease-in-out,
			visibility 0.2s ease-in-out,
			-moz-transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);
		transition:         
			opacity 0.2s ease-in-out,
			visibility 0.2s ease-in-out,
			transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);
	  -webkit-transform: translate3d(0, 0, 0);
	  -moz-transform:    translate3d(0, 0, 0);
	  transform:         translate3d(0, 0, 0);
	  pointer-events: none;
	-webkit-transition-delay: 0.5s; /* Safari */
	    transition-delay: 0.5s;
	}

	/* Show the entire tooltip on hover and focus */
	[data-tooltip]:hover:before,
	[data-tooltip]:hover:after,
	[data-tooltip]:focus:before,
	[data-tooltip]:focus:after,
	.tooltip:hover:before,
	.tooltip:hover:after,
	.tooltip:focus:before,
	.tooltip.auto:after
	 {
	  visibility: visible;
	  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
	  opacity: 1;
	}

	/* Base styles for the tooltip's directional arrow */
	.tooltip:before,
	[data-tooltip]:before {
	  z-index: 1001;
	  border: 6px solid transparent;
	  background: transparent;
	  content: "";
	}

	/* Base styles for the tooltip's content area */
	.tooltip:after,
	[data-tooltip]:after {
	  z-index: 1000;
	  padding: 8px;
	  width: 260px;
	  background-color: #000;
	  background-color: hsla(0, 0%, 20%, 0.9);
	  color: #fff;
	  border-radius:4px;
	  content: attr(data-tooltip);
	  /*font-size: 14px; no */
	  line-height: 1.2;
	}

	/* Directions */

	/* Top (default) */
	[data-tooltip]:before,
	[data-tooltip]:after,
	.tooltip:before,
	.tooltip:after,
	.tooltip-top:before,
	.tooltip-top:after {
	  bottom: 100%;
	  left: 50%;
	}

	[data-tooltip]:before,
	.tooltip:before,
	.tooltip-top:before {
	  margin-left: -6px;
	  margin-bottom: -12px;
	  border-top-color: #000;
	  border-top-color: hsla(0, 0%, 20%, 0.9);
	}

	/* Horizontally align top/bottom tooltips */
	[data-tooltip]:after,
	.tooltip:after,
	.tooltip-top:after {
	  margin-left: -80px;
	}

	[data-tooltip]:hover:before,
	[data-tooltip]:hover:after,
	[data-tooltip]:focus:before,
	[data-tooltip]:focus:after,
	.tooltip:hover:before,
	.tooltip:hover:after,
	.tooltip:focus:before,
	.tooltip:focus:after,
	.tooltip-top:hover:before,
	.tooltip-top:hover:after
 {
	  -webkit-transform: translateY(-12px);
	  -moz-transform:    translateY(-12px);
	  transform:         translateY(-12px); 
	}

	/* Left */
	.tooltip-left:before,
	.tooltip-left:after {
	  right: 100%;
	  bottom: 50%;
	  left: auto;
	}

	.tooltip-left:before {
	  margin-left: 0;
	  margin-right: -12px;
	  margin-bottom: 0;
	  border-top-color: transparent;
	  border-left-color: #000;
	  border-left-color: hsla(0, 0%, 20%, 0.9);
	}

	.tooltip-left:hover:before,
	.tooltip-left:hover:after,
	.tooltip-left:focus:before,
	.tooltip-left:focus:after {
	  -webkit-transform: translateX(-12px);
	  -moz-transform:    translateX(-12px);
	  transform:         translateX(-12px); 
	}

	/* Bottom */
	.tooltip-bottom:before,
	.tooltip-bottom:after {
	  top: 100%;
	  bottom: auto;
	  left: 50%;
	}

	.tooltip-bottom:before {
	  margin-top: -12px;
	  margin-bottom: 0;
	  border-top-color: transparent;
	  border-bottom-color: #000;
	  border-bottom-color: hsla(0, 0%, 20%, 0.9);
	}

	.tooltip-bottom:hover:before,
	.tooltip-bottom:hover:after,
	.tooltip-bottom:focus:before,
	.tooltip-bottom:focus:after
	 {
	  -webkit-transform: translateY(12px);
	  -moz-transform:    translateY(12px);
	  transform:         translateY(12px); 
	}

	/* Right */
	.tooltip-right:before,
	.tooltip-right:after {
	  bottom: 50%;
	  left: 100%;
	}

	.tooltip-right:before {
	  margin-bottom: 0;
	  margin-left: -11px;/*originaly -11px*/
	  border-top-color: transparent;
	  border-right-color: #000;
	  border-right-color: hsla(0, 0%, 20%, 0.9);
	}

	.tooltip-right:hover:before,
	.tooltip-right:hover:after,
	.tooltip-right:focus:before,
	.tooltip-right:focus:after {
	  -webkit-transform: translateX(12px);
	  -moz-transform:    translateX(12px);
	  transform:         translateX(12px); 
	}

	/* Move directional arrows down a bit for left/right tooltips */
	.tooltip-left:before,
	.tooltip-right:before {
	  top: 11px; /* originellement 3*/
	}

	/* Vertically center tooltip content for left/right tooltips */
	.tooltip-left:after,
	.tooltip-right:after {
	  margin-left: 0;
	  margin-bottom: -4px; /*originellement -16*/
	}
 ul.nav{margin:20px ;border-bottom:1px solid #eee}
 ul.nav li{display:inline;}
 ul.nav li a{display:inline-block;text-decoration:none;padding:10px;}
  ul.nav li.active a, ul.nav li a:hover{background:#eee}


#footer{clear:both}
.visible-desktop,.emojizz{display:none}
@media(min-width:768px){
	ul.tabs li{display:inline;}
	h1{font-size:20px}
	#topic_list li a.tt {
	    font-size: 17px;
	}
}	
@media(min-width:769px){
	
	#sidesearch{display:none}
	#topmenu .topsearch{display:initial;float:right;margin-right:30px;margin-top:5px;width:420px}
	
	.visible-desktop,.emojizz{display:initial}
	body.forum #backhomebtn .icon-home{display:block;font-size:23px}
	body.forum #backhomebtn .txt-menu{display:none}
	#sidebar{display:block;max-width:300px}
	body.forum #maincontent{float:right;width:70%}
	body.forum #sidebar {padding:0 10px;}
	#page{max-width:1200px}
	body.topic .postbody{margin-left:85px;margin-top:0px}
	#topic_list.thumbs li{width:25% !important}
	
}
@media(min-width:1024px){
	/*body.forum #maincontent,body.forum #sidebar{padding: 0 30px;}	*/
	#topmenu{left:auto}
}	

@media(max-width:330px){
	#backhomebtn{margin-right:5px}
}

#bbcodebuttons{margin-bottom:10px;font-size:10px;margin-bottom:0;}
#bbcodebuttons .btn{width:40px;margin-right:3px}
#message-wrapper{margin-top:0px}
#message{width:100%;box-sizing:border-box}
#textsize{width:80px;float:right}
#quickreply
#qrpb{margin-top:-67px}
#pmcnt{opacity:.6;

border-radius: 4px;margin-bottom:20px}
#message-wrapper .emojizz{position:absolute;right:0px;font-size:25px;padding:5px}
span.ej{font-size:17px}