
/* Eléments principaux de la page */

body
{
	background-color: #E7E7E7;
}


#bloc_page
{
	margin:auto;
	width:1000px;
    height:auto;
	background-color: rgba(255, 255, 255, .4);
	font-family: 'Muli', sans-serif;
    color: black;
}

/*Header*/

header
{
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

/*Titre - logo*/

#titre_principal
{
    display: flex;
    flex-direction: column;
}

#logo
{
    display: block;
    flex-direction: row;
    align-items: baseline;
    margin-left:43px;
    margin-top:20px;

}

#logo img
{
    width: 122px;
    height: 60px;
}

/* Navigation */

#nav_container
{
    clear: right;
}

*{
    vertical-align: baseline;
    margin: 0px;
    padding:0px;
}

div{
    display: block;
}

#main_menu
{
    float: left;
    padding: 0px 0px 0px 36px;
}

ul
{
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 40px;
}

#main_menu li
{
    width:12.4em;
    display:block;
    border-left:1px solid rgb(67,67,67);
    float: left;
    list-style-type: none;
    text-align: center;
    position: relative;
    padding-bottom: 0px;
}

*{
    vertical-align: baseline;
    margin:0px;
    padding:0px;
}

li
{
    display: list-item;
}

#main_menu li a
{
    text-align: center;
    display: block;
    color: black;
    font-family: 'Ubuntu', sans-serif;
    text-transform: uppercase;
    padding:0px 10px;
}

a
{
    color: rgb(102,102,102);
    cursor: pointer;
    text-decoration: none;
}

*{
    vertical-align: baseline;
    margin:0px;
    padding:0px;
}

#main_menu li a:hover
{
    color: black; /*écriture menu après*/
    font-weight: bold;
}

/*Bannière*/

#conteneur{
		height: 531px;
		width: 1000px;
}

#banniere{
	margin-top: 20px;
}

#conteneur, #banniere {
	margin-top: 2%;
	width: 100%;
  	height: 500px;
  	border-radius: 5px;
  	background: no-repeat;
  	position: relative;
}

.gauche, .droite{
cursor: pointer;
position: absolute;
top: 50%;
color: black;
font-weight: bold;
font-size: 40px;
z-index: 2;
}

.gauche{
  border-radius: 0 3px 3px 0;
  left: 0;
}

.droite{
  right: 0;
  border-radius: 3px 0 0 3px;
}

/*Actualité*/

#Actualités
{
	width:278px;
	height:175px;
	display:block;
	position:static;
	margin-top:60px;
	margin-left:41.5px;
	line-height:16px;
	font-weight:bold;
	text-align:center;
}

#Actualités img
{
		width:278px;
		height:175px;
		opacity:0.9;
	    box-shadow: 0px 0px 15px 6px white
}

#Actualités img:hover
{
		opacity:1.0;
}

/*Logement*/

#Logements
{
	width:278px;
	height:175px;
	display:block;
	position:static;
	margin-top:-175px;
	margin-left:361px;
	line-height:16px;
	font-weight:bold;
	text-align:center;
}

#Logements img
{
	width:278px;
	height:175px;
	opacity:0.9;
	box-shadow: 0px 0px 15px 6px white
}

#Logements img:hover
{
		opacity:1.0;
}

/*Voyage*/

#Voyages
{
	width:278px;
	height:175px;
	display:block;
	position:static;
	margin-top:-175px;
	margin-left:680.5px;
	line-height:16px;
	font-weight:bold;
	text-align:center;
}

#Voyages img
{
	width:278px;
	height:175px;
	opacity:0.9;
	box-shadow: 0px 0px 15px 6px white
}

#Voyages img:hover
{
		opacity:1.0;
}

/*Organisation*/

#Separation
{
	width:1000px;
	height:80px;
	display:block;
	position:static;
	color: red; /*barre*/
    font-weight: bold;
	background:white;
	text-align:center;
	margin-top: 75px;
    border:1px solid red;;
}

#footer{
        background: #222222;
        clear:both;
        overflow:hidden;
    }

#Separation p{
	padding: 25px 20px 25px 20px;
}

#Separation a{
        display: block;
        padding-top: 15px;
        padding-bottom: 15px;
        font-family: 'Muli', sans-serif;
        color : white;
        font-weight: bold;
        font-style: italic;
        border: 1px solid red;
			}

    a{
        color: #666;
        cursor: pointer;
        text-decoration:none;
    }

    a img, fieldset, form{
        border: 0;
    }

/*Bas de page*/

#nav_footer{
	display: flex;
    margin-top:10px;
}

#nav_footer ul{
	display: flex;
}

#nav_footer li{
	margin-left: 30px;
}

#hautpage{
	margin-left: 300px;
	color: black;
}
