/***** banner *****/
banner                  { width: 100vw; height: 100vh; display: block; z-index: 2;}
banner h1               { font-weight: 600; letter-spacing: .5px; text-transform: uppercase; position: absolute; left: 50%; top: 50%; transform:translate(-50%, -50%); color: #ffffff; width: max-content;}
banner picture img      { width: 100%; height: 100vh; object-fit: cover; border-radius: 0 0 5vw 5vw;}
banner a.link-banner-estimation  { text-transform: uppercase;  position: absolute; left: 50%; top: calc(50% + 80px); transform:translate(-50%, -50%); color: var(--colorRed); width: max-content; font-weight: 700; background: #ffffff; border-radius: 5px; padding: 30px 60px; letter-spacing: 1.5px; line-height: 0;}
banner a.link-banner-estimation::before { content: ''; width: 22px; height: 30px; background: url(../images/icone-calculatrice.svg) 50% 50% no-repeat; display: block; position: absolute; left: 20px; top: 50%; transform: translateY(-50%);}
banner a.link-banner-estimation::after { content: ''; width: 10px; height: 18px; background: url(../images/arrow_next.svg) 50% 50% no-repeat; display: block; position: absolute; right: 20px; top: 50%; transform: translateY(-50%);}

.bloc-search             { position: absolute; left: 50%; transform: translateX(-50%); width: 90vw; max-width: 1200px; top: 70vh; z-index: 800;}
.bloc-search .tabs label  { cursor: pointer; border-radius: 10px; background: #ffffff; padding: 20px; font-weight: 600; margin-right: 7px; display: inline-block;}
.bloc-search .tabs label.active        { color: var(--colorRed);}
.bloc-search .tabs label.active:before { content: ''; border-right: solid 10px transparent;  border-left: solid 10px transparent;  border-top: solid 10px #ffffff; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); }

.bloc-search form                        { display: grid; grid-template-columns: 1fr 1fr 1fr auto; grid-gap: 10px; background: #ffffff; border-radius: 10px; padding: 30px; margin-top: 20px;}
.bloc-search form .SelectBox, 				
.bloc-search form select, 				
.bloc-search form input[type=text]       { width: 100%; padding: 0 25px; height: 50px; margin: 0; border-radius: 5px; appearance: none; padding-bottom: 0; background: url("../images/arrow_select.svg") right+20px center no-repeat #f8f4f0; border: none; font-size: 15px; font-weight: 500; cursor: pointer;}
.bloc-search form .SelectBox             { line-height: 50px;} 				
.bloc-search form .SelectBox option      { line-height: 50px; height: 50px;} 
.bloc-search form .launch                { width: 50px; height: 50px; border-radius: 50%; position: relative; background: url("../images/icone-loupe.svg") 50% no-repeat var(--colorRed); border: 0; padding: 0; cursor: pointer; font-size: 0; transition: all 300ms ease-in-out;}


@media (min-width:1201px) {
.bloc-search .tabs label:hover       { color: var(--colorRed);}
.bloc-search form .launch:hover      { background: url("../images/icone-loupe.svg") 50% no-repeat var(--colorBlue);}
}

@media (max-width:1200px) {
banner h1                                   { top: 40%; width: 80vw; text-align: center; line-height: 1.4;}   
banner a.link-banner-estimation             { top: calc(40% + 100px);}
}

@media (max-width:1024px) {
.bloc-search form          { grid-template-columns: 1fr 1fr; grid-gap: 10px; padding: 20px; margin-top: 20px;}  
.bloc-search form .launch  { width: 100%; border-radius: 5px;}  
}

@media (max-width:800px) {
banner picture img { border-radius: 0;}    
}
@media (max-width:600px) {
banner h1                           { top: 30%; width: 80vw; text-align: center; line-height: 1.4;}   
banner a.link-banner-estimation     { top: calc(30% + 100px);}    
.bloc-search form                   { grid-template-columns: 1fr;}     
.bloc-search                        { top: 55vh;}
}

/***** sidebar *****/
.side_btn 								{ position: fixed; right: 0; top: 50%; transform: translateY(-50%); z-index: 200; display: grid; grid-gap: 10px; padding: 10px;}
.side_btn a								{ display: block; width: 60px; height: 60px; line-height: 60px; border-radius: 25em; position: relative; transition-duration: 0ms; transition-delay: 300ms; font-size:14px; }
.side_btn a:after						{ position: absolute; right: 0; top: 50%; transform: translateY(-50%); background: 50% / contain no-repeat; width: 60px; z-index: 5; content: ""; }
.side_btn a.tel:after					{ height: 20px; background-image: url("../images/icone-telephone.svg");}
.side_btn a.email:after					{ height: 14px; background-image: url("../images/icone-mail.svg");}
.side_btn a.estimation:after			{ height: 30px; background-image: url("../images/icone-calculatrice.svg");}
.side_btn a	span						{ display: block; width: 60px; height: 60px; position: absolute; top: 0; right: 0; background: #ffffff; border-radius: 25em; box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.2);}
.side_btn a	i							{ position: absolute; left: 0; top: 0; font-style: normal; width: 160px; padding-left: 5px; text-align: center; color: var(--colorRed); background: #ffffff; border-radius: 25em; opacity: 0; transition: 100ms all 0ms; font-weight: 600; text-transform: uppercase;}

@media (min-width:1201px) {
.side_btn a:hover  						{ background: #ffffff; transition-delay: 0ms;}
.side_btn a:hover span					{ width: 160px; right: 50%; border-radius: 25em 0 0 25em; box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.1); z-index: -1;}
.side_btn a:hover span:after,
.side_btn a:hover span:before			{ opacity: 1; transition-delay: 200ms;}
.side_btn a:hover i						{ opacity: 1; transition-delay: 250ms;}
}

@media (max-width:1200px) {
.side_btn 								{ opacity: 0; right: -100px;}
}


/***** BLOC *****/
.bloc-texte          { width: 90vw; max-width: 1000px; margin: var(--marginBloc); text-align: center; }
.bloc-texte h3       { color: var(--colorBlue); font-weight: 500; margin-bottom: 30px;}
.bloc-texte i.small  { color: var(--colorRed); font-size: 13px; font-style: normal; font-weight: 700; display: block; margin-bottom: -10px; text-transform: uppercase;}

.bloc-presentation                  { width: 90vw; max-width: 1000px; margin: var(--marginBloc); display: grid; grid-template-columns: 250px 1fr; grid-gap: 0 70px;}
.bloc-presentation .photo img       { border-radius: 50%; border: 20px solid var(--colorBeige); max-width: 250px; height: auto;}
.bloc-presentation .photo p         { color: var(--colorBlue); font-weight: 500; text-align: center;}
.bloc-presentation .photo p i       { color: var(--colorBody); display: block; font-style: normal; font-weight: 400; margin-top: -5px;}
.bloc-presentation .texte .since    { color: var(--colorRed); background: var(--colorBeige); border-radius: 5px; text-transform: uppercase; font-weight: 700; padding: 12px 20px; font-size: 13px; display: inline-block; margin-bottom: 10px;}
.bloc-presentation .texte .titre    { color: var(--colorBlue); font-weight: 500; margin-bottom: 20px; line-height: 1.2; }
.bloc-presentation .texte h2.chapo  { margin-bottom: 20px;}
.bloc-presentation .texte p         { margin-bottom: 20px;}

.bloc-services                  { width: 90vw; max-width: 1620px; margin: var(--marginBloc); display: grid; grid-template-columns: 1fr 1fr; grid-gap: 0 80px;}
.bloc-services .photo           { display: grid; grid-template-columns: 60% auto; grid-gap: 0 40px; align-content: space-between; font-size: 0; line-height: 0;}
.bloc-services .photo img       { max-width: 100%; height: auto; border-radius: 30px;}
.bloc-services .photo .slogan   { background: var(--colorBeige); color: var(--colorBlue); border-radius: 30px; line-height: 1.4; margin-top: 40px; text-align: center; padding: 70px 50px; font-weight: 500;}
.bloc-services .texte       { padding-right: 210px;}
.bloc-services .texte h3    { color: var(--colorBlue); font-weight: 500; margin-bottom: 30px; display: block;}
.bloc-services .texte i.small  { color: var(--colorRed); font-size: 13px; font-style: normal; font-weight: 700; display: block; margin-bottom: -5px; text-transform: uppercase;}
.bloc-services .texte p     { padding-bottom: 40px; margin-bottom: 40px; border-bottom:1px solid #dcdcdc;}
.bloc-services .texte p:last-of-type { margin-bottom: 0;}
.bloc-services .texte h3 a        { display: block;}
.bloc-services .texte h3 a:after  { content: ''; width: 50px; height: 50px; border-radius: 10px; background: url(../images/arrow_next-white.svg) 50% 50% no-repeat var(--colorRed); position: absolute; right: 0; display: block; top: 0;}
.bloc-services .texte h3 a:hover:after { right: 10px;}

.bloc-domaines              { width: 90vw; max-width: 1200px; margin: var(--marginBloc); display: grid; grid-template-columns: 1fr 1fr; grid-gap: 80px 80px; padding-bottom: 40px;}
.bloc-domaines .photo       { grid-column: span 2;}
.bloc-domaines .photo img   { max-width: 100%; height: auto; border-radius: 30px;}
.bloc-domaines .photo b     { position: absolute; color: #ffffff; font-weight: 700; left: 50%; top: calc(50% - 20px); transform:translate(-50%, -50%); text-transform: uppercase; width: max-content;}
.bloc-domaines .photo b:after { content: ''; border-right: solid 25px transparent;  border-left: solid 25px transparent;  border-top: solid 25px #ffffff; position: absolute; bottom: -30px; left: 50%; transform: translateX(-50%);}
.bloc-domaines .texte h3    { color: var(--colorBlue); font-weight: 500; margin-bottom: 30px; display: block;}
.bloc-domaines .texte i.small  { color: var(--colorRed); font-size: 13px; font-style: normal; font-weight: 700; display: block; margin-bottom: -5px; text-transform: uppercase;}
.bloc-domaines .texte p     { margin-bottom: 30px;}

.bloc-biens                 { width: 90vw; max-width: 1620px; margin: var(--marginBloc); text-align: center;}
.bloc-biens:before          { content: ''; background: var(--colorBeige); border-radius: 0; position: absolute; z-index: -1; width: 200vw; left: -50vw; height: 70vh; display: block; top: 395px;}

.bloc-biens .item_bien                                      { transition: all 400ms ease-in-out; border-radius: 30px; overflow: hidden; transform: translateY(0); cursor: pointer; margin: 15px 20px 70px 20px;}
.bloc-biens .item_bien .statut                              { position: absolute; top: 0; left: 50%; transform: translateX(-50%); font-size: 13px; color: var(--colorRed); font-weight: 700; text-transform: uppercase; z-index: 10; padding: 10px 20px 12px 20px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; background: #ffffff;}
.bloc-biens .item_bien .statut.oblique                      { transform:translateX(40%) rotate(45deg); left: inherit; right: 30px; top: 30px; width: 300px;}
.bloc-biens .item_bien .link-bien                           { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 2;}
.bloc-biens .item_bien .slider_photos img                   { width: 100%; max-height: 380px; height: 70vw; object-fit: cover; display: block; filter: brightness(0.9); }
.bloc-biens .item_bien .slider_photos .portrait   			{ width: 100%; overflow: hidden; position: relative;}
.bloc-biens .item_bien .slider_photos .portrait img.photo	{ width: auto; height: 100%; margin: 0 auto; position: absolute; left: 0; right: 0; top: 0; z-index: 10;}

.bloc-biens .item_bien .informations                { background-color: #fff; padding: 30px;}
.bloc-biens .item_bien .informations .infos_breves  { text-align: left;}

.bloc-biens .item_bien .infos_breves h3             { font-weight: 600; font-size: 18px; line-height: 28px; color: var(--colorBody);}
.bloc-biens .item_bien .infos_breves h3 span        { display: block; font-size: 14px; font-weight: 500;}
.bloc-biens .item_bien .infos_breves .price         { color: var(--colorRed); font-weight: 700; }
.bloc-biens .item_bien .infos_breves .price img     { position: absolute; display: block; top: 10px; right: 0; }

.bloc-biens .item_bien .liste_infos                 { margin: 0 -30px; border-top: 1px solid var(--colorBeige); padding-top: 15px; margin-top: 15px;}
.bloc-biens .item_bien .liste_infos li              { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 8px; padding-right: 30px; }
.bloc-biens .item_bien .liste_infos li:last-child   { padding-right: 0;}

.bloc-biens .link                       { margin: 0 5px;}

@media (max-width:800px) { 
.bloc-presentation { padding-bottom: 50px;}    
.bloc-services .texte h3,
.bloc-domaines .texte h3    { margin-bottom: 15px;}
.bloc-texte { text-align: left;}
.bloc-texte h3 { margin-bottom: 15px;}
}

/***** arrows slick *****/
.nav_slider                         { position: absolute; right: 0; top: -50px;}
.slick-arrow						{ width:50px; height:50px; border-radius:50%; border:0; padding:0; font-size:0; position:relative; cursor:pointer;}
.slick-prev 						{ background:url(../images/arrow_next-white.svg) 50% no-repeat var(--colorBlue); transform: rotate(180deg);}
.slick-next 						{ background:url(../images/arrow_next-white.svg) 50% no-repeat var(--colorBlue); margin-left:10px;}

@media (min-width:1201px) {
.slick-prev:hover,
.slick-next:hover					        { background-color: var(--colorRed);}
.slick-arrow:not(.slick-disabled):hover     { opacity: 1; }
}

@media (max-width:800px) { 
.nav_slider                         { right: 0; top: -60px;}
}

@media (max-width:600px) { 
.nav_slider                         { right: 0;}
.slick-arrow						{ width:40px; height:40px;}
}

@media (max-width:400px) { 
.nav_slider                         { top: -40px;}
}

@media (min-width:1201px) {
.item_bien:hover                 		{ transform: translateY(-15px);}
}
@media (max-width:1400px) {
.bloc-services .texte { padding-right: 0; padding-left: 40px;}
.bloc-services .photo   { grid-template-columns: 1fr; align-content: inherit; }
.bloc-services .photo img { height: 55vh; width: 100%; object-fit: cover; }
.bloc-services .texte   { padding-left: 0;}
.bloc-services .photo div:nth-child(2) img { display: none;}
}
@media (max-width:1200px) {
.bloc-services { grid-gap: 0 60px;}
}
@media (max-width:1000px) {
.bloc-presentation          { grid-gap: 0 40px;}
.bloc-services              { grid-gap: 0 40px;}
.bloc-domaines              { grid-gap: 40px 40px;}
}
@media (max-width:800px) {
.bloc-presentation              { grid-template-columns: 200px 1fr;}
.bloc-biens .item_bien          { margin-bottom: 20px; border-radius: 10px; margin: 15px 0 40px 0;}
.bloc-services                  { grid-template-columns: 1fr; grid-gap: 40px 40px;}
.bloc-services .photo img       { border-radius: 10px; height: 40vh;}
.bloc-domaines .photo img       { border-radius: 10px; height: 40vh; width: auto; object-fit: cover; }
.bloc-services .photo .slogan   { padding: 40px 20px; border-radius: 10px;}
.bloc-domaines                  { grid-template-columns: 1fr;}
.bloc-domaines .photo           { grid-column: inherit;}

.bloc-presentation .photo       { display: flex; align-items: center; justify-content: center; flex-direction: column;}
.bloc-presentation .photo img   { border: 10px solid var(--colorBeige); margin-right: 0; margin-bottom: 20px;}

}
@media (max-width:600px) {
.bloc-domaines .photo b         { width: 80vw; text-align: center; line-height: 1.4;}
.bloc-presentation              { grid-template-columns: 1fr; grid-gap: 40px 40px;}

}
@media (max-width:400px) {
.bloc-biens .link               { display: block; width: 100%; margin: 5px 0;}
}