/***** bloc grid *****/
.bloc_grid	                        	{ display: grid; grid-template-columns: 1fr 50%; grid-gap: 80px; align-items: center; position: relative; margin: 100px 0;}
.bloc_grid.align_top                	{ align-items: start;}
.bloc_grid :last-child					{ margin-bottom: 0;}
.bloc_grid .photo						{ position: relative; line-height: 0; overflow: hidden; border-radius: 15px;}
.bloc_grid .photo img 					{ width: 100%; height: auto; object-fit: cover; display: block; position: relative; z-index: 10;}
.bloc_grid .texte						{ position: relative;}
.bloc_grid p               				{ margin-bottom: 15px;}
.bloc_grid .link						{ margin-top: 10px;}
.bloc_grid.reverse 						{ grid-template-columns: 50% 1fr;}
.bloc_grid.reverse .texte				{ grid-area: 1 / 1;}
.bloc_grid.reverse .photo        		{ grid-area: 1 / 2;}

@media (max-width:1200px) { 
.bloc_grid	                        	{ grid-gap: 60px; margin: 80px 0;}
}
@media (max-width:1000px) { 
.bloc_grid	                        	{ grid-template-columns: 1fr; grid-gap: 50px; margin: 50px 0;}
.bloc_grid .photo 						{ max-width: 500px; margin: 0 auto;}
.bloc_grid .texte,
.bloc_grid.reverse  					{ grid-template-columns: 1fr;}
.bloc_grid.reverse .texte				{ grid-area: 2;}
.bloc_grid.reverse .photo        		{ grid-area: 1;}
}
@media (max-width:600px) { 
.bloc_grid	                        	{ margin: 30px 0; grid-gap: 30px;}
.bloc_grid .photo						{ border-radius: 10px;}
.bloc_grid p               				{ margin-bottom: 15px;}
}

/* custom shape round */
.bloc_grid.shape_round:before 					{ right: 100%; margin-right: -200px; bottom: 40px;}
.bloc_grid.reverse.shape_round:before 			{ right: auto; left: 100%; margin: 0 0 0 -200px;}

/* custom play video */
.bloc_grid .photo .play_video					{ position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 50;}
.bloc_grid .photo .play_video span				{ position: absolute; left: 50%; top: 50%; background: #fff; border-radius: 50%; width: 80px; height: 80px; transform: translate(-50%, -50%);}
.bloc_grid .photo .play_video span:after		{ width: 100%; height: 100%; background: url("../images/play.svg") 55% 50% no-repeat; background-size: 18px auto; display: block; filter: invert(1); content: "";}

@media (min-width:1201px) { 
.bloc_grid .photo .play_video:hover	 			{ background: rgba(0,0,0,0.5);}
.bloc_grid .photo .play_video:hover span	 	{ background: #00b9eb;}
.bloc_grid .photo .play_video:hover span:after	{ filter: invert(0);}
}
@media (max-width:600px) { 
.bloc_grid .photo .play_video span				{ width: 60px; height: 60px;}
.bloc_grid .photo .play_video span:after		{ background-size: 16px auto;}
}
