/* @font-face kit by Fonts2u (https://fonts2u.com) */
@font-face {
	font-family:"SVN-Very Berry";
	src:url("./fonts/SVN-Very_Berry.eot?") format("eot"),url("./fonts/SVN-Very_Berry.woff") format("woff"),url("./fonts/SVN-Very_Berry.ttf") format("truetype"),url("./fonts/SVN-Very_Berry.svg#SVN-VeryBerry") format("svg");
	font-weight:normal;
	font-style:normal;}

h1 {
	font-family: 'SVN-Very Berry';
	font-size: 80px;
}

html, body {
	height: 100%;
	margin: 0;
	font-size: 25px;
}


body {
	margin: 0;
	font-family: 'Cormorant Garamond', serif;
	color: #c8acd2;
	background-image: url('images/background.png');
	background-size: cover;
	background-position: top;
	background-attachment: scroll;
	background-repeat: no-repeat;
}

header {
    background-color: rgba(233, 226, 228, 0.5);
    padding: 20px;
	margin-top: -50px;
    text-align: center;
    color: #6361a1;
    position: relative; /* Ensure positioning of the nav */
}

.nav {
    position: absolute;
    top: 50%; /* Center vertically */
    right: 20px; /* Adjust for desired spacing from the left */
    transform: translateY(250%); /* Center vertically */
}

.nav ul {
    list-style: none; /* Remove bullet points */
    margin: 0;
    padding: 0;
    display: flex; /* Arrange items in a row */
    gap: 15px; /* Optional: Space between the nav items */
}

.nav li {
    margin: 0; /* Ensure no additional margin is applied */
}

.nav a {
    color: #6361a1;
    text-decoration: none;
    font-size: 20px; /* Smaller font size */
    font-weight: 600;
}

.nav a:hover {
    text-decoration: underline; /* Underline on hover for clarity */
}


footer {
	background-color: rgba(233, 226, 228, 0.5);
	font-family: 'SVN-Very Berry';
	padding: 20px;
	text-align: center;
	color: #6361a1;
	margin-top: 80px;
}

main {
	padding: 40px 20px;
	max-width: 900px;
	margin: 0 auto;
	background-color: rgba(255, 255, 255, 0.8);
	border-radius: 10px;
}

.date {
	color: #b7b5d6;
	text-align: center;
	font-size: 1.2rem;
	margin-top: -50px;
}
.section-title {
	font-weight: 800;
	font-size: 2rem;
    margin-top: 80px;
    margin-bottom: 5px;
	font-family: 'SVN-Very Berry';
}

.content {
    margin-top: 5px;
	color: #869eb6;
	font-size: 22px;
}

a {
	color: #b68f76; /* Couleur des liens */
	text-decoration: none; /* Enlever le soulignement par défaut des liens */
}

a:hover {
	text-decoration: underline; /* Souligner les liens au survol pour une meilleure visibilité */
}

.agenda {
	list-style: none; /* Remove default list bullets */
	padding: 0;
}

.agenda li {
	margin-bottom: 20px;
}

.agenda-time {
	font-weight: 600;
	color: #869eb6; /* Color for the times */
	display: inline-block; /* Ensures it stays on the same line as the title */
	margin-right: 10px; /* Space between time and title */
}

.agenda-title {
	font-weight: 600;
	color: #869eb6; /* Color for the titles */
	display: inline; /* Ensures it stays on the same line as the time */
	margin-right: 10px; /* Space between title and description */
}

.description-text {
	color: #b68f76; /* Color for the text descriptions */
	margin: 5px 0; /* Margin for spacing */
	padding-left: 30px; /* Space for bullet points alignment */
}

.description-text::before {
	content: '•'; /* Bullet point */
	font-size: 20px;
	color: #869eb6; /* Color for the bullet points */
	margin-right: 10px; /* Space between bullet and text */
	position: absolute; /* Position bullet point absolutely */
	left: 0; /* Align to the left */
	top: 0; /* Align to the top */
	transform: translateY(-50%); /* Center vertically */
}

/* médias queries */

@media (max-width: 800px) {
    body {
        font-size: 22px; /* Réduire la taille globale des polices pour les petits écrans */
		background-size: cover;
        background-position: center center;
    }

	html, body {
        height: 100%; /* Assurer que le fond couvre toute la hauteur */
        margin: 5px;
        padding: 5px;
        font-size: 22px; /* Réduire la taille globale des polices pour les petits écrans */
        background-size: cover;
        background-position: center center;
        background-attachment: fixed; /* Assurer que le fond reste en place lors du défilement */
        overflow-x: hidden; /* Éviter le défilement horizontal */
    }

    header h1 {
        font-size: 1.5rem; /* Ajuster la taille du titre principal */
    }

	a:hover, a:active, a:focus {
		text-decoration: underline; /* Souligner les liens au survol, au clic, ou au focus */
	}

	.date {
		color: #b7b5d6;
		text-align: center;
		font-size: 1.2rem;
		margin-top: -10px;
	}

    .section-title {
        font-size: 1.5rem; /* Réduire la taille des titres de section */
        margin-top: 40px;  /* Réduire les marges */
        margin-bottom: 10px;
    }

    .content {
        font-size: 1rem;  /* Réduire la taille du texte */
        margin-top: 10px;
        margin-bottom: 40px; /* Augmenter l'espace à la fin pour plus de lisibilité */
    }

	.nav {
        position: relative;
		width: 100%; /* Assurer que la nav occupe toute la largeur */
        top: auto;
        right: auto;
        transform: none;
        text-align: right; /* Alignement à droite */
        padding: 10px;
    }

    .nav ul {
		display: flex;
        flex-direction: row;
        align-items: flex-end; /* Alignement à droite */
        padding-left: 0; /* Supprimer tout padding par défaut */
    }

    .nav ul li {
        margin-bottom: -10px; /* Espacement entre les éléments de navigation */
        list-style: none; /* Supprimer les points de liste */
    }

    .nav a {
        font-size: 1rem; /* Ajuster la taille du texte des liens */
    }

    main {
        padding: 20px 10px; /* Réduire le padding autour du contenu principal */
        max-width: 100%;  /* Assurer que le contenu prenne toute la largeur */
        margin: 0;  /* Supprimer les marges externes */
    }

    .agenda-time,
    .agenda-title,
    .description-text {
        font-size: 0.9rem; /* Réduire la taille des textes dans l'agenda */
    }

	img, video {
		max-width: 100%;
		height: auto;
	}

    footer {
        font-size: 0.9rem; /* Ajuster la taille du texte du pied de page */
        padding: 15px; /* Réduire le padding du pied de page */
    }
}