* * Project style sheet. * * @package vanilla * @subpackage css * @author Loops * @version SVN: $Id: styles.css 79 2019-11-13 16:30:57Z lemale $ */ /*** BASICS -------------------- ***/ /** these styles should be available in CKEditor too **/ .font0 {} /* default font family */ .font1 {} /* secondary font family */ .font2 {} /* ... */ .cl0 { color: #ea516b; } /* primary color */ .cl1 { color: #314e6b; } /* secondary color */ .cl2 { color: #4A4A4A; } /* secondary color */ .cl3 { color: #707070; } .cl4 { color: #FFFFFF; } .bg0 { background-color: #314e6b; } /* background primary color */ .bg1 { background-color: #F3F3F3; } .bg2 { background-color: #F7F7F7; } /* background secondary color */ .bg3 { background-color: #FFFFFF; } /** images **/ img.left { margin: 0 0 20px 20px; } img.right { margin: 0 20px 20px 0; } /* undo lowercase for german * / html[lang="de"] .lc { text-transform: none !important; } /**/ /*** ELEMENTS ------------------ ***/ /** buttons **/ /*button, .btn { display: inline-block; text-decoration: none !important; padding: 0; margin: 0; border: 0; background: none; color: #737373; text-transform: uppercase; font-size: 14px; font-weight: 400; } button:before, .btn:before { content: ""; display: inline-block; height: 1px; width: 34px; background-color: #AA9D70; vertical-align: 0.25em; margin-right: 15px; } button:hover, .btn:hover, button:focus, .btn:focus { color: #AA9D70; } button:active, .btn:active { color: #AA9D70; }*/ button, .btn { padding: 15px; width: 200px; height: 50px; border: 1px solid rgba(112, 112, 112, 1); color: rgba(112, 112, 112, 1); background-color: white; font-size: 16px; font-weight: bold; } button, .btn::before { content: none; } button, .btn:hover { color: #FFFFFF; background-color: rgba(112, 112, 112, 1); text-decoration: none } /** pagination **/ .pagenav {} /* list */ .pagenav_list {} /* item */ .pagenav_item {} /* link */ .pagenav_link {} /* hover */ .pagenav_link:hover {} /* active/focus */ .pagenav_link:active, .pagenav_link:focus {} /* current, not */ .pagenav_link.\:current {} /* special links */ .pagenav_linkfirst {} /* go to first page */ .pagenav_linkprev {} /* go to previous page */ .pagenav_linknext {} /* go to next page */ .pagenav_linklast {} /* go to last page */ /** fadeable **/ .fadeable { position: relative; } html.\!js .fadeable_item + .fadeable_item { display: none; } html.js .fadeable_list { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; } html.js .fadeable_item { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; } /* special spacer added in javascript */ .fadeable_spacer { position: relative; z-index: -1; visibility: hidden; } /* nav */ .fadeablenav { position: absolute; left: 0; right: 0; bottom: 8%; text-align: center; z-index: auto; } .fadeablenav_item { cursor: pointer; display: inline-block; width: 14px; height: 14px; position: relative; z-index: 2; } .fadeablenav_item:before { content: ""; position: absolute; top: 50%; left: 50%; margin-top: -2px; margin-left: -2px; border-radius: 100%; width: 4px; height: 4px; border: 2px #fff solid; } .fadeablenav_item.\:current:before, .fadeablenav_item:hover:before { background-color: #fff; } /*** LISTS --------------------- ***/ /* below a sample of list rules that may be used the associated structure is:

*/ /** list1, used for ? **/ /* title above the list */ .list1_title {} .list1 {} /* item */ .list1_item {} /* box around item data */ .list1_itembox {} /* item content */ .list1_itemimg {} .list1_itemtitle {} .list1_itemtext {} .list1_itemmore {} /*** PROPERTY LIST --------------- ***/ .list_properties { list-style-type: none; margin: 0; padding: 20px 0 0 0; } .list_properties_link { width:100%; } .list_properties_link:hover { text-decoration: none; } .list_properties_link:hover .list_properties_item_more { background-color: #314e6b; color: #FFFFFF; } .list_properties_item { clear: both; margin-bottom: 48px; box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.05);} .list_properties_item_column { min-height: 324px; } .list_properties_item_slider { width: 40%; float: left; } .list_properties_item_slider_slides { list-style-type: none; } .list_properties_item_text { display: flex; flex-direction: column; color: #314e6b; } .list_properties_item_text > div { flex: 1; display: flex; justify-content: center; flex-direction: column;} .list_properties_item_text_wrap { padding: 24px 24px 0 24px; border-right: 1px solid #F7F7F7; border-top: 1px solid #F7F7F7;} .list_properties_item_title { font-size: 22px; font-weight: 600; color: #314e6b; } .list_properties_item_subtitle { font-size: 15px; } .list_properties_item_desc { font-size: 14px; } .list_properties_item_options { font-size: 14px; list-style-type: none; display: flex; flex-flow: wrap; justify-content: space-between; margin: 0; padding: 0; height: 34px; line-height: 34px; } .list_properties_item_option { background-color: #F7F7F7; flex: 1; padding-left: 10px; min-height: 44px; display: flex; align-items: center; padding-top: 4px; padding-bottom: 4px; line-height:1.2em; } .list_properties_item_option:nth-of-type(2n) { flex: 0.8; } .list_properties_item_option ~ .list_properties_item_option { margin-left: 8px; } .list_properties_item_price { font-size: 22px; font-weight: 600; color: #314e6b; padding: 23px 0 18px 0; } .list_properties_item_more {bottom:0px; position: relative; max-height: 50px; line-height: 50px; text-align: right; font-size: 12px; font-weight: 500; background-color: #F7F7F7; text-transform: uppercase; padding-right: 65px; } .list_properties_item_more:hover { background-color: #314e6b; color: #FFFFFF; } .list_properties_item_more_link::after { content: " "; position: absolute; top: 24px; right: 25px; height: 2px; width:25px; max-height: 50px; line-height: 50px; text-align: right; background-color: #ea516b; } .list_properties_item_more_link:hover { text-decoration: none; } .list_properties .list_properties_item_desc>p{margin-bottom:0px;} .list_properties .picto_wrapper{margin-top:25px; margin-bottom:13px;} .list_properties_item_option .icon{bottom:auto;} .list_properties_item_text p>br:nth-child(2n){display:none;} .flexslider .slides > li{background-position: center center; background-repeat: no-repeat; background-size: cover;} .list_properties_item, .list_properties_item .list_properties_item_slider, .list_properties_item .list_properties_item_slider>.list_properties_item_slider_slides{display:flex; } /** TODO A vérifier .list_properties_item .flexslider .slides img{opacity:0; } */ .ui-widget.ui-widget-content{max-width:100%;} .standardsection2col { position: relative; } /*.standardsection2col:after { content: ""; position: absolute; z-index: 1; left: 50%; top: 110px; bottom: 90px; width: 1px; background-color: #AA9D70; }*/ .standardsection2col_wrap {} .standardsection2col_col { max-width: 500px; padding: 40px 40px 40px 0; margin: auto; } .standardsection2col_col:nth-child(even) { padding-left: 40px; padding-right: 0; } .standardsection2col_coltitle { margin: 40px 0 53px; } .standardsection2col_coltitle:first-child, a[name]:first-child + .standardsection2col_coltitle { margin-top: 0; } .standardsection2col_coltext { margin: 40px 0 90px; } .standardsection2col_colform { margin: 0 40px 0 0; } .standardsection2col_colbtn { position: absolute; z-index: 2; left: auto; bottom: 40px; } /* box */ .standardsection2col_colbox { background-color: #F3F3F3; padding: 40px; } .standardsection2col_colbox:not(:first-child) { margin-top: 40px; } .standardsection2col_colbox + .standardsection2col_colbox { margin-top: 40px; } .standardsection2col_colboxtitle { margin-top: 0; } /* map */ .standardsection2col_colmap { position: relative; } html.js .standardsection2col_colmap { min-height: 265px; } .standardsection2col_colmap:not(:first-child) { margin-top: 40px; } .standardsection2col_colmapstatic { max-width: none; width: 100%; -webkit-filter: grayscale(100%); filter: grayscale(100%); } .standardsection2col_colmapdynamic { position: absolute; z-index: 1; top: 0; left: 0; bottom: 0; right: 0; } /* text-center */ .standardsection2col_col.ct .standardsection2col_coltitle:after { margin-left: auto; margin-right: auto; } .standardsection2col_col.ct .standardsection2col_colform { text-align: left; max-width: 260px; margin: 0 auto; } .standardsection2col_col.ct .standardsection2col_colform input { text-align: left; border-color: #AA9D70; } .standardsection2col_col.ct .standardsection2col_colform .formrow_submit { text-align: left; } .formrow_submit{margin-bottom:40px;} /* call */ .standardsection2col_colcall {} /* link */ .standardsection2col_colcalllink { display: inline-block; font-size: 150%; text-decoration: none !important; } /* icon */ .standardsection2col_colcalllink:before { vertical-align: top; margin-right: 15px; } /* effect */ .standardsection2col_colcalllink:hover, .standardsection2col_colcalllink:active, .standardsection2col_colcalllink:focus { color: #AA9D70; } .standardsection2col_colcalllink:hover:before, .standardsection2col_colcalllink:active:before, .standardsection2col_colcalllink:focus:before { background-position: -36px -132px; } /* separator */ .standardsection2col_colcallsep { display: inline-block; font-size: 200%; margin: 12px auto 26px auto; } /* btn */ .standardsection2col_colcallbtn { display: inline-block; } /* variation */ .standardsection2col.\:bg { background-color: #F3F3F3; } /*.standardsection2col.\:bg:after { right: 0; top: 0; bottom: 0; width: auto; background: #57634F url(images/contact.png) 50% 50% no-repeat; background-size: cover; }*/ /*** LAYOUT -------------------- ***/ /** container **/ /* set default background-color */ body {} .container { width: 100%; margin: 0 auto; position: relative; box-sizing: border-box; overflow:auto; } .wrap { width: 100%; max-width: 1080px; margin: 0 auto; position: relative; box-sizing: border-box; } /** header **/ #mainheader { background-color: #314e6b; position: fixed; top: 0; z-index: 100; } #mainheader_wrap { position: relative; height: 140px; max-width: 1280px; margin: auto; } /* logo */ #mainheaderlogo { position: absolute; bottom: 20px; left: 40px; z-index: 3; } #mainheaderlogo_img {} /* separator */ #mainheader_separator { position: absolute; top: 55px; left: 225px; width: calc( 100% - 225px - 40px ); height: 1px; z-index: 3; background-color: rgba(255, 255, 255, 0.2); } #mainheadernav {} #mainheadernav_trigger { display: none; } /* nav */ #mainheadernav01_list { position: absolute; z-index: 2; bottom: 30px; left: 225px; white-space: nowrap; font-size: 14px; font-weight: 500; color: #FFFFFF; text-transform: uppercase; } .mainheadernav01_item { display: inline-block; margin-right: 40px; } .mainheadernav01_link { display: inline-block; padding: 5px 0; color: inherit; text-decoration: none !important; } /* FF */ _:-moz-tree-row(hover), html:not(.mac) .mainheadernav01_link { padding-top: 6px; padding-bottom: 4px; } /* effect/current */ .mainheadernav01_link:hover, .mainheadernav01_link:focus, .mainheadernav01_link:active, .mainheadernav01_link.\:current { } /* bar */ .mainheadernav01_link:hover:before, .mainheadernav01_link:focus:before, .mainheadernav01_link:active:before, .mainheadernav01_link.\:current:before{ content: ""; position:absolute; width: 15px; height: 1px; background-color: #FFFFFF; bottom: 0; } /* nav */ #mainheadernav02_list { position: absolute; z-index: 2; bottom: 30px; right: 40px; white-space: nowrap; font-size: 13px; font-weight: 300; color: #FFFFFF; text-transform: uppercase; } .mainheadernav02_item { display: inline-block; margin-left: 28px; position: relative; } .mainheadernav02_item ~ .mainheadernav02_item::after { content: " "; position: absolute; top: -2px; left: -14px; width: 1px; height: 30px; background-color: rgba(255, 255, 255, 0.2); } .mainheadernav02_link { display: inline-block; padding: 5px 0; color: inherit; text-decoration: none !important; } /* FF */ _:-moz-tree-row(hover), html:not(.mac) html:not(.mac) .mainheadernav01_link { padding-top: 6px; padding-bottom: 4px; } /* effect/current */ .mainheadernav02_link:hover, .mainheadernav02_link:focus, .mainheadernav02_link:active, .mainheadernav02_link.\:current { } /* bar */ .mainheadernav02_link:hover:before, .mainheadernav02_link:focus:before, .mainheadernav02_link:active:before, .mainheadernav02_link.\:current:before{ content: ""; position:absolute; width: 15px; height: 1px; background-color: #FFFFFF; bottom: 0; } /* lang */ #mainheaderlang { position: absolute; z-index: 2; top: 18px; right: 40px; } #mainheaderlang_list { white-space: nowrap; font-size: 13px; font-weight: 400; color: #FFFFFF/*#404040*/; text-transform: uppercase; } .mainheaderlang_item { display: inline-block; margin-left: 20px; position: relative; } .mainheaderlang_item:last-of-type::before { content: " "; position: absolute; top: 0px; left: -10px; width: 1px; height: 30px; background-color: rgba(255, 255, 255, 0.2); } .mainheaderlang_link { color: inherit; text-decoration: none !important; } .mainheaderlang_link > abbr { cursor: pointer; } /* effect/current */ .mainheaderlang_link:hover, .mainheaderlang_link:focus, .mainheaderlang_link:active, .mainheaderlang_link.\:current { color: #FFFFFF; } /* call */ /*#mainheadercall01 { right: 122px; }*/ #mainheadercall01 { position: absolute; z-index: 2; top: 18px; right: 122px; white-space: nowrap; font-size: 13px; font-weight: 400; color: #ea516b; text-transform: uppercase; text-decoration: none !important; } /* icon */ #mainheadercall01:before { vertical-align: top; margin-right: 12px; } /* effect */ #mainheadercall01:hover, #mainheadercall01:focus, #mainheadercall01:active { color: #ffffff; } #mainheadercall01:hover:before, #mainheadercall01:focus:before, #mainheadercall01:active:before { background-position: 0 -115px; } /* fixed */ #mainheader.\:fixed { position: fixed; background-color: #AA9D70; color: #fff; top: -70px; -webkit-transition: 200ms -webkit-transform; -ms-transition: 200ms transform; transition: 200ms transform; -webkit-transform: translateY( 70px ); -ms-transform: translateY( 70px ); transform: translateY( 70px ); } #mainheader.\:fixed > #mainheader_wrap { height: 60px; } /* crop logo */ #mainheader.\:fixed #mainheaderlogo { margin-top: 10px; height: 40px; width: 40px; overflow: hidden; } /* make image white */ #mainheader.\:fixed #mainheaderlogo_img { height: 40px; width: auto; max-width: none; filter: brightness(0) invert(1); /** / filter: url("data:image/svg+xml;utf8,#white"); /* Firefox 10+, Firefox on Android */ } html.ie_lt10 #mainheader.\:fixed #mainheaderlogo { background: url(../images/logo_footer.svg) 0 0 no-repeat; } html.ie_lt10 #mainheader.\:fixed #mainheaderlogo_img { visibility: hidden; } /* move nav down */ #mainheader.\:fixed #mainheadernav01_list, #mainheader.\:fixed #mainheadernav02_list { bottom: 16px; } /* change nav colors */ #mainheader.\:fixed .mainheadernav01_link { background-color: #AA9D70; border-color: #fff; color: #fff; } /* effect/current */ #mainheader.\:fixed .mainheadernav01_link:hover, #mainheader.\:fixed .mainheadernav01_link:focus, #mainheader.\:fixed .mainheadernav01_link:active, #mainheader.\:fixed .mainheadernav01_link.\:current { background-color: #fff; color: #AA9D70; } /* change nav colors */ #mainheader.\:fixed .mainheadernav02_link { color: #fff; } /* effect/current */ #mainheader.\:fixed .mainheadernav02_link:hover, #mainheader.\:fixed .mainheadernav02_link:focus, #mainheader.\:fixed .mainheadernav02_link:active, #mainheader.\:fixed .mainheadernav02_link.\:current { color: #404040; } /* remove these elements */ #mainheader.\:fixed #mainheadercall01, #mainheader.\:fixed #mainheaderlang { display: none; } /* change color */ #mainheader.\:fixed #mainheadercall01 { color: #fff; } #mainheader.\:fixed #mainheadercall01:hover, #mainheader.\:fixed #mainheadercall01:active, #mainheader.\:fixed #mainheadercall01:focus, #mainheader.\:fixed #mainheadercall01.\:current { color: #404040; } /* adapt icon */ #mainheader.\:fixed #mainheadercall01:before { background-position: 0 -130px; } /* use phone1_clf */ #mainheader.\:fixed #mainheadercall01:hover:before, #mainheader.\:fixed #mainheadercall01:active:before, #mainheader.\:fixed #mainheadercall01:focus:before, #mainheader.\:fixed #mainheadercall01.\:current:before { background-position: 0 -100px; } /* use phone1_cl2 */ /* change color */ #mainheader.\:fixed .mainheaderlang_link { color: #fff; } /* effect/current */ #mainheader.\:fixed .mainheaderlang_link:hover, #mainheader.\:fixed .mainheaderlang_link:focus, #mainheader.\:fixed .mainheaderlang_link:active, #mainheader.\:fixed .mainheaderlang_link.\:current { color: #404040; } article {display: grid; } /** content **/ #maincontent { /*display: inline-block;*/ width: 100%; margin-top: 136px; } /* avoid margin merge on content */ /** footer **/ #mainfooter {} #mainfooter_wrap { position: relative; height: 200px; max-width: 1280px; margin: auto; } #mainfooteradr { font-weight: 400; } #mainfooteradr a { color: #ea516b; } #mainfooteradr a:hover { color: #ffffff; text-decoration: none; } #mainfooteradrlogo { position: absolute; top: 50px; left: 100px; z-index: 3; } #mainfooteradrlogo_img {} #mainfooter_list { position: absolute; top: 50px; left: 300px; z-index: 3; display: flex; font-size: 14px; } .mainfooter_list_item { position: relative; top: 20px; } .mainfooter_list_item::before { position: absolute; content: ""; top: -20px; left: 0; width: 48px; height: 1px; background-color: #FFFFFF; } .mainfooter_list_item ~ .mainfooter_list_item { margin-left: 190px; } #mainfootersocial_list { display: inline-flex; } .mainfootersocial_item ~ .mainfootersocial_item { margin-left: 30px; } .mainfootersocial_item_label { display: none; } /* nav */ #mainfooternav { position: absolute; bottom: 30px; right: 36px; z-index: 3; font-size: 13px; } #mainfooternav_list { display: inline-flex; } .mainfooternav_item {} .mainfooternav_item ~ .mainfooternav_item { margin-left: 22px; } .mainfooternav_item + .mainfooternav_item:before {} .mainfooternav_link {} /* hover */ .mainfooternav_link:hover {} /* active/focus */ .mainfooternav_link:focus, .mainfooternav_link:active {} /* current */ .mainfooternav_link.\:current {} /* signature */ #mainfootersignature {} /** cookie shit **/ /* default display */ #maincookie { position: fixed; z-index: 20; bottom: 0; left: 0; width: 100%; background-color: #fff; background-color: rgba(255,255,255,.7); } #maincookie_text { position: relative; margin: 10px 50px; padding-right: 30px; } /* with JS */ html.js #maincookie { display: none; } /* by default hide */ /* added in JS */ #maincookie_trigger { position: absolute; top: 50%; right: 0; font-size: 28px; margin-top: -19px; cursor: pointer; } #maincookie_trigger:before { font-family: arial, sans-serif; content: "\00D7"; } /** standard layout **/ #standardlayout {} #standardheader {} /* banner */ #standardbanner { position: relative; z-index: auto; height: 310px; } body.sfmod_home.sfact_index #standardbanner { height: 420px; } #standardbanner_list { position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 1; } .standardbanner_item { position: relative; margin: 0; height: 100%; overflow: hidden; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; background-blend-mode: multiply; } .standardbanner_item:after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 2; opacity: 0.5; /* IE 6-10 */ opacity: 0.8\9; } /* IE 11 */ *::-ms-backdrop, .standardbanner_item:after { opacity: 0.8; } /* Edge */ _:-ms-lang(x), _:-webkit-full-screen, .standardbanner_item:after { opacity: 0.8; } .standardbanner_itemimg { visibility: hidden; width: 100%; } .standardbanner_itembox { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 3; } .standardbanner_itemboxtable { display: table; width: 100%; height: 100%; max-width: 600px;} .standardbanner_itemboxcell { display: table-cell; vertical-align: middle; text-align: left; } .standardbanner_itemtitle { display: block; margin: 0 0 20px; font-size: 40px; line-height: 48px; font-weight: 200; text-align: left; color: #48565F; background-color: #ffffff; padding: 10px 0 0 8px; } .standardbanner_itemtext { font-size: 16px; line-height: 18px; text-align: left; margin: 0; color: #48565F; background-color: #ffffff; padding: 21px 0 21px 8px; } .standardbanner_itembtn { margin: 20px 0 0; madding: 20px 10px 20px 8px !important; } .standardbanner_itemlink { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 4; } .standardsection { margin-bottom: 28px; } .standardsection_title {} #standardfooter {} /** Header **/ #mainheader_wrap{padding: 0 40px;} #menu-top{ position: absolute; top: 13px; right: 0px; display:inline-flex; margin-right:40px; } #menu-top #menu-tel {color:#ea516b; padding:8px 15px; font-size:14px; font-weight:bold;} #menu-top #menu-tel:hover {color:#FFF; text-decoration:none;} #menu-top li a {font-size: 13px; font-weight:400;} #menu-princip{position: absolute; bottom: 25px; right: 0px; display:flex; border-top:1px solid rgba(255, 255, 255, 0.2); padding-top:20px; width: calc( 100% - 225px - 40px ); justify-content: space-between; margin-right:40px;} .header { background-color: #314e6b; box-shadow: 1px 1px 4px 0 rgba(0,0,0,.1); /*position: fixed;*/ width: 100%; z-index: 100; } .header #logo img{ position:absolute; bottom:17px; } .header ul { margin: 0; padding: 0; list-style: none; overflow: hidden; background-color: #314e6b; } .header li a { display: block; /* padding: 20px 20px;*/ padding:8px 0px; /*border-right: 1px solid #f4f4f4;*/ color:#fff; text-transform:uppercase; font-weight:500; text-decoration: none; } .header .logo { display: block; float: left; font-size: 2em; padding: 10px 20px; text-decoration: none; } #menu-societe li a{ font-size: 13px; font-weight: 300; } .header #menu-princip li a:hover:before, .header #menu-princip li a:focus:before, .header #menu-princip li a:active:before, .header #menu-princip li a.\:current:before{ content: ""; position: absolute; width: 15px; height: 1px; background-color: #FFFFFF; bottom: 0; } input[type="checkbox"].menu-btn + label:before, input[type="checkbox"].menu-btn + label:after, input[type="checkbox"].menu-btn + label:hover:before{ background-color:transparent; box-shadow:none; border:0px; } /* menu */ .header .menu { clear: both; max-height: 0; transition: max-height .2s ease-out; } /* menu icon */ .header .menu-icon { cursor: pointer; display: inline-block; float: right; padding: 28px 20px; position: relative; user-select: none; margin-top:30px; padding-bottom:0px; } .header .menu-icon .navicon { background: #fff; display: block; height: 2px; position: relative; transition: background .2s ease-out; width: 30px; } .header .menu-icon .navicon:before, .header .menu-icon .navicon:after { background: #fff; content: ''; display: block; height: 100%; position: absolute; transition: all .2s ease-out; width: 100%; } .header .menu-icon .navicon:before { top: 8px; } .header .menu-icon .navicon:after { top: -8px; } /* menu btn */ .header .menu-btn { display: none; } .header .menu-btn:checked ~ .menu { max-height: 240px; } .header .menu-btn:checked ~ .menu-icon .navicon { background: transparent; } .header .menu-btn:checked ~ .menu-icon .navicon:before { transform: rotate(-45deg); } .header .menu-btn:checked ~ .menu-icon .navicon:after { transform: rotate(45deg); } .header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before, .header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after { top: 0; } /** home layout **/ #homelayout {} #homeheader { position: relative; margin-bottom: 25px; max-width: 1280px; margin: auto; } #homeheader_banner {} .flexslider_banner {} .flexslider_banner_navigation { position: absolute; bottom: -30px; right: 77px; z-index: 2; } .flexslider_banner_navigation a { margin-left: 28px; } .homesection {} .homesection_title {} #homefooter {} .btn-projet{display: block; margin-top: 70px; margin-bottom: 50px;} /** key numbers **/ #keynumberssection { background-color: #314e6b; padding-top: 15px; padding-bottom: 96px; } #keynumberssection_list { display: flex; flex-flow: wrap; justify-content: space-between; list-style-type: none; margin: 0; padding: 45px 0 0 0; } .keynumberssection_list_item { max-width: 230px; text-align: center; } .keynumberssection_list_item_number { font-size: 40px; font-weight: 500; color: #ea516b; } .keynumberssection_list_item_sub { font-size: 28px; color: #FFFFFF; } .keynumberssection_list_item_desc { font-size: 14px; color: #FFFFFF; padding-top: 27px; } /** slider **/ .flexslider { margin: 0; border: 0; } .flex-prev {} .flex-next {} /* Flexslider theming */ .flexslider { margin: 0; border: none; background-color: transparent; } .flexslider .flex-direction-nav { height: 0; } .flexslider .flex-direction-nav a { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; opacity: 1; top: 0; margin: 0; width: 15%; height: 100%; color: transparent; } .flexslider .flex-direction-nav .flex-next, .flexslider .flex-direction-nav .flex-next:hover, .flexslider:hover .flex-direction-nav .flex-next { right: 0; opacity: 1; } .flexslider .flex-direction-nav .flex-prev, .flexslider .flex-direction-nav .flex-prev:hover, .flexslider:hover .flex-direction-nav .flex-prev { left: 0; opacity: 1; } .flex-prev:hover, .flex-next:hover { text-decoration: none; } /* bug étrange */ .flex-direction-nav a.flex-next:before, .flex-direction-nav a.flex-prev:before { position: absolute; top: calc(50% - 16px); display: inline-block; content: ""; width: 32px; height: 32px; } .flex-direction-nav a.flex-next:before { right: 16px; background: url("icons/svg/icon-arrow-right-rounded-default.svg") no-repeat scroll center center / 100% auto rgba(0, 0, 0, 0); } .flex-direction-nav a.flex-prev:before { left: 16px; background: url("icons/svg/icon-arrow-left-rounded-default.svg") no-repeat scroll center center / 100% auto rgba(0, 0, 0, 0); } .flex-direction-nav a:before, .flex-pauseplay a:before { font-family: inherit; } .flexslider .slides img { width: auto; margin: auto; } /* Products */ .naviguation { display: flex; justify-content: space-between; flex-wrap: wrap; margin-bottom: 10px; } .naviguation a { line-height: 46px; padding: 14px 24px; font-size: 16px; text-decoration: none; } .naviguation a.btnback { background: url("icons/svg/icon-arrow-black.svg") no-repeat scroll 0 center; } .naviguation a.print { background: url("icons/svg/icon-print.svg") no-repeat scroll 0 center; } .naviguation a.sendbymail { background: url("icons/svg/icon-mail.svg") no-repeat scroll 0 center; } .naviguation a.share { background: url("icons/svg/icon-share.svg") no-repeat scroll 0 center; } .naviguation h2 { margin: 0; } #product { padding-top: 10px; } #product .main { display: flex; flex-wrap: wrap; margin-bottom: 16px; background-color: #fff; box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.05); } #productcarousel { width: 680px; /*height: 510px;*/ height:auto; ;} #productcarousel .slides img { cursor: pointer; max-height: 510px; width: auto; margin: auto; } .ui-dialog .ui-dialog-content.productcarouselpopup { overflow: hidden; } .ui-dialog .ui-dialog-content.productcarouselpopup ul li { margin-right: 0 !important; } #product .maincard { position: relative; width: 400px; } #product .maincardtop { padding: 24px 32px 0 32px; } #product .maincardtop hr { margin: 20px 0; } #product .favorite { left: -27px; top: 16px; box-shadow: -8px 0 8px 0 rgba(0, 0, 0, 0.15); } #product .price { font-size: 24px; font-weight: bold; } #product .info_wrapper { display: flex; justify-content: space-between; border-bottom: 1px solid #f4f4f4; padding: 8px 0; } #product .infotext { font-size: 14px; } #product .infoimg img { max-height: 32px; height: auto; max-width: 56px; width: auto; } #product .type { padding: 18px 0 3px; font-size: 24px; font-weight: bold; } #product .city { font-size: 16px; } #product .reference { padding-bottom: 21px; font-size: 12px; opacity: .5; } #product .picto_wrapper, .productslist_item .picto_wrapper { display: flex; justify-content: flex-start; flex-wrap: wrap; } #product .picto { width: 82px; line-height: 16px; margin: 0 4px 4px 0; padding: 12px 13px 5px 13px; vertical-align: middle; text-align: center; background-color: #f8f8fb; border-radius: 1px; font-size: 16px; display: flex; flex-direction: column; text-align: center; } .productslist_item .picto { width: 82px; line-height: 16px; margin: 0 4px 4px 0; padding: 12px 13px 5px 13px; vertical-align: middle; text-align: center; background-color: #f8f8fb; border-radius: 1px; font-size: 16px; } #product .picto img, .productslist_item .picto img { padding-bottom: 7px; } #product .picto_text { height: 32px; font-size: 14px; } #product .maincardtop .maincardtop_cta { bottom: 32px; left: 0; right: 0; text-align: center; margin-bottom: 10px;} #product .maincardtop .maincardtop_cta_text { font-size: 18px; color: #ea516b; font-weight: bold; margin-bottom: 20px; } #product .maincardtop .maincardtop_cta_button { font-size: 13px; width: 200px; padding: 12px 32px; color: #FFFFFF; background-color: #ea516b; text-transform: uppercase; font-weight:bold; letter-spacing:0.05em; } #product .maincardtop .maincardtop_cta_button:hover { background-color: #314e6b; text-decoration: none; cursor: pointer; } #product .maincardbottom { border-top: 1px solid #f4f4f4; } #product .maincardbottom .agency_wrapper { position: relative; display: flex; justify-content: space-between; min-height: 72px; padding: 8px 0; } #product .maincardbottom .agency_wrapper > div { min-width: 155px; } #product .maincardbottom .agencylogo { position: absolute; top: -15px; left: 32px; border-radius: 2px; box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.05); border: solid 1px rgba(151, 151, 151, 0.19); } #product .maincardbottom .agencylogo img { max-height: 88px; height: auto; max-width: 120px; width: auto; } #product .maincardbottom .agency { width: 210px; font-size: 16px; } #product .maincardbottom .agencyname { font-family: 'euclid_circular_abold'; font-weight: bold; font-size: 16px; } #product .maincardbottom .agencytype { font-size: 16px; } #product .maincardbottom .cardbuttons { display: flex; justify-content: space-between; flex-wrap: wrap; padding: 0 32px 24px 32px; } #product .maincardbottom .cardbuttons a.btn { padding: 14px 10px; } #product .maincardbottom .cardbuttons button.secondary { padding: 12px 10px; margin-bottom: 8px; } #product #productcarouselthumbnails { height: 112px; margin-bottom: 64px; } #product #productcarouselthumbnails .slides li { position: relative; height: 126px; width: 168px; border: solid 1px #ebeaf3; background-color: #fff; cursor: pointer; } #product #productcarouselthumbnails .slides img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: auto; max-height: 126px; width: auto; max-width: 168px; margin: auto; } #product #productcarouselthumbnails.flexslider li.flex-active-slide { box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.05); } #product #productcarouselthumbnails.flexslider .flex-direction-nav a { top: 50%; margin: 0; width: 32px; height: 32px; } #product #productcarouselthumbnails .flex-direction-nav a.flex-prev { left: 16px; } #product #productcarouselthumbnails .flex-direction-nav a.flex-next { right: 16px; } #product #productcarouselthumbnails .flex-direction-nav a.flex-prev:before, #product #productcarouselthumbnails .flex-direction-nav a.flex-next:before { right: 0; left: 0; } #product .maindetail { display: flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: 64px; border-radius: 1px; background-color: #ffffff; } #product .maindetail .block { width: 49%; min-width: 270px; margin-bottom: 36px; } #product .maindetail .title { font-size: 20px; font-weight: bold; color: #ea516b; padding: 16px 0; } #product .maindetail .column2 { text-align: right; white-space: nowrap; } #product .maindetail .energyicon { padding: 7px 0px; } #product .maindetail .icon { margin: 0 10px 7px 0; } #product .maindetail .ui-widget-header { background: #314e6b; } #product .maindescription { margin-bottom: 64px; background-color: #ffffff; font-size: 16px; line-height: 24px; } #product .maindescription .textgradient { height: 250px; overflow: hidden; position: relative; /*background: rgba(33,33,33,1);*/ /*background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0.5) 100%);*/ /*background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0.5) 100%);*/ /*background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,0.5) 100%);*/ /*color:rgba(0,0,0,0);*/ /*-webkit-background-clip: text;*/ /*-webkit-text-fill-color:rgba(0,0,0,0);*/ } #product .maindescription .textgradient:before { content:''; width:100%; height:100%; position:absolute; left:0; top:0; background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0.5) 100%); background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0.5) 100%); background: linear-gradient(to top, rgba(255,255,255,1) 0%, rgba(255,255,255,0.5) 100%); } #product .mainavailableproduct { margin-bottom: 64px; background-color: #ffffff; font-size: 16px; line-height: 24px; } #product .mainavailableproduct .datatable { background-color: #F3F3F3; } #product .mainavailableproduct .datatable thead { background: #ea516b; color: white; } #product .mainmap { height: 496px; margin-bottom: 64px; } .maincontact { display: flex; justify-content: space-between; flex-wrap: wrap; } .maincontact.left { justify-content: flex-start; } .maincontact .form { max-width: 664px; padding: 32px 0 32px 24px; margin-bottom: 16px; background-color: #ffffff; box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.05); } .maincontact .form textarea { width: 100%; height: 104px; } .maincontact .form input[type=text] { width: 100%; } .maincontact .form h3 { margin: 0; } .maincontact .form_wrapper { display: flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: 8px; } .maincontact .form_wrapper .itemhalf { width: calc(50% - 24px); margin: 0 24px 16px 0; } #product .maincontact .form_wrapper .itemhalf { min-width: 200px; } #agency .maincontact .form_wrapper .itemhalf { min-width: 100px; } .maincontact .form_wrapper .itemfull { width: calc(100% - 24px); margin: 0 24px 16px 0; } #product .maincontact .agency { width: 304px; padding: 32px 24px; align-self: flex-start; background-color: #ffffff; box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.05); font-size: 16px; } #product .maincontact .agencylogo { position: relative; height: 113px; width: 129px; border-radius: 2px; box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.05); border: solid 1px rgba(151, 151, 151, 0.19); } #product .maincontact .agencylogo img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: auto; max-height: 113px; width: auto; max-width: 129px; margin: auto; } #product .maincontact .agencyname { margin: 13px 0 0; line-height: 24px; font-family: 'euclid_circular_abold'; font-weight: bold; } #product .maincontact .agencytype { margin: 0 0 10px; line-height: 24px; } #product .maincontact .links { margin: 12px 0; line-height: 24px; } #product .footernavig { margin-bottom: 80px; padding: 40px; background-color: #fff; text-align: center; box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.05);} a.arrow-down-left, a.arrow-up-left { color: #ea516b; text-decoration: none; cursor: pointer; } /* Table */ .table { display: table; width: 100%; font-size: 16px; } .table .footer { display: table-footer-group; } .table .row { display: table-row; -moz-transition: opacity .3s; -webkit-transition: opacity .3s; transition: opacity .3s; } .table .cell { display: table-cell; padding: 16px 0; border-top: solid 1px #ebeaf3; } .table .cell.right { text-align: right; } th, td{padding:15px 10px;} .datatable { width: 100%; text-align: left; } .fixed-table-loading { display: none; } .datatable thead { border-bottom: 2px solid #f8f8fb; } .datatable th { position: relative; text-align: center; } .datatable th:focus { outline: none; } .datatable th div span { display: inline-block; content: ""; width: 12px; height: 14px; vertical-align: middle; margin-bottom: 5px; background: url("icons/svg/icon-arrow-down.svg") no-repeat scroll center center / 100% auto rgba(0, 0, 0, 0); } .datatable th div.desc span { background: url("icons/svg/icon-arrow-down-active.svg") no-repeat scroll center center / 100% auto rgba(0, 0, 0, 0); -moz-transition: transform .5s; -webkit-transition: transform .5s; transition: transform .5s; } .datatable th div.asc span { background: url("icons/svg/icon-arrow-down-active.svg") no-repeat scroll center center / 100% auto rgba(0, 0, 0, 0); -webkit-transform: rotate(-180deg); transform: rotate(-180deg); -moz-transition: transform .5s; -webkit-transition: transform .5s; transition: transform .5s; } .datatable td { line-height: 54px; text-align: center; } .datatable th:nth-of-type(1), .datatable th:nth-of-type(2), .datatable th:nth-of-type(3), .datatable td:nth-of-type(1), .datatable td:nth-of-type(2), .datatable td:nth-of-type(3) { text-align: left; } /*.datatable tr:nth-child(even) { background-color: #f8f8fb; }*/ .datatable tbody tr:hover { background-color: #f5c3cc; } .datatable tr td{line-height:1.2em;} .datatable tr td:last-child { color: #ea516b; font-weight: bold; } #map { width:100%; height: 500px; z-index: 1; } .map_nav { position: absolute; top: 10px; left: 10px; z-index: 2; } .toggle-layer { display: block; color: red; } .toggle-layer.active { color: green; } #marker { background-image: url('icons/svg/icon-map-pin.svg'); background-size: cover; width: 50px; height: 50px; cursor: pointer; } .mapboxgl-popup { max-width: 300px; } /* JQuery modal */ .ui-dialog { z-index: 9999; } .ui-dialog, .ui-widget, .ui-widget-content { border: none; border-radius: 0; } .ui-dialog .ui-widget-header { border: none; background: none; color: transparent; } .ui-dialog-title { font-size: 24px; font-weight: 500; color: #302783; } .ui-dialog .ui-dialog-titlebar { margin-bottom: 12px; } .ui-dialog .ui-dialog-titlebar-close { width: 38px; height: 40px; padding-right: 16px; right: 1em; border: none; border-radius: 1px; background-color: #f3f2f8; text-indent: 0; } .ui-dialog .ui-icon.ui-icon-closethick { left: auto; right: 10px; background: url("icons/svg/icon-close-black.svg") no-repeat scroll 0 0; } .ui-dialog .ui-icon.ui-icon-closethick:focus { background: url("icons/svg/icon-close-black.svg") no-repeat scroll 0 0; } /*** MEDIA QUERIES ------------- ***/ @media screen and (max-width: 1340px) { .home_content{margin-bottom:0} .homesection_title > br {display: none;} .content_wrapper {padding:0 30px;} #mainheaderlang { right: 30px; } .content_wrapper.contact {padding:40px 30px;} #productcarousel{width:59%; } #product .maincard{width:39%;} } @media screen and (max-width: 1150px) { .list_properties_item_options{height:auto} .list_properties_item_desc{display:none} section{padding-left:40px; padding-right:40px;} .wrap{max-width:100%; padding-left:40px; padding-right:40px;} .wrap section, .wrap section .wrap, .sfmod_home section.wrap .wrap{padding-left:0px; padding-right:0px;} .ui-widget.ui-widget-content{width:90%;} } @media screen and (max-width: 1109px) { #product .maincardtop .maincardtop_cta{position:relative; margin-bottom:40px; bottom:0px;} } @media screen and (max-width: 1000px) { .content_gallery > .flex-direction-nav{width:100%; left:0} } @media screen and (max-width: 900px) { #productcarousel{width:55% !important;} #product .maincard{width:45% !important;} #main{display:flex;} body{font-size:14px} #mainheadernav_list{font-size:16px} #mainheaderlang_list{font-size:12px} .homesection_title{font-size:24px} .home_content > h2{font-size:20px} .list_properties_item_slider{width:50%} .sfmod_home.sfact_index .list_properties_item_options{display:flex} .sfmod_home.sfact_index .list_properties_item_option {line-height:22px; flex:1;width:50%; padding:5px !important; width:50%} .list_properties_item_more {margin-left:-100%} .home_about_pic{max-width:100%} .about_pic{max-width:100%} } @media screen and (max-width: 800px) { #product .picto{flex: 1; width: 33.333333%;} #product .picto:last-of-type{margin-right:0px;} article#product{display:block;} #mainheadernav{clear:both; margin:15px 0} .med-hidden { display: none; } /* .home_people {display:none}*/ /*.list_properties_item_column{min-height:370px}*/ .mainfooter_list_item{width:49%} .pseudo_header {background-size:110%;} #productcarousel, #product .maincard{width:100% !important; height:auto; max-width:100% !important;} #product .maincard{width:100%; height:auto;padding-bottom:40px; order:1; box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.05);border-top: 1px solid #f7f7f7;} #product .maincardtop .maincardtop_cta {position: relative;bottom: unset; margin-top:40px; margin-bottom:10px;} #productcarousel{order:2;} #product .main{box-shadow:none;} .ui-widget.ui-widget-content{width:100%;} .list_properties_item_more{font-size:14px;} .btn-projet{text-align:center;} } @media (min-width: 768px) { .header li { float: left; } /*.header li a { padding: 20px 30px; }*/ .header .menu { clear: none; float: right; max-height: none; } .header .menu-icon { display: none; } } @media (max-width: 767px) { input[type="checkbox"].menu-btn:checked + label:before, input[type="checkbox"].menu-btn:checked + label:after {background-color:transparent;} #menu-princip{border-top:0px solid rgba(255, 255, 255, 0.2); padding-top:0px; width: 100% !important; left: 0px; text-align: center;flex-direction: column; position: fixed; top: 100px; align-content: flex-start;} .list_properties_item_column{min-height:200px !important;} .list_properties_item_more{margin-left:0px;} #mainheader_wrap{height:100px;} #maincontent{margin-top:100px;} .header .menu-icon{bottom: 0px; position: absolute; right: 25px; padding:15px; padding-bottom:0px} .header #logo img{bottom:15px;} #menu-societe{top: 0; bottom: 40px; margin-bottom: 40px;} #menu-projet{ padding-top: 30px; bottom: 0;border-top:1px solid rgba(255, 255, 255, 0.2);} .mainheadernav01_item, .mainheadernav02_item{margin:0px; display:block;} .mainheadernav02_item ~ .mainheadernav02_item::after{display:none;} .header #menu-princip li a{font-size:1.4em;} .header #menu-princip li a:hover:before, .header #menu-princip li a:focus:before, .header #menu-princip li a:active:before, .header #menu-princip li a.\:current:before{display:none;} .list_properties_item_slider, .list_properties_item_text{width:100% !important;} .list_properties_item, .list_properties_item .list_properties_item_slider, .list_properties_item .list_properties_item_slider>.list_properties_item_slider_slides{display:block;} .sfmod_property.sfact_index .list_properties_item_option{width:50%; flex:inherit;} .sfmod_property.sfact_index .list_properties_item_option:nth-of-type(2n){flex:1; margin-left:8px !important;} .sfmod_property.sfact_index .list_properties_item_options{display:flex;} } @media screen and (min-width: 701px){ .list_properties_item, .list_properties_item .list_properties_item_slider, .list_properties_item .list_properties_item_slider>.list_properties_item_slider_slides{ height:100%; } } @media screen and (max-width: 700px) { .contact_gallery_container {display:none} .contact_gallery_container.ct {display:none} .home_about_text_holder{width:100%; top:auto;right:auto;position:relative} .about_text_holder{width:100%; top:auto;left:auto;position:relative} .about{margin-top:-40px} .two_col > div, .sfmod_property.sfact_inprogress .list_properties_link, .sfmod_property.sfact_inprogress .list_properties_item_slider_slides {width:100%} .two_col > div{padding:0 !important} .list_properties_item_slider{width:100%;float:none} .list_properties_item_more {margin-left:0} .list_properties_item_column{min-height:0} .pseudo_header {background-image:none !important;background-color:#283963 !important;} .pseudo_header h1 {color:#fff;} #product .picto{flex: 1;} #product .picto:last-of-type{margin-right:0px;} .indent{padding-left:40px;} .keynumberssection_list_item{width:100% !important; max-width:100% !important; text-align:center !important;} .list_properties_link .list_properties_item_more{margin-top:15px;} } @media screen and (max-width: 580px){ .list_properties_item_option{width:100% !important; flex:inherit;} .sfmod_property.sfact_index .list_properties_item_option:nth-of-type(2n){flex:1; margin-left:0px !important;} .sfmod_property.sfact_index .list_properties_item_options{display:block;} #product .picto{flex-basis: auto; width: 100%;} #product .picto{margin-right:0px;} } @media screen and (max-width: 550px) { .sm-hidden { display: none; } #mainheadernav {width:100%} #mainheadernav_list{font-size:14px;display:flex;flex-wrap:wrap;justify-content:space-between} .mainheadernav_item{width:50%;margin:5px 0} .three_col > div{width:100%} .mainfooter_list_item{width:60%; padding-right:5%;} .mainfooter_list_item:last-of-type, .mainfooter_list_item:last-child {width:35%;} #mainfooter_list{ left: 35% !important; width: 65% !important;} #mainfooteradrlogo{width:25% !important;} .sfmod_home.sfact_index .list_properties_item_options{display:block} .sfmod_home.sfact_index .list_properties_item_option {line-height:22px; flex:auto;width:100%; margin:5px 0!important;padding:5px !important} } @media screen and (max-width: 500px) { #mainheadernav_list{font-size:14px;display:flex;flex-wrap:wrap;justify-content:space-between} .mainheadernav_item{width:50%;margin:5px 0} .homesection_title{font-size:18px} .home_content > h2{font-size:16px} .footerlogo{display:none} #mainfooter {padding-bottom: 30px;} /*#mainfooter_list{width:100%}*/ .mainfooter_list_item{width:100%} #product .picto_wrapper, .productslist_item .picto_wrapper{display:block !important;} #product .picto{flex: 1 100% !important; margin-right:0px;} } @media screen and (max-width: 400px) { #product .picto{width:100%; margin-right:0px;} .indent{padding-left:0px;} } /* for screen bigger than 1600px */ @media screen and (min-width: 1600px) { } /* for screen smaller than 960px */ @media screen and (max-width: 960px) { } @media screen and (max-width: 1100px) { /* Header */ #mainheadernav_list { width: 100%; left: 0; } /*#mainheaderlogo { margin-left: 16px; }*/ .maincontent { /*width: auto;*/ margin: 120px 16px 0; } .mainfooternav_wrapper { margin: 0 16px; } /* Agencies */ .agencymenu .certification { right: 16px; } /* Home */ #blocsofblocs_wrapper { display: flex; flex-wrap: wrap; height: auto; /* padding-bottom: 65px;*/ } .blocofblocs { position: relative; /*background-color: #fff;*/ } .gotolink { padding: 18px 16px; } .blocofblocs1 { top: auto; height: auto; width: 352px; margin: 0 16px 16px 0; } .blocofblocs2 { top: auto; left: auto; height: auto; width: 448px; margin: 0 16px 16px 0; } .blocofblocs3 { top: auto; left: auto; height: auto; width: 256px; margin: 0 16px 16px 0; } .blocofblocs4 { top: auto; left: auto; height: auto; width: 256px; margin: 0 16px 16px 0; } .blocofblocs5 { top: auto; left: auto; height: auto; width: 448px; margin: 0 16px 16px 0; } .whoarewe_container { margin: 0 16px; } .whoarewe_half .whoarewe_bubble { display: none; } /* Account */ .account_wraper { margin-left: 16px; margin-right: 16px; } } @media screen and (max-width: 1024px) { /* Header */ #mainheadernav_wrapper .title { display: none; } /* Home */ .searchbox_wrapper { flex-direction: column; } .searchbox_wrapper .col2 { text-align: center; } .searchbox { width: 315px; } .searchbox input.search { width: 295px; } .searchbox button { float: none; } .homesearchbox { top: 50%; z-index: 1; } .searchbox_wrapper .tagify { width: 285px; } #keynumberssection_list{margin-left:-50px; margin-right:-50px;} /* Footer */ #secondaryfooternav .title { font-size: 14px; } /* Product list */ #productlistlayoutbtns { display: none; } .productsmenu .elements { width: 440px; } .productslist .large_item { display: none; } .productslist li.productslist_item { margin: 0 auto 20px auto; } .productslist.columnlayout .productslist_item .price { padding: 8px 24px; -moz-transition: padding 0.3s; -webkit-transition: padding 0.3s; transition: padding 0.3s; } .productslist.columnlayout .productslist_item .type { padding: 8px 24px 2px; -moz-transition: padding 0.3s; -webkit-transition: padding 0.3s; transition: padding 0.3s; } .productslist.columnlayout .productslist_item .detail { padding: 18px 24px; -moz-transition: padding 0.3s; -webkit-transition: padding 0.3s; transition: padding 0.3s; } .productslist.columnlayout .productslist_item .relevance { padding: 0 24px 16px; -moz-transition: padding 0.3s; -webkit-transition: padding 0.3s; transition: padding 0.3s; } .productslist.columnlayout .productslist_item .cardnavig { height: 48px; -moz-transition: height 0.3s; -webkit-transition: height 0.3s; transition: height 0.3s; } /* Product detail */ #productcarousel { width: 61%; height: auto; max-width: 682px; } #product .favorite { left: auto; right: 16px; top: -16px; } #product .maincardtop{padding:10px 25px 0px 25px;} #product .maincardtop hr{margin:15px 0px;} } @media screen and (max-width: 991px) { #keynumberssection_list{margin-left:0px; margin-right:0px; flex-wrap: wrap;} .keynumberssection_list_item{width:50%; max-width:50%; text-align:left;} .keynumberssection_list_item_desc{padding-top:10px; font-size:16px;} .keynumberssection_list_item{margin-bottom:40px;} #keynumberssection{padding-bottom:55px;} /*#menu-princip{width: calc( 100% - 235px) !important;}*/ } @media screen and (max-width: 800px) { /*#mainheader_wrap{height:110px;}*/ #mainfooter{padding-left:40px;} /*#mainheaderlogo { position: initial; }*/ #mainheadernav01_list { /*position: initial;*/ padding-left: 5px; bottom:16px; } .mainheadernav01_item { margin-right: 20px; } #mainheadernav02_list { bottom: unset; /*top: 50px; right: 5px;*/ top:12px; left:202px; } #mainheader_separator { right: 0; /*top: 38px; left: unset;*/ top:50px;} #mainheaderlang { /*right: 5px; */} .list_properties_item { box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.2);} .list_properties_item_text_wrap {border: 0px solid #F7F7F7;} .list_properties_link { text-decoration: none; } .list_properties_link .list_properties_item_more { background-color: #314e6b; color: #FFFFFF; } #keynumberssection { padding-left: 10px; padding-right: 10px; padding-bottom: 20px; } .standardsection2col_col { padding: 20px 10px 20px 10px; } /*#maincontent { padding-left: 5px; padding-right: 5px; }*/ /*#mainheadercall01 { right: 5px; }*/ #mainfooter_wrap { } #mainfooteradrlogo { top: 20px; left: 5px; } #mainfooter_list { top: 20px; left: 200px; width:50%; } #mainfooternav { bottom: 10px; right: 36px; } .mainfooter_list_item ~ .mainfooter_list_item { margin-left: 0px; } #mainheadernav{clear:both; /*margin:15px 0*/ margin:10px 0px;} .med-hidden { display: none; } /* .home_people {display:none}*/ /* .list_properties_item_column{min-height:370px}*/ .mainfooter_list_item{width:49%} .pseudo_header {background-size:110%;} .datatable tr {border-bottom:1px solid #dedede;} .datatable tr:last-of-type {border-bottom:0px solid #dedede;} } @media screen and (max-width: 540px) { /* Header */ .mainheadernav01_item { margin-right: 10px; } #mainfooter_wrap { height: 280px;} #usermenu_wrapper { display: none; } .maincontent { margin: 140px 16px 0; } #homeheader .homesearchbox { top: 50%; left: 50%; z-index: 1; } .homesearchbox { top: 430px; left: 47%; z-index: 1; } #mainheadernav_list ul { flex-direction: column; } #mainheadernav_list { padding: 27px 16px 170px; } #mainheadernav_list .mainheadernav_item { text-align: left; } /* Footer */ .mainfooternav_wrapper { justify-content: center; } #secondaryfooternav { display: none; } #mainwrap::after { height: 150px; } /* Home */ .whoarewe_wrapper { padding: 46px 0; } .whoarewe_image { display: none; } #blocsofblocs_wrapper .blocofblocs { width: 100%; } #blocsofblocs_wrapper img { width: 100%; } .blogthumbnail_half { width: 100%; } .blogthumbnail_container .text { display: none; } #product-types, #product-types .sub-type-wrapper { flex-wrap: wrap; } #product-types .type, #product-types .sub-types { width: 100%; } #product-types .sub-type { width: 49%; margin: 0 0 16px 0px; } /* Product list */ .productsmenu .elements { text-align: left; } .productsmenu .elements .filter { display: none; } .productsmenu .element { margin-left: 0; } .searchsummary { flex-wrap: wrap; } .searchsummary .buttonblock { margin-top: 16px; } #product .maincard { width: 100%; } #criteria_email { margin: 0; } /* Product detail */ .naviguation a.print, .naviguation a.sendbymail, .naviguation a.share { font-size: 0; } #productcarouselthumbnails { display: none; } #productcarousel .slides img { cursor: default; } #product .maindetail .block { width: 100%; } .sm-hidden { display: none; } #product .maincontact .form_wrapper .itemhalf { width: 100%; } /* Advanced search */ #searchmodal .columns > div { width: 100%; min-width: unset; padding-right: 0; } #searchmodal .surfaceform .formsubrow { margin-left: 0; } .headerfooterless a.close { text-indent: -9999px; background-position: 10px; padding-right: 19px;} /* Agencies */ .agencymenu .certification { display: none; } /* Agency detail */ #agency .agency_wrapper { padding-left: 16px; padding-right: 16px; } #agency .agency_wrapper .summaryblock { width: 100%; min-width: auto; padding-right: 0; } #agency .agency_wrapper .summaryblock .itemhalf { width: 100%; } #agency .agency_wrapper .contactblock { width: 100%; } /* Account */ .compare tbody tr { width: auto; } #formalert { text-align: center; } } @media screen and (max-width: 380px) { .columnlayout .productslist_item .cardnavig { width: 100%; } li.productslist_item { width: 100%; } } /*** High resolution device ---- ***/ /** resolution x2 **/ /* remove the space to test x2 icons on normal resolution */ @media /** / screen, /**/ (-webkit-min-device-pixel-ratio: 2), ( min-resolution: 192dpi), ( min-resolution: 2dppx) { } /*** CSS HACKS ----------------- ***/ /* last update 2015-05-01 */ /** /* Firefox 2+ * / x:-moz-any-link, .selector { property: value; } /* Opera 14+, Safari, Chrome, Android * / .selector:not(*:root) { property: value; } /* Safari 7+ * / @media \\0 screen { .selector { property: value; } } /* Chrome 29+, Opera 16+ * / @media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) { .selector { property: value; } } /* Chrome, Safari 3+ * / @media screen and (-webkit-min-device-pixel-ratio:0) { .selector { property: value; } } /* Safari 5+/6-, Chrome 24- * / ::x, .selector { property: value; } /* Opera 9.5+/14- * / x:-o-prefocus, .selector { property: value; } /* IE 11/10 * / @media all and (-ms-high-contrast:none) { .selector { property: value; } } /* IE 11 * / *::-ms-backdrop, .selector { property: value; } /* IE 9 (html specific) * / html.ie9 .selector { property: value; } /* IE 6-10 * / .selector { property: value\9; } /* more hacks at http://browserhacks.com *