/* #Page Styles
*  Override de certaines couleurs/grille et nouveaux styles
================================================== */

/* Ajustements grille et autres contenus site TÉLUQ */
.pageAbonnementInfolettre #Page { padding-bottom: 0; }

.pageEntete {
	background:url(../img/entetes/entete_abonn_infolettre.jpg) top center #000 no-repeat;
	/*background-size:cover;*/
	/*background-attachment:fixed;*/
	margin-bottom:0;
}
.pageEntete h1.titrePage {
	margin:30px 0 60px 0;
}
/*header h1 {
	height:120px;
	text-align:center;
}*/

#ContenuPrincipal {
	font-size: 1.071428571428571em; /* 15/14 */
	line-height: 1.4em;
}

.strate.sIntro ul,
.strate.sIntro ul.square {
	list-style-image: url("../img/puce_square3.png");
}

/* Strates */
.strate {
	padding:50px;
}

/* Texte d'intro/accroche */
.sIntro:after { top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(61, 61, 63, 0); border-top-color: #3d3d3f; border-width: 15px; margin-left: -15px; }
.sIntro {
	position:relative;
	background-color:#3d3d3f;
	color:#fff;
	font-size: 1.15384615em; /* 15/15 */
	line-height: 1.4em;
	padding-top:65px;
}
.sIntro .icoInfolettre {
	position:absolute;
	top:-46px;
	left:50%;
	margin-left:-46px;
	border-radius:50%;
	background-color:#fff;
}
.sIntro h2 {
	color:#fff;
	font-weight:400;
	font-size: 1.333333333333333em; /* 20/15 */
	line-height: 1.2em;
	text-transform:uppercase;
	margin-top:0;
	padding-left:25px;
}

/* Le formulaire */
.sFormulaire h2 {
	color:#2e8804;
	font-weight:400;
	font-size: 2.133333333333333em; /* 32/15 */
	line-height: 1.3em;
	text-transform:uppercase;
	text-align:center;
	margin:0 0 30px 0;
}
.sFormulaire input[type="text"],
.sFormulaire input[type="email"],
.sFormulaire input[type="text"]:focus,
.sFormulaire input[type="email"]:focus {
	border-top:0;
	border-left:0;
	border-right:0;
	border-radius:0;
	box-shadow:none;
	background-color:transparent;
}
.sFormulaire .small {
	font-size:0.8666666666666667em; /* 12/15 */
}



/*********************/
/* Le CSS responsive */
/*********************/

@media only screen and (max-width: 1024px) {
	.pageEntete {
		background:url(../img/entetes/entete_abonn_infolettre_medium.jpg) top center #000 no-repeat;
	}
}

/* #Tablet (Portrait)
================================================== */

/* Note: Design for a width of 768px */
@media only screen and (min-width: 768px) and (max-width: 959px) {
	
}


/*  #Mobile (Portrait)
================================================== */

@media only screen and (max-width: 767px) {	
	.strate {
		padding: 30px 20px;
	}
	
	.sIntro {
		padding-top:65px;
	}
	.sIntro h2 {
		padding-left:12px;
	}
}


/* #Mobile (Mini tablette)
================================================== */

@media only screen and (max-width: 599px) {
	
}


/* #Mobile (Landscape)
================================================== */

@media only screen and (max-width: 479px) {
	
}