@charset "utf-8";

/* FONT FAMILY */
@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Dosis:wght@200..800&display=swap');

/* ICONES */
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");

.archivo-black-regular {
  font-family: "Archivo Black", sans-serif;
  font-weight: 400;
  font-style: normal;
}
.dosis{
  font-family: "Dosis", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
}

:root{
    --prim: #026873; /* rgba(2,104,115,1.00) */
    --sec: #04BF8A; /* rgba(4,191,138,1.00) */
    --light: #f9f9f9; /* rgba(249, 249, 249, 1) */
    --dark: #565656; /* rgba(86,86,86,1.00) */
    --white: #ffffff; /* rgba(255, 255, 255, 1) */
    --black: #000000; /* rgba(0, 0, 0, 1) */
}

/* BUTTONS */
.btn-prim{
    border-radius:7px !important;
    background: var(--prim);
    color: var(--light) !important;
}
.btn-prim:hover{
    background: rgba(2,104,115,0.85);
}
.btn-sec{
    border-radius:7px !important;
    background: var(--sec);
    color: var(--light) !important;
}
.btn-sec:hover{
    background: rgba(4,191,138,0.85);
}


/* GLOBAL */
p, a, li, table{
	font-family: "Dosis", sans-serif !important;
}
h1, h2, h3, h4, h5, h6{
	font-family: "Archivo Black", sans-serif !important;
}

/* CARD */
.card-odd{ border:1px solid var(--prim); }
.card-odd:hover{ border:1px solid var(--light); }
.card-odd a, .card-odd a:hover{ color: var(--prim); }

.card-even{ border:1px solid var(--sec); }
.card-even:hover{ border:1px solid var(--light); }
.card-even a, .card-even a:hover{ color: var(--sec); }


/* BODY */
body{
	background-color: var(--light);
}

/* TOP BARRE */
.top-barre{
    padding:10px;
	background: #026873;
    background: linear-gradient(47deg, rgba(2, 104, 115, 1) 0%, rgba(4, 191, 138, 1) 100%);
}
.top-barre .uk-navbar-nav{
	gap:10px;
}
.top-barre ul li{
	color: var(--light);
}
.top-barre ul li a{
	min-height: auto;
	text-transform: inherit;
	color: var(--white);
	font-size:1rem;
}
.top-barre ul li a:hover{
	color: var(--light);
    text-decoration: underline;
}
.top-barre ul li a i:hover{ color: var(--sec); }


@media screen and (max-width: 480px) {
    .top-barre .uk-navbar-nav{
        gap:3px;
    }
}


/* HEADER */
.header{ background: var(--white); }
.header .logo a img{
	width:150px;
	height:auto;
}
.header .menu .uk-navbar-nav{
	gap:10px;
}
.header .menu .uk-navbar-nav a{
	font-family: "Dosis", sans-serif !important;
	color: var(--sec);
	border-bottom:1px solid var(--white);
	min-height: auto;
	background-color: var(--white);
	padding:10px;
	-webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.1);
	-moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.1);
	box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.1);
	font-size:1rem;
}
.header .menu .uk-navbar-nav a:hover{
	color: var(--prim);
	border-bottom:1px solid var(--prim);
	background-color:transparent;
	-webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0);
	-moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0);
	box-shadow: 0px 2px 2px 0px rgba(0,0,0,0);
}

.header.uk-sticky-fixed{ border-bottom:1px solid var(--sec); }
.header.uk-sticky-fixed img.logo{
    width:100px;
}

.nav-mobile .uk-offcanvas-bar{
    background: var(--white);
}
.nav-mobile .uk-offcanvas-bar .uk-close{
    color: var(--dark);
}
.nav-mobile a img.logo{
    max-width:125px;
    height:auto;
    
}
.nav-mobile ul li a{
    color: var(--prim);
    border-bottom: 1px solid var(--sec);
}
.nav-mobile ul li a:hover{
    color: var(--sec);
}


@media screen and (max-width: 640px) {
    .header .logo a img{
        width:100px;
        height:auto;
    }
}


/* SLOGAN */
.slogan{
	padding:50px;
}
.slogan h1{
	text-align:center;
	color: var(--sec);
    font-size:2.25rem;
}
.slogan h1 span{
	color: var(--prim);
}
.slogan h2{
    font-size:1.85rem;
    text-align: center;
    color: var(--dark);
}

/* ACTUS */
.actus{ padding-bottom: 50px; }
.actus .slideshow, .actus .uk-slideshow-items {
    height:260px !important;
}

@media screen and (max-width: 640px) {
    .actus .slideshow, .actus .uk-slideshow-items {
        height:315px !important;
    }
}

.actus .slideshow .uk-dotnav li a{
    border:1px solid var(--prim) !important;
}
.actus .slideshow .uk-dotnav li.uk-active a{
    background:var(--sec);
}
.actus > div > div > div > div > div > div > div > .uk-card{
	border:1px solid var(--prim);
}
.actus h2{
    color: var(--prim) !important;
    font-size:1.75rem;
}
.actus a.map-link{
    color: var(--sec);
    border: 1px solid var(--sec);
    padding:3px 5px;
    border-radius:50%;
}
.actus a.map-link:hover{ border: 1px solid var(--white); }
.actus .list-btns li a{
	color: var(--light);
	font-weight:600;
	text-align: center;
	display:block;
	padding:7px;
	background-color: var(--prim);
	-webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.1);
	-moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.1);
	box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.1);
}
.actus .list-btns li a:hover{
	background-color:rgba(2,104,115,0.8);
	-webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0);
	-moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0);
	box-shadow: 0px 2px 2px 0px rgba(0,0,0,0);
}

/* APROPOS */
.apropos{
	padding:75px;
    background: #026873;
    background: linear-gradient(47deg, rgba(2, 104, 115, 1) 0%, rgba(4, 191, 138, 1) 100%);
}
.apropos h2{
	color: var(--sec);
    font-size:2rem;
}
.apropos h2 span{
	color: var(--prim);
}

/* CONTENT */
.content{
    padding:75px;
    background: #026873;
    background: linear-gradient(47deg, rgba(2, 104, 115, 1) 0%, rgba(4, 191, 138, 1) 100%);
}
.content h2{
    color:var(--prim);
}

.content h2.uk-heading-bullet::before {
    border-left: calc(5px + .1em) solid #04BF8A;
}
.content h3{
    color:var(--sec);
}
.content h3 span.alinea{
    color: var(--dark);
    font-size:1rem;
    font-weight: normal;
}
.content h4{ color: var(--prim); }
.content h6{
    color: var(--prim);
}
.content table th{
    font-weight:bold;
    color: var(--light);
    background: var(--sec);
    font-size:1rem;
}
.content .uk-inline-clip{
    border:1px solid var(--light);
    border-radius:10px;
}
.content .uk-inline-clip a.uk-icon svg{
    width: 40px;
    height:40px;
    color: var(--sec);
}

/* SIDE GAL */
.side-gal img {
    border: 1px solid var(--light);
    border-radius: 10px;
}


/* COURS */
.cours{
	padding:75px;
    background: var(--white);
}
.cours h2{
	color: var(--sec);
    font-size:2rem;
    text-align:center;
}
.cours h2 span{
	color:#026873
}
.cours .uk-card{
    background: var(--light);
    -webkit-box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.3);
}
.cours .uk-card a{
    font-size:1.25rem;
    font-weight:600;
}
.cours .uk-card a:hover{ text-decoration: underline; }


.gal-filter .gal-nav li{ padding-left:5px; }
.gal-filter .gal-nav li:first-child{ padding-left:20px; }
.gal-filter .gal-nav li a{
    background: var(--light);
    color: var(--sec);
    padding:10px 25px;
    font-size:1rem;
    font-weight:bold;
}
.gal-filter .gal-nav li a:hover, .gal-filter .gal-nav li.uk-active a{
    background: transparent;
    color: var(--light);
}

.gal-filter .gal-nav-mob li a{
    background: var(--light);
    color: var(--sec);
    padding:10px 25px;
    font-size:1rem;
    font-weight:bold;
}
.gal-filter .gal-nav-mob li ul.uk-nav li a{
    background: none;
    color: var(--dark);
    padding:5px 0;
    font-size:1rem;
    font-weight:normal;
}


/* FOOTER */
.footer{
	background-color: var(--sec);
    background-image: url("../images/galerie/image-002.jpeg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-blend-mode: normal;
    padding:75px;
}
.footer img.logo{
    max-width:175px;
    height:auto;
}
.footer h3{ color: var(--sec); }
.footer h4{ color: var(--dark); }
.footer ul li a{
    color: var(--sec);
    font-weight:600;
}
.footer ul li a i{ color: var(--prim); }
.footer address a i{
    background: var(--sec);
    color: var(--light);
    border:1px solid var(--sec);
    padding:3px 5px;
    border-radius:50%;
}
.footer address a:hover i{
    background: var(--ligh);
    color: var(--sec);
    border:1px solid var(--sec);
}

/* COPYRIGHT */
.copyright{ padding:10px; }
.copyright p{ text-align: center; }
.copyright p a{ font-weight:600; }


/* MODAL STTYLE */
.modal-style h2{ color: var(--prim); }