.paginas-web-inicio{
    width: 100%;
    padding: 80px 0% 80px 20%;
    position: relative;
    display: inline-flex;
    justify-content: flex-end;
    align-items: center;  
    background-color: rgb(114, 183, 198, .5);
    flex-direction: row-reverse;
}
.paginas-web-inicio>img{
    width: 100%;
    max-height: 500px;
    object-fit: cover;
    object-position: top;    
}
.paginas-web-inicio>div{
    position: absolute;
    width: 30%;
    background-color: #fff;
    padding: 50px;
    border-radius: 7px;
    left: 7%;
    box-shadow: 1px 1px 13px 4px rgba(32,32,32,.2);
    transition: all .3s ease-out;
}
.paginas-web-inicio>div:hover{
    transform: scale( 1.03);
}
.paginas-web-inicio>div>h4{
    width: 100%;
    font-size: 30px;
    font-family: 'Titulo',acumin,sans-serif;
    margin-bottom: 30px;
    color: #202020;
    text-align: center;
    position: relative;
    z-index: 2;
}
.paginas-web-inicio>div>p{
    width: 100%;
    font-size: 17px;
    font-family: 'Principal',sans-serif;
    margin-bottom: 30px;
    color: #505050;
    text-align: justify;
    position: relative;
    z-index: 2;
}
.paginas-web-inicio>div>a{
    background-color: #00AD50;
    color: rgba(255,255,255,1);
    font-family: 'Titulo',acumin,sans-serif;  
    font-size: 17px;
    display: flex;
    width: 30%;
    padding: 10px;
    justify-content: center;
    position: relative;
    box-sizing: border-box;
    border-radius: 1em;
    transition: all .3s ease-out;
    margin: 0px auto;
}
.paginas-web-inicio>div>a:hover{
    transform: scale(1.04);    
}
@media (max-width: 800px){
    .paginas-web-inicio{
        width: 100%;
        padding: 80px 5% 20px 5%;    
        justify-content: justify;
        align-items: center;  
        background-color: rgb(114, 183, 198, .5);
        flex-direction: row-reverse;
        flex-wrap: wrap;
        overflow: hidden;
    }
    .paginas-web-inicio>img{
        width: 140%;
        max-height: 500px;    
        margin-left: -40%;
        margin-top: -10%;
        margin-bottom: 10%;
    }
    .paginas-web-inicio>div{
        position: relative;
        width: 100%;    
        padding: 10px;    
        left: 0%;    
    }
    .paginas-web-inicio>div:hover{
        transform: scale( 1.03);
    }
    .paginas-web-inicio>div>h4{    
        font-size: 28px;    
        margin-bottom: 10px;    
    }
    .paginas-web-inicio>div>p{
        width: 100%;
        font-size: 15px;    
        margin-bottom: 10px;    
    }
    .paginas-web-inicio>div>a{    
        font-size: 15px;    
        width: 40%;    
    } 
}