/* General */

body{
    width:initial;
    padding: 0;
}

/* Header */

header{
    flex-direction: column;
    justify-content: flex-start;
    height: 200px;
    margin: 0;
}

#title{
    margin-left:0;
}
nav{
    width: 100%;
}

header ul{
    height: 70px;
    width: 100%;
    padding: 0;
}

header li{
    margin: 0;
    border-bottom: 3px solid #F2F2F2;
}

header li:hover{
    border-bottom: 3px solid #0065FC;
    
    border-top: 2px solid #f2f2f200;
}

/* Main */

main{
	margin: 0;
}

form{
    flex-basis: 100%;
    border-radius: 20px;
}

.submit-btn{
    display: none;
}

.phone-search-btn{
    cursor: pointer;
	display: flex;
    width: 50px;
    min-width: 50px;
    justify-content: center;
    align-items: center;
    background-color: #0065FC;
    border-radius: 15px;
    border: 0;
}

.phone-search-btn:hover{
    background-color: #0065FC80;
}

.fa-search{
    color: #fff;
}
/* Search section */

.search{
    width: initial;
    min-width: initial;
}
#search-section{
    margin: 0 30px 0 30px;
}
/* Filter section */

#filter-section{
    margin: 30px 30px 0 30px;
}
#filter{
    display: flex;
    flex-direction:column;
    align-items: flex-start;
}

.filter{
    margin:10px 10px 0 0;
}

/* Sections hebergement + les plus populaires */

#heberg-popular{
	flex-direction: column-reverse;
}

.card p{
    
    font-size: 13px;
}
    /* Hébergement */

#hebergement{
    margin-top: 20px;
    width: 100%;
    min-width: 320px;
    background-color: #fff;
}

.heberg-card{
    width: 100%;
    margin-right: 0;
}
    /* Les plus populaires */

#popular{
    width: 100%;
    min-width: 320px;
    border-radius: 0;
}

#popular figure{
    width: 24%;
}

.pop-card-infos{
    margin: 15px 0 10px 15px;
}
/* Activités */

#activite{
    margin: 20px 30px 0 30px;
}
#cards-activites{
    display: flex;
    flex-direction: column;
    height: 100%;
}

#cards-activites .card{
    width: 100%;
    height: 221px;
    margin-bottom: 30px;
}

.double-cards{
    width: 100%;
}

#cards-activites img{
	height: 180px;
}

/* Footer */

footer{
    flex-direction: column;
    align-items: flex-start;
}

footer a{
    text-decoration: none;
}
footer ul{
    width: initial;
    justify-content: center;
}

