@import url("https://fonts.googleapis.com/css2?family=Quicksand:wght@300..700&display=swap");
h1{font-size:3em;} body{
margin: 0;
padding: 0;
width: 100%;
font-family: "Quicksand", sans-serif;
font-size:1.1em;
}
#main{
float: left;
width: 100%;
margin: 75px 0 0 0;
padding: 0;
}
#content{
float: left;
width: 100%;
margin: 0;
background-color:#FFFFFF;
}
#content h2{
font-size:2em;
}
#content-post h1{
font-size:3em;
}
#content-post{
float: left;
width: 60%;
margin: 0;
padding: 20px 20%;
background-color: #FFFFFF;
}
#content-post h1{
text-align:center;
}
#content-post > .item-date{
text-align:center;
}
#actus{
width: 94%;
padding: 3%;
float: left;
background-color: #f0f0f0;
}
#breadcrumbs a{
color:#000000;
text-decoration:none;
font-weight: bold;
}
.tout{
width: 100%;
float: left;
text-align: center;
margin:50px 0px;
}
.tout a{
background-color: #4bb885;
color: #FFF;
padding: 15px;
border-radius: 10px;
text-transform: uppercase;
text-decoration: none;
}
.tout a:hover{
background-color: #514bdb;
}
.yoast-breadcrumbs{
color:#000000;
}
.yoast-breadcrumbs a{
color:#000000;
} .wp-block-details summary {
cursor: pointer;
background-color: #FFF;
border-radius: 10px;
padding: 10px;
margin: 10px 0px;
font-weight: bold;
} .progress-container {
width: 100%;
height: 5px;
float: left;
background: #514bdb;
}
.progress-bar {
height: 5px;
width: 0%;
background: rgb(0,0,255);
background: linear-gradient(90deg, rgba(0,0,255,1) 0%, rgba(142,60,252,1) 50%, rgba(87,169,131,1) 100%);
} #navbar{
width: 100%;
height: auto;
float: left;
position: fixed;
z-index: 999;
}
#header{
display: flex;
align-items: center;
justify-content: space-between;
width: 96%;
height: auto;
float: left;
margin: 0;
padding: 1% 2%;
background-color: #514bdb;
}
#logo {
margin: 0;
left: 30px;
top: 17px;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
#logo img {
height: 40px;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
#header.sticky #logo img {
height: 30px;
}
.sticky {
} #menu {
display: flex;
justify-content: flex-end;
margin: 0;
padding: 0;
}
#menu ul {
margin: 0;
padding: 0;
list-style-type: none;
display: inline-block;
}
#menu li {
display: inline-flex;
float:left;
margin: 10px;
padding:0;
}
#menu li > a {
color: #FFF;
text-decoration: none;
display: inline-block;
position: relative;
}
#menu li > a::after {
content: "";
display: block;
margin: auto;
height: 3px;
border
width: 0;
top: 5px;
background: transparent;
transition: all 0.3s;  
}
#menu li > a:hover::after, li > a.active-nav::after {
width: 100%;
background: #FFF;
border-radius:1px;
}
#menu .fa-linkedin{
margin-top: 3px;
} .overlay {
display:flex;
align-items:center;
justify-content:center;
height: 100%;
width: 0;
position: fixed;
z-index: 1;
top: 0;
left: 0;
background-color:#514bdb;
overflow-x: hidden;
transition: 0.5s;
text-align: center;
}
.overlay-content {
position: relative;
top: 25%;
width: 100%;
text-align: center;
margin-top: 30px;
}
.overlay a {
padding: 8px;
text-decoration: none;
font-size: 2em;
text-transform:lowercase;
font-weight:700;
color: #FFFFFF;
display: block;
transition: 0.3s;
}
.overlay a:hover, .overlay a:focus {
color: #eeeeee;
}
.overlay .closebtn {
position: absolute;
margin-bottom:50px;
font-size: 4em;
color:#FFF;
}
.overlay .menu{
padding:0;
margin:0;
}
#button-menu{
display:none;
}
.menu li{
list-style-type:none;
}
.closemenu{
text-align: right;
} .wpcf7 label{
font-weight: bold;
}
.wpcf7 input, .wpcf7 textarea{
font-size: 1.1em;
margin: 10px 0px 0px 0px;
border-radius: 20px;
padding: 10px;
}  #cover{
display: flex;
align-items: center;
justify-content: center;
width:100%;
height: 100vh;
float:left;
margin:0;
padding:0;
font-size:1.5em;
background-repeat: no-repeat!important;
-webkit-background-size: cover!important;
-moz-background-size: cover!important;
-o-background-size: cover!important;
background-size: cover!important;
background-position: center!important;
color:#FFF;
}
#cover-page{
float: left;
width: 90%;
padding: 10% 5% 5% 5%;
color: #FFFFFF;
background-color:#514bdb;
}
#cover-page-blog{
float: left;
width:100%;
height: 80vh;
}
#cover-page h1{
font-size:4em;
} .flex-item{
display: flex;
flex-wrap: wrap;
gap: 50px;
width: 100%;
}
.item{
flex: 1 0 25%;
-webkit-box-shadow: 0 16px 32px 0 rgb(50 50 50 / 10%);
-moz-box-shadow: 0 16px 32px 0 rgba(50,50,50,0.10);
box-shadow: 0 16px 32px 0 rgb(50 50 50 / 10%);
}
.item-img {
overflow: hidden;
border-radius: 30px 30px 0px 0px;
}
.item-img img{
width:100%;
height:auto;
transition: transform 1s;
}
.item-img img:hover{
transform: scale(1.1);
}
.item-txt{
background-color: #FFFFFF;
padding: 30px;
}
.item-txt h2{
margin: 0;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.item-txt a{
color:#000;
text-decoration:none!important;
} #footer{
width: 90%;
margin: 0;
padding: 5%;
float: left;
display: flex;
column-gap: 20px;
background-color: #514bdb;
color:#FFF;
}
.item-footer{
display: flex;
flex: 1;
padding: 0%;
margin: 0%;
float: left;
}
.item-footer .menu a{
color:#FFF;
text-decoration:none;
}
#credit{
width:98%;
padding:1%;
background-color:#EEEEEE;
text-align: center;
float:left;
font-size:0.9em;
}  @media (max-width: 979px) {
#main{
float: left;
width: 100%;
margin: 60px 0 0 0;
padding: 0;
}
#footer{
display:block;
}	
#menu{
display:none;
}
#button-menu{
display: block;
color: #FFF;
font-size: 2em;
cursor: pointer;
}
.overlay a {
font-size: 20px;
}
.overlay .closebtn {
font-size: 40px;
top: 15px;
right: 35px;
}	
}