.blogSection {
    max-width: 1170px;
    margin: auto;
    padding: 0 20px;
    padding-bottom: 30px;
    display: inline-flex;
    text-align: left;
    width: 90%;
}

.blogCard {
    vertical-align: top;
    margin: 5px;
    display: inline-block;
    padding-bottom: 20px !important;
    cursor: default !important;
    margin: 0 0 15px 0 !important;
    width: 100% !important;
}

.blogImg {
    height: 215px;
    object-fit: cover;
    width: 100%;
}

.blogTitle {
    font-weight: 500;
    font-size: 25px;
    letter-spacing: -0.03em;
    line-height: 110%;
    text-align: center;
    color: #333c4c;
    margin: 30px;
}

.blogDescription {
    text-align: justify;
    text-overflow: ellipsis;
    max-width: 175ch;
}

.categoriesMobile {
    width: 90%;
    padding: 20px;
    text-align: center;
    display: none;
}

.menuselect {
    width: 90%;
}

.moreLinkDiv {
    margin: 40px 0 30px;
}

.moreLink {
    color: #eb893a;
    font-size: 16px;
}

.moreLink:hover, .moreLink:focus {
    text-decoration: none;
    color: #ed4d26;
}

.moreLink:after {
    display: block;
    content: '\f107';
    font-family: 'FontAwesome';
    text-align: center;
}

.postmeta {
    margin: 20px 0 0;
}

.postmeta span {
    color: #a8a8a8;
}

.postmeta span, #related-posts ul li .entry-date {
    font-family: Lato;
    text-transform: uppercase;
    font-weight: 400;
    font-style: normal;
    color: #a8a8a8;
    font-size: 12px;
    opacity: 1;
    visibility: visible;
    -webkit-transition: opacity 0.24s ease-in-out;
    -moz-transition: opacity 0.24s ease-in-out;
    transition: opacity 0.24s ease-in-out;
}

.postmeta span, .meta span {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    color: #a8a8a8;
    letter-spacing: 1px;
    margin-right: 20px;
    text-transform: uppercase;
}

.affix-top {
    position: relative;
}

.affix {
    top: 20px;
}

.affix,
.affix-bottom {
}

.affix-bottom {
    position: absolute;
}

.catColor {
    border-right: 15px solid #333c4c;
    -webkit-transition: all ease 0.8s;
    -moz-transition: all ease 0.8s;
    transition: all ease 0.8s;
    padding: 15px 0 15px 20px;
    color: #333c4c;
}

/*
        .catColor:after {
            font-family: 'Glyphicons Halflings';
            content: "\e114";
            float: right;
            color: black;
        }

        .catColor .collapsed:after {
            content: "\e080";
        }
*/
.GuitareColor {
    border-right: 15px solid #e24030 !important;
}

.GuitareColor:hover {
    box-shadow: inset -1000px 0 0 0 #e24030 !important;;
}

.ChantColor {
    border-right: 15px solid #317fb4 !important;
}

.ChantColor:hover {
    box-shadow: inset -1000px 0 0 0 #317fb4 !important;;
}

.PianoColor {
    border-right: 15px solid #27ae60 !important;
}

.PianoColor:hover {
    box-shadow: inset -1000px 0 0 0 #27ae60 !important;;
}

.BatterieColor {
    border-right: 15px solid #671f83 !important;
}

.BatterieColor:hover {
    box-shadow: inset -1000px 0 0 0 #671f83 !important;;
}

.BasseColor {
    border-right: 15px solid #92314f !important;
}

.BasseColor:hover {
    box-shadow: inset -1000px 0 0 0 #92314f !important;;
}

.subGuitareColor {
    border-right: 5px solid #e24030 !important;
}

.subGuitareColor:hover {
    box-shadow: inset -1000px 0 0 0 #e24030 !important;;
}

.subChantColor {
    border-right: 5px solid #317fb4 !important;
}

.subChantColor:hover {
    box-shadow: inset -1000px 0 0 0 #317fb4 !important;;
}

.subPianoColor {
    border-right: 5px solid #27ae60 !important;
}

.subPianoColor:hover {
    box-shadow: inset -1000px 0 0 0 #27ae60 !important;;
}

.subBatterieColor {
    border-right: 5px solid #671f83 !important;
}

.subBatterieColor:hover {
    box-shadow: inset -1000px 0 0 0 #671f83 !important;;
}

.subBasseColor {
    border-right: 5px solid #92314f !important;
}

.subBasseColor:hover {
    box-shadow: inset -1000px 0 0 0 #92314f !important;;
}

.GuitareBckg {
    background: #e24030;
    color: white !important;
}

.ChantBckg {
    background: #317fb4;
    color: white !important;
}

.PianoBckg {
    background: #27ae60;
    color: white !important;
}

.BatterieBckg {
    background: #671f83;
    color: white !important;
}

.BasseBckg {
    background: #92314f;
    color: white !important;
}

.ActualitésBckg {
    background: #333c4c;
    color: white !important;
}

.catColor:hover {
    box-shadow: inset -1000px 0 0 0 #333c4c;
    color: white;
}

.subCatColor {
    font-weight: 400;
    border-right: 5px solid #333c4c;
    -webkit-transition: all ease 0.8s;
    -moz-transition: all ease 0.8s;
    transition: all ease 0.8s;
    padding: 15px 5px 15px 35px;
    color: #333c4c;
}

.subCatColor:hover {
    box-shadow: inset -1000px 0 0 0 #333c4c;
    color: white;
}

.catNav a {
    font-size: 16px;
    color: #eb893a;
    font-weight: bold;
}

.catNav a:hover, .catNav a:focus {
    text-decoration: none;
    color: #ed4d26;
}

.searchViewDiv {
    background: white;
    padding: 14px 6% !important;
    text-align: center;
    font-size: 16px;
    margin-bottom: 30px;
    display: table;
    width: 90% !important;
}

#sideBarContenair {
    display: block;
    width: 30%;
    padding: 0 10px 0 20px;
}

#leftSide {
    width: 68%;
}

@media print, screen and (max-width: 768px) {

    .categoriesMobile {
        display: block;
        margin: auto;
    }

    #sideBarContenair {
        display: none;
        width: 8%;
    }

    #leftSide {
        width: 108%;
    }

    .blogTitle {
        margin: 30px 10px;
        font-size: 23px;
    }

    .searchViewDiv {
        padding: 10px 3% !important;
        margin-bottom: 20px !important;
        margin-left: 1.4%;
    }
}