<!DOCTYPE html>

<html>

<head>
    
<link href="fontawesome-free-5.9.0-web/fontawesome-free-5.9.0-web/css/all.css" rel="stylesheet">

       
 <link href="https://fonts.googleapis.com/css?family=Oswald&display=swap" rel="stylesheet">
    
    
</head>  
    
<div class="fixture">    

<div id="actividades">
<h3 id="queactividad">vs NOLTING</h3> 
<br>
<p><i class="fas fa-calendar-alt"></i> SÃ¡bado 06 </p>
<br>
<ul>    
        
<li><i class="fas fa-clock"></i> Primera 21 h</li>
<li><i class="fas fa-clock"></i> Reserva 19 h</li>  
</ul>  
<br>
<h4 class="torneo">TORNEO "A" CAFS</h4>    
    
<div class="ubicacion">  
<i class="fas fa-map-marker-alt fa3x"></i>
<a href="#">Social Lynch</a></div>  
</div>    
    
    
    
    
</div>    

<style>


    
.fixture{
    width: 250px;
    font-family: "oswald";
  text-align: center;
 }    

    #actividades {padding: .5em;
    display: block;
    border-radius: 20px;
    border-color: darkslateblue;
    margin: .4rem;}


  #actividades ul{displey:flex;
flex-direction: column;}

    #actividades ul li {text-decoration: none;
    margin-left: 1em;
    list-style: none;
    font-size: 12px;}
    
    #queactividad {font-weight: bold;
    margin-bottom: 0;
    background-color: royalblue;
    padding: .5em;
    color: white; 
    width: auto;
    border-radius: 10px;
    text-align: center;
    }

    
    .torneo{font-weight: 300;
    letter-spacing: .1rem;}
    
    .ubicacion{font-size: 12px;
    align-items: center;}
  

</style>




</html>