* {
  margin:0;
  padding:0;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: auto;
}

a {
  text-decoration: none;
}

#village {
  display: none;  width: 99vw;
  height: 99vh;
  background-color: #FAF0E2;
}

img.village {
  max-width: 99vw; 
  max-height: 99vh; 
}


#tractRectoVerso {
  display: flex;}

#tract4pages {
  display: grid;}

#video {
  display: none;  margin-top: 5vh;
}

 video {
  width: 99vw;
  height: 99vh;
  max-width: 1080px;
  max-height: 1920px;
}

@media (orientation: landscape)
{
  #tractRectoVerso {
	flex-direction: row;
  }
  
  div.tractRectoVerso {
    display: block;
    width: 49vw;
	margin-right: 1vw;
  }
  
  img.tractRectoVerso {
    max-width: 49vw; 
  }

  #tract4pages {
    grid-template-columns: 49vw 49vw;
	grid-template-rows: auto;
    column-gap: 1vw;
	row-gap: 1vh;
  }
  
  div.tract4pages {
    display: block;
    width: 49vw;
  }
  
  img.tract4pages {
    max-width: 49vw; 
  }
  
  #page1 {
    grid-column: 1;
	grid-row: 1;
  }
  
  #page2 {
    grid-column: 2;
	grid-row: 1;
  }
  
  #page3 {
    grid-column: 1;
	grid-row: 2;
  }
  
  #page4 {
    grid-column: 2;
	grid-row: 2;
  }
}

@media (orientation: portrait)
{
  #tractRectoVerso {
	flex-direction: column;
  }
  
  div.tractRectoVerso {
    display: block;
    width: 99vw;
	margin-bottom: 1vh;
  }
  
  img.tractRectoVerso {
    max-width: 99vw; 
  }

  #tract4pages {
    grid-template-columns: 99vw;
	grid-template-rows: auto;
    column-gap: 0vw;
	row-gap: 1vh;
  }
  
  div.tract4pages {
    display: block;
    width: 99vw;
  }
  
  img.tract4pages {
    max-width: 99vw; 
  }
  
  #page1 {
    grid-column: 1;
	grid-row: 1;
  }
  
  #page2 {
    grid-column: 1;
	grid-row: 2;
  }
  
  #page3 {
    grid-column: 1;
	grid-row: 3;
  }
  
  #page4 {
    grid-column: 1;
	grid-row: 4;
  }
}