* {
	font-family: "Montserrat", sans-serif;
}
.row {
	width: 100%;
	margin: 0
}
a {
	text-decoration: none;
	cursor: pointer
}
a:hover{
	color: #4976a4 !important
}
.intro{
	min-height: 100vh
}
.titre,.titre span{
	font-family: "Cinzel", serif;
	width: 100%;
	text-align: center;
	font-size: 7rem;
	color: #9A9899;
	text-shadow: 5px 5px 2px #000;
}
.titre span{
	font-size: 8rem
}
.titre img{
	width: 200px;
	margin-right: 1rem
}
.info {
	position: absolute;
	color: #eae4e5;
	font-size: 4rem;
	text-align: right;
	width: 90%;
	margin: 2rem 10% auto auto;
	text-shadow: 0 0 4px #000;
	padding: 2rem;

}
.menu {
	position: sticky;
	top:0
}
.menu .col-md-3 a{
	font-size: 2rem;
	color: #ccc !important;
	text-shadow: 1px 1px 2px #000;
	padding: 0 1rem;
	cursor: pointer
}
.menu a:hover {
	color: #000 !important;
	text-shadow: 0 0 5px #fff !important;
}
.menu .col-md-6,.menu .col-md-6 a{
	text-shadow: 1px 1px 2px #fff , 0 0 20px #fff;
	font-size: 1.2rem;
	color: #333 !important
}

.fonbas{
	position: absolute;
	z-index: -1000;
	width: 100%;
	height: 100vh;

}
.fleche {
	position: absolute;
	width: 100%;
	text-align: center;
	bottom: 0;
}
.fleche .bi{
	font-size: 1.5rem
}
.fleche a{
	cursor: pointer
}
.page {
	min-height: 100vh;
background: #fff
}
.sous-titre {
	width: 30%;
	margin-left: 3rem;
	font-size: 2rem;
	border-bottom: 1px solid #000;
	font-weight: 800
}
.presentation p{
	font-size: 1.4rem;
	line-height: 2.2rem;
	padding: 5rem
}
.fond-noir .sous-titre {
	color: #fff;
	border-bottom: 1px solid #fff;
}
.fond-noir {
	background: #4b76a3;
	color: #fff
}

.card {
	background: #fff;
	box-shadow: 0 0 8px #333;
	border: none;
	transition: transform .6s cubic-bezier(.2,-.5,.8,2);
	transform-origin: top;
	transform: perspective(1000px) rotateX(-70deg);
}
.card-body {
	
}
.card-text {
	color: #000
}
.badge {
	font-size: 1.6rem;
	margin-top: 1rem
}
.badge span {
	font-size: .8rem
}
small {
	font-size: .7rem;
	margin-left: 3rem;
}
.adresse {
	font-size: 1.8rem;	
}
.adresse p{
	font-size: 1.2rem
}
.zone {
	font-size: 1.5rem
}
.zone img{box-shadow: 0 0 8px #ccc}
.adresse span {
	font-weight: 800
}

.carousel-inner {

	width: 80%;
	margin-left: 10%;
	box-shadow: 0 0 8px #666
}
.carousel-inner img{
	object-fit: cover
}

.pied {
	padding: 1rem 1rem 0
}
.pied .col-4 {
	text-align: center
}
.pied .bi{
	font-size: 3rem;
	color: #fff
}
.pied p{
	font-size: .9rem
}
.pied a {
	color: #fff !important
}
#bouton-tarif .bi{font-size: 1.2rem}
#tarif .modal-content {
	background: #4b76a3;
	color: #fff
}
.modal-title {
	font-weight: 600 !important;
	font-size: 2rem !important
}
#tarif .modal-body {
	font-size: 1.2rem !important
}
.pied a:hover,.pied .bi:hover,#bouton-tarif .bi:hover {
	color: #333 !important
}

@media only screen and (max-width: 991px) {
	
.titre{
	font-size: 3.2rem;
	margin-top: 1rem;
	line-height: 3rem
}
.titre span{
	font-size: 4.5rem
}
.titre img{
	width: 100px;
	margin: 0
}
.info {
	font-size: 2rem;
	width: 100%;
	padding: 2rem .5rem 0;
	text-align: center;
	margin-top: 0
}
.fonbas{
	object-fit:cover

}	
.menu .col-md-3 a {
padding: 0 .3rem;
font-size: 1.5rem

}
.sous-titre {
	width: 95% !important;
	margin-left: .5rem;
	font-size: 2rem;

}
.row {
	padding: 0 !important;
}
.adresse {
	font-size: 1.2rem
}
.carousel-inner {
width: 96%;
margin-left: 2%;
}
.diapo {
	min-height: 50%
}
.presentation p{
	font-size: 1rem;
	line-height: 1.4rem;
	padding: .5rem
}
.presentation {
	padding: 3rem .5rem !important
}
.presentation .sous-titre {
	font-size: 1.4rem;
	margin-bottom: 1rem
}
.col-md-6.zone,.col-md-6.adresse {
	padding: .5rem !important
}
.pied p{
	font-size: .7rem
}
}