/***** clearfix *****/
.clear {clear: both;height: 0;line-height: 0;}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
.clearfix {height: 1%;}
.clearfix {display: block;}

/* Panel Tab/button */
.tab {
  	background: url(./images/tab_b.png) repeat-x 0 0;
	height: 42px;
	position: relative;
    top: 0;
    z-index: 999;
}

.tab ul.login {
	display: block;
	position: relative;
  	float: right;
  	clear: right;
  	height: 42px;
	width: auto;
  	font-weight: bold;
	line-height: 42px;
	padding: 0;
	margin: 0;
	right: 150px;
  	color: white;
  	font-size: 12px;
	text-align: center;
}

.tab ul.login li.left {
  	background: url(./images/tab_l.png) no-repeat left 0;
  	height: 42px;
	width: 30px;
	padding: 0;
	margin: 0;
  	display: block;
	float: left;
}

.tab ul.login li.right {
  	background: url(./images/tab_r.png) no-repeat left 0;
  	height: 42px;
	width: 30px;
	padding: 0;
	margin: 0;
  	display: block;
	float: left;
}

.tab ul.login li {
 	text-align: left;
	margin:0;
  	padding: 0 6px;
	display: block;
	float: left;
	height: 42px;
  	background: url(./images/tab_m.png) repeat-x 0 0;
}

.tab ul.login li a {
	color: #15ADFF;
}

.tab ul.login li a:hover {
	color: white;
}

.tab .sep {color:#414141}

.tab a.open, .tab a.close {
	height: 20px;
	line-height: 20px !important;
	padding-left: 30px !important;
	cursor: pointer;
	display: block;
	width: 100px;
	position: relative;
	top: 11px;
}

.tab a.open {background: url(./images/bt_open.png) no-repeat left 0;}
.tab a.close {background: url(./images/bt_close.png) no-repeat left 0;}
.tab a:hover.open {background: url(./images/bt_open.png) no-repeat left -19px;}
.tab a:hover.close {background: url(./images/bt_close.png) no-repeat left -19px;}

/* sliding panel */
#toppanel {
    position: absolute;   /*Panel will overlap  content */
    /*position: relative;*/   /*Panel will "push" the content down */
    top: 0;
    width: 100%;
    z-index: 999;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

#panel {
	width: 100%;
	height: 260px;
	color: #999999;
	background: #272727;
	overflow: hidden;
	position: relative;
	z-index: 3;
	display: none;
}

#panel h1 {
	font-family:"Trebuchet MS",Arial, Helvetica, sans-serif;
	font-size: 2.2em;
	padding: 5px 0;
	margin: 0;
	color: white;
}

#panel h2{
	font-size: 1.8em;
	padding: 10px 0 5px;
	margin: 0;
	color: white;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
}

#panel p {
	margin: 5px 0;
	padding: 0;
}

#panel a {
	text-decoration: none;
	color: #15ADFF;
}

#panel a:hover {
	color: white;
}

#panel .content_top {
	width: 900px;
	margin: 0 auto;
	padding-top: 15px;
	text-align: left;
	font-size: 0.85em;
}

#panel .content_top .left {
	width: 220px;
	height: 245px;
	float: left;
	padding: 0 5px 0 10px;
	border-left: 1px solid #333;	
}
#panel .content_top .leftmid {
	width: 460px;
	height: 245px;
	float: left;
	padding: 0;
	border-left: 1px solid #333;	
	border-right: 1px solid #333;
}

#panel .content_top .right {
	width: 165px;
	border-right: 1px solid #333;
}

#panel .content_top .middle {
	border-left: 0px;	
	border-right: 1px solid #333;
	width: 140px;	
}
#panel .content_top form {
	margin: 0 0 10px 0;
}

#panel .content_top form.member {
	margin: 0;
	text-align:center;
	height:37px;
	padding-top:7px;
	padding-right:10px;
}

#panel .content_top label {
	float: left;
	padding-top: 5px;
	clear: both;
	width: 280px;
	display: block;
}

#panel .content_top label.member {
	display: none;
	width: 200px;
	clear:none;
	float: none;
	padding: 0;
	clear: both;
	display: block;
}
#panel .content_top input.member {
	border: 1px #1A1A1A solid;
	background: #414141;
	margin-right: 5px;	
	width: 200px;
	color: white;
	height: 16px;
}

#panel .content_top input.field {
	border: 1px #1A1A1A solid;
	background: #414141;
	margin-right: 5px;
	margin-top: 4px;
	width: 200px;
	color: white;
	height: 16px;
}

#panel .content_top input:focus.field {
	background: #545454;
}

/* BUTTONS */
#panel .content_top input.bt_login {
	font-family:"Trebuchet MS",Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding:0;
	margin:0;
	height: 24px;
	text-align: center;
	cursor: pointer;
	border: 0px;
	font-weight: bold;
	color:black;
	float:left;
	background: transparent url(./images/btn_middle.png) repeat-x 0 0;
}
#panel .content_top input.bt_login:hover{color: #444444;}

#panel .content_top input.bt_logoff {
	font-family:"Trebuchet MS",Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding:0;
	margin:0;
	height: 24px;
	text-align: center;
	cursor: pointer;
	border: none;
	font-weight: bold;	
	color: white;	
	float:left;
	background: transparent url(./images/btn_middle_b.png) repeat-x 0 0;
}
#panel .content_top input.bt_logoff:hover{color: #999999;}
.mon_btn {padding:4px 0 0 0;margin:0;height:24px}

.my_bp{font-family: Trebuchet MS,Arial,Helvetica,sans-serif;font-size: 10px !important;;font-weight: bold !important;;}
.my_bp.log_off{background: url(./images/ui-bg_highlight-hard_75_0078b6_1x100.png) repeat-x scroll 50% 50% #0078B6;border: 1px solid #666666;}
.my_bp.log_off.ui-state-hover{background: #389dcc url(./images/ui-bg_highlight-hard_75_389dcc_1x100.png) 50% 50% repeat-x;}

#main h1{
	margin:0px;
	padding:0px;
	color:#555555;
	font-size:28px;
	font-weight:bold;
	font-family:"Trebuchet MS",Arial, Helvetica, sans-serif;
	letter-spacing:1px;
	text-align:center;
}

#main h2{
	margin:0px;
	padding:0px;
	font-family:"Arial Narrow",Arial,Helvetica,sans-serif;
	font-size:10px;
	font-weight:normal;
	letter-spacing:1px;
	padding-left:2px;
	text-transform:uppercase;
	white-space:nowrap;
	margin-top:4px;
	color:#888888;
	text-align:center;
}


#main{
	/*width:800px; */
	/* Centering it in the middle of the page */
	/* margin:280px 0px; */
	/*margin:280px 0 0 0; */
	margin:0;
	padding:280px 0 0 0;	
	height:100%;
}

#main p{
	padding-bottom:8px;
}

.err{
	color:red;
	font-weight:bold;
}

.success{
	color:#00CC00;
	font-weight:bold;
}

/* General hover styles */
#panel .content_top ul{
	height:173px;
	overflow: auto;
}

#MenuLanguage li{
	margin:0;
	list-style:none;
	height:28px;
	padding:2px;
	width:40px;
}
#MenuLanguage span{
	/* Container properties */
	width:0;
	left:29px;
	padding:0;
	position:absolute;
	overflow:hidden;

	/* Text properties */
	font-family:'Myriad Pro',Arial, Helvetica, sans-serif;
	font-size:16px;
	font-weight:bold;
	letter-spacing:0.6px;
	white-space:nowrap;
	line-height:28px;
	color:white;
	/* CSS3 Transition: */
	-webkit-transition: 0.25s;
	
	/* Future proofing (these do not work yet): */
	-moz-transition: 0.25s;
	transition: 0.25s;
}

#MenuLanguage a{
	background:url('./images/fr.png') no-repeat;
	height:28px;
	width:28px;
	display:block;
	position:relative;
}

#MenuLanguage a:hover span{ width:auto; padding:0 5px;overflow:visible; background-color:#414141;}
#MenuLanguage a:hover{
	text-decoration:none;	
	/* CSS outer glow with the box-shadow property */
	-moz-box-shadow:0 0 5px #9ddff5;
	-webkit-box-shadow:0 0 5px #9ddff5;
	box-shadow:0 0 5px #9ddff5;
}

#MenuLanguage  .select span {width:auto; padding:0 5px;overflow:visible;background-color:#414141;}

#dialog_confirme_pass div {text-align:center;position:absolute;padding:0 0 0 10px;margin:0;line-height:16px;width: 270px;}
#dialog_confirme_pass .update_in {padding-left:20px;background: transparent url(./images/load.gif) no-repeat 0 0;}
#dialog_confirme_pass .err .success{padding:0px;}