.img-fluid
{
	height:auto;
	max-width: 100%;	
}

/* ----------------------------------- Surcharge ---------------------------------------- */
.btn
{
	border-radius: 0px !important;
}
.panel
{
	border-radius:0px;
}
.form-control
{
	border-radius: 0px; 
}
.progress
{
	border-radius: 0px;
	background-color: transparent;
}
a
{
	color: #ecf0f1;
	text-decoration: underline;
	cursor:pointer;
}
a:hover, a:focus
{
	color: #999999;
}
.tooltipClass
{
	text-decoration-style: dotted;
}
.form-control, input, textarea
{
	background-color: #222222;
	color:  #ecf0f1;
}
#expEnCours 
{
	text-align: left;
	padding : 25px;
}
#YTannonce
{
	text-align: center;
    font-size: 22px;	
}
.withMarginTop
{
	margin-top : 15px;
}
#YTannonce a
{
	text-decoration: none;  
}  
.blocAvecFondLightTop
{
	padding: 5px;
	background-color: rgba(	48, 48, 48, 0.8);
	border-radius: 2px;
}

.blocAvecFondLightPadding
{
	padding: 20px;
	background-color: rgba(	48, 48, 48, 0.5);
	border-radius: 2px;
	
}
#TextIntro
{
	text-align: justify;
	text-justify: inter-word;
}
#titreTimelineMobile
{
	display: none;	
}
.titreTimeline
{
	display: block;
}
.blocAvecFond
{
	padding: 5px;
	background-color: #303030;
}
.blocAvecFondLight
{
	padding: 5px;
	background-color: rgba(	48, 48, 48, 0.5);
	border-radius: 2px;
}
.titreTop
{
	margin-top : 0px;
}
#Certification table tr td
{
	border-top:  1px solid #303030;
}
#Certification table tr th
{
	border-top:  1px solid #303030;
}
#Certification .tableTop td
 {
  border-top: 0;
}
#Certification .tableTop th
 {
  border-top: 0;
}
#Certification .bgTable
{
	background-color: #303030
}
#Certification .bgTable td
{
	border-top:  1px solid rgba(21, 21, 21, 0.9) !important;
}
#Certification .bgTable th
{
	border-top:  1px solid rgba(21, 21, 21, 0.9) !important;
}
#langProg
{
	padding : 5px 20px;
}

/* ------------------------------- TITRE ------------------------------------------- */
.titre
{
	font-family: 'Expletus Sans', Corbel, "Trebuchet MS", Helvetica, sans-serif;
}
.titreCenter
{
	text-align : center;
}
.titreMain
{
	text-align : right;
}
.titreSide
{
	text-align : left;
}
#sideTextHome
{
	text-align: left;
}
#homeTitreSide a
 {
	text-decoration: none;
 }

#titreTimelineLeft
{
	padding-right: 20px;
}
#titreTimelineRight
{
	padding-left: 20px;
}
#homeTitreSide
{
	padding-top: 10px;
}
#nameID
{
	font-size : 6em;
	margin-bottom: -25px;
}
/* -------------- side-nav ------------ */
#side-nav
{
	position: fixed!important;
	z-index: 99999999!important;
	right: 0px!important;
	top: 450px!important;
	text-align: right!important;
	display : none;
}
#side-nav ul
{
	list-style: none;
}
#side-nav li
 {
	font-size: 0.8em;
}
 #side-nav .active
 {
	font-size: 1.1em;
 }
#side-nav li a
{
 color: #3892e0;
 text-decoration: none;
}
#side-nav li a:hover, #side-nav li a:focus
{
	font-weight: bold;
	background-color: transparent !important;
}
/* ---- animation shadow ---- */
.enteteCV
{
	-webkit-animation: shadow-change-CV 3s infinite;
    -moz-animation: shadow-change-CV 3s infinite;
    -o-animation: shadow-change-CV 3s infinite;
    -ms-animation: shadow-change-CV 3s infinite;
    animation: shadow-change-CV 3s infinite;
}
  @-webkit-keyframes shadow-change-CV {
        0% { text-shadow: 0px 0px 2px rgba(124, 200, 255, 0); }
        50% { text-shadow: 0px 0px 2px rgba(124, 200, 255, 1); }
        100% { text-shadow: 0px 0px 2px rgba(124, 200, 255, 0); }
    }
    @-moz-keyframes shadow-change-CV {
        0% { text-shadow: 0px 0px 2px rgba(124, 200, 255, 0); }
        50% { text-shadow: 0px 0px 2px rgba(124, 200, 255, 1); }
        100% { text-shadow: 0px 0px 2px rgba(124, 200, 255, 0); }
    }
    @-ms-keyframes shadow-change-CV {
        0% { text-shadow: 0px 0px 2px rgba(124, 200, 255, 0); }
        50% { text-shadow: 0px 0px 2px rgba(124, 200, 255, 1); }
        100% { text-shadow: 0px 0px 2px rgba(124, 200, 255, 0); }
    }
    @-o-keyframes shadow-change-CV {
        0% { text-shadow: 0px 0px 2px rgba(124, 200, 255, 0); }
        50% { text-shadow: 0px 0px 2px rgba(124, 200, 255, 1); }
        100% { text-shadow: 0px 0px 2px rgba(124, 200, 255, 0); }
    }
    @keyframes shadow-change-CV {
        0% { text-shadow: 0px 0px 2px rgba(124, 200, 255, 0); }
        50% { text-shadow: 0px 0px 2px rgba(124, 200, 255, 1); }
        100% { text-shadow: 0px 0px 2px rgba(124, 200, 255, 0); }
    }
	

.titre
{
	-webkit-animation: shadow-change 3s infinite;
    -moz-animation: shadow-change 3s infinite;
    -o-animation: shadow-change 3s infinite;
    -ms-animation: shadow-change 3s infinite;
    animation: shadow-change 3s infinite;
}
  @-webkit-keyframes shadow-change {
        0% { text-shadow: 0px 0px 5px rgba(56, 146, 224, 0); }
        50% { text-shadow: 0px 0px 5px rgba(56, 146, 224, 1); }
        100% { text-shadow: 0px 0px 6px rgba(56, 146, 224, 0); }
    }
    @-moz-keyframes shadow-change {
        0% { text-shadow: 0px 0px 6px rgba(56, 146, 224, 0); }
        50% { text-shadow: 0px 0px 6px rgba(56, 146, 224, 1); }
        100% { text-shadow: 0px 0px 6px rgba(56, 146, 224, 0); }
    }
    @-ms-keyframes shadow-change {
        0% { text-shadow: 0px 0px 6px rgba(56, 146, 224, 0); }
        50% { text-shadow: 0px 0px 6px rgba(56, 146, 224, 1); }
        100% { text-shadow: 0px 0px 6px rgba(56, 146, 224, 0); }
    }
    @-o-keyframes shadow-change {
        0% { text-shadow: 0px 0px 6px rgba(56, 146, 224, 0); }
        50% { text-shadow: 0px 0px 6px rgba(56, 146, 224, 1); }
        100% { text-shadow: 0px 0px 6px rgba(56, 146, 224, 0); }
    }
    @keyframes shadow-change {
        0% { text-shadow: 0px 0px 6px rgba(56, 146, 224, 0); }
        50% { text-shadow: 0px 0px 6px rgba(56, 146, 224, 1); }
        100% { text-shadow: 0px 0px 6px rgba(56, 146, 224, 0); }
    }
	
/* ---- animation color chevron ---- */
#chevronDown a
{
	color: #999999;
	-webkit-animation: color-change 3s infinite;
    -moz-animation: color-change 3s infinite;
    -o-animation: color-change 3s infinite;
    -ms-animation: color-change 3s infinite;
    animation: color-change 3s infinite;
}
  @-webkit-keyframes color-change {
        0% { color: #999999; }
        50% { color: #FFFFFF; }
        100% { color: #999999; }
    }
    @-moz-keyframes color-change {
        0% { color: #999999; }
        50% { color: #FFFFFF; }
        100% { color: #999999; }
    }
    @-ms-keyframes color-change {
        0% { color: #999999; }
        50% { color: #FFFFFF; }
        100% { color: #999999; }
    }
    @-o-keyframes color-change {
        0% { color: #999999; }
        50% { color: #FFFFFF; }
        100% { color: #999999; }
    }
    @keyframes color-change {
        0% { color: #999999; }
        50% { color: #FFFFFF; }
        100% { color: #999999; }
    }

/* ----------------------- VIDEO ------------------- */
#backgroundVideo {
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background-size: cover;
	opacity: 0.5;
}
.bv-video-wrap
{
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background-size: cover;
	opacity: 0.5;
}

#backgroundPhoto {
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -101;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background-size: cover;
	display:none;
	opacity: 0.5;
}
/* ---------------------------- after home ------------------------ */ 
#nonName
{
	background-color : rgba(21, 21, 21,0);/*#2E2E2E;*/
}
.Nav-section
{
	margin-top: 500px;
}
#Presentation
{
	margin-top: 0px !important;
	padding-top: 300px !important;
}
#frontText
{
	padding-top: 150px;
}
@media (max-height: 800px) {
	#frontText
	{
		padding-top: 0px;
	}
}
/* -------------------------------- timeline ----------------------------*/

.panel-inverted
{
	float: right !important;
	text-align: left !important;
}
.panel-inverted:before {
    border-left-width: 0 !important;
    border-right-width: 15px !important;
    left: -15px !important;
    right: auto !important;
}
.panel-inverted:after {
    border-left-width: 0 !important;
    border-right-width: 14px !important;
    left: -14px !important;
    right: auto !important;
}
.timeline-panel
 {
	text-align: right;
}
.timeline-inverted .timeline-panel
{
	text-align: left !important;
}
.timeline-heading h4
{
	color: #3892e0;
}
/* surcharge modal */
.modal-content
{
	border-radius: 0px;
}
#map-container { height: 224px }
.linkTimeline
{
	color: #999999;
	text-decoration: underline;
}
.linkTimeline:hover, .linkTimeline:focus
{
	 font-weight: bold;
}
/* ---------------------------------- prog -------------------------------------  */
.textTitreSide{
   padding: 25px;
}   
#projectsProg
{
	text-align: left;
}
#langProg
{
	min-height: 185px;
}
#langProg dt
{
	color: #3892e0;
	margin-top: 2px;
}
#langProg dd
{
	margin-top: 5px;
	margin-bottom: 7px;
}
@media (max-width: 1200px) {
		#langProg dd
		{
			margin-top: 0px;
		}
}
@media (max-width: 1000px) {
	#langProg
	{
		min-height: 20px;
	}
}
#langProg a
 {
	display: inline;
 }

.cardProg
{
	display: inline-block;
	overflow: hidden;
	margin-bottom: 15px;
	height: 185px;
	z-index: 10;
}
.front
{
	background-size: cover;
    background-repeat: no-repeat;
    background-position: 0% 0%;
	height: 100%
}

/*hover sur PicProg */ 

.PicProg a {
    display: block;
    position: relative;
    max-width: 400px;
	text-decoration: none !important;
}
.caption {
    position: relative;
    width: 100%;
    height: 220px;
    opacity: 0;
    background: rgba(46, 109, 164,.5);
    -webkit-transition: all ease .5s;
    -moz-transition: all ease .5s;
    transition: all ease .5s;
	text-decoration: none !important;
}

.caption:hover {
    opacity: 1;
	text-decoration: none !important;
}
.caption:active {
    opacity: 1;
	text-decoration: none !important;
}

.caption .caption-content {
    position: relative;
    top:30%;
    width: 100%;
    height: 20px;
    margin-top: -20px;
    text-align: center;
    font-size: 20px;
    color: #fff;
	text-decoration: none !important;
}
.caption-content p, .caption-content p:hover,  .caption-content p:focus,  .caption-content p:active{
	text-decoration: none !important;
}

 .caption .caption-content i {
    margin-top: -12px;
}

 .caption .caption-content h3,
.caption .caption-content h4 {
    margin: 0;
}
.onTop
 {
	float: left !important;
	top:00px;
	left:00px;
	z-index: 1;
 }
/* ------------------------------------- AUTRES / contact----------------------------------------- */
.TroisColonnes
{
	text-align:left;
}
#Contact
{
    padding-bottom: 500px;
}
#CCNABadge
{
	background: white;
}
.tooltipForm
{
	text-decoration: none;
}
.tooltipForm:hover
{
	text-decoration: none;
}
.aTooltip
{
	cursor: default;
}
.aTooltip:hover
{
	color : #ecf0f1;
}
/* ----------------------------------- responsive -------------------------------- */
@media only screen and (max-width: 768px) {
/* 	#backgroundPhoto {
		display: block;
	}
	#backgroundVideo {
		display: none;
	} */
	.titreMain
	{
		text-align : left;
	}
	.timeline-panel
	{
		text-align: left;
	}
	#frontText
	{
		padding-top: 20px;
	}
	#titreTimelineMobile
	{
		display: block;
		
	}
	.titreTimeline
	{
		display: none;
	}
	
}

/*------- from Bootstrap 4  */

.align-self-end {
  -ms-flex-item-align: end !important;
  align-self: flex-end !important;
}

.d-flex {
  display: -ms-flexbox !important;
  display: flex !important;
}

.align-items-end {
  -ms-flex-align: end !important;
  align-items: flex-end !important;
}