/************************************************** DECLARATION DE VARIABLE ***************************************/
 :root {
	--hauteur_menu: 80px;
 }



/************************************************************ PAGE *************************************************/
html
{
	/* font-size:2.0em; */
}


/***************************************************** ZONE DE TRAVAIL *********************************************/
body {
	max-width:99%;
}

/********************************************************* ENTETE **************************************************/


#entete		nav		{
	grid-template-columns: 1fr; 
	grid-row-gap: 0px;
}
#entete		nav	.menu	{
	/* font-size:2em; */
}
#entete		nav		.menu 	a	{
	background-color: var(--bleu_koriolan_fonce);
	color: var(--bleu_koriolan);
	/* display: block; */
	/* width: 96%; */
	padding:20px 0px;
	margin: auto;
	/* line-height: 2em; */
}


/*********************************************************** PIED DE PAGE *********************************************/
#pied_de_page 	{
	grid-template-columns: 1fr;
	grid-row-gap: 0px;
	grid-template-rows: 100px 1em;
}

#pied_de_page 	.marque 	{
	text-align: center;
	height: 100px;
	padding: 20px;
	grid-column: 1 / span 3 !important;
}
#pied_de_page 	.mentions_legales 	{
	text-align: center;
	grid-column: 1 / span 3 !important;
	grid-row: 2 / span 3 !important;
}
#pied_de_page 	.mentions_legales 	a 	{
	text-align: center;
	display: inline-block;
	width: 90%;
	margin: 20px auto;
	border: 1px solid var(--bleu_koriolan);
}
#pied_de_page 	.signature 	{
	grid-column: 1 / span 3 !important;
	text-align: center;
	padding: 50px;
	height: 100px;
}
#pied_de_page 	a	{
	padding:20px 0px;
}

/********************************************************* TITRES ********************************************/
h1		{
	font-size:2.0em;
}
h2		{
	font-size:1.4em;
}

/****************************************************** TABLEAUX STANDARD *****************************************/


/***************************************************** FORMULAIRES ***************************************************/
input, textarea, select		{
	/* padding:10px 10px;	 */
	font-size: 1.0em;
}
select		{
	/* height: 40px; */
	/* font-size: 1.5em; */
}
::placeholder {
	/* font-size: 1.8em; */
}

/********************************************************* LIENS HYPERTEXTES ***************************************/


ul	{
	padding-inline-start: 20px;			/* C'est une valeur par défaut de 40px, ce qui est beaucoup sur un affichage téléphone... */
}
ul	li	{
	margin-bottom: 0px;
}
/********************************************************* PARAGRAPHES ***************************************/
p			{
	margin:10px 0px;
	/* line-height:50px; */
	/* font-size:1.8em; */
}

/********************************************************* ANCRES ***************************************/
.ancre 	{
	/* padding-top: 350px; 		/* Taille du menu déployé */
	/*margin-top: -350px; 		Même valeur que ci-dessus pour compenser */
}

/************************************* MESSAGE D'ERREUR ***************************************/







/************************************* COMPARATIF SHIPHEARTS ***************************************/
.comparatif 	 {
	/* font-size:1.5em; */
}
.comparatif 	.bouton_comparatif		a 	{
	margin-bottom: 50px;
	width: calc(99% - 50px);
	padding: 20px 0px 20px 50px;
	background-position: left 10px top 50%;
}
.comparatif 	table.table_comparatif	 	th 	{
	font-size: 0.7em;
}
.comparatif 	table.table_comparatif	 	th:not(:first-child) 	{
	border: 1px solid var(--bleu_koriolan);
	height: 80px;
	padding: 0px;
	transform: rotate(-90deg);
}
.comparatif 	table.table_comparatif	 	td 	{
	font-size:0.8em;
}
.comparatif 	table.table_comparatif	 	td.version 		img 	{
	/* width:60px; */
}

.comparatif 	table.table_renvois_comparatif 	tr 	td {
	font-size:0.8em;
}

/************************************* IMAGES ZOOMEES ***************************************/


/***********************************************************************************************************************
Fichier accueil.php
***********************************************************************************************************************/
#Accueil	h1	{
	/* height: 300px; */
}
#Accueil	h2		{
	font-size:2em;
}
#Accueil	p			{
	line-height:1.2em;
	margin: auto;
}


/***********************************************************************************************************************
Fichier actualites.php
***********************************************************************************************************************/
/*----------------------------------------*/






/***********************************************************************************************************************
Fichier boutique.php
***********************************************************************************************************************/


/*--------------------------------------------------*/



/*--------------------------------------------------*/


/*--------------------------------------------------*/



/*--------------------------------------------------*/



/*--------------------------------------------------*/





/*--------------------------------------------------*/





/*--------------------------------------------------*/











/***********************************************************************************************************************
Fichier faq.php
***********************************************************************************************************************/

/*----------------------------------------*/
#Faq	#accueil	h2		{
	border-bottom: none;
}
#Faq	#accueil	.famille	a 	{
	padding-bottom:10px;
	border: 2px solid var(--bleu_koriolan);
	margin: 5px 0px;
}
#Faq	#accueil	.famille 	.reponse		{
	margin:0px 10px 30px 10px;
}




/***********************************************************************************************************************
Fichier galerie.php
***********************************************************************************************************************/




/***********************************************************************************************************************
Fichier mentions_legales.php
***********************************************************************************************************************/
#Mentions_legales	#accueil	{
}
#Mentions_legales	#accueil	a	{
	padding:0px 5px 1px 5px;
}
#Mentions_legales	#accueil	p	{
	/* text-align: justify; */
	/* margin: 0px; */
}

#Mentions_legales	#accueil	.adresse	{
	/* padding-left:10%; */
}

/***********************************************************************************************************************
Fichier nautic2021.php
***********************************************************************************************************************/



/***********************************************************************************************************************
Fichier produits.php
***********************************************************************************************************************/


#Produits		.boutons_bas_de_page	{
	grid-template-columns: 1fr;
	grid-template-areas: 
            "retour"
			"suivant";
}

/*----------------------------------------*/
#Produits			#accueil	.produit 	{
	grid-template-columns: 1fr;
	grid-template-rows: auto;
	grid-template-areas: 
			"photo_principale"
            "nom"
			"descriptif"
			"photos";
}



/***********************************************************************************************************************
Fichier shipmembers.php
***********************************************************************************************************************/
/*--------------------------------------------------*/
#Shipmember		 	{
	/* font-size: 1.5em; */
}
#Shipmember		.message		{
	/* font-size: 0.9em; */
}

#Shipmember		.boutons_bas_de_page 		a 	{
	margin: 50px 0px 30px 0px;
	padding: 30px 10px;
}
#Shipmember		.boutons_bas_de_page	 	button		{
	display:block;
	margin: 50px 0px 30px 0px;
	padding: 30px 10px;
	/* font-size: 1.2em; */
}


/*--------------------------------------------------*/
#Shipmember		#login		 form 	{
	grid-template-columns: 1fr;
}
#Shipmember		#login		 form 	table  td:nth-child(1)	{
	width: 30%;
}


/*--------------------------------------------------*/
#Shipmember		#profil		.profil		{
	row-gap:50px;
}
#Shipmember		#profil		.profil		.champs	{
	display: grid;
	grid-template-columns: 1fr;
	row-gap: 20px;
}