/*!
Theme Name: Cécile Palusinski v1.2
Theme URI: https://www.cecilepalusinski.com/
Author: Michel Ravey
Author URI: https://www.michelravey.com/
Description: Cécile Palusinski | auteure
Version: 1.2.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: cecilepalusinski
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

cecilePalusinski is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

body { margin:0; }
div {
	box-sizing: border-box;
	border: solid 0px #d0b7ea;
}
.clear { clear:both; }
::-webkit-scrollbar { display:none; }

/*
///////////////////////////////// 		


HEADER


///////////////////////////////// 	
*/

#logotype {
	position: fixed;
	top: 0;left: 40px;
	height: 100px;
	display: flex;
	align-items:center;
	z-index: 10000;
}
#logo {
	position: relative;display: inline-block;
	top: -3px;margin-right: 12px;
	width: 24px;height: 24px;
	background-image: url(imgs/logo-cecile-palusinski-2B.svg);
	background-position:  center center;
	background-size: contain;
	background-repeat: no-repeat;
}
/* .logotype-name { */
h1 {
	display: inline;
	font-family: 'Bagnard';
	font-size: 24px;
}
h1 a {
	text-decoration: none;
	transition:  all 0.2s ease-in;
}
h1 a:link, h1 a:visited { color:#000; }
h1 a:hover, h1 a:active { color:#000; }

.logotype-quality {
	font-family: "nocturne-serif", serif;
	font-weight: 400;
	font-style: normal;
	font-size: 22px;
	color: #e56a6b;
}

#nav {
	position: fixed;
	top: 0;right: 0px;
	height: 100px;
	padding-right: 40px;
	z-index: 10000;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 40px;
}
.nav-element {
	position: relative;
	margin-top: 6px;
	font-family: "nocturne-serif", serif;
	font-weight: 600;
	font-style: normal;
	font-size: 12px;
	text-transform: uppercase;
}
.nav-element a {
	text-decoration: none;
	transition:  all 0.3s ease-in;
}
.nav-element a:link, .nav-element a:visited { color:#000; }
.nav-element a:hover, .nav-element a:active { color:#f22d44; }

.nav-element-current a:link, .nav-element-current a:visited { color:#f22d44; }
.nav-element-current a:hover, .nav-element-current a:active { color:#f22d44; }


#header-box {
	position: fixed;
	z-index: 9000;
	background-color: #fff;
	border-bottom: solid 1px #FCD5C1;
	top: 0px;left: 40px;
	width:  calc(100% - 80px);height: 100px;
}



#menu-hamburger {
  position:fixed;
  right:18px;top:10px;
  width:80px;height:80px;
  background:transparent;
  z-index:150000;
  display: none;
}
#menu-container {
	position: fixed;
	top: 100px;
	width: 100vw;height: calc(100vh - 100px);
	overflow-y: auto;
	background-color: #fff;
	z-index: 8500;
	display: none;
	padding: 80px 20px 80px 50px;
}
.menu-smartphone-element {
	position: relative;
	margin-bottom: 16px;
	font-family: "nocturne-serif", serif;
	font-weight: 500;
	font-style: normal;
	font-size: 28px;
	text-transform: uppercase;
}
.menu-smartphone-element a {
	text-decoration: none;
	transition:  all 0.3s ease-in;
}
.menu-smartphone-element a:link, .menu-smartphone-element a:visited { color:#000; }
.menu-smartphone-element a:hover, .menu-smartphone-element a:active { color:#f22d44; }

.nav-element-current a:link, .nav-element-current a:visited { color:#f22d44; }
.nav-element-current a:hover, .nav-element-current a:active { color:#f22d44; }

/*
///////////////////////////////// 		


INDEX


///////////////////////////////// 	
*/


#features {
	position: fixed;
	width: 100vw;height: 100vh;
	top: 0;left: 0;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	z-index: 5000;
	padding-left: 40px;
}
#features-content {
	margin-top: -40px;
	font-family: 'Bagnard';
	font-size:64px;
	line-height: 1.8em;
}
#features-content a {
	text-decoration: none;
	transition:  all 0.3s ease-in;
	color: #fff;
}
#features-content a:link, #features-content a:visited { opacity:1; }
#features-content a:hover, #features-content a:active { opacity: 0.5; }






#index-video {
	position: fixed;
	width: 100vw;height: 100vh;
	left: 0vw;top: 0vh;
	z-index: 1000;
}
video {
	object-fit: cover;
	width: 100%;height: 100%;
}
#index-gradient-top {
	position: fixed;
	width: 100vw;height: 100vh;
	left: 0vw;top: 0vh;
	/* fbacb4 ->  */
	background: rgb(251,172,180);
	background: linear-gradient(180deg, rgba(251,172,180,1) 10%, rgba(255,255,255,0) 100%);
	opacity: 0.2;
	z-index:  2000;
}

#index-gradient-bottom {
	position: fixed;
	width: 100vw;height: 100vh;
	left: 0vw;top: 0vh;
	/* fc8b5e -> 252,139,94 */
	background: rgb(252,139,94);
	background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(252,139,94,1) 90%);
	mix-blend-mode: multiply;
	-webkit-mix-blend-mode: multiply;
	-moz-mix-blend-mode: multiply;
	opacity: 0.2;
	z-index:  2000;
}





#index-footer {
	position: fixed;
	right: 40px;bottom: 40px;
	z-index: 10000;
	font-family: "nocturne-serif", serif;
	font-weight: 400;
	font-style: normal;
	font-size: 12px;
	text-transform: uppercase;
	color: #fc8b5e;
}
.index-footer-sep {
	font-weight: 900;
	color: #e56a6b;
}
#index-footer a {
	text-decoration: none;
	transition:  all 0.2s ease-in;
}
#index-footer a:link, #index-footer a:visited { color:#fc8b5e; }
#index-footer a:hover, #index-footer a:active { color:#f22d44; }


#ambiance {
	position: fixed;
	bottom: 40px;left: 40px;
	width: 40px;height:40px;
	z-index: 900000;
	opacity: 0.8;
	transition: all 0.2s ease-in;
	cursor: pointer;
}
#ambiance:hover { opacity:1; }

#play-pause { position:relative;float:left;width:40px;height:100%; }
.play { 
	position:absolute;top:0;left:0;width:100%;height:100%;
	background-image:url(imgs/play.svg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size:contain;
	cursor: pointer;
}
.pause { 
	position:absolute;top:0;left:0;width:100%;height:100%;
	background-image:url(imgs/pause.svg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size:contain;
	cursor: pointer;
	display:none;
}





/*
///////////////////////////////// 		


TEMPLATES


///////////////////////////////// 	
*/
p { margin:10px 0; }

h2 {
	font-family: 'Bagnard';
	font-size: 72px;	
	color: #f55a5b;
	margin: 0;
	line-height: 1.1em;
}
h2.orange { color:#fc8b5e; }
.article h2 {
	font-family: "amster", serif;
	font-weight: 700;
	font-style: normal;
	font-size: 72px;	
	color: #000;
	margin: 0;
	line-height: 1.1em;
	
}
h3 {
	font-family: "amster", serif;
	font-weight: 700;
	font-style: normal;
	font-size: 48px;	
	color: #000;
	margin: 0 0 20px 0;
	line-height: 1.1em;
}
h3.ateliers { font-size:36px; }
h3.actualites { font-size:30px; }
h3 a { 
	text-decoration: none;
	transition: all 0.2s ease-in;
}
h3 a:link, h3 a:visited { color:#000; }
h3 a:hover, h3 a:active { color:#e56a6b; }
h4 {
	font-family: "nocturne-serif", serif;
	font-weight: 600;
	font-style: normal;
	font-size: 24px;	
	color: #f22d44;
	margin: 0;
}
h5 {
	font-family: "nocturne-serif", serif;
	font-weight: 500;
	font-style: normal;
	font-size: 20px;
	color: #000;
	margin: 0;
}

#content {
	position: relative;margin: 0 auto;
	margin-top: 180px;
	width: calc(100% - 160px);
	/*max-width: 1120px; */
	min-height: 600px;
}
#content-title { max-width:740px; }
#content-back-home {
	position: absolute;
	top: 40px;right: 0;
	height: 20px;
	display: flex;
	align-items: center;
	font-family: "nocturne-serif", serif;
	font-weight: 400;
	font-style: normal;
	text-transform: uppercase;
	font-size: 10px;
	color: #fc8b5e;
}
#content-back-home-2 {
	position: relative;
	margin-top: 80px;
	height: 20px;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	font-family: "nocturne-serif", serif;
	font-weight: 400;
	font-style: normal;
	text-transform: uppercase;
	font-size: 10px;
	color: #fc8b5e;
}
#content-back-home a, #content-back-home-2 a 
 { text-decoration: none;transition:all 0.2s ease-in; }
#content-back-home a:link, #content-back-home a:visited,
#content-back-home-2 a:link, #content-back-home-2 a:visited
 { color:#fc8b5e; }
#content-back-home a:hover, #content-back-home a:active,
#content-back-home-2 a:hover, #content-back-home_2 a:active { color:#f22d44; }

#back-arrow {
	position: relative;display: inline-block;
	width: 15px;height: 7;margin-right: 20px;
}
.content-title-sep {
	position: relative;
	margin: 40px 0 80px 0;
	width: 100px;height: 4px;
	background-color: #fbacb4;
	opacity: 0.3;
}
.content-item-unavailable {
	position: relative;
	margin-top: 20px;
	font-family: magneta, serif;
	font-weight: 200;
	font-style: normal;
	font-size: 24px;
	color: #000;
	line-height: 1.2em;
}
.content-item-subhead {
	font-family: magneta, serif;
	font-weight: 200;
	font-style: italic;
	font-size: 24px;
	color: #f22d44;
	line-height: 1.2em;
	max-width: 1120px;
}

.content-cols {
	position: relative;
	width: 100%;
	max-width: 1120px;
	display: flex;
	flex-flow:  row nowrap;
	margin-top: 40px;
	padding-bottom: 40px;
}
.content-col:nth-child(1) { padding-right:20px; }
.content-col:nth-child(2) { padding-left:20px; }
.content-col.col-img { width:50%; }
.col-img img { width:100%; }
.content-col.col-txt { 
	width: 50%;
	font-family: magneta, serif;
	font-weight: 200;
	font-style: normal;
	font-size: 18px;
	text-align: justify;
}
.content-col.col-empty { 
	display: flex;
	align-items: flex-end;
}

.content-col a { 
	text-decoration: none;
	transition: all 0.2s ease-in;
	/* font-size: 12px; */
}
.content-col a:link, .content-col a:visited { color:#fc8b5e; }
.content-col a:hover, .content-col a:active { color:#f22d44; }


.button {
	position: relative;
	width: fit-content;
	margin-top: 40px;
	padding: 16px 20px;
	font-family: "nocturne-serif", serif;
	font-weight: 600;
	font-style: normal;
	font-size: 20px;
	color: #f55a5b;
	text-transform: uppercase;
	border: solid 2px #fbacb4;
	transition: all 0.2s ease-in;
	cursor: pointer;
}
.button:hover {
	color: #f22d44;
	border: solid 2px #fc8b5e;

}
.button a { text-decoration: none;font-size: 20px; }
.button a:link, .button a:visited { color:#e56a6b; }
.button a:hover, .button a:active { color:#f22d44; }



/*
///////////////////////////////// 		


POÉSIE hors les livres


///////////////////////////////// 	
*/

#content-poesie-hors-les-livres {
	width: 100%;
	font-family: magneta, serif;
	font-weight: 200;
	font-style: normal;
	font-size: 18px;
}
#content-poesie-hors-les-livres img {
	width: 100%;
}
#content-poesie-hors-les-livres a { 
	text-decoration: none;
	transition: all 0.2s ease-in;
	/* font-size: 12px; */
}
#content-poesie-hors-les-livres a:link, #content-poesie-hors-les-livres a:visited { color:#fc8b5e; }
#content-poesie-hors-les-livres a:hover, #content-poesie-hors-les-livres a:active { color:#f22d44; }



/*
///////////////////////////////// 		


OUVRAGES


///////////////////////////////// 	
*/




.ouvrage-contenu, .ouvrage-contenu2 {
	position: relative;
	border: solid 0px lightgrey;
	width: 80%;margin: 0 auto;
}

#ligne { position: relative;width: 100%;border: solid 0px yellow; }
#ligne div {  }
.element-5 { 
	position:relative;display:flex;align-items:center;justify-content: center;
	padding:20px;float:left;width:19%;height: 300px;
	margin: 5px 0.5%;
	border:solid 0px purple; 
}
.element-4 { 
	position:relative;display:flex;align-items:center;justify-content: center;
	padding:20px;float:left;width:24%;height: 300px;
	margin: 5px 0.5%;
	border:solid 0px red;
}
.element-3 { 
	position:relative;display:flex;align-items:center;justify-content: center;
	padding:20px;float:left;width:32.33%;height: 300px;
	margin: 5px 0.5%;
	border:solid 0px orange; 
}
.element-2 { 
	position:relative;display:flex;align-items:center;justify-content: center;
	padding:20px;float:left;width:49%;height: 320px;
	margin: 5px 0.5%;
	border:solid 0px yellow; 
}
.element-1 { 
	position:relative;display:flex;align-items:center;justify-content: center;
	padding:20px;float:left;width:98%;height: 350px;
	margin: 5px 0.5%;
	border:solid 0px lightgrey; 
}

.ouvrage-contenu div {
	background-color: #fffaf8;
	background-position: center top;
	background-size: contain;
	background-repeat: no-repeat;
	cursor: pointer;
	display: flex;
	flex-flow: column nowrap;
	justify-content: center;
	line-height: 1.3em;
	/*
	font-family: magneta, serif;
	font-weight: 400;
	font-style: normal;
	*/
	font-family: "nocturne-serif", serif;
	font-weight: 600;
	font-style: normal;
	
	font-size: 12px;
	text-transform: uppercase;
}
.ouvrage-contenu img {
	max-height: 250px;
	max-width: 110%;
}
.ouvrage-contenu a { text-decoration: none; }
.ouvrage-contenu a:link, .ouvrage-contenu a:visited { color:#000; }
.ouvrage-contenu a:hover, .ouvrage-contenu a:active { color:#444; }

.ouvrages_dispo { font-size:10px;color:#999; }


.content-gallery {
	position: relative;
	margin-top: 40px;
	width: 100%;
	display: flex;
	flex-flow: row wrap;
}
.content-thumb {
	width: 20%;
	padding: 0 1%;
	margin: 10px 0;
	cursor: pointer;
}
.content-thumb img { width:100%; }








/*
///////////////////////////////// 		


ATELIERS


///////////////////////////////// 	
*/



.atelier-col { 
	width: 50%;
	font-family: magneta, serif;
	font-weight: 200;
	font-style: normal;
	font-size: 18px;
}
.atelier-col:nth-child(1) { 
	text-align: justify;
	width: 60%;padding-right:20px; 
}
.atelier-col:nth-child(2) { 
	width: 40%;margin-left: 20px;padding:20px; 
	background-color: #FFF4F1;
	height: fit-content;
}

.atelier-col a { 
	text-decoration: none;
	transition: all 0.2s ease-in;
	font-size: 12px;
}
.atelier-col a:link, .atelier-col a:visited { color:#fc8b5e; }
.atelier-col a:hover, .atelier-col a:active { color:#f22d44; }

.atelier-sep {
	position: relative;
	margin: 40px 0 80px 0;
	width: 200px;height: 2px;
	background-color: #fc8b5e;
	opacity: 0.3;
}
.atelier-col ul { margin:0;padding:16px; }
.atelier-col li { padding-bottom:7px; }
.atelier-col li::marker {
	color: #fbacb4;
}




/*
///////////////////////////////// 		


ACTUALITES


///////////////////////////////// 	
*/

.actualite-date {
	position: relative;
	margin-bottom: 16px;
	font-family: "nocturne-serif", serif;
	font-weight: 600;
	font-style: normal;
	font-size: 16px;
	color: #fc8b5e;
	text-transform: uppercase;
}
.article .actualite-date { margin-top:20px; }
.actualite-sep {
	position: relative;
	margin: 40px 0 40px 0;
	width: 50px;height: 2px;
	background-color: #fbacb4;
	opacity: 0.3;
}









/*
///////////////////////////////// 		


BIO


///////////////////////////////// 	
*/


.content-bio {
	margin-top: 80px;
	text-align: justify;
	text-justify: inter-word;
     -webkit-columns: 2;
     -moz-columns: 2;
          columns: 2;
  	-moz-column-fill: balance;
       	column-fill: balance;
      column-gap: 80px;
      max-width: 1120px;
    font-family: magneta, serif;
	font-weight: 200;
	font-style: normal;
	font-size: 18px;
}
.content-bio img { width:100%;margin-bottom:40px; }
.content-bio a { 
	text-decoration: none;
	transition: all 0.2s ease-in;
}
.content-bio a:link, .content-bio a:visited { color:#fc8b5e; }
.content-bio a:hover, .content-bio a:active { color:#f22d44; }


.circles {
	background: transparent;
	
}
div#conteneur { 
    width:99%;
    height:99%;
    position:absolute;
    top: 0;left: 0;
    z-index: 99;
    border: solid 0px orange;
}
div.move {

    position: absolute;width: 200px;height: 200px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    background-repeat: no-repeat; 
    background-size:contain;
    border: solid 0px red;
    display: flex;justify-content: center;align-items: center;text-align: center;
    mix-blend-mode: screen;
	-webkit-mix-blend-mode: screen;
	-moz-mix-blend-mode: screen;
	opacity: 0.3;
	/*
	font-family: "nocturne-serif", serif;
	font-weight: 600;
	font-style: normal;
	*/
	font-family: 'Bagnard';
	font-size: 24px;
	cursor: pointer;
	transition: opacity 0.1s ease-in;
	-webkit-transition: opacity 0.1s ease-in;
	-moz-transition: opacity 0.1s ease-in;
	padding: 1.5rem;
}
div.move:hover { opacity:5; }
.green { background-color:#f22d44; }
.yellow { background-color:#f55a5b; }
.red { background-color:#fc8b5e; }








/*
///////////////////////////////// 		


CONTACT


///////////////////////////////// 	
*/


.content-contact {
	margin-top: 80px;
	text-align: justify;
	text-justify: inter-word;
     -webkit-columns: 2;
     -moz-columns: 2;
          columns: 2;
  	-moz-column-fill: balance;
       	column-fill: balance;
      column-gap: 80px;
      max-width: 560px;
    font-family: magneta, serif;
	font-weight: 200;
	font-style: normal;
	font-size: 18px;
}
.content-contact img { width:100%;margin-bottom:40px; }
.content-contact a { 
	text-decoration: none;
	transition: all 0.2s ease-in;
}
.content-contact a:link, .content-contact a:visited { color:#fc8b5e; }
.content-contact a:hover, .content-contact a:active { color:#f22d44; }








/*
///////////////////////////////// 		


NEWSLETTER


///////////////////////////////// 	
*/


.content-newsletter {
	width: 560px;
	margin-top: 80px;
	text-align: justify;
	text-justify: inter-word;
      max-width: 560px;
    font-family: magneta, serif;
	font-weight: 200;
	font-style: normal;
	font-size: 18px;
}
.content-newsletter img { width:100%;margin-bottom:40px; }
.content-newsletter a { 
	text-decoration: none;
	transition: all 0.2s ease-in;
}
.content-newsletter a:link, .content-newsletter a:visited { color:#fc8b5e; }
.content-newsletter a:hover, .content-newsletter a:active { color:#f22d44; }








/*
///////////////////////////////// 		


FOOTER


///////////////////////////////// 	
*/



#footer {
	position: relative;
	margin-top: 40px;
	height: 267px;
	border: solid 0px tomato;
}
#footer-bg {
	position: absolute;
	z-index:500;
	top: -20px;right: 0;
	width: 720px;height: 240px;
	background-image: url(imgs/branches4.svg);
	background-position:  right top;
	background-size: contain;
	background-repeat: no-repeat;
}

#footer-bg.orange {
	background-image: url(imgs/branches4-variante-couleur.svg);
}
#footer-navBar {
	position: absolute;
	bottom: 0;
	z-index: 1000;
	height: 60px;width: 100%;
	background-color: #f55a5b;
}
#footer-navBar.orange { background-color: #fc8b5e; }
#footer-nav {
	position: absolute;
	top: 127px;right: 0px;
	height: 100px;
	padding-right: 32px;
	z-index: 2000;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 24px;
}
#footer-nav .nav-element { 
	background-color:#fff;padding:3px 8px; 
	opacity: 0.9;
}
#footer #logo { display:none; }
#footer-logo {
	position: absolute;z-index: 2500;
	left: 40px;bottom: 30px;
	width: 100px;height: 100px;
	background-image: url(imgs/logo-cecile-palusinski-rose.svg);
	background-position:  center center;
	background-size: contain;
	background-repeat: no-repeat;
	transition: all 0.4s ease-in;
}
#footer-logo.orange { background-image: url(imgs/logo-cecile-palusinski-2B.svg); }
#footer-name { 
	position: absolute;
	bottom: 16px;left: 80px;
	z-index: 2500;
	transition: all 0.4s ease-in;
}
#footer-name .logotype-quality { 
	position: relative;display: inline;top: -1px;left: -1px;
	color:#fbacb4; }
#footer-name .logotype-quality.orange { color: #f55a5b; } 	
#footer-legal {
	position: absolute;
	right: 40px;bottom: 20px;
	z-index: 10000;
	font-family: "nocturne-serif", serif;
	font-weight: 400;
	font-style: normal;
	font-size: 12px;
	text-transform: uppercase;
	color: #fbacb4;
}
#footer-legal.orange { color: #fff; } 	  
.footer-legal-sep {
	font-weight: 900;
	color: #fbacb4;
}
#footer-legal a {
	text-decoration: none;
	transition:  all 0.2s ease-in;
}
#footer-legal a:link, #footer-legal a:visited { color:#fbacb4; }
#footer-legal a:hover, #footer-legal a:active { color:#fff; }

#footer-legal.orange a:link, #footer-legal.orange a:visited { color:#fff; }
#footer-legal.orange a:hover, #footer-legal.orange a:active { color:#fff; }