/*------------------------------------------------------
FUENTES
------------------------------------------------------*/

@font-face {
  font-family: 'MiFuente';
  src: url('myfont-webfont.eot?#iefix') format('embedded-opentype'), url('myfont-webfont.woff') format('woff'), url('myfont-webfont.ttf') format('truetype'), url('myfont-webfont.svg#svgFontName') format('svg');
}


/*------------------------------------------------------
RESETEO DE ESTILOS
------------------------------------------------------*/

* {
  padding: 0;
  margin: 0;
}

li {
  list-style: none;
}

a {
  color: black;
  text-decoration: none;
}


/*------------------------------------------------------
ESTILOS GENERALES
------------------------------------------------------*/

body {
  font-family: 'Open Sans';
  color: black;
}

section {
  padding: 100px 0;
}

h1 {
  float: left;
  font-size: 2.25em;
}

p {
  font-weight: 400;
  line-height: 1.5em;
}

button a {
  display: block;
  font-size: 0.8em;
  font-weight: lighter;
  letter-spacing: 3px;
  padding: 8px 0;
  text-transform: uppercase;
  width: 180px;
  color: white;
  background-color: rgba(0, 0, 0, 0.8);
}

button.blanco a {
  background-color: rgba(255, 255, 255, 0.8);
  color: black;
}

.fondo-gris {
  background-color: rgb(240, 240, 240);
}

.texto-espaciado {
  letter-spacing: 2px;
}

.mayusculas {
  text-transform: uppercase;
}


/*------------------------------------------------------
BARRA DE NAVEGACIÓN
------------------------------------------------------*/

nav {
  height: 60px;
  position: fixed;
}

nav .logo {
  height: 80px;
  margin-top: 25px;
}

nav ul {
  float: right;
  margin-right: 40px;
}

nav li {
  float: left;
}

nav a {
  color: white;
  line-height: 40px;
  font-size: .9em;
}


/*------------------------------------------------------
SERVICIOS
------------------------------------------------------*/

.servicios article {
  margin-top: 50px;
}

.servicios article p {
  float: left;
  margin: 0 20px;
  width: calc(33.33% - 40px);
  font-weight: 200;
  color: rgba(0, 0, 0, 0.5);
}


/*------------------------------------------------------
NEWSLETTER
------------------------------------------------------*/

.newsletter {
  text-align: center;
  border-top: 1px solid rgba(0, 0, 0, .1);
}

.newsletter p {
  color: rgba(0, 0, 0, 0.5);
  font-size: 0.8em;
}

.newsletter button {
  margin: 30px auto;
}


/*------------------------------------------------------
FOOTER
------------------------------------------------------*/

footer {
  padding: 150px 0;
  text-align: center;
}

footer p {
  font-size: 0.7em;
}

footer img {
  margin-bottom: 50px;
  width: 100px;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.