@media only screen and (min-width : 1024px) {

	body {
		margin-top: 0;
		margin-bottom: 0;
		padding: 0;
		min-height: 100%;
		width: 90%;
		margin-left: auto;
		margin-right: auto;
	}

	header {
		display: block;
		width: 100%;
		height: 12em;
		background-image: url('../images/logo.svg');
		background-repeat: no-repeat;
		background-position: center;
		background-size: 15em;
	}

	#menu,
	#menu-toggle:checked~#menu,
	.footer-sides {
		box-sizing: content-box;
		padding: 0;
		top: unset;
		z-index: unset;
		flex-direction: unset;
		align-items: unset;
		justify-content: unset;
		background-color: unset;
		position: unset;
		font-family: "Caviar Dreams Sans";
		display: block;
		height: 2.5em;
		border-top: white 0.12em solid;
		border-bottom: white 0.12em solid;
		margin-bottom: 2.5em;
	}

	#menu ul.menu,
	#menu-toggle:checked~.menu ul#connect {
		top: unset;
		left: unset;
		position: unset;
		display: block;
		flex-direction: unset;
		flex-wrap: unset;
		align-content: unset;
		justify-content: unset;
		align-items: unset;
		height: 100%;
		width: fit-content;
		width: -webkit-fit-content;
		width: -moz-fit-content;
		width: -o-fit-content;
		margin: 0;
		padding: 0;
		margin-right: auto;
		margin-left: auto;
	}

	#menu #logo,
	#menu>label,
	#menu>input {
		display: none;
	}

	#menu ul li,
	#menu-toggle~.menu li,
	#menu-toggle:checked~.menu li {
		background-color: unset;
		border: unset;
		width: unset;
		height: 100%;
		flex-wrap: unset;
		flex-direction: unset;
		visibility: unset;
		display: unset;
		float: left;
	}

	#menu-toggle:checked~.menu li:first-child {
		border-top: unset;
	}

	#menu ul li a,
	#menu-toggle:checked~.menu li a {
		display: block;
		width: 12vw;
		height: calc(100% - ((2.5em - 1.7em) / 2));
		/* 2.5 = menu height */
		text-align: center;
		text-decoration: none;
		font-size: 1.3em;
		padding-top: calc((2.5em - 1.7em) / 2);
		/* 2.5 = menu height */
		line-height: inherit;
	}

	#user-menu {
		position: absolute;
		top: 0;
		right: 0;
	}

	#menu-toggle~.menu>li:last-child {
		position: absolute;
		top: 0;
		height: 3.2em;
		width: 100%;
		/*border-right: 0.1em solid white;
		border-bottom: 0.1em solid white;
		border-left: 0.1em solid white;
		border-radius: 0 0 0.5em 0.5em; */
	}

	#connect,
	#menu-toggle:checked~.menu ul#connect {
		position: absolute;
		right: 5%;
	}

	ul#connect,
	ul#connect li {
		height: 3.2em;
	}

	#login, #menu-toggle:checked~.menu ul#connect>li>a#login-icon~form {
		display:none;
		/*background-color: rgb(0 0 0 / 50%);*/
		width: 13.9em;
		height: 8.5em;
	}

	#login label, #menu-toggle:checked~.menu ul#connect>li>form#login label {
		display: inline-block;
		min-width: 5em;
	}

	#menu-toggle:checked~.menu ul#connect>li>form#login .row, .row {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		align-content: center;
		justify-content: space-between;
		align-items: center;
	}

	.row_control {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		align-content: center;
		justify-content: space-around;
		align-items: center;
	}

	#login input, #menu-toggle:checked~.menu ul#connect>li>form#login input {
		width: 10.68em;
		height: 1.8em;
		padding: 0;
		border: 0.008em solid grey;
	}

	#login input,
	#login label, #menu-toggle:checked~.menu ul#connect>li>form input, #menu-toggle:checked~.menu ul#connect>li>form#login label   {
		margin-top: 0.8em;
	}

	#login input[type="password"], #menu-toggle:checked~.menu ul#connect>li>form#login input[type="password"] {
		width: 8.68em;
	}

	/** TODO IOS need a fix**/
	#login input[type="submit"], #menu-toggle:checked~.menu ul#connect>li>form#login input[type="submit"] {
		color: grey;
		vertical-align: middle;
		background: white;
		border-top: 0.008em solid grey;
		border-right: 0.008em solid grey;
		border-bottom: 0.008em solid grey;
		border-left: none;
		width: 2em;
		height: 1.8em;
		float: right;
		margin-top: 0.8em;
		margin-left: 0;
	}

	#rememberme, #menu-toggle:checked~.menu ul#connect>li>form#login #rememberme {
		margin: 0;
		padding: 0;
		margin-top: 0.8em;
		width: 100%;
		margin-top: 0.8em;
	}

	#rememberme input[type="checkbox"], #menu-toggle:checked~.menu ul#connect>li>form> #rememberme input[type="checkbox"] {
		width: 1.42em;
		margin: 0;
		padding: 0;
		float: right;
	}

	#menu ul li a#forgotpw, #menu-toggle:checked~.menu ul#connect>li>form#login a#forgotpw {
		margin: 0;
		padding: 0;
		font-size: 1em;
		line-height: 1.8em;
		width: 100%;
		height: 1.8em;
	}

	#register-icon {
		padding-top: 0.8em;
	}

	#menu-toggle:checked~.menu ul#connect>li:first-child {
		display: inherit;
		flex-direction: unset;
		flex-wrap: unset;
		align-content: unset;
		justify-content: unset;
		align-items: unset;
	}

	ul#connect li form#login {
		display: none;
	}

	ul#connect li a.visible-icons,
	#menu-toggle:checked~.menu ul#connect>li>a {
		width: 2.7em;
		height: 100%;
		display: inline-block;
		flex-direction: unset;
		flex-wrap: unset;
		align-content: unset;
		justify-content: unset;
		align-items: unset;
	}

	#menu-toggle:checked~.menu ul#connect>li>a>img,
	#menu-toggle:checked~.menu ul#connect>li>div>img a.visible-icons img,
	a.visible-icons img,
	.article .comment_infos img,
	.article .author_section img {
		border-radius: 50%;
		width: 2em;
		height: 2em;
		margin-left: unset;
	}

	ul#connect li a#login-icon span,
	ul#connect li a#register-icon span,
	ul#connect li a#user-icon span,
	ul#connect li a#write-icon span,
	ul#connect li a#logout-icon span,
	ul#connect li a#edition-icon span {
		display: none;
		height: 1.8em;
		line-height: 2.2em;
		padding-left: 0.4em;
		padding-right: 0.4em;
		vertical-align: top;
	}

	ul#connect li a#login-icon span, #menu-toggle:checked~.menu ul#connect>li>a>span {
		margin: 0 0em;
		padding-left: 1.6em;
		padding-right: 1.6em;
	}

	#menu-toggle:checked~.menu ul#connect li:hover li:hover a#login-icon img, #menu-toggle:checked~.menu li:focus a#login-icon img, #menu-toggle:checked~.menu li:focus-within a#login-icon img,
	#menu-toggle:checked~.menu ul#connect li:hover li:hover a#register-icon img, #menu-toggle:checked~.menu li:focus a#register-icon img, #menu-toggle:checked~.menu li:focus-within a#register-icon img,
	#menu-toggle:checked~.menu ul#connect li:hover li:hover a#user-icon img, #menu-toggle:checked~.menu li:focus a#user-icon img, #menu-toggle:checked~.menu li:focus-within a#user-icon img,
	#menu-toggle:checked~.menu ul#connect li:hover li:hover a#write-icon img,
	#menu-toggle:checked~.menu ul#connect li:hover li:hover a#logout-icon img,
	#menu-toggle:checked~.menu ul#connect li:hover li:hover a#edition-icon img,
	ul#connect li:hover a#login-icon img,
	ul#connect li:focus a#login-icon img,
	ul#connect li:focus-within a#login-icon img,
	ul#connect li:hover a#register-icon img,
	ul#connect li:hover a#user-icon img,
	ul#connect li:focus a#user-icon img,
	ul#connect li:focus-within a#user-icon img,
	ul#connect li:hover a#write-icon img,
	ul#connect li:hover a#logout-icon img,
	ul#connect li:hover a#edition-icon img {
		float: left;
		/* TODO check compat : display: table*/
	}

	#menu-toggle:checked~.menu ul#connect li:hover a#login-icon img+span,
	#menu-toggle:checked~.menu ul#connect li:focus a#login-icon img+span,
	#menu-toggle:checked~.menu ul#connect li:focus-within a#login-icon img+span,
	#menu-toggle:checked~.menu ul#connect li:hover a#register-icon img+span,
	#menu-toggle:checked~.menu ul#connect li:hover a#user-icon img+span,
	#menu-toggle:checked~.menu ul#connect li:focus a#user-icon img+span,
	#menu-toggle:checked~.menu ul#connect li:focus-within a#user-icon img+span,
	#menu-toggle:checked~.menu ul#connect li:hover a#write-icon img+span,
	#menu-toggle:checked~.menu ul#connect li:hover a#logout-icon img+span,
	#menu-toggle:checked~.menu ul#connect li:hover a#edition-icon img+span,
	ul#connect li:hover a#login-icon img+span,
	ul#connect li:focus a#login-icon img+span,
	ul#connect li:focus-within a#login-icon img+span,
	ul#connect li:hover a#register-icon img+span,
	ul#connect li:hover a#user-icon img+span,
	ul#connect li:focus a#user-icon img+span,
	ul#connect li:focus-within a#user-icon img+span,
	ul#connect li:hover a#write-icon img+span,
	ul#connect li:hover a#logout-icon img+span,
	ul#connect li:hover a#edition-icon img+span {
		display: block;
		float: left;
		/* TODO check compat : display: table*/
	}

	#menu-toggle:checked~.menu ul#connect li:hover a.visible-icons,
	#menu-toggle:checked~.menu ul#connect li a.visible-icons:focus,
	#menu-toggle:checked~.menu ul#connect li:focus-within a.visible-icons,
	#menu-toggle:checked~.menu ul#connect li:hover a.visible-icons span,
	ul#connect li:hover a.visible-icons,
	ul#connect li a.visible-icons:focus,
	ul#connect li:focus-within a.visible-icons,
	ul#connect li:hover a.visible-icons span {
		width: fit-content;
		width: -webkit-fit-content;
		width: -moz-fit-content;
		width: -o-fit-content;
		margin: 0;
	}

	#menu-toggle:checked~.menu ul#connect li:first-child:hover a.visible-icons,
	#menu-toggle:checked~.menu ul#connect li:first-child:focus a.visible-icons,
	#menu-toggle:checked~.menu ul#connect li:first-child:focus-within a.visible-icons,
	ul#connect li:first-child:hover a.visible-icons,
	ul#connect li:first-child:focus a.visible-icons,
	ul#connect li:first-child:focus-within a.visible-icons {
		margin-left: 3em;
	}

	ul#connect li:first-child:hover a#user-icon.visible-icons,
	ul#connect li:first-child:focus a#user-icon.visible-icons,
	ul#connect li:first-child:focus-within a#user-icon.visible-icons {
		margin-left: 0;
		/* if dock style enabled 0.5em */
	}

	/* + to tild to add errors */
	#menu-toggle:checked~.menu ul#connect>li:first-child:hover>a#login-icon~form#login,
	#menu-toggle:checked~.menu ul#connect>li:first-child:focus-within>a.visible-icons~form#login,
	#menu-toggle:checked~.menu ul#connect>li:first-child a.visible-icons form#login:focus-within,
	ul#connect li:first-child:hover a.visible-icons~form#login,
	ul#connect li:first-child:focus-within a.visible-icons~form#login,
	ul#connect li:first-child a.visible-icons form#login:focus-within {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		flex-direction: row;
		align-content: center;
	}

	ul#connect li:first-child:hover a.visible-icons~.alert,
	ul#connect li:first-child:focus-within a.visible-icons~.alert,
	ul#connect li:first-child a.visible-icons form#login:focus-within .alert {
		display: none;
	}

	a.visible-icons:hover img,
	a.visible-icons:focus img,
	a.visible-icons:focus-within img,
	.author_section a:hover img {
		filter: drop-shadow(0.02em 0.04em 0.06em white);
		-webkit-filter: drop-shadow(0.02em 0.04em 0.06em white);
		-moz-filter: drop-shadow(0.02em 0.04em 0.06em white);
		-o-filter: drop-shadow(0.02em 0.04em 0.06em white);
	}

	#container {
		margin-top: 0;
		font-family: "Liberation Serif";
		padding: 0 5em 0 5em;
		position: relative;
		line-height: 1.4em;
		min-height: 60vh;
	}

	#container > .article {
		width: calc(80% - 0.2em)
	}

	#container a.article_link {
		width: calc(80% - 0.2em)
	}

	#container form:not(.article):not(#visiblelogin):not(.comment_forms) { /* need improvments */
		margin-top: 0;
		width: 80%;
	}

	#container form:not(.article) section > section#profile_infos {
		width: calc(100% - 19em);
	} 

	#userProfile #user_informations #right_user_description {
		width: 50%;
	  }

	#container form:not(.article):not(#visiblelogin) label {
		width: 8.949em;
	}

	#container form:not(.article):not(#visiblelogin):not(#humanVerificationForm):not(#contactform):not(#resetpwdform) input:not([type="file"]):not([type="checkbox"]) {
		min-width: calc(100% - 10.949em);
		max-width: 34.051em;
	}

	/**/
	#container form.comment_forms {
		width: 100%;
	}

	.article .comment_infos {
		margin-left: 1em;
	}

	#connect .alert {
		width: 14em; /* was 10 */
		height: 2em;
		border-radius: 0.7em;
		border: solid white 0.1em;
		top: calc(50% - 0.8em);
		left: -12em; /* was -7 */
		font-size: 0.8em;
	}

	#connect .alert-danger,
	#connect .alert-error {
		color: orangered;
		position: absolute;
		padding: 0 0.5em;
	}

	#connect .alert>span {
		width: calc(100% - 1em);
	}

	.presentation {
		min-height: unset;
	}

	#presentation_sorps {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		align-content: flex-end;
		justify-content: center;
		align-items: flex-end;
	}

	.footer-sides {
		border-bottom: none;
	}

	  #visiblelogin {
		width: 28em;
	  }

	  #visiblelogin > * {
		margin-bottom: 1.4em;
	  }

	  #visiblelogin input[type="email"], #visiblelogin input[type="password"] {
		height: 1.6em;
		border: 0.008em solid grey;
	  }

	  #visiblelogin input[type="email"] {
		margin-bottom: 1.8em;
    	width: 15.33em;
	  }

	  #visiblelogin input[type="checkbox"] {
		margin-bottom: 0.35em;
		margin-left: 1em;
	  }

	  #visiblelogin a {
		color: black;
		margin: auto;
		display: block;
		width: 100%;
		text-align: center;
	  }

	  #visiblelogin a:not(:last-child){
		margin-bottom: 1em
	  }

	  #visiblelogin input[type="submit"] {
		border-width: 0.1em;
		border-color: grey;
		border-style: solid;
		border-left: none;
		margin-left: -0.15em;
		height: 1.575em;
	  }

	  #visiblelogin #rememberme_visible {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		align-content: center;
		align-items: flex-end;
		justify-content: center;
		width: 100%;
	  }

	  #footer-right a {
		font-size: 0.7em;
	  }

	  /* COOKIE CONSENT BUNDLE */
	  .ch-cookie-consent--dark-theme {
		display: revert;
		height: auto;
	}
}