html {font-size: 100%;}
body {margin: 0; padding: 0; font-size: 1em; font-family: Arial,sans-serif;}
img {max-width: 100%; border: 0;}
label {padding-top: 5px; display: inline-block;}
div {-webkit-box-sizing: border-box; box-sizing: border-box;}
table {border-spacing: 0px;}

.ui-state-default {text-shadow: inherit;}
.ui-corner-all {-moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px;}
.ui-button {border: 0px; min-height: 32px; text-shadow: inherit !important; border-radius: 3px; background: #f5a007 !important; -moz-box-shadow: 0px 0px 0px #fff !important; -webkit-box-shadow: 0px 0px 0px #fff !important;}
.ui-button:hover {background: #545454 !important; color: #f5a007 !important;}
.ui-button-text-only .ui-button-text {padding-left: 8px; padding-right: 8px;}
.ui-button-text-icon-left .ui-button-text {padding: .3em 1em .3em 2.1em; display: inline-block !important;}
.ui-spinner .ui-button {min-height: inherit !important; -moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px;}
.ui-spinner .ui-button-text-only .ui-button-text {padding-left: 13px; padding-right: 13px;}
.ui-inputfield {-moz-box-shadow: inset 0 0px 0px #8f8f8f; -webkit-box-shadow: inset 0 0px 0px #8f8f8f; box-shadow: inset 0 0px 0px #8f8f8f; -moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px;}
.ui-inputfield.ui-state-focus {-moz-box-shadow: inset 0 0px 0px #8f8f8f; -webkit-box-shadow: inset 0 0px 0px #8f8f8f; box-shadow: inset 0 0px 0px #8f8f8f;}
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {background-color: #85b2cb; color: #000; text-shadow: inherit !important;}
.ui-growl-icon-close {display: block !important;}
.ui-growl {z-index: 1000010 !important;}
.ui-calendar input {width: 120px !important; text-align: center;}
.ui-calendar button {width: 26px !important; min-height: 24px !important; height: 24px !important; background-color: #a2a2a2 !important; border-radius: 0px;}
.ui-fileupload-content {display: none;}
.ui-fileupload-content .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {border: 0;}
.ui-fileupload-buttonbar {width: 120px; text-align: center; height: 32px; border-radius: 3px; padding: 0; border: 0; background: #f5a007 !important; white-space: nowrap; text-shadow: inherit !important;}
.ui-fileupload .ui-button-text-icon-left .ui-icon {display: none;}
.ui-fileupload .ui-button-text-icon-left .ui-button-text  {padding: 0; padding-top: 8px;}
.ui-fluid .ui-fileupload .ui-button {width: 100%;}
.ui-dialog {font-size: 0.9em; border: 2px solid #f5a007; position: absolute;}
.ui-dialog .ui-dialog-titlebar {padding: 0 0.4em 0.2em 1em !important;}
.ui-dialog .ui-dialog-titlebar-close span {margin-top: 3px;}
.ui-selectonemenu .ui-selectonemenu-trigger {padding: 3px 5px; width: 27px;}
.ui-selectonemenu-item {font-size: 0.9em;}
.ui-accordion .ui-accordion-content {padding: 0px;}
.ui-autocomplete button {width: 30px !important; min-height: 25px !important; height: 25px !important; background-color: #a2a2a2 !important; border-radius: 0px; padding: 1px;}
.ui-chkbox {display: inline !important;} 
.ui-chkbox .ui-chkbox-box {width: 20px !important; height: 20px !important; -moz-border-radius: 2px !important; -webkit-border-radius: 2px !important; border-radius: 2px !important;}
.ui-chkbox-icon.ui-icon-check {margin: auto; margin-top: 2px;} 
.ui-chkbox .ui-chkbox-label {cursor: pointer !important; margin-left: 5px;}
.ui-widget {font-size: 1em;}
.ui-selectonemenu-filter-container {width: 100%}
.ui-selectonemenu-filter-container input {width: 96.5% !important}
.ui-selectlistbox-item {font-size: 1.1em; height: 25px;}
.ui-tabs {border: 0; padding: 0px;}
.ui-tabs .ui-tabs-panel {padding: 0px;}
.ui-datatable-empty-message {margin: auto; text-align: center;}

.nowrap {white-space: nowrap;}
.ellipsis {text-overflow: ellipsis;}
.gras {font-weight: bold;}
.uppercase {text-transform : uppercase;}
.text-lowercase {text-transform : lowercase;}
.souligne {text-decoration: underline;}
.indent-content {display: block; padding-top: 8px; padding-right: 8px;}
.couleur-utilisateur {color: #ffc861;}
.taille-photo-utilisateur {width: 51px; height: 51px;}
.taille-logo-club {width: 51px; height: 51px; min-height: 51px; min-width: 51px;}
.taille-prec-suiv {width: 50px; height: 50px;}
.link {color: #0074D4 !important;}
.content-with-boutons {margin-bottom: 47px !important;}
.content-since-boutons {margin-bottom: 8px !important;}
.cursorPointer {cursor: pointer;}
.dateHeure input {width: 160px !important; text-align: center;}
.heure input {width: 80px !important; text-align: center;}
.align-libelle {text-align: right;}
.fenetreLaterale {display: block; position: fixed; height: 100%; top: 0px; right: 0px; padding: 10px; background-color: white; box-shadow: rgba(0, 0, 0, 0.298039) -3px 0px 3px 0px; z-index: 11000;}
.saison {text-align: center; margin-top: 15px;}
.imageSystemeJeuPlusMoins {padding-right: 10px; max-width: 40px;}
.boutonFacet {float: right; font-size: 1.4em;}
.boutonFacet:hover {color: #f5a007 !important;}
.boutonBarreHaut {width: 40px; height: 40px; border-radius: 20px; font-size: 1.7em;}
.matchPreparationSelectOneMenu {min-width: 300px;}
.matchPreparationSelectOneMenu .ui-state-disabled {opacity: inherit;}
.bilanScore input {max-width: 40px !important; text-align:center;}
.inputNumberCenter input {text-align: center;}
.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled {opacity: 0.7}
.ui-datatable th {border: 1px solid #a8a8a8 !important;}
.ui-datatable tr.ui-state-hover, th.ui-state-hover, tr.ui-state-focus, th.ui-state-focus {-moz-box-shadow: 0 0 0px #85b2cb,inset 0 1px 0 #fff !important; -webkit-box-shadow: 0 0 0px #85b2cb, inset 0 1px 0 #fff !important; box-shadow: 0 0 0px #85b2cb, inset 0 1px 0 #fff !important;}
.ui-datatable tbody > tr:hover, .ui-datatable table tbody .ui-state-hover > td {background: #fdf0d9;}

#global {width: 100%; margin: auto; font-size: 0.9em;}
#cookieChoiceInfo {background: url("/mic/javax.faces.resource/images/bar.png.xhtml?ln=mic"); width: 100%; padding: 18px; text-align: center; z-index: 1000; color: #e0e0e0;}
#cookieChoiceInfo a {color: #e0e0e0;}
#cookieChoiceInfo a:hover {color: #ffffff;}
#boutonsConfirmDialog {float: right;}
#barre-haut {background: #383737; width: 100%; min-height: 60px; z-index: 1000001;}
#frm-barre-haut .ui-inputfield {background: #545454; border-color: #f5a007; color: #f5a007;}
#frm-barre-haut input::-webkit-input-placeholder {color: #f5a007 !important;}
#frm-barre-haut input:-moz-placeholder {color: #f5a007 !important;}
#frm-barre-haut input::-moz-placeholder {color: #f5a007 !important;}
#frm-barre-haut input:-ms-input-placeholder {color: #f5a007 !important;}
#frm-barre-haut input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px #545454 inset !important; -webkit-text-fill-color: #f5a007 !important;}
#boutonsBarreHaut {float: right; margin-top: -60px;}
#boutonsBarreHaut button {margin-top: 11px; margin-right: 6px; border: 1px solid #f5a007;}
#boutonsBarreHaut button:hover {border: 1px solid #f5a007;}
#boutonsBarreHaut button:focus {outline-width: 0;}
#boutonsBarreHaut > .ui-button-icon-only .ui-icon {left: 30%; top: 35%; width: 30px; height: 30px;}
#boutonsBarreHaut > .ui-state-default {box-shadow: inherit;}
#barre-bas {background: #383737; width: 100%; height: 60px; position: fixed; z-index: 1000; bottom: 0; color: #d8d8d8; font-size: 1.1em;}
#barre-bas a {color: #d8d8d8;}
#designConception {position: absolute; right: 10px; font-size: 0.75em;}
#logoLogin {float: left; width: 30%; text-align: center;}
#logoLogin img {width: 90%; margin-top: 8%;}
#imageSwitchLogin {float: left; width: 70%;}
#imageSwitchLogin img {width: 100%;}
#boutons {display: block; position: fixed; left: 120px; bottom: 8px; width: 100%; text-align: center; margin:auto; z-index: 10000;}
#boutonsRecrutement {display: block; position: fixed; bottom: 8px; width: 100%; text-align: center; margin:auto; z-index: 10000;}
#utilisateur {padding-top: 4px; margin-left: 268px; font-size: 1.1em;}
#utilisateurRecrutement {padding-top: 4px; margin-left: 4px; font-size: 1.1em;}
#logo {margin-left: 5px; margin-top: -45px;}
#divMenuGauche {float: left; width: 240px; font-size: 1.1em;}
#divMenuHaut {display: none; position: absolute; top: 14px; left: 6px;}
#menu {margin-top: 15px;}
#menu .ui-menu {padding: 0; border: 1px solid #f5a007; width: 227px;}
#menu .ui-menu .ui-menuitem-link {padding-left: 10px; padding-top: 8px; padding-bottom: 8px; width: 208px;}
#menu .ui-menu .ui-menuitem {margin: 0; width: 225px; background-color: #d8d8d8;}
#menu .ui-menu .ui-state-hover {background: #545454; color: #f5a007; border-color: #f5a007;}
#menu .ui-menu .ui-menu-parent .ui-menu-child {padding: 0; border-color: #f5a007;}
#menu .ui-menu .ui-menu-child {width: 225px;}
#frmMenuGaucheHaut\:menuGaucheBarreHaut {padding: 0 !important;}
#frm-barre-haut\:menuDroiteBarreHaut {padding: 0 !important;}
#frm-barre-haut-recrutement\:menuDroiteBarreHaut {padding: 0 !important;}
#content {float: left; width: calc(100% - 240px);} /* 240px ==> Largeur de la barre de gauche (divMenuGauche) */
#divBarreHaut {display: none; position: absolute; top: 14px; right: 6px;}
#frm-content\:choixZonePetit img {width: 251px; height: 170px; max-width: inherit;}
#frm-content\:choixZoneNormal img {width: 450px; height: 305px; max-width: inherit;}
#frm-content\:match\:schemaMatch {background-image: url("/mic/javax.faces.resource/images/terrain-match.png.xhtml?ln=mic"); background-repeat: no-repeat; background-size: 100% 100%;}
#ajaxStatus {position: fixed; left: 48%; top: 45%;}





.align-left {text-align: left;}
.align-right {text-align: right;}
.align-center {text-align: center; margin: auto;}

.align-top {vertical-align: top;}
.align-middle {vertical-align: middle;}
.align-bottom {vertical-align: bottom;}

.width10 {width: 10px; min-width: 10px; max-width: 10px;}
.width15 {width: 15px; min-width: 15px; max-width: 15px;}
.width20 {width: 20px; min-width: 20px; max-width: 20px;}
.width25 {width: 25px; min-width: 25px; max-width: 25px;}
.width30 {width: 30px; min-width: 30px; max-width: 30px;}
.width40 {width: 40px; min-width: 40px; max-width: 40px;}
.width50 {width: 50px; min-width: 50px; max-width: 50px;}
.width70 {width: 70px; min-width: 70px; max-width: 70px;}
.width80 {width: 80px; min-width: 80px; max-width: 80px;}
.width90 {width: 90px; min-width: 90px; max-width: 90px;}
.width100 {width: 100px; min-width: 100px; max-width: 100px;}
.width110 {width: 110px; min-width: 110px; max-width: 110px;}
.width120 {width: 120px; min-width: 120px; max-width: 120px;}
.width150 {width: 150px; min-width: 150px; max-width: 150px;}
.width160 {width: 160px; min-width: 160px; max-width: 160px;}
.width200 {width: 200px; min-width: 200px; max-width: 200px;}
.width300 {width: 300px; min-width: 300px; max-width: 300px;}

.width-1 {width: 1%;}
.width-2 {width: 2%;}
.width-5 {width: 5%;}
.width-10 {width: 10%;}
.width-15 {width: 15%;}
.width-19 {width: 19%;}
.width-20 {width: 20%;}
.width-25 {width: 25%;}
.width-30 {width: 30%;}
.width-35 {width: 35%;}
.width-40 {width: 40%;}
.width-45 {width: 45%;}
.width-49 {width: 49%;}
.width-50 {width: 50%;}
.width-55 {width: 55%;}
.width-60 {width: 60%;}
.width-65 {width: 65%;}
.width-70 {width: 70%;}
.width-75 {width: 75%;}
.width-80 {width: 80%;}
.width-85 {width: 85%;}
.width-90 {width: 90%;}
.width-95 {width: 95%;}
.width-100 {width: 100%;}

.couleur-systeme-1 {background-color: #e6e6e6;}
.couleur-systeme-2 {background-color: #cccccc;}
.couleur-systeme {color: red;}
.rouge {color: red !important;}
.vert {color: green !important;}
.noir {color: black !important;}
.bleu {color: #0074D4 !important;}

.orange-mic {color: #f5a007}

.fs-16 {font-size: 16px;}
.fs-20 {font-size: 1.40em;}
.fs-25 {font-size: 1.75em;}
.fs-28 {font-size: 1.95em;}

.padding-0 {padding: 0 !important;}
.padding-1 {padding: 1px !important;}
.padding-10 {padding: 10px;}
.padding-20 {padding: 20px;}

.padding-left-10 {padding-left: 10px;}
.padding-top-20 {padding-top: 20px;}

.margin-top-2 {margin-top: 2px;}
.margin-top-4 {margin-top: 4px;}
.margin-top-5 {margin-top: 5px;}
.margin-top-7 {margin-top: 7px;}
.margin-top-10 {margin-top: 10px;}
.margin-top-20 {margin-top: 20px;}

.margin-left-10 {margin-left: 10px;}

.border-1 {border: 1px solid black;}
.border-top-0 {border-top: 0;}
.border-left-0 {border-left: 0;}
.border-right-2 {border-right: 2px solid !important;}
.border-top-2 {border-top: 2px solid !important;}





/* Css stéphane */

#pageDescriptive {font-family: "Verdana", "Arial", "Helvetica", "sans-serif"; font-size: 16px; color: #2e2e2e; margin: 0; padding: 0;}
#pageDescriptive h1 {font-weight: bold; padding: 0; margin: 0; font-size: 1.6em;}
#pageDescriptive h2 {font-weight: normal; padding: 0; margin: 0; font-size: 1.4em;}
#accueilAccroche {text-align: center;}
#vignettesModules {padding: 5px 0;}
#vignettesModules img {border: 1px solid #a1a1a1;}
#accueilContent {overflow: auto; margin-top: 20px;}
#tarifContent {text-align: center;}
#accueilEducateurs {width: 49%; float: left; text-align: center;}
#accueilClubs {width: 50%; float: left;	text-align: center;	border-left: 1px solid #a1a1a1;}
.accueilTitreSection {background-color: #666666; padding: 1em 0; color: #ffffff; width: 90%; margin: 0 auto 20px;}
.tableauDetail, .tableauDetail2 {border: 1px solid #666666;	font-weight: bold; width: 90%; margin: 0 auto; border-collapse: collapse; font-size: 0.7em;	margin-bottom: 25px;}
.tableauDetail td, .tableauDetail th {border-bottom: 1px solid #666666;	padding: 5px;}
.tableauDetail2 td, .tableauDetail2 th {padding: 5px;}
.tableauDetail tr , .tableauDetail2 tr {height: 60px; vertical-align: middle;}
.tableauDetail2 td {border: 1px solid #666666;}
td.space {border-bottom: none; border-top: none;}
.tableauDetail3 {border-collapse: collapse; width: 100%;}
.tableauDetail3 td {border: 0;}
.first {color: #ffffff; background-color: #666666;}
.second {background-color: #dddddd;}
.third {background-color: #b2b2b2;}
.fourth {background-color: #808080;}
.fifth {background-color: #c2c2c2;}
#contactContent, #mentionsContent {font-size: 0.9em; max-width: 1200px;	margin: 20px auto 0 auto;}
#contactInterlocuteur {display: inline-table; width: 49%; min-width: 500px; float: left;}
#contactVasseur {margin: 0 auto;}
#demandeContact, #mentionsRight {width: 50%; float: left; border-left: 1px solid #a1a1a1;}
#mentionsContent h2 {margin-top: 20px;}
#mentionsLeft {display: inline-table; width: 49%; min-width: 450px; float: left;}
#mentionsRightContent {margin-left: 20px; min-width: 450px;}
#demandeContact form {width: 400px; margin: 0 auto;}
#demandeContact label {width: 180px; height: 21px; float: left;}
#demandeContact input {width: 210px; height: 21px; float: left;}
#demandeContact textarea {width: 400px; height: 100px;}
#photoPhilppeVasseur {float: left; margin-right: 5px;}

/* Fin css stéphane */



@media only screen and (min-width:1030px) {
	#frm-content\:choixZonePetit {display: none;}
}

@media only screen and (max-width:1029px) {
	#frm-content\:choixZoneNormal {display: none;}
	.imageSystemeJeu {max-width: 170px;}
}

@media only screen and (max-width:640px) {
	body {font-size: 0.9em;}
	#content {float: left; width: 100%}
	#boutons {left: inherit;}
	.align-libelle {text-align: left;}
	#divMenuGauche {display: none;}
	#divMenuHaut {display: inherit;}
	#utilisateur {padding-top: 4px; margin-left: 47px;}
	#divBarreHaut {display: inherit;}
	#boutonsBarreHaut {display: none;}
}