ACCOMPAGNEMENTS FORMATIFS POUR LES ÉQUIPES DU SECTEUR PUBLIC

/ Voici un exemple de css custom pour le theme margot, il agit sur les variables css non personnalisables dans le theme et permet de faire des css sur mesure. Chaque ligne ci-dessous est à décommenter pour etre utilisée Pour en savoir plus, voyez la documentation sur https://yeswiki.net/?DocumentationThemeMargot /

@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:wght@400;700&display=swap');

:root{

• -main-text-fontfamily: 'Fira', sans-serif;
• -title-h1-color:#89201f;
• -title-h2-color:#91622c;
• -title-h3-color:var(--secondary-color-2);
• -title-h4-color:var(--secondary-color-1);

--footer-bg-color:var(--primary-color);
}

/ Réglages des titres /
h1,h2,h3{font-weight:800;}

@media (max-width: 1200px){

• h1 { font-size: 2.5em;}
• h2 { font-size: 1.8em;}
• .lead{font-size:20px;}

}

/ Taille du logo /
#yw-topnav .navbar-brand img { max-height: 6rem; margin-left: 0;}
@media (max-width: 800px){
#yw-topnav .navbar-brand img { max-height: 3.5rem; margin-top:.5em;}
.navbar { min-height: 70px;}
}
/ Page Offre /
.col-offre{

• padding: 1em;
• background-color: #fbf8ea;
• margin-bottom: 1em;
• border: 5px solid white;
• height: 960px;
• font-size:20px;
• position:relative;

}
.col-offre h2 {

• font-size:1.8em;
• text-align:center;
• height: 250px;
• border-bottom: 5px solid var(--title-h2-color);
• / si besoin les 2 lignes cidessous permettent de centrer verticalement /
• /
• /

}

.col-offre .btn {position:absolute;bottom:10px;left:3px;width:98%}

/ pour les écrans de moins de 991px, les offres ne sont plus en colonnes mais en plein largeur /
@media (max-width:1080px){

• .col-offre{height:auto;}
• .col-offre h2 {height: auto;}

}
@media (min-width:1081px) and (max-width:1461px){

• .col-offre{height:1230px;}
• }

/ Page Accueil /
.bloc-intro{

• position:relative;
• width:85%;
• padding: 4em 5em;
• border-radius: 10px;}

.cube-intro{

• position:absolute;
• right:-125px;}

@media (max-width: 600px){
.bloc-intro{

• width:90%;
• padding:5em 1em;}

.cube-intro{bottom:-50px;}
}


/ css Jade /
.acceuil_bouton_form {

• color : red ;
• background-color: green;

}



@media screen and (max-width: 900px) {

• .acceuil_bouton_form {
• color : yellow ;
• background-color: red;

}
}

.footerpage .img-responsive{width:360px;}

---