body{
	margin: 0;
	padding: 0;
	color: #1a1a1a;
	background-color: #e6e6e6;
	display: grid;
}

header,
main,
footer{
	display: grid;
    grid-template-columns: minmax(17em, 36em);
    padding-left: 1.5em;
    padding-right: 1.5em;
	justify-content: center;
}

header{
	height: 15em;
	background-color: dodgerblue;
    padding-top: 1em;
    padding-bottom: 1em;
	align-items: center;
}

main{
    padding-top: 1.5em;
    padding-bottom: 1.5em;
    row-gap: 1.5em;
}

#name,
article,
#copy{
    padding-left: 2em;
	padding-right: 2em;
}

#name{
	text-align: center;
}

article{
    padding-top: 1em;
	padding-bottom: 1em;
	background-color: white;
	border-radius: 3px;
	box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.19), 0 2px 6px 0 rgba(0, 0, 0, 0.2);
	overflow: auto;
}

.end{
    text-align: end;
}

/* MEDIA */
@media (min-width: 32em){
    header,
    main,
    footer{
        padding-left: 2em;
        padding-right: 2em;
    }
}
@media (min-width: 62em){
    main,
    footer{
        grid-template-columns: repeat(auto-fill, minmax(26em, 1fr));
        column-gap: 3em;
    }
}

@media (min-width: 40em){
    #site1{
        display: grid;
        grid-template-columns: 40em;
        justify-content: center;
    }
}
@media (min-width: 142em){
    #site{
        display: grid;
        grid-template-columns: 142em;
        justify-content: center;
    }
}