/*          _              _           
__   _____ (_)_ __   _ __ | |_   _ ___ 
\ \ / / _ \| | '__| | '_ \| | | | / __|
 \ V / (_) | | |    | |_) | | |_| \__ \
  \_/ \___/|_|_|    | .__/|_|\__,_|___/
                    |_|                
     _         _      
 ___| |_ _   _| | ___ 
/ __| __| | | | |/ _ \
\__ \ |_| |_| | |  __/
|___/\__|\__, |_|\___|
         |___/        
*/

@font-face {
    font-family: dahlia;
    src: url(../../assets/fonts/Dahlia-Medium.otf);
}

@font-face {
    font-family: maaxReg;
    src: url(../../assets/fonts/Maax\ -\ Regular-205TF.otf);
}

:root {
    --global-color: #966b46;
    --global-textBlock-color:#644023;
    --global-blue-text: #0051ff;
    --global-artistes-color: #dd6808;
    --global-txtBlock-margin: 4vw;
    --global-h1: 3vw;
    --global-paratxt-size: .8vw;
    --header-height: 9vh;
}

.vPlusContent::-webkit-scrollbar {
    display: none;
}

/* VOIR PLUS BUTTON */
#lirePlus{
    border: 1pt solid var(--global-textBlock-color);
    color: var(--global-textBlock-color);
    border-radius: 45px;
    width: fit-content;
    min-width: 6vw;
    margin: auto;
    padding-top: .5vw;
    padding-bottom: .5vw;
    padding-left: 1vw;
    padding-right: 1vw;
    transition: all .5s;
}
.voirPlus{
    color:var(--global-textBlock-color);
    font-family: dahlia;
    font-weight: 100;
    font-size: .8vw;
    cursor: pointer;
    width: fit-content;
    height: fit-content;
    padding: 1vw;
    margin-top: .5vh;
    transition: color .5s;
}
.seven > .voirPlus {
    /* text-align: center; */
    /* align-self: center; */
}
/* .voirPlus:hover{
    color: var(--global-blue-text);
    transition: color .5s;
} */
#lirePlus:hover{
    border:1pt solid var(--global-blue-text);
    color: var(--global-blue-text);
    transition: all .5s;
}
svg.is-svg{
    width: .8vw;
}
.is-svg-circle{
    fill:none;
    stroke:var(--global-color);
    stroke-miterlimit: 10;
    stroke-width: 2px;
    transition: all 1.5s;
}
.is-svg-line{
    fill: none;
    stroke:var(--global-color);
    stroke-miterlimit: 10;
    stroke-width: 2px;
    transition: all 1.5s;
}
#Calque_1:hover * {
    stroke:var(--global-blue-text);
    transition: all 1.5s;
}

#lirePlus:hover .is-svg *{
    stroke:var(--global-blue-text);
    transition: all 1.5s;
}

.voirPlusBtn{
    width: 1vw;
    /* position: relative;
    border: 1pt solid var(--global-color); 
    border-radius: 100%;
    padding-left: 0.3vw; 
    padding-right: 0.3vw; 
    padding-bottom: 0.15vw; 
    font-size: .8vw;
    font-weight: 900;
    color: var(--global-color);
    transition: all .5s; */
}
.voirPlus > p{
    font-size: 1vw;
    transition: all .5s;
}

.voirPlusBtnActiveBorder{
    border: 1pt solid var(--global-blue-text); 
    color: var(--global-blue-text);
    animation-name:rollover;
    animation-duration: 2s;
    transition: all .5s;
    
}
.voirPlusBtnActive{
    color:blue !important;
    /* box-shadow: rgba(0, 0, 0, 0.15) 0px 3px 3px 0px; */
    border-radius: 100%;
    transition: all .5s;
}
.voirPlus > p, .voirPlusBtn{
    pointer-events: none;
}
#lirePlus{
    pointer-events: auto;
}















/* VOIR PLUS IMG CONTENT */

.voir-plus-section{
    position: absolute;
    width: 100vw;
    height: 100vh;
    /* border: 1pt solid red; */
    background-color: white;
}
.voir-plus-container{
    background-color: #dd6808;
}
.voir-plus-container > div > img{
    position: fixed;
    right: -100%;
    height: 100vh;
    z-index: 9999;
}


/* ------------------- */






















/* VOIR PLUS CONTENT */
/*
.vPlusContentActive {
    display: none;
    z-index: 99;
    grid-template-columns: repeat(3, 1fr);
    position: fixed;
    right: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    padding-bottom: 40vh;
    text-align:left;
    background: rgb(63, 94, 251);
    background: linear-gradient(90deg, rgba(63, 94, 251, 0) 0%, rgba(0, 81, 255, 0.818662464985995) 100%);
}


.vPlusContentActive > img{
    grid-column: 1/5;
    opacity: .8;
    height: auto;
    width: 100vw;
}

.vPlusContent > .content {
    opacity: 0;
    overflow: hidden;
    width: 45vw;
    top: 0;
    height: 150vh;
    margin: 3vw;
    position: absolute;
    right: 0;
}
.vPlusContent > .content > .txt{
    overflow-y: scroll;
    height: 100vh;  
    padding-bottom: 15vh;
}
.vPlusContent > .content > .txt::-webkit-scrollbar{ display: none;}
.vPlusContent > .content > .txt > .imgContent {
background-color: white;
border-radius: 25px;
}
.vPlusContent > .content > .txt > #lastPbatik {
    background-color: transparent;
    border-radius: 25px;
    }
    .vPlusContent > .content > .txt > #lastPbatik > img{
        width: 40vw;
        border-radius: 25px;
    }
.vPlusContent > .content > .txt > .imgContent > img{
    width: 40vw;
}
.vPlusContent > .content > .txt > #spacer{
    height: 20vh;
}
.vPlusContent > .content::-webkit-scrollbar{
    display: none;
}

.vPlusContent > div > .txt > h2{
    font-family: dahlia;
    font-weight: 100;
    color: var(--global-blue-text);
    text-align: left;
    padding-bottom: 3vh;
    font-size: 2vw;
    width: 30vw;
}
.vPlusContent > div > .txt > p {
    font-family: maaxReg;
    font-weight: 100;
    color: var(--global-color);
    width: 30vw;
    text-align: left;
    font-size: 1.5vw;
}
.vPlusContent > div > .txt > ul{
    font-family: maaxReg;
    color: var(--global-color);
    list-style: none;
    padding-bottom: 1vh;
    font-size: 1.5vw;
}
.vPlusContent > div > .txt > ul > li{
    font-family: maaxReg;
    color: var(--global-color);
    list-style: none;
    padding-bottom: 2vh;
    font-size: 1.5vw;
}
.vPlusContent > div > .txt > ul > li::before{
    content:"➞ ";
}
.vPlusContentActive > #bgImgGroup > img{
    position: absolute;
    top: 0;
    left: 0;
    opacity: .7;
}
.vPlusContentActive > #bgImgGroup > #vPlusImgBen{
    position: relative;
    top: 8vh;
    margin-left: auto;
    margin-right: auto;
    left: 2vw;
    height: 75vh;
    opacity: .5;
}
*/