/* Variables =================================================== */
/* Variables =================================================== */
/* Mixins =================================================== */
.clearfix {
  *zoom: 1;
}
.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}
.clearfix:after {
  clear: both;
}
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  position: static;
  clip: auto;
  height: auto;
  width: auto;
  margin: 0;
  overflow: visible;
}
.hide {
  display: none !important;
  visibility: hidden;
}
.concours17 {
  color: #fff;
  background-color: #efefef;
}
.concours17 div.sec .inner,
.concours17 div.sec .aside {
  color: #3d3d3d;
}
.concours17 div.sec .inner a,
.concours17 div.sec .aside a {
  color: #000;
  border-bottom: 5px solid rgba(73, 220, 218, 0.42);
}
.concours17 .hilight {
  font-weight: 700;
}
.concours17 .stabilo {
  color: #000;
  padding: 0.25em 0.5em;
  background-color: rgba(73, 220, 218, 0.42);
}
.concours17 a,
.concours17 a:hover,
.concours17 a:visited,
.concours17 a:active,
.concours17 a:focus {
  color: #000;
  text-decoration: none;
  border-color: #000;
}
.concours17 section {
  box-shadow: none;
}
.concours17 section.concours {
  padding: 0 0 300px 0;
}
.concours17 section.where {
  background-color: transparent;
  color: #3d3d3d;
  border-top: 2px solid #ccc;
}
.concours17 section.where a {
  color: #000;
}
.concours17 section.where a:hover,
.concours17 section.where a:visited,
.concours17 section.where a:active,
.concours17 section.where a:focus {
  color: #3d3d3d;
}
.concours17 footer[role="contentinfo"] {
  color: #3d3d3d;
  background-color: #efefef;
}
.concours17 div.sec .inner {
  padding-top: 24px;
  padding-right: 24px;
  text-shadow: none;
}
.concours17 .inner h3 {
  font-weight: inherit;
  text-transform: none;
  letter-spacing: 0;
}
.concours17 .inner h4 {
  margin-bottom: 0.75em;
}
.concours17 .concours {
  background-image: url(/assets/concours/2017/vitrines_plans_04_1024@2x.png);
  background-position: 50% 100%;
  background-repeat: repeat-x;
  background-size: auto 300px;
}
.concours17 .concours .theme {
  position: relative;
  height: 200px;
  padding-top: 44px;
  background-image: url(/assets/concours/2017/vitrines_animation–450@2x.gif);
  background-position: 50% 100%;
  background-repeat: no-repeat;
  background-size: cover;
}
.concours17 .concours .theme h2 {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  margin: 0;
  padding: 0.5em 0;
  font-weight: 300;
  text-align: center;
  background-color: #155fac;
  background-color: rgba(21, 95, 172, 0.5);
  background-color: rgba(255, 255, 255, 0.25);
  border-bottom: 2px solid #ccc;
}
.concours17 .concours .summary .title {
  margin-bottom: 0;
  font-size: 32px;
  font-size: 3.2rem;
  font-weight: 600;
}
.concours17 .concours .summary .subtitle {
  font-size: 24px;
  font-size: 2.4rem;
  font-style: italic;
  color: #000;
}
.concours17 .concours .secondary {
  padding: 24px;
  background-color: #000000;
  background-color: rgba(0, 0, 0, 0.5);
}
.concours17 .concours .secondary ol > li {
  margin-bottom: 0.75em;
}
.concours17 .avatar {
  position: relative;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -webkit-box-shadow: 0 0 0 3px white, 0 0 0 4px #999999, 0 2px 5px 4px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 0 0 3px white, 0 0 0 4px #999999, 0 2px 5px 4px rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 0 3px white, 0 0 0 4px #999999, 0 2px 5px 4px rgba(0, 0, 0, 0.2);
}
.concours17 .gallery {
  width: 70%;
  margin: 0 auto;
}
.concours17 .gallery .vcard {
  text-align: center;
}
.concours17 .gallery .vcard .fn {
  padding-top: 1em;
}
.concours17 .gallery .vcard .org {
  font-style: italic;
}
.concours17 .background-animated {
  animation: colorchange 5s infinite;
  /* animation-name followed by duration in seconds*/
  /* you could also use milliseconds (ms) or something like 2.5s */
  -webkit-animation: colorchange 5s infinite;
  /* Chrome and Safari */
}
@keyframes colorchange {
  0% {
    background: rgba(217, 76, 36, 0.5);
  }
  7% {
    background: rgba(215, 46, 49, 0.5);
  }
  14% {
    background: rgba(217, 49, 141, 0.5);
  }
  21% {
    background: rgba(217, 52, 203, 0.5);
  }
  28% {
    background: rgba(91, 32, 227, 0.5);
  }
  35% {
    background: rgba(28, 27, 227, 0.5);
  }
  42% {
    background: rgba(47, 116, 227, 0.5);
  }
  49% {
    background: rgba(106, 231, 233, 0.5);
  }
  56% {
    background: rgba(107, 231, 173, 0.5);
  }
  63% {
    background: rgba(107, 231, 116, 0.5);
  }
  70% {
    background: rgba(118, 231, 70, 0.5);
  }
  77% {
    background: rgba(211, 233, 75, 0.5);
  }
  84% {
    background: rgba(232, 214, 71, 0.5);
  }
  91% {
    background: rgba(223, 146, 52, 0.5);
  }
  100% {
    background: rgba(220, 121, 45, 0.5);
  }
}
@-webkit-keyframes colorchange {
  /* Safari nd Chrome - necessary duplicate */
  0% {
    background: rgba(217, 76, 36, 0.5);
  }
  7% {
    background: rgba(215, 46, 49, 0.5);
  }
  14% {
    background: rgba(217, 49, 141, 0.5);
  }
  21% {
    background: rgba(217, 52, 203, 0.5);
  }
  28% {
    background: rgba(91, 32, 227, 0.5);
  }
  35% {
    background: rgba(28, 27, 227, 0.5);
  }
  42% {
    background: rgba(47, 116, 227, 0.5);
  }
  49% {
    background: rgba(106, 231, 233, 0.5);
  }
  56% {
    background: rgba(107, 231, 173, 0.5);
  }
  63% {
    background: rgba(107, 231, 116, 0.5);
  }
  70% {
    background: rgba(118, 231, 70, 0.5);
  }
  77% {
    background: rgba(211, 233, 75, 0.5);
  }
  84% {
    background: rgba(232, 214, 71, 0.5);
  }
  91% {
    background: rgba(223, 146, 52, 0.5);
  }
  100% {
    background: rgba(220, 121, 45, 0.5);
  }
}
.concours17 .portrait {
  position: relative;
  -webkit-perspective: 600px;
  perspective: 600px;
}
.concours17 .portrait .front {
  -webkit-transform: rotateX(0) rotateY(0);
  transform: rotateX(0) rotateY(0);
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  z-index: 900;
}
.concours17 .portrait.flip .front {
  z-index: 900;
  -webkit-transform: rotateY(179deg);
  transform: rotateY(179deg);
}
.concours17 .portrait .back {
  float: none;
  position: absolute;
  top: 0;
  left: 0;
  width: inherit;
  height: inherit;
  -webkit-transform: rotateY(-179deg);
  transform: rotateY(-179deg);
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  z-index: 800;
}
.concours17 .portrait.flip .back {
  z-index: 1000;
  -webkit-transform: rotateX(0) rotateY(0);
  transform: rotateX(0) rotateY(0);
}
.concours17 .click .front {
  cursor: pointer;
  -webkit-transform: rotateX(0);
  transform: rotateX(0);
}
.concours17 .click.flip .front {
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
  z-index: 900;
}
.concours17 .click .back {
  cursor: pointer;
  -webkit-transform: rotateY(-180deg);
  transform: rotateY(-180deg);
}
.concours17 .click.flip .back {
  -webkit-transform: rotateY(0);
  transform: rotateY(0);
  z-index: 1000;
}
@media only screen and (min-width: 414px) {
  .concours17 {
    /* 414 =================================================== */
  }
  .concours17 .concours .theme {
    height: 250px;
    /* background-image: url(/assets/concours/2017/vitrines_animation–450@2x.gif); */
  }
}
@media only screen and (min-width: 568px) {
  .concours17 {
    /* 568 =================================================== */
  }
  .concours17 .concours {
    background-size: auto 300px;
  }
  .concours17 .concours .theme {
    background-position: 50% 60%;
  }
  .concours17 img.avatar {
    float: none;
    width: auto;
    max-width: 80%;
    margin-right: 0;
  }
  .concours17 .gallery {
    width: 100%;
  }
  .concours17 .gallery .vcard {
    float: left;
    width: 33.333333%;
    text-align: center;
  }
  .concours17 .gallery .vcard:last-child {
    margin-right: 0;
  }
  .concours17 .gallery .vcard .fn {
    padding-top: 1em;
  }
}
@media only screen and (min-width: 736px) {
  .concours17 {
    /* 736 =================================================== */
  }
  .concours17 .concours .theme {
    height: 225px;
  }
  .concours17 .concours .theme h2 {
    padding: 0.5em 0;
    font-size: 30px;
    font-size: 3rem;
  }
}
@media only screen and (min-width: 768px) {
  .concours17 {
    /* 768 =================================================== */
  }
  .concours17 .concours {
    background-size: auto 300px;
  }
  .concours17 .concours .theme {
    height: 400px;
    /* background-image: url(/img/concours/concours-2016-background_768@2x.jpg); */
  }
  .concours17 .concours .theme h2 {
    padding: 0.5em 0;
    font-size: 36px;
    font-size: 3.6rem;
  }
  .concours17 .concours .summary .title {
    font-size: 48px;
    font-size: 4.8rem;
  }
  .concours17 .concours .summary .subtitle {
    font-size: 30px;
    font-size: 3rem;
    margin-bottom: 0.75em;
  }
  .concours17 .concours .summary .strapline {
    font-size: 20px;
    font-size: 2rem;
    margin-bottom: 0.5em;
  }
  .concours17 .concours .secondary {
    padding: 24px 10%;
  }
  .concours17 ul.assets li {
    display: inline;
    display: inline-block;
  }
  .concours17 .gallery .vcard {
    width: 33.33333%;
  }
}
@media only screen and (min-width: 992px) {
  .concours17 {
    /* 992 =================================================== */
  }
  .concours17 .concours .theme {
    height: 500px;
    background-position: 50% 70%;
  }
  .concours17 .concours .theme h2 {
    padding: 0.5em 0 0.5em 25%;
    font-size: 48px;
    font-size: 4.8rem;
    text-align: left;
  }
  .concours17 .concours .summary .title {
    font-size: 48px;
    font-size: 4.8rem;
  }
  .concours17 .concours .summary .subtitle {
    font-size: 36px;
    font-size: 3.6rem;
    margin-bottom: 0.75em;
  }
  .concours17 .concours .summary .strapline {
    font-size: 24px;
    font-size: 2.4rem;
    margin-bottom: 0.5em;
  }
  .concours17 .concours .secondary {
    padding-left: 24px;
  }
  .concours17 ul.assets li {
    display: inline;
    display: inline-block;
  }
}
@media only screen and (min-width: 1152px) {
  .concours17 {
    /* 1152 =================================================== */
  }
  .concours17 .concours .theme {
    height: 500px;
    /* background-image: url(/assets/concours/2017/vitrines_animation–450@2x.gif); */
    background-position: 50% 70%;
  }
  .concours17 .concours .theme h2 {
    padding: 0.5em 0 0.5em 25%;
    font-size: 48px;
    font-size: 4.8rem;
    text-align: left;
  }
  .concours17 .gallery .vcard {
    width: 16.666666%;
  }
  .concours17 section.concours {
    background-size: auto 400px;
    padding-bottom: 400px;
  }
}
@media only screen and (min-width: 1382px) {
  .concours17 {
    /* 1382 =================================================== */
  }
  .concours17 .concours .theme {
    background-position: 50% 60%;
  }
  .concours17 .concours .theme h2 {
    padding: 0.5em 0 0.5em 20%;
  }
  .concours17 .concours .secondary {
    border-left: 0;
    -webkit-column-width: 250px;
    -webkit-column-count: 2;
    -webkit-column-gap: 50px;
    -webkit-column-rule-color: #eee;
    -webkit-column-rule-style: solid;
    -webkit-column-rule-width: 1px;
    -moz-column-width: 250px;
    -moz-column-count: 2;
    -moz-column-gap: 50px;
    -moz-column-rule-color: #eee;
    -moz-column-rule-style: solid;
    -moz-column-rule-width: 1px;
    column-width: 250px;
    column-count: 2;
    column-gap: 50px;
    column-rule-color: #eee;
    column-rule-style: solid;
    column-rule-width: 1px;
  }
  .concours17 section .inner {
    border-color: #ccc;
  }
}
@media only screen and (min-width: 1700px) {
  .concours17 {
    /* 1700 =================================================== */
  }
  .concours17 .concours .theme {
    height: 700px;
  }
  .concours17 .concours .secondary {
    border-left: 0;
    -webkit-column-width: 250px;
    -webkit-column-count: 3;
    -webkit-column-gap: 50px;
    -webkit-column-rule-color: #eee;
    -webkit-column-rule-style: solid;
    -webkit-column-rule-width: 1px;
    -moz-column-width: 250px;
    -moz-column-count: 3;
    -moz-column-gap: 50px;
    -moz-column-rule-color: #eee;
    -moz-column-rule-style: solid;
    -moz-column-rule-width: 1px;
    column-width: 250px;
    column-count: 3;
    column-gap: 50px;
    column-rule-color: #eee;
    column-rule-style: solid;
    column-rule-width: 1px;
  }
}
@media only screen and (min-width: 2500px) {
  .concours17 {
    /* 1700 =================================================== */
  }
  .concours17 .concours .theme {
    background-position: 50% 55%;
  }
}