@import '../components/header/header-about.css';

html, body{
  width:100vw;
  overflow: hidden;
 	font-weight: 400;
	font-style: normal;
}

::-webkit-scrollbar {
    width: 0px;
    height:0px;
}

::-webkit-scrollbar-thumb {
    width: 0px;
    border-radius: 0px;
}

.grid {
  margin-top:1vh;
  margin-left:1vw;
  margin-right:1vw;
  display: grid;
  grid-template-columns: repeat(50, 1fr);
  grid-template-rows: repeat(24, 1fr);
  grid-auto-flow: dense;
  align-content: start;
  width:calc(100% - 2vw - 10px);
  height: calc(var(--real-vh, 1vh) * 98);
}

section{
	position:fixed;
	top:10vh;
	height:90vh;
	width:100vw;
	z-inex:-1;
	display:flex;
	flex-direction: column;
	gap:8vh;
	overflow-y:scroll;
}

section .bloc{
	display:flex;
	padding-left:1.5vw;
	padding-right:1.5vw;
	border-bottom:1px solid black;
	padding-bottom:2vh;
	gap:2vw;

}

section .bloc:nth-last-child(1){
	border-bottom:none;
	margin-bottom:4vh;
}

section .bloc div:nth-child(1){
	width:40%;
	font-size: var(--font-size-normal);
	font-family: var(--font-family-regular);
	letter-spacing:var(--font-letter-spacing);
	text-transform: uppercase;
}

section .bloc div:nth-child(2){
	font-family: var(--font-family-serif);
	width:50%;
	min-width:600px;
	font-weight:lighter;
	font-size: var(--font-size-normal);
}

section .bloc div:nth-child(2) p{
	margin-bottom:2vh;
	break-inside: avoid;
}

section .bloc div:nth-child(2) p:last-child {
  margin-bottom: 0;
}


.deux-col{
	column-count: 2 ;
	column-gap: 2vw;
}

.auto{
	column-fill: auto;
}

.balance{
	column-fill: balance;
}

section .bloc div:nth-child(2) p a{
	text-decoration: underline;
}


section div img{
	height:35vh;
	width:auto;
}


@media (min-width: 1px) and (max-width: 768px) {

	section{
		top:10vh;
	}

	section .bloc{
		flex-direction:column;
	}

	section .bloc div:nth-child(1),
	section .bloc div:nth-child(2){
		width:calc(100% - 6vw);
		min-width:auto;
		padding-left:3vw;
		padding-right:3vw;
		font-size: 1.2rem;
	font-weight:normal;

	}

	section .bloc div:nth-child(1){
		margin-bottom:2vh;
		font-family:var(--font-family-regular);
	}

	section .bloc:nth-last-child(1){
		margin-bottom:7vh;
	}

	.deux-col{
		column-count: 1 ;
		width:80% !important;
	}

	section .bloc:nth-child(1) div:nth-child(1){
		display:none;
	}

	section div img{
		height:40vh;
		width:auto;
		position:relative;
		left:50%;
		transform: translateX(-50%);
	}

}