/*
Theme Name: Menuiserie paradis
Theme URI: https://example.com/
Author: Marlène Cotterlaz
Author URI: https://marlenecotterlaz.fr
Description: A child theme for TT2.
Requires at least: 5.8
Tested up to: 5.9
Requires PHP: 5.6
Version: 0.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentytwo-child
Template: twentytwentytwo
Twenty Twenty-Two Child WordPress Theme, (C) 2021 WordPress.org
Twenty Twenty-Two Child is distributed under the terms of the GNU GPL.
*/
:root {
--font-icons : 'mjp';
}
* {
box-sizing: border-box;
}
a {
transition: all 0.5s;
}
body {
/*font-size: var(--wp--preset--font-size--normal);*/
}
@media screen and (max-width: 800px) {
.desktop {
display: none!important;
}
}
@font-face {
font-family: 'mjp';
src: url('assets/fonts/mjp.eot?jtdg3q');
src: url('assets/fonts/mjp.eot?jtdg3q#iefix') format('embedded-opentype'),
url('assets/fonts/mjp.ttf?jtdg3q') format('truetype'),
url('assets/fonts/mjp.woff?jtdg3q') format('woff'),
url('assets/fonts/mjp.svg?jtdg3q#mjp') format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
}
[class^="icone-"]::before, [class*=" icone-"]::before {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'mjp' !important;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icone-menuiserie-exterieure:before {
content: "\e900";
}
.icone-fermeture-exterieure:before {
content: "\e901";
}
.icone-escalier:before {
content: "\e902";
}
.icone-menuiserie-interieure:before {
content: "\e903";
}
.icone-amenagement-exterieur:before {
content: "\e904";
}
.icone-cercle:before {
content: "\e905";
}
.icone-plus:before {
content: "\e906";
}
/* ***************
--------------
LAYOUT
--------------
*************** */
.home .wp-site-blocks {
overflow-x: hidden;
}
.mask-svg {
position: absolute;
width: 0;
height: 0;
}
/* --------------
HEADER
-------------- */
.site-header {
position: sticky;
top: 0;
z-index: 20;
}
.site-header > div {
position: relative;
}
.site-header li a:hover,
.site-header li a:focus {
text-decoration: none!important;
}
.site-header .wp-block-site-logo {
position: relative;
z-index: 3;
margin: 0!important;
max-width: 320px;
}
.site-header .wp-block-site-logo img {
width: 100%;
height: auto;
}
.site-header .wp-block-navigation {
position: relative;
z-index: 3;
}
.site-header .wp-block-navigation a {
position: relative;
z-index: 3;
padding-bottom: 8px;
}
.site-header .wp-block-navigation a::before {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 100%;
z-index: 2;
height: 3px;
background: var(--wp--preset--color--white);
transition: all 0.5s;
}
.site-header .wp-block-navigation li:hover > a::before,
.site-header .wp-block-navigation a:hover::before,
.site-header .wp-block-navigation a:focus::before {
right: 0;
}
.site-header .wp-block-navigation li + li::before {
content: '\e905';
margin: 0 1.5rem 0 0;
padding-bottom: 8px;
font-family: var(--font-icons);
font-size: 70%;
}
.site-header .wp-block-navigation li li + li::before {
display: none;
}
.site-header .wp-block-navigation li li a {
justify-content: center;
text-align: center;
line-height: 1.2;
}
.site-header .wp-block-navigation li li a:hover,
.site-header .wp-block-navigation li li a:focus {
background: var(--wp--preset--color--primary);
}
.site-header .wp-block-navigation li li a::before {
display: none;
}
@media screen and (min-width: 800px) {
.site-header > div {
display: flex;
justify-content: space-between;
}
.site-header .wp-block-navigation li ul {
right: auto!important;
left: calc(50% + 1.2rem) !important;
transform: translate(-50%, 0);
padding: 0;
border: none!important;
font-size: 90%;
}
}
@media screen and (max-width: 800px) {
.site-header .wp-block-site-logo {
max-width: 33vw;
}
.site-header .wp-block-navigation li ul {
padding: 20px 0!important;
}
.site-header .wp-block-navigation li ul li + li {
margin-top: 10px;
}
}
/*
HOME
*/
.home .site-header {
position: fixed;
top: 0;
left: 0;
right: 0;
}
.logged-in.home .site-header {
top: 32px;
}
.home .site-header > div {
background: none!important;
transition: all 0.5s;
}
.home .site-header.header-opaque > div {
background: var(--wp--preset--color--current)!important;
}
.home .site-header > div.wp-block-group.has-background {
margin: 0!important;
padding: 1.25rem var(--wp--custom--spacing--outer);
}
@media screen and (min-width: 800px) {
}
/* --------------
MAIN
-------------- */
.wp-site-blocks main {
position: relative;
z-index: 2;
margin: var(--wp--custom--spacing--outer) 0;
}
.home .wp-site-blocks main {
margin: 0 calc((var(--wp--custom--spacing--outer) * -1));
}
main h1.wp-block-post-title {
margin: 0!important;
margin-bottom: 0!important;
padding: 0;
font-size: var(--wp--preset--font-size--gigantic);
line-height: 1;
text-align: center;
}
.home main .wp-block-post-title {
text-shadow: 0 0 20px rgba(255,255,255,0.8);
}
main .wp-block-post-featured-image {
max-height: 65vh;
overflow: hidden;
}
main .wp-block-post-featured-image img {
width: 100%;
height: auto;
}
.entry-content {
margin: 30px 0!important;
}
@media screen and (max-width: 800px) {
main h1.wp-block-post-title,
main h1.wp-block-query-title {
margin-top: 40px!important;
}
}
/*
HOME
*/
.home .entry-content {
position: relative;
margin: var(--wp--custom--spacing--outer) auto!important;
max-width: var(--wp--style--global--content-size);
}
.home .entry-content > * {
position: relative;
z-index: 1;
}
.home .entry-content > p:first-child {
line-height: 1.2;
}
.home .entry-content > p:first-child strong ~ strong {
font-size: 80%;
}
@media screen and (min-width: 800px) {
.home .entry-content::before {
content: '';
position: absolute;
top: calc(var(--wp--custom--spacing--outer) * -2);
right: 0;
bottom: calc(var(--wp--custom--spacing--outer) * -2);
z-index: 0;
width: 100%;
transform: translate(20%, 0);
background: url(assets/imgs/forme.svg) right center no-repeat;
background-size: auto 100%;
}
}
@media screen and (max-width: 800px) {
.home .entry-content {
padding: 0 var(--wp--custom--spacing--outer);
}
}
/* --------------
FOOTER
-------------- */
.site-footer {
margin: 0;
}
.site-footer > div {
position: relative;
padding: 40px var(--wp--custom--spacing--outer)!important;
overflow: hidden;
}
.site-footer p {
position: relative;
z-index: 2;
}
.site-footer nav {
position: relative;
z-index: 2;
margin: 0;
}
@media screen and (max-width: 800px) {
.site-footer > div {
padding-top: 20px!important;
padding-bottom: 20px!important;
}
}
/* ***************
--------------
COMPONANT
--------------
*************** */
.entry-content strong {
font-weight: 700;
}
.entry-content p:last-child {
margin-bottom: 0;
}
.wp-block-cover + p {
margin-block-start: var(--wp--custom--spacing--outer)!important;
}
/* --------------
EXERPT
-------------- */
.wp-block-post-excerpt {
margin-block-start: 1rem!important;
}
.wp-block-post-excerpt__excerpt {
display: inline-block;
padding: 0 10px;
background: var(--wp--preset--color--primary);
color: var(--wp--preset--color--white);
text-transform: uppercase;
}
/* --------------
COVER
-------------- */
.entry-content .wp-block-cover.alignfull {
margin-left: 0!important;
margin-right: 0!important;
overflow: hidden;
}
.wp-block-cover ul {
position: absolute;
top: 100%;
left: 50%;
transform: translate(-50%, -30%);
display: flex;
gap: 10px;
margin: 0;
padding: 0;
list-style: none;
}
.wp-block-cover ul li {
padding: 20px;
width: 150px;
height: 150px;
background: var(--wp--preset--color--white);
border-radius: 100px;
text-align: center;
}
.wp-block-cover {}
@media screen and (max-width: 800px) {
.wp-block-cover ul {
display: none;
}
}
/*
ENTETE HOME
*/
.wp-block-cover.entete-home {}
.wp-block-cover.entete-home::before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 2;
height: 50%;
background: linear-gradient(to bottom,rgba(67,40,31,0.5) 0%,rgba(67,40,31,0) 100%);
}
.wp-block-cover.entete-home::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
right: 0;
z-index: 2;
height: 30%;
background: linear-gradient(to bottom,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 100%);
}
.wp-block-cover.entete-home .wp-block-cover__inner-container {
position: relative;
z-index: 3;
margin-bottom: 50px!important;
}
/* --------------
MEDIA & TEXT
-------------- */
.wp-block-media-text {}
.wp-block-media-text figure {
position: relative;
margin: 0;
height: 100%;
}
.wp-block-media-text figure::before {
content: '';
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
z-index: 1;
}
.wp-block-media-text figure img {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
object-fit: cover;
}
@media screen and (max-width: 800px) {
.wp-block-media-text figure {
height: 45vh;
}
.wp-block-media-text .wp-block-media-text__content {
padding: var(--wp--custom--spacing--outer);
}
}
/* --------------
FORM
-------------- */
.wpcf7-form {
}
.wpcf7-form p {
margin: 0;
}
.wpcf7-form p + p {
margin: 10px 0 0;
}
.wpcf7-form input,
.wpcf7-form textarea {
padding: 10px 20px;
width: 100%;
border: 1px solid var(--wp--preset--color--grey);
border-radius: 5px;
color: var(--wp--preset--color--current);
font-size: 1rem;
}
.wpcf7-form input[type=submit] {
background: var(--wp--preset--color--primary);
border: none;
border-radius: 100px;
color: var(--wp--preset--color--white);
cursor: pointer;
transition: all 0.5s;
}
.wpcf7-form input[type=submit]:hover {
}
.wpcf7-form .wpcf7-spinner {
display: none;
}
/* --------------
GROUPE
-------------- */
.entry-content .wp-block-group:where(.has-background) {
margin-block-start: var(--wp--custom--spacing--outer)!important;
padding: var(--wp--custom--spacing--outer);
}
@media screen and (max-width: 800px) {
.entry-content .wp-block-group:where(.has-background) {
padding: var(--wp--custom--spacing--outer);
}
}
/* --------------
TITRES
-------------- */
h2 {
margin: 0 !important;
}
.entry-content > h2 {
margin-block-start: var(--wp--custom--spacing--outer)!important;
}
@media screen and (max-width: 800px) {
}
/* --------------
BOUTONS
-------------- */
.is-style-outline .wp-block-button__link {
font-weight: 700;
}
.wp-block-button__link {
padding: 5px 30px!important;
}
@media screen and (max-width: 800px) {
.wp-block-button__link {
padding: 5px 15px!important;
}
}
/* --------------
GALLERY
-------------- */
.wp-block-gallery {}
.entry-content .wp-block-gallery.alignfull {
margin-left: 0!important;
margin-right: 0!important;
}
.wp-block-gallery figcaption {
background: none!important;
font-size: 1.3rem;
font-weight: 700;
text-transform: uppercase;
text-shadow: 0 0 10px var(--wp--preset--color--current);
}
/* ***************
--------------
PATTERNS
--------------
*************** */
/* --------------
PRESTATIONS
-------------- */
.prestations {
position: relative;
z-index: 2;
margin-block-start: 0!important;
margin-block-end: var(--wp--custom--spacing--outer)!important;
}
.prestations .wp-block-columns {
justify-content: center;
gap: 0;
}
.prestations .wp-block-column {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
padding: 0 10px;
max-width: 200px;
transition: all 0.5s;
}
.prestations .wp-block-column:hover {
}
.prestations .wp-block-column::before {
position: relative;
z-index: 1;
margin-bottom: 10px;
font-size: 4rem;
}
.prestations .wp-block-column::after {
content: '\e906';
display: flex;
justify-content: center;
align-items: center;
width: 30px;
height: 30px;
font-family: var(--font-icons);
font-size: 1.5rem;
transition: all 0.5s;
}
.prestations .wp-block-column:hover::after {
transform: rotate(90deg);
}
.prestations h2::before {
content: '';
position: absolute;
bottom: 100%;
left: 50%;
z-index: 0;
transform: translate(-50%, 75%);
width: 150px;
height: 150px;
background: var(--wp--preset--color--white);
border-radius: 100%;
transition: all 0.5s;
}
.prestations .wp-block-column:hover h2::before {
transform: translate(-50%, 65%);
}
.prestations h2,
.prestations h3 {
min-height: 45px;
}
.prestations h2 strong,
.prestations h3 strong {
font-weight: 900;
}
.prestations h2 a {
position: relative;
z-index: 1;
text-decoration: none;
}
.prestations a {
text-decoration: none;
}
.prestations a::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 3;
}
.prestations p {
margin-block-start: 10px!important;
margin-block-end: 10px!important;
line-height: 1.3;
}
@media screen and (max-width: 800px) {
.prestations .wp-block-column {
max-width: 50%;
}
.prestations div:nth-child(2) ~ div {
margin: 20px 0 0;
}
.prestations div:nth-child(2) ~ div h2::before {
display: none;
}
/*.prestations {
position: fixed;
bottom: 0;
left: 0;
right: 0;
margin-block-end: 10px!important;
}
.prestations .wp-block-columns {
padding: 0 10px;
}
.prestations .wp-block-column {
padding: 0;
}
.prestations .wp-block-column::before {
font-size: 2rem;
}
.prestations .wp-block-column::after {
display: none;
}
.prestations h2.wp-block-heading,
.prestations h3 {
min-height: auto;
font-size: 0.65rem!important;
}
.prestations p {
display: none;
}*/
}
/*
AUTRES PRESTATIONS
*/
.autres-prestations::before {
content: '';
position: absolute;
bottom: 100%;
left: 50%;
transform: translate(-50%, 60%);
height: 100px;
width: 400px;
background: var(--wp--preset--color--primary);
border-radius: 50% 50% 0% 50% / 100% 100% 0% 0% ;
}
.autres-prestations:last-child {
position: relative;
margin-bottom: calc(-1 * var(--wp--custom--spacing--outer)) !important;
}
.autres-prestations h2::before {
display: none;
}
.autres-prestations .wp-block-columns {
margin-block-start: 3rem!important;
}
.autres-prestations .wp-block-column {
padding: 0 25px;
max-width: 230px;
opacity: 0.8;
transition: all 0.5s;
}
.autres-prestations .wp-block-column:hover {
opacity: 1;
}
.autres-prestations .wp-block-column:hover::after {
transform: rotate(90deg);
}
.autres-prestations a {
text-decoration: none;
}
.autres-prestations a::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.autres-prestations p {
margin-block-start: 10px!important;
margin-block-end: 10px!important;
line-height: 1.3;
}
.autres-prestations {}
@media screen and (max-width: 800px) {
.autres-prestations::before {
display: none;
}
.autres-prestations .wp-block-column {
max-width: 50%;
}
.autres-prestations div:nth-child(2) ~ div {
margin: 20px 0 0;
}
.autres-prestations h2 {
font-size: 2rem;
}
}
/* --------------
FLUX FACEBOOK
-------------- */
.flux-facebook > div.alignfull {
margin: 0!important;
}
.flux-facebook > div {
margin-block-start: 0;
padding: var(--wp--custom--spacing--outer);
}
.flux-facebook > div + div {
margin-top: calc(var(--wp--custom--spacing--outer) * -1);
padding-top: 0;
}
.flux-facebook p + p {
margin-block-start: 0!important;
}
/**/
.flux-facebook .tagembed-container {
margin-block-start: 0;
max-width: none!important;
}
.flux-facebook {}