html
{
	height: 100%;
    width: 100%;
    color: white;
    font-family: 'mostranuova', 'sofiapro-light','trebuchet ms';
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden; /*cache scrollbar horizontale*/
}

body {
	display: table;
    height: 100%;
    width: 100%;
	margin: 0;
}

/*transparence header, fixé, padding : marge int*/
header
{
    background-color: rgba(71,71,71, 0.6);
    width: 100%;
    display: table;
}

footer
{
	display: table-footer-group;
	background-color: rgba(71,71,71, 0.5);
	width: 100%;
	color: white;
	text-align: right;
	font-size: 0.5em;
}

#title-container {
  	display: table-cell;
}

.footer-content {
    line-height: 40px;
}

.footer-text {
	margin-right: 10px;
}

/*Menu Navigation sans puce, flex, haut + droite. A voir = overflow: hidden pour ne pas interfer avec le header*/
nav {
	display: table-cell;
	vertical-align: middle;
}

nav ul
{
	text-align: right;
  	padding-right: 20px;
  	font-size: 1.2em;
  	margin: 0;
}

/*aligne menu a puces horizontal, padding définit espace entre*/
li
{
	display: inline-block;
	position: relative;
	padding-left: 2px;
}

p {
	margin: 0;
}

#fr
{
	padding-right: 0;
}

#en
{
	padding-left: 0;
}

.yocoaching /*"a." seul moyen affecter balise mère <a>*/
{
	color: white;
	font-weight: lighter;
	font-size: 2em;
	margin-bottom: 0;
	padding-left: 20px;
}

#yogaentreprise
{
	margin: 2px 0 10px 106px; /* margin: TOP RIGHT BOTTOM LEFT; */
	font-size: 0.8em;
}

.yogaalliance
{
	width: 32px;
	height: 38px;
	padding: 4px;
    vertical-align: middle;
}

/* lien non coloré violet */
a:visited
{
    color: white;
}

a:link
{
    color: white;
}

/*lien non souligné*/
a
{
	text-decoration: none;
}

.important /*couleur texte important*/
{
  color: rgb(152,251,152);
}

a.email/*"Email de la page concept a." car le class "email" est à l'intérieur de la balise <a>*/
{
  color: rgb(152,251,152);
}


/*page accueil image, police : type, couleur, taille*/
#index
{
	background: url(pix/yocoaching_yoga_entreprise_corporate.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
  	background-size: cover;
	font-size: 1.5em
}


/*page concept image, police : type, couleur, taille*/
#concept
{
	background: url(pix/yocoaching_yoga_entreprise_corporate_1.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	font-size: 1.5em;
}

#conceptdetails
{
	background-color: rgba(71,71,71, 0.5); /*transparence*/
	border-radius: 10px; /* bordures rondes*/
	width: 50%;
	text-align: left;
	padding: 10px; /*marge intérieu*/
	margin-top: 20px;
	margin-left: 20px;
	margin-bottom: 20px;
}

/*page coach image, police : type, couleur, taille*/
#coach
{
	background: url(pix/yocoaching_yoga_entreprise_corporate_2.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	font-size: 1.5em;
}

#coachdetails
{
	background-color: rgba(71,71,71, 0.5); /*transparence*/
	border-radius: 10px; /*bordures rondes*/
	width: 50%;
	text-align: left;
	padding: 10px; /*marge intérieu*/
	margin-top: 20px;
	margin-left: 20px;
	margin-bottom: 20px;
}

#coachportrait img /*"img" permet d'affecter l'image*/
{
    width: 30%;
    float: left;
    padding: 10px;
}

#cours
{
	background: url(pix/yocoaching_yoga_entreprise_corporate_3.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	font-size: 1.5em;
}

#coursdetails
{
	background-color: rgba(71,71,71, 0.5); /*transparence*/
	border-radius: 10px; /*bordures rondes*/
	width: 51%;
	text-align: center;
	padding: 10px; /*marge intérieu*/
	margin-top: 20px;
	margin-left: 20px;
	margin-bottom: 20px;
}

#contact
{
	background: url(pix/yocoaching_yoga_entreprise_4.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	font-size: 1.5em;
}

#contactdetails
{
	position: absolute;
	right: 4px;
	background-color: rgba(71,71,71, 0.6); /*transparence*/
	border-radius: 10px; /*bordures rondes*/
	text-align: justify;
	padding: 4px; /*marge intérieu*/
	margin-top: 30px;
	margin-right: 20px;
}

#contactemail
{
	position: absolute;
	right:4px;
	background-color: rgba(255,0,0, 0.5); /*transparence*/
	border-radius: 10px; /*bordures rondes*/
	text-align: justify;
	padding: 2px; /*marge intérieu*/
	margin-top: 12px;

}

/* Définition des polices personnalisées */

@font-face
{
    font-family: 'mostranuova';
    src: url('mostra_nuova.otf') format('otf'), url('mostra_nuova.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face
{
    font-family: 'sofiapro-light';
    src: url('sofiapro-light-webfont.woff2') format('woff2'),  url('sofiapro-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/*
Question =
- pourquoi "h1" pas modifiable ? tout est modifiable ! ;)
- Attention utilisation taille, parfois pixel, parfois %, parfois "em"
- Comment eviter collision footer+content/section, conten scrolling behind footer
- Manque adaptation Android
*/