/**
 * @file
 * Layout Styling (DIV Positioning)
 *
 * Define CSS classes to create a table-free, 3-column, 2-column, or single
 * column layout depending on whether blocks are enabled in the left or right
 * columns.
 *
 * This layout is based on the Zen Columns layout method.
 *   http://drupal.org/node/201428
 *
 * Only CSS that affects the layout (positioning) of major elements should be
 * listed here.  Such as:
 *   display, position, float, clear, width, height, min-width, min-height
 *   margin, border, padding, overflow
 */


/*
 * Body
 */
 
 *{box-sizing:border-box}
body {
}

@media (min-width:1030px) {
	#page-wrapper,
	.region-bottom {
	  /*
	   * If you want to make the page a fixed width and centered in the viewport,
	   * this is the standards-compliant way to do that. See also the ie6.css file
	   * for the necessary IE5/IE6quirks hack to center a div.
	   */
	  margin-left: auto;
	  margin-right: auto;
	  //width: 1030px;
	}
}


#page-wrapper, .region-bottom {
	  margin-left: auto;
	  margin-right: auto;
	  max-width: 1400px;
	}



/*
 * Header
 */
#header {
	display:none;
}

@media (min-width:800px) and (min-device-width : 800px){
	#header {
		display:block;
		position:relative;
	}
}



.region-header .block-title {
	display:none;
}

/*
 * Main (container for everything else)
 */
#main-wrapper {
  top: -20px;
  position: relative;
} 

@media (min-width:800px) and (min-device-width : 800px){
	#main-wrapper {
		top: 0px;
	}
}

#main {
 display:flex;
}


/*
 * Content
 */
 /* MODIF JCM RESPONSIVE */
#content,
.no-sidebars #content {
  margin-left: 10px;
  margin-right: 10px;
  padding: 0;
  margin-left:auto;
  margin-right:auto;
}

@media (min-width:1030px) {
	#content,
	.no-sidebars #content {
flex:1;
	  max-width: 1400px;
	  margin-left: 0;
	  padding: 0; 
	}
}

 /* END MODIF JCM RESPONSIVE */
/* MODIFS JCM RESPONSIVE */
.sidebar-first #content {
	margin-right: 10px;
	margin-left: 10px;
}

 @media (min-width:1030px) {
	.sidebar-first #content {
	  width:66%;
	  /* LTR */ /* The width of .region-sidebar-first. */
	  /* LTR */ /* Negative value of #content's width + left margin. */
	}
}

/* MODIFS JCM RESPONSIVE */
.sidebar-second #content {
	margin-right: 10px;
	margin-left: 10px;
}

@media (min-width:1030px) {
	.sidebar-second #content {
		 width: 656px;
		 margin-right: -1000px;
		 margin-left: 0; 
	}
}
/* END MODIFS JCM */

.two-sidebars #content {
  width: 560px;
  margin-left: 200px; /* LTR */ /* The width of .region-sidebar-first */
  margin-right: -760px; /* LTR */ /* Negative value of #content's width + left margin. */
}

#content .section {
  margin: 0;
  padding: 0;
}

/*
 * Navigation
 */
#navigation {
	display:none;
}

@media (min-width:800px) and (min-device-width : 800px){
	#navigation {
	  display:block;
	  float: left; /* LTR */
	  width: 100%;
	  /* margin-left: 15;  LTR */
	  margin-right: -100%; /* LTR */ /* Negative value of #navigation's width + left margin. */
	  padding: 0; /* DO NOT CHANGE. Add padding or margin to #navigation .section. */
	  height: 50px; /* The navigation can have any arbritrary height. We picked one
						that is the line-height plus 1em: 1.3 + 1 = 2.3
						Set this to the same value as the margin-top below. */
	  position:absolute;
	  top:-65px;
	  left:18px;
	}
}

@media (min-width:1030px) {
	#navigation {
	  margin-left: 0; /* LTR */
	  position:relative;
	  left:0px;
      top:0px;
	}
}

.with-navigation #content,
.with-navigation .region-sidebar-first,
.with-navigation .region-sidebar-second {
  margin-top: 20px; /* Set this to the same value as the navigation height above. */
}

@media (min-width:800px) {
	.with-navigation #content,
	.with-navigation .region-sidebar-first,
	.with-navigation .region-sidebar-second {
	  margin-top: 20px; /* Set this to the same value as the navigation height above. */
	}
}

#navigation .section {
}

/*
 * First sidebar
 */
 .region-sidebar-first {
	  /* LTR */ /* Negative value of .region-sidebar-second's width + left margin. */
	  padding: 0; /* DO NOT CHANGE. Add padding or margin to .region-sidebar-second .section. */
	}
 @media (min-width:1030px) {
	.region-sidebar-first {
	 margin-top:65px!important;
	  width: 350px;
	  padding: 0; /* DO NOT CHANGE. Add padding or margin to .region-sidebar-first .section. */
	}
}

.region-sidebar-first .section {
  margin: 0 20px 0 0; /* LTR */
  padding: 0;
}

/*
 * Second sidebar
 */
 .region-sidebar-second {
	  width: 90%;
	  margin-left: 5%; /* LTR */ /* Width of content + sidebar-first. */
	  margin-right: 5%; /* LTR */ /* Negative value of .region-sidebar-second's width + left margin. */
	  padding: 0; /* DO NOT CHANGE. Add padding or margin to .region-sidebar-second .section. */
	}

 @media (min-width:1030px) {
	.region-sidebar-second {
	  
	  width: 344px;
	 
	  padding: 0;
	}
}

.region-sidebar-second .section {
  margin: 0 0 0 20px; /* LTR */
  padding: 0;
}

/*
 * Footer
 */
.region-footer {
}

/*
 * Page bottom
 */
.region-bottom /* See also the #page-wrapper declaration above that this div shares. */ {
}

/*
 * Prevent overflowing content
 */
#header,
#content,
#navigation,
.region-sidebar-first,
.region-sidebar-second,
.region-footer,
.region-bottom {
  overflow: visible;
  word-wrap: break-word; /* A very nice CSS3 property */
}

/*
 * If a div.clearfix doesn't have any content after it and its bottom edge
 * touches the bottom of the viewport, Firefox and Safari will mistakenly
 * place several pixels worth of space between the bottom of the div and the
 * bottom of the viewport. Uncomment this CSS property to fix this.
 * Note: with some over-large content, this property might cause scrollbars
 * to appear on the #page-wrapper div.
 */
/*
#page-wrapper {
  overflow-y: hidden;
}
*/

#block-block-2 {display:none;}

#block-block-1000012,
#block-block-1000012 * {
max-width:100%!important;
}
#block-views-blocs-en-une-equipements {
	display:none;
}
#block-views-f1be0dda8dfd0ffce13a76cbdd07eee0 {display:none;}

@media all and (max-width:800px) {
	#block-block-1000012 {
		display:none;
	}
	#block-views-f1be0dda8dfd0ffce13a76cbdd07eee0 {
		display:block;
	}
}
.slider-responsive {
	position:relative;
}
.slider-responsive .views-slideshow-cycle-main-frame img {
	width:100%!important;
	height:auto!important;
}

.slider-responsive .views-slideshow-controls-bottom {
	position:absolute;
	z-index:30;
	bottom:15%;
	width:100%;
}
.vscc_controls_pause {display:none;}
#block-views-web-tv-queue-block-2 {display:none;}

.slider-responsive .vscc-controls {
	display:flex;
	justify-content : space-between;
	width:100%;
	padding:10px;
}

.slider-responsive .vscc-controls .vscc_controls_previous a,
.slider-responsive .vscc-controls .vscc_controls_next a {
	font-size:0px;
	color:white;
	text-decoration:none;
}

.slider-responsive .vscc-controls .vscc_controls_previous a:after,
.slider-responsive .vscc-controls .vscc_controls_next a:after {
	display:block;
	padding:10px 10px;
	background:rgba(0,0,0,0.3);
	font-size:40px;
	line-height:30px;
}

.slider-responsive .vscc-controls .vscc_controls_previous a:after {
	content:"<";
	
}

.slider-responsive .vscc-controls .vscc_controls_next a:after {
	content:">";
}


@media all and (max-width:800px) {
	body {margin-top:50px!important}
	#main {display:block;}
	.region-sidebar-first,
	#content {
		width:100%;
	
	}
	
}


body.page-widgets #content .region-content .content {
	display:flex;
}

body.page-widgets #content .region-content .content > a {display:none;}

body.page-widgets #content .widget_column {
	float:none;
	float:1;
	width:50%;
	padding:20px;
}
.webform-progressbar {
	margin:45px auto;
}
@media all and (max-width:800px) {
	.webform-progressbar {
		display:none!important;
	}
}
.webform-progressbar-outer {
    position: relative;
    border: 0px;
    width: 100%;
    height: 5px;
    margin: 0.35em -1px 2em;
    background-color: #EEE;
}

.webform-progressbar-inner {
    height: 1em;
    background-color: #6B8E23;
    height: 5px;
}

.webform-progressbar-page {
	position: absolute;
    width: 20px;
    height: 20px;
    margin: -12px -4px;
    border: 1px solid #6B8E23;
    background-color: white;
    border-radius: 50%;
}
.webform-progressbar-page .webform-progressbar-page-label {
	top:20px;
}

.webform-progressbar-page.current,
.webform-progressbar-page.completed {
	background-color:#6B8E23;
}


.form-actions input.webform-next,
.form-actions input.webform-submit {
	background:#6B8E23;
	color:white;
	cursor:pointer;
	padding:10px 20px;
	border:0px;
	border-radius:30px;
	font-weight:bold;
	font-size:20px;
	transform:scale(1);
	transition:all 0.2s ease;
	
}

.form-actions input.webform-submit:hover {
	transform:scale(1.05);
}

.form-actions input.webform-next {
		border-radius:0px 30px 30px 0px;
}
.form-actions {
text-align:center;
}
.form-actions input.webform-previous {
	background:#EEE;
	color:black;
	cursor:pointer;
	padding:10px 20px;
	border:0px;
	border-radius:30px 0px 0px 30px;
}

.webform-component .form-type-radio {
margin:10px 0px!important;
}

.webform-component input {
	max-width:100%;
	padding:6px 10px;
}

.form-item.webform-component {
	max-width:600px;
margin:auto;
}


@media all and (max-width:800px) {
	body.page-widgets #content .region-content .content {
	display:block;
}
	body.page-widgets #content .widget_column {
		width:100%;
		padding:10px;
	}
	
	body.page-widgets #content .widget_column .nodePreview .vignette {
		float:none;
	}
	body.page-widgets #content .widget_column .nodePreview .resume {
		margin-left:0px;
	}
	body.page-widgets #content .widget_column .portlet {
		margin-bottom:20px;
	}
}

/* .field-name-field-cacher-la-sidebar .field-items {
	display: none!important;
  } */


/* page dechets new*/
.section-dechets-test .region.region-sidebar-first.column.sidebar {
display: none;
}
.section-dechets .region.region-sidebar-first.column.sidebar {
	display: none;
	}

.view-liste-categories-dechets .view-content {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	align-content: stretch;
	gap: 40px;
	justify-content: center;
	margin-bottom: 70px;
}

.view-liste-categories-dechets .view-content .views-row {
	width:250px;
	height:250px;
	
	overflow:hidden;
	position:relative;
}



.view-liste-categories-dechets .view-content .views-row .views-field-title {
	display:inline-block;
	text-transform:uppercase;
	font-weight:bold;
	font-size:20px;
	text-align:center;
	margin:0px;
	background-image: linear-gradient(transparent, transparent);
	background-size: 0 100%;
	background-repeat: no-repeat;
	position:absolute;
	z-index:2;
	bottom:10px;
	left:50%;
	width:100%;
	padding:0px 10px;
	transform:translateX(-50%);
	transition:all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.view-liste-categories-dechets .view-content .views-row .views-field-field-vignette img {
	width:190px;
	height:auto;
	position:absolute;
	top:20px;
	right:50%;
	z-index:2;
	transform : translateX(50%);
	transition:all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.view-liste-categories-dechets .view-content .views-row .rond {
	width:170px;
	height:170px;
	border-radius:50%;
	background:#FEF3E9;
	position:absolute;
	z-index:1;
	bottom:-140px;
	left:50%;
	transform : translateX(-50%);
	transition:all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.view-liste-categories-dechets .view-content .views-field-view-node a {
display:none; /*commenter pour faire disparaitre en dev*/
position:absolute;
z-index:2;
display:block;
width:100%;
height:100%;
top:0px;
left:0px;
font-size:0px;
}

/* animations */
.view-liste-categories-dechets .view-content .views-row:hover .views-field-field-vignette img {
	right: 30%;
	top: 60px;
	width: 130px;
	height: auto;
}

.view-liste-categories-dechets .view-content .views-row:hover  .views-field-title {
	bottom:40px;
	left:40%;
	background-size: 100% 100%;
	color: white;
	padding: 3%;
	width: 82%;
}
.view-liste-categories-dechets .view-content .views-row.nid-1016630:hover  .views-field-title {
	background-image: linear-gradient(#009FE3, #009FE3);
}
.view-liste-categories-dechets .view-content .views-row.nid-1016628:hover  .views-field-title {
	background-image: linear-gradient(#fbb900, #fbb900);
}
.view-liste-categories-dechets .view-content .views-row.nid-1015806:hover  .views-field-title {
	background-image: linear-gradient(#76b729, #76b729);
}
.view-liste-categories-dechets .view-content .views-row.nid-1016629:hover  .views-field-title {
	background-image: linear-gradient(#f07d00, #f07d00);
}
.view-liste-categories-dechets .view-content .views-row.nid-1015805:hover  .views-field-title {
	background-image: linear-gradient(#999696, #999696);
}
.view-liste-categories-dechets .view-content .views-row.nid-1016631:hover  .views-field-title, .view-liste-categories-dechets .view-content .views-row.nid-1016610:hover  .views-field-title, .view-liste-categories-dechets .view-content .views-row.nid-1015804:hover  .views-field-title {
	background-image: linear-gradient(#6c3e91, #6c3e91);
}
.view-liste-categories-dechets .view-content .views-row.nid-1014203:hover  .views-field-title, .view-liste-categories-dechets .view-content .views-row.nid-1016632:hover  .views-field-title, .view-liste-categories-dechets .view-content .views-row.nid-1016633:hover  .views-field-title, .view-liste-categories-dechets .view-content .views-row.nid-1016634:hover  .views-field-title {
	background-image: linear-gradient(#19b3aa, #19b3aa);
}
.view-liste-categories-dechets .view-content .views-row:hover .rond {
	bottom:20px;
	width: 200px;
	height: 200px;
	left: 57%;
}

/* Couleurs */

/*verre*/
.view-liste-categories-dechets .view-content .views-row.nid-1015806 .rond {
	background:#F2F8EA;
}
/*textile*/
.view-liste-categories-dechets .view-content .views-row.nid-1016630 .rond {
	background:#E6F6FD;
}
/*biodechets*/
.view-liste-categories-dechets .view-content .views-row.nid-1016629 .rond {
	background:#FDF2E6;
}
/*ordures menagères*/
.view-liste-categories-dechets .view-content .views-row.nid-1015805 .rond {
	background:#F0EFEF;
}
/*decheteries*/
.view-liste-categories-dechets .view-content .views-row.nid-1016631 .rond {
	background:#F1ECF4;
}
/*encombrants*/
.view-liste-categories-dechets .view-content .views-row.nid-1015804 .rond, .view-liste-categories-dechets .view-content .views-row.nid-1016610 .rond {
	background:#DFD7EC;
}
/*collecte, faites gestes, demarches en ligne, site de traitement*/
.view-liste-categories-dechets .view-content .views-row.nid-1014203 .rond, .view-liste-categories-dechets .view-content .views-row.nid-1016632 .rond, .view-liste-categories-dechets .view-content .views-row.nid-1016633 .rond, .view-liste-categories-dechets .view-content .views-row.nid-1016634 .rond {
	background:#daedea;
}

.sidebar-first #content {
	margin-right: 0;
	margin-left: 0;
}

.node-webform.view-mode-node_embed h2.node-title {display:none;}

#block-custom-3m-imports-velos-bloc-donnees-velo {
	width:100%!important;
	padding:0px!important
}

.tableau-donnes-velo {
	display:flex;
	flex-direction: column-reverse;
}


.tableau-donnes-velo .donnee {
	display:flex;
	padding:5px 0px;
	align-items:center;
}

@media all and (max-width:800px) {
	
.tableau-donnes-velo .donnee  {
	display:block;
}
}

.tableau-donnes-velo .donnee .mois {
	width:160px;
}
.tableau-donnes-velo .donnee .nbjourcontainer {
	background:none;

	overflow:hidden;
	flex:1;
	
}

.nbjourcontainer .graph-data {
	padding-left:25px!important;
	margin-bottom:0px!important;
	border-radius:30px;
}