@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');

* {-webkit-print-color-adjust: exact !important; print-color-adjust: exact !important;}

:root {  
    --bs: #1F2159; /* Bleu Squarimo */
    --bsh: #23266b; /* Bleu Hover */
    --vi: #A478FF; /* Violet */
    --vih: #ae86ff; /* Violet Hover  */
    --ma: #F0F0FA; /* Mauve Squarimo */
}

body{color:var(--bs); overflow-x:hidden;}

h3, .h3 {font-size: 1.25rem;}

.mobile{display: block;} .tablet-desktop, .desktop{display: none;}
.u-print {display: none;}

a{transition: all 0.3s ease-out;}
button{border:0;}
button.link{display: none;}

strong{font-family: 'Montserrat-Bold', sans-serif !important; font-weight: 800 !important;}
section{padding:3rem 0 2rem 0;}
.regular{font-family: 'Montserrat-Regular', sans-serif; color:var(--bs); font-style: normal;}
select {position: relative; display: inline-block; cursor: pointer; -webkit-appearance: none; appearance: none; line-height: 1.2 !important;}
.select-custom:after {content: ""; background-image: url('../../assets/img/picto/arrow-link.svg'); background-repeat:no-repeat; transform: rotate(90deg);
  position: absolute; top: 17px; right: 25px; width: 50px; height: 50px; text-align: center; padding-top: 12px; padding-bottom: 10px;
  pointer-events: none; color: #666666;}
.select-custom select::-ms-expand {display: none;}
select option{color:var(--bs); font-family: 'Open Sans'; font-style: normal; font-weight: 400; font-size: 14px; line-height:25px; padding:10px;}
select option:nth-child(2n) {background: rgba(31, 33, 89, 0.05);}

video{position: relative;}
video:before{content: " "; display: block; position: absolute; border:2px solid red; z-index: 9; width:100%; height:100%; top:0; left:0;}

.bg-bs{background-color: var(--bs);}
.bg-ma{background-color: var(--ma);}
.bg-vi{background-color: var(--vi);}
.bg-white{background-color:white;}
.c-bs{color: var(--bs) !important;}
.c-vi{color: var(--vi) !important;}
.cwhite{color:white !important;}
.bradius-10{border-radius: 10px;}

.btn-success, .btn.btn-block.btn-primary{border: 2px solid var(--bs); transition: all 0.3s ease-out;}
.btn-success:hover, .btn.btn-block.btn-primary:hover{background-color:white; color: var(--bs); border: 2px solid var(--bs);}

.btn-txt-blue{border: 2px solid var(--bs); color:var(--bs); background-color: transparent; transition: all 0.3s ease-out;}
.btn-txt-blue:hover{background-color:var(--bs); color:white;}
.btn-txt-white{color:white; background-color: transparent; border: 2px solid white; transition: all 0.3s ease-out;}
.btn-txt-white:hover{background-color:white; color:var(--bs);}
.btn-bg-white{background-color:white; color:var(--bs); border: 2px solid white; transition: all 0.3s ease-out;}
.btn-bg-white:hover{color:white; background-color: transparent;}

.card{box-shadow: 0px 4px 40px rgba(11, 28, 70, 0.1);}

.main-header-right{background: white; position: absolute; right: 0; z-index: 9;} 
.main-header.nav{display: flex; align-items: center; justify-content:space-between;}
.nav .main-profile-menu a, .nav .main-profile-menu span{display: flex; align-items: center; color:white; font-family: 'Montserrat-Bold', sans-serif !important; font-weight: 800 !important;}
.nav .main-profile-menu a img, .nav .main-profile-menu span img{margin:0 0 0 1rem; display: inline-block;}
.nav .nav-mobile{margin:5px 5px 0 0; position: relative; z-index: 50}

.dropdown-item{position: relative; background-color:white; padding:14px 20px; border-top: 1px solid var(--ma); transition: all 0.25s ease-out;}
.dropdown-item img{position: absolute; top: 50%; transform: translateY(-50%);}
.dropdown-item span{margin-left:3rem; font-family: 'Montserrat-Bold', sans-serif; color:var(--bs); font-weight: 700; transition: all 0.2s ease-out;}
.dropdown-item:hover{background-color: rgba(240,240,250,0.6);}
.dropdown-item:nth-child(5){border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;}
.dropdown-mobile{display: none;}

.mobile-burger{display: none;}
.mobile-close{display: none; margin-right:12px;}
.show{display: block;}

.mobile .mobile-menu li a{font-family: 'Montserrat-Regular', sans-serif; color:var(--bs); font-style: normal; font-weight: 400; font-size: 17px; line-height: 21px; transition: all 0.3s ease-out;}
.mobile .mobile-menu li a:after {content:" "; display: block; position: absolute; bottom:0; height:0.5px; width:calc(100% - 30px); left:50%; transform: translateX(-50%); background-color: var(--bs);} 
.mobile .mobile-menu li a:hover, .mobile .mobile-menu li a:active{background: var(--ma) !important; color: var(--bs) !important;}
.mobile .mobile-menu a.mobile-login{display:none; background: var(--bs); display: flex; flex-direction: row; align-items: center; padding: 5px 16px; gap: 10px; color:white !important; width: 100%; height: 50px; font-family: 'Montserrat-Bold', sans-serif;
font-style: normal; font-weight: 700; font-size: 17px; line-height: 21px; border-radius: 0;}
.mobile .mobile-menu a.mobile-login:hover{background: var(--bs) !important; color:white !important;}
.mobile .mobile-menu .a.mobile-login:after, .mobile .mobile-menu a.mobile-login:active:after{display: none;}
.mobile .mobile-menu li a.logged{padding:15px; background-color:var(--bs) !important; color:white !important;}
.mobile .mobile-menu .dropdown-mobile a.dropdown-item {background-color: var(--ma) !important; border-top: 2px solid white; border-radius: 7px; max-width: calc(100% - 20px); padding: 15px 20px; margin: 2px 10px;}
.desktop .desktop-menu li a:hover, .desktop .desktop-menu li a:active{background: var(--bs); color: white;}
.mobile .mobile-menu .bullLogged{display: block; position: absolute;  width: 6px;  height: 6px;     top: 19px;
    left: 42px; transform: translate(-50%, -50%); background: rgb(37, 150, 58); border-radius: 100%;}
.mobile .mobile-menu span.mobile-compte {display: block; float: right; right: 15px; position: absolute; border-radius: 5px; color: var(--bs); background-color: var(--ma) !important; padding: 5px 10px; font-size: 13px;}

.page .hero-banner p{font-family: 'Montserrat-Regular', sans-serif; font-style: normal; font-weight:500; font-size: 16px; line-height: 23px; margin-top:30px;}
.page .hero-banner button{margin-top:30px}
.hero-banner .container div{opacity:0; margin-left:20px; animation-name: fadeInHeader; animation-iteration-count: 1; animation-duration:0.75s; animation-fill-mode: forwards;}
 @keyframes fadeInHeader {0% { opacity: 0; margin-left:20px;} 100% { opacity: 1; margin-left:0;}}

/******* Search *******/

#search{max-width: 100%;}
#search .row.search-actions {margin:1rem 0;}
#search .row.search-actions .item{margin:0 0.5rem; width:50%;}
#search .row.search-actions button{background: white; transition: all 0.3s ease-out;}
#search .row.search-actions button:hover, #search .row.search-actions button:focus, #search .row.search-actions button:active{border:none !important;}
#search .row.search-actions button span{display: block; font-size:12px; color:var(--bs); margin-bottom: 10px;}

#search .type {margin-top:0.5rem; margin-bottom:0.5rem;}
#search .type .title{font-family: 'Montserrat-Bold', sans-serif; color:var(--bs); font-weight: 700; font-size: 16px; line-height: 20px; margin: 0.75rem 0;}
#search button.submit {width: 100% !important; line-height: 1.42;}

.type button.btn-block{width: 100% !important; background-color: var(--ma); border:2px solid var(--ma); color: var(--bs); transition: all 0.3s ease-out;}
.type button.btn-block:hover{background-color:var(--bs); color:white; border:2px solid var(--bs);}

#search button.bien:active{background: var(--bs); color:white;}
#search #type_btn, #search #budget_btn, #search #surface_btn{width:100%; line-height: 1.25;}

#search button.form-control{text-align: left;}
#search button.selected{font-family: 'Montserrat-Bold', sans-serif; background-color:var(--bs); color:white;}

.modal input[type=checkbox] {position: absolute; opacity: 0; cursor: pointer; height: 20px; width: 20px; z-index: 10;}
.modal label{margin-left: 23px; margin-top: -3px; cursor: pointer;}
.modal input[type=checkbox]:checked ~ .checkmark {background-color: var(--bs);}
.modal input[type=checkbox]:checked ~ .checkmark:after {display: block;}
.modal .checkmark {position: absolute; top: 2px; left: 0; height: 14px; width: 14px; background-color: white; border:1px solid var(--bs); cursor: pointer; transition: all 0.3s ease-out;}
.modal .checkmark:after {content: ""; position: absolute; display: none; left: 4px; top: 0px; width: 5px; height: 10px; border: solid white; border-width: 0 3px 3px 0;
-webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}
.modal a{font-family: 'Montserrat-Regular', sans-serif; color:var(--bs); font-style: normal; font-weight: 400; text-decoration: underline;}

/* The Modal component */
.modal {display: none; position: fixed; z-index: 100; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.6);}
.modal-content {position: absolute; background-color: #fefefe; top: calc(50% + 30px); left:50%; transform:translateX(-50%) translateY(-50%); margin:0 auto; padding: 2rem; border: 1px solid #888; width: 100%; max-width: 1000px;}
.modal-content .close {opacity:1 !important; text-align: right; position: absolute; top:1rem; right:1rem; transform: scale(0.9); transition: all 0.2s ease-out;}
.modal-content .close:hover, .close:focus {cursor: pointer; transform: scale(1);}
#modalBudget .modal-content, #modalSurface .modal-content{max-width: 600px;}
#modalAlerte .modal-content{max-width: 410px; background-color: var(--ma); padding: 1.5rem;}
.modal-content .invalid-feedback{font-size: 100%;}


/********************/
/******* HOME *******/
/********************/

.home .hero-banner{background-image: url('../../assets/img/home/squarimo_bg_home-Mobile.webp'); background-size: cover; background-position:right bottom; padding:4rem 0 9rem 0;}

.desktop-logo-1 {width: 12em;}
.desktop-logo {margin-left: 15px;}

#search .card {max-width: calc(100% - 30px); margin: -2rem auto 0 auto; box-shadow: 0px 4px 40px rgba(11, 28, 70, 0.1); text-shadow: 0px 4px 40px rgba(11, 28, 70, 0.1); -webkit-filter: drop-shadow(0px 4px 40px #CCC); filter: drop-shadow(0px 4px 40px #CCC); border-radius: 10px; padding-bottom:0;}
#search .card-header, .card-footer {padding-left: 0.25rem; padding-right: 0.25rem; padding-top: 0.25rem;}
#search .card-body {padding: 0.25rem 0.25rem 0 0.25rem;}

#current-sales .progressive-price{background-color:var(--bs); transition: all 0.25s ease-out; border:none;}
#current-sales a.sale-item{text-decoration: none;}
#current-sales a.sale-item:hover .progressive-price{background-color: var(--bsh);}
#current-sales .decreasing-price{background-color:var(--vi); transition: all 0.3s ease-out; border:none;}
#current-sales a.sale-item:hover .decreasing-price{background-color: var(--vih); padding:2rem;}
#current-sales .badge{margin-left:20px; font-size:0.8rem !important; padding:1rem 2rem; z-index: 5}
#current-sales .badge img{display: inline-block; margin-left:10px;}
#current-sales .badge span{display: inline-block; height:20px; padding: 5px 15px; color:white; font-family: 'Montserrat-Bold', sans-serif; font-weight: 700;}
#current-sales picture{position: relative;}
#current-sales .sale-progress {position: absolute; z-index: 5; bottom: 1rem; left: 50%; background-color: white; transform: translateX(-50%); border-radius: 15px;
    font-size: 0.85rem; padding: 0.25rem 0.9rem; font-weight: 600; width: 170px; text-align: center;}
#current-sales .sale-progress img{margin:0.10rem 0.75rem 0 0;}

#current-sales .favorite-sales{text-align: right; margin-right: 5px;}
#current-sales .favorite-sales button{padding:10px 10px 4px 10px; background-color: white;}
#current-sales .favorite-sales button img{transform: scale(1); transition: all 0.3s ease-out;}
#current-sales .favorite-sales button:hover img{transform: scale(1.25);}
#current-sales .favorite-sales button:focus,#current-sales .favorite-sales button:active{border:none !important; outline: none;}

.infos{padding:1rem;}
#current-sales .infos h4{font-size:0.9rem;}
#current-sales .infos h4 img{margin:0.5rem 1rem 0 0;}
#current-sales .infos .price{color:var(--vi); font-family: 'Montserrat-Bold', sans-serif; font-weight: 800;}
#current-sales .infos .specs div{margin-right:0.5rem;}
#current-sales .infos .specs img{margin:0.25rem 0.5rem 0 0;}
#current-sales .countdown{background-color: var(--bs); color:white; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; flex-direction: column; transition: all 0.3s ease-out;}
#current-sales .countdown div{width:100%;}  
#current-sales a.sale-item .pro-img-box:before{content: " "; opacity:0; background-image: url('../../assets/img/picto/sales-hover.svg'); background-repeat:no-repeat; background-size:cover; position: absolute; z-index: 9; display: block; border-top-right-radius:10px; border-top-left-radius:10px;
width: 90%; height: 90%; left: 50%; top:20%; transform: translate(-50%); transition: all 0.3s ease-in-out;}
#current-sales a.sale-item:hover .pro-img-box:before{opacity:1; width: 100%; height: 100%;  top:0;}

#current-sales a.sale-item .pro-img-box:after{content: " "; opacity:0; background: rgba(31, 33, 89, 0.9); position: absolute; z-index: 5; display: block; border-top-right-radius:10px; border-top-left-radius:10px;
width: 100%; height: 100%; left: 0; top:0; transition: all 0.2s ease-in-out;}
#current-sales a.sale-item:hover .pro-img-box:after{opacity:1; }

#manual .item, #manual .arrow{width:100%; text-align: center;}
#manual .arrow img{transform: rotate(90deg);}
#manual .item img{transform: scale(1); transition: all 0.3s ease-out;}
#manual .item:hover img{transform: scale(1.1);}

#strategies .icon{position: absolute; right:1rem; top:50%;}
#strategies .strategies-cards{display: inline-flex; gap: 5rem;}
#strategies .strategies-cards .card{max-width:calc(33.33% - 4rem)}
#strategies .card:hover img.icon{ animation:headShake 1s;}

#statistics big{ font-size:2rem; font-family: 'Montserrat-Bold', sans-serif !important; font-weight: 800 !important;}

#news .infos h4{text-decoration: none !important;}

/********************/
/***** J'ACHETE *****/
/********************/

.jachete .hero-banner{background-image: url('../../assets/img/jachete/squarimo_bg_jachete-Mobile.jpg'); background-size: cover; background-position:right center; padding:4rem 0 9rem 0;}

.newsletter{width:100%; color:white; padding:2rem 1rem;}
.faq{width:100%; padding:2rem 1rem;}

.accordion-item{background-color: white; border-radius: 10px; transition: all 0.3s ease-out;}
.accordion {font-family: 'Montserrat-Bold', sans-serif; color: var(--bs); cursor: pointer; padding: 18px; width: 100%; border: none;
  text-align: left; outline: none; font-size: 16px; transition: 0.4s; font-weight: bold; background-color: transparent;}
.accordion:focus{outline: none; border: none;}
.accordion:after {content: ' '; color: var(--bs); font-weight: bold; float: right; margin:9px 5px 0 0; background-image: url('../../assets/img/picto/Arrow-bottom.svg'); width:12px; height:7px; }
.accordion.active:after {content: " "; background-image: url('../../assets/img/picto/Arrow-top.svg'); width:12px; height:7px;}
.panel {padding: 0 18px; background-color: white; max-height: 0; overflow: hidden; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; transition: max-height 0.2s ease-out;}

.accordion-item:hover{box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;}

/********************/
/***** JE VENDS *****/
/********************/

.je-vends .hero-banner{background-image: url('../../assets/img/je-vends/squarimo_bg_je-vends-Mobile.jpg'); background-size: cover; background-position:right center; padding:4rem 0 9rem 0;}

#manual-transactop, .item, #manual-transactop, .arrow{width:100%; text-align: center;}
#manual-transactop, .arrow img{transform: rotate(90deg);}
#manual-transactop, .item img{transform: scale(1); transition: all 0.3s ease-out;}
#manual-transactop, .item:hover img{transform: scale(1.1);}

/********************/
/** PROFESSIONNELS **/
/********************/

.professionnels .hero-banner{background-image: url('../../assets/img/professionnels/squarimo_bg_professionnels-Mobile.jpg'); background-size: cover; background-position:right center; padding:4rem 0 5rem 0;}
.professionnels .hero-banner h1, .professionnels .hero-banner p{max-width: 730px;}

/***********************/
/*** QUI SOMMES NOUS ***/
/***********************/

.qui-sommes-nous .hero-banner{background-image: url('../../assets/img/qui-sommes-nous/BG-QuiSommesNous-mobile.jpg'); background-size: cover; background-position:right center; padding:4rem 0 9rem 0;}

.owl-carousel .owl-item img{width:auto; max-height:180px; margin: 0 auto;}
.owl-theme .owl-nav{display: none;}
.owl-carousel button.owl-dot {background: white;}
.owl-theme .owl-dots{margin-top:3rem;}
.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {background: var(--bs);}

/***********************/
/*** Contact ***/
/***********************/

.contact .hero-banner{background-image: url('../../assets/img/qui-sommes-nous/BG-QuiSommesNous-mobile.jpg'); background-size: cover; background-position:right center; padding:4rem 0 9rem 0;}

.form-container{
    width: 60%;
}
.form-container .btn-bg-white{
    border: 2px solid var(--bs);
}
.form-container .btn-bg-white:hover{
    color:white; background-color: var(--bs);
}

/********************/
/***** FOOTER *******/
/********************/

footer #footer-top {color:white;}
footer #footer-top h3{font-size:1.1rem;}
footer #footer-top a{font-family: "Montserrat-Regular", serif; color:white;}
footer #footer-top a:hover{text-decoration: underline;}
footer #footer-top .footer-links p{margin-bottom: 0.5rem;}
footer #footer-top .col-sm-4 img.icon{transform: scale(1); transition: all 0.3s ease-out;}
footer #footer-top .col-sm-4:hover img.icon{transform: scale(1.15); }

footer hr{border:none; height:1px; width:70%; background-color:var(--ma); }
footer #footer-bottom{padding:0.5rem 0; font-size: 0.65rem; text-align: center;}
footer #footer-bottom .footer-pictos-title{padding-right:75px;}
footer #footer-bottom .footer-pictos{position: absolute; left:50%; transform: translateX(-50%);}
footer #footer-bottom .footer-pictos a{display: inline-block; height:30px; width:35px;}
footer #footer-bottom .footer-pictos a:hover{transform: scale(1.1);}
footer #footer-bottom a{font-family: "Montserrat-Regular", serif; color:var(--bs);}
footer #footer-bottom a:hover{text-decoration: underline;}

.content-404{
    padding-top: 9%;
    width: 100%;
}

.body-404{
    height: 110vh;
}
.img-404{
    height: 400px;
}

@media (min-width: 574px) {
    .hero-banner .container {padding-left:20px; padding-right:20px; max-width: 720px !important;}  
    #search .card-header{padding-bottom: 0.25rem;}
    .modal-content .close {top: 2rem; right:2rem;}
    .modal-content {width: 80%;}
    #strategies .card-body {min-height: auto;}
     footer #footer-bottom{font-size: 0.65rem}
}

@media (min-width: 633px) {
    .tablet-desktop{display: block;}
    .desktop-logo {margin-left: 15px !important;}

    #search .card {max-width: calc(100% - 60px);}
    #search .card-body {padding: 0.25rem;}
    #search .card {padding-bottom: 0.25rem;}
    #search .row.search-actions .item{margin:0 1rem;}

    section{padding:3rem 0;}

    #current-sales .infos {min-height: 320px;}
    #current-sales .infos .specs{display: block !important;}

    #strategies .card-header{min-height: 150px;}
    #strategies .card-body{min-height: 520px;}

    #manual .item{width:15%;}
    #manual .arrow{width:6%; padding-top: 2rem;}
    #manual .manual-flex{flex-direction: row !important; text-align: right;}
    #manual .arrow img{transform: none;}
    #manual-transactions .item{width:20%;}
    #manual-transactions .arrow{width:6%; padding-top: 2rem;}
    #manual-transactions .manual-flex{flex-direction: row !important; text-align: right;}
    #manual-transactions .arrow img{transform: none;}

    .jachete .hero-banner{background-image: url('../../assets/img/jachete/squarimo_bg_jachete-Desktop.jpg'); background-size: cover; background-position: center 0; padding:4rem 0 9rem 0;}
    .qui-sommes-nous .hero-banner{background-image: url('../../assets/img/qui-sommes-nous/BG-QuiSommesNous.jpg'); background-size: cover; background-position: center top; padding:4rem 0 9rem 0;}
    .contact .hero-banner{background-image: url('../../assets/img/qui-sommes-nous/BG-QuiSommesNous.jpg'); background-size: cover; background-position: center top; padding:4rem 0 9rem 0;}
    .je-vends .hero-banner{background-image: url('../../assets/img/je-vends/squarimo_bg_je-vends-Desktop.jpg'); background-size: cover; background-position:right center; padding:4rem 0 9rem 0;}
    .professionnels .hero-banner{background-image: url('../../assets/img/professionnels/squarimo_bg_professionnels-Desktop.jpg'); background-size: cover; background-position:right center; padding:7rem 0 5rem 0;}

    footer #footer-bottom{font-size: 0.7rem}
    footer #footer-bottom .footer-pictos{position: absolute; top: -3px; right:5px; transform: none; left:auto;}
}

@media (min-width: 992px) 
{    
    .mobile{display: none;} .desktop{display: block;}

    section{padding:2rem 0 3rem 0;}

    .top-header .header-brand{display: inline-flex; position: absolute; left:0; z-index: 9;}

    .main-header {padding-left: 0;}
    .main-header-right {background: var(--bs); padding:0 1rem; transition: all 0.3s ease-out; cursor: pointer;}
    .main-header-right:hover{background: var(--bsh);}
    .main-header-right .logged span::before{content: ""; display: block; position: absolute; width: 6px; height: 6px; top:2px; right:0; transform: translate(-50%, -50%); background: rgb(37, 150, 58); border-radius: 100%;}
    .main-header-center {margin: 0;}
    .desktop-logo {width: 130px;}

    .home .hero-banner{padding:4.5rem 0 10rem 0;}
    .hero-banner .container {max-width: 960px !important; padding-left: 10px; padding-right: 10px;} 
    .main-content-title{font-size: 50px; line-height: 50px;}
    .page .hero-banner p{font-size:26px; line-height: 34px;}

     #search .card{margin: -5rem auto 0 auto; padding: 1rem 2rem 0.75rem 2rem;}
     #search .card-header{display: flex; flex-direction: row-reverse; align-items: center; justify-content:space-between; padding-bottom:1rem;}
     #search .row.search-actions {margin: 0; width: 331px;}
     #search .row.search-actions button{display: flex; align-items: center; padding:0.5rem 1rem; border:none !important; }
     #search .row.search-actions button:hover, #search .row.search-actions button.selected{background-color: var(--ma); border:none !important; border-radius: 5px;}
     #search .row.search-actions button:focus, #search .row.search-actions button:active, #search .row.search-actions button:visited{border:none !important; outline: 0 !important;}
     #search .row.search-actions button span{display:inline-block; padding-right:10px; margin-bottom:0;}
     #search .row.search-actions .item{margin:0 1.5rem;}

     #current-sales .infos {min-height: 310px;}     
     #current-sales .all-sales{text-align: right; padding:0.5rem 0;}
     button.link{display: inline-block; color:var(--bs); font-family: 'Montserrat-Bold', sans-serif; background-color: transparent; color:var(--bs); font-weight: 700; font-size: 16px; position: relative;}
     button.link:before{content: " "; position: absolute; display: block; background-image: url('../../assets/img/picto/arrow-link.svg'); width:8px; height:15px; background-size:cover; left:-10px; top:6px; transition: all 0.2s ease-out;}
     button.link:after{content: " "; position: absolute; display: block; height:2px; width:calc(100% + 5px); left:-10px; bottom:-7px; background-color: var(--bs); transition: all 0.2s ease-out;}
     button.link:hover:before{left:-6px;}

     #strategies .card-header {min-height: 100px;}
     #strategies .card-body {min-height: 450px;}

    #manual .item{width:15%;}
    #manual .arrow{width:6%; padding-top: 2rem;}
    #manual .manual-flex{flex-direction: row !important; text-align: right;}
    #manual .arrow img{transform: none;}
    #manual-transactions .item{width:20%;}
    #manual-transactions .arrow{width:6%; padding-top: 2rem;}
    #manual-transactions .manual-flex{flex-direction: row !important; text-align: right;}
    #manual-transactions .arrow img{transform: none;}

    #news .infos{min-height: 290px;}
    #news .infos strong{position: absolute; bottom: 20px;}

    .jachete .hero-banner{background-image: url('../../assets/img/jachete/squarimo_bg_jachete-Desktop.jpg'); background-size: cover; background-position: center 0; padding:7rem 0 11rem 0;}
    .qui-sommes-nous .hero-banner{background-image: url('../../assets/img/qui-sommes-nous/BG-QuiSommesNous.jpg'); background-size: cover; background-position: center top; padding:7rem 0 11rem 0;}
    .contact .hero-banner{background-image: url('../../assets/img/qui-sommes-nous/BG-QuiSommesNous.jpg'); background-size: cover; background-position: center top; padding:7rem 0 11rem 0;}
    .je-vends .hero-banner{background-image: url('../../assets/img/je-vends/squarimo_bg_je-vends-Desktop.jpg'); background-size: cover; background-position:center top; padding:8rem 0 11rem 0;}
    .professionnels .hero-banner{background-image: url('../../assets/img/professionnels/squarimo_bg_professionnels-Desktop.jpg'); background-size: cover; background-position:center top; padding:6rem 0 5.5rem 0;}

    .newsletter{width:40%; z-index: 2; color:white; padding:4rem 1rem; position: absolute;}
    .faq{width:70%; float: right; z-index: 1; padding: 5rem 3rem 5rem 10rem;}
    
    footer #footer-bottom{font-size: 0.8rem; text-align: left;}

    .content-404{
        width: 50%;
    }
    .body-404{
        height: 100vh;
    }
    .img-404{
        height: 500px;
    }
}

@media (min-width: 1200px) 
{    
    .main-header-right {padding:0 1.5rem;}
    .home .hero-banner{background-image: url('../../assets/img/home/squarimo_bg_home-Desktop.webp'); background-size: cover; padding:7rem 0 11rem 0;}
    .hero-banner .container {max-width:1200px !important; padding-left: 10px; padding-right: 10px;}   

     #search .card{max-width: 1278px; margin: -5rem auto 0 auto; padding: 1rem 3rem 0 3rem;}
     #search .row.search-actions .item{margin:0;}
     #search .card-title {font-size: 32px;}

     #current-sales .badge{padding: 7px !important;}
     #current-sales .infos {min-height: 250px;}
     #current-sales .infos h4 img {margin: -5px 1rem 0 0;}
     #current-sales .sale-progress{left: auto; transform: none; right:1rem;}
     #current-sales .infos .specs{display: flex !important;}
     #current-sales .infos .specs div {margin-right: 1.3rem;}
     #current-sales .countdown{flex-direction: row;}
     #current-sales .countdown div:nth-child(1){width:30%}
     #current-sales .countdown div:nth-child(2){width:70%}

     #strategies .card-body {min-height: 375px;}     
     #news .infos {min-height: 250px;}
    .qui-sommes-nous .hero-banner{background-image: url('../../assets/img/qui-sommes-nous/BG-QuiSommesNous.jpg'); background-size: cover; background-position: center bottom; padding:7rem 0 11rem 0;}
    .contact .hero-banner{background-image: url('../../assets/img/qui-sommes-nous/BG-QuiSommesNous.jpg'); background-size: cover; background-position: center bottom; padding:7rem 0 11rem 0;}
     footer #footer-bottom{font-size: 0.85rem}
}

@media print {
    .u-print {display: block; display: revert !important; }
    .u-no-print {display: none !important;}

    a{text-decoration: none !important;}

    .main-header.nav.nav-item.hor-header.top-header{position: relative !important;}

    #strategies .card-header{background-color: #f9faff !important; min-height: 100px;}
    #strategies .card-body {min-height: 450px;}

    #equipe .card .card-body{min-height:500px;}
}