@charset "UTF-8";
/* CSS Document */
* {box-sizing: border-box;}

@font-face {
  font-family: 'typo2019';
  src:  url('fonts/typo2019.eot?1r9029');
  src:  url('fonts/typo2019.eot?1r9029#iefix') format('embedded-opentype'),
    url('fonts/typo2019.ttf?1r9029') format('truetype'),
    url('fonts/typo2019.woff?1r9029') format('woff'),
    url('fonts/typo2019.svg?1r9029#typo2019') format('svg');
  font-weight: normal;
  font-style: normal;
}
[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'typo2019' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Layout */
html {display: flex; flex-direction: column;} /* IE fix */


#voeux2019 {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100vh;
  overflow:hidden;
  width:100%;
}

/* -----------    FABRICE ---------------------------------  */
html,
body {
    overflow-x: hidden;/**/
    position: relative;
    height: 100%;
}
body {
  overflow-x:hidden!important;/**/
}
#voeux2019.spirale:before {
	content: "";
	position: absolute;
	width: 200%;
	height: 200%;
	top: -50%;
	left: -50%;
	z-index: -1;
	opacity:0.33;
	/*background-image:url(svg/spirale-bleue.svg); /*  image change en fonction de l'humeur affichée 
	18 humeurs 9 couleurs  : 	spirale-rouge.svg / spirale-orange.svg / spirale-jaune.svg / spirale-rose.svg / spirale-violet.svg / spirale-vert1.svg / spirale-vert2.svg / spirale-vert3.svg	*/
  	background-size:200%;
  	background-repeat:no-repeat;
 	background-position:center;
    overflow:hidden!important;
}
#voeux2019.spirale.slow:before {animation:spin 12s linear infinite; overflow:hidden!important;}
#voeux2019.spirale.fast:before {animation:spin 0.25s linear infinite; overflow:hidden!important;}

#voeux2019.spirale.bleue:before {background-image:url(svg/spirale-bleue.svg); overflow:hidden!important;}
#voeux2019.spirale.rouge:before {background-image:url(svg/spirale-rouge.svg); overflow:hidden!important;}
#voeux2019.spirale.orange:before {background-image:url(svg/spirale-orange.svg); overflow:hidden!important;}
#voeux2019.spirale.jaune:before {background-image:url(svg/spirale-jaune.svg); overflow:hidden!important;}
#voeux2019.spirale.rose:before {background-image:url(svg/spirale-rose.svg); overflow:hidden!important;}
#voeux2019.spirale.violet:before {background-image:url(svg/spirale-violet.svg); overflow:hidden!important;}
#voeux2019.spirale.vert1:before {background-image:url(svg/spirale-vert1.svg); overflow:hidden!important;}
#voeux2019.spirale.vert2:before {background-image:url(svg/spirale-vert2.svg); overflow:hidden!important;}
#voeux2019.spirale.vert3:before {background-image:url(svg/spirale-vert3.svg); overflow:hidden!important;}

.play a {
    animation:spin2 12s linear infinite;
}
.play a:hover {
    animation:spin2 0.25s linear infinite;
}
.humeurs {
/*  animation-duration: 1.5s;
  animation-name: bounceIn;
  animation-timing-function: ease-in;*/
}
h2 {
/*  animation-duration: 1.5s;
  animation-fill-mode: both;
  animation-name: bounceInLeft;
  animation-timing-function: ease-in;
  * */
  }
 h3 {
  /*animation-duration: 1.5s;
  animation-fill-mode: both;
  animation-name: bounceInRight;
  animation-timing-function: ease-in;*/
  }

@keyframes spin { 100% { transform:rotate(-360deg); } }
@keyframes spin2 { 100% { transform:rotate(360deg); } }


@keyframes bounceIn {
  from,
  60%,
  70%,
  80%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    transform: scale3d(0.1, 0.1, 0.1);	
	
  }

  60% {
    transform: scale3d(1.1, 1.1, 1.1);
  }

  70% {
    transform: scale3d(0.9, 0.9, 0.9);
  }

  80% {
    transform: scale3d(1.03, 1.03, 1.03);
  }

  90% {
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    transform: scale3d(1, 1, 1);	
  }
}
@keyframes bounceOut {
  0% {
    transform:  scaleX(1.00) scaleY(1.00) ;
  }
  0% {
  }
  100% {
    transform:  scaleX(0.00) scaleY(0.00) ;
  }
}
@keyframes bounceInLeft {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    transform: translate3d(25px, 0, 0);
  }

  75% {
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    transform: translate3d(5px, 0, 0);
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInRight {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    transform: translate3d(-25px, 0, 0);
  }

  75% {
    transform: translate3d(10px, 0, 0);
  }

  90% {
    transform: translate3d(-5px, 0, 0);
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}


@keyframes bounceOutLeft {
  from,
  10%,
  25%,
  40%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    transform: translate3d(0, 0, 0);
  }
  10% {
    transform: translate3d(5px, 0, 0);
  }
  25% {
    transform: translate3d(-10px, 0, 0);
  }
  40% {
    opacity: 1;
    transform: translate3d(25px, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(-3000px, 0, 0);
  }

}

@keyframes bounceOutRight {
  from,
  10%,
  25%,
  40%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    transform: translate3d(0, 0, 0);
  }
  10% {
    transform: translate3d(-5px, 0, 0);
  }
  25% {
    transform: translate3d(10px, 0, 0);
  }
  40% {
    opacity: 1;
    transform: translate3d(-25px, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(3000px, 0, 0);
  }

}

#voeux2019 h1 span, #voeux2019 a.icon-bouton1, #voeux2019 .icon-son a::before, #voeux2019 .coulisses a span  {
outline:none;
color:#000;
 transition: color 400ms ease 0ms;
}
#voeux2019.rouge h1 span, #voeux2019.rouge a.icon-bouton1, #voeux2019.rouge .icon-son a::before, #voeux2019.rouge .coulisses a span, #voeux2019.rouge #pageCoulisses h2, #voeux2019.rouge #pageCoulisses h2 a:hover  {color:#e84e34; }
#voeux2019.orange h1 span, #voeux2019.orange a.icon-bouton1, #voeux2019.orange .icon-son a::before, #voeux2019.orange .coulisses a span, #voeux2019.orange #pageCoulisses h2, #voeux2019.orange #pageCoulisses h2 a:hover  {color:#f3943e; }
#voeux2019.jaune h1 span, #voeux2019.jaune a.icon-bouton1, #voeux2019.jaune .icon-son a::before, #voeux2019.jaune .coulisses a span, #voeux2019.jaune #pageCoulisses h2, #voeux2019.jaune #pageCoulisses h2 a:hover  {color:#fece43; }
#voeux2019.rose h1 span, #voeux2019.rose a.icon-bouton1, #voeux2019.rose .icon-son a::before, #voeux2019.rose .coulisses a span, #voeux2019.rose #pageCoulisses h2, #voeux2019.rose #pageCoulisses h2 a:hover {color:#cc7fb3; }
#voeux2019.violet h1 span, #voeux2019.violet a.icon-bouton1, #voeux2019.violet .icon-son a::before, #voeux2019.violet .coulisses a span, #voeux2019.violet #pageCoulisses h2, #voeux2019.violet #pageCoulisses h2 a:hover {color:#544595; }
#voeux2019.bleue h1 span, #voeux2019.bleue a.icon-bouton1, #voeux2019.bleue .icon-son a::before, #voeux2019.bleue .coulisses a span, #voeux2019.bleue #pageCoulisses h2, #voeux2019.bleue #pageCoulisses h2 a:hover {color:#36a9e1; }
#voeux2019.vert1 h1 span, #voeux2019.vert1 a.icon-bouton1, #voeux2019.vert1 .icon-son a::before, #voeux2019.vert1 .coulisses a span, #voeux2019.vert1 #pageCoulisses h2, #voeux2019.vert1 #pageCoulisses h2 a:hover  {color:#D9E155; }
#voeux2019.vert2 h1 span, #voeux2019.vert2 a.icon-bouton1, #voeux2019.vert2 .icon-son a::before, #voeux2019.vert2 .coulisses a span, #voeux2019.vert2 #pageCoulisses h2, #voeux2019.vert2 #pageCoulisses h2 a:hover {color:#48b170; }
#voeux2019.vert3 h1 span, #voeux2019.vert3 a.icon-bouton1, #voeux2019.vert3 .icon-son a::before, #voeux2019.vert3 .coulisses a span, #voeux2019.vert3 #pageCoulisses h2, #voeux2019.vert3 #pageCoulisses h2 a:hover {color:#00aba8; }

 #voeux2019.rouge ~ #comments #respond textarea,  #voeux2019.rouge ~ #comments #respond input {background-color:#4E190F; }
#voeux2019.orange ~ #comments #respond textarea, #voeux2019.orange ~ #comments #respond input  {background-color:#513111;  		}
#voeux2019.jaune ~ #comments #respond textarea, #voeux2019.jaune ~ #comments #respond input  {background-color:#544411;  		}
#voeux2019.rose ~ #comments #respond textarea, #voeux2019.rose ~ #comments #respond input  {background-color:#432A3B; 			}
#voeux2019.violet ~ #comments #respond textarea, #voeux2019.violet ~ #comments #respond input  {background-color:#1B1532; }
#voeux2019.bleue ~ #comments #respond textarea, #voeux2019.bleue ~ #comments #respond input  {background-color:#0F384B; 			}
#voeux2019.vert1 ~ #comments #respond textarea, #voeux2019.vert1 ~ #comments #respond input  {background-color:#484A19;			}
#voeux2019.vert2 ~ #comments #respond textarea, #voeux2019.vert2 ~ #comments #respond input   {background-color:#163A24; 			}
#voeux2019.vert3 ~ #comments #respond textarea, #voeux2019.vert3 ~ #comments #respond input {background-color:#003837; 			}

  #voeux2019.rouge ~ #comments #respond input#submit  {background-color:#e84e34; }
 #voeux2019.orange ~ #comments #respond input#submit  {background-color:#f3943e; }
 #voeux2019.jaune ~ #comments #respond input#submit   {background-color:#fece43; }
 #voeux2019.rose ~ #comments #respond input#submit  {background-color:#cc7fb3; }
 #voeux2019.violet ~ #comments #respond input#submit   {background-color:#544595; }
 #voeux2019.bleue ~ #comments #respond input#submit  {background-color:#36a9e1; }
 #voeux2019.vert1 ~ #comments #respond input#submit   {background-color:#D9E155; }
 #voeux2019.vert2 ~ #comments #respond input#submit   {background-color:#48b170; }
 #voeux2019.vert3 ~ #comments #respond input#submit  {background-color:#00aba8; }

  #voeux2019.rouge ~ #comments #respond  {color:#e84e34; }
 #voeux2019.orange ~ #comments #respond  {color:#f3943e; }
 #voeux2019.jaune ~ #comments #respond   {color:#fece43; }
 #voeux2019.rose ~ #comments #respond  {color:#cc7fb3; }
 #voeux2019.violet ~ #comments #respond   {color:#544595; }
 #voeux2019.bleue ~ #comments #respond  {color:#36a9e1; }
 #voeux2019.vert1 ~ #comments #respond   {color:#D9E155; }
 #voeux2019.vert2 ~ #comments #respond   {color:#48b170; }
 #voeux2019.vert3 ~ #comments #respond  {color:#00aba8; }

 #voeux2019.rouge ~ #comments .comment-author   {color:#e84e34; }
 #voeux2019.orange ~ #comments .comment-author   {color:#f3943e; }
 #voeux2019.jaune ~ #comments .comment-author    {color:#fece43; }
 #voeux2019.rose ~ #comments .comment-author   {color:#cc7fb3; }
 #voeux2019.violet ~ #comments .comment-author    {color:#544595; }
 #voeux2019.bleue ~ #comments .comment-author   {color:#36a9e1; }
 #voeux2019.vert1 ~ #comments .comment-author    {color:#D9E155; }
 #voeux2019.vert2 ~ #comments .comment-author    {color:#48b170; }
 #voeux2019.vert3 ~ #comments .comment-author   {color:#00aba8; }
 
  #voeux2019.rouge ~ #comments .comment_postinfo   {color:#e84e34; }
 #voeux2019.orange ~ #comments .comment_postinfo   {color:#f3943e; }
 #voeux2019.jaune ~ #comments .comment_postinfo    {color:#fece43; }
 #voeux2019.rose ~ #comments .comment_postinfo   {color:#cc7fb3; }
 #voeux2019.violet ~ #comments .comment_postinfo    {color:#544595; }
 #voeux2019.bleue ~ #comments .comment_postinfo   {color:#36a9e1; }
 #voeux2019.vert1 ~ #comments .comment_postinfo    {color:#D9E155; }
 #voeux2019.vert2 ~ #comments .comment_postinfo    {color:#48b170; }
 #voeux2019.vert3 ~ #comments .comment_postinfo  {color:#00aba8; }
 
  #voeux2019.rouge ~ #comments .comment_postinfo a,   #voeux2019.rouge ~ #comments .comment-author cite.fn a:visited  {color:#e84e34; }
 #voeux2019.orange ~ #comments .comment_postinfo a,  #voeux2019.orange ~ #comments .comment-author cite.fn a:visited  {color:#f3943e; }
 #voeux2019.jaune ~ #comments .comment_postinfo a,  #voeux2019.jaune ~ #comments .comment-author cite.fn a:visited   {color:#fece43; }
 #voeux2019.rose ~ #comments .comment_postinfo a,  #voeux2019.rose ~ #comments .comment-author cite.fn a:visited   {color:#cc7fb3; }
 #voeux2019.violet ~ #comments .comment_postinfo a,  #voeux2019.violet ~ #comments .comment-author cite.fn a:visited    {color:#544595; }
 #voeux2019.bleue ~ #comments .comment_postinfo a,  #voeux2019.bleue ~ #comments .comment-author cite.fn a:visited   {color:#36a9e1; }
 #voeux2019.vert1 ~ #comments .comment_postinfo a,  #voeux2019.vert1 ~ #comments .comment-author cite.fn a:visited    {color:#D9E155; }
 #voeux2019.vert2 ~ #comments .comment_postinfo a,  #voeux2019.vert2 ~ #comments .comment-author cite.fn a:visited    {color:#48b170; }
 #voeux2019.vert3 ~ #comments .comment_postinfo a,  #voeux2019.vert3 ~ #comments .comment-author cite.fn a:visited   {color:#00aba8; }
 
  #voeux2019.rouge ~ #comments .commentlist li.comment   {border-bottom: 1px solid #e84e34; }
 #voeux2019.orange ~ #comments .commentlist li.comment   {border-bottom: 1px solid #f3943e; }
 #voeux2019.jaune ~ #comments .commentlist li.comment    {border-bottom: 1px solid #fece43; }
 #voeux2019.rose ~ #comments .commentlist li.comment  {border-bottom: 1px solid #cc7fb3; }
 #voeux2019.violet ~ #comments .commentlist li.comment    {border-bottom: 1px solid #544595; }
 #voeux2019.bleue ~ #comments .commentlist li.comment  {border-bottom: 1px solid #36a9e1; }
 #voeux2019.vert1 ~ #comments .commentlist li.comment    {border-bottom: 1px solid #D9E155; }
 #voeux2019.vert2 ~ #comments .commentlist li.comment   {border-bottom: 1px solid #48b170; }
 #voeux2019.vert3 ~ #comments .commentlist li.comment  {border-bottom: 1px solid #00aba8; }


/* /FABRICE */
a:hover {
	-webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

h1 {
	padding: 15px 30px;
	background-color: #000;
	z-index: 10;
	display: inline-block;
	font-size: 2em;
	font-weight: normal;
	opacity: 1;
	margin: 65px 0 0 0;
	border-radius: 10px;
	    font-family: 'Ultra', serif;

}
.wrapper {
  display: block; /* IE fix */
  flex: 1 1 auto; /* occupe la hauteur restante */
  display: flex; /* crée un contexte flex pour ses enfants */
  flex-direction: row; /* affichage horizontal */
}
.wrapper  div {
	width:33%;
  display: flex;
  -webkit-align-items: center;
	align-items: center;
}
#pageCoulisses {
	text-align:center;
}
#pageCoulisses br {
	display:none;
}
#pageCoulisses h2 {
	font-family: 'Ultra', serif;
	font-size:5vw;
}
#pageCoulisses h2 a {
	color:#fff;
	text-decoration:none;
}



footer {
   display: -webkit-flex;   
    display: flex;
	-webkit-align-items: center;
	align-items: center;
	width: 100%;
	justify-content:space-between;	
}
/* Decoration */

body {
	margin:0;
	padding:0;
	background-color: #000;	
	  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
header,  footer {
	padding: 1vh 30px;
	margin: 0;
}
header {
  text-align: center;
  padding-top: 0;
}

footer {
  text-align: center;
  padding-bottom: 2vh;
}
.icon-son a:hover::before, .coulisses a:hover span, ul.resos li a:hover  {
	opacity:1;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.spacer img  {
  width:100%;
  max-width:200px;  
}
.animHumeur  {
  text-align:center; 

}
.wrapper div div.humeurs {
  width:100%; 
  height:auto;

}
.wrapper div div.humeurs svg {
  height:auto;
  max-height:60vh;
}
.colGauche {    
    text-align: right;
	
}
.colDroite{       
    text-align: left;
	
}
h2, h3 {
	color:#fff;
	padding:0;
	margin:0;
	font-size: 3vw;
	font-weight: normal;
	width:100%
} 
h2 {
	font-family: 'Domine', serif;
	padding-right:15px;
}
h3 {
	padding-left:15px;
	    font-family: 'Ultra', serif;

}
ul.resos {
	margin:0;
	padding:0;
	list-style: none;
	display:block;
	/*width:35vw;*/
}
ul.resos li {
	list-style: none;
	display:inline-block;
	font-size:4em;
	padding-right:10px;
}
ul.resos li a {
	color:#fff;
	display:block;
	text-decoration:none;
	opacity:0.5;
}

.coulisses  {
	font-family: 'Domine', serif;
	font-size:2em;
	text-align: left;	
	
}
.coulisses a {
	padding: 15px 30px;
	background-color: #000;
	display: inline-block;
	font-weight: normal;
	border-radius: 10px;
	text-decoration:none;
} 
.icon-spirale:before {
  content: "\e900";  
}
.icon-bouton1  {
font-size: 7em;
font-weight: normal;		
}
a.icon-bouton1   {
text-decoration: none;
background-color: #fff;
display: block;
border-radius: 50%;
padding: 3px;
}
.icon-bouton1:before {
  content: "\e901";
}
.icon-facebook:before {
  content: "\e902";
}
.icon-twitter:before {
  content: "\e903";
}
.icon-comments:before {
  content: "\e904";
}
.icon-son  {
	font-size: 2.75em;
	font-weight: normal;
}
.icon-son a  {
	text-decoration:none;
	background-color: #000;
	display: block;
	border-radius: 50%;
	padding:12px;
}
.icon-son a:before {
  content: "\e905";
}
.icon-son a::before, .coulisses a span  {
	opacity:0.5;	
}
/* Responsive */

@media only  screen and (min-width : 1850px)  {	
h1 {
    margin:0;
  }
}
@media only  screen and (max-width : 1024px)  {	
h1 {
    font-size: 1.5em;
}
.coulisses {
    font-size: 1.5em;
}
.coulisses a {
padding:10px 20px;
}
ul.resos li {
    font-size: 3em;
}
.icon-son {
    font-size: 2em;
}
.icon-bouton1 {
    font-size: 6.5em;
}
}

@media only  screen and (max-width : 900px)  {
		
	.wrapper {
    flex-direction: column;
	justify-content: center;
  }
 .wrapper > div {
  width: 100%;
  display: flex;
}
.wrapper div div.humeurs {
  width:70%; 
  height:auto;
  margin:0 auto;
}
.wrapper div div.humeurs svg {
  height:auto;
  max-height:50vh;
}
#pageCoulisses br {
	display:block;
}
#pageCoulisses h2 {
    font-size: 6vw;
}
h2, h3 {
	font-size: 7vw;
	text-align:center;
}


h1, .coulisses {
	font-size: 1.5em;	
}
ul.resos li {
    font-size: 2.5em;
}
.icon-son {
    font-size: 2em;
    font-weight: normal;
}

}

@media only screen 
and (max-device-width : 400px)  {
	

header {
    padding: 0 10px 20px 10px;
}

footer {
    padding: 20px 0;
	flex-wrap: wrap;
	height:35vh;
}
.wrapper div div.humeurs {
  width:100%; 
  }
 .wrapper div div.humeurs svg {
  height:auto;
  max-height:40vh; padding:15px ;
}
#pageCoulisses h2 {
    font-size: 6vw;
}
h2, h3 {
	font-size: 7vw;
	text-align:center;
	padding:15px 0;}
h1 {
	font-size: 5vw;
	padding: 10px 20px;	
}
 
.spacer {
    display: none;
}
.play {
	order:0;
    margin: 10px 40vw 20px;
}
.icon-bouton1 {
    font-size: 15vw;
}
.coulisses {
	font-size: 5vw;
	order: 1;	
}
.coulisses a {
	padding: 7px 10px;
}

ul.resos {
    order: 2;
}
ul.resos li {
    font-size: 9vw;
	padding-right:5px;
}
.icon-son {
    font-size: 7vw;
    font-weight: normal;
	order: 3;
	}
.icon-son a {
    padding: 10px;
}

}


@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 812px) 
and (orientation : landscape) { 

.wrapper {
  flex: 1 1 auto; 
  display: flex; 
  flex-direction: row; 
}
header {
	height:10vh;	   
}
footer {
	padding:15px;
	height:20vh;	   
}
 .wrapper div div.humeurs svg {
  max-height:60vh;
}

h1 {	
	font-size: 1em;
padding: 15px 30px;
margin: 0;	
}

h2, h3 {
font-size: 3vw;	
}
h2, .colGauche {
	text-align:right;
}
h3, .colDroite {
	text-align:left;
}
.icon-bouton1  {
font-size: 6em;
}
.coulisses {
	font-size: 3vw;
	order:0;
}
.spacer {
    display: block;
	order: 1; 
}
.play {
    order: 2;
	margin: 0;
	padding:10px;
}
ul.resos li {
    font-size: 4vw;
}
.icon-son {
    font-size: 3vw;
	order: 4;
}
ul.resos {
    order: 3;
}

.wrapper div div.humeurs {
  width:100%; 
  }
.icon-bouton1  {
font-size: 3em;
font-weight: normal;		
}
   }

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1280px) 
and (orientation : portrait) { 
#voeux2019 {
  height:95vh;
}
h1 {
	margin: 0;
}
footer {
  height:15vh;
}
header {
  height:5vh;
}

   
   .icon-bouton1  {
font-size: 5em;
font-weight: normal;		
}

  }
  @media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1280px) 
and (orientation : landscape) { 
#voeux2019 {
  height:92vh;
}
h1 {
	margin: 0;
}
footer {
  height:15vh;
}
header {
  height:5vh;
}

   
   .icon-bouton1  {
font-size: 5em;
font-weight: normal;		
}

  }
  
    @media only screen 
and (max-device-width : 320px) 
and (orientation : portrait) { 
#voeux2019 {
  height:100vh;
}
h2, h3 {
  padding:20px 0;
}
footer {
  padding-top:0
}
header {
  padding-bottom:10px
}




  }