* {
    box-sizing: border-box;
}

body {
    background-image: linear-gradient(to bottom, #693800, #502b00);
    font-family: verdana, arial, sans-serif;
    background-attachment: fixed;
    margin: 0px;
    color:#f5cc75;

}

#wrapper {
    display: grid;
    grid-auto-rows: auto;
    grid-template-columns: minmax(150px, 1fr)  minmax(150px, 1750px) minmax(150px, 1fr);

}
header{
    background-color: #B0934B ;
    color:#FBE3A4;
    grid-column-start: 2;
    grid-column-end: 4;
    grid-row-start: 1;
    grid-row-end: 1;
    position: sticky;
    top: 0;
    
}

nav{
    background-color:#E4931B;
    grid-column-start: 1;
    grid-column-end: 1;
    grid-row-start: 1;
    grid-row-end: 3;
   
    
}
#home{
    position: fixed;
    top: 0;
    background-color:#E4931B;
}
nav a:hover {
    background-color: #e86807;
    /*padding: 1rem 0rem;*/
    display: block;
}
#home:hover{
    /*position: fixed;*/
    /*top: 0;*/
    /*padding: 1rem 0rem;*/
    background-color:#e86807;
}


article{
    background-color:rgb(105, 69, 6) ;
    grid-column-start: 2;
    grid-column-end: 2;
    grid-row-start: 2;
    grid-row-end: 3;
    padding: 0.5rem;
    padding-top: 3rem;
    
}
article a{
    text-decoration: underline;
    color: #E4931B;
}
article a:hover{
    color: #e86807;
}
#WendiAndMckya{
    float: right;
    padding-left: 2rem;
}
#broken{
    display: none;
}
#sidebar{
   /* background-color:rgba(13, 227, 227, 0.3) ;*/
    grid-column-start: 3;
    grid-column-end: 4;
    grid-row-start: 1;
    grid-row-end: 3;
}
footer{
   /* background-color:rgba(59, 13, 227, 0.3) ;*/
    grid-column-start: 1;
    grid-column-end: 4;
    grid-row-start: 3;
    grid-row-end: 3;
    width: 100%;
    text-align: center;
    padding-bottom: 0.5rem;
}
@media only screen and (max-width: 992px) {
    #wrapper {
        display: grid;
        grid-auto-rows: auto;
        grid-template-columns: minmax(150px, 1fr)  minmax(150px, 768px) minmax(150px, 1fr);
    }
}
@media only screen and (max-width: 768px) {
    #wrapper {
        display: grid;
        grid-auto-rows: minmax(10px, auto);
        grid-template-columns: 100%;
    }
    header{
        grid-column-start: 1;
    grid-column-end: 1;
    grid-row-start: 1;
    grid-row-end: 1;
    position: fixed;
    top: 0;
    width: 100%;
    }
    nav{
        grid-column-start: 1;
    grid-column-end: 1;
    grid-row-start: 2;
    grid-row-end: 2;
    display: flex;
    position: fixed;
    top:76px;
    margin-bottom: 10px;
    
    
    
    }
    img{
        width:80%;
        height: auto;
    }
   
    article{
        padding-top: 10px;
        grid-column-start: 1;
    grid-column-end: 1;
    grid-row-start: 5;
    grid-row-end: 5;
    
    }
    #sidebar{
        grid-column-start: 1;
        grid-column-end: 1;
        grid-row-start: 1;
        grid-row-end: 1;
        height: 200px;
        /*background-color: #e86807;*/
    }
    footer{
        grid-column-start: 1;
    grid-column-end: 1;
    grid-row-start: 5;
    grid-row-end: 6;
    }
    #home{
        display: none;
    }
    #broken{
        display:contents;
    }
    
}