@import url(https://fonts.googleapis.com/css?family=Open+Sans:600,300);

*{margin:0; padding:0; box-sizing:border-box;}
html,body,#portada,#sobremi{width:100%; height:100%;}
body{position:relative; overflow:hidden; background-color:rgb(2,3,3);}
h1{
	  display:inline;
	  position:absolute;
	  top:50%; left:50%;
	  margin:-50px 0 0 -124px;
	  letter-spacing:-7px;
	  font:300 72px/1.4 'Open sans',Helvetica;
	  color:#c0c0c0;
  cursor:default;
	  transition:margin 330ms linear;
}

#menu{
	  display:block;
	  width:26px; height:20px;
	  position:relative;
	  top:25px;
	  z-index:3;
	  margin:0 auto;
	  padding-top:2px;
	  border-radius:3px;
	  cursor:pointer;
}
#menu>span{display:block; width:26px; height:2px; position:relative; margin:0 auto; border-radius:1px; background:#d0d0d0; transition:all 300ms ease-out;}
#menu span+span{margin-top:5px;}
.dos{opacity:1;}

#sobremi{position:absolute; top:100%; left:0; color:#ccc;transition:top 300ms linear;}
#sobremi div{width:100%; position:absolute; top:50%; left:0; margin:-16px 0 0 0; text-align:center;}
#sobremi span{display:block; letter-spacing:1px; font:300 16px/16px 'Open sans',Helvetica;}
#sobremi span:not(:first-child){margin-top:15px;}
#sobremi span:nth-child(3),#sobremi span:nth-child(4){margin-left:-52px;}
#sobremi em{font-style:normal; color:#454545; margin-right:2px;}

.close .uno{top:7px; transform:rotate(405deg) translate3d(0,0,0);}
.close .dos{opacity:0; transform:rotate(720deg) translate3d(0,0,0); transition-duration:0ms;}
.close .tres{top:-7px; transform:rotate(315deg) translate3d(0,0,0);}
.sobremi h1{margin-top:-136px;}
.sobremi #sobremi{top:0;}