* {
    box-sizing:border-box;
    margin: 0;
    padding: 0;
    font-family:'Courier Prime', monospace;
}
* {
    
}
h2, h3 {
    text-align:center;    
    color:#555;
}
h1 {
    font-size:1.6rem;
    font-weight:bold;
    text-align:center;
    
}
h1 span.mayuscula {
    text-transform:uppercase;
}
h2 {
    font-size:1.9rem;  
    font-weight:bold;  
    margin-bottom:2rem;
}
h3 {
    margin-bottom:1.5rem;
    font-size:1.7rem;
    font-weight:bold;
}
p.texto-grande {
    padding:3rem;
    font-size:1.5rem;
    font-style: oblique;
}
div.icono {
    
    width:100%;
    text-align:center;
    margin-bottom:1rem;
}
i.grande {    
    font-size:2rem;
    color:teal;
}
p {
    line-height:1.9rem;
    font-size:1.1rem;
}

header.cabecera {
    display:flex;
    align-items:center;
    justify-content:center;
    height:100px;
    padding:0 1rem;
}

section#galeria {
    display:flex;
    flex-direction:column;
    padding:5px;
    
}
div.fotos {
    display:flex;
    flex-flow: nowrap column;
    width: 100%;        
}   

article img {
    width: 100%;
    height: auto;
    object-fit:cover;
}
section#presentacion {
    padding:3rem 1rem;        
    background-color:#eee;
    max-width:1920px;
    margin-left:auto;
    margin-right:auto;
    text-align:center;
}
section#presentacion p {
    font-size:1.8rem;
    line-height:2.3rem;
}
section#servicios, section#sobre-mi {
    margin-top:3rem;
    margin-bottom:3rem;
    padding: 3rem;;
}
section#servicios a {
    font-weight:bold;
}
div.servicios-contenedor {
    display:grid;
    grid-template-rows: 1fr 1fr 1fr;
    row-gap:5px;
    padding:5px;
}
article.tarjeta {
    width:100%;    
    border-radius:15px;
    padding:1rem;
    background-color: #eee;
}
article.tarjeta:hover {
    background-color:#555;
    color:white;
}
article.tarjeta:hover h3, article.tarjeta:hover i {
    color:white;
}
div.contacto-contenedor {
    background-color:#eee;
    color:white;
    height:400px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
}
a.boton {
    padding:1rem 2rem;
    border:1px solid #555;
    border-radius:28px;
    text-decoration:none;
    color:teal;
    font-size:1.2em;
    text-transform:uppercase;
}
a.boton:hover {
    background-color:#555;
    color:#eee;
}
section#sobre-mi {
    padding:1rem 3rem; 
    max-width:1920px;
    margin-left:auto;
    margin-right:auto;   
}
section#sobre-mi p {
    margin-bottom:1.8rem;
}
section#sobre-mi a {
    color:teal;
    font-weight:bold;
}
section#contacto {
    background-color:#eee;
    max-width:1920px;
    margin-left:auto;
    margin-right:auto;
    padding: 3rem;
    text-align:left;
}
div.formas-de-contacto {
    margin-top:2rem;
    display:grid;
    width:100%;
    grid-template-rows: 1fr 1fr;
    row-gap:5px;
}
address.forma {
    background-color:white;
    padding:1rem;
    border-radius: 15px;
    font-style:normal;
}
div.formas-de-contacto a {
    color:#555;
}
footer {
    background-color:black;
    color:white;
    width:100%;
    text-align:center;
    font-size:0.5em;  
    padding:1rem;  
}
footer p {
    font-size:0.8rem;
}
footer a {
    color:#f1f1f1;    
}
div.iconos {
    width:100%;
    display:flex;
    flex-flow:row nowrap;    
}
div.iconos div {       
    width:30px;   
    margin-right:0.5rem;     
}
div.iconos div img {
    width:30px;
    height:auto;
}


@media only screen and (min-width:769px) {
    /*section#galeria {
        display:flex;
        flex-direction:row;
        justify-content:center;
        align-items:center;
        
    }*/
    div.fotos {         
        display:grid;
        max-width:1920px;        
        grid-template-columns: 1fr 1fr;
        margin-left:auto;
        margin-right:auto;  
        column-gap:5px;          
    }
    section#servicios {
        max-width:1920px;
        margin-left:auto;
        margin-right:auto;
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows:1fr;
        column-gap:1rem;
        padding-left:3rem;
        padding-right:3rem;
    }
    div.formas-de-contacto {
        display:grid;
        
        grid-template-rows:1fr;
        grid-template-columns: 1fr 1fr;
        max-width:1920px;
        column-gap:1rem;
    }
    
    footer {
        max-width:1920px;
        margin-left:auto;
        margin-right:auto;
    }
}