agecem-org/public/css/header.css

81 lines
1.4 KiB
CSS
Raw Normal View History

.header {
width: 100%;
}
.headerWrapper{
display: flex;
flex-flow: row;
align-items: center;
justify-content: space-between;
padding: 5px;
}
a{
color: #000;
text-decoration: none;
}
a:visited{
color: #000;
text-decoration: none;
}
.headerMenu {
font-family: "Poppins";
font-weight: 400; /*regular*/
font-size: 1.25rem; /*20px*/
color: #000; /*Noir pur*/
2023-08-08 17:43:48 -04:00
list-style: none;
font-style: none;
display: none;
width: 100%;
2023-08-08 17:43:48 -04:00
}
.headerMenuElement{
padding-bottom: 5px;
}
.headerMenuElement:hover {
border-bottom: 5px #FF563C solid; /*Orange Highlight*/
cursor: pointer;
padding-bottom: 0;
}
.headerMenuHamburger{
fill: #394596;
height: 50px;
width: 50px;
2023-08-08 17:43:48 -04:00
}
/* Le header s'affiche en menu hamburger pour les breakpoints téléphone et tablette */
2023-08-08 17:43:48 -04:00
.headerMenuHamburger{
display: block;
}
2023-08-08 17:43:48 -04:00
@media screen and (min-width: 778px) {
.headerMenu{
display: none;
}
.headerMenuHamburger{
display: block;
}
}
/* Les éléments du header s'affichent pour le breakpoint ordinateur */
@media screen and (min-width: 1140px) {
.headerMenu{
display: flex;
flex-flow: row;
justify-content: space-around;
align-items: center;
}
2023-08-08 17:43:48 -04:00
.headerMenuHamburger{
display: none;
}
}