@media (max-width: 800px) {
	main.home{
		min-height: 100%;
	}
	 /* structure */
	 div#page{
	 	width: 100vw
	 }
	 /* --- BOUTON BURGER --- */
	.burger_bt {
	  width: 32px;
	  height: 23px;
	  display: flex; /* caché sur desktop */
	  flex-direction: column;
	  justify-content: space-between;
	  cursor: pointer;
	}

	.burger_bt span {
	  display: block;
	  height: 3px;
	  background: #000;
	  border-radius: 1px;
	  transition: 0.3s;
	}

	/* --- BURGER ACTIF --- */
	.burger_bt.active .line1 {
	  transform: translateY(10px) rotate(45deg);
	}
	.burger_bt.active .line2 {
	  opacity: 0;
	}
	.burger_bt.active .line3 {
	  transform: translateY(-10px) rotate(-45deg);
	}


  nav.main_menu {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background: white;
    display: none;
    padding: 30px 0 30px;
    z-index: 1000;
  	flex-flow: column;
  }

  nav.main_menu ol{
	flex-flow: column;
  	align-items: center;
  	margin: 15px;
  	padding: 0;
  }

  nav.main_menu.open {
    display: flex;
  }


  /* structure de page */
  section.layout{
  	display: block
  }
    section.layout div.column{
  	width: 100%;
  }

  /* portfolio */

  section.portfolio{
	--gutter:30px;
	--cols:2;
 }


 /* projet */
 	.photos_grid{
		--gutter:15px;
		--cols:2;
	}
	 section.presentation{
		--gutter:0px;
		--cols:1;
	}

	section.presentation div{
		margin: 15px 0;
	}
	.grid-item-size2{
		width: 100%;
	}
	.grid-item-size3{
		width: 100%;
	}


}


@media (max-width: 500px) {
	section.portfolio{
	--gutter:30px;
	--cols:1;
	}
	.photos_grid{
	--gutter:20px;
	--cols:1;
	}

	}