@charset "UTF-8";
* {box-sizing: border-box;}


/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*smartphone vertical max-width: 430px-----------------------------------------------------------------*/

@media screen and (min-width: 0px) and (max-width: 430px) {

	/*html réglage typographique*/

	html {
		font-size:63%; /*=1rem*/
	}

	#location a:hover,
	#credits a:hover,
	#langage a:hover,
	#statement a:hover,
	#menu a:hover {
		color: initial;
		text-shadow: none;
		text-decoration: initial;
		border-bottom: initial;
	}

	/*center cursor*/

	#cursor {
		left: 38vw;
		width: 24vw;
	}

	/*header*/

	#subtitle span br:nth-child(1) {
		display: block;
	}

	#menu, #langage {
		display: inline-block;
		width: 40vw;	
		float: right;
		text-align: right;		
	}
	#langage {padding-top: 0.5rem;}

	#menu a, 
	#langage a {
		border-bottom: 1px black solid;
	}
	#menu a:hover, 
	#langage a:hover {
		border-bottom: 1px black solid;
	}

	/*image flow--------------------------------------------------------------*/

	#image span {
		margin-bottom: 37.5vw;
	}
	#image span img {
		width: 90vw;
	}
	#image span:nth-child(1) {
		margin-bottom: 90vh;
	}

	/*iframe*/

	.iframe  {
		width: 90vw;
	}
	.iframe iframe  {
		height: 16rem;
	}


	/*subtitles--------------------------------------------------------------*/

	#subtitle p {
		margin-top: -1.2rem;
		font-size: 1.9rem;
	}
	#subtitle p:nth-child(1) {
		text-align: left;
	}


	/*texts--------------------------------------------------------------*/

	#statement {
		opacity: 1;
		width: 100%;
		margin: 50vh 0 0 0;
	}

	#about{
		width: 90vw;
		left: 5vw;
		font-size: 1.25rem;
	}
	#location,
	#credits{
		display: block;
		width: 90vw;
		border-top: 1px solid;
		text-align: center;
	}

}


/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*smartphone horizontal max-width: 700px---------------------------------------------------------------*/

@media screen and (min-width: 431px) and (max-width: 700px) {

	/*html réglage typographique*/

	html {
		font-size:65%; /*=1rem*/
	}

	#location a:hover,
	#credits a:hover,
	#langage a:hover,
	#statement a:hover,
	#menu a:hover {
		color: initial;
		text-shadow: none;
		text-decoration: initial;
		border-bottom: initial;
	}


	/*center cursor*/

	#cursor {
		left: 38vw;
		width: 24vw;
	}

	/*header*/

	#subtitle span br:nth-child(1) {
		display: block;
	}

	#menu, #langage {
		display: inline-block;
		width: 40vw;	
		float: right;
		text-align: right;		
	}
	#langage {padding-top: 0.25rem;}

	#menu a, 
	#langage a {
		border-bottom: 1px black solid;
	}
	#menu a:hover, 
	#langage a:hover {
		border-bottom: 1px black solid;
	}


	/*image flow--------------------------------------------------------------*/

	#image span {
		margin-bottom: 25vw;
	}
	#image span img {
		width: 80vw;
	}
	#image span:nth-child(1) {
		margin-bottom: 90vh;
	}

	/*iframe*/

	.iframe  {
		width: 80vw;
	}
	.iframe iframe  {
		height: 17rem;
	}


	/*subtitles--------------------------------------------------------------*/

	#subtitle p {
		margin-top: -1.2rem;
	}
	#subtitle p:nth-child(1) {
		text-align: left;
	}

	/*texts--------------------------------------------------------------*/

	#statement {
		opacity: 1;
		width: 80vw;
		margin: 25vh 10vw 0 10vw;
	}

	#about{
		width: 100vw;
		font-size: 1.25rem;
	}
	#location,
	#credits{
		width: 40vw;

	}
	#location {
		float: right;
		margin-right: 10vw;
		text-align: left;
	}
	#credits{
		float: left;
		margin-left: 10vw;
		text-align: right;
	}	


}


/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*tablet vertical max-width: 1100px---------------------------------------------------------------------*/

@media screen and (min-width: 701px) and (max-width: 1100px) {

	/*html réglage typographique*/

	html {
		font-size:80%; /*=1rem*/
	}


	/*center cursor*/

	#cursor {
		left: 44vw;
		width: 12vw;
	}

	/*header*/

	#subtitle span br:nth-child(1) {
		display: none;
	}

	#menu, #langage {
		width: 25vw;
	}
	#menu {
		float: left;
		text-align: left;
	}
	#langage {
		float: right;
		text-align: right;
	}

	#menu a, 
	#langage a {
		border-bottom: 1px black solid;
	}
	#menu a:hover, 
	#langage a:hover {
		border-bottom: 1px black solid;
	}

	/*image flow--------------------------------------------------------------*/

	#image span {
		margin-bottom: 25vw;
	}
	#image span img {
		width: 75vw;
	}
	#image span:nth-child(1) {
		margin-bottom: 90vh;
	}

	/*iframe*/

	.iframe  {
		width: 75vw;
	}
	.iframe iframe  {
		height: 12rem;
	}


	/*subtitles--------------------------------------------------------------*/

	#subtitle p {
		margin-top: -0.6rem;
	}


	/*texts--------------------------------------------------------------*/

	#statement {
		opacity: 0;
		width: 75vw;
		margin: 0 12.5vw;
	}

	#about{
		width: 100vw;
	}
	#location,
	#credits{
		width: 40vw;

	}
	#location {
		float: right;
		margin-right: 10vw;
		text-align: left;
	}
	#credits{
		float: left;
		margin-left: 10vw;
		text-align: right;
	}

}


/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*regular screen max-width: 1600px-------------------------------------------------*/

@media screen and (min-width: 1101px) and (max-width: 1600px) {

	/*html réglage typographique*/

	html {
		font-size:100%; /*=1rem*/
	}


	/*center cursor*/

	#cursor {
		left: 44vw;
		width: 12vw;
	}

	/*header*/

	#subtitle span br:nth-child(1) {
		display: none;
	}

	#menu, #langage {
		width: 25vw;
	}
	#menu {
		float: left;
		text-align: left;
	}
	#langage {
		float: right;
		text-align: right;
	}


	/*image flow--------------------------------------------------------------*/

	#image span {
		margin-bottom: 25vw;
	}
	#image span img {
		width: 75vw;
	}

	/*iframe*/

	.iframe  {
		width: 75vw;
	}
	.iframe iframe  {
		height: 11rem;
	}


	/*subtitles--------------------------------------------------------------*/

	#subtitle p {
		margin-top: -0.5rem;
	}


	/*texts--------------------------------------------------------------*/

	#statement {
		opacity: 0;
		width: 75vw;
		margin: 0 12.5vw;
	}

	#about{
		width: 100vw;
		font-size: 1rem;
	}
	#location,
	#credits{
		width: 30vw;

	}
	#location {
		float: right;
		margin-right: 20vw;
		text-align: left;
	}
	#credits{
		float: left;
		margin-left: 20vw;
		text-align: right;
	}

}


/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------*/
/*big screen max-width: 3000px-------------------------------------------------------------------------*/

@media screen and (min-width: 1601px) and (max-width: 3000px) {

	/*html réglage typographique*/

	html {
		font-size:100%; /*=1rem*/
	}

	/*center cursor*/

	#cursor {
		left: 44vw;
		width: 12vw;
	}

	/*header*/

	#subtitle span br:nth-child(1) {
		display: none;
	}

	#menu, #langage {
		width: 25vw;
	}
	#menu {
		float: left;
		text-align: left;
	}
	#langage {
		float: right;
		text-align: right;
	}


	/*image flow--------------------------------------------------------------*/

	#image span {
		margin-bottom: 37.5vw;
	}
	#image span img {
		width: 75vw;
	}

	/*iframe*/

	.iframe  {
		width: 75vw;
	}
	.iframe iframe  {
		height: 9.5rem;
	}


	/*subtitles--------------------------------------------------------------*/

	#subtitle p {
		margin-top: -0.6rem;
		margin-left: 6rem;
		margin-right: 6rem;
	}


	/*texts--------------------------------------------------------------*/

	#statement {
		opacity: 0;
		width: 50vw;
		margin: 0 25vw;
	}

	#about{
		width: 100vw;
		font-size: 1rem;
	}
	#location,
	#credits{
		width: 20vw;

	}
	#location {
		float: right;
		margin-right: 30vw;
		text-align: left;
	}
	#credits{
		float: left;
		margin-left: 30vw;
		text-align: right;
	}		


}