:root{

    --main-color:#31789e;
    --success-color: #5dbf4b;
    --danger-color: #f00;

    /* HEADER */
    --header-height:75px;
    --header-background:#ffeed1;
    --header-text-color:#634800;

    /* BUTTON */
    --button-background:#31789e;
    --button-border:none;
    --button-hover-background: #205b7b;
    --button-neutral-background: #000000;
    --button-text-color: #fff;

    --shadow:0px 0px 15px #777;


}








section:nth-child(2n+1){  
    /* SECTION */
    --section-background:#ecd9ac;    
    --section-background-2:#fff;
    --section-text-color:#040303;

    /* ARTICLE */
    --article-background:#ffffff;
    --article-hover-background:#777;

    /* CONTENT */
    
    --content-background:none;
    --content-text-color:#634800;
    --content-border:none;

        /* BUTTON */
    --button-background: #31789e;
    --button-border: none;
    --button-hover-background: #205b7b;
    --button-neutral-background: #000000;
    --button-text-color: #fff;

    --shadow:0px 0px 15px #777; 

}

section:nth-child(2n){ 

    /* HEADER */
    --header-height:75px;
    --header-background:#839f88;

    /* SECTION */
    --section-background:#1c5352;
    --section-background-2:#fffaf1;
    --section-text-color:#040303;

    /* ARTICLE */
    --article-background:#ffffff;
    --article-hover-background:#777;

    /* CONTENT */
    --content-background:none;
    --content-text-color:#634800;
    --content-border:none;

    /* BUTTON */
    --button-background: #31789e;
    --button-border: none;
    --button-hover-background: #205b7b;
    --button-neutral-background: #000000;
    --button-text-color: #fff;

    --shadow:0px 0px 15px #777; 

}


@font-face {
    font-family: 'header';
    src: url(/3_domains/ikomenuiserie/medias/fonts/Limelight-Regular.ttf) format('truetype');
}
@font-face {
    font-family: 'body';
    src: url(/1_kernel/medias/fonts/Poppins-Regular.ttf) format('truetype');
}



header nav {
        background: linear-gradient(268deg, #ffeed1, #ecd9ac);
}
header nav .nav-title a.shortTitle {
    margin:0 15px 0 0;
}
header nav ul li {
    padding: 18px 0 0 38px;
}
section#introduction {
    height:calc(100dvh - var(--header-height)); /* 50px pour les hauteur browser */
}

section#introduction > .content{
    filter: drop-shadow(10px 10px 10px #000);
}


section#introduction > .content > img{
        height:calc(80dvh - var(--header-height));
}


section#introduction > .media img.loaded {
    opacity: 0.5;
}

section#presentation > .content,
section#extra-1 > .content
{
    border: 6px solid white;
    border-radius: 40px 0;
    background:#fff5ddcf; /*#ecd9acea;*/
    font-weight: bold;
    margin:200px 0;
    box-shadow:1px 1px 20px 4px black;
}
section#presentation > .content h2 ,
section#extra-1 > .content h2 {
    font-size: 2em;
}
section#presentation > .content p,
section#extra-1 > .content p{
    font-size: 1.2rem;
    font-weight: normal;
}

section#extra-1{
    border-color:white;
    border-width:10px 0;
    border-style: solid;;
}

section#contact .phone svg{
    fill: var(--main-color);    
}
section#contact .phone h3{
    color: var(--main-color); 
    font-size: 1.8em;   
}
section#contact > .media img.loaded {
    opacity: 0.5;
}


section article{
    border:8px solid white;

}
section article{
    transition: all 0.3s;
    border-radius: 20px 0;
}
section article > p{
    margin:10px;
}
section article:hover{
    transform: scale(1.015);

}

section article > .bg > img{
    opacity:0.3;
}




section > .articles > article > img {
    max-height: 300px;
}

section > .content h2 {
    font-size: 3em;
}


section > .content p {
    font-size: 1.3em;
}



section > .media svg {
    stroke: none;
    fill: #e3ce9e;
    width: 100%;
    height:auto;
}

section#contact > #formulaire-carte {
    background:none;
}

section#contact > #formulaire-carte > form textarea,
section#contact > #formulaire-carte > form input{
    box-shadow: inset -1px 1px 3px 0px #784608;
    border-radius:20px 0;
}


footer{
    background: #ecd9ac;
}