/**
 * Main style sheets loader.
 *
 * @package    vanilla
 * @subpackage css
 * @author     Loops <evrard at h2a dot lu>
 * @version    SVN: $Id: main.css 37 2017-04-20 13:17:25Z loops $
 */

@import url(normalize.css);
@import url(standards.css);

@import url(fonts/fonts.css); /* @font-face declaration */
/**/ @import url(icons/icons.css); /* [data-icon] stuff */
@import url(defaults.css); /* defaults styles */
@import url(forms.css); /* inputs, buttons, messages */

@import url(styles.css); /* layout and other stuff */

/* Other media css */
/* Print */
@import url(medias/print.css);
/* Projection */
@import url(medias/projection.css);
/* Speech */
@import url(medias/speech.css);
/* Handheld */
@import url(medias/handheld.css);

* {
  box-sizing: border-box;
}

p {
  font-size: 20px;
  font-weight: 300;
  line-height: 32px;
  margin: 0 0 16px;
}

#maincookie {
  background: #000;
  background-color: rgba(0,0,0,.7);
  color: #fff;
}

.hero-header {
  align-items: flex-end;
  background-image: url('../images/hero-header.jpg');
  background-position: top center;
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  height: 100%;
}

.hero-header-content {
  color: #fff;
  margin: 0 0 140px 120px;
}

.hero-header-content__title {
  font-family: 'Futura PT', sans-serif;
  font-size: 72px;
  line-height: 80px;
  margin: 0;
  text-transform: uppercase;
}

.hero-header-content__subtitle {
  color: #FFFFFF;
  font-size: 32px;
  letter-spacing: 0;
  line-height: 48px;
}

.dates-location {
  background-color: #364ED2;
  color: #fff;
  position: absolute;
  right: 0;
  margin-top: -72px;
  padding: 48px 64px;
  width: 45%;
}

.dates-location__main-title {
  font-size: 48px;
  font-weight: 600;
}

.dates-location__subtitle {
  font-size: 32px;
  font-weight: 600;
  margin-top: 32px;
}

.dates-location__content {
  font-size: 32px;
}

.dates-location__link {
  color: #fff;
  display: inline-block;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 2px;
  margin-top: 16px;
  text-transform: uppercase;
  text-decoration: underline;
}

.introduction {
  width: 55%;
  padding: 72px 120px 0;
  font-size: 20px;
  line-height: 32px;
}

.partners {
  margin-top: 100px;
  padding: 120px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.partners__link {
  width: 25%;
  text-align: center;
}

.entries {
  background: #011627 url('../images/entries-bg.svg') no-repeat top right;
  display: flex;
  padding: 57px 120px 57px;
}

.column-left,
.procedure-column-left {
  color: #fff;
  width: 50%;
}

.column-right,
.procedure-column-right {
  color: #fff;
  width: 50%;
  margin-left:120px;
  text-align: center;
}

.column-left__title {
  font-size: 40px;
  margin-bottom: 45px;

}

.column-left__subtitle {
  font-size: 20px;
  margin-top: 60px;
  margin-bottom: 24px;
}

.column-left-bottom {
  background: #364ED2;
  margin-top: 66px;
  padding: 32px 56px 32px 120px;
  margin-left: -120px;
}

.column-left-bottom__title {
  font-size: 24px;
  line-height: 40px;
  font-weight: 600;
  margin: 0;
}

.column-left-bottom__content {
  font-size: 20px;
  line-height: 32px;
  margin-top: 32px;
}

.column-right__title {
  font-size: 24px;
  margin-bottom: 52px;
}

.list {
  background: url('../images/line.svg') no-repeat center 64px;
}

.list__item {
  margin-bottom: 48px;
}

.list__label {
  font-size: 20px;
  line-height: 32px;
  margin-top: 16px;
}

.list__label a,
.contact__content a {
  text-decoration: underline;
}

.procedure {
  display: flex;
  padding: 56px 120px;
}

.procedure * {
  color: #212121;
}

.contact {
  background: #eee;
  padding: 24px 32px;
  width: 408px;
  margin: 0 auto 16px;
}

.contact__title {
  font-size: 32px;
  margin: 0;
}

.contact__content {
  margin: 0;
}

#mainfooter {
  background: #364ED2;
  height: 16px;
}

@media (max-width: 768px) {
  .hero-header-content {
    margin: 16px;
  }

  .hero-header-content__subtitle {
    font-size: 24px;
    line-height: 32px;
  }

  .hero-header-content__title {
    font-size: 56px;
    line-height: 64px;
  }

  .dates-location {
    position: relative;
    width: 100%;
    margin-top: 0;
    padding: 16px;
  }

  .introduction {
    padding: 16px;
    width: 100%;
  }

  .partners {
    margin: 0;
    padding: 16px;
  }

  .partners__link {
    width: 100%;
    margin: 16px 0;
  }

  .entries,
  .procedure {
    padding: 16px;
    flex-wrap: wrap;
  }

  .column-left,
  .procedure-column-left {
    width: 100%;
  }

  .column-right,
  .procedure-column-right {
    width: 100%;
    margin: 0;
  }

  .contact {
    width: 100%;
    margin-top: 32px;
  }

  p {
    font-size: 16px;
    font-weight: 300;
    line-height: 24px;
    margin: 0 0 8px;
  }

  .list__label {
    font-size: 16px;
    line-height: 24px;
    margin-top: 8px;
  }

  .dates-location__content {
    font-size: 24px;
    line-height: 32px;
  }
}