JSFiddle - React, Tailwind, and code Playground

HTML

<header>
    <div class="logo">logo</div>
    <div class="idioma">idioma</div>
</header>
<section>
    <div class="izq"></div>
    <div class="der"></div>
</section>

CSS

*{margin:0; padding:0;}
header{
    background: #999;
    position: relative;
}
.logo{
    background: rgba(200,200,100,0.5);
    width: 150px;
    height: 150px;
    position: absolute;
    top: 0;
    left: 20px;
    border: 5px solid #999;
    border-top: none;
}
.idioma{text-align: right;}

.izq{
    background: #ADF;
    width: 50%;
    float: left;
    height: 300px;
}
.der{
    background: #AFD;
    width: 50%;
    float: right;
    height: 300px;
}