Ethica-vitrine/user/themes/ethica/scss/template/_section.scss

body{
	overflow: hidden;
}

section{
	position: absolute;
	left: $header-width;
	width: auto;
	
	.content{
		display: flex;
		width: 100%;
		height: 100vh;
	p{
		margin: 1rem 0;
	}
	h2 ~ p{
		margin-bottom: 0!important;
	}
	h2 + p, h3 +p{
		margin: 0!important;
	}

	a{
		text-decoration: underline;
		&::after{
			@include background-nav-content;
			@include background-link('../images/fleche.svg');
			transition: all 1s;
		}
		&:hover{
			&::after{
				transition: all 1s;
				margin: auto 0px 1px 10px;
			}
		}
	}
	& > div:not(#recherche-artistique){
		filter: blur(5px);
		transition: all 2s;
		color: grey;
	}
	& > .net{
		filter: blur(0px)!important;
		transition: filter 0.5s!important;
		color: black!important;
	}
	& > div{
		overflow-y: auto;
		// width: $column-width;
		width: calc(50vw - 10rem);
		// min-width:$header-width;
		// max-width: $header-width * 3;

		h3:first-of-type{
			padding-top: 0px!important;
		}
	}
	& > div:not(#recherche-artistique){
		padding: 0 20px;
	}
	img{
		width: 100%;
		height: auto;
	}
}

	#recherche-artistique.net > div:first-child{
		filter: blur(0px)!important;
		transition: filter 0.5s!important;
		color: black!important;
	}

#recherche-artistique{
	display: inline-flex;
	width: 200rem;
	// width: calc(100% - 20rem);
	// min-width:$header-width *3;
	// max-width: $header-width * 9;

	& > .net{
		filter: blur(0px)!important;
		transition: filter 0.5s!important;
		color: black!important;
	}
	& > div{
		filter: blur(5px);
		transition: filter 2s;
		color: grey;
		overflow-y: auto;
		padding: 0 20px;
	}

#commentaire-philosophe{
	ul{
		& > li{
			& > ul{
				max-height: 0;
				visibility: hidden;
				transition: all 0.5s;
				opacity: 0;
				& > li{
					&::before{
						@include background-nav-b('../images/point.svg');
						@include background-nav-content;
					}
					& > ol{
						max-height: 0;
						visibility: hidden;
						transition: all 0.5s;
						opacity: 0;
						& > li{
							// margin: -8px 0;
							// color: transparent;
							// transition: color 1s;
							&::before{
								// visibility: visible!important;
								@include background-nav-b('../images/point.svg');
								@include background-nav-content;
							}
						}
					}
				}
			}
			&:hover{
				& > ul{
					max-height: 300px;
					visibility: visible;
					transition: all 1s;
					opacity: 1;
					margin-left: 30px;
					& > li{
						&:hover{
							& > ol{
								max-height: 300px;
								visibility: visible;
								transition: all 1s;
								opacity: 1;
								margin-left: 30px;
								& > li{
									// &:hover{
									// color: black;
									// transition: color 1s;
								// }
								}
							}
						}
					}
				}
			}
		}
	}
	}
}
}
.mCSB_container{
	padding-bottom: 20px;
}