main form.connexion fieldset legend p.login {
  float: right;
  text-transform: uppercase;
  font-size: 1.2em;
  font-weight:bold;
}

main fieldset.connexion>button {
  padding: 0;
}

main form.connexion fieldset {
  box-shadow: 5px 5px 5px 1px gray;
  border: none;
  padding-top: 0;
  margin: 0 auto;
  width: 35%;
  height: auto;
  background: center / cover no-repeat url("../svg/golfe.svg"), url("../images/texture.jpeg");



}

main form.connexion fieldset legend i.material-icons {
  font-size: 70px;
}

main form.connexion div.action-set {
  width: 100%;
  min-width: 300px;
  /*background: linear-gradient(7deg, #bbb, #fffe92);*/
  /*background-color: #e5e4ad;*/
  padding: 10px 0;
  margin-top:6em;
  /*box-shadow: 4px 4px 8px #c8c8c3;*/
}

main form.connexion div.action-set button  {
  border-radius: 0;
  box-shadow: 5px 5px 5px 1px gray;
  border: 1px solid whitesmoke;
}

main form.connexion input {
  width: 100%;
  margin-top: 4em;
  margin-bottom: 30px;
  background-color: whitesmoke;
  box-shadow: inset 0px 1px 4px 1px lightgray;
  padding:1em;
  text-align: center;

}

main form.connexion input:focus {
  background-color: #e6e6e2;
  box-shadow: inset 0px 1px 4px 1px lightgray;
  outline: none;
}

main form.connexion input:hover {
  background-color: #ccc6c6;
  box-shadow: inset 0px 1px 4px 1px lightgray;
  outline: none;

  }


main form.connexion label {
  font-weight: 900;
}

main form.connexion a {
  display: block;
  width: 100%;
  text-align: center;
  font-size: 12px;
  font-weight: 900;
  line-height: 3em;
  margin-top:3em;
}

main form.connexion a:visited {
  color: black;
}

main form.connexion a:hover {
  color: red;
}



/* /////////////////////////////////////
//////// SMARTPHONE /////////////////
///////////////////////////////////// */
@media (pointer:coarse), (max-width:700px) {

    p a {
        padding: 0.1em 0.5em;
        border-radius: 1em;
        background-color: var(--link-bg);
    }

  main {
    width:100%;
    padding:0;
    position: relative;
    top:4.5em;
  }

  main form.connexion fieldset {
    position: relative;
    width:100%;
    height: 90vh;
    box-shadow: none /*0px 4px 8px lightgrey*/;
    margin:0;
    border-top: 1px solid black;


  }

  main form.connexion div.action-set {
    position: absolute;
    left:0;
    width:100%;
    min-width: 300px;
    margin: 0 auto;
    padding: 10px 0;
    opacity: 0.8;
    box-shadow: 0 0 0 0;

  }

  main form.connexion a {
    padding:0.5em;
    margin:0.5em auto;
    width:50%;
    background: linear-gradient(135deg, #333 5%, #5a5a5a 100%);
    box-shadow: 5px 5px 5px 1px gray;
    margin: 3.5em auto;
  }

  main fieldset.connexion input {
    margin-top: 0;
    margin-bottom: 0;
  }

  main fieldset.connexion {
    margin: 10% 30% 20% 3%;
    width: 90%;
    border-top: 1px solid black;
    box-shadow: 4px 4px 8px #c8c8c3;
  }

  main form.connexion input {
    padding: 2em;
    margin-top:0em;
    margin-bottom: 0em;
  }

  main form.connexion a:visited {
    color: white;
  }

}