*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body{
    background: radial-gradient(circle at 112.77% 38.93%, #be5af5 0, #a04ff4 16.67%, #7944f3 33.33%, #3c3cf2 50%, #0037f1 66.67%, #0034ef 83.33%, #0034ee 100%);
    display: flex;
    flex-direction: column;
    font-family: sans-serif;
}

.fondo{
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle at 112.77% 38.93%, #be5af5 0, #a04ff4 16.67%, #7944f3 33.33%, #3c3cf2 50%, #0037f1 66.67%, #0034ef 83.33%, #0034ee 100%);
    position: relative;
    overflow: hidden;
}

.encabezado{ 
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    right: 0;
}

.contenedor{
    display: flex;
    margin-left: 20px;
    margin-right: 20px;
    margin-top: 5px;
    justify-content: space-between;
    padding: 10px 0;
}
.contenedor h1{
    color: #fff;
    font-family: sans-serif;
}

.contenedor nav a{
    color: #fff;
    font-family: sans-serif;
    text-decoration: none;
    margin-right: 10px;
}
.seccion1{
    margin-left: 20px;
    display: flex;
    flex-direction: column; 
}

.seccion1 h1{
    margin-left: 25px;
    font-family: sans-serif;
    color: whitesmoke;
}

.seccion1 h2{
    margin-left: 25px;
    font-family: sans-serif;
    color: whitesmoke;
}

.seccion1 .pictures{
    display: flex;
    flex-direction: row;
    margin-top: 30px;
    align-items: flex-start;
    justify-content: space-evenly;
}

.seccion1 .pictures .wp{
    background: #25D366;
    border-radius: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    width: 300px;
    height: 300px;
    margin: 25px;
}

.seccion1 .pictures .wp img{
    height: 200px;
    width: 200px;
}

.seccion1 .pictures .ins{ 
    background: linear-gradient(43deg, #4158D0 0%, #C850C0 46%, #FFCC70 100%);
    border-radius: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    margin: 25px;
    width: 300px;
    height: 300px;
}

.seccion1 .pictures .ins img{
    height: 200px;
    width: 200px;
}

.seccion1 .pictures .fb{
    background: #0451f8;
    margin: 25px;
    border-radius: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    width: 300px;
    height: 300px;
}

.seccion1 .pictures .fb img{
    height: 230px;
    width: 230px;
}

@media (max-width: 1086px){ /* Condicional si la pantalla llega a 680px entonces*/
    
        
    .seccion1 .pictures{
        align-items: center;
        flex-direction: column;
        justify-content: flex-start;
        padding: 25px;
    }
        
}