html, body {
    font-family: Tahoma, Verdana, Helvetica, sans-serif;
    font-size: 13px;
    color: #000000;
    margin: 0;
    padding: 0;
	background: #000 url("http://www.gtanf.com/images/body-gtanf.jpg") no-repeat top center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    @media (max-width: @iphone-screen) {
        background-attachment: scroll;
    }
}
#menu-top{margin: auto; width: 100%; height: 72px; background-image: url("images/menu_header.png"); z-index:1; background-repeat: no-repeat; background-position: center top;}

#menu{margin: auto; width: 641px; height: 38px;}
	#liste-menu {margin: 0; margin-left: 22px; padding: 0; height: 55px; list-style: none;}
	#liste-menu li{display:inline; float: left; margin:0; padding:0;}
		#menu-accueil a{display: inline; float: left; width: 85px; height: 38px; background-image: url("images/accueil.png");}
		#menu-accueil a:hover{background: url("images/accueil.png") -85px;}
		#menu-guides a{display: inline; float: left; width: 76px; height: 38px; background-image: url("images/guides.png");}
		#menu-guides a:hover{background: url("images/guides.png") -76px;}
		#menu-galerie a{display: inline; float: left; width: 95px; height: 38px; background-image: url("images/galerie.png");}
		#menu-galerie a:hover{background: url("images/galerie.png") -95px;}
		#menu-videos a{display: inline; float: left; width: 77px; height: 38px; background-image: url("images/videos.png");}
		#menu-videos a:hover{background: url("images/videos.png") -77px;}
		#menu-downloads a{display: inline; float: left; width: 194px; height: 38px; background-image: url("images/dl.png");}
		#menu-downloads a:hover{background: url("images/dl.png") -194px;}
		#menu-forums a{display: inline; float: left; width: 89px; height: 38px; background-image: url("images/forums.png");}
		#menu-forums a:hover{background: url("images/forums.png") -89px;}

#header{margin: auto; width: 1015px; height: 200px;  margin-top: -34px; padding-top: 25px;}
#top{margin: auto; width: 1002px; height: 115px; background-image: url("images/top.png");}
	#recherche{position: relative; float: left; top: 10px; left: 10px; width: 243px; height: 60px; text-align: center; padding-top: 35px;}
	#pub{position: relative; float: right; top: 17px; right: 13px; width: 728px; height: 90px;}
#conteneur{ clear: both; margin: auto; width: 1002px; background: url("images/conteneur.png") repeat-y; padding-bottom: 10px; padding-top:2px; margin-bottom: -2px; overflow:auto;}
			.titre{padding: 10px; padding-left: 20px; font-size: 16px; font-weight: 300; color: #ffffff; display: block;}
			.infos{font-size: 10px;}
			.list-none{margin: 0; padding: 0;}
			.list-none li{list-style-type: none;}
			h5.auteur_clair, h5.auteur_fonce{margin: 2px; padding: 2px; border-bottom: 1px dashed #7B7B7B;}
			.clair{padding: 2px;}
			.fonce{padding: 2px; background: #ececec;}
		#contenu_article{margin-top: -20px; margin-left: 13px; width: 840px;}
		#contenu_accueil{margin-top: -10px; margin-left: 13px; width: 663px;}
		#contenu_page{margin-top: -10px; margin-right: 13px; width: 660px; margin-left: 13px;}
			#gauche{width: 300px;}
			#droit_article{float: right; width: 530px;}
			#droit_accueil{float: right; width: 350px;}
				.rec300_bloc{width: 280px; background-image: url("images/rec300_bloc.gif"); padding-left: 10px; padding-right: 10px; padding-top: 1px; padding-bottom: 1px;}
				.rec300_titre{width: 300px; height: 40px; background-image: url("images/maintitle-small.png"); margin-top: 10px;}
				.rec300_titre_top{width: 300px; height: 40px; background-image: url("images/maintitle-small.png"); margin-top: 15px;}
				.rec300_bas{width: 300px; height: 15px; background-color: #EBF0F3;}
				.rec350_bloc{width: 330px; background-image: url("images/rec350_bloc.gif"); margin-top: 10px; padding-left: 10px; padding-right: 10px; padding-top: 1px; padding-bottom: 1px;}
				.rec350_bloc_act{width: 330px; background: url("images/rec350_bloc_act.jpg") bottom; margin-top: 10px; padding-left: 10px; padding-right: 10px;}
				.rec350_titre{width: 350px; height: 40px; background-image: url("images/rec350_titre.png"); margin-top: 10px;}
				.rec350_bas{width: 350px; height: 15px; background-image: url("images/rec350_bas.png");}
				.rec530_bloc{width: 510px; background-image: url("images/rec530_bloc.gif"); text-align: justify; padding-left: 10px; padding-right: 10px; padding-top: 1px; padding-bottom: 1px;}
				.rec530_titre{width: 530px; line-height: 41px; height: 41px; background: url("images/titre_fond.png") right; margin-top: 10px; vertical-align: center;}	
				.rec530_bas{width: 530px; height: 15px; background-image: url("images/rec530_bas.png");}
				.rec-a-la-une_titre{width: 640px; line-height: 41px; height: 41px; background: url("images/rec-a-la-une.png") right; margin-top: 0px; vertical-align: center;}
				.rec-a-la-une_bas{width: 640px; height: 15px; background-color: #EBF0F3;}
				.rec660-article_titre{width:660px; height: 41px; line-height: 41px; background: url("images/maintitle-article.png") right; margin-top: 15px; vertical-align: center; border: 0px solid #FF0000;}
				.rec660_titre{width:660px; height: 41px; line-height: 41px; background: url("images/maintitle.png") right; margin-top: -10px; vertical-align: center; border: 0px solid #FF0000;}
				.rec660_titre2{width:660px; height: 41px; line-height: 41px; background: url("images/maintitle.png") right; margin-top: 0px; vertical-align: center; border: 0px solid #FF0000;}
				.rec660_bloc{width: 640px; background-image: url("images/rec660_bloc.gif"); padding-left: 10px; padding-right: 10px; padding-top: 0px; padding-bottom: 0px;}
				.rec660_bloc img { max-width: 100%; }
				.rec660_bloc2{width: 660px;  margin-top: 10px;}
				.rec660_bloc3{width: 660px;  margin-top: 16px;}
				.rec530_bloc2{width: 510px;  margin-top: 10px;}
				.rec660_bas{width: 660px; height: 15px; background-color: #EBF0F3;}
.cadre {
	margin: 0px 0px 12px 0px;
}
.cadre a 
{
	text-decoration: underline;
}
.titre_gauche {float:left; height:41px; width:20px;}

.titre_milieu{
	background-repeat: repeat-x;
	height:41px;
	float:left;
	overflow:hidden;
	font-weight:bold;
}

.titre_droite {
	height:41px;
	width:69px;
	}

		
		#plus_article{float: right; margin-right: 13px; width: 120px;}
		#plus_accueil{float: right; margin-right: 13px; width: 300px; margin-top: -10px;}
		#plus_page{float: right; margin-right: 13px; width: 300px; margin-top: -20px;}
		#plus_page_rs{float: right; margin-right: 13px; width: 300px; margin-top: -6px;}
#conteneur-b{clear: both; margin: auto; width: 1002px; height: 80px; background: url("images/conteneur-b.png") no-repeat;}
#apropos{padding-top: 7px; font-size: 10px; text-align: center; color: #1E1E1E; padding-bottom: 10px;}
#apropos a{color: #002641;}

p{margin: 2px;}
h1{font-size: 16px; font-weight: 300; color: #FFFFFF; margin-top:0px;}
h2{margin-left: 5px; padding-left: 10px; font-size: 18px; color: #404040; border-bottom: 2px solid #404040;}
h3{margin-left: 15px; padding-left: 5px; font-size: 16px; color: #404040; border-bottom: 1px solid #404040;}
h4{margin: 3px 0 3px 0px; padding: 0px; font-size: 14px; color: #999; font-family: Arial;}
a{color: #000000; text-decoration: none;}
.rec660_bloc a { text-decoration: underline;}
a:hover{text-decoration: underline;}
img{border: none;}
ul{list-style-type: square;}
.center{margin: 5px; text-align: center;}
.right{margin: 5px; text-align: right;}
.floatleft{float: left; margin: 5px;}
.floatright{float: right; margin: 5px;}
input, select, textarea{border: 1px solid #969696; background-color:#e3e3e3; color: #232323; margin: 3px;}

.contenu_video {
	display: inline;
	width: 208px;
	float: left;
	padding:5px;
	padding-left: 0px;
	text-align: left;
	font-size: 9px;
}
.calque_video {
	position: relative;
	width: 210px;
	height: 106px;
}
.calque_video span {
	display: block;
	width: 210px;
	height:106px;
	position: absolute;
	bottom: 0;
	right: 0;
	background: url("images/calque_video_acc.png");
	cursor: pointer;
}
.calque_video img {padding-top: 3px; padding-left: 17px;}

/*************** DIV NEWS ***************/

#posts {
        padding:0;
        margin: 0;
    }
    #posts li {
    	width: 638px;
		height: 91px;
    	border: 0px solid #dbe4ef;
        background-image: none;
        list-style: none;
        margin: 0 0 5px 0;
        padding: 3px;
		font-size: 11px;
		color: #404040;
    }
	#post li.fonce
	{
		background-color: #b9b9b9;
	}
    #posts a {
        display: block;
		text-decoration: none;
    }

    #posts h2 {
        padding: 5px 0 5px 95px;
        margin: 0;
        color: #59595F;
        font-size: 14px;
    }
	
    #posts p {
        padding-left: 0px;
		margin-top:0;
		margin-left: 0px;
    }

	.post_img {
		position: relative;
		width: 90px;
		height: 90px;
		float: left;
		margin-right: 5px;
	}
	.post_img a span{
		position: absolute;
		background: url(./images/calque_news.png);
		display: block;
		width: 90px;
		height: 90px;
		bottom: 0;
		right: 0;
	}

	.post_img a:hover span {
		position: absolute;
		display: block;
		width: 90px;
		height: 90px;
		bottom:0;
		right:0;
		background: url(./images/calque_news.png);
	}
	
	#silverlightControlHost{ margin-top: -10px; width: 697px; height: 194px;}
	
	#sites{width: 697px; height: 194px;}
#sites ul, #sites li{list-style-type: none; margin:0; padding:0;}
#sites ul{position: absolute; background: transparent url(images/fond-header-1.png) top left no-repeat; text-align: center;}
#sites li{float: left;}
#sites li a{display: block; height: 194px; width: 175px; font-size: 0px;}
#sites li a:hover{background: transparent url(images/fond-header-1.png) top left no-repeat; font-size: 10px;}
#sites a#lien1:hover{background-position: -697px 0%;}
#sites a#lien2:hover{background-position: -872px 0%;}
#sites a#lien3:hover{background-position: -1047px 0%;}
#sites a#lien4:hover{background-position: -1222px 0%;}

#sites2{width: 697px; height: 194px;}
#sites2 ul, #sites2 li{list-style-type: none; margin:0; padding:0;}
#sites2 ul{position: absolute; background: transparent url(images/fond-header-2.png) top left no-repeat; text-align: center;}
#sites2 li{float: left;}
#sites2 li a{display: block; height: 194px; width: 175px; font-size: 0px;}
.li-forum-sites2 { width: 350px;}
#sites2 li a:hover{background: transparent url(images/fond-header-2.png) top left no-repeat; font-size: 10px;}
#sites2 a#lien1:hover{background-position: -697px 0%;}
#sites2 a#lien2:hover{background-position: -872px 0%;}
#sites2 a#lien3:hover{background-position: -1047px 0%; width: 350px;}

/* Info Bulle */
a.infobulle {
position: relative;
color: black;
text-decoration: none;
border-bottom: 1px gray dotted;
}

a.infobulle span {
display: none;
}

a.infobulle:hover {
background: none;
z-index: 500;
}

a.infobulle:hover span {
z-index: 600;
display: inline;
position: absolute;
white-space: nowrap;
top: -300px;
left: 0px;
background: white;
color: #403327;
text-align: center;
padding: 3px;
border: 1px solid #625141;
}

/*************** DIV A LA UNE ***************/
#s3slider {
   width: 640px; /* important to be same as image width */
   height: 290px; /* important to be same as image height */
   position: relative; /* important */
   overflow: hidden; /* important */
}

#s3slider li {
	background-image: none;
	margin:0;
	padding:0;
}

#s3slider ul {
	background-image: none;
	margin:0;
	padding:0;
}

#s3slider h3{
	font-family: "Verdana";
   font-weight: 900;
   font-size:16px;
   margin:0px;
   margin-bottom : 5px;
}

#s3sliderContent {
   width: 640px; /* important to be same as image width or wider */
   position: absolute; /* important */
   top: 0; /* important */
   margin-left: 0; /* important */
}

.s3sliderImage {
   float: left; /* important */
   position: relative; /* important */
   display: none; /* important */
}

.s3sliderImage span {
   position: absolute; /* important */
   right: 0;
   font: 12px Arial, Helvetica, sans-serif;
   padding: 10px 13px;
   width: 640px;
   height: 40px;
   background-color: #000;
   filter: alpha(opacity=70); /* here you can set the opacity of box with text */
   -moz-opacity: 0.7; /* here you can set the opacity of box with text */
   -khtml-opacity: 0.7; /* here you can set the opacity of box with text */
   opacity: 0.7; /* here you can set the opacity of box with text */
   color: #fff;
   display: none; /* important */
   top: 0;

   /*
       if you put
       top: 0; -> the box with text will be shown at the top of the image 
       if you put
       bottom: 0; -> the box with text will be shown at the bottom of the image
   */
}

.clear {
   clear: both;
} 
.bottom {
	bottom: 0;
    left: 0;
}

/* Quote boxes */
/*
p.citation {
	background: #d3e9dc url("http://www.gtanf.com/forums/public/style_images/gtanf/citation_bg.png") no-repeat right;
	color: #000000;
	font-weight: bold;
	border-width: 1px 1px 0 3px;
	border-style: solid;
	border-color: #6fa987;
	padding: 5px 8px;
	margin: 0;
}
*/

blockquote {
    background: #f3f9f6;
    border-width: 1px 1px 1px 3px;
    border-style: solid;
    border-color: #88b97e;
    margin: 0px;
    margin-top: 0px;
    color: #000000;
    padding: 0px 5px 5px 5px;
}


blockquote p.citation {
    background-color: #e5d2e9;
    color: #413544;
    border-color: #ae7eb9;
    color: #000000;
}

blockquote {
    background: #ebf0f3;
    color: #000000;
    border-color: #74777e;
    margin: -0px 15px 0px 15px;
}

blockquote blockquote p.citation {
    background-color: #e9e7d1;
    color: #474534;
    border-color: #74777e;
}

blockquote blockquote blockquote {
    background: #ebf0f3;
    border-color: #74777e;
}

div.blockquote p.citation {
    margin: 6px 15px 0 15px;
}

div.quote {
    padding: 12px;
}

div.quote p.blockquote {
    margin-left: -12px;
}

cite {
    display: block;
    font-weight: bold;
}

blockquote cite {
}


/* Logos */
#logos a:hover {
    opacity: 0.5;
}

.bbc_spoiler_wrapper {
    border: 1px inset #777;
    padding: 4px;
}