
* {
    margin: 0;
    padding: 0;
    margin-top: 0!important;
    margin-bottom: 0!important;
}

@import url(http://fonts.googleapis.com/css?family=Quicksand:300,400,700);
/* #### Generated By: http://www.cufonfonts.com #### */

/*TYPO LEMON*/
@font-face {
font-family: 'Lemon/Milk';
font-style: normal;
font-weight: normal;
src: local('Lemon/Milk'), url('../typo/LemonMilk.woff') format('woff');
}


@font-face {
font-family: 'Lemon/Milk italic';
font-style: normal;
font-weight: normal;
src: local('Lemon/Milk italic'), url('../typo/LemonMilkitalic.woff') format('woff');
}


@font-face {
font-family: 'Lemon/Milk light italic';
font-style: normal;
font-weight: normal;
src: local('Lemon/Milk light italic'), url('../typo/LemonMilklightitalic.woff') format('woff');
}


@font-face {
font-family: 'Lemon/Milk bold';
font-style: normal;
font-weight: normal;
src: local('Lemon/Milk bold'), url('../typo/LemonMilkbold.woff') format('woff');
}


@font-face {
font-family: 'Lemon/Milk bold italic';
font-style: normal;
font-weight: normal;
src: local('Lemon/Milk bold italic'), url('../typo/LemonMilkbolditalic.woff') format('woff');
}


@font-face {
font-family: 'Lemon/Milk light';
font-style: normal;
font-weight: normal;
src: local('Lemon/Milk light'), url('typo/LemonMilklight.woff') format('woff');
}
/*typo LEMON*/

body {
    text-align:center;
    padding-top: 80px;
    /*font-family: 'Lemon/Milk';*/
}

/*MENU*/
footer {
  margin-top: 5rem !important;
  border-top: 1px dashed white;
  background-color: #ffffff;
  }

.nav {
  background-color:#ffffff;
  width: 100%;
  position: fixed;
  z-index: 10;
  clear: both;
  justify-content: flex-end;
}
.navcolor {
    background-color:#ffffff!important;
}
ul#menu {
  display: none;
}
ul#menu li a {
  width: 100%;
  display: block;
  background-color: #000;
  color: #fff;
  font-size: 1em;
  padding: 1.5em 1.6em;
  transition: background 0.2s;
  text-decoration: none;
}
ul#menu a:hover {
  background-color: #303030;
}

ul.hamburger li {
  height: 5px;
  background: #fff;
  content: "";
  position: relative;
  transition: 0.25s ease-in-out;
}

.hidden {
  opacity: 0;
}

.rot45deg {
  transform: rotate(45deg);
  top: 10px !important;
}

.rot-45deg {
  transform: rotate(-45deg);
}

ul.hamburger {
  display: block;
}
ul.hamburger li:nth-child(1) {
  top: 0;
}
ul.hamburger li:nth-child(2) {
  top: 5px;
}
ul.hamburger li:nth-child(3) {
  top: 10px;
}

.hamburger-container {
  width: 38px;
  margin: 1.2em 1.6em;
  height: 30px;
  cursor: pointer;
  float: right;
}
.explication{
    font-family: 'Quicksand', sans-serif;
}

h1 {
    font-family: 'Lemon/Milk'!important;
    font-size: 2.3em;
    color: black;
}
h2{
    font-family: 'Lemon/Milk'!important;
    font-size: 2.7rem;
}

logo{
        width:60%;
        height:auto;
}

/*FIN MENU*/


h2{
    font-family: 'Lemon/Milk';
    font-size: 3em;
}
p{
  font-size:1.2rem;
  font-family: 'Quicksand', sans-serif;
}
 /*PAGE WEB DESIGN*/
.web-design{
        color:#bbd29e!important;
}
.flex-web{
    display:flex;
    flex-wrap: wrap;
    justify-content: center;
}
.mockup-responsive{
    margin:3!important;
    width:90%
}
.marge{
    margin:3%!important;
}
.site-helene-seinera{
    width:90%;
    margin:3%!important;
}


/* */
/*MEDIA SCREEN */
@media (min-width: 576px) {
h1 {
    font-size: 2.5em;
    color: black;
}
h2{
  font-size: 3.2em;
}
}

/* Tablettes */
@media screen and (min-width:768px) {
    
h1 {
    font-size: 4em;
    color: black;
}
h2 {
  font-size: 5em;
}
  .hamburger-container {
    display: none;
  }
  .nav ul#menu {
    display: inline;
  }
  .nav ul#menu li {
    display: inline-block;
    margin-right: -5px;
  }
.bouton:hover {
    transform: scale(1.2);
}
  .web-design{
    font-size:4em;
  }
@media (min-width: 992px) {
  h2 {
    font-size: 6.25em;
  }
}

/* Ordinateur de bureau */
@media screen and (min-width:1024px) {
h1 {
    font-size: 4.5em;
    color: black;
}
h2 {
  margin:5px;
  font-size: 9.4em;
} 
.site-helene-seinera{
   width:60%;
   margin:3%!important;
}
}
@media screen and (min-width:1440px) {
  h2{
    font-size: 10em;
  }

}

/* HD Desktop */

@media screen and (min-width:1920px) {
  h2 {
    font-size: 12.5em;
  }
  .web-design{
    font-size:4em;
  }
}
