@charset "UTF-8";

div.home-rubrique{
    width:                  100%;
    margin:                 auto;
}

div.home-rubrique ul{
    display:                block;
    width:                  auto;
    margin:                 auto;  
}

div.home-rubrique ul li{
    width:                  457px;
    height:                 345px;
    margin:                 auto;
    display:                block;
    list-style:             none;
    position:               relative;
    -webkit-box-sizing:     border-box;
    box-sizing:             border-box;
	float:                  left;
}

div.home-rubrique ul li a{
    text-decoration:        none;
}

div.home-rubrique ul li .mask{
    position:               absolute;
    left:                   0;
    bottom:                 0;
    height:                 37px;
    width:                  100%;
    z-index:                1;
    transition:             all 0.3s;
    -webkit-transition:     all 0.3s;
    background:             #4a4a4a;
}

div.home-rubrique ul li:hover .mask{
    height:                 100%;   
}

div.home-rubrique ul li + li{
    margin-left:            86px;   
}

div.home-rubrique ul li div.photo{
    width:                  100%;
    height:                 100%;
    background-size:        cover;
    background-repeat:      no-repeat;
    background-position:    center;
}

div.home-rubrique ul li div.photo .filter{
    width:                  100%;
    height:                 100%;
    background: 			#747474;
	opacity: 				0.52;
}

section#home-hooks div.home-rubrique ul li h2{
	font-family: 			museo-sans, Arial;
	font-weight: 			900;
    color:                  #fff;
    font-size:              29px;
    line-height:            29px;
    padding:                0 0 16px 0;
	margin-bottom: 			12px;
	position: 				relative;
	text-transform: 		uppercase;
}

div.home-rubrique ul li .content{
	position: 				absolute;
	top: 					100px;
	left: 					52px;
	width: 					auto;
	z-index: 				2;
}

section#home-hooks div.home-rubrique ul li h2:after{
    content: 				'';
	position: 				absolute;
	bottom: 				0;
	left: 					0;
	width: 					54px;
	height: 				4px;
	background: 			#0f9144;
}

div.home-rubrique ul li a div.description{
    font-size:              14px;
    line-height:            17px;
	width: 					270px;
    font-weight:            400;
    color:                  #ffffff;
    text-align:             left;
}

div.home-rubrique ul li a .button{
	position: 				absolute;
	z-index: 				2;
	bottom: 				0;
	right: 					0;
	width: 					auto;
	padding: 				0 40px 0 33px;
	color: 					#fff;
	font-size: 				17px;
	font-weight: 			600;
	height: 				37px;
	line-height: 			37px;
	background: 			url(../../../img/right.png) no-repeat right 18px center #0f9144;
}