@media screen and (max-width:768px){
div.container{display:grid;grid-template-rows:auto;grid-template-columns:1ww 8fr 1vw;grid-template-areas: ". un . "  ". deux . "  ". trois . " ;
grid-row-gap:0.4rem;grid-column-gap:0.3rem;}
body{background-color:lightgray;font-size:2.0vw;font-family:"Times New Roman"; }
header{grid-area:un; background-color:lightyellow;color:blue;text-align:center;font-size:2em;border:4px double red;padding:0.3em;
margin-top:0.5%;}
div.seul{grid-area:deux;background-color:ivory;color:blue;font-size:1.6em;border:2px solid blue;padding:5px;text-align:justify;margin-top:0.5em;margin-right:0.5em;}
footer{grid-area:trois;background-color:lightyellow;color:blue;font-family:"Times New Roman";border:4px double red;font-size:1.5em;text-align:center;padding:0.3em; margin-top:0%;}
li{font-size:1.3em;line-height:2em;margin-left:0%;padding:0.3em;text-align:left;}
h3{text-align:center;border-radius:0.5em;border:3px solid red;background-color:greenyellow;color:blue;width:35%;margin-left:30%; }
h2{text-align:center;border-radius:0.5em;border:3px solid red;background-color:greenyellow;width:50%;margin-left:21%; }
h1{text-align:center;border-radius:0.5em;border:3px solid red;background-color:greenyellow;margin-left:25%;}
p{font-size:1.5em;text-align:justify;line-height:1.8em;padding:0.5em;}
a{text-decoration:none}
input{background-color:greenyellow;color:navy;font-size:0.8em;font-style:italic; }
}
@media screen and (min-width:768px){
div.container{display:grid;grid-template-rows:auto;grid-template-columns:1vw 8fr 1vw;grid-template-areas: ". un . "  ". deux . "  ". trois . " ;
grid-row-gap:0.4rem;grid-column-gap:0.3rem;}
body{font-size:1.6vw;background-color:lightgray;font-family:"Times New Roman"; }
header{grid-area:un; background-color:lightyellow;color:blue;text-align:center;font-size:2em;border:4px double red;padding:0.3em;}
div.seul{grid-area:deux;background-color:ivory;color:blue;font-size:1.5em;border:2px solid blue;padding:5px;text-align:left;margin-top:3%}
footer{grid-area:trois;background-color:lightyellow;color:blue;font-family:"Times New Roman";border:4px double red;font-size:1.5em;text-align:center;padding:0.3em;
 margin-top:3%;}
li{font-size:1.3em;line-height:2em;margin-left:0%;padding:0.5em;text-align:left;}
h3{text-align:center;border-radius:0.5em;border:3px solid red;background-color:greenyellow;color:blue;width:35%;margin-left:35%; }
h2{text-align:center;border-radius:0.5em;border:3px solid red;background-color:greenyellow;width:50%;margin-left:25% }
h1{text-align:center;border-radius:0.5em;border:3px solid red;background-color:greenyellow;width:50%;margin-left:25%;}
p{font-size:1.5em;text-align:justify;line-height:1.8em;padding:0.5em;}
a{text-decoration:none}
input{background-color:greenyellow;color:navy;font-size:0.8em;font-style:italic; }
}
@media only screen and (min-width:1024px){
div.container{display:grid;grid-template-rows:auto;grid-template-columns:1fr 8fr 1fr grid-template-areas: ". un . "  ". deux . "  ". trois . "; }
body{font-size:1.10vw;background-color:rgb(45,125,154);font-family:"Times New Roman"; }
header{grid-area:un; background-color:wheat;color:blue;text-align:center;font-size:2em;border:2px double blue;padding:0.3em;margin-top:2%;}
div.seul{grid-area:deux;background-color:wheat;color:darkblue;font-size:1.25em;border:2px solid blue;padding:0.5em;text-align:justify;line-height:1.30em;}
footer{grid-area:trois;background-color:wheat;color:darkblue;font-family:"Times New Roman";border:2px double blue;font-size:1.5em;text-align:center;padding:0.5em; }
li{font-size:1.10em;line-height:0.50em;margin-left:20%;}
h2{text-align:center;border-radius:0.5em;border:3px solid blue;background-color:ivory;color:blue;margin-left:25%;height:25%; }
h1{text-align:center;border-radius:0.5em;border:3px solid red;background-color:blanchedalmond;color:blue;width:50%;margin-left:25%;}
h3{text-align:center;border-radius:0.5em;border:3px solid red;background-color:greenyellow;color:blue;width:35%;margin-left:35%; }
p{font-size:1.2em;text-align:justify;line-height:1.0em;padding:1.1em;margin-left:35%;color:blue;}
a{text-decoration:none}
input{background-color:greenyellow;color:navy;font-size:0.8em;font-style:italic; }
}