/*****************************************************
**** @"RESPONSIVE"
**** déclenche le responsive où il est chargé
******************************************************/





/*****************************************************
*** @GO RESPONSIVE !
*****************************************************/

@media only screen and (max-width:900px) {
	#parent, #nav, #header, .topLine {width: 100%;}
}

@media only screen and (max-width:700px) {
	html {-webkit-text-size-adjust: 100%;}
	#parent, #nav, #header, .topLine {width: 100%;}
	#nav {overflow: hidden;}
}





/*****************************************************
*** @HEADER
*****************************************************/

@media screen and (max-width: 900px) {
	#header {text-align: center;}
	#header .header_top {
		justify-content: center;
	}
	#header_services {height: initial; min-width: 100%;}
	.topLine {padding:5px;}
	.topLine > div {margin-bottom:5px;}
	.topLine > .line-break {display:none;}
	.headerSearch {margin: 10px 1em; width:100%;}
	.headerOptions {display:flex; margin:auto;}
	#nav {overflow:visible; height:initial;}
	#nav .line-break {display:none;}
	#nav #onglets {
		flex-wrap: wrap;
		justify-content: center;
		margin-bottom: 0;
	}
	#nav #onglets li {min-width: 20%; text-align: center;}
	#nav #onglets div[id*="menu"] {display:none;}
}





/*****************************************************
*** @FOOTER
*****************************************************/

@media screen and (max-width: 900px) {
	.block_footer {height: initial;}
	#footerInfos > div {margin: auto 1em;}
	#liens_footer {margin:10px auto;}
}
@media screen and (max-width: 700px) {
	.footer_services {flex-wrap:wrap; padding-bottom:0;}
	.footer_services > div {width:50%; text-align:center; margin-bottom:20px;}
	.blocks_footer {flex-wrap:wrap;}
	.block_footer, #footer > div:nth-child(3) {
		width: calc(100% - 2em);
		margin: 10px 1em;
	}
	.footer_share {margin: 20px auto;}
	#footerInfos > div {margin: auto 1em;}
	#liens_footer {margin:20px auto;}
	.flags {flex-wrap: wrap;}
	.flags a {margin:5px;}
}





/*****************************************************
*** @LISTING PRODUITS
*****************************************************/

@media screen and (max-width:900px) {
	.dis_content_img, .dis_content_img2 {
		width: calc(94% / 2);
	}
}

@media screen and (max-width:768px) {
	.dis_content_img, .dis_content_img2 {
		width: calc(94% / 2);
	}
}

@media screen and (max-width:660px) {
	.productsList {justify-content: center;}
	.dis_content_img, .dis_content_img2 {width: 80%;}
}