/* Thermogroup presentation. Framework reset, grid and components come from Bootstrap 5. */
body {
font-style: normal;
font-stretch: normal;
line-height: normal;
font-weight: normal;
font-size: 16px;
color: #5a6168;
font-family: "Work Sans", sans-serif;
margin-top: 75px;
}
#header {
background: #fff;
z-index: 999;
top: 35px;
}
#coupon {
top: 0;
z-index: 999;
}
img {
max-width: 100%;
}
strong {
font-weight: 500;
}
.card-body,
.card-footer {
padding: 0;
}
.card-footer {
padding-bottom: 10px;
}
section#coupon {
padding-top: 10px;
padding-bottom: 10px;
}
section#coupon {
background-color: #cfdee6;
}
#coupon .col-md-6:after {
width: 1px;
height: 20px;
background: #e4642c;
position: absolute;
content: "";
width: 1px;
right: 0px;
top: -2px;
opacity: 0.23;
}
#coupon .col-md-6:nth-child(2):after {
display: none;
}
#coupon p {
color: #e23000;
font-size: 14px;
letter-spacing: 0.2px;
color: #e23000;
margin-bottom: 0;
}
#coupon p strong {
font-weight: 600;
}
.navbar-brand {
margin: 10px 0;
}
.navbar p {
font-size: 12px;
color: #a0a2a6;
margin: 15px 0;
}
.nav {
float: right;
}
.nav li a.nav-link {
font-size: 13px;
font-weight: 500;
color: #7e8289;
padding: 25px 10px;
}
.tg-hero-banner {
background: none;
}
.tg-hero-banner h2 {
font-size: 32px;
font-weight: 500;
color: #ffffff;
}
.tg-hero-banner .card {
padding: 5px;
border-radius: 15px;
max-width: 400px;
background-color: #11355e;
}
.tg-hero-banner .card-header {
color: #ffffff;
background: none;
}
.tg-hero-banner .card-header * {
font-size: 16px;
color: #ffffff;
}
.tg-hero-banner .card-header p {
margin-bottom: 0;
}
.tg-hero-banner .card .btn-plus {
padding-top: 12px;
padding-bottom: 12px;
width: 220px;
font-size: 18px;
}
.tg-hero-banner .card-header p strong {
font-size: 22px;
font-weight: 600;
}
.tg-hero-banner .card-header p .price {
font-size: 41px;
font-weight: 600;
color: #ffffff;
}
#headline {
background: url(../v2/img/bg-mea,w_480.jpg) center center no-repeat;
background-image: image-set(url(images/21a342861bdccbb3-480.webp) type("image/webp"), url(../v2/img/bg-mea,w_480.jpg) type("image/jpeg"));
background-size: cover;
color: #fff;
}
#headline .card {
background: rgba(17, 53, 94, 0.81) url(../v2/img/feature.png) center left no-repeat;
background-image: image-set(url(images/56d23b87d07d50f7-324.webp) type("image/webp"), url(../v2/img/feature.png) type("image/png"));
background-size: 180px auto;
background-position: 25px center;
}
.widget {
text-align: center;
position: fixed;
bottom: 30px;
left: 30px;
background: #fff;
width: 230px;
color: #5a6168;
padding: 15px;
padding-top: 35px;
border-radius: 15px;
box-shadow: 0 6px 16px 0 rgba(94, 99, 108, 0.11);
background-color: #ffffff;
z-index: 10;
}
.widget img {
position: absolute;
width: auto;
left: 50%;
top: -45px;
transform: translateX(-50%);
}
.widget p {
font-size: 14px;
color: #5a6168;
}
.widget p strong {
font-weight: 600;
}
.widget a {
font-size: 14px;
line-height: 0.74;
}
.widget a.btn-alt {
line-height: 1.4;
color: #fff;
background-size: 20px auto;
}
.widget a.btn-fr {
background-image: url(../v2/img/picto-france.png);
background-size: 20px auto;
}
.widget a small {
font-size: 10px;
}
.widget a:after {
display: none;
}
.banner h2 {
font-size: 36px;
}
#banner-gamme {
color: #fff;
/*background: url(../v2/img/motif_bleuciel.jpg) top left repeat; */
background-size: cover;
padding-top: 60px;
padding-bottom: 60px;
}
h2 strong {
font-weight: 600;
}
.btn {
border: none;
border-radius: 33px;
box-shadow: 0 2px 0 0 #33a767;
background-color: #4cc582;
font-size: 16px;
font-weight: 500;
color: #ffffff;
padding: 10px 20px;
}
.btn-alt,
.card-footer .btn.btn-alt {
background-color: #0bb0e7;
box-shadow: 0 2px 0 0 #0494cc;
}
.card {
border: none;
padding: 8px;
font-size: 14px;
background: #fff;
color: #7a7f84;
margin-bottom: 30px;
}
.card-header,
.card-footer {
border: none;
background: none;
}
.card-header {
font-size: 20px;
border-radius: 7px;
background-color: #eff2f7;
padding-top: 8px;
padding-bottom: 8px;
border: none;
}
.card-header strong {
font-size: 22px;
font-weight: 600;
color: #4cc582;
}
.card ul {
list-style: none;
margin-top: 10px;
}
.card li {
font-weight: 500;
line-height: 1.5;
padding-left: 20px;
background: url(../v2/img/icon-check.svg) left center no-repeat;
}
.card p {
line-height: 1.36;
text-align: center;
color: #7a7f84;
}
.card .price {
font-size: 25px;
font-weight: bold;
color: #0bb0e7;
margin-bottom: 0;
}
.card .old-price {
font-size: 17px;
font-weight: 300;
color: darkorange;
font-weight: bold;
text-decoration: line-through;
}
.card-footer .btn {
background: #4cc582 url(../v2/img/picto-details.svg) left center no-repeat;
background-position: 20px 50%;
padding-left: 50px;
}
.card-height {
padding: 43px;
text-align: center;
height: calc(100% - 30px);
}
.card-large .card-header {
font-size: 25px;
}
.card-large p.promotion {
margin-top: 20px;
}
.card-large .card-header strong {
font-size: 27px;
font-weight: 600;
letter-spacing: -0.5px;
}
.card-large .card-footer .btn,
.modal .btn-alt {
background-image: url(../v2/img/picto-confirmer.svg);
background-position: left center;
background-repeat: no-repeat;
background-position: 20px 50%;
padding-left: 50px;
}
.modal .btn-alt {
background-position: 20px 50%;
background-size: 20px auto;
}
.card-large .card-footer .btn-alt {
background-image: url(../v2/img/group-32.svg);
background-position: 25px 50%;
}
.card-large .price {
font-size: 44px;
}
.card-large .old-price {
font-size: 24px;
font-weight: bold;
}
.card-large .btn {
display: inline-block;
max-width: 300px;
padding: 15px 30px;
font-size: 17px;
}
h5.modal-title {
text-align: center;
color: #e23000;
line-height: 1.2;
font-weight: 300;
padding: 15px 30px;
border-radius: 10px;
background: #f9c310;
width: 100%;
}
h5.modal-title strong {
font-weight: 600;
}

.modal-body p {
font-size: 17px;
line-height: 1.53;
color: #11355e;
}
.modal-header,
.modal-footer {
border: none;
}
.modal-footer {
display: block;
}
.modal-footer p {
display: block;
margin-top: 15px;
}
.clearfix {
clear: both;
}
.list-features {
max-width: 250px;
text-align: left;
margin-left: auto;
margin-right: auto;
}
.card-list-features {
padding: 30px 55px;
margin-bottom: 0;
background-color: #eff2f7;
}
.card-list-features .card-body p {
text-align: left;
}
.card-list-features .card-body strong {
font-size: 16px;
}
h2.title-section {
color: #1e4c80;
}
h2.title-section {
font-size: 35px;
line-height: 1.2;
font-weight: 300;
margin-bottom: 60px;
}
.card-body a:not(.btn),
.modal-footer a {
font-size: 14px;
font-weight: 500;
line-height: 1.79;
color: #0bb0e7 !important;
text-align: center;
display: inline-block;
margin: 0 auto;
position: relative;
border-bottom: solid 1px #c7edf9;
text-decoration: none !important;
}
.card-body a:not(.btn):after {
position: absolute;
right: -20px;
top: 0;
width: 20px;
height: 20px;
content: "";
display: block;
background: url(../v2/img/picto-lien.svg) center right no-repeat;
}
p.promotion {
font-size: 14px;
font-weight: 600;
letter-spacing: 0.3px;
text-align: center;
color: #e23000;
}
.card-information {
border: solid 1px #e4e9f2;
border-radius: 10px;
box-shadow: 0 2px 0 0 #e5e5f2;
}
.card-information {
padding: 20px;
margin-top: 30px;
color: #1e4c80;
}
.card-information.card-height {
height: calc(100% - 60px);
}
.card-information .t-precision {
background-image: url(../v2/img/picto-i.svg);
background-position: left center;
background-repeat: no-repeat;
background-position: 40px 40%;
padding: 15px;
padding-left: 120px;
}
.forms {
position: relative;
padding: 0;
width: 100%;
}
.form-container h4 {
color: #1e4c80;
font-size: 21px;
padding: 20px;
padding-left: 60px;
background: url(../v2/img/picto-envoyer.svg) left center no-repeat;
}
.form-container .row {
margin-right: -6px;
margin-left: -6px;
}
.form-container [class*="col-"] {
padding-right: 10px;
padding-left: 10px;
}
.forms ol {
margin: 0;
padding: 0;
}
.forms ol li {
line-height: auto;
list-style: none;
position: relative;
background: none;
}
.forms .btn {
float: right;
padding-top: 13px;
padding-bottom: 13px;
padding-right: 30px;
margin: 3px;
}
.forms .btn,
.experts .btn {
font-weight: 500;
}
.experts .btn {
font-size: 20px;
line-height: 0.75;
}
.experts .btn small {
font-size: 12px;
}
.experts .btn-alt {
line-height: 30px;
}
.experts .btn {
height: 50px;
}
input,
textarea {
width: 100%;
}
button,
input,
textarea {
font-family: "Work Sans", sans-serif;
}
textarea,
input[type="text"],
input[type="tel"] {
display: inline-block;
font-family: "Work Sans", sans-serif;
-webkit-font-smoothing: antialiased;
-webkit-text-size-adjust: 100%;
border: solid 1px #becde2;
border-radius: 5px;
padding: 15px 20px;
background: #eff2f7;
font-size: 16px;
color: #767e8c;
margin-bottom: 12px;
line-height: 26px;
resize: none;
vertical-align: middle;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
textarea {
padding: 20px;
margin-bottom: 16px;
min-height: 50px;
resize: none;
}
.btn-submit {
-webkit-font-smoothing: antialiased;
-webkit-text-size-adjust: 100%;
width: auto;
}
.btn-phone,
.btn-mail,
.btn-sms,
.btn-plus {
background-image: url(../v2/img/icon-mail.svg);
background-position: left center;
background-repeat: no-repeat;
background-position: 20px 50%;
padding-left: 60px;
}
#contact .btn-phone,
#contact .btn-sms {
background-position: 40px 50%;
color: #fff;
}
.btn-sms {
background-image: url(../v2/img/icon-sms.svg);
}
.btn-phone {
position: relative;
background-image: url(../v2/img/icon-phone.svg);
}
.btn-phone:after {
content: "";
position: absolute;
width: 22px;
height: 22px;
right: 15px;
top: 13px;
background-image: url(../v2/img/picto-france.png);
background-size: cover;
}
.btn-plus {
background-image: url(../v2/img/icon-plus.svg);
padding-top: 15px;
padding-bottom: 15px;
}
#contact textarea {
width: calc(100% - 10px);
}
#contact {
padding-top: 60px;
padding-bottom: 100px;
background-color: #eff2f7;
}
#contact h2.title-section {
padding-top: 90px;
background: url(../v2/img/picto-contact.svg) top center no-repeat;
}
#contact .card {
padding: 0;
border-radius: 10px;
}
#contact .card {
padding: 20px 40px;
}
#contact p {
font-size: 13px;
line-height: 1.38;
color: #9fa1a4;
text-align: left;
}
#contact .col-lg-7 {
padding-right: 21px;
}
#contact .btn-mail {
max-height: 50px;
float: right;
}
#contact .btn-large {
font-size: 25px;
width: calc(100% - 20px);
margin: 0 10px;
background-position: 60px 50%;
background-size: 30px auto;
}
#contact .btn-large:after {
display: none;
}
#contact .experts {
padding: 30px 35px;
margin-top: 20px;
margin-bottom: 20px;
border-radius: 15px;
background-color: #eff2f7;
}
#contact .experts h4 {
color: #1e4c80;
font-weight: 400;
font-size: 19px;
margin-bottom: 25px;
}
#contact .experts h4 strong {
font-weight: 600;
}
#contact .col-lg-5 {
padding-left: 21px;
}
#faq a {
color: #fff;
text-decoration: none;
}
#faq li {
background: url(../v2/img/picto-confirmer.svg) center right no-repeat;
background-size: 25px 25px;
}
#faq ul {
list-style: none;
padding: 0;
margin-top: 30px;
}
#faq li {
font-size: 15px;
line-height: 1.4;
padding: 8px 0;
padding-right: 45px;
border-top: solid 1px #dce2ed;
}
.navbar-light .navbar-toggler {
border: none;
}
.img_focus {
display: none;
}
@media only screen and (max-width: 768px) {
.navbar {
padding: 0 1rem;
}
.navbar-brand {
margin: 0;
}
#header {
top: 48px;
}
#coupon .col-md-6:after {
display: none;
}
#coupon p {
text-align: center;
}
.widget {
display: block;
bottom: 10px;
left: 10px;
padding: 10px;
}
.widget img {
display: none;
}
.widget .btn-phone {
padding-left: 35px;
}
#contact .btn-large.btn-phone {
margin-top: 70px;
}
.card-height {
height: auto !important;
}
.btn {
font-size: 15px;
}
.experts .btn {
font-size: 14px;
line-height: 1.2;
text-align: left;
}
.experts .btn-alt {
line-height: 30px;
}
.experts .btn small {
font-size: 11px;
}
#contact .btn-phone,
#contact .btn-sms {
background-position: 15px 50%;
}
.nav-item {
width: 100%;
}
.nav li a.nav-link {
padding: 12px 10px;
}
.experts img {
margin: 0 auto;
display: block;
margin-bottom: 10px;
}
.experts img,
.experts h4,
.card-information * {
text-align: center !important;
}
}
@media only screen and (max-width: 992px) {
#contact .experts {
max-width: 350px;
margin: 15px auto;
}
#contact .btn-mail {
font-size: 12px;
height: 45px;
}
.card-header strong {
display: block;
}
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
.navbar-brand img {
max-width: 180px;
}
.navbar p {
margin-left: 0;
margin-right: auto;
}
.nav li a.nav-link {
font-size: 13px;
}
.navbar p {
font-size: 10px;
}
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
.list-features {
max-width: 280px;
padding-left: 20px;
}
}
@media (max-width: 576px) {
.card-footer .btn {
font-size: 10px;
}
.list-features {
padding-left: 10px;
}
body {
margin-top: 15px;
padding-top: 40px;
}
.card-list-features {
padding: 25px;
}
#header {
position: fixed;
top: 0;
left: 0;
background: #fff;
width: 100%;
z-index: 9;
}
#headline .card {
background-size: auto 160px;
background-position: 70% 10px;
}
#headline .col-sm-8 {
padding-top: 180px;
}
#headline {
background: #9f9197;
color: #fff;
}
.experts .btn {
line-height: 1.2;
}
.navbar p {
display: none;
}
.navbar-brand {
width: calc(100% - 60px);
}
.card-information .t-precision {
background-position: 0px 40%;
padding-left: 50px;
}
#contact textarea {
width: 100%;
}
#coupon,
#banner-gamme {
display: none;
}
#contact .card {
padding: 15px;
}
#contact .btn-large.btn-phone {
font-size: 15px;
}
.tg-hero-banner>h2,
.tg-hero-banner>p {
display: none;
}
h2.title-section {
font-size: 20px;
padding-top: 10px;
padding-bottom: 10px;
margin-bottom: 20px;
}
#contact .experts {
padding: 10px 15px;
}
.experts .btn {
height: auto !important;
max-width: 280px;
margin-left: auto;
margin-right: auto;
}
.widget {
width: 200px;
bottom: 5px;
left: 5px;
}
.widget p {
display: none;
}
.widget a {
background-position: 15px 50%;
padding-left: 35px;
padding: 5px 10px;
}
}
@media (min-width: 480px) {
#headline {
background: url(../v2/img/bg-mea,w_904.jpg) center center no-repeat;
background-image: image-set(url(images/6b6441f1ab5c2f42-904.webp) type("image/webp"), url(../v2/img/bg-mea,w_904.jpg) type("image/jpeg"));
background-size: cover;
}
}
@media (min-width: 904px) {
#headline {
background: url(../v2/img/bg-mea,w_1227.jpg) center center no-repeat;
background-image: image-set(url(images/3f791a3ca8ab2307-1227.webp) type("image/webp"), url(../v2/img/bg-mea,w_1227.jpg) type("image/jpeg"));
background-size: cover;
}
}
@media (min-width: 1227px) {
#headline {
background: url(../v2/img/bg-mea.jpg) center center no-repeat;
background-image: image-set(url(images/58df37f987696429-1640.webp) type("image/webp"), url(../v2/img/bg-mea.jpg) type("image/jpeg"));
background-size: cover;
}
}
.fas {
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
display: inline-block;
font-style: normal;
font-variant: normal;
text-rendering: auto;
line-height: 1;
}
.fa-shopping-cart:before {
content: "\f07a";
}
@font-face {
font-family: "Font Awesome 5 Free";
font-style: normal;
font-weight: 400;
font-display:swap;
src:url(vendor/fontawesome/fa-regular-400.woff2) format("woff2");
font-display: swap;


}
@font-face {
font-family: "Font Awesome 5 Free";
font-style: normal;
font-weight: 900;
font-display:swap;
src:url(vendor/fontawesome/fa-solid-900.woff2) format("woff2");
font-display: swap;


}
.fas {
font-family: "Font Awesome 5 Free";
}
.fas {
font-weight: 900;
}

/* Keep separate contact choices readable after the Bootstrap 5 migration. */
#widget .btn {
min-height: 44px;
margin: 0 0 10px;
line-height: 1.35;
white-space: normal;
}
#widget .btn:last-child {
margin-bottom: 0;
}
#contact .experts .btn,
#devis .experts .btn {
display: block;
width: 100%;
max-width: none;
height: auto;
min-height: 50px;
margin: 0;
padding-top: 12px;
padding-bottom: 12px;
line-height: 1.35;
white-space: normal;
}
#contact .experts .btn + .btn,
#devis .experts .btn + .btn {
margin-top: 12px;
}

/* A checkbox must not inherit the full-width text-field rule. */
#devis-form .tg-devis-consent {
display: flex;
align-items: flex-start;
column-gap: 10px;
min-height: 44px;
padding-left: 0;
}
#devis-form .tg-devis-consent .form-check-input {
flex: 0 0 18px;
float: none;
width: 18px;
height: 18px;
margin: .65rem 0 0;
}
#devis-form .tg-devis-consent .form-check-label {
min-width: 0;
margin: 0;
padding: .65rem 0;
line-height: 1.5;
}