/*-----------------------------------------------------------------------------------

	Theme Name: Mora
	Theme URI: http://
	Description: The Multi-Purpose Onepage Template
	Author: idesignt7
	Author URI: http://themeforest.net/user/idesignt7
	Version: 1.0

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------

TABLE OF CONTENTS

	* Global
		+ Overlay
		+ Navbar
		+ Header
			- carousel, slider, slider-fade
		+ Hero
		+ Portfolio
		+ Numbers
		+ Services
		+ Clients
			- Brand
		+ Price
		+ Team
		+ Ready
		+ Blog
		+ Contact
		+ Footer
		+ Responsive
		
---------------------------------------------------------------- */
@import url(main.css);
@import "https://fonts.googleapis.com/css?family=Raleway:100,200,300,400,500,600,700,800,900";
@import "https://fonts.googleapis.com/css?family=Hind:300,400,500,600,700";
/* -------------------------------------------------------
                     Global 
-------------------------------------------------------- */
body {
  font-family: 'Hind', sans-serif;
  color: #27323a;
  font-weight: 400;
  overflow-x: hidden !important;
}

main {
  background: #fff;
  position: relative;
  z-index: 9;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Raleway', sans-serif;
}

p {
  color: #777;
  line-height: 1.7;
  word-spacing: 1px;
  font-size: 16px;
}

.section-padding {
  padding: 50px 0;
}

.sm-title {
  text-transform: uppercase;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .5px;
}

.titleForMentionsLegales {
  text-transform: uppercase;
  font-size: 23px;
  font-weight: 600;
  letter-spacing: .5px;
}

.bg-gray {
  background: #f7f7f7;
}
.bg-gray .section-head:after {
  color: #ddd;
}

.half-sold {
  position: absolute;
  top: 0;
  right: -15%;
  bottom: 0;
  width: 70%;
  background: #f7f7f7;
  -webkit-transform: skew(-20deg);
          transform: skew(-20deg);
  z-index: 2;
}
.half-sold:after {
  content: '';
  width: 200px;
  height: 100%;
  border-right: 5px solid #f7f7f7;
  border-left: 5px solid #f7f7f7;
  position: absolute;
  left: -400px;
}

.background {
  background-size: cover;
  background-repeat: no-repeat;
}

.section-head {
  text-align: center;
  margin-bottom: 50px;
  position: relative;
}
.section-head:after {
  content: attr(data-title);
  font-size: 80px;
  font-weight: 800;
  color: #eee;
  opacity: .3;
  position: absolute;
  top: -50px;
  left: 0;
  right: 0;
  text-align: center;
  margin: auto;
  z-index: 1;
}
.section-head h4 {
  font-size: 40px;
  font-weight: 200;
  letter-spacing: 1px;
  padding-bottom: 15px;
  position: relative;
  z-index: 2;
}
.section-head h4:after {
  content: '';
  width: 60px;
  height: 2px;
  background: #777;
  position: absolute;
  bottom: 0;
  left: calc(50% - 30px);
}
.section-head p {
  font-size: 18px;
  margin-top: 30px;
}

.button-top {
  position: fixed;
  bottom: -200px;
  right: 20px;
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  border-radius: 50%;
  font-size: 16px;
  color: #fff;
  background: #12a0e0;
  z-index: 99999999;
  -webkit-transition: all .5s;
  transition: all .5s;
  cursor: pointer;
}
.button-top:hover {
  opacity: .8;
}

.button-show {
  bottom: 20px;
}

.cd-headline {
  line-height: 1.2;
}

.cd-words-wrapper {
  display: inline-block;
  position: relative;
  text-align: left;
}

.cd-words-wrapper b {
  display: inline-block;
  position: absolute;
  white-space: nowrap;
  left: 0;
  top: 0;
}

.cd-words-wrapper b.is-visible {
  position: relative;
}

.no-js .cd-words-wrapper b {
  opacity: 0;
}

.no-js .cd-words-wrapper b.is-visible {
  opacity: 1;
}

/* xclip */
.cd-headline.clip span {
  display: inline-block;
  padding: .2em 0;
}

.cd-headline.clip .cd-words-wrapper {
  overflow: hidden;
  vertical-align: top;
}

.cd-headline.clip .cd-words-wrapper::after {
  /* line */
  content: '';
  position: absolute;
  top: 10%;
  right: 0;
  width: 2px;
  height: 70%;
  background-color: #aebcb9;
}

.cd-headline.clip b {
  opacity: 0;
}

.cd-headline b.is-visible {
  opacity: 1;
  font-weight: 900;
}

.butn {
  padding: 10px 25px;
  background: #12a0e0;
  border-radius: 30px;
  color: #fff;
  letter-spacing: 1px;
  font-size: 16px;
  overflow: hidden;
  position: relative;
  z-index: 2;
  -webkit-transition: all .4s;
  transition: all .4s;
}
.butn:before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  background: #fff;
  width: 100%;
  height: 100%;
  z-index: -1;
  -webkit-transition: all .4s;
  transition: all .4s;
}
.butn:hover {
  color: #222;
}
.butn:hover:before {
  left: 0;
}

.owl-theme .owl-dots .owl-dot span {
  width: 10px;
  height: 10px;
  border: 2px solid transparent;
  border-radius: 50%;
  background: #12a0e0;
  margin-top: 30px;
}

.owl-theme .owl-dots .owl-dot:hover span,
.owl-theme .owl-dots .owl-dot.active span {
  background: transparent;
  border-color: #12a0e0;
}

.effect7
{
    position:relative;
    box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.effect7:before, .effect7:after
{
    content:"";
    position:absolute; 
    z-index:-1;
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:0;
    bottom:0;
    left:10px;
    right:10px;
    border-radius:100px / 10px;
} 
.effect7:after
{
    right:10px; 
    left:auto; 
    transform:skew(8deg) rotate(3deg);
}

/* -------------------------------------------------------
                     Overlay 
-------------------------------------------------------- */
[data-overlay-dark],
[data-overlay-light],
[data-overlay-color] {
  position: relative;
}

[data-overlay-dark] .container,
[data-overlay-light] .container,
[data-overlay-color] .container {
  position: relative;
  z-index: 4;
}

[data-overlay-dark]:before,
[data-overlay-light]:before,
[data-overlay-color]:before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}

[data-overlay-dark]:before {
  background: #000;
}

[data-overlay-light]:before {
  background: #fff;
}

[data-overlay-color]:before {
  background: -webkit-gradient(linear, left top, right top, from(#f39619), to(#ff434b));
  background: linear-gradient(to right, #f39619, #ff434b);
}

[data-overlay-dark] h1,
[data-overlay-dark] h2,
[data-overlay-dark] h3,
[data-overlay-dark] h4,
[data-overlay-dark] h5,
[data-overlay-dark] h6,
[data-overlay-dark] span,
[data-overlay-color] h1,
[data-overlay-color] h2,
[data-overlay-color] h3,
[data-overlay-color] h4,
[data-overlay-color] h5,
[data-overlay-color] h6,
[data-overlay-color] span {
  color: #fff;
}

[data-overlay-dark] p,
[data-overlay-color] p {
  color: #bbb;
}

[data-overlay-dark="0"]:before,
[data-overlay-light="0"]:before,
[data-overlay-color="0"]:before {
  opacity: 0;
}

[data-overlay-dark="1"]:before,
[data-overlay-light="1"]:before,
[data-overlay-color="1"]:before {
  opacity: .1;
}

[data-overlay-dark="2"]:before,
[data-overlay-light="2"]:before,
[data-overlay-color="2"]:before {
  opacity: .2;
}

[data-overlay-dark="3"]:before,
[data-overlay-light="3"]:before,
[data-overlay-color="3"]:before {
  opacity: .3;
}

[data-overlay-dark="4"]:before,
[data-overlay-light="4"]:before,
[data-overlay-color="4"]:before {
  opacity: .4;
}

[data-overlay-dark="5"]:before,
[data-overlay-light="5"]:before,
[data-overlay-color="5"]:before {
  opacity: .5;
}

[data-overlay-dark="6"]:before,
[data-overlay-light="6"]:before,
[data-overlay-color="6"]:before {
  opacity: .6;
}

[data-overlay-dark="7"]:before,
[data-overlay-light="7"]:before,
[data-overlay-color="7"]:before {
  opacity: .7;
}

[data-overlay-dark="8"]:before,
[data-overlay-light="8"]:before,
[data-overlay-color="8"]:before {
  opacity: .8;
}

[data-overlay-dark="9"]:before,
[data-overlay-light="9"]:before,
[data-overlay-color="9"]:before {
  opacity: .9;
}

[data-overlay-dark="10"]:before,
[data-overlay-light="10"]:before,
[data-overlay-color="10"]:before {
  opacity: 1;
}

/* -------------------------------------------------------
                     Navbar 
-------------------------------------------------------- */
.navbar-default {
  padding: 20px 0 30px;
  background: none;
  border: none;
  border-radius: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 99;
}
.navbar-default .navbar-nav > li > a {
  margin: 0 !important;
  color: #eee !important;
  padding: 0 !important;
}
.navbar-default .navbar-nav > li {
  font-size: 14px;
  letter-spacing: .5px;
  margin: 20px 0 0 20px;
  padding: 0 5px;
  background: none;
  position: relative;
}
.navbar-default .navbar-nav > li .active {
  background: none;
}
.navbar-default .navbar-nav > li .active:after {
  content: '';
  width: 40px;
  height: 4px;
  position: absolute;
  bottom: -10px;
  left: calc(50% - 20px);
  background: #12a0e0;
}

.nav-scroll {
  background: #fff;
  border-bottom: 1px solid rgba(12, 12, 12, 0.04);
  min-height: 60px;
  line-height: 60px;
  padding: 0;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  -webkit-transition: all .5s;
  transition: all .5s;
}
.nav-scroll .logo {
  padding-top: 5px;
}
.nav-scroll .navbar-nav > li > a {
  color: #35424C !important;
}

.logo {
  width: 90px;
  float: left;
  padding-top: 10px;
}

/* -------------------------------------------------------
                     Header 
-------------------------------------------------------- */
.header {
  height: 100vh;
  background-size: cover;
  background-attachment: fixed;
  overflow: hidden;
}

.headerAnotherPage {
  height: 300px;
}

.header .v-middle {
  z-index: 9;
}
.header .caption {
  margin-top: 50px;
}
.header .caption h5 {
  -webkit-animation-delay: .2s;
          animation-delay: .2s;
  font-size: 30px;
  font-weight: 200;
  letter-spacing: 1px;
  margin-bottom: 20px;
}
.header .caption h5 span {
  font-weight: 600;
}
.header .caption h1 {
  -webkit-animation-delay: .2s;
          animation-delay: .2s;
  font-size: 55px;
  font-weight: 200;
  letter-spacing: 1px;
  margin-bottom: 20px;
}
.header .caption p {
  -webkit-animation-delay: .5s;
          animation-delay: .5s;
  margin-bottom: 20px;
}
.header .caption .butn {
  -webkit-animation-delay: 1s;
          animation-delay: 1s;
}

.carousel .item, .slider .item, .slider-fade .item {
  height: 100vh;
}
.carousel .owl-theme .owl-dots .owl-dot span, .slider .owl-theme .owl-dots .owl-dot span, .slider-fade .owl-theme .owl-dots .owl-dot span {
  margin-top: -45px;
  position: relative;
}

#particles-js {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 4;
}

/* -------------------------------------------------------
                     Hero 
-------------------------------------------------------- */
.hero .intro h6 {
  color: #12a0e0;
}
.hero .intro h4 {
  margin: 15px auto;
  font-weight: 300;
}
.hero .intro h4 b {
  font-weight: 500;
}
.hero .intro p {
  width: 90%;
  margin: auto;
}
.hero .serv .item {
  margin-bottom: 30px;
  padding: 30px 30px;
 /* -webkit-box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.05);*/
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);}
.hero .serv .item:hover .icon {
  background: #12a0e0;
  color: white;
  /*border-color: #f0f0f0;*/
}


.hero .serv .item{
  cursor: pointer;
}
.hero .serv .item:hover h5{
  color: #12a0e0 !important;
}
.hero .serv .icon {
  width: 80px;
  height: 80px;
  border: 5px solid #fff;
  line-height: 75px;
  border-radius: 50%;
  background: #f0f0f0;
  color: #12a0e0;
  font-size: 30px;
  margin-bottom: 30px;
  -webkit-transition: all .5s;
  transition: all .5s;
}
.hero .serv h5 {
  font-weight: 300;
  margin-bottom: 15px;
}
.hero .aboutus {
  overflow: hidden;
  position: relative;
}
.hero .aboutus .story h3 {
  font-weight: 200;
  color: #35424C;
  margin-bottom: 30px;
}
.hero .aboutus .story h3 span {
  font-weight: 700;
  color: #35424C;
}
.hero .aboutus .story p {
  color: #777;
}
.hero .aboutus .story .bitem {
  text-align: center;
  padding: 10px 5px;
  border-radius: 5px;
  -webkit-transition: all .5s;
  transition: all .5s;
  cursor: pointer;
}
.hero .aboutus .story .bitem:hover {
  background: #12a0e0;
  -webkit-transform: translateY(-5px);
          transform: translateY(-5px);
}
.hero .aboutus .story .bitem:hover span {
  color: #fff;
}
.hero .aboutus .story .bitem:hover h5 {
  color: #eee;
}
.hero .aboutus .story .bitem span {
  color: #12a0e0;
  font-size: 50px;
  margin-bottom: 15px;
}
.hero .aboutus .story .bitem h5 {
  font-size: 17px;
  color: #777;
}

/* -------------------------------------------------------
                     Portfolio 
-------------------------------------------------------- */
.portfolio {
  overflow: hidden;
}
.portfolio .filtering {
  text-align: center;
}
.portfolio .filtering span {
  padding: 8px 22px;
  background: #f7f7f7;
  border: 1px solid #eee;
  margin: 0 5px;
  color: #777;
  letter-spacing: 1px;
  font-weight: 600;
  font-size: 13px;
  text-transform: uppercase;
  border-radius: 4px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.portfolio .filtering .active {
  background: #12a0e0;
  border-color: #12a0e0;
  color: #fff;
}
.portfolio .items {
  padding: 0;
}
.portfolio .item-img {
  position: relative;
  overflow: hidden;
}

.link {
  float: left !important;
}

.portfolio .item-img:hover .item-img-overlay {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.portfolio .item-img:hover h6, .portfolio .item-img:hover .icons {
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.portfolio .item-img h6 {
  color: #999;
  font-weight: 600;
  position: relative;
  margin-bottom: 15px;
  -webkit-transform: translateY(-15px);
          transform: translateY(-15px);
  -webkit-transition: all .5s;
  transition: all .5s;
}
.portfolio .item-img h5 {
  font-weight: 600;
  font-size: 16px;
}
.portfolio .item-img-overlay {
  position: absolute;
  top: 5px;
  left: 5px;
  right: 5px;
  bottom: 5px;
  background: rgba(255, 255, 255, 0.95);
  color: #35424C;
  opacity: 0;
  -webkit-transition: all .5s;
  transition: all .5s;
  z-index: 2;
  -webkit-transform: translateY(10px);
          transform: translateY(10px);
}

/* -------------------------------------------------------
                     Numbers 
-------------------------------------------------------- */
.numbers .item {
  text-align: center;
}
.numbers .icon {
  color: #12a0e0;
  font-size: 40px;
  margin-bottom: 20px;
}
.numbers h3 {
  font-weight: 800;
  margin-bottom: 15px;
}
.numbers h6 {
  font-weight: 400;
  font-size: 16px;
  letter-spacing: 1px;
}

/* -------------------------------------------------------
                     Services 
-------------------------------------------------------- */
.services {
  padding-bottom: 00px;
}
.services .item {
  text-align: center;
  margin-bottom: 30px;
  padding: 30px 30px;
  -webkit-box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.05);
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
  cursor: pointer;
}

.services .itemPortfolio {
  text-align: center;
  margin-bottom: 10px;
  padding: 10px 10px;
  -webkit-box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.05);
          box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.05);
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
  /*cursor: pointer;*/
}
.services .item:hover h5{
  color: #12a0e0 !important;
}
.services .item:hover .icon {
  background: #12a0e0;
  color: white;
  /*border-color: #f0f0f0;*/
}

/*.services .item:hover {
	border: 1px solid #b1b1b1;
}*/


.services .item.last{
    background-color: #12a0e0;
    box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
    cursor: pointer;
    color: white !important;
}
.services .item.last:hover h5,
.services .item.last:hover p {
    color: white !important;
}
.services .item.last p {
    color: white !important;
}


.services .item.last:hover .icon {
  background: #12a0e0;
  color: white;
  /*border-color: #f0f0f0;*/
}

/*.services .item:hover .icon {
  background: #fff;
  border-color: red;
}*/
.services .icon {
  width: 80px;
  height: 80px;
  border: 5px solid #fff;
  line-height: 70px;
  border-radius: 50%;
  background: #f0f0f0;
  color: #12a0e0;
  font-size: 30px;
  margin-bottom: 30px;
  -webkit-transition: all .5s;
  transition: all .5s;
  filter: grayscale(0);
}

.testBordureAdrien {
  border-radius: 10px 5px 10px 5px;
}

.services h5 {
  font-weight: 300;
  margin-bottom: 15px;
}

/* -------------------------------------------------------
                     Clients 
-------------------------------------------------------- */
.clients .section-head h4 {
  font-weight: 300;
  padding-bottom: 0;
}
.clients .section-head h4:after {
  display: none;
}
.clients .section-head h4 span {
  font-weight: 600;
}
.clients .item p {
  font-size: 18px;
  font-weight: 300;
  color: #eee;
  word-spacing: 4px;
  margin-bottom: 30px;
  position: relative;
}
.clients .item p:after, .clients .item p:before {
  content: '';
  font-family: 'FontAwesome';
  font-size: 14px;
  color: #12a0e0;
  margin: 0 10px;
  position: relative;
}
.clients .item p:after {
  content: '\f10e';
}
.clients .item p:before {
  content: '\f10d';
}
.clients .item h5 {
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
}
.clients .item h6 {
  display: inline-block;
  font-weight: 400;
  font-size: 15px;
  color: #ccc;
}
.clients .owl-theme .owl-nav [class*=owl-] {
  background: transparent;
  font-size: 20px;
  position: absolute;
  top: 30px;
}
.clients .owl-carousel .owl-nav .owl-prev {
  left: -20px;
}
.clients .owl-carousel .owl-nav .owl-next {
  right: -20px;
}

.brand {
  /*padding: 60px 0;*/
  padding-top: 60px;

  /*background: #f7f7f7;*/
}
.brand img {
  opacity: 1;
}
.brand img:hover {
  opacity: 0.6;
}

/* -------------------------------------------------------
                     Price 
-------------------------------------------------------- */
.price .item {
  background: #f5f5f5;
  padding: 80px 15px;
}
.price .type {
  margin-bottom: 30px;
}
.price .type h5 {
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-family: "Hind", sans-serif;
}
.price .value {
  margin-bottom: 30px;
  padding-bottom: 30px;
  border-bottom: 1px dashed #ddd;
}
.price .value h5 {
  font-size: 80px;
  font-weight: 800;
  position: relative;
  padding: 0 10px;
  display: inline-block;
}
.price .value h5 span {
  font-size: 14px;
  color: #777;
  font-weight: 500;
}
.price .value h5 .mount {
  position: absolute;
  left: 0px;
  top: 5px;
}
.price .value h5 .of {
  position: absolute;
  right: -30px;
  bottom: 0;
}
.price .feat p {
  font-size: 15px;
  line-height: 1.75;
  font-weight: 300;
  margin-bottom: 10px;
}
.price .order {
  margin-top: 30px;
}
.price .order a {
  display: inline-block;
  width: 70%;
  padding: 15px 40px;
  background: #27323a;
  color: #fff;
  border-radius: 30px;
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  -webkit-transition: .5s;
  transition: .5s;
}
.price .order i {
  -webkit-transform: translateY(1px);
          transform: translateY(1px);
  opacity: 0;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.price .order:hover a {
  background: #12a0e0;
}
.price .order:hover i {
  opacity: 1;
  padding-left: 10px;
}
.price .active .order a {
  background: #12a0e0;
}

/* -------------------------------------------------------
                     Team 
-------------------------------------------------------- */
.team .item {
  position: relative;
  color: #fff;
  overflow: hidden;
}
.team .item:after {
  content: '';
  width: 100%;
  height: 100%;
  background: #000;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  z-index: 1;
  -webkit-transition: all .5s;
  transition: all .5s;
}
.team .item:hover:after {
  opacity: .8;
}
.team .item:hover .social-icon {
  top: 15px;
}
.team .item:hover .info {
  bottom: 15px;
}
.team .item .social-icon {
  position: absolute;
  top: -50px;
  right: 15px;
  z-index: 2;
  -webkit-transition: all .5s;
  transition: all .5s;
}
.team .item .social-icon span {
  margin-left: 10px;
  font-size: 12px;
}
.team .item .info {
  position: absolute;
  bottom: -50px;
  left: 15px;
  z-index: 2;
  -webkit-transition: all .5s;
  transition: all .5s;
}
.team .item .info span {
  color: #12a0e0;
  font-size: 12px;
  margin-top: 5px;
}
.team .skills-section {
  position: relative;
}
.team .skills-section .half-sold {
  position: absolute;
  top: 0;
  left: -15%;
  bottom: 0;
  width: 70%;
  background: #f7f7f7;
  -webkit-transform: skew(20deg);
          transform: skew(20deg);
  z-index: 2;
}
.team .skills-section .half-sold:after {
  content: '';
  width: 200px;
  height: 100%;
  border-right: 5px solid #f7f7f7;
  border-left: 5px solid #f7f7f7;
  position: absolute;
  left: calc(100% + 200px);
}
.team .skills-section .skills-items h3 {
  color: #27323a;
  font-weight: 200;
  margin-bottom: 15px;
}
.team .skills-section .skills-items h3 span {
  color: #27323a;
  font-weight: 700;
}
.team .skills-section .skills-items p {
  color: #777;
  word-spacing: 2px;
  margin-bottom: 50px;
}
.team .skills-section .skills-items .prog-item {
  margin-bottom: 30px;
}
.team .skills-section .skills-items .prog-item:last-child {
  margin-bottom: 0;
}
.team .skills-section .skills-items .prog-item h6, .team .skills-section .skills-items .prog-item span {
  color: #27323a;
}
.team .skills-section .skills-items h6 {
  margin-bottom: 10px;
}
.team .skills-section .skills-items .skills-progress {
  height: 15px;
  width: 100%;
  background: #fff;
  border-radius: 4px;
  -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1) inset;
          box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1) inset;
  position: relative;
}
.team .skills-section .skills-items .skills-progress span {
  background: #12a0e0;
  height: 13px;
  width: 0;
  position: absolute;
  left: 0;
  top: 1px;
  border-radius: 4px;
  -webkit-transition: all 1s;
  transition: all 1s;
}
.team .skills-section .skills-items .skills-progress span:after {
  content: attr(data-value);
  position: absolute;
  right: -15px;
  top: -35px;
  background: #111;
  color: #fff;
  font-size: 12px;
  padding: 4px 6px;
  border-radius: 2px;
}
.team .skills-section .skills-items .skills-progress span:before {
  content: '';
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 10px solid #111;
  position: absolute;
  right: -3px;
  top: -10px;
}

/* -------------------------------------------------------
                     Ready 
-------------------------------------------------------- */
.ready h2 {
  font-weight: 200;
  margin-bottom: 30px;
}
.ready h2 span {
  font-weight: 800;
  word-spacing: 4px;
}
.ready p {
  font-size: 18px;
}

/* -------------------------------------------------------
                     Blog 
-------------------------------------------------------- */
.blog .post-img {
  position: relative;
}
.blog .post-img:hover img {
  -webkit-transform: scale(1.2, 1.2);
          transform: scale(1.2, 1.2);
}
.blog .post-img .img {
  overflow: hidden;
}
.blog .post-img .img img {
  -webkit-transition: all .5s;
  transition: all .5s;
}
.blog .post-img .tag {
  position: absolute;
  top: 15px;
  left: -15px;
  padding: 4px 10px 4px 15px;
  background: #12a0e0;
  font-size: 11px;
  color: #fff;
  -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.1);
  z-index: 2;
}
.blog .post-img .tag:before {
  content: '';
  width: 0;
  height: 0;
  border-top: 7px solid #1280b1;
  border-left: 15px solid transparent;
  position: absolute;
  bottom: -7px;
  left: 0;
  z-index: 1;
}
.blog .post-content {
  padding-top: 30px;
  background: #fff;
  border-top: 2px solid #12a0e0;
}
.blog .post-content h6 {
  margin-bottom: 10px;
}
.blog .post-content .by {
  margin-bottom: 20px;
}
.blog .post-content .by span {
  color: #999;
  font-size: 12px;
  margin: 0 5px;
}
.blog .post-content p {
  font-size: 16px;
  padding-bottom: 15px;
}
.blog .post-content .more a {
  padding: 5px 15px;
  background: #12a0e0;
  color: #fff;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  -webkit-transition: all .5s;
  transition: all .5s;
}
.blog .post-content .more a:hover {
  background: #27323a;
}

/* -------------------------------------------------------
                     Contact 
-------------------------------------------------------- */
.contact .map {
  width: 100%;
  height: 400px;
  background: #f7f7f7;
  margin-bottom: 120px;
}
.contact .info .inf-item {
  text-align: center;
  margin-bottom: 50px;
}
.contact .info .inf-item .icon {
  background: #f7f7f7;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  line-height: 60px;
  font-size: 30px;
  color: #12a0e0;
  margin-bottom: 15px;
  -webkit-transition: all .5s;
  transition: all .5s;
}
.contact .info .inf-item .icon:hover {
  background: #12a0e0;
  color: #fff;
}
.contact .info .inf-item h6 {
  font-size: 14px;
}
.contact .contact-form .form-group {
  position: relative;
}
.contact .contact-form .lab {
  font-weight: 500;
  letter-spacing: 1px;
  margin-bottom: 5px;
  margin-left: 10px;
  opacity: .8;
  -webkit-transform: translateY(37px);
          transform: translateY(37px);
  -webkit-transition: all .5s;
  transition: all .5s;
}
.contact .contact-form .focus {
  opacity: 1;
  margin-left: 0px;
  -webkit-transform: translateY(0px);
          transform: translateY(0px);
}
.contact .contact-form input,
.contact .contact-form textarea {
  width: 100%;
  padding: 10px;
  background: #f7f7f7;
  border: 1px solid #eee;
  margin-bottom: 15px;
}
.contact .contact-form textarea {
  height: 160px;
  max-height: 160px;
  max-width: 100%;
}
.contact .contact-form button {
  padding: 10px 30px;
  background: #12a0e0;
  color: #fff;
  border: 0;
  position: relative;
  border-radius: 4px;
  -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  -webkit-transition: all .5s;
  transition: all .5s;
}
.contact .contact-form button:hover {
  padding-left: 50px;
  padding-right: 20px;
}
.contact .contact-form button:hover:before {
  left: 0px;
}
.contact .contact-form button:before {
  content: '\f1d9';
  font-family: 'FontAwesome';
  position: absolute;
  width: 40px;
  height: 100%;
  left: -40px;
  top: 0;
  line-height: 45px;
  background: #f7f7f7;
  color: #111;
  -webkit-transition: all .5s;
  transition: all .5s;
}

.v-middle {
    position: absolute;
    width: 100%;
    top: 50%;
    left: 0;
    -webkit-transform: translate(0%, -50%);
    -moz-transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    -o-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
}

/* -------------------------------------------------------
                     Footer 
-------------------------------------------------------- */
footer {
  padding: 20px 0;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background: #111;
  color: #fff;
  z-index: 1;
}
footer .item .logo {
  float: none;
  margin: 0 auto 20px;
  width: 80px;
  padding-top: 0;
}
footer .item p {
  font-size: 17px;
  word-spacing: 2px;
  color: #eee;
  margin-bottom: 15px;
}
footer .item .social-icon span {
  font-size: 12px;
  width: 30px;
  height: 30px;
  line-height: 30px;
  border-radius: 50%;
  -webkit-transition: all .5s;
  transition: all .5s;
}
footer .item .social-icon span:hover {
  background: #12a0e0;
}

.footerAlignVerticalAndHorizontal {
  margin-bottom: 0px !important;
}


/* -------------------------------------------------------
                    Responsive
-------------------------------------------------------- */
@media screen and (min-width: 769px) {
    .hiddenOnDesktop  {
        display: none !important;
    }
}


/* SUR MOBILE*/
@media screen and (max-width: 767px) {
	html {
		overflow-x: hidden;
	}

  #btnPriseDeContact {
    margin-top: 40px;
  }

  .hero .intro p,
  .aboutus p,
  #puissanceReseau p,
  .contact-form .form-group label {
    text-align: justify;
  }

  .hiddenOnMobile{
    display: none !important;
  }

  .marginOnMobile {
    margin-left: 15px;
    margin-right: 15px;
  }

  .navbar-default .logo {
    margin-left: 20px;
  }
  .navbar-default .navbar-toggle {
    background: none !important;
    margin-top: 15px !important;
    border: none !important;
  }
  .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    background: transparent !important;
  }
  .navbar-default .navbar-toggle .icon-bar {
    background: #fff;
  }
  .navbar-default .navbar-nav li a {
    color: #111 !important;
  }
  .navbar-default .navbar-nav > li > a {
    padding-bottom: 0 !important;
  }
  .navbar-default .navbar-collapse {
    text-align: center;
    border: none;
    border-top: 1px solid rgba(12, 12, 12, 0.04);
    background: #fff;
    margin-top: 5px;
    padding-bottom: 15px;
  }

  .nav-scroll .navbar-toggle .icon-bar {
    background: #111;
  }

  .header h1 {
    font-size: 35px !important;
  }

  .portfolio .filtering span {
    margin: 10px 2px;
  }

  .mb-sm-50 {
    margin-bottom: 50px;
  }

  .mb-sm-30 {
    margin-bottom: 30px;
  }

  #containerMainIPHONE {
    width: 100% !important;
  }

  #containerMainMACBOOK {
    right: 0px !important;
    margin-bottom: 15%;
  }

}

@media only screen and (max-width: 768px) {

  .hiddenOniPad {
    display: none;
  }

}

@media screen and (max-width: 991px) {

  	.skills-items{
    	text-align: center;
  	}
  	.half-sold {
	    right: 0 !important;
	    left: 0 !important;
	    width: 100% !important;
	    -webkit-transform: skew(0deg) !important;
        	transform: skew(0deg) !important;
  	}
  	.half-sold:after {
    	display: none !important;
  	}

  	.no-background {
    	background: transparent !important;
  	}

  	.navbar-default .navbar-nav > li {
    	margin: 20px 5px 0;
  	}

  	.header h1 {
    	font-size: 50px !important;
  	}

  	.header h5 {
    	font-size: 45px !important;
  	}

  	.portfolio .items {
    	/*width: 100%;*/
  	}

  	.mb-md-50 {
    	margin-bottom: 50px;
  	}

  	.mb-md-30 {
    	margin-bottom: 30px;
  	}

  	main {
    	margin-bottom: 0 !important;
  	}

  	footer {
    	position: relative;
  	}
  	footer .subscribe h6 {
    	text-align: left;
  	}

    #containerMainIPHONE {
      width: 100% !important;
      right: 0px !important;
    }

    #containerWithMaquetteIPHONE {
      width: 87% !important;
    }

    #containerMainMACBOOK {
      right: 0px !important;
      margin-bottom: 15%;
    }

    #containerMainIMAC {
      left: 0px !important;
      margin-left: 0px !important;
    }

    .taj {
      text-align: justify;
    }

    #txtNousRealisons b {
      font-size: 20px !important;
    }

    .section-head:after {
      content: '';
    }

    .section-head h4 {
      font-size: 48px;
    }

    #txtEnSavoirPlus {
      margin-top: 20px;
    }

    #txtHeaderDesc {
      padding-left: 15px;
      padding-right: 15px;
    }

    .hero .intro p {
      width: 100%;
    }

    .headerAnotherPage {
      height: 300px;
    }
}
/* -------------------------------------------------------
                    End
-------------------------------------------------------- */

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





.projinfo {
  font-size: 20px;
}

.divClickable:hover {
  cursor: pointer;
}

.services .iconSansBGBleu:hover .icon{
  background: #f0f0f0;
  filter: grayscale(1);
}

.header a{
  margin-left: 15px; margin-right: 15px;
}

#form_cgv {
  width: unset;
}

#label_form_cgv {
  margin-top: 4px;
}

#form_info {
  padding-left: 15px;
}

.pulsate_once {
  outline: 0px; box-shadow: rgba(165, 209, 108, 0) 0px 0px 13px; outline-offset: 20px;
}

.parent {
  display: flex;
}

.enfant {
  margin-top: auto;
  margin-bottom: auto;
  /*width: 180px !important;
  margin-right: 20px !important;*/
}

#containerMainIPHONE {
  width: 100%;
  position: relative;
  overflow: auto;
  right: 5%;
}

.iPhoneMacIMACmaquette {
  z-index: 1;
  width: 100%;
  height: auto;
}

#containerWithMaquetteIPHONE {
  /*cursor: grab;
  cursor : -o-grab;
  cursor : -moz-grab;
  cursor : -webkit-grab;*/
  margin-left: 6.5%;
  margin-right: 6.5%;
  position: absolute;
  top: 13.5%;
  bottom: 12%;
  overflow: auto;
}

#contentMaquetteScrollIPHONE {
  width: 100%;
  height: auto;
  overflow: scroll;
  z-index: 11;
}

#containerWithMaquetteIPHONE::-webkit-scrollbar {
  display: none;
}

#containerMainMACBOOK {
  /*width: 49%;*/
  width: 100%;
  position: relative;
  overflow: auto;
  display: inline-block;
  z-index: 35;
  /*right: 12%;*/
  right: 20%;
}

#containerWithMaquetteMACBOOK {
  /*cursor: grab;
  cursor : -o-grab;
  cursor : -moz-grab;
  cursor : -webkit-grab;*/
  margin-left: 11.5%;
  margin-right: 11.5%;
  position: absolute;
  top: 9%;
  bottom: 10%;
  overflow: auto;
  width: 77%;
}

#contentMaquetteScrollMACBOOK {
  width: 100%;
  height: auto;
  overflow: scroll;
  z-index: 11;
}

#containerWithMaquetteMACBOOK::-webkit-scrollbar {
  display: none;
}

#containerMainIMAC {
  /*width: 50%;*/
  width: 100%;
  position: relative;
  overflow: auto;
  display: inline-block;
  left: 10%;
}

#containerWithMaquetteIMAC {
  /*cursor: grab;
  cursor : -o-grab;
  cursor : -moz-grab;
  cursor : -webkit-grab;*/
  margin-left: 4%;
  margin-right: 4%;
  position: absolute;
  top: 7.1%;
  bottom: 32%;
  overflow: auto;
  width: 92%;
}

#contentMaquetteScrollIMAC {
  width: 100%;
  height: auto;
  overflow: scroll;
  z-index: 11;
}

#containerWithMaquetteIMAC::-webkit-scrollbar {
  display: none;
}

.noCursorPointer {
  cursor: initial !important;
}

#btnContactMenu:hover {
  color: #12a0e0 !important;
}

#btnContactMenu:hover:before {
  background-color: #d3d7da !important;
}

#btnContactMenu {
  color: white !important;
}