/*
	Theme Name: Psychydre
	Theme URI: http://wordpress.org/
	Description: Th&egrave;me graphique de <a href="http://psychydre.com/">Psychydre.com</a>.
	Version: 1
	Author: Alexandre ZICLER
	Author URI: http://kerozen.studio/
	Tags: variations, art
*/

@font-face {
    font-family: 'Euphorigenic';
    src:url('fonts/euphorigenic.ttf') format('truetype');
    font-display: swap;
}
@font-face {
    font-family: 'Qlassik';
    src:url('fonts/qlassik.ttf') format('truetype');
    font-display: swap;
}
@font-face {
    font-family: 'Evy';
    src:url('fonts/evy.ttf') format('truetype');
    font-display: swap;
}

body {
    font-family: 'Qlassik';
    padding:0; margin:0;
}

img {
    max-width:100%;
    height:auto;
}


/* Nav elements */

#menuButton {
    cursor:pointer;
    position:fixed; top:.5rem; left:.5rem;
    width:8vh; height:8vh;
    background:url("img/menuButtons.png") no-repeat;
    background-size:300% 100%;
    z-index:200;
}
#menuButton:hover { width:8.2vh; height:8.2vh; top:.4rem; left:.4rem; }

footer {
    display:none;
    position:fixed; top:0; left:0;
    width:17rem; height:100vh; overflow:auto; padding:0rem 1rem 1rem 1rem;
    font-size:1.2rem; line-height:1.1rem;
    background: linear-gradient(90deg, rgb(28, 28, 28), rgba(0, 0, 0, 0.95));
    border-right:1px solid rgb(201, 184, 88);
    box-shadow: 6px 0px 7px -2px rgba(0, 0, 0, 0.5);
    z-index:201;
}
footer a { color:white; }
footer a:hover, footer li { color:rgb(218, 198, 85); text-decoration:none; }
footer ul, footer li { margin:0; padding:0; }
footer li { list-style-type: none;  width:100%; margin:0 auto; margin-bottom:1px; text-align:center; }
footer a:hover::before {content: "••• "; font-weight:bold; }
footer a:hover::after {content: " •••";font-weight:bold; }
footer ::selection, #contactForm ::selection { background:rgb(163, 155, 107); color:black; }

footer .lastPosts a, #menuContact { color:rgb(180, 180, 130); display:block;; }
footer .lastPosts a:hover, #menuContact:hover { color:inherit; }
footer .lastPosts a { padding:0 0 .75rem 0; }
#menuContact { padding:.5rem 0 0 0; }

#menuLogo span { display:none; }
#menuLogo {
    margin:0 auto; width:12rem; height:12rem;
    display:block; background: url("img/logoFull.png") no-repeat center center;
    background-size:contain;
}
#closeMenu, #closeContact {
    position:absolute; display:block; width:1.75rem; height:1.75rem;
    background:none; border:1px solid; border-radius:7px;
    font-size:1.1rem; color: rgb(82, 82, 82); font-weight:bold;
    cursor:pointer;
}
#closeMenu { left:16.5rem; top:1rem; }
#closeContact { right:1rem; top:1rem; }
#closeMenu:hover, #closeContact:hover { color:rgb(218, 198, 85); }
    
h3.navMenuTitle {
    display:block; margin:0 auto; text-align:center; text-transform:uppercase; font-size:.9rem; letter-spacing:.5rem;
    margin-top:2rem; margin-bottom:1rem; padding:.4rem 0 .5rem 0; border-bottom:1px solid rgb(39, 39, 39);
    color:rgb(66, 66, 66);
}

#navMenuSubPageList li { margin:0; }
#navMenuSubPageList a { font-size:1.2rem; line-height:1rem; }
.navMenuChildCategories { padding:0rem 1rem 0rem .5rem; }
.parentCat { margin:1rem 0 .2rem .8rem; font-weight:bold; text-transform:uppercase; font-size:1rem; }
.parentCat::before { content:"••• "; }
.childCat { text-transform:uppercase; font-size:.9rem; }
.childCat::before { font-size:.9rem; content:"┕━ "; padding-left:.2rem; }
.treeview li { text-align:left; width:auto; }
.treeview a:hover::before { content:""; }
.level1 { margin-left:1.5rem; }
.level2 { margin-left:.1rem; }
.selected { text-shadow:0 0 .5rem #A98537; }
.selected::after { content:" •••"; }


#contact {
    border:none; width:600px; max-width:90vw; height:425px; display:block; margin:0 auto;
}
#contactForm {
    width:100vw;
    position:fixed; top:0;
    background: linear-gradient(180deg, rgba(19, 19, 19, 0.99), rgba(0, 0, 0, 0.99));
    border-bottom:1px solid rgb(201, 184, 88); 
    z-index:300; display:none;
    box-shadow: 0px 5px 3px -2px rgba(0, 0, 0, 0.5);
}


#scrollToTop {
    position:fixed; bottom:1vh; right:1vw; z-index:300;
    font-size:2rem; width:2rem; aspect-ratio:1/1; text-align:center;
    transform: rotate(-90deg);
    cursor:pointer;
}


#breadcrumb, #subPages {
    display:block; color:#397A9B;
    margin:0 auto; margin-top:-1.5rem; margin-bottom:.5rem;
}
#subPages ul {
    list-style: none;
    margin: 0; padding: 0;
    text-align:center;
}
#subPages li { display:inline-block; }
#subPages li:not(:last-child)::after {  margin: 0 .25rem 0 .5rem; content: "|"; }
#breadcrumb { text-align:center; width:95%; }
#breadcrumb .post { background:none; box-shadow:none; font-size:inherit; padding:0; }



.gallery-size-thumbnail{ padding:0; margin:0; }
.gallery-item{
    width:33%;
    display:inline-block;
    text-align:center;
    margin:2px 0 2px 0;
}
.gallery-caption{ display:none; }
.gallery-item a img{
    border-radius:1rem;
    box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.25);
    box-sizing: border-box;
    padding: 1px;
}
.gallery-item a :hover{ animation: bounce .4s 1; }
@keyframes bounce { 0% {transform: translateY(0);} 50% {transform:translateY(-3px);} 100% {transform:translateY(0);} }





@media screen and (orientation: portrait){

    .gallery-item    { width:50%; }
    .gallery-columns-9 .gallery-item:nth-child(9n+9),
    .gallery-columns-7 .gallery-item:nth-child(7),
    .gallery-columns-5 .gallery-item:nth-child(5),
    .gallery-columns-3 .gallery-item:nth-child(3),
    .gallery-columns-1 .gallery-item:nth-child(1) {
        width: 100%;
    }

    #breadcrumb, #subPages { font-size:.8em;padding-top:1rem; }
}