@charset "UTF-8";
@import url(main.css);
h1.h1-gold, h2.h2-gold { color: #D5AD6D; background: -webkit-linear-gradient(transparent, transparent), -webkit-linear-gradient(top, #d5ad6d 0%, #d5ad6d 26%, #e2ba78 35%, #a37e43 45%, #91703b 61%, #d5ad6d 100%); background: -o-linear-gradient(transparent, transparent); -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-transform: uppercase; font-size: 2.2rem; letter-spacing: normal; }

#accueil, #nos-realisations, #nos-services { height: 0 !important; background-color: transparent !important; box-shadow: none !important; border: none !important; }

.spacer { display: none; }

/*-----------------------------Animation de texte-------------------------------*/
.ms-header { display: flex; align-items: center; justify-content: center; }

.ms-header__title { flex: 1 1 100%; width: 100%; text-align: center; }

.ms-header h2 { color: #D5AD6D; background: -webkit-linear-gradient(transparent, transparent), -webkit-linear-gradient(top, #d5ad6d 0%, #d5ad6d 26%, #e2ba78 35%, #a37e43 45%, #91703b 61%, #d5ad6d 100%); background: -o-linear-gradient(transparent, transparent); -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-transform: uppercase; font-size: 2.4rem; font-weight: 600 !important; letter-spacing: normal; }

.ms-slider { display: inline-block; height: 1.5em; overflow: hidden; vertical-align: middle; mask-image: linear-gradient(transparent, white, white, white, transparent); mask-type: luminance; mask-mode: alpha; transform: scale(1.3); transform-origin: left; margin-top: -8px; }

.ms-slider__words { display: inline-block; margin: 0; padding: 0; list-style: none; animation-name: wordSlider; animation-timing-function: ease-out; animation-iteration-count: infinite; animation-duration: 30s; }

.ms-slider__word { display: block; color: #D5AD6D; background: -webkit-linear-gradient(transparent, transparent), -webkit-linear-gradient(top, #d5ad6d 0%, #d5ad6d 26%, #e2ba78 35%, #a37e43 45%, #91703b 61%, #d5ad6d 100%); background: -o-linear-gradient(transparent, transparent); -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-transform: none; font-family: 'Lobster'; font-size: 2.4rem; font-weight: 600 !important; letter-spacing: normal; text-align: left; padding: 2px 2px 2px 10px; }

@keyframes wordSlider { 0%, 9% { transform: translateY(0%); }
  11%, 20% { transform: translateY(-10%); }
  22%, 31% { transform: translateY(-20%); }
  33%, 42% { transform: translateY(-30%); }
  44%, 53% { transform: translateY(-40%); }
  55%, 64% { transform: translateY(-50%); }
  66%, 75% { transform: translateY(-60%); }
  77%, 86% { transform: translateY(-70%); }
  88%, 97% { transform: translateY(-80%); }
  100% { transform: translateY(-90%); } }

@media only screen and (max-width: 775px) { .ms-slider { transform: none; transform-origin: unset; margin-top: 0; } .ms-slider__word { text-align: center; padding: 2px; } .ms-header__title { font-size: 2rem; } }

/*-------------------------------------------------------------------------------------Ajustements SEO-----------------------------------------------------------*/
.first-activity-div, .second-activity-div, .third-activity-div { background-image: url(https://storage.googleapis.com/refpro-app-ca244.appspot.com/customers%2FGHRSmhEM8PRstFZ5d4IQaoriOnE3%2Fimages%2FDesign_sans_titre_4_s334.webp); background-size: cover; background-position: center; color: white !important; }

.first-activity-div .card-cover, .second-activity-div .card-cover, .third-activity-div .card-cover { box-shadow: -0.5rem 0.5rem 0 0 #c10b0d !important; }

div.third-activity-div { margin-bottom: 100px !important; }

/*-----------------------------------------------------------------------------------------------------Bloc actu-----------------------------------------------------------*/
#news-posts-bloc { margin-top: 150px !important; margin-bottom: 150px !important; }

/*-----------------------------------------------------------------------------------------------------------------Séparateurs--------------------------------------------*/
.colour-block { background-image: url(https://storage.googleapis.com/refpro-app-ca244.appspot.com/customers%2FGHRSmhEM8PRstFZ5d4IQaoriOnE3%2Fimages%2FDesign_sans_titre_4_s334.webp); background-size: contain; background-position: center; background-color: black; background-repeat: no-repeat; }

.skew-cc { width: 100%; height: 100px; margin-bottom: 100px; background: linear-gradient(to right bottom, black 49%, transparent 50%), linear-gradient(-50deg, transparent 16px, transparent 0); }

.skew-c { width: 100%; height: 100px; margin-top: 100px; background: linear-gradient(to left bottom, transparent 49%, black 50%); }

/*----------------------------------------------------------------------------------------------------------------------Boutons--------------------------*/
a.Btn, a.button_homepageScreen, button.filter-btn { width: 140px; height: 40px; border: none; border-radius: 10px !important; background: linear-gradient(to right, #77530a91, #ffd277, #77530a70, #77530a8a, #ffd277, #77530a9e); background-size: 250%; background-position: left; color: #ffd277; position: relative; display: flex; align-items: center; justify-content: center; cursor: pointer; transition-duration: 1s; overflow: hidden; font-family: 'Poppins'; }

button.filter-btn { width: fit-content; padding: 10px; }

.Btn::before, a.button_homepageScreen::before, button.filter-btn::before { position: absolute; color: #ffd277; display: flex; align-items: center; justify-content: center; width: 97%; height: 90%; border-radius: 8px; transition-duration: 1s !important; background-color: rgba(0, 0, 0, 0.842); background-size: 200%; }

.Btn:hover, a.button_homepageScreen:hover, button.filter-btn:hover { background-position: right; transition-duration: 1s; }

.Btn:hover::before, a.button_homepageScreen:hover::before, button.filter-btn:hover::before { background-position: right; transition-duration: 1s; }

.Btn:active, a.button_homepageScreen:active, button.filter-btn:active { transform: scale(0.95); }

button.filter-btn.active { background-color: #c10b0d; }

.Btn1::before { content: "02 47 65 67 69"; }

.Btn2::before { content: "06 88 71 56 80"; }

.Btn3::before { content: "Nos prestations"; }

.Btn4::before { content: "Galerie"; }

.Btn5::before { content: "En savoir +"; }

.Btn6::before { content: "Devis gratuit"; }

.Btn7:before { content: "Nos réseaux"; }

.Btn8:before { content: "Film PPF et traitement céramique"; }

.Btn9:before { content: "Detailing et rénovation de carrosserie"; }

.Btn10:before { content: "Covering"; }

.Btn11:before { content: "Entretien et rénovation des cuirs"; }

.Btn12:before { content: "Cryogénie"; }

.googleReviews-div a.button_homepageScreen::before { content: "Voir la fiche"; }

.contact { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 20px; padding-bottom: 50px; }

.contact img { width: 150px; }

/*----------------------------------------------------------------------------------------------------Bannière vidéo Accueil----------------------------*/
.image-video-logo { width: 30% !important; }

@media only screen and (max-width: 500px) { .image-video-logo { width: 50% !important; } }

.videoTitle { width: 80% !important; }

#fullHeight { height: fit-content !important; }

#fullHeight .row { margin-top: 150px !important; margin-bottom: 150px !important; }

/*--------------------------------------------------------------------------------------------------Avis Google-----------------------------------------------*/
div.mb-5.googleReviews-div > div.container.m-4.mx-auto { margin-top: 0 !important; padding-top: 100px; }

div.mb-5.googleReviews-div { margin-bottom: 0 !important; padding-bottom: 100px; background-image: url(https://storage.googleapis.com/refpro-app-ca244.appspot.com/customers%2FGHRSmhEM8PRstFZ5d4IQaoriOnE3%2Fimages%2FDesign_sans_titre_4_s334.webp); background-size: cover; background-position: center; background-repeat: no-repeat; }

div.mb-5.googleReviews-div h3 { color: #D5AD6D; -webkit-text-fill-color: transparent; text-transform: uppercase; font-size: 2.2rem; font-weight: 600 !important; letter-spacing: normal; background: -webkit-linear-gradient(transparent, transparent), -webkit-linear-gradient(top, #b80000 0%, #b80000 26%, #d52424 35%, #7a0000 45%, #6a0000 61%, #b80000 100%) !important; -webkit-background-clip: text !important; }

.googleReviews-div .card { box-shadow: -0.5rem 0.5rem 0 0 #c10b0d !important; }

.googleReviews-div .owl-stage-outer { border-bottom: none !important; }

img.avatar-google-reviews { box-shadow: none !important; }

/*-------------------------------------------------------------------------------------------------------Bloc Maps-------------------------------*/
.maps-section { padding: 100px 0; background-image: url(https://storage.googleapis.com/refpro-app-ca244.appspot.com/customers%2FGHRSmhEM8PRstFZ5d4IQaoriOnE3%2Fimages%2FDesign_sans_titre_4_s334.webp); background-size: contain; background-position: center; background-color: black; background-repeat: no-repeat; }

.maps-section .content { color: white !important; }

.maps-section iframe { border-radius: 0.4rem; }

.maps-section .map-content { padding: 20px; }

.maps-section h3 { color: #D5AD6D; background: -webkit-linear-gradient(transparent, transparent), -webkit-linear-gradient(top, #d5ad6d 0%, #d5ad6d 26%, #e2ba78 35%, #a37e43 45%, #91703b 61%, #d5ad6d 100%); background: -o-linear-gradient(transparent, transparent); -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-transform: uppercase; font-size: 2.2rem; font-weight: 600 !important; letter-spacing: normal; }

/*-----------------------------------------------------------------------------------Bannière vidéo présentation----------------------------*/
#presentation-rennaissance-auto p { font-size: 1.25rem !important; font-weight: 300 !important; line-height: 1.5 !important; letter-spacing: normal !important; }

#presentation-rennaissance-auto .titles { margin-left: 0 !important; text-align: left !important; background-color: #00000052; border-radius: 0.4rem; padding: 40px; box-shadow: -0.5rem 0.5rem 0 0 #c10b0d; backdrop-filter: blur(3px) brightness(0.3); background-size: cover; background-position: center; }

#presentation-rennaissance-auto h2 { color: #D5AD6D; background: -webkit-linear-gradient(transparent, transparent), -webkit-linear-gradient(top, #d5ad6d 0%, #d5ad6d 26%, #e2ba78 35%, #a37e43 45%, #91703b 61%, #d5ad6d 100%); background: -o-linear-gradient(transparent, transparent); -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-transform: uppercase; font-size: 2.2rem; font-weight: 600 !important; letter-spacing: normal; }

/*---------------------------------------------------------------------------------Galerie photos par onglets --------------------------------------*/
.realisations-section { padding: 60px 20px; }

.overlay { max-width: 1200px; margin: 0 auto; padding: 40px 20px; }

.realisations-main-title { text-align: center; color: #D5AD6D; background: -webkit-linear-gradient(transparent, transparent), -webkit-linear-gradient(top, #d5ad6d 0%, #d5ad6d 26%, #e2ba78 35%, #a37e43 45%, #91703b 61%, #d5ad6d 100%); background: -o-linear-gradient(transparent, transparent); -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-transform: uppercase; font-size: 2.2rem; font-weight: 600 !important; letter-spacing: normal; margin-bottom: 32px; }

.filter-tabs { display: flex; justify-content: center; gap: 12px; margin-bottom: 32px; flex-wrap: wrap; }

.realisations-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; }

.realisation-card { border-radius: 8px; overflow: hidden; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); transition: transform 0.2s; }

.realisation-card:hover { transform: translateY(-4px); }

.realisation-card img { width: 100%; height: 320px; object-fit: cover; display: block; cursor: pointer; }

.realisation-card.hidden { display: none; }

/* Modal pour l’image agrandie */
.modal { display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.85); align-items: center; justify-content: center; }

.modal-content { max-width: 500px; max-height: 70vh; width: auto; height: auto; border-radius: 8px; background: #fff; }

.modal-close { position: absolute; top: 24px; right: 32px; color: #fff; font-size: 36px; font-weight: bold; cursor: pointer; z-index: 1100; }

.modal-close:hover { color: #ffae42; }

@media (max-width: 900px) { .filter-tabs { gap: 8px; font-size: 0.9rem; } .filter-btn { padding: 10px 20px; font-size: 1rem; min-height: 48px; } .realisations-grid { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; } .realisation-card img { height: 240px; } .modal-content { max-width: 90%; max-height: 90%; } }

/*--------------------------------------------------------------------------------------------Cartes de services----------------------------------*/
#nos-prestations h3 { background: -webkit-linear-gradient(transparent, transparent), -webkit-linear-gradient(top, #b80000 0%, #b80000 26%, #d52424 35%, #7a0000 45%, #6a0000 61%, #b80000 100%) !important; -webkit-background-clip: text !important; }

.services-auto { display: flex; flex-direction: row; justify-content: center; gap: 40px; flex-wrap: wrap; margin: 0 40px 150px 40px; }

.services-auto .card-link { text-decoration: none; color: inherit; display: block; }

.card-auto { position: relative; width: 300px; height: 250px; border-radius: 14px; z-index: 1111; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; box-shadow: 20px 20px 60px #bebebe, -20px -20px 60px #ffffff; transition: all 1s ease; }

.card-auto:hover { transform: scale3d(1.1, 1.1, 1.1); }

.bg-auto { position: absolute; top: 5px; left: 5px; width: 290px; height: 240px; z-index: 2; backdrop-filter: blur(24px); border-radius: 10px; overflow: hidden; outline: 2px solid white; text-align: center; padding: 30px !important; background-position: center; background-size: cover; align-content: center; }

.bg-auto h2 { color: #D5AD6D; background: -webkit-linear-gradient(transparent, transparent), -webkit-linear-gradient(top, #d5ad6d 0%, #d5ad6d 26%, #e2ba78 35%, #a37e43 45%, #91703b 61%, #d5ad6d 100%); background: -o-linear-gradient(transparent, transparent); -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-transform: uppercase; font-size: 1.7rem; font-weight: 600 !important; letter-spacing: normal; }

.bg-auto p { font-size: 1.25rem !important; font-weight: 300 !important; line-height: 1.5 !important; letter-spacing: normal !important; color: white; }

.blob-auto { position: absolute; z-index: 1; top: 50%; left: 50%; width: 250px; height: 150px; border-radius: 50%; background-color: #c10b0d; opacity: 1; filter: blur(12px); animation: blob-bounce 10s infinite ease; }

@keyframes blob-bounce { 0% { transform: translate(-100%, -100%) translate3d(0, 0, 0); }
  25% { transform: translate(-100%, -100%) translate3d(100%, 0, 0); }
  50% { transform: translate(-100%, -100%) translate3d(100%, 100%, 0); }
  75% { transform: translate(-100%, -100%) translate3d(0, 100%, 0); }
  100% { transform: translate(-100%, -100%) translate3d(0, 0, 0); } }

/*----------------------------------------------------------------------------------------------Footer-------------------------------------------------*/
.bg-thirdColor:has(footer) { background-image: url(https://storage.googleapis.com/refpro-app-ca244.appspot.com/customers%2FGHRSmhEM8PRstFZ5d4IQaoriOnE3%2Fimages%2FDesign_sans_titre_1_oevq.webp); background-size: contain; background-position: center; background-color: black; background-repeat: no-repeat; }

/*------------------------------------------------------------------------------------------Formulaire de contact-----------------------------------------*/
#contact { background-color: transparent; }

#contact h1 { color: #D5AD6D; background: -webkit-linear-gradient(transparent, transparent), -webkit-linear-gradient(top, #d5ad6d 0%, #d5ad6d 26%, #e2ba78 35%, #a37e43 45%, #91703b 61%, #d5ad6d 100%); background: -o-linear-gradient(transparent, transparent); -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-transform: uppercase; font-size: 2.2rem; font-weight: 600 !important; letter-spacing: normal; }

#contact .titles { background-color: #00000052; box-shadow: -0.5rem 0.5rem 0 0 #c10b0d; backdrop-filter: blur(3px) brightness(0.3); background-size: cover; text-align: left !important; border-radius: 0.4rem; padding: 40px; background-position: center center; width: 80%; margin-left: auto !important; margin-right: auto !important; }

#contact p { font-size: 1.25rem !important; line-height: 1.5 !important; font-weight: 300 !important; color: white !important; }

#contact .checkbox.mb-3 { color: white; backdrop-filter: blur(10px) brightness(0.8); padding: 10px; }

#contact button.w-100.btn.btn-outline-dark { backdrop-filter: blur(10px) brightness(0.8); border-radius: 0; border-color: white; color: white; }

#formContact { background-image: url(https://storage.googleapis.com/refpro-app-ca244.appspot.com/customers%2FGHRSmhEM8PRstFZ5d4IQaoriOnE3%2Fimages%2F472973138_4043939829264688_6476412879429361620_n_i2zg.webp); background-size: cover; background-position: center; }

/*-------------------------------------------------------------------------------------------------carrousel--------------------------------------------*/
.owl-carousel { padding-bottom: 100px !important; }

.owl-carousel .owl-item img { aspect-ratio: 1 / 1; object-fit: cover; border-radius: 0.4rem; box-shadow: 0 0.1rem 0.2rem rgba(0, 0, 0, 0.2), 0 0.1rem 0.5rem rgba(0, 0, 0, 0.3), 0 0.2rem 1.5rem rgba(0, 0, 0, 0.4); }

.owl-carousel .owl-stage { transition: 1s !important; }

.owl-carousel .owl-stage-outer { padding: 50px 0; border-bottom: 0.3em solid #c10b0d; }

.photoTitleText h3 { color: #D5AD6D; background: -webkit-linear-gradient(transparent, transparent), -webkit-linear-gradient(top, #d5ad6d 0%, #d5ad6d 26%, #e2ba78 35%, #a37e43 45%, #91703b 61%, #d5ad6d 100%); background: -o-linear-gradient(transparent, transparent); -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-transform: uppercase; font-size: 2.2rem; font-weight: 600 !important; letter-spacing: normal; }

.photoTitleText p { font-size: 1.25rem !important; font-weight: 300 !important; line-height: 1.5 !important; letter-spacing: normal !important; }

/*------------------------------------------------------------------------------------------------------BARRE DE NAVIGATION-----------------------*/
.logo_nav:hover { transform: scale3d(1.2, 1.2, 1.2); transition: all 1s cubic-bezier(0.86, 0.01, 0.15, 0.99); }

#navigation-bar-hide { opacity: 1 !important; top: 0 !important; }

.animated-border-button { background-color: transparent !important; transition: background-color 0.3s ease; color: transparent !important; text-transform: uppercase; }

.animated-border-button.scrolled, .navbar:hover .animated-border-button { color: white !important; font-size: 1.1rem !important; }

.navbar { background-color: transparent !important; transition: background-color 0.3s ease; z-index: 9999 !important; }

.navbar.scrolled, .navbar:hover { background-color: #586d7173 !important; backdrop-filter: blur(10px); }

.navbar.scrolled .bi-chevron-down, .navbar:hover .bi-chevron-down { opacity: 1; }

.bi-chevron-down { opacity: 0; }

.navbar-brand { width: unset; }

.logo_nav { height: 13vh !important; transition: all 1s ease; }

@media only screen and (max-width: 768px) { .navbar-nav { background-color: transparent !important; } }

@media only screen and (max-width: 1172px) { h1 { font-size: calc(1rem + 1.5vw) !important; } }

.animated-border-button.scrolled:after, .navbar:hover .animated-border-button:after { background-color: #AB0033 !important; }

.animated-border-button:after { background-color: transparent !important; }

/*----------------Arrière plan--------------------------*/
.bg-skincare { background-image: url(https://storage.googleapis.com/refpro-app-ca244.appspot.com/customers%2FGHRSmhEM8PRstFZ5d4IQaoriOnE3%2Fimages%2FDesign_sans_titre_bhcx.webp); background-size: cover; background-repeat: no-repeat; background-position: top; padding: 150px 0 !important; background-attachment: fixed; }

/*--------------------------------------------------------------------------------------------------Blog card-------------------------------------*/
.blog-card { max-width: 60vw; width: 100%; height: 500px; position: relative; color: #fff; top: 20%; right: 0; left: 0; margin: 50px auto; overflow: hidden; border-radius: 10px; box-shadow: 0px 10px 20px -9px rgba(0, 0, 0, 0.5) !important; text-align: center; transition: all 0.4s; background-size: 100% !important; }

.blog-card a { color: #fff; text-decoration: none; transition: all 1s; }

.blog-card .color-overlay { background: #000000ad; width: 60vw; height: 500px; position: absolute; z-index: 10; top: 0; left: 0; transition: background 0.3s cubic-bezier(0.33, 0.66, 0.66, 1); }

.blog-card .gradient-overlay { background-image: linear-gradient(transparent, #37386799); width: 60vw; height: 500px; position: absolute; top: 350px; left: 0; z-index: 15; }

/* HOVER + HOVER JS */
.blog-card:hover, .blog-card.is-hover { box-shadow: 0px 18px 20px -9px rgba(0, 10, 30, 0.75); }

.blog-card:hover .card-info, .blog-card.is-hover .card-info { opacity: 1; bottom: 100px; }

.blog-card:hover .color-overlay, .blog-card.is-hover .color-overlay { background: #2f0000e0; }

.blog-card:hover .title-content, .blog-card.is-hover .title-content { margin-top: 70px; }

.title-content { text-align: center; margin: 170px 0 0 0; position: absolute; z-index: 20; width: 100%; top: 0; left: 0; transition: all 0.6s; }

.blog-card h2 { font-size: 1.7rem; color: #D5AD6D; background: -webkit-linear-gradient(transparent, transparent), -webkit-linear-gradient(top, #d5ad6d 0%, #d5ad6d 26%, #e2ba78 35%, #a37e43 45%, #91703b 61%, #d5ad6d 100%); -webkit-background-clip: text; font-weight: 600 !important; -webkit-text-fill-color: transparent; }

@keyframes changeLetter { 0% { width: 10%; }
  100% { width: 80%; } }

.intro { width: 100%; margin: 0 auto; color: #ddd; font-style: italic; line-height: 18px; }

.intro a { color: #ddd; pointer-events: none; text-decoration: none; }

.card-info { box-sizing: border-box; padding: 0; width: 100%; position: absolute; bottom: -40px; left: 0; margin: 0 auto; padding: 0 50px; line-height: 1.5; z-index: 20; opacity: 0; transition: bottom 0.64s, opacity 0.63s cubic-bezier(0.33, 0.66, 0.66, 1); }

.card-info a { margin-left: auto !important; margin-right: auto !important; margin-top: 30px; font-size: 1rem; }

.utility-info { position: absolute; bottom: 0px; left: 0; z-index: 20; width: 100%; text-align: left; }

.utility-info:after { content: " "; background: url(https://rawcdn.githack.com/Nodws/NodPen/ffad95aa5244b4b09a3c7c1508a018959bbedb7e/postItem/licons.svg) center no-repeat; background-size: 30px auto; display: block; opacity: 0.4; position: absolute; bottom: 25px; right: 15px; width: 30px; height: 15px; }

.utility-info a:hover { text-decoration: underline; }

.utility-list { list-style-type: none; margin: 0 0 10px 20px; padding: 0; width: 100%; }

.utility-list li { margin: 0 5px 0 0; padding: 3px 0 15px 0px; display: inline-block; font-size: 0.8em; }

ul.utility-list a { text-decoration: none !important; pointer-events: none; }

.licon { position: relative; width: 23px; height: 15px; display: inline-block; vertical-align: middle; }

.licon:before { content: ""; background: url(https://rawcdn.githack.com/Nodws/NodPen/ffad95aa5244b4b09a3c7c1508a018959bbedb7e/postItem/licons.svg?) -2px -6px no-repeat; background-size: 250px; width: 26px; height: 20px; display: inline-block; vertical-align: middle; position: absolute; top: -3px; left: 0; }

.icon-tag:before { background-position: -33px -6px; }

/*--------------------RESPONSIVE----------------------------*/
@media (max-width: 800px) { .blog-card { height: 820px; background-size: cover !important; } .blog-card .color-overlay { height: 820px; } }

@media (max-width: 1400px) { .blog-card { max-width: 70vw; } .blog-card .color-overlay { width: 70vw; } .blog-card .gradient-overlay { width: 70vw; } }

@media (max-width: 1050px) { .blog-card { max-width: 100vw; border-radius: 0 !important; } .blog-card .color-overlay { width: 100vw; } .blog-card .gradient-overlay { width: 100vw; } .blog-card { box-shadow: 0px 18px 20px -9px rgba(0, 10, 30, 0.75); } .blog-card .card-info { opacity: 1; bottom: 100px; } .blog-card .color-overlay { background: rgba(64, 64, 70, 0.8); } .blog-card .title-content { margin-top: 70px; } }

/*# sourceMappingURL=custom.css.map */