/* --- FEUILLE DE STYLE --- */

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

	Saint-Contest // CSS
	NetConception 2021

	RESPONSIVE & MEDIA
	
//////////////////////////////////////////////////////////////////////////// */

@media (hover: hover) { /* the device can hover over elements */ }
@media (hover: none) { /* the device cannot hover over elements */ }

@media (min-width: 1921px) {

}

@media (max-width: 1441px) {
	/* XL: big landscape tablets, laptops, and desktops */
	.content .colored-title::after {
		width: 30px;
	}
}

@media (max-width: 1281px) {
	
	

	.header-actions:before {
		left: -100px;
		top: -3px;
		width: 150px;
		height: 150px;
	}
	
	.container {
		width: 100%;
		padding-left: 30px;
		padding-right: 30px;
	}
	.tools-side ul {
		padding: 2px;
	}
	.tools-side img {
		width: 24px;
	}
	.tools-side li+li::before {
		height: 1px;
		margin: 2px auto;
	}
	.tools-side .tooltip {
		left: -5px;
	}
	.col-2 > .document {
		width: calc(60% - 20px);
	}
	.col-2 > .other-documents {
		width: calc(40% - 20px);
	}
}

@media (max-width: 1024px) {
	
	
	.header-actions:before {
		display:none;
		/*
		left: 0px;
		top: -40px;
		width: 100px;
		height: 100px;
		/**/
	}
	
	.topbar:after  {
		  content: '';
		  position: absolute;
		  z-index: 1;
		  display: block;
		  left: 50%;
		  top:0px;
		  /*left: -160px;
		  top: -20px;/**/
		  width: 100px;
		  height: 100px;
		  background-image: url('../images/label.png');
		  background-size: contain;
		  background-position: center;
		  background-repeat: no-repeat;
	}
	
	.button-menu-resp {
		display: flex;
	}
	.acces-rapides__list {
		flex-wrap: wrap;
		justify-content: flex-start;
	}
	header.layout .acces-rapides {
		margin-top: 0;
	}
	.acces-rapides__item {
		flex: calc(25% - 10px);
		margin: 5px;
		width: calc(25% - 10px);
		max-width: calc(25% - 10px);
	}
	.acces-rapides__link {
		flex-direction: row;
		width: 100%;
		background-color: hsl(30deg 100% 90%);
		border-radius: 100px;
		border: 1px solid #EF7900;
	}
	.acces-rapides__link:hover {
		background-color: hsl(63, 100%, 90%);
		border-color: #C0CA00;
	}
	.acces-rapides__link .icon {
		width: 40px;
		height: 40px;
		margin: 0 5px 0 0;
	}
	.acces-rapides__link .label {
		text-align: left;
		padding-right: 5px;
	}
	.newsletter form,
	.newsletter .champs,
	.newsletter form label,
	.newsletter form input[type='email'],
	.newsletter form input[type='submit'] {
		display: block;
		width: 100%;
		max-width: 500px;
		text-align: center;
		margin-left: auto;
		margin-right: auto;
	}
	.newsletter form input[type='email'],
	.newsletter form input[type='submit'] {
		margin-top: 10px;
	}
	.footer-infos {
		flex-direction: column;
		justify-content: center;
		align-items: center;
		padding: 20px 40px 10px 40px;
	}
	.footer-infos > * + * {
		margin: 0;
	}
	.footer-adresse {
		width: 100%;
		text-align: center;
		max-width: unset;
	}
	.footer-links {
		width: 100%;
		text-align: center;
		max-width: unset;
		justify-content: center;
		padding: 0 40px;
	}
	.footer-rs {
		position: relative;
		z-index: 1;
		margin: 10px 0 0 0;
	}
	#documents .col-2 {
		flex-direction: column;
		margin: 0;
	}
	.col-2 > .document,
	.col-2 > .other-documents {
		width: 100%;
		max-width: 500px;
		margin-left: auto;
		margin-right: auto;
	}
	.document {
		padding: 10px 20px 10px 10px;
		background-color: #DFDFDF;
		border-radius: 10px;
	}
	
	.col-2 > * + * {
		margin-top: 20px;
	}
	
	.document .document__picture {
		max-width: 135px;
	}
}

@media (max-width: 801px) {
	
	
	/* M: portrait tablets, portrait iPad, e-readers (Nook/Kindle), landscape 800x480 phones (Android) */
	.acces-rapides__item {
		flex: calc(33.33% - 10px);
		margin: 5px;
		width: calc(33.33% - 10px);
		max-width: calc(33.33% - 10px);
	}
	.footer-infos::after {
		width: 100px;
		height: 108px;
	}
	.agenda-wrapper .calendrier-wrapper {
		width: 50%;
	}
	.agenda-wrapper.article-container .lSSlideOuter {
		max-width: 50%;
	}
	.title-bar h2::after {
		display: none;
	}
}

@media (max-width: 601px) {
	
	
	.topbar:after  {
		  right: 100px;
		  left:unset;
	}
	
	.header-bandeau:before{
		width: 82px;
		height: 84px;		
	}
	html::after{
		width: 100px;
		height: 105px;
		display:none;
	}
	
	/* XS: smartphones, portrait iPhone, portrait 480x320 phones (Android) */
	header.layout .acces-rapides {
		margin-bottom: 20px;
	}
	.acces-rapides__link .label {
		font-size: 1.2rem;
	}
	.acces-rapides__link .icon {
		width: 35px;
		height: 35px;
	}
	.acces-rapides__item {
		flex: calc(50% - 10px);
		margin: 5px;
		width: calc(50% - 10px);
		max-width: calc(50% - 10px);
	}
	.container {
		padding-left: 20px;
		padding-right: 20px;
	}
	.footer-infos {
		padding: 20px 20px 10px 20px;
	}
	.footer-links {
		padding: 0;
	}
	.tools-side .tooltip {
		display: none;
	}
	.tools-side {
		display: flex;
		justify-content: center;
		bottom: 0;
		right: 0;
		left: 0;
		top: unset;
	}
	.tools-side ul {
		display: flex;
		align-items: center;
		padding: 5px 10px;
		margin: 0 5px;
		border-top-left-radius: 10px;
		border-bottom-left-radius: 0px;
		border-top-right-radius: 10px;
	}
	.tools-side ul > * + * {
		margin-left: 10px;
	}
	.tools-side .tools-side__rs {
		display: none;
	}
	.tools-side img {
		width: 30px;
	}
	.tools-side li+li::before {
		display: none;
	}
	.bottom-bar {
		padding-bottom: 50px;
	}
	.title-bar {
		flex-wrap: wrap;
		margin: 0 0 10px 0;
	}
	#documents .title-bar {
		margin: 0 0 10px 0;
	}
	.see-all-wrapper {
		margin: 0 -5px;
	}
	.see-all-wrapper > * + *,
	.see-all-wrapper > * {
		margin: 5px;
	}
	.see-all {
		padding: 6px 8px;
	}
	.agenda-wrapper {
		display: block;
	}
	.agenda-wrapper .calendrier-wrapper {
		width: 100%;
	}
	.agenda-wrapper.article-container .lSSlideOuter {
		max-width: 100%;
	}
	.agenda-wrapper > * + * {
		margin-top: 20px;
		margin-left: 0;
	}
}

@media (max-width: 415px) {
	
	
	.topbar:after  {
		right: unset;
		left: 210px;
		width: 75px;
		height: 75px;
		top: 0px;
	}
	
	.footer-infos::after{
		display:none;
	}
	
	.document {
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.document__title,
	.document__summary {
		text-align: center;
	}
	.document__btn-wrapper {
		align-items: center;
		margin-bottom: 0;
	}
	.document .document__picture {
		margin-right: 0;
	}
}

@media (max-width: 370px) {
	/* XS: smartphones, portrait iPhone, portrait 480x320 phones (Android) */
	.title-bar {
		flex-direction: column;
		align-items: center;
	}
	.see-all-wrapper {
		text-align: center;
	}
	.title-bar h2 {
		margin-bottom: 5px;
	}
}
  
/* ==========================================================================
Print styles.
Inlined to avoid the additional HTTP request:
https://www.phpied.com/delay-loading-your-print-css/
========================================================================== */

@media print {
	*,
	*::before,
	*::after {
		background: #fff !important;
		color: #000 !important;
		/* Black prints faster */
		box-shadow: none !important;
		text-shadow: none !important;
	}

	a,
	a:visited {
		text-decoration: underline;
	}

	a[href]::after {
		content: " (" attr(href) ")";
	}

	abbr[title]::after {
		content: " (" attr(title) ")";
	}

	/*
		* Don't show links that are fragment identifiers,
		* or use the `javascript:` pseudo protocol
		*/
	a[href^="#"]::after,
	a[href^="javascript:"]::after {
		content: "";
	}

	pre {
		white-space: pre-wrap !important;
	}

	pre,
	blockquote {
		border: 1px solid #999;
		page-break-inside: avoid;
	}

	/*
		* Printing Tables:
		* https://web.archive.org/web/20180815150934/http://css-discuss.incutio.com/wiki/Printing_Tables
		*/
	thead {
		display: table-header-group;
	}

	tr,
	img {
		page-break-inside: avoid;
	}

	p,
	h2,
	h3 {
		orphans: 3;
		widows: 3;
	}

	h2,
	h3 {
		page-break-after: avoid;
	}
}