@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@100;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700;800&display=swap');

body {
	background-color: #f5f5f5;
	color: #3b3b3b;
	font-family: 'Raleway', sans-serif;
}

header {
	padding-top: 10px;
	padding-bottom: 20px;
	background-color: #fff;
	margin-bottom: 20px;
	border-bottom: #ddd 1px solid;
}

header .container {
	max-width: 700px;
}

footer {
	padding-bottom: 10px;
	padding-top: 20px;
	background-color: #fff;
	margin-top: 20px;
	border-top: #ddd 1px solid;

	font-size: 12px;
}

footer p {
	text-align: justify;
}

footer ul {
	list-style-type: none;
	padding-left: 0;
}

footer .row > div {
	border: 1px dashed #ddd;
	padding: 1rem;
}

.text-blue {
	color: #3156a3 !important;
}

.blue-title {
	color: #3156a3;
	border-color: #3156a3;

	text-transform: uppercase;
	font-weight: 900;
	border-bottom: 4px solid #3156a3;
	margin-bottom: 10px;
}

#box-montant {
	margin-top: 20px;
	margin-bottom: 20px;
}

#box-montant .btn-montant {
	background-color: #f5f5f5;
	color: #3156a3;
	padding: 20px;
	text-align: center;
	font-weight: bold;
	cursor: pointer;
	font-size: 20px;
}

#box-montant .libre-montant {
	background-color: #f5f5f5;
	color: #3156a3;
	padding: 20px;
	font-size: 20px;
	cursor: pointer;
	font-weight: bold;
	margin-top: 10px;
	border-radius: 4px;
}

#libre-montant-input {
	margin-top: -3px;
	margin-bottom: -3px;
	width: 75%;
	background: transparent;
	border: none;

	color: #3156a3;
	font-weight: bold;
	outline: none;
}

#libre-montant-input::placeholder {
	color: #3156a3;
}

#box-montant .libre-montant.active #libre-montant-input::placeholder {
	color: #cfcfcf;
}

#box-montant .libre-montant.active,
#box-montant .libre-montant.active #libre-montant-input {
	color: #fff;
}

#box-montant .active {
	background-color: #3156a3;
	color: #fff;
}

#box-montant .btn-montant:hover:not(.active),
#box-montant .libre-montant:hover:not(.active) {
	background-color: #dbdbdb;
}

#box-montant .btn-montant:nth-of-type(1) {
	border-top-left-radius: 4px;
	border-bottom-left-radius: 4px;
}

#box-montant .btn-montant:nth-last-of-type(1) {
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
}

#box-montant {
	margin-top: 20px;
	margin-bottom: 20px;
	margin-left: 0;
	margin-right: 0;
}

.btn-montant-submit {
	background-color: #3156a3;
	color: #fff;
	font-weight: bold;
}

.btn-montant-submit:hover {
	background-color: #274585;
	color: #fff;
}

.coord-form label {
	margin-bottom: 4px;
	margin-top: 12px;
}

.coord-form option {
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
}

.custom-control-input:checked ~ .custom-control-label::before {
	border-color: #3156a3;
	background-color: #3156a3;
}

.text-required {
	color: #dc3545 !important;
	font-weight: bold;
}

.text-open-sans {
	font-family: 'Open Sans', sans-serif;
}

.card-produit {
	padding: .25rem;
	font-family: 'Open Sans', sans-serif;
}

.card-produit img {
	margin-bottom: 10px;
}

.card-produit .produit-name {
	text-align: center;
	margin-bottom: 8px;
	font-size: .85rem;
}

.card-produit .produit-name a {
	color: #3156a3;
}

.card-produit .produit-price {
	text-align: center;
	font-weight: bold;
	height: 100%;
	background-color: #eee;
	font-size: 1.2rem;
	padding-top: 5px;
}

.btn-add-cart {
	border-radius: 0;
	padding-top: 8px !important;
	padding-bottom: 8px !important;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
	background-color: #3156a3;
}

.nav-link {
	color: #3156a3;
}
.nav-link:hover {
	color: #3f70da;
}

.table-panier {
	font-size: 10pt;
}
.table-panier thead tr {
	font-weight: bold;
}
.table-panier thead td {
	border-top: 0;
}