/* --------------------------------------------------------------- */
/*
/* HTML
/*
/* --------------------------------------------------------------- */
* {
	box-sizing : border-box;
}

html, body {
	margin      : 0;
	padding     : 0;
	width       : 100%;
	height      : 100%;
	font-family : "PT Sans";
	font-size   : 14px;
}

body {
	color            : #FFFFFF;
	background-color : #CCCCCC;
	text-align       : center;
}

.noscroll {
	position   : fixed;
	width      : 100%;
	overflow-y : scroll;
}

#main {
	position        : relative;
	top             : 0;
	left            : 0;
	width           : 100%;
	min-height      : 100%;
	margin          : 0 auto;
	text-align      : justify;
	/*background-color : #000000;*/
	overflow-x      : hidden;
	background      : url("../images/fond_page.jpg?v=2") repeat-y;
	background-size : 100% auto !important;
}


/* --------------------------------------------------------------- */
/*
/* Header
/*
/* --------------------------------------------------------------- */
#entete {
	position      : relative;
	top           : 0;
	left          : 0;
	height        : 563px;
	background    : url("../images/accueil.jpg") no-repeat center center;
	/*margin-bottom:95px;*/
	margin-bottom : 205px;
	z-index       : 10;
}

#entete #photo_bandeau {
	position : absolute;
	top      : 0;
	left     : 0;
	z-index  : 5;
}

#entete #photo_bandeau img {
	width      : 1920px;
	height     : 563px;
	object-fit : cover;
}

#entete #bandeau_haut {
	position         : relative;
	top              : 0;
	left             : 0;
	background-color : rgba(150, 1, 0, 0.8);
	padding          : 15px 0;
	z-index          : 30;
}

#entete .container {
	position   : relative;
	top        : 0;
	left       : 0;
	text-align : center;
}

#entete a {
	color           : white;
	text-decoration : none;
}

#entete a .texte {
	font-size : 14px;
}

.flex_menu {
	height          : 100%;
	display         : flex;
	flex-direction  : column;
	justify-content : space-between;
}

.menu_haut_gauche {
	position    : relative;
	font-family : "Cookie";
	font-size   : 32px;
	/*height:100%;*/
}

#liens_user {
	text-decoration : none;
	font-size       : 14px;
	text-align      : right;
	padding-top     : 0.5em;
}

.menu_haut_droite {
	font-family : "Cookie";
	font-size   : 32px;
}

#liens_user .space {
	display         : flex;
	justify-content : center;
	padding         : 0.5em 0;
}

#liens_user .icone {
	font-size : 20px;
}

#liens_user .texte {
	padding-left : 0.5em;
}

#liens_user #panier_base {
	border-left : 1px dotted white;
}


#bandeau_haut .lien_resto {
	display         : flex;
	align-items     : center;
	justify-content : flex-start;
	font-size       : 14px;
	line-height     : 1;
	letter-spacing  : 1px;
	background      : none;
	box-shadow      : none;
	outline         : none;
	border          : 2px solid #FFFFFF;
	color           : #FFFFFF;
	text-transform  : uppercase;
}

#bandeau_haut .lien_resto:hover {
	background  : #FFFFFF;
	color       : #603034;
	font-weight : bold;
	box-shadow  : 1px 1px 6px 3px rgba(0, 0, 0, 0.15);
}

#bandeau_haut .lien_resto img {
	width        : 25px;
	margin-right : 5px;
}


@media screen and (max-width : 1199px) {
	#bandeau_haut .lien_resto {
		font-size       : 12px;
		justify-content : center;
		padding         : 10px 5px;
	}

	#bandeau_haut .lien_resto img {
		display : none;
	}
}

#bandeau_haut .resto_menu_responsive {
	display         : flex;
	align-items     : center;
	justify-content : flex-start;
	margin          : 5px 0;
}

#bandeau_haut .resto_menu_responsive img {
	width        : 20px;
	margin-right : 10px;
}


#facebook a {
	display         : flex;
	flex-wrap       : wrap;
	align-items     : center;
	justify-content : center;
}

#facebook i {
	font-size    : 23px;
	margin-right : 10px;
}

#facebook span {
	font-size   : 14px;
	font-family : "PT Sans";
}

#responsive_navbar #facebook {
	position : relative;
	top      : initial;
}

#responsive_navbar #facebook a {
	justify-content : start;
}

#responsive_navbar #facebook i {
	font-size : 20px;
}

/* --------------------------------------------------------------- */
/*
/* Recherche
/*
/* --------------------------------------------------------------- */
.recherche_form {
	position   : relative;
	top        : 0;
	left       : 0;
	margin-top : 0.5em;
}

.recherche_form .valid_recherche {
	position                   : absolute;
	top                        : 1px;
	right                      : 1px;
	bottom                     : 1px;
	width                      : 33.5px;
	border                     : none;
	border-top-right-radius    : 5px;
	border-bottom-right-radius : 5px;

	color                      : #FFFFFF;

	background                 : #6A0100;
	background                 : -moz-linear-gradient(top, #6A0100 1%, #960100 100%);
	background                 : -webkit-linear-gradient(top, #6A0100 1%, #960100 100%);
	background                 : linear-gradient(to bottom, #6A0100 1%, #960100 100%);
	filter                     : progid:DXImageTransform.Microsoft.gradient(startColorstr="#6a0100", endColorstr="#960100", GradientType=0);
}

#recherche_form #form_recherche {
	padding-right : 33.5px;
}

@media (max-width : 991px) {
	#conteneur_recherche {
		position : absolute;
		bottom   : 0;
		left     : 0;
		display  : block;
		width    : 100%;
		padding  : 10px;
	}

	#conteneur_recherche i {
		font-size : 18px !important;
	}
}


/* --------------------------------------------------------------- */
/*
/* Menu
/*
/* --------------------------------------------------------------- */
#menu {
	position   : relative;
	top        : 0px;
	left       : 0;
	width      : 100%;
	margin-top : 300px;
	z-index    : 60;
}

#menu ul {
	list-style-type : none;
	margin          : 0;
	padding         : 0;
	display         : flex;
	justify-content : space-between;
	align-items     : center;
}

#menu #main_menu {
	border-radius : 5px;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#6a0100+1,960100+100 */
	background    : #6A0100; /* Old browsers */
	background    : -moz-linear-gradient(top, #6A0100 1%, #960100 100%); /* FF3.6-15 */
	background    : -webkit-linear-gradient(top, #6A0100 1%, #960100 100%); /* Chrome10-25,Safari5.1-6 */
	background    : linear-gradient(to bottom, #6A0100 1%, #960100 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter        : progid:DXImageTransform.Microsoft.gradient(startColorstr="#6a0100", endColorstr="#960100", GradientType=0); /* IE6-9 */
}

#menu #main_menu li {
	position : relative;
	top      : 0;
	left     : 0;
	margin   : 0;
	padding  : 0;
}

#menu #main_menu > li:hover {
	background-color : white;
}

#menu #main_menu > li:hover:first-child {
	border-top-left-radius : 5px;
}

#menu #main_menu > li:hover:last-child {
	border-top-right-radius    : 5px;
	border-bottom-right-radius : 5px;
}

#menu #main_menu > li > a {
	text-decoration : none;
	display         : block;
	font-family     : "Cookie";
	color           : #FFFFFF;
	font-size       : 26px;
	padding-bottom  : 0.25em;
}

#menu #main_menu .titre_menu:after {
	content          : "";
	position         : absolute;
	bottom           : 7%;
	left             : 35%;
	width            : 30%;
	align            : center;
	height           : 1px;
	background-color : #960100;
}

#menu #main_menu li a span.image_menu {
	display : block;
	height  : 80px;
}

#menu #main_menu li a span.image_menu img {
	display        : inline-block;
	vertical-align : middle;
}

#menu .sous_menu {
	display                    : none;
	position                   : absolute;
	top                        : 100%;
	left                       : 0;
	background                 : white;
	width                      : 100%;
	border                     : 1px solid #DDDDDD;
	border-top                 : 0;
	border-top-left-radius     : 0;
	border-top-right-radius    : 0;
	border-bottom-left-radius  : 5px;
	border-bottom-right-radius : 5px;
}

#menu #main_menu li:hover .sous_menu {
	display : block;
	margin  : 0;
}

#menu .sous_menu li {
	clear  : left;
	margin : 0;
}

#menu .sous_menu li:hover {
	clear      : left;
	margin     : 0;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d9d9d9+0,d9d9d9+100&0+0,0.65+100 */
	background : -moz-radial-gradient(center, ellipse cover, rgba(217, 217, 217, 0) 0%, rgba(217, 217, 217, 0.65) 100%); /* FF3.6-15 */
	background : -webkit-radial-gradient(center, ellipse cover, rgba(217, 217, 217, 0) 0%, rgba(217, 217, 217, 0.65) 100%); /* Chrome10-25,Safari5.1-6 */
	background : radial-gradient(ellipse at center, rgba(217, 217, 217, 0) 0%, rgba(217, 217, 217, 0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter     : progid:DXImageTransform.Microsoft.gradient(startColorstr="#00d9d9d9", endColorstr="#a6d9d9d9", GradientType=1); /* IE6-9 fallback on horizontal gradient */
}

#menu .sous_menu li:hover:first-child {
	border-top-left-radius : 0px;
}

#menu .sous_menu li:hover:last-child {
	border-top-right-radius    : 0px;
	border-bottom-left-radius  : 5px;
	border-bottom-right-radius : 5px;
}

#menu .sous_menu > li > a {
	display     : block;
	font-family : "PT Sans";
	font-size   : 16px;
	color       : #960100;
	padding     : 0.5em 0.5em;
}


/* --------------------------------------------------------------- */
/*
/* Page
/*
/* --------------------------------------------------------------- */
#page {
	position   : relative;
	top        : 0;
	left       : 0;
	min-height : 350px;

}

#page section {
	margin  : 45px 0;
	z-index : 5;
}

#page a {
	color : #960100;
}

#page .bouton {
	position        : relative;
	top             : 0;
	left            : 0;
	padding         : 10px 25px;
	color           : #FFFFFF;
	display         : inline-block;
	/*font-size: 14px;*/
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#6a0100+1,960100+100 */
	background      : #6A0100; /* Old browsers */
	background      : -moz-linear-gradient(top, #6A0100 1%, #960100 100%); /* FF3.6-15 */
	background      : -webkit-linear-gradient(top, #6A0100 1%, #960100 100%); /* Chrome10-25,Safari5.1-6 */
	background      : linear-gradient(to bottom, #6A0100 1%, #960100 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter          : progid:DXImageTransform.Microsoft.gradient(startColorstr="#6a0100", endColorstr="#960100", GradientType=0); /* IE6-9 */
	border-radius   : 5px;
	border          : none;
	margin          : 5px 10px 5px 0px;
	text-decoration : none;
	cursor          : pointer;
	transition      : 0.25s ease-in-out;
}

#page .bouton:hover {
	background : #960100; /* Old browsers */
	background : -moz-linear-gradient(top, #960100 1%, #960100 100%); /* FF3.6-15 */
	background : -webkit-linear-gradient(top, #960100 1%, #960100 100%); /* Chrome10-25,Safari5.1-6 */
	background : linear-gradient(to bottom, #960100 1%, #960100 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

#page .bouton i {
	margin-left : 7px;
}

#page .fond {
	position         : relative;
	top              : 0;
	left             : 0;
	background-color : #FFFFFF;
	padding          : 10px;
	margin           : 45px 0;
}

#page .fond .content {
	border  : 1px solid #BBBBBB;
	padding : 15px 30px;
	color   : #222222;
}

#page h1 {
	position    : relative;
	top         : 0;
	left        : 0;
	margin      : 10px auto;
	/*padding:50px 100px;*/
	padding     : 10px 35px;
	border      : 2px solid #FFFFFF;
	display     : inline-block;
	font-family : "Cookie";
	font-size   : 51px;
	color       : #FFFFFF;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#960100+27,6a0100+100 */
	background  : #960100; /* Old browsers */
	background  : -moz-linear-gradient(top, #960100 27%, #6A0100 100%); /* FF3.6-15 */
	background  : -webkit-linear-gradient(top, #960100 27%, #6A0100 100%); /* Chrome10-25,Safari5.1-6 */
	background  : linear-gradient(to bottom, #960100 27%, #6A0100 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter      : progid:DXImageTransform.Microsoft.gradient(startColorstr="#960100", endColorstr="#6a0100", GradientType=0); /* IE6-9 */
	/*background:url('../images/losange.png') no-repeat center center;
	background-size:100% 100%;*/
}

#page h1:after {
	content          : "";
	position         : absolute;
	bottom           : 18%;
	left             : 35%;
	height           : 2px;
	width            : 30%;
	background-color : white;
}

/*#page h1:before {
	content:"";
	position:absolute; top:46.5%; left:-248px;
	width:254px; height:11px;
	background:url('../images/h1_before.png');
}

#page h1:after {
	content:"";
	position:absolute; top:46.5%; right:-248px;
	width:254px; height:11px;
	background:url('../images/h1_after.png');
}*/

#page h3 {
	position      : relative;
	color         : #000000;
	font-size     : 25px;
	padding       : 10px 25px;
	border-bottom : 1px solid #CCCCCC;
	font-weight   : 300;
	margin-bottom : 25px;
}

#page h3:after {
	content          : "";
	position         : absolute;
	bottom           : -3px;
	left             : 25px;
	width            : 220px;
	height           : 3px;
	background-color : #840606;
}

#page .navigation {
	display         : flex;
	justify-content : center;
	align-items     : center;
}

#page .navigation .bouton {
	font-size : 20px;
	margin    : 0 20px 0 0 !important;
}

#page .prix_normal {
	font-size       : 70%;
	text-decoration : line-through;
}


/* --------------------------------------------------------------- */
/*
/* Ruban de promo
/*
/* --------------------------------------------------------------- */
.ribbon {
	position   : absolute;
	left       : -5px;
	top        : -5px;
	z-index    : 1;
	overflow   : hidden;
	width      : 150px;
	height     : 150px;
	text-align : right;
}

.ribbon span {
	font-size         : 20px;
	font-weight       : bold;
	color             : #FFFFFF;
	text-transform    : uppercase;
	text-align        : center;
	line-height       : 36px;
	transform         : rotate(-45deg);
	-webkit-transform : rotate(-45deg);
	width             : 175px;
	display           : block;
	background        : #79A70A;
	background        : linear-gradient(#960100 0%, #6A0100 100%);
	box-shadow        : 0 3px 10px -5px rgba(0, 0, 0, 1);
	position          : absolute;
	top               : 32px;
	left              : -37px;
	line-height       : 25px;
}

.ribbon span::before {
	content       : "";
	position      : absolute;
	left          : 0px;
	top           : 100%;
	z-index       : -1;
	border-left   : 3px solid #6A0100;
	border-right  : 3px solid transparent;
	border-bottom : 3px solid transparent;
	border-top    : 3px solid #6A0100;
}

.ribbon span::after {
	content       : "";
	position      : absolute;
	right         : 0px;
	top           : 100%;
	z-index       : -1;
	border-left   : 3px solid transparent;
	border-right  : 3px solid #6A0100;
	border-bottom : 3px solid transparent;
	border-top    : 3px solid #6A0100;
}

/* --------------------------------------------------------------- */
/*
/* Pied
/*
/* --------------------------------------------------------------- */
#pied {
	position   : relative;
	top        : 0;
	left       : 0;
	text-align : center;

}

#pied #footer_haut {
	position   : relative;
	top        : 0;
	left       : 0;
	min-height : 330px;
	background : url("../images/vache_pied.png") no-repeat left bottom #F6F5F6;
	padding    : 35px 0;
	text-align : left;
}

#pied #footer_haut .titre_page_categorie {
	font-family   : "Cookie";
	font-size     : 32px;
	color         : #960100;
	margin-bottom : 0.5em;
}

#pied #footer_haut .footer_page {
	display       : block;
	color         : #960100 !important;
	margin-bottom : 0.75em;
}

#pied #footer_bas {
	padding : 15px 0;
}

#pied #footer_bas a {
	color           : #FFFFFF;
	text-decoration : none;
}


/* --------------------------------------------------------------- */
/*
/* Général
/*
/* --------------------------------------------------------------- */
a img {
	border : none;
}

input[type=number] {
	width  : 60px;
	margin : 0 auto;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
	opacity : 1;
}

#page .center {
	text-align   : center;
	margin-left  : auto;
	margin-right : auto;
}

#page .left {
	float  : left;
	margin : 0 1em 0.5em 0;
}

#page .right {
	float  : right;
	margin : 0 0 0.5em 1em;
}

#page .clear {
	clear : both;
}

#page hr {
	border-color : #AACC22;
	color        : #AACC22;
}

.cache {
	display  : none;
	position : absolute;
	width    : 1px;
	height   : 1px;
	overflow : hidden;
}

.print {
	display : none;
}

.noprint {
}


/* ------- Zoom DW ------- */
#z_ombre {
	background-color : #222222;
	filter           : progid:DXImageTransform.Microsoft.Alpha(opacity:90);
	opacity          : 0.9;
}

#z_image {
	border     : 10px solid #FFFFFF;
	visibility : hidden;
}

#z_titre {
	height           : 10px;
	color            : #FFFFFF;
	background-color : #000000;
	filter           : progid:DXImageTransform.Microsoft.Alpha(opacity:70);
	opacity          : 0.7;
}

#z_close {
	visibility : hidden;
}


@media screen and (max-width : 1199px) {
	.menu_haut_gauche, .menu_haut_droite {
		font-size : 25px;
	}
}

@media screen and (max-width : 991px) {
	#main {
		-webkit-background-size : contain;
		background-size         : contain;
	}

	#entete {
		position   : fixed;
		top        : 0;
		right      : 0;
		left       : 0;
		height     : auto !important;
		background : none;
	}

	#diapo_accueil {
		display : none;
	}

	#photo_bandeau {
		display : none;
	}

	#diapo_accueil {
		display : none;
	}

	#entete #bandeau_haut {
		padding : 5px 0 55px 0;
	}

	#responsive_header #lien_acceuil {
		display                 : block;
		height                  : 70px;
		width                   : 100%;
		background              : url("../images/boutique-eric-dulat_small.png") no-repeat center center;
		-webkit-background-size : contain;
		background-size         : contain;
	}

	#entete #bandeau_haut .img-fluid {
		max-height : 70px;
		display    : block;
		margin     : auto;
	}

	#menu {
		display    : none;
		margin-top : 0 !important;
	}

	#responsive_header #bandeau {
		min-height : 70px;
	}

	#responsive_header .links {
		height          : 100%;
		display         : flex;
		align-items     : center;
		justify-content : flex-end;
	}

	#responsive_header .links a {
		margin : 0 10px;
	}

	#responsive_header i {
		font-size : 25px;
		color     : #FFFFFF;
	}

	#responsive_navbar {
		max-height : calc(100vh - 80px);
		overflow-y : auto;
	}

	.dropdown-menu {
		padding-left : 15px;
	}

	.dropdown-menu > a:first-child {
		font-weight : bold;
	}

	.dropdown-menu.show {
		transform      : none !important;
		position       : relative !important;
		display        : flex;
		flex-direction : column;
		background     : none;
		border         : none;

	}

	#page {
		padding-top : 141px;
	}

	#page h1 {
		font-size : 40px;
	}

	#page h1:after {
		display : none;
	}

}

@media screen and (max-width : 767px) {
	#page h3 {
		text-align : left;
	}
}

@media screen and (max-width : 575px) {
	#page h3:after {
		width : 80%;
		left  : 10%;
	}

	#page .fond .content {
		padding : 15px;
	}

	#page .navigation {
		flex-wrap      : wrap;
		flex-direction : column;
	}

	#page .navigation .bouton {
		margin : 10px 0 !important;
	}
}


.mobile-phone-input .input-group .input-group-prepend select{
	height: 100%;
}