/*
Theme Name: PSY 1110
Theme URI: https://psy1110.teluq.ca/
Author: Marie-Josée Briand
Tags: 
About: Télé-université, Université du Québec, 2017 - Tous droits réservés
*/
/* Fait à partir du Gabarit de cours HTML5, https://modelecourswp.teluq.ca/ de Francois Martel */

/* styles.css
 * Gère l'apparence des styles
 * Version : 1.2
 * Dernières modifications : Mai 2015
 * Note : Les prefixes CSS sont gérés par prefixfree.js
 * Table des matières
 * ==================================================
	généraux
	zoneEntete
	conteneurs
	zoneHautPage
	zoneInformative
	menuPrincipal
	zoneMenu
	zoneContenu
	zoneContenu/zoneArticle
	zoneBasPage
	infobulles
	panneaux
	impression */

/* ==================================================
 * généraux
 * ================================================== */

html {
	box-sizing: border-box;
}

*, 
*:before, 
*:after {
	box-sizing: inherit;
}

html{
	font-size: 100%;
}

body{
	background-color: #bae0e2;
	color: #08132f;
	font: normal 100%/1.5 Arial, Helvetica, sans-serif;
	text-size-adjust: 100%; 
}

/* Ombrages */
.ombrage{
	box-shadow: 0 20px 15px #b0b0b0;	
	/* PIE - IE8 et moins */
    behavior: url(/wp-content/themes/psy1110/css/pie.htc);
}

.ombrageDoux{
	box-shadow: 0 5px 15px #dadada;
	
	/* PIE - IE8 et moins */
    behavior: url(/wp-content/themes/psy1110/css/pie.htc);
}

/* Particularités */
.impression{
	display: none;
}
img{
	display: block;
}

/* ==================================================
 * zoneEntete
 * ================================================== */

[role=banner]{
	height: 60px;
	/*background-color: #000;*/
}

#identite{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#bae0e2+0,72bfcf+25,ecfef2+50,72bfcf+75,bae0e2+100 */
	background: #bae0e2; /* Old browsers */
	background: -moz-linear-gradient(left, #bae0e2 0%, #72bfcf 25%, #ecfef2 50%, #72bfcf 75%, #bae0e2 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #bae0e2 0%,#72bfcf 25%,#ecfef2 50%,#72bfcf 75%,#bae0e2 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #bae0e2 0%,#72bfcf 25%,#ecfef2 50%,#72bfcf 75%,#bae0e2 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bae0e2', endColorstr='#bae0e2',GradientType=1 ); /* IE6-9 */
	height: 60px;	
	margin: 0 auto;
	overflow: auto;
	text-align: right;
	width: 958px;
}

#identite a{
	display: inline-block;
	margin: 2px 2px 0 0;
}

/* ==================================================
 * conteneurs
 * ================================================== */

#zoneConteneur{
	background: url("img/structure/bgZoneMilieu.jpg") repeat-y;
	overflow: auto;
	border: 1px solid #000;
}

/* Liens */
#zoneConteneur a:link, 
#zoneConteneur a:visited{
	text-decoration: none;
}

/* Faux colonnes */
#zoneMilieuPage{
	background: url("img/structure/bgMenu.png") left bottom no-repeat;
	width: 958px;
}

/* ==================================================
 * zoneHautPage
 * ================================================== */
#zoneHautPage{
	background: url("img/structure/bandeau.jpg") no-repeat top left;
	height: 225px;
	width: 958px;
}

#zoneHautPage h1{
	height: 227px/*262px*/;
	font-size: 1.125em; /* 18px/16px */
	line-height: 1;
	margin: 0;
}

#zoneHautPage h1 a:link, 
#zoneHautPage h1 a:visited{
	color: #fff;
	display: block;
	height: 195px;
	margin: 0 0 0 270px;
	padding: 76px 0 3px;
	width: 360px;
}

#zoneHautPage h1 span{
	color: #fff;
	display: none;
	font-size: 1em; /* 18px/18px */
	line-height: 1;
	margin: 5px 10px 0 0;
}

/* ==================================================
 * zoneInformative
 * ================================================== */

#zoneInformative{
	color: #818181;
	font-size: .750em; /* 12px/16px */
	line-height: 1.25; /* 15px/12px */
	margin: 0;
	padding: 5px 20px 5px 0;
	overflow: auto;
}

#zoneInformative p.infoConnection{
	float: right;
	width: auto;
}

#zoneInformative a:link, 
#zoneInformative a:visited{
	text-decoration: underline;
	color: #818181;
}

#zoneInformative a:hover, 
#zoneInformative a:active{
	text-decoration: none;
}

/* ==================================================
 * zoneMenu
 * ================================================== */

#zoneMenu{
	padding: 0 12px 80px 0;
}

#zoneMenu ul {
	margin: 5px 20px 20px;
}

#zoneMenu ul ul{
	list-style-type: disc;
}

.menu-item-has-children >a:link:after{
	content: "+";
	float: right;
}

.menu-item-has-children.selectionne >a:link:after{
	content: "-";
}

.menu li.current_page_item >a:link,
.menu li.current_page_item >a:visited{
	color: #F00;
}

.sous_menu {
	margin-left: 15px;
}

.parent_item, 
.titre {
    list-style: none;
}

.titre {
	margin-top: 5px;
}

.widget_nav_menu h3 {
    background-color: #000;
    color: #fff;
    font-size: .8em;
    letter-spacing: 2px;
    padding-left: 20px;
    text-transform: uppercase;
}

/* Item "Version PDF du site" traité différemment */
.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-227 {
    line-height: 16px;
    padding-top: 20px;
}

.menu {
    list-style: none;
    line-height: 25px;
    margin-top: 10px;
}

.menu a{
	color: #000;
	display: block;
}

.menu a:active{
	color: #790000;
}

.menu a:hover{
	color: #39b4c1;
}

/* ==================================================
 * zoneContenu
 * ================================================== */

#zoneContenu{
	width: 700px;
}

#contenu{
    background-color: #fff;
    color: #08132f;
    font-size: 15px;
	line-height: 24px;
    min-height: 420px;
    margin: 10px;
    padding: 16px 10px 20px 18px;
}

#contenu.pleineLargeur{
	padding: 25px 20px 30px;
}

/* Titres */
#contenu h1{
	font-size: 1.45em; /* 20px/14px */
	line-height: 1;
	margin: 0 0 10px;
	padding: 0 0 8px;
}

#contenu h2{
	color: #061431;
	font-size: 1.25em; /* 18px/14px */
	line-height: 1.083; /* 26px/24px */
	margin: 30px 0 3px;
	padding: 0;
}

#contenu h3{		
	color: #061431;
	font-size: 1.11em; /* 16.5px/14px */
	line-height: 1.222222222222222; /* 22px/18px */
	font-style: normal;
	/*font-weight: 600;*/
	margin: 25px 0 5px;
	padding: 0;
}

#contenu h4{
	color: #061431;
	font-size: 1.1em; /* 16px/14px */
	font-style: italic;
	/*font-weight: 600;*/	
	line-height: 1.250; /* 20px/16px */
	margin: 15px 0 5px 0;
	padding: 0;
}

/* Notes de bas de page */
hr{
	background-color: #ccc;
	height: 1px;
	margin: 40px 0 8px;
	width: 50%;
}

#contenu .note{
	color: #666;
	font-size: .857em; /* 12px/14px */
}

/* Contenu texte */
#contenu p,
.tooltipster-content p{
	margin: 0 0 8px;
	color: #08132f;
}

#contenu strong,
.tooltipster-content strong{
	font-weight: 700;
}

#contenu p.sansMarge,
.tooltipster-content p.sansMarge{
	margin: 0 0 5px;	
}
#contenu p.note{
	font-size: 0.857em; /* 12px/14px */
	line-height: 1.333333333333333; /* 16px / 12px */
	color: #87888A;
}
#contenu p.source{
	font-size: 0.857em; /* 12px/14px */
	line-height: 1.333333333333333; /* 16px / 12px */
	color: #87888A;	
}
#contenu sup{
	font-size: 0.714em; /* 10px/14px */
	/*vertical-align: top;*/
	margin: 0 0 0 2px;
}
#contenu blockquote{
	margin: 0 0 0 15px;
}

#contenu a:link, 
#contenu a:visited,
.tooltipster-content a:link,
.tooltipster-content a:visited{
	color: #3a9ebd;
	text-decoration: underline;
}

#contenu a:hover, 
#contenu a:active,
.tooltipster-content a:hover,
.tooltipster-content a:active{
	color: #790000;
	text-decoration: none;
}

#contenu a.infobulle{
	border-bottom: 1px dotted #3e3e3e;
	text-decoration: none;
}

#contenu .contenuInvisible{
	display: none;
}

#contenu .alignGauche{
	float: left;
	width: auto;
}

#contenu .alignDroite{
	float: right;
	width: auto;
}

/* Icône de liens externes
Note : remplacer le lien d'exclusion par celui de votre projet */
#contenu a[href^="http://"]:after, 
#contenu a[href^="https://"]:after,
#contenu a[href^="mailto:"]:after{
	margin: 0 0 0 2px;
	content: url("img/structure/wpmsgab_ico_liensext.png");
}

#contenu a[href^="https://psy1110.teluq.ca/"]:after,
#contenu a[href^="https://psy1110.teluq.ca/"]:after,
#contenu a[href^="#"]:after{
	display: none;
}

/* Listes ordonnées et non-ordonnées */
#contenu ul{
	margin: 0 0 15px 15px;
	list-style-type: disc;
}

#contenu ul li,
#contenu ol li{
    margin: 0 0 3px;
}

#contenu ul.grandeMarge li{
    margin: 0 0 15px;
}

#contenu ul li p,
#contenu ol li p{
    margin: 5px 0;
}

#contenu ol{
	margin: 0 0 15px 20px;
}

#contenu ol.margeNombres{
	margin: 0 0 15px 25px;
}

#contenu ul.sansMarge,
#contenu ol.sansMarge{
    margin-bottom: 5px;
}

#contenu ol.listeLettre{
    list-style-type: lower-latin;
}

#contenu ol.references{
	list-style-image: none;
	list-style-type: none;
	margin: 0 0 0 20px;
}

#contenu ol.references li{
	font-size: 0.857em; /* 12px/14px */
	margin: 0 0 10px;
	text-indent: -20px;
}

#contenu ol.lettre-parenthese{ 
	counter-reset: list;
}

#contenu ol.lettre-parenthese >li {
	list-style: none;
}

#contenu ol.lettre-parenthese >li:before{
	content: counter(list, lower-alpha) ") ";
	counter-increment: list;
	float:left;
	margin-left: -1.5em;
}

/* Images */
#contenu img{
	margin: 5px 10px 15px 0;
}

.encadre {
	border: 1px solid #ccc;
	margin: 10px 0;
	padding: 10px;
}

#contenu a.bouton {
    border: 1px solid #d20707;
    padding: 3px 20px 5px;
}

#contenu a[href^="https://"].bouton:after{
	display: none;
}

caption {
	font-weight: 700;
	text-align: center;
}

table .vide{
	border: none;
}

th .bgCol1 {
	background-color: #c45911;
}

td .bgCol1 {
	background-color: #f7caac;
}

th .bgCol2 {
	background-color: #385623;
}

td .bgCol2 {
	background-color: #e2efd9;
}

th .bgCol3 {
	background-color: #44546a;
}

td .bgCol3 {
	background-color: #d5dce4;
}

.bgReponse {
    background-color: #ccc;
    margin: 5px;
    padding: 5px;
}

/* Tableaux */
#contenu table{
	margin: 0 0 15px;
	width: 100%;
}

#contenu table.sansMarge{
	margin: 0 0 5px;
}

#contenu table thead tr td{
    background-color: none;
    border: none;
}

#contenu table tr th{
    background-color: #a9d6e0;
    border: 1px solid #1999a0;
    color: #000;
    padding: 5px 15px;
    text-align: center;
}

#contenu table tr th img{
	margin: 0 auto;
}

#contenu table.personnages thead tr th{
	background: #000;
    border: 1px solid #fff;
	color: #fff;
}

#contenu table tr td{
	border: 1px solid #929596;
	padding: 5px;
}

#contenu table .alignementCentre{
	text-align: center;
}
#contenu table .colonneEmphase{
	background-color: #e9f1e4;
}

/* Largeurs de tableaux */
#contenu table.largeurDemi{
	width: 50%
}
#contenu table.largeurTroisQuarts{
	width: 75%
}

/* Largeurs de colonnes */
#contenu table .largeurDemi{
	width: 50%
}

#contenu table .largeurTier{
	width: 33%
}

#contenu table .largeurVingtieme{
	width: 33%
}

#contenu table .largeurDixieme{
	width: 10%
}

/* Tableaux : contenus */
#contenu table p,
#contenu table ul,
#contenu table ol{
	margin-bottom: 5px;
}

/* Navigation entre les articles (résultats de recherche) */
#contenu #navigArticle ul{
	list-style-type: none;
}

/* ==================================================
 * zoneBasPage
 * ================================================== */

/* Contenu du bas de page */
[role=contentinfo]{
	background-color: #000;
    font-size: .75em;
    line-height: 2.5;
	width: 100%!important;
}

[role=contentinfo] ul {
	float: right;
    text-align: center;
}

[role=contentinfo] li {
    display: inline;
    padding: 0 10px;
}

[role=contentinfo] #copyright{
	color: #fff;
	text-align: center;
}

[role=contentinfo] a:link, 
[role=contentinfo] a:visited{
	color: #fff;
	text-decoration: none;
}

[role=contentinfo] a:active,
[role=contentinfo] a:hover,
[role=contentinfo] a:focus{
	text-decoration: underline;
}


/* ==================================================
 * infobulles
 * ================================================== */

.infobulleGris{
	background-color: #e2e2e2;
	box-shadow: 0 5px 10px #d2d2d2;
	
	/* PIE - IE8 et moins */
    behavior: url("/wp-content/themes/psy1110/css/pie.htc");
}

.tooltipster-content{
	padding: 10px;
	font-size: 14px; /* Tooltipster ne supporte que l'unité absolue px */
	line-height: 1.429; /* 20px/14px */
	color: #3e3e3e;
}

.infobulleGris .tooltipster-content :last-child{
	margin-bottom: 0;
}

/**************************************/

a.btnRetourHaut {
	position:fixed;
	bottom: 0;
	right: 1.5em;
	display:none;
	background-color:rgba(58,103,98,.4);
	border: none;
	height: 40px;
	width: 40px;
	overflow: hidden;
	padding: 0;
	margin-top: .95em;
	text-align: center;
	border-radius:100%/100%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	text-decoration:none!important;
}
a.btnRetourHaut:hover, 
a.btnRetourHaut:focus{
	background-color:rgba(58,103,98,1);
}

a.btnRetourHaut:before{
	font-family: "Genericons";
    font-weight: 700;
	font-size:2em;
	color: #fff!important;
	content: '\f432';
	line-height: 40px;
	width: 40px;
	display: block;
}


/* ==================================================
 * panneaux
 * note : le panneau d'actualités est caché par défaut.
 * ================================================== */

/* Boutons d'accès */
a.btnPanneau{
	position: fixed;
	right: -95px;
	display: block;
	z-index: 11;
	width: 130px;
	padding: 12px 0 12px 40px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 0.6875em; /* 11px/16px */
	font-weight: 700;
	text-decoration: none;
	background-color: #999999;
	color: #fff;
    outline: none;
    
    /* Coins arrondis */
	border-radius: 15px 0 0 15px;

	/* Gradients */
	background-image: linear-gradient(to right, #59595A, #999999);
	
	behavior: url("/wp-content/themes/psy1110/css/pie.htc"); /* IE8 et moins */
}

a.btnPanneau span.img{
	background-repeat: no-repeat;
	height: 28px; 
	left: 7px; 
	position: absolute; 
	top: 7px; 
	width: 28px; 
}

a.active.btnPanneau span.img{
	background-image: url("img/modules/panneaux/minus.png")!important;
	left: 12px; 
	top: 12px; 
}

/* Boutons d'accès spécifiques */
a#btnPanneauRecherche{
	top: 245px;
}

a#btnPanneauRecherche span.img	{
	background-image:url("img/modules/panneaux/ico_recherche.png");
}

/* Panneaux */
.panneau{
	position: fixed;
	right: 0;
	display: none;
	z-index: 10;
	padding: 20px 150px 20px 20px;
	background: #000;

    /* Coins arrondis */
	border-radius: 20px 0 0 20px;
	
	behavior: url("/wp-content/themes/psy1110/css/pie.htc"); /* IE8 et moins */
}

/* Contenus des panneaux */
.panneau h3{
	margin: 0 0 5px 0;
	font-size: 1.00em; /* 16px */
	color: #fff;
}
.panneau p{
	margin: 0 0 15px 0;
	padding: 0;
	font-size: 0.8125em; /* 13px/16px */
	line-height: 1.385; /* 18px/13px */
	color: #fff;
}
.panneau a{
	text-decoration: none;
	color: #fff;
}
.panneau a:hover{
	margin: 0;
	padding: 0;
	text-decoration: none;
	border-bottom: 1px solid #fff;
	color: #fff;
}

/* Panneaux spécifiques */
#panneauRecherche	{
	top: 230px; 
	width: 570px;
}

/* Styles pour le contenu du panneauRecherche */
#panneauRecherche input[type="text"]{
	width: 70%;
	min-height: 25px;
	margin: 0;
	padding: 0 5px 0 5px;
	margin-bottom: 0;
	outline: none;
	border: 1px solid #ccc;
	border-radius: 2px;
	background: #fff;
	color: #191919;
}

#panneauRecherche #lancerRecherche{
	width: 25%;
	margin: 0 0 0 5px;
	min-height: 25px;
	background-color: #fff;
	border: none;
	color: #000;
	cursor: pointer;
}

#panneauRecherche #lancerRecherche:hover{
	background-color: #2e8804;
	color: #fff;
}

/* ==================================================
 * outils
 * ================================================== */

/* Image replacement */
.ir{
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}
.ir:before{
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden{
    display: none !important;
    visibility: hidden;
}

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden{
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus{
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/* Hide visually and from screenreaders, but maintain layout */
.invisible{
    visibility: hidden;
}


/* ==================================================
 * impression
 * note : changer le contenu (content) des liens internes
 * pour l'adresse complète du site correspondant (ci-dessous).
 * ================================================== */

@media print{
	/* Généralités */
	/* basées sur les normes d'impression CSS d'HTML5 Boilerplate */
	*{
		background: transparent !important;
		color: #000 !important;
		box-shadow: none !important;
		text-shadow: none !important;
	}
	
	body{
		min-width: 100%;
	}
	
	a,
	a:visited{
		text-decoration: underline;
	}
	
	pre,
	blockquote{
		border: 1px solid #999;
		page-break-inside: avoid;
	}
	
	thead{
		display: table-header-group; /* h5bp.com/t */
	}
	
	tr,
	img{
		page-break-inside: avoid;
	}
	
	img{
		max-width: 100% !important;
	}
	
	@page{
		margin: 1cm;
	}
	
	p,
	h2,
	h3{
		orphans: 3;
		widows: 3;
	}
	
	h2,
	h3,
	h4,
	h5{
		page-break-after: avoid;
	}

	/* Conteneurs principaux */
	[role=banner], 
	#identite, 
	#zoneHautPage, 
	#zoneConteneur, 
	#zoneMilieuPage,
	#zoneContenu, 
	#contenu, 
	#contenu.pleineLargeur, 
	[role=contentinfo]{
		display: block;
		float: none;
		width: 100%;
		height: auto;
		margin: 0;
		padding: 0;
		border: none;
		overflow: none;
	}
	
	#menuPrincipal, 
	#menuPrincipal, 
	#zoneMenu, 
	#identite img, 
	.infoConnection{
		display: none;
	}
	
	[role=banner]{
		margin: 0 0 15px;
	}
	
	#identite #logo{
		margin: 0;
	}
	
	#identite img.impression{
		display: block;
	}
	
	#zoneHautPage{
		margin: 0;
		padding: 0;
	}
	
	/* Titre du cours (à cacher si non-désiré dans la version imprimée) */
	#zoneHautPage h1{
		height: auto;
		margin: 0 0 20px;
		padding: 0;
		font-size: 1.25em; /* 20px/16px */
		line-height: 1.5; /* 24px/16px */
		border-bottom: solid 1px #ccc;
	}
	
	#zoneHautPage h1 a:link{
		display: inline;
		margin: 0;
		padding: 0;
	}
	
	#zoneHautPage h1 span{
		font-size: inherit;
		line-height: inherit;
		display: inline;
	}
	
	#zoneHautPage h1 span:before{
		content: " - ";
	}
	
	/* Contenu : affichages des liens internes */
	#contenu a:after{
		content: " (https://psy1110.teluq.ca/" attr(href)")";
	}
	
	/* Contenu : affichages des liens externe (sécurisés ou non) et des adresses de courriel */
	#contenu a[href^="http://"]:after,
	#contenu a[href^="https://"]:after,
	#contenu a[href^="mailto:"]:after{
		content: " ("attr(href)")";
	}
	
	/* Contenu : règles de non-affichage des liens */
	#contenu a[href^="javascript:"]:after,
	#contenu a[href^="#"]:after,
	#contenu a.nlp:after{
		display: none;
	}
	
	#contenu a{
		word-wrap: break-word;
	}		
	
	/* Bas de page */
	[role=contentinfo]{
		margin: 35px 0 0;
		border-top: solid 1px #ccc;
	}
	
	[role=contentinfo] #copyright{
		text-align: left;
	}
	
	/* Panneaux d'outils */
	.panneau{
		display: none;
	}
	
	a.btnPanneau{
		display: none;
	}
}