/**************************  Pour template > V1.7 ****************************/
@viewport { 
   width: device-width;
   zoom: 1;
}
/*
@import url("https://cmarti.net/commun.css");
*/
/* RAZ toutes balises pour éviter espace avant bandeau */
/**** Cela pose pb avec <ul> etc... ****
* { 

	margin:0px;
	padding:0px;
}
****/
html, body
{
	height: 100%;
}

body {
	color: black; 
	margin: 0px;
	padding: 0px;
	font: 14px Arial;

}

#container {
	width: 100%; /* 99%; */
	margin: 0;
	padding: 0;
	padding-bottom: 32px; /* Depend de la hauteur du footer */
	background-color: #f2f4f4 /*Ivory*/;
}

body header {
	position: relative;
	width: 100%;
	height: 100px;
	background-color: navy;
	text-align: center; 
	height: 80px;
	margin: 0;
	padding: 0;
}

body header summary {
	position: relative;
	color: lightgray;
	text-align: right;
	font: 1em Arial;
	margin-right: 80px;
	/*margin-right: 20px;
	padding: 0px 0px 0px 20px;*/
}

#logo {
	height: 80px;
	vertical-align: top; float:right;
	margin: 0;
}

/*#main {*/
body main {
	position: relative;
	width: 100%;
	height: auto;
	/*min-height: 100vh;*/
	margin: 0px;
	padding: 0px; 
	padding-left: 5px; /* ou 10 px ? */
}

#iframeMain {
	border: none;
	width: 99%; /* 99% Sinon iFrame FormulaireContact bas belle */
	height: 600px;
	/*min-height: 100vh;*/
	margin: 0;
	padding: 10px;
	overflow-x: auto;
	overflow-y: auto;
	/*margin-bottom: 32px; /* Voir hauteur footer */
}

#subfooter1 {
	position: fixed;
	bottom: 32px;
	width: 1000px;
	background-color: navy;
	color: white;
	text-align: center; 
	font: 0.9em Arial;
}
#subfooter1 a:link, #subfooter2 a:visited, #subfooter2 a:hover, #subfooter2 a:active {color: #f2f4f4 ;} 

#subfooter2 { 
	position: fixed;
	bottom: 0px;
	height: 32px;
	width: 1000px;
	background-color: navy;
	color: lightgray;
	text-align: center; 
	font: 0.9em Arial;
	opacity: 1;
}
#subfooter2 a:link, #subfooter2 a:visited, #subfooter2 a:hover, #subfooter2 a:active {color: #f2f4f4 ;} 

/**************************/
/*** Titres             ***/
/**************************/
h1 {
	color: lightgray;
	font: 1.6em Arial;
	font-weight: bold;
	border: 0px;
	width: 90%;
	text-align: left;	
	padding: 2px;
	margin-left: 20px;
}

h2 { 
	color: navy;
	font: 1.4em Arial;  
	border: 0px;
	width: 80%;
	text-align: left;	
	border-bottom:1px solid;
	padding: 2px;
}
   
h3 { 
	color: navy;
	font: 1.2em Arial;    
	border: 0px;
	width: 60%;
	text-align: left;
	border-bottom:1px solid;
	padding: 2px;

}
/**************************/
/* Redefinition des liens */
/**************************/
a:link {text-decoration: none; color: #CC0000;}
a:visited {text-decoration: none; color: #CC0000;}
a:hover {text-decoration: none; opacity:0.8;}

/**************************/
/*** boutons            ***/
/**************************/
.bouton, a.bouton, a.bouton:link, a.bouton:visited, a.bouton:active {
	font: 1em Arial;
	text-align: center; 
	color: white; 
	background-color: navy; 
	border-radius: 5px;
	padding: 5px;
}
a.bouton:hover {
	text-decoration: none;
	opacity: 0.7;
}

#socialButtons {
	text-align: center;
	display: inline;
	margin: 0; 
	padding: 0;
}


/************************************************************************************************/
/***************************************** ECRAN MOBILE *****************************************/
/************************************************************************************************/
@media only screen and (max-width: 999px) {
/***@media only screen and (orientation:portrait) { ***/

#container, #subfooter2 {
	width: 100%;
}

#tools, #widget, #tags {
	display: none;
}

/**************************/
/*** Menus              ***/
/**************************/

/*body nav ul {*/
#navMenuLarge {
	display: none; /* Menu classique caché */
}

#navMenuMobile {
	position: relative;
  /*position: sticky; A essayer pour venir se coller en scrollant */
	top: 0px;
	margin:0 auto;
	text-align: center;
}

/*body nav select { */
#navMenuMobile select {
	/*z-index: 10;*/
	display: inline-block; /* menu mobile activé */
	color: white; 
	background-color: navy;
	font: 1.2em Arial;
	width: 240px;
	padding-left:10px;
	margin: 8px;
	border-radius: 15px;
	-moz-appearance: none; /* fleche de liste tronquee sous FF donc j'enleve */
}

} /* Fin ecrans mobiles */


/************************************************************************************************/
/***************************************** ECRAN LARGE ******************************************/
/************************************************************************************************/
@media only screen and (min-width: 1000px) {
/***@media only screen and (orientation:landscape) {**/

body {
	background-repeat: repeat-x;
	background-position: center top;
	/*background-image:url(img/capferret2.jpeg);*/
	/*background-image:url(img/accueil/@P1070746.JPG);*/
	/*background-image:url(/img/accueil/@20210731_161716.jpg);*/
	background-image:url(/img/accueil/@20210804_152645.jpg);
	background-image:url(/galerie/@Toulouse_GaronneDepuisDaurade_02.jpg);

  /*-webkit-background-size: cover; /* pour anciens Chrome et Safari */
  background-size: cover; /* version standardisée */
	background-attachment:fixed;
}

#container {
	/*position: absolute;*/
	margin:0 auto;
	position:relative;
	width: 1000px;
	min-height: 100vh;
	opacity: 0.9;
}

#widget {
	z-index: 8;
	position: absolute; 
	right: 0px; 
	top: 80px;
	width:120px;
	text-align: center; 
	font: 1em Arial; 
	/*border: 3px #CC0000 solid;
	border-radius: 20px 20px 20px 20px;*/
	margin: 20px 15px 20px 15px;
	background-color:  #f2f4f4 ;
}

/* Pas de Tag pour cyrillemartinet */
#tags {
	display: none;
}


/**************************/
/*** Menu et sous-menus ***/
/**************************/
/*** Le menu sous forme de liste déroulante est caché pour grands écrans ***/

/*#template_menu select {*/
#navMenuMobile {
	display: none;
	color: white;
}

/* CSSTerm.com Simple Horizontal DropDown CSS menu */
/*#template_menu {*/
#navMenuLarge {
	z-index: 10;
	position: absolute;
  /*position: sticky; A essayer pour venir se coller en scrollant */
	top: 50px;
	font: 0.95em Arial;
}

.template_menu {
	background: navy;
	padding: 0;
	margin: 0;
	list-style-type: none;
	height: 30px;
}
.template_menu li { float:left; }
.template_menu li a {
	padding: 9px 15px;
	display: block;
	color:#fff;
	text-decoration:none;
	font: 0.90em Arial;  
}

/* Submenu */
.template_menu ul {
	position: absolute;
	left: -9999px;
	top: -9999px;
	list-style-type: none;
}
.template_menu li:hover { position:relative; background:#0404B4; }
.template_menu li:hover ul {
	left: 0px;
	top: 30px;
	background: #0404B4;
	padding: 0px;
}

.template_menu li:hover ul li a {
	padding: 5px;
	display: block;
	width: 168px;
	text-indent: 15px;
	background-color: #0404B4;
}
.template_menu li:hover ul li a:hover { background:#0404B4; }


} /*** Fin écrans larges ***/