* {
margin : 0;
padding : 0;
}
html
{
  height:100%;
    width:100%;
    overflow:hidden;
margin : 0;
padding : 0;
}

body {
font-family : "Myriad Pro", "Lucida Grande", Verdana, Arial, sans-serif;
color : #fff;
text-align : center;
  height:100%;
    width:100%;
 overflow:hidden;
 background-image: url(../uploads/images/fonds/darksky.jpg);
 background-repeat:no-repeat;
	/*background-size: 100% 100%;*/
	-o-background-size: 100% 100%;
	-webkit-background-size: 100% 100%;
	-khtml-background-size: 100% 100%;
	-moz-background-size: 100% 100%; }
}

h1 {
padding : 0;
margin : 0;
}

h2 {
font-size: 0.9em;
text-align: justify;
font-size: 500;
color: #999;
padding-left: 10px;

}

p {
color : #fff;
text-align : justify;
font-size : 0.8em;
padding-left: 10px;
padding-right: 10px;
}
a {
text-decoration : none;
color : #fff;
}
a:hover {
text-decoration : none;
color : #666;
}

#wrapper {
position: absolute;
width : 920px;
left: 50%;
margin-left: -450px; 
top: 0;
z-index: 200;
}

#bg {
position: absolute;
z-index: 100;
width : 920px;
left: 50%;
margin-left: -450px; 
top : 5px;
height : 620px;
background-image: url(../images/bg_gradient.png);
background-position: top left;
background-repeat: no-repeat;

}

#pagetitle_bg {
position: absolute;
z-index: 100;
width : 920px;
left: 50%;
margin-left: -450px; 
top : 200px;
height: 25px;
background-image: url(../images/white_bg.png);
background-position: top left;
background-repeat: no-repeat;
opacity: 0.7;
filter: alpha(opacity=70);
}

#content_bg {
position: absolute;
z-index: 100;
width : 920px;
left: 50%;
margin-left: -450px; 
top : 225px;
height : 310px;
padding-top: 2%;
padding-bottom: 2%;
background-image: url(../images/bg_gradient.png);
background-position: bottom right;
background-repeat: no-repeat;
opacity: 0.7;
filter: alpha(opacity=70);
}


#header {
position: relative;
z-index: 200;
width : 100%;
display : block;
float : left;
}
#login {
display: block; 
float: left;
width : 880px;
padding-right: 20px;
padding-left: 20px;
display : block;
float : left;
height : 20px;
padding-top: 2px;
padding-bottom : 2px;
font-size : 0.7em;
text-align : left;
margin-top : 5px;
}
form {
display : block;
float : left;
}
input {
width : 120px;
margin-left : 5px;
margin-right : 5px;
margin-top : 2px;
border : 1px solid #fff;
color : #000;
height : 14px;
}
.submit {
width : 25px;
border : 1px solid #fff;
background-color : #333;
color : #fff;
font-size : 0.8em;
height : 17px;
text-align : center;
}
.submit:hover {
border : 1px solid #fff;
background-color : #000;
color : #fff;
height : 17px;
text-align : center;
}
#connect_users {
display : block;
float : left;
height : 17px;
text-align : center;
padding-top : 5px;
}
#choose_lang {
display : block;
float : right;
text-align : right;
font-size : 1em;
padding-right : 10px;
padding-top: 5px;
}

#logo {
display : block;
float : left;
width : 20%;
margin-left: 20px;
margin-top : 15px;
height : 100px;
}
#logo img {
width : 100%;
}

#menu {
display: block;
float: left;
width: 400px;
padding-left : 275px;
padding-right : 10px;
	height: 110px;
	font-family: century gothic, myriad pro, lucida grande, verdana, arial, sans-sérif;
	font-size: 0.8em;
	font-weight: 100;
	text-align: center;
	padding-top: 20px;
	padding-bottom: 20px;
	background: none;
	}

.menu, .menu li ul{
list-style-type: none;
margin: 0;
width: 200px; /*WIDTH OF MAIN MENU ITEMS*/
text-align: right;
}

.menu li{
position: relative;
font-size: 1.2em;
font-weight: 200;
letter-spacing: 7px;

}

.menu li a{
display: block;
width: auto;
text-decoration: none;
padding: 2px;
color: #FFF;
padding-right: 21px;

}

.menu li a:hover{
color: #666;
border-right: 1px solid #666;
padding-right: 20px;

}

.menu li ul{ /*SUB MENU STYLE*/
position: absolute;
height: 110px;
margin-top: -52px;
margin-left: 1px;
width: 200px; /*WIDTH OF SUB MENU ITEMS*/
left: 0;
top: 0;
display: none;
text-align: left;
padding-left: 19px;
border-left: 1px solid #666;

}

.menu li ul li{
float: left;
margin-bottom: 5px;
border: none;
color: #fff;
font-size: 0.8em;
font-weight: 100;
letter-spacing: 3px;
}

.menu li ul a{
width: 200px;
height: 12px;
padding: 0;
padding-left: 5px;
padding-bottom: 3px;
padding-top: 3px;
border: none;
 /*WIDTH OF SUB MENU ITEMS - 10px padding-left for A elements */
}

.menu .arrowdiv{
position: absolute;
right: 0;
}

.menu li ul a:hover{
color: #666;
padding: 0;
padding-left: 5px;
padding-bottom: 3px;
padding-top: 3px;
border: none;
}

.menu li a:visited, .menu li a:active{
}


/* Holly Hack for IE \*/
* html .menu li { float: left; height: 1%; }
* html .menu li a { height: 1%; }
/* End */
	

.menu3 {
display : block;
float : left;
width: 880px;
padding-left: 20px;
padding-right: 20px;
padding-top : 3px;
padding-bottom : 3px;
list-style-type : none;
text-align : left;
font-size : 0.8em;
font-weight : 100;
z-index : 200;
border-top: 1px solid #fff;
}
.menu3 li {
width : 15%;
display : block;
float : left;
}
#pagetitle {
position: relative;
z-index: 400;
display : block;
float : left;
width : 900px;
padding-top: 3px;
padding-left: 20px;
color: #CCC;
font-family : "Century Gothic", Verdana, Arial, sans-serif;
text-align : justify;
font-size : 0.9em;
font-weight : 700;
height: 20px;
text-transform : capitalize;
border-top: 1px solid #999;
border-bottom: 1px solid #999;
}

#content {
width: 880px;
padding-left: 20px;
padding-right: 10px;
padding-top: 10px;
padding-bottom: 10px;
display: block; 
float: left;
height: 380px;
	}


div.scrollholder
{
    position: relative;
    width: 100%;
	height: 100%;
    overflow: auto;
	margin-right: 5px;
}

div.scroll
{
    position: absolute;
    left: 0; top: 0;
    z-index: 200;
	}

/* <Scroll> */
div.track
{
    position: relative;
    float:right;
    top: 0; 
    width: 15px; height: 100%;
    font-size: 0;
  	cursor: pointer; 
	background:url(../../images/scroll-bg.gif);
}

div.drag_bar
{
    position: absolute;
    width: 13px; height: 14px;
    cursor: pointer;
    z-index: 300;
    background: #333;
	display: block;
	background-image:url(../images/scroll-arrows.gif);
background-position:50% 50%;
background-repeat:no-repeat;
border: 1px solid #FFF;
		
} 

div.drag_bar:hover
{
    background: #666;
	border: 1px solid #999;
		background-image:url(../images/scroll-arrows.gif);
background-position:50% 50%;
background-repeat:no-repeat;
}

div.drag_bar:active
{
    background: #999;
	border: 1px solid #000;
		background-image:url(../images/scroll-arrows.gif);
		background-position:50% 50%;
background-repeat:no-repeat;
}