body, html{
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    --red: #780000;
    --green: #606c38;
}
.gorro{
    position: absolute;
    z-index: 1;
    width: 120px;
    top: -30px;
    left: -20px;
    transform: rotate(-35deg);
}
.divMid{
    position: relative;
}
.logo{
    width: 10rem;
}
.bd-green{
    border-left: 7px solid var(--green);
}
.bd-red{
    border-left: 7px solid var(--red);
}
.card2 {
    width: 100%;
    /* height: 100%; */
    margin: 0 auto;
    background: linear-gradient(0deg, #000, #272727);
    border-radius: 8px;
    z-index: 1;
}

.tools {
    display: flex;
    align-items: center;
    padding: 9px;
}

.circle {
padding: 0 4px;
}

.box {
    display: inline-block;
    align-items: center;
    width: 10px;
    height: 10px;
    padding: 1px;
    border-radius: 50%;
}

.red {
    background-color: #ff605c;
}

.yellow {
    background-color: #ffbd44;
}

.green {
    background-color: #00ca4e;
}