//déclaration des variables
$font : Arial, Helvetica, sans-serif;
$normalfontsize : 14px;
$titlecrosscolor: #fcfafc;
$linkcolor: #660066;
$linkhovercolor:#eeaaee;
$fontcolor:#330033;
$inputcolor: white;
$backgroundtitlecolor: #663366;

//Mise en form du formulaire
.div-form{
    font-family: $font;
    font-size: $normalfontsize;
    display: none;
        #form{
            position: absolute;
            top: 50%;
            transform: Translate(-50%, -50%);
            left: 50%;
            height: 25%;
            border-radius: 10px;
            border: 1px solid black ;
            padding: 10px;
            background-color: #663366;
            color: $fontcolor;
            .icon-cross{
                color: $titlecrosscolor;
                float: right;
            }
            button{
                border-radius: 5px;
                background-color: white;
                border: 1px solid rgb(167, 167, 167);
                font-family: $font;
                &:hover{
                    color: $linkhovercolor;
                    background-color: lightgrey;
                }
            }
        }
}

//fermeture du formulaire
#form-checkbox:checked ~ .div-form {
    display: flex;
  }

  .form-checkbox:checked ~ .menu {
    display: none;
  }
//Mise en form de la nav bar
  .main-navigation {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    background-color: rgba(204, 204, 204, 0.159);
    margin-top: -10px;
    margin-left: -10px;
    margin-right: -10px;
  } 
   .menu {
    display: none;
    flex-basis: 100%;
    list-style: none;
    
        li{
        padding: 15px;
        }
        a, .show-form {
            display: inline-block;
            font-family: $font;
            font-size: $normalfontsize;
            text-decoration: none;
            color: $linkcolor;
            &:hover{
                color: $linkhovercolor;
                text-decoration: underline;
            }
        }

    }

  
  //Mise en place de la navbar responsive
  .menu-checkbox:checked ~ .menu {
    display: block;
  }
  .menu-toggle {
    padding: 0.5em 1em;
        &:hover{
            color: $linkhovercolor;
            text-decoration: underline
        }
  }
  //style des liens
  input{
      background-color: $inputcolor;
  }
//Style du titre
  h1{
      font-size: 35px;
      color: $titlecrosscolor;
      background-color: $backgroundtitlecolor;
      text-align: center;
      font-family: $font;
      padding: 15px;
  }
  //style du paragraphe
  p{
      font-size: $normalfontsize;
      font-family: $font;
      text-align: center;
      color: $fontcolor;
  }
  // Mise en form du footer
  #foot{
      text-align: center;
      font-family: $font;
      color: $fontcolor;
      font-size: $normalfontsize;
      padding: 25px;
      position:absolute;
      bottom:0;
      transform: Translate(-50%);
      left: 50%;
      span, a{
          padding-left: 20px;
      }
      a {
        color: $linkcolor;
        text-decoration: none;
        &:hover{
            color: $linkhovercolor;
            text-decoration: underline;
        }
      }
  }
//début affichage boutton
.c_hebdo, .c_daily{
    display: none;
}

.s_daily, .s_hebdo{
    display: none;
}