En que orden se declarando el diseño de la pagina?

¡Hola Ivan!

En CSS, la jerarquía que mencionas se llama "especificidad". La especificidad determina qué regla CSS se aplicará a un elemento en particular si hay varias reglas que se aplican al mismo elemento.

En cuanto a la pregunta sobre el orden en que se declaran los estilos en una hoja de estilo, no hay una regla estricta sobre esto. Sin embargo, es una buena práctica mantener una estructura coherente y organizada en tu hoja de estilo.

Una forma común de organizar los estilos es agruparlos por secciones de la página, como el encabezado, la navegación, el contenido principal, el pie de página, etc. Dentro de cada sección, puedes ordenar los estilos por especificidad, comenzando con los estilos para elementos específicos, luego para clases y finalmente para identificadores.

Por ejemplo:

/* Estilos para el encabezado */
header {
  background-color: #333;
  color: #fff;
  font-size: 24px;
}

header .logo {
  width: 200px;
  height: 100px;
}

header #menu {
  text-align: right;
}

/* Estilos para el contenido principal */
main {
  width: 80%;
  margin: 0 auto;
}

main h1 {
  font-size: 36px;
}

main .destacado {
  background-color: #f9f9f9;
  border: 1px solid #ccc;
}

/* Estilos para el pie de página */
footer {
  background-color: #333;
  color: #fff;
  text-align: center;
  padding: 10px;
}

Espero que esta información te sea útil. ¡Buenos estudios!