:root {
--color-alert: #FFEA4D;
--color-white: #FFFFFF;
--color-black: #000000;
--color-light: #FAFBFC;
--color-dark: #21272C;
--color-text-base: #606F7B;
--color-title-base: #21272C;
--color-accent: #F29400;
--color-accent-hover: #F27900;
--color-accent-light: #FFF8EC;
--color-main-dark: #164E63;
--color-main: #0891B2;
--color-main-light: #F5FEFF;
--color-grey-light: #ECEFF2;
--color-grey: #8795A1;
--color-form-border: #ECEFF2;
--color-form: #F5F7F8;
--color-overlay: rgba(8, 145, 178, 0.33);
--color-shadow: rgba(0, 0, 0, 0.16);
--color-border: #DAE1E7;
--color-galerie-counter: #3D4852;
--border-width-small: 1px;
--border-width-default: 2px;
--border-width-large: 4px;
--border-radius: 2px;
--border-radius-rounded: 999px;
--font-base: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji;
--font-text: "Lato", sans-serif;
--font-title: "Merriweather Sans", sans-serif;
--font-size-1: 3em;
--font-size-2: 2.25em;
--font-size-3: 1.5em;
--font-size-4: 1.2em;
--font-size-6: 0.875em;
--font-size-base: 18px;
--font-size-small: 16px;
--font-weight-light: 300;
--font-weight-regular: 400;
--font-weight-medium: 500;
--font-weight-bold: 700;
--transition-fast: 100ms;
--transition-medium: 280ms;
--transition-slow: 380ms; } .has-white-color {
color: var(--color-white); }
.has-black-color {
color: var(--color-black); }
button {
padding: 0;
border: 0;
background: none;
cursor: pointer; }
.mapboxgl-popup-content {
color: var(--color-text-base); }
.maps {
min-height: 340px; }
.maps > div {
width: 100%;
height: 340px; }
i.start {
margin-right: 1rem; }
i.end {
margin-left: 1rem; }
.background-gray {
background-color: var(--background-color-gray); }
.background-dark-gray {
background-color: var(--background-color-dark-gray); }
.background-image {
background-position: center;
background-repeat: no-repeat;
background-size: cover; }
.mask-image {
mask-position: center;
mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-repeat: no-repeat; }
.mask-image-contain {
mask-size: contain;
-webkit-mask-size: contain; }
.mask-image-cover {
mask-size: cover;
-webkit-mask-size: cover; }
.nolist {
list-style: none;
margin: 0;
padding: 0; }
.font-extra {
font-family: var(--font-extra); }
.fullheight {
height: 100%; }
.fullwidth {
width: 100%; }
.hidden {
display: none !important; }
.center {
margin-left: auto;
margin-right: auto; }
.ellipsis {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap; }
.scroll {
overflow-x: hidden;
overflow-y: auto; }
.noscroll {
overflow: hidden; }
.text-left {
text-align: left; }
.text-center {
text-align: center; }
.text-right {
text-align: right; }
.text-italic {
font-style: italic; }
.relative {
position: relative; }
.shadow {
box-shadow: var(--shadow-elevation-2) !important; }
[class^="flex-"], [class*=" flex-"], .flex {
display: flex; }
.flex-col {
flex-direction: column; }
.flex-row {
flex-direction: row; }
.flex-auto {
flex: 1 1 auto; }
.flex-middle {
align-items: center; }
.flex-center {
justify-content: center; }
.flex-between {
justify-content: space-between; }
.flex-end {
justify-content: flex-end; }
.flex-center-middle {
align-items: center;
justify-content: center; }
.flex-baseline {
align-items: baseline; }
.flex-self {
align-self: flex-start; }
.flex-self-center {
align-self: center; }
.flex-align-end {
align-items: end; }
.margin-flex-top {
margin-top: auto; }
.margin-flex-right {
margin-right: auto; }
.margin-flex-bottom {
margin-bottom: auto; }
.margin-flex-left {
margin-left: auto; }
.padding-light {
padding: .5rem; }
.padding-light-top {
padding-top: .5rem; }
.padding-light-right {
padding-right: .5rem; }
.padding-light-bottom {
padding-bottom: .5rem; }
.padding-light-left {
padding-left: .5rem; }
.padding-light-row {
padding-left: .5rem;
padding-right: .5rem; }
.padding-light-col {
padding-top: .5rem;
padding-bottom: .5rem; }
.padding-medium {
padding: 1rem; }
.padding-medium-top {
padding-top: 1rem; }
.padding-medium-right {
padding-right: 1rem; }
.padding-medium-bottom {
padding-bottom: 1rem; }
.padding-medium-left {
padding-left: 1rem; }
.padding-medium-row {
padding-left: 1rem;
padding-right: 1rem; }
.padding-medium-col {
padding-top: 1rem;
padding-bottom: 1rem; }
.padding-large {
padding: 2rem; }
.padding-large-top {
padding-top: 2rem; }
.padding-large-right {
padding-right: 2rem; }
.padding-large-bottom {
padding-bottom: 2rem; }
.padding-large-left {
padding-left: 2rem; }
.padding-large-row {
padding-left: 2rem;
padding-right: 2rem; }
.padding-large-col {
padding-top: 2rem;
padding-bottom: 2rem; }
.padding-big {
padding: 4rem; }
.padding-big-top {
padding-top: 4rem; }
.padding-big-right {
padding-right: 4rem; }
.padding-big-bottom {
padding-bottom: 4rem; }
.padding-big-left {
padding-left: 4rem; }
.padding-big-row {
padding-right: 4rem;
padding-left: 4rem; }
.padding-big-col {
padding-top: 4rem;
padding-bottom: 4rem; }
.margin-tiny {
margin: .25rem; }
.margin-tiny-top {
margin-top: .25rem; }
.margin-tiny-right {
margin-right: .25rem; }
.margin-tiny-bottom {
margin-bottom: .25rem; }
.margin-tiny-left {
margin-left: .25rem; }
.margin-tiny-row {
margin-right: .25rem;
margin-left: .25rem; }
.margin-tiny-col {
margin-top: .25rem;
margin-bottom: .25rem; }
.margin-light {
margin: .5rem; }
.margin-light-top {
margin-top: .5rem; }
.margin-light-right {
margin-right: .5rem; }
.margin-light-bottom {
margin-bottom: .5rem; }
.margin-light-left {
margin-left: .5rem; }
.margin-light-row {
margin-right: .5rem;
margin-left: .5rem; }
.margin-light-col {
margin-top: .5rem;
margin-bottom: .5rem; }
.margin-medium {
margin: 1rem; }
.margin-medium-top {
margin-top: 1rem; }
.margin-medium-right {
margin-right: 1rem; }
.margin-medium-bottom {
margin-bottom: 1rem; }
.margin-medium-left {
margin-left: 1rem; }
.margin-medium-row {
margin-right: 1rem;
margin-left: 1rem; }
.margin-medium-col {
margin-top: 1rem;
margin-bottom: 1rem; }
.margin-large {
margin: 2rem; }
.margin-large-top {
margin-top: 2rem; }
.margin-large-right {
margin-right: 2rem; }
.margin-large-bottom {
margin-bottom: 2rem; }
.margin-large-left {
margin-left: 2rem; }
.margin-large-row {
margin-right: 2rem;
margin-left: 2rem; }
.margin-large-col {
margin-top: 2rem;
margin-bottom: 2rem; }
.margin-big {
margin: 4rem; }
.margin-big-top {
margin-top: 4rem; }
.margin-big-right {
margin-right: 4rem; }
.margin-big-bottom {
margin-bottom: 4rem; }
.margin-big-left {
margin-left: 4rem; }
.margin-big-row {
margin-right: 4rem;
margin-left: 4rem; }
.margin-big-col {
margin-top: 4rem;
margin-bottom: 4rem; }
.margin-icon-left {
margin-left: .5rem; }
.margin-icon-right {
margin-right: .5rem; }
.margin-input {
margin-top: -3px; }
.margin-center {
margin-left: auto;
margin-right: auto; }
.no-margin {
margin: 0; }
.no-margin-top {
margin-top: 0 !important; }
.no-margin-left {
margin-left: 0 !important; }
.no-margin-bottom {
margin-bottom: 0 !important; }
.no-margin-right {
margin-right: 0 !important; }
.reverse {
transform: rotate(180deg); }
.border-top {
border-top-width: 1px;
border-top-style: solid; }
.border-left {
border-left-width: 1px;
border-left-style: solid; }
.border-bottom {
border-bottom-width: 1px;
border-bottom-style: solid; }
.border-left {
border-left-width: 1px;
border-left-style: solid; }
.overlay {
position: relative; }
.overlay:before {
content: '';
display: block;
width: 100%;
height: 100%;
background-color: rgba(32, 33, 33, 0.35);
position: absolute;
top: 0;
left: 0;
z-index: 0; }
.overlay > * {
position: relative;
z-index: 1; }
.squared {
position: relative; }
.squared:after {
content: "";
display: block;
width: 100%;
padding-bottom: 100%; }
.squared .content {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0; }
.container {
position: relative;
width: 100%;
margin: 0 auto; }
.container:not(.fullwidth) {
padding-left: 2rem;
padding-right: 2rem; }
.container .row {
width: 102%;
margin-left: -1%;
margin-right: -1%;
position: relative;
display: flex;
flex-direction: column; }
.container .row:last-child > div {
margin-bottom: 0; }
.container .row.centered {
justify-content: center; }
.container .row:not(.no-padding), .container .row:not(.margged) {
width: 100%;
margin-left: 0;
margin-right: 0; }
.container .row:after {
clear: both;
content: "";
display: table; }
.container .row.auto > div {
width: 98%; }
.container .row:not(.no-padding).medium-half > *:not(.self), .container .row:not(.no-padding).medium-third > *:not(.self), .container .row:not(.no-padding).large-half > *:not(.self), .container .row:not(.no-padding).large-third > *:not(.self), .container .row:not(.no-padding).large-four > *:not(.self),
.container .row:not(.no-padding) [class^="medium-"],
.container .row:not(.no-padding) [class^="large-"] {
margin-left: 1%;
margin-right: 1%; }
.container .row.medium-half > *:not(.self), .container .row.medium-third > *:not(.self), .container .row.large-half > *:not(.self), .container .row.large-third > *:not(.self), .container .row.large-four > *:not(.self),
.container .row [class^="medium-"],
.container .row [class^="large-"] {
margin-bottom: 2vw; }
.container .row .medium-large-full {
width: 98%; }
.container .row .container {
padding-left: 0;
padding-right: 0; }
@media only screen and (min-width: 688px) {
.container:not(.fullwidth) {
padding-left: 4rem;
padding-right: 4rem; }
.container .row {
flex-wrap: wrap;
flex-direction: row; }
.container .row .medium-6 {
width: 98%; }
.container .row.medium-half > *:not(.self) {
width: 48%!important; }
.container .row.medium-third > *:not(.self) {
width: 31.3333333333%!important; }
.container .row.medium-fourth > *:not(.self) {
width: 23%!important; }
.container .row.no-padding .medium-1 {
width: 16.6666666667%; }
.container .row.no-padding .medium-2 {
width: 33.3333333333%; }
.container .row.no-padding .medium-3 {
width: 50%; }
.container .row.no-padding .medium-4 {
width: 66.6666666667%; }
.container .row.no-padding .medium-5 {
width: 83.3333333333%; }
.container .row .medium-1 {
width: 14.6666666667%; }
.container .row .medium-2 {
width: 31.3333333333%; }
.container .row .medium-3 {
width: 48%; }
.container .row .medium-4 {
width: 64.6666666667%; }
.container .row .medium-5 {
width: 81.3333333333%; } }
@media only screen and (min-width: 992px) {
.container:not(.fullwidth) {
padding-left: 6rem;
padding-right: 6rem; }
.container .row {
flex-wrap: wrap; }
.container .row.large-half > *:not(.self) {
width: 48%!important; }
.container .row.large-third > *:not(.self) {
width: 31.3333333333%!important; }
.container .row.large-four > *:not(.self) {
width: 23%!important; }
.container .row.no-padding .large-1 {
width: 10%; }
.container .row.no-padding .large-2 {
width: 20%; }
.container .row.no-padding .large-3 {
width: 30%; }
.container .row.no-padding .large-4 {
width: 40%; }
.container .row.no-padding .large-5 {
width: 50%; }
.container .row.no-padding .large-6 {
width: 60%; }
.container .row.no-padding .large-7 {
width: 70%; }
.container .row.no-padding .large-8 {
width: 80%; }
.container .row.no-padding .large-9 {
width: 90%; }
.container .row .large-1 {
width: 8%; }
.container .row .large-2 {
width: 18%; }
.container .row .large-3 {
width: 28%; }
.container .row .large-4 {
width: 38%; }
.container .row .large-5 {
width: 48%; }
.container .row .large-6 {
width: 58%; }
.container .row .large-7 {
width: 68%; }
.container .row .large-8 {
width: 78%; }
.container .row .large-9 {
width: 88%; } }
@media only screen and (min-width: 1980px) {
.container {
max-width: 1980px; }
.container:not(.fullwidth) {
padding-left: 8rem;
padding-right: 8rem; }
.container .row {
flex-wrap: wrap; } }
html {
font-size: 62.5%; }
body {
position: relative;
font-family: var(--font-base);
font-size: var(--font-size-base);
color: var(--color-text-base);
background-color: var(--background-color-base);
overflow-x: hidden; }
body.admin-bar .open-menu-button, body.admin-bar .close-menu-button {
top: calc(2em + 32px); }
body.admin-bar .site-menu {
padding-top: calc(5em + 2em + 32px); }
a {
color: var(--color-accent); }
a:hover {
color: var(--color-accent-hover); }
h1, h2, h3, h4, h5 {
font-family: var(--font-title);
color: var(--color-title-base);
margin: 0 0 .8em; }
h1 {
font-size: var(--font-size-1);
font-weight: var(--font-weight-bold); }
h2 {
font-size: var(--font-size-2);
font-weight: var(--font-weight-light); }
h3 {
font-size: var(--font-size-3);
font-weight: var(--font-weight-medium); }
h6 {
font-size: var(--font-size-6);
font-weight: var(--font-weight-bold);
text-transform: uppercase;
color: var(--color-main);
margin: .9em 0 .9em 0; }
p {
font-family: var(--font-text);
color: var(--color-text-base);
font-size: var(--font-size-base);
line-height: 1.5;
margin: 0 0 1rem; }
strong, b {
font-weight: var(--font-weight-bold); }
p strong {
color: var(--color-title-base); }
em {
font-style: italic; }
sub, sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline; }
sup {
top: -0.5em; }
sub {
bottom: -0.25em; }
.site-main ol,
.site-main ul {
margin-top: 0; }
.site-main ol li,
.site-main ul li {
line-height: 1.5; }
.site-main ol li:not(:last-child),
.site-main ul li:not(:last-child) {
margin-bottom: 1rem; }
.alignnone {
margin: 5px 20px 20px 0; }
.aligncenter,
div.aligncenter {
display: block;
margin: 5px auto 5px auto; }
.alignright {
float: right;
margin: 5px 0 20px 20px; }
.alignleft {
float: left;
margin: 5px 20px 20px 0; }
a img.alignright {
float: right;
margin: 5px 0 20px 20px; }
a img.alignnone {
margin: 5px 20px 20px 0; }
a img.alignleft {
float: left;
margin: 5px 20px 20px 0; }
a img.aligncenter {
display: block;
margin-left: auto;
margin-right: auto; }
.wp-caption {
background: #fff;
border: 1px solid #f0f0f0;
max-width: 96%; padding: 5px 3px 10px;
text-align: center; }
.wp-caption.alignnone {
margin: 5px 20px 20px 0; }
.wp-caption.alignleft {
margin: 5px 20px 20px 0; }
.wp-caption.alignright {
margin: 5px 0 20px 20px; }
.wp-caption img {
border: 0 none;
height: auto;
margin: 0;
max-width: 98.5%;
padding: 0;
width: auto; }
.wp-caption p.wp-caption-text {
font-size: 11px;
line-height: 17px;
margin: 0;
padding: 0 4px 5px; } .screen-reader-text {
border: 0;
clip: rect(1px, 1px, 1px, 1px);
-webkit-clip-path: inset(50%);
clip-path: inset(50%);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute !important;
width: 1px;
word-wrap: normal !important; }
.screen-reader-text:focus {
background-color: #eee;
clip: auto !important;
-webkit-clip-path: none;
clip-path: none;
color: #444;
display: block;
font-size: 1em;
height: auto;
left: 5px;
line-height: normal;
padding: 15px 23px 14px;
text-decoration: none;
top: 5px;
width: auto;
z-index: 100000; }
.close-menu-button {
display: none; }
.open-menu-button {
display: flex; }
.menu-is-open {
overflow-y: hidden; }
.menu-is-open .site-header:not(.sticky) #handirect-logo {
display: block; }
.menu-is-open .site-header:not(.sticky) #handirect-logo-blanc {
display: none; }
.menu-is-open .site-menu {
visibility: visible;
opacity: 1; }
.menu-is-open .close-menu-button {
display: flex; }
.menu-is-open .open-menu-button {
display: none; }
.open-menu-button, .close-menu-button {
cursor: pointer;
position: fixed;
top: 2em;
left: 0;
align-items: center;
justify-content: center;
border-radius: var(--border-radius);
background-color: var(--color-accent);
width: 5em;
height: 5em; }
.open-menu-button svg, .close-menu-button svg {
width: 2em;
height: 2em; }
.open-menu-button:hover, .close-menu-button:hover {
background-color: var(--color-accent-hover); }
.site-menu {
opacity: 0;
visibility: hidden;
padding-top: calc(5em + 2em);
z-index: 10;
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: var(--color-main-light); }
.site-menu ul {
padding: 0;
list-style: none; }
.site-menu .menu-content {
width: 65%; }
.site-menu .menu-content li {
margin-bottom: 1em; }
.site-menu .menu-content li:hover a {
color: var(--color-accent-hover); }
.site-menu .menu-content li:hover:not(.title)::before {
background-color: var(--color-accent-hover); }
.site-menu .menu-content li a {
color: var(--color-title-base);
font-weight: var(--font-weight-light);
font-size: 24px;
font-family: var(--font-title); }
.site-menu .menu-content li:not(.title) {
display: flex;
align-items: center; }
.site-menu .menu-content li:not(.title)::before {
content: '';
display: block;
height: 1em;
width: 1em;
margin-right: 1em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/triangle.svg);
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/triangle.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-size: contain;
background-color: var(--color-accent); }
.site-menu .menu-content .title {
pointer-events: none;
text-transform: uppercase;
margin-bottom: 1em; }
.site-menu .menu-content .title a {
color: var(--color-main);
font-weight: var(--font-weight-bold);
font-size: 14px;
font-family: var(--font-title); }
.site-menu .menu-content > div {
height: 60%; }
.site-menu .menu-entreprise {
width: 35%; }
.site-menu .menu-entreprise .menu-entreprise-container {
box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
background-color: var(--color-white);
border-radius: var(--border-radius); }
.site-menu .menu-entreprise .menu-entreprise-container .menu .button {
margin-top: 1em; }
@media only screen and (max-width: 1280px) {
.site-menu {
flex-direction: column;
overflow-y: scroll; }
.site-menu .menu-entreprise {
width: 100%; }
.site-menu .menu-entreprise .menu-entreprise-container {
margin-right: 0; }
.site-menu .menu-content {
width: 100%;
height: auto; }
.site-menu .menu-content > div {
height: 100%; }
.site-menu .menu-content > div:first-of-type {
display: flex; } }
@media only screen and (max-width: 992px) {
.site-menu .menu-content {
flex-direction: column;
align-items: inherit;
justify-content: inherit; }
.site-menu .menu-content > div:first-of-type {
flex-direction: column; } }
.navigation-bar {
margin-top: 36px; }
.navigation-bar {
position: fixed;
display: flex;
justify-content: space-around;
align-items: center;
height: 5em;
width: 100%; }
.navigation-bar .search-form {
width: auto;
position: relative;
margin-right: 2rem; }
.navigation-bar .search-form input {
padding: 15px;
-moz-appearance: none;
appearance: none;
-webkit-appearance: none;
box-shadow: 0 1px 3px var(--color-shadow);
border: none;
border-radius: var(--border-radius);
font-size: 14px;
color: #B8C2CC; }
.navigation-bar .search-form input:hover {
outline: solid 2px var(--color-accent);
cursor: pointer; }
.navigation-bar .search-form input:active {
outline-color: var(--color-accent-hover); }
.navigation-bar .search-form input:active + .search-bar-icon {
background-color: var(--color-accent-hover); }
.navigation-bar .search-form input:focus {
color: var(--color-dark); }
.navigation-bar .search-form .search-bar-icon {
content: '';
display: block;
width: 1em;
height: 1em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/search.svg);
mask-repeat: no-repeat;
mask-size: contain;
mask-position: center;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/search.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: contain;
-webkit-mask-position: center;
background-color: var(--color-accent);
position: absolute;
right: 1.25em;
top: calc(50% - (1em / 2)); }
.navigation-bar .navbar-right {
display: flex; }
.navigation-bar .navbar-right .button {
font-size: 15px; }
.navigation-bar .navbar-left .site-logo {
max-width: 15em; }
.navigation-bar .navbar-left .site-logo svg {
width: 100%;
height: 100%; }
.site-header.sticky .navigation-bar {
background-color: var(--color-main-dark);
transition: var(--transition-slow); }
.home .site-header:not(.sticky) .site-logo #handirect-logo {
display: block; }
.home .site-header:not(.sticky) .site-logo #handirect-logo-blanc {
display: none; }
#handirect-logo {
display: none; }
@media only screen and (max-width: 992px) {
.navigation-bar .search-form {
display: none; } }
@media only screen and (max-width: 850px) {
.navigation-bar {
justify-content: flex-start;
padding-left: 106px;
padding-right: 8px; }
.navigation-bar .navbar-left .site-logo {
max-width: 10em !important; }
.navigation-bar .navbar-right {
margin-left: auto; }
.navigation-bar .navbar-right .button {
padding: 14px 12px;
font-size: 13px; } }
@media only screen and (max-width: 450px) {
.navigation-bar .navbar-left .site-logo {
max-width: 12em; } }
.page-warning {
position: fixed;
width: 100%;
padding-left: 2em;
height: 2em;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--color-black); }
.page-warning .page-warning_link {
display: flex;
align-items: center;
font-size: 0.625em;
font-family: var(--font-title); }
.page-warning .page-warning_link a {
color: var(--color-white);
text-decoration: underline; }
.page-warning .page-warning_link:hover a {
color: var(--color-accent-hover); }
.page-warning .page-warning_link:hover::after {
background-color: var(--color-accent-hover);
transform: translateX(0.25em);
transition: var(--transition-fast) ease-out; }
.page-warning .page-warning_link::after {
content: '';
display: block;
margin-left: 0.2em;
width: 1.5em;
height: 1.5em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/button-arrow.svg);
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/button-arrow.svg);
-webkit-mask-position: center;
-webkit-mask-size: contain;
-webkit-mask-repeat: no-repeat;
background-color: var(--color-white); }
.site-footer {
background-color: var(--color-dark);
padding: 5em 0 5em; }
.site-footer .footer-container {
width: 80%;
margin: auto; }
.site-footer .footer-container .footer-content {
display: flex; }
.site-footer .footer-container .footer-content > div {
width: calc(100% / 3); }
.site-footer .footer-container .footer-content .footer-company {
padding: 0 4em 0 4em; }
.site-footer .footer-container .footer-content .footer-company .footer-hours {
margin-top: 2em; }
.site-footer .footer-container .footer-content h4, .site-footer .footer-container .footer-content p {
color: var(--color-white); }
.site-footer .footer-container .footer-content .footer-description {
color: #F0F0F0;
margin-bottom: 2em; }
.site-footer .footer-container .footer-content .footer-contact .button {
margin-bottom: 2em; }
.site-footer .footer-container .footer-content .footer-contact .footer-phone {
display: flex;
align-items: center; }
.site-footer .footer-container .footer-content .footer-contact .footer-phone::before {
content: '';
display: block;
width: 1em;
height: 1em;
margin-right: .5em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/telephone-footer.svg);
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/telephone-footer.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-size: contain;
background-color: var(--color-white); }
.site-footer .footer-container .footer-content .footer-about a {
display: flex;
align-items: center; }
.site-footer .footer-container .footer-content .footer-about a::after {
content: '';
display: block;
width: 1em;
height: 1em;
margin-left: .5em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/button-arrow.svg);
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/button-arrow.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-size: contain;
background-color: var(--color-accent); }
.site-footer .footer-container .footer-content .footer-about a:hover::after {
background-color: var(--color-accent-hover); }
.site-footer .footer-container .footer-logo {
max-width: 15em;
height: auto;
margin-bottom: 2em; }
@media only screen and (max-width: 1280px) {
.site-footer .footer-container {
width: 100%; } }
@media only screen and (max-width: 992px) {
.site-footer .footer-container .footer-content {
flex-direction: column; }
.site-footer .footer-container .footer-content > div {
width: 100%; }
.site-footer .footer-container .footer-content .footer-about {
margin-bottom: 4rem; }
.site-footer .footer-container .footer-content .footer-company {
padding: 0; } }
.footer-navigation {
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
background-color: var(--color-black); }
.footer-navigation .menu {
display: flex;
list-style: none;
padding: 0;
margin: 0; }
.footer-navigation a {
font-size: 14px;
color: var(--color-white); }
.footer-navigation a:hover {
color: var(--color-accent-hover); }
.footer-navigation .menu-item {
margin-right: 2rem; }
.footer-navigation .billiotte a {
position: relative;
display: flex; }
.footer-navigation .billiotte a::after {
content: '';
display: block;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/images/signature-billiotte.svg);
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/images/signature-billiotte.svg);
-webkit-mask-position: center;
-webkit-mask-size: contain;
-webkit-mask-repeat: no-repeat;
height: auto;
width: 5em;
margin-left: .5em;
background-color: var(--color-white); }
.footer-navigation .billiotte a:hover::after {
background-color: var(--color-accent-hover); }
@media only screen and (max-width: 800px) {
.footer-navigation {
flex-direction: column; }
.footer-navigation .mentions, .footer-navigation .billiotte {
margin: 0 !important; }
.footer-navigation .mentions {
padding-bottom: 1rem; } }
@media only screen and (max-width: 650px) {
.footer-navigation .menu {
flex-direction: column; }
.footer-navigation .menu .menu-item {
text-align: center; } } .button, .wp-block-button__link {
display: inline-flex;
justify-content: center;
align-items: center;
color: var(--color-white);
background-color: var(--color-accent);
border-radius: var(--border-radius);
padding: 15px;
font-family: var(--font-text);
font-size: var(--font-size-base); }
.button:hover, .wp-block-button__link:hover {
background-color: var(--color-accent-hover);
color: var(--color-white); }
.button:hover::after, .wp-block-button__link:hover::after {
transform: translateX(4px);
transition: var(--transition-fast) ease-out; }
.button::after, .wp-block-button__link::after {
content: '';
display: block;
margin-left: 0.2em;
width: 1em;
height: 1em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/button-arrow.svg);
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/button-arrow.svg);
-webkit-mask-position: center;
-webkit-mask-size: contain;
-webkit-mask-repeat: no-repeat;
background-color: var(--color-white); }
.button.outline, .wp-block-button__link.outline {
background-color: transparent;
color: var(--color-accent);
border: solid 1px var(--color-accent); }
.button.outline::after, .wp-block-button__link.outline::after {
background-color: var(--color-accent); }
.button.outline:hover, .wp-block-button__link.outline:hover {
border-color: var(--color-accent-hover);
background-color: var(--color-accent-hover);
color: var(--color-white); }
.button.outline:hover::after, .wp-block-button__link.outline:hover::after {
background-color: var(--color-white); }
.slick-carousel.with-arrows {
display: flex;
flex-wrap: wrap; }
.slick-carousel .slick-list {
width: 80%; }
.slick-carousel .slick-track {
display: flex !important; }
.slick-carousel .slick-slide {
height: inherit !important; }
.slick-carousel .slick-slide > div {
height: 100%; }
.slick-carousel .item {
display: flex !important;
flex-direction: column;
justify-content: center;
height: 100%;
padding: 1rem 2rem; }
.slick-carousel.slick-dotted .slick-dots {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
list-style: none;
padding: 0;
margin: 2rem 0 0; }
.slick-carousel.slick-dotted .slick-dots li {
margin-bottom: 0; }
.slick-carousel.slick-dotted .slick-dots li.slick-active button {
width: 5.4rem;
background-color: var(--background-color-accent); }
.slick-carousel.slick-dotted .slick-dots li button {
display: block;
width: 1rem;
height: 1rem;
background-color: var(--background-color-opac-accent);
border-radius: var(--border-radius-default);
font-size: 0;
padding: 0;
margin: 0 .8rem;
transition: width var(--transition-fast); }
.slick-carousel .slick-arrow {
width: 10%;
font-size: 0; }
.slick-carousel .slick-arrow:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 5rem;
height: 5rem;
margin-left: .25em;
background-color: var(--background-color-accent-2);
transition: transform var(--transition-fast); }
.slick-carousel .slick-arrow:hover {
background-color: var(--background-color-gray); }
.slick-carousel .slick-arrow:hover:after {
background-color: var(--color-accent-2-hover); }
.slick-carousel .slick-arrow.slick-prev:after {
-webkit-mask: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/angle-left.svg) no-repeat;
mask: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/angle-left.svg) no-repeat; }
.slick-carousel .slick-arrow.slick-prev:hover:after {
transform: translateX(-0.3rem);
-webkit-mask: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/arrow-left.svg) no-repeat;
mask: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/arrow-left.svg) no-repeat; }
.slick-carousel .slick-arrow.slick-next:after {
-webkit-mask: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/angle-right.svg) no-repeat;
mask: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/angle-right.svg) no-repeat; }
.slick-carousel .slick-arrow.slick-next:hover:after {
transform: translateX(0.3rem);
-webkit-mask: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/arrow-right.svg) no-repeat;
mask: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/arrow-right.svg) no-repeat; }
.gform_required_legend, .gform_wrapper.gravity-theme .field_description_below .gfield_consent_description, .gform_wrapper.gravity-theme .gfield_consent_description {
text-align: center;
}
.single-agence-container .gform_required_legend, .single-agence-container .gfield_consent_description, #gform_6 .gform_required_legend, #gform_6 .gform-field-label {
color: var(--color-white);	
}
form {
width: 50%;
margin: auto; }
form label {
font-family: var(--font-title);
font-size: 16px;
font-weight: var(--font-weight-regular) !important; }
form input:not([type='checkbox']), form textarea, form select {
-moz-appearance: none;
appearance: none;
-webkit-appearance: none;
background-color: var(--color-form);
border: solid 1px var(--color-form-border);
border-radius: var(--border-radius); }
form select {
color: var(--color-text-base); }
form .gform_button {
cursor: pointer;
border-radius: var(--border-radius);
border: none !important;
margin-top: 2em;
background-color: var(--color-accent) !important; }
form .gform_button:hover {
background-color: var(--color-accent-hover) !important; }
form .gform_footer {
display: flex;
justify-content: center; }
@media only screen and (max-width: 992px) {
form {
width: 75%; } }
@media only screen and (max-width: 688px) {
form {
width: 100%; } }
img {
display: block;
max-width: 100%;
height: auto; } .wp-block-image.is-style-rounded-overlay-image {
position: relative; }
.wp-block-image.is-style-rounded-overlay-image::before {
content: '';
display: block;
width: 100%;
height: 100%;
border-top-right-radius: 30px;
border-bottom-left-radius: 30px;
mix-blend-mode: multiply;
background-color: var(--color-main);
opacity: .33;
position: absolute;
top: 0;
left: 0; }
.wp-block-image.is-style-rounded-overlay-image img {
border-top-right-radius: 30px;
border-bottom-left-radius: 30px; }
.is-style-custom-banner {
transform: translateY(50%);
z-index: 10; }
.is-style-citation {
display: inline-block;
position: relative;
font-style: italic; }
.is-style-citation::before {
content: '';
display: block;
width: 6em;
height: 6em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/quote.png);
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/quote.png);
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-size: contain;
background-color: var(--color-main);
position: absolute;
top: calc(50% - 3em);
left: -2em; }
.is-style-custom-list {
padding: 0;
list-style: none; }
.is-style-custom-list li {
position: relative;
font-weight: var(--font-weight-light);
padding-bottom: .4em;
padding-left: 1.5em; }
.is-style-custom-list li::before {
content: '';
display: block;
width: .8em;
height: .8em;
margin: .4em .4em 0 0;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/triangle.svg);
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/triangle.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-size: contain;
background-color: var(--color-main);
position: absolute;
top: 0;
left: 0; }
.is-style-fond-hero::before {
content: '';
display: block;
width: 100%;
height: 100%;
z-index: 4;
position: absolute;
top: -100%;
left: 0; }
.is-style-fond-hero[data-background-color="#F5FEFF"]::before {
background-color: var(--color-main-light); }
.is-style-fond-hero[data-background-color="#0891B2"]::before {
background-color: var(--color-main); }
.is-style-fond-hero[data-background-color="#164E63"]::before {
background-color: var(--color-main-dark); }
.is-style-fond-hero[data-background-color="#FAFBFC"]::before {
background-color: var(--color-light); } .block-domaines-prestations .domaine-prestation {
display: flex;
align-items: center;
margin: 2.5em 0 2.5em 0; }
.block-domaines-prestations .domaine-prestation::before {
content: '';
display: block;
width: 3em;
height: 3em;
margin-right: 1em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/triangle.svg);
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/triangle.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-size: contain;
background-color: var(--color-accent); }
.block-domaines-prestations .domaine-prestation .domaine-prestation-content {
max-width: 20em; }
.block-domaines-prestations .domaine-prestation .domaine-prestation-content .domaine-prestation-title {
margin-bottom: 10px; }
.block-domaines-prestations .domaine-prestation:hover .domaine-prestation-title {
color: var(--color-accent); } .galerie-container {
position: relative;
z-index: 3;
max-width: 60%;
margin: auto; }
@media only screen and (max-width: 992px) {
.galerie-container {
max-width: 80%; } }
@media only screen and (max-width: 688px) {
.galerie-container {
max-width: 100%; } }
.galerie-container .featured-image img {
border-radius: var(--border-radius); }
.galerie-container .galerie-infos {
display: flex;
justify-content: right;
margin: 1em 0 1em 0; }
.galerie-container .galerie-infos .images-counter {
display: flex;
align-items: center;
justify-content: center;
margin-right: 2em;
font-size: 15px;
color: var(--color-galerie-counter); }
.galerie-container .galerie-infos .images-counter::before {
content: '';
display: block;
width: 1em;
height: 1em;
margin-right: .5em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/galerie-image.svg);
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/galerie-image.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-size: contain;
background-color: var(--color-galerie-counter); }
.galerie-container .galerie-infos .galerie-button {
cursor: pointer; }
.carousel-container {
z-index: 9998;
position: fixed;
top: 0;
left: 0;
height: 100%;
width: 100%;
visibility: hidden;
opacity: 0; }
.carousel-container.is-active {
visibility: visible;
opacity: 1; }
.carousel-container::before {
content: '';
width: 100%;
height: 100%;
background-color: var(--color-main-dark);
opacity: .9;
position: absolute;
top: 0;
left: 0; }
.carousel-container .modal {
display: flex;
align-items: center;
justify-content: center;
height: 100%; }
.carousel-container .modal .galerie-carousel {
width: 100%;
height: 100%;
position: relative; }
.carousel-container .modal .galerie-carousel .slick-list, .carousel-container .modal .galerie-carousel .slick-track {
height: 100%; }
.carousel-container .modal .galerie-carousel .slick-track, .carousel-container .modal .galerie-carousel .slick-slide {
display: flex;
align-items: center;
justify-content: center; }
.carousel-container .modal .galerie-carousel .galerie-image img {
margin: auto;
max-width: 50%;
border-radius: var(--border-radius); }
.carousel-container .modal .galerie-carousel .next-icon, .carousel-container .modal .galerie-carousel .previous-icon {
display: block;
width: 1em;
height: 1em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/button-arrow.svg);
mask-repeat: no-repeat;
mask-size: contain;
mask-position: center;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/button-arrow.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: contain;
-webkit-mask-position: center;
background-color: var(--color-white); }
.carousel-container .modal .galerie-carousel .slick-prev, .carousel-container .modal .galerie-carousel .slick-next {
z-index: 9999;
position: absolute;
bottom: 5%;
background-color: var(--color-accent);
border-radius: var(--border-radius);
padding: .5em 2em .5em 2em; }
.carousel-container .modal .galerie-carousel .slick-prev:hover, .carousel-container .modal .galerie-carousel .slick-next:hover {
cursor: pointer;
background-color: var(--color-accent-hover); }
.carousel-container .modal .galerie-carousel .slick-prev:hover .next-icon, .carousel-container .modal .galerie-carousel .slick-prev:hover .previous-icon, .carousel-container .modal .galerie-carousel .slick-next:hover .next-icon, .carousel-container .modal .galerie-carousel .slick-next:hover .previous-icon {
background-color: var(--color-white); }
.carousel-container .modal .galerie-carousel .slick-prev {
left: calc(50% - 5.5em);
transform: rotate(180deg); }
.carousel-container .modal .galerie-carousel .slick-next {
right: calc(50% - 5.5em); }
.carousel-container .modal .close-modal {
z-index: 9998;
position: absolute;
top: 5%;
right: 5%;
display: flex;
align-items: center;
justify-content: center;
width: 2em;
height: 2em;
border-radius: var(--border-radius);
background-color: var(--color-accent); }
.carousel-container .modal .close-modal .close-modal-icon {
content: '';
display: block;
width: 1em;
height: 1em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/close-menu.svg);
mask-repeat: no-repeat;
mask-size: contain;
mask-position: center;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/close-menu.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: contain;
-webkit-mask-position: center;
background-color: var(--color-white); }
.carousel-container .modal .close-modal:hover {
cursor: pointer;
background-color: var(--color-accent-hover); }
.is-style-background-color-gap::after {
height: 80% !important; } .photo-triangle {
mask-size: contain;
mask-repeat: no-repeat;
-webkit-mask-size: contain;
-webkit-mask-repeat: no-repeat;
position: absolute;
top: -10%; }
.photo-triangle::before {
content: '';
width: 100%;
height: 100%;
background-color: var(--color-main);
opacity: .33;
position: absolute;
top: 0;
left: 0; }
.photo-triangle[data-position="right"] {
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/images/photo-triangle-right-mask.svg);
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/images/photo-triangle-right-mask.svg);
mask-position: right;
-webkit-mask-position: right;
width: 10em;
height: 75%;
right: 0; }
.photo-triangle[data-position="left"] {
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/images/photo-triangle-left-mask.svg);
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/images/photo-triangle-left-mask.svg);
mask-position: left;
-webkit-mask-position: left;
width: 15em;
height: 120%;
left: 0; }
.photo-triangle[data-position="left"] + .container {
margin-left: 15em; }
@media only screen and (max-width: 992px) {
.photo-triangle[data-position="left"] + .container {
margin-left: 0; } }
.photo-triangle[data-position="left"] img {
-o-object-position: 90%;
object-position: 90%; }
.photo-triangle img {
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
width: 100%;
height: 100%; }
@media only screen and (max-width: 992px) {
.photo-triangle {
display: none; } } .single-prestation .fond-content {
overflow: hidden; }
.is-style-fourmi-tete {
width: 25%;
height: 100%;
background-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/images/fourmi-tete.svg);
background-repeat: no-repeat;
background-size: contain;
background-position: right;
position: absolute;
bottom: 0;
right: 0;
transition: var(--transition-slow) ease-in-out;
transform: translateY(50%); }
.is-style-fourmi-tete:hover {
transition: var(--transition-slow) ease-in-out;
transform: none; } .is-style-fourmi-feuille h2 {
max-width: 60%;
margin: auto; }
.is-style-fourmi-feuille .fond-content {
position: relative; }
.is-style-fourmi-feuille .fond-content::after {
content: '';
background-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/images/carte-fourmi.png);
background-repeat: no-repeat;
background-size: contain;
background-position: center;
height: 130%;
width: 15em;
position: absolute;
bottom: -.5em;
left: 0; }
@media only screen and (max-width: 992px) {
.is-style-fourmi-feuille .fond-content::after {
height: 80%; } }
@media only screen and (max-width: 688px) {
.is-style-fourmi-feuille h2 {
max-width: 100%; }
.is-style-fourmi-feuille .fond-content::after {
display: none; } }
.prestations-filter .prestation-link {
border: solid var(--border-width-small) var(--color-accent);
border-radius: var(--border-radius); }
.prestations-filter .prestation-link:hover {
transition: var(--transition-fast);
border-color: var(--color-accent-hover);
background-color: var(--color-accent-hover);
color: var(--color-white); }
.prestations-filter .prestation-link.active {
background-color: var(--color-accent-light);
border: var(--color-accent-light);
pointer-events: none; }
@media only screen and (max-width: 688px) {
.prestations-filter {
flex-direction: column; }
.prestations-filter .prestation-link {
margin-bottom: 2rem; } }
.term-title {
color: var(--color-accent);
border: solid var(--border-width-small) var(--color-accent);
border-radius: var(--border-radius); }
.term-title:hover {
cursor: default; }
.reseausocial-link {
content: '';
display: block;
width: 1.5em;
height: 1.5em;
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-size: contain;
background-color: var(--color-accent); }
.reseausocial-link:hover {
background-color: var(--color-accent-hover); }
[data-social-icon="youtube"] {
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/social/youtube.svg);
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/social/youtube.svg); }
[data-social-icon="twitter"] {
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/social/twitter.svg); }
[data-social-icon="instagram"] {
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/social/instagram.svg); }
[data-social-icon="facebook"] {
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/social/facebook.svg); }
[data-social-icon="linkedin"] {
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/social/linkedin.svg); }
.tax-domaine-prestations .archive-content {
margin: 100px 0; }
.single-post .site-main {
padding: 11em 0 4em 0; }
.single-post .navigation-bar {
background-color: var(--color-main-dark); }
.single-post .site-page-head .post-date {
position: relative;
font-style: italic; }
.single-post .site-page-head .post-date::after {
content: '';
width: 5em;
height: var(--border-width-default);
border-radius: var(--border-radius);
background-color: var(--color-main);
position: absolute;
bottom: 0;
left: calc(50% - 2.5em); }
@media only screen and (max-width: 688px) {
.single-post .site-page-head h1 {
font-size: var(--font-size-2); } }
.single-post .single-content {
width: 75%;
margin: auto; }
@media only screen and (max-width: 992px) {
.single-post .single-content {
width: 100%; } }
@media only screen and (min-width: 1440px) {
.single-post .single-content {
width: 50%; } }
@media only screen and (max-width: 781px) {
.single-agence .wp-block-columns .wp-block-column:first-of-type {
margin-bottom: 4rem; } }
.single-agence [class^="section-"][data-background="dark"] .section-background-image {
z-index: 1;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%; }
.single-agence [class^="section-"][data-background="dark"] .section-background-image .wp-post-image {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center; }
.single-agence [class^="section-"][data-background="dark"]::before {
opacity: .9;
background-color: var(--color-main-dark); }
.single-agence [class^="section-"][data-background="light"]::before {
background-color: var(--color-main-light); }
.single-agence [class^="section-"][data-background="dark"], .single-agence [class^="section-"][data-background="light"] {
position: relative;
overflow: hidden; }
.single-agence [class^="section-"][data-background="dark"] .section-content, .single-agence [class^="section-"][data-background="light"] .section-content {
z-index: 3;
position: relative; }
.single-agence [class^="section-"][data-background="dark"]::before, .single-agence [class^="section-"][data-background="light"]::before {
content: '';
z-index: 2;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%; }
.single-agence #carte-agence {
min-height: 30em;
margin: auto; }
@media only screen and (min-width: 1280px) {
.single-agence #carte-agence {
width: 50%; } }
.single-agence .markerAgence {
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/handirect-marker-icon.svg);
mask-repeat: no-repeat;
mask-size: contain;
mask-position: center;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/handirect-marker-icon.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: contain;
-webkit-mask-position: center;
width: 3em;
height: 3em;
cursor: pointer;
background-color: var(--color-accent); }
.page-template-tpl-alerte .site-main, .error404 .site-main {
padding-top: 7em; }
.page-template-tpl-alerte .navigation-bar, .error404 .navigation-bar {
background-color: var(--color-main-dark); }
.error404 .site-main {
height: 75vh; }
.error404 .site-main .error-content {
margin: 4rem 0; }
.page-template-tpl-alerte .site-main .alerte-content {
margin: 4rem 0; }
.search .site-main {
padding-top: 7em; }
.search .site-main .search-content {
margin: 4rem 0; }
.search .navigation-bar {
background-color: var(--color-main-dark); }
.section-engagements .engagements-wrapper {
display: grid;
grid-template-columns: repeat(3, 1fr);
row-gap: 3em;
-moz-column-gap: 1em;
column-gap: 1em; }
@media only screen and (max-width: 992px) {
.section-engagements .engagements-wrapper {
grid-template-columns: repeat(2, 1fr); } }
@media only screen and (max-width: 688px) {
.section-engagements .engagements-wrapper {
grid-template-columns: repeat(1, 1fr); } }
.section-engagements .engagement-title, .section-engagements .engagement-subtitle, .section-engagements .engagement-content p {
color: var(--color-white); }
.section-engagements .engagement-content p {
font-weight: var(--font-weight-light); }
.section-engagements .engagement-icon-container {
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
width: 4em;
height: 4em;
margin-bottom: 1.5em;
padding: 5px;
background-color: var(--color-white); }
.section-engagements .engagement-icon-container .engagement-icon {
-o-object-fit: contain;
object-fit: contain; }
.section-videos .videos-container .videos {
display: flex;
flex-wrap: wrap;
justify-content: center; }
.section-videos .videos-container .videos iframe {
margin: 1em; }
.section-coordonnees .agence-email, .section-coordonnees .agence-fixe, .section-coordonnees .agence-tel, .section-coordonnees .agence-address-street {
display: flex;
align-items: center;
color: var(--color-accent); }
.section-coordonnees .agence-email::before, .section-coordonnees .agence-fixe::before, .section-coordonnees .agence-tel::before, .section-coordonnees .agence-address-street::before {
content: '';
display: block;
margin-right: .5em;
width: 1em;
height: 1em;
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-size: contain;
-webkit-mask-repeat: no-repeat;
background-color: var(--color-accent); }
.section-coordonnees .agence-address-street {
color: var(--color-white); }
.section-coordonnees .agence-address-street::before {
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/agence-maison.svg);
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/agence-maison.svg);
background-color: var(--color-white); }
.section-coordonnees .agence-address-zip {
color: var(--color-white);
margin: .2em 0 1em 1.5em; }
.section-coordonnees .agence-fixe::before {
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/agence-fixe.svg);
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/agence-fixe.svg); }
.section-coordonnees .agence-tel::before {
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/agence-tel.svg);
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/agence-tel.svg); }
.section-coordonnees .agence-email::before {
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/agence-email.svg);
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/agence-email.svg); }
.section-coordonnees .agence-email:hover {
cursor: pointer;
color: var(--color-accent-hover); }
.section-coordonnees .agence-email:hover::before {
background-color: var(--color-accent-hover); }
.section-coordonnees .agence-content {
margin-bottom: 2em; }
.section-coordonnees .agence-content .agence-title, .section-coordonnees .agence-content .agence-subtitle, .section-coordonnees .agence-content .agence-excerpt p {
color: var(--color-white); }
.section-prestations .prestations-content .entreprise-adaptee {
width: 4em;
height: 4em; }
.section-equipe .equipe .wp-block-image {
position: relative; }
.section-equipe .equipe .wp-block-image .equipe-photo {
width: 100%; }
.section-equipe .equipe .wp-block-image .equipe-fourmi {
position: absolute;
bottom: -.5em;
left: -2.5em;
width: 5em; }
.hero-page {
z-index: 5;
position: relative;
width: 100%;
height: 30em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/images/hero-page.svg);
mask-repeat: no-repeat;
mask-size: cover;
mask-position: center;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/images/hero-page.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: cover;
-webkit-mask-position: center;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
display: flex;
justify-content: center;
align-items: center; }
.hero-page .hero-page-content {
position: relative;
z-index: 2; }
.hero-page .hero-page-content .hero-page-title {
color: var(--color-white); }
.hero-page::before {
content: '';
width: 100%;
height: 100%;
background-color: var(--color-main);
opacity: .4;
z-index: 1;
position: absolute;
top: 0;
left: 0; }
.home {
position: relative; }
.site-header {
position: relative;
z-index: 99; }
.hero-homepage {
background-color: var(--color-main-light);
height: 100vh;
width: 100vw;
display: flex; }
.hero-homepage .hero-hompage-content {
display: flex;
flex-direction: column;
justify-content: center;
width: 50%;
padding-left: 6em;
padding-right: 2em; }
.hero-homepage .hero-hompage-content .hero-homepage-intro {
font-size: 24px; }
.hero-homepage .hero-homepage-thumbnail {
position: relative;
height: 100%;
width: 50%;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/images/hero-accueil.svg);
mask-position: top right;
mask-repeat: no-repeat;
mask-size: contain;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/images/hero-accueil.svg);
-webkit-mask-position: top right;
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: contain;
background-color: var(--color-overlay); }
.hero-homepage .hero-homepage-thumbnail .wp-post-image {
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
width: 100%;
height: 100%; }
.hero-homepage .hero-homepage-thumbnail::before {
content: '';
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background-color: var(--color-overlay); }
@media only screen and (max-width: 1480px) {
.hero-homepage .hero-hompage-content .hero-homepage-title {
font-size: var(--font-size-2); } }
@media only screen and (max-width: 992px) {
.hero-homepage {
flex-direction: column; }
.hero-homepage .hero-homepage-thumbnail, .hero-homepage .hero-hompage-content {
width: 100%; }
.hero-homepage .hero-hompage-content {
padding: calc(7em + 32px) 4rem 0 4rem;
height: 75%; }
.hero-homepage .hero-homepage-thumbnail {
height: 25%;
mask-image: none;
-webkit-mask-image: none;
background-position: 0 15%; } }
@media only screen and (max-width: 688px) {
.hero-homepage {
height: auto; }
.hero-homepage .hero-hompage-content .hero-homepage-intro {
font-size: 18px;
margin-bottom: 4rem; } }
.single-prestation .site-main {
position: relative;
padding-top: 10em; }
.single-prestation .site-main::after {
content: '';
width: 100%;
height: 75vh;
background-repeat: no-repeat;
background-size: 150%;
background-position: center 65%;
z-index: 1;
position: absolute;
top: 0;
left: 0; }
.single-prestation .site-main::before {
content: '';
width: 100%;
height: 75vh;
background-color: var(--color-main);
opacity: .4;
z-index: 2;
position: absolute;
top: 0;
left: 0; }
.single-prestation .site-main .single-prestation-container {
z-index: 3;
position: relative;
border-radius: var(--border-radius);
width: 80%;
margin: auto;
background-color: var(--color-white); }
.single-prestation .site-main .single-prestation-container .hero-single-prestation {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin-top: 4em; }
.single-prestation .site-main .single-prestation-container .hero-single-prestation .hero-single-prestation-button {
min-width: 10em;
text-align: right; }
.single-prestation .site-main .single-prestation-container .hero-single-prestation .hero-single-prestation-button .button {
background-color: var(--color-white);
color: var(--color-accent);
border: solid 1px var(--color-accent);
font-size: 12px; }
.single-prestation .site-main .single-prestation-container .hero-single-prestation .hero-single-prestation-button .button::after {
background-color: var(--color-accent); }
.single-prestation .site-main .single-prestation-container .hero-single-prestation .hero-single-prestation-button .button:hover::after {
background-color: var(--color-white); }
.single-prestation .site-main .single-prestation-container .hero-single-prestation .hero-single-prestation-button .button:hover {
background-color: var(--color-accent-hover);
color: var(--color-white);
border-color: var(--color-accent-hover); }
@media only screen and (max-width: 992px) {
.single-prestation .site-main .single-prestation-container {
width: 100%; } }
.hero-single-agence {
z-index: 1;
position: relative;
display: flex;
justify-content: center;
align-items: center;
min-height: 25em;
background-repeat: no-repeat;
background-size: cover;
background-position: center; }
.hero-single-agence::before {
content: '';
width: 100%;
height: 100%;
background-color: var(--color-main);
opacity: .6;
z-index: 2;
position: absolute;
top: 0;
left: 0; }
.hero-single-agence .hero-single-agence-title {
z-index: 3;
position: relative;
display: flex;
flex-direction: column;
align-items: center; }
.hero-single-agence .hero-single-agence-title h1 {
color: var(--color-white);
margin-bottom: 0.25em; }
.hero-single-agence .hero-single-agence-title::after {
content: '';
display: block;
transform: rotate(90deg);
width: 2em;
height: 2em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/triangle.svg);
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/triangle.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-size: contain;
background-color: var(--color-accent); }
.wrap-agences {
width: 80%;
margin: auto;
display: flex;
flex-wrap: wrap;
justify-content: center; }
.loop-agence-container .loop-agence {
position: relative;
display: block;
width: 180px;
height: 135px;
display: flex;
justify-content: center;
align-items: center;
color: var(--color-title-base);
font-size: 20px;
text-align: center;
font-family: var(--font-title);
font-weight: var(--font-weight-light); }
.loop-agence-container .loop-agence .agence-title {
z-index: 2;
position: relative;
display: flex;
justify-content: center;
align-items: center; }
.loop-agence-container .loop-agence .agence-title .agence-departement {
font-size: var(--font-size-small);
margin-top: .5rem; }
.loop-agence-container .loop-agence .agence-title::after {
content: '';
display: block;
opacity: 0;
width: .5em;
height: .5em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/triangle.svg);
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/triangle.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-size: contain;
background-color: var(--color-accent);
border: solid 3px var(--color-accent);
border-radius: var(--border-radius);
margin-top: .25em;
transform: rotate(90deg); }
.loop-agence-container .loop-agence .wp-post-image {
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
width: 100%;
height: 100%;
opacity: 0;
z-index: 1;
position: absolute;
top: 0;
left: 0; }
.loop-agence-container .loop-agence:hover {
font-weight: var(--font-weight-regular); }
.loop-agence-container .loop-agence:hover .wp-post-image {
transition: var(--transition-fast) ease-out;
opacity: .33; }
.loop-agence-container .loop-agence:hover .agence-title::after {
opacity: 1; }
@media only screen and (max-width: 668px) {
.wrap-agences {
width: 100%; } }
body:not(.single-solution) .wrap-prestations {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: .8em; }
@media only screen and (max-width: 992px) {
body:not(.single-solution) .wrap-prestations {
grid-template-columns: repeat(2, 1fr); } }
@media only screen and (max-width: 688px) {
body:not(.single-solution) .wrap-prestations {
grid-template-columns: repeat(1, 1fr); } }
body:not(.single-solution) .loop-prestation {
border-radius: var(--border-radius);
background-color: var(--color-white);
min-height: 12em; }
body:not(.single-solution) .loop-prestation .prestation-content {
height: 100%;
padding: 2em; }
body:not(.single-solution) .loop-prestation .prestation-content .prestation-title {
display: flex;
flex-direction: column;
justify-content: space-between;
height: 100%;
margin-bottom: 0;
font-size: 1.3em; }
body:not(.single-solution) .loop-prestation .prestation-content .prestation-title .prestation-arrow {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 1.8em;
height: 1.8em;
border: solid 2px var(--color-accent);
border-radius: 50%; }
body:not(.single-solution) .loop-prestation .prestation-content .prestation-title .prestation-arrow::before {
content: '';
display: block;
width: 1.3em;
height: 1.3em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/button-arrow.svg);
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/button-arrow.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-size: contain;
background-color: var(--color-accent); }
body:not(.single-solution) .loop-prestation:hover .prestation-title {
color: var(--color-accent-hover); }
body:not(.single-solution) .loop-prestation:hover .prestation-title .prestation-arrow {
justify-content: right;
border-color: var(--color-accent-hover); }
body:not(.single-solution) .loop-prestation:hover .prestation-title .prestation-arrow::before {
background-color: var(--color-accent-hover); }
.single-solution .loop-prestation {
display: flex;
align-items: center; }
.single-solution .loop-prestation .prestation-title {
color: var(--color-accent);
font-size: var(--font-size-base); }
.single-solution .loop-prestation:hover .prestation-title {
color: var(--color-accent-hover); }
.single-solution .loop-prestation:hover::after {
background-color: var(--color-accent-hover); }
.single-solution .loop-prestation::after {
content: '';
display: block;
width: 1.3em;
height: 1.3em;
margin-bottom: 0.8em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/button-arrow.svg);
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/button-arrow.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-size: contain;
background-color: var(--color-accent); }
.page-id-183 .terms-wrap {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: .8em; }
@media only screen and (max-width: 992px) {
.page-id-183 .terms-wrap {
grid-template-columns: repeat(2, 1fr); } }
@media only screen and (max-width: 688px) {
.page-id-183 .terms-wrap {
grid-template-columns: repeat(1, 1fr); } }
.page-id-183 .terms-wrap .loop-prestation {
display: block;
height: 12em;
border: solid var(--border-width-small) var(--color-grey-light);
margin-bottom: 1.5rem; }
.page-id-183 .terms-wrap .loop-prestation:hover {
transition: var(--transition-fast);
border-color: var(--color-accent-hover);
outline: solid var(--border-width-small) var(--color-accent-hover); }
.wrap-solutions {
display: flex;
flex-wrap: wrap;
justify-content: center;
width: 100%; }
.loop-solution-container, .loop-solution-contact-container {
display: flex;
justify-content: center;
width: 50%; }
.loop-solution {
position: relative;
display: inline-block;
width: 20em;
background-color: var(--color-white);
border: solid 1.5px var(--color-border);
border-radius: var(--border-radius);
padding: 1.5em 2em 1.5em 3em;
margin: 1em 0 1em 0;
font-family: var(--font-title);
color: var(--color-title-base); }
.loop-solution::before {
content: '';
display: block;
width: 1.5em;
height: 1.5em;
mask-position: center;
mask-repeat: no-repeat;
mask-size: contain;
-webkit-mask-position: center;
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: contain;
background-color: var(--color-white);
mask-image: var(--prestation-icon);
-webkit-mask-image: var(--prestation-icon);
z-index: 2;
position: absolute;
top: calc(50% - .75em);
left: -.75em; }
.loop-solution::after {
content: '';
display: block;
width: 4em;
height: 4em;
background-color: var(--color-accent);
border-radius: 50%;
border: solid var(--border-width-default) transparent;
z-index: 1;
position: absolute;
left: -2em;
top: calc(50% - 2em); }
.loop-solution:hover {
background-color: transparent;
color: var(--color-accent-hover); }
.loop-solution:hover::before {
transition: var(--transition-fast);
background-color: var(--color-accent-hover); }
.loop-solution:hover::after {
transition: var(--transition-fast);
background-color: var(--color-main-light);
border-color: var(--color-accent-hover); }
.loop-solution-contact {
display: inline-block;
padding: 1.5em 2em 1.5em 3em;
width: 20em;
background-color: var(--color-accent-light);
border-left: solid 4px var(--color-accent);
border-radius: var(--border-radius); }
.loop-solution-contact .solution-contact-title, .loop-solution-contact .solution-contact-link {
font-family: var(--font-title); }
.loop-solution-contact .solution-contact-title {
color: var(--color-title-base);
margin-bottom: .25em; }
.loop-solution-contact .solution-contact-link {
font-size: 14px;
display: flex;
align-items: center; }
.loop-solution-contact .solution-contact-link::after {
content: '';
display: block;
width: 1.2em;
height: 1.2em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/button-arrow.svg);
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/button-arrow.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-size: contain;
background-color: var(--color-accent); }
[data-background-color="#FFFFFF"] .loop-solution:hover::after {
background-color: var(--color-white); }
@media only screen and (min-width: 1480px) {
.wrap-solutions {
width: 80%;
margin: auto; }
.wrap-solutions .loop-solution-container, .wrap-solutions .loop-solution-contact-container {
width: 40%; } }
@media only screen and (max-width: 992px) {
.wrap-solutions {
flex-direction: column;
align-items: center;
padding-left: 2em; }
.wrap-solutions .loop-solution-container, .wrap-solutions .loop-solution, .wrap-solutions .loop-solution-contact-container, .wrap-solutions .loop-solution-contact {
width: 100%; }
.wrap-solutions .loop-solution-contact-container {
margin-top: 2rem; } }
.wrap-temoignages {
display: grid;
position: relative; }
.wrap-temoignages .slick-track {
display: grid;
grid-auto-flow: column; }
.wrap-temoignages .slick-track .slick-slide {
border: solid 1px var(--color-border);
border-radius: var(--border-radius);
padding: 1.5em 1em 1.5em 1em;
margin-right: 1em;
background-color: var(--color-white); }
.wrap-temoignages .slick-track .slick-slide > div {
height: 100%; }
.wrap-temoignages .next-icon, .wrap-temoignages .previous-icon {
display: block;
width: 1em;
height: 1em;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/button-arrow.svg);
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/button-arrow.svg);
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-size: contain;
mask-size: contain;
-webkit-mask-position: center;
mask-position: center;
background-color: var(--color-accent); }
.wrap-temoignages .slick-prev, .wrap-temoignages .slick-next {
z-index: 1;
position: absolute;
bottom: -3em;
border: solid 1px var(--color-accent);
border-radius: var(--border-radius);
padding: .5em 2em .5em 2em; }
.wrap-temoignages .slick-prev:hover, .wrap-temoignages .slick-next:hover {
cursor: pointer;
background-color: var(--color-accent); }
.wrap-temoignages .slick-prev:hover .next-icon, .wrap-temoignages .slick-prev:hover .previous-icon, .wrap-temoignages .slick-next:hover .next-icon, .wrap-temoignages .slick-next:hover .previous-icon {
background-color: var(--color-white); }
.wrap-temoignages .slick-prev {
left: calc(50% - 5.5em);
transform: rotate(180deg); }
.wrap-temoignages .slick-next {
right: calc(50% - 5.5em); }
.loop-temoignage-container {
height: 100%; }
.loop-temoignage {
height: 100%; }
.loop-temoignage .temoignage-title {
font-size: var(--font-size-base); }
.loop-temoignage .temoignage-subtitle {
color: var(--color-main);
font-weight: var(--font-weight-light);
font-size: var(--font-size-small); }
.loop-temoignage .temoignage-logo {
max-width: 6em; }
.loop-temoignage .temoignage-content {
font-weight: var(--font-weight-light);
line-height: 1.4;
font-size: var(--font-size-4); }
.wrap-posts {
width: 75%;
margin: auto;
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: auto;
grid-gap: 25px; }
@media only screen and (max-width: 1280px) {
.wrap-posts {
grid-template-columns: repeat(2, 1fr); } }
@media only screen and (max-width: 992px) {
.wrap-posts {
grid-template-columns: repeat(1, 1fr); } }
.wrap-posts .loop-post-container .loop-post {
position: relative;
display: block;
width: 100%;
height: 100%;
padding-bottom: 2em; }
.wrap-posts .loop-post-container .loop-post::after {
content: '';
display: block;
border-bottom: solid 2px var(--color-accent);
width: 100%;
height: 2px;
position: absolute;
left: 0;
bottom: 0; }
.wrap-posts .loop-post-container .loop-post .post-content .wp-post-image {
-o-object-fit: cover;
object-fit: cover;
height: 10em;
width: 100%;
border-radius: var(--border-radius); }
.wrap-posts .loop-post-container .loop-post .post-content .post-background {
height: 10em;
width: 100%;
border-radius: var(--border-radius);
background-color: var(--color-grey-light);
display: flex;
align-items: center;
justify-content: center; }
.wrap-posts .loop-post-container .loop-post .post-content .post-background::before {
content: '';
display: block;
width: 2em;
height: 2em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/actu.svg);
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/actu.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-size: contain;
background-color: var(--color-main-dark); }
.wrap-posts .loop-post-container .loop-post .post-content .post-title {
word-break: break-word;
color: var(--color-accent); }
.wrap-posts .loop-post-container .loop-post .post-content .post-date {
font-family: var(--font-text);
color: var(--color-title-base);
font-size: 12px;
margin-top: 1.5em; }
.wrap-posts .loop-post-container .loop-post .post-content .post-excerpt {
display: -webkit-box;
overflow: hidden;
line-clamp: 4;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
word-break: break-word;
color: var(--color-text-base); }
.wrap-posts .loop-post-container:hover .loop-post::after {
border-width: 4px;
transition: var(--transition-fast) ease-out; }
.wrap-posts .loop-post-container:hover .loop-post .post-date {
color: var(--color-accent); }
.wrap-posts .loop-post-container:hover .loop-post .post-background {
transition: var(--transition-fast);
background-color: var(--color-accent-light); }
.wrap-posts .loop-post-container:hover .loop-post .post-background::before {
transition: var(--transition-fast);
background-color: var(--color-accent); }
.wrap-posts {
position: relative; }
.wrap-posts .slick-track {
margin-right: -1em;
display: flex !important; }
.wrap-posts .slick-slide {
height: inherit !important;
margin-right: 1em; }
.wrap-posts .slick-slide > div, .wrap-posts .slick-slide .loop-post-container {
height: 100%; }
.wrap-posts .slick-prev, .wrap-posts .slick-next {
cursor: pointer;
position: absolute;
top: 0;
height: 2em;
width: 2em;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: calc(50% - 1em); }
.wrap-posts .slick-prev span, .wrap-posts .slick-next span {
display: flex;
align-items: center;
justify-content: center;
position: relative;
width: 2em;
height: 2em;
background-color: var(--color-accent);
border-radius: 50%; }
.wrap-posts .slick-prev span::before, .wrap-posts .slick-next span::before {
content: '';
display: block;
width: 1.5em;
height: 1.5em;
mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/button-arrow.svg);
mask-repeat: no-repeat;
mask-size: contain;
mask-position: center;
-webkit-mask-image: url(//handirect.com/wp-content/themes/bc_wp_handirect/assets/icons/button-arrow.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: contain;
-webkit-mask-position: center;
background-color: var(--color-white); }
.wrap-posts .slick-prev:hover span, .wrap-posts .slick-next:hover span {
background-color: var(--color-accent-hover);
outline-color: var(--color-accent-hover); }
.wrap-posts .slick-prev:hover span::before, .wrap-posts .slick-next:hover span::before {
background-color: var(--color-white); }
.wrap-posts .slick-prev {
left: -4em; }
.wrap-posts .slick-prev span {
transform: rotate(180deg); }
.wrap-posts .slick-next {
right: -4em; }
@media only screen and (max-width: 688px) {
.wrap-posts {
width: 100%; }
.wrap-posts .slick-prev, .wrap-posts .slick-next {
display: none !important; } }
.cta-demande-devis-content {
color: var(--color-white);
}
.cta-demande-devis-title {
color: var(--color-white);
}
.cta-demande-devis-excerpt {
color: var(--color-white);
}
.cta-demande-devis-bouton {
font-size: 18px;
color: var(--color-white);
background-color: var(--color-accent);
text-align: center;
border-radius: 4px;
padding: 2% 2%;
}
.cta-demande-devis-bouton:hover {
background-color : #F27900;
color: var(--color-white);
}
.wrap-agences {
width:100%;
}
.loop-agence-container {
margin: 0 120px 30px 0px;
}