
@media screen and (min-width: 768px) and (max-width: 1319px){ 
	/* #bloc-2 , */
	/* #bloc-3 , */
	/* #bloc-4 ,
	#bloc-5 {
		display: none;
	} */
	#particles-js {
		border: 1px solid red;
		position: absolute;
		z-index: 0;
		width: 100%;
		height: 270vh;
	}
	.screen {
		/* border: 1px solid red; */
		width: 100%;
		height: 50vh;
	}
	#bloc-1 .banaire h1{
		margin-top: 0;
		font-size: 35pt;
		margin-top: 30%;
		/* background: #000; */
	}
	img.pourcentage{
		max-width: 400px;
		max-height: 252px;
	}
	#bloc-3 .pourcentage {
		border: 0px solid #2a013f;
		position: relative;
		top: 100px;
		left: 400px;
	}

	#bloc-3 p {
		border: 0px solid red;
		position: relative;
		top: 140px;
		left: 5px;
	}

}


@media screen and (max-width: 768px) { 
	/* #bloc-1, */
	/* #bloc-2,  */
	/* #bloc-3 , */
	/* #bloc-4 ,
	#bloc-5 
	/* #bloc-6 */
	 /* {
		display: none;
	} */ 
	/* *************************************** block 1******************************************** */
	.screen {
		/* border: 1px solid red; */
		width: 100%;
		/* height: 50vh; */

	}
	#bloc-1, #bloc-2{
		height: 50vh;

	}

	#particles-js{
		display: none;
	}
	
	#bloc-1 .banaire h1, #bloc-2 .about-number h2, #bloc-3 h2, #bloc-4 h2 {
		margin-top: 0;
		font-size: 25pt;
		/* background: #000; */
	}
	#bloc-1 span{
		display:  none;
	}
    #bloc-1 .banaire {
        /* border: 1px solid green; */
        
        margin-top: 50px;
        /* background: #040c2a; */
    }
	#bloc-1 .iinext-2{
        clear: left;
        margin-top: 40px;
	}
	.wrap-menu{
		display: none;
	}
	.la-suite{
		width : calc((100% -143) / 2);
	}
	
	/* *************************************** block 2 ******************************************** */
	#bloc-2 header {
        /* border: 1px solid #000; */
        position: relative;
        top: 10px;
        width: 100%;
        height: 0px;
        background-color: #000;
        -webkit-box-shadow: 2px -13px 105px 17px rgba(0,0,0,1);
        -moz-box-shadow: 2px -13px 105px 17px rgba(0,0,0,1);
        box-shadow: 2px -13px 100px 90px rgba(0,0,0,1);
        z-index: 20;
    }
    #bloc-2 .shadow-pourcentage {
        border: 0px solid #f0f;
        padding: 0%;
        padding-top: 10%;
    }
	#bloc-2 p, #bloc-3 p {
        /* border: 1px solid rgb(255, 0, 128); */
        border-radius: 5px;
        font-size: 20pt;
        color: #fff;
        text-align: left;
        margin-top: 0;
        padding-left: 0px;
        /* background: rgb(0,97,113); */
        /* background: radial-gradient(circle, rgba(0,97,113,1) 0%, rgba(0,97,113,0.25252107679009106) 100%); */
    
        /* -webkit-box-shadow: 19px 140px 95px -18px rgba(5,26,55,1);
        -moz-box-shadow: 19px 140px 95px -18px rgba(5,26,55,1);
        box-shadow: 19px 140px 95px -18px rgba(5,26,55,1); */
        
        
    }
    #bloc-2 h2 {
        font-size: 40.99pt;
        line-height: 35pt;
        
    }
    #bloc-2 .about-us {

        /* border: 1px solid blue; */
  
        margin-top: 20px;
 
    }
	
}
@media screen and (max-width: 450px) { 
	
	#bloc-2 p, #bloc-3 p{
      
        font-size: 10pt;
   
    }
	.la-suite{
		min-width : 100px;
		font-size: 10.38pt;
		
	
	}
	#bloc-1 .banaire h1, #bloc-2 .about-number h2, #bloc-3 h2, #bloc-4 h2 {
		margin-top: 0;
		font-size: 15pt;
		/* background: #000; */
	}
}
@media screen and  (min-width: 320px) and (max-width: 414px) { 
	#bloc-5 .text-1, #bloc-5 .text-2, #bloc-5 .text-3 {
		border: 0px solid red;
		font-size: 8.01pt;
		color: #fff;
		text-align: left;
	}
	#bloc-4 .iinext-3{
		display: none;
	}

	#bloc-3 .pourcentage {
		border: 0px solid #2a013f;
		position: relative;
		top: -50px;
		left: 30px;
		z-index: 20;
		height: auto;
	}
	#bloc-6 .wrap-product-map .product-name{
		float: none;
		
	}
	#bloc-6  .wrap-product-map .content{
		background-image: none;
	padding-bottom: 100px;

	}
	#bloc-6 .wrap-product-crm .content{
		background-image: none;
		padding-bottom: 100px;
	}
	#bloc-5 .text-1 h2 {
		font-size: 14.08pt;
		/* position: relative;
		top: 100px;
		left: 180px; */
	}
	#bloc-5 .text-2 h2 {
		font-size: 14.08pt;
		/* position: relative;
		top: 10px;
		left: -30px; */
	}
	#bloc-5 .text-3 {
		position: relative;
		top: -100px;
	}
	#bloc-5 .text-1 h2 {
		font-size: 14.08pt;
		position: relative;
		top: -10px;
		left: 0;
	}
	#bloc-5 .text-2 h2 {
		font-size: 14.08pt;
		position: relative;
		top: -10px;
		left: 0px;
	}

	#bloc-5 .wrap-img {
		display: none;
	}
    #bloc-1 .banaire {
        /* border: 1px solid green; */
        
        margin-top: 30px;
        /* background: #040c2a; */
    }
	
	#bloc-1 .iinext-2{
        clear: left;
        margin-top: 10px;
	}
	.banaire h1{

		font-size: 15pt;
		
	}
}