/*-----------------------------GENERAL AU SITE--------------------------------*/
*{
	margin: 0;
	padding: 0;
}

body{
	/*background-image: url("../img/accueil/bg-accueil.png");
	background-repeat: no-repeat;*/
	width: 100%;
	height: 100%;
	font-family: 'lato', sans-serif;
	font-size: 1.1em;
	font-weight: 400;
	line-height: 1.5;
	height: auto;
}

img{
	width: 100%;
}

main h2{
	font-size: 1.4em;
	font-family:"signika";
	/*font-size: 2.2em;*/
	font-weight: 600;
	text-align: center;
	margin: 0 auto;
	padding: 0.5% 0;
	width: 20%;
	border-bottom: 2px solid #1bbc9f; 
}

main h3{
	font-size: 1.2em;
	font-family:"lato";
	font-weight: 400;
	text-align: center;
	text-transform: uppercase;
	padding: 0 0 6% 0;
	color: #1bbc9f;
}

button{
	background-color: transparent;
	border-radius: 10px 10px 10px 10px;
	border: 2px solid #182739;
	width: 15%;
	padding: 0.5% 0.5%;
	margin: 2% 0 5% 0;
}

button a{
	text-decoration: none;
	font-size: 1.5em;
	color: #182739;
	font-family: "lato";
	font-weight: 700;
	padding: 0 2vw;
}

#bg-body{
	width: 100%;
	height: 100%;
	z-index: -100000;
	position: absolute;

}

/*------------------------BOUTON GENRALE AU SITE HOVER-------------------*/
button:hover{
	background-color: #1bbc9f;
	border: 2px solid #1bbc9f;
}

button:hover a{
	color: white;

}

/****************************************************************************************************************************************************************************************************************************************/
/*-------------------------------CARTE----------------------------------*/

#carte{
	width: 60%;
	margin: 0 auto;
	margin-left: 18%;
}

#carte h2{
	width: 30%;
	margin-bottom: 10%;

}


/********************************************************************************************CODE PAGE ACCUEIL*******************************************************************************************************/
/*--------------------------------------------------------------------*/
/************************************************************************************************************************************************************************************************************************************/
/*-----------------------------HEADER----------------------------------*/
#bg-header{
	width: 100%;
}

nav{
	width: 100%;
	z-index: 1000;
	background-color: white;
	position: relative;
	position: fixed;
}

nav:first-child{
	background-image: url("../img/bgnav.png");
	z-index: 10000;
	box-shadow: 0px 8px 10px 0px #cfcfcf;
	height: 4vh;
}

nav ul li,
nav ol li {
	display: inline-block;
    list-style: none;
    
}

nav ul li{
	margin: 0 3%;
    padding: 0.5% 4.5%;
}

nav ol li{
	margin: 0.5% 2%;
    padding: 2% 4.5% 0;
}

header h1{
	z-index: 100000;
	width: 10%;
	position: absolute;
	position: fixed;
	display: block;
	left : 0;
	right: 0;
	margin: 0 auto;
}

header h1 a img{
	width: 100%;
}

nav ul li a{
	text-decoration: none;
	font-size: 1em;
	color: white;
	padding: 1vh 2vw;
}

nav ol li a{
	text-decoration: none;
	font-size: 1.3em;
	font-weight: 700;
	/*text-transform: uppercase;*/
	color: #182739;
	padding: 0 2vw;
}

/*---------------------------------NAV HOVER---------------------------*/

nav ul li a:hover{
	background-image: url("../img/hover-nav.png");
	color: #1bbc9f;
}


nav ol li a:hover{
	color:#1bbc9f;
}

/*nav ol li a:active{
	color:red;
}*/



/****************************************************************************************************************************************************************************************************************************************/
/*-------------------------PREPARER MA VISITE-------------------------------*/

main article{
	width: 12%;
    float: left;
    padding: 1% 0;
    margin: 4% 4%;
    text-align: center;
    /*background-color: pink;*/
} 

main article p{
	width: 100%;
}

main article img{
	width: 70%;
}

main div{
	width: 100%;
	text-align: center;
	/*background-color: red;
*/	clear: left;
}

/****************************************************************************************************************************************************************************************************************************************/
/*---------------------NOS JARDINS NOS SERRES-----------------------------*/

main section{
	width: 50%;
	float: left;
	position: relative;
	margin-bottom: 2%;
}

main section h2,
main section p{
	text-align: center;
	position: absolute;
	top: 30vh;
    left: 16vw;
}

main section h2{
	color: #ffc98f;
	text-transform: uppercase;
	border-bottom: 2px solid #ffc98f; 
	width: 30%;
	position: absolute;
	top: 40%;
    left: 35%;
}

main section p{
	width: 50%;
	margin: 0 auto;
	color: white;
	font-weight: 700;
	position: absolute;
	top: 55%;
    left: 25%;
}	

main section div button{
	background-color: transparent;
	border-radius: 10px 10px 10px 10px;
	border: 2px solid #ffc98f;
	width: 20%;
	padding: 0.5% 0.5%;
	margin: 4% auto;
	position: absolute;
	top: 70%;
    left: 40%;
}

main section div button a{
	text-decoration: none;
	text-align: center;
	font-size: 1.5em;
	color: #ffc98f;
	font-family: "lato";
	font-weight: 700;
}

/*-----------------------BOUTON SERRE ET JARDIN HOVER-----------------------*/

main section div button:hover{
	background-color: #ffc98f;
}

main section div button:hover{
	color: white;
}

/****************************************************************************************************************************************************************************************************************************************/
/*-------------------------------EVENEMENTS---------------------------------*/
#event{
	width: 100%;
	margin: 0 auto;
	padding: 0;
	position: relative;
}

#event img{
	width: 20%;
	margin: 3% auto;
}

#event img:nth-child(4){
	width: 40%;
	z-index: 10000;
}

#event img:nth-child(2), 
#event img:last-child{
	width: 1%;
	position: absolute;
	top:50%;
}

/****************************************************************************************CODE PAGE PREPARER MA VISITE*******************************************************************************************************/
/*-----------------------PREPARER MA VISTE-------------------------*/

#horloges{
	width: 70%;
	margin: 5% 10% 10% 14%; 
}

/****************************Google Maps***************************/

iframe{
	/*background-color: black;*/
	width: 100%;
	margin: 4% auto;
	padding-top: 2%;
}

#infos{
	background-color: #182739;
	width: 15%;
	height: auto;
	border-radius: 5%;
	position: absolute;
	left:70%;
	/*top:39%;*/
	top:280%;
	/*opacity: 0.7;
*/	color:white;
	padding:1% 2%;
	text-align: left;
	z-index:0;
}

#infos h3{
	text-align: left;
	color: white;
	padding: 1% 1%;
}

#infos img{
	width: 15%;
	float: left;
}






/*******************************RESERVATION*******************************/

section form{
/*	background-color: purple;*/
	height: 67vh;
	width: 40%;
	float: left;
	margin:2% 4%; 
}

 section form input{
	border: 1px solid #1bbc9f;
	border-radius:5px 5px 5px 5px;
	margin: 0 1%;
}

#nom,
#prenom,
#email,
#tel{
	width: 30%;
	margin: 1% 2%;
	height: 2.5vh;
}

#avis{
	float: left;
	width: 90%;
	border: 1px solid #1bbc9f;
	border-radius:5px 5px 5px 5px;
}

#valider{
	background-color: white;
	width: 25%;
	color: #1bbc9f;
	border: 1px solid #1bbc9f;
	border-radius:5px 5px 5px 5px;
	margin: 2% 1%;
	padding: 0.5% 2%;
}

#valider:hover{
	background-color:#1bbc9f;
	color: white;
}

/*main div{
	background-color: lightgreen;
	height: auto;
	width: 30%;
	float: left;
	margin: 0 2%;
	text-align: center;
}
*/

 section div img{
	width: 60%;
    height: auto;
    margin: 5% 0 0 8%;
    text-align: center;
}

/*************************************************************************************CODE CATEGORIE TOUTES CONFONDUES*******************************************************************************************************/
main p{
	width: 40%;
/*	justify-content: center; NON*/
	margin: 0 auto;
	text-align: center;
	padding: 1% 0 2% 0;
}

.categorie{
/*	background-color: red;*/
	width: 100%;
    height: 50vh;
    margin: 2% auto;
    clear: left;
   	margin-bottom: 5%;
}

.categorie h3{
	text-align: left;
    margin-left: 14%;
    margin-top: 10%;
    width: 25%;
}

.categorie p{
	width: 30%;
    float: left;
    color: #182739;
    /* clear: both; */
    left: 14%;
    text-align: left;
} 

.categorie img{
	width: 40%;
    float: right;
    margin: -15% 8% 0 0;
} 

.info{
	background-color: #1bbc9f;
    width: 18%;
    height: 10vh;
    /* margin: 8% 0 0 13%; */
    margin-left: 13%;
    /* margin-top: 5%; */
}

.info p{
	text-align: left;
	padding: 3% 0 0 5%;
	width: 100%;
}



/****************************************************************************************************************************************************************************************************************************************/
/*-------------------------------FOOTER----------------------------------*/
footer{
	/*background-color: yellow;*/
	background-image: url("../img/footer.png");
	clear: left;
	/*background-repeat: no-repeat;*/
	/*margin-top: 10%;
*/	width: 100%;
	
}

footer ul{
	margin-left: 60%;
}

footer ul li{
	display: inline-block;
    margin: 1.5% 3%;
    list-style-type: none;
    width: 25%;
    text-align: center;
}

footer ul li a{
	text-align: center;
	text-decoration: none;
	color: white;
	padding: 0 4%;
}

footer a img{
	width: 2%;
	float: left;
	margin-left: 1%;
	padding: 0.4% 0;
}

/*footer a img:last-child{
	margin-right: 20%;
}*/