<!-- Liste des membres du comité -->
<!-- Date de création: 10 juin 2020 -->
<!-- Auteur: Rétro -->
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="Comité de Micro-informatique de Polytechnique Montréal">
<meta name="author" content="Comic">
<title>Le Comité | Comic</title>
<!-- Bootstrap core CSS -->
<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Style CSS du gabarit -->
<link href="css/business-frontpage.css" rel="stylesheet">
<!-- Style CSS du gabarit -->
<link href="css/comic.css" rel="stylesheet">
<!-- Icône -->
<link rel="icon" type="image/png" sizes="96x96" href="ressources/icone-96x96.png">
<link rel="manifest" href="ressources/manifest.json">
<meta name="theme-color" content="#ffffff">
<!-- Icônes des événements -->
<link href="fontawesome-5.13.0/css/all.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar navbar-expand-sm navbar-dark fixed-top">
<div class="container nav-container">
<a class="navbar-brand" href="index.html">
<img src="ressources/logo_comic_blanc.png" alt="Logo" id="logoNavbar">
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav">
<li class="nav-item"><a class="nav-link text-nowrap" href="index.html">Accueil<span class="sr-only">(current)</span></a></li>
<li class="nav-item active"><a class="nav-link text-nowrap" href="le-comité.html">Le Comité</a></li>
<li class="nav-item"><a class="nav-link text-nowrap" href="chronologie.html">Chronologie</a></li>
<li class="nav-item"><a class="nav-link text-nowrap" href="s-impliquer.html">S'impliquer</a></li>
<li class="nav-item"><a class="nav-link text-nowrap" href="contact.html">Contact</a></li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Services
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="polybash.html"><i class="fa fa-trophy icone-evenement"></i> Polybash</a>
<a class="dropdown-item" href="saltcup.html"><img id="icone-saltcup" class="icone-evenement" src="ressources/saliere-noire.svg" alt=""> Saltcup</a>
<a class="dropdown-item" href="buildquest.html"><i class="fa fa-hammer icone-evenement"></i> BuildQuest</a>
<a class="dropdown-item" href="réparons-poly.html"><i class="fa fa-wrench icone-evenement"></i> Réparons-Poly</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- En-tête de page -->
<header id="en-tête-page">
<h1 class="section-heading text-center">
<img src="ressources/logo_comic.png" alt="Logo Comic">
Le Comité
</h1>
</header>
<!-- Portraits -->
<section class="section-portraits section-impaire">
<h3 class="section-heading text-center">Membres exécutifs</h3>
<div class="container-fluid text-left">
<div class="row row-cols-2 row-cols-sm-auto justify-content-center">
<div class="card mb-3">
<div class="row no-gutters">
<div class="portrait col-md-auto">
<img src="ressources/logo-comic-2-lignes.jpeg" class="card-img" alt="Membre">
</div>
<div class="col-md">
<div class="card-body">
<h5 class="card-title"><span class="pseudo">Pa+ch</span><span class="rôle"> | Directeur</span></h5>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellat tempora, pariatur perferendis maxime itaque eius sit. Hic dolorum numquam, dolores quia sequi. Sit ab eligendi recusandae modi nulla atque ducimus?</p>
</div>
</div>
</div>
</div>
<div class="card mb-3">
<div class="row no-gutters">
<div class="portrait col-md-auto">
<img src="ressources/logo-comic-2-lignes.jpeg" class="card-img" alt="Membre">
</div>
<div class="col-md">
<div class="card-body">
<h5 class="card-title"><span class="pseudo">Lib</span><span class="rôle"> | Trésorière</span></h5>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellat tempora, pariatur perferendis maxime itaque eius sit. Hic dolorum numquam, dolores quia sequi. Sit ab eligendi recusandae modi nulla atque ducimus?</p>
</div>
</div>
</div>
</div>
<div class="card mb-3">
<div class="row no-gutters">
<div class="portrait col-md-auto">
<img src="ressources/logo-comic-2-lignes.jpeg" class="card-img" alt="Membre">
</div>
<div class="col-md">
<div class="card-body">
<h5 class="card-title"><span class="pseudo">Trojan</span><span class="rôle"> | VP Gaming</span></h5>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellat tempora, pariatur perferendis maxime itaque eius sit. Hic dolorum numquam, dolores quia sequi. Sit ab eligendi recusandae modi nulla atque ducimus?</p>
</div>
</div>
</div>
</div>
<div class="card mb-3">
<div class="row no-gutters">
<div class="portrait col-md-auto">
<img src="ressources/logo-comic-2-lignes.jpeg" class="card-img" alt="Membre">
</div>
<div class="col-md">
<div class="card-body">
<h5 class="card-title"><span class="pseudo">Lag</span><span class="rôle"> | VP Matériel</span></h5>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellat tempora, pariatur perferendis maxime itaque eius sit. Hic dolorum numquam, dolores quia sequi. Sit ab eligendi recusandae modi nulla atque ducimus?</p>
</div>
</div>
</div>
</div>
</div>
<div class="row row-cols-2 row-cols-sm-auto justify-content-center">
<div class="card mb-3">
<div class="row no-gutters">
<div class="portrait col-md-auto">
<img src="ressources/logo-comic-2-lignes.jpeg" class="card-img" alt="Membre">
</div>
<div class="col-md">
<div class="card-body">
<h5 class="card-title"><span class="pseudo">Torrent</span><span class="rôle"> | VP Réparation</span></h5>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellat tempora, pariatur perferendis maxime itaque eius sit. Hic dolorum numquam, dolores quia sequi. Sit ab eligendi recusandae modi nulla atque ducimus?</p>
</div>
</div>
</div>
</div>
<div class="card mb-3">
<div class="row no-gutters">
<div class="portrait col-md-auto">
<img src="ressources/logo-comic-2-lignes.jpeg" class="card-img" alt="Membre">
</div>
<div class="col-md">
<div class="card-body">
<h5 class="card-title"><span class="pseudo">Rétro</span><span class="rôle"> | Webmestre</span></h5>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellat tempora, pariatur perferendis maxime itaque eius sit. Hic dolorum numquam, dolores quia sequi. Sit ab eligendi recusandae modi nulla atque ducimus?</p>
</div>
</div>
</div>
</div>
<div class="card mb-3">
<div class="row no-gutters">
<div class="portrait col-md-auto">
<img src="ressources/portraits/noclip.png" class="card-img" alt="Membre">
</div>
<div class="col-md">
<div class="card-body">
<h5 class="card-title"><span class="pseudo">NoClip</span><span class="rôle"> | Secrétaire</span></h5>
<p class="card-text">Lors des rencontres, je note les informations importantes pour les personnes absentes ou pour se souvenir des tâches de chacun. Je peux aussi aider le directeur avec l'envoi d'e-mails ou d'appels.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="section-texte-gauche" class="section-paire">
<div class="container-fluid text-left">
<h3 class="section-heading">NB Temporaire</h3>
<div class="row justify-content-left">
<div class="col">
<p>Si vous avez pas d'encadré à votre nom sur la page et que vous voudriez y figurer, svp envoyer par discord (Rétro) un portrait qui rentre dans le cercle (150px de diamètre), et un petit descriptif à écrire dans le cadre!</p>
</div>
</div>
</div>
</section>
<!-- Bas-de-page -->
<footer class="py-5">
<div class="container text-center">
<h5><b><p>COMIC</p></b></h5>
<p>Local C215.02 (Pavillon Principal)
<br>École Polytechnique de Montréal
<br><a class="lien-cliquable" href="mailto:comic@nova.polymtl.ca">comic@nova.polymtl.ca</a>
<br><a class="réseau-social" href="https://www.facebook.com/lecomicpolymtl/"><i class="fab fa-facebook-square"></i></a>
<a class="réseau-social" href="https://m.me/lecomicpolymtl"><i class="fab fa-facebook-messenger"></i></a>
<!-- NOTE: Le lien d'invitation vers le Discord du Polybash est lié
au compte personnel de Rétro. Créer un nouveau lien d'invitation --à date d'expiration illimitée-- quand ce sera approprié. -->
<a class="réseau-social" href="https://discord.gg/EqHDKYK"><i class="fab fa-discord"></i></a></p>
<p>© Comic 2020</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
</body>
</html>