Page 1 sur 4

Aide pour le placement

Posté : 25 oct. 2012, 15:49
par yoyo83
Bonjour

voila grâce a juliette j'avais arriver a placer les blocs de mon site a droite et l'accueil sur la gauche

par contre comme je débute j'apprend juste par des petits tuto que je trouve sur le net
j'ai toucher un peut a tous sur mon fichier template.tpl et mon fichier style.css
je voulais savoir ci il étais possible de me le faire correctement sans que je ne touche a tous sur le fichier style.css
car du coup a avoir tous toucher j'ai rencontrer quelque beug

voici l'adresse de mon site http://ligue-europeenne.com la dessus c'est les fichiers original
ce que j'aimerais en faite c'est placer les blocs a droite sur deux parti
et placer l'accueil sur la partie gauche

voici le template :
<?php
/* Setting for the theme */
add_vars('css',www_t().'css/style.css');
add_vars('css_ie',www_t().'css/style_ie.css');


add_vars('js',DIR_JS.'jquery-ui-1.7.1.tabs.min.js');
add_vars('css',www_t().'css/tabs.css');
add_vars('css',www_t().'css/thickbox.css');
add_vars('js',DIR_JS.'thickbox.js');
add_vars('js',DIR_JS.'jquery.blockUI.js');
add_vars ( 'js', WWW_WEBROOT . 'js/uploadify/jquery.uploadify.v2.1.4.min.js' );
add_vars ( 'js', WWW_WEBROOT . 'js/uploadify/swfobject.js' );


//Pour rentrerScores
add_vars('css',www_t().'css/ui/ui.all.css');
/* End of Setting */
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<?php echo zk_header(); ?>


<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="" />
<meta name="keywords" content="zKup, tournoi, php, script, gestion" />
<title><?php echo decode(TITLE); ?></title>
  
<?php echo v('css'); ?>
<?php echo v('css_ie'); ?>
<script type="text/javascript" src="<?php echo WWW_ROOT; ?>app/layout/js/jquery.js"></script>
<?php echo v('js'); ?>

</head>
<body>
<!-- <?php echo VERSION; ?> -->
<div id="conteneur">

	<div id="header">
		<ul id="langues">
			<li><?php echo href(pays('fr'),array('url'=>php_self().'?langue=fr_FR'),true); ?></li>
			<li><?php echo href(pays('us'),array('url'=>php_self().'?langue=en_US'),true); ?></li>
		</ul>
	</div>
	
	<div id="menu">
		<ul>
			<li><?php echo href(__('com.menu.accueil',false),array ('controleur' => 'accueil', 'action' => 'index', 'id'=>'menu_accueil' )); ?></li>
			<li><?php echo href(__('com.menu.contact',false),array ('controleur' => 'accueil', 'action' => 'page', 'params'=>'2-contact', 'id'=>'menu_contact' )); ?></li>
			<li><?php echo href(__('com.menu.tournois',false),array ('controleur' => 'tournoi', 'id'=>'menu_tournoi' )); ?></li>
			<li><?php echo href(__('com.menu.liste_des_matchs',false),array ('controleur' => 'tournoi','action'=>'listedesmatchs', 'id'=>'menu_listematchs' )); ?></li>
			<li><?php echo href(__('com.menu.equipes',false),array ('controleur' => 'equipes', 'id'=>'menu_equipes' )); ?></li>
			<li><?php echo href(__('com.menu.historique',false),array ('controleur' => 'historique', 'id'=>'menu_historique' )); ?></li>
			<li><?php echo href(__('com.menu.reglement',false),array ('controleur' => 'accueil', 'action' => 'reglement', 'id'=>'menu_reglement' )); ?></li>
			<li><?php echo href(__('com.menu.partenaires',false),array ('controleur' => 'accueil', 'action' => 'partenaires', 'id'=>'menu_partenaires' )); ?></li>
			<li><?php echo href(__('com.menu.admin',false),array ('controleur' => 'admin', 'id'=>'menu_admin' )); ?></li>
	
			<li class="transition"></li>
			<li id="pub">
				<a href="http://www.zkup.net" title="zKup script de gestion de tournoi"><img src="<?php echo www_t().'images/about.jpg'; ?>" alt="zkup gestion de competitions" /></a>
			</li>
		</ul>
	</div>
	
	<div id="corps">
        <div id="sidebar">
		<?php
		echo zk_block_membre();

		echo zk_block_matchs_a_jouer(__('com.bloc.matchs.a_jouer'),OPT_BLOC_MATCHS_LIMIT);
		echo zk_block_matchs_joues(__('com.bloc.matchs.joues'),OPT_BLOC_MATCHS_LIMIT);

		echo zk_block_comp_en_cours	(__('com.bloc.tournois.en_cours'),OPT_BLOC_MATCHS_LIMIT);
		echo zk_block_comp_closes	(__('com.bloc.tournois.clos'),OPT_BLOC_MATCHS_LIMIT);

		echo zk_block_partenaires();

		//Nouveaux blocks : zk_block_..._en_cours(TITRE DU BLOC, NOMBRE MAX D'ELEMENT)

		//Blocks pour les tournois
		//echo zk_block_tn_en_cours	(__('com.sel.etats_tournoi.en_cours.tournois'),OPT_BLOC_MATCHS_LIMIT);
		//echo zk_block_tn_clos	(__('com.sel.etats_tournoi.clos.tournois'),OPT_BLOC_MATCHS_LIMIT);

		//Blocks pour les coupes
		//echo zk_block_coup_en_cours	(__('com.sel.etats_tournoi.en_cours.coupes'),OPT_BLOC_MATCHS_LIMIT);
		//echo zk_block_coup_clos	(__('com.sel.etats_tournoi.clos.coupes'),OPT_BLOC_MATCHS_LIMIT);

		//Blocks pour les championnats
		//echo zk_block_champ_en_cours	(__('com.sel.etats_tournoi.en_cours.champs'),OPT_BLOC_MATCHS_LIMIT);
		//echo zk_block_champ_clos	(__('com.sel.etats_tournoi.clos.champs'),OPT_BLOC_MATCHS_LIMIT);

		//Blocks pour les ladders
		//echo zk_block_lad_en_cours	(__('com.sel.etats_tournoi.en_cours.lads'),OPT_BLOC_MATCHS_LIMIT);
		//echo zk_block_lad_clos	(__('com.sel.etats_tournoi.clos.lads'),OPT_BLOC_MATCHS_LIMIT);

		//Blocks pour les ligues
		//echo zk_block_lig_en_cours	(__('com.sel.etats_tournoi.en_cours.ligues'),OPT_BLOC_MATCHS_LIMIT);
		//echo zk_block_lig_clos	(__('com.sel.etats_tournoi.clos.ligues'),OPT_BLOC_MATCHS_LIMIT);


		?>


		</div>
        <div id="rightpane">
            <?php echo zk_block_shoutbox(); ?>
            <?php echo zk_block_online(__('com.block.online')); ?>
            <?php echo zk_block_players_online(__('com.block.playersonline')); ?>
            <?php echo zk_block_admin_online(__('com.block.adminsonline')); ?>
        </div>
		<div id="content">
		<?php echo zk_content(); ?>	
		</div>
        <div class="clean">&nbsp;</div>
    </div>
    <div id="footer">&copy; 2011 - <a href="http://www.zkup.net" title="gestionnaire de competitions, tournois, coupes, ligues, ladders, championnats">zKup.net</a></div>
</div>


<?php echo zk_footer(); ?>

<div id="box_ui" style="cursor: default"></div>
<div id="TB_ajaxContent"></div>
<script type="text/javascript">

$(function() {
	$("#box_ui").hide();
	$('.blockOverlay').attr('title','Fermer').click($.unblockUI);

	$('a.toggle-block').click(function(e){
		e.preventDefault();
		$(this).parent().parent('.block').children('.block-content').children('div').toggle();
		return false;
	});
	
	$('a.equipe').click(function(e) {
		e.preventDefault();
		$("#box_ui").html("chargement en cours");

		$.ajax({
			url: this.href,
			cache: false,
			success: function(html){
				$("#box_ui").html(html);
			}
		});

		$.blockUI({
            message: $('#box_ui'),
			css: { top: '10%', width: '' }
		});

		return false;
	});
	
	$('a.ajax').click(function(e) {
		e.preventDefault();
		
		$.ajax({
			url: $(this).attr('href'),
			cache: false,
			success: function(html){
				$("#box_ui").html("chargement en cours");
				$("#box_ui").html(html);
				$.blockUI({
		            message: $('#box_ui'),
					css: { top: '10%', width: '500px', height: '380px' }
				});
			},
			error: function (request, status, error) {
				$.unblockUI();
		    }
		});

		

		return false;
	});
	
});
	</script>

</body>
</html>
et voici le style.css
body, div, dl, dt, dd, ol, ul, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
    margin: 0;
    padding: 0;
}

html {
    height: 100%;
}

a img {
    border: 0 none;
}

/* ul { list-style: square; text-align: left; } */
body {
    font-size: 13px;
    font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
    background: #fafafa;
    color: black;
}

/*
*, html * {
    border: 0; margin: 0; padding: 0;
}*/

.tal {
    text-align: left !important;
}

.tar {
    text-align: right !important;
}

.tac {
    text-align: center !important;
}

table {
    margin: 0 auto;
}

.ui-tabs .ui-tabs-hide {
    display: none;
}

a, a:visited {
    color: black;
    text-decoration: none;
    border-bottom: 1px dotted black;
}

a:hover {
    border-bottom: 1px solid black;
}

#conteneur {

}

#header {
    height: 100px;
    background: #1e1e1e url('../images/header.jpg') top center no-repeat;
}

#menu {
    height: 35px;
    line-height: 35px;
    background: url('../images/boutons_bg.jpg') top left repeat-x;
}

#menu a, #menu a:hover {
    color: white;
    border: 0 none;
    font-variant: small-caps;
    font-size: 14px;
}

#menu a:hover {
    border-bottom: 2px solid white;
}

#menu li {
    list-style: none;
    display: inline;
    padding-left: 20px;
}

#menu li#pub {
    position: absolute;
    right: 0;
    margin-right: 0;
    padding-left: 0;
}

#menu li#pub a:hover {
    border-bottom: 0 none;
}

#corps {
    margin: 0 auto;
    text-align: left;
    background: #fafafa url('../images/bg_contenu.jpg') top left repeat-x;
    padding-top: 20px;
    position: relative;
}

#content {
    margin: 0 230px 40px 230px;
    background: #fafafa;
    border: 1px solid #d0d0d0;
    padding: 20px;
    position: relative;
}

#content h1 {
    color: #0f236c;
    margin: 0 auto 0 auto;
    font-variant: small-caps;
    border-bottom: 1px solid #0f236c;
}

#content h2 {
    color: #0f236c;
    margin: 0 auto 5px auto;
    padding: 0 10px;
    font-variant: small-caps;
    font-style: italic;
    background: #efefef;
}

#sidebar {
    width: 220px;
    position: absolute;
    left: 0px;
    padding-top: 2px;
}

#sidebar h2 {
    font-size: 18px;
    background: #f0f0f0;
    border-bottom: 2px solid blue;
    font-weight: normal;
    padding-left: 5px;
}

#rightpane {
    width: 220px;
    padding-top: 2px;
    position: absolute;
    right: 0px;
}

#footer {
    text-align: center;
    font-size: 11px;
}

div.block {
    width: 213px;
    margin: 0 3px 20px 3px;
    background: url('../images/bg_block.png') top left repeat-y;
}

div.block h4 {
    background: url('../images/head_block.png') top left no-repeat;

    color: #0f236c;
    text-align: center;
    height: 15px;
    padding-top: 8px;
    position: relative;
    top: -5px;
    font-variant: small-caps;
}

div.block div {
    width: 199px;
    border-bottom: 1px solid #bababa;
    border-top: 1px solid #bababa;
    margin: 0 auto;
}

div.block div div {
    border: 0 none;
}

.toggle-block {
    border: 0 none;
    float: right;
    margin-right: 10px;
    margin-top: 2px;
}

div.block form#flogin {
    margin: 20px auto 0 auto;
    width: 150px;
}

div.block form#flogin input[type=text], div.block form#flogin input[type=password] {
    display: block;
    margin: 2px auto;
    width: 100%;
}
#flogin input[type=submit] {
    padding: 3px 5px;
}
div#help {
    border-bottom: 0 none;
    font-size: 10px;
    margin-top: 10px;
    padding: 0;
    text-align: center
}
#fseleq {
    margin: 15px auto 30px auto;
}


div.block form#flogin a:hover {
    color: #ffa500;
}

div.block form#flogin a {
    border: 0 none;
}

#sidebar_membre {
    list-style: none;
}

#sidebar_membre li, #sidebar_membre li a {
    margin: 0;
    padding: 0;
}

#sidebar_membre li {
}

#sidebar_membre li a {
    padding-left: 20px;
    display: block;
    border-bottom: 1px solid #dddddd;
}

#sidebar_membre li a:hover {
    background: #eaeaea;
    border-right: 3px solid #ffa500;
    color: #5d5d5d;
}

table.listeMatchs {
    width: 100%;
    text-align: center;
}

table.listeMatchs tr td,
table.listeMatchs caption {
    border-bottom: 1px solid #eaeaea;
}

table.listeMatchs tr td {
    height: 16px;
    overflow: hidden;
}

table.listeMatchs tr td.eq {
    width: 72px;
    font-size: 11px;
    background: none;
}

table.listeMatchs tr td.s {
    width: 20px;
}

table.listeMatchs tr td.g {
    text-align: left;
    padding-left: 5px;
    width: auto !important;
}

table.listeMatchs tr td.d {
    text-align: right;
    padding-right: 5px;
    width: auto !important;
}

table.listeMatchs tr td.infos {
    width: 16px;
}

table.listeMatchs tr td.infos a {
    border: 0 none;
}

table.listeMatchs tr td.infos a img {
    border: 0 none;
}

ul.listeTournois {
    list-style: none;
}

ul.listeTournois li {
    border-bottom: 1px solid #eaeaea;
}

ul.listeTournois li img {
    vertical-align: middle;
}

ul.listeTournois li a {
    display: block;
    border: 0 none;
    line-height: 20px;
    padding-left: 10px;
}

ul.listeTournois li a:hover {
    background: #eaeaea;
    color: #5d5d5d;
}

#copyright {
    display: block;
    position: fixed;
    bottom: 0;
    background: url('../images/menu_bg2.jpg') top left repeat-x;
    border-top: 1px dashed #ddd;
    width: 100%;
    text-align: center;
    font-size: 11px;
}

td {
    font-size: 12px;
}

table.arbre, table.equipes {
    width: 100%;
    border-collapse: collapse;
    text-align: center;
    margin-top: 20px;
    border-left: 1px solid #ddd;
    border-top: 1px solid #ddd;
}

table.arbre {
    width: auto;
    margin: 0 auto;
    border: 0 none;
}

table.equipes tr td {
    border-right: 1px solid #ddd;
    padding: 0 10px;
    height: 27px;
}

table.equipes tr {
    border-bottom: 1px dashed black;
}

table.equipes tr:hover {
    background: url('../images/bg_menu.jpg') top left repeat-x;
}

table.equipes td {
}

table.arbre thead th, table.equipes thead td {

}

table.equipes thead td, table.arbre thead td {
    text-align: center;
    font-weight: bold;
}

table.equipes thead {
    border: 1px solid #ddd;
    border-bottom: 1px solid black;
    background: #ddd;
}

td.ON {
    background: #b1f5a6;
    color: #1f5416;
    font-weight: bold;
}

td.OFF {
    background: #f5a6a6;
    color: #541616;
    font-weight: bold;
}

.gagnant {
    background: #caffca !important;
}

.perdant {
    background: #fecec9 !important;
}

.egalite {
    background: #ADD8E6 !important;
}

#formSuivre {
    width: 100%;
}

#col_gauche span {
    display: block;
    float: right;
    margin-left: 10px;
}

#col_gauche form, #col_gauche select, #col_gauche div div {
}

/*
##############################
##### FORMULAIRES ###############
##############################

*/

form {
    width: 100%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

fieldset {
    border: 1px dotted #047D80;
    margin: 5px 10px;
    padding: 10px;
}

fieldset legend {
    margin-left: 15px;
    padding: 0 4px;
    background-color: inherit; /*HACK IE*/
}

/* CAS ERREUR */
div.err {
    margin: 10px auto;
    padding: 5px 10px;
    border: 1px solid #cd0a0a;
    color: #cd0a0a;
    background: #fef1ec;
    width: 300px;
}

div.err ul {
    list-style-image: url('../images/icons/error_red.png');
}

/* CAS NORMAL */

form input[type=submit]:hover {

}

form input[type=text]:focus {
/*height: 30px;*/
/*background-color: white !important;*/
/*color: black !important;*/
/*border: 1px solid green;*/
    background: #efefef;
}

form label {
    font-size: 0.8em;
    padding-left: 10px;
    display: block;
    clear: both;
    border-bottom: 1px dotted #047D80;
}

form label span {
    padding-top: 5px;
    padding-bottom: 5px;
    display: block;
    float: left;
    width: 50%;
}

form span.btn {
    display: block;
    width: 95%;
    text-align: right;
    float: none;
}

form span.btn input {
    float: right;
    width: 30%;
    height: inherit;
    display: block;
    margin: 2px;
    border: 1px dotted #00FF33;
}

form input[type=submit] {
    padding: 2px 4px;
}

form textarea#moyen {
    width: 95%;
    height: 300px;
}

form textarea#grand {
    width: 95%;
    height: 600px;
}

form input.cache {
    display: none;
}
#reglement {
	overflow: hidden;
}
#tabs-resume {
	overflow: hidden;
}
input.btn {
    border: 1px solid black;
    margin-right: 10px;
    text-align: center;
}

input.btn:hover, input.btn:focus {
    background-color: black;
    color: white;
    border: 1px solid black;
}

div#tournoi_suivi {
}

div#tournoi_suivi form {
}

div#tournoi_suivi form span {
}

div#tournoi_suivi form select {
}

table#gerer {
    margin: 5px auto;
    text-align: center;
    border-collapse: collapse;
    border: 1px solid black;
}

table#gerer th {
    background: #eee;
    padding: 0 10px;
    border-bottom: 1px solid black;
    height: 25px;
    line-height: 25px;
}

table#gerer tr td {
    border-right: 1px solid black;
    border-left: 1px solid black;
    padding: 0 10px;
    height: 20px;
    line-height: 20px;
}

table#gerer tr:hover {
    background: url('../images/bg_menu.jpg') top left repeat-x !important;
}

table#gerer tr td.ON {
    font-weight: bold;
    background: #b1f5a6;
    color: #1f5416;
}

table#gerer tr td.OFF {
    font-weight: bold;
    background: #f5a6a6;
    color: #541616;
}

table#gerer tr td.colonne_sel, table#gerer thead th.colonne_sel {
    width: 15px;
}

table#gerer tr td.colonne_sel input, table#gerer thead th.colonne_sel input {
    float: left;
    width: 15px;
    height: 15px;
}

table#gerer tr.pair {
    background: #f7f7f7;
}

table#gerer tr.impair td {

    border-top: 1px dashed #bbb;
    border-bottom: 1px dashed #bbb;
}

/* Ajout du 31/10/2007 */
p.score {
    display: block;
    float: right;
    font-size: 10px;
    font-family: tahoma,serif;
    margin-right: 2px;
    line-height: 20px;
}

td.g {
    text-align: right;
    width: 200px;
    padding-right: 10px;
}

td.d {
    text-align: left;
}

td.d select, td.d input {
    display: block !important;
}
.profil ul {
    list-style: none;
}
table.profil {
    width: 98%;
}

table.profil tr td {
    border-bottom: 1px dotted #bbb;
}

table.profil tr td.g {
    border-right: 1px dotted #bbb;
    background: none !important;
}

table.profil tr td.d {
    padding-left: 10px;
    background: none !important;
}

#maj {
    width: 400px;
    border: 2px solid #c79316;
    background: #fae896;
    color: #8a660e;
    margin: 10px auto;
    padding: 10px;
}

/*
	STYLE ARBRE TOURNOI
*/

table.arbre {
    width: 90%;
    border-collapse: collapse;
    margin: 0 auto;
}

table.arbre tr {
}

table.arbre tr td.eq {
    width: 120px;
    text-align: left;
}

#winner {

}

/*
.s { width: 15px; }
.eq { background: #e7e7e7; }
.d { background: url('../images/noir/coin_d.png') top left no-repeat; }
.f { background: url('../images/noir/coin_f.png') top left no-repeat; }
.i { background: url('../images/noir/coin_i.png') top left no-repeat; }
.m { background: url('../images/noir/coin_m.png') top left no-repeat; }
*/
.tableVoir {

}

.tableVoir tr {

}

.tableVoir tr td {
    padding: 5px 10px;
    border: 1px solid #f0f0f0;
}

.tableVoir tr th {
    font-weight: bold;
}

/*
    STYLE ARBRE TOURNOI
*/

table.arbre {
    width: auto !important;
    border-collapse: collapse;
    margin: 0 auto;
}

table.arbre tr {
}

table.arbre tr td {
    font-size: 11px;
}

#winner {
    text-align: center;
}

table.arbre tr td.s {
    width: 15px;
}

table.arbre tr td.eq {
    background: url('../images/bg_eq.jpg') bottom left repeat-x;
    border: 0 none;
    border-right: 1px solid #bababa;
    border-left: 1px solid #bababa;
}

table.arbre tr td.eq:hover {
    background-position: top;
}

table.arbre tr td.eq a.equipe {
    display: block;
    overflow: hidden;
    text-decoration: none;
    color: black;
    font-size: 10px;
    border-top: 1px dotted #0a0a0a;
    border-bottom: 1px dotted #0a0a0a;
}

table.arbre tr td.eq a.equipe:hover {
    color: white;
    border-top: 1px dotted #0a0a0a;
    border-bottom: 1px dotted #0a0a0a;
}

table.arbre tr td.eq a.equipe:hover span {
    color: black;
}

table.arbre tr td.d {
    background: url('../images/noir/coin_d.png') 0 0 no-repeat;
}

table.arbre tr td.f {
    background: url('../images/noir/coin_f.png') 0 0 no-repeat;
}

table.arbre tr td.i {
    background: url('../images/noir/coin_i.png') 0 0 no-repeat;
}

table.arbre tr td.m {
    background: url('../images/noir/coin_m.png') 0 0 no-repeat;
}

table.arbre tr td.bd {
    background: url('../images/noir/coin_bd.png') 0 0 no-repeat;
}

table.arbre tr td.hd {
    background: url('../images/noir/coin_hd.png') 0 0 no-repeat;
}

table.arbre tr td.hbg {
    background: url('../images/noir/coin_hbg.png') 0 0 no-repeat;
}

table.arbre tr td.eq a.equipe span.s {
    display: block;
    float: left;
    text-align: center;
    border-right: 1px solid black;
    margin-right: 3px; /*width: 14px;*/
    width: auto !important;
    padding: 0 2px;
}

input.ok,
input.annuler,
input.imprimer,
input.retour,
input.valider,
input.refuser,
input.signaler {
    border: 0;
    margin: 0;
    padding: 0;
    width: 91px;
    height: 21px;
}

input.ok:hover,
input.annuler:hover,
input.imprimer:hover,
input.retour:hover,
input.valider:hover,
input.refuser:hover,
input.signaler:hover {
    background-position: bottom left;
    border: 0 none;
}

input.ok:focus,
input.annuler:focus,
input.imprimer:focus,
input.retour:focus,
input.valider:focus,
input.refuser:focus,
input.signaler:focus {
    border: 0 none;
}

input.ok, input.ok:focus {
    background: url('../images/buttons/ok.jpg') top left no-repeat;
}

input.annuler, input.annuler:focus {
    background: url('../images/buttons/annuler.jpg') top left no-repeat;
}

input.imprimer, input.imprimer:focus {
    background: url('../images/buttons/imprimer.jpg') top left no-repeat;
}

input.retour, input.retour:focus {
    background: url('../images/buttons/retour.jpg') top left no-repeat;
}

input.valider, input.valider:focus {
    background: url('../images/buttons/valider.jpg') top left no-repeat;
}

input.refuser, input.refuser:focus {
    background: url('../images/buttons/refuser.jpg') top left no-repeat;
}

input.signaler, input.signaler:focus {
    background: url('../images/buttons/signaler.jpg') top left no-repeat;
}

div.loading {
    margin: 5px;
    background: url('../images/loading.gif') top left no-repeat;
    height: 32px;
    line-height: 32px;
}

input.asHref {
    background: none !important;
    border: 0 none;
    border-bottom: 1px solid #047D80 !important;
}

input.asHref:hover {
    border: 0 none !important;
    border-bottom: 1px solid #0099FF !important;
}

span.eq_etat_normal img,
span.eq_etat_premium img,
span.eq_etat_sup img {
    position: relative;
    top: 2px;
}

span.eq_etat_normal,
span.eq_etat_normal a {

}

span.eq_etat_premium,
span.eq_etat_premium a {
    color: #ffa500 !important;
    font-weight: bold !important;
}

span.eq_etat_sup,
span.eq_etat_sup a {
    color: #545454 !important;
    font-style: italic !important;
}

span.joueur_membre a {
    color: red;
}

.non_joue .eq_etat_normal {
    color: #888;
}

.tabRencontres {
    width: 280px;
    font-size: 12px;
    border: 1px solid black;
    margin: 20px;
    float: left;
}

.tabRencontres td {
    vertical-align: middle;
}

.tabRencontres tr th {
    border-bottom: 1px solid black;
}

.tabRencontres tr td.eq {
    width: 150px;
    padding-left: 5px;
}

.tabRencontres tr.pair td {
    background: #fafafa;
    border-bottom: 1px solid #d0d0d0;
}

.tabRencontres tr.impair td {
    background: #ececec;
    border-bottom: 1px solid #c0c0c0;
}

.tabRencontres tr.joue td {

}

.tour {
    background: #f0f0f0;
    text-align: center;
    border: 1px solid black;
    font-size: 22px;
    font-weight: bold;
    height: 40px;
}

.poule {
    background: #d0d0d0;
    text-align: center;
}

.small {
    width: 30px;
    padding: 0;
    text-align: center;
    border-left: 1px solid #b0b0b0;
    border-right: 1px solid #b0b0b0;
}

.a_jouer td {

}

.a_valider td {
    background: #caffca !important;
}

.non_joue td {
    color: #cacaca;
}

.winner {
    font-weight: bold;
}

/* rentrerScore / Rencontres */
table.un_jeu {
    border-top: 1px solid black;
    margin-top: 10px;
    padding-top: 10px;
}

table.total_scores {
    margin-top: 10px;
    padding-top: 0;
}

table.un_jeu tr td {
    text-align: center;
    vertical-align: middle;
    border: 1px solid #eaeaea;
}

table.un_jeu tr td.score,
table.un_jeu tr td.score input {
    width: 100px;
}

table.un_jeu tr td.premier {
    width: 90px;
}

table.un_jeu tr td input.edit_map {
    width: 90px;
}

table.un_jeu tr td.map_serv input.edit_serveur {
    width: 180px;
}

table.total_scores tr td.gagnant {
    background: #caffca;
}

table.total_scores tr td.perdant {
    background: #fecec9;
}

table.total_scores tr td.egalite {
    background: #ADD8E6;
}

/* FIN - rentrerScore / Rencontres */

.ui-tabs .ui-tabs-hide {
    display: none;
}

div.clean {
    clear: both;
    height: 0;
    margin: 0;
    border: 0 none !important;
}

hr.espace {
    border: 0 none;
    border-bottom: 1px solid #dadada;
    margin: 20px 0;
    clear: both;
}

.noBorder {
    border: 0 none;
}

/* Style partenaires */

div.un_partenaire {
    border: 1px dashed #dadada;
    margin: 20px;
    padding: 10px 20px;
    position: relative;
}

div.un_partenaire div.image {
    position: relative;
	margin: 10px 20px;
}

div.un_partenaire h2 a {
    border: 0 none;
}

ul.partenaires {
    list-style: none;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    margin: 0;
}

ul.partenaires li {
    padding: 3px 0;
    border-bottom: 1px solid #dadada;
}

ul.partenaires li:hover {
    background: #eaeaea;
}

ul.partenaires li a {
    border-bottom: 0 none;
}

ul.partenaires img {
    width: 198px;
}


.equipes-participantes div {
    border: 1px solid #dadada;
    background: #f3f3f3;
    margin: 5px 10px;
    display: block;
    width: 180px;
    height: 40px;
    float: left;
    overflow: hidden;
}

.equipes-participantes .eq_etat_sup {
    display: none;
}
.equipes-participantes a:hover {
    border: 0 none;
    border-left: 1px solid #ffa500;
    background: #eaeaea;
}

.equipes-participantes a {
    float: right;
    display: block;
    height: 40px;
    width: 130px;
    line-height: 40px;
    padding-left: 10px;
    border: 0 none;
    border-left: 1px solid #bababa;
    overflow: hidden;
    font-family: tahoma,sans-serif;
}

.equipes-participantes img {
    margin-top: 10px;
    margin-left: 5px;
}

iframe.pdf {
    width: 100%;
    height: 800px;
}

.poules_coupe {
    width: 350px;
    float: left;
    font-size: 11px;
    border: 1px solid black;
    margin: 10px;
}

.poules_coupe tr {

}

.poules_coupe tr th, .tabRencontres tr th {
    border-bottom: 1px solid black;
    text-align: center;
}

.poules_coupe *, .tabRencontres * {
    font-size: 11px !important;
}

.poules_coupe caption, .tabRencontres caption {
    font-size: 16px !important;
    font-weight: bold;
    margin: 0 !important;
    padding: 0 !important;
}

.tabRencontres a {
    border: 0 none;
}

.tabRencontres tr td.winner {
    background: #caffac !important;
}

.tabRencontres tr td.perdant {
    background: #fecec9 !important;
}

.poules_coupe tr td {
    padding-left: 5px;
    height: 20px;
    line-height: 20px;
    background: #ececec;
    border-bottom: 1px solid #c0c0c0;
    border-left: 1px solid #c0c0c0;
}

.poules_coupe tr.pair td {
    background: #fafafa;
    border-bottom: 1px solid #d0d0d0;
}

.poules_coupe tr td.small {
    width: 24px;
    text-align: center;
    padding-left: 0;
}

.poules_coupe tr.pair td.small {
    background: #fafafa;
}

.poules_coupe tr td.PTS {
    font-weight: bold;
    border-left: 1px solid #b0b0b0;
}

#side_equipe {
    width: 200px;
    float: left;
    text-align: center;
    height: 1%;
    min-height: 200px;
    position: relative;
}

#side_equipe img {
    width: 200px;
}

#content_equipe {
    margin-left: 210px;
    height: 1%;
    position: relative;
}

table.profil {
    text-align: left !important;
}

table.profil tr td {
    border-bottom: 1px dashed #aaaaaa;
    height: 30px;
    line-height: 30px;
}

table.profil tr td.g {
    text-align: left;
}

table.profil tr td.caption {
    font-size: 1.45em;
    font-weight: bold;
    border-bottom: 1px solid black;
    text-align: left !important;
}

table.profil tr td.caption a {
    border-bottom: 0 none;
}

table.profil tr td.caption a img {

}

table.profil tr td.caption small {
    font-size: 0.6em !important;
    color: #4a4a4a;
}

ul#langues {
    float: right;
}

ul#langues li {
    display: inline;
}

.arbre * {
    font-size: 9px;
    font-family: sans-serif;
    border: 0 none !important;
    margin: 0 !important;
    padding: 0 !important;
    vertical-align: middle;
}

.arbre caption {
    font-size: 14px;
    font-weight: bold;
}

.arbre tr td {
    height: 20px;
}

table.arbre tr td.eq a.equipe span.s {
    display: block !important;
    float: left !important;
    margin-right: 0 !important;
    text-align: center;
    width: 30px !important;
    border-right: 1px solid black !important;
    height: 19px;
    line-height: 20px !important;
}

span.eq_etat_normal img, span.eq_etat_premium img, span.eq_etat_sup img {
    position: static;
    
}

table.arbre tr td.eq a.equipe {
    height: 19px;
    border: 0 none;
    line-height: 20px !important;
    border-left: 1px solid black !important;
}

table.arbre tr td.eq a.equipe:hover {
    border: 0 none;
    border-bottom: 1px solid black;
    border-left: 1px solid black !important;
}

table.blocListeMatchs * {
    font-size: 9px;
    font-family: sans-serif;
}

table.blocListeMatchs caption {
    font-size: 11px;
    font-weight: bold;
}

table.blocListeMatchs tr td {
    height: 12px;
    overflow: hidden;
}

table.blocListeMatchs tr td a {
    overflow: hidden;
    display: block;
    height: 12px;
    border: 0 none !important;
}

table.blocListeMatchs tr td a:hover {
    background: #f9f9f9;
}

table.blocListeMatchs tr td.eq {
    width: 40% !important;
}

table.blocListeMatchs tr td.vs {
    width: 20% !important;
}

table.blocListeMatchs tr td.s {
    width: 10% !important;
}

table.blocListeMatchs tr td.ss {
    width: 5% !important;
}

table.blocListeMatchs tr td.infos {
    width: 5% !important;
}

table.pageLesMatchs {
    width: 100%;
    margin: 0 auto !important;
    border: 3px solid #eaeaea;
    padding: 10px;
}

table.pageLesMatchs * {
    font-size: 12px;
}

table.pageLesMatchs caption {
    font-size: 16px !important;
    padding-top: 30px;
    padding-bottom: 2px;
}

table.pageLesMatchs caption a {
    font-size: 16px !important;
}

table.pageLesMatchs tr td {
    height: 20px;
}

table.pageLesMatchs img {
    margin-top: 2px;
}

table.pageLesMatchs a {
    height: 20px !important;
    line-height: 20px !important;
    vertical-align: middle;
}

table.pageLesMatchs tr td.date_m {
    width: 90px;
    font-size: 9px;
    text-align: center;
}

table.pageLesMatchs tr td.eq {
    width: 100px !important;
    text-align: center;
}

.gagnant span a {
    background: #EEFFEE !important;
}

.perdant span a {
    background: #FFE4E1 !important;
}

.nod *.d {
    background: none !important;
}

ul.classement-ligue {
    width: 800px;
    margin: 0 auto;
}

ul.classement-ligue li.pou {
    width: 350px;
    display: block;
    float: left;
    margin: 10px 10px 20px 10px;
}

ul.classement-ligue li.une-poule {
    width: 800px;
}

ul.classement-ligue ul.connectedSortable {
    width: 360px;
    margin: 0 auto;
    border: 1px solid #dadada;
}

ul.classement-ligue ul.connectedSortable li {
    width: 360px;
    margin: 0 auto;
}

ul.classement-ligue input.nom-poule {
    margin: 0 auto;
    display: block;
    width: 360px;
    font-size: 1.4em;
    font-family: sans-serif;
    text-align: center;
    background: rgb(249, 250, 235);
    border: 1px solid #bababa;
}

ul.classement-ligue li.une-poule table.poules_coupe {
    margin-left: 200px;
}

div.par-poule {
    float: left;
    margin: 0 auto;
}

div.par-poule .poule-matchs {
    margin: 40px;
}

div.par-poule .interieur {
    width: 370px;
    margin: 0 auto;
}

.un-article {
    border: 1px solid #dadada;
    margin: 20px auto 40px auto;
}

.un-article .titre {
    border-bottom: 1px solid black;
    padding: 10px !important;
    position: relative;
}

.un-article .infos {
    font-size: 0.6em;
    font-family: sans-serif;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
}

.un-article .article {
    padding: 10px;
    overflow: hidden;
}

.un-article-seul {
    margin: 0 auto;
}

.paginate {
    margin: 10px auto;
    text-align: center;
}

.paginate li {
    display: inline;
}

.paginate li a {

}

.paginate li.current span {
    font-weight: bold;
    color: red !important;
}

#mes-messages {
    width: 95%;
    border: 3px solid #FFF;
    border-bottom: 0 none;
    margin: 20px auto;
}

#mes-messages td {
    height: 45px;
    padding: 0;
    border-bottom: 1px solid #FFF;
}

#mes-messages tr.nonlu:hover td {
    background: #c3e3f8;
}

#mes-messages .nonlu {
    background: #dbf1ff;
}

#mes-messages tr.lu:hover td {
    background: #efefef;
}

#mes-messages .lu {
    background: #f4f4f4;
}

#mes-messages .auteur {
    display: block;
    margin-bottom: 5px;
}

#mes-messages td.gauche {
    width: 100px;
    border-right: 1px solid #FFF;
    padding: 5px 0 5px 10px;
}

#mes-messages td.droite {
    width: 32px;
    text-align: center;
}

#mes-messages td.droite a {
    border: 0 none;
}

#mes-messages .message {
    font-weight: bold;
    overflow: hidden;
}

#mes-messages .message img {
    vertical-align: middle;
}

#mes-messages .message a {
    display: block;
    height: 45px;
    line-height: 45px;
    padding-left: 15px;
    border: 0 none;
}

.un-message {
    margin: 20px auto;
    padding: 20px;
    border: 1px dashed #ddd;
    overflow: hidden;
}

.un-message ul {
    margin-left: 20px;
}

.mes-date {
    position: absolute;
    right: 20px;
}

.com-content {
    float: left;
}

.com-delete {
    float: right;
}

.com-delete, .com-delete:hover {
    border: none !important;
}

/* TextboxList sample CSS */
ul.holder {
    margin: 0;
    border: 1px solid #999;
    overflow: hidden;
    height: 1%;
    padding: 4px 5px 0;
}

*:first-child+html ul.holder {
    padding-bottom: 2px;
}

* html ul.holder {
    padding-bottom: 2px;
}

/* ie7 and below */
ul.holder li {
    float: left;
    list-style-type: none;
    margin: 0 5px 4px 0;
    white-space: nowrap;
}

ul.holder li.bit-box, ul.holder li.bit-input input {
    font: 11px "Lucida Grande", "Verdana";
}

ul.holder li.bit-box {
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    border: 1px solid #CAD8F3;
    background: #DEE7F8;
    padding: 1px 5px 2px;
}

ul.holder li.bit-box-focus {
    border-color: #598BEC;
    background: #598BEC;
    color: #fff;
}

ul.holder li.bit-input input {
    width: auto;
    overflow: visible;
    margin: 0;
    border: 0;
    outline: 0;
    padding: 3px 0 2px;
}

/* no left/right padding here please */
ul.holder li.bit-input input.smallinput {
    width: 20px;
}

/* Facebook demo CSS */
#add {
    border: 1px solid #999;
    width: 550px;
    margin: 50px;
    padding: 20px 30px 10px;
}

form ol li {
    list-style-type: none;
}

form ol {
    font: 11px "Lucida Grande", "Verdana";
    margin: 0;
    padding: 0;
}

form ol li.input-text {
    margin-bottom: 10px;
    list-style-type: none;
    padding-bottom: 10px;
}

form ol li.input-text label {
    font-weight: bold;
    cursor: pointer;
    display: block;
    font-size: 13px;
    margin-bottom: 10px;
}

form ol li.input-text input {
    width: 500px;
    padding: 5px 5px 6px;
    font: 11px "Lucida Grande", "Verdana";
    border: 1px solid #999;
}

form ul.holder {
    width: 500px;
}

form ul {
    margin: 0 !important
}

ul.holder li.bit-box, #apple-list ul.holder li.bit-box {
    padding-right: 15px;
    position: relative;
    z-index: 1000;
}

#apple-list ul.holder li.bit-input {
    margin: 0;
}

#apple-list ul.holder li.bit-input input.smallinput {
    width: 5px;
}

ul.holder li.bit-hover {
    background: #BBCEF1;
    border: 1px solid #6D95E0;
}

ul.holder li.bit-box-focus {
    border-color: #598BEC;
    background: #598BEC;
    color: #fff;
}

ul.holder li.bit-box a.closebutton {
    position: absolute;
    right: 4px;
    top: 5px;
    display: block;
    width: 7px;
    height: 7px;
    font-size: 1px;
    background: url('../../../../webroot/images/close.gif');
    border-bottom: 0 none;
}

ul.holder li.bit-box a.closebutton:hover {
    background-position: 7px;
}

ul.holder li.bit-box-focus a.closebutton, ul.holder li.bit-box-focus a.closebutton:hover {
    background-position: bottom;
}

/* Autocompleter */

.facebook-auto {
    display: none;
    position: absolute;
    width: 512px;
    background: #eee;
}

.facebook-auto .default {
    padding: 5px 7px;
    border: 1px solid #cccccc;
    /*border-width: 0 1px 1px;*/
    font-family: "Lucida Grande", "Verdana",sans-serif;
    font-size: 11px;
}

.facebook-auto ul {
    display: none;
    margin: 0;
    padding: 0;
    overflow: auto;
    position: absolute;
    z-index: 9999
}

.facebook-auto ul li {
    padding: 5px 12px;
    z-index: 1000;
    cursor: pointer;
    margin: 0;
    list-style-type: none;
    border: 1px solid #cccccc;
    /*border-width: 0 1px 1px;*/
    font: 11px "Lucida Grande", "Verdana";
    background-color: #eee
}

.facebook-auto ul li em {
    font-weight: bold;
    font-style: normal;
    background: #ccc;
}

.facebook-auto ul li.auto-focus {
    background: #4173CC;
    color: #fff;
}

.facebook-auto ul li.auto-focus em {
    background: none;
}

.deleted {
    background-color: #4173CC !important;
    color: #ffffff !important;
}

.hidden {
    display: none;
}

#demo ul.holder li.bit-input input {
    padding: 2px 0 1px;
    border: 1px solid #999;
}

.ie6fix {
    height: 1px;
    width: 1px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.supprim-logo {
    margin-top: 10px;
}

.table-css {
    width: 600px;
    margin: 10px auto;
    border-spacing: 0;
    font-size: 11px;
}

.table-css-100 {
    width: 100%;
}

.table-css caption {
    height: 40px;
    line-height: 40px;
    font-size: 16px;
    font-weight: bold;
}

.table-css thead tr td {
    background: #BBB;
    border: 1px solid #888;
}

.table-css td {
    height: 25px;
    padding: 2px 4px;
    text-align: center;
    vertical-align: middle;
    border: 1px solid #aaa;
    background: white;
}

.table-css-noborder, .table-css-noborder tr, .table-css-noborder td {
    border: 0 none;
}

.table-css td.top {
    vertical-align: top;
}

.table-css tr.pair td {
    background: #fafafa;
}

.table-css tr.impair td {
    background: #f0f0f0;
}

.table-css .g {
    width: 100px;
    text-align: right;
}

.table-css label {
    border: 0 none;
    padding: 0;
}

.table-css .d {
    width: 200px;
}

.table-css .d input, .table-css .d textarea, .table-css .d select {
    width: 100%;
}

.sep-matchs {
    background: #ddd;
    height: 20px;
    line-height: 20px;
    font-weight: bold;
}

.une_colonne caption {
    font-size: 14px;
    font-weight: bold;
}

/* CSS Types de Membres */
.j_non_valide {
    color: #545454 !important;
    font-style: italic;
}

.j_membre {
}

.j_banni {
    color: red !important;
    text-decoration: line-through;
}

.j_supprime {
    color: #545454 !important;
    text-decoration: line-through;
}

.j_admin {
    color: orange !important;
}

/* Commentaires */
#commentaires {
    margin: 20px auto;
    padding: 10px;
    width: 500px;
}

#commentaires .com-form {

}

#commentaires .com-form input {
    display: block;
    margin: 10px;
}

#commentaires .com-form textarea {
    width: 100%;
    height: 100px;
    margin: 0;
}

#commentaires .com-block, #commentaires h2 {
    padding: 10px;
    width: 100%;
}

#commentaires .com-block-impair {
    background: #ddd;
}

#commentaires .com-block-pair {
    background: #f0f0f0;
}

#commentaires .com-num {
    float: right;
    font-weight: bold;
}

#commentaires p {
    margin-top: 5px;
}

.nb-com a {
    border-bottom: 0 none;
}

.nb-com a:hover {
    color: orange;
}

.nb-com {
    background: #ddd;
    border-left: 1px solid #aaa;
    position: absolute;
    top: 0;
    right: 0;
    height: 23px;
    padding: 10px;
}

/* Style Messagerie */

.mes-non-lus {
    font-weight: bold;
}

#mes-form {
    padding: 0;
}

#mes-form label {
    font-size: 1em;
    text-align: left;
}

#mes-form textarea {
    width: 450px;
    height: 230px;
    margin: 10px;
}

#mes-nouveau {
    padding: 10px;
}

#mes-nouveau form {
    text-align: left;
}

#mes-nouveau h2 {
    margin-bottom: 10px !important;
}

#mes-nouveau, #mes-nouveau textarea, #mes-nouveau ul.holder {
    width: 460px !important;
}

#mes-nouveau textarea {
    height: 200px;
}

.mes-contenu {
    height: 300px !important;
}

.right {
    float: right;
}

.left {
    float: left;
}

/*
 * Boutons
 *
 * http://www.zurb.com/blog_uploads/0000/0617/buttons-03.html
*/
.awesome, .awesome:visited {
    background: #222 url(../../../../webroot/images/alert-overlay.png) repeat-x;
    display: inline-block;
    padding: 5px 10px 6px;
    color: #fff;
    text-decoration: none;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
    text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
    border-bottom: 1px solid rgba(0, 0, 0, 0.25);
    position: relative;
    cursor: pointer;
}

.awesome:hover {
    background-color: #111;
    color: #fff;
}

.awesome:active {
    top: 1px;
}

.awesome-small.awesome, .awesome-small.awesome:visited {
    font-size: 11px;
}

.awesome, .awesome:visited,
.medium.awesome, .medium.awesome:visited {
    font-size: 13px;
    font-weight: bold;
    line-height: 1;
    text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
}

.large.awesome, .large.awesome:visited {
    font-size: 14px;
    padding: 8px 14px 9px;
}

.green.awesome, .green.awesome:visited {
    background-color: #91bd09;
}

.green.awesome:hover {
    background-color: #749a02;
}

.blue.awesome, .blue.awesome:visited {
    background-color: #2daebf;
}

.blue.awesome:hover {
    background-color: #007d9a;
}

.red.awesome, .red.awesome:visited {
    background-color: #e33100;
}

.red.awesome:hover {
    background-color: #872300;
}

.magenta.awesome, .magenta.awesome:visited {
    background-color: #a9014b;
}

.magenta.awesome:hover {
    background-color: #630030;
}

.orange.awesome, .orange.awesome:visited {
    background-color: #ff5c00;
}

.orange.awesome:hover {
    background-color: #d45500;
}

.yellow.awesome, .yellow.awesome:visited {
    background-color: #ffb515;
}

.yellow.awesome:hover {
    background-color: #fc9200;
}

/* Divers */

.w100 {
    width: 100%;
}

.h100px {
    height: 100px;
}

.h50px {
    height: 50px;
}

/* Medias */

#liste-medias {
    width: 520px;
    font-size: 12px;
}

#liste-medias td {
    padding: 4px;
}

/* Medias */

#medias a {
    border: 0 none;
    text-decoration: underline;
}

#liste-medias {
    width: 520px;
    font-size: 12px;
}

#liste-medias td {
    padding: 4px;
}

#btn-ajouter-mediasQueue {
    font-size: 12px;
}

#btn-ajouter-mediasQueue .cancel {
    display: inline !important;
}

#btn-ajouter-mediasQueue .cancel a img {
    vertical-align: bottom;
}

#btn-ajouter-mediasUploader {
    float: right;
}

#ajouter-media {
    display: none;
    text-align: left;
    margin: 20px 0;
    border: 1px dashed #dadada;
    background: #fafafa;
    padding: 20px;
    font-size: 12px;
}

.reagir {
    text-align: right;
    margin: 10px;
}

#roster {
    overflow: auto;
    height: 400px;
    width: 520px;
    font-size: 13px;
}

#roster table {
    width: 500px;
    margin: 0 auto;
}

#roster td {
    width: 50%;
    background: #f0f0f0;
    vertical-align: top;
}

#roster th {
    padding: 10px 0;
}

#roster ul {
    list-style: none;
}

#roster li {
    height: 54px;
    line-height: 54px;
    vertical-align: middle;
    display: block;
    text-align: left;
    position: relative;
    border-bottom: 2px solid #dedede;
    border-top: 1px solid #fcfcfc;
}

#roster li a {
    line-height: 54px;
    display: block;
    border-bottom: 0 none;
}

#roster li a:hover {
    background: #e0e0e0;
}

#roster .joueur-licence {
    bottom: 0;
}

#roster .joueur-date {
    top: 0;
}

#roster .joueur-licence, #roster .joueur-date {
    display: block;
    position: absolute;
    height: 20px;
    line-height: 20px;
    padding: 0 4px;
    color: #888;
    text-shadow: 1px 1px 0 #fff
}

.joueur-avatar {
    width: 50px;
    height: 50px;
    border-bottom: 1px solid #e0e0e0;
}

#roster .jl .joueur-licence, #roster .jl .joueur-date {
    left: 0;
}

#roster .jr .joueur-licence, #roster .jr .joueur-date {
    right: 0;
}

.alerte, .alerte td {
    background: #F5DADA;
}

#roster .alerte .joueur-licence, #roster .alerte .joueur-date {
    color: #555;
}

#roster .jl .joueur-avatar {
    margin: 2px 2px 0 5px;
}

#roster .jr .joueur-avatar {
    margin: 2px 5px 0 2px;
}

#roster .jl li {
    text-align: right;
}

#roster form {
    display: inline;
    margin: 0;
    padding: 0;
}

#roster input[type=image] {
    height: 12px;
}

img.activite {
    vertical-align: sub;
}

.block_online {
    padding: 5px 10px;
}

.block_players_online {
    padding: 5px;
}
.block_players_online ul {
    list-style: none;
}
#murs {
    margin-top: 10px;
}
#murs, #murs div {
    padding: 0px !important;
}

#murs .annonce {
    text-align: center;
}

#murs form {
    border: 1px solid #ddd;
    margin: 10px auto;
    width: 100%;
    background-color: white;
    height: 80px;
    margin-bottom: 30px;
}

#murs textarea {
    height: 50px;
    width: 100%;
    font-size: 1.15em;
    border: 1px solid #efefef;
    resize:none;
}
#murs form div.action_bar {
    background: #708090;
    height: 25px;
    text-align: right;
    vertical-align: middle;
}
#murs form div input {
    margin-top: 3px;
    margin-right: 3px;
}
#murs #char_count {
    width: 25px;
    background: none;
    border: 0px none;
    color: #fff;
}

#murs .murs-avatar {
    float: left;
}

#murs .murs-avatar, #murs .mur-message-avatar img {
    width: 50px;
    vertical-align: top;
    border: 1px solid #ddd;
    margin: 2px;
}
#murs .mur-message {
    border-bottom: 1px solid #ddd;
    width: 100%;
    margin: 0px auto 20px auto;
    padding-bottom: 10px !important;
}

#murs .mur-message-avatar a {
    border: 0px none;
}
#murs .mur-message-avatar {
    float: left;
}

#murs .mur-message-histoire {
    padding-left: 55px !important;
}

#murs .mur-message-histoire p {
    padding: 2px;
}

#murs #form_mur .mur-message-avatar,
#murs #form_mur .mur-message-histoire {
    height: 55px;
}
#murs .mur-message-contenu p {
    padding: 5px;
}
#murs .mur-message-contenu {
    padding-left: 65px !important;
}
#roster span.joueur {
    display: block
}
#roster a.joueur:hover {
    background: none !important;
}
#roster a.joueur {
    display: inline !important;
}

.messages-suivants {
    border: 1px solid #bbb !important;
    background: #708090;
    padding: 5px 10px;
    display: block;
    margin: 5px auto;
    width: 250px;
    text-align: center;
    color: #fff !important;
}

div#tabs div.matchmaking {
    padding: 0px;
    margin-top: 10px;
}

#form-matchmaking {
    width: 300px;
    float: right;
    border: 1px solid #ddd;
    background: white;
    margin-top: 40px !important;
}

#form-matchmaking label {
    border-bottom: 0px none;
    padding: 0px;
}

#form-matchmaking h2 {
    background: none;
    text-align: center;
}
#form-matchmaking input {
    width: 70px;
    text-align: center;
    margin-bottom: 5px;
}
#form-matchmaking input[name='MAK_DESCRIPTION'] {
    width: 250px;
}
#form-matchmaking form label span {
    float: none !important;
    width: auto !important;
    display: inline !important;
}
.matchmaking-list h3 {
    margin-left: 20px;
}

.matchmaking-list ul {
    padding: 5px 0px 20px 40px;
    list-style: none;
}

.matchmaking-list li {
    height: 25px;
}
.matchmaking-list form,.matchmaking-list input {
    display: inline !important;
    padding: 0px;
    margin: 0px;
}

.matchmaking-list abbr {
    border-bottom: 1px dotted red;
    margin: 0 5px;
    cursor: help;
}

.button-style {
  -webkit-transition-property: -webkit-box-shadow, background;
  -webkit-transition-duration: 0.25s;
    padding: 1px;
    border-bottom: 0px;
    border-left: 0px;
    border-right: 0px;
    -moz-box-shadow: 0px 0px 2px #000;
    -webkit-box-shadow: 0px 0px 2px #000;
    margin-bottom: 0px;
    background: #003399;
    width: 60px;
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#003399), to(#0066cc));
    background:  -moz-linear-gradient(19% 75% 90deg,#0066cc, #003399);
    color: #fff;
    text-transform: uppercase;
    text-shadow: #000 1px 1px;
    border-top: 1px solid #0066cc;
    margin-top: 0px;
    font-size: 0.7em;
}

.button-style:hover {
    -webkit-box-shadow: 0px 0px 2px #000;
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0066cc), to(#003399));
    background:  -moz-linear-gradient(19% 75% 90deg,#003399, #0066cc);
}

.button-style-red {
    background: #770000;
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#770000), to(#990000));
    background:  -moz-linear-gradient(19% 75% 90deg,#990000, #770000);
    border-top: 1px solid #990000;
}

.button-style-red:hover {
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#990000), to(#770000));
    background:  -moz-linear-gradient(19% 75% 90deg,#770000, #990000);
}

.profil-joueurs-equipes ul {
    list-style: none;
    padding: 0px 0px 10px 20px;
}

.listeMatchsProfil {
    width: auto !important;
    float: left !important;
    margin: 0px 20px 10px 20px;
}

.listeMatchsProfil th {
    padding: 10px 0px;
}

.listeMatchsProfil .g, .listeMatchsProfil .d {
    padding: 4px 10px !important;
}
merci pour votre aide

Re: Aide pour le placement

Posté : 25 oct. 2012, 15:59
par juliette
bon, on peut voir que tu as 3 blocs principaux...

------------------------------------------------
<div id="siderbar">
c'est le menu de gauche et il est positionner comme ca
#sidebar {
width: 220px;
position: absolute;
left: 0px;
padding-top: 2px;
}
</div>
-------------------------------------------------
<div id="content">
qui est positionner comme ca
#content {
margin: 0 230px 40px 230px;
background: #fafafa;
border: 1px solid #d0d0d0;
padding: 20px;
position: relative;
}
</div>
-------------------------------------------------
<div id="rightpane">
positionné comme ca
#rightpane {
width: 220px;
padding-top: 2px;
position: absolute;
right: 0px;
}
</div>

ce qu'il faudrait faire est d'inverser l'ordre dans le code de siderbar et content...
pour donner

< div id="content">
...
</div>
puis
< div id="siderbar">
...
</div>
puis
< div id="rightpane">
...
</div>
commence par faire ca...

Re: Aide pour le placement

Posté : 25 oct. 2012, 16:03
par juliette
si tu peux essaye de mettre tes codes avec les balise bbcode pour la colorasation...

Re: Aide pour le placement

Posté : 25 oct. 2012, 16:05
par yoyo83
Ok je vais te faire cela et pour ce que tu me demande ci je comprend c'et de placer content au dessus
de <div id="sidebar"> et <div id="rightpane"> ?

Re: Aide pour le placement

Posté : 25 oct. 2012, 16:06
par juliette
oui c'est ca mais c'est pas tout, on va y aller progressivement

Re: Aide pour le placement

Posté : 25 oct. 2012, 16:09
par yoyo83
Ok c'et fait la j'ai les blocs qui se sont placé en bas de page

Re: Aide pour le placement

Posté : 25 oct. 2012, 16:12
par juliette
attention, tu a placer <div id="content">...</div> au dessus de <div id="corp">...</div> mais les 3 div dont on parle sont contenu dans <div id="corp">...</div>

Re: Aide pour le placement

Posté : 25 oct. 2012, 16:15
par yoyo83
je vient de corriger j'ai placer comme cela

<div id="corps">
<div id="content">
<?php echo zk_content(); ?>
</div>
<div id="sidebar">

Re: Aide pour le placement

Posté : 25 oct. 2012, 16:20
par juliette
ok, maintenant, le css de content est:
#content {
margin: 0 230px 40px 230px;
background: #fafafa;
border: 1px solid #d0d0d0;
padding: 20px;
position: relative;
}
et on a cette ligne: margin: 0 230px 40px 230px; ce qui veux dure 0px de marge en haut, 230px de marge a droite, 40px de marge en bas et 230px de marge a droite
met 0px pour le dernier 230px

Re: Aide pour le placement

Posté : 25 oct. 2012, 16:22
par yoyo83
c'et fait est en même temps merci tu me fait un cours pour les explications que tu me donne

Re: Aide pour le placement

Posté : 25 oct. 2012, 16:28
par juliette
met le content comme ca:
#content {
width: 1000px;
position: absolute;
left: 0px;
padding-top: 2px;
}

Re: Aide pour le placement

Posté : 25 oct. 2012, 16:31
par juliette
ok, met la siderbar comme ca:
#siderbar {
margin: 0 230px 40px 1000px;
background: #fafafa;
border: 1px solid #d0d0d0;
padding: 20px;
position: relative;
}

Re: Aide pour le placement

Posté : 25 oct. 2012, 16:31
par yoyo83
ok la j'ai les blocs qui sont remonté

Re: Aide pour le placement

Posté : 25 oct. 2012, 16:34
par juliette
essaye ca:
#siderbar {
margin: 0 230px 40px 910px;
padding: 20px;
position: relative;
}

#content {
width: 900px;
background: #fafafa;
border: 1px solid #d0d0d0;
position: absolute;
left: 0px;
padding-top: 2px;
}


Re: Aide pour le placement

Posté : 25 oct. 2012, 16:37
par juliette
ok, reduis encore un peut la largeur de content, on vois viens que rightpane n'a pas la place a remonter