*{
    box-sizing:border-box;
}

body {
    background: url("Img/plantas.jpg") center / cover fixed no-repeat;
    margin:0;
}

/* ================= TITLE BAR ================= */
.title-bar {
    height:auto;
    display: flex;
    justify-content: space-between;
    padding:10px;
    border:0px;
}

.title-text {
    color: white;
    font-size:15px;
}

button {position:static;}

/* ================= CAJAS GENERALES ================= */
.MainW1,.Main,.Main_1{
    margin: 7px;
    padding: 10px;
    background-color:white;
    border: 1px solid #d0d0df;
    border-radius: 4px;
    overflow: hidden;
}

.BOX {
    background-color:white;
    border: 1px solid #d0d0df;
    border-radius: 4px;
}

/* ================= HOME WINDOW ================= */
.Main_1 {
    display: flex;
    justify-content: space-around;
    align-items: center;
    height: 270px;
}

.Main_2 {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    margin: 7px;
}

/* ================= INFO ================= */
#pFp {height: 250px;width: 180px;}
#PfP {height: 250px;width: 180px;}

#b1 {
    width: 240px;
    height: 220px;
    position: relative;
}

.info {
    font-size:22px;
    font-weight: bold;
    position:relative;
}

.nombre,.titulo {margin:3px;}
.nombre{
    padding-left:5px;
    border-bottom: 2px solid black;
    padding-top:10px;
}

.stats {
    position:absolute;
    top:-40px;
    left:20px;
}

.gif {
    position:absolute;
    bottom:-20px;
    right:20px;
    height:40px;
    width:40px;
}

/* ================= BOTONES ================= */
.butones {
    padding-left:10px;
    display:flex;
    align-items:center;
    gap:5px;
}

.bt {
    border: 2px solid black;
    border-bottom:2px solid white;
    border-radius:4px 0 0 0;
    width:30px;
    height:30px;
}

/* ================= TEXTO ================= */
.bTxT0 {
    padding:10px 15px;
}

.bTxT1 {
    padding:0 10px;
    height:120px;
    overflow: hidden;
    overflow-y: scroll;
    border:2px solid blue;
}

#MY_text {font-size:16px;}

/* ================= FOOTER ================= */
.Main_3 {
    display:flex;
    justify-content:space-between;
    gap:2em;
    padding:0 20px;
    height:30px;
    margin-top:5px;
}

/* ================= NAV WINDOW ================= */
#W1 {
    max-width:245px;
    padding-bottom:20px;
    display:flex;
    flex-direction:column;
    gap:1em;
}

#Botoncito {
    border:2px solid rosybrown;
    height:30px;
    font-size:15px;
    font-weight:bold;
    margin:0 10px;
}

#W3{
    max-width:200px;
    margin-top:20px;
}
.return {
    margin:20px 10px 30px;
    padding:10px;
    text-align:center;
}

.BtRt {width:150px;}
.TxRt {font-size:15px;}

#HOME {margin-top:35px}
#W1   {margin-top:90px;}

.title-bar-controls {gap:0.2em;}

.window-body {
    margin:10px 15px;
}
#W4 {
    max-width:230px;
    margin:20px 8px;
}
/* ================= GRID PRINCIPAL ================= */
.grid {
    width: 800px;
    display: grid;
    grid-template-columns: 1fr 300px;
    grid-template-rows: auto;
    grid-template-areas: 
    "HOME W1"
    "HOME W4";

    margin: 0 auto;
    gap: 2em;

    /* CLAVES */
    height: auto;
    align-items: start;
}

#W1 {grid-area: W1;}
#W4 {grid-area: W4;}
#HOME {grid-area: HOME;}