54
modifications
(Contenu remplacé par « →Tout CSS placé ici sera chargé avec les pages accédées par les utilisateurs du site mobile : ») Balises : Contenu remplacé Modification par le web mobile Modification par mobile |
Balises : Modification par le web mobile Modification par mobile |
||
Ligne 1 : | Ligne 1 : | ||
/* Tout CSS placé ici sera chargé avec les pages accédées par les utilisateurs du site mobile */ | /* Tout CSS placé ici sera chargé avec les pages accédées par les utilisateurs du site mobile */ | ||
@import url( 'https://fonts.googleapis.com/css?family=Nunito:wght@300;400;500;800&display=swap'); | |||
body{ | |||
font-family: 'Segoe UI', Arial, Helvetica, sans-serif; | |||
} | |||
.corpsContenu{ | |||
right: 0; | |||
left: 0; | |||
margin: auto; | |||
padding: 0; | |||
max-width: 944px; | |||
} | |||
/* positionnements */ | |||
.pr{ | |||
position: relative; | |||
} | |||
.pa{ | |||
position: absolute; | |||
} | |||
/* texte */ | |||
h1{ | |||
font-size: 30px; | |||
font-family: 'Nunito', sans-serif !important; | |||
font-weight: 800; | |||
} | |||
.banniereTitre{ | |||
margin: 0; | |||
padding: 0; | |||
bottom: 170px; | |||
width: 100%; | |||
text-align: center; | |||
color: white; | |||
border-bottom: none; | |||
} | |||
h2{ | |||
position: relative; | |||
margin: 0; | |||
text-align: left; | |||
color: #1c2731; | |||
font-size: 35px; | |||
font-family: 'Nunito', sans-serif !important; | |||
font-weight: 500; | |||
} | |||
.banniereSection h2{ | |||
color: white; | |||
width: 100%; | |||
padding: 20px 0px 0px 10%; | |||
font-size: 25px; | |||
font-weight: 800; | |||
border-bottom: none; | |||
} | |||
p{ | |||
position: relative; | |||
margin: 0; | |||
color: #1f242a; | |||
font-weight: 400; | |||
} | |||
.banniereEntete p{ | |||
margin: 0; | |||
padding: 0; | |||
bottom: 20px; | |||
right: 30px; | |||
width: 100%; | |||
color: white; | |||
text-align: right; | |||
font-weight: 500; | |||
} | |||
.footer p{ | |||
position: absolute; | |||
padding: 0; | |||
bottom: 25px; | |||
right: 140px; | |||
text-align: right; | |||
color: #1c2731; | |||
} | |||
.footer p~div{ | |||
position: absolute; | |||
margin: 0; | |||
padding: 0; | |||
bottom: 20px; | |||
right: 30px; | |||
width: 100px; | |||
} | |||
/* boites qui séparent les sections */ | |||
.configContenu{ | |||
right: 0; | |||
left: 0; | |||
margin: auto; | |||
padding: 0; | |||
width: 100%; | |||
} | |||
.contenuIndente{ | |||
padding: 10px 10%; | |||
width: 80%; | |||
} | |||
.banniereEntete{ | |||
height: 300px; | |||
} | |||
.h-100per{ | |||
height: 100%; | |||
} | |||
.banniereSection{ | |||
height: 120px; | |||
} | |||
.motifExagonalOrange{ | |||
background-color: #DC8629; | |||
background-image: linear-gradient(30deg, #f09432 12%, transparent 12.5%, transparent 87%, #f09432 87.5%, #f09432), | |||
linear-gradient(150deg, #f09432 12%, transparent 12.5%, transparent 87%, #f09432 87.5%, #f09432), | |||
linear-gradient(30deg, #f09432 12%, transparent 12.5%, transparent 87%, #f09432 87.5%, #f09432), | |||
linear-gradient(150deg, #f09432 12%, transparent 12.5%, transparent 87%, #f09432 87.5%, #f09432), | |||
linear-gradient(60deg, #FA9D39 25%, transparent 25.5%, transparent 75%, #FA9D39 75%, #FA9D39), | |||
linear-gradient(60deg, #FA9D39 25%, transparent 25.5%, transparent 75%, #FA9D39 75%, #FA9D39); | |||
background-size:80px 140px; | |||
background-position: 0 0, 0 0, 40px 70px, 40px 70px, 0 0, 40px 70px; | |||
} | |||
.degradeOrange{ | |||
background: linear-gradient(45deg, rgba(128, 68, 3, 0.6), rgba(217, 93, 77, 0.6), rgba(222, 138, 46, 0.6)); | |||
top: 0; | |||
} | |||
.motifExagonalBleu{ | |||
background-color: #277FC7; | |||
background-image: linear-gradient(30deg, #2c85cf 12%, transparent 12.5%, transparent 87%, #2c85cf 87.5%, #2c85cf), | |||
linear-gradient(150deg, #2c85cf 12%, transparent 12.5%, transparent 87%, #2c85cf 87.5%, #2c85cf), | |||
linear-gradient(30deg, #2c85cf 12%, transparent 12.5%, transparent 87%, #2c85cf 87.5%, #2c85cf), | |||
linear-gradient(150deg, #2c85cf 12%, transparent 12.5%, transparent 87%, #2c85cf 87.5%, #2c85cf), | |||
linear-gradient(60deg, #4297dc 25%, transparent 25.5%, transparent 75%, #4297dc 75%, #4297dc), | |||
linear-gradient(60deg, #4297dc 25%, transparent 25.5%, transparent 75%, #4297dc 75%, #4297dc); | |||
background-size:80px 140px; | |||
background-position: 0 0, 0 0, 40px 70px, 40px 70px, 0 0, 40px 70px; | |||
} | |||
.degradeBleu{ | |||
background: linear-gradient(45deg, rgba(4, 50, 102, 0.8), rgba(30, 94, 159, 0.7), rgba(44, 133, 207, 0.7)); | |||
top: 0; | |||
background-blend-mode: multiply, screen, normal; | |||
} | |||
.degradeGrisClair{ | |||
background: linear-gradient(45deg, rgba(235, 235, 235, 0.9), rgba(255, 255, 255, 0.99)); | |||
top: 0; | |||
background-blend-mode: multiply, screen, normal; | |||
} | |||
/* images */ | |||
.banniereEnteteImg{ | |||
padding: 0; | |||
height: 130px; | |||
position: absolute; | |||
right: 0; | |||
left: 0; | |||
margin: auto; | |||
bottom: 60px; | |||
} | |||
.iconeSousTexte{ | |||
height: 60%; | |||
position: absolute; | |||
top: 60px; | |||
} | |||
.relierIconeAuGradient{ | |||
fill:url(#Gradient1); | |||
opacity: 1; | |||
} | |||
.background1{ | |||
background-image: url('https://wiki.fabbulle.tech/images/4/4a/Thomas-xavier-min.jpg'); | |||
background-position: center; | |||
background-size: cover; | |||
} | |||
.background2{ | |||
background-image: url('https://wiki.fabbulle.tech/images/thumb/6/6c/Realisation-min.jpg/1200px-Realisation-min.jpg'); | |||
background-position: center bottom; | |||
background-size: cover; | |||
} | |||
.background3{ | |||
background-image: url('https://wiki.fabbulle.tech/images/thumb/3/35/Surjetteuse-min.jpg/1200px-Surjetteuse-min.jpg'); | |||
background-position: center; | |||
background-size: cover; | |||
} | |||
/* margin et padding */ | |||
.pt-50{ | |||
padding-top: 50px; | |||
} | |||
.mb-100{ | |||
margin-bottom: 100px; | |||
} | |||
.mb-70{ | |||
margin-bottom: 70px; | |||
} | |||
.mb-50{ | |||
margin-bottom: 50px; | |||
} |
modifications