@charset "UTF-8";
/* *********************************************** */
/* Projet : Gabarit de de cours Moodle 4           */
/* Fichier CSS global                              */
/* Dernieres modifications : Janvier 2024          */
/* Auteurs : Simon Gaudreau, Jonathan Collard et Alex Bourque  */
/* *********************************************** */
/* *********************************************** */
/* MIXINS                                          */
/* ----------------------------------------------- */
/* Table des matieres :                            */
/*                                                 */
/* - Media queries                                 */
/* - Layout                                        */
/* - Texte                                         */
/* - Animations et transformations                 */
/* - Visibilite et opacite                         */
/* - Borders                                       */
/* - Autres                                        */
/*                                                 */
/* *********************************************** */
/* =============================================== */
/* Media queries                                   */
/* ----------------------------------------------- */
/* =============================================== */
/* Layout                                          */
/* ----------------------------------------------- */
/* Applique les styles pour creer une colonne responsive a partir de sa largeur (en nombre de colonnes) par rapport au nombre maximal de colonnes. */
/* Applique un retrait a gauche en remplacement de colonnes vides. */
/* Applique une largeur de 100% sur toutes les colonnes. */
/* Applique une largeur de 50% sur toutes les colonnes sauf celles qui sont deja pleine largeur. */
/* Appele le mixin col avec les bons parametres pour toutes les classes "merge" et "offset". */
/* =============================================== */
/* Texte                                           */
/* ----------------------------------------------- */
/* Calcul du font-size en rem et son fallback en px. */
/* Calcul du line-height en rem et son fallback en px. */
/* Calcul du font-size en rem et son fallback en px. */
/* et calcul du line-height (par un multiplicatif relatif au font-size) */
/* en rem et son fallback en px. */
/* https://gist.github.com/jonathantneal/d0460e5c2d5d7f9bc5e6 */
/* font-face */
/* =============================================== */
/* Animation                      				   */
/* ----------------------------------------------- */
/* Cree un triangle en css seulement. */
/* =============================================== */
/* Visibilite et opacite                           */
/* ----------------------------------------------- */
/* Cache un element visuellement seulement pour qu'il reste disponible pour les lecteurs d'ecran. */
/* Cache un element completement. */
/* Remplace un texte par une image. */
/* =============================================== */
/* Autres                                          */
/* ----------------------------------------------- */
/* Calcul le ratio d'un element avec une image de background dont on veut changer la taille. */
/* *********************************************** */
/* VARIABLES                                       */
/* ----------------------------------------------- */
/* Table des matieres :                            */
/*                                                 */
/* - Grille                                        */
/* - Breakpoints                                   */
/* - Couleurs                                      */
/* - Fontes                                        */
/* - Grosseur                                      */
/* - Autres                                        */
/*                                                 */
/* *********************************************** */
/* =============================================== */
/* Grille                                          */
/* ----------------------------------------------- */
/* Indiquez ici le nombre de colonnes de la        */
/* grille utilisee, leur padding (s'il y a lieu)   */
/* ainsi que la largeur des goutieres.             */
/* ----------------------------------------------- */
/* =============================================== */
/* Breakpoints                                     */
/* ----------------------------------------------- */
/* Indiquez ici les differents breakpoints de      */
/* votre grille responsive. Vous pouvez en ajouter, */
/* en enlever et en modifier selon vos besoins.    */
/* ----------------------------------------------- */
/* =============================================== */
/* Couleurs                                        */
/* ----------------------------------------------- */
/* Indiquez ici toutes couleurs (texte, bordure,   */
/* background...) que vous comptez reutiliser a    */
/* plusieurs reprises dans votre site. Vous pouvez */
/* en ajouter, en enlever et en modifier selon     */
/* vos besoins.                                    */
/* ----------------------------------------------- */
/* Background */
/* Texte */
/* Hyperlien */
/* Bordure */
/* =============================================== */
/* Fontes                                          */
/* ----------------------------------------------- */
/* Indiquez ici les fontes                         */
/* que vous comptez reutiliser a                   */
/* plusieurs reprises dans votre site. Vous pouvez */
/* en ajouter, en enlever et en modifier selon     */
/* vos besoins.                                    */
/* ----------------------------------------------- */
/* =============================================== */
/* Grosseur                                        */
/* ----------------------------------------------- */
/* Indiquez ici les grosseurs                      */
/* que vous comptez reutiliser a                   */
/* plusieurs reprises dans votre site. Vous pouvez */
/* en ajouter, en enlever et en modifier selon     */
/* vos besoins.                                    */
/* ----------------------------------------------- */
/* =============================================== */
/* Autres                                          */
/* ----------------------------------------------- */
/* Variables divers                                */
/* ----------------------------------------------- */
/* Hauteur */
@import url(https://fonts.googleapis.com/css?family=Roboto+Slab:100,300,400,700|Roboto:100,300,400,500,700,100italic,300italic,400italic,500italic,700italic,900|Roboto+Condensed:300,400,700,300italic,400italic,700italic|Open+Sans:300,400,600,700);
/* *********************************************** */
/* COMMUN                                          */
/* ----------------------------------------------- */
/* Table des matieres :                            */
/*                                                 */
/* - Base                                          */
/* - Grille simplifiée                             */
/* - Contenu spécifique au cours                   */
/*                                                 */
/* *********************************************** */
/* =============================================== */
/* Base                                            */
/* ----------------------------------------------- */
/* =============================================== */
/* Grille et conteneurs                            */
/* ----------------------------------------------- */
.container {
  max-width: 1200px !important;
  height: 100%;
  margin: 0 auto; }

@media screen and (min-width: 480px) {
  body[data-typemenu="header"] #zoneIdentitaire .container, body[data-typemenu="header"] #zoneMenu .container, body[data-typemenu="header"] #main .container {
    max-width: 1200px; } }
@media screen and (min-width: 480px) {
  #page-mod-quiz-attempt .container, body[data-typemenu="sidebar"] .container, body[data-typemenu="sidebar"] #main .container {
    max-width: 1200px; } }
@media screen and (min-width: 1200px) {
  body[data-typemenu="sidebar"] #main .container, body[data-typemenu="sidebar"] #main .container, #page-mod-quiz-attempt .container {
    max-width: 1200px; } }
@media screen and (min-width: 1200px) {
  body[data-typemenu="sidebar"] #main .container, body[data-typemenu="sidebar"] #main .container, #page-mod-quiz-attempt .container {
    max-width: 1200px; } }

/* ----------------------------------------------- */
/* ZONE MENU                 					   */
/* ----------------------------------------------- */
#zoneMenu {
  background-color: #194A6A !important; }

/* =============================================== */
/* Contenu spécifique au cours                     */
/* ----------------------------------------------- */
#main {
  background-image: none !important;
  /* ----------------- Fil d'ariane ------------------ */ }
  #main #filAriane {
    margin-bottom: 0 !important; }

/* ============================ LIEN EXTERNE =================================== */
#main #contenu a[target="_blank"]:not(a[href*="pluginfile.php"]) {
  display: inline !important; }
  #main #contenu a[target="_blank"]:not(a[href*="pluginfile.php"]):after {
    display: inline-block !important;
    top: 0 !important; }

/* ============================ HEADER- zoneIdentitaire =============================== */
#zoneIdentitaire {
  height: 200px;
  background-image: url("../img/contenu/GEO6110_Bandeau-480px.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center; }
  #zoneIdentitaire #blocInfoCours {
    margin-top: 50px; }
    #zoneIdentitaire #blocInfoCours #sigleCours,
    #zoneIdentitaire #blocInfoCours #titreCours {
      color: #000;
      background-color: #fff;
      width: fit-content;
      font-size: 4.9rem;
      font-family: "Open Sans", Arial, Helvetica, sans-serif;
      padding: 10px; }
    #zoneIdentitaire #blocInfoCours #sigleCours {
      font-size: 2rem; }
    #zoneIdentitaire #blocInfoCours #titreCours {
      font-weight: 700;
      padding-top: 0;
      padding-bottom: 0; }

@media screen and (min-width: 480px) {
  #zoneIdentitaire {
    height: 290px;
    background-image: url("../img/contenu/GEO6110_Bandeau-1200px.jpg"); } }
/* ============================ HEADER- zoneMenu =============================== */
#zoneMenu {
  background-color: #194A6A !important; }

@media screen and (min-width: 1200px) {
  body[data-typemenu="header"] #menuPrincipal .lstMenuPrincipal {
    font-family: "Open Sans", Arial, Helvetica, sans-serif; }
    body[data-typemenu="header"] #menuPrincipal .lstMenuPrincipal > li > a {
      font-size: 1.6rem !important;
      font-weight: 400 !important;
      padding-left: 20px !important;
      padding-right: 30px !important;
      position: relative !important; }
    body[data-typemenu="header"] #menuPrincipal .lstMenuPrincipal > li.itemActif > a {
      background-color: #000 !important; }
    body[data-typemenu="header"] #menuPrincipal .lstMenuPrincipal > li.parent a::after {
      content: " " !important;
      display: inline-block !important;
      margin-left: 10px !important;
      border: solid #fff !important;
      border-width: 0 1px 1px 0 !important;
      padding: 2.5px !important;
      transform: rotate(45deg) !important;
      position: absolute !important;
      top: 42%;
      right: 10px; }
    body[data-typemenu="header"] #menuPrincipal .lstMenuPrincipal .sub .row .row .col {
      width: 25%; }
      body[data-typemenu="header"] #menuPrincipal .lstMenuPrincipal .sub .row .row .col li a {
        font-size: 16px;
        font-size: 1.6rem; } }
/* ============================ CONTENU =============================== */
#contenu {
  /* ----------------- TITRE ------------------ */
  /* ----------------- PARAGRAPHE ------------------ */
  /* ----------------- LISTES ------------------ */
  /* ----------------- IMAGES ------------------ */
  /* ----------------- ACCORDÉONS ------------------ */ }
  #contenu p,
  #contenu a {
    font-family: "Open Sans", Arial, Helvetica, sans-serif !important; }
  #contenu a {
    color: #2655BA; }
  #contenu h1, #contenu h2, #contenu h3, #contenu h4, #contenu h5, #contenu h6 {
    font-family: "Open Sans", Arial, Helvetica, sans-serif !important;
    color: #000000 !important;
    font-weight: 600 !important;
    margin-top: 60px !important; }
  #contenu h1 {
    margin-top: 0 !important;
    font-family: "Open Sans", Arial, Helvetica, sans-serif !important;
    font-size: 3.5rem !important;
    line-height: 5rem !important;
    text-transform: uppercase; }
  #contenu h2 {
    font-size: 2.8rem !important; }
    #contenu h2.balados, #contenu h2.activiteLecture, #contenu h2.activiteVideo {
      position: relative;
      font-size: 2.4rem !important;
      padding: 2px 85px 5px 85px;
      margin: 40px 0; }
      #contenu h2.balados:before, #contenu h2.activiteLecture:before, #contenu h2.activiteVideo:before {
        position: absolute;
        top: -15px;
        left: 10px;
        display: block;
        content: " ";
        width: 65px;
        height: 55px;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat; }
    #contenu h2.balados {
      background-color: #52C4F7; }
      #contenu h2.balados:before {
        background-image: url("../img/icones/ico_balado.svg"); }
    #contenu h2.activiteLecture {
      background-color: #EDDCC4; }
      #contenu h2.activiteLecture:before {
        background-image: url("../img/icones/ico_texte.svg"); }
    #contenu h2.activiteVideo {
      background-color: #B3DFE6; }
      #contenu h2.activiteVideo:before {
        background-image: url("../img/icones/ico_video.svg"); }
  #contenu h3 {
    font-size: 2.2rem !important;
    margin-top: 50px !important; }
    #contenu h3.noteEcoute {
      position: relative;
      padding-left: 34px; }
      #contenu h3.noteEcoute:before {
        content: " ";
        position: absolute;
        top: 2px;
        left: 0;
        width: 24px;
        height: 24px;
        background-image: url("../img/icones/ico_notes.svg");
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center; }
  #contenu .titreBalados,
  #contenu .animAudioPlaylist .interTitre {
    font-family: "Open Sans", Arial, Helvetica, sans-serif !important;
    font-size: 1.8rem;
    font-weight: 700;
    margin-bottom: 10px; }
  #contenu p,
  #contenu ul,
  #contenu ol,
  #contenu table td,
  #contenu table th,
  #contenu .animAudioPlaylist {
    max-width: 750px;
    font-family: "Open Sans", Arial, Helvetica, sans-serif;
    font-size: 1.8rem; }
  #contenu #navPageForm ul {
    max-width: 100%; }
  #contenu ul > li:before {
    top: -23px !important; }
  #contenu picture img {
    margin-top: 40px; }

#contenu .accordeon {
  max-width: 750px;
  border: 1px solid #000;
  margin-top: 15px; }
  #contenu .accordeon p.toggler,
  #contenu .accordeon p.toggler.active {
    font-family: "Open Sans", Arial, Helvetica, sans-serif !important;
    font-weight: 600;
    font-size: 1.6rem;
    padding: 15px 78px 15px 15px !important;
    background-color: #BCCED6;
    color: #000 !important; }
    #contenu .accordeon p.toggler .icone,
    #contenu .accordeon p.toggler.active .icone {
      font-family: "Open Sans", Arial, Helvetica, sans-serif !important;
      font-size: 1.4rem;
      background: url("../img/icones/ico_accordeon_plus.svg");
      background-repeat: no-repeat;
      background-position: 85% !important; }
      #contenu .accordeon p.toggler .icone:before,
      #contenu .accordeon p.toggler.active .icone:before {
        left: -15px; }
    #contenu .accordeon p.toggler.active .icone,
    #contenu .accordeon p.toggler.active.active .icone {
      background: url("../img/icones/ico_accordeon_moins.svg");
      background-repeat: no-repeat;
      color: #000; }
  #contenu .accordeon > div {
    background-color: #fff !important; }
    #contenu .accordeon > div a {
      color: #2655BA !important;
      font-size: 1.8rem;
      font-weight: 400; }

/* ----------------- BALADOS ------------------ */
#contenu .animAudioPlaylist {
  margin-top: 10px;
  margin-bottom: 15px; }
#contenu .animAudioPlaylist.visionneuse ul.listeOnglets li {
  width: 100% !important; }
  #contenu .animAudioPlaylist.visionneuse ul.listeOnglets li a {
    background: none !important;
    color: #2655BA !important;
    font-size: 1.8rem !important;
    line-height: 2.7rem !important;
    text-align: left !important;
    font-family: "Open Sans", Arial, Helvetica, sans-serif !important;
    text-decoration: underline !important;
    padding: 12px 0 !important;
    font-weight: 400 !important; }

/* ----------------- TABLEAU ------------------ */
#contenu .tableau.style1 th, #contenu .tableau.style1 td {
  font-size: 18px;
  font-size: 1.8rem; }
#contenu .tableau.style1 th {
  background-color: #BDCDD6 !important;
  color: #000 !important; }

/* ----------------- QUIZ ------------------ */
body[id*=page-mod-quiz-view] #contenu h2:first-of-type:not(.h1) {
  margin-top: 0 !important;
  font-family: "Open Sans", Arial, Helvetica, sans-serif !important;
  font-size: 3.5rem !important;
  line-height: 5rem !important;
  text-transform: uppercase; }

body[id*=quiz] #contenu .info h3 {
  font-size: 14px !important;
  font-size: 1.4rem !important; }

/*# sourceMappingURL=screen.css.map */