/*
*
* style-responsive.css
*
* Toujours designer pour les mobile en premier = plus leger pour eux
*/

/* Début init */
* {
  box-sizing: border-box;
}
.row::after {
  content: "";
  clear: both;
  display: block;
}

[class*="col-"] {
  float: left;
  padding: 15px;
}

img {
  width: 100%;
  max-width: 100%;
  height: auto;
}





/* Fin init */




/* Pour mobile = defaut */
[class*="col-"] {
	width: 100%;
}

/* NAVIGATION */
#top-navigation {
	display : block;
	width : 100%;
	height : 55px;
	color : #fff;
	padding : 0px 0px 0px 0px;
	margin : 0px 0px 0px 0px;
	z-index: 3;
	position : relative;
}

a#top-navigation-logolink {
	display : block;
	float: left;
	width : 100px;
	height : 55px;
	background : url(imgs/logo-hover.png) no-repeat 6px 6px;
	color : transparent;
	padding : 0px 0px 0px 0px;
	margin : 0px 10px 0px 0px;
}


/* menu icon */

#top-navigation .menu-icon {
  cursor: pointer;
  display: inline-block;
  float: right;
  padding: 28px 20px;
  position: relative;
  user-select: none;
  color : #e1e1e1;
}

#top-navigation .menu-icon:hover {
  color : #fff;
}

#top-navigation .menu-icon .navicon {
  background: #e1e1e1;
  display: block;
  height: 3px;
  position: relative;
  transition: background .2s ease-out;
  width: 32px;
}

#top-navigation .menu-icon .navicon:before,
#top-navigation .menu-icon .navicon:after {
  background: #e1e1e1;
  content: '';
  display: block;
  height: 100%;
  position: absolute;
  transition: all .2s ease-out;
  width: 100%;
}

#top-navigation .menu-icon .navicon:before:hover,
#top-navigation .menu-icon .navicon:after:hover {
  background: #fff;
}

#top-navigation .menu-icon .navicon:before {
  top: 8px;
}

#top-navigation .menu-icon .navicon:after {
  top: -8px;
}

/* menu btn */

#top-navigation .menu-btn {
  display: none;
  color : #e1e1e1;
}

#top-navigation .menu-btn:hover {
  color : #fff;
}

#top-navigation .menu-btn:checked ~ #top-navigation-burgerlist-public {
  max-height: 240px;
}


#top-navigation .menu-btn:checked ~ .menu-icon .navicon {
  background: transparent;
}

#top-navigation .menu-btn:checked ~ .menu-icon .navicon:before {
  transform: rotate(-45deg);
}

#top-navigation .menu-btn:checked ~ .menu-icon .navicon:after {
  transform: rotate(45deg);
}

#top-navigation .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before,
#top-navigation .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after {
  top: 0;
}


/* account icon */
#top-navigation .accountmenu-icon {
  cursor: pointer;
  display: inline-block;
  float: right;
  padding: 28px 10px;
  position: relative;
  user-select: none;
  color : #e1e1e1;
  background : url(imgs/icons/account-32-grey.png) no-repeat center;
}
#top-navigation .accountmenu-icon:hover {
  color : #fff;
}

#top-navigation .accountmenu-icon .navicon {
  display: block;
  position: relative;
  transition: background .2s ease-out;
  width: 32px;
  background : url(imgs/icons/account-32-grey.png) no-repeat center;
}
#top-navigation .accountmenu-icon:hover .navicon {
  background : url(imgs/icons/account-32-white.png) no-repeat center;
}

/* account menu btn */
#top-navigation .accountmenu-btn {
  display: none;
  color : #e1e1e1;
}

#top-navigation .accountmenu-btn:hover {
  color : #fff;
}


#top-navigation .accountmenu-btn:checked ~ #top-navigation-burgerlist-account {
  max-height: none;
  overflow : visible;
}



/* account icon */
#top-navigation .accountmenu2-btn {
  display: none;
}
#top-navigation .accountmenu2-icon {
  display: none;
}


/* Menu */
ul#top-navigation-list {
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: hidden;
  max-width : 400px;
  color : #fff;
  position : absolute;
  right : 120px;
  float : right;
  font-family : Exo;
  font-size : 1em;
  text-decoration : none;
  
}

ul#top-navigation-list li.top-navigation-list-item{
  width : 55px;
  height : 55px;
  margin: 0 10px 0 0;
  padding: 0;
  overflow: hidden;
  color : #fff;
  float : left;
  
}


#top-navigation a.top-navigation-list-item-link{
  display : block;
  padding: 20px 15px;
  text-decoration: none;
  color : #6fad1c;
  text-indent: -9999px;                 /* sends the text off-screen */
}

#top-navigation #top-navigation-list-item-link-account {
	display : none;
}




a#top-navigation-list-item-link-search {
	background : url(imgs/icons/marqueur-32-grey.png) no-repeat center;
}
a#top-navigation-list-item-link-search:hover, a#top-navigation-list-item-link-search:active {
	background : url(imgs/icons/marqueur-32-white.png)  no-repeat center;
}

a#top-navigation-list-item-link-basket {
	background : url(imgs/icons/basket-32-grey.png) no-repeat center;
	
}
a#top-navigation-list-item-link-basket:hover, a#top-navigation-list-item-link-basket:active {
	background : url(imgs/icons/basket-32-white.png)  no-repeat center;
	
}

a#top-navigation-list-item-link-account {
	background : url(imgs/icons/account-32-grey.png) no-repeat center;
	
}
a#top-navigation-list-item-link-account:hover, a#top-navigation-list-item-link-account:active {
	background : url(imgs/icons/account-32-white.png)  no-repeat center;
	
}


ul.top-navigation-burgerlist {
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: hidden;
  min-width : 250px;
  max-width : 350px;
  color : #fff;
  clear: both;
  max-height: 0;
  transition: max-height .2s ease-out;
  position : absolute;
  top : 55px;
  right : 0px; 
}

ul.top-navigation-burgerlist li{
	width : 100%;
	display : block;
	background-color : transparent;
}

ul.top-navigation-burgerlist li.top-navigation-burgerlist-username{
	width : 100%;
	display : block;
	text-align : center;
	padding : 0px 0px 0px 0px; 
	font-weight: bold;
}


.top-navigation-burgerlist a.top-navigation-burgerlist-item-link{
	display : block;
	width : 100%;
	color : #fff;
	padding : 15px 20px 15px 20px;
	margin : 0px 0px 0px 0px;
	z-index: 3;
	font-family : Exo;
	font-size : 1.3em;
	text-decoration : none;
}


.top-navigation-burgerlist a.top-navigation-burgerlist-item-link:hover {

	background-color : #447009;
}

ul.top-navigation-burgerlist li ul{
	display : none;
}


/* Inscription */

#registrer-form-table, #pswdrecovery-form-table {
	margin : 25px 20px;
}

table#registrer-form-table tr td, #pswdrecovery-form-table  tr td{
	padding : 10px 0px;


}

a.registrer-form-table-alreadyregistredlink {
	padding : 0px 0px 0px 10px;
}

/* Temoignage */ 

#temoignage {
	min-height : 400px;
	background : url(imgs/quote.png) no-repeat top left, url(imgs/edgar.png) no-repeat bottom right;

}


p#temoignage-quote {
	width : 50%;
	padding : 120px 0px 0px 10px;
	font-size : 1.5em;

}

p#temoignage-author {
	width : 50%;
	padding : 20px 0px 0px 30px;
	color : green;
	font-weight : bold;
}

/*Menu compte perso */

#login-form-table {
	margin : 20px 20px 20px 20px;

}

#login-form-table td{
	 padding : 10px 0px;
	 color : #000;
}

#login-form-table-submit {
	text-align : center; 
}

/* INDEX */
#index-msg-content {
	display : block;
	margin : 0px 0px 10px 0px;
	padding : 10px;
	background-color : #6fad1c;
	border-radius: 5px 5px;
	color : #fff;
}
#index-msg-content::after {
  content: "";
  clear: both;
  display: block;
}

#index-msg-text {
	max-width : 80%;
	padding : 10px;
	float : left;
}
#index-msg-text a{
	color : #fff;

}

#index-msg-close {
	width : 15%;
	float : right;
	text-align : right;
}

#index-msg-close a{
	color : #fff;
	text-decoration : none;
}
/* PRODUCTEUR FILTERS */
#producteur-filterslist li {
	margin : 10px 0px ;
}

.producteur-filterslist-separator {
	padding : 10px 0px 0px 0px;
	border-bottom : 1px solid #ccc;
	font-weight : bold;
}

#producteur-filterslist-searchbox {
	margin : 0px 0px 20px 0px;
}

#producteur-filterslist-searchbox label{
	font-size : 0.9em;
	font-style : italic;
	color : #777;
}

#producteur-filterslist-departementsSelect label {
	font-size : 0.9em;
	font-style : italic;
	color : #777;
}

ul#producteur-filterslist-categories {
	margin : 20px 0px 0px 0px;
}

#producteur-filterslist-categories label{
	margin : 0px 0px 0px 5px;
}


#index-content {
	/*background-color : #6fad1c;*/
	margin : 0px;
	padding : 0px;
}

/* MAP */


#map {
	width : 100%;
	margin : 0px;
	padding : 0px;
	


		
}

/* PROS */
.prodlist-askregistration{

	display : block;
	padding : 10px;
	background-color : #6fad1c;
	border-radius: 5px 5px;
	color : #fff;
	text-align : center;
	font-size : 1.1em;
	margin : 60px 0px 10px 0px;
}

.prodlist-askregistration a{

	color : #fff;
	font-weight : bold;
}

.pro-minibox {
	width : 100%;
	border : 1px solid #ccc;
	border-radius : 5px;
	padding : 5px 10px;
	margin : 10px 0px 0px 0px;
	border-radius : 5px;
}

a.pro-minibox-prolink {
	color : #000;
	
}

a.pro-minibox-prolink:hover {
	text-decoration : none;
	
}

.pro-minibox-profil {

	width : 100px;
	height : 100px;
	margin-right : 10px;
	float : left;
	border-radius : 3px;
}

.pro-minibox-content {
	
}

@media only screen and (min-width: 768px){


.pro-minibox {
	float: left;
	width : 47%;
}

.pro-minibox:nth-child(even) {
	margin-left : 20px;
}

}




.pro-minibox:hover {
	background-color : #eee;
	border-color : #aaa;
}








@media only screen and (min-width: 768px){

	#mapbox {

	}
	
	.map-border {
		/* Bordure de map */
		--b: 5px;   /* thickness of the border */
		--c: #ccc;   /* color of the border */
		--w: 100px;  /* width of border */

		border: var(--b) solid #0000; /* space for the border */
		--_g: #0000 90deg,var(--c) 0;
		--_p: var(--w) var(--w) border-box no-repeat;
		background:
			conic-gradient(from 90deg  at top    var(--b) left  var(--b),var(--_g)) 0    0    / var(--_p),
			conic-gradient(from 180deg at top    var(--b) right var(--b),var(--_g)) 100% 0    / var(--_p),
			conic-gradient(from 0deg   at bottom var(--b) left  var(--b),var(--_g)) 0    100% / var(--_p),
			conic-gradient(from -90deg at bottom var(--b) right var(--b),var(--_g)) 100% 100% / var(--_p);
	}


	.map-border:hover {
		/* Bordure de map */
		--b: 5px;   /* thickness of the border */
		--c: #aaa;   /* color of the border */
		--w: 100px;  /* width of border */

		border: var(--b) solid #0000; /* space for the border */
		--_g: #0000 90deg,var(--c) 0;
		--_p: var(--w) var(--w) border-box no-repeat;
		background:
			conic-gradient(from 90deg  at top    var(--b) left  var(--b),var(--_g)) 0    0    / var(--_p),
			conic-gradient(from 180deg at top    var(--b) right var(--b),var(--_g)) 100% 0    / var(--_p),
			conic-gradient(from 0deg   at bottom var(--b) left  var(--b),var(--_g)) 0    100% / var(--_p),
			conic-gradient(from -90deg at bottom var(--b) right var(--b),var(--_g)) 100% 100% / var(--_p);

	}

}

/*.activeArea:hover{
	background-color: red;
}*/
/*
#region-content {
	position : absolute;
	top : 55px;
	right : 0px;
	background: rgba(51, 170, 51, .90);
	min-height : 400px;
	max-height : 85%;
	overflow: auto;
	
}
a#region-content-close {
	position : relative;
	display : block;
	float : right;
	top : 0px;
	right : 0px;
	color : #333;
	font-weight : bold;
	font-size : 1.1em;
	text-decoration : none;
}
a#region-content-close:hover {
	color : #000;
}
*/



.hide-on-mobile-not-on-screen {
	display : none;
}

@media only screen and (min-width: 768px){

	.hide-on-mobile-not-on-screen {
		display : block;
	}



	#top-navigation {
		display : block;
	  	height : 55px;
	
	}
	
	#top-navigation a{
		font-size : 1em;
	}
	
	a#top-navigation-logolink {
		background : url(imgs/logo-hover.png) no-repeat 20px 6px;
	}	

	#top-navigation .menu-icon, #top-navigation .accountmenu-icon {
		display: none;
	}


	/* account icon */
	#top-navigation .accountmenu2-icon {
	  cursor: pointer;
	  display: inline-block;
	  float: right;
	  right : 40px;
	  padding: 28px 20px;
	  position: relative;
	  user-select: none;
	  color : #e1e1e1;
	  background : url(imgs/icons/account-32-grey.png) no-repeat center;
	}

	#top-navigation .accountmenu2-btn:checked ~ #top-navigation-burgerlist-account {
	  max-height: none;
	  overflow : visible;
	}



	ul#top-navigation-list {
		position : relative;
		right : 50px;
		float : right;
		overflow: visible;
		display: flex;
		align-items: center;
		justify-content: center;
		max-width : 600px;

	}
	
	ul#top-navigation-list li.top-navigation-list-item{
	diaply : inline-block;
	  width : auto;
	  height : auto;
	}

	#top-navigation a.top-navigation-list-item-link{
		display : block;
		padding : 20px 20px 18px 20px;
		background : none;
		text-indent: 0px;                 /* sends the text on-screen */
		color : #fff;
	}

	#top-navigation a.top-navigation-list-item-link:hover{
		background-color : #447009;
	}


	#top-navigation a#top-navigation-list-item-link-basket {
	  width : 55px;
	  background : url(imgs/icons/basket-32-grey.png) no-repeat center;
	  text-indent: -9999px;                 /* sends the text off-screen */
	  margin-left : 100px;
	}


	ul#top-navigation-burgerlist{
		width : auto;
		position : relative;
		float: right;
		top : 0px;
		right : 25px;
		display : block;
		max-height : 500px;
		clear : none;
		z-index : 0;
		overflow : visible;
	}
	
	
	ul#top-navigation-burgerlist li.top-navigation-burgerlist-toptriangle, ul#top-navigation-burgerlist li.top-navigation-burgerlist-topborder {
		display : none;
	}
	
	ul#top-navigation-burgerlist li{
		display : inline-block;
		width : auto;
	}

	#top-navigation-burgerlist a.top-navigation-burgerlist-item-link {
		padding : 20px 20px 19px 20px;
		font-size : 1em;
	}




	ul#top-navigation-burgerlist li.top-navigation-burgerlist-item:hover ul {
		position : absolute;
		display : block;
		height : auto;
		padding  : 0px;
		margin : 0px;
		background-color : #6fad1c;
		min-width : 55%;
		
	}
	
	ul#top-navigation-burgerlist li.top-navigation-burgerlist-item:hover ul li {
		padding : 0px;
		margin : 0px;
		clear : both;
		position : relative;
		display : block;
		background-color : #6fad1c;
	}
	

	ul#top-navigation-burgerlist li.top-navigation-burgerlist-item:hover ul li a{
		clear : both;
		display : block;
		padding  : 20px 20px;
		margin : 0px;
	 	 color : #fff;
	  	font-family : Exo;
		font-size : 1em;
		text-decoration : none;
	}
	
	ul#top-navigation-burgerlist li.top-navigation-burgerlist-item:hover ul li a:hover{
		background-color : #447009;
	}


}



/* PAGE */
/* pour PC */
@media only screen and (min-width: 768px) {

	.col-1 {width: 8.33%;}
	.col-2 {width: 16.66%;}
	.col-3 {width: 25%;}
	.col-4 {width: 33.33%;}
	.col-5 {width: 41.66%;}
	.col-6 {width: 50%;}
	.col-7 {width: 58.33%;}
	.col-8 {width: 66.66%;}
	.col-9 {width: 75%;}
	.col-10 {width: 83.33%;}
	.col-11 {width: 91.66%;}
	.col-12 {width: 100%;}

}

@media only screen and (max-width: 768px) {

}