body {
    background: linear-gradient(to right, rgb(158, 153, 153), rgb(93, 88, 88));
}



.navbar .container-fluid {
    background-color: rgb(23, 180, 23);
}

.navbar {
    background-color: rgb(23, 180, 23);
}


.navbar {
    padding-top: 0.6rem;
    padding-bottom: 0.6rem;
}


.navbar .container-fluid {
    padding-left: 1rem;
    padding-right: 1rem;
}


@media (max-width: 575.98px) {
    .navbar {
        padding-top: 0.35rem;
        padding-bottom: 0.35rem;
    }

    .navbar-toggler {
        padding: 0.25rem 0.5rem;
    }
}

/* Decoracion nosotros */

#Nosotros {
    display: flex;
}

.carousel-item {
    border: 2px solid #000;
    background: no-repeat center center scroll;
    background-size: cover;
    -webkit-background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
}


.nosotros-equal-height {
    align-items: stretch;
}

.nosotros-equal-height .left-content,
.nosotros-equal-height .carousel-item,
.nosotros-equal-height .carousel-inner,
.nosotros-equal-height .carousel-img {
    height: 100%;
}


.carousel-img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    display: block;
}


header h1 {
    font-size: 1.8rem;
}

@media (min-width: 768px) {

    header h1 {

        font-size: 2.5rem;

    }

    .nosotros-equal-height .left-content {

        padding: 2rem;

    }


    #Nosotros .left-content p {
        margin-bottom: 0.4rem;
    }


    .nosotros-equal-height .col-md-6 .p-3 {
        padding: 0.6rem;
    }

    @media (max-width: 767.98px) {

        #Nosotros .left-content p {
            margin-bottom: 0.8rem;
        }

        .nosotros-equal-height .col-md-6 .p-3 {
            padding: 0.8rem;
        }
    }

}

.imagencarousel1 {
    background-image: url(img/gorrafreedom.png);
}

.imagencarousel2 {
    background-image: url(img/buenna\ gorritaa.png);
}

.imagencarousel3 {
    background-image: url(img/gorritas\ de\ la\ buenas.png);
}

.imagencarousel4 {
    background-image: url(img/otra\ buena\ gorrita.png);
}


#videoinst .ratio {

    max-width: 100%;

    --bs-aspect-ratio: 56.25%;
    height: auto;
}

#videoinst .col-md-6 {
    display: flex;
    align-items: center;
    justify-content: center;
}


#videoinst .ratio-16x9,
#videoinst .ratio-4x3,
#videoinst .ratio {
    max-height: 420px;
    width: 100%;
}

@media (max-width: 576px) {

    #videoinst .ratio-16x9,
    #videoinst .ratio-4x3,
    #videoinst .ratio {
        max-height: 260px;
    }
}


.square-inner {
    aspect-ratio: 1 / 1;
    width: 100%;

    max-width: 360px;
    overflow: hidden;
    margin: 0 auto;
}

.square-inner .carousel,
.square-inner .carousel-inner,
.square-inner .carousel-item {
    height: 100%;
}

@media (min-width: 768px) {

    .nosotros-equal-height {
        display: flex;
    }

    .nosotros-equal-height>.col-md-6 {
        display: flex;
        align-items: center;
    }
}

@media (max-width: 991.98px) {
    .square-inner {

        max-width: 320px;
    }
}

a.nav-link {
    font-family: Arial;
    color: rgb(255, 255, 255);
}

a.nav-link:hover {
    color: rgb(255, 255, 0);
}


a.navbar-brand {
    font-family: sans-serif;
    color: rgb(0, 255, 255);
    font-weight: bold;
    letter-spacing: 1px;

}

a.navbar-brand:hover {
    color: rgb(0, 255, 255);
}

header {
    padding-top: 5%;
    color: rgb(255, 255, 255);
    align-items: center;
    text-align: center;
    font-family: fantasy;
    letter-spacing: 1px;
}

h2 {
    color: rgb(255, 255, 255) !important;
    align-items: center;
    text-align: center;
    font-family: fantasy;
    letter-spacing: 1px;
}

p {
    color: rgb(255, 255, 255);
    align-items: center;
    text-align: center;
    font-family: fantasy;
    letter-spacing: 1px;
}

.footer-personalizado {
    padding-top: 2rem;
    margin-top: 2.5rem;
}

.footer-personalizado {
    text-align: center;
}

.footer-personalizado a,
.footer-personalizado a:visited {
    color: #000;
    text-decoration: none;
}

.footer-personalizado a:hover,
.footer-personalizado a:focus {
    color: #000;
    text-decoration: none;
}


.footer-personalizado .icons {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.footer-personalizado small {
    display: block;
    color: #000;
    text-align: center;
}

.presentaciones {

    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;

    overflow: visible;
      color: rgb(255, 255, 255);
    align-items: center;
    text-align: center;
    font-family: fantasy;
    letter-spacing: 1px;
}

.card-text {
    color: rgb(6, 6, 6);
    align-items: center;
    text-align: center;
    font-family: arial;
    letter-spacing: 1px;
}

.equipo {
    color: rgb(255, 255, 255);
    align-items: center;
    text-align: center;
    font-family: fantasy;
    letter-spacing: 1px;
}