body {margin:0;padding:0;background:url(../img/bg-pc.jpg); background-size: cover;font-family: 'Open Sans', sans-serif; font-size:14px}

/** menu **/
nav {height:100vh; background:black; position:fixed; width:150px; display:flex;align-items:center;}
.nav-items {width:100%}
nav ul {margin:0;padding:0; width:100%; list-style:none;}
nav ul li {border-bottom:1px dotted rgb(170,170,170); padding:10px 20px;}
nav ul li:first-child {border-top:1px dotted rgb(170,170,170);}
nav ul li a {color:rgb(170,170,170);text-transform:uppercase;text-decoration:none;}
nav ul li a:hover, nav ul li a.activo {color:white;}
nav ul li a.activo {font-weight:bold;background:url(../img/arrow.jpg) no-repeat 0px 2px;padding-left:12px;background-size:9px}
#navigation {padding:0px;}
.control-menu {display:none}
/** fin menu **/

.contenidos {height:100vh;overflow-y:hidden;padding-left:180px;display:flex;align-items:center;}
.contenidos section#home {background:url(../img/mapa.png) no-repeat 10% 10%; background-size:auto 100%; padding:60px; text-align: center; width: 100%;overflow-y:auto;}
.contenidos section#home img {max-width:900px; width:100%}
section#home .cel {display:none}

@media (max-width:900px) {
  body {background:url(../img/bg-cel.jpg) no-repeat; background-size:cover; font-size:12px}
}
@media (max-width:780px) {
  body {background:url(../img/bg-cel.jpg) no-repeat; background-size:cover; font-size:12px}
  /** menu **/
  nav {height:10vh;position:fixed;width:100%;padding:0;margin:0}
  nav ul {padding:20px 0}
  nav ul li {padding:5px 20px;}
  .control-menu {display:block;}
  .control-menu a {cursor:pointer;}
  .control-menu a span {display:inline-block; height:40px; width:30px; text-indent:-9999px;}
  .control-menu .close {background-image:url("../img/close.png"); background-position:right center; background-repeat:no-repeat; display:none;}
  .control-menu .open {background-image:url("../img/menu.png"); background-position:right center; background-repeat:no-repeat; display:block;}
  .nav-items {height:90vh; margin-top:10vh; width:70%; transition:all 0.4s ease-in-out 0s; position:fixed; top:0px; left:-110%; padding:0; text-align:left; z-index:0;box-shadow:5px 5px 5px 0 rgba(0, 0, 0, 0.5);overflow:auto}
  .nav-items a {display:block; padding:10px 0px;}
  #navigation {padding:0 10px; z-index:999}
  #navigation:target .nav-items {background:black; top:0px; left:0; transition:all 0.4s ease-in-out 0s;}
  #navigation:target .open {display:none;}
  #navigation:target .close {display:block;}
  nav ul li a.activo {background-position:0px 13px;padding-left:12px;background-size:9px}
  /** fin menu **/
  .contenidos {padding-left:0px;}
  .contenidos section#home {height:100vh; box-sizing:border-box;padding:15vh 0px 5px; background-size:90% auto; background-position:center 40%; width:100%}
  .contenidos section#home img {width:90%}
  section#home .pc {display:none}
  section#home .cel {display:block; margin:0 auto}
}