*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:Arial, Helvetica, sans-serif;
}

body{
    background:#e9e9e9;
    display:flex;
    justify-content:center;
    padding:30px;
}

.contenedor{
    width:900px;
    background:white;
    display:flex;
    border:2px solid #ccc;
}

/* IZQUIERDA */

.izquierda{
    width:35%;
    background:#57b4b0;
    color:white;
    padding:20px;
}

.foto{
    background:#2e5d93;
    border:4px solid #f5a623;
    border-radius:10px;
    padding:20px;
    text-align:center;
    margin-bottom:20px;
}

.foto img{
    width:180px;
    height:180px;
    border-radius:50%;
    background:white;
}

.caja{
    background:#3e79a8;
    border:4px solid #f5a623;
    border-radius:10px;
    padding:20px;
    margin-bottom:20px;
}

.caja h2{
    margin-bottom:15px;
}

.caja p,
.caja li{
    margin-bottom:10px;
}

ul{
    margin-left:20px;
}

/* BARRAS */

.barra{
    background:#d9d9d9;
    height:10px;
    border-radius:20px;
    margin-bottom:15px;
}

.nivel{
    background:#244f94;
    height:10px;
    border-radius:20px;
}

.nivel1{
    width:100%;
}

.nivel2{
    width:60%;
}

.nivel3{
    width:25%;
}

/* DERECHA */

.derecha{
    width:65%;
    padding:20px;
}

.encabezado{
    background:#35689b;
    color:white;
    border:4px solid #f5a623;
    border-radius:10px;
    padding:30px;
    margin-bottom:20px;
}

.encabezado h1{
    font-size:45px;
}

.encabezado h3{
    margin-top:10px;
}

.seccion{
    border:4px solid #f5a623;
    border-radius:10px;
    padding:20px;
    margin-bottom:20px;
}

.seccion h2{
    background:#69c4bc;
    color:#1f4b87;
    padding:10px;
    margin-bottom:15px;
}

.seccion h3{
    color:#244f94;
    margin-bottom:10px;
}

.seccion p,
.seccion li{
    line-height:1.6;
}