{{#features}}
	<li class="item" style="width:238px;">
		<h3 class="title-feature">{{site}}</h3>
		<p>
		<iframe src="{{lien}}" allowfullscreen="allowfullscreen" width="100%" height="400" frameborder="0"></iframe>
		<br>
		<a class="button_cont" align="center"><a class="example_c" href="{{source}}" target="_blank" rel="nofollow noopener">Météo
		</a>
		<i class="fa fa-angle-double-down"></i>
		</p>		
	</li>
{{/features}}

<style>
	.title-feature {
		color: #032E46;
		font-family:"roboto_bold";
		font-size:23px;
		margin-bottom:1%;
		line-height:1;
	}
	.text-feature{
		font-family:"roboto_regular";
		color:#555;
		font-size:13px;
		margin-top:10%;
	}
	.sub-title{
		color: #032E46;
		font-family:"roboto_bold";
	}

	.example_c {
color: #494949 !important;
font-family:"roboto_regular"
text-transform: none;
text-decoration: none;
background: #ffffff;
padding: 12px;
border: 2px solid #494949 !important;
display: inline-block;
transition: all 0.4s ease 0s;
}

.example_c:hover {
color: #ffffff !important;
background: #F3D617;
border-color: #F3D617 !important;
transition: all 0.4s ease 0s;
}
</style>