@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@300..700&display=swap');

:root{
	interpolate-size: allow-keywords;
	--fontSize: 0.8em;
	--fontStyle: arial;
	--rootBG: transparent;
	--maxWidth: 1024px;
	--contentBG: transparent;
	--contentFG: black;
	--headerBG: transparent;
	--headerFG: #7d00a0;
	--headerStackBG: #7d00a021;
	--headerStackFG: #7d00a0;
	--headerOver: #7d00a0;
	--titleColor: #ff6100;
	--tileBorderColor: #e0dcd8;
	--tileBG: #f0eeeb;
	--tileRadius: 0em;
	--tileBorderWidth:8px;
	--tileFG: black;
	--tileTitleColor: #74515f;
	--accentColor: #7d00a0;
	--accentColorLight:#74515fb8;
	--emphasisBG: white;
	--extraBG: transparent;
	--extraBorderColor: #231F20;
	--extraBorderWidth: 2px;
	--extraRadius: 0em;
}

@font-face {
  font-family: 'Anton';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/anton/v25/1Ptgg87LROyAm3Kz-C8.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* DEBUT header */
#header {
	background: #fffaff;
	/*position: fixed;*/
	width: 100%;
	box-shadow: 0 0 30px lightgray;
  font-family:Comfortaa;
	.tplTitle{
		text-indent: 0;
		padding: 0;
		padding-block-start: 20px;
		height: auto;
		text-align: center;
		font-size: clamp(2.3rem,4vw,3rem);
	}
	.inline {
	    flex-direction:column
	}
	&:before {
		background:url(res/logoRSC25.svg) center center / 100%;
		display:block;
		width:100%;
		position:absolute;
		height:100%;
		content:'';
		z-index:-10;
		opacity:0.13
	}
	ul.tileLinks li {
	    font-size: 1.6em;
	}
}

body.page_scrolled_yes,
body:not(.home){
	#header{
		.tplTitle{
			padding: 0;
			padding-inline-start: 59px;
			background-size: 70px;
			background-position:left 10px center;
			line-height: unset;
			font-size: clamp(1.8rem,4vw,2.3rem);
			height: 80px;
      display: flex;
      align-items: center;
		}
		.inline {
		    flex-direction: row;
		}
		ul.tileLinks{
			margin-block-end:0;
			li {
		    font-size: 1.4em;
			}
		}
	}
}

body.page_scrolled_no #header,
body.page_scrolled_yes #header,
body.page_scrolled_yes #header .tplTitle,
body.page_scrolled_no #header .tplTitle{
	transition:0.2s linear;
}

#navigation,
#header .tplTitle{
    align-self:center;
}

#stack {
	display:none
}

ul.tileLinks {
	margin-block-end:15px;
	&:hover li{
		opacity:0.4
	}
	li{
	    margin-left: 0;
	    font-size: 1.3em;
		transition:0.2s ease-out;
		img{
			display:none
		}
		&:hover{
			opacity:1 !important
		}
	}
	li:first-of-type{
		display:none
	}
}

/* FIN header */

/* DEBUT footer */
footer{
	border-color: var(--accentColor);
	background-color: #ffe9fe;
	margin-block-start: 30px;
	p{
		margin: 0;
		line-height:1em
	}
	a:after{
		display:none
	}
	.margin_ti {
	    text-align: left;
	}
	div.margin {
	    width: auto;
	    min-height: unset;
	    margin: 0;
	}
	.permMargin {
	    justify-content: space-around;
	    width: 100%;
	}
	.tplFootBanner {
	    line-height: unset;
	}
	#extras {
	    min-height: unset;
	    display: static;
	}
	img {
	    margin-inline-start:0.5em;
	}
	.txt_tb *,
	.txt_tb{
		border:0
	}
	.txt_tb *{
		text-align:center
	}
	.margin_co {
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;
		justify-content: center;
	}
	.txt_anim_ex {
		margin-inline-start:5px
	}
}

/* FIN footer */

#content .bkPage > .bkBase_co > .bkBase:has(.bkBase_ti),
.home #content .bkPage > .bkBase:has(.bkBase_ti) {
  margin-block-start: 30px;
  & > .bkBase_co {
    border-block-start:1px solid var(--titleColor);
    padding-block-start: 30px;
    border-radius:30px;
    max-width: var(--maxWidth);
    margin:auto;
    & > p:first-of-type{
      margin-block-start:0
    }
  }
  .bkBase_ti{
    padding:0;
    margin-block-end: -17px;
    span{
      background: white;
      display: inline;
      padding: 0 0.3em;
    }
  }
  h4.bkBase_ti{
    margin-block-end: -11px;
  }
}

#content {
  .bkBase.bkBase .bkBase {
    margin-block: 2em;
	}
  .layout_tb {
    margin:auto
  }
  .bkPage > .bkBase_co{
    background:white;
  }
  .seqFra{
    .galPv{
      img {
        border-radius: 40px;
        overflow: hidden;
    	}
    }
  }
  .galFra{
    border-radius: 40px;
    overflow: hidden;
    /*display: inline-block !important;*/
    margin: auto;
    .galPv{
      img {
        padding: 0;
    	}
    }
  }
  .bkTileSet{
    margin-block-end:30px
  }
	section > .bkBase_co .bkBase:not(.bkEmphasis):first-of-type .bkBase_co > p {
		/*text-align:center;*/
		& > .txt_ico_tim img{
			border-radius:100px;
			box-shadow:-3px 3px 10px rgba(0,0,0,0.3);
		}
	}
	.bkBase_open::before,
	.bkBase_closed::before{
		background:var(--headerFG)
	}
	.cbkClosed{
		.bkBase_co.collBlk_open {
			border: 1px solid var(--headerFG);
			border-radius:30px;
			height: auto;
		}
		.bkBase_open,
		.bkBase_closed {
		    color: var(--headerFG);
			&:after{
				display:none
			}
		}
		.bkBase_co{
			transition: 0.2s linear;
			display: block !important;
			overflow:hidden;
			height:0;
		}
	}
	.bkEmphasis {
		.bkBase_co {
			border: 1px solid var(--titleColor);
			border-radius:30px;
			background: #fff3ec;
			box-shadow: 0 0 20px lightgray;
			width: fit-content;
		}
		.bkBase_ti{
			span{
				display: inline;
				padding: 0 0.3em;
			}
		}
	}
	.txt_tb {
		width: 100%;
		border:0;
		border-spacing: 2px;
		border-collapse: separate;
		col{
			width:auto !important
		}
		td, th{
		    border: 0;
		}
		td:not(:first-of-type){
			background:#fde4fd
		}
		td{
			padding:0.5em 1em;
		}
		tr td:first-of-type{
			color:white;
			font-weight:bold;
		}
		th{
			/* background:#ffe7ff; */
			background-color: var(--headerFG);
			color: white;
		}
		tbody{
			tr:first-of-type{
				th:first-of-type,
				td:first-of-type{
				border-top-left-radius:30px;
				}
				th:last-of-type,
				td:last-of-type{
				border-top-right-radius:30px;
				}
			}
			tr:last-of-type{
				th:first-of-type,
				td:first-of-type{
				border-bottom-left-radius:30px;
				}
				th:last-of-type,
				td:last-of-type{
				border-bottom-right-radius:30px;
				}
			}
		}
	}
	p {
		font-size:1.3em;
		line-height: 1em;
		margin-block: 0.5em;
	}
	col.txt_t_tbcl{
		/* background:#ffe7ff; */
		width: 92px !important;
		background-color: var(--headerFG);
		/* color: white; */
	}
	h2, h3, h4, h5 {
		color: var(--titleColor);
    font-family:Comfortaa;
	}
	h3{
		font-size: clamp(1.6rem,4vw,2rem);
    padding-block-end:0.5em
	}
	h2{
		text-align:center;
		/*padding-block-end: 0.3em;*/
		/* margin-block-end: 30px; */
	}
  h2 > span{
    font-size: clamp(1.6rem, 4vw, 2rem);
  }
	.bkPage > h2 span{
		display:inline-block;
		color:white;
		border-radius:3em;
		padding:0.2em 0.5em;
		background-color:var(--headerFG);
		font-size: clamp(1.6rem,4vw,2.5rem);
	}
	.bkTileSet .tiles{
		display: flex;
		flex-wrap:wrap;
		justify-content: center;
		margin-block-start:30px;
		
		&:hover article.tile{
			transform:scale(0.95);
			opacity:0.6;
			filter: blur(8px);
		}
	}
	article.tile {
		font-family:"Anton";
		text-transform:uppercase;
		font-size: clamp(1.6rem,4vw,2.5rem);
		border: 0;
		border-radius:200px;
		position: relative;
		background: transparent;
		transition:0.2s ease-out;
		&:hover{
			box-shadow:none;
			transform:scale(1.05) !important;
			opacity:1 !important;
			filter: blur(0) !important;
		}
		*{
			border-radius:200px
		}
		a.tileLink{
			padding:0;
		}
		a:after{
			display:none
		}
		.tileIcon{
			position: absolute;
			width: 100%;
			height: 100%;
			top: 0;
			img{
				object-fit:cover;
				width:100%;
				height: 100%;
			}
		}
		h4{
			color:white;
			text-shadow:0 0 10px black;
			margin: 0;
			padding:1em;
			background: transparent;
      position:relative
		}
	}
}

a {
	text-decoration:none;
	position:relative;
	display:inline-block;
}
a:after {
	content:'';
	display:inline-block;
	bottom:0;
	width:0;
	height:2px;
	background: linear-gradient(90deg, hsla(301, 24%, 51%, 1) 19%, hsla(23, 100%, 50%, 1) 100%);
	left: 0;
	position:absolute;
	transition:0.3s linear
}
a:has(img):not(.galPv *):after{
  bottom:-5px;
}

header a:after {
	background:var(--headerFG);
	left: 50%;
}

header a:hover:after {
	background:var(--headerFG);
	left: 0;
}

a:hover:after {
	width:100%;
}


.tt_fra {
  box-shadow: 0 0 10px grey;
  border-radius:7px;
  .tt {
    font-size: 100%;
	}
	.tt_x {
    margin-inline-end: 5px;
    margin-block-start: 5px;
	}
  p {
    line-height: unset;
	}
}

iframe {
    aspect-ratio: 16/9;
    width: 100%;
    border: none;
    box-shadow: 0 0 30px rgba(0,0,0,0.2);
  border-radius:20px
}

@media (max-width: 900px){
	#content > .bkBase:first-child > .bkBase_ti {
	    font-size:initial;
	}
}