#content>.solutions{
    float: left;
    width: 100%;
    margin-top: 6vmax;
    --h_solution:14vmax;
    --ecart_solution:50px;
}


#content>.solutions>.masolution{
    float: left;
    width: calc((100% - 2*var(--ecart_solution))/3);
    height: var(--h_solution);
    margin-right: var(--ecart_solution);
}
#content>.solutions>.masolution:last-child{margin-right: 0px;}


#content>.solutions>.masolution>a{
    float: left;
    width: 100%;
    height: 100%;
    text-decoration: none;
    position: relative;
    border: 1px solid #999;

	border-radius: 0px 0px 20px 0px;
	-moz-border-radius: 0px 0px 20px 0px;
	-webkit-border-radius: 0px 0px 20px 0px;

    transition-property: border-color;
    transition-duration: 0.8s;
    transition-timing-function:ease-in-out;
    transition-delay: 0s;
}
#content>.solutions>.masolution>a>div:first-child{
    position: absolute;
    top:0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: .5;
    z-index: 0;

	border-radius: 0px 0px 20px 0px;
	-moz-border-radius: 0px 0px 20px 0px;
	-webkit-border-radius: 0px 0px 20px 0px;
}
#content>.solutions>.masolution>a>div:last-child{
    position: absolute;
    top:0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 1;
    box-sizing: border-box;
    padding-top: 4vmax;
    padding-bottom: 4vmax;
    padding-left: 4vmax;
    padding-right: 4vmax;
}
#content>.solutions>.masolution>a>i{
    position: absolute;
    top:-3vmax;
    left: 3vmax;
    width: 6vmax;
    height: 6vmax;
    line-height: 6vmax;
    font-size: 3vmax;
    color: white;
    background-color: #444;
    text-align: center;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
    box-sizing: border-box;
    border: 1px solid #999;
    z-index: 2;

    transition-property: background-color;
    transition-duration: 0.8s;
    transition-timing-function:ease-in-out;
    transition-delay: 0s;
}
#content>.solutions>.masolution>a>div:last-child>h2{
    float: left;
    width: 100%;
    font-size: 2.0vmax;
    line-height: 2.6vmax;
    font-family: 'robotothin';
    color: white;
}

#content>.solutions>.masolution>a:hover>i{background-color: tomato;}
#content>.solutions>.masolution>a:hover{border-color: tomato;}




@media (min-width: 950px) AND (max-width: 1100px) {

    #content>.solutions{
        --h_solution:14vmax;
        --ecart_solution:25px;
    }
}
@media (max-width: 950px) {

    #content>.solutions{
        --h_solution:12vmax;
        --ecart_solution:10px;
    }
    #content>.solutions>.masolution>a>div:last-child{
        padding-top: 4vmax;
        padding-bottom: 2vmax;
        padding-left: 2vmax;
        padding-right: 2vmax;
    }
    #content>.solutions>.masolution>a>div:last-child>h2{
        font-size: 1.4vmax;
        line-height: 1.8vmax;
    }
}