@import "https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700,800";

html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}

body {
    display: flex;
    flex-direction: column;
}

main {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    padding: 20px;
}

* {
    margin: 0;
    padding: 0;
    text-decoration: none;
    list-style: none;
    box-sizing: border-box;
    font-family: "Montserrat";
}

header {
    position: sticky;
    top: 0;
    z-index: 1000;
}

nav {
    display: flex;
    background: #ffffff;
    font-weight: bold;
    height: 80px;
    width: 100%;
    border-bottom: 1px solid #ccc;
    justify-content: center;
}

nav ul {
    display: flex;
    flex-basis: 100%;
    justify-content: center;
}

nav ul li {
    line-height: 100px;
    text-align: center;
    flex-basis:content;
}

nav ul li a {
    color: #000;
    font-size: 18px;
    padding: 20px 20px;
    border-radius: 3px;
    text-transform: capitalize;
}

li a:hover {
    background: #5499ad;
    color: #ffffff;
    transition: 0.5s;
    padding: 20px;
    border-radius: 25px;
    text-decoration: none;
}



.containerB {
    width: 100%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
    grid-gap: 0rem;
}

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

.imgBanner {
    width: 100%;
    margin-top: 20px;
    border-radius: 75px;
    
}


.imgBannerProductInfo {
    margin-right: 300px; /* Ajusta el margen derecho según sea necesario */

   
}

.imgContenedor {
    margin-left: auto; /* Mueve el contenedor de la imagen y el botón hacia la derecha */
    display: flex;
    align-items: center;
    
}
.imgCaptus {
    max-width: 15%;
    
}

.col2 {
    padding: 1rem 2rem;
    display: flex;
    text-align: center;
    justify-content: center;
    flex-direction: column;
}

h1 {
    font-size: 2.5rem;
    color: darkolivegreen;
}

.btnBanner {
    background: darkolivegreen;
    margin-right: 100px;
    color: #000;
    padding: 15px 40px; /* Ajusta el padding para hacer el botón más pequeño */
    border-radius: 15px;
    text-decoration: none;
    font-size: 14px; /* Ajusta el tamaño de la fuente para hacer el botón más pequeño */
}