|
|
| Ligne 1 : |
Ligne 1 : |
| /* Tout CSS placé ici sera chargé avec les pages accédées par les utilisateurs de l’habillage Vector */ | | /* Tout CSS placé ici sera chargé avec les pages accédées par les utilisateurs de l’habillage Vector */ |
|
| |
|
| |
| @import url('https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;800&display=swap');
| |
|
| |
| body{
| |
| font-family: 'Segoe UI', Arial, Helvetica, sans-serif !important;
| |
| }
| |
| .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', Arial, Helvetica, 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', Arial, Helvetica, 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;
| |
| }
| |