/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/*                 Menus Style                  */
/*~ ------------------------------------------ ~*/

/*  Main  */
main { 
  padding: 0 2.5rem;

  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3.75rem;
}
main div {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 3.75rem;
}
main div section {
  display: flex;
  flex-direction: column;
  gap: 1.625rem;
}
main section img { 
  width: 100%;
  max-width: 26.25rem;
}
main section h2 {
  font-family: "Roboto-Light", Arial, Helvetica, sans-serif;
  font-size: 3rem;
}
main section div { 
  width: 100%;
  max-width: 26.25rem;
  padding: 0 2rem;

  flex-direction: column;
  gap: 1.625rem;
}
main section div ul {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
/*  ~ Main end ~   */
/* ------------------------------------- */

/* //////////////////////////////////////////// */
/*                   MOBILE                     */
/* //////////////////////////////////////////// */
@media screen and (max-width: 480px) {  
  /* Main section */
  main { padding: 0; gap: 2rem;}

  h1 { padding: 0 2.5rem; }

  main div { gap: 2.5rem; }
  main div section {
    flex-direction: column;
    gap: 1rem;
  }
  main section h2 { 
    max-width: 95%;
    padding: 0 1rem; 
  }
  main section div { 
    max-width: 95%; 
    padding: 0 4rem;
  }
  main section img { max-width: 100%; }
  /* //////////////////////////// */
}
/* //////////////////////////////////////////// */

/* //////////////////////////////////////////// */
/*                    TABLET                    */
/* //////////////////////////////////////////// */
@media screen and (min-width: 480px) and (max-width: 720px) {  
  /* Main section */
  h1 { padding: 0 2.5rem; }

  main div section {
    flex-direction: column;
    gap: 1rem;
  }
  main section div { max-width: 100%; }
  main section img { max-width: 100%; }
  /* //////////////////////////// */
}
/* //////////////////////////////////////////// */

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
