@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
/* https://alvarotrigo.com/blog/hamburger-menu-css/ */

:root {
    --default-margin: 16px;
    --default-font: "Poppins", Arial, sans-serif;

    /* Variables pour les couleurs assorties */
    --link-background-color: #C9D6DF;
    --link-text-color: #37474F;
    --header-background-color: #F0F4F8;
    --header-text-color: #37474F;
    --body-background-color: #E6EBF0;
    --body-text-color: #37474F;
    --main-background-color: #FFFFFF;
    --main-border-color: #D1D9E0;
    --main-text-color: #37474F;
    --aside-background-color: #FFFFFF;
    --aside-border-color: #C9D6DF;
    --aside-text-color: #37474F;
}



header{background-color:var(--header-background-color);color:var(--header-text-color);}
body{background-color:var(--body-background-color);color:var(--body-text-color);}
main{background-color:var(--main-background-color);color:var(--main-text-color);}
aside{background-color:var(--aside-background-color);color:var(--aside-text-color);}

body{font-family:var(--default-font);}
body{max-width:1050px;width:90%;margin:auto;min-width:75%;}
h1{margin:0;}
li{list-style:none;}

/* table {border-collapse: collapse; border: 0; width: 934px; box-shadow: 1px 2px 3px #ccc;}
table {margin: 1em auto; text-align: left;} */

/* Test JS */
.on{background:blue;}
.off{background:red;}

/* Borders */
.navbar,main,aside,article{border:1px solid;}
.main-blog{border:0px;}

/* Text-align*/
footer{text-align:center;}
.float-left{text-align:left;}
.float-right{text-align:right;}

/* Padding */
main,aside,article,footer{padding:5px;}
header,.couverture,.article-container-footer{padding:0px;}
.menu-items{padding-top:100px;}
ul{padding:0;}

/* Margin */
header,main,aside,footer{margin:5px;}
.main-blog, .item p{margin:0px;}
.navbar, article{margin-bottom:10px;}
.sidebar-bottom{margin-top:-5px;}
ul{margin:0;}

/* Text-decoration */
a{text-decoration:none;}

/* Color */
a{color:var(--default-link-color);}

/* Hover */
div.info{overflow-y:hidden;height:100px;}
div.info:hover{height: auto;}
a{text-decoration:none;}
a:hover{color:red;}
nav>a{display:block;padding: 10px;transition:background-color 0.3s ease;}
nav a:hover{background-color:var(--link-background-color);color:var(--link-text-color)}
.menu-item:hover{background-color:rgba(17, 16, 16, 0.2);}
button:hover{background-color: green;}

/* Width */
img{
    display: block;
    margin-left: auto;
    margin-right: auto;
    width:50%;
}

.couverture{object-position:left top;}

/* Grid */
.article-container-footer{display:grid;grid-template-columns:1fr 1fr;}

/* Media Queries */
.container{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-template-areas:"H H"
                        "M A"
                        "F F";
}
.container-blog{
    display:grid;
    grid-template-columns:1fr 3fr 1fr;
    grid-template-areas:"H H H"
                        "L M R"
                        "L B R"
                        "F F F";
}
header{grid-area:H;}
main{grid-area:M;}
aside{grid-area:A;}
.sidebar-left{grid-area:L;}
.sidebar-right{grid-area:R;}
.sidebar-bottom{grid-area:B;}
footer{grid-area:F;}
@media(max-width:600px), screen and (orientation: portrait)
{
    .container
    {
        grid-template-columns:1fr;
		grid-template-areas:"H"
							"M"
                            "B"
                            "A"
                            "F";
    }
    .container-blog
    {
        grid-template-columns:1fr;
		grid-template-areas:"H"
							"M"
                            "B"
                            "L"
                            "R"
                            "F";
    }
}