@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 */
/* center vertically */
/* 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" /> */
.wrapper-carriere-list #results ul li .link a .wrapper-fl .ligne {
  background-image: url(../images/pixel-ligne-blanc.png);
  background-repeat: repeat-x;
  background-position: left center;
  height: 7px;
  background-size: auto 1px;
  display: block;
  float: left;
  width: 35px;
}

.wrapper-carriere-list #results ul li .link a .wrapper-fl .pointe {
  background-image: url(../images/pointe-blanche.png);
  background-repeat: no-repeat;
  background-position: left 0;
  background-size: auto 7px;
  display: block;
  float: left;
  width: 7px;
  height: 8px;
}

.wrapper-carriere-list #results ul li .link a:hover .wrapper-fl .ligne {
  background-image: url(../images/pixel-ligne-rose.png);
  width: 105px;
  -webkit-animation: fl-right 0.15s ease-in-out;
  -moz-animation: fl-right 0.15s ease-in-out;
  -ms-animation: fl-right 0.15s ease-in-out;
  -o-animation: fl-right 0.15s ease-in-out;
  animation: fl-right 0.15s ease-in-out;
}

.wrapper-carriere-list #results ul li .link a:hover .wrapper-fl .pointe {
  background-image: url(../images/pointe-rose.png);
}

.select2-container--open .select2-dropdown--below:first-child {
  min-width: 260px;
}

.wrapper-carriere-list {
  padding: 40px 0;
  max-width: 1160px;
  width: calc(100% - 40px);
  margin: 0 auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.wrapper-carriere-list .search-form {
  width: 100%;
  margin-right: 40px;
}
.wrapper-carriere-list .search-form label {
  display: block;
  font-family: "SequelSans-BlackBodyText", sans-serif;
  padding-bottom: 10px;
}
.wrapper-carriere-list .select2-container--default .select2-selection--single {
  border: 0;
  border-bottom: 1px solid black;
  width: 260px;
}
.wrapper-carriere-list .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: black;
}
.wrapper-carriere-list .select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: #000 transparent transparent transparent !important;
}
.wrapper-carriere-list .select2.select2-container.select2-container--default.select2-container--focus {
  width: 100% !important;
}
.wrapper-carriere-list #results {
  width: 100%;
}
.wrapper-carriere-list #results .message {
  margin: 20px 0;
  font-family: "SequelSans-SemiBoldBodyText", sans-serif;
  font-size: 0.875rem;
}
.wrapper-carriere-list #results ul {
  margin: 60px 0 0 0;
  padding: 0;
  list-style: none;
}
.wrapper-carriere-list #results ul li {
  margin-bottom: 60px;
}
.wrapper-carriere-list #results ul li .titre {
  color: #FFD600;
  font-size: 1.875rem;
  line-height: 120%;
  font-family: "SequelSans-BlackBodyText", sans-serif;
}
.wrapper-carriere-list #results ul li .ville {
  font-family: "Helvetica";
  font-size: 1.875rem;
  border-bottom: solid 1px black;
  padding-bottom: 3px;
  font-weight: 600;
  margin-top: 3px;
}
.wrapper-carriere-list #results ul li .description {
  margin-top: 20px;
  font-size: 0.875rem;
  font-family: "SequelSans-SemiBoldBodyText", sans-serif;
}
.wrapper-carriere-list #results ul li .link {
  margin-top: 30px;
  font-family: "SequelSans-BlackBodyText", sans-serif;
}
.wrapper-carriere-list #results ul li .link a {
  text-decoration: none;
  color: black;
}
.wrapper-carriere-list #results ul li .link a .wrapper-fl {
  overflow: hidden;
  width: 100%;
  margin-top: 5px;
}
.wrapper-carriere-list #results ul li .link a .wrapper-fl .ligne {
  background-image: url(../images/pixel-ligne-noir.png);
}
.wrapper-carriere-list #results ul li .link a .wrapper-fl .pointe {
  background-image: url(../images/pointe-noir.png);
}
.wrapper-carriere-list #results ul li .link a:hover {
  color: #FFD600;
}
@media only screen and (min-width: 1024px) {
  .wrapper-carriere-list .search-form {
    width: 260px;
  }
  .wrapper-carriere-list #results {
    width: calc(100% - 300px);
  }
  .wrapper-carriere-list #results .message {
    margin: 40px 0 80px;
  }
  .wrapper-carriere-list #results ul {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    justify-content: space-between;
    margin-top: 0;
  }
  .wrapper-carriere-list #results ul li {
    width: calc(50% - 20px);
  }
}