@charset "utf-8";

@font-face {font-family:"piron";src:url("../fonts/piron.eot?") format("eot"),url("../fonts/piron.woff") format("woff"),url("../fonts/piron.ttf") format("truetype"),url("../fonts/piron.svg#piron") format("svg");font-weight:normal;font-style:normal;}



html,body,div,span,applet,object,iframe,

h1,h2,h3,h4,h5,h6,p,blockquote,pre,

a,abbr,acronym,address,big,cite,code,

del,dfn,em,img,ins,kbd,q,s,samp,

small,strike,strong,sub,sup,tt,var,

b,u,i,center,

dl,dt,dd,ol,ul,li,

fieldset,form,label,legend,

table,caption,tbody,tfoot,thead,tr,th,td,

article,aside,canvas,details,figcaption,figure,

footer,header,hgroup,menu,nav,section,summary,

time,mark,audio,video{

    margin:0;

    padding:0;

    border:0;

    outline:0;

    font-size:100%;

    font:inherit;

    vertical-align:baseline;

}

/* HTML5 display-role vieux navigateur */

article,aside,details,figcaption,figure,

footer,header,hgroup,menu,nav,section{

    display:block;

}



ol,ul{

    list-style:none;

}

blockquote,q{

    quotes:none;

}

blockquote:before,blockquote:after,

q:before,q:after{

    content:’’;

    content:none;

}



body {

	margin: 0; /*auto;*/

	width: 100%;

	color: #000;

	font-family: 'piron', sans-serif;

	background-color: #FFF;

}





h1 {

	font-size: 30px;

	font-weight: 600;

	text-align:center;

	color: #000;

	flex: 1;

	margin-bottom: 12px;

}



h2 {

	font-size: 18px;

	font-weight: 600;

}



footer {

      text-align:center;

      padding:25px;

    }



/* Boites */

	.bbox {

	background: #eee;

	margin: auto;

	max-width: 768px;

	height: 100%; 

	padding: 1em 2em 1em 2em;

	}



	.box {

		background: #eee;

		margin-top: 25px;

		margin-left: 10px;

	}



	.centerbox {

		background: #eee;

		text-align:center;

	}



	.devisbox {

	width: 100%;

	margin: 0 auto;

	display: flex;

	flex-wrap: wrap;

	}



	.devisbox400 {

	width: 400px;

	margin: 0 auto;

	display: flex;

	flex-wrap: wrap;

	}



	.devisbox392 {

	width: 392px;

	margin: 0;

	display: flex;

	flex-wrap: wrap;

	}



	.devistouch4 {

	display: flex;

	flex-direction: column;	

	padding: 4px 15px;

	flex: 1 17%;

	box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.25);

	}



	.devistouch3 {

	display: flex;

	flex-direction: column;	

	padding: 4px 15px;

	flex: 1 28%;

	box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.25);

	}



	.devistouch2 {

	display: flex;

	flex-direction: column;	

	padding: 4px 15px;

	flex: 1 40%;

	box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.25);

	}





@media ( max-width: 768px ) {



		body {

		margin: 0; /*auto;*/

		width: 100%;

		color: #000;

		font-family: 'piron', sans-serif;

	}



	.devisbox {

	width: 100%;

	}



	.devisbox392 {

	width: 100%;

	}



	.devisbox400 {

	width: 100%;

	}

	.devistouch4 {

	padding: 4px 10px;

	flex: 1 46%;

	}



	.devistouch3 {

	padding: 4px 10px;

	flex: 1 90%;

	}



	.devistouch2 {

	padding: 4px 10px;

	flex: 1 90%;

	}



}