﻿@charset "utf-8";
@font-face {
font-family: 'Century Gothic';
src: url("fonts/CenturyGothic.eot");
src: local('Century Gothic'), local('CenturyGothic'), url("fonts/CenturyGothic.eot?#iefix") format('embedded-opentype'), url("fonts/CenturyGothic.woff2") format('woff2'), url("fonts/CenturyGothic.woff") format('woff'), url("fonts/CenturyGothic.ttf") format('truetype');
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Century Gothic';
src: url("fonts/CenturyGothic-Bold.eot");
src: local('Century Gothic Bold'), local('CenturyGothic-Bold'), url("fonts/CenturyGothic-Bold.eot?#iefix") format('embedded-opentype'), url("fonts/CenturyGothic-Bold.woff2") format('woff2'), url("fonts/CenturyGothic-Bold.woff") format('woff'), url("fonts/CenturyGothic-Bold.ttf") format('truetype');
font-weight: bold;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Century Gothic';
src: url("fonts/CenturyGothic-BoldItalic.eot");
src: local('Century Gothic Bold Italic'), local('CenturyGothic-BoldItalic'), url("fonts/CenturyGothic-BoldItalic.eot?#iefix") format('embedded-opentype'), url("fonts/CenturyGothic-BoldItalic.woff2") format('woff2'), url("fonts/CenturyGothic-BoldItalic.woff") format('woff'), url("fonts/CenturyGothic-BoldItalic.ttf") format('truetype');
font-weight: bold;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'Century Gothic';
src: url("fonts/CenturyGothic-Italic.eot");
src: local('Century Gothic Italic'), local('CenturyGothic-Italic'), url("fonts/CenturyGothic-Italic.eot?#iefix") format('embedded-opentype'), url("fonts/CenturyGothic-Italic.woff2") format('woff2'), url("fonts/CenturyGothic-Italic.woff") format('woff'), url("fonts/CenturyGothic-Italic.ttf") format('truetype');
font-weight: normal;
font-style: italic;
font-display: swap;
}
html, body, #container, #logo, .logotexte, #masthead, #menuhaut, #menubas, #navigation, #content, #image, #footer0, #footer1, #footer2, #blocleft, #textefin, #textefin1 {
margin: 0;
padding: 0;
border: 0;
}
body {
background-color: #006;
/*color: #696969;*/
color: black;
font-family: 'Century Gothic', Verdana, "Trebuchet MS", Arial, Helvetica, sans-serif;
}
.mobile {
display: none;
}
.pc {
display: block;
}
body a {
text-decoration: none;
color: #696969;
}
body a:hover {
text-decoration: none;
}
#container {
width: 950px;
margin: 2px auto;
padding: 5px;
border: silver solid 2px;
background-color: #fff;
}
#logo {
float: left;
width: 180px;
height: 80px;
padding: 10px;
}
.logotexte {
font-size: 2em;
letter-spacing: 0.08em;
float: left;
text-align: left;
color: mediumblue;
margin-left: 8px;
}
#masthead {
float: right;
width: 730px;
height: 80px;
padding: 10px;
background-color: #c06;
margin-bottom: 0;
color: #fff;
border-bottom: 1px solid #fff;
}
#masthead a {
color: #fff;
}
.masthead1 {
font-size: 2.4em;
font-weight: normal;
margin-top: 10px;
margin-bottom: 10px;
text-align: center;
}
.masthead2 {
font-size: 0.75em;
margin-top: 5px;
margin-bottom: 5px;
text-align: right;
font-weight: normal;
}
#menuhaut {
float: right;
height: 30px;
width: 750.5px;
display: flex;
flex-direction: row;
}
#menuhaut li {
height: 16px;
padding: 7px 0 8px 0;
background-color: #c06;
border-left: 1px solid #fff;
text-align: center;
font-size: small;
flex : 1;
position: relative;
list-style-type: none;
}
#menuhaut a {
color: #fff;
text-decoration: none;
display: block;
}
#menuhaut li:hover {
background-color: deeppink;
transition-duration: 1s;
}
#menubas {
float: right;
height: 30px;
width: 750px;
padding: 10px 0 20px 0;
margin: 0 auto;
border: 0;
}
#menubas ul {
list-style-type: none;
width: 100%;
margin: 0;
padding: 0;
display: block;
}
#menubas li {
float: left;
width: 100px;
height: auto;
padding: 6px 0 5px 0;
text-align: center;
font-size: small;
list-style-type: none;
}
#menubas li a {
text-decoration: none;
display: block;
transition-duration: 1s;
}
#menubas a:hover {
font-weight: bold;
font-size: large;
}
#navigation {
position: relative;
float: left;
width: 180px;
margin-top: 0;
margin-bottom: 10px;
font-size: small;
}
#navigation ul {
list-style-type: none;
width: 100%;
margin: 0;
padding: 0;
line-height: 130%;
}
#navigation li a {
text-decoration: none;
display: block;
/*color: #696969;*/
color: black;
padding: 5px;
padding-left: 10px;
}
#navigation li a:hover {
text-decoration: none;
color: #c06;
background-color: #FFE6FF;
font-weight: bold;
transition-duration: 1s;
}
#navigation p {
margin: 0;
padding: 5px;
background-color: blue; /*#006;;#66f*/
color: #fff;
}
#navigation a {
color: #fff;
text-decoration: none;
display:block;
}
#navigation a:hover {
color: #fff;
}
#navigation p:hover {
font-weight: bold;
background-color: deeppink;
transition-duration: 1s;
}
#navigation img {
border-width: 0;
}
#content {
float: right;
width: 730px;
margin: 7px 20px 10px 20px;
font-size: small;
text-align: justify;
}
#content a {
text-decoration: underline;
}
#content a:hover {
text-decoration: none;
color: #c06;
font-weight: bold;
}
#content p {
padding: 0;
margin: 5px 0 5px 0;
line-height: 180%;
}
#content img {
border-style: solid;
border-width: 0;
margin-top: 0;
padding-right: 0;
padding-bottom: 0;
}
#content table {
text-align: left;
border: 0;
}
#content td {
border: 0;
vertical-align: bottom;
border-bottom: 1px solid silver;
border-right: 1px solid silver;
}
#content ul {
margin-top: 0;
margin-bottom: 0;
}
#content ul li {
line-height: 150%;
}
#content h1 {
color: #c06;
font-size: 1.6em;
font-weight: bold;
margin: 11px 0 10px 0;
text-align: left;
line-height: normal;
}
#content h2, h3, h4, h5, h6 {
color: #c06;
font-size: 1.1em;
font-weight: bold;
text-align: left;
line-height: 150%;
margin-top: 15px;
margin-bottom: 5px;
}
#content h2 {
font-size: 1.3em;
text-align: justify;
}
#content h3 a id {
text-decoration: none;
}
#content video {
width: 400px;
}
#content object {
display: none;
}
#contentright {
float: right;
color: #c06;
width: auto;
margin: -5px -18px 0 20px;
font-size: x-small;
}
#contentright p {
text-align: left;
margin-bottom: 0;
}
#contentright a {
font-size: x-small;
text-decoration: none;
color: #c06;
}
#contentright a:hover {
font-size: small;
font-weight: bold;
color: #006;
}
a.lien-puce::before { 
  content: "";
  display: inline-block;!important;
  background-image: url('../hypnotiseur-images/autohypnose-spirale-des-sens.GIF');
  background-size: 11px 11px;
  width: 11px;
  height: 11px;
  margin-right: 4px;
  margin-left: 6px;
  vertical-align: middle;
}
blockquote {
  color: #333;
  background-color: azure;
  border-left: 2px solid lightslategrey;
  margin: 2em 0;
  padding: 25px 20px 15px 40px; 
  font-style: italic;
  line-height: 1.6;
  border-radius: 6px;
}
blockquote p {
  margin-bottom: 1em;
}
blockquote footer {
  text-align: right;
  padding-right: 50px;
  font-style: normal;
  font-weight: bold;
  color: #555;
  margin-top: 1em;
}
.encadrerose, #contentlistetemoignage, #zonerose {
  color: #333;
  background-color: #FFF0FF;
  border-left: 2px solid lightcoral;
  margin: 2em 0;
  padding: 35px 20px 15px 30px; 
  line-height: 1.6;
  border-radius: 6px;
  clear: both;
}
#zonerose p {
margin: 10px 20px 10px 20px;
padding-top: 1px;
font-size: 0.8em;
line-height: 130%;
}
#zonerose a {
color: inherit;
text-decoration: none;
border-bottom: 0.5px solid #b3b3b3;
font-size: inherit;
}
#zonerose a:hover {
font-weight: bold;
font-style: italic;
text-decoration: underline;
font-size: medium;
}
#contentlistetemoignage li a {
text-decoration: none;
}
#contentlistetemoignage a:hover {
font-weight: bold;
}
#contentlistetemoignage p {
text-align: justify;
}
#contentlistetemoignage li {
text-align: left;
margin-bottom: 8px;
color: #c06;
}
#contentlistetemoignage h3 {
text-align: left;
}
#image {
float: left;
width: auto;
height: auto;
padding: 15px 25px 10px 0;
}
#imageportrait {
float: left;
width: auto;
height: auto;
padding: 15px 25px 30px 0;
}
.imageindex {
float: left;
width: auto;
height: auto;
padding: 4px 25px 30px 0;
}
.image_class {
float: left;
width: auto;
height: auto;
padding: 0 25px 10px 0;
}
#image-oiseau {
float: none;
width: 100%;
height: auto;
padding: 15px 25px 10px 0;
}
.image-hypnose {
width: 12%;
float: left;
height: auto;
padding: 0 10px 0 20px;
clear: both;
}
.image-hypnose img {
height: auto;
width: 100%;
}
.imageinterparagraphe {
float: none;
margin: 70px auto 70px auto;
width: 32px;
height: 32px;
}
.imageinterparagraphe img {
height: 32px;
width: 32px;
}
#footer0 {
clear: both;
margin-left: 15px;
margin-right: 15px;
padding-top: 15px;
padding-bottom: 15px;
border-top: 1px solid #c06;
height: auto;
}
#footer0 p {
font-size: medium;
font-weight: normal;
margin-top: 0;
margin-bottom: 0;
}
#footer0 img {
border-width: 0;
}
#footer1 {
float: left;
width: 200px;
border-bottom-color: #fff;
}
#footer2 {
float: none;
width: 280px;
text-align: center;
margin-right: auto;
margin-left: auto;
margin-bottom: 5px;
}
#footer2 img {
padding: 8px 30px 8px 30px;
}
#footer2 p a {
text-decoration: underline;
padding: 30px;
color: #c06;
font-weight: bold;
}
#footer2 a:hover {
text-decoration: none;
color: darkblue;
transition-duration: 1s;
}
#blocleft {
width: 55%;
float: left;
}
#blocleft li {
margin: 0;
margin-bottom: 5px;
list-style-type: square;
line-height: normal;
}
#textecentre, #textefin, #textefin1{
float: left;
width: 950px;
margin: 10px auto;
font-size: x-small;
color: #fff;
text-align: justify;
line-height: 110%;
}
#textefin p a {
color:#fff;
text-decoration:underline;
}
#textefin p a:hover {
font-weight: bold;
}
.tableaupartenaire {
width: 40%;
}
.citationadroite {
float: right;
width: 40%;
font-style: italic;
margin-top: 10px;
margin-bottom: 10px;
text-align: right;
line-height: 160%;
}
.citationpoeme {
float: none;
width: 70%;
font-style: italic;
line-height: 130%;
border-style: solid;
border-color: #fff;
margin-left: 15%;
margin-right: 15%;
border-bottom-width: 15px;
border-top-width: 15px;
}
time {
font-style: italic;
color: #C06;
line-height:180%;
}
.lettrine {
font-size: xx-large;
color: #c06;
}
.medium {
font-size: medium;
}
.x-smalltop3px {
font-size: x-small;
margin-top: 3px;
}
.xx-small {
font-size: xx-small;
}
.xx-small-clair {
font-size: xx-small;
color: #f0f0f0;
display: none;
}
.stylerose {
color: #c06;
text-align: justify;
}
.rose {
color: #c06;
}
.roseleft {
color: #c06;
text-align: left;
}
.gris {
color: #696969;
}
.x-smallrose {
color: #c06;
font-size: x-small;
line-height: 120%;
display: block;
}
.smallrose {
color: #c06;
font-size: small;
}
.mediumrose {
color: #c06;
font-size: medium;
}
.medium {
font-size: medium;
}
.site-footer {
font-weight: bold;
font-size: 1.1em;
color: #c06;
margin-top: 30px;
margin-bottom: 30px;
line-height: 1.6em;
clear:both;
}
.trebuchetrosegras, .trebuchetrosegrasleft, .trebuchetrosegrastop20 {
font-weight: bold;
font-size: 1.1em;
color: #c06;
margin-top: 15px;
margin-bottom: 5px;
}
.trebuchetrosegrastop20 {
margin-top: 12px;
display: inline-block;
font-size:1.2em;
}
.trebuchetrosegrasleft {
text-align: left;
}
.listeindex {
line-height: 170%;
text-align: left;
width: auto;
list-style-type: none;
}
.listeindex li {
margin-bottom: 5px;
}
.dessous {
clear: both;
}
#expansiontexte1, #expansiontexte2, #expansiontexte3, #expansiontexte1.masquer, #expansiontexte2.masquer, #expansiontexte3.masquer, #expansionimage1, #expansionimage1.masquer {
display: none;
}
#expansiontexte1.afficher, #expansiontexte2.afficher, #expansiontexte3.afficher {
display: block;
float: none;
width: auto;
border: #f0f solid 1px;
text-align: justify;
margin: 10px 0 10px 0;
background-color: #ffecff;
padding: 10px 20px 10px 20px;
clear: both;
}
#expansionimage1.afficher {
display: block;
}
#lignehorizontale {
clear: none;
}
/* Styles pour la section de bibliographie */
#bibliographie, #filmographie {
    margin-top: 30px; /* Espace au-dessus de la bibliographie */
    margin-bottom: 30px; /* Espace en dessous de la bibliographie */
   /* padding: 0 20px;  Un peu de padding sur les côtés si besoin */
   /* border-top: 1px solid #eee;  Ligne de séparation subtile */
    padding-top: 20px;
}
#bibliographie h2, #filmographie h2, #bibliographie h3, #filmographie h3{
    font-size: 1.3em; /* Taille du titre de la bibliographie */
    color: #c06; /* Couleur du titre */
    margin-bottom: 25px; /* Espace sous le titre */
/*  text-align: center;  Centre le titre si désiré */
}
/* Styles pour la liste des références */
#bibliographie ul, #filmographie ul {
  	list-style: none; /*   Supprime les puces par défaut (si vous n'en voulez pas) */
    padding: 0; /* Supprime le padding par défaut des listes */
    margin: 0; /* Supprime les marges par défaut des listes */
}
#bibliographie li, #filmographie li {
   margin-bottom: 10px;   /*Espace entre chaque référence */
   /* line-height: 1.1em;  Hauteur de ligne pour une meilleure lisibilité */
   /* font-size: 1em;  Taille de la police pour les références */
   /* color: #555;  Couleur du texte des références */    
/* Retrait négatif pour la deuxième ligne (hanging indent), très courant en APA */
    text-indent: -2em; /* Retire la première ligne de 2em */
    padding-left: 2em; /* Décale tout le contenu de 2em pour compenser */
}
/* Styles pour les titres d'œuvres citées */
#bibliographie li cite, #filmographie li cite
  {
    font-style: italic; /* Assure que le titre de l'œuvre est en italique */
    /* C'est le comportement par défaut de <cite>, mais vous pouvez le forcer ou le modifier */
}
@media only screen and (max-width: 834px) {
body {
width: auto;
}
.mobile {
display: block;
}
.pc {
display: none;
}
#image {
padding: 0 15px 10px 0;
}
#imageportrait {
padding: 0 25px 35px 0;
}
#navigation {
display: none;
}
#contentright {
margin-top: -28px;
margin-right: 25px;
}
#logo {
display: none;
}
#container {
width: 100%;/*il y avait auto*/
padding: 0;
margin: 0 auto;
border: 0;
}
#masthead {
width: 100%;
padding: 0;
margin: 0;
height: 70px;
border-bottom: 0;
}
.masthead1 {
font-size: 1.5em;
margin-top: 10px;
margin-bottom: 0;
}
.masthead2 {
text-align: center;
margin-top: 0;
font-size: 0.7em;
}
#menubarre {
float: right;
width: 40px;
height: 25px;
display: block;
}
.menubarre {
line-height: 0.8em;
font-size: 2.2em;
font-weight: bold;
color: mediumblue;
text-align: center;
display: block;
}
#menubarre a:hover {
color: crimson;
}
#menuhaut {
display: none;
clear: left;
}
#menuhaut.masquer {
display: none;
}
#menuhaut.afficher {
display: block;
height: auto;
width: auto;
margin: 25px 0 20px 0;
position: absolute;
right: 0;
top: 78px;
}
#menuhaut li {
border-bottom: 1px solid #fff;
border-left: 0;
float: none;
width: 180px;
padding: 10px;
}
#menubas {
width: 180px;
height: auto;
margin: 50px auto 0 auto;
padding-top: 30px;
float: none;
border-top: 1px solid #c06;
clear: both;
}
#menubas li {
border-left: 0;
float: none;
width: auto;
}
#footer0 {
height: auto;
}
#footer2 p {
font-size: small;
}
#footer1 {
padding-top: 0;
width: 80px;
}
#content {
width: auto;
padding: 5px 15px 5px 15px;
margin-left: 0;
margin-right: 0;
margin-top: 0;
}
#content img {
margin-top: 3px;
}
#content video {
width:360px;
}
#textefin, #textefin1 {
width: auto;
padding-left: 5px;
padding-right: 5px;
}
#content h1 {
margin-top: 0;
}
html {
	-webkit-text-size-adjust: 100%; /*pour pb iphone en horizontal */;
	-ms-text-size-adjust: 100%;
}
}
@media only screen and (max-width: 568px) {
#imageportrait, .imageindex {
float: none;
width: 250px;
height: auto;
padding: 0 0 20px 0;
margin-right: auto;
margin-left: auto;
}
#footer1 {
padding-top: 0;
width: 0;
}
#footer1 img {
padding-top: 2px;
width: 50px;
height: auto;
}
#content h2 {
text-align: left;
}
.dessous568px {
clear: both;
}
#lignehorizontale {
clear: both;
}
}
@media only screen and (max-width: 411px) {
.citationadroite {
width: 70%;
}
#content video {
width: 100%;
}
#image, .image_class {
padding: 0 10px 10px 0;
}
}
@media only screen and (max-width: 389px) {
#image, .image_class, .tableaupartenaire img {
width: 100%;
}
#masthead {
height: 75px;
}
#menuhaut.afficher {
top: 83px;
}
}
@media only screen and (max-width: 320px) {
#masthead {
height: 100px;
}
#menuhaut.afficher {
top: 108px;
}
}
