*{
    margin:0px;
    padding:0px;
    box-sizing:border-box;
}

html{
    font-size: 10px;
}

body{
    font-family: sans-serif;
    background-image: url(../img/main.jpeg);
}

.layout{
    width: 400px;
    /* border: 1px solid black; */
    margin-top:250px;
    margin-left:850px;
}

.layout_main_logo {
    margin-left:250px;
}

.layout_main_logo--img{
    width:120px;
    height:80px;
}

form{
    display:grid;
    justify-content: center;

}

.nombres{
    display: flex;
    flex-direction: column;
    padding-top:10px;
}

.inputNombre,
.inputTiempo{
    width:100%;
    padding:10px;
    margin:3px 0px;
    background-color: rgba(255, 255, 255, 0);
    border:1px solid #fff;
    color:white;
    border-radius: 5px;
}

.inputTiempo{
    width: 100px;
    color:white;
}

.start_button{
    width: 100%;
    height:40px;
    background-color:white;
    /* color:black; */
    border-radius:5px;
    letter-spacing:1px;
    text-transform: uppercase;
}


/* CRONOMETRO

/* .container{
    display:flex;
    flex-direction:column;
    align-items: center;
    justify-content: center;
}

.header{    
    margin-top:100px;
    display:flex;
    flex-direction:column;
    align-items: center;
    justify-content: center;
    /* border:1px solid black; */
/* }

.header img{
    width:300px;
    height:250px;
}

.main{
    display:flex;
    flex-direction:row;
    align-items: center;
    justify-content: center;
}

#h1-tecnologia-web,
#h2-frontend
{
    color:white;        
    font-size:70px;
}

#h2-frontend{
    font-size:50px;
}

.cronometro {
    font-size:90px;
    color:white;
    display:flex;
    flex-direction:column;
    margin:10px;
    margin-top:10px;
    padding:30px;
    border:1px solid black;
    border-right: 1px solid white;
/* }

.cronometro span{
    display:flex;
    align-items: center;
    justify-content: center;
}   */

.layout_cronometro{
    display:grid;
    justify-items:center;
    width:800px;
    min-height:600px;
    border:1px solid black;
    margin:auto;
    font-size:16px;
    font-weight:bolder;
    color:white;
}

.tiempo{
    display:flex;
    flex-direction: row;
}

.hora,
.segundo,
.minuto{
    width: 150px;
    height: 150px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    margin-left:30px;
}

.minuto{
    padding-left:20px;
    padding-right:20px;
    border-right:1px solid gray;
    border-left:1px solid gray;
}

span{
    font-size:100px;
    font-weight:100;
}

#temporizador{
    font-size: xx-large;
    font-weight:bolder;
    color:red;
    border: 1px solid white;
}