@charset "UTF-8";
/* Welcome to Compass.
 * In this file you should write your main styles. (or centralize your imports)
 * Import this file using the following HTML or equivalent:
 * <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
/* Welcome to Compass.
 * In this file you should write your main styles. (or centralize your imports)
 * Import this file using the following HTML or equivalent:
 * <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
/* placeholder: proportions vidéo youtube responsive */
/* placeholder : width de 100vw */
/* changer delay selon position dans la liste*/
/* changer width selon position dans la liste */
/* line 4, ../sass/header-top-front.scss */
.block-header-top-front {
  position: relative;
  max-width: 1280px;
  margin: 50px auto 0;
  overflow: hidden;
}
/* line 5, ../sass/header-top-front.scss */
.block-header-top-front .wrapper-header-top {
  position: relative;
  max-width: 1280px;
  margin: 0 auto;
}
/* line 14, ../sass/header-top-front.scss */
.block-header-top-front img {
  width: 100%;
}
/* line 16, ../sass/header-top-front.scss */
.block-header-top-front img.corner {
  display: none;
}
/* line 20, ../sass/header-top-front.scss */
.block-header-top-front .wrapper-title-infos {
  position: absolute;
  top: 20px;
  left: 25px;
  width: calc(100vw - 50px);
}
/* line 27, ../sass/header-top-front.scss */
.block-header-top-front .wrapper-title-infos h1 {
  position: absolute;
  top: 0;
  left: 0;
  margin: 0;
  width: 275px;
  font-size: 2em;
}
/* line 35, ../sass/header-top-front.scss */
.block-header-top-front .wrapper-title-infos .infos {
  display: none;
}

@media only screen and (min-width: 768px) {
  /* line 43, ../sass/header-top-front.scss */
  .block-header-top-front .wrapper-title-infos {
    width: 100%;
    top: 0;
    left: 0;
    height: 100%;
  }
  /* line 48, ../sass/header-top-front.scss */
  .block-header-top-front .wrapper-title-infos h1 {
    width: calc(100% - 50px);
    position: static;
    max-width: 1080px;
    margin: 40px auto 0;
    font-size: 2.5em;
  }
  /* line 54, ../sass/header-top-front.scss */
  .block-header-top-front .wrapper-title-infos h1 span {
    display: block;
    max-width: 330px;
  }
  /* line 59, ../sass/header-top-front.scss */
  .block-header-top-front .wrapper-title-infos .infos {
    position: absolute;
    width: calc(295px - 50px);
    background: #4D72A2;
    background: -moz-linear-gradient(top, #7451AB 0%, #4D72A2 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7451AB), color-stop(100%, #4D72A2));
    background: -webkit-linear-gradient(top, #7451AB 0%, #4D72A2 100%);
    background: -o-linear-gradient(top, #7451AB 0%, #4D72A2 100%);
    background: linear-gradient(to bottom, #7451AB 0%, #4D72A2 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#7451AB, endColorstr=#4D72A2);
    color: white;
    padding: 25px 25px 25px 25px;
    font-size: 0.9375em;
    bottom: 7px;
    right: 10px;
  }
  /* line 69, ../sass/header-top-front.scss */
  .block-header-top-front .wrapper-title-infos .infos p:first-child {
    margin-top: 0;
  }
  /* line 72, ../sass/header-top-front.scss */
  .block-header-top-front .wrapper-title-infos .infos img {
    max-width: 100px;
    float: right;
  }
  /* line 79, ../sass/header-top-front.scss */
  .block-header-top-front img.corner {
    display: block;
    position: absolute;
    right: 0;
    bottom: 4px;
    z-index: 9;
  }
}
@media only screen and (min-width: 1024px) {
  /* line 96, ../sass/header-top-front.scss */
  .block-header-top-front .wrapper-title-infos .infos {
    display: block;
    position: absolute;
    width: calc(395px - 50px);
    background: #4D72A2;
    background: -moz-linear-gradient(top, #7451AB 0%, #4D72A2 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7451AB), color-stop(100%, #4D72A2));
    background: -webkit-linear-gradient(top, #7451AB 0%, #4D72A2 100%);
    background: -o-linear-gradient(top, #7451AB 0%, #4D72A2 100%);
    background: linear-gradient(to bottom, #7451AB 0%, #4D72A2 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#7451AB, endColorstr=#4D72A2);
    color: white;
    padding: 25px 25px 45px 25px;
    font-size: 0.9375em;
    bottom: 7px;
    right: 75px;
  }
  /* line 106, ../sass/header-top-front.scss */
  .block-header-top-front .wrapper-title-infos .infos p:first-child {
    margin-top: 0;
  }
}