/* Theme Name: Architecturer Child Theme URI: http://themes.themegoods.com/architecturer/dem Description: Premium Architecture & Interior Design WordPress Theme Version: 1.0 Author: ThemeGoods Author URI: https://themeforest.net/user/ThemeGoods License: GNU General Public License License URI: https://themeforest.net/licenses/regular_extended Text Domain: architecturer Template: architecturer */ /* Du demo officiel : */ /* .elementor-kit-7{--e-global-color-primary:#6ec1e4;--e-global-color-secondary:#54595f;--e-global-color-text:#7a7a7a;--e-global-color-accent:#61ce70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500} */ /* #page_caption{display:var(--page-title-display)} */ /* BASE / Espacement Espacement entre les elements. Ce code provient du demo officiel mais n'est pas dans le demo import... donc on doit l'ajouter manuellement. */ #wrapper .elementor-widget:not(:last-child) {margin-bottom:0; } /* BASE / Column widths Le theme Architecturer ajoute ce code, mais ca casse certains layouts. */ #wrapper .elementor-column.elementor-col-33, #wrapper .elementor-column[data-col="33"] { max-width: none; } /* BASE / Main wrapper adding top On dirait que Elementor (ou le theme) a de la misere a calculer le padding-top du site (j'ai l'impression que c'est supposer etre la hauteur de la topBar). On force donc la hauteur ici. */ #wrapper {padding-top: 88px !important;} /* BASE / Paragraph spacings Par default, il y a 2 paddings sur les paragraphes, c'est trop. */ #wrapper #page_content_wrapper p + p, #wrapper .page_content_wrapper p + p {padding-top: 0; } /* BASE / Simple hover color Styles hover quand c'est un lien. */ #wrapper .vivendaSimpleHoverLink a {transition: color 0.2s; } #wrapper .vivendaSimpleHoverLink a:hover {color: #e74310; } /* BASE / Buttons Ajustements sur l'icone. */ #wrapper .elementor-button-content-wrapper {align-items: center;} #wrapper .elementor-button-icon {font-size: 1.2em; } #wrapper .elementor-button-icon svg {display: block; } /* HEADER / Nav Ajuster les items de la navigation principale. Ajouter des points entre les items. */ #wrapper .navVivenda .nav { } #wrapper .navVivenda .nav > li {position:relative; } #wrapper .navVivenda .nav > li:not(:first-child)::before {font-size: 0.25em;position:absolute;z-index:0;display:block;content:"";top: 52%;height:1em;left: -13px;width:1em;transform: translate(-50%, -50%);background-color: #E74310;border-radius:50%;} #wrapper .navVivenda .nav > li > a {margin: 0;padding: 0.2em 0; transition: color 0.3s;} #wrapper .navVivenda .nav > li > a:before {display: none;} /* Active */ #wrapper .navVivenda .nav > li.current-menu-item > a {font-weight: 600;text-decoration: underline;} /* HEADER / Nav mobile Ajuster les items de la navigation principale. */ .mobile_main_nav { } /* Active */ .mobile_main_nav > li.current-menu-item > a {font-weight: 600; text-decoration: underline; } /* HEADER / Nav WPML Styles du selecteur de langue qui est dans la main nav. */ #wrapper .navVivenda .nav .menu-item-language {margin: 0 5px 0 5px;} #wrapper .navVivenda .nav li.menu-item-language::before {left: -8px;top: 37%;bottom: 37%;height: auto;width: 1px;border-radius: 0;background: #000;transform: none;} /* First lang item */ #wrapper .navVivenda .nav .menu-item-object-page + .menu-item-language {margin-left: 1.3em;} #wrapper .navVivenda .nav .menu-item-object-page + .menu-item-language::before {display:none; } /* Active lang */ #wrapper .navVivenda .nav .menu-item-language-current { } #wrapper .navVivenda .nav .menu-item-language-current a {font-weight: 600; } /* HEADER / Nav mobile WPML Styles du selecteur de langue qui est dans la main nav mobile. */ .mobile_main_nav .menu-item-language { } /* First lang item */ .mobile_main_nav .menu-item-object-page + .menu-item-language {margin-top: 2em;} /* Active lang */ .mobile_main_nav .menu-item-language-current { } .mobile_main_nav .menu-item-language-current a {font-weight: 600; } /* HEADER / Nav mobile Changer legerement le bouton close. */ .mobile_menu_wrapper a#mobile_menu_close.button {background: #E74310;border: #E74310; z-index: 5;} /* Hover */ .mobile_menu_wrapper a#mobile_menu_close.button:hover {margin-top: 0;} /* FOOTER / Nav Ajuster les items de la navigation du footer. */ #footer_wrapper .menu {list-style: none;} #footer_wrapper .menu li {display: block;} #footer_wrapper .menu li a {color: #000;padding: 0.3em 0;display: inline-block;} /* Hover */ #footer_wrapper .menu li a:hover {color: #E74310; } /* FORMS / Items Items de formulaire. */ /* INPUT */ #wrapper .formInput, #wrapper .formTextarea, #wrapper .formSelect {-webkit-appearance: none;-moz-appearance: none;appearance: none;border: 2px solid #4F4F4F;width: 100%;box-sizing:border-box;background-color: #fff;font-family:"Open Sans";font-size: 1em;font-weight: bold;line-height: 1.2;display: block;padding: 1.002em 1.4002em;border-radius: 0;margin: 0;color: #000;border-radius: 1.5em;transition: border-color 0.3s ease;} /* Eviter le zoom iOS sur form sur mobile. */ @media (max-width:47rem) { #wrapper .formInput, #wrapper .formTextarea, #wrapper .formSelect {font-size: 16px;} } /* SELECT */ #wrapper .formSelect {background-image: url(img/icons/icon-arrow-dropdown.svg);background-repeat: no-repeat;background-position: right 1em center;background-size: 2.5em;padding-right: 3.3em;} #wrapper .formSelect::-ms-expand {display: none;} /* FOCUS */ #wrapper .formInput:focus, #wrapper .formTextarea:focus, #wrapper .formSelect:focus {border-color:#E74310;} /* FORM GROUP et FORM ITEM Pour espacement entre groupes de form items. */ #wrapper .formGroup { } #wrapper .formItem, #wrapper p.formItem {padding:0; } * + .formGroup, * + .formItem {margin-top: 2em;} /* Mobile */ @media (max-width:47rem) { * + .formGroup, * + .formItem {margin-top: 1.5em;} } /* ALT: 2 cols. */ .formGroup--half {display: flex;justify-content: space-between; } .formGroup--half .formItem {width: 48%;flex: 0 0 auto;margin: 0;} /* Break cols */ @media (max-width:47rem) { .formGroup--half {display: block; } .formGroup--half .formItem {width: 100%;margin-top: 1.5em;} } /* ALT: Form send. */ .formGroup--send {text-align:right; } .formGroup--send .formItem {display:flex;align-items: center;justify-content: flex-end;} .formGroup--send .formItem > * {display:block; flex:0 0 auto; } .formGroup--send .formItem input[type="submit"] {border:none; } .formGroup--send .formItem .ajax-loader {order:-1;} /* PLACEHOLDER TEXT */ #wrapper ::placeholder {color: rgba(0,0,0,0.7); font-weight:300;} /* CONTACT FORM 7 Quand on le met sur WP avec CF7, ces styles sont utiles. */ .wpcf7-form-control-wrap {display: block;} .wpcf7-form.sent .formGroup {display: none; } div.wpcf7-response-output {margin-left: 0 !important; margin-right: 0 !important; } .wpcf7-not-valid-tip {font-size: 0.8em;line-height: 1;font-weight: bold;color: #fff;background: #E74310;padding: 0.4em 1em;border: 2px solid #E74310;text-align: left;position: absolute;top: -1em;right: 1.8em;pointer-events: none;border-radius: 1em;} .wpcf7 form .wpcf7-response-output {font-size: 1em;line-height: 1.2;border: none;background: #E74310;color: #fff; font-weight: bold; margin: 1em 0;padding: 1.5em 5%;} .wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output {color: #fff;} .wpcf7 form.sent .wpcf7-response-output {background: #2A2D82;} /* CAMPAIGN MONITOR Override les styles par defaut du plugin. */ .cmApp_signupContainer.cmApp_embedded {display: none !important; } #campaignMonitor .cmApp_signupContainer {display: block !important;margin: 0;min-width: auto;max-width: none;width: 100%;padding: 0;text-align: left;color: inherit;z-index: 1;} #campaignMonitor { } #campaignMonitor #cmApp_signupForm > div {padding: 0; margin: 0; } #campaignMonitor #cmApp_signupForm .cmApp_fieldWrap {padding: 0;/* margin-top: 0.8em; */} /* Input */ #campaignMonitor .cmApp_signupContainer #cmApp_signupForm input {font-size: 16px;height: auto;padding: 0.7em 2.5em 0.7em 2px;border: none;border-bottom: 1px solid #E74310;} /* Button */ #campaignMonitor .cmApp_signupContainer #cmApp_signupForm .cmApp_formSubmitButton {height: auto;background-color: transparent !important;background-image: url(img/icons/icon-arrow-right-orange.svg);background-repeat: no-repeat;background-position: 100% 50%;background-size: 2em;cursor: pointer;border: none;width: 3em;float: right;transform: translateY(-2.7em);transition: opacity 0.2s;} #campaignMonitor .cmApp_signupContainer #cmApp_signupForm .cmApp_formSubmitButton:hover {opacity: 0.5;} /* Success */ #campaignMonitor .cmApp_signupContainer.cmApp_embedded #cmApp_thankYouCheck {display: none !important; } #campaignMonitor #cmApp_statusContainer.cmApp_processing .cmApp_processingMsg, #campaignMonitor #cmApp_statusContainer.cmApp_processing .cmApp_processingMsg > * {color:green;padding: 0;font-size: 1em;line-height: 1.4;} /* HOME / Carousel Par defaut, les fleches du carousel sont hidden sur mobile. On veut les afficher. Tant qu'a y etre, on ajuste aussi l'alignement. */ @media (max-width:767px) { #wrapper .flickity-prev-next-button {display: inline-block; } #wrapper .tg_horizontal_gallery_wrapper .flickity-prev-next-button.previous {left: 15px; } #wrapper .tg_horizontal_gallery_wrapper .flickity-prev-next-button.next {right: 15px; } } /* PORTFOLIO LIST / Nav of filters Filtres dans la liste de realisations. Ajouter des points entre les items. */ #wrapper .portfolioListVivenda .filter_tag_btn {position: relative;margin: 0;padding: 0.2em 0.7em;border: none;transition: color 0.3s;} #wrapper .portfolioListVivenda .filter_tag_btn:not(:first-child)::before {font-size: 0.25em;position:absolute;z-index:0;display:block;content:"";top: 52%;height:1em;left: -3px;width:1em;transform: translate(-50%, -50%);background-color: #E74310;border-radius:50%;} /* Active */ #wrapper .portfolioListVivenda .filter_tag_btn.active {font-weight: 600;text-decoration: underline;} /* PORTFOLIO LIST / Item spacing Ajuster l'espacement en-dessus de chaque item, car c'est trop serrer sur mobile. Impossible a faire dans Elementor. */ @media (max-width:767px) { #wrapper .portfolio_classic_grid_wrapper {margin-bottom: 2.5em; } } /* PORTFOLIO LIST / Item hover Hover doit etre un "+" avec background orange. */ #wrapper .portfolioListVivenda .portfolio_classic_img {background: #E74310;} /* Enlever les choses inutiles */ #wrapper .portfolioListVivenda .portfolio_classic_img > div::before {display: none; } #wrapper .portfolioListVivenda .portfolio_classic_img span.ti-arrow-right {display: none; } #wrapper .portfolioListVivenda .portfolio_classic_img .curl {display: none; } /* Prep la nouvelle animation */ #wrapper .portfolioListVivenda .portfolio_classic_img::before, #wrapper .portfolioListVivenda .portfolio_classic_img::after {content: ''; background-color: #fff; position: absolute; z-index: 1; top: 50%; left: 50%; opacity: 0; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); transition: all 0.4s; will-change:transform; } #wrapper .portfolioListVivenda .portfolio_classic_img::before {width: 60px; height: 1px; left: 100%; } #wrapper .portfolioListVivenda .portfolio_classic_img::after {height: 60px; width: 1px; top: 0%; } #wrapper .portfolioListVivenda .portfolio_classic_img > img {transition: opacity 0.4s; } /* Hover */ #wrapper .portfolioListVivenda .portfolio_classic_img:hover { } #wrapper .portfolioListVivenda .portfolio_classic_img:hover > img, #wrapper .portfolioListVivenda .portfolio_classic_img.hover > img {opacity: 0.5; } #wrapper .portfolioListVivenda .portfolio_classic_img:hover::before, #wrapper .portfolioListVivenda .portfolio_classic_img.hover::before, #wrapper .portfolioListVivenda .portfolio_classic_img:hover::after, #wrapper .portfolioListVivenda .portfolio_classic_img.hover::after {opacity: 1; top: 50%; left: 50%; } /* Disable link for "no-link" items. Pas le choix de faire ainsi, car chaque item doit avoir un link dans Elementor. */ #wrapper .portfolioListVivenda .portfolio_classic_grid_wrapper.no-link { } #wrapper .portfolioListVivenda .portfolio_classic_grid_wrapper.no-link a {cursor: auto; pointer-events: none; } #wrapper .portfolioListVivenda .portfolio_classic_grid_wrapper.no-link .portfolio_classic_img::before, #wrapper .portfolioListVivenda .portfolio_classic_grid_wrapper.no-link .portfolio_classic_img::after {display: none; } #wrapper .portfolioListVivenda .portfolio_classic_grid_wrapper.no-link .portfolio_classic_img > img {opacity: 1;} /* FAQ / Liste Icone avec BG orange et animation hover. */ #wrapper .faqListVivenda { } #wrapper .faqListVivenda .elementor-toggle-icon {background: #E74310;border-radius: 50%;font-size: 1em;width: 2em;height: 2em;padding: 0.25em;position: absolute;top: -0.1em;left: 0;transition: transform 0.4s;} #wrapper .faqListVivenda .elementor-tab-title {position: relative; } /* Hover */ #wrapper .faqListVivenda .elementor-tab-title:hover .elementor-toggle-title {color:#E74310; } /* Active */ #wrapper .faqListVivenda .elementor-tab-title.elementor-active .elementor-toggle-icon {transform:rotate(90deg); } /* Font-size */ @media (max-width:767px) { #wrapper .faqListVivenda .elementor-toggle-icon {font-size: 0.8em; } } /* BLOG / Liste Mouse hover en orange. */ #wrapper .blogListVivenda { } /* Image */ #wrapper .blogListVivenda .post_img_hover:hover img, #wrapper .blogListVivenda .post_img_hover.hover img {opacity:0.5; } #wrapper .blogListVivenda .post_img_hover:not(.lazy) {background:#E74310; } /* Title */ #wrapper .blogListVivenda .post_header_title a { } #wrapper .blogListVivenda .post_header_title a:hover {color: #E74310; } /* BLOG / Liste Vertical align center. */ @media (min-width:768px) { #wrapper .blogListVivenda .post_wrapper {display: flex; align-items: center; } #wrapper .blogListVivenda .post_wrapper .post_img {flex:0 0 auto;margin-bottom: 0;} #wrapper .blogListVivenda .post_wrapper .post_content {flex:1 1 auto;} } /* HOME / Slider de projets Alignement du texte a gauche, changer les fleches, ajuster le lien. */ #sliderProjetsVivenda {--widthSide: 22em;--widthSidePadding: 3em;} /* Spacing de la zone de texte */ @media (max-width:992px) { #sliderProjetsVivenda {--widthSide: 20em;--widthSidePadding: 2em;} } /* Passer de absolute a grid pour le slider. */ @media (max-width:767px) { #sliderProjetsVivenda {--widthSide: 100%;--widthSidePadding: 0.01px;} #sliderProjetsVivenda .tg_fadeup_slider_wrapper.cd-slider {height:auto !important;} #sliderProjetsVivenda .tg_fadeup_slider_wrapper.cd-slider ul {display:grid; } #sliderProjetsVivenda .tg_fadeup_slider_wrapper.cd-slider li {grid-row:1 / -1; grid-column:1 / -1; height:auto;position: static;} } /* Nav */ #sliderProjetsVivenda .tg_fadeup_slider_wrapper nav {width: var(--widthSide);padding-left: var(--widthSidePadding);font-family: "Raleway", sans-serif;font-weight: 600;display: flex;align-items: center;justify-content: space-between;} #sliderProjetsVivenda .tg_fadeup_slider_wrapper nav + nav {display:none; } #sliderProjetsVivenda .tg_fadeup_slider_wrapper nav > * {display:block; flex:0 0 auto; } #sliderProjetsVivenda .tg_fadeup_slider_wrapper .prev, #sliderProjetsVivenda .tg_fadeup_slider_wrapper .next {background: #E74310;border-radius: 50%;font-size: 1.5em;width: 2em;height: 2em;padding: 0;color: #fff;background-image: url(img/icons/icon-arrow-simple-white-left.svg);background-repeat: no-repeat;background-position: 50% 50%;background-size: 1.5em;transition: background 0.3s;} #sliderProjetsVivenda .tg_fadeup_slider_wrapper .next {background-image:url(img/icons/icon-arrow-simple-white-right.svg); } #sliderProjetsVivenda .tg_fadeup_slider_wrapper .prev::before, #sliderProjetsVivenda .tg_fadeup_slider_wrapper .next::before {display: none;} #sliderProjetsVivenda .tg_fadeup_slider_wrapper .counter { } #sliderProjetsVivenda .tg_fadeup_slider_wrapper .counter span:last-child::before {margin: 0 0.4em;} /* Hover */ #sliderProjetsVivenda .tg_fadeup_slider_wrapper .prev:hover, #sliderProjetsVivenda .tg_fadeup_slider_wrapper .next:hover {background-color: #2A2D82;} /* Restrict width of nav */ @media (max-width:767px) { #sliderProjetsVivenda .tg_fadeup_slider_wrapper nav {width: 90%;max-width: 15em;margin: 0 auto;position: static;} } /* Image */ #sliderProjetsVivenda .tg_fadeup_slider_wrapper li .image {width: calc(100% - var(--widthSide)); } /* Enlever absolute et set une hauteur. */ @media (max-width:767px) { #sliderProjetsVivenda .tg_fadeup_slider_wrapper li .image {width: 100%;position: static;height: 300px;} } /* Content */ #sliderProjetsVivenda .tg_fadeup_slider_wrapper li .content {padding: 2rem 0 4em var(--widthSidePadding);width: var(--widthSide);text-align: left;} #sliderProjetsVivenda .tg_fadeup_slider_wrapper li .content > * {padding: 0;width: 100% !important;} #sliderProjetsVivenda .tg_fadeup_slider_wrapper li .content .description {margin: 2em 0;} #sliderProjetsVivenda .tg_fadeup_slider_wrapper li .content a.slide_link {color:#E74310;font-family: "Raleway", sans-serif;font-weight: 600;font-size: 20px;} /* Hover */ #sliderProjetsVivenda .tg_fadeup_slider_wrapper li .content a.slide_link:hover {color:#2A2D82; } /* Force size, sinon le font-size jump au changement de slide */ @media (max-width:992px) { #sliderProjetsVivenda .tg_fadeup_slider_wrapper li .content h2 {font-size:30px !important; } } /* Enlever absolute */ @media (max-width:767px) { #sliderProjetsVivenda .tg_fadeup_slider_wrapper li .content {position: static;height: auto;padding: 8%;} } /* REALISATION / Slider gallery Dans la page de details d'une realisation. */ #wrapper .gallerySliderVivenda .tg_horizontal_gallery_wrapper .flickity-prev-next-button {background:#e74310; opacity:1; } #wrapper .gallerySliderVivenda .tg_horizontal_gallery_wrapper .flickity-prev-next-button .arrow {fill: #fff;} /* Navigation dots */ #wrapper .gallerySliderVivenda .flickity-page-dots .dot {opacity:1;background:#D8D8D8;transition: background 0.2s;} #wrapper .gallerySliderVivenda .flickity-page-dots .dot.is-selected {background:#e74310; } /* CONTACT / Icon box Rapprocher l'icone du texte sur mobile. */ #wrapper .iconBoxContactVivenda { } @media (max-width:767px) { #wrapper .iconBoxContactVivenda .elementor-icon-box-icon {margin-bottom: -1em; } }