#home-mosaic {
  margin-left: -10px;
  margin-right: -10px;
  /*
	.back {
		opacity: 0;
		position: absolute;
		transition: opacity 250ms ease-in-out;
		top:0;
		left:0;
		width:100%;
		height: 100%;
		padding:10px;

		&.hover {
			-moz-box-shadow: 0px 0px 3px 1px #656565;
			-webkit-box-shadow: 0px 0px 3px 1px #656565;
			-o-box-shadow: 0px 0px 3px 1px #656565;
			box-shadow: 0px 0px 3px 1px #656565;
			filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=NaN, Strength=3);
		}

		.back_inner {
			height: 100%;
			background:#9c9e9f;
			padding:1.5em;
			color:#FFF;

			position: relative;
			overflow: hidden;
		}

		.format_text {
			font-size:14px !important;
		}
		
		.bottom {
			position: absolute;
			bottom: 0;
			width: 100%;
			background-color: rgb(156, 158, 159);
			background: linear-gradient(to bottom, rgba(156,158,159,0.5), rgb(156,158,159));
			left: 0;
			margin: 0;
			height: 20%;
			padding: 0 1em;
			.readmore {
				display: inline-block;
				border:1px solid #FFF;
				color:#FFF;
				padding: 0 10px;
				height: 30px;
				line-height: 30px;
				display: block;
				text-align: center;
				position: absolute;
			    bottom: 1em;
			    left: 1.5em;
				&:hover,&:active,&:focus {
					color:#fff;
					border-color:#FFF;
				}
			}

		}
	}
	*/ }
  #home-mosaic .mosaic-card .flip {
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.24);
    border-style: solid;
    border-width: 0.5px;
    border-image-source: linear-gradient(to bottom, transparent, transparent 80%, rgba(0, 0, 0, 0.02) 95%, rgba(0, 0, 0, 0.04));
    border-image-slice: 1; }
  @media (min-width: 768px) {
    #home-mosaic .mosaic-card:nth-child(4) {
      clear: left; } }
  #home-mosaic h3 {
    padding: 0 !important; }
  #home-mosaic .format_text {
    margin: 0;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 1px; }
  #home-mosaic .front, #home-mosaic .back {
    overflow: hidden; }
  #home-mosaic .front {
    cursor: pointer;
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
    transition: opacity 250ms ease-in-out;
    opacity: 1; }
    #home-mosaic .front img {
      max-width: 100%;
      height: auto;
      width: 100%; }
    #home-mosaic .front:hover {
      transition: all 250ms ease-in-out;
      -moz-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.8);
      -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.8);
      -o-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.8);
      box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.8);
      filter: progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=NaN, Strength=3); }
  #home-mosaic .size_bg, #home-mosaic .size_md {
    width: 100%; }
    #home-mosaic .size_bg h3, #home-mosaic .size_md h3 {
      font-weight: 600;
      line-height: 1.2;
      font-size: 20px; }
    #home-mosaic .size_bg .front .heading_infos, #home-mosaic .size_md .front .heading_infos {
      padding: 10px 20px; }
  #home-mosaic .size_bg {
    width: 100%; }
    #home-mosaic .size_bg .format_text {
      font-size: 16px;
      line-height: 24px; }
    #home-mosaic .size_bg h3 {
      font-size: 25px; }
      @media (min-width: 768px) {
        #home-mosaic .size_bg h3 {
          font-size: 48px; } }
  #home-mosaic .size_md {
    width: 100%; }
    #home-mosaic .size_md .format_text {
      font-size: 15px;
      line-height: 20px; }
    #home-mosaic .size_md h3 {
      font-size: 20px; }
  #home-mosaic .box {
    display: inline-block;
    vertical-align: top;
    padding: 10px;
    overflow: hidden;
    box-sizing: border-box;
    position: relative; }
    @media (max-width: 767px) {
      #home-mosaic .box {
        width: 100%; } }
    @media (min-width: 768px) {
      #home-mosaic .box.box-bg {
        float: left;
        max-width: 704px;
        box-sizing: border-box;
        width: 66%; }
      #home-mosaic .box.box-md {
        max-width: 350px;
        box-sizing: border-box;
        width: 33%; } }
  #home-mosaic .bottom_info {
    width: 100%;
    overflow: hidden;
    background: #FFF;
    color: #000; }
    #home-mosaic .bottom_info .format_picto_container, #home-mosaic .bottom_info .heading_infos {
      overflow: hidden;
      color: #FFF; }
    #home-mosaic .bottom_info .format_picto_container {
      text-align: center; }
      #home-mosaic .bottom_info .format_picto_container img {
        max-width: 100%; }
    #home-mosaic .bottom_info .format_text {
      color: #eb7908; }
    #home-mosaic .bottom_info .heading_infos {
      display: block; }
      #home-mosaic .bottom_info .heading_infos .format_text {
        display: table-cell; }
      #home-mosaic .bottom_info .heading_infos h3 {
        text-align: left;
        padding: 0;
        text-transform: initial;
        overflow: hidden;
        color: #000;
        display: table-cell;
        vertical-align: middle; }
