/**************************************************************************************************************/
/*
			LES CHARTREUX  - couleur postbac

			#a4864e - principale
			#ebb144 - claire
			#3e2f14 - sombre

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

/*
    MENU ACTIF
*/
.site-etb ul li.enseignement-superieur::before{
    content: '';
    position: absolute;
    left: 15px;
    right: 15px;
    bottom: -8px;
    height: 16px;
    background: #fff;
}
.site-etb ul li.enseignement-superieur::after {
    content: '▼';
    position: absolute;
    bottom: -5px;
    left: 20px;
    color:#a4864e!important;
    font-size: 2.2em;
}

/*
    LOCALISATION ETB
*/

/*
    IMAGES
*/
#portletPageColumns .navigation-speciale dd > ul > li > a.titre::before {
	background-position: -108px -27px;
}
dl.portlet.portletNavigationTree ul li ul li.navTreeItem{
	background-image: url("../images/chevron-postbac2.png");
}
dl.portlet.portletNavigationTree ul li ul li.navTreeItem.navTreeCurrentNode{
	background-image: url("../images/chevron-postbac.png");
}

/*
    COULEURS
*/
.edito h2,
.edito p,
.etablissements .entete,
dl.portlet.portletNavigationTree ul li a,
dl.portlet.portletNavigationTree ul li ul li a:hover,
dl.portlet.portletNavigationTree ul li ul li a:focus,
dl.portlet.portletNavigationTree ul li ul li a.navTreeCurrentItem,
#portal-column-content h1,
#portal-column-content #content-core .tileItem h2 a,
#portal-column-content #content-core .tileItem h2 a:hover,
#portal-column-content #content-core .tileItem h2 a:focus,
#portal-column-content #content-core .tileItem .documentByLine,
#portal-column-content #content-core #search-results dl dt a,
#portal-column-content #content-core #portal-sitemap > li > div > a,
#portal-column-content #content-core #portal-sitemap > li > ul > li > div > a,
#portal-column-content #content-core #portal-sitemap li li li a,
#portal-column-content #content-core div[id^="parent-fieldname-text"] .texte2,
#portal-column-content #content-core div[id^="parent-fieldname-text"] h2,
#portal-column-content #content-core div[id^="parent-fieldname-text"] h3,
#portal-column-content #content-core div[id^="parent-fieldname-text"] h4,
#portal-column-content #content-core div[id^="parent-fieldname-text"] h5,
#portal-column-content #content-core div[id^="parent-fieldname-text"] h6,
#content a:hover{
	color:#a4864e!important;
}
.site-etb,
#portletPageColumns .navigation-speciale dd > ul > li > a.titre,
#portal-column-content .portletEmbed.portlet-embed-add-this a,
#portal-searchbox form,
#portal-column-content #content-core .tileItem .audio-player audio,
#portal-column-content #content-core #search-results dl dt a::before,
#portal-column-content #content-core #parent-fieldname-eventUrl:hover,
#portal-column-content #content-core #parent-fieldname-eventUrl:focus,
#portal-column-content #content-core #portal-sitemap > li > div > a::before,
#portal-footer,
#portal-column-content #content-core div[id^="parent-fieldname-text"] .texte1,
#portal-column-content #content-core div[id^="parent-fieldname-text"] h2::before,
#portal-column-content #content-core div[id^="parent-fieldname-text"] h3::before,
#portal-column-content #content-core div[id^="parent-fieldname-text"] h4::before,
#portal-column-content #content div[id^="parent-fieldname-text"] a.bouton,
#portletPageColumns .etablissements .maps-listing-items > li{
	background:#a4864e;
}
#portletPageColumns .navigation-speciale dd > ul > li > a.titre,
#portal-column-content #content-core .tileItem::before,
#portal-column-content #content-core .tileItem:hover::before{
	border-color: #a4864e;
}
#portal-column-content .portletEmbed.portlet-embed-add-this a:hover,
#portal-column-content .portletEmbed.portlet-embed-add-this a:focus,
dl.portlet.portletNavigationTree ul li::after,
#portal-column-content #content-core .eventDetails::before,
#portal-column-content #content-core .eventDetails::after,
#portal-column-content .voir-le-calendrier a:hover,
#portal-column-content .voir-le-calendrier a:focus,
#portal-column-content .retour-agenda:hover,
#portal-column-content .retour-agenda:focus{
	background: #ebb144;
}
#portal-globalnav > li#portaltab-fonds-de-dotation > a,
#portal-globalnav > li#portaltab-inscriptions > a,
.edito li > p::before,
#contportletPageColumnsent .navigation-speciale dd > ul > li > a.illustration:hover + a.titre,
#portletPageColumns .navigation-speciale dd > ul > li > a.titre:hover,
#portletPageColumns .navigation-speciale dd > ul > li > a.titre:focus,
dl.portlet.portletNavigationTree ul li.navTreeTopNode a,
dl.portlet.portletNavigationTree ul li a:hover,
dl.portlet.portletNavigationTree ul li a:focus,
dl.portlet.portletNavigationTree ul li a.navTreeCurrentItem,
dl.portlet.portletNavigationTree ul li a.navTreeItemInPath,
dl.portlet.portletNavigationTree ul li ul li a,
.portaltype-portlet-page #portal-column-content #content > div[id^="parent-fieldname-text"]::before,
#portal-column-content #content-core .eventDetails,
#portal-column-content #content-core .eventDetails ul li a,
#portal-column-content #content-core .eventDetails ul li a:hover,
#portal-column-content #content-core .eventDetails ul li a:focus{
	color: #ebb144!important;
}
.onglets-bandeau ul li,
#portletPageColumns .navigation-speciale dd > ul > li ul li a.titre:hover,
#portletPageColumns .navigation-speciale dd > ul > li ul li a.titre:focus,
#portal-searchbox form > div input[type=submit],
#portal-column-content #content-core #parent-fieldname-eventUrl,
#portal-column-content .voir-le-calendrier a,
#portal-column-content .retour-agenda{
	background:#3e2f14;
}
#portletPageColumns .navigation-speciale dd > ul > li ul li{
	background: rgba(62,47,20, 0.8);
}

/*
    RESPONSIVE
*/
@media only screen and (max-width: 800px) {
    .site-etb ul li.enseignement-superieur::before {
        left: 5px;
        right: 5px;
    }
}
@media only screen and (max-width: 600px) {
    .site-etb ul li.enseignement-superieur::before,
    .site-etb ul li.enseignement-superieur::after {
        display: none;
    }
    #portal-top,
    .portaltype-portlet-page #portal-top,
    .site-etb ul li:hover,
    #portletPageColumns .navigation-speciale dd > ul > li ul{
        background: #a4864e;
    }
    .site-etb ul{
        background:#3e2f14;
    }
}

/*--------------------------------------------------------------------------------------------------------------
	== TABLEAU FILIERES
--------------------------------------------------------------------------------------------------------------*/
.tableau-post-bac{
    margin:0 0 0 50px;
}
.tableau-post-bac > ul{
    display: flex;
    justify-content: space-between;
    overflow: hidden;
}
.tableau-post-bac > ul > li{
    position: relative;
    z-index:1;
    display: flex;
    flex-direction: column;
    width: 49%;
    background: #a4864e;
}
.tableau-post-bac > ul > li:hover{
    z-index:2;
}

.tableau-post-bac > ul > li h2{
    margin:20px 0 10px 20px;
    font-family: 'Open Sans', sans-serif;
    font-size: 2.5em;
    font-weight: 300;
    color: #fff!important;
}
.tableau-post-bac > ul > li h2::before {
    content: '';
    display: block;
    margin: 0 0 5px;
    width: 23px;
    height: 21px;
    background: url("../images/sprite.png") -108px -27px no-repeat;
}
.tableau-post-bac > ul > li div{
    flex: 1;
}
.tableau-post-bac > ul > li div > ul{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    color: #211b10;
}
.tableau-post-bac > ul > li div > ul > li{
    position: relative;
    display: block;
    margin: 0 0 0 30%;
    padding:30px 80px 30px 10px;
    height:100%;
    border-top: 1px solid #211b10;
    font-size: 1.4em;
    line-height:1.2;
}
.tableau-post-bac > ul > li div > ul > li::before {
    content: '';
    position: absolute;
    top: -1px;
    left: -42.6%;
    right: 142.6%;
    bottom: -1px;
    background: #524020;
    box-shadow: rgba(0,0,0,0.3) 0 0 10px;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.tableau-post-bac > ul > li div > ul > li:hover::before {
    right: -110%;
}
.tableau-post-bac > ul > li + li div > ul > li::before {
    content: '';
    position: absolute;
    top: -1px;
    right: 0;
    left: 142.6%;
    bottom: -1px;
    background: #524020;
    box-shadow: rgba(0,0,0,0.3) 0 0 10px;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.tableau-post-bac > ul > li + li div > ul > li:hover::before {
    left: -150%;
}

.tableau-post-bac > ul > li div > ul > li > strong{
    position: relative;
    display: block;
    font-family: 'Kreon', serif;
    font-size: 1.4em;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.tableau-post-bac > ul > li div > ul > li em {
    position: relative;
    display: block;
    font-style: normal;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.tableau-post-bac > ul > li div > ul > li u{
    position: relative;
    display: block;
    margin:8px 0 0;
    font-size: 0.9em;
    text-decoration: none;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.tableau-post-bac > ul > li div > ul > li .texte1{
    position: absolute;
    top:25px;
    right: 102%;
    display: inline-block;
    padding:2px 5px;
    background: #524020;
    font-weight: 700;
    font-size: 0.7em;
    color: #fff;
    white-space: nowrap;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.tableau-post-bac > ul > li div > ul > li .texte2 {
    position: absolute;
    top:45px;
    right: 102%;
    font-weight: 700;
    font-size: 0.8em;
    color: #fff;
    white-space: nowrap;
    text-align: right;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.tableau-post-bac > ul > li div > ul > li > br{
    display: none;
}
.tableau-post-bac > ul > li div > ul > li ul{
    position: absolute;
    top:0;
    bottom:0;
    left: -142.6%;
    width: 100%;
    opacity:0;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.tableau-post-bac > ul > li div > ul > li:hover ul {
    left: calc(110% - 80px);
    width: calc(100% + 80px);
    opacity:1;
    font-size: 0.9em;
}
.tableau-post-bac > ul > li + li div > ul > li ul{
    left: 100%;
}
.tableau-post-bac > ul > li + li div > ul > li:hover ul {
    left: -150%;
}


.tableau-post-bac > ul > li div > ul > li ul li:first-child,
.tableau-post-bac > ul > li div > ul > li ul li:first-child + li,
.tableau-post-bac > ul > li div > ul > li ul li:nth-last-child(2){
    display: block;
    position: relative;
    padding: 10px 25% 0 22%;
    background: #524020;
    color: #fff;
}
.tableau-post-bac > ul > li + li div > ul > li ul li:first-child,
.tableau-post-bac > ul > li + li div > ul > li ul li:first-child + li,
.tableau-post-bac > ul > li + li div > ul > li ul li:nth-last-child(2){
    padding: 10px 0 0 57%;
}
.tableau-post-bac > ul > li div > ul > li ul li:first-child::before,
.tableau-post-bac > ul > li div > ul > li ul li:first-child + li::before,
.tableau-post-bac > ul > li div > ul > li ul li:nth-last-child(2)::before{
    position: absolute;
    top:10px;
    left: -25px;
}
.tableau-post-bac > ul > li + li div > ul > li ul li:first-child::before,
.tableau-post-bac > ul > li + li div > ul > li ul li:first-child + li::before,
.tableau-post-bac > ul > li + li div > ul > li ul li:nth-last-child(2)::before{
    left:28%;
}
.tableau-post-bac > ul > li div > ul > li ul li:first-child::before,
.tableau-post-bac > ul > li div > ul > li ul li:first-child:nth-last-child(2)::before{
    content: url("../images/picto-provenance.png");
}
.tableau-post-bac > ul > li div > ul > li ul li:first-child + li::before {
    content: url("../images/picto-debouche.png");
}
.tableau-post-bac > ul > li div > ul > li ul li:nth-last-child(2)::before {
    content: url("../images/picto-equivalence.png");
}
.tableau-post-bac > ul > li div > ul > li ul li:last-child{
    position: absolute;
    top:-1px;
    bottom:-1px;
    right: 0;
    width: 25%;
    display: flex;
    background: #000!important;
}
.tableau-post-bac > ul > li div > ul > li ul li:first-child:last-child,
.tableau-post-bac > ul > li div > ul > li ul li:first-child + li:last-child {
    position: absolute;
    display: flex;
    padding:0;
}
.tableau-post-bac > ul > li div > ul > li ul li:first-child:last-child::before,
.tableau-post-bac > ul > li div > ul > li ul li:first-child + li:last-child::before {
    display: none;
}
.tableau-post-bac > ul > li + li div > ul > li ul li:last-child {
    left: 0;
    right: auto;
}
.tableau-post-bac > ul > li div > ul > li ul li a{
    display: block;
    padding:10px;
    margin: auto;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    font-weight: 700;
    line-height:1;
}
.tableau-post-bac > ul > li div > ul > li ul li a:hover,
.tableau-post-bac > ul > li div > ul > li ul li a:focus{
    color: #ebb144;
    text-decoration: none;
}
.tableau-post-bac > ul > li div > ul > li ul li a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.tableau-post-bac > ul > li div > ul > li ul li strong{
    position: absolute;
    top:10px;
    left:0;
    width: 20%;
}
.tableau-post-bac > ul > li + li div > ul > li ul li strong {
    left:35%;
}
.tableau-post-bac > ul > li div > ul > li ul li strong + br{
    display: none;
}
.tableau-post-bac > ul > li div > ul > li:hover strong,
.tableau-post-bac > ul > li div > ul > li:hover em,
.tableau-post-bac > ul > li div > ul > li:hover u{
    color: #fff;
}

.tableau-post-bac > ul > li div > ul > li:hover .texte1 {
    background: #48371a;
    color: #aea89f;
}
.tableau-post-bac > ul > li div > ul > li:hover .texte2 {
    color: #aea89f;
}

@media only screen and (max-width: 1024px) {
    .tableau-post-bac > ul{
        flex-direction: column;
    }
    .tableau-post-bac > ul > li{
        width: auto;
    }
    .tableau-post-bac > ul > li + li{
        margin:10px 0 0;
    }
    .tableau-post-bac > ul > li div > ul > li:hover::before {
        display: none;
    }
    .tableau-post-bac > ul > li div > ul > li ul,
    .tableau-post-bac > ul > li div > ul > li:hover ul{
        position: relative;
        left:auto;
        width: auto;
        font-size: 1em;
        opacity:1;
    }
    .tableau-post-bac > ul > li + li div > ul > li ul,
    .tableau-post-bac > ul > li + li div > ul > li:hover ul{
        left:0;
    }
    .tableau-post-bac > ul > li div > ul > li ul li:first-child,
    .tableau-post-bac > ul > li div > ul > li ul li:first-child + li,
    .tableau-post-bac > ul > li div > ul > li ul li:nth-last-child(2){
         background: none;
    }
    .tableau-post-bac > ul > li div > ul > li ul li:first-child,
    .tableau-post-bac > ul > li div > ul > li ul li:first-child + li,
    .tableau-post-bac > ul > li div > ul > li ul li:nth-last-child(2){
        padding-right: 0;
        color: #211b10;
    }
    .tableau-post-bac > ul > li + li div > ul > li ul li:first-child,
    .tableau-post-bac > ul > li + li div > ul > li ul li:first-child + li{
        padding-left: 22%;
    }
    .tableau-post-bac > ul > li div > ul > li ul li:first-child:last-child,
    .tableau-post-bac > ul > li div > ul > li ul li:first-child + li:last-child,
    .tableau-post-bac > ul > li div > ul > li ul li:last-child{
        position: relative;
        left: auto;
        width: auto;
        margin:20px 0 0;
    }
    .tableau-post-bac > ul > li div > ul > li:hover strong,
    .tableau-post-bac > ul > li div > ul > li:hover em,
    .tableau-post-bac > ul > li div > ul > li:hover u{
        color: #211b10;
    }
    .tableau-post-bac > ul > li + li div > ul > li ul li strong{
        left:0;
    }
    .tableau-post-bac > ul > li + li div > ul > li ul li:first-child::before,
    .tableau-post-bac > ul > li + li div > ul > li ul li:first-child + li::before {
        left: -25px;
    }

    .tableau-post-bac > ul > li div > ul > li:hover .texte1,
    .tableau-post-bac > ul > li div > ul > li:hover .texte2{
        color: #fff;
    }
}
@media only screen and (max-width: 600px) {
    .tableau-post-bac > ul > li div > ul > li {
        margin: 0;
    }
    .tableau-post-bac > ul > li div > ul > li .texte1,
    .tableau-post-bac > ul > li div > ul > li .texte2{
        position: relative;
        top: auto;
        right:auto;
    }
    .tableau-post-bac > ul > li div > ul > li .texte2 {
        display: block;
        text-align: left;
    }
    .tableau-post-bac > ul > li div > ul > li ul li strong{
        position: relative;
        top:auto;
        width: auto;
        display: block;
    }
    .tableau-post-bac > ul > li div > ul > li ul li:first-child,
    .tableau-post-bac > ul > li div > ul > li ul li:first-child + li{
        padding:10px 0 0;
    }
    .tableau-post-bac > ul > li div > ul > li ul li:first-child::before,
    .tableau-post-bac > ul > li div > ul > li ul li:first-child + li::before {
        position: relative;
        top:auto;
        left: auto;
    }
}