/**************** SIDEBAR ****************/

.col-rubrique .sousrubrique {
    background-color: #1c3487;
    border-bottom: 1px solid #FFF;
    color: #fff;
    display: block;
    font-size: 10px;
    height: 55px;
    letter-spacing: 0.5px;
    line-height: 55px;
    text-transform: uppercase;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}

.container-fsi .col-rubrique .sousrubrique:before {
    display: inline-block;
	margin: 0 20px;
    vertical-align: middle;
}

.container-fsi .col-rubrique .sousrubrique:first-child:before {
    content: "";
    background: url('../_img/images/apropos_icone_01.png') no-repeat center;
    height: 25px;
    width: 22px;
}

.container-fsi .col-rubrique .sousrubrique:nth-child(2):before {
    content: "";
    background: url('../_img/images/apropos_icone_02.png') no-repeat center;
    height: 23px;
    width: 23px;
}

.container-fsi .col-rubrique .sousrubrique:nth-child(3):before {
    content: "";
    background: url('../_img/images/apropos_icone_03.png') no-repeat center;
    height: 22px;
    width: 22px;
}

.container-fsi .col-rubrique .sousrubrique:nth-child(4):before {
    content: "";
    background: url('../_img/images/apropos_icone_04.png') no-repeat center;
    height: 18px;
    width: 22px;
}

.col-rubrique .sousrubrique.select {
	background-color: #e7501e;
	position: relative;
}

/**************** CONTENT ****************/
.orange { color: #e7501e; }

.col-texte {
	color: #595959;
    font-family: 'Roboto Medium';
	font-size: 14px;
	line-height: 20px;
	margin: 0 0px 50px 0px;
    text-align: justify;
}

.col-texte img { max-width: 100% }

.col-texte h1 {
    color: #e7501e;
    font-family: 'Roboto Slab Bold';
    font-size: 20px;
    margin-bottom: 50px;
    text-align: center;
    text-transform: uppercase;
}

.col-texte a { color: #e7501e; }
.col-texte h2:after { display: none; }

.col-texte h2,
.col-texte h3 {
	color: #13235b;
	font-size: 18px;
	font-family: 'Roboto Bold';
    margin-bottom: 50px;
	text-align: center;
    text-transform: none;
}

.col-texte li:before {
    content: "";
    background: url('../_img/images/actu_icone_03.png');
    display: inline-block;
    margin-right: 10px;
    height: 8px;
    vertical-align: middle;
    width: 8px;
    
}

.col-texte-2 { text-align: center; }
.col-texte-2 p { margin-bottom: 50px; }
.col-texte-2 li strong,
.col-texte-2 p strong,
.col-texte-4 p strong { color: #e7501e; }
.col-texte-2 .end-text { margin-bottom: 20px; }
.col-texte-2 .orange { font-family: "Roboto Medium"; }

.col-texte-106 h3:first-of-type:before {
    content: "";
    background: url('../_img/images/apropos_icone_05.png');
    display: block;
    height: 41px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
    width: 34px;
}

.col-texte-106 h3:nth-of-type(2):before {
    content: "";
    background: url('../_img/images/apropos_icone_06.png');
    display: block;
    height: 24px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
    margin-top: 50px;
    width: 34px;
}

.col-texte-3 ul { margin-bottom: 50px; }
.col-texte-3 .title-pilier { margin-top: 80px; }
.col-texte-3 .title-pilier:after {
    content: "";
    background: url('../_img/images/apropos_schema_02.png') no-repeat center center;
    background-size: cover;
    display: block;
    margin-bottom: 100px;
    margin-top: 50px;
    height: 155px;
    width: 683px;
}

.col-texte-3 h2 { text-transform: uppercase; }

.col-texte-4 { margin-bottom: 50px; }
.col-texte-4 h4 {
    color: #595959;
    font-family: 'Roboto Bold';
    margin-top: 50px;
}

.col-texte-4 img { margin: 50px auto; }

.col-texte-5 {
    margin-bottom: 50px;
}

.col-texte-5 h4 {
    color: #13235b;
    font-family: 'Roboto Medium';
    font-size: 16px;
    margin: 50px 0;
}

.col-texte-5 .sous-titre {
    color: #595959;
    font-family: 'Roboto Bold';
    font-size: 16px;
}

/**************** MEDIA QUERIES ****************/

@media screen and (min-width: 768px) {
	.col-rubrique .sousrubrique:hover {
	    background-color: #e7501e;
	    transition: all 0.5s ease-in-out;
	    -webkit-transition: all 0.5s ease-in-out;
	    -moz-transition: all 0.5s ease-in-out;
	    -o-transition: all 0.5s ease-in-out;
	}
}

@media screen and (min-width: 992px) {
    .col-rubrique .sousrubrique.select:after {
        content: "";
        border-style: solid;
        border-width: 27.5px 0 27.5px 20px;
        border-color: transparent transparent transparent #e7501e;
        margin-right: -20px;
        position: absolute;
        right: 0;
    }

    .col-texte { margin: 0 40px 50px 40px; }

}

@media screen and (min-width: 1196px) {
    .col-rubrique .sousrubrique {
        font-size: 14px;
    }
}