.login h1 {
  display: none;
}
* {
  margin: 0;
  padding: 0;
  border: 0;
  text-indent: 0;
  list-style: none;
  -moz-outline: none;
  outline: none;
  outline-color: none;
}
::selection {
  color: #ffece5;
  background: #333;
  /* WebKit/Blink Browsers */
}
::-moz-selection {
  color: #ffece5;
  background: #333;
  /* Gecko Browsers */
}
html > body {
  font-size: 16px;
}
body {
  font-size: 100%;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
  display: block;
}
audio[controls],
canvas,
video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}
hr {
  clear: both;
  visibility: hidden;
}
.dir {
  unicode-bidi: bidi-override;
  direction: rtl;
}
acronym[title] {
  border-bottom: none !important;
  cursor: inherit !important;
  text-decoration: none !important;
}
@font-face {
  font-family: 'Gibson';
  src: url('../webfonts/Gibson-Light-webfont.eot');
  src: url('../webfonts/Gibson-Light-webfont.eot?#iefix') format('embedded-opentype'), url('../webfonts/Gibson-Light-webfont.woff2') format('woff2'), url('../webfonts/Gibson-Light-webfont.woff') format('woff'), url('../webfonts/Gibson-Light-webfont.ttf') format('truetype'), url('../webfonts/Gibson-Light-webfont.svg#webfont') format('svg');
  font-weight: 300;
  font-style: normal;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @font-face {
    font-family: 'Gibson';
    src: url('../webfonts/Gibson-Light-webfont.svg#svgFontName') format('svg');
  }
}
@font-face {
  font-family: 'Gibson';
  src: url('Gibson-SemiBold-webfont.eot');
  src: url('../webfonts/Gibson-SemiBold-webfont.eot?#iefix') format('embedded-opentype'), url('../webfonts/Gibson-SemiBold-webfont.woff2') format('woff'), url('../webfonts/Gibson-SemiBold-webfont.woff') format('woff'), url('../webfonts/Gibson-SemiBold-webfont.ttf') format('truetype'), url('../webfonts/Gibson-SemiBold-webfont.svg#webfont') format('svg');
  font-weight: 800;
  font-style: normal;
}
body {
  background: #fff url(../images/bkg.png) repeat-y top center;
  background-size: 19px 1px;
  -webkit-text-size-adjust: none;
  line-height: 22px;
  color: #333;
  text-align: left;
  font-family: 'Gibson', 'Lucida', 'Lucida Grande', helvetica, arial, sans-serif;
  text-align: center;
  -moz-font-feature-settings: "liga" 1, "dlig" 1;
  -ms-font-feature-settings: "liga" 1, "dlig" 1;
  -o-font-feature-settings: "liga" 1, "dlig" 1;
  -webkit-font-feature-settings: "liga" 1, "dlig" 1;
  font-feature-settings: "liga" 1, "dlig" 1;
}
body.services {
  background-image: url(../images/sky.png), url(../images/bkg.png);
  background-repeat: no-repeat, repeat-y;
  background-attachment: fixed,scroll;
  background-position: center 220px, top center;
}
a {
  color: #333;
  text-decoration: none;
}
#intro a {
  border-bottom: 1px solid #e5e5e5;
  text-decoration: none;
}
#intro a:hover,
#intro a:focus {
  border-bottom: 1px dotted #666;
}
.post-edit-link {
  position: fixed;
  top: 10px;
  right: 5%;
  font-size: x-small;
}
h1 {
  font-size: 44px;
  line-height: 46px;
  margin-bottom: 22px;
  text-align: left;
  font-weight: 800;
}
h2 {
  font-size: 22px;
  text-align: left;
  font-weight: 800;
  margin-bottom: 11px;
}
#bigIntro h1 em {
  font-size: 20px;
  line-height: 24px;
  text-align: left;
  font-weight: 300;
  font-style: normal;
  white-space: normal;
  text-transform: uppercase;
  margin-top: 11px;
  display: block;
}
#bigIntro h1 em:after {
  content: "";
}
h3 {
  font-weight: 800;
}
p,
li,
blockquote {
  font-weight: 300;
}
strong {
  font-weight: 800;
}
p + p {
  margin-top: 11px;
}
.light {
  font-size: 0.8em;
}
.underline {
  border-bottom: 1px solid #e5e5e5;
  text-decoration: none;
}
.underline:hover,
.underline:focus {
  border-bottom: 1px dotted #666;
}
em {
  font-style: normal;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 300;
  white-space: nowrap;
}
em:after {
  content: " |";
}
.wpcf7 em:after {
  content: "";
}
td,
th,
tr {
  vertical-align: top;
}
nav {
  position: fixed;
  z-index: 1000;
  bottom: 0;
  width: 100%;
  left: 0;
  border-bottom: 1px solid #fff8f5;
  background-color: #333;
}
nav a {
  color: #fff;
  text-transform: uppercase;
  font-weight: 800;
  text-decoration: none;
  font-size: 14px;
  letter-spacing: 0.02em;
}
nav #logo a {
  height: 44px;
  width: 32px;
  overflow: hidden;
  text-indent: 110%;
  white-space: nowrap;
  background-size: 239px 86px;
}
#fr nav #logo a {
  background: url(../images/sv-logo-fr.png) no-repeat 0 -28px;
}
#en nav #logo a {
  background: url(../images/sv-logo-en.png) no-repeat 0 -28px;
}
nav #nav li {
  -webkit-transition: width 0.5s linear;
  -moz-transition: width 0.5s linear;
  -o-transition: width 0.5s linear;
  transition: width 0.5s linear;
}
nav #nav li a {
  -webkit-transition: padding 0.5s ease, color 0.2s ease;
  -moz-transition: padding 0.5s ease, color 0.2s ease;
  -o-transition: padding 0.5s ease, color 0.2s ease;
  transition: padding 0.5s ease, color 0.2s ease;
}
#bigIntro {
  -webkit-transition: padding 0.6s ease 0.2s;
  -moz-transition: padding 0.6s ease 0.2s;
  -o-transition: padding 0.6s ease 0.2s;
  transition: padding 0.6s ease 0.2s;
  background-color: #ffece5;
  padding: 110px 5% 44px;
  border-bottom: 1px solid #f2dcd9;
  background-repeat: repeat-y;
}
@media all and (max-width: 699px) {
  #bigIntro {
    background-image: url(../images/grid.png), url(../images/grid.png), url(../images/grid.png), url(../images/grid.png), url(../images/grid.png);
    background-position: 0% 0, 25% 0, 50% 0,75% 0, 100% 0;
  }
}
#projectIntro {
  -webkit-transition: margin 0.5s ease 0.2s, padding 0.6s ease 0.4s;
  -moz-transition: margin 0.5s ease 0.2s, padding 0.6s ease 0.4s;
  -o-transition: margin 0.5s ease 0.2s, padding 0.6s ease 0.4s;
  transition: margin 0.5s ease 0.2s, padding 0.6s ease 0.4s;
  background-color: #f2dcd9;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
  -webkit-background-size: cover;
  color: #fff;
  text-align: left;
  text-shadow: 1px 2px 16px rgba(0, 0, 0, 0.05);
}
#projectData h1 {
  margin: 0 0 11px 0;
}
#projectData ul {
  margin-bottom: 33px;
  border-bottom: 1px solid #ffece5;
}
#projectData li {
  font-size: 14px;
  font-weight: 800;
  text-transform: uppercase;
  border-top: 1px solid #ffece5;
  padding: 0.4em 0.5em 0.4em 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#projectData li a {
  border-bottom-color: #fff;
}
#intro {
  text-align: left;
}
#intro p {
  margin-bottom: 11px;
}
.project #intro {
  padding: 44px 5%;
  background-color: #fff;
  position: relative;
  overflow: hidden;
}
.project .wrapper {
  overflow: hidden;
  position: relative;
  height: 286px;
}
.project .viewMore {
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(255, 255, 255, 0)), color-stop(1, white));
  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0), white);
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0), white);
  background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0), white);
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0), white);
  position: absolute;
  z-index: 100;
  left: 0;
  bottom: 0;
  text-align: center;
  width: 100%;
  padding: 110px 0 44px;
}
.project .viewMore a {
  padding: 12px 14px 10px 14px;
  text-align: right;
  font-weight: 800;
  text-transform: uppercase;
  font-size: 14px;
  letter-spacing: 0.05em;
  color: #d93d1a;
  background-color: #fff;
  border: 1px solid #f2dcd9;
  cursor: pointer;
}
.project .bkgBeige,
.project .bkgMainRose,
.project .bkgLighterRose,
.project .bkgWhite,
.project .bkgCustom {
  width: 90%;
  padding: 88px 5%;
}
.project img {
  width: 100%;
  margin: auto;
  display: block;
}
.project .bkgMainRose {
  background-color: #ffece5;
}
.project .bkgLighterRose {
  background-color: #fff8f5;
}
.project .bkgWhite {
  background-color: #fff;
  border-bottom: 1px solid #fff8f5;
}
.project .bkgBeige {
  background-color: #F7F0EE;
}
.project img.desktop {
  background: url(../images/bbar.png) no-repeat top center;
  background-size: 100%;
  width: 100%;
  height: auto;
  max-width: 1031px;
  padding-top: 2%;
  -webkit-filter: drop-shadow(0 10px 16px #fbf8f8);
  -moz-filter: drop-shadow(0 10px 16px #fbf8f8);
  -ms-filter: drop-shadow(0 10px 16px #fbf8f8);
  filter: drop-shadow(0 10px 16px #fbf8f8);
}
.project .bkgLighterRose img.desktop,
.project .bkgLighterRose img.tablet,
.project .bkgLighterRose img.mobile {
  -webkit-filter: drop-shadow(0 10px 16px #f7ece9);
  -moz-filter: drop-shadow(0 10px 16px #f7ece9);
  -ms-filter: drop-shadow(0 10px 16px #f7ece9);
  filter: drop-shadow(0 10px 16px #f7ece9);
}
.project .mobileBlock {
  width: 100vw;
  border-bottom: 1px solid #fff8f5;
  overflow: hidden;
  background-color: #fff;
  clear: both;
  margin: auto;
  padding: 88px 0;
}
.project img.mobile,
.project img.iphone {
  width: auto;
  max-width: none;
  background: rgba(155, 155, 145, 0.2) url(../images/mobile.svg) no-repeat top center;
  background-size: 30% auto;
  padding: 22px 0 18px;
  border: 1px solid rgba(155, 155, 145, 0.25);
  -webkit-border-radius: 10px;
  -webkit-background-clip: padding-box;
  -moz-border-radius: 10px;
  -moz-background-clip: padding;
  border-radius: 10px;
  background-clip: padding-box;
  position: relative;
}
.project img.tablet {
  height: auto;
  max-width: 768px;
  background: url(../images/tablet-base.png) no-repeat top center;
  width: 80%;
  background-size: 100%;
  padding: 3.5% 1px 8%;
}
.project img.smallImage {
  margin-top: 110px;
}
.project img.smallImage + p {
  text-transform: uppercase;
  font-weight: 800;
  font-size: 14px;
}
.project img.zoom {
  display: none;
}
.project .photo img {
  width: 100%;
  height: auto;
  max-width: 1704px;
  display: block;
}
.project .photoBig img {
  width: 100%;
  height: auto;
  max-width: 2000px;
  display: block;
}
.project blockquote {
  padding: 154px 5% 132px;
  background: #fff;
  text-align: left;
  margin: auto;
  max-width: 1032px;
}
.project blockquote p {
  font-size: 24px;
  font-weight: 800;
  line-height: 26px;
}
.project .photoBig + blockquote {
  padding-top: 44px;
}
.project h2 {
  font-size: 24px;
  font-weight: 800;
  line-height: 26px;
}
.project h2 small {
  font-size: 16px;
  line-height: 22px;
  display: block;
  font-weight: 300;
  text-transform: uppercase;
}
.project .desc {
  font-weight: 300;
  font-size: 14px;
  line-height: 18px;
  text-transform: uppercase;
  text-align: left;
}
.project .desktopOnly {
  display: none;
}
.project .mobileOnly {
  max-width: 566px !important;
  width: 100%;
}
.project #carouselCommands {
  height: 86px;
  border-top: 1px solid #ffece5;
  border-bottom: 1px solid #ffece5;
  background-color: #fff;
  font-size: 0;
}
.project #carouselCommands li {
  display: inline-block;
  height: 86px;
  width: 88px;
  font-size: 14px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #ffece5;
  background: #fff url(../images/base-buttons.png) no-repeat 0 0;
  background-size: 264px 172px;
  white-space: nowrap;
  text-indent: 110%;
  overflow: hidden;
  -webkit-transition: all ease-in-out 0.3s;
  -moz-transition: all ease-in-out 0.3s;
  -o-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
}
.project #carouselCommands li:first-child {
  border-left: 1px solid #ffece5;
}
.project #carouselCommands li:first-child:hover:not(.active) {
  background-position: 0 -86px;
}
.project #carouselCommands li:nth-child(2) {
  background-position: -88px 0;
}
.project #carouselCommands li:nth-child(2):hover:not(.active) {
  background-position: -88px -86px;
}
.project #carouselCommands li:nth-child(3) {
  background-position: -176px 0;
}
.project #carouselCommands li:nth-child(3):hover:not(.active) {
  background-position: -176px -86px;
}
.project #carouselCommands li.active {
  background-color: #fff8f5;
}
.project #carousel {
  width: 100%;
  position: relative;
}
.project #carousel ul {
  text-align: center;
}
.project #carousel li {
  position: absolute;
  -webkit-transform-origin: center top;
  -moz-transform-origin: center top;
  -ms-transform-origin: center top;
  -o-transform-origin: center top;
  transform-origin: center top;
  -webkit-transform: scale(0.7);
  -moz-transform: scale(0.7);
  -ms-transform: scale(0.7);
  -o-transform: scale(0.7);
  transform: scale(0.7);
  -webkit-transition: -webkit-transform 0.5s ease-in, opacity 1s ease-out;
  -moz-transition: -moz-transform 0.5s ease-in, opacity 1s ease-out;
  -o-transition: -o-transform 0.5s ease-in, opacity 1s ease-out;
  transition: -webkit-transform 0.5s ease-in,-moz-transform 0.5s ease-in,-o-transform 0.5s ease-in,transform 0.5s ease-in, opacity 1s ease-out;
  width: 100%;
  text-align: center;
  zoom: 1;
  filter: alpha(opacity=0);
  -webkit-opacity: 0;
  -moz-opacity: 0;
  opacity: 0;
  z-index: 0;
}
.project #carousel li.active {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
  z-index: 100;
  zoom: 1;
  filter: alpha(opacity=100);
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
}
.project #carousel li img {
  margin: auto;
}
.project #carousel li img.mobile,
.project #carousel li img.iphone {
  float: none;
  right: 0;
}
.secondaryFullWidth {
  color: #d93d1a;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  padding: 44px 0 44px;
  width: 100%;
  font-size: 14px;
  font-weight: 800;
  display: block;
  background-color: #fff;
  border-bottom: 1px solid #fff8f5;
  -webkit-transition: color 0.6s ease, background-color 0.4s ease;
  -moz-transition: color 0.6s ease, background-color 0.4s ease;
  -o-transition: color 0.6s ease, background-color 0.4s ease;
  transition: color 0.6s ease, background-color 0.4s ease;
}
.secondaryFullWidth:hover,
.secondaryFullWidth:focus {
  color: #fff;
  background-color: #f5a99a;
}
#filter {
  width: 100%;
  max-width: 520px;
  margin: auto;
}
#filter li {
  background-color: #fff;
  float: left;
  width: 16%;
  font-size: 12px;
  text-align: center;
  text-transform: uppercase;
  max-width: 86px;
}
#filter li a {
  display: block;
  padding: 18px 0 16px;
  text-decoration: none;
  color: #f5a99a;
}
#filter li a:hover,
#filter li a:focus {
  font-weight: 800;
}
#filter li:first-child {
  width: 19.5%;
  max-width: 86px;
  display: block;
  padding: 18px 0 16px;
}
#filter .current-cat {
  background-color: #ffece5;
  position: relative;
  top: -1px;
  left: 1px;
  border-right: 1px solid #f2dcd9;
  margin-bottom: -1px;
}
#filter .current-cat a {
  border-left: 1px solid #f2dcd9;
  border-bottom: 1px solid #ffece5;
  font-weight: 800;
  color: #333;
}
#projectsList {
  clear: both;
  overflow: auto;
}
.item {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 36% 5%;
  text-align: center;
  background-color: #f7f0ee;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
  background-repeat: no-repeat;
  cursor: pointer;
  position: relative;
}
.item:hover .frame {
  border-color: rgba(245, 169, 154, 0.7);
}
.item:hover .frame:before,
.item:hover .frame:after {
  border-right-color: rgba(245, 169, 154, 0.7);
}
.item .frame {
  padding: 6% 2% 4%;
  max-width: 300px;
  margin: auto;
  border: 1px solid rgba(245, 169, 154, 0.4);
  overflow: hidden;
  -webkit-transition: border-color 0.25s ease;
  -moz-transition: border-color 0.25s ease;
  -o-transition: border-color 0.25s ease;
  transition: border-color 0.25s ease;
}
.item .frame:before {
  content: "";
  -webkit-transition: border-color 0.3s ease 0.1s;
  -moz-transition: border-color 0.3s ease 0.1s;
  -o-transition: border-color 0.3s ease 0.1s;
  transition: border-color 0.3s ease 0.1s;
  border-right: 1px solid rgba(245, 169, 154, 0.4);
  display: inline-block;
  height: 32px;
  margin-bottom: 2px;
}
.item .frame:after {
  content: "";
  -webkit-transition: border-color 0.25s ease 0.15s;
  -moz-transition: border-color 0.25s ease 0.15s;
  -o-transition: border-color 0.25s ease 0.15s;
  transition: border-color 0.25s ease 0.15s;
  border-right: 1px solid rgba(245, 169, 154, 0.4);
  display: inline-block;
  height: 30px;
  margin-top: 8px;
}
.item p {
  text-transform: uppercase;
  font-weight: 300;
  letter-spacing: 0.1em;
  font-size: 11px;
  line-height: 12px;
  padding-left: 5%;
  padding-right: 5%;
  color: #f5a99a;
  -webkit-transition: color 0.2s ease;
  -moz-transition: color 0.2s ease;
  -o-transition: color 0.2s ease;
  transition: color 0.2s ease;
  text-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.005);
}
.item h2,
.item h3 {
  font-weight: 800;
  font-size: 22px;
  letter-spacing: 0.025em;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  text-transform: lowercase;
  color: #f5a99a;
  line-height: 28px;
  text-align: center;
  margin-bottom: 2px;
}
.item h2 a,
.item h3 a {
  color: #f5a99a;
  text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.03);
}
.major {
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
  display: inline-block;
  color: #fff;
  text-transform: uppercase;
  font-weight: 800;
  letter-spacing: 0.1em;
  background-color: #d93d1a;
  padding: 40px 5% 36px;
  width: 90%;
  text-decoration: none;
  text-shadow: 1px 1px 2px #a62f14;
  margin-top: 66px;
  z-index: 1000;
  position: relative;
}
.major:hover,
.major:focus {
  text-shadow: none;
  background-color: #f5a99a !important;
}
.services .major {
  background: #d93d1a url(../images/geoSky.svg) no-repeat fixed left 110px;
}
.services footer {
  position: relative;
  z-index: 1000;
}
.services #bigIntro {
  position: relative;
  overflow: hidden;
}
.services #bigIntro #intro {
  z-index: 10;
}
.services #bigIntro #geoSky {
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -o-user-select: none;
  position: fixed;
  top: 114px;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 0;
}
.list #bigIntro {
  position: relative;
  overflow: hidden;
}
.list #bigIntro #intro,
.list #bigIntro h1,
.list #bigIntro h2 {
  z-index: 10;
  position: relative;
}
#eyeglasses,
#mouse,
#brushes {
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -o-user-select: none;
  position: absolute;
  z-index: 0;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
#servicesOffered {
  background-repeat: repeat-y;
  overflow: auto;
}
#servicesOffered li {
  background-color: #fff;
  float: left;
  border-bottom: 1px solid #f2dcd9;
  padding: 66px 5%;
  text-align: left;
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#servicesOffered li h2 {
  float: left;
  font-size: 34px;
  line-height: 34px;
  margin-bottom: 8px;
}
#servicesOffered li h2 a:hover,
#servicesOffered li h2 a:focus {
  color: #f5a99a;
}
#servicesOffered li h2 + a {
  color: #d93d1a;
  text-decoration: none;
  text-transform: uppercase;
  font-weight: 800;
  float: right;
  margin-top: 14px;
  font-size: 14px;
}
#servicesOffered li p {
  clear: both;
  text-transform: uppercase;
  font-size: 14px;
  line-height: 20px;
}
#servicesOffered li p br {
  line-height: 24px;
}
.blockTitle {
  font-size: 28px;
  text-align: center;
  line-height: 30px;
  padding: 88px 0 22px;
}
.blockTitle small {
  clear: both;
  display: block;
  font-size: 14px;
  text-transform: uppercase;
  font-weight: 300;
  line-height: 20px;
}
#priorities {
  background-color: #ffece5;
  clear: both;
  display: block;
  padding-bottom: 66px;
  overflow: hidden;
}
#priorities small img {
  width: 8px;
}
#priorities .wrapper {
  z-index: 1000;
  position: relative;
  padding-bottom: 22px;
}
#priorities #pyramid {
  width: 800px;
  margin: auto;
  float: right;
  height: 294px;
  background: url(../images/pyramide.png) no-repeat center center;
}
#priorities #besoins,
#priorities #armes {
  text-transform: uppercase;
  font-size: 14px;
  width: 50%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#priorities #besoins li,
#priorities #armes li {
  font-weight: 800;
  margin-bottom: 44px;
}
#priorities #besoins {
  float: left;
  padding: 22px 66px 0 0;
  text-align: right;
}
#priorities #besoins li:nth-child(2) {
  padding-right: 33px;
}
#priorities #besoins li:nth-child(3) {
  padding-right: 77px;
}
#priorities #besoins li:nth-child(4) {
  padding-right: 110px;
  margin-bottom: 0;
}
#priorities #armes {
  float: right;
  padding: 22px  0 0 66px;
  text-align: left;
}
#priorities #armes li:nth-child(2) {
  padding-left: 33px;
}
#priorities #armes li:nth-child(3) {
  padding-left: 77px;
}
#priorities #armes li:nth-child(4) {
  padding-left: 110px;
  margin-bottom: 0;
}
#priorities #selectorRail {
  display: none;
}
#metodo,
#HPdesc {
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.85);
  border-bottom: 1px solid #fff8f5;
  padding-bottom: 66px;
  overflow: auto;
  z-index: 1000;
  position: relative;
}
#metodo ul,
#HPdesc ul {
  margin-top: 22px;
  text-align: left;
}
#metodo h3,
#HPdesc h3 {
  font-size: 24px;
}
#metodo li ul,
#HPdesc li ul {
  margin-bottom: 44px;
}
#metodo li li,
#HPdesc li li {
  margin-bottom: 22px;
}
#HPdesc .blockTitle {
  margin-bottom: 11px;
}
#HPdesc a {
  border-bottom: 1px solid #e5e5e5;
  text-decoration: none;
}
#HPdesc a:hover,
#HPdesc a:focus {
  border-bottom: 1px dotted #666;
}
#metodo .blockTitle {
  background: url(../images/shuttle.png) no-repeat 95% 36px;
  -webkit-transition: background-position 2s ease-out;
  -moz-transition: background-position 2s ease-out;
  -o-transition: background-position 2s ease-out;
  transition: background-position 2s ease-out;
  background-size: 81px 52px;
}
.profile #bigIntro {
  position: relative;
  overflow: hidden;
}
.profile #bigIntro #graphisteFreelance {
  position: absolute;
  bottom: 0;
  z-index: 0;
  -webkit-transition: all 1s linear;
  -moz-transition: all 1s linear;
  -o-transition: all 1s linear;
  transition: all 1s linear;
}
.profile #intro {
  position: relative;
  z-index: 100;
  text-transform: uppercase;
  font-size: 14px;
}
.profile #intro li {
  font-weight: 800;
}
.profile #intro small {
  text-transform: none;
  letter-spacing: 0.05em;
  font-size: 12px;
  line-height: 16px;
  display: block;
}
.profile #intro td {
  padding-bottom: 11px;
}
.profile #intro tr:last-child td {
  padding-bottom: 0;
}
.profile #approche,
.profile #actus {
  text-align: left;
}
.profile #approche h2,
.profile #actus h2 {
  font-size: 24px;
  margin-bottom: 11px;
}
.profile #actus h3 {
  margin: 44px 0 6px;
}
.profile #actus li {
  text-transform: uppercase;
  font-weight: 800;
  font-size: 14px;
  line-height: 18px;
  margin-bottom: 15px;
}
.profile #actus li a {
  border-bottom: 1px solid #e5e5e5;
  text-decoration: none;
}
.profile #actus li a:hover,
.profile #actus li a:focus {
  border-bottom: 1px dotted #666;
}
#croisements li {
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
  -o-transition: all 0.3s linear;
  transition: all 0.3s linear;
}
lesshat-selector {
  -lh-property: 0; } 
@-webkit-keyframes circle{ 0% { -webkit-transform:rotate(0deg); }  100% { -webkit-transform:rotate(360deg);}}
@-moz-keyframes circle{ 0% { -moz-transform:rotate(0deg); }  100% { -moz-transform:rotate(360deg);}}
@-o-keyframes circle{ 0% { -o-transform:rotate(0deg); }  100% { -o-transform:rotate(360deg);}}
@keyframes circle{ 0% {-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg); }  100% {-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg);}}
[not-existing] {
  zoom: 1;
}
#circle {
  background: url(../images/circle.png) no-repeat center bottom;
  background-size: 510px 511px;
  min-height: 800px;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
  position: relative;
}
#circle > h3 {
  position: absolute;
  bottom: 184px;
  width: 120px;
  text-align: center;
  left: 50%;
  margin-left: -56px;
}
#circle p br {
  line-height: 33px;
}
#moreWorks .blockTitle {
  background-color: #fff;
  border-top: 1px solid #fff8f5;
  padding: 66px 0 44px;
  margin-top: 88px;
}
.HomePage lesshat-selector {
  -lh-property: 0; } 
@-webkit-keyframes aniStroke1{ 0% { -webkit-transform: rotate(0deg); } 20% { opacity:1;} 100% { -webkit-transform: rotate(180deg); opacity:1;}}
@-moz-keyframes aniStroke1{ 0% { -moz-transform: rotate(0deg); } 20% { opacity:1;} 100% { -moz-transform: rotate(180deg); opacity:1;}}
@-o-keyframes aniStroke1{ 0% { -o-transform: rotate(0deg); } 20% { opacity:1;} 100% { -o-transform: rotate(180deg); opacity:1;}}
@keyframes aniStroke1{ 0% {-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-ms-transform: rotate(0deg);transform: rotate(0deg); } 20% { opacity:1;} 100% {-webkit-transform: rotate(180deg);-moz-transform: rotate(180deg);-ms-transform: rotate(180deg);transform: rotate(180deg); opacity:1;}}
[not-existing] {
  zoom: 1;
}
.HomePage lesshat-selector {
  -lh-property: 0; } 
@-webkit-keyframes aniStroke2{ 0% { -webkit-transform: rotate(0deg); } 20% { opacity:1;} 100% { -webkit-transform: rotate(-180deg); opacity:1; }}
@-moz-keyframes aniStroke2{ 0% { -moz-transform: rotate(0deg); } 20% { opacity:1;} 100% { -moz-transform: rotate(-180deg); opacity:1; }}
@-o-keyframes aniStroke2{ 0% { -o-transform: rotate(0deg); } 20% { opacity:1;} 100% { -o-transform: rotate(-180deg); opacity:1; }}
@keyframes aniStroke2{ 0% {-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-ms-transform: rotate(0deg);transform: rotate(0deg); } 20% { opacity:1;} 100% {-webkit-transform: rotate(-180deg);-moz-transform: rotate(-180deg);-ms-transform: rotate(-180deg);transform: rotate(-180deg); opacity:1; }}
[not-existing] {
  zoom: 1;
}
.HomePage lesshat-selector {
  -lh-property: 0; } 
@-webkit-keyframes aniHeart{ 0% { -webkit-transform: scale(0); } 60% { -webkit-transform: scale(1.2); } 100% { -webkit-transform: scale(1); }}
@-moz-keyframes aniHeart{ 0% { -moz-transform: scale(0); } 60% { -moz-transform: scale(1.2); } 100% { -moz-transform: scale(1); }}
@-o-keyframes aniHeart{ 0% { -o-transform: scale(0); } 60% { -o-transform: scale(1.2); } 100% { -o-transform: scale(1); }}
@keyframes aniHeart{ 0% {-webkit-transform: scale(0);-moz-transform: scale(0);-ms-transform: scale(0);transform: scale(0); } 60% {-webkit-transform: scale(1.2);-moz-transform: scale(1.2);-ms-transform: scale(1.2);transform: scale(1.2); } 100% {-webkit-transform: scale(1);-moz-transform: scale(1);-ms-transform: scale(1);transform: scale(1); }}
[not-existing] {
  zoom: 1;
}
.HomePage .st0 {
  fill: #333;
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}
.HomePage .st1 {
  fill-rule: evenodd;
  clip-rule: evenodd;
  fill: none;
  stroke: #333;
  stroke-width: 0.6;
  stroke-miterlimit: 10;
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}
.HomePage #heart {
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0);
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  -webkit-animation: aniHeart 0.5s ease-out;
  -moz-animation: aniHeart 0.5s ease-out;
  -o-animation: aniHeart 0.5s ease-out;
  animation: aniHeart 0.5s ease-out;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  -o-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-delay: 2.3s;
  -moz-animation-delay: 2.3s;
  -o-animation-delay: 2.3s;
  animation-delay: 2.3s;
}
.HomePage #stroke1 {
  zoom: 1;
  filter: alpha(opacity=0);
  -webkit-opacity: 0;
  -moz-opacity: 0;
  opacity: 0;
  -webkit-animation: aniStroke1 0.8s ease-in-out;
  -moz-animation: aniStroke1 0.8s ease-in-out;
  -o-animation: aniStroke1 0.8s ease-in-out;
  animation: aniStroke1 0.8s ease-in-out;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  -o-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-delay: 2s;
  -moz-animation-delay: 2s;
  -o-animation-delay: 2s;
  animation-delay: 2s;
}
.HomePage #stroke2 {
  zoom: 1;
  filter: alpha(opacity=0);
  -webkit-opacity: 0;
  -moz-opacity: 0;
  opacity: 0;
  -webkit-animation: aniStroke2 1s ease;
  -moz-animation: aniStroke2 1s ease;
  -o-animation: aniStroke2 1s ease;
  animation: aniStroke2 1s ease;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  -o-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-delay: 2.4s;
  -moz-animation-delay: 2.4s;
  -o-animation-delay: 2.4s;
  animation-delay: 2.4s;
}
.HomePage .change {
  display: block;
  position: relative;
  vertical-align: top;
  height: 66px;
  -webkit-transition: color 0.2s linear;
  -moz-transition: color 0.2s linear;
  -o-transition: color 0.2s linear;
  transition: color 0.2s linear;
}
.HomePage #HPBigTitle {
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
@media all and (max-width: 699px) {
  .HomePage #HPBigTitle {
    font-size: 44px;
    line-height: 46px;
    text-align: left;
    margin-bottom: 44px;
  }
  .HomePage #HPBigTitle .small {
    font-size: 22px;
    display: block;
    line-height: 23px;
    font-weight: 300;
  }
  .HomePage #HPBigTitle #parisIco {
    width: 44px;
    height: 44px;
    vertical-align: -16px;
  }
}
.HomePage #moreWorks h2 {
  margin-top: 0;
  margin-bottom: 0;
}
#whatWeDo {
  text-align: center;
  font-size: 16px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #f2dcd9;
}
#whatWeDo li {
  font-weight: 800;
  padding: 21px 30px;
  background-color: #fff;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border-bottom: 1px solid #f2dcd9;
}
#whatWeDo li:first-child {
  border-top: 1px solid #f2dcd9;
}
form {
  text-align: left;
}
input,
textarea,
select {
  background-color: #fff;
  font-size: 16px;
  font-family: 'Gibson', 'Lucida', 'Lucida Grande', helvetica, arial, sans-serif;
  font-weight: 300;
  padding: 11px 11px 10px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-shadow: 0 0 27px 3px rgba(242,220,217,.6);
  -moz-box-shadow: 0 0 27px 3px rgba(242,220,217,.6);
  box-shadow: 0 0 27px 3px rgba(242,220,217,.6);
  -webkit-appearance: none;
  border-radius: 0;
}
select {
  padding: 9px 11px 8px;
}
.devis textarea {
  width: 100%;
}
.devis .wpcf7-form-control-wrap {
  margin-bottom: 22px;
  display: block;
}
.devis em {
  line-height: 33px;
}
.devis .wpcf7-list-item-label {
  letter-spacing: 0.05em;
  font-weight: 800;
  line-height: 22px;
  padding: 0 22px 0 6px;
  font-size: 14px;
  text-transform: uppercase;
}
.devis .wpcf7-list-item {
  display: inline-block;
  position: relative;
  padding-left: 22px;
  margin-right: 0px;
  line-height: 28px;
}
.devis .wpcf7-checkbox input[type=checkbox]:focus {
  border: 1px solid #f5a99a;
  -webkit-box-shadow: 0 0 10px 3px , #f5a99a;
  -moz-box-shadow: 0 0 10px 3px , #f5a99a;
  box-shadow: 0 0 10px 3px , #f5a99a;
}
.devis .wpcf7-radio input[type=radio]:focus {
  border: 1px solid #f5a99a;
  -webkit-box-shadow: 0 0 10px 3px , #f5a99a;
  -moz-box-shadow: 0 0 10px 3px , #f5a99a;
  box-shadow: 0 0 10px 3px , #f5a99a;
}
.devis .wpcf7-checkbox input,
.devis .wpcf7-radio input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: none;
  display: inline-block;
  width: 20px;
  height: 20px;
  cursor: pointer;
  margin-right: 10px;
  position: absolute;
  left: 0;
  top: 0.25em;
  background-color: #fff;
  -webkit-box-shadow: 0 0 27px 3px rgba(242,220,217,.6);
  -moz-box-shadow: 0 0 27px 3px rgba(242,220,217,.6);
  box-shadow: 0 0 27px 3px rgba(242,220,217,.6);
}
.devis :-webkit-autofill {
  color: #fff !important;
}
.devis .wpcf7-radio input,
.devis .wpcf7-exclusive-checkbox input {
  border-radius: 11px;
  width: 22px;
  height: 22px;
  bottom: 4px;
}
.devis .wpcf7-checkbox input:before,
.devis .wpcf7-radio input:before {
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
}
.devis .wpcf7-checkbox input:checked:before,
.devis .wpcf7-radio input:checked:before {
  content: "";
  display: inline-block;
  width: 12px;
  position: relative;
  top: -10px;
  left: -6px;
  height: 12px;
  background-color: #333;
}
.devis .wpcf7-radio input:checked:before,
.devis .budget .wpcf7-checkbox input:checked:before {
  border-radius: 6px;
}
.devis .wpcf7-captchac {
  border-top: 7px solid #fff;
  border-bottom: 7px solid #fff;
  float: left;
  border-right: 1px solid #f2dcd9;
}
.devis .captcha-946 {
  max-width: 375px;
  display: inline-block;
}
.devis .wpcf7-submit {
  display: block;
  margin: 44px auto;
}
.devis #bigIntro.feedback {
  background: #ffece5 url(../images/feedback.gif) no-repeat center bottom;
  background-size: 600px 855px;
}
.devis .sent .group,
.devis .sent p {
  display: none;
}
.devis .wpcf7-mail-sent-ok {
  font-size: 24px;
  line-height: 24px;
  font-weight: 800;
  background: #fff;
  margin: 20% 15% 30%;
  padding: 44px;
}
div.wpcf7 .screen-reader-response {
  position: absolute;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  width: 1px;
  margin: 0;
  padding: 0;
  border: 0;
}
.wpcf7-not-valid-tip,
.wpcf7-validation-errors {
  display: block;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 800;
  color: #C33;
}
.wpcf7-not-valid {
  -webkit-box-shadow: 0 0 4px 0px rgba(204,51,51,.6);
  -moz-box-shadow: 0 0 4px 0px rgba(204,51,51,.6);
  box-shadow: 0 0 4px 0px rgba(204,51,51,.6);
  border: 1px solid #ffa6a6;
  display: block;
}
#contacts {
  text-align: left;
}
#contacts h1 {
  font-size: 24px;
  line-height: 28px;
  margin: 0;
}
#contacts h2,
#contacts .telLink {
  font-weight: 300;
  font-size: 16px;
  color: #333;
  text-decoration: none;
  line-height: 22px;
}
#contacts li {
  font-weight: 800;
  font-size: 20px;
}
#contacts li span {
  display: block;
  font-size: 12px;
  text-transform: uppercase;
  margin: 0 0 22px 1.2em;
  line-height: 12px;
}
#contacts a.clkArea {
  text-align: center;
  color: #d93d1a;
  font-size: 14px;
  letter-spacing: 0.1em;
}
#contacts a.clkArea:hover,
#contacts a.clkArea:focus {
  color: #fff;
  background-color: #f5a99a;
}
#contacts #message a {
  color: #333;
  background-color: rgba(255, 255, 255, 0.94);
  font-weight: 800;
  padding: 10px 16px 9px;
  font-size: 12px;
  text-decoration: none;
  text-transform: uppercase;
  -webkit-transition: all 0.2s ease 0s;
  -moz-transition: all 0.2s ease 0s;
  -o-transition: all 0.2s ease 0s;
  transition: all 0.2s ease 0s;
  border: 1px solid #f2dcd9;
}
#contacts #message a:hover {
  background-color: #f5a99a;
  border-color: #f5a99a;
  color: #fff;
}
#contacts #message.feedback {
  background: #fff url(../images/ok-message.gif) no-repeat center center;
  background-size: cover;
}
#contacts #message.feedback #notice {
  background-color: rgba(255, 255, 255, 0.96);
  margin: 25% auto;
  float: none;
  width: 60%;
  padding: 22px;
}
#contacts #message.feedback #notice p {
  font-size: 24px;
  line-height: 24px;
  font-weight: 800;
  cursor: pointer;
}
#contacts #message #sendMessage {
  color: #fff;
  background: #d93d1a;
  text-shadow: 1px 1px 2px #a62f14;
  font-weight: 800;
  text-transform: uppercase;
  font-size: 14px;
  letter-spacing: 0.1em;
}
#contacts #message #sendMessage:hover,
#contacts #message #sendMessage:focus {
  text-shadow: none;
  background-color: #f5a99a !important;
}
#intro p:first-child:first-letter,
.dropCap:first-letter {
  display: block;
  text-align: center;
  float: left;
  padding: 19px 0 0;
  margin: 0 19px;
  font-weight: 800;
  font-size: 48px;
  line-height: 37px;
}
footer blockquote,
.project footer blockquote {
  background-color: #fff;
  text-align: center ;
  border: 15px solid #fff8f5;
  text-transform: uppercase;
  font-size: 11px;
  line-height: 14px;
  letter-spacing: 0.05em;
  margin: 110px 5% 22px;
  padding: 88px 5% ;
}
footer blockquote strong + br,
.project footer blockquote strong + br {
  line-height: 20px;
}
#footer_language_list li {
  text-transform: uppercase;
  font-size: 12px;
  padding-left: 0.5em;
}
#activeLang span {
  font-weight: 800;
}
#footer_language_list li a {
  text-decoration: none;
}
#footer_language_list li a:hover,
#footer_language_list li a:focus {
  border-bottom: 1px solid #e5e5e5;
  text-decoration: none;
}
#footer_language_list li a:hover:hover,
#footer_language_list li a:focus:hover,
#footer_language_list li a:hover:focus,
#footer_language_list li a:focus:focus {
  border-bottom: 1px dotted #666;
}
#nav .Contct,
#goMessage {
  position: relative;
}
#loadingProgressG {
  width: 100%;
  height: 3px;
  overflow: hidden;
  background-color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}
.loadingProgressG {
  background-color: #333;
  margin-top: 0;
  margin-left: -100px;
  -webkit-animation-name: loadingProgressG;
  -moz-animation-name: loadingProgressG;
  -o-animation-name: loadingProgressG;
  animation-name: loadingProgressG;
  -webkit-animation-duration: 2600ms;
  -moz-animation-duration: 2600ms;
  -o-animation-duration: 2600ms;
  animation-duration: 2600ms;
  -webkit-animation-timing-function: linear;
  -moz-animation-timing-function: linear;
  -o-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -o-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  -o-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  width: 70%;
  height: 3px;
}
@keyframes loadingProgressG {
  0% {
    margin-left: -100%;
  }
  100% {
    margin-left: 100%;
  }
}
@-webkit-keyframes loadingProgressG {
  0% {
    margin-left: -100%;
  }
  100% {
    margin-left: 100%;
  }
}
@media all and (min-width: 400px), and (max-width: 499px) {
  #bigIntro,
  #servicesOffered {
    background-position: 1% 0, 25.5% 0, 50% 0, 75.5% 0, 99% 0;
  }
  #metodo .blockTitle {
    background-position: 85% 36px;
  }
}
@media all and (min-width: 500px) and (max-width: 599px) {
  #bigIntro,
  #servicesOffered {
    background-position: 1.5% 0, 25.1% 0, 50% 0, 75.1% 0, 98.5% 0;
  }
}
@media all and (min-width: 600px) and (max-width: 699px) {
  #bigIntro,
  #servicesOffered {
    background-position: 2% 0, 25% 0, 50% 0, 75% 0, 98% 0;
  }
  #metodo .blockTitle {
    background-position: 75% 36px;
  }
}
@media all and (max-width: 699px) {
  #loadingProgressG {
    background-color: #333;
  }
  .loadingProgressG {
    background-color: #f5a99a;
  }
  body {
    padding-bottom: 66px;
  }
  nav #logo a {
    float: right;
    margin-right: 3%;
  }
  #nav ul {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 83%;
    margin-left: 3%;
  }
  #nav ul li {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -webkit-flex: 1 1 100%;
    -ms-flex: 1 1 100%;
    flex: 1 1 100%;
  }
  #nav ul li a {
    display: block;
    padding-top: 13px;
  }
  #nav ul li a:hover,
  #nav ul li a:focus {
    color: #f5a99a;
  }
  #servicesOffered {
    position: relative;
    z-index: 1000;
  }
  #servicesOffered li {
    background-color: rgba(255, 255, 255, 0.8);
  }
  #priorities .wrapper {
    font-size: 0;
    overflow: auto;
    overflow-y: hidden;
    white-space: nowrap;
    width: 100%;
  }
  #priorities #pyramid {
    display: inline-block;
    font-size: 14px;
    width: 700px;
    padding: 0 20px;
    float: none;
  }
  #priorities #selectorRail {
    display: block;
    width: 90%;
    -webkit-border-radius: 3px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 3px;
    -moz-background-clip: padding;
    border-radius: 3px;
    background-clip: padding-box;
    border: 1px solid #f2dcd9;
    height: 5px;
    position: relative;
    margin: auto;
    top: -11px;
  }
  #priorities #selectorRail img {
    position: absolute;
    height: 4px;
    width: 44px;
    left: 0;
    top: 1px;
  }
  #metodo {
    padding: 0 5%;
  }
  #metodo li:not(:last-child) ul {
    background: url(../images/heart.png) no-repeat left bottom;
    background-size: 8px 8px;
    margin-bottom: 33px;
    padding-bottom: 11px;
  }
  #HPdesc {
    padding: 0 5%;
  }
  #HPdesc li:not(:last-child) {
    background: url(../images/heart.png) no-repeat left bottom;
    background-size: 8px 8px;
    margin-bottom: 33px;
    padding-bottom: 33px;
  }
  #HPdesc li:last-child {
    margin-bottom: 66px;
  }
  .profile #bigIntro #graphisteFreelance {
    left: 26.5%;
    bottom: -44px;
    zoom: 1;
    filter: alpha(opacity=40);
    -webkit-opacity: 0.4;
    -moz-opacity: 0.4;
    opacity: 0.4;
  }
  .profile #approche,
  .profile #actus {
    background: #fff;
    border-bottom: 1px solid #fff8f5;
  }
  #croisements {
    background: url(../images/circle.png) no-repeat 50% -360px;
    background-size: 408px 409px;
  }
  #circle {
    padding: 44px 5%;
    background-size: 408px 409px;
  }
  #circle ul {
    margin-bottom: 396px;
  }
  #circle li {
    background: url(../images/heart.png) no-repeat center bottom;
    background-size: 8px 8px;
  }
  #circle p {
    padding-bottom: 33px;
    margin-bottom: 33px;
  }
  #approche,
  #actus {
    padding: 44px 5%;
  }
  #footer_language_list ul {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  #footer_language_list ul li {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -webkit-flex: 1 1 100%;
    -ms-flex: 1 1 100%;
    flex: 1 1 100%;
  }
  .project .mobileBlock {
    font-size: 0;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    padding: 110px 0 88px;
    width: 100%;
  }
  .project .wrapperCarousel {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: auto;
    display: inline-block;
    text-align: center;
  }
  .project img.mobile,
  .project img.iphone {
    width: 167px;
    margin: 0 11px;
    display: inline;
  }
  .project img.iphone {
    width: 160px;
  }
  #projectIntro {
    padding-top: 38.2vh;
    padding-bottom: 9vh;
    background-position: 50% 50%;
  }
  .HomePage #bigIntro {
    padding: 110px 0 44px;
  }
  .HomePage #bigIntro #HPBigTitle {
    padding-left: 5%;
    padding-right: 5%;
  }
  .devis .wpcf7-list-item {
    display: block;
  }
  .devis input[type=text],
  .devis input[type=email] {
    width: 100%;
  }
  nav.animate #nav {
    z-index: 999;
    position: relative;
    background: #333;
    padding-bottom: 11px;
  }
  nav.animate #logo {
    z-index: 1000;
    position: relative;
  }
  .animate #contacts {
    padding: 0;
    background-color: #fff;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-direction: normal;
    -moz-box-direction: normal;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    position: fixed;
    top: 0;
    overflow: scroll;
    bottom: 44px;
    z-index: 100;
    width: 100%;
  }
  .animate #contacts ul {
    display: none;
  }
  .animate #contacts .data {
    padding: 7% 5% 5%;
    vertical-align: middle;
    border-bottom: 1px solid #ffece5;
  }
  .animate #contacts a.clkArea {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -webkit-flex: 1 0 auto;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    text-align: center;
    color: #d93d1a;
    font-size: 14px;
    letter-spacing: 0.1em;
    padding: 16% 0;
    display: block;
    border-bottom: 1px solid #ffece5;
  }
  .animate #contacts a.clkArea:hover,
  .animate #contacts a.clkArea:focus {
    color: #fff;
    background-color: #f5a99a;
  }
  .animate #contacts #message {
    -webkit-box-flex: none;
    -moz-box-flex: none;
    -webkit-flex: none;
    -ms-flex: none;
    flex: none;
    background-color: #ffece5;
    padding: 5%;
    padding-bottom: 66px;
  }
  .animate #contacts #message a {
    float: right;
    margin-top: 33px;
  }
  .animate #contacts #message input,
  .animate #contacts #message select {
    margin-bottom: 11px;
    width: 100%;
  }
  .animate #contacts #message textarea {
    width: 100%;
    margin-bottom: 11px;
  }
  .animate #contacts #message #sendMessage {
    margin-top: 22px;
  }
  .animate #contacts #message .notification_error {
    overflow: auto;
    clear: both;
  }
  .animate #contacts .noStage {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff url(../images/no-stages.gif) no-repeat center center;
    background-size: cover;
  }
  .animate #contacts .noStage p {
    cursor: pointer;
    font-size: 24px;
    line-height: 24px;
    font-weight: 800;
    background: #fff;
    margin: 20% 15% 40%;
    padding: 22px;
  }
  .list #bigIntro {
    padding-bottom: 120px;
  }
  #eyeglasses {
    right: 0;
    top: 0;
    width: 214px;
    height: 176px;
  }
  #mouse {
    left: 55%;
    bottom: 0;
    width: 239px;
    height: 285px;
  }
  #brushes {
    right: 44%;
    bottom: -66px;
    width: 171px;
    height: 287px;
  }
  #toTop {
    display: none;
  }
}
@media all and (max-width: 699px) and (orientation: landscape) {
  .animate #contacts {
    display: block;
  }
  .animate #contacts .data {
    padding: 5% 5% 1%;
    border-bottom: 1px solid #ffece5;
  }
  .animate #contacts a.clkArea {
    float: left;
    width: 50%;
    padding: 10% 0 30%;
    border-right: 1px solid #ffece5;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  #contacts #message.feedback #notice,
  .animate #contacts .noStage p {
    margin: 8% auto;
  }
}
@media all and (max-width: 699px) and (min-height: 460px) {
  body {
    padding-bottom: 88px;
  }
  nav #logo a {
    margin-top: 10px;
    padding-top: 10px;
  }
  #nav ul li a {
    padding-top: 22px;
    padding-bottom: 11px;
  }
}
@media all and (-webkit-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (min-device-pixel-ratio: 1.5) {
  #metodo .blockTitle {
    background-image: url(../images/shuttle@2x.png);
  }
  #priorities #pyramid {
    background-image: url(../images/pyramide@2x.png);
    background-size: 330px 294px;
  }
  .project #carouselCommands li {
    background-image: url(../images/base-buttons@2x.png);
  }
  .devis #bigIntro.feedback {
    background-image: url(../images/feedback@2x.gif);
  }
}
@media all and (-webkit-min-device-pixel-ratio: 1.5) and all and (max-width: 699px), all and (-o-min-device-pixel-ratio: 3/2) and all and (max-width: 699px), all and (min-device-pixel-ratio: 1.5) and all and (max-width: 699px) {
  #bigIntro {
    background-image: url(../images/grid@2x.gif), url(../images/grid@2x.gif), url(../images/grid@2x.gif), url(../images/grid@2x.gif), url(../images/grid@2x.gif);
    background-size: 19px 2px, 19px 2px, 19px 2px, 19px 2px, 19px 2px;
  }
}