lp_content h2{ font-family: "Open Sans" !important;font-size: 40px !important;font-weight: 700 !important; } .lp_content h3{font-family: "Open Sans" !important; font-size: 30px !important; font-weight: 600 !important; } .lp_content_h1 { background-color: #F4F4F4B2; padding: 82px 60px; border-radius: 32px; text-align: center; margin-top: 70px !important; margin-bottom: 75px !important; } .lp_content_h1 h1{ font-family: "Open Sans" !important; font-size: 46px !important; font-weight: 700 !important; } .lp_separa { width: 120px; display: inline-block; background-color: #333333; height: 4px; margin-top: 20px; } .lp_btn_h1 { margin-top: 48px !important; } .lp_btn_h1 a { background-color: #333333; color: #fff !important; padding: 14px 32px; border-radius: 60px; border: 2px solid #333333; font-weight: 700; font-size: 16px !important; } .lp_btn_h1 a:hover { background-color: transparent; color: #333333 !important; } .lp_content1_h2{ padding-top: 10px; padding-bottom: 55px; } .lp_content2_h2 { background-color: #F4F4F4B2; padding: 50px 82px; border-radius: 32px; width: 100%; max-width: 1563px; margin: 0 auto; } .lp_phrase_dacroche { text-align: center; border: 1px solid #5C5C5C; padding: 72px 80px; border-radius: 32px; margin-top: 75px !important; margin-bottom: 75px !important; } .lp_btn_pcroche { display: flex; flex-direction: row; justify-content: center; align-items: center; align-content: center; margin-top: 50px !important; } .lp_contact_pcroche a, .lp_tel_pcroche a{ background-color: #333333; color: #fff !important; padding: 14px 32px; border-radius: 60px; border: 2px solid #333333; font-weight: 700; font-size: 16px !important; margin: 0px 16px; } .lp_contact_pcroche a:hover, .lp_tel_pcroche a:hover{ background-color: transparent; color: #333333 !important; } .lp_content_pf { display: flex; flex-direction: row; justify-content: center; align-items: center; margin-top: 75px !important; margin-bottom: 75px !important; } .lp_pf_content { background-color: #F4F4F4B2; border-radius: 32px; padding: 50px 20px; margin-right: 20px; text-align: center; } .lp_faq h3{ margin-bottom: 40px !important; } .lp_faq details { background-color: #F4F4F4B2; padding: 20px; margin-bottom: 20px; border-radius: 8px; } .lp_faq summary { font-size: 20px !important; font-weight: 600; } @media screen and (max-width: 760px){ .lp_content_h1 h1{font-size: 35px !important;} .lp_content h2{font-size: 33px !important;} .lp_content_h1 {padding: 25px 20px; border-radius: 0px; margin-top: 0px !important; margin-bottom: 0px !important;} .lp_btn_h1 {margin-bottom: 25px;} .lp_content1_h2 {padding: 20px;} .lp_content2_h2 {padding: 20px; border-radius: 0px;} .lp_content3_h2 {padding: 20px;} .lp_phrase_dacroche {padding: 20px; margin-top: 50px !important; margin-bottom: 0px !important;} .lp_btn_pcroche{flex-direction: column; margin-bottom: 23px;} .lp_contact_pcroche{margin-bottom: 45px;} .lp_content_pf {flex-direction: column; margin-top: 0px !important; margin-bottom: 0 !important; padding: 20px;} .lp_pf_content {padding: 25px 20px; margin-right: 0; margin-bottom: 25px;} .lp_faq {padding: 20px;} .lp_content h3 {font-size: 28px !important;} } @media screen and (min-width: 761px) and (max-width: 1500px){ .lp_content_h1 {padding: 25px 20px; margin: 20px 0px; border-radius: 0px; margin-top: 20px !important; margin-bottom: 10px !important;} .lp_btn_h1 {margin-bottom: 25px;} .lp_content1_h2 {padding: 20px;} .lp_content2_h2 {padding: 20px; margin: 20px 0px;} .lp_content3_h2 {padding: 20px;} .lp_phrase_dacroche {padding: 20px; margin: 15px 0px !important;} .lp_content_pf {margin-top: 0px !important; margin-bottom: 0 !important; padding: 20px;} .lp_pf_content {padding: 25px 20px; margin-right: 0; margin-bottom: 25px; margin-left: 15px;} .lp_faq {padding: 20px;} .lp_contact_pcroche, .lp_tel_pcroche{margin-bottom: 20px;} .lp_content h3 {font-size: 28px !important;} } @media screen and (min-width: 1510px){ .lp_largeur_page{width: 100%; max-width: 1400px; margin: 0 auto;} .lp_content_img img {height: 100%; max-height: 500px; width: 100%;} } /* Maillage section CSS Starts */ .services-section { max-width: 1200px; margin: 0 auto; padding: 2rem; font-family: Arial, sans-serif; overflow: hidden; } .section-title { font-size: 1.8rem; margin-bottom: 1.5rem; color: #333; } .section-subtitle { color: #666; margin-bottom: 2rem; line-height: 1.6; } .slider-container { position: relative; overflow-x: auto; /* Enable horizontal scrolling */ overflow-y: hidden; /* Hide vertical scrolling */ white-space: nowrap; /* Prevent items from wrapping */ -webkit-overflow-scrolling: touch; /* Smooth scrolling for touch devices */ padding-bottom: 1rem; /* Space for visual balance */ scrollbar-width: thin; /* For Firefox */ scrollbar-color: #e3e3e3 #f9f9f9; /* For Firefox */ } /* Custom scrollbar styling for Webkit browsers */ .slider-container::-webkit-scrollbar { height: 10px; /* Set the scrollbar height */ background: white; /* Background of the scrollbar track */ } .slider-container::-webkit-scrollbar-thumb { background-color: rgb(88, 88, 88); /* Scrollbar thumb color */ border-radius: 5px; /* Rounded scrollbar thumb */ } .slider-container::-webkit-scrollbar-track { background-color: white; /* Track background color */ border-radius: 5px; /* Rounded scrollbar track */ } .slider-track { display: inline-flex; /* Align items horizontally */ gap: 1rem; /* Add space between slides */ margin: 0; padding: 0; list-style: none; list-style: none; margin: 0; padding: 0; display: flex; transition: transform 0.3s ease-out; } .slider-track li { min-width: calc(33.333% - 1rem); flex-shrink: 0; margin-right: 1rem; background: #f5f5f5; padding: 2rem; border-radius: 8px; text-align: center; position: relative; } .slider-track li::before { content: ''; position: absolute; top: 1rem; left: 1rem; width: 50px; height: 50px; background-image: url('https://icons.veryicon.com/png/o/miscellaneous/light-e-treasure-3/search-286.png'); /* Set the image as background */ background-size: cover; /* Ensure the image covers the entire area */ background-position: center; /* Center the image */ border-radius: 50%; opacity: 0.1; } .slide-title { color: #1a237e; font-size: 1.2rem; margin: 0; position: relative; } .voir-plus { display: block; width: fit-content; margin: 2rem auto; padding: 0.8rem 2rem; background: #4051b5; color: white; text-decoration: none; border-radius: 4px; text-transform: uppercase; font-weight: bold; cursor: pointer; border: none; text-align: center; transition: background-color 0.3s ease; } .voir-plus:hover { background: #303f9f; } @media (max-width: 768px) { .slider-track li { min-width: calc(50% - 1rem); /* Allow two slides per row on tablets */ }.slider-container { padding-bottom: 0.5rem; /* Adjust scrollbar spacing */ } } @media (max-width: 480px) { .slider-track li { min-width: calc(100% - 1rem); /* Single slide for narrow screens */ } .slider-container { padding-bottom: 0.3rem; } }  /* Maillage section CSS ends */