:root{
    --primary-color:#D0B88C;
    --secondary-color:rgb(14, 48, 102);
    --nav-height:6.25vw;
}

/*common*/
/* styles for '...' */
.block-with-wrap-text {
    --dot:'...';
    /* hide text if it more than N lines  */
    overflow: hidden;
    /* for set '...' in absolute position */
    position: relative;
    /* use this value to count block height */
    max-height: calc(var(--line-height,1.4em)*var(--nb-line, 2));
    /* fix problem when last visible word doesn't adjoin right side  */
    text-align: justify;
    /* place for '...' */
    margin-right: -1em;
    padding-right: 1em;
}
/* create the ... */
.block-with-wrap-text:before {
    /* points in the end */
    content: var(--dot);
    /* absolute position */
    position: absolute;
    /* set position to right bottom corner of block */
    right: 0;
    bottom: 0;
}
/* hide ... if we have text, which is less than or equal to max lines */
.block-with-wrap-text:after {
    /* points in the end */
    content: '';
    /* absolute position */
    position: absolute;
    /* set position to right bottom corner of text */
    right: 0;
    /* set width and height */
    width: 1em;
    height: 1em;
    margin-top: 0.2em;
    /* bg color = bg color under block */
    background: var(--bg-color , #e9e8e7);
}


.bg-primary{
    background-color: var(--primary-color);
}

.bg-secondary{
    background-color: var(--secondary-color);
}

.bg-primary *, .bg-secondary *{
    color: white;
}

.color-primary{
    color: var(--primary-color);
}

.color-secondary{
    color: var(--secondary-color);
}

.full-container{
    margin-left: 10.68vw;
}

.full-container.gpadding{
    padding-left: 0;
}

.container{
    margin-left: 5.99vw;
}

.custom-g-padding{
    margin-left: calc(var(--20px)*4.5);
    padding-right: calc(var(--20px)*4.5);
}

.flex.row.reverse{
    flex-direction: row-reverse;
}


/*end common*/

/*header*/
header{
    height: 63.8vw;
    min-height: 400px;
}

header#accueil{
    height: 100vh;
}

header .container{
    margin-left: 4.69vw;
}

/*left*/
aside{
    min-width: 5.99vw;
}
aside p{
    writing-mode: vertical-rl;
    transform: rotate(-180deg);
    margin-bottom: 12.41vw;
}

aside+div{
    margin-left:5.99vw;
}
/*end left*/

/*menu*/
#nav *{
    transition: all .25s;
}

#nav{
    height:var(--nav-height);
    min-height: 90px;
    z-index: 9;
    transition: height .5s;
}

#nav.full{
    height:100%!important;
}

#nav.opaque {
    height: 13.55vh;
}

#nav+div{
    padding-top: var(--nav-height);
}

#nav .logo{
    width: 8.85vw;
}


#nav menu{
    width: 81%;
}

#nav menu li{
    font-size: var(--p-size);
    width: calc(100% / 4.1);
    position: relative;
}

#nav menu>li:after{
    content: "";
    position: absolute;

    bottom:0;
    left:0;
    width: 100%;
    height: 0;
    background-color: var(--primary-color);
}

#nav menu>li.active:after, #nav menu>li:hover:after{
    height: 0.78vw;
}


#expand-nav-icon {
    min-height: 45px;
    width: 40px;
    max-height: 65px;
    max-width: 75px;
    background: url(../icons/menu.png) center center no-repeat;
}
/*end menu*/

/*cover*/
header>div#cover{
    z-index: -1;
}

header>div#cover:after{
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(255, 255, 255, 0.91);
}

header .cover .mag-desc{
    width: 44.27vw;
}

header .cover .mag-cover{
    width: 31.51vw;
}

header .cover .mag-cover>img{
    box-shadow: -19px 30px 38px 0 rgba(0, 0, 0, 0.25);
    height : calc(100% - var(--icon-small-size) - (3 * var(--20px)))
}



header .cover h1{
    line-height: 9.74vw;
}
/*end cover*/
/*end header*/

/*about*/
.about{
    height: 40vw;
}

.about figure{
    min-width: 38.54vw;
    height: 30.73vw;
    min-height:250px;
}

.about figure+p{
    line-height: 1.56vw;
}
/*end about*/

/*article*/
figure.article{
    height: 31.51vw;
    min-height: 350px;
}
/*end article*/

/*form*/
input, textarea{
    --size: 14px;
    background-color: transparent;
    border-bottom: 1px solid rgba(255,255,255,.35)!important;
}

form legend, p.title{
    --p-size: 1.82vw;
    font-size: var(--p-size);
}

::placeholder{
    color: var(--white-color);
}
/*end form*/

/*citation*/
.citation{
    --p-size: 1.67vw;
    --h3-size: 2.34vw;
    height: 49.38vw;
}

.citation p{
    font-size: var(--p-size);
    line-height: 1.98vw;
}

.citation h3{
    font-size: var(--h3-size);
}

.citation .citation-desc{
    width: 41.41vw;
}
.citation .citation-cover{
    height: 49.48vw;
    width: 38.7vw;
}

.citation.alt .citation-cover{
    height: 38.7vw;
    width: 38.7vw;
}
/*end citation*/

/*ouvrages*/
.ouvrages{
    margin-top: -34vw;
}

.article{
    margin-top: -39vw;
}

.ouvrage{
    height: 29.95vw;
    min-height: 350px;
    margin-bottom: calc(var(--20px)*4);
    width: 21.61vw;
}
/*end ouvrages*/

/*magasine*/
.magasine{
    min-height: 47vw;
    --p-size: 1.66vw;
}
.magasine .desc{
    width: 52.76%;
    line-height: 1.98vw;
    font-size: var(--p-size);
}

.magasine figure{
    width: 31.51vw;
    height: 43.23vw;
    margin-right: calc(var(--20px)*4.5);
    box-shadow: -12px 12px 22px 0 rgba(0, 0, 0, 0.29);
}
/*end magasine*/