/* Head, Body, h1,2,3,4 */

body {
	background-color: #F7F4EC;
}


h1 { 
	font-family: "Trebuchet MS";
	font-size: 3em;
	text-decoration: underline;
}


h3 {
	color: grey;
	font-weight: bold;
	font-family: "Trebuchet MS";
	font-size: 2em;
}



h4 {
	font-family: "Trebuchet MS";
}

.h4exp {
	font-size: 0.7em;   /* h4 personnalisé pour la catégorie expérience */
}


[class*="col-"] {  /*  background-color: lightgreen;
  border: 2px solid black; 
  border-radius: 10px; */
  line-height: 40px; 
  text-align: center;
  margin-top: 0px;
} 

.col-lg-12 { line-height: 150px; }

.container { 
  padding-right: 15px;
  padding-left: 15px;
  margin-left: auto;
  margin-right: auto;
}





		/* Header/Menu in body */

header {
	background-image: url("elements/photointro.jpg");
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover; 
	margin-bottom: 55px;

}

.photo1 {
	margin-top: 60px;
}


.textpres {
	text-align: center;
	font-size: 3.5em;										/* texte sous photo header */
	color: white;
	line-height: 2em;
	font-family: "Trebuchet MS"; 
}

.textpres2 {
	text-align: center;
	font-size: 2em;
	color: white;
	line-height: 2em;
	margin-bottom: 8%;
	font-family: "Trebuchet MS";
}



.ulcomp li {  /* liste à puce de la catégorie compétences */
    list-style-type: none; /*  annule la puce par défaut */
    background-image: url(elements/valide.png); /*  affiche l'image souhaitée */
    background-repeat: no-repeat; /*  annule la répétition par défaut */
    background-position: left center; 
    padding-left: 20px; /* pour éviter la superposition du contenu */
}

/* le menu scrollant à gauche qui est composé de plusieurs div */
.ulmenu{
	background-image: url("elements/fondmenu2.png");
	background-size: cover;
	border-radius: 25px;
	top: 15%;
	left: 8px;
}

.ulmenu1{
	background-image: url("elements/fondmenu2.png");
	background-size: cover;
	border-radius: 25px;
	top: 21%;
	left: 8px;
}

.ulmenu2{
	background-image: url("elements/fondmenu2.png");
	background-size: cover;
	border-radius: 25px;
	top: 27%;
	left: 8px;
}


.ulmenu3{
	background-image: url("elements/fondmenu2.png");
	background-size: cover;
	border-radius: 25px;
	top: 33%;
	left: 8px;
}

.ulmenu4{
	background-image: url("elements/fondmenu2.png");
	background-size: cover;
	border-radius: 25px;
	top: 39%;
	left: 8px;
}

.ulmenu5{
	background-image: url("elements/fondmenu2.png");
	background-size: cover;
	border-radius: 25px;
	top: 45%;
	left: 8px;
}


.ulmenugen a:hover p {
	color: white;
	font-family: "Trebuchet MS";
	font-size: 1.5em;
}

.ulmenugen p {
	color:white;
	text-align: center;
	font-family: "Trebuchet MS";
	font-size: 1.2em;
}


		/* corps page */

.photo { /* photo de la préz */
	float:right;
	}


.agauche { /* aligne certains texte à gauche pour question de mise en page */
	float:left;
	margin-left: 15%;
}


.colorgris { /* certaines parties sont ainsi personnalisées afin de rendre la page plus aérée, certains passages necessitant plus de marge que d'autres */
	background-color: #EAEAE9;
	margin-top: 55px;
}

.colorgris3 {
	background-color: #EAEAE9;
	margin-top: 65px;
	margin-bottom: 50px;
} 

.colorgris4 {
	background-color: #EAEAE9;
	margin-bottom: 50px;
}

.colorblanc {
	background-color: #F7F4EC;
	 margin-top: 55px;
}

.colorblanc3 {
	margin-bottom: 70px;
}

.colorblanc1 {
	background-color: #F7F4EC;
}

.colorgris2 {
	margin-bottom: 40px;
}


.colgauche{ /* les colonnes gauche des tableaux */
	font-size: 1.6em;
	font-family: "Trebuchet MS";
	font-weight: bold;
}

.colmilieu { /* colonne milieu */
	font-size: 1.45em;
}
.coldroite { /* colonne droite */
	font-size: 1.2em;
}

.coldroite1 { /* colonne droite des MOOC */
	font-size: 1.1em;
	font-family: "Trebuchet MS";
}


.apropos {
	text-align: left;
}

.apropos2 {
	text-align: left;
	line-height: 2.2em;
	font-size: 1.2em;
	font-family: "Trebuchet MS";
}

.apropos3 {
	line-height: 1.7em;
	font-size: 1.1em;
	font-family: "Trebuchet MS";
}


.margtable {
	margin-bottom: 50px;
}

/* les barres de progression dans compétences */
.barrehtml {
	width: 90%;
}

.barrecss{
	width:90%;
}

.barreboot {
	width:80%;
}

.barrephp {
	width:50%;
}

.btntel {
	float: left;
	margin-right: 10px;
	border-radius: 10px;
	margin-top: 25px;
}

.progress{
	width: 650px;
	border-radius: 15px;
}



.textpuce {
	font-family: "Trebuchet MS";
	font-size: 1.3em;
	line-height: 2.0em;
	margin-left: 10px;
	text-align: left;
}




		/* footer */


.footer {
	background-image: url("elements/photofooter.jpg"); 
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover; 
}


.contact {
	color: #EDE2DD;
}

.contact1 {
	color: #EDE2DD;
	font-size: 2.2em;
	font-family: "Trebuchet MS";
	text-decoration: underline;
}

.contact2 {
	color: #EDE2DD;
	font-size: 1.3em;
	font-family: "Trebuchet MS";
}

.contact3 {
	color: #EDE2DD;
	font-size: 1.3em;
	font-family: "Trebuchet MS";
	text-decoration: underline;
}

.contact4 {
	color: #EDE2DD;
	font-size: 1.7em;
	font-family: "Trebuchet MS";
}

.photoreseau {
	border-radius: 10px;
}

.formultext{
	color: #EDE2DD;
	font-size: 1em;
	text-align: left;
	font-style: italic;
	text-decoration : underline;
}
.form-control {
	border-radius: 12px;
}


@media (min-width: 768px) {

  }

@media (max-width: 992px) {
  
  }

@media (max-width: 1200px) {
  .ulmenugen{display: none;}
  .photo { /* photo de la préz */
	clear: right;
	}
}