/****
couleurs
Vert jaune #cccc33
Vert Bleu foncé #339999
Rouge marron #cc6600
****/
body,
button,
input,
select,
textarea {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size : 16px;
 }

/**** LOGO ****/
.console{
	background-color: white;
	top : 10;
	left:0;
	z-index : 10;
}
.logo-fixed{
	position:fixed !important;
	top : 0px;
	left:0px;

	z-index : 1000;
}
.logo-fixed img{
	width:190px;
	height:70px;
}
/**** NAVBAR ****/
/*
.nav-item li.is-tab.is-active, li.nav-item.is-tab.is-active {
  border-bottom-color: #cccc33;
  color: #cccc33;
}
li.nav-item.is-tab:hover {
  border-bottom-color: #cccc33;
  border-bottom-width: 5px;
  color: white;
}

a.nav-item {
  color: white;
}



.nav {
  position: fixed !important;
  top: 0;
  left: 0;
  right: 0;
  background-color: #339999;
  color: white;
}

.nav-left p {
  padding: 0px;
  font-size: 30px;
}
.nav-right {
  padding: 0px;
  font-size: 30px;
}
.nav img {
	position: absolute;
    top: 0;
    left: 0;
    float:right;
	z-index : 1;
	max-width: 100%;
	height: auto; 
}
*/
/*** menu **/
.nav-left p {
  padding: 0px;
 	margin:0;
  font-size: 30px;
}
.nav-right {
  padding: 0px;
 	margin:0;
  font-size: 30px;
}
nav{
	position: fixed !important;
	top: 0;
	right: 0;
	background:#339999;
	z-index:1;
	padding:0;
	margin:0;
	width:100%;
	box-shadow:100px 100px 100px 100px #000,
	}

nav ul{
	margin:0;
	list-style:none;
	position:relative;
	display:inline;
	float:right;
	}
av ul::after{
    content: "";
	text-align:right;
}
nav > ul > li{
	position:relative;
	float:left;
	border-left:solid 1px #fff;
	}

nav ul > li > a{
    display: block;
    padding: 10px 10px;
	color:#fff;
	margin:0;
	}

nav > ul > li > a:hover{
	color:#339999;
	background-color:#fff;
	}
.deroulant > a::after{
    content:" ▼";
}
/* Sous Menu */
nav > ul > li > ul{ 				
	position:absolute !important;
	width:200px;
	z-index:10000;
	display:none;
	background:#339999;
	border-radius: 0px 0px 15px 0px;
	}
nav > ul > li > ul li{ 				
	display:block;
	border-top: 1px solid #ffffff;
	}

#menu > ul > li > ul > li > a {
	display:block;
	
	width:100%;
	}

nav > ul > li > ul > li > a:hover {
	color:#339999;
	background-color:#fff;
	border-left: 1px solid #339999;
	border-right: 1px solid #339999;
	}
nav > ul > li > ul > li > a.dernier:hover {
	border-radius: 0px 0px 15px 0px;
	border-bottom: 1px solid #339999;
	}
/**** HOME SECTION ****/

#home {
  height: 102vh;
  /* background-image: url("../img/bg.jpg"); */
  background-position: center;
  background-repeat: no-repeat;
  background-size: auto 100%;
}
#home h2.pacte{
}
#home h1{
 text-transform:uppercase;
}

/*****************/

#home .title-container {
  padding: 20px 20px;
  display: block;
  width:100%;
 background-color: white;
 opacity: 0.85;
}

#home .title {
  font-weight: bold;
  font-size: 30px;
  opacity: 0.95;
  color:#339999;
}

h1.title, div.title {
	color:#339999;
	}
h1.title span, div.title span {
	color:#cccc33;
	}
.title span.txt{
	color:#000;
	font-size: 20px;
	  font-weight: normal;
	}
.subtitle {
  padding-top: 15px;
  font-size: 30px;
  font-weight: bolder;
  color: white;
}

.home-container {
  top: 40%;
}

#more-button {
  border-color: #ffa500;
  color: #ffa500;
}
#home #more-button {
  color: #000;
}
#more-button:focus {
  background-color: transparent;
  color: white;
}

#more-button:hover {
  background-color: #ffa500;
  color: white;
}

/**** SERVICES + FORMATION SECTION *****/

#services, #formation {
  padding-bottom: 5px;
  background-color: #F0F3F3;
}

#formation {
  padding-bottom: 5px;
  background-color: white;
}

.more-card {
  color: #323232;
  font-weight: bold;
}

.more-card:hover {
  color: #ffa500;
  font-weight: bold;
}

#services-title, #formation-title {
  color: rgba(0, 0, 0, 0.7);
  text-transform: uppercase;
  font-size: 40px;
  margin-bottom: 15px;;
}

#services-subtitle, #formation-subtitle {
  color: rgba(0, 0, 0, 0.7);
  text-transform: initial;
  font-size: 20px;
}

#services-subtitle {
  margin-bottom: 3%;
}

#formation-subtitle {
  margin-bottom: 7%;
}

#services-subtitle blockquote, #formation-subtitle blockquote {
  font-style: oblique;
}

#services-columns, #formation-columns {
  margin-bottom: 5%;
}

.fa-circle {
  color: #ffa500;
}

.services-h4, .formation-h4 {
  color: #333;
  font-weight: bold;
  font-size: 20px;
  margin-bottom: 10px;
}

.services-text, .formation-text {
  color: #777;
  font-style: italic;
  font-size: 14px;
  text-align: justify;
  text-align-last: center;
}

.tooltip {
  position: relative;
  display: inline;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 150px;
  background-color: black;
  color: #fff;
  font-size: 12px;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;

  left: 102%; 

  /* Position the tooltip text - see examples below! */
  position: absolute;
  z-index: 1;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}

/**** WHO SECTION *****/

.image-bio {
  display: block;
  margin: 0 auto;
  margin-bottom: 15px;
}

#who {
  background-color: white;
  padding-bottom: 20px;
  padding-top: 50px;;
}

#who-title {
  color: rgba(0, 0, 0, 0.7);
  text-transform: uppercase;
  font-size: 40px;
}

#who-subtitle {
  color: rgba(0, 0, 0, 0.7);
  text-transform: initial;
  font-style: oblique; 
  font-size: 20px;
  padding-top: 5px; 
  margin-bottom: 3%;
}

.timeline-body p a {
  color: #3776D9;
}

.timeline-body p a:hover {
  color: black;
}

#first {
  background-color: #1622ad;
}

#second {
  background-color: #ffa500;
}

#third {
  background-color: #CC0000;
}

#fourth {
  background-color: #323232;
}

/**** BIO SECTION *****/

#bio {
  background-color: #F0F3F3;
}

#bio-title {
  color: rgba(0, 0, 0, 0.7);
  text-transform: uppercase;
  font-size: 40px;
  margin-bottom: 15px;;
}

#bio-subtitle {
  color: rgba(0, 0, 0, 0.7);
  text-transform: initial;
  font-size: 20px;
  margin-bottom: 3%;
}

.bio-image {
  width: 280px;
  height: 350px;
  object-fit: cover;
  object-position: center right;
}

.bio-content {
  text-align: justify;
  margin-left: 25px;
}

#bio-name {
  margin-bottom: 25px;
  color: #ffa500;
  font-size: 20px;
  text-transform: initial;
  font-weight: bold;
}

#bio-name span {
  color: rgba(0, 0, 0, 0.7);
}

/**** REALISATIONS SECTION *****/

#realisations {
  background-color: #F0F3F3;
  padding-top: 50px;
  padding-bottom: 50px;
}

#realisations .column img {
  max-width: 150px;
  height: 100px;
}

#realisations .column .fasti {
  max-height: 60px;
  margin-top: 15px;
}

/**** FOOTER ****/
.footer {
  background-color: #323232;
  padding: 10px;
}

.footer h2 span {
  color: #ffa500;
}

.footer p, .footer a {
  color: white;
}

.footer a {
  display: inherit;
}

.footer h2 {
  color: white;
  font-size: 1.2rem;
  font-weight: bold;
  margin-top: 30px;
  margin-bottom: 5px;
}

.footer hr {
  height: 3px;
  max-width: 50px;
  background-color: #ffa500;
  margin: 0 auto;
  margin-bottom: 5px;
}

.footer i {
  padding-top: 15px;
}

.footer-icon {
  color: white;
}

.footer, li, a {
  color: #323232;
}

.footer, li, a:hover {
  color:#ffa500;
}

div.column.auto, div.column.is-half {
  padding-bottom: 0;
}

div.columns.has-text-centered {
  margin-top: 20px;
  margin-bottom: 20px;
}

.hover-link:hover {
  background-color: #ffa500;
  border-radius: 6px;
  padding: 5px;
}

.legals {
  font-size: 12px;
}