@media(max-width : 800px){
	body{
		font-size:14px;
	}
	
	h1{
		font-size:5vmin;
	}
	h2{
		font-size: 4.5vmin;
	}
	h3{
		font-size: 4vmin;
	}
	h4{
		font-size: 3.5vmin;
		padding-top :0 !important;
	}
	h5{
		font-size: 3.2vmin;
    }
	h6{
		font-size: 2.5vmin ;
	}
	
	h1, h2, h3, h4, h5, h6 {
		padding-bottom: 0 !important;
	}
	.center{
		text-align : center !important;
	}
	i{
		font-style:italic !important;
	}
	
	
	#bloc .content-wrap {
		padding:1em;
		padding-top: 1vw !important;
		padding-bottom: 1vw !important;
	}
	
	#bloc .content-wrap br {
		display :none !important;
	}

	#bloc {
		background-color : transparent !important;
		color : #000;
	}
	
	#bloc .content-text h5{
		padding-top: 0 !important;
		color: #2ac5ba !important;
		font-weight : normal !important;
		line-height: 1.2em;
	}
	#slogan h6,
	#slogan h5{
		color:white !important;
		font-weight: normal;
		padding-top: 1.5vw !important;
	}
	
	#slogan .titre-slogan{
		font-size : 5.5vw;
		padding-top: 5vw;
		line-height: 1.2em;
		padding-right: 2vw;
		padding-left: 2vw;
	}
	#slogan {
		font-weight: bold;
		color: white;
		height: 56vw;
		/* margin-bottom: 4vw; */
	}
	
	#section-dev
	
	.apropos #slogan{
		margin-bottom: 3vw !important;
	}
	
	#info img {
		width: 88%;
	}
	
	.grid {
		display: grid;
		grid-template-columns: 1fr;
	}
	
	#bloc br{
		display : none !important;
	}
	
	

	/*----------head---------------------*/
	#head{
		height:auto;
		color:#000;
	}

	#bg-image {
		position: absolute;
		background-color: #9E9E9E;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		width: 100%;
		height: 66vw;
		max-height: 528px;
		min-height: 224px;
		z-index: -1;
	}

	#bg-color {
		position:absolute;
		background-color : #9E9E9E;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		width: 100%;
		/*height: 200px;*/
		z-index:-1;
	} 

	#head #menu{
		display:grid;
		grid-template-columns:1fr;
	}
	#head #menu ul{
		list-style: none;
		display:flex;
		justify-content:space-around;
	}



	#head #en-tete{
		display:none;
	}
	#head h1 {
		padding-top : 100px;
		padding-bottom :0;
	}
	
	.m-principal{
		display:none;
	}
	
	#logo-manao{
		height: 10vw;
		width: 20vw;
		float : left;
		padding-top: 10px;
		padding-left: 10px;
		background-color: transparent;
	}
	
	/* ---------- logiciel -------------*/
	#gestion,
	#rh,
	#vente,
	#service {
		padding-bottom : 1em 1em 1em;
	}



	#gestion .btn{
		background : #FFD52D;
	}

	#rh .btn{
		background : #1976D2;
	}

	#vente .btn{
		background : #317C41;
	}

	#service .btn{
		background : #FF5200;
	}

	#bloc h5{
		color:#000;
	}

	#bloc .content-text, 
	#gestion p,
	#rh p,
	#vente p,
	#service p{
		font-size: 12px;
	}
	
	#gestion .card .card-text,
	#rh .card .card-text,
	#vente .card .card-text,
	#service .card .card-text{
		min-height: 60px;
	}

	#gestion .card .card-logo,
	#rh .card .card-logo,
	#vente .card .card-logo,
	#service .card .card-logo{
		min-height: 100px;
	}
	#bloc .content-title{
		font-size: 20px;
		padding:1vw !important;
		font-weight: bold;
	}
	#bloc .content-text{
		color: #2ac5ba !important;
	}
	
	#bloc .content-text, 
	#gestion p,
	#rh p,
	#vente p,
	#service p{
		font-size: 14px;
	}

	
	#bloc-confiance{
		display:none;
	}
	
	.card .card-text {
		color: #333;
	}

	/*---------footer---------*/
	#mobile-footer,
	#mobile-footer h4{
		display:block;
		background-color: #393E46;
		color:white !important;
		font-size: 1em;
	}
	
	#web-footer{
		display:none;
	}







#head .btn{
		display:inline-block;
		background : #F38181;
		border:none;
		color:white;
		padding:10px 15px;
		text-decoration: none;
		font-size: 10px;
		width : 50%;
	}
#head #bouton-log{
	display:none;
}

#bout-log li{
		width : 100%;
		background: transparent;
		text-align: center;
	}

#head .col-mobile{
		padding-top: 20px;
		background: transparent;
		text-align: right;
	}

#head .col-mobile .btn{
	width:100%;
}

#bout-log ul{
		list-style: none;
		grid-column : 2/span 3;
	}

 #bouton-log-mobile{
	width:10%;
}

#section-droite #reseaux-sociaux{
	display:none;
}

#actu,
#fiche{
		display:none;
	}

.bars-nouvelle{
	text-align: right;
	color : #9E9E9E;
	font-size: 7vw ;
	margin-right: 0 ;
	padding-right: 0 ;
}

#menu-mobile-nouvelle{
	display :grid;
	/*margin-bottom:10px;*/
}

#menu-mobile-nouvelle a{
	color : #9E9E9E;
}

#menu-mobile-nouvelle ul{
	list-style: none;
	display:flex;
	justify-content:space-around;
}
#menu-mobile-nouvelle li{
	display:flex;
	font-size: 4vw;
	font-weight: bold;
	color : #9E9E9E;
	text-align: center;
}



#image-actu-slide{
	display:none;
}


#slogan-nouvelle{
	font-weight: bold;
	font-size: 5vw;
	padding-bottom: 3vw;
}

#bouton-abonnement .btn{
	width:30%;
}


	.showcase .image{
		width:50%;
		min-width:50px;
		min-height: 50px;
	}

	
	.showcase .contenu{
		width:100%;
		min-width: 50px;
		text-align: left;
		max-height: 20vw;
		overflow: hidden;
		font-size: 2.5vw;
		line-height: 1em;
	}

	.showcase .image img,
	.top-box-a .section-bas .image img{
		width:90%;
		height:100%;
	}

	#btn-ancien{
		background :#0DEADA;
		width : 100px;
		font-size: 70%;
		font-weight: bold;
		margin-top: 50px;
		margin-bottom: 50px;
	}
	.titre-actu{
		font-weight: bold;
	}
	.showcase ul li{
		display:flex;
	}

	.wrapper{
		margin-top:5px;
	}

	.showcase ul li .btn{
		width:100px;
		text-align: center;
		background:#317C41; 
	}

	.section-haut{
		display:none;	
	}

	.contenu p{
		padding:3px;
	}

	.wrapper{
		padding:10px;
	}

	
	#image-actu-slide .SlideImage img,
	#image-actu img{
		padding-top: 5px;
		width:80%;
	}

	.showcase{
		padding-left: 2vw;
		padding-right: 2vw;

	}

	#section-abonnement #bouton-abonnement #retour{
		display:none;
	}

	#actu #contenu-actu .SlideContenu{
		text-align: left;
		padding-left:10px;
		padding-right:10px;
		font-size: 3vw;
	}

	.col-bars{
		display:block;
		text-align:right;
		margin-top: 3vw;
	}

	#slogan-info{
		font-weight: bold ;
		color : white ;
		font-size : 3.8vw ;
		text-align: center ;
		line-height: 1.2em;
		padding-right: 10vw ;
	    padding-left: 10vw ;
	}
	
	#info {
		font-size: 3.05vmin;
		line-height: 1.1em;
		font-weight: 300 !important;
		color: white;
	}
	
	#menu-responsive{
		list-style: none;
		display:grid;
		grid-template-columns:1fr;
		padding-top: 20px;

	}
	#menu-responsive ul{
		list-style: none;
		background:transparent;
		display:flex;
		justify-content:space-around;
	}
	#menu-responsive li{
		background:transparent;
		font-size:3vw;
	}


	.liens{
		/*font-size : 8px;*/
		color:white;
		font-weight: bold;
		padding-top: 0px ;
	}

	.liens-actu{
		font-weight: bold;
		padding-top: 0px ;
	}

	.menu-hr{
		background-color: transparent;
		border : none;
		width : 5px;
		height : 5px;
		border-radius : 5px;
	}

	.bars-log{
		color : #ccc;
		font-size: 7vw ;
		margin-top:1vw;
		margin-right: 0px ;
		padding-right: 0px ;
	}
	#actu{
		text-align: right;
	}
	#actu .btn{
		background-color: #9E9E9E;
		width:10%;
		height:10px;
	}

	.hr-active{
		background-color: #0DEADA;
	}

	.item-active{
		color : #0DEADA;
	}

	.item-active-actu{
		color : #0DEADA !important;
	}

	#haut{
		display:grid;
		grid-template-columns:1fr;
	}
	#haut ul{
		list-style: none;
		display:flex;
		justify-content:space-around;
	}
	#haut li{
		width:20%;
	}

	.mySlides{
		width:100% ;
	}
	
	#fiche{
		margin-top:-40px;
	}

	.section-bas{
		display:grid;
		grid-template-columns:1fr;
	}

	.section-bas ul li{
		list-style: none;
		display:flex;
		justify-content:space-around;
	}

	#hr-bleu{
	 width:50%;
	 height:2px;
	 background-color:#53bae9;
	 border:none ;
	 margin-top: 10px ;
}


	.titre-info{
		padding: 0px ;
		color : #000000 ;
		font-size: 18px;
		text-align: left;
		padding-left:20px; 
	}

	.nom {
		color: #0DEADA;
		text-align: center;
		font-weight: bold;
		padding-bottom: 0px;
		padding-top: 0px;
	}
	.titre-fonction {
		text-align: center;
		padding-bottom: 5px;
		padding-top: 0px !important;
	}

	.valeur-titre{
		font-weight: bold;
		text-align: center;
	}
	#equipe{
		padding-top:14vw !important;
	}
	#equipe,
	#valeur,
	#section-c,
	#section-d{
		display:grid;
		grid-template-columns :1fr;
		text-align: left;
		padding-left:3%;
		padding-right:3%;
		
	}

		

		#section-dev li ul li ul,
		#section-dev,
		#section-dev ul{
			list-style: none;
			display:grid;
			grid-template-columns:1fr;
			padding-top: 0px;
			padding-bottom: 0px;

		}

		#section-dev li ul{
			list-style: none;
			background:transparent;
			display:flex;
			justify-content:space-around;
		}

		#section-dev li ul li{
		width:100%;
		padding:10px;
		text-align: left;
		background:transparent;
	}
	#section-dev li {
		margin-bottom: 0px;
		padding-top: 3vw;
		padding-bottom: 3vw;
		padding-left: 2vw;
		padding-right: 2vw;
	}
		


		

		#section-dev .images{
			display:none;
		}

		#section-dev{
			font-size: 14px;
			color : #000000;
		}

		#section-dev button{	
			background-color : #FA8072;
			border:none;
			width:100%;
			height:30px;
			font-size: 100%;
			font-weight: bold;
			color:#fff;
		}

		#section-dev li ul li ul{
			padding-left:10vw;
		}
		#section-dev li ul li ul li{
			list-style: disc;
		}

		.titre-dev{
			color:white;
			font-size: 15px;
			font-weight: bold;
		}
		
		/* fiches logiciels */
		#fonctionnalite{
			display : grid ;
			grid-template-columns: 1fr;
		}
		#fonctionnalite div {
			padding-left: 1vw;
			padding-right: 1vw;
			text-align: justify;
		}
		
	#slidefiches{
		padding-top : 20px;
		display : grid;
		grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	}
	
	#menufiches a{
		display : inline-block;
		padding-left: 20px;
		padding-right: 20px;
	}
	
	.text {
		height: auto;
		padding: 20px;
		line-height: 1;
		font-size: 15px;
	}
	
	
	/*---------------logiciels----------------------*/
	.btn-accueil {
		min-width: 138px !important;
		font-size: 3vw;
		padding: 1vw 0 1vw 0;
		width: 45%;
	}
	/* -----------------contact ----------------*/
	form{
		padding-left:4vw;
		padding-right:4vw;
	}	
	
	#coordonnee{
		padding-left:4vw;
		padding-right:4vw;
		padding-bottom: 2vw;
	}
	
	/*----------------nouvelles--------------------*/
	#contenu-nouvelle{
		padding-left : 4vw;
		padding-right : 4vw;
		padding-top: 4vw;
	}
	
	#nouv h1{
		padding-top : 0px !important;
		padding-bottom : 0px !important;
	}
	
	.t-cadre {
		width: 100%;
		color: #333 !important;
		cursor: pointer;
		border: solid 1px #ccc;
		margin-top: 10px !important;
		padding: 0 !important;
		padding-bottom: 10px !important;
	}
	
	.t-cadre img{
		width:100%;
	}
	
	.t-cadre h4, .t-cadre h6 {
		font-weight: 300 !important;
	}
	.t-cadre h2, .t-cadre h3, .t-cadre h4, .t-cadre h6 {
		padding-left: 10px !important;
		padding-right: 10px !important;
	}
	
	#section-evenement{
		padding-bottom : 4vw;
	}
	
	.actualite-contenu{
		font-size: 13px !important;
	
	}	
	
	/*-----------------recrutement-------------------*/
	#recru{
		padding-left : 4vw;
		padding-right : 4vw;
		padding-bottom : 4vw;
	}
	
	#recrutementListe h2{
		padding-top : 0px !important;
		padding-bottom : 0px !important;
	}
	
	
	
	/*-----------------cgv-----------*/
	#cgv{
		width : 100% !important;
	}
	
	#cgv li {
		margin-left: 7vw !important;
	}
	
	
	#menu-mobile{
		position : absolute !important;
		z-index : 1 !important;
		width : 100%;
		background-color : #19B2B8;
	}
	
	#menu-mobile ul{
		margin : 0 !important;
		padding: 0 !important;
	}
		
	#menu-mobile li{
		background-color : #19B2B8 !important;
		width : 100%;
		margin : 0 !important;
		padding: 0 !important;
	}
	#menu-mobile li a{
		color: white !important;
		width : 100%;
		padding-top: 20px;
		padding-bottom: 20px;
		display : block;
		
	}
		
	#section-actualite img{
		width : 100% !important;
	}
	
	p{
		text-align :justify !important;
	}
	
	.formulaire-mobile{
		display:block !important;
	}
	
	.formulaire-web{
		display:none !important;
	}
	
	/*---------------------------------a propos------------------------*/
	#valeur h3{
		font-size: 15px !important;
		font-weight: 500 !important;
	}
	
	#equipe {
		padding-top:14vw;
	}
	
	
	/*-----------------------------fiches logiiels---------------------------*/
	#contenu-fiches {
		padding-left: 2vw;
		padding-right: 2vw;
	}
	#contenu-fiches h1{
		font-size : 1.8em !important;
		padding : 0 !important;
	}
	#contenu-fiches h2{
		font-size : 1.6em !important;
	}
	#contenu-fiches h3{
		font-size : 1.4em !important;
	}
	#contenu-fiches h4{
		font-size : 1.2em !important;
	}
	#contenu-fiches h5{
		font-size : 1em !important;
	}
	#contenu-fiches h6{
		font-size : 0.8em !important;
	}
	
	.logo-cote {
		padding-top: 20%;
		width: 10vw !important;
		min-width: 0px !important; 
	}
	
	.logo-courant {
		width: 23vw;
		min-width: 73px;
		max-width: 120px;
	}

	th {
		font-size: 17px !important;
	}
	
	td {
		font-size: 15px !important;
	}
	
	.btn-tarif {
		font-size: 15px !important;
		width: 19vw;
		max-width: 75px;
	}
	
	.text {
		padding: 0px !important;
		line-height: 1.5 !important;
		font-size: 15px !important;
	}
	.btn-fiches {
		width: 48vw;
		max-width: 200px;
		font-size: 14px;
		background-color: #318CE7;
	}
	.neutre .btn-fiches {
		margin-bottom: 20px;
		width: 29vw !important;
	}
	
	#fonctionnalite div {
		padding-left: 5vw;
		padding-right: 5vw;
		text-align: justify;
	}
	
	.developpement-contenu {
		font-size: 14px !important;
	}
	
	.fiche-une img{
		width:100%;
	}
	
	/*------------------------------scolaris-------------------------------------------*/
	.scolaris-haut img{
		width:66% !important;
	}
	
	.scolaris li{
		width:96% !important;
		padding-left : 2vw !important;
		padding-right : 2vw !important;
	}
	
	.scolaris-haut .titre-slogan p{
		text-align:center !important;
	}
	
}