<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.0/css/all.css" integrity="sha384-lKuwvrZot6UHsBSfcMvOkWwlCMgc0TaWr+30HWe3a4ltaBwTZhyTEggF5tJv8tbt" crossorigin="anonymous">

<style>

 /*
 *  Remove items from Atlassian for a cleaner Portal aspect.
 */

  .ia-splitter-left, #main-header, .page-metadata, #likes-and-labels-container, #comments-section, #footer, .aui-nav li { display: none !important; }
  .ia-splitter { border:none !important }
  #editPageLink { display:inline-block !important; }
  #header { position: absolute !important; width: 100vw !important; z-index: 99 !important; }
  #main { margin:0 !important; width:100vw !important; height: 100vh !important; padding-top: 10vh !important;  border:none !important; }
  #content { padding: 0 !important; }
  #CSUCHPCPortal-HPCPORTAL { font-size: 3em !important; font-weight:bold !important;}


 /*
 *  Style RDM alert items.
 */

  .grid-alert {
    display: grid;
    grid-template-columns: 1fr 1fr 7fr 2fr;
    grid-gap: 0 10px;
    grid-template-areas: ". a b ."
  }
  #alert-icon { grid-area: a;}
  #alert-message { grid-area: b;}

@media (max-width: 600px) {
  .grid-alert {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: repeat(2, auto);
    grid-gap: 10px 0;
    grid-template-areas: "a"
                         "b";
    justify-self: center;
    text-align: center;
  }
  #alert-icon i { font-size:1em;}

}


 /*
 *  Style RDM navigation items.
 */

  .grid-nav {
    display: grid;
    grid-template-columns: 1fr repeat(2, 2fr) 1fr;
    grid-template-rows: 1fr;
    grid-gap: 0 10px;
    grid-template-areas: ". a b c .";
  }

@media (max-width: 600px) {
  .grid-nav {
    display: grid;
    grid-template-columns: 1fr 9fr 1fr;
    grid-template-rows: repeat(2, 1fr);
    grid-gap: 10px 0;
    grid-template-areas: ". a ."
                         ". b ."
                         ". c .";
  }
}

  .hpc-nav-item {
    align-self: center;
    justify-self: center;
    text-align: center;
    text-decoration: none !important;
  }

  #dmp{ grid-area: a; }
  #publish{ grid-area: b; }
  #docs{ grid-area: c; }

  .hpc-nav-item i {
    font-size: 6em;
    color: #2A7886;
    padding: 10px;
  }
  .hpc-nav-item:hover i {
    color: rgba(42,120,134,0.9);
  }
  .hpc-nav-item p {
    font-size: 1.8em;
    color: black;
    padding: 10px;
  }
  .hpc-nav-item:hover p {
    color: rgba(0,0,0,0.8);
  }
</style>

<div class="grid-nav">
    <a class="hpc-nav-item" id="dmp" href="https://confluence.csuc.cat/x/1IGPBQ">
        <i class="fas fa-file-alt" width="250"
    		height="150"></i>
        <p>Plans de gestió de dades</p>
	  </a>

    <a class="hpc-nav-item" id="publish" href="https://confluence.csuc.cat/x/54GPBQ2oGPBQ">
      <i class="fas fa-database" width="250"
    		height="150"></i>
      <p>Publicar les dades de recerca</p>
	</a>

    <!-- <a class="hpc-nav-item" id="docs" href="https://confluence.csuc.cat/display/RDM/Recomanacions+per+gestionar+dades+de+recerca">
      <i class="fas fa-book" width="250"
    		height="150"></i>
      <p>Bones pràctiques</p>
    </a> -->
</div>
<br>
<br>
<br>
<br>