#crypte1 {
box-sizing: border-box;
width: auto;
margin: 0;
padding: 0;
border-radius: 0.38rem;
background-color: #444;
padding: 1.3rem;
}

.crypte2 {
display: grid;
font-size: 1.6rem;
grid-gap: 0;
grid-template-columns: repeat(8, 1fr);
grid-template-rows: auto auto auto;
grid-template-areas:
"login2 login2 login3 login3 login3 login3 login3 login3"
"pass2  pass2  pass3  pass3  pass3  pass3  pass3  pass3"
"button2 button2 button2 button2 button2 button2 button3 button3"
}
/*@media screen and (max-width: 48rem) { /**@@media**/
  @media screen and (max-width: 767px) { /**@@media**/
      .crypte2 {
      display: grid;
      font-size: 1.3rem;
      grid-gap: 0;
      grid-template-columns: 1fr;
      grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr ;
      grid-template-areas:
      "login2"
      "login3"
      "pass2"
      "pass3"
      "button3"
      "button2"
      }

} /**@@media**/

.login2 {
grid-area: login2;
font-family: 'Roboto300';
color: #eee;
background: #222
}

.pass2 {
grid-area: pass2;
font-family: 'Roboto300';
color: #eee;
background: #222
}

.login3 {
grid-area: login3;
font-family: 'Roboto300';
color: #eee;
overflow-wrap: break-word;
background: #222
}

.pass3 {
grid-area: pass3;
font-family: 'Roboto300';
color: #ffde00;
overflow-wrap: break-word;
background: #222
}

.button3 {
grid-area: button3;
font-family: 'Roboto300';
/*color: #444444;
background: #222*/
}
.button2 {
grid-area: button2;
font-family: 'Roboto300';
/*color: #444444;
background: #222*/
}

.buttonY{
background-color: #004f43;
font-family: 'Roboto300';
color: white;
padding: 0.5rem 1.3rem;
border-radius: 0.4rem;
cursor: pointer;
/*margin-top: 1.86rem;*/
float: left;
}

.buttonY:hover {background-color: #ff4500}
.input-text{width: 95%}

input {
  padding: 10px;
  margin-bottom: 12px;
  border: 1px solid #555;
  border-radius: 4px;
  transition: border-color 0.3s ease-in-out;
  outline: none;
  color: #101596;
}

input:focus {
  border-color: #3498db;
}
/*
input[type=text]{
width: 95%;
margin: 0.5rem 0;
padding: 0.8rem 1.3rem;
display: inline-block;
border: 0.13rem solid green;
box-sizing: border-box;
background:#bfbfbf;
}
*/