/* INDEX ECSTREMO */
 input[type=text],
 input[type=email],
 select,
 textarea {
   width: 100%;
   padding: 12px;
   border: 1px solid var(--btn);
   border-radius: 5px;
   resize: vertical;
   font-size: 100%;
 }

 /* label per inser keycode */
 label {
   text-align: left;
 }

 /* pulsante submit per keycode */
 input[type=submit] {
   margin-top: 1rem;
   margin-left: 7px;
   background-color: var(--btn);
   color: white;
   padding: 12px 20px;
   border: none;
   border-radius: 4px;
   cursor: pointer;
   width: 200px;
   text-align: center;
   box-shadow: -15px -15px 15px rgba(255, 255, 255, 0.2),
     15px 15px 15px rgba(29, 27, 27, 0.1),
     inset -5px -5px 5px rgba(255, 255, 255, 0.2),
     inset 5px 5px 5px rgba(0, 0, 0, 0.1);
 }

 input[type=submit]:hover {
   background-color: var(--over);
 }

 .col-25x {
   width: 150%;
   text-align: left !important;
 }

 .col-75x {
   float: left;
   width: 100%;
   text-align: left !important;
 }

 /* box del portone generale */
 .boxmain {
   max-width: 900px;
   display: flex;
   flex-direction: column;
   align-items: start;
   justify-content: center;
   flex-wrap: wrap;
   text-align: center;
 }

 /* box del portone */
 .boxuno {
   width: 100%;
   margin-top: 2rem;
 }

 .boxuno h1 {
   color: rgb(47, 46, 45);
   font-size: 2rem;
   text-align: center;
   align-items: center;
   margin-top: 2rem;
 }

 /* div del portone immagine */
 .portone {
   max-width: 540px;
   width: 90%;
   /* height: 500px; */
   text-align: center;
 }

 /* box bunner keycode */
 .boxdue {
   width: 100%;
   margin-top: 2rem;
   display: flex;
   align-items: left;
   justify-content: flex-start;
   flex-wrap: wrap;
   text-align: left;
 }

 /* DIV del box bunner keycode */
 .boxdue div {
   padding-left: 10px;
   text-align: left;
   flex-wrap: wrap;
 }

 /* box imaggine bunner key */
 .boxkey {
   width: 100%;
   max-width: 800px;
   margin: 0 auto;
   background-image: url("../image/key-sfondo.jpg");
   background-position: center;
   /* Center the image */
   background-repeat: no-repeat;
   /* Do not repeat the image */
   background-size: cover;
   /* Resize the background image to cover the entire container */
 }

 /* Digita il KeyCode nel bunner key */
 .boxkey h1 {
   font-size: 2rem;
   color: rgb(255, 255, 255);
   padding-left: 30px;
   font-weight: 400;
   font-family: 'Gruppo', sans-serif;
 }

 /* il p SEI STATO INVITATO nel bunner key */
 .boxkey p {
   font-size: 1.2rem;
   color: rgb(255, 255, 255);
   padding-left: 30px;
   padding-top: 1rem;
   margin-bottom: 1rem;
 }

 /* linea sopra e sotto il bunner Key */
 .hr1,
 .hr2 {
   width: 100%;
   max-width: 800px;
   height: 2px;
   margin-top: 6rem;
   margin-bottom: 2rem;
 }

 /* linea sotto il bunner Key */
 .hr2 {
   margin-top: 2rem;
   margin-bottom: 3rem;
 }

 /* sezione keycode */
 .row3x {
   max-width: 340px;
   text-align: left;
   margin-bottom: 40px;
 }

 /* sezione riassunto filosofia in fondo alla pagina prima del footer */
 .boxText {
   max-width: 840px;
   align-items: center;
   margin-top: 2rem;
   margin-bottom: 4rem;
 }

 /* mardine dei div della sezione boxText */
 .boxText div {
   margin-bottom: 2rem;
 }

 /* testo rosso link scpri la filosofia */
 .boxText a {
   color: red;
 }