[hidden], 
.dn,.dn-sm			{ display: none; }
.dib				{ display: inline-block; }

.pr					{ position: relative; }
.bold				{ font-weight: bold;  }
.txt-left			{ text-align: left !important; }
.txt-center			{ text-align: center; }
.txt-right			{ text-align: right !important; }

.pl1				{ padding-left: 1rem !important; }
.pl2				{ padding-left: 2rem !important; }
.pl3				{ padding-left: 3rem !important; }
.pl4				{ padding-left: 4rem !important; }

.pt1				{ padding-top: 1rem !important; }
.pt3				{ padding-top: 3rem !important; }

.mb1				{ margin-bottom: 1rem; }
.mb2				{ margin-bottom: 2rem; }
.mb3				{ margin-bottom: 3rem !important; }
.mt1				{ margin-top: 1rem; }
.mt2				{ margin-top: 2rem !important; }
.mt3				{ margin-top: 3rem !important; }
.mlauto				{ margin-left: auto !important; }
.mrauto				{ margin-right: auto !important; }

.as-fs				{ align-self: flex-start !important;}

.overflow-hidden	{ overflow: hidden; }


@media screen and (max-width: 560px){
	.dn-xs, .dn-md	{ display: none !important; }
}
@media screen and (min-width: 560px){
	.w50-sm { width: 50%; }
	.p0-sm  { padding: 0; }
}
@media screen and (min-width: 560px) and (max-width: 767.9px)
{
	.dn-sm,.dn-md	{ display: none !important; }
}
@media screen and (min-width: 768px){
	.dn-xl  { display: none !important; }
}
@media screen and (min-width: 1060px){
	.mb4-xl { margin-bottom: 4rem !important; }
	.mb6-xl { margin-bottom: 6rem !important; }
}

/*
	Improved screen reader only CSS class
	@author Gaël Poupard
		@note Based on Yahoo!'s technique
		@author Thierry Koblentz
		@see https://developer.yahoo.com/blogs/ydn/clip-hidden-content-better-accessibility-53456.html
	* 1.
		@note `clip` is deprecated but works everywhere
		@see https://developer.mozilla.org/en-US/docs/Web/CSS/clip
	* 2.
		@note `clip-path` is the future-proof version, but not very well supported yet
		@see https://developer.mozilla.org/en-US/docs/Web/CSS/clip-path
		@see http://caniuse.com/#search=clip-path
		@author Yvain Liechti
		@see https://twitter.com/ryuran78/status/778943389819604992
	* 3.
		@note preventing text to be condensed
		author J. Renée Beach
		@see https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
		@note Drupal 8 goes with word-wrap: normal instead
		@see https://www.drupal.org/node/2045151
		@see http://cgit.drupalcode.org/drupal/commit/?id=5b847ea
	* 4.
		@note !important is important
		@note Obviously you wanna hide something
		@author Harry Roberts
		@see https://csswizardry.com/2016/05/the-importance-of-important/
*/

.sr-only {
	border: 0 !important;
	clip: rect(1px, 1px, 1px, 1px) !important; /* 1 */
	-webkit-clip-path: inset(50%) !important;
		clip-path: inset(50%) !important;  /* 2 */
	height: 1px !important;
	margin: -1px !important;
	overflow: hidden !important;
	padding: 0 !important;
	position: absolute !important;
	width: 1px !important;
	white-space: nowrap !important;            /* 3 */
}

/*
	Use in conjunction with .sr-only to only display content when it's focused.
	@note Useful for skip links 
	@see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
	@note Based on a HTML5 Boilerplate technique, included in Bootstrap
	@note Fixed a bug with position: static on iOS 10.0.2 + VoiceOver
		@author Sylvain Pigeard
		@see https://github.com/twbs/bootstrap/issues/20732
*/
.sr-only-focusable:focus,
.sr-only-focusable:active {
	clip: auto !important;
	-webkit-clip-path: none !important;
		clip-path: none !important;
	height: auto !important;
	margin: auto !important;
	overflow: visible !important;
	width: auto !important;
	white-space: normal !important;
}


/* COULEURS */
.txt-white { color: #fff !important; }
.txt-navy { color: #33324F !important; }
.txt-flesh  { color: #FDEFD5 !important; }
.txt-center { text-align: center !important; }

.bg-gray { background-color: #F6F6F6 !important; }
.bg-blue { background-color: #D5EAFD !important; }
.bg-navy { background-color: #33324F !important; }
.bg-white{ background-color: #FFFFFF !important; }
.bg-yellow { background-color: #FDEFD5 !important; }
.bg-bigout { background: linear-gradient(to bottom, #ffffff 0%,#ffffff 90%,#FFF 90%,#FDEFD5 90%,#FDEFD5 100%); }
@media screen and (min-width: 600px)
{
	.bg-bigout { background: linear-gradient(to bottom, #ffffff 0%,#ffffff 50%,#FFF 50%,#FDEFD5 50%,#FDEFD5 100%); }
}

.p0		 { padding: 0rem !important; }
.p1		 { padding: 1rem !important; }
.pt0	 { padding-top: 0 !important; }
.pb0	 { padding-bottom: 0 !important; }
.pb3	 { padding-bottom: 3rem !important; }
.pr0	 { padding-right: 0 !important; }

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

.unstyled-list {
	list-style: none;
    margin-left: 0;
    padding-left: 0;
}
.unstyled-link{
	text-decoration: none;
	color: inherit;
}

.aligned > * {
	display: inline-block;
	vertical-align: middle;
	margin-left: .5rem;
}
[class*=btn]{
	cursor: pointer;
}