body {
	margin: 0;
	padding: 0;
	color: #FFF;
}
body.deactivate{
	overflow: hidden ;
}
.not-visible{
	opacity: 0;
}

.safari.desktop{
  font-family: "Lato";
}

/*Loader*/

#loader{
	 width: 100vw;
    height: 100vh;
    position: fixed;
    z-index: 999999;
}
.loader{
    width: 100vw;
    height: 100vh;
    text-align: center;
    vertical-align: middle;
    display: table-cell;
    background-color: rgba(20, 4, 40, 1);
}
@-webkit-keyframes scale {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1; }

  45% {
    -webkit-transform: scale(0.1);
            transform: scale(0.1);
    opacity: 0.7; }

  80% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1; } }
@keyframes scale {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1; }

  45% {
    -webkit-transform: scale(0.1);
            transform: scale(0.1);
    opacity: 0.7; }

  80% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1; } }

.ball-pulse > div:nth-child(0) {
  -webkit-animation: scale 0.75s -0.36s infinite cubic-bezier(.2, .68, .18, 1.08);
          animation: scale 0.75s -0.36s infinite cubic-bezier(.2, .68, .18, 1.08); }
.ball-pulse > div:nth-child(1) {
  -webkit-animation: scale 0.75s -0.24s infinite cubic-bezier(.2, .68, .18, 1.08);
          animation: scale 0.75s -0.24s infinite cubic-bezier(.2, .68, .18, 1.08); }
.ball-pulse > div:nth-child(2) {
  -webkit-animation: scale 0.75s -0.12s infinite cubic-bezier(.2, .68, .18, 1.08);
          animation: scale 0.75s -0.12s infinite cubic-bezier(.2, .68, .18, 1.08); }
.ball-pulse > div:nth-child(3) {
  -webkit-animation: scale 0.75s 0s infinite cubic-bezier(.2, .68, .18, 1.08);
          animation: scale 0.75s 0s infinite cubic-bezier(.2, .68, .18, 1.08); }
.ball-pulse > div {
  background-color: #fff;
  width: 15px;
  height: 15px;
  border-radius: 100%;
  margin: 2px;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  display: inline-block; 
}
/*END Loader*/

/*General*/
	.blue{ color:#00debc; }
	.white{ color:#fff; }
	.thin {font-weight: 100;}
	.safari.desktop .thin {font-weight: 300;}
  	a, button { outline: none;}
  	a {
		color: #00debc;
		text-decoration: none;
	}
	a:hover, a:focus { 
		color: #34495e; 
	}
	*::selection { 
		background:#00debc; 
 		color:#fff; 
	} 
	a:hover, a:active, a:focus {
  		outline:none;
  		border:0;
	}
	*::-moz-selection { 
  		background:#00debc; 
  		color:#fff; 
  	} 
	*::-webkit-selection { 
  		background:#00debc; 
  		color:#fff; 
  	}
  	h2{
  		font-weight: 800;
  	}
	.fullpage{
  		height: 100vh;
	}
	.separator{
		background: #FFF;
		height: 1px;
		position: relative;
		width: 150px;
		margin: 0 auto;
		margin-bottom: 40px
	}
	#body-background{
		background-image: url('../img/assets/hello.jpg');
		overflow: hidden;
		-webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
		background-position: center center;
		position: fixed;
		width: 100%;
		height: 100%;
		z-index: 0;
	}
	.mobile #body-background{
		display: none;
	}
	.mobile #intro{
		background-image: url('../img/assets/hello.jpg');
		overflow: hidden;
		-webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
		background-position: center center;
	}
	.ios #body-background{
		position: absolute;
		background-attachment: fixed;
		background-attachment: scroll;
		background-repeat: no-repeat;
	}
	.ios #welcome{
		margin-top: -2px;
	}
	.safari.ios #welcome{
		margin-top: -70px;
	}
	.crios.ios.ipad #welcome {
		margin-top: 0px;
	}
	.crios .animated{
		opacity: 1 !important;
	}
	#total-container{
		overflow: hidden;
	}
	.valign{
	    position: relative;
	    top: 50%;
	    -webkit-transform: translateY(-50%);
	    -ms-transform: translateY(-50%);
	    transform: translateY(-50%);
	}
	.animated{
		opacity: 0;
	}
	/*buttons*/
		.button-line{
			text-align: center;
			margin-top: 30px;
			margin-bottom: 30px;
		}
		.btn{
			color: #fff;
		    background: #00debc;
		    border-radius:0;
		    border:0;
		    font-weight: 700;
		    text-transform: uppercase;
		    position: relative;
		    line-height: 40px;
		    padding: 0 40px;
		    font-size: 12px;
		    letter-spacing: .2em;
		    outline: 1px solid transparent;
		    border-top: 1px solid transparent;
			border-bottom: 1px solid transparent;
		    -webkit-transition: all .5s ease .25s;
		    transition: all .5s ease .25s;
		}

		.btn:hover{
		    background-color: transparent;
		    color: #00debc;
		    border: solid 1px;
		}
		.btn:active{
		    background-color: #FFF;
		    color: #00debc;
		}
		.btn:after, .btn:before {
		    -webkit-transition: all .2s ease 0s;
		    transition: all .2s ease 0s;
		    content: '';
		    position: absolute;
		    width: 1px;
		    height: 100%;
		    top: 0;
		    background: #00debc;
		}
		.btn:before {
		    left: -8px;
		}
		.btn:hover:before {
		    left: 0;
		    background: transparent;
		}
		.btn:after {
		    right: -8px;
		}
		.btn:hover:after {
		    right: 0;
   		    background: transparent;
		}
		.btn:active, .btn.active {
		    background-image: none;
		    outline: 0;
		    -webkit-box-shadow: none;
		    box-shadow: none;
		}
		.btn:focus, .btn:active:focus, .btn.active:focus {
		    outline: 0;
		}
	/*End Buttons*/
/*End General*/

/* MENU */
  .menu {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.76);
    width: 100%;
    z-index: 9999;
    overflow: scroll;
  }

  .menu .container {
    position: relative;
    z-index: 92;
    margin: 0 auto;
    height: 100%;
    text-align: center;
  }

  .menu .container .categories {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -260px 0 0 -200px;
    padding: 0;
    width: 400px;
  }

  .menu .container .categories li {
    display: none;
    margin: 0 0 0.1em 0;
    padding: 0;
    list-style: none;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-size: 2em;
    font-weight: 100;
  }

  .menu .container .categories li a {
    display: block;
    padding: 0.2em;
    color: #fff;
    margin-top: 20px;
    padding-bottom: 10px;
    padding-top: 9px;
  }

  .menu .container .categories li a .text {
    position: relative;
  }

  .menu .container .categories li a .text {
    display: -moz-inline-stack;
    display: inline-block;
    vertical-align: middle;
    zoom: 1;
  }

  .menu .container .categories li a:hover .text:after {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    opacity: 1;
    width: 100%;
  }

  .menu .container .categories li a .text:after {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    opacity: 0;
    -webkit-transition: opacity 0.3s cubic-bezier(0.455, 0.03, 0, 1),width 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -moz-transition: opacity 0.3s cubic-bezier(0.455, 0.03, 0, 1),width 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -o-transition: opacity 0.3s cubic-bezier(0.455, 0.03, 0, 1),width 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    transition: opacity 0.3s cubic-bezier(0.455, 0.03, 0, 1),width 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    display: block;
    margin: 0 auto;
    width: 0%;
    height: 1px;
    background-color: #00debc;
    content: "";
   }

  .menu .container .categories li a.is-active .text:after {
    display: none;
  }

  .menu .categories li a.is-active {
    border: solid 1px #00debc;
    cursor: default;
  }

  .menu ul.lang{
	  list-style-type: none;
	  display: table;
	  padding: 0;
	  bottom: 20px;
	  position: absolute;
	  right: 10%;
	  font-size: 20px;
	  z-index: 99;
  }
  .menu ul.lang > li{
  	display: table-cell;
  	vertical-align: middle;
    width: 30px;
    text-align: center;
  }
  .menu ul.lang > li a{
  	color: white;
  }
  .menu ul.lang > li a:hover{
  	text-decoration: none;
  	color:  #00debc;
  }
/*END MENU */

/*HAMBURGER BUTTON */
  #hamburger-icon {
    width: 60px;
    height: 40px;
    position: fixed;
    display: block;
    top: 30px;
    right: 30px;
    z-index: 99999;
    cursor: pointer;
  }

  #hamburger-icon .line {
    display: block;
    background: #ecf0f1;
    width: 60px;
    height: 8px;
    position: absolute;
    left: 0;
    border-radius: 4px;
    transition: all 0.4s;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
  }

  #hamburger-icon .line.line-1 {
    top: 0;
  }

  #hamburger-icon .line.line-2 {
    top: 50%;
  }

  #hamburger-icon .line.line-3 {
    top: 100%;
  }

  #hamburger-icon:hover .line-1, #hamburger-icon:focus .line-1 {
    transform: translateY(-8px);
    -webkit-transform: translateY(-8px);
    -moz-transform: translateY(-8px);
  }

  #hamburger-icon:hover .line-3, #hamburger-icon:focus .line-3 {
    transform: translateY(8px);
    -webkit-transform: translateY(8px);
    -moz-transform: translateY(8px);
  }

  #hamburger-icon.active .line-1 {
    transform: translateY(15px) translateX(0) rotate(45deg);
    -webkit-transform: translateY(15px) translateX(0) rotate(45deg);
    -moz-transform: translateY(15px) translateX(0) rotate(45deg);
  }

  #hamburger-icon.active .line-2 {
    opacity: 0;
  }

  #hamburger-icon.active .line-3 {
    transform: translateY(-25px) translateX(0) rotate(-45deg);
    -webkit-transform: translateY(-25px) translateX(0) rotate(-45deg);
    -moz-transform: translateY(-25px) translateX(0) rotate(-45deg);
  }

  #total-container.blur{
    -webkit-filter: blur(10px); -moz-filter: blur(10px);
    -o-filter: blur(10px); -ms-filter: blur(10px); 
    filter: url(#blur); filter: blur(10px);  filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='3');
    -webkit-transition: 0.3s -webkit-filter linear;
    -moz-transition: 0.3s -moz-filter linear;
    -o-transition: 0.3s -o-filter linear;
    transition: 0.3s filter linear;
    transition: 0.3s -webkit-filter linear;
  }

  .mobile #total-container.blur{
    -webkit-filter: blur(0px); -moz-filter: blur(0px);
    -o-filter: blur(10px); -ms-filter: blur(0px); 
    filter: url(#blur); filter: blur(0px);  filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='0');
    -webkit-transition: 0.3s -webkit-filter linear;
    -moz-transition: 0.3s -moz-filter linear;
    -o-transition: 0.3s -o-filter linear;
    transition: 0.3s filter linear;
    transition: 0.3s -webkit-filter linear;
  }

/*END HAMBURGER */

/*effects on home container*/
	#animated-cursor{
		width: 100%;
	}

	.effects-layer { display:block; overflow: hidden; position:absolute; top:0; right:0; bottom:0; left:0; z-index:10; }

	.rays-container { top:0; left:50%; width:100%; opacity:0.55; display:block;
	  -webkit-transform-origin:25% 0;
	     -moz-transform-origin:25% 0;
	          transform-origin:25% 0;
	}

	.rays { position:absolute; top:0; min-width:1024px; width:100%; height:600px; background:url(../img/assets/rays.png) repeat-x 50% 100%; background-size:1500px 100%; }

	.rays-1 {
	  -webkit-animation:dustSmallAnim 8s linear infinite alternate;
	     -moz-animation:dustSmallAnim 8s linear infinite alternate;
	          animation:dustSmallAnim 8s linear infinite alternate;
	}

	.rays-2 {
	  -webkit-animation:dustMediumAnim 16s linear infinite;
	     -moz-animation:dustMediumAnim 16s linear infinite;
	          animation:dustMediumAnim 16s linear infinite;
	}

	@-webkit-keyframes dustSmallAnim {
	  0%    { opacity:0;   -webkit-transform:translate3d(-2%,0,0)   scale(1.025); }
	  12.5% { opacity:0.4; -webkit-transform:translate3d(-1.5%,0,0) scale(1.025); }
	  25%   { opacity:0.75;   -webkit-transform:translate3d(-1%,0,0)   scale(1.05); }
	  37.5% { opacity:0.4; -webkit-transform:translate3d(-.5%,0,0)  scale(1.075); }
	  50%   { opacity:0.2; -webkit-transform:translate3d(0,0,0)     scale(1.1); }
	  62.5% { opacity:0.4; -webkit-transform:translate3d(.5%,0,0)   scale(1.125); }
	  75%   { opacity:0.75;   -webkit-transform:translate3d(1%,0,0)    scale(1.15); }
	  87.5% { opacity:0.4; -webkit-transform:translate3d(1.5%,0,0)  scale(1.175); }
	  100%  { opacity:0;   -webkit-transform:translate3d(2%,0,0)    scale(1.2); }
	}
	@-moz-keyframes dustSmallAnim {
	  0%    { opacity:0;   -moz-transform:translate3d(-2%,0,0)   scale(1.025); }
	  12.5% { opacity:0.4; -moz-transform:translate3d(-1.5%,0,0) scale(1.025); }
	  25%   { opacity:0.75;   -moz-transform:translate3d(-1%,0,0)   scale(1.05); }
	  37.5% { opacity:0.4; -moz-transform:translate3d(-.5%,0,0)  scale(1.075); }
	  50%   { opacity:0.2; -moz-transform:translate3d(0,0,0)     scale(1.1); }
	  62.5% { opacity:0.4; -moz-transform:translate3d(.5%,0,0)   scale(1.125); }
	  75%   { opacity:0.75;   -moz-transform:translate3d(1%,0,0)    scale(1.15); }
	  87.5% { opacity:0.4; -moz-transform:translate3d(1.5%,0,0)  scale(1.175); }
	  100%  { opacity:0;   -moz-transform:translate3d(2%,0,0)    scale(1.2); }
	}
	@keyframes dustSmallAnim {
	  0%    { opacity:0;   transform:translate3d(-2%,0,0)   scale(1.025); }
	  12.5% { opacity:0.4; transform:translate3d(-1.5%,0,0) scale(1.025); }
	  25%   { opacity:0.75;   transform:translate3d(-1%,0,0)   scale(1.05); }
	  37.5% { opacity:0.4; transform:translate3d(-.5%,0,0)  scale(1.075); }
	  50%   { opacity:0.2; transform:translate3d(0,0,0)     scale(1.1); }
	  62.5% { opacity:0.4; transform:translate3d(.5%,0,0)   scale(1.125); }
	  75%   { opacity:0.75;   transform:translate3d(1%,0,0)    scale(1.15); }
	  87.5% { opacity:0.4; transform:translate3d(1.5%,0,0)  scale(1.175); }
	  100%  { opacity:0;   transform:translate3d(2%,0,0)    scale(1.2); }
	}

	@-webkit-keyframes dustMediumAnim {
	  0%    { opacity:0.4; -webkit-transform:translate3d(1.15%,0,0)  scale(1.15); }
	  12.5% { opacity:0.25; -webkit-transform:translate3d(1.175%,0,0) scale(1.175); }
	  25%   { opacity:0;   -webkit-transform:translate3d(1.2%,0,0)   scale(1.2); }
	  25.1% { opacity:0;   -webkit-transform:translate3d(0,0,0)      scale(1); }
	  37.5% { opacity:0.25; -webkit-transform:translate3d(1.025%,0,0) scale(1.025); }
	  50%   { opacity:0.4; -webkit-transform:translate3d(1.05%,0,0)  scale(1.05); }
	  62.5% { opacity:0.25; -webkit-transform:translate3d(1.075%,0,0) scale(1.075); }
	  75%   { opacity:0;   -webkit-transform:translate3d(1.1%,0,0)   scale(1.1); }
	  87.5% { opacity:0.25; -webkit-transform:translate3d(1.125%,0,0) scale(1.125); }
	  100%  { opacity:0.4; -webkit-transform:translate3d(1.15%,0,0)  scale(1.15); }
	}
	@-moz-keyframes dustMediumAnim {
	  0%    { opacity:0.4; -moz-transform:translate3d(1.15%,0,0)  scale(1.15); }
	  12.5% { opacity:0.25; -moz-transform:translate3d(1.175%,0,0) scale(1.175); }
	  25%   { opacity:0;   -moz-transform:translate3d(1.2%,0,0)   scale(1.2); }
	  25.1% { opacity:0;   -moz-transform:translate3d(0,0,0)      scale(1); }
	  37.5% { opacity:0.25; -moz-transform:translate3d(1.025%,0,0) scale(1.025); }
	  50%   { opacity:0.4; -moz-transform:translate3d(1.05%,0,0)  scale(1.05); }
	  62.5% { opacity:0.25; -moz-transform:translate3d(1.075%,0,0) scale(1.075); }
	  75%   { opacity:0;   -moz-transform:translate3d(1.1%,0,0)   scale(1.1); }
	  87.5% { opacity:0.25; -moz-transform:translate3d(1.125%,0,0) scale(1.125); }
	  100%  { opacity:0.4; -moz-transform:translate3d(1.15%,0,0)  scale(1.15); }
	}
	@keyframes dustMediumAnim {
	  0%    { opacity:0.4; transform:translate3d(1.15%,0,0)  scale(1.15); }
	  12.5% { opacity:0.25; transform:translate3d(1.175%,0,0) scale(1.175); }
	  25%   { opacity:0;   transform:translate3d(1.2%,0,0)   scale(1.2); }
	  25.1% { opacity:0;   transform:translate3d(0,0,0)      scale(1); }
	  37.5% { opacity:0.25; transform:translate3d(1.025%,0,0) scale(1.025); }
	  50%   { opacity:0.4; transform:translate3d(1.05%,0,0)  scale(1.05); }
	  62.5% { opacity:0.25; transform:translate3d(1.075%,0,0) scale(1.075); }
	  75%   { opacity:0;   transform:translate3d(1.1%,0,0)   scale(1.1); }
	  87.5% { opacity:0.25; transform:translate3d(1.125%,0,0) scale(1.125); }
	  100%  { opacity:0.4; transform:translate3d(1.15%,0,0)  scale(1.15); }
	}
/*end effects on home container*/

/*main title*/
	.main-title {
		position: absolute;
		margin: 0;
		padding: 0;
		color: #f9f1e9;
		text-align: center;
		top: 40%;
		left: 50%;
	    display: table;
		text-transform: uppercase;
		overflow: hidden;
		font-weight: bold;
		-webkit-transform: translate3d(-50%,-50%,0);
		transform: translate3d(-50%,-50%,0);
	}

	.main-title h1{
		letter-spacing: 0.1em;
		display: table-cell;
	    float:left;
	    margin:0;
	    color:#FFF;
	   	font-size: 4.2em;
	}

	.main-title ul li{
	    line-height: 64px;
	  	font-size: 4.2em;
		font-weight: 100;
	}

	.main-title ul {
	  	display: table-cell;
	    margin-top:0;
	    padding-left:20px;
	    text-align:left;
	    list-style:none;
	    margin:0;
	    color: #00debc;
	    float:left;
	    height:64px;  
	    animation:6s linear 0s normal none infinite change;
	    -webkit-animation:6s linear 0s normal none infinite change;
	    -moz-animation:6s linear 0s normal none infinite change;
	    -o-animation:6s linear 0s normal none infinite change;
	}

	@-webkit-keyframes change {
	    0%   {margin-top:0;}
	    15%  {margin-top:0;}
	    25%  {margin-top:-64px;}
	    40%  {margin-top:-64px;}
	    50%  {margin-top:-128px;}
	    65%  {margin-top:-128px;}
	    75%  {margin-top:-64px;}
	    85%  {margin-top:-64px;}
	    100% {margin-top:0;}
	}
	  @keyframes change {
	    0%   {margin-top:0;}
	    15%  {margin-top:0;}
	    25%  {margin-top:-64px;}
	    40%  {margin-top:-64px;}
	    50%  {margin-top:-128px;}
	    65%  {margin-top:-128px;}
	    75%  {margin-top:-64px;}
	    85%  {margin-top:-64px;}
	    100% {margin-top:0;}
	}

  	#intro .separator{
  		margin-bottom: 0px
  	}

	#intro-text{
		top: 48%;
		position: absolute;
		width: 100%;
	}

	.main-title-text{
		color: #fff;
		position: relative;
		text-align: center;
		padding: 25px;
		font-size: 18px;
	}
/*End main title*/


/* Animation arrow */
	.pointDown {
		position: absolute;
		top: 85%;
		left: 50%;
		z-index: 2000;
		color: rgba(255,255,255,0.7);
		background-color: rgba(0, 222, 188,0.6);
		width: 70px;
		height: 70px;
		text-align: center;
		line-height: 60px;
		margin: -50px 0 0 -50px;
		border-radius: 100%;
		font-size: 40px;
		cursor: pointer;
		-webkit-animation-name: bounce;
		-moz-animation-name: bounce;
		-o-animation-name: bounce;
		animation-name: bounce;
		-webkit-animation-fill-mode: both;
		-moz-animation-fill-mode: both;
		-ms-animation-fill-mode: both;
		-o-animation-fill-mode: both;
		animation-iteration-count: infinite;
		-moz-animation-iteration-count: infinite;
		-webkit-animation-iteration-count: infinite;
		animation-fill-mode: both;
		-webkit-animation-duration: 2.5s;
		-moz-animation-duration: 2.5s;
		-ms-animation-duration: 2.5s;
		-o-animation-duration: 2.5s;
		animation-duration: 2.5s;
	}

	@-webkit-keyframes bounce {
	    0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);} 40% {-webkit-transform: translateY(8px);}
	    60% {-webkit-transform: translateY(16px);}
	}
	 
	@-moz-keyframes bounce {
	    0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);}
	    40% {-moz-transform: translateY(8x);}
	    60% {-moz-transform: translateY(16px);}
	}
	 
	@-o-keyframes bounce {
	    0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);}
	    40% {-o-transform: translateY(8px);}
	    60% {-o-transform: translateY(16px);}
	}
	@keyframes bounce {
	    0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
	    40% {transform: translateY(8px);}
	    60% {transform: translateY(16px);}
	}

	.pointDown:hover , .pointDown:active{
	  color: white;
	  background-color: rgba(0, 222, 188, 1);
	  text-decoration: none;
	}

	.pointDown:focus {
	  color: white;
	  background-color: rgba(0, 222, 188, 0.6);
	  text-decoration: none;
	}
/* End Animation arrow */

#welcome{
	background-color: rgba(20, 4, 40, 1);
	position: relative;
	overflow: hidden;
	z-index: 2;
}
#welcome .col-xs-12{
	z-index: 2;
	padding: 100px 0px;
}
#welcome h2{
	color: #FFF;
	text-transform: uppercase;
	text-align: center;
	font-size: 45px;
	margin-top: 0;
}
#welcome p{
	text-align: center;
	font-size: 20px;
}
.part-title{
	text-align: center;
	font-size: 50px;
	text-transform: uppercase;
}

.wood-background {
position: absolute;
right: 0px;
top: 0;
z-index: 1;
opacity: 0.6;
width: 100%;
}

#services-choices{
	position: relative;
	background: #00debc;
	color: #CCC;
	z-index: 1;
}
#owl{
    width: calc( 100% - 120px);
	background: #fff;
}
#owl .item{
    color: #000;
    text-align: center;
  	background: #fff;
}
#owl .item a{
	display: block;
    padding: 20px 0px;
    text-transform: uppercase;
	font-weight: 500;
	color: #000;
	cursor: pointer;
}
#owl .item a:hover {
	background-color: #6bf7e1;
	color: #FFF;
	text-decoration: none;
}
#owl .item.active{
	background-color: #00debc;
}
#owl .item.active a{
	color: #FFF;
	box-shadow: -1px 2px 10px 3px rgba(0, 0, 0, 0.3) inset;
}
#owl .item.active a:hover{
	color: #FFF;
	cursor: default;
	background-color: #00debc;
}
.owl-carousel .owl-item .item .services-icn{
	width: 50px;
}
.owl-carousel .owl-item .item .services-icn.active{
	display: none;
}

/* clearfix */
.owl-carousel .owl-wrapper:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
/* display none until init */
.owl-carousel{
	display: none;
	position: relative;
	width: 100%;
	-ms-touch-action: pan-y;
}
.owl-carousel .owl-wrapper{
	display: none;
	position: relative;
	-webkit-transform: translate3d(0px, 0px, 0px);
}
.owl-carousel .owl-wrapper-outer{
	overflow: hidden;
	position: relative;
	width: 100%;
    -moz-box-shadow: 2px 4px 17px 0px #656565;
    -webkit-box-shadow: 2px 4px 17px 0px #656565;
    -o-box-shadow: 2px 4px 17px 0px #656565;
    box-shadow: 2px 4px 17px 0px #656565;
    filter: progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=101, Strength=17);
}
.owl-carousel .owl-wrapper-outer.autoHeight{
	-webkit-transition: height 500ms ease-in-out;
	-moz-transition: height 500ms ease-in-out;
	-ms-transition: height 500ms ease-in-out;
	-o-transition: height 500ms ease-in-out;
	transition: height 500ms ease-in-out;
}
	
.owl-carousel .owl-item{
	float: left;
}

/* mouse grab icon not used*/
.grabbing { 
   cursor: ew-resize !important;
}

/* fix */
.owl-carousel  .owl-wrapper,
.owl-carousel  .owl-item{
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility:    hidden;
	-ms-backface-visibility:     hidden;
  -webkit-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
}

/* Styling Pagination*/

.owl-controls .owl-page,
.owl-controls .owl-buttons div{
	cursor: pointer;
}
.owl-buttons{
	display: none;
}
.owl-pagination{
	text-align: center;
	position: absolute;
	margin-top: -27px;
	width: 100%;
}
.owl-controls {
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.owl-theme .owl-controls .owl-page{
	display: inline-block;
	zoom: 1;
	*display: inline;/*IE7 life-saver */
}
.owl-theme .owl-controls .owl-page span{
	display: block;
	width: 12px;
	height: 12px;
	margin: 5px 7px;
	filter: Alpha(Opacity=50);/*IE7 fix*/
	opacity: 0.5;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	background: #869791;
}

.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span{
	filter: Alpha(Opacity=100);/*IE7 fix*/
	opacity: 1;
}
#services-header{
	position: relative;
	overflow: hidden;
}
#services-header > div{
	position: absolute;
	background-color: #FFF;
	width: 100%;
	height: 100%;
}
#services-header > div:last-child {
	position: relative;
}
#services-header .container{
	padding: 250px 0;
}
#services-header .container .bg-dark{
	background-color: rgba(0, 0, 0, 0.85);
	z-index: 2;
}
#services-header .container .bg-dark p{
	padding-bottom: 20px;
}
#services-header h2{
	z-index: 2;
	position: relative;
	text-align: center;
	font-size: 35px;
	color: #fff;
	margin-bottom: 30px;
	text-transform: uppercase;
}
#services-header p{
	position: relative;
	z-index: 2;
	text-align: center;
	color: #FFF;
	font-size: 20px;
}
.service-background{
	position: absolute;
	right: 0px;
	top: 0;
	z-index: 1;
	width: 100%;
}


#photographers, #shops, #bloggers, #artists, #restaurants, #musicians, #weddings{
	opacity: 0;
}

#services-header .info{
  z-index: 2;
  margin-top: -30px;
  float: right;
  margin-right: 10px;
  position: relative;
  border-radius: 100%;
  font-size: 15px;
  text-align: center;
  font-weight: 100;
}
#services-header .info a {
	display: block;
	color: white;
	font-size: 16px;
}

#services-details{
	position: relative;
	background-color: #FFF;
	color: #000;
	padding-top: 40px;
	padding-bottom: 20px;
}

#services-details .icon{
	width: 70px;
	height: 70px;
}
#services-details .icon img{
	width: 100%;
}
#services-details h3{
	margin-top: 10px;
}

#services-details p .imp{
	font-size: 12px;
    color: grey;
    margin-top: 20px;
    display: inline-block;
;
}

#services-details .col-sm-6{
	margin-bottom: 30px;
}

#text-separator-timers {
	background-color: rgba(20, 4, 40, 1);
	padding-top: 20px;
	padding-bottom: 20px;
	overflow: hidden;
	position: relative;
}
#text-separator-timers .container > div{
	text-align: center;
	padding-bottom: 60px;
}
#text-separator-timers .container > div p{
	font-size: 20px;
}
.timerWrapper{
    color:white;
    padding:20px;
}
.timerWrapper img{
	max-width: 60px;
}

.timerWrapper h1{
    letter-spacing:0;
}

.timerWrapper p{
    color: #FFF;
    font-size: 20px;
}

#clients{
	position: relative;
	background: #eee;
	overflow: hidden;
	box-shadow: -1px 2px 10px 3px rgba(0, 0, 0, 0.3) inset;
	padding-top: 20px;
	padding-bottom: 20px;
}
#clients h2 {
	color: #140428;
}
#clients .separator  {
	background-color: #140428;
}
#clients .logo{
	text-align: center;
	float:none;
    display:inline-block;
    vertical-align:middle;
    margin-right:-4px;
}

#clients .logo img{
	max-width: 250px;
	max-height: 100px
}
#clients .logo img:hover{
	opacity: 0.6;
	transition: all .3s ease;
}
#clients .logo{
	margin-bottom: 60px;
}
#clients .more-clients{
	display: none;
}

#prices{
	position: relative;
	background: #eee;
	overflow: hidden;
	box-shadow: -1px 2px 10px 3px rgba(0, 0, 0, 0.3) inset;
	padding-top: 20px;
	padding-bottom: 20px;
}
#prices h2 {
	color: #140428;
}
#prices .separator  {
	background-color: #140428;
}

#prices .price-box{
	padding: 15px;
}

#prices .price-box-content{
	border: solid 5px #140428;
	background-color: #eee;
	max-width: 300px;
    margin: 0 auto;
}

#prices .price-box-content h3{
    padding-top: 20px;
}
#prices .price-box-content .not-included{
    color: grey;
    font-size: 12px;
    position: absolute;
    bottom: -10px;
}

#prices .price-box-content ul.freelance >li{

}
#prices .price-box-content ul.freelance >ul{
	margin-bottom: 5px;
}

#prices .price-box-content ul ul li{
    display: inline-block;
    background-image: url('../img/prices/star.png');
    background-size: contain;
    background-repeat: no-repeat;
    width: 20px;
    height: 20px;
}
#prices .price-box-content ul ul li.active{
	background-image: url('../img/prices/star_active.png');

}
#prices .price-box-content h4.prices-option{
	text-align: center;
	color: #140428;
}

.ribbon {
  z-index: 1;
  overflow: hidden;
  position: absolute;
}
.ribbon:before, .ribbon:after {
  content: "";
  display: block;
  z-index: -1;
  position: absolute;
}
.ribbon span {
    display: block;
    text-align: center;
    line-height: 42px;
    font-size: 12px;
    position: absolute;
}

.ribbon__left-top {
	width: 135px;
    height: 120px;
    margin-left: -15px;
    margin-top: -15px;
}

.ribbon__left-top:before {
  right: 15px;
  top: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid #148f77;
  border-top: 5px solid transparent;
  border-bottom: 5px solid #148f77;
}
.ribbon__left-top:after {
  left: 0;
  bottom: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid #148f77;
  border-top: 5px solid transparent;
  border-bottom: 5px solid #148f77;
}

.ribbon__left-top span {
  text-indent: 10px;
  width: 225px;
  color: white;
  right: -15%;
  top: 22%;
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
  background-color: #00debc;
  box-shadow: 0 0 7px rgba(35, 46, 57, 0.8);
}

#prices .price-box-content h3{
	text-align: center;
	color: #140428;
}

#prices .price-box-content ul{
	padding: 0;
	text-align: center;
	color: #140428;
	list-style-type: none;
}
.ribbon-st {
	width: calc(100% + 10px);
	margin: 0 auto;
	background: #eee;
}

.ribbon-st h4 {
  clear: both;
  text-align: center;
  position: relative;
  color: #fff;
  background: #00debc;
  font-size: 18px;
  margin: 0 -5px 20px -15px;
  padding: 0.5em 20px;
  box-shadow: 0 2px 0 rgba(0, 0, 0, 0.1);
}

.ribbon-st h4:before,
.ribbon-st h4:after {
  content: " ";
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  bottom: -10px;
  left: 0;
  z-index: 1;
  border-top: 10px solid #057f6c;
  background: transparent;
}

.ribbon-st h4:after {
  right: 0;
  left: auto;
  border-top: 10px solid #057f6c;
  border-right: 10px solid transparent;
}

.ribbon-st h4:before {
  border-left: 10px solid transparent;
}



#portfolio {
	position: relative;
	background: #FFF;
	padding-top: 20px;
	padding-bottom: 20px;
}
#portfolio h2{
	color: #140428;
}
#portfolio p {
	text-align: center;
	font-size: 24px;
	color: #140428;

}
#portfolio .separator{
	background-color: #140428;
}

#aboutme{
	position: relative;
	background: #FFF;
	color: #140428;
	padding: 20px 0 40px;

}
#aboutme .separator{
	background-color: #140428;
}
#aboutme p{
	text-indent: 20px;
	margin-bottom: 30px;
	color: #140428;
	line-height: 1.6em;
	font-size: 20px;
	font-weight: 100;
}
#aboutme p:last-child{
	margin-bottom: 50px;	
}



.timeline {
	margin-bottom: 0;
	padding-left: 0;
	list-style-type: none;
	display: flex;
	align-items: center;
	justify-content: center;
}

.li {
  transition: all 200ms ease-in;
}

.timestamp {
  margin-bottom: 20px;
  padding: 0px 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-weight: 100;
}

.status {
  padding: 0px 40px;
  display: flex;
  justify-content: center;
  border-top: 2px solid #D6DCE0;
  position: relative;
  transition: all 200ms ease-in;
}
.status h4 {
  font-weight: 600;
}
.status:before {
  content: "";
  width: 25px;
  height: 25px;
  background-color: white;
  border-radius: 25px;
  border: 1px solid #ddd;
  position: absolute;
  top: -15px;
  left: 42%;
  transition: all 200ms ease-in;
}

.li.complete .status {
  border-top: 2px solid #00debc;
}
.li.complete .status:before {
  background-color: white;
  border: solid 2px #00debc;
  transition: all 200ms ease-in;
}
.li.complete .status h4 {
  color: #00debc;
  font-size: 16px;
}

@media (min-device-width: 320px) and (max-device-width: 700px) {
  .timeline {
    list-style-type: none;
    display: block;
  }

  .li {
    transition: all 200ms ease-in;
    display: flex;
    width: inherit;
  }

  .timestamp {
    width: 100px;
  }

  .status:before {
    left: -8%;
    top: 30%;
    transition: all 200ms ease-in;
  }
}


#cities{
	position: relative;
	background: white;
	z-index: 2;
}
.ch-item {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  position: relative;
  cursor: default;
  box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}

.ch-thumb {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  overflow: hidden;
  position: absolute;
  box-shadow: inset 0 0 0 15px rgba(255,255,255, 0.5);
  
  -webkit-transform-origin: 95% 40%;
  -moz-transform-origin: 95% 40%;
  -o-transform-origin: 95% 40%;
  -ms-transform-origin: 95% 40%;
  transform-origin: 95% 40%;
  
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.ch-thumb:after {
  content: '';
  width: 8px;
  height: 8px;
  position: absolute;
  border-radius: 50%;
  top: 40%;
  left: 95%;
  margin: -4px 0 0 -4px;
  background: rgb(14,14,14);
  background: -moz-radial-gradient(center, ellipse cover, rgba(14,14,14,1) 0%, rgba(125,126,125,1) 100%);
  background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(14,14,14,1)), color-stop(100%,rgba(125,126,125,1)));
  background: -webkit-radial-gradient(center, ellipse cover, rgba(14,14,14,1) 0%,rgba(125,126,125,1) 100%);
  background: -o-radial-gradient(center, ellipse cover, rgba(14,14,14,1) 0%,rgba(125,126,125,1) 100%);
  background: -ms-radial-gradient(center, ellipse cover, rgba(14,14,14,1) 0%,rgba(125,126,125,1) 100%);
  background: radial-gradient(ellipse at center, rgba(14,14,14,1) 0%,rgba(125,126,125,1) 100%);
  box-shadow: 0 0 1px rgba(255,255,255,0.9);
}
.ch-img-1 { 
  z-index: 12;
}
.ch-img-2 { 
  z-index: 11;
}
.ch-img-3 { 
  z-index: 10;
}
.ch-info {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  overflow: hidden;
  box-shadow: inset 0 0 0 5px rgba(0,0,0,0.05);
  background-color: #00debc;
}
.ch-thumb{
  background-position: 50% 50%;  
}
.ch-thumb.lh {
  background-image: url('../img/cities/lh.jpg');
}
.ch-thumb.caen {
  background-image: url('../img/cities/caen.jpg');
}
.ch-thumb.mtl0 {
  background-image: url('../img/cities/mtl0.jpg');
}
.ch-thumb.tianjin {
  background-image: url('../img/cities/tianjin.jpg');
}
.ch-thumb.mtl1{
  background-image: url('../img/cities/mtl1.jpg');
}
.ch-thumb.paris{
  background-image: url('../img/cities/paris.jpg');
}
.ch-info h3 {
  color: #fff;
  text-transform: uppercase;
  position: relative;
  letter-spacing: 2px;
  font-size: 18px;
  margin: 0 60px;
  padding: 40px 0 0 0;
  height: 85px;
  text-shadow: 
    0 0 1px #fff, 
    0 1px 2px rgba(0,0,0,0.3);
}

.ch-info p {
  color: #fff;
  padding: 10px 5px;
  font-style: italic;
  margin: 0 30px;
  font-size: 22px;
  border-top: 1px solid rgba(255,255,255,0.5);
}


.ch-info p a {
  display: block;
  background: rgba(51, 51, 51, 0.76);
  color: #333;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  color: #fff;
  font-style: normal;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 9px;
  letter-spacing: 1px;
  padding-top: 24px;
  margin: 7px auto 0;
  font-family: 'Open Sans', Arial, sans-serif;
  opacity: 0;
  
  -webkit-transition: 
    -webkit-transform 0.3s ease-in-out 0.2s,
    opacity 0.3s ease-in-out 0.2s,
    background 0.2s linear 0s;
  -moz-transition: 
    -moz-transform 0.3s ease-in-out 0.2s,
    opacity 0.3s ease-in-out 0.2s,
    background 0.2s linear 0s;
  -o-transition: 
    -o-transform 0.3s ease-in-out 0.2s,
    opacity 0.3s ease-in-out 0.2s,
    background 0.2s linear 0s;
  -ms-transition: 
    -ms-transform 0.3s ease-in-out 0.2s,
    opacity 0.3s ease-in-out 0.2s,
    background 0.2s linear 0s;
  transition: 
    transform 0.3s ease-in-out 0.2s,
    opacity 0.3s ease-in-out 0.2s,
    background 0.2s linear 0s;
    
  -webkit-transform: translateX(60px) rotate(90deg);
  -moz-transform: translateX(60px) rotate(90deg);
  -o-transform: translateX(60px) rotate(90deg);
  -ms-transform: translateX(60px) rotate(90deg);
  transform: translateX(60px) rotate(90deg);
    
  -webkit-backface-visibility: hidden;
}

.ch-info p a:hover {
  background: rgba(255,255,255,0.5);
}
.ch-item:hover .ch-thumb {
  box-shadow: inset 0 0 0 15px rgba(255,255,255, 0.5), 0 1px 3px rgba(0,0,0,0.2);
  -webkit-transform: rotate(-110deg);
  -moz-transform: rotate(-110deg);
  -o-transform: rotate(-110deg);
  -ms-transform: rotate(-110deg);
  transform: rotate(-110deg);
}


.ch-item:hover .ch-info p a{
  opacity: 1;
  -webkit-transform: translateX(0px) rotate(0deg);
  -moz-transform: translateX(0px) rotate(0deg);
  -o-transform: translateX(0px) rotate(0deg);
  -ms-transform: translateX(0px) rotate(0deg);
  transform: translateX(0px) rotate(0deg);
}
.ch-grid {
  margin: 0 0 0 0;
  padding: 0;
  list-style: none;
  display: block;
  text-align: center;
  width: 100%;
}

.ch-grid:after,
.ch-item:before {
  content: '';
    display: table;
}

.ch-grid:after {
  clear: both;
}

.ch-grid li {
  width: 220px;
  height: 220px;
  display: inline-block;
  margin: 20px;
}

#contact {
	overflow: hidden;
	padding-top: 20px;
	padding-bottom: 20px;
	position: relative;
	min-height: 100vh;
	overflow: hidden;
}
.bg-contact{
	background-color: rgba(20, 4, 40, 0.8);
	position: absolute;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 0;
}

.mobile #contact{
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	background-image: url('../img/assets/hello.jpg');
}
#contact .container{
  margin-bottom: 440px;
}
#contact h3{
	margin-bottom: 90px;
	text-align: center;

}
.contact-info {
	margin-bottom: 50px;
}
.contact-info .header{ 
	text-transform: uppercase;
	color: #00debc;
	letter-spacing: 3px;
	margin-bottom: 20px;
}
#contact .contact-info-intro{
	border-bottom: solid 1px;
	padding-top: 20px;
	padding-bottom: 40px;
	margin-bottom: 40px;
}
.contact-info .method {
    display: table;
    width: 210px;
	margin-bottom: 2em;
}
.contact-info .method:last-child{
	width: 170px;
}
.contact-info .label {
    display: table-cell;
    vertical-align: middle;
	background-color: #00debc;
	font-weight: 700;
	float: left;
	margin-right: 10px;
	padding: 15px;
	line-height: 20px;
	border-radius: 100%;
	width: 50px;
	height: 50px;
}
.contact-info .details {
    display: table-cell;
    vertical-align: middle;
	margin-left: 40px;
	font-size: 14px;
	line-height: 20px;
}
.contact-info .details a{
	color: white;
}
#contact ul {
	padding-left: 0px;
	list-style-type: none;
}
#contact .form{
	position: relative;z-index: 3;
}
#contact input, textarea{
	position: relative;
	background: none;
	padding: 10px;
	width: 100%;
	border: solid 1px #FFF;
	margin-bottom: 20px;
	max-width: 100%;
	z-index: 3;
	border-radius: 0;
}
#contact input:focus, textarea:focus{
	border:  solid 1px #00debc;
	outline: none;
}
#contact label{
	margin-bottom: 10px;
}
#contact .btn{
	width: 49%;
}
#error{
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(255, 0, 0, 0.76);
  width: 100%;
  z-index: 999999;
  height: 100%;
  text-align: center;
  display: table;
  cursor: pointer;
}
#error p {
  display: table-cell;
  vertical-align: middle;
  font-size: 60px;
}
#success{
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(0, 222, 188,0.76);
  width: 100%;
  z-index: 999999;
  height: 100%;
  text-align: center;
  display: table;
  cursor: pointer;
}
#success p {
  display: table-cell;
  vertical-align: middle;
  font-size: 60px;
}

#contact-button{
	position: relative;
	background: #fff;
	padding: 20px;
	z-index: 1;
}

#contact-button .container div{
	text-align: center;
	margin-bottom: 20px;
}

footer{
	position: absolute;
	background-color: rgba(20, 4, 40, 1);
	padding: 40px;
	text-align: center;
	bottom: 0;
	width: 100%;
	z-index: 9;
}

footer p{
	z-index: 2;
	margin-bottom: 0;
	width: 100%;
}
footer p:last-child{
		font-size: 10px;
		line-height: 20px;
		margin-top: 20px;
}
footer p span{
	font-weight: lighter;
}

footer img.logo{
    width: 110px;
    margin: 0;
    margin-bottom: 20px;
    opacity: 1;
}

footer img{
	width: 40px;
	margin: 40px 10px 40px 10px
}
footer img:not(.logo):hover{
	opacity: 0.6;
}

@media only screen and (max-width : 320px) {
	#services-header .container{
		padding: 80px 0;
	}
}

@media only screen and (max-width : 390px) {
	.main-title-text{
		font-size: 14px;
	}
}
@media only screen and (max-width : 397px) {
	#contact .container{
		margin-bottom: 530px;
	}
	footer img{
		width: 30px;
	}
}

@media only screen and (max-width : 480px) {
	.main-title h1{
		font-size: 2.2em;
	}
	.main-title ul{
		height: 34px;
	    animation:6s linear 0s normal none infinite smallchange;
	    -webkit-animation:6s linear 0s normal none infinite smallchange;
	    -moz-animation:6s linear 0s normal none infinite smallchange;
	    -o-animation:6s linear 0s normal none infinite smallchange;
	}
	.main-title ul li{
		font-size: 2.2em;
		line-height: 34px;
	}
	@-webkit-keyframes smallchange {
	    0%   {margin-top:0;}
	    15%  {margin-top:0;}
	    25%  {margin-top:-34px;}
	    40%  {margin-top:-34px;}
	    50%  {margin-top:-68px;}
	    65%  {margin-top:-68px;}
	    75%  {margin-top:-34px;}
	    85%  {margin-top:-34px;}
	    100% {margin-top:0;}
	}
	@keyframes smallchange {
	    0%   {margin-top:0;}
	    15%  {margin-top:0;}
	    25%  {margin-top:-34px;}
	    40%  {margin-top:-34px;}
	    50%  {margin-top:-68px;}
	    65%  {margin-top:-68px;}
	    75%  {margin-top:-34px;}
	    85%  {margin-top:-34px;}
	    100% {margin-top:0;}
	}

	#ballWrapper{
		top: 0%
	}
	#hamburger-icon {
		height: 30px;
		top: 20px;
		right: 0px;
	}
	#hamburger-icon .line {
		width: 40px;
		height: 4px;
	}
	#hamburger-icon.active .line-3 {
		transform: translateY(-15px) translateX(0) rotate(-45deg);
		-webkit-transform: translateY(-15px) translateX(0) rotate(-45deg);
	}
	.menu .container .categories li {
		font-size: 25px;
		width: 230px;
		margin: 0 auto;
	}
	.pointDown {
		width: 60px;
		height: 60px;
		line-height: 55px;
		margin: -50px 0 0 -30px;
		font-size: 30px;
	}
	#owl{
 	   width: calc( 100% - 80px);
	   background: #fff;
	}
	.owl-carousel .owl-item .item .services-icn{
		width: 40px;
	}
	#owl .item a{
		font-size: 12px;
	    padding: 10px 0px;
	}
	#services-header h2{
		font-size: 26px;
	}
	#services-header p{
		font-size: 16px;
	}
}

@media only screen and (max-width : 640px) {
	#animated-cursor{
		display: none;
	}
	.part-title{
	    font-size: 30px;
	}

	#text-separator-timers .container > div p{
		font-size: 16px;
	}
	.timerWrapper p{
		font-size: 16px;	
	}
	.timerWrapper h1 span{
		font-size: 26px;	
	}

	#aboutme p{
		font-size: 16px;
	}
	footer img{
		margin: 40px 0px 40px 10px;
	}
}

@media only screen and (max-width : 768px) {
	#welcome .col-xs-12{
		padding: 100px 20px;
	}

	.wood-background{
		width: auto !important;
	}
	.mobile .bg-services-mobile img{
		display: none;
	}
/*	.desktop  double background bug*/ .service-background{
		display: none !important;
	}
	.bg-services-mobile{
		position: absolute;
		background-size: cover;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		background-position: 50% 50%;
	}
	#bg-overview-mobile{
		background-image: url('../img/backgrounds/bg-overview.jpg');
	}
	#bg-shops-mobile{
		background-image: url('../img/backgrounds/bg-shops.jpg');
	}
	#bg-photographers-mobile{
		background-image: url('../img/backgrounds/bg-photographers.jpg');
	}
	#bg-bloggers-mobile{
		background-image: url('../img/backgrounds/bg-bloggers.jpg');
	}
	#bg-artists-mobile{
		background-image: url('../img/backgrounds/bg-artists.jpg');
	}
	#bg-restaurants-mobile{
		background-image: url('../img/backgrounds/bg-restaurants.jpg');
	}
	#bg-musicians-mobile{
		background-image: url('../img/backgrounds/bg-musicians.jpg');
	}
	#bg-weddings-mobile{
		background-image: url('../img/backgrounds/bg-weddings.jpg');
	}
	#services-details .col-sm-4{
		text-align: center;
	}
	#services-details .icon{
		margin: 0 auto;
	}
	#clients .logo{
		display: block;
		margin-bottom: 50px;
		margin-right: auto;
		margin-left: auto;
	}
	#aboutme p{
		font-size: 18px;
	}
}

@media only screen and (max-width : 1000px) {
	#owl .item a {
		padding-bottom: 30px;
	}
}

@media only screen and (max-width : 1200px) {
	#owl .item a {
		cursor: -webkit-grab; 
		cursor: -moz-grab;
	}
	#owl .item.active a:hover{
		cursor: -webkit-grab; 
		cursor: -moz-grab;	
	}
}

@media only screen and (min-width: 321px) and (max-width : 1400px) {
	#services-header .container{
		padding: 140px 0;
	}
}
@media only screen and (min-width: 1400px) and (max-width: 1600px) {
     #services-header .container{
		padding: 180px 0;
	}
}

.example figure figcaption::before,
.example figure  figcaption::after {
  position: absolute;
  top: 30px;
  right: 30px;
  bottom: 30px;
  left: 30px;
  content: '';
  opacity: 0;
  -webkit-transition: opacity 0.6s, -webkit-transform 0.6s;
  transition: opacity 0.6s, transform 0.6s;
}
.example figure figcaption::before {
  border-top: 1px solid #00debc;
  border-bottom: 1px solid #00debc;
  -webkit-transform: scale(0,1);
  transform: scale(0,1);
}

.example figure figcaption::after {
  border-right: 1px solid #00debc;
  border-left: 1px solid #00debc;
  -webkit-transform: scale(1,0);
  transform: scale(1,0);
}

.example figure:hover figcaption::before,
.example figure:hover figcaption::after {
  opacity: 1;
  z-index: 3;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.example figure {
	float: left;
	display: block;
	background: #000;
	width: 20%;
	height: 159px;
	margin: 0 2px 4px;
	overflow: hidden;
}
.example figure figcaption {
	display: table;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.35);
	-webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;
}
.example figure figcaption .bg-video{
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.65);
	top: 0;
	left:0;
	z-index: 2
}
.example figure figcaption video{
	position: absolute;
	top: 0;
	left:0;
	z-index: 1
}
.example figure figcaption:hover{
	background-color: rgba(0, 0, 0, 0.65);
	padding: 50px;
}
.example figure figcaption .project-title{
	z-index: 3;
	position:relative;
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	font-size: 30px;
	line-height: 40px;
	text-transform: uppercase;
	-webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;
}
.example figure figcaption p{
	text-align: center;
	top: 50%;
	position: absolute;
	width: 100%;
	left: 0;
	opacity: 0;
	font-size: 16px;
	line-height: 20px;
	-webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;
}
.example figure figcaption:hover .project-title{ 
	font-size: 35px;
}
.example figure figcaption:hover .project-button{ 
	opacity: 1;
	bottom: 50px;
}
.example figure figcaption:hover  p{ 
/*	opacity: 1;
*/}
.example figure.item-w1 figcaption:hover .project-title{ 
	font-size: 25px;
	line-height: 25px;
}

.example figure.item-w1 figcaption .project-title {
	font-size: 20px;
	line-height: 20px;
}
.example figure.item-w2.item-h1 figcaption .project-title {
	font-size: 35px;
	line-height: 25px;
}

.project-button{
	position: absolute;
	bottom: -42px;
	width: 100%;
	text-align: center;
	left: 0;
	z-index: 4;
	opacity: 0;
	-webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
}
.example .item-w2 {
	width: 40%;
}
.example .item-h2 {
	height: 322px;
}
.example .item-h3 {
	height: 485px;
}
.example .over-graph{    
	background-image: url('../img/portfolio/overgraph.jpg');
    background-size: 350%;
    background-position: 50% 0%;
}
.example .community{
	background-image: url('../img/portfolio/community.jpg');
	background-size:cover;
}
.example .cafe-lomi{
	background-image: url('../img/portfolio/cafe-lomi.jpg');
	background-size:cover;
}
.example .investor-group{
	background-image: url('../img/portfolio/ivgroup.jpg');
	background-size:cover;
	background-position: 50% 100%;
}
.example .newrestaurants{
	background-image: url('../img/portfolio/newrestaurants.jpg');
	background-size:cover;
	background-position: 50% 100%;
}
.example .chefseries{
	background-image: url('../img/portfolio/chefseries.jpg');
	background-size:cover;
	background-position: 50% 50%;
}
.example .maison{
	background-image: url('../img/portfolio/maison.jpg');
	background-size:cover;
}
.example .claudemauffette{
	background-image: url('../img/portfolio/claude.jpg');
	background-size:cover;
}
.example .spafax{
	background-image: url('../img/portfolio/spafax.jpg');
	background-size:cover;
}
.example .gofar{
	background-image: url('../img/portfolio/gofar.jpg');
	background-size:cover;
}
.example .filmfest14{
	background-image: url('../img/portfolio/filmfest14.jpg');
	background-size:cover;
	background-position: 50% 50%;
}
.example .filmfest12{
	background-image: url('../img/portfolio/filmfest12.jpg');
	background-size:cover;
	background-position: 50% 50%;
}
.isotope .isotope-item {
	-webkit-transition-duration: 0.8s;
	-moz-transition-duration: 0.8s;
	transition-duration: 0.8s;
	-webkit-transition-property: -webkit-transform, opacity;
	-moz-transition-property: -moz-transform, opacity;
	transition-property: transform, opacity;
}