#block-navigationprincipale, .breadcrumb{
    display:none;
}

.main-container{
    max-width: 795px;
    margin:0px auto;
    padding:0px;
}

.page-node-radio .main-container{
    max-width: initial;
    margin:initial;
    padding:initial;
}

article .content .row.flex{
    display:flex;
}

.inner {
    padding: 21px 20px 60px;
    height: 100%;
    letter-spacing: -0.1px;
}

.blanc{
    background-color:white;
    box-shadow: 0px 0px 5px -2px grey;
}
.gauche{
    margin-right:5px;
}
.droite{
    margin-left:5px;
}

article h1, article h2, article h3, article h4, article h5 {
    color: #5d5b5b;
    font-family: 'AlternateGothic', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.1px;
    font-weight: 400;
    font-size: 14px;
    margin: 0px;
    padding: 0px;
}

article h1 strong{
    color : rgb(107,158,204);
}

article .col-sm-6{
    padding:10px;
}

article .col-sm-12 h1,article  .col-sm-12 h2{
    font-size: 28px;
}

article .col-sm-6 h1:after,article  .col-sm-6 h2:after,
article .col-sm-12 h1:after,article  .col-sm-12 h2:after{
    content: " ";
    height:3px;
    width:100%;
    background-color:rgb(107,158,204);
    margin-bottom: 14px;
    display: block;
    margin-top: 13px;
}

article .col-sm-12 h1:after, article .col-sm-12 h2:after{
    height:3px;
    margin-bottom: 20px;
}

article ul li {
    list-style-type: '+ ';
    margin: 0 0 10px;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}
/*******************************************************************************
Logos
*******************************************************************************/
#img-portfolio, #img-campus{
    height:65px;
}
#img-portfolio{
    float:left;
}
#img-campus{
    float:right;
}

/*******************************************************************************
Paragraphe compétences
*******************************************************************************/
article .paragraph--type--port-folio-competences .field--name-field-nom {
    margin-top: 12px;
    color: rgb(107, 158, 204);
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.1px;
    font-size: 13px;
    border-left: 12px solid rgb(107, 158, 204);
    padding-left: 4px;
}

article .paragraph--type--port-folio-competences  .field--name-field-sous-titre{
    color: rgb(107, 158, 204);
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    letter-spacing: -0.4px;
    font-style: italic;
}

article li.titre-competence,  li.sous-titre-competence{
    list-style-type: none;
    margin: 0px;
    display: block;
    margin-left: -48px;
}
article li.titre-competence{
    margin-top: 12px;
    color: rgb(107, 158, 204);
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.1px;
    font-size: 13px;
    border-left: 12px solid rgb(107, 158, 204);
    padding-left: 4px;
}

article li.sous-titre-competence{
    color: rgb(107, 158, 204);
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.1px;
    font-style: italic;
    margin-top: 2px;
}

article .field--name-field-texte-recherche{
    margin-top:50px;
}

/*******************************************************************************
Paragraphe apprentissage 
*******************************************************************************/

.field--name-field-apprentissages{
    letter-spacing: 0.02px;
} 

.field--name-field-apprentissages > .field--item{
    margin-bottom: -13px;
    padding: 100px 30px 60px 54px;
    color:white;
}

.field--name-field-apprentissages > .field--item strong{
    font-weight: 400;
}

.field--name-field-apprentissages > .field--item strong{
    color:black;
    font-weight: 600;
}

.field--name-field-apprentissages > .field--item:nth-child(odd) {
    background-color: rgb(108, 148, 190);
}
.field--name-field-apprentissages > .field--item:nth-child(even) {
    background-color: rgb(107, 158, 204);
}

.field--name-field-apprentissages .field--name-field-nom{
    width: 172px;
    font-family: 'Oswald', sans-serif;
    font-size: 25px;
    text-transform: uppercase;
    font-weight: 400;
    border-right: white solid 1px;
    padding-top: 5px;
    height: 200px;
    line-height: 1.7em;
    padding-right: 5px;
    letter-spacing: 0.1px;
}

.field--name-field-apprentissages  .field--name-field-texte{
    
}

.paragraph--type--port-folio-apprentissage .paragraph{
    display: flex;
    flex-direction: row;
}

.field--name-field-apprentissages ul {
    padding-left: 90px;
}

/*******************************************************************************
Paragraphe réseaux sociaux
*******************************************************************************/

.field--name-field-reseaux-sociaux .field--item {
    width: 42px;
    height:42px;
    display: inline-block;
    margin-right: 0px;
}

/*******************************************************************************
Domaines
*******************************************************************************/
.domaines-titre {
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    letter-spacing: 1px;
    font-size: 14px;
    margin-top: 25px;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.lesdomaines{
    margin-top: 50px;
}

.field--name-field-liens .field--item {
    display: inline-block;
    margin-bottom: 2px;
}

.pf-liens a {
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    letter-spacing: 1px;
    font-size: 14px;
    text-decoration: none;
    text-transform: uppercase;
    color: white;
}

.pf-liens.wsfwnr{
    background-color:#6B9ECC;
}
.pf-liens.recos{
    background-color:#8D8D8D;;
}
.pf-liens.recos a{
    font-style: italic;
}
/*******************************************************************************
Overlay
*******************************************************************************/
#portfolio-overlay{
    width:100%;
    height:100%;
    background-color: rgba(255,255,255,1);
    z-index: 5000;
    display:none;
    position: fixed;
    top: 0px;
    left: 0px;
}

#portfolio-overlay .bouton{
    cursor:pointer;
}

#croix{
    position:absolute;
    right:30px;
    top:30px;
}

#fullscreen{
    position:absolute;
    left:30px;
    top:30px;   
}

#image-en-grand, #portfolio-video-overlay{
    position:absolute;
    left: 65px;
    top: 80px;
}

#image-en-grand{
    right: 300px;
    bottom: 60px;
    padding-left: 40px;
    padding-right: 40px;
}

#portfolio-video-overlay{
    display:none;
    width: 640px;
    height: 360px;
}

#image-en-grand img{
    max-height:100%;
}

#legende{
    position:absolute;
    right: 230px;
    top: 60px;
}

#flechegauche {
    position: absolute;
    left: 0px;
    top: 50%;
}

#flechedroite {
    position: absolute;
    top: 50%;
    right: 0px;
}


/*******************************************************************************
Recommandations
*******************************************************************************/
.path-recommandation .main-container {
    max-width: 968px;
}
.path-recommandation hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid rgb(133, 133, 133);
}
/*******************************************************************************
Responsive
*******************************************************************************/

@media (max-width: 988px){
    #img-portfolio, #img-campus {
        margin-top: 51px;
    }
}
@media (max-width: 768px){
    article .content .row.flex{
        display:block;
    }
    .contenu-photos-carre {
        width:100%;
    }
    #img-portfolio, #img-campus {
        height:initial;
        width: 40%;
        margin-top: 51px;
    }
    #img-portfolio {
        margin-left: 14px;
    }
    #img-campus {
        margin-right: 14px;
    }
    article li.titre-competence, li.sous-titre-competence {
        margin-left: -13px;
    }
    .field--name-field-apprentissages ul {
        padding-left: 35px;
    }
}