@font-face {
    font-family: 'triplexboldliningbold';
    src: url('fonts/triplexboldlining_bold-webfont.woff2') format('woff2'), url('fonts/triplexboldlining_bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


body {
	background: #f2f2f2 url('images/jeunesse/body.jpg') no-repeat center -696px;
}
body, h2, h3, h4, h5, h6, td, pre, .panel-front>.x-panel-header span {
    font-family: Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
    font-weight: 400;
}
p  {font-family: Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;}

header {
	background: none;
}

p {
    font-family: Georgia, Times, Times New Roman, serif;
}

p a {
    font-family: Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
}

.navbar-brand {
    width: 928px;
    height: 148px;
    background: transparent url(images/jeunesse/logo.png) no-repeat center center;
}

#search-panel .btn-default {
    background-color: #6d418e;
    border-color: #6d418e;
    color: #fff;
}

#search-panel .btn-default:hover, #search-panel .btn-default:focus, #search-panel .btn-default:active, #search-panel .btn-default.active, #search-panel .open .dropdown-toggle.btn-default {
    background-color: #6d418e;
    border-color: #6d418e;
    color: #fff;
}

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

#globalScenarioMobile {
    background: #6d418e;
    color: #fff;
}

#globalScenarioMobile .active, #globalScenarioMobile .active:hover, #globalScenarioMobile .active:focus {
    color: #fff;
    background: #8556b7;
}

#globalScenarioMobile>li>a:hover, #globalScenarioMobile>li>a:focus {
    color: #fff;
    background: #8556b7;
}

.panel-front>h2, .panel-heading>h2 {
    color: #000;
}

.bs-bullets .rsNavSelected .btn {
    background: #6d418e;
    border-color: #6d418e;
}

#scenario-selection {
    border-radius: 50px 0 0 50px;
}

#submit-search {
    border-radius: 0 50px 50px 0;
}

#ariane, #ariane a, #ariane .actif {
    color: #000;
}

#share_social {
    background: #6D418E;
    border-radius: 22px;
}

div.social-network ul li a {
    color: #fff;
}

div.social-network ul li a.twitter {
    background-color: transparent;
}

div.social-network ul li a.facebook {
    background-color: transparent;
}

div.social-network ul li a.gplus {
    background-color: transparent;
}

div.social-network ul li a.tumblr {
    background-color: transparent;
}

div.social-network ul li a.pinterest {
    background-color: transparent;
}

#share_social ul li a:hover {
    color: gray;
    background: transparent;
}

div.social-network ul li a {
    height: 28px;
    width: 22px;
}

.panel-front, .panel-selection {
    border-radius: 22px;
}

.btn {
    font-weight: 600;
    border-radius: 22px;
}
#search-panel .panel-body {
    width: 65%;
}
#scenario-selection, #submit-search {
	line-height: 78px;
	height: 80px;
	padding: 0 22px;
}
 #submit-search {
	padding-right:  60px;
}

.tt-hint, #textfield, .clean-text-field {
    height: 80px;
}
.panel-front>h2, .panel-heading>h2 {

    font-size: 36px;
    font-weight: normal;
    font-family: 'triplexlight';
}
footer {
    background: #fff;
    color: #000;
    
}
footer a, footer a:hover, footer a:focus, footer [class^="icon-"], footer [class*=" icon-"] {
    color: #000;
}
footer .container ul li, .label-ermes {
    color: #000;
}
.social_ft ul li:first-child  a{ background: transparent url('images/jeunesse/facebook.png') no-repeat center center;}
.social_ft ul li:nth-child(2) a{ background: transparent url('images/jeunesse/instagram.png') no-repeat center center;}
/******************/

#ariane {
    display: inline-block;
    background: #fff;
    padding: 0 5px;
    color: #000;
}

@media (min-width: 992px) {
    .header-banner-menu {
        top: 215px;
    }
	#ariane {
		top: 110px;
	}
}
@media (min-width: 768px) {
	.container > .navbar-header {
		margin: -30px 0 0 0;
	}
    #menu-panel {
        background: transparent;
        position: relative;
		margin: 20px 0 90px 0;
	}
    .btn-account {
        background: #6d418e;
        color: #fff;
        border-radius:  50%;
        line-height: 54px;
        height: 130px;
    }
	.button-my-account {
		margin-top: -90px;
	}
    .navbar>.container .navbar-brand {
        margin: 0 auto 10px;
    }
    #ermes_main_menu {
        display: block;
        margin: 0 0 20px 0;
		padding: 0;
    }
    #ermes_main_menu li.LEVEL1 {
        float: left;
        display: inline-block;
        width: auto;
		position: relative;
		transition: all 0.35s;
    }
    #ermes_main_menu li.LEVEL1>a {
        background: none;
        height: 440px;
        width: 218px;
        position: relative;
		padding: 0;
		transition: all 0.35s;
    }   
	#ermes_main_menu li.LEVEL1>a span {
		text-transform: none;
    }

	
    #ermes_main_menu li.LEVEL1>a:hover,
	#ermes_main_menu li:hover>a {
        background: url(images/jeunesse/menu-hover.jpg) no-repeat;
		transition: all 0.35s;
    }
	
    #ermes_main_menu li.LEVEL1.menu-comment>a {
        width: 150px;
        background-position: 0 0;
    }
	
	#ermes_main_menu li.LEVEL1.menu-explore>a {
        width: 180px;
        background-position: -150px 0;
    }
	
	#ermes_main_menu li.LEVEL1.menu-choisir>a {
        width: 310px;
        background-position: -330px 0;
    }

	#ermes_main_menu li.LEVEL1.menu-accueil>a {
        width: 210px;
        background-position: -640px 0;
    }
	
	#ermes_main_menu li.LEVEL1.menu-participe>a {
        width: 250px;
        background-position: -850px 0;
    }
	
    #ermes_main_menu li.LEVEL1>a span {
        position: absolute;
        left: 0;
        top: 400px;
        opacity: 0;
       	transition: all 0.35s;
		font-size: 80px;
		display: block;
		font-family: 'triplexboldliningbold';	
    }
	#ermes_main_menu li.LEVEL1>a:hover span {
        opacity: 1;
		transition: all 0.35s;
		top: 480px;
    }
	#ermes_main_menu li.LEVEL1.menu-comment>a span,
    #ermes_main_menu li.LEVEL1.menu-comment>a:hover span {
        width: 740px;
    }
	#ermes_main_menu li.LEVEL1.menu-explore>a span,
	#ermes_main_menu li.LEVEL1.menu-explore>a:hover span {
        width: 320px;
    }
	#ermes_main_menu li.LEVEL1.menu-choisir>a span,
	#ermes_main_menu li.LEVEL1.menu-choisir>a:hover span {
        width: 330px;
    }
	#ermes_main_menu li.LEVEL1.menu-accueil>a span,
	#ermes_main_menu li.LEVEL1.menu-accueil>a:hover span {
        width: 260px;
    }
	#ermes_main_menu li.LEVEL1.menu-participe>a span,	
	#ermes_main_menu li.LEVEL1.menu-participe>a:hover span  {
        width: 390px;
	    left: -130px;
    }

	#ermes_main_menu li.LEVEL1.menu-mediatheque>a {
        width: 180px;
		height: 180px;
		background: #fff url(images/jeunesse/mediatheque.png) no-repeat center;
		border-radius: 50%;
		border: 4px solid #522626;
    }
	#ermes_main_menu li.LEVEL1.menu-mediatheque>a:hover {
		background: #522626 url(images/jeunesse/mediatheque.png) no-repeat center 10px;
		border: 4px solid #fff;
    }
	
	#ermes_main_menu li.LEVEL1.menu-mediatheque {
        position: absolute;
		top: -130px;
		right: 150px;
    }
	#ermes_main_menu li.LEVEL1.menu-mediatheque>a span {
        top: 0;
		left: -110px;
    }
	#ermes_main_menu li.LEVEL1.menu-mediatheque>a:hover span {
        top: 200px;
		left: -110px;
    }
	
	#ermes_main_menu li.LEVEL1:last-child>a:before {
		display: none;
	}
	#ermes_main_menu li.LEVEL1:nth-last-child(2) > a  {
		color: #fff;
	}
	#ermes_main_menu li.LEVEL1:nth-last-child(2) > a span {
		background: none;
		padding: 0;
	}
}


body.page-accueil {
	background: #f2f2f2 url('images/jeunesse/body.jpg') no-repeat center -400px;
}

.page-accueil header {
    background: none;
	margin-bottom: 150px;
}

.page-accueil #menu-panel {
    margin: 316px 0 0 0;
}

@media (min-width: 768px) {
	.page-accueil  .button-my-account {
		margin-top: -50px;
	}
	.page-accueil .navbar>.container .navbar-brand {
        margin: 0 auto 10px;
    }
	.page-accueil  #ermes_main_menu li.LEVEL1.menu-mediatheque {
		top: -290px;
    }
	.page-accueil  #ermes_main_menu li.LEVEL1.menu-mediatheque > a:hover span {
		top: 210px;
	}
}

@media (min-width: 992px) {
    .page-accueil  #ariane {
        top: 160px;
    }
}


@media (min-width: 768px) {
	footer {
		margin-top: 50px;
	}
}