:root {
    --couleur_0: #fff; /* blanc > fond, typo */
    --couleur_1: #319F49; /* vert bande 3 */
    --couleur_2: #4B494B; /* gris typo */
    --couleur_3: #D6E6BF; /* vert bande 1 */
    --couleur_4: #93C5BB; /* vert bande 2 */
    --couleur_4: #93C5BB; /* vert bande 2 */
    --couleur_6: #3e6365; /* vert foncé */
    --couleur_7: #ec6d47; /* vert foncé */
}
.cache {
	display:none;
}
.row .row {
    margin-left: 0rem;
    margin-right: 0rem;
}
body,
h1,
h2,
h3,
p,
.t_menu 
{
	font-family: 'Barlow Condensed', sans-serif;
}
.t_menu {
	padding-bottom: 10px;
	font-size:24px;
	border-bottom:1px solid	var(--couleur_1);
	margin-top: 30px;
	margin-bottom: 30px;
}
/* ------------- header -------- */
#header {
	padding:30px 0 20px 0;
	background:var(--couleur_6);
	margin-bottom:40px;
}
#header .logo {
	width: 500px;
}
/* ------------- menu-------- */
#menu {
	padding:30px 0 20px 0;
	background:var(--couleur_7);
	margin-bottom:40px;
}
#menu .B_menu {
	padding: 0px 10px;
	cursor: pointer;
}
#menu .B_menu span {
	padding: 10px;
	background:var(--couleur_4);
	color:var(--couleur_0);
	text-align:center;
	font-weight:bold;
	font-size: 24px;
	width: 100%;
	display: block;
}
#menu .B_menu span:hover {
	background:var(--couleur_1);
	color:var(--couleur_0);
}
/* ------------- cat-------- */
.cat {
	margin-bottom:40px;
}
.cat h2 {
	padding: 20px;
	color:var(--couleur_1);
	text-align:center;
	font-weight:bold;
	font-size: 36px;
}
/* ------------- footer -------- */
#footer {
	padding:30px 0 20px 0;
	background:var(--couleur_6);
	margin-bottom:40px;
}
#footer .logo {
	width: 300px;
}
/* ------------- outils -------- */
.l_outils {
	margin: 0;
	margin-bottom: 15px;
	background: var(--couleur_3);
	padding:0;
	width: 390px !important;
	height: 800px;
}
.outils .l_outils:nth-child(2),
.outils .l_outils:nth-child(5),
.outils .l_outils:nth-child(8) {
	margin-left: 15px;
	margin-right: 15px;
}
.l_outils img {
	width:100%;
}
.l_outils h3 {
	font-size: 30px;
	font-weight: 700;
	margin:10px 0 30px 10px;
	text-align: center;
	color: var(--couleur_1);
}
.z_outils .B_prec {
	width: 8%;
	margin: 50px 5% 0 2%;
	float:left;
	cursor:pointer;
}
.z_outils .B_outils {
	float:left;
	width: 70%;
	height:220px;
}
.z_outils .B_suite {
	width: 8%;
	margin: 50px 2% 0 5%;
	cursor:pointer;
	margin-left:5%;
	float:left;
}

.z_outils .infos {
	float:	left;
	margin: 30px 3% 0px 3%;
	width: 94%;
}
.z_outils .detail {
	float:	left;
	width:70%;
	height: 130px;
}
.z_outils .client {
	float:	left;
	width: 28%;
	margin-left: 2%;
}
.z_outils .domaine {
	float:	left;
	font-weight:500;
	font-size: 24px;
	margin-bottom: 10px;
	line-height: 24px;
	width: 100%;
	color: var(--couleur_1);
	height: 50px;
}
.z_outils .nom_projet {
	float:	left;
	font-weight:500;
	font-size: 21px;
	margin-bottom: 10px;
	line-height: 24px;
	width: 100%;
	color: var(--couleur_2);
}
.z_outils .prestation {
	float:left;
	text-align:	center;
	font-size: 20px;
	width: 90%;
	margin-left: 5%;
	line-height: 22px;
}
.z_outils .descriptif {
	float:left;
	text-align:	center;
	font-size: 17px;
	width: 90%;
	margin-left: 5%;
	line-height: 21px;
}
.demo {
	text-align:	center;
	margin-top:40px;
	float: left;
	width: 100%;
}
.demo a {
	background:var(--couleur_4);
	color:var(--couleur_0);
	padding: 10px 10px;
	font-size:18px;
	font-weight:bold;
	display: inline-block;
}
.demo a:hover{
	background:var(--couleur_1);
}
#cat_4 .l_outils {
	width: 290px !important;
	height: 870px;
}
#cat_4 .B_prec,
#cat_4 .B_suite {
	display:none !important;
}
#cat_2 .l_outils {
	height: 720px;
}
#cat_2 .B_outils {
	height:150px;
}
#cat_3 .l_outils {
	height: 850px;
}

#cat_4 .B_outils {
	width: 94%;
	height:220px;
	margin-left:3%;
}
#cat_4 .detail {
	float:	left;
	width:100%;
	height: 100px;
}
#cat_4 .client {
	width: 40%;
	margin-left: 0%;
	margin-bottom:20px
}
.client_1 {
	margin-bottom:10px;
}

@media only screen and (max-width: 800px) {
	.no_mob {
		display:none;
	}
}
@media only screen and (min-width: 800px) {
}