/**
 * Responsive
 *
 *
 */	
.hide-desktop{
	display:none;
}
.menu-resp{
	cursor:pointer;
	transform: rotate(90deg);
	display:none;
	font-size:1.5rem;
	font-family: arial;
	font-weight: normal;
}
/* ----------- iPad 1, 2, Mini and Air ----------- */

/* Portrait and Landscape */
@media only screen 
and (min-device-width: 768px) 
and (max-device-width: 1024px) 
and (-webkit-min-device-pixel-ratio: 1) {

}

/* Portrait */
@media only screen 
and (min-device-width: 768px) 
and (max-device-width: 1024px) 
and (orientation: portrait) 
and (-webkit-min-device-pixel-ratio: 1) {

}

/* Landscape */
@media only screen 
and (min-device-width: 768px) 
and (max-device-width: 1024px) 
and (orientation: landscape) 
and (-webkit-min-device-pixel-ratio: 1) {

}

/* ----------- iPad 3, 4 and Pro 9.7" ----------- */

/* Portrait and Landscape */
@media only screen 
and (min-device-width: 768px) 
and (max-device-width: 1024px) 
and (-webkit-min-device-pixel-ratio: 2) {
	.col-30, .col-70{
		width: 100%;
	}
	.col-70{
		padding: 0;
	}
	header{
		height: auto !important;
		flex-wrap: wrap;
		text-align: center;
	}
	.tools{
		flex-wrap: wrap;
		padding: 0;
	}
	 .tools div:first-child{
	 	margin: 5px 0;
	 }
	.tools div:first-child select{
		margin: 0 10px 0 5px;
	}
	.tools div:nth-child(2n+0){
		margin: 0 auto;
	}
}

/* Portrait */
@media only screen 
and (min-device-width: 768px) 
and (max-device-width: 1024px) 
and (orientation: portrait) 
and (-webkit-min-device-pixel-ratio: 2) {
	body > header > * {
		padding: 0 25px;
	}
	h1{
		font-size: 25px;
	}
	body > section > div{
		flex-wrap: wrap;
	}
	div.col-50{
		width: 100%;
	}
}

/* Landscape */
@media only screen 
and (min-device-width: 768px) 
and (max-device-width: 1024px) 
and (orientation: landscape) 
and (-webkit-min-device-pixel-ratio: 2) {
	body > header > * {
		padding: 0 25px;
	}
	h1{
		font-size: 25px;
	}
	body > section > div{
		flex-wrap: wrap;
	}
	div.col-50{
		width: 100%;
	}
	table tbody tr td{
		padding: 0 5px;
	}
	.tools div:first-child a:last-child, .tools div:first-child span{
		font-size: 0;
	}
	.tools div:first-child a:last-child:before, .tools div:first-child span:before{
		font-size: 20px;
	}
}

/* ----------- iPad Pro 10.5" ----------- */

/* Portrait and Landscape */
@media only screen 
and (min-device-width: 834px) 
and (max-device-width: 1112px)
and (-webkit-min-device-pixel-ratio: 2) {

}

/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
and (min-device-width: 834px) 
and (max-device-width: 834px) 
and (orientation: portrait) 
and (-webkit-min-device-pixel-ratio: 2) {

}

/* Landscape */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
and (min-device-width: 1112px) 
and (max-device-width: 1112px) 
and (orientation: landscape) 
and (-webkit-min-device-pixel-ratio: 2) {

}

/* ----------- iPad Pro 12.9" ----------- */

/* Portrait and Landscape */
@media only screen 
and (min-device-width: 1024px) 
and (max-device-width: 1366px)
and (-webkit-min-device-pixel-ratio: 2) {
	.col-30{
		width: 40%;
	}
	.col-70{
		width: 54%;
	}
	table{
		font-size: 12px;
	}
	body{
		
	}
	header .col-30{
		width: 15%;
		font-size: 15px;
	}
	h1{
		font-size: 25px;
	}
	table tbody tr td{
		padding: 0 5px;
	}
}

/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
and (min-device-width: 1024px) 
and (max-device-width: 1024px) 
and (orientation: portrait) 
and (-webkit-min-device-pixel-ratio: 2) {
	.tools div:first-child a:last-child{
		font-size: 0;
	}
	.tools div:first-child a:last-child:before{
		font-size: 15px;
	}
}

/* Landscape */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
and (min-device-width: 1366px) 
and (max-device-width: 1366px) 
and (orientation: landscape) 
and (-webkit-min-device-pixel-ratio: 2) {

}



/* ----------- Responsive ----------- */

@media only screen and (max-device-width: 1880px) {
	form.filter label{
		display:none;
	}
	
	.flex  > .col-50.graph{
		width:100%;
	}
}
/* Portrait and Landscape */
@media only screen  and (max-device-width: 1024px) {
	.tools div:first-child a:last-child{
		font-size: 0;
	}
	.tools div:first-child a:last-child:before{
		font-size: 25px;
	}
}
/* Portrait and Landscape */
@media only screen  and (max-device-width: 500px) {
	.hide-desktop{
		display:inline-block;
	}
	body > header > *{
		padding:0 10px;
	}
	body > header > img{
		max-width:150px;
	}
	body > header > h1{
		display:none;
	}
	
	.menu-resp{
		display:inline-block;
	}
	body > nav{
		display:none;
		position:fixed;
		top:81px;
		z-index:2;
	}
	body > section{
		width:100%;
	}
	body > section > header{
		height:auto;
		flex-wrap: wrap;
		align-content: center;
	}
	body > section > div {
		flex-wrap: wrap;
	}
	body > section > header > div.col-50{
		padding: 0;
		align-items: center;
		display: flex;
		justify-content: center;
	}
	body > section > div > div.col-50{
		width: 100%;
		justify-content: center;
		padding: 5px;
	}
	.col-30{
		width:100%;
	}
	.col-70{
		width:100%;
		padding:0;
		/* background: white; */
		/* position: absolute; */
		height: auto;
	}
	.col-salle{
		display:none;
	}
	.col-100{
		padding:0;
	}
	
	/** Tools	**/
	.tools{
		position:relative
	}
	.tools > div+div{
		position: absolute;
		top: -32px;
		right: 0;
	}
	.tools div>form, 
	.tools div:first-child{
		flex-wrap: wrap;
		/* display:none; */
		/* position:absolute; */
		/* background:#E5E5E5; */
		/* z-index:3; */
		/* top:40px; */
		padding:10px;
		width: 100%;
		justify-content: space-around
		/* left: -130px; */
	}
	.tools div > form > *{
		/* padding:0; */
	}
	.tools div:first-child a.select-date{
		width:8%;
		margin:5px;
	}
	.tools input[name="current_date"]{
		width:58%
	}
	.tools div:first-child span,
	.tools div:first-child select{
		margin:5px;
	}
	.tools div:first-child a:last-child {
		/*position: absolute;
		top: -37px;
		z-index: 3;
		left: 50%;*/
	}
	
	
	/**	Popup	**/
	.popup {
		position: fixed;
		width: calc(100% - 10px);
		left: 0;
		top: -500px;
		background: #dbdbdb;
		padding: 40px 5px;
	}
	

	  .tooltip{
		padding: 0 5px;
	  }
}
