.header-home {
    background-image: url("https://lacasaderobertgraves.org/images/canellun.jpg"),url("https://lacasaderobertgraves.org/images/canellun_small.jpg");
    background-position: center;
    background-size: cover;
    box-sizing:border-box;   
    clip-path: polygon(0% 0%,100% 0%,100% calc(100% - 24px),
    calc(50% + 20px) calc(100% - 24px),
    50% 100%,50% calc(100% - 9px),calc(50% + 12px) calc(100% - 24px),
    calc(50% - 12px) calc(100% - 24px),50% calc(100% - 9px),50% 100%,
    calc(50% - 20px) calc(100% - 24px),0% calc(100% - 24px));
    display:grid;
    grid-template-rows: auto 1fr;
    height:100dvh;
    width:100%;     
}


.div-home-header {
    background:linear-gradient(rgba(0,0,0,0.3) 0%,rgba(0,0,0,0.5) 100%);
    box-sizing:border-box; 
    display:grid;
    grid-template-rows: auto 1fr;
    height:100%;
    width:100%; 
}


.div-home-navigation {
    align-items:center;
    display:grid;
    grid-template-columns: 1fr auto;
    justify-items:center
    width:100%;
} 


.div-home-horizontal {
    display:flex;
    flex-wrap:wrap;
    gap:1em;
    justify-content:center;
    padding:1em;
}


.div-horizontal-separator {

}


.div-home-language {
    box-sizing:border-box;
    color:white;
    padding:1em;
    text-align:right;
    width:100%;
}


.div-home-hamburger {
    display:none;
    position:relative;
}


.div-home-vertical {
    display:none;
}


.div-vertical-separator {
border-top:1px solid white;
    width:4em;
}


.div-home-content {
    box-sizing:border-box; 
    color:white;
    display:grid;
    font-family:'Crimson Text';
    font-size:1em;
    grid-template-rows:1fr auto 1fr auto 1fr auto auto;
    height:100%;
    justify-items:center;
}


.div-home-separator {
    background-color:rgb(255,128,0,0);
    height:100%;
    width:100%;
}


.div-home-branding {
    align-items:center;
    display:grid;
    grid-template-columns:1fr auto auto 2fr;
    width:100%;
}


.div-home-logo {
    height:6em;
    background-color:white;
    padding:0.25em;
}


.img-home-logo {
    height:100%;
}

            
.div-home-title {
    color:white;
    display:grid;
    font-family:crimson text;
    font-weight:bold;
    grid-template-columns:auto;
    padding:1em;
} 

    
.div-home-casa {
    font-size:3em;
}


.div-home-graves {
    font-size:4em;
    display:grid;
    grid-template-columns:1fr 1fr;
    column-gap:0.25em;
    line-height:0.9em;
}    


.div-home-text {
    display:grid;
    grid-template-columns:2fr auto 1fr;
    width:100%;
}



.div-home-mission {
    background-color:chocolatex;
    box-sizing:border-box;
    font-size:1.4em;
    color:white;
    line-height:1.1em;
    width:600px;
    padding:1em;
    
}


.div-special-message {
    background-color:rgb(0,0,0,0.5);
    box-sizing:border-box;
    color:orange;
    font-size:1.4em;
    font-family:'Open Sans';
    line-height:1.1em;
    padding:1em;
    text-align:center;
    width:100%;
}


.div-home-filler {
    height:24px;
    width:100%;
}



   

/* MEDIA QUERIES **************************************************************/

@media only screen and (max-width: 1280px) {
    .div-home-casa {
        font-size:calc(2.4em + 0.6 * (100vw - 36em) / 44);
    }

    .div-home-graves {
        font-size:calc(3.2em + 0.8 * (100vw - 36em) / 44);
    }

    .div-home-logo{
        height:calc(4.8em + 1.2 * (100vw - 36em) / 44);
    }
    
    .div-special-message {
        font-size:calc(0.9em + 0.5 * (100vw - 20em) / 60);
    }
    
    .div-home-mission {
        font-size:calc(1em + 0.4 * (100vw - 20em) / 60);
        width:calc(240px +  360 * (100vw - 320px) /960);
    }
    

    
} 




@media only screen and (max-width: 800px) {
    
    .div-home-navigation {
        display:none;
    }
    
    .div-home-menu {
        display:none;
    }
    
    .div-home-hamburger {
        display:grid;
        grid-template-columns:auto;
        justify-items:center;
           
    }

    .div-home-language {
        text-align:left;
 
    }

 
    
}


/*@media only screen and (max-height: 600px) {.header-home{height:200dvh;}}*/


@media only screen and (max-width: 576px) {
    .div-home-casa {
        font-size:calc(1.68em + 0.42 * (100vw - 20em) /16);
    }    

    .div-home-graves {
        font-size:calc(2.56em + 0.64 * (100vw - 20em) /16);
        grid-template-columns:1fr;
    }    
    
    .div-home-logo{
        height:calc(5.6em + 1.4 * (100vw - 20em) / 16);
    }
    

    .div-home-branding {
        align-items:center;
        display:grid;
        grid-template-columns:1fr auto auto 1fr;
        width:100%;
    }

    .div-home-text {
        grid-template-columns:1fr auto 1fr;
    }
    
} 


@media only screen and (max-width: 320px) {

 .div-home-casa {
        font-size:1.68em;
    }    

    .div-home-graves {
        font-size:2.56em;
        grid-template-columns:1fr;
    }    
    
    .div-home-logo {
        height:5.6em;
    }
    
        
    .div-special-message {
        font-size:0.9em;
    }
    
    .div-home-mission {
        font-size:0.9em;
    }
 
    .div-home-mission {
        width:240px;
    }
 
    
}