/*Layout de la pagina*/

html{
    background-color: blueviolet;
}

body{
    padding: 45px 0px 0px 0px;
    height: 500px;
    background-color: aquamarine;
    overflow: hidden;
}

main{
    width: 1260px;
    height: 500px;
    margin:  0px 0px 0px;
    background-color: darkcyan;
}


#cajaIZ{
    float: left;
    width: 780px; /*780 + 10 + 10 = 800px*/
    height: 370px; /*370 + 30 = 400px*/
    margin: 0px 10px 0px 20px;
    padding: 30px 10px 0px;
    background-color: darkgreen;
}

#cajaDR{
    float: left;
    position: relative;
    width: 370px; /*370 + 30 = 400px*/
    height: 350px; /*350 + 50 = 400px*/
    margin: 0px 20px 0px 10px;
    padding: 50px 0px 0px 30px;
    background-color: darkgreen;
}

footer{
    clear: both;
    /*Al añadirle un border le tenemos que restar 2px al footer tanto en la altura como en la anchura*/
    width: 1258px;
    height: 98px;
    border: 1px solid;
    background-color: gray;
}

/*Elementos de la caja izquierda*/

form{
    margin-top: 4em;
    padding: 1em 0 1em 70px;
    border: 1px solid;
}


label{
    display: block;
}

input[type="text"]{
    display: block;
    width: 490px;/*500px - 10px*/
    padding-left: 10px;
    margin: 1em 0;
}

input[type="submit"]{
    display: block;
    width: 150px;
    height: 2em;
    background-color: #D8D8D8;
    margin: auto;
}

/*Elementos de la caja derecha*/

#img1{
    width: 150px;
    position: relative;
    top: -50px;
    left: 219px;
}

#img2{
    width: 150px;
    position: relative;
    top: 100px;
    left: -184px;
}

#img3{
    width: 150px;
    position: relative;
    top: 108px;
    left: 220px;
}