@charset "utf-8";
/* CSS Document */

/******************************

[Table of Contents]

1. Fonts
2. Body and some general stuff
3. Header
	3.1 Top Bar
	3.2 Header Content
	3.3 Logo
	3.4 Main Nav
	3.5 Hamburger
4. Menu
5. Section
6. Home
7. Features
8. Courses
9. Counter
10. Events
11. Team
12. News
13. Newsletter
14. Footer

******************************/

/***********
1. Fonts
***********/

@import url('https://fonts.googleapis.com/css?family=Roboto+Slab:400,700|Roboto:300,400,500,700,900');

/*********************************
2. Body and some general stuff
*********************************/

*
{
	margin: 0;
	padding: 0;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
}
body
{
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
	font-weight: 400;
	background: #FFFFFF;
	color: #a5a5a5;
}

div
{
	display: block;
	position: relative;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
ul
{
	list-style: none;
	margin-bottom: 0px;
}
p
{
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
	line-height: 1.85;
	font-weight: 400;
	color: #76777a;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
}
p a
{
	display: inline;
	position: relative;
	color: inherit;
	border-bottom: solid 1px #ffa07f;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
p:last-of-type
{
	margin-bottom: 0;
}
a, a:hover, a:visited, a:active, a:link
{
	text-decoration: none;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
}
p a:active
{
	position: relative;
	color: #FF6347;
}
p a:hover
{
	color: #FFFFFF;
	background: #ffa07f;
}
p a:hover::after
{
	opacity: 0.2;
}
::selection
{
	
}
p::selection
{
	
}
h1{font-size: 48px;}
h2{font-size: 36px;}
h3{font-size: 24px;}
h4{font-size: 18px;}
h5{font-size: 14px;}
h1, h2, h3, h4, h5, h6
{
	font-family: 'Roboto Slab', serif;
	font-weight: 700;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
	color: #384158;
	margin-bottom: 0;
}
h1::selection, 
h2::selection, 
h3::selection, 
h4::selection, 
h5::selection, 
h6::selection
{
	
}
.form-control
{
	color: #db5246;
}
section
{
	display: block;
	position: relative;
	box-sizing: border-box;
}
.clear
{
	clear: both;
}
.clearfix::before, .clearfix::after
{
	content: "";
	display: table;
}
.clearfix::after
{
	clear: both;
}
.clearfix
{
	zoom: 1;
}
.float_left
{
	float: left;
}
.float_right
{
	float: right;
}
.trans_200
{
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.trans_300
{
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}
.trans_400
{
	-webkit-transition: all 400ms ease;
	-moz-transition: all 400ms ease;
	-ms-transition: all 400ms ease;
	-o-transition: all 400ms ease;
	transition: all 400ms ease;
}
.trans_500
{
	-webkit-transition: all 500ms ease;
	-moz-transition: all 500ms ease;
	-ms-transition: all 500ms ease;
	-o-transition: all 500ms ease;
	transition: all 500ms ease;
}
.fill_height
{
	height: 100%;
}
.super_container
{
	width: 100%;
	overflow: hidden;
	top:10px;
}
.prlx_parent
{
	overflow: hidden;
}
.prlx
{
	height: 130% !important;
}
.parallax-window
{
    min-height: 400px;
    background: transparent;
}
.nopadding
{
	padding: 0px !important;
}

/*********************************
3. Header
*********************************/

.header
{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	box-shadow: 0px 5px 20px rgba(0,0,0,0.05);
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.header.scrolled
{
	top: -40px;
}

/*********************************
3.1 Top Bar
*********************************/

.top_bar
{
	width: 100%;
	background: #334D6C;
}
.header.scrolled .top_bar
{

}
.top_bar_container
{
	width: 100%;
	height: 100%;
}
.top_bar_content
{
	width: 100%;
	height: 40px;
}
.top_bar_contact_list li
{
	display: inline-block;
}
.question
{
	font-family: 'Roboto Slab', serif;
	font-size: 14px;
	color: #FFFFFF;
	margin-left: 0px;
}
.top_bar_contact_list li i,
.top_bar_contact_list li > div
{
	display: inline-block;
	font-size: 14px;
	color: #FFFFFF;
}
.top_bar_contact_list li > div
{
	margin-left: 1px;
}
.top_bar_contact_list li:not(:last-child)
{
	margin-right: 21px;
}
.top_bar_login
{
	height: 100%;
}
.login_button
{
	width: 160px;
	height: 100%;
	background: #f3f3f3;
	text-align: center;
}
.login_button a
{
	display: block;
	font-size: 14px;
	font-weight: 500;
	line-height: 40px;
	color: #384158;
}

/*********************************
3.2 Header Content
*********************************/

.header_container
{
	width: 100%;
	background: #FFFFFF;
}
.header_content
{
	height: 90px;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.header.scrolled .header_content
{
	height: 80px;
}

/*********************************
3.3 Logo
*********************************/

.logo,
.logo_text
{
	display: inline-block;
}
.logo
{
	width: 60px;
	height: 60px;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.logo img
{
	max-width: 100%;
}
.logo_text
{
	font-family: 'Roboto Slab', serif;
	font-size: 36px;
	font-weight: 700;
	line-height: 0.75;
	color: #384158;
	vertical-align: middle;
	margin-left: 7px;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.logo_text span
{
	color: #334D6C;
}
.header.scrolled .logo
{
	width: 40px;
	height: 40px;
}
.header.scrolled .logo_text
{
	font-size: 24px;
}

/*********************************
3.4 Main Nav - CORRIGÉ
*********************************/

.main_nav_contaner
{

}
.main_nav,
.search_button,
.shopping_cart
{
	display: inline-block;
}
.main_nav li
{
	display: inline-block;
	position: relative;
}
.main_nav li:not(:last-child)
{
	margin-right: 44px;
}
.main_nav li a
{
	font-size: 15px;
	font-weight: 500;
	color: #384158;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.main_nav li a:hover{
	color: #F97316;
}
.main_nav li.active a
{
	color: #334D6C;
}
.main_nav li.active::after
{
	display: block;
	position: absolute;
	bottom: -2px;
	left: 0;
	width: 100%;
	height: 2px;
	background: #334D6C;
	content: '';
}
.search_button
{
	margin-left: 46px;
	cursor: pointer;
}
.shopping_cart
{
	margin-left: 23px;
	cursor: pointer;
}
.search_button i,
.shopping_cart i
{
	font-size: 18px;
	color: #181818;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.search_button:hover i,
.shopping_cart:hover i
{
	color: #334D6C;
}
.header_search_form
{
	display: block;
	position: relative;
	width: 40%;
}
.header_search_container
{
	position: absolute;
	bottom: 0px;
	left: 0px;
	width: 100%;
	background: #334D6C;
	z-index: -1;
	opacity: 0;
	-webkit-transition: all 400ms ease;
	-moz-transition: all 400ms ease;
	-ms-transition: all 400ms ease;
	-o-transition: all 400ms ease;
	transition: all 400ms ease;
}
.header_search_container.active
{
	bottom: -73px;
	opacity: 1;
}
.header_search_content
{
	width: 100%;
	height: 73px;
}
.search_input
{
	width: 100%;
	height: 40px;
	border: none;
	outline: none;
	padding-left: 20px;
}
.header_search_button
{
	position: absolute;
	top: 0;
	right: 0;
	width: 40px;
	height: 100%;
	border: none;
	outline: none;
	cursor: pointer;
}

/* Styles pour le sous-menu de la navigation principale - ALIGNÉS À GAUCHE */
.main_nav_has_submenu {
    position: relative;
}

.main_nav_has_submenu:hover .main_nav_submenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.main_nav_submenu_icon {
    margin-left: 5px;
    font-size: 12px;
    transition: transform 0.3s ease;
}

.main_nav_has_submenu:hover .main_nav_submenu_icon {
    transform: rotate(180deg);
}

/* SOUS-MENUS ALIGNÉS À GAUCHE */
.main_nav_submenu {
    position: absolute;
    top: 100%;
    left: 0;
    width: 280px;
    background: #ffffff;
    box-shadow: 0px 10px 30px rgba(0,0,0,0.15);
    border-radius: 8px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    z-index: 1000;
    padding: 10px 0;
    margin-top: 5px;
}

.main_nav_subitem {
    display: block;
    margin: 0;
    position: relative;
}

.main_nav_subitem a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 25px;
    font-size: 14px;
    color: #384158;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid #f5f5f5;
}

.main_nav_subitem:last-child a {
    border-bottom: none;
}

.main_nav_subitem a::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 3px;
    background: #334D6C;
    transform: scaleY(0);
    transition: transform 0.3s ease;
}

.main_nav_subitem a:hover {
    color: #F97316;
    background: rgba(249, 115, 22, 0.05);
    padding-left: 35px;
}

.main_nav_subitem a:hover::before {
    transform: scaleY(1);
}

/* Styles pour les sous-sous-menus alignés à droite */
.main_nav_has_subsubmenu {
    position: relative;
}

.main_nav_has_subsubmenu:hover .main_nav_subsubmenu {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}

.main_nav_subsubmenu_icon {
    margin-left: 5px;
    font-size: 10px;
    transition: transform 0.3s ease;
}

.main_nav_has_subsubmenu:hover .main_nav_subsubmenu_icon {
    transform: rotate(-90deg);
}

.main_nav_subsubmenu {
    position: absolute;
    top: -10px;
    left: 100%;
    width: 250px;
    background: #ffffff;
    box-shadow: 0px 10px 30px rgba(0,0,0,0.15);
    border-radius: 8px;
    opacity: 0;
    visibility: hidden;
    transform: translateX(-10px);
    transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    z-index: 1001;
    padding: 10px 0;
    margin-left: 0;
}

.main_nav_subsubitem a {
    display: flex;
    align-items: center;
    padding: 10px 20px;
    font-size: 13px;
    color: #384158;
    transition: all 0.3s ease;
    position: relative;
    border-bottom: 1px solid #f5f5f5;
}

.main_nav_subsubitem:last-child a {
    border-bottom: none;
}

.main_nav_subsubitem a::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 3px;
    background: #F97316;
    transform: scaleY(0);
    transition: transform 0.3s ease;
}

.main_nav_subsubitem a:hover {
    color: #F97316;
    background: rgba(249, 115, 22, 0.05);
    padding-left: 30px;
}

.main_nav_subsubitem a:hover::before {
    transform: scaleY(1);
}

/* Version responsive pour mobile */
@media (max-width: 992px) {
    .main_nav_has_submenu {
        position: relative;
    }
    
    .main_nav_submenu {
        position: static;
        width: 100%;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        transform: none;
        display: none;
        background: #f8f9fa;
        margin-top: 10px;
        border-radius: 5px;
        padding: 10px 0;
    }
    
    .main_nav_has_submenu.main_nav_active .main_nav_submenu {
        display: block;
    }
    
    .main_nav_subitem a {
        padding: 10px 20px;
        border-left: none;
        border-bottom: 1px solid #e5e5e5;
    }
    
    .main_nav_subitem a:hover {
        padding-left: 20px;
        border-left: none;
    }
    
    .main_nav_subitem:last-child a {
        border-bottom: none;
    }
    
    .main_nav_submenu_icon {
        transition: transform 0.3s ease;
    }
    
    .main_nav_has_submenu.main_nav_active .main_nav_submenu_icon {
        transform: rotate(180deg);
    }
    
    /* Sous-sous-menus en version mobile */
    .main_nav_subsubmenu {
        position: static;
        width: 100%;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        transform: none;
        display: none;
        background: rgba(0,0,0,0.05);
        margin: 10px 0;
        border-radius: 3px;
        padding: 5px 0;
    }
    
    .main_nav_has_subsubmenu.main_nav_active .main_nav_subsubmenu {
        display: block;
    }
    
    .main_nav_subsubitem a {
        padding: 8px 30px;
        font-size: 13px;
    }
    
    .main_nav_subsubmenu_icon {
        transition: transform 0.3s ease;
    }
    
    .main_nav_has_subsubmenu.main_nav_active .main_nav_subsubmenu_icon {
        transform: rotate(90deg);
    }
}

/* Animation pour le menu hamburger */
.hamburger {
    cursor: pointer;
    display: none;
}

@media (max-width: 992px) {
    .hamburger {
        display: block;
    }
    
    .main_nav {
        display: none;
    }
    
    .main_nav.menu_active {
        display: block;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: white;
        box-shadow: 0 5px 15px rgba(0,0,0,0.1);
        z-index: 1000;
    }
}

/*********************************
3.5 Hamburger
*********************************/

.hamburger_container
{

}
.hamburger
{
	display: none;
	cursor: pointer;
}
.hamburger i
{
	font-size: 20px;
	color: #353535;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.hamburger:hover i
{
	color: #334D6C;
}

.menu
{
	position: fixed;
	top: 0;
	right: -400px;
	width: 400px;
	height: 100vh;
	background: #FFFFFF;
	z-index: 101;
	padding-right: 60px;
	padding-top: 87px;
	padding-left: 50px;
}
.menu .logo a
{
	color: #000000;
}
.menu.active
{
	right: 0;
}
.menu_close_container
{
	position: absolute;
	top: 30px;
	right: 60px;
	width: 18px;
	height: 18px;
	transform-origin: center center;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
	cursor: pointer;
}
.menu_close
{
	width: 100%;
	height: 100%;
	transform-style: preserve-3D;
}
.menu_close div
{
	width: 100%;
	height: 2px;
	background: #232323;
	top: 8px;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.menu_close div:last-of-type
{
	-webkit-transform: rotate(90deg) translateX(-2px);
	-moz-transform: rotate(90deg) translateX(-2px);
	-ms-transform: rotate(90deg) translateX(-2px);
	-o-transform: rotate(90deg) translateX(-2px);
	transform: rotate(90deg) translateX(-2px);
	transform-origin: center;
}
.menu_close:hover div
{
	background: #937c6f;
}
.menu .logo
{
	margin-bottom: 60px;
}
.menu_nav ul li
{
	margin-bottom: 9px;
}
.menu_nav ul li a
{
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
	text-transform: uppercase;
	color: rgba(0,0,0,1);
	font-weight: 700;
	letter-spacing: 0.1em;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.menu_nav ul li a:hover
{
	color: #334D6C;
}
.menu .search
{
	width: 100%;
	margin-bottom: 67px;
}
.search
{
	display: inline-block;
	width: 400px;
	-webkit-transform: translateY(2px);
	-moz-transform: translateY(2px);
	-ms-transform: translateY(2px);
	-o-transform: translateY(2px);
	transform: translateY(2px);
}
.menu .header_search_form
{
	width: 100%;
}
.search form
{
	position: relative;
}
.menu .search_input
{
	width: 100%;
	height: 40px;
	background: rgba(0,0,0,0.1);
	border-radius: 3px;
	border: none;
	outline: none;
	padding-left: 15px;
	color: rgba(0,0,0,0.5);
}
.menu .search_input::-webkit-input-placeholder
{
	font-family: 'Roboto', sans-serif;
	font-size: 14px !important;
	font-weight: 400 !important;
	color: rgba(0,0,0,0.4) !important;
}
.menu .search_input:-moz-placeholder
{
	font-family: 'Roboto', sans-serif;
	font-size: 14px !important;
	font-weight: 400 !important;
	color: rgba(0,0,0,0.4) !important;
}
.menu .search_input::-moz-placeholder
{
	font-family: 'Roboto', sans-serif;
	font-size: 14px !important;
	font-weight: 400 !important;
	color: rgba(0,0,0,0.4) !important;
} 
.menu .search_input:-ms-input-placeholder
{ 
	font-family: 'Roboto', sans-serif;
	font-size: 14px !important;
	font-weight: 400 !important;
	color: rgba(0,0,0,0.4) !important;
}
.menu .search_input::input-placeholder
{
	font-family: 'Roboto', sans-serif;
	font-size: 14px !important;
	font-weight: 400 !important;
	color: rgba(0,0,0,0.4) !important;
}

/* Style minimaliste pour les sous-menus */
.menu_has_submenu {
    position: relative;
}

.menu_submenu_icon {
    margin-left: 8px;
    font-size: 10px;
    transition: transform 0.3s ease;
    opacity: 0.6;
}

.menu_submenu {
    display: none;
    padding: 5px 0;
    margin: 8px 0 8px 20px;
    list-style: none;
    width: calc(100% - 20px);
    border-left: 1px solid #e9ecef;
    position: relative;
}

.menu_submenu::before {
    content: '';
    position: absolute;
    left: -1px;
    top: 0;
    height: 100%;
    width: 1px;
    background: #334D6C;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.menu_has_submenu:hover .menu_submenu::before {
    opacity: 0.3;
}

.menu_has_submenu:hover .menu_submenu,
.menu_has_submenu:focus-within .menu_submenu {
    display: block;
}

.menu_has_submenu:hover .menu_submenu_icon,
.menu_has_submenu:focus-within .menu_submenu_icon {
    transform: rotate(180deg);
    opacity: 1;
}

.menu_subitem {
    margin: 2px 0;
    position: relative;
}

.menu_subitem::before {
    content: '';
    position: absolute;
    left: -15px;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 4px;
    background: #334D6C;
    border-radius: 50%;
    opacity: 0;
    transition: all 0.3s ease;
}

.menu_subitem:hover::before {
    opacity: 0.5;
    transform: translateY(-50%) scale(1.2);
}

.menu_subitem a {
    display: flex;
    align-items: center;
    padding: 8px 10px;
    color: #6c757d;
    font-size: 10px;
    font-weight: 400;
    transition: all 0.2s ease;
    text-decoration: none;
    border-radius: 6px;
    position: relative;
}

.menu_subitem a:hover {
    color: #334D6C;
    background: #f8f9fa;
    transform: translateX(5px);
}

/* Style pour les sous-sous-menus */
.menu_has_subsubmenu {
    position: relative;
}

.menu_subsubmenu_icon {
    margin-left: 8px;
    font-size: 9px;
    transition: transform 0.3s ease;
    opacity: 0.5;
}

.menu_subsubmenu {
    display: none;
    padding: 3px 0;
    margin: 5px 0 5px 25px;
    list-style: none;
    width: calc(100% - 25px);
    border-left: 1px solid #f1f3f4;
}

.menu_has_subsubmenu:hover .menu_subsubmenu,
.menu_has_subsubmenu:focus-within .menu_subsubmenu {
    display: block;
}

.menu_has_subsubmenu:hover .menu_subsubmenu_icon,
.menu_has_subsubmenu:focus-within .menu_subsubmenu_icon {
    transform: rotate(90deg);
    opacity: 1;
}

.menu_subsubitem {
    margin: 1px 0;
}

.menu_subsubitem a {
    display: flex;
    align-items: center;
    padding: 8px 15px 8px 20px;
    color: #868e96;
    font-size: 10px;
    font-weight: 400;
    transition: all 0.2s ease;
    text-decoration: none;
    border-radius: 4px;
}

.menu_subsubitem a::before {
    content: '';
    position: absolute;
    left: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 3px;
    background: #F97316;
    border-radius: 50%;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.menu_subsubitem a:hover {
    color: #F97316;
    background: #fff5f5;
    padding-left: 25px;
}

.menu_subsubitem a:hover::before {
    opacity: 1;
}

/* Animation subtile */
.menu_submenu,
.menu_subsubmenu {
    animation: fadeInUp 0.25s ease-out;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(5px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Indicateurs visuels */
.menu_has_submenu > a {
    position: relative;
    font-weight: 500;
}

.menu_has_submenu > a::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 0;
    height: 1px;
    background: #334D6C;
    transition: width 0.3s ease;
}

.menu_has_submenu:hover > a::after {
    width: 100%;
}

/* Style pour les états actifs */
.menu_subitem a.active {
    color: #334D6C;
    background: #e3f2fd;
    font-weight: 500;
}

.menu_subsubitem a.active {
    color: #F97316;
    background: #fff3e0;
    font-weight: 500;
}

.menu_subitem a.active::before,
.menu_subsubitem a.active::before {
    opacity: 1;
    transform: translateY(-50%) scale(1.5);
}

/* Version ultra-minimaliste pour mobile */
@media (max-width: 768px) {
    .menu_submenu {
        margin-left: 10px;
        width: calc(100% - 15px);
        border-left-width: 2px;
        border-left-color: #e9ecef;
    }
    
    .menu_subsubmenu {
        margin-left: 20px;
        width: calc(100% - 20px);
    }
    
    .menu_subitem a {
        padding: 12px 15px;
        font-size: 10px;
    }
    
    .menu_subsubitem a {
        padding: 10px 15px 10px 25px;
        font-size: 10px;
    }
    
    .menu_subitem::before {
        left: -12px;
        width: 6px;
        height: 6px;
    }
}

/* Effet de focus pour l'accessibilité */
.menu_subitem a:focus,
.menu_subsubitem a:focus {
    outline: 2px solid #334D6C;
    outline-offset: 2px;
}

/* Transition groupée pour un effet plus cohérent */
.menu_has_submenu,
.menu_has_subsubmenu {
    transition: all 0.2s ease;
}

/* Style alternatif avec bordures */
.menu_submenu {
    border-left-style: dashed;
}

.menu_subsubmenu {
    border-left-style: dotted;
}

/* Effet de surbrillance au survol */
.menu_subitem a:hover,
.menu_subsubitem a:hover {
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

/*********************************
5. Section
*********************************/
.section_title_container_service
{
	max-width: 600px;
	margin: 0 auto;
	top: -80px;
}
.section_title_container
{
	max-width: 600px;
	margin: 0 auto;
	
}
.section_title
{
	line-height: 1.2;
	
}
.section_subtitle
{
	line-height: 1.85;
	margin-top: 14px;
}
.section_background
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/*********************************
6. Home
*********************************/

/*********************************
6. Home - Slider divisé en deux parties
*********************************/

.super_container {
    width: 100%;
    overflow: hidden;
}

/* Reset pour le slider */
.home {
    width: 100%;
    /* height: 80vh; */
	height: 80vh;
    min-height: 600px;
    position: relative;
	top:15%;
   
}

.slider-container {
    width: 100%;
    height: 80%;
    position: relative;
    overflow: hidden;
}

.slider-slide {
    position: absolute;
    top: 15%;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
    pointer-events: none;
}

.slider-slide.active {
    opacity: 1;
    pointer-events: all;
}

.slide-left {
    width: 50%;
    height: 100%;
    background: #f0f0f0;
}

.slide-left img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.slide-right {
    width: 50%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    top: -60px;
    background: #f8f9fa;
}

.slide-content {
    max-width: 800px;
    width: 100%;
}

.slide-content h5 {
    font-size: 2rem;
    color: #2c3e50;
    /* margin-bottom: 20px; */
	 margin: 20px;
    line-height: 1.3;
}

.slide-content p {
    font-size: 1rem;
    color: #5a5a5c;
    /* margin-bottom: 60px; */
	 margin: 20px;
    line-height: 1;
}

.slide-btn {
    padding: 12px 30px;
    /* background: #3498db; */
    /* color: white; */
    border: none;
    border-radius: 5px;
    font-size: 16px;
    cursor: pointer;
    /* transition: background 0.3s; */
	 margin: 20px;
	
}



/* Navigation */
.slider-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    height: 50px;
    background: rgba(255,255,255,0.9);
    border: none;
    border-radius: 50%;
    font-size: 24px;
    cursor: pointer;
    z-index: 10;
    transition: all 0.3s;
}

.slider-nav:hover {
    background: white;
    transform: translateY(-50%) scale(1.1);
}

.slider-nav.prev {
    left: 20px;
}

.slider-nav.next {
    right: 20px;
}

/* Indicateurs */
.slider-indicators {
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    gap: 10px;
    z-index: 10;
}

.indicator {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: rgba(255,255,255,0.5);
    cursor: pointer;
    transition: all 0.3s;
}

.indicator.active {
    background: white;
    transform: scale(1.2);
}

/* Rslide-content*/
@media (max-width: 800px) {
    .slider-slide {
        flex-direction: column;
    }
    
    .slide-left, .slide-right {
        width: 100%;
        height: 50%;
    }
    
    .slide-right {
        padding: 20px;
    }
    
    .slide-content h5 {
        font-size: 1.2rem;
    }
    
    .slide-content p {
        font-size: 0.85rem;
    }
}

/* Indicateur de chargement */
.loading {
    text-align: center;
    padding: 20px;
    font-size: 18px;
    color: #3498db;
}

/*********************************
7. formation
*********************************/

.container_formation {
    max-width: 1200px;
    margin: 0 auto;
    bottom: 40px;
}

header {
    text-align: center;
    margin-bottom: 50px;
}

header h1 {
    font-size: 2.5rem;
    color: #2c3e50;
    margin-bottom: 15px;
    position: relative;
    display: inline-block;
}

header h1::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 4px;
    background: #3498db;
    border-radius: 2px;
}

header p {
    font-size: 1.2rem;
    color: #7f8c8d;
    max-width: 600px;
    margin: 0 auto;
}

.icon-wrapper {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    background: rgba(52, 152, 219, 0.1);
}

.icon-wrapper i {
    font-size: 28px;
    color: #3498db;
}

/*********************************
7. Features
*********************************/
.custom-icon {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: linear-gradient(135deg, #6a11cb 0%, #2575fc 100%);
    margin: 0 auto 20px;
}
.custom-icon i {
    color: white;
    font-size: 2.5rem;
}
.features
{
	width: 100%;
	background: #FFFFFF;
	padding-top: 120px;
	padding-bottom: 103px;
}
.features_row
{
	top:20px;
}
.feature
{
	width: 100%;
	padding-top: 30px;
	padding-bottom: 28px;
	padding-left: 15px;
	padding-right: 15px;
	background: #FFFFFF;
}
.feature:hover
{
	box-shadow: 0px 5px 40px rgba(29,34,47,0.15);
}
.feature_icon
{
	height: 55px;
}
.feature_icon img
{
	max-width: 100%;
}

.feature_logo
{
	height: 60px;
}
.feature_logo img
{
	max-width: 100%;
}
.feature_title
{
	position: relative;
	font-size: 20px;
	margin-top: 23px;
}

/*********************************
8. Courses
*********************************/

.courses
{
	width: 100%;
	padding-top: 93px;
	padding-bottom: 100px;
}
.courses_row
{
	margin-top: 45px;
}
.course
{
	width: 100%;
	border-radius: 6px;
	background: #FFFFFF;
	box-shadow: 0px 1px 10px rgba(29,34,47,0.1);
}
.course_image
{
	width: 100%;
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
	overflow: hidden;
}
.course_image img
{
	max-width: 100%;
}
.course_body
{
	padding-top: 22px;
	padding-left: 30px;
	padding-right: 30px;
	padding-bottom: 23px;
}
.course_title a
{
	font-family: 'Roboto Slab', serif;
	font-size: 20px;
	color: #384158;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.course_title a:hover
{
	color: #334D6C;
}
.course_teacher
{
	font-size: 15px;
	font-weight: 400;
	color: #384158;
	margin-top: 6px;
}
.course_text
{
	margin-top: 13px;
}
.course_footer
{
	padding-left: 30px;
	padding-right: 30px;
}
.course_footer_content
{
	width: 100%;
	border-top: solid 1px #e5e5e5;
	padding-top: 9px;
	padding-bottom: 11px;
}
.course_info
{
	display: inline-block;
	font-size: 14px;
	font-weight: 400;
	color: #55555a;
}
.course_info:first-child
{
	margin-right: 18px;
}
.course_info i
{
	color: #ffc80a;
}
.course_price
{
	font-family: 'Roboto Slab', serif;
	font-size: 20px;
	font-weight: 700;
	color: #334D6C;
}
.course_price span
{
	font-family: 'Roboto Slab', serif;
	font-size: 14px;
	font-weight: 400;
	text-decoration: line-through;
	color: #b5b8be;
	margin-right: 10px;
}
.courses_button
{
	width: 210px;
	height: 46px;
	border-radius: 3px;
	background: #334D6C;
	text-align: center;
	margin: 0 auto;
	margin-top: 41px;
	box-shadow: 0px 5px 40px rgba(29,34,47,0.15);
}
.courses_button:hover
{
	box-shadow: 0px 5px 40px rgba(29,34,47,0.45);
}
.courses_button a
{
	display: block;
	font-size: 14px;
	font-weight: 500;
	text-transform: uppercase;
	line-height: 46px;
	color: #FFFFFF;
}

/*********************************
9. Counter
*********************************/

.counter
{
	width: 100%;
	background: #FFFFFF;
	z-index: 2;
	position: relative;
}
.counter_background
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.counter_content
{
	padding-top: 119px;
	padding-bottom: 125px;
}
.counter_title
{
	font-family: 'Roboto Slab', serif;
	color: #FFFFFF;
	font-weight: 700;
}
.counter_text
{
	margin-top: 19px;
}
.counter_text p
{
	color: #FFFFFF;
}

/* Styles pour les milestones - TOUT SUR LA MÊME LIGNE */
.milestones
{
	margin-top: 39px;
	display: flex;
	flex-wrap: nowrap; /* Empêche le passage à la ligne */
	justify-content: space-between; /* Répartit l'espace équitablement */
	align-items: center;
	width: 100%;
	overflow-x: auto; /* Scroll horizontal si nécessaire */
	gap: 10px; /* Espacement réduit */
}

.milestone
{
	text-align: center;
	flex: 1; /* Chaque élément prend une part égale */
	min-width: 120px; /* Largeur minimale réduite */
	padding: 10px;
	position: relative;
	white-space: nowrap; /* Empêche le texte de passer à la ligne */
}

/* Séparateurs entre les éléments */
.milestone:not(:last-child)::after
{
	display: block;
	position: absolute;
	top: 50%;
	right: -5px; /* Position rapprochée */
	width: 1px;
	height: 30px;
	background: rgba(255,255,255,0.2);
	content: '';
	transform: rotate(30deg) translateY(-50%);
}

/* Styles pour les icônes */
.icon-wrapper {
	width: 50px; /* Taille réduite */
	height: 50px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 10px;
	background: rgba(52, 152, 219, 0.1);
}

.icon-wrapper i {
	font-size: 20px; /* Taille réduite */
	color: #3498db;
}

/* Couleurs spécifiques pour chaque milestone */
.milestone:nth-child(1) .icon-wrapper { background: rgba(52, 152, 219, 0.1); }
.milestone:nth-child(1) .icon-wrapper i { color: #3498db; }

.milestone:nth-child(2) .icon-wrapper { background: rgba(155, 89, 182, 0.1); }
.milestone:nth-child(2) .icon-wrapper i { color: #9b59b6; }

.milestone:nth-child(3) .icon-wrapper { background: rgba(231, 76, 60, 0.1); }
.milestone:nth-child(3) .icon-wrapper i { color: #e74c3c; }

.milestone:nth-child(4) .icon-wrapper { background: rgba(26, 188, 156, 0.1); }
.milestone:nth-child(4) .icon-wrapper i { color: #1abc9c; }

.milestone:nth-child(5) .icon-wrapper { background: rgba(230, 126, 34, 0.1); }
.milestone:nth-child(5) .icon-wrapper i { color: #e67e22; }

.milestone:nth-child(6) .icon-wrapper { background: rgba(241, 196, 15, 0.1); }
.milestone:nth-child(6) .icon-wrapper i { color: #f1c40f; }

.milestone:nth-child(7) .icon-wrapper { background: rgba(46, 204, 113, 0.1); }
.milestone:nth-child(7) .icon-wrapper i { color: #2ecc71; }

.milestone:nth-child(8) .icon-wrapper { background: rgba(142, 68, 173, 0.1); }
.milestone:nth-child(8) .icon-wrapper i { color: #8e44ad; }

.milestone:nth-child(9) .icon-wrapper { background: rgba(52, 73, 94, 0.1); }
.milestone:nth-child(9) .icon-wrapper i { color: #34495e; }

.milestone_counter
{
	font-size: 32px; /* Taille réduite */
	font-weight: 700;
	line-height: 1;
	color: white;
	margin: 8px 0;
}

.milestone_text
{
	font-size: 15px; /* Taille réduite pour tenir sur une ligne */
	font-weight: 500;
	color: white;
	text-transform: uppercase;
	margin-top: 5px;
	line-height: 1.2;
}

/* Scroll horizontal personnalisé */
.milestones::-webkit-scrollbar {
	height: 5px;
}

.milestones::-webkit-scrollbar-track {
	background: rgba(255,255,255,0.1);
}

.milestones::-webkit-scrollbar-thumb {
	background: rgba(255,255,255,0.3);
	border-radius: 10px;
}
.counter_form
{
	position: absolute;
	top: 0;
	right: 30px;
	width: 380px;
	height: 100%;
	background: #FFFFFF;
	padding-left: 40px;
	padding-right: 40px;
	box-shadow: 0px 5px 40px rgba(29,34,47,0.15);
}
.counter_form_content
{
	display: block;
	position: relative;
	width: 100%;
	height: 100%;
}
.counter_form_title
{
	font-family: 'Roboto Slab', serif;
	font-size: 24px;
	font-weight: 700;
	color: #384158;
	text-transform: uppercase;
	line-height: 0.75;
	margin-bottom: 41px;
}
.counter_input
{
	width: 100%;
	height: 46px;
	border: solid 1px #e5e5e5;
	border-radius: 3px;
	padding-left: 20px;
	outline: none;
	color: #384158;
	font-size: 14px;
}
.counter_input:not(:last-child)
{
	margin-bottom: 10px;
}
.counter_text_input
{
	height: 90px;
	padding-top: 10px;
}
.counter_options
{
	position: relative;
	-webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
    -webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
	-webkit-user-select: none;
	background-image: url(../images/down.png);
	background-position: center right;
	background-repeat: no-repeat;
}
.counter_input::-webkit-input-placeholder,
.counter_text_input::-webkit-input-placeholder
{
	font-size: 14px !important;
	font-weight: 400 !important;
	color: #b5b8be !important;
}
.counter_input:-moz-placeholder,
.counter_text_input:-moz-placeholder
{
	font-size: 14px !important;
	font-weight: 400 !important;
	color: #b5b8be !important;
}
.counter_input::-moz-placeholder,
.counter_text_input::-moz-placeholder
{
	font-size: 14px !important;
	font-weight: 400 !important;
	color: #b5b8be !important;
} 
.counter_input:-ms-input-placeholder,
.counter_text_input:-ms-input-placeholder
{ 
	font-size: 14px !important;
	font-weight: 400 !important;
	color: #b5b8be !important;
}
.counter_input::input-placeholder,
.counter_text_input::input-placeholder
{
	font-size: 14px !important;
	font-weight: 400 !important;
	color: #b5b8be !important;
}
.counter_form_button
{
	width: 100%;
	height: 46px;
	color: #FFFFFF;
	font-size: 14px;
	font-weight: 500;
	text-transform: uppercase;
	border: none;
	outline: none;
	background: #334D6C;
	cursor: pointer;
	margin-top: 30px;
	box-shadow: 0px 5px 40px rgba(29,34,47,0.15);
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.counter_form_button:hover
{
	box-shadow: 0px 5px 40px rgba(29,34,47,0.45);
}

/*********************************
10. Events
*********************************/

.events
{
	width: 100%;
	padding-top: 93px;
	padding-bottom: 70px;
	background: #FFFFFF;
}
.events_row
{
	margin-top: 47px;
}
.event_left
{
	padding-right: 20px;
}
.event_mid
{
	padding-left: 10px;
	padding-right: 10px;
}
.event_right
{
	padding-left: 20px;
}
.event_image
{
	width: 100%;
	border-radius: 5px;
	overflow: hidden;
}
.event_image img
{
	max-width: 100%;
}
.event_body
{
	padding-top: 30px;
	padding-bottom: 30px;
}
.event_date
{
	box-shadow: 0px 1px 10px rgba(29, 34, 47, 0.1);
}
.event_date > div
{
	width: 60px;
	height: 60px;
}
.event_day
{
	font-family: 'Roboto Slab', serif;
	font-size: 24px;
	color: #334D6C;
	font-weight: 700;
	line-height: 0.75;
}
.event_month
{
	font-family: 'Roboto Slab', serif;
	font-size: 14px;
	color: #334D6C;
	font-weight: 400;
	line-height: 0.75;
	margin-top: 9px;
}
.event:hover .event_date > div
{
	background: #334D6C;
}
.event:hover .event_day,
.event:hover .event_month
{
	color: #FFFFFF;
}
.event_content
{
	padding-left: 20px;
}
.event_title a
{
	font-family: 'Roboto Slab', serif;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.4;
	color: #384158;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.event_title a:hover
{
	color: #334D6C;
}
.event_info_container
{
	margin-top: 11px;
}
.event_info
{
	display: inline-block;
	color: #b5b8be;
	font-size: 14px;
}
.event_info:not(:last-child)
{
	margin-right: 17px;
}
.event_info span
{
	margin-left: 4px;
}
.event_text
{
	margin-top: 12px;
}

/*********************************
11. Team
*********************************/

.team
{
	width: 100%;
	padding-top: 93px;
	padding-bottom: 60px;
}
.team_background
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.team_row
{
	margin-top: 43px;
}
.team_col
{
	margin-bottom: 40px;
}
.team_item
{
	width: 100%;
}
.team_image
{
	width: 180px;
	height: 160px;
	border-radius: 6px;
	overflow: hidden;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: -86px;
	z-index: 5;
}
.team_image img
{
	max-width: 100%;
}
.team_body
{
	width: 100%;
	padding-top: 108px;
	padding-bottom: 24px;
	background: #FFFFFF;
	border-radius: 6px;
	box-shadow: 0px 1px 10px rgba(29,34,47,0.1);
	text-align: center;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.team_item:hover .team_body
{
	box-shadow: 0px 5px 40px rgba(29,34,47,0.15);
}
.team_title a
{
	font-family: 'Roboto Slab', serif;
	font-size: 20px;
	font-weight: 700;
	color: #384158;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.team_title a:hover
{
	color: #334D6C;
}
.team_subtitle
{
	font-size: 14px;
	font-weight: 400;
	color: #76777a;
	margin-top: 6px;
}
.social_list
{
	margin-top: 16px;
}
.social_list ul li
{
	display: inline-block;
}
.social_list ul li:not(:last-child)
{
	margin-right: 10px;
}
.social_list ul li a i
{
	font-size: 18px;
	color: #76777a;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.social_list ul li:hover a i
{
	color: #334D6C;
}
.team_col .team_item
{
	padding-left: 6px;
	padding-right: 6px;
}
.team_col:first-child .team_item
{
	padding-left: 0;
	padding-right: 6px;
}
.team_col:nth-child(4n) .team_item
{
	padding-left: 6px;
	padding-right: 0;
}

/*********************************
12. News
*********************************/

.news
{
	width: 100%;
	top:0px;
	padding-bottom: 100px;
	background: #FFFFFF;
}
.news_row
{
	margin-top: 55px;
}
.news_post_large_container
{
	padding-right: -20px;
	margin-right: -90%;
}
.news_post_large
{
	width: 90%;
}
.news_post_image
{
	width: 90%;
	border-radius: 6px;
	overflow: hidden;
}
.news_post_image img
{
	max-width: 90%;
}
.news_post_large_title
{
	margin-top: 23px;
}
.news_post_large_title a
{
	font-family: 'Roboto Slab', serif;
	font-size: 20px;
	font-weight: 700;
	color: #384158;
	line-height: 1.4;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.news_post_large_title a:hover
{
	color: #334D6C;
}
.news_post_meta
{
	margin-top: 0px;
}
.news_post_meta ul li
{
	display: inline-block;
	position: relative;
}
.news_post_meta ul li:not(:last-of-type)::after
{
	display: inline-block;
	position: relative;
	content: '|';
	margin-left: 14px;
	margin-right: 11px;
}
.news_post_meta ul li a
{
	font-size: 14px;
	font-weight: 400;
	color: #b5b8be;
	text-transform: uppercase;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.news_post_meta ul li a:hover
{
	color: #334D6C;
}
.news_post_text
{
	margin-top: 13px;
}
.news_post_link
{
	margin-top: 19px;
}
.news_post_link a
{
	font-size: 14px;
	font-weight: 400;
	text-transform: uppercase;
	color: #384158;
	text-decoration: underline;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.news_post_link a:hover
{
	/* color: #334D6C; */
}
.news_posts_small
{
	margin-top: -6px;
}
.news_post_small:not(:last-child)
{
	padding-bottom: 5px;
	border-bottom: solid 1px #e5e5e5;
}
.news_post_small:not(:first-child)
{
	padding-top: -3px;
}
.news_post_small_title a
{
	font-family: 'Roboto Slab', serif;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.55;
	color: #384158;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.news_post_small_title a:hover
{
	color: #334D6C;
}

/*********************************
13. Newsletter
*********************************/

.newsletter
{
	width: 100%;
}
.newsletter_background
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.newsletter_container
{
	width: 100%;
	height: 120px;
}
.newsletter_title
{
	font-family: 'Roboto Slab', serif;
	font-size: 20px;
	font-weight: 700;
	text-transform: uppercase;
	color: #FFFFFF;
}
.newsletter_subtitle
{
	font-size: 14px;
	font-weight: 400;
	color: #FFFFFF;
	margin-top: 6px;
}
.newsletter_form_container
{
	width: 450px;
	padding-left: 20px;
}
.newsletter_form
{
	display: block;
	position: relative;
	width: 100%;
}
.newsletter_input
{
	width: calc(100% - 136px);
	height: 40px;
	background: rgba(255,255,255,0.4);
	border: none;
	outline: none;
	padding-left: 20px;
	color: #FFFFFF;
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
}
.newsletter_input::-webkit-input-placeholder
{
	font-size: 14px !important;
	font-weight: 400 !important;
	color: #FFFFFF !important;
}
.newsletter_input:-moz-placeholder
{
	font-size: 14px !important;
	font-weight: 400 !important;
	color: #FFFFFF !important;
}
.newsletter_input::-moz-placeholder
{
	font-size: 14px !important;
	font-weight: 400 !important;
	color: #FFFFFF !important;
} 
.newsletter_input:-ms-input-placeholder
{ 
	font-size: 14px !important;
	font-weight: 400 !important;
	color: #FFFFFF !important;
}
.newsletter_input::input-placeholder
{
	font-size: 14px !important;
	font-weight: 400 !important;
	color: #FFFFFF !important;
}
.newsletter_button
{
	width: 136px;
	height: 40px;
	background: #FFFFFF;
	border-radius: 3px;
	border: none;
	outline: none;
	cursor: pointer;
	font-size: 14px;
	text-transform: uppercase;
	color: #334D6C;
	font-weight: 500;
	letter-spacing: 0.1em;
}

/*********************************
14. Footer
*********************************/

.footer
{
	display: block;
	position: relative;
	width: 100%;
	background: #1e2434;
	padding-top: 94px;
}
.footer_background
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.footer_content
{
	padding-bottom: 53px;
}
.footer_logo_text
{
	font-family: 'Roboto Slab', serif;
	font-size: 36px;
	font-weight: 700;
	line-height: 0.75;
	color: #FFFFFF;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.footer_logo_text span
{
	color: #334D6C;
}
.footer_title
{
	font-family: 'Roboto Slab', serif;
	font-size: 18px;
	font-weight: 700;
	color: #FFFFFF;
	line-height: 0.75;
}
.footer_logo_container
{
	margin-top: -14px;
}
.footer_about_text
{
	margin-top: 31px;
}
.footer_about_text p
{
	color: #FFFFFF;
}
.footer_social
{
	margin-top: 23px;
}
.footer_social ul li
{
	display: inline-block;
	width: 45px;
	height: 45px;
	background: #4b505d;
	border-radius: 50%;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.footer_social ul li:not(:last-child)
{
	margin-right: 6px;
}
.footer_social ul li a
{
	display: block;
	position: relative;
	text-align: center;
}
.footer_social ul li a i
{
	color: #FFFFFF;
	line-height: 45px;
}
.footer_social ul li:hover
{
	background: #334D6C;
}
.footer_contact
{
	padding-left: 36px;
}
.footer_contact_info
{
	margin-top: 33px;
}
.footer_contact_info ul li
{
	font-size: 14px;
	font-weight: 400;
	color: #b5b8be;
}
.footer_contact_info ul li:not(:last-child)
{
	margin-bottom: 15px;
}
.footer_links
{
	padding-left: 80px;
}
.footer_links_container ul
{
	columns: 2;
	-webkit-columns: 2;
	-moz-columns: 2;
}
.footer_links_container
{
	margin-top: 33px;
}
.footer_links_container ul li a
{
	font-size: 14px;
	color: #b5b8be;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.footer_links_container ul li:not(:last-child)
{
	margin-bottom: 15px;
}
.footer_links_container ul li a:hover
{
	color: #334D6C;
}
.footer_mobile
{
	display: inline-block;
	float: right;
}
.footer_mobile_content
{
	padding-top: 35px;
}
.footer_image:not(:last-child)
{
	margin-bottom: 10px;
}
.copyright
{
	height: 54px;
	border-top: solid 1px #353a49;
}
.cr_list li
{
	display: inline-block;
}
.copyright div
{
	font-size: 14px;
	color: #b5b8be;
}
.cr_text a
{
	color: #FFFFFF;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.cr_text a:hover
{
	color: #334D6C;
}
.cr_list li:not(:last-child)
{
	margin-right: 50px;
}
.cr_list li a
{
	font-size: 14px;
	color: #b5b8be;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.cr_list li a:hover
{
	color: #334D6C;
}

/*********************************
15. Styles supplémentaires pour le slider
*********************************/

:root{
    --accent: #0b61a4;
    --bg: #f6f8fb;
    --text: #0f1724;
    --muted: #6b7280;
    --slide-height: 56vh;
    --control-size: 44px;
    --dot-size: 10px;
}

*{box-sizing:border-box}
body{
    font-family: system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial;
    margin:0;
    background:var(--bg);
    color:var(--text);
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    padding:24px;
}

.uni-slider{
    max-width:1100px;
    margin:0 auto;
    background:white;
    border-radius:12px;
    box-shadow:0 6px 28px rgba(11,17,26,0.08);
    overflow:hidden;
}

/* Slider viewport */
.slider-viewport{
    position:relative;
    width:100%;
    height:var(--slide-height);
    overflow:hidden;
}

.slides{
    display:flex;
    width:100%;
    height:100%;
    transition:transform 600ms cubic-bezier(.22,.9,.34,1);
    will-change:transform;
}

.slide{
    min-width:100%;
    height:100%;
    position:relative;
    display:flex;
    align-items:flex-end;
    justify-content:flex-start;
    background:linear-gradient(180deg, rgba(0,0,0,0.12), rgba(0,0,0,0.3));
}

.slide img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

/* caption */
.caption{
    position:relative;
    z-index:2;
    padding:28px;
    color:white;
    max-width:62%;
    backdrop-filter: blur(3px);
}
.caption h2{
    margin:0 0 8px 0;
    font-size:clamp(20px,3.2vw,34px);
    line-height:1.05;
    text-shadow:0 2px 10px rgba(0,0,0,0.45);
}
.caption p{ margin:0 0 14px 0; color:rgba(255,255,255,0.9) }
.caption .cta{
    display:inline-block;
    padding:10px 14px;
    background:var(--accent);
    color:white;
    border-radius:8px;
    text-decoration:none;
    font-weight:600;
    box-shadow:0 6px 16px rgba(11,97,164,0.16);
}

/* Controls */
.control{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:var(--control-size);
    height:var(--control-size);
    border-radius:8px;
    background:rgba(255,255,255,0.92);
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 6px 18px rgba(11,17,26,0.08);
    border: none;
    cursor:pointer;
    z-index:5;
}
.control:active{ transform:translateY(-50%) scale(.98) }
.control svg{ width:20px; height:20px; fill:var(--accent) }

.prev{ left:12px; }
.next{ right:12px; }

/* Dots */
.dots{
    display:flex;
    gap:10px;
    padding:14px 18px;
    justify-content:center;
    background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0));
}
.dot{
    width:var(--dot-size);
    height:var(--dot-size);
    border-radius:999px;
    background:rgba(15,23,36,0.18);
    border:1px solid rgba(15,23,36,0.06);
    cursor:pointer;
}
.dot[aria-current="true"]{
    background:var(--accent);
    transform:scale(1.12);
    box-shadow:0 6px 14px rgba(11,97,164,0.18);
}

/* small caption details for accessible read */
.slide .meta {
    display:flex;
    gap:12px;
    align-items:center;
    margin-top:8px;
    color:rgba(255,255,255,0.85);
    font-size:0.95rem;
}

/* rtweak for small screens */
@media (max-width:720px){
    :root{ --slide-height:46vh }
    .caption{ max-width:90%; padding:16px }
    .control{ width:40px; height:40px }
}

/* keyboard focus visible */
.control:focus, .dot:focus, .caption a:focus {
    outline:3px solid rgba(11,97,164,0.14);
    outline-offset:3px;
}

/*********************************
16. CORRECTION FINALE POUR SOUS-MENUS ALIGNÉS À GAUCHE
*********************************/

/* Surcharge finale pour garantir l'alignement à gauche */
.main_nav > li > .main_nav_submenu {
    left: 0 !important;
    right: auto !important;
}

.main_nav_subitem > .main_nav_subsubmenu {
    left: 100% !important;
    right: auto !important;
}

/* Correction pour les derniers éléments du menu */
.main_nav > li:last-child .main_nav_submenu,
.main_nav > li:nth-last-child(2) .main_nav_submenu {
    left: 0 !important;
    right: auto !important;
}

.main_nav > li:last-child .main_nav_subitem .main_nav_subsubmenu,
.main_nav > li:nth-last-child(2) .main_nav_subitem .main_nav_subsubmenu {
    left: 100% !important;
    right: auto !important;
}

.main_nav_submenu,
.main_nav_subitem,
.main_nav_subitem a {
    text-align: left !important;      /* force l’alignement à gauche */
    margin: 0 !important;
    padding-left: 10px !important;    /* espace pour la barre ::before */
    display: block !important;        /* annule tout flex précédent */
}





    * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        
        body {
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            line-height: 1.6;
            color: #333;
            background-color: #f8f9fa;
        }
        
        .responsive-section {
            max-width: 1200px;
            margin: 40px auto;
            padding: 0 20px;
        }
        
        .section-header {
            text-align: center;
            margin-bottom: 40px;
        }
        
        .section-title {
            font-size: 2rem;
            color: #c62828;
            margin-bottom: 15px;
            position: relative;
            display: inline-block;
        }
        
        .section-title:after {
            content: '';
            position: absolute;
            bottom: -10px;
            left: 50%;
            transform: translateX(-50%);
            width: 80px;
            height: 3px;
            background-color: #c62828;
        }
        
        .section-subtitle {
            font-size: 1rem;
            color: #666;
            max-width: 700px;
            margin: 0 auto;
        }
        
        .image-container {
            width: 100%;
            max-width: 900px;
            margin: 0 auto;
            border-radius: 12px;
            overflow: hidden;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
        
        .image-container:hover {
            transform: translateY(-5px);
            box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
        }
        
        .responsive-image {
            width: 100%;
            height: auto;
            display: block;
            transition: transform 0.5s ease;
        }
        
        .image-container:hover .responsive-image {
            transform: scale(1.03);
        }
        
        .image-caption {
            padding: 20px;
            background-color: white;
            text-align: center;
        }
        
        .image-title {
            font-size: 1.4rem;
            font-weight: 600;
            margin-bottom: 8px;
            color: #2c3e50;
        }
        
        .image-subtitle {
            font-size: 1rem;
            color: #7f8c8d;
        }
        
        /*  Radjustments */
        @media (max-width: 768px) {
            .section-title {
                font-size: 1.8rem;
            }
            
            .section-subtitle {
                font-size: 1rem;
            }
            
            .image-title {
                font-size: 1.2rem;
            }
            
            .image-subtitle {
                font-size: 0.9rem;
            }
        }
        
        @media (max-width: 480px) {
            .responsive-section {
                margin: 20px auto;
                padding: 0 15px;
            }
            
            .section-header {
                margin-bottom: 30px;
            }
            
            .section-title {
                font-size: 1.5rem;
            }
            
            .image-caption {
                padding: 15px;
            }
        }



		/* ============================================
   CORRECTION DU CHEVAUCHEMENT TEXTE/IMAGE
   ============================================ */

/* Positionnement relatif pour les éléments enfants */
.news_post_large {
    position: relative;
    display: flex;
    flex-direction: column;
}

/* Conteneur d'image avec hauteur fixe relative */
.news_post_image {
    position: relative;
    width: 100% !important;
    height: 200px; /* Hauteur fixe pour tous les écrans */
    overflow: hidden;
    flex-shrink: 0; /* Empêche le rétrécissement */
}

.news_post_image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Conteneur du contenu textuel */
.news_post_large > div:not(.news_post_image) {
    position: relative;
    z-index: 2;
    background: white; /* Fond blanc pour le texte */
}

.news_post_large_title {
    margin-top: 15px;
    padding: 0 15px;
}

.news_post_meta {
    padding: 0 15px 10px;
    margin-top: 5px;
}

.news_post_link {
    padding: 0 15px 15px;
}

/* Pour les très petits écrans */
@media (max-width: 576px) {
    .news_post_image {
        height: 180px; /* Hauteur réduite sur mobile */
    }
    
    .news_post_large_title {
        margin-top: 12px;
        padding: 0 12px;
    }
    
    .news_post_large_title a {
        display: block;
        padding: 5px 0;
    }
}

/* Pour les écrans moyens (tablettes) */
@media (max-width: 768px) {
    .news_post_image {
        height: 220px;
    }
    
    /* S'assurer que l'image reste dans son conteneur */
    .news_post_large_container {
        overflow: visible !important;
    }
}

/* Pour les grands écrans */
@media (min-width: 992px) {
    .news_post_image {
        height: 250px; /* Plus grande hauteur sur desktop */
    }
}

/* Correction spécifique pour Bootstrap */
.news_post_large > * {
    position: static !important;
}

/* Prévenir tout positionnement absolu problématique */
.news_post_large_title,
.news_post_meta,
.news_post_link {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
}

/* Assurer un bon flux de document */
.news_post_large {
    display: block !important;
}

.news_post_large > div {
    display: block !important;
    float: none !important;
}

/* Solution alternative si le problème persiste */
@media (max-width: 768px) {
    .news_post_large {
        display: flex !important;
        flex-direction: column !important;
    }
    
    .news_post_image {
        order: 1;
    }
    
    .news_post_large_title {
        order: 2;
    }
    
    .news_post_meta {
        order: 3;
    }
    
    .news_post_link {
        order: 4;
    }
}

/* Correction de débordement */
.news_post_large_container {
    width: 100%;
    max-width: 100%;
}

.news_post_large {
    width: 100%;
    max-width: 100%;
}

/* Clearfix pour prévenir les problèmes de float */
.news_post_large::after {
    content: "";
    display: table;
    clear: both;
}


/* ============================================
   IMAGE PLUS GRANDE POUR LA SECTION NEWS
   ============================================ */

/* Style pour l'image agrandie */
.news_post_image_large {
    height: 350px !important; /* Hauteur augmentée */
    width: 100% !important;
    overflow: hidden;
    border-radius: 8px 8px 0 0;
    margin: 0 !important;
}

.news_post_image_large img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.news_post_image_large:hover img {
    transform: scale(1.05);
}

/* Ajustement du conteneur principal */
.news_post_large_container {
    height: 100%;
}

.news_post_large {
    height: 100%;
    display: flex;
    flex-direction: column;
}
.btn{
	color:#596174;
}
/* Réorganisation des éléments pour une meilleure présentation */
.news_post_large > .news_post_large_title {
    margin-top: 20px;
    padding: 0 20px;
    flex-grow: 1;
}

.news_post_large > .news_post_meta {
    padding: 10px 20px 5px;
}

.news_post_large > .news_post_link {
    /* padding: 0 20px 20px;
    margin-top: auto; */
}

/* Responsive design pour l'image grande */
@media (max-width: 1400px) {
    .news_post_image_large {
        height: 320px !important;
    }
}

@media (max-width: 1200px) {
    .news_post_image_large {
        height: 300px !important;
    }
    
    .news_post_large_title a {
        font-size: 1.4rem !important;
        line-height: 1.4 !important;
    }
}

@media (max-width: 992px) {
    .news_post_image_large {
        height: 280px !important;
    }
    
    .news_post_large {
        margin-bottom: 30px;
        box-shadow: 0 5px 20px rgba(0,0,0,0.1);
    }
}

@media (max-width: 768px) {
    .news_post_image_large {
        height: 250px !important;
    }
    
    .news_post_large_title a {
        font-size: 1.3rem !important;
    }
    
    .news_post_large > .news_post_large_title,
    .news_post_large > .news_post_meta,
    .news_post_large > .news_post_link {
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media (max-width: 576px) {
    .news_post_image_large {
        height: 220px !important;
    }
    
    .news_post_large_title a {
        font-size: 1.2rem !important;
    }
    
    .news_post_large {
        border-radius: 6px;
    }
}

@media (max-width: 400px) {
    .news_post_image_large {
        height: 200px !important;
    }
    
    .news_post_large_title a {
        font-size: 1.1rem !important;
    }
}

/* Pour les très grands écrans (plus de 1600px) */
@media (min-width: 1600px) {
    .news_post_image_large {
        height: 400px !important;
    }
    
    .news_post_large_title a {
        font-size: 1.8rem !important;
    }
}

/* Option: Image en plein écran sur mobile */
@media (max-width: 768px) {
    .news_post_large_container {
        padding-left: 0;
        padding-right: 0;
    }
    
    .news_post_large {
        border-radius: 0;
        box-shadow: none;
        border: 1px solid #eee;
    }
    
    .news_post_image_large {
        border-radius: 0;
    }
}

/* Amélioration du ratio d'aspect */
.news_post_image_large {
    aspect-ratio: 16/9; /* Ratio cinématographique */
}

@supports not (aspect-ratio: 16/9) {
    .news_post_image_large {
        /* Fallback pour les navigateurs qui ne supportent pas aspect-ratio */
        padding-bottom: 56.25%; /* 16:9 = 9/16 = 0.5625 */
        height: 0 !important;
    }
    
    .news_post_image_large img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
}

/* Option: Image avec overlay au survol */
.news_post_image_large {
    position: relative;
}

.news_post_image_large::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.3) 100%);
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.news_post_image_large:hover::after {
    opacity: 1;
}

/* Option: Badge sur l'image */
.news_post_image_large::before {
    content: 'NOUVEAU';
    position: absolute;
    top: 15px;
    right: 15px;
    background: #334D6C;
    color: white;
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    z-index: 2;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Correction de l'overflow pour les petits écrans */
.news_post_large_container {
    overflow: hidden;
    border-radius: 8px;
}

.news_post_large {
    overflow: hidden;
}