/**
Theme Name: GTA
Author: sybcoincoin
Version: 0.1.2025.12.25
Description: Theme pour ST4Health site de présentation du master bio-mediacal
**/


:root
{
	--back-color: #f3f2ed;
	
	--font-color: #0b0b60;

	--title-color: #0b0b60;

	--black-color: #0b0b60;
}


html, body
{
	margin:0px;
	padding:0px;
	font-family:"Noto Sans";

	color:var(--font-color);
	font-size: 1.2em;
	line-height: 1.7em;
	font-weight: 200;
	background-color: var(--back-color);
}

header
{
	width: 100%;
	max-width: 1280px;
	margin: auto;
}

main
{
	max-width: 1280px;
	width: 100%;
	margin: auto;
}


/* logo */


.masthead 
{
	width:100%;
	max-width:1280px;
	height:350px;
	background-repeat: no-repeat;
	background-size:cover;
	position:50% 50%;
	background-position: 50% 50%;
	position: relative;
}

.masthead .logo
{
	width:180px;
	height:180px;
	border-radius: 50%;
	background-color: var(--back-color);
	background-size: 85%;
	background-position: 50% 45%;
	position: absolute;
	left:50%;
	transform: translateX(-50%);
	background-repeat: no-repeat;
	bottom: -40px;

}

h1
{
	color:var(--title-color);
	padding:1em;
	text-align: center;


}


/* menu ----------------------------------------*/

nav.headNav
{
	font-size: 1.2em;
}
nav.headNav ul
{
	padding: 0px;
	/*display: flex;*/
	margin: auto;
	width: 100%;
	position: relative;
	z-index: 10;
	text-align: center;
}

nav.headNav li
{
	list-style: none;
	padding:10px 15px;
	display: inline-block;
}

nav.headNav li a
{
	color:var(--title-color);
}

nav.headNav li:hover a
{
	text-decoration:wavy;
}

nav.headNav li.current_page_item
{
	font-weight: 700;

} 

nav.headNav li.current_page_item a
{
	text-decoration:none;
}

main
{
	padding:0px 40px;
	box-sizing: border-box;
	margin-top: 40px;
}

/* toggle menu button ----------------------------------------*/


/* responsive ----------------------------------------*/

@media only screen and (max-width: 600px) {
	main {
	  width: 100%;
	  padding:0px 10px;
	}
  }

/*---------------------------------*/

footer {

	width:100%;
	margin-top:80px;
	background-color:var(--black-color);
	color:var(--back-color);
	padding:30px;

	box-sizing: border-box;
}

footer .content
{

	width:calc(100%-50px);
	max-width:1280px;margin: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

footer .contact  { font-size: .8em;}

footer .logo img { width:90px; }


/*---------------------------------*/


/* */



/*======================================================*/
/* news slider */


/* SLIDER ====================================================================*/


.espciNewsSlider
{
	background-color: var(--background);
	padding-bottom: 50px;
}


.espciNewsBox
{
	position: relative;

	display: block;
	width:100%;
	

}

.espciNewsBox .img
{
	height:180px;
	width:100%;
	background-size: cover;
	pointer-events:none;
	background-position: 50% 50%;

}

.espciNewsBox a
{
	position: relative;
	z-index: 1;
	padding: 0px 10px;
	display: block;
	height:100%;
}

.espciNewsBox h3
{
	font-weight: 300;
	margin-bottom: 2em;
}


.espciNewsBox ul.categories,  .espciNewsBox .categories li
{
	margin: 0px;
	padding: 0px;
	text-align: left;
	display: inline-block;	
}


.espciNewsBox .footer
{
	color:#fff;
	background-color: var(--clear);
	display: flex;
	justify-content: space-between;
	box-sizing: border-box;
	padding: 4px;
	font-size: .8em;
	font-weight: 300;
	position: absolute;
 	 bottom: 0px;
 	 width: calc(100% - 18px);
}


.espciNewsBox .date
{
	display: inline-block;
	margin:0px;
}

.espciNewsBox .rollOver
{
	/*transition: all 200ms cubic-bezier(0.070, 0.780, 0.465, 0.990);*/

	transition: height 400ms cubic-bezier(0.945, 0.050, 0.620, 0.965),
				background-position 650ms cubic-bezier(0.850, 0.010, 0.415, 0.745);
	
	position: absolute;
	width: calc(100% - 12px);
	height: 0px;
	bottom: -2px;
	left: 6px;
	background-color: var(--clear);

	background-repeat: no-repeat;
	background-size: 50% 100%;
	background-position-x: -120%;


}

.espciNewsBox:hover .rollOver
{
	height: calc(100% + 6px);
	background-position-x: 200%;
}

/*----------------------------------------------*/

.singleNews h1
{

	font-size:2em;
	width:90%;
	max-width:500px;
	margin: auto;
	margin-top: 60px;
	margin-bottom:20px;

}


.newsContainer
{
	width:90%;
	max-width:500px;
	margin-top: 20px;
	margin: auto;
	margin-top: 10px;
	position: relative;
	margin-bottom: 60px;
	line-height: 1.7em;
}

.newsContainer a
{
	color: var(--clear);
	text-decoration: underline;
}

.singleNews .image
{
	width:90%;
	max-width:750px;
	height:300px;
	background-size: cover;
	background-position: 50% 50%;
	margin: auto;
}

.singleNews .content
{
	padding-bottom: 20px;
}


.singleNews .footer
{
	color:#fff;
	background-color: var(--clear);
	display: flex;
	justify-content: space-between;
	box-sizing: border-box;
	padding: 4px;
	font-size: .8em;
	font-weight: 300;
	position: absolute;
 	width: 100%;
	bottom: -10px;
}


.singleNews .date
{
	display: inline-block;
	margin:0px;
}

.singleNews .footer li, .singleNews .footer ul
{
	margin:0%;
	padding:0%;
	list-style: none;
	display: inline-block;
}

/*----------------------------------------------------------------------*/

.newsList
{
	font-size: .8em;
	line-height: 1.6em;

}
.newsList a
{
	color: var(--font-color);
	text-decoration: none;
}


.newsList .pagination
{
	width: 100%;
	margin-bottom: 50px;
	margin-top: 50px;
	text-align: center;
} 

.newsList .page-numbers
{
	padding:15px;
	margin: 2px;
	background-color: var(--clear);
	color:#fff;
	font-weight: normal;
}

.newsList .page-numbers.current
{
	background-color: #fff;
	color:var(--clear);
}


.newsList>ul
{
	display: flex;
	flex-wrap: wrap;
	padding: 0px;
	width:90%;
	max-width: 1025;
	margin:auto;
	
}

.newsList>ul>li
{
	width:calc(33.3333% - 20px);

	margin-bottom:30px;
	list-style: none;

	box-sizing: border-box;
	padding: 10px;
	margin:10px;
	border:1px solid var(--font-color);
}

.newsList>ul>li:hover
{
	border:2px solid var(--title-color);
}

@media only screen and (max-width: 900px)
{
	.newsList>ul>li
	{
		width: calc(50% - 20px );
	
	}
}

@media only screen and (max-width: 700px)
{
	.newsList>ul>li
	{
		width:calc(100%);
	
	}

}