systeme-terre-en.html

<div style="max-width:366px;text-align:center;">
	<div class="systeme-terre">
	    <div class="data-terra"><img src="https://www7.obs-mip.fr/wp-content-aeris/uploads/sites/4/2019/09/data-terra-500.png" alt="Data Terra" /></div>
		<div>
			<a href="https://www.aeris-data.fr/" title="Aeris - Data and Services for the Atmosphere" target="_blank">

				<img src="https://www7.obs-mip.fr/wp-content-aeris/uploads/sites/4/2019/09/aeris.png" alt="Aeris"  />
			</a>
		</div>
		<div>
			<a href="#" title="ForM@Ter - Data and Services for Solid Earth" >

				<img src="https://www7.obs-mip.fr/wp-content-aeris/uploads/sites/4/2019/09/formater.png" alt="ForM@Ter" />
			</a>
		</div>
		<div>
			<a href="http://www.odatis-ocean.fr/" title="Odatis - Data and Services for Ocean" target="_blank">
				<img src="https://www7.obs-mip.fr/wp-content-aeris/uploads/sites/4/2019/09/odatis.png" alt="odatis" />
			</a>
		</div>
		<div>
			<a href="http://www.theia-land.fr/" title="Theia - Data and Services for Continental Surfaces" target="_blank">
				<img src="https://www7.obs-mip.fr/wp-content-aeris/uploads/sites/4/2019/09/theia.png" alt="theia" />
			</a>
		</div>
	</div>
</div>
<style>
.systeme-terre{
  max-width:300px;
  width:300px;
}
.systeme-terre img{
   max-height:50px;
   max-width:120px;

   }
   .systeme-terre > div:not(.data-terra){
     display:inline-block;
	 max-width:120px;
	 margin:4px 5px;
	 box-shadow: 5px 2px 2px grey;
   }
   .systeme-terre > div:hover{
     display:inline-block;
	 max-width:120px;
	 margin:2px 5px;
	 box-shadow: 5px 2px 2px darkred;
   }
   
#custom_html-2 h2::before {
    font-family: "FontAwesome";
    content: "\f0ac";
	margin-right: 10px;
   margin-left: 5px;
}
/* styles ajoutés le 27 septembre avec data terra */
.systeme-terre > div.data-terra {
	display:block;
	box-shadow:none;
	text-align:center;
	max-width:100%;
}
.systeme-terre > div.data-terra img{
    max-width: 180px;
    width: 200px;
    height: auto;
    max-height: 100px;
}

</style>