body {
	height: 100%;
    margin: 0;
	padding: 0;
	background-color: black;
    font-size: 1em;
	color: white;
	font-family: verdana;
	}

h2{
	margin-top: 0.4em;
	margin-bottom: 0.4em;
}	


.adios {
	display: none !important;
}


a.lientexte{
	text-decoration: underline;
	color: inherit;
}

.champ_durée_diapo {
	font-family: Aero;
	font-size: 1em;
	width: 4em;
	-moz-appearance: textfield
}	


@font-face {
	font-family: 'Aero';
	src: url('fonts/aero_matics_regular.ttf');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'monom';
	src: url('fonts/monom.ttf');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'coolvetica';
	src: url('fonts/coolvetica.ttf');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'blueh';
	src: url('fonts/blue_highway_rg.ttf');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'georgiabelle';
	src: url('fonts/Georgia_belle.ttf');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'biko';
	src: url('fonts/biko_regular.otf');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'alte';
	src: url('fonts/AlteHaasGroteskBold.ttf');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'georgia';
	src: url('fonts/georgia.ttf');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'raleway';
	src: url('fonts/Raleway-Medium.ttf');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'fjalla';
	src: url('fonts/FjallaOne-Regular.ttf');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'crete';
	src: url('fonts/CreteRound-Regular.ttf');
	font-weight: normal;
	font-style: normal;
}



a {
	text-decoration: none;
}



.journalmatch {
	font-family: georgia;
	background-color : #dad7c8;
	color : black;

}



.CPcouleurFondEquipe {
	margin-top: 0.5em;
	padding-top: 0.5em;
	border: 2px solid;
	border-radius: 1.5vmin;
}


.boutonOnOffScreen{
	float : right;
	margin-top: 15px;
}

.fondgris {
	background-color: #1C1C1C;
}

.centré{
	text-align: center;
}

.champ_num {
	width: 2em;
	font-size: 1.5em;
	-moz-appearance: textfield;
	text-align: center;
	font-weight: bold;
	}


.tableau_avant-match{
	width: 100%;
	text-align: center;
	table-layout: fixed;
	}
	
.tableau_avant-match td {
	vertical-align: top;
	max-width: 33%;
}	

.zone{
	color: grey;
	font-style: italic;
}

.petitcadre{
	margin: 2%;
	border: 1px dotted grey;
	padding: 15px;
	
}

.champ-nom-equipe{
	max-width: 80%;
}

.v-align-m{
	vertical-align: middle;
	margin-top: auto;
	margin-bottom: auto;
}

.colorpicker{
	width: 100px;
	height: 25px;
	background: black;
	border-style: none;	
	}

.commentaire{
	font-style: italic;
	font-size: 0.8em;
	color: grey;
}

.séparateur50 {
	border-top: 1px dotted grey;
	width: 50%;
	margin: auto;
}
	
.champtexteajouté{
	padding: 6px;
	margin: 6px;
	max-width: 80%;
}


.controlematch{
	display: flex;
	justify-content: center;
	align-items: stretch;
	text-align: center;
	margin-top: 1em;
	}

.colonnegauche{
	vertical-align: top;
	flex: 1;
	}	

.colonnecentre{
	text-align: center;
	vertical-align: top;
	flex: 3;
	}

.colonnedroite{
	vertical-align: top;
	flex: 1;
	}	

.flex{
	display: flex;
}	

.flex1{
	flex: 1;
}

.flexsb{
	display: flex;
	justify-content: space-between;
}	
	
.big{
	font-size: 2.5em;
	}

.green {
	color: green;
}	

.barre {
	background: linear-gradient(#636363, black);
}

.rad {
	border-radius: 2%;
}

.left{
	text-align: left;
}
	
.caché{
	display: none;
	}

.boutonscore{
	font-size: 5vmin;
	font-weight: bold;
	width : 11vmin;
}

.boutonscoremin{
	font-size: 3vmin;
	font-weight: bold;
	width : 7vmin;
}
	
.scoreCP	{
	font-size: 6vmin;
	}

.penocheck{
	transform : scale(2);
	margin: 2.5vmin;
}


.avantagecheck{
	transform : scale(2);
	margin: 2.5vmin;
}

#cp-time-per{
	margin: 2% 2% 0 2%;
	border: 1px dotted grey;
	padding: 15px;
	background: linear-gradient(#636363, black);
	}
	
.boutoninit{
	background-color: #c60000;
	color: white;
	font-weight: bold;
	font-size: 1em;
	margin-top: 0.7em;
	margin-bottom: 0.6em;
}	
	
[type="radio"]:not(:checked) + label {
	font-size: 0.8em;
	border: 1px solid;
	border-radius: 5px;	
}

[type="radio"]:checked + label {
  font-size: 1em;  
  text-shadow : 0 0 5px white;
  border: 1px solid;
  border-radius: 5px;
  background-color: #298A08;
  box-shadow : 0 0 20px green;
  
}

.intitulémini {
	/*color: #01DF01;*/
}

.c_champ_titre{
height: 4.1em;
}

.champ_titre {
	font-family: Aero;
	font-size: 1.5em;
	background-color: #EFF5FB;
	color: #08088A;
	width: 80%;
	
}

.champ_titre:focus {
	width: 95%;
	font-size: 2em;

}

.c_champ_categorie{
	height: 1.7em;
}

.champ_categorie {
	font-family: Aero;
	font-size: 1.5em;
	background-color: #FBF5EF;
	color: #8A4B08;
	width: 80%;
}	

.champ_categorie:focus {
	width: 95%;
	font-size: 2em;
}

.c_champ_durée{
	height: 1.7em;
	}

.champ_durée {
	font-family: Aero;
	font-size: 1.5em;
	background-color: #EFFBEF;
	color: #0B610B;
	width: 2em;
	-moz-appearance: textfield
}	

.champ_durée:focus {
	font-size: 2em;
}	

.cadrepastmin{
	display: flex;
	justify-content: center;
	width : 80%;
	margin: auto;
	padding-bottom: 12px;
}


.pastilmin{
	font-size: 1.5em;
	background: #38610B;
	width: 1em;
	height: 1em;
	padding : 5px;
	margin : 5px;
	border-radius: 100%;
	vertical-align: middle;
	border: 1px solid green;
	vertical-align: middle;
	}
	

	
.pastilsec{
	font-size: 1.9em;
	background: #AEB404;
	width: 1em;
	height: 1em;
	padding : 7px;
	border-radius: 100%;
	vertical-align: middle;
	border: 2px solid #5E610B;
	vertical-align: middle;
	}

.boutonvalid{
	background-color: #1FD1C5;
	font-weight: bold;
	font-size: 1em;
	padding: 0.5em;
	border-radius: 5px;
}

.boutongo{
	background-color: #37f02d;
	font-weight: bold;
	font-size: 1em;
	padding: 0.5em;
	border-radius: 5px;
}	

.boutonyame{
	background-color: #dc7019;
	font-weight: bold;
	font-size: 1em;
	padding: 0.5em;
	border-radius: 5px;
}	
	
.boutonbuzz{
	background-color: #DC3A19;
	font-weight: bold;
	font-size: 1em;
	padding: 0.5em;
	border-radius: 5px;
}	

.boutonRAZ{
	background-color: #838177;
	font-weight: bold;
	font-size: 1em;
	padding: 0.5em;
	border-radius: 5px;
}	

.boutonaffichervainqueur{
	background-color: #838177;
	font-weight: bold;
	font-size: 1em;
	padding: 0.5em;
	border-radius: 5px;
}	

.boutonpoints {
  color: #FFF;
  	background-color: #119309;
	font-weight: bold;
	font-size: 1em;
	padding: 0.5em;
	border-radius: 5px;
}	
	


.slide_down:hover {
  box-shadow: inset 0 100px 0 0 #D80286;
}

.slide_right:hover {
  box-shadow: inset 400px 0 0 0 #D80286;
}

.slide_left:hover {
  box-shadow: inset 0 0 0 50px #D80286;
}

.slide_diagonal:hover {
  box-shadow: inset 400px 50px 0 0 #D80286;
}

#outer {
  width: 364px;
  margin: 50px auto 0 auto;
  text-align: center;
}







/* Tab Content - design http://www.menucool.com/tabbed-content Free to use. v2013.7.6 */

a {
	text-decoration: none;
}

ul.tabs
{
    padding: 7px 0;
    font-size: 0;
    margin: 0 0 1px 0;
    list-style-type: none;
    text-align: left; /*set to left, center, or right to align the tabs as desired*/
}
        
ul.tabs li
{
    display: inline;
    margin: 0;
    margin-right:3px; /*distance between tabs*/
	line-height: 35px; /*ajout pour éviter chevauchement des onglets quand ils sont sur deux lignes, fenêtre reduite*/
}
        
ul.tabs li a
{
    font: normal 12px Verdana;
    text-decoration: none;
    position: relative;
    padding: 7px 9px;
    border: 1px solid #CCC;
    border-bottom-color:#B7B7B7;
    color: grey;
    /*background: #F0F0F0 url(visuels/tabbg.gif) 0 0 repeat-x;*/
    border-radius: 3px 3px 0 0;
    outline:none;
}
        
ul.tabs li a:visited
{
    /*color: #000;*/
	color: grey;
}
        
ul.tabs li a:hover
{
    border: 1px solid #B7B7B7;
    /*background:#F0F0F0 url(visuels/tabbg.gif) 0 -36px repeat-x;*/
	
}
        
ul.tabs li.selected a, ul.tabs li.selected a:hover
{
    position: relative;
    top: 0px;
    font-weight:bold;
    /*background: white;*/
	background: #424242;
	color: white;
    border: 1px solid #B7B7B7;
    border-bottom-color: white;
}
        
        
ul.tabs li.selected a:hover
{
    text-decoration: none;
}
     

div.tabcontents
{
	border-width: 1px 0 0 0;
    border-style: solid;
	border-color: #B7B7B7;
	/*background-color:#FFF;*/
    border-radius: 0 3px 3px 3px;
	margin-top: -15px; /* pour compenser le line height de ul.tabs li*/
}

/* Fin Tab Content */


/*infobulles*/


.info{
    width : 100px;
    margin-top : 20px;
    margin-right :auto;
    margin-left : auto;
	color: #DE9D19;
	display: inline;
	font-family: Sans-serif;
	cursor: help;
}


.infobulle{
transform: scale(0);
position: absolute;
background-color: rgb(255, 242, 212);
color: black;
border-radius: 5px;
padding: 8px;
margin-top: -2em;
box-shadow: 4px 4px 7px rgba(0,0,0,0.7);
transition: 0.2s;
max-width: 600px;
z-index: 10;
left: 10%;
cursor: none;
}

.info:hover > .infobulle{
    transform : scale(1);
}

.infobullespecial{
transform: scale(0);
position: absolute;
z-index: 10;
background-color: rgb(255, 242, 212);
color: black;
border-radius: 5px;
padding: 8px;
margin-top: 10px;
box-shadow: 4px 4px 7px rgba(0,0,0,0.7);
transition: 0.2s;
max-width: 600px;
}

.infoBulActif{
    width : 100px;
    margin-top : 20px;
    margin-right :auto;
    margin-left : auto;
	color: #DE9D19;
	display: inline;
	font-family: Sans-serif;
}

.infoBulActif:hover > .infobullespecial{
    transform : scale(1);
}

.info-ortho{
    width : 100px;
    margin-top : 20px;
    margin-right :auto;
    margin-left : auto;
	color: #DE9D19;
	display: inline;
	font-family: Sans-serif;
	cursor: help;
}


.info-orthobulle{
transform: scale(0);
position: absolute;
background-color: #FAFAFA;
color: black;
border-radius: 5px;
padding: 8px;
box-shadow: 4px 4px 7px rgba(0,0,0,0.7);
max-width: 600px;
z-index: 10;
left: 10%;
cursor: text;
}

.info-ortho:hover > .info-orthobulle{
    transform : scale(1);
}

/*fin infobulles*/

/*nouvelles classes diaporama*/

.thumb {
    height: 100px;
    border: 3px solid grey;
    filter: brightness(70%);
  }
  
.apdiapo{
  padding: 5px;
  display: inline-block;
  text-align: center;
  }
  
.nomFichier{
  background-color: #6b0062;
  display: block;
  width: 100%;
  font-size: small;
  cursor: grab;
  border-radius: 0.2em;
  }
  
.autothumb {
    height: 100px;
    border: 3px solid grey;
    filter: brightness(70%);
	cursor: grab;
  }
  
.autoapdiapo{
  padding: 5px;
  display: inline-block;
  text-align: center;
  }
  
.autonomFichier{
  background-color: #006251;
  display: block;
  width: 100%;
  font-size: small;
  cursor: grab;
  border-radius: 0.2em;
  }
  
#spoilerDiapoManu{
  background-color: #2c002d;
  border-radius: 0.5em;
  border: solid 1px #6a026c;
  padding: 0.5em;
  }
  
#spoilerDiapoManu a{
	color: white;
  }  
  
#spoilerDiapoAuto{
  background-color: #002a2a;
  border-radius: 0.5em;
  border: solid 1px #005959;
  padding: 0.5em;
  }
  
#spoilerDiapoAuto a{
	color: white;
  }  
  

/* fin nouvelles classes diaporama*/

/* classes effet spoiler */

.more {
    display: none;
    padding-top: 10px;
}

a.showLink, a.hideLink {
    float: right;
	text-decoration: none;
	color: inherit;
    -webkit-transition: 0.5s ease-out;
}

a.hideLink {
	float: right;
    text-decoration: none;
	color: inherit;
	}

/* fin classes effet spoiler */

/* Placement des boutons +/- pour le timer de l'impro */

.block_boutons {
	display:inline-block;
	vertical-align: bottom;
}

.timer_boutons {
	line-height: 11px;
}

.scoreCPtop {
	display: flex;
	justify-content: center;
}

.conteneur-8 {
width: 3vmin;
  height: 3vmin;
  font-size: 2.5vmin;
  color: #002a01;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #00cc61;
  border-radius: 100%;
  font-family: 'raleway', sans-serif;
  font-weight: bold;
  text-shadow: 2px 2px 2px #00000052;
  margin-left: 2rem;
}