@import "style.css";

section{
    margin: 0;
    padding: 0;
}
.mainEdu {
    display: flex;
    text-align: left;
    background: url('../img/bg_header_salud.jpg') no-repeat;
    background-position: bottom;
    background-size: cover;
    padding: 20px;
    height: 60vh;
}
.mainEdu-left{
    flex: 2;
    padding: 20px;
}
.mainEdu-right {
    flex: 1;
    padding: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.mainEdu-left {
    text-align: left;
}

.mainEdu h1 {
    font-size: 3.4em;
    color: white;    
}

.linesub::after {
    content: '';
    display: block;
    width: 85px;
    height: 2px;
    background-color: #ff9900;
    margin: 3px 25px 0;

}
.mainEdu-title{
    font-size: 2em;
    color: white;   
}
.mainEdu-paragraph{
    font-size: 1.4em;
    color: white;
    width: 27em;
}
.information{
    background-color: #ff9900;
    color: #232f3e;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50vh;
    margin: 0;
    
}
.information-container{
    text-align: center;
    font-size: 1.5em;
    padding: 0 20px;
    max-width: 80%;
    font-weight: 600;
}
.information-container h3{font-size: 2em;}
.information-container h4{font-size: 1.4em;}
.information-container p{font-weight: 200;}



.stories-gov{
    background-color: #232f3e;
    padding: 0;
}

.backgroud-title-gov{
    color:white;
    padding: 3em;
    border-radius: 5px;
    text-align: center;
    font-size: 1.5em;
}
.backgroud-title-gov h4{font-weight: 100;}

.stories-container-gov{
    display: flex;
    justify-content: center;
    gap: 4em; 
    padding: 34px;
    flex-wrap: wrap;
    text-align: center; 
}
.story-gov{
    background-color: #dfe0e4db;
    border-radius: 40px;
    /* padding: 1.5em; */
    width: 30%;
    color: #232f3e;
}
.story-gov img{width: 30%;}

.story-gov h3{font-size: 2em;}
.story-gov p{ margin: 0;}
.story-gov i {margin-bottom: 4em;}




.video{
    background-color: #dfe0e4;
    padding: 40px 20px;
}
.container-video{
    display: flex;    
    align-items: center;    
    margin-left: 10%;
}
.text-video{ padding-left: 3%;}
.text-video p{font-size: 1.5em; }
.text-video h2{font-size: 2em;}

.button-industry{
    background-color: #232F3E;
    color: #ff9900;
    font-size: 1.5em;
    font-weight: bold;
    border: none;
    padding: 10px 20px;
    border-radius: 20px;
    cursor: pointer;
    margin-bottom: 10px;
    text-decoration: none;
}
.button-industry:hover{
    background-color: #ff9900 !important; 
    color: #232F3E;
}




@media (max-width: 1200px) {
    /* Añade tus estilos aquí para pantallas menores a 1200px */
}

@media (max-width: 992px) {
    .button-sticky{right: 20em;}
    .information{height: auto}
    .mainEdu-right{display: none;}
    .mainEdu-paragraph{width: 14em; font-size: 1.1em;}
    .mainEdu h1 {font-size: 2.5em;}
    .information-container h3{font-size: 1.7em;}
    .information-container h4{font-size: 1.1em;}
    .information-container p{font-size: 20px;}
    .story-gov{width:100%;}
    .about h2{font-size: 2em;padding-bottom: 3%;}
    .menu nav ul li a{padding: 1px 1px;}
    .whyAWS-benefits{grid-template-columns: 1fr;}
    .benefit-card-title{font-size: 1.1em;}
    .benefit-card-text{font-size: 0.9em;}
}

@media (max-width: 576px) {
    .button-sticky{right: 20em;}
    .information{height: auto}
    .mainEdu-right{display: none;}
    .mainEdu-paragraph{width: 14em; font-size: 1.1em;}
    .mainEdu h1 {font-size: 2.5em;}
    .information-container h3{font-size: 1.7em;}
    .information-container h4{font-size: 1.1em;}
    .information-container p{font-size: 20px;}
    .story-gov{width:100%;}
    .about h2{font-size: 2em;padding-bottom: 3%;}
    .menu nav ul li a{padding: 1px 1px;}
    .whyAWS-benefits{grid-template-columns: 1fr;}
    .benefit-card-title{font-size: 1.1em;}
    .benefit-card-text{font-size: 0.9em;}
}

@media only screen and (max-width: 575px) {
    .button-sticky{right: 14em;}
    .information{height: auto}
    .mainEdu-right{display: none;}
    .mainEdu-paragraph{width: 14em; font-size: 1.1em;}
    .mainEdu h1 {font-size: 2.5em;}
    .information-container h3{font-size: 1.7em;}
    .information-container h4{font-size: 1.1em;}
    .information-container p{font-size: 20px;}
    .story-gov{width:100%;}
    .story-gov h3{font-size: 1.5em;}
    .about h2{font-size: 1.5em;padding-bottom: 2%;}
    .menu nav ul li a{padding: 1px 1px; font-size: 0.7em;}
    .imagen img {width: 100%;}
    .text-video h2{font-size: 1.5em;}
    .button-industry{font-size: 1em;}
    /* .logo-lol{width: 88px;margin-left:12em;} */
}