.wpcf7 .screen-reader-response {
position: absolute;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(50%);
height: 1px;
width: 1px;
margin: -1px;
padding: 0;
border: 0;
word-wrap: normal !important;
}
.wpcf7 .hidden-fields-container {
display: none;
}
.wpcf7 form .wpcf7-response-output {
margin: 2em 0.5em 1em;
padding: 0.2em 1em;
border: 2px solid #00a0d2; }
.wpcf7 form.init .wpcf7-response-output,
.wpcf7 form.resetting .wpcf7-response-output,
.wpcf7 form.submitting .wpcf7-response-output {
display: none;
}
.wpcf7 form.sent .wpcf7-response-output {
border-color: #46b450; }
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
border-color: #dc3232; }
.wpcf7 form.spam .wpcf7-response-output {
border-color: #f56e28; }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
border-color: #ffb900; }
.wpcf7-form-control-wrap {
position: relative;
}
.wpcf7-not-valid-tip {
color: #dc3232; font-size: 1em;
font-weight: normal;
display: block;
}
.use-floating-validation-tip .wpcf7-not-valid-tip {
position: relative;
top: -2ex;
left: 1em;
z-index: 100;
border: 1px solid #dc3232;
background: #fff;
padding: .2em .8em;
width: 24em;
}
.wpcf7-list-item {
display: inline-block;
margin: 0 0 0 1em;
}
.wpcf7-list-item-label::before,
.wpcf7-list-item-label::after {
content: " ";
}
.wpcf7-spinner {
visibility: hidden;
display: inline-block;
background-color: #23282d; opacity: 0.75;
width: 24px;
height: 24px;
border: none;
border-radius: 100%;
padding: 0;
margin: 0 24px;
position: relative;
}
form.submitting .wpcf7-spinner {
visibility: visible;
}
.wpcf7-spinner::before {
content: '';
position: absolute;
background-color: #fbfbfc; top: 4px;
left: 4px;
width: 6px;
height: 6px;
border: none;
border-radius: 100%;
transform-origin: 8px 8px;
animation-name: spin;
animation-duration: 1000ms;
animation-timing-function: linear;
animation-iteration-count: infinite;
}
@media (prefers-reduced-motion: reduce) {
.wpcf7-spinner::before {
animation-name: blink;
animation-duration: 2000ms;
}
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@keyframes blink {
from {
opacity: 0;
}
50% {
opacity: 1;
}
to {
opacity: 0;
}
}
.wpcf7 [inert] {
opacity: 0.5;
}
.wpcf7 input[type="file"] {
cursor: pointer;
}
.wpcf7 input[type="file"]:disabled {
cursor: default;
}
.wpcf7 .wpcf7-submit:disabled {
cursor: not-allowed;
}
.wpcf7 input[type="url"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"] {
direction: ltr;
}
.wpcf7-reflection > output {
display: list-item;
list-style: none;
}
.wpcf7-reflection > output[hidden] {
display: none;
}*,
body {
font-family: 'Inter', sans-serif;
}
*,
*::before,
*::after {
box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-tap-highlight-color: transparent;
border: 0;
margin: 0;
padding: 0;
}
html {
scroll-behavior: smooth;
font-size: 100%;
}
img {
max-width: 100%;
height: auto;
}
img.attachment-post-thumbnail {
max-width: 926px;
width: 100%;
height: auto;
max-height: 488px;
object-fit: cover;
}
.container {
padding: 101px 20px 0px 20px;
min-height: calc(100vh - 91px);
}
@media (max-width: 868px) {
.container {
padding: 101px 20px 0px 20px;
}
}
button {
outline: 0;
}
.cta,
.menu-item > a {
text-transform: uppercase;
font-weight: 500;
}
#dotOrange {
color: var(--main-color);
}
.primaryButton,
.secondaryButton,
.thirdButton,
.wpcf7-submit {
color: white !important;
background-color: var(--main-color);
padding: 15px 25px;
text-transform: uppercase;
border-radius: 5px;
display: inline-block;
justify-content: center;
text-align: center;
cursor: pointer;
transition: 0.2s ease-in-out;
}
.primaryButton:hover,
.secondaryButton:hover,
.thirdButton:hover,
.wpcf7-submit:hover {
color: white;
background-color: var(--main-color);
transform: translateY(-3px);
transition: 0.2s ease-in-out;
}
.secondaryButton {
background-color: white;
border-color: white;
color: var(--dark-color) !important;
}
.secondaryButton:hover {
background-color: var(--grey-color);
color: var(--main-color);
}
.thirdButton {
background-color: transparent;
border: 1px solid var(--dark-color);
color: var(--dark-color) !important;
}
.thirdButton:hover {
background-color: var(--dark-color);
color: white !important;
}
@media (max-width: 468px) {
.primaryButton,
.secondaryButton,
.thirdButton,
.wpcf7-submit {
width: 100%;
}
}
:root {
--main-color: #FF5100;
--action-color: #ffddc3;
--dark-color: #0D0D0D;
--light-grey-color: #F4F3F1;
--grey-color: #EAE8E4;
--dark-grey-color: #D6D1CA;
}
h1 {
font-weight: 600;
font-size: 2.75rem;
line-height: 120%;
}
h2 {
font-weight: 600;
font-size: 2.125rem;
line-height: 120%;
}
h3 {
font-weight: 600;
font-size: 1.625rem;
line-height: 120%;
}
h4 {
font-weight: 600;
font-size: 1.375rem;
line-height: 120%;
}
h5 {
font-weight: 600;
font-size: 1.125rem;
line-height: 120%;
}
h6 {
font-weight: 600;
font-size: 1rem;
line-height: 120%;
}
p {
font-weight: 400;
font-size: 1.125rem;
line-height: 160%;
}
li {
font-weight: 400;
font-size: 1.125rem;
list-style: none;
line-height: 160%;
margin-left: 0px;
}
a,
a:visited {
font-weight: 400;
font-size: 1.125rem;
line-height: 110%;
text-decoration: none;
text-decoration-skip-ink: auto;
color: var(--dark-color);
transition: 0.2s ease-in-out;
}
a:hover {
text-decoration: none;
text-decoration-skip-ink: auto;
color: var(--main-color);
transition: 0.2s ease-in-out;
}
@media (max-width: 868px) {
h1 {
font-size: 2rem;
line-height: 120%;
}
h2 {
font-size: 1.625rem;
line-height: 120%;
}
h3 {
font-size: 1.35rem;
line-height: 120%;
}
h4 {
font-size: 1.125rem;
line-height: 120%;
}
h5 {
font-size: 1rem;
line-height: 120%;
}
h6 {
font-size: 0.875rem;
line-height: 120%;
}
p {
font-size: 1rem;
line-height: 150%;
}
li {
font-size: 1rem;
line-height: 150%;
margin-left: 20px;
}
a,
a:visited {
font-size: 1rem;
line-height: 110%;
}
}
@font-face {
font-family: 'Inter';
src: url(//gtsystem-informatique.fr/wp-content/themes/blanko/assets/fonts/Inter-VariableFont_slnt,wght.ttf) format('truetype');
font-weight: 300 600;
font-display: swap;
font-style: normal;
}
footer {
display: flex;
align-items: center;
justify-content: space-between;
padding: 32px 20px;
text-align: center;
background-color: #FFF;
min-height: 91px;
}
footer #textFooter {
font-size: 1rem;
}
@media (max-width: 868px) {
footer {
padding: 32px 20px;
flex-direction: column;
}
#textFooter {
margin-bottom: 20px;
}
}
header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 17px 20px;
position: fixed;
width: 100vw;
background-color: #FFF;
min-height: 80px;
z-index: 999;
border-bottom: 1px solid var(--grey-color);
}
header .branding {
display: flex;
align-items: center;
}
header .branding .wrapper-logo {
display: flex;
align-items: center;
margin-right: 20px;
}
header .branding .wrapper-logo img {
max-height: 40px;
}
header .branding #site-title {
font-size: 1.25rem;
font-weight: 400;
}
header .branding #site-description {
font-size: 1rem;
font-weight: 400;
}
header .menu {
display: flex;
}
header .menu li {
margin-left: 32px;
list-style: none;
}
header .menu li a {
font-size: 1rem;
}
header #menu {
display: flex;
align-items: center;
}
header #menu #cta-telephone {
display: inline-flex;
align-items: center;
margin-left: 32px;
padding: 10px 15px;
border-radius: 5px;
background-color: var(--main-color);
color: white;
font-size: 1rem;
}
header #wrapper-burger-menu {
height: 30px;
width: 30px;
cursor: pointer;
z-index: 999;
}
header .burger-menu,
header .burger-menu::after,
header .burger-menu::before {
height: 3px;
width: 30px;
background-color: var(--dark-color);
}
header .burger-menu {
display: none;
position: relative;
top: 15px;
}
header .burger-menu::after {
content: "";
position: absolute;
top: 10px;
}
header .burger-menu:before {
content: "";
position: absolute;
top: -10px;
}
header .burger-menu.open {
transform: rotate(-45deg);
top: 15px;
transition: 0.2s ease-in-out;
}
header .burger-menu.open::after {
transform: rotate(90deg);
transition: 0.2s ease-in-out;
top: 0px;
}
header .burger-menu.open::before {
display: none;
} @media (max-width: 1300px) {
header {
padding: 15px 20px;
}
header #menu {
display: none;
flex-direction: column;
position: absolute;
justify-content: center;
background-color: #FFF;
left: 0;
top: 0;
width: 100%;
height: auto;
opacity: 1;
z-index: 999;
padding: 20px;
border-bottom: 2px solid var(--grey-color);
}
header #menu .menu {
flex-direction: column;
text-align: center;
}
header #menu li {
margin-right: 0;
margin: 15px 0;
}
header #menu #cta-telephone {
margin-left: 0;
margin-top: 20px;
margin-bottom: 20px;
}
header #menu.open {
display: flex;
align-items: left;
top: 80px;
z-index: 998;
}
header .menu.open a {
text-align: center;
width: fit-content;
}
header .burger-menu {
display: flex;
}
}
.wrapper-error404 {
background-color: var(--light-grey-color);
display: flex;
justify-content: center;
align-items: center;
min-height: calc(100vh - 223px);
border-radius: 15px;
}
.content-error-page {
padding: 20px;
}
.content-error-page p {
margin: 16px 0;
}
.wrapper-button {
display: flex;
flex-direction: row;
gap: 20px;
}
@media (max-width: 868px) {
.wrapper-error-page {
margin-top: 50px;
}
}
@media (max-width: 668px) {
.wrapper-button {
flex-direction: column;
}
}
.wrapperHero {
background: url(https://gtsystem-informatique.fr/wp-content/uploads/2022/11/gtsystem-hero.webp) no-repeat;
background-size: cover;
background-position: center;
height: 536px;
min-height: 536px;
border-radius: 15px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.wrapperHero .wrapperHeroContent {
width: 1440px;
max-width: 1440px;
margin: 78px;
}
.wrapperHero .wrapperHeroContent h1,
.wrapperHero .wrapperHeroContent p {
max-width: 610px;
}
.wrapperHero .wrapperHeroContent h1,
.wrapperHero .wrapperHeroContent p {
color: white;
}
.wrapperHero .wrapperHeroContent p {
margin: 24px 0;
}
.wrapperHero .wrapperHeroContent #service {
margin-left: 15px;
}
@media (max-width: 868px) {
.wrapperHero {
height: auto;
}
.wrapperHero .wrapperHeroContent {
margin: 32px 20px;
}
}
@media (max-width: 468px) {
.wrapperHero .wrapperHeroContent #service {
margin-left: 0;
margin-top: 16px;
}
}
.wrapperServices {
max-width: 1164px;
margin: 0px auto 128px auto;
padding-top: 88px;
}
.wrapperServices .wSContent h2 {
max-width: 640px;
}
.wrapperServices .wSContent .wSCPlus {
display: flex;
justify-content: space-between;
margin: 48px 0 72px 0;
gap: 20px;
}
.wrapperServices .wSContent .wSCPlus .cardService {
background-color: var(--light-grey-color);
border-radius: 10px;
padding: 24px;
max-width: calc(25% - 20px);
min-width: calc(25% - 20px);
gap: 8px;
}
.wrapperServices .wSContent .wSCPlus .cardService h4 {
margin-top: 8px;
font-weight: 400;
}
.wrapperServices .wSContent .wrapperCardServices {
display: flex;
justify-content: space-between;
margin-top: 40px;
gap: 20px;
}
.wrapperServices .wSContent .wrapperCardServices .cardServices {
padding: 32px;
border: 2px solid var(--grey-color);
border-radius: 15px;
max-width: calc(33% - 20px);
min-width: calc(33% - 20px);
}
.wrapperServices .wSContent .wrapperCardServices .cardServices h3 {
margin-bottom: 24px;
}
@media (max-width: 1024px) {
.wrapperServices .wSContent .wrapperCardServices {
flex-wrap: wrap;
margin-top: 32px;
}
.wrapperServices .wSContent .wrapperCardServices .cardServices {
max-width: 100% !important;
width: 100%;
}
.wrapperServices .wSContent .wSCPlus {
flex-wrap: wrap;
gap: 16px;
}
.wrapperServices .wSContent .wSCPlus .cardService {
min-width: calc(50% - 8px);
}
}
@media (max-width: 468px) {
.wrapperServices {
margin: 0 auto 48px auto;
padding-top: 48px;
}
.wrapperServices .wSContent .wSCPlus {
margin: 24px 0 32px 0;
}
.wrapperServices .wSContent .wSCPlus .cardService {
min-width: 100%;
min-height: 0;
}
.wrapperServices .wSContent .wrapperCardServices .cardServices {
padding: 24px;
}
.wrapperServices .wSContent .wrapperCardServices .cardServices h3 {
margin-bottom: 16px;
}
}
.wrapperMore {
background-color: var(--light-grey-color);
border-radius: 15px;
padding: 264px 0 96px 0;
position: relative;
display: flex;
justify-content: center;
margin-top: 296px;
}
.wrapperMore .wAccessible {
display: flex;
align-items: center;
position: absolute;
top: -168px;
background: url(https://gtsystem-informatique.fr/wp-content/uploads/2022/11/gtsystem-service.webp) no-repeat;
background-size: cover;
background-position: center;
height: 336px;
min-height: 336px;
border-radius: 15px;
width: calc(100% - 40px);
max-width: 1164px;
margin: 0 20px;
}
.wrapperMore .wAccessible .wAContent {
margin: 72px;
max-width: 473px;
}
.wrapperMore .wAccessible .wAContent h3 {
margin-bottom: 24px;
color: white;
}
.wrapperMore .wMFormation {
max-width: 1164px;
margin: 0 20px;
display: flex;
justify-content: space-between;
align-items: center;
}
.wrapperMore .wMFormation .wMFTitle {
max-width: 295px;
margin-right: 80px;
}
.wrapperMore .wMFormation .wMFTitle h2 {
margin-bottom: 12px;
}
.wrapperMore .wMFormation .wMFCard {
padding: 40px;
background-color: white;
border-radius: 15px;
}
.wrapperMore .wMFormation .wMFCard h3 {
max-width: 480px;
margin-bottom: 24px;
}
@media (max-width: 868px) {
.wrapperMore {
padding: 241px 0 64px 0;
margin-top: 232px;
}
.wrapperMore .wAccessible {
height: auto;
}
.wrapperMore .wAccessible .wAContent {
margin: 32px;
}
.wrapperMore .wMFormation {
flex-direction: column;
align-items: flex-start;
}
.wrapperMore .wMFormation .wMFTitle {
margin-bottom: 32px;
max-width: 100%;
margin-right: 0;
}
.wrapperMore .wMFormation .wMFCard {
padding: 24px;
}
}
.wrapperRepaMobile {
display: flex;
align-items: center;
max-width: 1164px;
margin: 72px auto 24px auto;
gap: 60px;
}
.wrapperRepaMobile .wrapperImageRepaMobile {
width: 50%;
}
.wrapperRepaMobile .wrapperImageRepaMobile img {
width: 100%;
}
.wrapperRepaMobile .repaMobile {
width: 50%;
}
.wrapperRepaMobile .repaMobile p {
margin: 20px 0;
}
@media (max-width: 1024px) {
.wrapperRepaMobile {
flex-wrap: wrap;
gap: 16px;
margin: 48px auto 0 auto;
}
.wrapperRepaMobile .wrapperImageRepaMobile, .wrapperRepaMobile .repaMobile {
width: 100%;
}
}
@media (max-width: 468px) {
.wrapperHero .wrapperHeroContent #service {
margin-left: 0;
margin-top: 16px;
}
}
.home-wrapper-avis {
max-width: 1164px;
margin: 0 auto;
margin-bottom: 88px;
padding-bottom: 88px;
border-bottom: 2px white solid;
}
.home-wrapper-avis .wrapper-avis-title h2 {
margin-bottom: 8px;
}
.home-wrapper-avis .wrapper-avis {
display: flex;
justify-content: space-between;
margin-top: 64px;
}
.home-wrapper-avis .wrapper-avis .box-avis {
padding: 32px;
background-color: white;
border-radius: 15px;
max-width: 375px;
}
.home-wrapper-avis .wrapper-avis .box-avis .auteur-avis {
margin-top: 24px;
}
.home-wrapper-avis .wrapper-avis .avis-deux {
margin: 0 20px;
}
@media (max-width: 1204px) {
.home-wrapper-avis {
margin-bottom: 48px;
padding-bottom: 48px;
}
.home-wrapper-avis .wrapper-avis {
flex-wrap: wrap;
margin-top: 32px;
}
.home-wrapper-avis .wrapper-avis .box-avis {
max-width: 100%;
width: 100%;
margin: 16px 0;
}
.home-wrapper-avis .wrapper-avis .box-avis .auteur-avis {
margin-top: 16px;
}
.home-wrapper-avis .wrapper-avis .avis-deux {
margin: 0;
}
}
.wrapper-contact-page {
background-color: var(--light-grey-color);
display: flex;
justify-content: center;
align-items: center;
min-height: calc(100vh - 223px);
border-radius: 15px;
}
.wrapper-contact-page .wrapper-contact {
width: 1204px;
padding: 88px 20px;
display: flex;
justify-content: space-between;
}
.wrapper-contact-page .wrapper-contact .contact-info {
max-width: 335px;
width: 100%;
margin-bottom: 48px;
margin-right: 20px;
}
.wrapper-contact-page .wrapper-contact .contact-info .text-info {
margin-top: 24px;
padding-bottom: 32px;
border-bottom: 2px solid white;
}
.wrapper-contact-page .wrapper-contact .contact-info ul {
margin-top: 24px;
padding-bottom: 32px;
border-bottom: 2px solid white;
}
.wrapper-contact-page .wrapper-contact .contact-info ul .un,
.wrapper-contact-page .wrapper-contact .contact-info ul .deux,
.wrapper-contact-page .wrapper-contact .contact-info ul .trois,
.wrapper-contact-page .wrapper-contact .contact-info ul .quatre {
display: flex;
align-items: center;
}
.wrapper-contact-page .wrapper-contact .contact-info ul .deux, .wrapper-contact-page .wrapper-contact .contact-info ul .trois, .wrapper-contact-page .wrapper-contact .contact-info ul .quatre {
margin-top: 8px;
}
.wrapper-contact-page .wrapper-contact .contact-info h3 {
margin-top: 32px;
}
.wrapper-contact-page .wrapper-contact .contact-info p.text-dimanche {
margin: 8px 0;
}
.wrapper-contact-page .wrapper-contact .contact-info .wrapper-horaires {
display: flex;
}
.wrapper-contact-page .wrapper-contact .contact-info .wrapper-horaires .box-horaires-horaires {
margin-left: 8px;
}
.wrapper-contact-page .wrapper-contact .contact-info .wrapper-horaires p {
background-color: white;
border-radius: 5px;
margin-top: 8px;
padding: 10px;
text-align: center;
}
.wrapper-contact-page .wrapper-contact .wpcf7 {
max-width: 522px;
width: 100%;
background-color: white;
border-radius: 15px;
padding: 48px 32px 16px 32px;
margin-left: 40px;
}
.wrapper-contact-page .wrapper-contact .wpcf7 p {
margin-bottom: 16px;
}
.wrapper-contact-page .wrapper-contact .wpcf7 .wpcf7-form-control {
width: 100%;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
font-size: 1.125rem;
font-weight: 300;
margin-top: 8px;
margin-bottom: 4px;
}
.wrapper-contact-page .wrapper-contact .wpcf7 input:focus, .wrapper-contact-page .wrapper-contact .wpcf7 textarea:focus {
outline: 2px solid var(--dark-color);
}
.wrapper-contact-page .wrapper-contact .wpcf7 .wpcf7-text {
outline: 1px solid var(--grey-color);
padding: 12px 16px;
}
.wrapper-contact-page .wrapper-contact .wpcf7 .wpcf7-textarea {
max-width: 100%;
min-width: 100%;
min-height: 100px;
height: 150px;
outline: 1px solid var(--grey-color);
padding: 12px 16px;
}
.wrapper-contact-page .wrapper-contact .wpcf7 .wpcf7-list-item {
margin: 0;
margin-bottom: 8px;
}
.wrapper-contact-page .wrapper-contact .wpcf7 .wpcf7-submit {
border: 2px solid var(--main-color);
color: white !important;
background-color: var(--main-color);
padding: 12px 25px;
-webkit-padding: 12px 25px;
-moz-padding: 12px 25px;
text-transform: uppercase;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 500px;
display: inline-block;
justify-content: center;
text-align: center;
cursor: pointer;
transition: 0.2s ease-in-out;
font-size: 1rem;
margin-top: 0;
margin-bottom: 0;
outline: 0px;
}
.wrapper-contact-page .wrapper-contact .wpcf7 .wpcf7-submit:hover {
color: white !important;
background-color: var(--main-color);
margin-top: -4px;
margin-bottom: 4px;
transition: 0.2s ease-in-out;
}
.wrapper-contact-page .wrapper-contact .wpcf7 .wpcf7-submit:focus {
outline: transparent;
}
span.wpcf7-not-valid-tip {
font-size: 0.95rem !important;
}
[data-class=wpcf7cf_group], .wpcf7cf_remove, .wpcf7cf_add {
margin-top: -24px;
}
.checkbox {
margin: 24px 0;
}
.checkbox p {
display: flex;
align-items: center;
}
.checkbox input[type=checkbox] {
appearance: none;
background-color: #fff;
margin: 0;
margin-right: 8px;
min-width: 20px;
height: 20px;
border: 1px solid var(--grey-color);
border-radius: 4px;
transform: translateY(-0.075em);
display: grid;
place-content: center;
}
.checkbox .form-control + .form-control {
margin-top: 1em;
}
.checkbox input[type=checkbox]::before {
content: "";
width: 0.9em;
height: 0.9em;
transform: scale(0);
transition: 120ms transform ease-in-out;
box-shadow: inset 1em 1em var(--form-control-color);
background-color: CanvasText;
border-radius: 2px;
}
.checkbox input[type=checkbox]:checked::before {
transform: scale(1);
}
.checkbox label {
display: flex;
align-items: flex-start;
font-weight: 300;
font-size: 18px;
} #post-511 .wrapper-content {
max-width: 768px;
margin: 80px auto;
}
#post-511 .wrapper-content h1 {
margin: 48px 0;
}
#post-511 .wrapper-content h2 {
margin: 48px 0 24px 0;
}
#post-511 .wrapper-content a {
color: var(--main-color);
}
#post-511 .wrapper-content a:hover {
text-decoration: underline;
}
#post-511 .wrapper-content ul {
margin-top: 16px;
}
#post-511 .wrapper-content ul li {
list-style: inside;
margin-left: 20px;
margin-top: 8px;
}
@media (max-width: 868px) {
#post-511 .wrapper-content {
margin: 0px auto 32px auto;
}
#post-511 .wrapper-content h1 {
margin: 32px 0;
}
#post-511 .wrapper-content h2 {
margin: 32px 0 16px 0;
}
#post-511 .wrapper-content ul {
margin-top: 12px;
}
#post-511 .wrapper-content ul li {
margin-left: 10px;
margin-top: 4px;
}
}
@media (max-width: 868px) {
.checkbox label {
font-size: 16px;
}
}
.checkbox.last {
margin-bottom: 32px;
}
.wpcf7-spinner {
display: none !important;
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
border-color: red;
background-color: red;
padding: 20px;
border-radius: 5px;
margin: 24px 0;
color: white;
}
.selectMobile {
padding: 12px 12px;
border: var(--grey-color) 1px solid;
}
.selectMobile:focus, .selectMobile:visited, .selectMobile:active {
border: var(--dark-color) 2px solid;
}
#pSelect {
margin-bottom: 0;
}
.wpcf7 form.sent .wpcf7-response-output {
border-color: #46b450;
background-color: #46b450;
padding: 20px;
border-radius: 5px;
margin: 24px 0;
color: white;
}
@media (max-width: 768px) {
.wrapper-contact-page .wrapper-contact {
flex-wrap: wrap;
padding: 48px 20px;
}
.wrapper-contact-page .wrapper-contact {
width: 100%;
}
.wrapper-contact-page .wrapper-contact .contact-info {
width: 100%;
max-width: 100%;
}
.wrapper-contact-page .wrapper-contact .wpcf7 {
width: 100%;
max-width: 100%;
margin-left: 0;
padding: 24px;
}
}
.wrapperml {
max-width: 768px;
margin: auto;
padding: 56px 0 88px 0;
}
.wrapperml h1 {
margin-bottom: 32px;
}
.wrapperml h2 {
margin-top: 64px;
margin-bottom: 16px;
}
section.footerContact {
background-color: var(--light-grey-color);
border-radius: 15px;
padding: 88px 40px;
}
section.footerContact .wrapperFooterContact {
min-height: 100px;
max-width: 1164px;
margin: 0 auto;
display: flex;
justify-content: space-between;
}
section.footerContact .wrapperFooterContact .titleFC {
max-width: 375px;
}
section.footerContact .wrapperFooterContact ul {
margin: 0 40px;
max-width: 295px;
}
section.footerContact .wrapperFooterContact ul .un,
section.footerContact .wrapperFooterContact ul .deux,
section.footerContact .wrapperFooterContact ul .trois {
display: flex;
align-items: center;
}
section.footerContact .wrapperFooterContact ul .deux {
margin: 8px 0;
}
section.footerContact .wrapperFooterContact ul .quatre {
margin-top: 16px;
}
section.footerContact .wrapperFooterContact .contactFC {
max-width: 305px;
}
section.footerContact .wrapperFooterContact .contactFC p {
margin-bottom: 24px;
}
@media (max-width: 868px) {
.wrapperml {
padding: 0 0 64px 0;
}
.wrapperml h2 {
margin-top: 48px;
}
section.footerContact {
padding: 36px 20px;
}
section.footerContact .wrapperFooterContact {
flex-direction: column;
}
section.footerContact .wrapperFooterContact .titleFC {
max-width: 100%;
}
section.footerContact .wrapperFooterContact ul {
margin: 40px 0px;
max-width: 100%;
}
section.footerContact .wrapperFooterContact .contactFC {
max-width: 100%;
}
section.footerContact .wrapperFooterContact .contactFC p {
margin-bottom: 36px;
}
}
.wrapperMobile {
background: url(https://gtsystem-informatique.fr/wp-content/uploads/2022/12/gtsystem-hero-reparation-mobile.webp) no-repeat;
background-size: cover;
background-position: center;
height: 536px;
min-height: 536px;
border-radius: 15px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.wrapperMobile .wrapperHeroContent {
width: 1440px;
max-width: 1440px;
margin: 78px;
}
.wrapperMobile .wrapperHeroContent h1,
.wrapperMobile .wrapperHeroContent p {
max-width: 572px;
}
.wrapperMobile .wrapperHeroContent h1,
.wrapperMobile .wrapperHeroContent p {
color: white;
}
.wrapperMobile .wrapperHeroContent p {
margin: 24px 0;
}
.wrapperMobile .wrapperHeroContent #service {
margin-left: 15px;
}
@media (max-width: 868px) {
.wrapperMobile {
height: auto;
}
.wrapperMobile .wrapperHeroContent {
margin: 32px 20px;
}
}
.cardServices.mobile {
min-width: calc(25% - 20px) !important;
max-width: calc(25% - 20px) !important;
}
.wrapper-image-article {
display: flex;
justify-content: center;
}
.wrapper-image-article img {
border-radius: 15px;
}
.wrapper-content-article {
max-width: 690px;
margin: 32px auto 128px auto;
}
.wrapper-content-article .bleu,
.wrapper-content-article .vert,
.wrapper-content-article .orange,
.wrapper-content-article .rouge {
padding: 32px;
border-radius: 10px;
}
.wrapper-content-article .bleu {
background-color: #E3ECF2;
color: #447392;
}
.wrapper-content-article .vert {
background-color: #E3F2E7;
color: #449259;
}
.wrapper-content-article .orange {
background-color: transparent;
color: var(--main-color);
border: 2px solid var(--main-color);
}
.wrapper-content-article .rouge {
background-color: #fff3f3;
color: #FA2C2C;
}
.wrapper-content-article h1 {
margin: 32px 0 64px 0;
}
.wrapper-content-article p,
.wrapper-content-article ul,
.wrapper-content-article h2 {
margin: 56px 0;
}
.wrapper-content-article .auteurDate {
margin-top: 32px;
margin-bottom: 16px;
}
.wrapper-content-article li {
font-weight: 300;
font-size: 1.125rem;
list-style: inside;
line-height: 200%;
}
.wrapper-content-article a {
color: var(--main-color);
text-decoration: underline;
font-size: 1.125rem;
font-weight: 300;
}
.lastPostArticle {
max-width: 1185px;
margin: 96px auto;
display: flex;
flex-wrap: wrap;
}
.lastPostArticle .wrapperTitle,
.lastPostArticle .card {
padding: 40px;
border-radius: 15px;
width: 375px;
height: 375px;
position: relative;
}
.lastPostArticle .wrapperTitle {
background-color: white;
border: 2px solid #E0E0E0;
margin: 0 10px 20px 10px;
position: relative;
}
.lastPostArticle .wrapperTitle h2 {
margin-bottom: 24px;
}
.lastPostArticle .wrapperTitle #buttonBlog {
position: absolute;
bottom: 40px;
}
.lastPostArticle .card {
overflow: hidden;
display: flex;
justify-content: center;
align-items: flex-end;
padding-bottom: 40px;
margin: 0 10px 20px 10px;
}
.lastPostArticle .card .attachment-post-thumbnail {
position: absolute;
min-height: 100%;
width: auto;
bottom: 0;
}
.lastPostArticle .card .linearLayer {
position: absolute;
width: 100%;
height: 100%;
background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #212121);
bottom: 0;
left: 0;
}
.lastPostArticle .card .cardContent {
position: relative;
}
.lastPostArticle .card .cardContent h3 {
max-width: 295px;
color: white;
margin-bottom: 16px;
text-align: left;
}
.lastPostArticle .card .cardContent .buttonPost {
padding: 10px 25px;
border: 1px solid white;
color: white;
border-radius: 5px;
transition: 0.2s ease-in-out;
display: inline-flex;
}
.lastPostArticle .card .cardContent .buttonPost:hover {
background-color: white;
color: var(--dark-color);
transition: 0.2s ease-in-out;
transform: translateY(-3px);
}
.tag {
font-weight: 600;
font-size: 1rem;
line-height: 120%;
text-transform: uppercase;
color: var(--main-color);
margin-bottom: 24px;
}
@media (max-width: 1225px) {
.tag {
margin-bottom: 16px;
}
.lastPostArticle {
margin: 64px auto;
}
.lastPostArticle .wrapperTitle,
.lastPostArticle .card {
width: calc(50% - 20px);
margin: 0 10px;
margin-bottom: 24px;
height: 275px;
position: relative;
}
.lastPostArticle .card {
display: flex;
justify-content: flex-start;
align-items: flex-end;
}
.lastPostArticle .card .attachment-post-thumbnail,
.lastPostArticle .card .linearLayer {
left: 0;
min-width: 100%;
min-height: 100%;
}
.lastPostArticle .card .cardContent {
text-align: left;
}
}
@media (max-width: 768px) {
.lastPostArticle {
margin: 64px auto;
}
.lastPostArticle .wrapperTitle,
.lastPostArticle .card {
width: 100%;
margin: 0;
margin-bottom: 24px;
position: relative;
}
.lastPostArticle .wrapperTitle #buttonBlog,
.lastPostArticle .card #buttonBlog {
position: relative;
margin-top: 40px;
}
}
@media (max-width: 868px) {
.wrapper-content-article {
margin: 32px auto 64px auto;
}
.wrapper-content-article p,
.wrapper-content-article ul,
.wrapper-content-article h2,
.wrapper-content-article h1 {
margin: 32px 0;
}
.wrapper-content-article .bleu,
.wrapper-content-article .vert,
.wrapper-content-article .orange,
.wrapper-content-article .rouge {
padding: 24px;
}
}
.heroArticleBlog {
width: 100%;
background-color: var(--light-grey-color);
border-radius: 15px;
}
.heroArticleBlog .lastArticleBlog {
max-width: 1204px;
padding: 64px 20px;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
}
.heroArticleBlog .lastArticleBlog .lABContent {
margin-right: 20px;
max-width: 572px;
}
.heroArticleBlog .lastArticleBlog .lABContent h1 {
margin: 24px 0;
}
.heroArticleBlog .lastArticleBlog .wrapper-image-article-blog {
position: relative;
min-height: 488px;
max-height: 488px;
max-width: 572px;
width: 100%;
overflow: hidden;
border-radius: 15px;
display: flex;
align-items: center;
justify-content: center;
}
.heroArticleBlog .lastArticleBlog .wrapper-image-article-blog img {
position: absolute;
min-height: 100%;
width: auto;
}
a.img-article-blog-link {
min-width: 100%;
min-height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.wrapper-categories {
max-width: 1164px;
margin: 48px auto -72px auto;
}
.wrapper-categories .categories-tag {
margin-top: 32px;
}
.wrapper-categories .categories-tag .categoryTag {
padding: 12px 25px;
background: white;
border: 1px solid var(--grey-color);
border-radius: 5px;
display: inline-block;
margin-right: 20px;
margin-bottom: 16px;
}
.wrapper-categories .categories-tag .categoryTag:hover {
background-color: var(--light-grey-color);
cursor: pointer;
}
@media (max-width: 1225px) {
.wrapper-categories {
margin-bottom: -32px;
padding: 0 10px;
}
}
.trait {
content: "";
width: 99px;
height: 4px;
background-color: var(--main-color);
border-radius: 4px;
margin-bottom: 32px;
}
@media (max-width: 868px) {
.heroArticleBlog .lastArticleBlog {
flex-direction: column;
padding: 40px 20px;
}
.heroArticleBlog .lastArticleBlog .lABContent {
margin-right: 0px;
max-width: 100%;
margin-bottom: 32px;
}
.heroArticleBlog .lastArticleBlog .wrapper-image-article-blog {
max-width: 100%;
min-height: 288px;
max-height: 288px;
}
.wrapper-categories {
padding: 0;
}
}
iframe {
width: 100%;
border-radius: 15px;
height: 39vh;
}
.wp-block-button__link {
color: #fff!important;
background-color: #FF5100!important;
text-decoration: none!important;
text-transform: uppercase!important;
font-weight: 500!important;
}