
/************************************
* Globals
*************************************/
/*

.container{
    max-width:100%;
    margin:auto;
}

*/

/************************************
* Globals Responsive
*************************************/
/*

@media (min-width:576px) {

    .container{
        max-width:540px;
    }

}

@media (min-width:768px) {
    .container{
        max-width:720px;
    }

}

@media (min-width:992px) {
    .container{
        max-width:960px;
    }
}
@media (min-width:1200px) {
    .container{
        max-width:1140px;
    }
}

@media (min-width:1400px) {
    .container{
        max-width:1320px;
    }
}

*/


/************************************
* GMX Cluster
*************************************/

.GMXClusterWrapper{ 
    display:flex;
    justify-content: space-between;
    flex-wrap: wrap;
    box-sizing: border-box;
    margin:2rem 1rem;
    max-width: 100%;
}

.GMXClusterCard{
    display: flex;
    flex:1 0 100%;
    flex-direction:column;
    margin:0 auto 1rem;
    box-sizing: border-box;
    height: 250px;
    border-radius:5px;
    position:relative;
}

.GMXClusterCardImage{
    width:auto;
    flex:1 0;
    height: 200px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    border-radius:5px 5px 0 0;
}


.GMXClusterCardBody{ 
    flex:0 1;
    margin:0;
    padding:1rem 0;
    background-color:white;
    border-radius:0 0 5px 5px;
}

.GMXClusterCardBody h4{
    margin:0;
    text-align: center;
    font-family: 'Poppins', sans-serif;
    color:#494848;
    text-transform: uppercase;
    font-size:14px;
}

.GMXClusterCardBody--Black{
    background-color: #000;
}

.GMXClusterCardBody--Black h4{
    color:white;
}

.GMXClusterCardLink{ 
    display: block;
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height: 100%;
    
}

@media (min-width:475px){
    .GMXClusterCard{
        height: 270px;
    }
}

@media (min-width:768px) {

    .GMXClusterWrapper{ 
        margin: 2rem 1rem;
    }

    .GMXClusterCard:first-child{
        margin-left:0;
    }

    .GMXClusterCard:nth-child(4n){
        margin-left:0;
    }

    .GMXClusterCard{
        flex-basis:45%;
        margin:0 .5rem 1rem .5rem;
    }

}
@media (min-width:992px) {
    .GMXClusterWrapper{
        flex-wrap:wrap;
    }
    .GMXClusterCard{
        flex-basis:30%;
    }
}