@import url('https://fonts.googleapis.com/css?family=Roboto&display=swap');
@import url('https://fonts.googleapis.com/css?family=Merriweather:300,400,700&display=swap');

* {
    margin: 0px;
    padding: 0px;
}

body {
    /* background: #f5f5f5;  */
    background: #ffffff;
    color: #4f4f4f;
    font-weight: 300;
    font-family: 'Roboto', 'Merriweather', serif;
}

.project {
    background: #ff7777;
    padding: 10px;
    margin: 20px 20px;
}

/* .row {
    background: rgba(250, 250, 250, 0.1);
    background: #ffffff;
} */

.container {
    width: 90%;
    max-width: 1400px;
}

.navbar {
    background: #fffdfd;
    color: #000000;
    /* padding: 20px;
     */
}

.footer {
    background: #ff7777;
    color: #ffffff;
    text-align: center;
}

.hidden {
    display: none;
}

/* @media screen and (max-width:768px) {
    body {
        background: #000000;
    }
} */

/* SOLO APLICA EN EL PROYECTO */
ul {
    margin: 0px 20px;
}

li {
    padding: 5px 0px;
}

.sub-list {
    padding-left: 5px;
}

h2 {
    font-weight: 400;
}


/* COLORES H3 PROYECTOS */
.pb {
    color: #ff7777;
}

.sh {
    color: #421B9A;
}

.om {
    color: #d48b07;
}

/* COLORES LINEAS PROYECTOS */
.line-pb {
    background: #ffeeee;
}

.line-sh {
    background: #f1eeff;
}

.line-om {
    background: #fff3cf;
}

/* .line-about {
    background: #fdebeb;
} */


.hmw {
    font-weight: 400;
}

.icono {
    width: 100px;
    height: 100px;
}

section {
    padding: 40px 0px;
}

p {
    font-size: 18px;
}

h1 {
    font-size: 100px;
}

.first {
    margin-top: 10%;
    margin-bottom: 10%;
}

h1,
h3,
h4,
h5,
h6,
article {
    padding: 20px 0px;
}

.img-fluid {
    padding-bottom: 10px;
}

.img-b {
    padding: 0px !important;
    border: 1px solid;
    border-color: #adadad;
    margin: 10px;
}

/* .stage {
    text-decoration: none;
    color: #c5c5c5;
  }
.stage:hover {
      color: #000000;
  }
.stage {
      transition: color 0.5s linear 0.2s;
  } */

.project,
.gray-hov {
    padding: 10px;
    text-decoration: none;
    background-color: #ffffff;
    transition: all .5s ease-in-out;
    overflow: hidden;
    /* transition: all 0.2s linear 0.4s; */
}

/* .project:hover {
    background-color: #ebebeb;
} */

.project:hover,
.gray-hov:hover {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    transition: all .8s ease-in;
}

/* .I-am {
    background: url(../PORTAFOLIO/Image/DSC02018.jpg)
}
.I-am:hover {
    background: url(../PORTAFOLIO/Image/Yo-Gif.gif)
} */

.gray-hov {
    padding: 20px 0px;
    transition: all .5s ease-in;
    /* border: 1px solid;
    border-color: #adadad; */
}

.gray-hov:hover {
    /* background-color: #eeeeee; */
    color: #000000;
    transition: all .5s ease-in;
}

.prototype {
    width: 800px;
    margin: 20px auto;
    height: 100%;
    display: flex;
    align-items: center;
}

/* SECTION */
/* 
#img {
    cursor: crosshair;
    border: 1px solid #ccc;
}

#square {
    position: absolute;
    width: 100px;
    height: 100px;
    border: 1px solid;
    cursor: crosshair;
}

#imgSmall {
    width: 200px;
    height: 200px;
    overflow: hidden;
    border: 1px solid #000;
}

#imgSmall img {
    position: relative;
}

.wrapper {
    width: 80%;
    margin: 5px auto;
}

.fuente {width="1000" height="562.5"
    margin-top: 2rem;
}

.fuente a {
    font-size: 1.5rem;
    text-decoration: none;
    color: Blue;
}

.fuente a:hover {
    color: red;
} */