@media (min-width: 992px){
    .services_box .cell.cell-metiers-global {
        width: 32%;
        margin: 0 0.5% 1%;
        border-radius: 2.9%;
        overflow: hidden;
        outline: none;
        background-color: transparent;
        box-shadow: rgb(0 0 0 / 10%) 0px 10px 8px -5px, rgb(0 0 0 / 5%) 0px 4px 6px -2px;
    }
    .services_box .cell.cell-metiers-global .text_container {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        border:0px;
        transition: none;
        min-height:140px;

    }
    .services_box .cell.cell-metiers-global:hover .text_container {
        transition: none;
    }
    #filtresEmploi td, #filtresEmploi th{
        padding:10px;
        font-size:14px;

    }
    #filtresEmploi th{
        display:none;
    }
    #filtresEmploi td.bold{
        font-weight: bold;
    }
    #filtresEmploi .odd{
    background-color: #F8F5F3;
    }

.filtre-container{
    display:flex;
    flex-direction: row;
    align-items: center;
}
.filtre-container select {
    position: relative;
    border: 0;
    border-radius: 60px;
    min-width: 70px;
    max-width: 135px;
    text-align-last: center;
    margin: 30px 0px;
    padding: 0px 30px 0px 10px;
    height: 35px;
    line-height: 35px;
    font-family: 'sofia-pro', 'sofia-pro-fallback', Arial, sans-serif;
    font-weight: 300;
    font-size: 12px;
    display: inline-block;
    cursor: pointer;
    overflow: hidden;
    text-align: center;
    background: #B19E7B;
    border: 1px solid #B19E7B;
    color: #FFF;
    appearance: none;
    background-image: url(https://www.cdn.shiva.fr/medias/chevron_blanc.png);
    background-repeat: no-repeat;
    background-size: auto 9px;
    text-align-last:center;
}
#filtresEmploi .intitule{color:#776D63;}

.lien a p{
width: 29px;
    height: 29px;
    overflow: hidden;
    position: relative;
border-radius: 50%;
    border: 1px solid #B19E7B;
}
.lien a p::after{
content: "";
    display: block;
    background: url(https://www.cdn.shiva.fr/medias/arrow-cta-gold.svg);
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    top: -1px;
    left: -1px;
    width: 29px;
    height: 29px;
    animation: toLeftFromRight .5s backwards;
}
.lien a:hover p::after {
    -webkit-animation: toRightFromLeft .5s backwards;
    animation: toRightFromLeft .5s backwards;
}
#colonne0{
    background-position: 94% 50%;
}
#colonne1{
    background-position: 94% 50%;
}
#colonne2{
    background-position: 94% 50%;
}
#colonne3{
    background-position: 94% 50%;
}
#colonne4{
    background-position: 94% 50%;
}
#colonne5{
    background-position: 94% 50%;
}
.remove-filtre {
    position: relative;
    border: 0;
    border-radius: 60px;
    min-width: 70px;
    text-align-last: center;
    margin: 30px 0px;
    padding: 0px 10px 0px 10px;
    height: 35px;
    line-height: 35px;
    font-family: 'sofia-pro', 'sofia-pro-fallback', Arial, sans-serif;
    font-weight: 500;
    font-size: 12px;
    display: none;
    cursor: pointer;
    overflow: hidden;
    text-align: center;
    background: #ffffff;
    border: 1px solid #B19E7B;
    color: #B19E7B;
    appearance: none;
    background-image: url(https://www.cdn.shiva.fr/medias/chevron_blanc.png);
    background-repeat: no-repeat;
    background-size: auto 9px;
    text-align-last:center;
}
.fermeture-filtre{
    float:right;
    margin-right:0px;
    font-size:16px;
    font-weight:bold;
    line-height: 32px;
    margin-left: 10px;
}



}
/* MOBILE */
@media (min-width: 641px) and (max-width: 991px){
 .services_box .cell.cell-metiers-global {
        width: 48%;
        margin: 0 0.5% 1%;
        border-radius: 2%;
        overflow: hidden;
        outline: none;
        background-color: transparent;
        box-shadow: rgb(0 0 0 / 10%) 0px 10px 8px -5px, rgb(0 0 0 / 5%) 0px 4px 6px -2px;
    }
    .img_box img {
        width:100%;
        max-width:none;
    }
    .services_box .cell.cell-metiers-global .text_container {
        border:0px;
        min-height:140px;
    }
    .services_box .flexColumnMobile {
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
    }
    .filtre-container{
        display:flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        margin-bottom:20px;
    }
    .filtre-container select {
        position: relative;
        border: 0;
        border-radius: 60px;
        min-width: 70px;
        max-width: 135px;
        text-align-last: center;
        margin: 10px 10px 0px 0px;
        padding: 0px 30px 0px 10px;
        height: 35px;
        line-height: 35px;
        font-family: 'sofia-pro', 'sofia-pro-fallback', Arial, sans-serif;
        font-weight: 300;
        font-size: 12px;
        display: inline-block;
        cursor: pointer;
        overflow: hidden;
        text-align: center;
        background: #B19E7B;
        border: 1px solid #B19E7B;
        color: #FFF;
        appearance: none;
        background-image: url(https://www.cdn.shiva.fr/medias/chevron_blanc.png);
        background-repeat: no-repeat;
        background-size: auto 9px;
    }
    #colonne0{
        background-position: 94% 50%;
    }
    #colonne1{
        background-position: 94% 50%;
    }
    #colonne2{
        background-position: 94% 50%;
    }
    #colonne3{
        background-position: 94% 50%;
    }
    #colonne4{
        background-position: 94% 50%;
    }
    #colonne5{
        background-position: 94% 50%;
    }

    #filtresEmploi th{
        display:none;
    }
    #filtresEmploi tr{
        display:flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        padding:10px;
        font-size:14px;

    }
    #filtresEmploi td{
        padding:10px;
    }
    #filtresEmploi td.bold{
        font-weight: bold;
    }
    #filtresEmploi .odd{
    background-color: #F8F5F3;
    }
    #filtresEmploi .dep{width:40%;text-align:left;}
    #filtresEmploi .ville{width:45%;}
    #filtresEmploi .intitule{width:73%;color:#776D63;}
    #filtresEmploi .type{width:27%;}
    #filtresEmploi .entite{width:40%;}
    #filtresEmploi .date{width:33%;}
    #filtresEmploi .lien{width:27%;}

.lien a p{
    width: 29px;
        height: 29px;
        overflow: hidden;
        position: relative;
    border-radius: 50%;
        border: 1px solid #B19E7B;
    }
    .lien a p::after{
    content: "";
        display: block;
        background: url(https://www.cdn.shiva.fr/medias/arrow-cta-gold.svg);
        background-repeat: no-repeat;
        background-position: center center;
        position: absolute;
        top: -1px;
        left: -1px;
        width: 29px;
        height: 29px;
        animation: toLeftFromRight .5s backwards;
    }
    .lien a:hover p::after {
        -webkit-animation: toRightFromLeft .5s backwards;
        animation: toRightFromLeft .5s backwards;
    }
    .remove-filtre {
        position: relative;
        border: 0;
        border-radius: 60px;
        min-width: 70px;
        text-align-last: center;
        margin: 10px 10px 0px 0px;
        padding: 0px 10px 0px 10px;
        height: 35px;
        line-height: 35px;
        font-family: 'sofia-pro', 'sofia-pro-fallback', Arial, sans-serif;
        font-weight: 500;
        font-size: 12px;
        display: none;
        cursor: pointer;
        overflow: hidden;
        text-align: center;
        background: #ffffff;
        border: 1px solid #B19E7B;
        color: #B19E7B;
        appearance: none;
        background-image: url(https://www.cdn.shiva.fr/medias/chevron_blanc.png);
        background-repeat: no-repeat;
        background-size: auto 9px;
        text-align-last:center;
    }
    .fermeture-filtre{
        float:right;
        margin-right:0px;
        font-size:16px;
        font-weight:bold;
        line-height: 32px;
        margin-left: 10px;
    }
}
@media (max-width: 640px){
    .services_box .cell.cell-metiers-global {
        width: 100%;
        margin: 0 0 30px;
        border-radius: 2%;
        overflow: hidden;
        outline: none;
        background-color: transparent;
        box-shadow: rgb(0 0 0 / 10%) 0px 10px 8px -5px, rgb(0 0 0 / 5%) 0px 4px 6px -2px;
    }
    .img_box img {
        width:100%;
        max-width:none;
    }
    .services_box .cell.cell-metiers-global .text_container {
        border:0px;
        min-height:140px;
    }
    .filtre-container{
        display:flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        margin-bottom:20px;
    }
    .filtre-container select {
        position: relative;
        border: 0;
        border-radius: 60px;
        min-width: 70px;
        width: 135px;
        text-align-last: center;
        margin: 10px 10px 0px 0px;
        padding: 0px 30px 0px 10px;
        height: 35px;
        line-height: 35px;
        font-family: 'sofia-pro', 'sofia-pro-fallback', Arial, sans-serif;
        font-weight: 300;
        font-size: 12px;
        display: inline-block;
        cursor: pointer;
        overflow: hidden;
        text-align: center;
        background: #B19E7B;
        border: 1px solid #B19E7B;
        color: #FFF;
        appearance: none;
        background-image: url(https://www.cdn.shiva.fr/medias/chevron_blanc.png);
        background-repeat: no-repeat;
        background-size: auto 9px;
    }
    #colonne0{
        background-position: 94% 50%;
    }
    #colonne1{
        background-position: 94% 50%;
    }
    #colonne2{
        background-position: 94% 50%;
    }
    #colonne3{
        background-position: 94% 50%;
    }
    #colonne4{
        background-position: 94% 50%;
    }
    #colonne5{
        background-position: 94% 50%;
    }

    #filtresEmploi tr{
        display:flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        padding:10px;
        font-size:14px;

    }
    #filtresEmploi th{
        display:none;
    }
    #filtresEmploi td{
        padding:10px;
    }
    #filtresEmploi td.bold{
        font-weight: bold;
    }
    #filtresEmploi .odd{
    background-color: #F8F5F3;
    }
    #filtresEmploi .dep{width:10%;text-align:left;}
    #filtresEmploi .ville{width:80%;}
    #filtresEmploi .intitule{width:100%;color:#776D63;}
    #filtresEmploi .type{width:100%;}
    #filtresEmploi .entite{width:100%;}
    #filtresEmploi .date{width:100%;}
    #filtresEmploi .lien{width:100%;}

    .lien a p{
        width: 29px;
            height: 29px;
            overflow: hidden;
            position: relative;
        border-radius: 50%;
            border: 1px solid #B19E7B;
        }
        .lien a p::after{
        content: "";
            display: block;
            background: url(https://www.cdn.shiva.fr/medias/arrow-cta-gold.svg);
            background-repeat: no-repeat;
            background-position: center center;
            position: absolute;
            top: -1px;
            left: -1px;
            width: 29px;
            height: 29px;
            animation: toLeftFromRight .5s backwards;
        }
        .lien a:hover p::after {
            -webkit-animation: toRightFromLeft .5s backwards;
            animation: toRightFromLeft .5s backwards;
        }
        .remove-filtre {
            position: relative;
            border: 0;
            border-radius: 60px;
            min-width: 70px;
            text-align-last: center;
            margin: 10px 10px 0px 0px;
            padding: 0px 10px 0px 10px;
            height: 35px;
            line-height: 35px;
            font-family: 'sofia-pro', 'sofia-pro-fallback', Arial, sans-serif;
            font-weight: 500;
            font-size: 12px;
            display: none;
            cursor: pointer;
            overflow: hidden;
            text-align: center;
            background: #ffffff;
            border: 1px solid #B19E7B;
            color: #B19E7B;
            appearance: none;
            background-image: url(https://www.cdn.shiva.fr/medias/chevron_blanc.png);
            background-repeat: no-repeat;
            background-size: auto 9px;
            text-align-last:center;
        }
        .fermeture-filtre{
            float:right;
            margin-right:0px;
            font-size:16px;
            font-weight:bold;
            line-height: 32px;
            margin-left: 10px;
        }
}
