@import url("https://fonts.googleapis.com/css2?family=Lato:wght@100;300;400;700;900&display=swap");
@import url("https://fonts.googleapis.com/css2? family= Baloo+2:wght@400;500;600;700;800 & display=swap"); body {
overflow-x: hidden;
background-color: #fcfcfc !important;
padding-top: 85px;
}
@media (max-width: 991px) {
body {
padding-top: 24px;
}
}
html {
scroll-behavior: smooth;
}
.no-gutter > [class*=col-] {
padding-right: 0;
padding-left: 0;
}
.container-fluid {
padding-right: 0 !important;
padding-left: 0 !important;
}
.wp-block-columns {
margin-bottom: 0 !important;
}
.row {
margin-left: 0 !important;
margin-right: 0 !important;
}
.none {
display: none;
}
.none-mobile {
display: none;
}
.collapse-block {
display: block !important;
}
a, p, h1, h2, h3, h4 {
font-family: "Baloo 2", sans-serif !important;
}
h1, h2, h3, h4 {
color: #A3C4D1 !important;
font-family: "Lato", sans-serif !important;
}
.btn-psy {
display: inline-block;
width: 275px;
padding: 10px 20px;
color: white;
background-color: transparent;
border: 2px solid #B8D8C4;
border-radius: 3px;
text-decoration: none;
text-align: center;
transition: 0.8s;
}
.btn-psy:hover {
color: white;
background-color: #B8D8C4;
text-decoration: none;
transition: 0.8s;
}
.btn-basic {
width: 100%;
margin-bottom: 0;
}
.btn-basic a {
display: inline-block;
padding: 10px 20px;
color: #B8D8C4;
background-color: transparent;
border: 2px solid #B8D8C4;
border-radius: 3px;
text-decoration: none;
text-align: center;
font-size: 20px;
transition: 0.8s;
}
.btn-basic a:hover {
color: white;
background-color: #B8D8C4;
text-decoration: none;
transition: 0.8s;
} @media (min-width: 992px) {
.none-mobile {
display: initial;
}
} #header.scrolled {
background-color: #A3C4D1;
transition: 0.5s;
}
#header.scrolled #header-grid-menu {
text-align: right;
position: relative;
}
#header.scrolled #header-grid-menu #menu_principale ul li:after {
background-color: transparent !important;
transition: background-color 0.7s;
}
#header.scrolled #header-grid-menu #menu_principale ul li:hover:after {
background-color: white !important;
transition: background-color 0.7s;
}
#header.scrolled #header-grid-menu #menu_principale ul .active:after {
background-color: white !important;
} #footer {
position: relative;
background-color: #A3C4D1;
margin-top: 200px;
}
#footer:before {
content: "";
position: absolute;
top: -269px;
background-repeat: no-repeat;
background-image: url(https://luciledelin-psychologue.fr/wp-content/uploads/2024/12/mental-7018783_1280-1.png);
background-size: 450px;
background-position: center;
width: 100%;
height: 100%;
z-index: -1;
}
#footer #footer-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
padding: 40px 0;
width: 90%;
margin-left: auto;
margin-right: auto;
}
#footer #footer-grid #footer-grid-logo #footer-grid-logo-img {
background-image: url(https://luciledelin-psychologue.fr/wp-content/uploads/2024/12/logo-lucile-3.png);
background-repeat: no-repeat;
background-size: 123px;
margin-top: -15px;
margin-left: -7px;
height: 68px;
width: 104px;
}
#footer #footer-grid #footer-grid-menu #menu_footer ul {
list-style: none;
padding-left: 5px;
}
#footer #footer-grid #footer-grid-menu #menu_footer ul li {
position: relative;
margin-bottom: 10px;
}
#footer #footer-grid #footer-grid-menu #menu_footer ul li a {
color: #4A4A4A;
transition: color 0.5s;
font-weight: 600;
}
#footer #footer-grid #footer-grid-menu #menu_footer ul li a:hover {
text-decoration: none;
transition: color 0.5s;
}
#footer #footer-grid #footer-grid-menu #menu_footer ul li:after {
content: "";
position: absolute;
width: 30px;
background-color: transparent;
height: 2px;
bottom: -1px;
left: 0;
transition: background-color 0.7s;
}
#footer #footer-grid #footer-grid-menu #menu_footer ul li:hover:after {
background-color: white;
transition: background-color 0.7s;
}
#footer #footer-grid #footer-grid-menu #menu_footer ul .active:after {
content: "";
position: absolute;
width: 30px;
background-color: white;
height: 2px;
bottom: -1px;
left: 0;
}
#footer #footer-grid p {
color: #4A4A4A;
}
#footer #footer-grid .titre {
color: #4A4A4A !important;
font-weight: 600;
font-size: 23px;
}
#footer #footer-grid .btn-psy {
margin-bottom: 10px;
}
#footer #footer-grid .btn-psy i {
margin-right: 5px;
}
#footer #footer-cgu-legale {
display: flex;
justify-content: center;
align-items: center;
}
#footer #footer-cgu-legale p {
color: #4A4A4A;
font-weight: 500;
font-size: 11px;
margin-bottom: 0;
}
#footer #footer-cgu-legale #menu_footer_legale ul {
list-style: none;
text-align: center;
margin-bottom: 0;
}
#footer #footer-cgu-legale #menu_footer_legale ul li {
position: relative;
display: inline-block;
margin-bottom: 10px;
}
#footer #footer-cgu-legale #menu_footer_legale ul li a {
color: #4A4A4A;
transition: color 0.5s;
font-weight: 500;
font-size: 11px;
margin: 0 10px;
}
#footer #footer-cgu-legale #menu_footer_legale ul li a:hover {
text-decoration: none;
transition: color 0.5s;
}
#footer #footer-cgu-legale #menu_footer_legale ul li:after {
content: "";
position: absolute;
width: 10px;
background-color: transparent;
height: 1px;
bottom: -1px;
left: 0;
margin-left: 10px;
transition: background-color 0.7s;
}
#footer #footer-cgu-legale #menu_footer_legale ul li:hover:after {
background-color: white;
transition: background-color 0.7s;
}
#footer #footer-cgu-legale #menu_footer_legale ul .active:after {
content: "";
position: absolute;
width: 10px;
background-color: white;
height: 1px;
bottom: -1px;
margin-left: 10px;
left: 0;
}
@media screen and (max-width: 1023px) {
#footer:before {
top: -459px;
background-size: 350px;
}
#footer #footer-grid {
display: grid;
grid-template-columns: 1fr;
text-align: center;
width: 100%;
padding: 20px 10px;
}
#footer #footer-grid #footer-grid-logo a #footer-grid-logo-img {
margin-bottom: 15px;
background-position: center;
margin-top: 0;
margin-left: 0;
}
#footer #footer-grid #footer-grid-info {
grid-row: 2;
}
#footer #footer-grid #footer-grid-menu {
grid-row: 4;
}
#footer #footer-grid #footer-grid-menu ul {
padding: 0;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
#footer #footer-grid #footer-grid-menu ul li {
width: 100%;
text-align: center;
width: -moz-fit-content;
width: fit-content;
}
#footer #footer-grid .titre {
margin-top: 20px;
margin-bottom: 10px;
}
} .banniere-accueil .titre {
color: white !important;
font-size: 38px !important;
font-weight: 500;
line-height: 45px;
}
.a-propos-accueil .titre {
font-size: 32px;
font-weight: 500;
}
.a-propos-accueil p {
font-size: 18px;
font-weight: 500;
color: #4A4A4A;
}
.champs-pro .titre {
font-size: 32px;
font-weight: 500;
}
.champs-pro .colonnes {
margin: 0 2em;
}
.champs-pro .colonnes .colonne .sous-titre {
margin-top: 30px;
font-size: 25px;
font-weight: 500;
}
.champs-pro .colonnes .colonne p {
font-size: 18px;
font-weight: 500;
color: #4A4A4A;
}
.champs-pro .colonnes .colonne .btn {
width: 100%;
}
.champs-pro .colonnes .colonne .btn a {
display: inline-block;
padding: 10px 20px;
color: #B8D8C4;
background-color: transparent;
border: 2px solid #B8D8C4;
border-radius: 3px;
text-decoration: none;
text-align: center;
font-size: 20px;
transition: 0.8s;
}
.champs-pro .colonnes .colonne .btn a:hover {
color: white;
background-color: #B8D8C4;
text-decoration: none;
transition: 0.8s;
}
.banniere-wisk-accueil .titre {
font-size: 32px;
font-weight: 500;
}
.banniere-wisk-accueil p {
font-size: 18px;
font-weight: 500;
}
.banniere-wisk-accueil .btn {
width: 100%;
margin-bottom: 0;
}
.banniere-wisk-accueil .btn a {
display: inline-block;
padding: 10px 20px;
color: #B8D8C4;
background-color: transparent;
border: 2px solid #B8D8C4;
border-radius: 3px;
text-decoration: none;
text-align: center;
font-size: 20px;
transition: 0.8s;
}
.banniere-wisk-accueil .btn a:hover {
color: white;
background-color: #B8D8C4;
text-decoration: none;
transition: 0.8s;
}
.contacter-accueil .titre {
font-size: 32px;
font-weight: 500;
}
.contacter-accueil p {
font-size: 18px;
font-weight: 500;
}
.contacter-accueil .btn {
width: 100%;
margin-bottom: 0;
}
.contacter-accueil .btn a {
display: inline-block;
padding: 10px 20px;
color: #B8D8C4;
background-color: transparent;
border: 2px solid #B8D8C4;
border-radius: 3px;
text-decoration: none;
text-align: center;
font-size: 20px;
transition: 0.8s;
}
.contacter-accueil .btn a:hover {
color: white;
background-color: #B8D8C4;
text-decoration: none;
transition: 0.8s;
} @media (max-width: 992px) {
.a-propos-accueil p, .banniere-wisk-accueil p {
text-align: center;
}
.banniere-accueil .titre {
font-size: 27px !important;
}
}
#form-contact-lucile p label {
width: 100%;
}
#form-contact-lucile p label span {
width: 100%;
}
#form-contact-lucile p label span input, #form-contact-lucile p label span textarea {
width: 100%;
border: 2px solid #B8D8C4;
border-radius: 3px;
height: 43px;
padding-left: 20px;
}
#form-contact-lucile p label span textarea {
height: 165px;
}
#form-contact-lucile .btn-form-psy input {
display: inline-block;
width: 100%;
padding: 10px 20px;
color: #B8D8C4;
background-color: transparent;
border: 2px solid #B8D8C4;
border-radius: 3px;
text-decoration: none;
text-align: center;
font-size: 20px;
transition: 0.8s;
}
#form-contact-lucile .btn-form-psy input:hover {
color: white;
background-color: #B8D8C4;
text-decoration: none;
transition: 0.8s;
}
#header {
background-color: transparent;
position: fixed;
margin-top: 0;
top: 0;
z-index: 9;
width: 100vw;
}
#header #header-grid {
display: grid;
grid-template-columns: 185px auto 0;
padding-top: 43px;
width: 90%;
margin-left: auto;
margin-right: auto;
}
#header #header-grid #header-grid-logo {
position: relative;
}
#header #header-grid #header-grid-logo #header-grid-logo-img {
background-image: url(https://luciledelin-psychologue.fr/wp-content/uploads/2024/12/logo-lucile-3.png);
background-repeat: no-repeat;
background-size: 123px;
background-position: center;
position: absolute;
top: -36px;
height: 68px;
width: 104px;
}
#header #header-grid #header-grid-menu {
text-align: right;
position: relative;
}
#header #header-grid #header-grid-menu #menu_principale ul li {
display: inline-block;
text-align: center;
padding: 0 20px;
position: relative;
}
#header #header-grid #header-grid-menu #menu_principale ul li a {
color: #4A4A4A;
transition: color 0.5s;
font-weight: 600;
}
#header #header-grid #header-grid-menu #menu_principale ul li a:hover {
text-decoration: none;
transition: color 0.5s;
}
#header #header-grid #header-grid-menu #menu_principale ul li:after {
content: "";
position: absolute;
margin-left: 19px;
width: 30px;
background-color: transparent;
height: 2px;
bottom: -1px;
left: 0;
transition: background-color 0.7s;
}
#header #header-grid #header-grid-menu #menu_principale ul li:hover:after {
background-color: #A3C4D1;
transition: background-color 0.7s;
}
#header #header-grid #header-grid-menu #menu_principale ul .active:after {
content: "";
position: absolute;
margin-left: 19px;
width: 30px;
background-color: #A3C4D1;
height: 2px;
bottom: -1px;
left: 0;
}
@media screen and (max-width: 1023px) {
#header {
background-color: #A3C4D1;
}
#header #header-grid {
width: 100%;
padding-top: 10px;
padding-bottom: 10px;
grid-template-columns: 232px auto 0;
}
#header #header-grid #header-grid-logo a #header-grid-logo-img {
position: initial !important;
height: 50px !important;
background-size: 96px !important;
width: 65% !important;
}
#header #header-grid #header-grid-menu {
position: absolute !important;
top: 0;
right: 0;
background-color: rgba(163, 196, 209, 0.9);
width: 100%;
height: 100vh;
display: none;
z-index: 100;
padding-top: 80px;
}
#header #header-grid #header-grid-menu ul {
list-style: none;
padding: 0;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
#header #header-grid #header-grid-menu ul li {
margin: 10px 0;
width: 100%;
text-align: center;
width: -moz-fit-content;
width: fit-content;
}
#header #header-grid #header-grid-menu ul li a {
font-size: 18px !important;
line-height: 27px !important;
}
#header #header-grid #header-grid-menu ul .active:after {
background-color: white !important;
}
#header .menu-burger {
display: block;
position: absolute;
cursor: pointer;
right: 20px;
top: 17px;
z-index: 101;
}
#header .menu-burger .bar {
width: 30px;
height: 4px;
background-color: white;
margin: 6px 0;
transition: 0.4s;
}
#header .menu-burger.open .bar:nth-child(1) {
transform: rotate(-45deg) translate(-5px, 6px);
}
#header .menu-burger.open .bar:nth-child(2) {
opacity: 0;
}
#header .menu-burger.open .bar:nth-child(3) {
transform: rotate(45deg) translate(-8px, -9px);
}
}
@media screen and (max-width: 1023px) {
.none-mobile {
display: none;
}
}
@media (min-width: 1024px) {
.none-pc {
display: none;
}
}
.btn a {
white-space: pre-wrap;
}