body{
  font-family: 'Lekton', sans-serif;
  font-size: 18px;
}

.vistaCompleta{
  height: 100vh;
  /*width: 100vw;  */
}

section{
  margin-bottom: auto !important;
}

/*MEDIA QUERYS */

@media (min-width:320px) and (max-width:479px){
  .estrellas{
    display: none;
  }

  #icn-menu{
    font-size: 40px;
  }

  #logo{
    margin-top: 25%;
  }

  #menu-portada,#menu-estrella-2, #flecha-down {
    display: none;
  }
  /* ABOUT*/
  #sobre-mi{
    font-size: 15px;
  }

  #img-mex{
    display: none;
  }

  #datos{
    margin-top: -15%;
  }

  #hob>i{
    font-size: 25px;
  }

  #cv{
    width: 100px;
	/*margin-left: -3%;*/
  }
  /*SKILLS*/
  #skills > section > h3{
    font-size: 25px;
  }

  .btn-listas{
    display: none;
  }

  #mob-listas{
    display: block;
    font-size: 15px;
  }

  #mob-listas > div> ul> li > i{
    color: #757575;
  }

  #mob-listas > div> ul> li{
    font-weight: bold;
  }
  /*Proyectos*/
  #proyectos{
    margin-top: -5%;
  }

  #p1{
    margin:0 0 5% 9% !important;
    font-size: 15px;
  }

  #p2{
    font-size: 15px;
    margin-bottom: 5%;
  }

  .ocultar{
    display: none;
  }

  #p3{
    margin-bottom: 7%;
  }
  /*Contacto*/
  #contacto > section > h3{
    font-size: 30px;
  }
}

@media (min-width:480px) and (max-width:767px){
  #mob-listas{
    display: none;
  }
}

@media(min-width: 768px) and (max-width:1023px){
  #mob-listas{
    display: none;
  }

    #icn-menu{
      font-size: 50px;
    }

    .marcoLogo{
      margin-top: 25%;
    }

    .m-port{
      display: none;
    }

    #flecha-down{
      margin-top: 10%;
    }

    #list1{
      height: 10%;
    }

    #proyectos{
      margin-top: -3%;
    }

    #menu-proy{
      margin-top: 10%;
    }
}

@media(min-width: 1024px){

  .estrellas{
    display: block;
  }

  #mob-listas{
    display: none;
  }

  .marcoLogo{
    /*margin-top: 10%;*/
  }

  #flecha-down{
    /*margin-top: 5%;*/
  }

  #titulo-sec2{
    margin-top: 2%;
  }

  #menu-about{
    margin-top: -10%;
  }

  /*#list1{
    margin-left: 20%;
  }

  #list2{
    margin-left: 20%;
  }*/

}

/*@media (min-width: 320px) and (orientation: landscape) {
  .estrellas,#menu-portada,#menu-estrella-2, #flecha-down {
    display: none;
  }

  .btn-listas{
    display: none;
  }

  #mob-listas{
    display: block;
    font-size: 15px;
    text-align: center;
  }

  #mob-listas > div> ul> li > i{
    color: #757575;
  }

  #mob-listas > div> ul> li{
    font-weight: bold;
  }

  #proyectos{
    margin-top: -3%;
  }

  #p1{
    margin-left: 10% !important;
  }

  #p3{
    margin-bottom: 5%;
  }

}*/

/*@media (min-width: 1100px) and (orientation: landscape) {


  #menu-estrella-2{
    margin-top: -5%;
  }

  #icn-menu{
    font-size: 50px;
  }

  #list1{
    width: 300px;
  }

  #list2{
    margin-left: 25%;
  }

  #ul-2{
    margin-left: 10%;
  }

}*/

#ul-1> li{
  opacity: 0;
}

#ul-2> div> li{
  opacity: 0;
}
/*  MARGENES */

.mb-3{
	margin-bottom: 3%;
}
.mt-01{
  margin-top: -1%;
}
.mt-02{
  margin-top: -2%;
}
.mt-03{
  margin-top: -3%;
}

.mt-05{
	margin-top: -5%;
}

.mt-07{
	margin-top: -12%;
}

.mt-1{
  margin-top: 1%;
}

.mt-3{
  margin-top: 3%;
}

.mt-7{
  margin-top: 7%;
}

.mt-10{
  margin-top: 10%;
}

.mt-20{
  margin-top: 20%;
}

.mt-50{
	margin-top: 50%;
}
.mt-95{
  margin-top: 95%;
}

#p1{
  margin-left: 5%;
  margin-bottom: 4%;
}

#p3{
	margin-bottom: 5%;
}

.ml-5{
  margin-left: 50%;
}

.ml-10{
	margin-left: 10%;
}

.ml-27{
  margin-left: 27%;
}

.ml-40{
  margin-left: 45%;
}

.mr-3{
  margin-right: 3%;
}

.mr-5{
  margin-right: 5%;
}

.azul-tema{
  color: #817091;
}

.rosa-tema{
  color: #f197a3;
}

.resaltar{
  font-weight: bold;
}
  /*prueba2*/
.gradiente-Princ{
  background: linear-gradient(135deg, rgba(227,192,192,0.93) 0%, rgba(241,151,163,0.9) 35%, rgba(129,112,145,0.95) 100%);
  /*linear-gradient(135deg, rgba(246,186,166,1) 0%, rgba(241,151,163,1) 41%, rgba(189,93,115,1) 100%); color1*/
  -moz-linear-gradient(left, rgba(246,186,166,1) 0%, rgba(241,151,163,1) 51%, rgba(189,93,115,1) 100%);
  /*-webkit-gradient(left top, right top, color-stop(0%, rgba(246,186,166,1)), color-stop(51%, rgba(241,151,163,1)), color-stop(100%, rgba(189,93,115,1)));*/
}

.gradiente-Sec{
	background: linear-gradient(135deg, rgba(129,112,145,1) 0%, rgba(241,151,163,1) 48%, rgba(241,223,223,1) 100%);
}

.bck-oscuro{
  background-color: rgba(129, 112, 145, 0.9);
}

.bck-claro{
  background-color: #f197a3;
}

.bck-melon{
  background-color: rgba(227, 192, 192, 0.5);
}
/*   ANIMACIÓN PORTADA   */
/*$anime-time: 8s;

$box-size: 200px;
$clip-distance: .05;
$clip-size: $box-size * (1 + $clip-distance * 2);
$path-width: 2px;

$main-color: #69ca62;

%full-fill {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}*/

.marcoLogo{
  /*border: 1px solid white;*/
  /*width: 40%;*/
  /*@extend %full-fill;
 width: $box-size;
 height: $box-size;
 margin: auto;
 background: $codepen-logo-path no-repeat 50% / 70% rgba(#000, .1);
 color: $main-color;
 box-shadow: inset 0 0 0 1px rgba($main-color, .5);

 &::before,
 &::after {
   @extend %full-fill;
   content: '';
   z-index: -1;
   margin: -1 * $clip-distance * 100%;
   box-shadow: inset 0 0 0 $path-width;
   animation: clipMe $anime-time linear infinite;
 }

 &::before {
   animation-delay: $anime-time * -.5;
 }

 // for debug
 &:hover {
   &::after,
   &::before {
     background-color: rgba(#f00, .3);
   }
 }

}*/

}

/*   MENÚ ESTRELLAS   */
.estrellas{
}

.estrellas > li > i {
  cursor: pointer;
}

/*  SOBRE MI */

.card-panel{
  background-color: rgba(176, 190, 197, 0.4);
}

p{
  text-align: justify;
}

/*.hobbies: hoover{

}*/

.down-cv{
  border-radius: 50%;
  margin: 3%;
}

#menu-proy{
  padding-left: 4%;
}

#menu-proy > li{
  padding-bottom: 80%;
}