body{
  background-image: url(eos.jpg);
  height: 100vh;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  background-color: rgba(0,0,0,.83);
  background-blend-mode: multiply;
  text-align: center;
}

h3{
  font-size: 1.3em;
  font-weight: 500;
}

footer{
  position: absolute;
  bottom: 2%;
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: center;
  width: 100%;
}


*{
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-family: "Helvetica", sans-serif;
  color: white;
}

.container{

  padding: 20px;
}



.logo{
  position: relative;


}

.logo img {
  width:400px;
  height: 200px;
  margin-top: 10%;
}

/* ------ Sprite de Social Icons ------ */
ul#iconos {
  display: inline-block;
}
ul#iconos li {
list-style: none;
float: left;
}
#iconos li a{
width: 72px;
height: 72px;
background: url(socialicons.png) no-repeat;
display: block;
}
#iconos li#facebook a{
background-position: 0 0;
}
#iconos li#twitter a {
background-position: -72px 0;
}
#iconos li#contacto a {
background-position: -144px 0;
}
#iconos li#facebook a:hover{
background-position: 0 -72px;
}
#iconos li#twitter a:hover {
background-position: -72px -72px;
}
#iconos li#contacto a:hover {
background-position: -144px -72px;}



/* ----- Moviles ------- */

@media only screen and (max-width: 640px) {



  .logo img {
    width:80%;
    height: 80%;
  }



}

@media (orientation: landscape) {



  .logo img {
    width:40%;
    height: 80%;
  }

}