@media (min-aspect-ratio: 175/90) and (min-width:1024px) {
	#site #accueil.page {
		animation-name: home_bg;
		animation-duration: 10s;
		animation-iteration-count:infinite;
		animation-direction:alternate;
		animation-timing-function: ease;
	}

	@keyframes home_bg {
		0%   { background-size: 100% auto; background-position: left 0px bottom; }	
		100% { background-size: 105% auto; background-position: left -10px bottom; }
	}

	#site #accueil .middle,
	#site #home .middle {

		animation-name: home_middle_bg;
		animation-duration: 4s;
		animation-iteration-count:infinite;
		animation-direction:alternate;
		animation-timing-function: ease;
	}

	@keyframes home_middle_bg {
		0%   { opacity: 0.92; }	
		100% { opacity: 0.88; }
	}
	/*
	@keyframes home_middle_bg {
		0%   { background-color: rgba(255,255,255,0.92); }	
		100% { background-color: rgba(255,255,255,0.87); }
	}
		*/
}

@media (min-width:1921px) {
	/* UNcompressed backgrounds */
	#pages .page {
		background-image:url("../design/bg/cloud3.jpg");
	}
	#pages .page#fonctionnalites,
	#pages .page#fonctionnalities {
		background-image:url("../design/bg/desktop2.jpg");
	}
	#pages #news.page {
		background-image:url("../design/bg/contact.jpg");
	}
	#pages #logiciel_gestion.page,
	#pages #management_software.page {
		background-image:url("../design/bg/agreement.jpg");
	}
	
}
@media (min-width:1320px) {
	.pagewidth {
		width:75%;
		max-width:1280px;
	}
	#pages #news.page .middle {
		height:840px;
	}
}
@media (max-width:1023px) { /* 1023px max + scrollbar */

	#header {
		height:auto;
		padding:10px;
		width:calc(100% - 20px);
		
		position:relative;
		
	}
	#header .img {
		bottom:auto;
		top:0px;
	}
	#header .connect_btn {
		left:0px;
		right:auto;
	}
	#header #languages {
		left:0px;
		right:auto;
		bottom: 50px;
		top:auto;
	}
	
	nav#main_menu {
		top:0px;
		bottom:auto;
		right:auto;
		position:relative;
		text-align:right;
	}
	nav#main_menu ul {
		display:inline-block;
	}
	nav#main_menu li {
		display:block;
		text-align:right;
		font-size:18px;
		line-height:20px;
		margin-right:0px;
	}
	nav#main_menu li a {
		padding-bottom: 8px;
	}
	
	#pages .page:first-child .middle {	
		padding-top:0px;
	}
	.pagewidth {
		width:auto;
	}
	.middle {
		height:auto;
	}
	.middle .pagewidth {
		padding:20px;
	}

	.content .bottom {
		position:relative;
		top:0px;
		width:auto;
	}

	#site #accueil .content>.flex,
	#site #home .content>.flex {
		display:block;
	}

	#site #accueil .content #ami_presentation,
	#site #home .content #ami_presentation {
		width:760px; /* 800 px - 20px padding */
		padding:0px;

		margin-left:auto;
		margin-right:auto;
		margin-bottom:20px;

		display:flex;
	}
	#site #accueil .content #ami_animated_logo,
	#site #home .content #ami_animated_logo {
		flex:1;
	}
	#site #accueil .content #ami_presentation>.text,
	#site #home .content #ami_presentation>.text {
		flex: none;
		width: 380px;
		align-self: end;
	}

	#site #accueil .middle .button.inscription_btn,
	#site #home .middle .button.inscription_btn {		
		position: relative;
		bottom:auto;
		width: auto;
	}

	#site #accueil .content .advantages,
	#site #home .content .advantages {
		width:318px;
		height:auto;
		padding-top:0px;
	}

	#site #accueil .middle .content h1, 
	#site #home .middle .content h1 {
		text-align: center;
		text-justify: none;
		text-align-last: auto;
	}
	
	#fonctionnalites.page .middle,
	#fonctionnalities.page .middle {
		/*height: 734px;*/
	}
	/* fonctionnalites */
	#fonctionnalites.page .middle,
	#fonctionnalities.page .middle {
		height: auto;
	}
	
	#site #fonctionnalites.page .middle .pagewidth #slideshow .slider,
	#site #fonctionnalities.page .middle .pagewidth #slideshow .slider	{
		width:100%;
	}
	
	#site #fonctionnalites.page .middle .pagewidth .content .video,
	#site #fonctionnalities.page .middle .pagewidth .content .video	{
		background-color:#fff;
		display:block;
		text-align:left;
		left:0;
		bottom:0;
		width:100%;
		line-height:21px;
		padding-top:10px;
		padding-bottom:10px;
		position:relative;
	}

	#fonctionnalites .middle .pagewidth .content #features_list, 
	#fonctionnalities .middle .pagewidth .content #features_list {
		text-align: center;
		padding:20px;
		position:relative;

		bottom: auto;
		width: auto;
	}
	
	#fonctionnalites.page .middle h1,
	#fonctionnalites.page .middle h2,
	#fonctionnalities.page .middle h1,
	#fonctionnalities.page .middle h2{
		padding-left:10px;
	}
	
	.content .form_contact {
		width:auto;
	}
	
	#logiciel_gestion.page .middle ,
	#management_software.page .middle  {
		height:auto;
	}
	
	#logiciel_gestion.page .middle .text,
	#management_software.page .middle .text{
		max-width:500px;
		width:auto;
	}
		
	.promo {
		right:0px;
		bottom:30px;
	}
}
@media (max-width:799px) { /* 799px max + scrollbar */

	.middle .pagewidth {
		padding:10px;
	}
	
	*:not(.connect_btn).button {
		width:calc(100% - 40px);
		text-align:center;
		padding-left:10px;
		padding-right:10px;
	}

	.content {
		font-size: 16px;
	}
	
	#pages .page {
		padding:0px !important;
	}
	
	/* help */
	#help .title .type {
		display:none;
	}
	

	/* advantages */
	#site #accueil .content #ami_animated_logo,
	#site #home .content #ami_animated_logo {
		display:none;
	}
	#site #accueil .content #ami_presentation,
	#site #home .content #ami_presentation {
		width:auto;
		display:block;

		margin-bottom:40px;
	}
	#site #accueil .content #ami_presentation>.text,
	#site #home .content #ami_presentation>.text {		
		width: auto;
		text-align:center;
	}

	#site #accueil .middle .content .advantages,
	#site #home .middle .content .advantages {
		width:80%;
		height:auto;
		padding-top:0px;
		margin:0px;
		margin-bottom:20px;
	}
	#site #accueil .middle .content .advantages:hover,
	#site #home .middle .content .advantages:hover {
		background-position: 0;
	}

	#site #accueil.page .advantages img,
	#site #home.page .advantages img {	
		pointer-events: none;
	}	
	
	#site #accueil.page .advantages .description,
	#site #home.page .advantages .description {	
		width:auto;	
		height:26px;		
		padding:16x;
		padding-bottom:0px;
		margin-bottom:20px;
		text-align: justify;
		line-height: 1.5;
	}
	
	#site #accueil.page .advantages:hover .description,
	#site #home.page .advantages:hover .description {	
		height:auto;
	}
	
	#site #accueil.page .advantages .description:before,
	#site #home.page .advantages .description:before {	
		width:auto;
		height:26px;
		line-height:26px;
		text-align: center;
		content:'+';
		display:block;
		font-size:26px;
		font-weight:bold;
		text-shadow:1px 1px 0px #fff, -1px -1px 0px #fff, -1px 1px 0px #fff, 1px -1px 0px #fff;
	}

	#site #accueil .middle .content h1, 
	#site #home .middle .content h1 {
		font-size: 36px;
		color: #E65214;
		text-shadow: none;
		font-weight: normal;
	}
	
	
	/* logiciel_gestion*/
	#logiciel_gestion.page .middle,
	#management_software.page .middle	{
		/*background-image:none;*/
		height:auto;
	}
	
	#logiciel_gestion.page .middle .pagewidth .content .block,
	#management_software.page .middle .pagewidth .content .block {
		display:block;
		width:100%;
		margin:0px;
		margin-bottom:10px;
		
		text-align:center;
	}
	
	#logiciel_gestion.page .middle .pagewidth .content .button,
	#management_software.page .middle .pagewidth .content .button {
		float:none;
		display:block;
		width:calc(100% - 22px);
		margin:0px;
		margin-bottom:10px;
	}
	
	/* aide */
	#site #aide.page .content ul li b:first-child,
	#site #help.page .content ul li b:first-child {
		width:100%;
	}
				
	/* VIDEO */
	#guide_video.page.middle a {
		margin-left:0px;
	}	
	#guide_video.page#popup_video .popup_container {
		width: 90%;
	}
	
	/* PEPPOL */
	#peppol .flex {
		display:block;
	}


	/* popup */
	.popup .small {
		width: calc(100% - 20px);
	}
	.popup label {
		display:block;
	}
	.popup label.check_label {
		display: inline-block;
	}
	.popup .unicol input[type="text"],
	.popup .unicol input[type="password"],
	.popup .unicol select	{
		width: calc(100% - 30px); /* -20 -8 -2 */
		margin-left: 20px;
	}

	.popup select, .popup input[type="text"], .popup input[type="button"], .popup input[type="password"], .popup label, .popup textarea, .popup input[type="submit"] {
		margin-top:0px;
	}
	
	.promo {
		position:relative;
		bottom:0;
		right:0;
	}
}