/*
Theme Name: FdC
Author: Niels Wehrspann
Author URI: https//www.niels-wehrspann.com
Description: Simple theme developed for La Ferme de la Chapelle, art space in Grand-Lancy/Genève
Version: 1.5.2
Text Domain: FdC
*/


@font-face {
font-family: 'Signo';
	src: url('https://www.fermedelachapelle.ch/wp-content/themes/FdC/fonts/signo-regular.eot');
    src: url('https://www.fermedelachapelle.ch/wp-content/themes/FdC/fonts/signo-regular.woff');
	font-style: normal;
	font-weight: 400;
}

@font-face {
font-family: 'Signo';
	src: url('https://www.fermedelachapelle.ch/wp-content/themes/FdC/fonts/signo-italic.eot');
    src: url('https://www.fermedelachapelle.ch/wp-content/themes/FdC/fonts/signo-italic.woff');
	font-style: italic;
	font-weight: 400;
}

* {box-sizing:border-box; --rightskew:10deg; --leftskew:-10deg}

body {
	margin: 0;
	padding: 0;
	font-size: 2vw;
	color: black;
	background-color: #efefef;
	font-family: Signo, 'Signo', 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
}

@media screen and (min-width: 1200px) { body {font-size:1.9vw;} }
@media screen and (min-width: 1250px) { body {font-size:1.85vw;} }
@media screen and (min-width: 1300px) { body {font-size:1.8vw;} }
@media screen and (min-width: 1350px) { body {font-size:1.75vw;} }
@media screen and (min-width: 1400px) { body {font-size:1.7vw;} }
@media screen and (min-width: 1450px) { body {font-size:1.65vw;} }
@media screen and (min-width: 1500px) { body {font-size:1.6vw;} }
@media screen and (min-width: 1550px) { body {font-size:1.55vw;} }
@media screen and (min-width: 1600px) { body {font-size:1.5vw;} }

p, h1, h2, h3, h4, h5 {font-style:normal; font-weight: 400;}

h1 {font-size:2em; font-weight:normal; line-height:1em; margin:0.5em 0 1em 0; padding:0; letter-spacing: -3px;}
h2 {font-size:2em; font-weight:normal; line-height:1em; margin:0.5em 0 1em 0; padding:0; letter-spacing: -3px;}
p, h4, h5, h6 {font-size:1em; line-height:1.25em; margin:1em 0; padding:0;}
.image_titre p {margin:0;}
h3 {font-size:1.5em; font-weight:normal; line-height:1em; margin:0.5em 0 1em 0; padding:0; letter-spacing: -2px;}

a {text-decoration:none; color:inherit;}
a:hover {border-bottom:2px solid;}
table, table td, .wp-block-table td {border:none;}

#content {width:100%; height:auto; padding:0 3vw;}
.grecaptcha-badge {display:none;}

/* menu */
#menu {width:48vw; padding:0; margin:0 0 2vh 50vw; z-index:50; transform: skewY(var(--rightskew)) translateY(0); position:absolute; display: flex; justify-content: space-between;}
#menu_button {text-align: right; cursor:pointer;}
#menu_button p {text-align:right;}
#menu_button:hover {opacity:0.7;}

#navigation {width:94vw; height:auto; z-index:200; position:fixed; top:15vh; right:3vw; visibility: hidden; padding:0 0 0 1vw; display: flex;}
.navigation_1, .navigation_2, .navigation_3, .navigation_4  {width:50%;}
#navigation_gauche {transform: skewY(var(--leftskew)); display: flex; width:50%;}
#navigation_droite {transform: skewY(var(--rightskew)); display: flex; width:50%;}
#close {cursor: pointer; text-align:right; font-size:1.5em;}
.menu_icons, .navigation_4:after {font-family:Apple Symbols, Arial Unicode, Arial Unicode MS;}
.menu {list-style-type: none; padding:0;}
.menu li {padding:2rem 0 0 0; margin:0; height:inherit; display: block;}
.menu a {height:auto; padding:2rem 0 0 0;}
.current_page_item {color:#888;}
.navigation_4::after {content:'\00d7'; font-weight: 900; display:block; z-index:300; position: absolute; right:0; top:0; padding-top: 4rem; font-size:2.5rem;}
.navigation_4:hover:after {opacity:0.7;}

#overlay {position:fixed; width:100%; height:100%; background-color:#efefef; opacity:0.8; z-index:100; top:0; left:0; visibility: hidden;}
#overlay::after {content: " ";}

#back_button {display:flex; justify-content: space-between; flex-wrap: nowrap; margin-top: 20vh;}
#back_button p, #menu_button p {font-size:1.5em;}
#back_button h2 {text-align: right; font-size:1em; margin:0; padding:1em; letter-spacing: -1px !important;}
#infos_archive h2 {text-align: left; padding: .6em 0 0 0; font-size:1em; letter-spacing: -1px;}


#image_titre {transform: translateY(0);}
#image_titre p {margin:0; padding:0;}
#image_titre video {width:100%; height:95vh; object-fit: cover; object-position: center center; padding:0; margin:0; overflow:hidden;}
.wp-block-video {margin:0;}

.infos_accueil {display: flex; padding:5em 0; margin:0 auto;}
#col_gauche_accueil {width:50vw; transform: skewY(var(--leftskew)) scaleX(1); padding:0 2vw 0 0; }
#col_droite_accueil {width:50vw;  transform: skewY(var(--rightskew)) scaleX(1); padding:5vh 2vw 0 0;}
.lien-inscription {margin:2rem 0 4rem 0;}
.lien-inscription a {color:white; background-color:black; padding:0.5rem 1.5rem 0.75rem 1.5rem; border-radius:2rem; border:0.15rem solid black; transition: all 1s;}
.lien-inscription a:hover {color:black; background-color:white;}

.wp-block-gallery, .gallery {text-align: center; padding:0; margin:15vh 0; position: relative; display:block; }
.wp-block-image, .gallery-item {margin-bottom:4rem !important; position: relative; display: block !important;}
.wp-block-gallery img, .wp-block-image img, .gallery-item img {max-height:90vh; width:auto !important; height:auto !important; max-width:100% !important; display:block !important; text-align:center; margin:auto; }
.gallery-caption, .wp-caption-text, .wp-block-audio figcaption {font-size:0.5em; padding:0.4em 20vw;}
.wp-block-audio figcaption {padding: 0.4em 0;}
.wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image) a, .wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image) img {object-fit:none; padding:0;}
.wp-block-gallery.has-nested-images figure.wp-block-image img {width:inherit; height:inherit; padding:0; }

/* galerie wp 5 */
.wp-block-gallery, .columns-1, .blocks-gallery-grid, .wp-block-embed {display:block;}
.wp-block-gallery .blocks-gallery-item figcaption, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption {font-size:0.5em; padding:0.8em 20vw; background:none !important; color:black; position: relative;}
.wp-block-vimeo-create{margin:15rem 0 0rem 0; padding:0; width:100%;}
.wp-block-vimeo-create figcaption {text-align: center; font-weight: bold; padding: 1rem;}

.sd-social {width:inherit; display:flex; justify-content: center; margin: 3em 0;}
.sd-title {border-top: none !important; font-weight: normal; font-size:0.75em; padding:0.25em 0.5em 0 0; color:#444 !important; letter-spacing: 0px;} 
h3.sd-title::before {border-top:none !important;}
.sd-button {margin:0 0.25vw;}

.page .wpcf7 {width:88vw !important;}

/* archives */
.archives {margin:40vh 0; padding:0 0 0 2vw; display: -webkit-flex; -webkit-flex-wrap: wrap; display: flex; flex-wrap: wrap; align-content: stretch; justify-content: center;  font-size:0.7em;}
.archive {padding:0 2vw 0 0; height: auto; margin:1.5vh 0; width:20%; position:relative; color:white; text-shadow: 1px 0 0 #000, -1px 0 0 #000, 0 1px 0 #000, 0 -1px 0 #000, 1px 1px #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000;}
.small_tags { font-size: 60%; line-height: 130%; height:17vh; letter-spacing: 2px; overflow-y:scroll; -ms-overflow-style: none; scrollbar-width: none;}
.small_tags::-webkit-scrollbar {display:none;}

@media (max-width: 2600px) {
.archive {width:25%;}
}
@media (max-width: 2000px) {
	.archive {width:33%;}
}
@media (max-width: 1400px) {
	.archive {width:50%;}
}
@media (max-width: 800px) {
	.archive {width:100%;}
}

.image_archive {width:100%; height:40vh; margin:0; background-color:black;}
.image_archive img {object-fit: cover; object-position: center center; width: inherit !important; height: inherit !important; opacity:0.7; transition: all 0.5s;}
.archive:hover .image_archive img {opacity:1;}
.archive:hover {color:#00f; cursor:pointer; text-shadow: 1px 0 0 #fff, -1px 0 0 #fff, 0 1px 0 #fff, 0 -1px 0 #fff, 1px 1px #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff;}
.dates_expo {display: flex; position:absolute; top:30%; padding:0 1vw; width:100%;}
.dates_gauche {transform: skewY(var(--leftskew)); text-align: right; flex-basis: 50%; margin:0; padding:0;}
.dates_droite {transform: skewY(var(--rightskew)); flex-basis: 50%; margin:0; padding:0;}
.titres_expo {display:flex; position:absolute; top:60%; width:100%; padding:0 1vw;}
.titre_expo {transform: skewY(var(--leftskew)); width:50%; padding-top:0em; }
.artistes {transform: skewY(var(--rightskew));  width:50%; }
.post-meta-key {display:none;}
.post-meta {list-style-type: none;}
.wp-block-table {margin:1em 0; padding:2vh 0;}
.wp-block-table td {vertical-align: text-top; padding:1em 1em 0 0; line-height: 1.2em;}

/* single */
.single {margin-top:20vh;}
.header_single {display:flex; margin:5vh 0; padding: 0;}
.artistes_single {transform: skewY(var(--leftskew));  width:50%; }
.titre_single {transform: skewY(var(--rightskew)); width:50%; padding-top:0em; }
.contenu_single {display: grid; grid-template-columns: 50% 50%;}
.contenu_single p {grid-column:2; transform: skewY(var(--rightskew));}
.contenu_single p:first-child {grid-column:1; transform: skewY(var(--leftskew)); padding-right:2rem;}

/* lazy */
.contenu_single .wp-block-lazyblock-bloc-gauche {width:47vw; float:left;}
.contenu_single .wp-block-lazyblock-bloc-colonne-droite {width:47vw; float:right;}
.contenu_single .wp-block-lazyblock-bloc-gauche p:first-child {transform: skewY(0deg);}
.contenu_single .wp-block-lazyblock-bloc-gauche p, .contenu_single .wp-block-lazyblock-bloc-colonne-droite p {transform: skewY(0deg); width:100%;}
.contenu_single .wp-block-gallery {clear: both;}

.contenu_single figure, .contenu_single .gallery {grid-column: 1 / span 2; width:100%;}
.wp-block-audio {text-align: center;}
.contenu_single .gallery {clear:both; padding-top:5vh;}
.contenu_single::after {content: "";}

/* single images au cas où */
.contenu_single .alignnone, .contenu_single .alignleft, .contenu_single .alignright, .contenu_single .aligncenter {padding:0; margin:5em 0 0 0; width:94vw; height:auto; max-height:90vh; text-align: center; clear:both; object-fit: contain !important; object-position: center;}
.wp-block-gallery.aligncenter.columns-1 {max-height:inherit;}

/* index */
.page {padding:0 2.9vw; margin:10em 0 5em 0; display:flex; flex-wrap: wrap;}
.contenu_page_g {width:50%; transform: skewY(var(--leftskew)); padding-right:2vw;}
.contenu_page_d {width:50%; transform: skewY(var(--rightskew)); padding-left:1vw;}
.wp-block-lazyblock-bloc-gauche {flex-basis:50%; transform: skewY(var(--leftskew)); padding-right:2vw;}
.wp-block-lazyblock-bloc-colonne-droite {flex-basis:50%; transform: skewY(var(--rightskew)); padding-left:1vw;}
.image_page {width:94vw; height:94vh; position: relative; left:3vw; margin-bottom:5vw; clear:both;}
.image_page img {object-fit: contain; object-position: center center; height:100%; width:100%;}

/* sidebar */
.sidebar, #back_button {margin-left:1.5vw; width:49vw; transform: skewY(var(--leftskew)) scaleX(1); padding:0; color: black !important; z-index:10; height:0;}
.sidebar {position:absolute;}

#back_button {margin-left:2vw;}
#back_button a:hover {border-bottom: none; text-decoration: none;}
.widget_polylang ul {list-style-type: none; display:flex; margin-left:-2vw;}
.widget_polylang li { margin-right:1em; padding:0.4em 0.5em; width:1.75em; font-size:1em; border: 2px solid #efefef;}
.widget_polylang li:hover {border:2px solid black !important; border-radius: 4em;}
.current-lang {border:2px solid black !important; border-radius: 4em;}
.sidebar a:hover, .widget-area a:hover {border-bottom: none;}

#image_titre, #sidebar, #menu, #content, #footer_g, #footer_d {transition: all 1s;}

/* footer */
#footer_wrap {margin:20em auto 5em auto; padding:0; display: flex; width:94vw; font-size:0.7em;}
#footer_wrap_accueil {margin:-50vh auto 5em auto; padding:0; display: flex; width:94vw; font-size:0.7em;}
#footer_g {transform: skewY(var(--rightskew)); display: flex; flex-basis: 50%; padding-top:0.5em;}
#footer_d {transform: skewY(var(--leftskew)); display: flex; flex-basis: 50%;}
#footer_g div, #footer_d div {flex-basis: 50%;}
.fb_footer::before {content:url('https://fermedelachapelle.ch/wp-content/themes/FdC/images/fb.svg'); height:auto; width:1em; display:inline-block;}
.ig_footer::before {content:url('https://fermedelachapelle.ch/wp-content/themes/FdC/images/ig.svg'); height:auto; width:1em; display:inline-block;}
footer p {line-height:1.5em; margin:0;}

#legal {width:94vw; height:94vh; position:fixed; left:3vw; top:3vh; z-index:30; background-color:white; padding:5vh 5vw; display:none; cursor:se-resize;}
#legal_button {cursor:nw-resize;}
#legal_button p {width:8em;}
#legal_button p:hover {border-bottom:2px solid;}
#newsletter {width:94vw; height:94vh; position:fixed; left:3vw; top:3vh; z-index:30; background-color:white; padding:5vh 5vw; display:none;}
#lien_newsletter:hover {border-bottom:2px solid;}
#lien_newsletter {cursor:nw-resize; margin-top:1em;}
#close_newsletter {position:fixed; right:5vw; top:4vh; cursor:se-resize; font-size:2em;}
.wpcf7-form p {font-size:4vh; margin-top:4vh; line-height: 1.5em;}
.wpcf7-form input {font-size:inherit; font-family: 'Signo'; height:auto; border:0.15em solid; width:100%; padding:0.5em;}
.wpcf7-submit:hover {background-color:black; color:white;}
.wpcf7-submit {background-color:white; color:black;}
div.wpcf7-mail-sent-ok {color:green; padding:0.5em; margin:0;}


@media (max-width: 800px) and (orientation:portrait) {
	body {font-size: 5vw;}
	p {line-height: 1.4em;}
	#image_titre video {height:50vh;}
	
	
	/* menu */
	#menu {width:44vw; margin-left:49vw; overflow:hidden;}
	#menu_button {padding-right:1vw;}
	#navigation {font-size:150%;}
	#navigation_gauche, #navigation_droite {display:block; width:50vw;}
	.navigation_1, .navigation_2, .navigation_3, .navigation_4  {width:100%;}
	#back_button {margin-top:5vh;}
	#back_button h2, #infos_archive h2 {font-size:60%; letter-spacing:0 !important;}
	#back_button h2 {padding-top:6.5vh;}
	#infos_archive h2 {padding-top:6vh;}
	.sidebar {margin-left:-3vw;}
	.navigation_4::after {right:0; top:auto; bottom:0; padding-top: 0; font-size:3rem;}
	
.infos_accueil {display:block; padding:5em 0; margin:2em 0 0 0;}
#col_gauche_accueil {width:auto; transform: skewY(0deg) scaleX(1); }
#col_droite_accueil {width:auto;  transform: skewY(0deg) scaleX(1);}

.contenu_single {display: grid; grid-template-columns: 100%;}
.contenu_single p {grid-column:1;}
.contenu_single p:first-child {grid-column:1; padding-right:0;}
.contenu_single p, .contenu_single p:first-child {width:100%; transform: skewY(0deg);}

	.archives {margin:30vh 0;}
	.archive {height:50vh; line-height:1.5em;}
	.image_archive {height:100%;}
	.image_archive img {opacity:1;}
	.artistes {padding-left:1vw;}
	.titres_expo {letter-spacing: 1px;}
	.single {margin-top:30vh;}
	.header_single {display:block;}
	.artistes_single, .titre_single {width:100%; transform: skewY(0deg);}
	.titre_single {font-style: italic;}

	
	.contenu_single .wp-block-lazyblock-bloc-gauche {width:94vw; float:none;}
.contenu_single .wp-block-lazyblock-bloc-colonne-droite {width:94vw; float:none;}
	
	.page {display: block; margin-bottom:10em;}
	.contenu_page_g, .contenu_page_d {transform:skewY(0deg); width:100%;}
	.wp-block-lazyblock-bloc-gauche {flex-basis:10%; transform: skewY(0deg); padding-right:2vw; display:block; clear:both;}
.wp-block-lazyblock-bloc-colonne-droite {flex-basis:100%; transform: skewY(0deg); padding-left:0vw; padding-right:2vw; clear:both;}
	.image_page {margin-bottom:0;}


	.wp-block-gallery img, .wp-block-image img {max-height:50vh;}
	.wp-block-gallery .blocks-gallery-item figcaption, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption {font-size:0.7em;}


	

	#footer_wrap {margin-top:0em;}
	#footer_g {transform: skewY(var(--rightskew)); display: block; flex-basis: 50%; padding-top:0.5em; padding-right:2vw;}
#footer_d {transform: skewY(var(--leftskew)); display: block; flex-basis: 50%;}
#footer_g div, #footer_d div {flex-basis: 50%;}
	
	#legal {font-size:.75em;}
	#close_newsletter {right:5vw; top:3vh;}
	div.wpcf7-mail-sent-ok {font-size:50%;}
	
}