*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    list-style: none;
    text-decoration: none;
    font-family: "Poppins", sans-serif;
    font-weight: 400
}

a:link, :visited, :hover, :active{ /* saca las decoraciones de links */
    color: none;
    text-decoration: none;
}

:root{
    --bg-color-1: #EDE2D1;
    --bg-color-2: white;
    --text-color-1: grey;
    --text-color-2: black;
    --text-color-3: white;
    --color-btn: grey;
    --border-1: rgb(139, 139, 139);

}

/* TEXTO */
.size-1{font-size: 1rem;}
.size-2{font-size: 2rem;}
.size-3{font-size: 3rem;}
.size-13{font-size: 1.3rem;}

.uppercase{text-transform: uppercase;}
.text-center{text-align: center;}
.hover-1:hover{color: black;}
.bold{font-weight: bold;}

.color-1{color: var(--text-color-1);}
.color-2{color: var(--text-color-2);}
.color-3{color: var(--text-color-3);}

.color-btn{color: var(--color-btn)}

/* BACKGROUNDS*/

.bg-color-1{background-color: var(--bg-color-1)}
.bg-color-2{background-color: var(--bg-color-2)}

.bg-transparent{background-color: rgba(0, 0, 0, 0.397);}


/* SHADOW */
.shadow-1{box-shadow: 0rem 0rem 1rem var(--border-1)}
.shadow-2{box-shadow: 0rem 0rem 1rem var(--border-1),inset 0rem 0rem 1rem rgba(128, 128, 128, 0.445)}

p {text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2)}

/* BORDER */

.border-radius-3{border-radius: 3px;}
.border-radius-6{border-radius: 6px;}

.border-radius-25{border-radius: 25px;}

/* POSITION */

.absolute {position: absolute}
.relative {position: relative}

/* TAMAÑOS */

.max-w-50por{max-width: 50%;}
.max-w-45 {max-width: 45rem;}
.max-w-35 {max-width: 35rem;}
.max-w-30 {max-width: 30rem;}
.width-100p{width: 100%;}

.width-20r{width: 20rem;}

.height-3r{height: 3rem;}
.height-70vh{height: 50vh;}
.height-content{height: fit-content;}

/* PADDING Y GAP */
.gap-05 {gap: .5rem;}
.gap-1 {gap: 1rem;}

.p-05 {padding: .5rem;}
.p-1 {padding: 1rem;}
.p-2 {padding: 2rem;}
.p-t-3r {padding-top: 3rem;}

/* FLEXBOX */

.self-center{align-self: center;}
.wrap{flex-wrap: wrap;}
.column{flex-direction: column}
.row{flex-direction: row}
.self-center{align-self: center}

.flex-center-center{
    display: flex;
    justify-content: center;
    align-items: center;}

.flex-arround-center{
    display: flex;
    justify-content: space-around;
    align-items: center;}

.flex-between-center{
    display: flex;
    justify-content: space-between;
    align-items: center;}



@media (max-width: 768px) {
    .footer-content,
    .footer-bottom {
        justify-content: center;
        text-align: center;
    }

    .media-1{font-size: 1.5rem;}
    .media-2{font-size: 1rem;}
    .media-3{
        font-size: .8rem;
        flex-direction: column;
    }
    h2{font-size: .5rem;}
    .media-4{
        flex-direction: column;
    }
    .media-img{
        width: 90%;
        height: auto;
    }

}