Código CSS:
Ver original
body { font-family: 'Open Sans', sans-serif; font-size: 16px; } header { background: #fff; padding: 20px; margin: -40px 50px -30px 50px; display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center; } header #menu { margin-top: 15px; display: flex; justify-content; center; flex-flow: row wrap; text-align: center; align-items: center; } header #menu a { font-size: 1.3em; text-decoration: none; color: #666; font-weight: bold; padding: 10px 20px; margin-left: 20px; margin-bottom: 10px; flex: 1 1; } header #logo { display: flex; flex-flow: row wrap; align-items: center; justify-content: center; } header #logo h1 { font-size: 3em; } #presentacion { background-image: url("bgazul.jpg"); background-position: bottom; background-size: cover; margin: 0 -20px 0 -20px; padding: 80px 50px; display: flex; flex-flow: column wrap; text-align: center; justify-content: center; align-items: center; } #presentacion h2 { color: #fff; font-size: 3.5em; margin-top: -5px; margin-bottom: -5px; font-weight: bold; text-shadow: 2px 2px 3px #000000; } #presentacion p { text-transform: none; font-size: 1.5em; font-weight: lighter; color: #fff; text-shadow: 1px 1px 2px #000000; width: 60%; } #presentacion a { text-decoration: none; color: #fff; background: #E1B63D; padding: 15px; border: 1px solid #FFF73D; } #servicios { max-width: 1024px; margin: 0 auto; display: flex; flex-flow: row wrap; } #servicios article { background: #F7F7F7; padding: 10px 20px; width: 25%; margin: 10px; margin-top: 30px; display: flex; flex-flow: row wrap; justify-content: center; } #servicios article h2 { text-align: center; font-size: 1.5em; } #servicios article p { text-align: center; font-size: .9em; } #servicios article a { margin: 15px 0; background: #3342F7; border: 1px solid #fff; padding: 10px; text-decoration: none; color: #fff; }