/*
File:			mystyles.css
Description:	CSS custom pour le template de Groupe SDA.3

USAGE:
ajoutez le préfixe .custom à vos styles pour :
	.custom a, .custom a:visited { color: #090; }	<--- This makes links green
	.custom a:hover { color: #00f; }	<--- This makes links blue when you mouse over them

Pourquoi???
On ajoute la spécification de ne modifier que les styles «custom».


/* #Basic Styles
================================================== */
	body {
		/*background: url('img/motif-bkg.jpg') repeat top left;*/
		background: none repeat scroll 0 0 transparent;
		font-size:16px;
		line-height:24px;
		color:rgb(0,0,0);
		font-family:'Roboto Condensed', "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
		font-style:normal;
		font-weight:300;
		text-outline:none;
	}
   
/* #Typography
================================================== */

	h1 { font-family:'Roboto', "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size:40px; line-height:54px; margin-bottom:24px; font-weight:900; text-transform:uppercase; }
	h2 { font-family:'Roboto', "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size:30px; line-height:40px; margin-bottom:24px; font-weight:900; text-transform:uppercase; }
	h3 { font-family:'Roboto Condensed', "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size:24px; line-height:32px; margin-bottom:16px; font-weight:400; }
	h4 { font-family:'Roboto Condensed', "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size:20px; line-height:28px; margin-bottom:16px; font-weight:400; }
	h5 { }
	
	p { }
		
	p img { }
	em { }
	
	ul { margin:0px; padding:0px; }
	
	li { list-style:none; }


/* #COMMON
================================================== */

	strong, .bold {
		font-weight:900;
	}
	
	em { font-style:italic; }
	
	#loader {
		display:block;
		position:fixed;
		top:0;
		width:100%;
		background-color:white;
		height:100%;
		text-align:center;
		margin:0;
		padding:0;
		overflow:hidden;
		z-index:1999;
	}
	
	#loader .loader-img {
		position:absolute;
		height:120px;
		width:35px;
		top:50%;
		left:50%;
		margin-top:-40px;
		margin-left:-40px;		
	}
	
	img.loader {
		z-index:1500;
		opacity: 1;		
	}
	
	.slide-dark {
		position:absolute;
		top:0px;
		left:0px;
		width:100%;
		height:100%;
		background-color:rgba(0,0,0,0.4);
		z-index:50;
	}
	
	.bouton {
		position:relative;
		display:block;
		margin-top:30px;
	}
	
	.contenu-texte {
		position:relative;
		z-index:100;
	}
	
	#trololo {
		position:relative;
		display:block;
		width:100%;		
		padding:0px;
		margin:0px;
		margin-top:60px;
		background-size: cover !important;		
		/* The url is relative to the document, not to the css file! */
		/* Prefer absolute urls to avoid confusion. */
		-ms-behavior: url(http://t3pconstruction.sda3.ca/wp-content/themes/sda3/css/backgroundsize.min.htc);
	}
	
	.contenu {
		position:relative;
		display:block;
		padding:20px;
	}
	

/* #Images
================================================== */

	img.scale-with-grid {
		max-width: 100%;
		height: auto; }
		

/* #NAVBAR
================================================== */
	
	nav.navbar, nav.navbar .navbar-header, nav.navbar .navbar-collapse, nav.navbar .navbar-nav {
		height:125px;
	}
	
	nav.navbar {
		background:none;
		background-color:rgb(255,255,255);
		box-shadow:none;
		border:none;
		border-radius:0px;
		margin:0px;
	}
	
	.navbar-brand {
		width:375px;
		height:125px;
		padding:30px;
		margin-left:0px;
	}
	
	nav #main-menu a {
		color:rgb(0,0,0);;
		text-transform:uppercase;
		font-weight:700;
		text-shadow:none;
		padding:0px;
		padding-top:55px;
		margin-right:35px;
		border-bottom:4px solid rgb(255,255,255);
		/*TRANSITION*/
		-webkit-transition: all 0.5s ease-in-out;
		-khtml-transition:  all 0.5s ease-in-out;
		-moz-transition:    all 0.5s ease-in-out;
		-o-transition:      all 0.5s ease-in-out;
		transition:         all 0.5s ease-in-out;
	}
	
	nav #main-menu a:hover, nav #main-menu .current-menu-item a:hover, nav #main-menu .current-menu-item a {
		border-bottom:4px solid rgb(236,28,35);
		/*TRANSITION*/
		-webkit-transition: all 0.5s ease-in-out;
		-khtml-transition:  all 0.5s ease-in-out;
		-moz-transition:    all 0.5s ease-in-out;
		-o-transition:      all 0.5s ease-in-out;
		transition:         all 0.5s ease-in-out;
	}
	
	
/* #MAIN
================================================== */	

	#main { 
		position:relative;
		display:block;
		width:100%;
		padding:0px 30px 30px 30px;	
	}
	
/* #ACCUEIL
================================================== */	
	
	#intro-creations .slide-text {
		position:relative;
		margin-top:20%;
		z-index:100;
	}
	
	#intro-creations .slide-text h1, #intro-creations .slide-text h2, #intro-creations .slide-text h3, #intro-creations .slide-text h4, #intro-creations .slide-text h5, #intro-creations .slide-text p, #intro-creations .slide-text a {
		color:rgb(255,255,255);
		text-shadow: 0px 2px 2px rgba(0,0,0,0.85);		
	}
	
	#intro-creations .slide-text h1 {
		margin-bottom:0px;
	}
	
	#intro-creations .slide-text h3.big {
		text-transform:uppercase;
		margin-top:0px;
	}
		
	#intro-creations .slide-text a {
		font-weight:400;
		padding:10px 20px;
		text-transform:uppercase;
		border:1px solid rgb(255,255,255);
		background-color:transparent;
		/*TRANSITION*/
		-webkit-transition: all 0.5s ease-in-out;
		-khtml-transition:  all 0.5s ease-in-out;
		-moz-transition:    all 0.5s ease-in-out;
		-o-transition:      all 0.5s ease-in-out;
		transition:         all 0.5s ease-in-out;
	}
	
	#intro-creations .slide-text a:hover {
		text-decoration:none;
		background-color:rgb(236,28,35);
		/*TRANSITION*/
		-webkit-transition: all 0.5s ease-in-out;
		-khtml-transition:  all 0.5s ease-in-out;
		-moz-transition:    all 0.5s ease-in-out;
		-o-transition:      all 0.5s ease-in-out;
		transition:         all 0.5s ease-in-out;
	}

/* PAGE PROFIL - #INTRO-PROFIL
================================================== */

	#intro-profil {
		background-color:rgb(0,0,0);
		padding:160px 0px;
	}
	
	#intro-profil h1, #intro-profil h2, #intro-profil h3, #intro-profil h4, #intro-profil h5, #intro-profil p, #intro-profil a, #intro-profil li {
		color:rgb(255,255,255);
		margin:0px;
		font-weight:100;
		text-transform:none;
	}
	
	#intermede {
		position:relative;
		display:block;
		width:100%;		
		background-color:rgb(0,0,0);
		padding:160px 0px;
		background-size: cover !important;
		background-attachment:fixed !important;
		/* The url is relative to the document, not to the css file! */
		/* Prefer absolute urls to avoid confusion. */
		-ms-behavior: url(http://t3pconstruction.sda3.ca/wp-content/themes/sda3/css/backgroundsize.min.htc);		
	}
	
	#intermede h1, #intermede h2, #intermede h3, #intermede h4, #intermede h5, #intermede p, #intermede a, #intermede li {
		color:rgb(255,255,255);
		margin:0px;
		font-weight:100;
		text-align:center;
		text-transform:none;
		text-shadow: 0px 2px 2px rgba(0,0,0,0.85);
	}
	
/* PAGE PROFIL - #PROFIL-CONTENT
================================================== */

	#profil-content {
		position:relative;
		display:block;
		width:100%;		
		background-color:rgb(255,255,255);
		padding:160px 0px;
	}
	
	#profil-content h1, #profil-content h2, #profil-content h3, #profil-content h4, #profil-content h5, #profil-content p, #profil-content a, #profil-content li {
		font-weight:100;
		text-transform:none;
		text-align:center;
	}
	
/* PAGE PROFIL - #BLOC-NOUS-JOINDRE
================================================== */
	
	#bloc-nous-joindre {
		position:relative;
		display:block;
		width:100%;		
		background-color:rgb(0,0,0);
		padding:160px 0px;
		background-size: cover !important;
		background-attachment:fixed !important;
		/* The url is relative to the document, not to the css file! */
		/* Prefer absolute urls to avoid confusion. */
		-ms-behavior: url(http://t3pconstruction.sda3.ca/wp-content/themes/sda3/css/backgroundsize.min.htc);
	}
	
	.chrome #bloc-nous-joindre {
		background-attachment: scroll !important;		
	}
	
	#bloc-nous-joindre a {
		display:block;
		text-align:center;
		color:rgb(255,255,255);
		padding:30px;
		border:1px solid rgb(255,255,255);
		font-family:'Roboto', "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
		font-size:30px;
		line-height:40px;
		font-weight:100;
		text-shadow: 0px 2px 2px rgba(0,0,0,0.85);
		background-color:transparent;
		/*TRANSITION*/
		-webkit-transition: all 0.5s ease-in-out;
		-khtml-transition:  all 0.5s ease-in-out;
		-moz-transition:    all 0.5s ease-in-out;
		-o-transition:      all 0.5s ease-in-out;
		transition:         all 0.5s ease-in-out;
	}
	
	#bloc-nous-joindre a:hover {
		text-decoration:none;
		background-color:rgb(236,28,35);
		/*TRANSITION*/
		-webkit-transition: all 0.5s ease-in-out;
		-khtml-transition:  all 0.5s ease-in-out;
		-moz-transition:    all 0.5s ease-in-out;
		-o-transition:      all 0.5s ease-in-out;
		transition:         all 0.5s ease-in-out;				
	}
	
/* PAGE RÉALISATIONS - #INTRO-REALISATION
================================================== */
	
	#intro-realisation {
		position:relative;
		display:block;
		width:100%;		
		background-color:rgb(0,0,0);
		padding:160px 0px;
		background-size: cover !important;
		background-attachment:fixed !important;
		/* The url is relative to the document, not to the css file! */
		/* Prefer absolute urls to avoid confusion. */
		-ms-behavior: url(http://t3pconstruction.sda3.ca/wp-content/themes/sda3/css/backgroundsize.min.htc);
	}
	
	#intro-realisation h1, #intro-realisation h2, #intro-realisation h3, #intro-realisation h4, #intro-realisation h5, #intro-realisation p, #intro-realisation a, #intro-realisation li {
		color:rgb(255,255,255);
		font-weight:100;
		text-transform:none;
		text-shadow: 0px 2px 2px rgba(0,0,0,0.85);
	}
	
	#masonry-realisations {
		position:relative;
		display:block;
		width:100%;
		max-width:1170px;
		margin-left:auto;
		margin-right:auto;
		margin-top:30px;
		background:rgb(255,255,255);
	}
	
	#masonry-container {
		position:relative;
		display:block;
		width:100%;
	}
	
	.masonry .item, .masonry .grid-sizer {		
		display: block;
		float: left;		
		width:  calc( ( 100% - 60px ) / 3 );
	}
		
	.masonry .item.w2 { width: calc( ( 100% - 60px ) * ( 2 / 3 ) + 30px ); }
	
	.masonry .item.w3 { width: 100%; }
	
	#masonry-container .item {
		margin-bottom: 30px;
	}	
	
	#masonry-container .contenu {
		border-top:1px solid rgb(66,66,66);
	}
	
	#masonry-container .contenu h3 {
		font-family:'Roboto', "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
		text-transform:uppercase;
	}
	
	#masonry-container .contenu h4 {
		font-family:'Roboto', "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
		font-weight:300;
	}
	
	#ajax-load-more, #ajax-load-more ul {
		height:100%;
	}
	
	#realisation-conclusion {
		position:relative;
		display:block;
		margin-top:100px;		
	}
	
	#realisation-conclusion .lignes {
		padding:30px 0px;
		border-top:1px solid rgb(33,33,33);
		border-bottom:1px solid rgb(33,33,33);
	}
	
	#realisation-conclusion p {
		font-size:20px;
		line-height:30px;
		text-align:center;
	}
	
	#realisation-conclusion p {
		font-size:20px;
		line-height:30px;
		text-align:center;
	}
	
	#realisation-conclusion h2 {
		color:rgb(236,28,35);
		font-weight:100;
		font-style:italic;
		text-align:center;
		font-weight:900;
	}
	

/* #SOUMISSION
================================================== */

	#soumission-intro {
		position:relative;
		display:block;
		width:100%;		
		background-color:rgb(0,0,0);
		padding:120px 0px;
		background-size: cover !important;
		background-attachment:fixed !important;
		/* The url is relative to the document, not to the css file! */
		/* Prefer absolute urls to avoid confusion. */
		-ms-behavior: url(http://t3pconstruction.sda3.ca/wp-content/themes/sda3/css/backgroundsize.min.htc);
	}
	
	#soumission-intro h1 {
		font-size:60px;
		line-height:80px;
		color:rgb(255,255,255);
		text-shadow: 0px 2px 2px rgba(0,0,0,0.85);
	}
	
	#soumission-contenu {
		padding:60px 0px 120px 0px;
	}
	
	#soumission-contenu table p {
		margin-bottom:0px;
	}
	
	#soumission-contenu td {
		padding:10px 0px;
	}
	
	.pdftitle {
		color:rgb(0,0,0);
	}

	
	.pdf {
		display:block;
		padding:5px 0px;
		color:rgb(0,0,0);
	}


/* #PROJETS EN COURS
================================================== */

	#projetsencours-intro {
		position:relative;
		display:block;
		width:100%;		
		background-color:rgb(0,0,0);
		padding:120px 0px;
		background-size: cover !important;
		background-attachment:fixed !important;
		/* The url is relative to the document, not to the css file! */
		/* Prefer absolute urls to avoid confusion. */
		-ms-behavior: url(http://t3pconstruction.sda3.ca/wp-content/themes/sda3/css/backgroundsize.min.htc);
	}
	
	#projetsencours-intro h1 {
		font-size:60px;
		line-height:80px;
		color:rgb(255,255,255);
		text-shadow: 0px 2px 2px rgba(0,0,0,0.85);
	}
	
	#projetsencours-contenu {
		padding:60px 0px 120px 0px;
	}
	
	#projetsencours-contenu table p {
		margin-bottom:0px;
	}
	
	#projetsencours-contenu td {
		padding:10px 0px;
	}


/* #NOUSJOINDRE
================================================== */

	#nousjoindre-map {
		position:relative;
		margin-bottom:30px;
	}
	
	#nousjoindre-map .nousjoindre-info {
		position:absolute;
		top:60px;
		left:60px;
		display:block;
		padding:40px;
		background-color:rgb(0,0,0);
		background-color:rgba(0,0,0,0.85);
		z-index:100;
		box-shadow:	0px 2px 2px rgba(0,0,0,0.85);
	}
	
	#nousjoindre-map .nousjoindre-info p {
		color:rgb(255,255,255);
		margin-bottom:0px;
	}
	
	#nousjoindre-map .nousjoindre-info p.tel {
		margin-top:16px;		
	}
	
	#nousjoindre-map .nousjoindre-info a {
		color:rgb(255,255,255);
	}
	
	
	

/* #FOOTER
================================================== */
	
	footer {
		padding:0px 30px 30px 30px;
		display:block;
		font-size:12px;
		color:rgb(0,0,0);;
		text-align:right;
	}
	
	footer a {
		color:rgb(0,0,0);;
	}
	
	.accueil footer {
		padding:0px;
		position:absolute;
		bottom:2px;
		right:30px;		
		display:block;
		font-size:12px;
		color:rgb(0,0,0);;
	}
	
	
	

/* #Media Queries
================================================== */

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 1050px) {
	
	#intro-creations .slide-text {
		margin-top:10%;
	}
	
	.navbar-brand {
		width:220px;
		height:auto;
		padding:10px;
		margin-left:0px;
	}
	
	nav.navbar, nav.navbar .navbar-header, nav.navbar .navbar-collapse, nav.navbar .navbar-nav {
		height:60px;
	}
	
	nav #main-menu a {
		padding:25px 10px 11px 10px;
		font-size:14px;
		margin-right:0px;		
	}
	
	#main { 
		padding:0px 15px 15px 15px;	
	}
	
	.accueil #main { 
		padding:0px 30px 30px 30px;	
	}
	
	.masonry .item, .masonry .grid-sizer {		
		width:  calc( ( 100% - 30px ) / 2 );
	}
		
	.masonry .item.w2 { width:  calc( ( 100% - 60px ) / 3 ); }
	
	.masonry .item.w3 { width:  calc( ( 100% - 60px ) / 3 ); }
	
	#masonry-container .item {
		margin-bottom: 30px;
	}
	
}


/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
	body {
		font-size:12px;
		line-height:18px;		
	}
	
	h1 { font-size:24px; line-height:34px; margin-bottom:16px; }
	h2 { font-size:20px; line-height:30px; margin-bottom:16px; }
	h3 { font-size:16px; line-height:24px; margin-bottom:12px; }
	h4 { font-size:12px; line-height:18px; margin-bottom:12px; }
	
	.navbar-brand {
		width:220px;
		height:auto;
		padding:10px;
		margin-left:0px;
	}
	
	nav.navbar, nav.navbar .navbar-header, nav.navbar .navbar-collapse, nav.navbar .navbar-nav {
		height:60px;
	}
	
	nav.navbar .navbar-collapse, nav.navbar .navbar-nav {
		height:100%;
		background-color:rgb(255,255,255);
		z-index:1000;
		position:relative;
	}
	
	nav #main-menu a {
		padding:15px 30px;		
	}
	
	#intro-creations .slide-text {
		margin-top:0%;
	}
	
	.bouton {
		margin-top:20px;
	}
	
/* PAGE PROFIL - #INTRO-PROFIL
================================================== */

	#intro-profil {
		padding:30px 0px;
	}
	
	#intro-profil img {
		margin-bottom:12px;
	}
	
	#intro-profil h1, #intro-profil h2, #intro-profil h3, #intro-profil h4, #intro-profil h5, #intro-profil p, #intro-profil a, #intro-profil li {
		text-align:center;
	}
	
	#intermede {
		padding:60px 0px;
		background-attachment:scroll !important;			
	}
	
/* PAGE PROFIL - #PROFIL-CONTENT
================================================== */

	#profil-content {
		padding:30px 0px;
	}
	

/* PAGE PROFIL - #BLOC-NOUS-JOINDRE
================================================== */
	
	#bloc-nous-joindre {
		padding:40px 0px;
		background-attachment:scroll !important;		
	}
	
	#bloc-nous-joindre a {
		font-size:20px;
		line-height:30px;
	}
	
/* #SOUMISSION
================================================== */

	#soumission-intro {
		padding:40px 0px;		
		background-attachment:scroll !important;
	}
	
	#soumission-intro h1 {
		font-size:30px;
		line-height:40px;	
	}
	
	#soumission-contenu {
		padding:30px 0px;
	}
	

/* #PROJETS EN COURS
================================================== */

	#projetsencours-intro {
		padding:40px 0px;	
		background-attachment:scroll !important;	
	}
	
	#projetsencours-intro h1 {
		font-size:30px;
		line-height:40px;
	}
	
	#projetsencours-contenu {
		padding:30px 0px;
	}		

/* PAGE RÉALISATIONS
================================================== */
	
	#intro-realisation {
		padding:40px 0px;
		background-attachment:scroll !important;		
	}
	
	.masonry .item, .masonry .grid-sizer {		
		width: 100%;
	}
		
	.masonry .item.w2 { width: 100%; }
	
	.masonry .item.w3 { width: 100%; }
	
	#masonry-container .item {
		margin-bottom: 30px;
	}

/* #NOUSJOINDRE
================================================== */

	#nousjoindre-map {
		margin-bottom:15px;
	}
	
	#nousjoindre-map .responsive-map {
		height:300px !important;
	}
	
	#nousjoindre-map .nousjoindre-info {
		position:relative;
		top:0px;
		left:0px;
		display:block;
		padding:15px;
		margin-bottom:15px;
		background-color:rgb(0,0,0);
		box-shadow: none;
	}
	
	#nousjoindre-map .nousjoindre-info p {
		color:rgb(255,255,255);
		margin-bottom:0px;
	}
	
	#nousjoindre-map .nousjoindre-info p.tel {
		margin-top:16px;		
	}
	
	#nousjoindre-map .nousjoindre-info a {
		color:rgb(255,255,255);
	}
	


/* FOOTER
================================================== */
	
	footer {
		font-size:10px;
		padding:15px;
	}
	
}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
	#intro-creations .slide-text {
		margin-top:20%;
	}
	
}





/* ACTIVIS - PAGE DETAILS SOUMISSION
================================================== */
#soumissiondetails-contenu{
	margin-bottom:40px;
}
#soumissiondetails-contenu ul li + li {margin-top: 20px;}
#soumissiondetails-contenu ul {padding-left: 30px;}
#soumissiondetails-contenu .contenu > h3 {
	border-top: 1px solid rgb(133,133,133);
	border-bottom: 1px solid rgb(133,133,133);
	font-size:  16px;
	font-weight:900;
}
/* Left-right columns 
#soumissiondetails-contenu > .container > .row {
	display:  inline-block;
	vertical-align:  top;
}
#soumissiondetails-contenu > .container > .row.w66 {width: 66%;}
#soumissiondetails-contenu > .container > .row.w33 {width: 33%;}
#soumissiondetails-contenu > .container > .row.rgt {float: right;}
#soumissiondetails-contenu > .container > .row.w33 .contenu {
	padding-top: 0;
	padding-right:  0;
}
#soumissiondetails-contenu > .container > .row.w33 .contenu > h3 {margin-top: 0;}
@media only screen and (max-width: 767px){
	#soumissiondetails-contenu > .container > .row{display:block;}
	#soumissiondetails-contenu > .container > .row.w66,
	#soumissiondetails-contenu > .container > .row.w33{
		width:auto;
	}
	#soumissiondetails-contenu > .container > .row.rgt{float:none;}
	#soumissiondetails-contenu > .container > .row + .row{margin-top:30px;}
}*/
/* icons */
#soumissiondetails-contenu .fichier {
	color: #000;
	position:relative;
	padding-left:40px;
	line-height:1em;
	min-height:32px;
	width:100%;
	display:table;
}
#soumissiondetails-contenu .fichier:hover{color:#2a6496;}
#soumissiondetails-contenu .fichier span{
	display:table-cell;
	vertical-align:middle;
}
#soumissiondetails-contenu .fichier.fas::before {
	position: absolute;
	top: 0;
	left: 0;
	width:30px;
	height:32px;
	font-size:32px;
	text-align:right;
	color:#000;
}
#soumissiondetails-contenu .fichier.fa-file-pdf::before{
	content:"";
	background: url('/wp-content/themes/sda3/images/pdf.png') no-repeat scroll 50% / 100% auto transparent;
}
.page-template-soumissionpage-template-php .post-password-form, .page-template-projetsencours-page-template .post-password-form{
	margin-top: 30px;
    text-align: center;
}