/* VARIABLES */
/* PARTIALS */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

body {
  color: #7F7F7F;
  font-family: "Karla", Arial, sans-serif;
  line-height: 1.4;
  text-align: center; }

h2 {
  color: #000;
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 30px;
  line-height: 1.25; }

h3 {
  color: #000;
  font-size: 1.5rem;
  margin-bottom: 15px;
  line-height: 1.25; }

img {
  width: 100%;
  height: auto; }

@media only screen and (min-width: 1200px) {
  h2 {
    font-size: 2.625rem;
    margin-bottom: 75px; }

  h3 {
    font-weight: 700; } }
.l-section {
  padding: 75px 0; }

.l-container {
  margin: 0 5%; }

.l-row {
  display: block; }

.l-col {
  box-sizing: border-box; }

@media only screen and (min-width: 670px) {
  .l-row {
    display: flex;
    flex-flow: row wrap;
    justify-content: center; }

  .l-col {
    width: 50%;
    padding: 0 15px; } }
@media only screen and (min-width: 960px) {
  .l-container {
    margin: 0 7.5%; }

  .l-section {
    padding: 75px 0; }

  .l-col {
    width: 33%; } }
@media only screen and (min-width: 1200px) {
  .l-section {
    padding: 90px 0; } }
@media only screen and (min-width: 1400px) {
  .l-container {
    max-width: 1180px;
    margin: 0 auto; } }
.o-button {
  font-weight: 700;
  padding: 15px 30px;
  background-color: #66B4D7;
  color: #fff;
  border-radius: 4px;
  display: inline-block;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.12);
  cursor: pointer;
  text-decoration: none; }
  .o-button.o-button--dark {
    background-color: #142A55; }
    .o-button.o-button--dark:hover {
      background-color: #000; }
  .o-button:hover {
    background-color: #142A55; }
  @media only screen and (min-width: 960px) {
    .o-button {
      font-size: 1.5rem; } }

.o-icon {
  width: 135px;
  height: 135px;
  margin: 0 auto 15px auto;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center; }

.o-ribbon {
  position: absolute;
  right: -5px;
  top: -5px;
  z-index: 1;
  overflow: hidden;
  width: 100px;
  height: 100px;
  text-align: right; }

.o-ribbon span {
  color: #000;
  font-size: 0.875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  text-align: center;
  line-height: 20px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  width: 125px;
  display: block;
  background: #FEDB43;
  box-shadow: 0 3px 10px -5px black;
  position: absolute;
  top: 28px;
  right: -24px; }

.o-ribbon span::before {
  content: "";
  position: absolute;
  left: 0px;
  top: 100%;
  z-index: -1;
  border-left: 3px solid #FEDB43;
  border-right: 3px solid transparent;
  border-bottom: 3px solid transparent;
  border-top: 3px solid #FEDB43; }

.o-ribbon span::after {
  content: "";
  position: absolute;
  right: 0px;
  top: 100%;
  z-index: -1;
  border-left: 3px solid transparent;
  border-right: 3px solid #FEDB43;
  border-bottom: 3px solid transparent;
  border-top: 3px solid #FEDB43; }

.c-header {
  background-color: #66B4D7; }

.c-header__title {
  padding-bottom: 45px; }
  .c-header__title h1 {
    display: none; }
  .c-header__title p {
    color: #fff;
    width: 70%;
    margin: 0 auto; }

.c-header__logo {
  background: 0 0 no-repeat url(../assets/looki-logo.svg);
  width: 42%;
  height: 0;
  padding-top: 13.92%;
  position: relative;
  display: inline-block;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center; }

@media only screen and (min-width: 480px) {
  .c-header__title {
    width: 50%;
    margin: 0 auto; } }
@media only screen and (min-width: 960px) {
  .c-header .l-row {
    align-items: center; }

  .c-header__title {
    width: 33%; }
    .c-header__title p {
      width: 83.3%;
      text-align: left;
      font-size: 1.5rem;
      margin: 0; }

  .c-header__logo {
    display: block;
    margin-bottom: 15px;
    width: 52.5%;
    padding-top: 17.4%; }

  .c-header__hero {
    width: 64%; } }
@media only screen and (min-width: 1200px) {
  .c-header__title p {
    font-size: 2rem; } }
.c-intro p {
  padding-bottom: 30px; }

@media only screen and (min-width: 960px) {
  .c-intro .l-container {
    width: 75%;
    margin: 0 auto; }
  .c-intro h2 {
    margin-bottom: 30px; } }
@media only screen and (min-width: 1200px) {
  .c-intro .l-container {
    width: 66.7%; }
  .c-intro p {
    width: 75%;
    margin: 0 auto; } }

.c-icon-list {
  background-color: #F7F7F7; }
  .c-icon-list h3 {
    width: 75%;
    display: inline-block; }
  .c-icon-list li {
    margin-bottom: 45px;
    padding: 0 15px; }
  .c-icon-list li:last-child {
    margin-bottom: 0; }
  .c-icon-list .o-icon--virtual-actions {
    background-image: url(../assets/icon-virtual-actions.svg); }
  .c-icon-list .o-icon--personas {
    background-image: url(../assets/icon-personas.svg); }
  .c-icon-list .o-icon--sensor-infos {
    background-image: url(../assets/icon-sensor-infos.svg); }
  .c-icon-list .o-icon--social-scoring {
    background-image: url(../assets/icon-social-scoring.svg); }
  .c-icon-list .o-icon--insurance-benefits {
    background-image: url(../assets/icon-insurance-benefits.svg); }
  .c-icon-list .o-icon--icon-social-upgrading {
    background-image: url(../assets/icon-social-upgrading.svg); }

.c-screen-list h3 {
  width: 75%;
  display: inline-block; }
.c-screen-list li {
  margin-bottom: 75px; }
.c-screen-list li:last-child {
  margin-bottom: 0; }
.c-screen-list .o-screen {
  margin-bottom: 30px; }

@media only screen and (min-width: 670px) {
  .c-screen-list .l-row {
    display: block; }
  .c-screen-list .l-col {
    margin: 0 auto; } }
@media only screen and (min-width: 960px) {
  .c-screen-list .l-row {
    display: flex; }
  .c-screen-list .l-col {
    margin: 0; }

  .c-screen-list h2 {
    margin-bottom: 75px; }

  .c-screen-list__info {
    display: flex;
    flex-flow: wrap;
    align-items: center;
    align-content: center; }
    .c-screen-list__info h3 {
      font-size: 2rem;
      font-weight: normal;
      width: 100%; }

  .c-screen-list li:nth-child(2n+1) .c-screen-list__info {
    text-align: left;
    margin-left: 6.9%; }
  .c-screen-list li:nth-child(2n+2) .c-screen-list__screen {
    order: 2; }
  .c-screen-list li:nth-child(2n+2) .c-screen-list__info {
    order: 1;
    text-align: right;
    margin-right: 6.9%; }

  .c-screen-list li:nth-child(3n+1) .c-screen-list__screen, .c-screen-list li:nth-child(3n+4) .c-screen-list__screen {
    width: 33.3%; }
  .c-screen-list li:nth-child(3n+2) .c-screen-list__screen {
    width: 41.67%; }
  .c-screen-list li:nth-child(3n+3) .c-screen-list__screen {
    width: 58.33%; } }
@media only screen and (min-width: 1200px) {
  .c-screen-list h2 {
    margin-bottom: 90px; } }
.c-pricing {
  background-color: #66B4D7; }
  .c-pricing h2 {
    color: #fff; }
  @media only screen and (min-width: 670px) {
    .c-pricing .l-row {
      align-items: center; } }

.c-pricing__card {
  background-color: #fff;
  border-radius: 4px;
  margin-bottom: 30px; }

.c-pricing__card__header {
  border-radius: 4px 4px 0 0;
  background-color: #F7F7F7;
  position: relative; }
  .c-pricing__card__header h3 {
    font-size: 2rem;
    font-weight: bold;
    margin-top: 10px;
    margin-bottom: 0;
    line-height: 1; }
  .c-pricing__card__header p {
    margin-bottom: 5px; }

.c-pricing__card__list li {
  padding: 10px 0;
  border-bottom: 1px solid #F7F7F7; }

.c-pricing__card__list li:last-child {
  padding-bottom: 0;
  border-bottom: none; }

.c-pricing__card__price {
  font-size: 1.5rem; }

.c-pricing__card__price span {
  font-size: 1rem;
  position: relative;
  top: -0.5rem; }

.c-pricing__card__info {
  font-size: 0.875rem;
  padding: 0 15px 30px 15px; }

.c-pricing__card__header {
  padding: 15px; }

.c-pricing__card__list {
  padding: 15px 15px 30px 15px; }

.c-pricing__action {
  margin-top: 30px; }

.c-footer {
  background-color: #142A55;
  color: #8994AA; }
  .c-footer h2, .c-footer h3, .c-footer a {
    color: #fff; }
  .c-footer p {
    margin-bottom: 15px; }
  .c-footer span {
    text-decoration: line-through; }

.c-footer__copyright {
  margin-top: 45px; }

@media only screen and (min-width: 960px) {
  .c-footer .l-section {
    padding: 30px 0; }
  .c-footer h2 {
    margin-bottom: 45px; }
  .c-footer .l-col {
    width: 45%; } }

/*# sourceMappingURL=main.css.map */