/*
Theme Name: paperplane
Author: PaperPlane.co
Author URI: https://paperplane.co/
Version: 1.0
*/


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

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
    font-family: 'hn-Light';
	line-height: 1;
}

body, html {
	overflow: hidden;
	font-size: 18px;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* general */


html, body {
	line-height: 1.6;
	font-family:Arial, sans-serif;
	/*letter-spacing:1px;*/
	font-family: hn-Light;
	font-weight:normal;
	font-style: normal;
	overflow-x: hidden;
	background:#FFF;
	-webkit-transition: background 0.3s ease-in-out;
	-o-transition: background 0.3s ease-in-out;
	-moz-transition: background 0.3s ease-in-out;
	transition: background 0.3s ease-in-out;
}

a {
	text-decoration:none;
	cursor:pointer;
}


#singleContent {
	
    overflow: scroll;
	-webkit-overflow-scrolling:touch;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0;
    padding-left: 60px;
    box-sizing: border-box;
}

#projectContentSingle{
    position: relative;
    width: 100%;
    float: left;
    z-index: 1000;
}

#projectMainBanner.singleMainBanner{
	position: relative;
}

.bgBlack{
	background:#000;
}

.block{
	background:#FFF;
	position:absolute;
	top:0;
	left:0;
    display: none;
    z-index: 10;
	
	
	
   -webkit-transform: translateZ(0);
   -moz-transform: translateZ(0);
   -ms-transform: translateZ(0);
   -o-transform: translateZ(0);
   transform: translateZ(0);
   
   
   -webkit-backface-visibility: hidden;
   -moz-backface-visibility: hidden;
   -ms-backface-visibility: hidden;
   backface-visibility: hidden;

   -webkit-perspective: 1000;
   -moz-perspective: 1000;
   -ms-perspective: 1000;
   perspective: 1000;
   
   
	
}
.block.active {
    z-index: 100;
}
.active .blockInner {
	display:block !important;
}
.blockInner {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
#section-4 {
}

.fullContainer {
	margin:0;
	width:100%;
	margin-left: 60px;
	box-sizing: border-box;
}
#wrapper {
	padding: 0;
	box-sizing: border-box;
    width: 100%;
    z-index: 9000;
    position: relative;
	float: left;
}
.outer {
    display: table;
    position: absolute;
    height: 100%;
    top: 0;
    left: 0;
    width: 100%;
}
.middle {
	display: table-cell;
    vertical-align: middle;
}
.inner {
	margin:0 auto;
	width: 100%;
    position: relative;
}

/* text */

.title {
    font-family: 'Gibson';
	text-transform: uppercase;
	font-size: 42px;
}
.subtitle {
    font-family: 'hn-Light';
	text-transform: uppercase;
	font-size: 21px;
}
.snack {
    font-family: 'hn-Light';
	text-transform: uppercase;
	font-size: 14px;
}
.text {
    font-family: 'hn-Light';
	font-size: 16px;
}
.bold {
    font-family: 'hn-Light';
}

/* bg - color */

.bgOrange {
	background-color: #000000;
}
.bgGray {
	background-color: #ebebeb;
}
.orange {
	color: #000000;
}
.white {
	color: #fff;
}

/* buttons */

.instagram {
	background-image: url(images/instagram-icon.png);
}
.facebook {
	background-image: url(images/facebook-icon.png);
}

.linkedin{
}

/* decorations */

.deco {
    margin: 10px 0 0 10px;
    width: 30px;
    height: 3px;
    background-color: #000000;
    float: right;
}

/* header */

#mainMenu {
    position: relative;
    top: 0;
    left: 0;
    z-index: 1000;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
#logo {
    width: 170px;
    position: relative;
    margin-left: 20px;
    margin-top: 10px;
    float: left;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
#logo img {
    width: 100%;
}

.navCont {
    position: absolute;
    width: 30px;
    height: 100%;
    background-color: #fff;
    top: 0;
    right: 0;
    z-index: 100000;
}
#menu {
    position: absolute;
    left: 0;
    z-index: 1000;
	display: none;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
#menu .outer {
	width: 100%;
}
#menu ul {
	text-align: center;
}
#menu ul li {
	position:relative;
	left:-25%;
	opacity:0;
    margin-bottom: 0px;
    width: 70%;
    margin-left: 20%;
    float: left;
    text-align: left;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    transition-delay: 0s;
}

#menuContainer.active #menu ul li {
	left:0%;
	opacity:1;
}

#menuContainer.active #menuItem-0{
    -webkit-transition-delay: 0.08s;
    -o-transition-delay: 0.08s;
    -moz-transition-delay: 0.08s;
    transition-delay: 0.08s;
}
	
	
	
#menuContainer.active #menuItem-1{
    -webkit-transition-delay: 0.16s;
    -o-transition-delay: 0.16s;
    -moz-transition-delay: 0.16s;
    transition-delay: 0.16s;
}
	
	
#menuContainer.active #menuItem-2{
    -webkit-transition-delay: 0.24s;
    -o-transition-delay: 0.24s;
    -moz-transition-delay: 0.24s;
    transition-delay: 0.24s;
}
	
#menuContainer.active #menuItem-3{
	-webkit-transition-delay: 0.32s;
    -o-transition-delay: 0.32s;
    -moz-transition-delay: 0.32s;
    transition-delay: 0.32s;
}
#menuContainer.active #menuItem-4{
	-webkit-transition-delay: 0.40s;
    -o-transition-delay: 0.40s;
    -moz-transition-delay: 0.40s;
    transition-delay: 0.40s;
}
	
#menu ul li a {
	position:relative;
    font-family: 'Gibson';
	font-size: 21px;
     text-transform: uppercase;
    letter-spacing: 1px;
	
		-webkit-transition: all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
		-moz-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
}

#menu ul li a:hover {
}
#socialCont {
    float: left;
    text-align: center;
    width: 100%;
}
img.menuFold {
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 100%;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.active img.menuFold {
    width: 128px;
    right: -127px;
}
/*----- HOME -----*/

/* Slider Home */
#dotContainer {
    position: absolute;
    top: 50%;
    right: 0px;
    z-index: 10000;
}
.dot {
      width: 45px;
    height: 40px;
    float: left;
    clear: both;
	cursor:pointer;
    position: relative;
    z-index: 10;
}
.dot.active .dotInner{
	background:#FFF;
}

#dotInfo.active {
    padding: 0px 34px 0 24px;
}

#dotInfo {
    position: absolute;
    z-index: 5;
    top: 0;
    right: 17px;
    background: #000;
    border-radius: 15px;
    margin-top: 5px;
    color: #FFF;
    padding: 0px;
    overflow: hidden;
	-webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

#dotInfoContent {
    float: right;
    white-space: nowrap;
    line-height: 30px;
    padding-top: 2px;
    font-size: 12px;
    height: 30px;
    text-transform: uppercase;
    font-family: 'Gibson';
}


/* -- */
.dot.active .dotInner{
    background: #000;
}
.dot.active:hover .dotInner {
    background: #FFF;
}
.dotInner{
    width: 10px;
    height: 10px;
    border: 1px solid #000;
    margin: 15px 10px;
    border-radius: 50%;
    box-sizing: border-box;
    float: left;
    clear: both;
	position:relative;
	-webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
	cursor:pointer;
}

.dotInner:before{
    content: "";
    box-sizing: border-box;
    border-radius: 50%;
    border: 2px solid #ccc;
    opacity: 0;
    position: absolute;
    top: -8px;
    left: -8px;
    width: 24px;
    height: 24px;
    background: transparent;
    -webkit-transition: all 0.45s ease-in-out;
    -o-transition: all 0.45s ease-in-out;
    -moz-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out;
}
.dot:hover .dotInner:before{
    opacity: 1;
    top: 0px;
    left: 0px;
    width: 8px;
    height: 8px;
    border: 2px solid #fff;
    background: transparent;
    background: #FFF;
}
.active.dot:hover .dotInner:before{
    border: 2px solid #FFF;
    opacity: 0;
    top: -8px;
    left: -8px;
    width: 22px;
    height: 22px;
	
}

/* -- */

/*
.dotInner{
    width: 10px;
    height: 10px;
    border: 2px solid #FFF;
    margin: 15px 10px;
    border-radius: 50%;
    box-sizing: border-box;
    float: left;
    clear: both;
	position:relative;
	-webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
	cursor:pointer;
}

.dotInner:before{
      content: "";
    box-sizing: border-box;
    border-radius: 50%;
    border: 2px solid #FFF;
    opacity: 0;
    position: absolute;
    top: -8px;
    left: -8px;
    width: 22px;
    height: 22px;
	-webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.dot:hover .dotInner:before{
	opacity:1;
     top: -2px;
    left: -2px;
    width: 10px;
    height: 10px;
     border: 5px solid #FFF;
    background: #FFF;
}
.active.dot:hover .dotInner:before{
    border: 2px solid #FFF;
    opacity: 0;
    top: -8px;
    left: -8px;
    width: 22px;
    height: 22px;
	
}
*/




#sliderCont {
      height: 100%;
    width: 100%;
    position: absolute;
    overflow: hidden;
    top: 0px;
    left: 0;
}
#slider {
	position:absolute;
	top:0;
	
	left:0;
    width: 100%;
    height: 100%;
}
.sliderBox {
     width: 100%;
	height: 100%;
     position: relative;
    top: 0;
    left: 0;
    float: left;
	overflow:hidden;
}
.featuredProjectBtn {
    margin-left: 0 !important;
}

.sliderBoxBG {
    position: absolute;
	opacity: 1;
    -webkit-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
    -webkit-transition: all 0.45s ease-in-out;
    -o-transition: all 0.45s ease-in-out;
    -moz-transition: all 0.45s ease-in-out;
    transition: all 0.45s ease-in-out;
}

.sliderBoxImage {
    position: absolute;
    bottom: 0;
    right: 0;
    -webkit-transition: all 1.2s ease-in-out;
    -o-transition: all 1.2s ease-in-out;
    -moz-transition: all 1.2s ease-in-out;
    transition: all 1.2s ease-in-out;
    -webkit-transition: all 0.7s ease-in-out;
    -o-transition: all 0.7s ease-in-out;
    -moz-transition: all 0.7s ease-in-out;
    transition: all 0.7s ease-in-out;
	
	
	
}

.sliderBox.active .sliderBoxImage{
  /*animation: mymove 12s;
  animation-iteration-count: infinite;*/
}

@keyframes mymove {
	0% {margin-bottom: 0px;}
	50% {margin-bottom: 20px;}
	100% {margin-bottom: 0px;}
}


.sliderBoxInner.inactive .sliderBoxImage {
    right: -100% !important;
}

.sliderBoxInner.inactive .sliderBoxBG {
    left: 100% !important;
    width: 0% !important;
	opacity: 0;
}
.sliderBox.active .sliderBoxImage {
	
}

.btnArrow{
      height: 45px;
    width: 45px;
    position: absolute;
    right: 0;
    background-size: 22px;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 10000;
	cursor:pointer;
}
.btnArrowTop{
      top: 0;
	background-image: url(images/flecha_arriba.png);
}
.btnArrowBottom{
      bottom: 0;
	background-image: url(images/flecha_abajo.png);
}

.btn-prev, .btn-next {
	width: 60px;
    height: 80px;
	position: absolute;
	top: 50%;
	cursor: pointer;
	background-size: 40px;
	background-repeat: no-repeat;
	background-position: center;
    margin-top: -40px;
     background-color: #000;
	-webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
	transition:all 0.3s ease-in-out;
}
.btn-prev {
	background-image: url(images/arrow-prev.png);
	left: 0px;
}
.btn-next {
	background-image: url(images/arrow-next.png);
	right: 0px;
}
.btn-prev:hover, .btn-next:hover {
	background-color: #fff;
}
.btn-prev:hover {
	background-image: url(images/arrow-prevh.png);
	left: 0px;
}
.btn-next:hover {
	background-image: url(images/arrow-nexth.png);
	right: 0px;
}
.sliderInfo {
    width: 30%;
    left: 5%;
    right: 65%;
    position: absolute;
    text-align: left;
    color: #000;
}

.sliderBoxContainer{
     position: absolute;
	top: 0;
	right: 0;
	width: 60%;
    height: 100%;
    overflow: hidden;
	
    width: 65%;
}
.overlayFeatured{
	background: none;
}

.sliderBoxInner {
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    position: absolute;
}

.deg{
      position: absolute;
    width: 70px;
    height: 100%;
    top: 0;
    right: 0;
    background-image: url(images/deg.png);
    z-index: 1;
}

.sliderInfo .contentSlider{
    margin: 0 0 10px;
}



.sliderInfo .titleProject {
    line-height: 1;
    margin-bottom: 5px;
    top: 0;
    font-size: 45px;
}
.sliderInfo .subtitleProject {
     color: #ccc;
}
.titleSlider {
	margin-bottom: 5px;
	text-transform: none;
	width: 100%;
	float: left;
}
.subtitleSlider {
	width: 100%;
	float: left;
}
.smallCTA{
	position:relative;
      float: left;
    width: 100%;
    font-size: 14px;
    margin-top: 10px;
    text-decoration: underline;
	color:#FFF;
}
.seeProjectSlider {
	width: 100%;
	margin-top: 20px;
	float: left;
	-webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.seeProjectSlider:hover {
	color:#656565;
}
.downCont {
    width: 100%;
    height: 30px;
    position: fixed;
    bottom: 0;
    left: 0;
    background-color: #fff;
    z-index: 10000;
}
.down-btn {
    width: 30px;
    height: 30px;
    position: absolute;
    bottom: -30px;
    left: 50%;
	margin-left: 5px;
    background-image: url(images/down-btn.png);
    background-size: 30px;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
	z-index: 1000000000;
	-webkit-animation-name: lets; /* Safari 4.0 - 8.0 */
    animation-name: lets;
	animation-duration: 1.5s;
	animation-iteration-count: infinite;
	display: block;
}
.up-btn {
    width: 30px;
    height: 30px;
    position: absolute;
    bottom: -30px;
    left: 50%;
	margin-left: -35px;
    background-image: url(images/down-btn.png);
    background-size: 30px;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
	z-index: 1000000000;
	-webkit-animation-name: lets; /* Safari 4.0 - 8.0 */
    animation-name: lets;
	animation-duration: 1.5s;
	animation-iteration-count: infinite;
	display: block;
	transform: rotate(180deg);
}
#goBot {
	margin-left: -15px;
}
#goTop {
	margin-left: -15px;
	transform: rotate(180deg);
	bottom: 0;
}

/* Safari 4.0 - 8.0 */
@-webkit-keyframes lets {
    0%   {background-image: url(images/down-btn.png);}
	50%   {background-image: url(images/down-btnh.png);}
    100% {background-image: url(images/down-btn.png);}
}

/* Standard syntax */
@keyframes lets {
    0%   {background-image: url(images/down-btn.png);}
	50%   {background-image: url(images/down-btnh.png);}
    100% {background-image: url(images/down-btn.png);}
}

/* Proyectos */

.containerOver {
	padding: 0 30px;
    width: 100%;
    float: left;
	overflow-y: scroll;
	box-sizing: border-box;
}
.projectsButtonsBox {
    width: 100%;
    margin: 30px 0;
    float: left;
}
.projectsButtonsBox li {
    float: left;
}
.projectsButtonsBox .projectsButtons {
    margin-left: 10px;
    margin-right: 30px;
    width: auto;
    font-family: 'Gibson';
    text-transform: none;
    float: left;
	position: relative;
}

.projectsButtonsX{
	opacity: 0;
	position: absolute;
	top: 0;
	right: 0;
    padding: 0px;
    color: #000;
    font-size: 0px;
    line-height: 8px;		
    top: 50%;
    margin-top: -5px;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.activeTab .projectsButtonsX{
    padding: 5px;
    opacity: 1;
    font-size: 8px;
    margin-top: -10px;
}
.projectsButtons:hover, .projectsButtonsBox .activeTab {
	color: #000000;
}
.projectsInfo {
    float: left;
    width: 98%;
    box-sizing: border-box;
	margin: 0px 1% 0;
    overflow: hidden;
    margin: 80px 1% 200px;
}


.grid-sizer {
    width: 33%;
    width: 33.33%;
	float:left;
}
.project {
	float:left;
    width: 25%;
    width: 33%;
    width: 33.33%;
     margin: 0;
}
.project.projectBlock-square {
    width: 66%;
    width: 66.66%;
}
.project.projectBlock-horizontal {
    width: 66%;
    width: 66.66%;
}
.projectImgFront {
    position: absolute;
    bottom: 0;
    right: 0;
}

.projectImgContainerOuter {
    position: absolute;
    width: 80%;
    height: 80%;
    top: 10%;
    left: 10%;
}

.projectInner {
    float: left;
    box-sizing: border-box;
	overflow:hidden;
     width: 100%;
}
.project.featured {
}

.projectImg {
    width: 100%;
     float: left;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.projectID {
    width: 80%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 10%;
    box-sizing: border-box;
    text-align: center;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    opacity: 0;
    display: table;
    text-shadow: 5px 5px 15px rgba(0,0,0,0.4);
	color: #FFF;
}
.projectIDInner {
    display: table-cell;
    vertical-align: middle;
}

.project:hover .projectID {
    opacity: 1;
}
.project:hover .titleProjectContainer{
}

.projectImgContainerOuter{
	
}
.projectImgContainerHidden {
    height: 0% !important;
    top: 50% !important;
    left: 50% !important;
}

.projectImgContainer {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
	
    height: 96%;
    width: 96%;
    top: 2%;
    left: 2%;
	
	background-position:center center;
	background-size:cover;
	background-repeat:no-repeat;
    -webkit-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}
.featured .projectImgContainer {
    height: 98%;
    
    top: 1%;
    
}


@media screen and (min-width: 1024px){
	.project:hover .projectImgContainer {
		/*width: 110%;
		left: -5%;
		top: -5%;
		height: 110%;
		-webkit-filter: blur(3px);
		-moz-filter: blur(3px);
		-o-filter: blur(3px);
		-ms-filter: blur(3px);
		filter: blur(3px);*/
	}
}


.featured .projectID {
}
.titleProjectContainer{
    padding: 10px;
    background: #FFF;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    display: table-cell;
    vertical-align: middle;
}
.titleProject {
    font-family: 'Gibson';
    font-size: 50px;
    text-transform: uppercase;
    line-height: 1;
    margin-top: 5px;
    margin-bottom: 0px;
    position: relative;
    top: 25px;
    -webkit-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
.projectBlock-vertical .titleProject, .projectBlock-normal .titleProject {
    font-size: 36px;
}

.project:hover .titleProject {
    top: 0px;
}
.subtitleProject{
    font-size: 24px;
    position: relative;
    top: 30px;
	text-transform: uppercase;
    -webkit-transition: all 0.7s ease-in-out;
    -o-transition: all 0.7s ease-in-out;
    -moz-transition: all 0.7s ease-in-out;
    transition: all 0.7s ease-in-out;
}
.project:hover .subtitleProject {
    top: 0px;
}

/* Nosotros */

.mediaCont {
    position: relative;
    width: 50%;
    height: 100%;
    float: left;
	
}
.aboutImg {
	width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center;
	background-size: cover;
}
#aboutInfo {
    text-align: center;
}

#aboutCont{
      overflow-x: hidden;
    overflow-y: scroll;
}




	
#aboutImg {
    background-repeat: no-repeat;
    background-position: center;
	background-size: contain;
	background-color:#000;
}

.aboutTitle {
    margin-bottom: 40px;
}
.aboutPhrase, .aboutSubject {
    margin-bottom: 30px;
     line-height: 1.2;
}
.aboutText {
	margin-bottom:30px;
}
.aboutText p {
    margin-bottom: 15px;
}




.grid-sizer-team {
    width: 16%;
    width: 16.66%;
    float: left;
}
.team_image {
    float: left;
    width: 16%;
    width: 16.66%;
    margin: 0;
}
.team_image_medium{
    width: 33%;
    width: 33.33%;
}
.team_image_large{
    width: 50%;
}
.team_image_inner {
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
    float: left;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
	
	
    -webkit-filter: grayscale(100%) contrast(200%);
    -moz-filter: grayscale(100%) contrast(200%);
    -ms-filter: grayscale(100%) contrast(200%);
    -o-filter: grayscale(100%) contrast(200%);
    filter: grayscale(100%) contrast(200%);
	
    -webkit-filter: grayscale(100%) contrast(120%);	
    -moz-filter: grayscale(100%) contrast(120%);
    -ms-filter: grayscale(100%) contrast(120%);
    -o-filter: grayscale(100%) contrast(120%);
    filter: grayscale(100%) contrast(120%);
	
	
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}



.team_image .team_image_inner:hover {
    -webkit-filter: grayscale(80%);
    -moz-filter: grayscale(80%);
    -ms-filter: grayscale(80%);
    -o-filter: grayscale(80%);
    filter: grayscale(80%);
	
	
    -webkit-filter: grayscale(50%) contrast(300%);
    -moz-filter: grayscale(50%) contrast(300%);
    -ms-filter: grayscale(50%) contrast(300%);
    -o-filter: grayscale(50%) contrast(300%);
    filter: grayscale(50%) contrast(300%);
	
    -webkit-filter: grayscale(85%) contrast(150%);
    -moz-filter: grayscale(85%) contrast(150%);
    -ms-filter: grayscale(85%) contrast(150%);
    -o-filter: grayscale(85%) contrast(150%);
    filter: grayscale(85%) contrast(150%);
}









/* Contacto */

.formCont {
    width: 100%;
    float: left;
	margin: 50px 0;
}
.formCont .mediaCont {
    margin: 0px 2% 10px;
	width: 46%;
}
.formCont .fullCont {
    margin: 0px 2% 20px;
	width: 96%;
}
.formInfo {
	padding:0 20px;
	width:100%;
	height:40px;
	line-height:40px;
	background-color:#fff;
	box-sizing:border-box;
	border:none;
	float:left;
    border-bottom: 1px solid #000;
    border-radius: 0;
}
.formInfo:focus {
    outline: none !important;
    border-bottom: 2px solid #000;
    box-shadow: 0 3px 3px 0px #ccc;
}

.formTitle {
	margin-bottom: 40px;
}
#fullMsg {
	width: 100%;
    height: 100px;
	resize: none;
     line-height: 1.5;
}
label {
    float: left;
}
input {
    border: none;
}
.fullCont {
    margin: 0 2%;
    width: 96%;
    float: left;
}

.contactFormLabel {
    width: 100%;
    text-align: left;
    margin-bottom: 5px;
}

.preloader{
	display:none;
	float:left;
	width:100%;
	background-image:url(images/preloader.gif);
	background-size:45px 45px;
	background-position:top center;
	background-repeat:no-repeat;
}
.contactFormError {   
	width: 100%;
    float: left;
    text-align: left;
    color: #ccc;
    font-size: 14px;
    line-height: 15px;
    margin-top: 7px;
}


#contactForm .buttonCont {
    width: 100%;
    margin-top: 5px;
    float: left;
}
.submitBtn {
    padding: 10px 40px;
	background-color: #000000;
	color: #fff;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.submitBtn:hover {
	background-color: #656565;
}





.preloadImg{
	position:absolute;
	width:20px;
	top:-100px;
	left:-100px;
}

.sky {
	position:fixed;
	display:block;
	top:0;
	left:0;
	width:100%;
	height:100%;
	opacity:1;
	z-index:90000;
	background-size:cover;
	background-color:#000;
}

#loaderText {
    position: absolute;
    color: #FFF;
    width: 100%;
    text-align: center;
    top: 50%;
    margin-top: -10px;
    z-index: 9;
}
.cloud {	
  background-size:cover;
  background-repeat:no-repeat;
  background-position:center;
  position: absolute;
}
.cloudFar1 {	
	height: 128px;
	width: 128px;
	z-index:10;
}
.cloudFar2 {	
	height: 64px;
	width: 64px;
	z-index:8;
}
.cloudFar3 {	
	height: 32px;
	width: 32px;
	z-index:7;
}

.cloudPosTop{
	left: 0;
	top: -10%;
}
.cloudPosBottom{
	left: 0;
	top: 110%;
}
.cloudPosLeft{
	left: -10%;
	top: 0;
}
.cloudPosRight{
	left: 110%;
	top: 0;
}


.clouds {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
    z-index: 88000;
}


/*
.cloud1 {	
  background-image: url("images/cloud/01.png");
}
.cloud2 {	
  background-image: url("images/cloud/02.png");
}
.cloud3 {
  background-image: url("images/cloud/03.png");
}
.cloud4 {
  background-image: url("images/cloud/04.png");
}
.cloud5 {
  background-image: url("images/cloud/05.png");
}
.cloud6 {
  background-image: url("images/cloud/06.png");
}
.cloud7 {
  background-image: url("images/cloud/07.png");
}
.cloud8 {
  background-image: url("images/cloud/08.png");
}
.cloud9 {
  background-image: url("images/cloud/09.png");
}
.cloud10 {
  background-image: url("images/cloud/10.png");
}
.cloud11 {
  background-image: url("images/cloud/11.png");
}
.cloud12 {
  background-image: url("images/cloud/12.png");
}
*/






 /* 
 __________________________________________________________________
 __________________________________________________________________

 HOME 
 __________________________________________________________________
 __________________________________________________________________ 
 */
 
 .textCenter{
	 text-align:center;
 }

.heavy {
    font-family: Arial, sans-serif;
    font-family: Gibson;
    font-weight: normal;
    font-style: normal;
    line-height: 1;
    text-transform: uppercase;
}

#overlay, .overlay{
    overflow: hidden;
    height: 100%;
    width: 100%;
    float: left;
    position: absolute;
	top:0;
	left:0;
    background: rgba(0,0,0,0.4);
	background:url(images/pattern.png);
}

#degLow{
    overflow: hidden;
    height: 128px;
    width: 100%;
    position: absolute;
    bottom: -3px;
    left: 0;
    background: url(images/degLow.png);
    background-repeat: repeat-x;
    background-size: 100% 100%;
    background-position: bottom left;
	
}

.testTitle{
	margin-bottom: 10px;
	
}

.overlay.blackOverlay{
    background: rgba(0,0,0,0.3);
}

.bevel {
    border-color: #000;
    border-style: solid;
    border-width: 0px;
    border-left-color: transparent;
    border-top: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.btn {
    font-family: Arial, sans-serif;
    font-family: Gibson;
    font-weight: normal;
    font-style: normal;
    line-height: 1;
    text-transform: uppercase;
    color: #FFF;
    font-size: 16px;
    box-sizing: border-box;
    display: inline-block;
    float: none;
    margin-top: 10px;
    overflow: hidden;
    position: relative;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    margin: 0 auto;
}

.btn:hover .btnContent{
    padding-top: 0px;
}

.btn:hover:before {
    top: 0;
    left: 0;
    border-bottom: 15px solid #ccc;
    border-left: 15px solid transparent;
}
.btn:hover .bevel {
    border-width: 15px;
}
.btn:before {
    content: "";
    position: absolute;
    top: -15px;
    left: -15px;
    width: 0;
    height: 0;
    border-bottom: 0px solid #ccc;
    border-left: 0px solid transparent;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.btnContent{

    background: #000;
    width: 100%;
    border-top: 0;
    border-bottom: 0;
    padding: 0 30px 15px;
    padding-top: 15px;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    box-sizing: border-box;
}

#letsGo {
    color: #fff;
    position: relative;
    bottom: 30px;
    left: 50%;
    margin-left: -110px;
    cursor: pointer;
    width: 220px;
    text-align: center;
    z-index: 200;
    margin-top: 40px;
    float: none;
    height: 50px;
    line-height: 30px;
}
#letsGo .btnContent {
    padding-top: 10px;
}
#letsGo:hover .btnContent {
    padding-top: 0px;
    margin-top: -5px;
}
.ded {
    width: 30%;
}


#homeContainer {
    width: 100%;
    float: left;
	overflow-y: scroll;
	box-sizing: border-box;
}
#homeContainer {
    position: absolute;
    height: 100%;
    width: 100%;
    background: #000;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
}


#slideshowVideoItem{
	position:relative;
	top:0;
	left:0;
	width:100%;
	height:100%;
     overflow: hidden;
	
}
#bgvid {
    position: absolute;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
}

.centeredBtn{
    margin-left: 5px;
    margin-right: 5px;
}


#ground{
    width: 100%;
    height: 16px;
    background-image: url(images/ground.jpg);
    background-size: contain;
    background-repeat: repeat-x;
    position: absolute;
    top: 0;
    left: 0;
}

#homeSecContent {
    position: relative;
    float: left;
    background: #FFF;
    width: 100%;
    padding: 50px 0;
}

#homeSecContent .aboutTitle {
    margin-bottom: 50px;
}

#homeIntro{
    float: left;
    width: 100%;
    position: relative;
    overflow: hidden;
}
#sepHome{
    float: left;
    width: 100%;
    position: relative;
}


.city{
    float: left;
    width: 100%;
    background-image: url(images/home_city.png);
    background-repeat: repeat-x;
    background-size: auto 100%;
    background-position: left bottom;
    position: absolute;
    bottom: 0;
    left: 0;
}
#citySky{
	background: none;
	
}

.vehicle{
	position: absolute;
	bottom: 0;
    background-position: left bottom;
    background-size: contain;
    background-repeat: no-repeat;
}
.vehicle-0{
	width: 32px;
	height: 20px;	
    background-image: url(images/car.png);
}
.vehicle-1{
	width: 50px;
	height: 26px;	
    background-image: url(images/truck.png);
}
.vehicleSide-1{
  -webkit-transform: scaleX(-1) !important;
  transform: scaleX(-1) !important;
}

.homeTestimonialName.title {
    font-size: 22px;
}

.homeTestimonialCompany.subtitle{
    font-size: 14px;
    text-transform: initial;
}
.homeTestimonialCompanyDescription.homeTestimonialCompany.subtitle {
    color: #999;
    font-size: 12px;
}

#homeScroll{
	
    position: absolute;
    right: 0;
    bottom: 20px;
    left: 0;
    margin: auto;
    width: 24px;
    height: 40px;
}
	
#homeTestimonials{
    float: left;
    width: 100%;
	
}
#homeTestimonialsInner{
	width: 1000px;
	margin: 0 auto;
	position: relative;
}
.homeTestimonialSizer{
	width: 33.33%;
	float:left;	
}
.homeTestimonial{
	width: 33.33%;
	float:left;	
	position: relative;
	
}


.cloudSize{
	height: 32px;
	width: 32px;
}

.homeTestimonialSizer{
	width: 50%;	
}
.homeTestimonial{
	width: 50%;
	
}


.homeTestimonialImage{
    width: 80px;
    height: 80px;
    background-size: cover;
    border-radius: 50%;
    border: 1px solid #ccc;
    box-sizing: border-box;
    position: absolute;
    top: 20px;
    left: 20px;
    box-shadow: -2px 2px 1px 1px inset rgba(0, 0, 0, 0.2);
	
}
.homeTestimonialContainer{
	width: 100%;
	float: right;
	width: calc(100% - 100px);
    margin-bottom: 70px;
    position: relative;
	
}
.homeTestimonialContainer{
	
}
.homeTestimonialThing{
    position: absolute;
    width: 30px;
    height: 30px;
    top: 30px;
    left: -19px;
	background-image: url(images/thing.png);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	
}
.homeTestimonialBox{
    width: 90%;
    width: calc(100% - 40px);
    background: #FFF;
    padding: 30px;
    box-sizing: border-box;
    border-radius: 20px;
    margin-left: 10px;
    box-shadow: 3px 3px 9px 9px rgba(0,0,0,0.2);
    box-shadow: 1px 1px 3px 3px rgba(0,0,0,0.1);
	
}

.topCTAhome{
    margin-bottom: 20px;
	
}
.homeTestimonialContent{
	
}
.homeTestimonialName{
	
}
.homeTestimonialCompany{
	
}
.homeTestimonialCompany a{
	color: #000;
	text-decoration: underline;
}
.homeTestimonialText{
    margin-top: 5px;
    padding-top: 7px;
    border-top: 0.5px solid #ccc;
	
}




.whiteBtn.btn{
	
}
.whiteBtn.btn:before {
    border-bottom: 0px solid #666;
    border-left: 0px solid transparent;
}
.whiteBtn.btn .bevel {
    border-color: #FFF;
     border-left-color: transparent;
}

.whiteBtn.btn .btnContent {
    background: #FFF;
	color:#000;
}

.whiteBtn.btn:hover:before {
    border-bottom: 15px solid #666;
    border-left: 15px solid transparent;
}



 /* 
 __________________________________________________________________
 __________________________________________________________________

 HASTA ACA 
 __________________________________________________________________
 __________________________________________________________________ 
 */









.black{
	color:#000;
}
.facebook {
    background-image: url(images/facebook.png);
}
.linkedin{
    background-image: url(images/linkedin.png);
}
.instagram {
    background-image: url(images/instagram.png);
}
.phone {
    background-image: url(images/icon_phone.png);
}
.wa {
    background-image: url(images/wa.png);
}
.mail {
    background-image: url(images/mail.png);
}

.outer {
}


.contact{
      float: right;
    margin-top: 27px;
    background: #000;
    color: #FFF;
    position: relative;
    z-index: 2500;
}
.contactIcon{
}
.contactInner{
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.containerOver {
	box-sizing: initial;
	padding: 0;
	overflow: hidden;
    overflow: scroll;
	  -webkit-overflow-scrolling: touch; 
}


.projectsButtonsBox {
      width: auto;
    margin: 0;
    background: #000;
    position: absolute;
    z-index: 10000;
     right: 0;
    box-shadow: 3px 3px 7px 0px rgba(0,0,0,0.2);
}
.projectsButtons, .projectsButtonsBox{
     width: auto;
    font-family: 'Gibson';
    text-transform: uppercase;
    float: left;
    font-size: 14px;
    line-height: 15px;
    color: #FFF;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.projectsButtonsBox .projectsButtons {
    width: auto;
    font-family: 'Gibson';
    text-transform: uppercase;
    float: left;
    margin: 0;
    font-size: 12px;
    padding: 10px 25px;
}
.projectsButtons:hover, .projectsButtonsBox .activeTab {
    color: #000;
    background: #fff;
}



.title {
    line-height: 1;
}
.bgBlack{
	background:#000;
}
.mediaCont {
    width: 70%;
}
#aboutCont {
    width: 30%;
}
#aboutInfo {
    box-sizing: border-box;
    background: #000;
}

#bannerAbout {
    width: 100%;
    position: relative;
    float: left;
	overflow: hidden;
}
.titleAboutImage {
    background-size: cover;
    position: absolute;
    background-position: 50%;
    width: 120%;
    height: 120%;
    top: -10%;
    left: -10%;
    background-repeat: no-repeat;
    -webkit-transition: all 1.2s ease-in-out;
    -o-transition: all 1.2s ease-in-out;
    -moz-transition: all 1.2s ease-in-out;
    transition: all 1.2s ease-in-out;
}
.animParent.active .titleAboutImage {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
#bannerAboutInner {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	position: absolute;
}
#bannerAboutTitleInner {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	position: absolute;
}

.titleAbout {
    background-size: contain;
    position: absolute;
    width: 80%;
    height: 100%;
    background-position: 50%;
    background-repeat: no-repeat;
    left: 10%;
}


.about_block{
	margin: 0 auto;
	width: 600px;
    text-align: center;
}

.about_block_margin{
	float: left;
	width: 100%;
	margin: 40px 0;
}

.about_block_image{
	float: left;
	width: 100%;
}

#teamImages{
    margin-bottom: 20px;
	
}
#teamImagesDuring{
    margin-bottom: 20px;
	
}
#aboutContainer{
	
    background: #000;
    overflow: scroll;
	  -webkit-overflow-scrolling: touch; 
	/*overflow: hidden;*/
}

.aboutContainer {
    text-align: center;
    width: 600px;
    margin-left: 50%;
    position: relative;
    left: -300px;
    background: #FFF;
    float: left;
    top: -120px;
    box-sizing: border-box;
    padding: 50px;
}


.contactFormLabel {
    font-family: 'Gibson';
    text-transform: uppercase;
}
.submitBtn {
    background-color: #000;
    border: 1px solid #FFF;
    font-family: 'Gibson';
    text-transform: uppercase;
    font-size: 16px;
	cursor:pointer;
}

.submitBtn:hover {
    background-color: #FFF;
    color: #000;
    border: 1px solid #000;
}


#contactFormContainer {
      margin: 0 5%;
    position: relative;
    width: 90%;
    text-align: center;
}

.contactBlock{
	width:50%;
	position:absolute;
	top:0;
     height: 100%;
	 left:0;
}

#mapContainer{
	right:0;
	left:auto;
}
#map{
	width:100%;
	height:100%;
	top:0;
	right:0;
	left:0;
	position:absolute;
}
#formBlock{
	box-sizing: border-box;
}

.contactBtnIcon{
}

.titleContact{
    font-family: 'Gibson';
	text-transform: uppercase;
	font-size: 20px;
	color:#000;
}

#addressCont{
	color:#000;
	font-size:16px;
    font-family: 'hn-Light';
	font-size: 15px;
     line-height: 1.4;
    margin-top: 10px;
}
#addressCont a{
	color:#000;
	text-decoration:underline;
}

#mapContent {
    position: absolute;
    bottom: 20px;
    margin-top: 5px;
    width: 80%;
    text-align: center;
    left: 10%;
    padding: 0px 30px;
    box-sizing: border-box;
    /*background: #fff;
    background: rgba(256, 256, 256, 0.8);*/
}

#contactImage {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
}

.mobileTitle{
	display:none;
}



#mobileMenu {
    display: none;
}

.active #socialCont {
    bottom: 30px;
    left: 10%;
}
.contactDescription {
    line-height: 1.4;
    margin-bottom: 10px;
    font-size: 13px;
}
.bMenu .contactDescription {
    color: #FFF;
}
#socialCont {
    position: absolute;
    z-index: 2000;
    bottom: -120px;
    left: -300px;
    width: 80%;
    text-align: center;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

#socialContNew {
    float: left;
    text-align: center;
    width: 100%;
    margin-right: 0;
    margin-top: 0;
}



#socialContNew .social:hover {
	background-size:18px;
}
#socialContNew .social {
    width: 40px;
    height: 40px;
    background-size: 15px;
    background-position: center;
    background-repeat: no-repeat;
    display: inline-block;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    float: none;
    background-color: #000;
    border-radius: 50%;
    margin: 15px 5px 0;
}

#wrapper {
	padding: 0;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	z-index: 9000;
	position: absolute;
	-webkit-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.75s ease-in-out;
    -o-transition: all 0.75s ease-in-out;
    -moz-transition: all 0.75s ease-in-out;
    transition: all 0.75s ease-in-out;
    -webkit-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}




.btn.contactBtn {
	background: transparent;
	min-width: 50px;
	position: relative;
	z-index: 10000;
	display: inline-block;
	float: none;
	clear: both;
	margin: 0 30px;
}
.contactBtnIcon {
	position: absolute;
	width: 45px;
	height: 100%;
	background-size: 30px;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url(images/mensaje.png);
	 top: 0;
	left: 0;
}
#mainMenu .btn.contactBtn:hover {
}
.bMenu .btnContent {
	background: #FFF;
	color:#000;
}
.contactBtn .btnContent {
	float: right;
	width: 170px;
	text-align: center;
}
.btn.contactBtn .btnContent {
	padding-left: 50px;
	padding-right: 20px;
}


section {
}
#burguerIcon{
}
#mainMenu {
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
#mainMenu.bMenu {
	background: transparent;
	 border-bottom: none;
}
#mainMenu.bMenu .btn.contactBtn {
	background: transparent;
}
.bMenu .bevel {
	border-color: #FFF;
	border-left-color: transparent;
}
#logo {
	width: 46px;
	left: 0;
	margin-left: 11px;
	z-index: 2000;
	margin-top: 10px;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

#mainMenu.bMenu #logo {
	width: 215px;
	left: 0;
	margin-left: 20px;
	z-index: 2000;
	margin-top: 15px;
}
#mainMenu.bMenu #logo img.secImg{
	opacity:1;
}
#mainMenu.bMenu #logo img.mainImg{
	opacity:0;
}

#menu {
	top: 0;
	display: block;
	width: 300px;
	height: 100%;
	left: -300px;
}
.active #menu {
	left: 0px;
}
#menu ul {
	position: relative;
	width: 100%;
	z-index: 1000;
}
#menu ul li {
}
#menu ul li a {
}
#menu ul li a:hover, #menu ul li a.active {
}
#menu ul li a:after {
	position: absolute;
	content: "";
	width: 0%;
	height: 2px;
	background: #000;
	left: -5%;
	top: 50%;
	margin-top: -2px;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
#menu ul li a:hover:after, #menu ul li a.active:after {
    width: 110%;
}
.bMenu #menu ul li a:after {
    background: #FFF;
}
#mainMenu.bMenu ul li a {
	color: #FFF;
}
#mainMenu.bMenu ul li a:hover, #mainMenu.bMenu ul li a.active {
}
	
	
	.animParent.active .smallCTA{
		top:0;
		opacity:1;
	}
	#section-0 .blockInner.active .displayAnim, .animParent.active .displayAnim{
		opacity: 1;
		/* top: 0; */
		transform: matrix(1, 0, 0, 1, 0, 0);
	}
	
	
	.displayAnim {
		opacity: 0;
		/* top: -40px; */
		position: relative;
		transform: matrix(1, 0, 0, 1, 0, -20);
		transform: matrix(1.2, 0, 0, 1, 0, -20);
		transform: matrix(1.2, 0, 0, 1.2, 0, -30);
    	transform: matrix(2, 0, 0, 2, 0, -30);
	}
	.displayAnim1 {
		-webkit-transition: all 0.4s ease-in-out 0.3s;
		-o-transition: all 0.4s ease-in-out 0.3s;
		-moz-transition: all 0.4s ease-in-out 0.3s;
		transition: all 0.4s ease-in-out 0.3s;
	}
	
	.displayAnim2 {
		-webkit-transition: all 0.7s ease-in-out 0.3s;
		-o-transition: all 0.7s ease-in-out 0.3s;
		-moz-transition: all 0.7s ease-in-out 0.3s;
		transition: all 0.7s ease-in-out 0.3s;
		
		-webkit-transition: all 0.55s ease-in-out 0.3s;
		-o-transition: all 0.55s ease-in-out 0.3s;
		-moz-transition: all 0.55s ease-in-out 0.3s;
		transition: all 0.55s ease-in-out 0.3s;
	}
	
	.displayAnim3 {
		-webkit-transition: all 1s ease-in-out 0.3s;
		-o-transition: all 1s ease-in-out 0.3s;
		-moz-transition: all 1s ease-in-out 0.3s;
		transition: all 1s ease-in-out 0.3s;
		
		-webkit-transition: all 0.7s ease-in-out 0.3s;
		-o-transition: all 0.7s ease-in-out 0.3s;
		-moz-transition: all 0.7s ease-in-out 0.3s;
		transition: all 0.7s ease-in-out 0.3s;
	}

	.displayAnim4 {
		-webkit-transition: all 1.3s ease-in-out 0.3s;
		-o-transition: all 1.3s ease-in-out 0.3s;
		-moz-transition: all 1.3s ease-in-out 0.3s;
		transition: all 1.3s ease-in-out 0.3s;

		-webkit-transition: all 1.6s ease-in-out 0.3s;
		-o-transition: all 1.6s ease-in-out 0.3s;
		-moz-transition: all 1.6s ease-in-out 0.3s;
		transition: all 0.85s ease-in-out 0.3s;
	}



	
	
@media screen and (min-width: 1025px) { /*mas de */
/*
::-webkit-scrollbar {
	width: 10px;
}
::-webkit-scrollbar:horizontal {
	display: none;
}
::-webkit-scrollbar-track {
	background-color: #FFF;
	border-radius: 0;
	box-sizing:border-box;
	border-left:1px solid #ccc;
}
::-webkit-scrollbar-thumb {
	background-color: #000;
	border-radius: 5px;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
::-webkit-scrollbar-thumb:hover {
	background-color: #333;
	border-radius: 3px;
}
*/

	.smallCTA{
		top:30px;
		opacity:0;
		 -webkit-transition: all 1.2s ease-in-out;
		-o-transition: all 1.2s ease-in-out;
		-moz-transition: all 1.2s ease-in-out;
		transition: all 1.2s ease-in-out;
	}
	
	/*.sliderInfo{
		background-color:rgba(0,0,0,0);
		 -webkit-transition: all 1.2s ease-in-out;
		-o-transition: all 1.2s ease-in-out;
		-moz-transition: all 1.2s ease-in-out;
		transition: all 1.2s ease-in-out;
	}
	.animParent.active .sliderInfo{
		background-color:rgba(0,0,0,1);
	}*/
	
	#ctaMobile{
		display:none;
	}

	.invDesktop{
		display:none !important;
	}
	#mapContainer{
		height:100% !important;
	}
	
	.projectsButtonsBox {   
		bottom: auto !important;
		margin-right: 1.5%;
		position: fixed;
	}

	.projectsButtonsBox {
	}
	
}


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

	.subtitle {
		font-size: 18px;
	}
	.title {
		font-size: 32px;
	}
	
	
	.aboutTitle {
		margin-bottom: 20px;
	}
	.aboutPhrase, .aboutSubject {
	     margin-bottom: 15px;
	}
	.aboutText {
    	margin-bottom: 15px;
	}
	.aboutText p {
		margin-bottom: 10px;
		line-height: 1.4;
	}
}


.langSelectionContainer{
}
.langSelection{
    color: #000;
    font-family: 'Gibson';
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    line-height: 21px;
    margin-top: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    width: 10%;
    display: inline-block;
    padding: 0;
}
#langSelector {
    background: #000;
    width: 20px;
    height: 2px;
    position: absolute;
    left: 0;
    bottom: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.activeLang{
}


#menuContainer.bMenu {
    background: #000;
    border-right: none;
}
#menuContainer.bMenu .burguerBread {
    background: #FFF;
}

img.menuFoldBlack{
	opacity:0;
}
.bMenu img.menuFoldBlack{
	opacity:1;
}
.bMenu img.menuFoldWhite{
	opacity:0;
}

.bMenu .langSelection{
    color: #FFF;
}
.bMenu #langSelector {
    background: #FFF;
}

.bMenu #menu ul li a {
    color: #FFF;
}


#menuContainer {
	position: fixed;
	width: 60px;
	height: 100%;
	top: 0;
	left: 0;
	background: #FFF;
	z-index: 500000;
    box-shadow: 0 -10px 10px 0px #ccc;
	
	
    box-shadow: 0 10px 6px 0px #ececec;
	
	/*
    -webkit-transition: width 0.3s ease-in-out, opacity 0.1s ease-in-out;
    -o-transition: width 0.3s ease-in-out, opacity 0.1s ease-in-out;
    -moz-transition: width 0.3s ease-in-out, opacity 0.1s ease-in-out;
    transition: width 0.3s ease-in-out, opacity 0.1s ease-in-out;*/
	
    -webkit-transition: width 0.3s ease-in-out, opacity 0.7s ease-in-out, background 0.3s ease-in-out;
    -o-transition: width 0.3s ease-in-out, opacity 0.7s ease-in-out, background 0.3s ease-in-out;
    -moz-transition: width 0.3s ease-in-out, opacity 0.7s ease-in-out, background 0.3s ease-in-out;
    transition: width 0.3s ease-in-out, opacity 0.7s ease-in-out, background 0.3s ease-in-out;
}
#menuContainer.active {
    width: 300px;
    box-shadow: 0 10px 6px 0px rgba(255, 255, 255, 0);
}

.burguerBread{
	width: 20px;
	margin-left: -10px;
	margin-top: 0;
	height: 2px;
	background: #666;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.burguerBreadMeat{
}
#burguerIcon.active{
    right: -40px;
}

.burguerBread1{
	margin-top: -8px;
}
.burguerMeat {
	margin-top: -1px;
}
.burguerBread2{
  margin-top: 6px;
}
.burguerBreadMeat{
}


#burguerIcon.active .burguerBread1{
	 margin-left: -10px;
	-webkit-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	transform: rotate(-45deg);
	 margin-top: -1px;
}
#burguerIcon.active .burguerBread2{
	margin-left: -10px;
	-webkit-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	transform: rotate(45deg);
	 margin-top: -1px;
}

#burguerIcon.active .burguerMeat{
	 width: 0px;
	margin-left: 0;
}

#burguerIcon, #exitMenu {
    width: 60px;
    height: 45px;
    top: 50%;
    right: 0;
    margin-top: -22px;
    position: absolute;
    z-index: 10000;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}


#secMenu{ 
	top: -60px;
}

#secMenu.active{ 
	top: 20px;
}



@media screen and (max-width: 1024px) {/*menos de */

	#section-0{
		background:#000;
	}
	#langSelector{
		display:none;
	}
	.activeLang{
   		border-bottom: 1px solid #000;
	}


	.ded {
		width: 50%;
	}
	
	#ctaMobile{
		display:block;
		bottom: 10px;
		background-image: url(images/flecha_abajo.png);
		height: 45px;
		width: 45px;
		position: absolute;
		left:50%;
		margin-left:-22px;
		background-size: 22px;
		background-repeat: no-repeat;
		background-position: center;
		z-index: 1000;
		cursor: pointer;
	}
	.invMobile{
		display:none !important;
	}
	body, html {
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
	}
	section {
		padding-top: 0px;
	    overflow: scroll;
	  -webkit-overflow-scrolling: touch; 
	}
	
	
	
	

	.grid-sizer-team {
		width: 20%;
		float: left;
	}
	.team_image {
		float: left;
		width: 20%;
		margin: 0;
	}
	.team_image_medium{
		width: 40%;
	}
	.team_image_large{
		width: 60%;
	}
	.team_image_inner {
    	padding: 7px;
	}
	
	/* general */

	.containerOver {
		/* overflow: visible; */
	}

	/* header */

	#mainMenu {
		height: 60px;
	}
	.navCont {
		width: 20px;
	}
	#menu {
	}
	/*----- HOME -----*/

	/* Proyectos */
	.titleProjectContainer {
		display: block;
	}
	.titleProject {
		top: 0px;
		margin-bottom: 0;
	}
	.subtitleProject {
		top: 0;
	}
	
	.project, .grid-sizer{
		width:50%;
	}
	
	
	.project.projectBlock-square {
		width: 100%;
	}
	.project.projectBlock-horizontal {
		width: 100%;
	}
	
	
	
	.project.featured {
		width: 33.33%;
	}
	.featured .projectImgContainer{
    height: 96%;
    width: 96%;
    top: 2%;
    left: 2%;
	}
	
	.featured .projectID {
		width: 100%;
		left: 0;
	}
	.projectID, .featured .projectID {
		opacity: 1;
	}
	.projectImgContainerOuter {
		width: 90%;
		height: 90%;
		top: 5%;
		left: 5%;
	}
	
	.titleProject {
		font-size: 40px;
	}
	.mediaCont {
		width: 100%;
		height: auto;
	}
	#aboutImg {
		height: 500px;
		height: calc(100vh * 0.75);
	}
	.aboutImg {
		height: 300px;
	}
	
	#aboutInfo {
		padding: 50px;
		position: relative;
     	display: block;
	     height: auto;
	    padding-bottom: 80px;
	}
	#aboutInfo .middle{
		display:block;
	}
	
	#section-3 {
		margin-bottom: 0 !important;
	}
	/* Contacto */

	.block_gallery {
    	width: 50%;
	}
	
	.projectsInfo{
		padding-bottom:0 !important;
	}
	
	#aboutInfo .btn {
		/*display: none;*/
	}



	#mainMenu {
		height: 100%;
		position: relative;
	}
	#mainMenu {
		height: auto;
	}
	#menu ul {
		float: left;
		width: 100%;
	}
	.blockInner {
		display: block !important;
		height: auto;
	}
	#blockInner-0{
		height:100%;
	}
	#sliderCont{
     position: relative;
	}
	
	
	.projectsButtonsBox {
	
		float: right;
	    margin-right: 1.6%;
		position: fixed;
	}
	#slideshowVideoItem {
		position: relative;
		float: left;
		height: 400px;
	    height: 50%;
	}
	
	.outer#homeContent {
		position: relative;
		display: block;
		height: auto;
		margin: 40px 0;
		float: left;
	}
	.outer#homeContent .middle{
		display:block;
	}
	
	#aboutCont {
		width: 100%;
	}
	
	
	.sliderInfo{
    	padding-left: 0px;
	}
	.mobileTitle{
		display: block;
		text-align: center;
		width: 100%;
		float: left;
		padding: 40px 0;
		color: #FFF;
		background: #000;
	}
	.mobileTitle.notOnTablet{
		display:none;
	}
	.selectedTitle{
		position: absolute;
		z-index: 10;
		width: auto;
		padding: 15px 40px;
		top: 20px;
		left:0;
		font-size: 20px;
	}
	
	#blockInner-0 .btn{
		/*display:none;	*/
	    margin-bottom: 10px;
	}
	
	.desktopTitle{
		display:none;
	}
	.formCont {
		margin: 0;
	}
	#overlay{
		display:none;
	}
	#blockInner-4 {
		height: 100% !important;
	}
	#contactFormContainer {
		height: 100% !important;
	}
	#mainMenu {
    	border-bottom: none;
	}
	.projectsButtons:hover{
    	color: #fff;
    	background: #000;
	}
	.projectsButtons.activeTab{
    	color: #000;
    	background: #fff;
	}
}

	
@media screen and (max-width: 768px) and (orientation: portrait) {/*menos de */
	.sliderBoxInner.inactive .sliderBoxImage {
		right: 0% !important;
		bottom: -100% !important;
	}
	.sliderBoxInner.inactive .sliderBoxBG {
		left: 0% !important;
		width: 0% !important;
		opacity: 1;
		top: 100% !important;
	}

	.sliderInfo {
		width: 100%;
		left: 0;
		height: 30%;
		text-align: center;
	}
	.sliderBoxContainer {
		top: auto;
		bottom: 0;
		height: 70%;
		width: 100%;
	}
}
@media screen and (max-width: 768px) {/*menos de */



	.grid-sizer-team {
		width: 33%;
		width: 33.33%;
		float: left;
	}
	.team_image_medium{
		width: 66%;
		width: 66.66%;
	}
	.team_image_large{
		width: 100%;
	}
	.team_image {
		float: left;
		width: 33%;
		width: 33.33%;
		margin: 0;
	}
	.team_image_inner {
    	padding: 5px;
	}
	
	.aboutContainer {
		margin-left: 10%;
		width: 80%;
		left: 0;
		top: -20px;
    	padding: 30px;
	}
	.about_block {
    	width: 90%;
	}
	#teamImages {
		margin-bottom: 40px;
	}
	#teamImagesDuring {
		margin-bottom: 40px;
	}
	#secMenu{ 
		top: -60px;
	}
	#secMenu.active{ 
		top: 60px;
	}

	.homeDescription {
		font-size: 16px;
	}
	#dotInfo{
		display:none;
	}
	
	.dot.active:hover .dotInner {
		background: #000;
	}
	.dot.dotNewSection{
		display:none;
	}
	#projectsContainer {
		margin-top: 35px;
	}
	#aboutContainer{
		
	}
	#projectClose {
		box-shadow: none !important;
	}
	.projectsButtonsBox {
		width: 100%;
		float: left;
	    margin-right: 0;
	}
	#dotContainer {
		top: auto;
	     bottom: -10px;
		margin-left: 0 !important;
		right: auto;
		width: 100%;
		text-align: center;
	}
	.dot {
		clear: none;
		float: none;
		display: inline-block;
	}
	.dotInner {
    	margin: 15px 18px;
	}
	
	.btnArrow {
	    background-color: rgba(0,0,0,0.7);
		background-size: 13px;
		bottom: auto;
		top: 50%;
		margin-top:-22px;
		background-image: url(images/flecha_arriba.png);
		display:none;
	}
	.btnArrowTop{
		right:auto;
		left:10px;
		background-image: url(images/flecha_izq_blanca.png);
	}
	.btnArrowBottom{
		right: 10px;
		background-image: url(images/flecha_der_blanca.png);
	}

	#socialCont {
		float: left;
		text-align: center;
		width: 60%;
		margin-left: 20%;
		margin-right: 20%;
		margin-top: 0;
		left: 0 !important;
		bottom: -40px;
	}
	.active #socialCont {
		bottom: 30px;
	}
	#socialContNew .social {
		float: none;
	}
	.langSelection {
		width: auto;
		margin: 0 5px;
		text-align: center;
		display: inline-block;
		padding: 0 10px;
	}
	.btn.contactBtn {
	}
	.fullContainer {
		margin-left:0;
	    top: 60px;
	}
	.projectsInfo {
		margin-top: 0px;
		padding-top: 40px;
	}
	#logo {
		display:none;
	}
	#wrapper {
		padding: 60px 0 0;
		-webkit-transition: all 0.4s ease-in-out;
		-o-transition: all 0.4s ease-in-out;
		-moz-transition: all 0.4s ease-in-out;
		transition: all 0.4s ease-in-out;
	}
	
	#mobileMenu {
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 60px;
		background: #FFF;
		z-index: 10000;
		/* border-bottom: 1px solid #ececec; */
		border-bottom: 1px solid #ececec;
		box-sizing: border-box;
		-webkit-transition: all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
		-moz-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}
	.onProject #mobileMenu {
    	width: calc(100% - 10px);
		
	}
	#logoMobile{
		width: 170px;
		float: left;
		margin-top: 10px;
		margin-left: 10px;
	}
	#logoMobile img{
		width:100%;
	}
	
	
	
	
	.mainItemFilter {
		display: none;
	}
	.sliderInfo .btn {
		display: none;
	}
	.sliderInfo .contentSlider {
		/*display: none;*/
	}
	.projectImgContainer {
		/*width: 100%;*/
		margin-left: 0%;
	}
	#contactForm {
		padding: 40px 0;
		margin: 0 15%;
		width: 70%;
     	display: block;
	    float: left;
	}
	.contactBlock {
		position: relative;
		height:auto;
		width:100%;
     	float: left;
	}
	
	.homeDescription {
		width: 60% !important;
		margin: 10px 20% 20px !important;
	    font-size: 16px;
	}
	#contactFormContainer {
		display: block;
		height: auto !important;
	}
	
	#blockInner-4 {
		height: auto !important;
	}
	#mapContainer {
		height: 400px;
	}
	#contactImage {
		display: none;
	}
	.smallCTA{
		display:none;
	}
	
	.aboutTitle{
	    margin-top: 20px;
	}
	
	.selectedTitle {
		width: 100%;
		float: left;
		padding: 40px 0;
		position: relative;
		top: 0px;
	}
	

	.gs_team #gs_mediaInfo {
		max-height: 30%;
		width: 80%;
		padding: 20px 0;
	}
	.gs_team #gs_mediaContainer {
		left: 10% !important;
		width: 80% !important;
		height: 60% !important;
		top: 5% !important;
	}
	#gs_mediaTitle1 {
		font-size: 18px;
	}
	#gs_mediaTitle2 {
		font-size: 30px;
	}
	#gs_mediaInfo .div_title_section {
		margin: 10px 0;
	}
	#gs_mediaContainer img{
		top:0 !important;
	}
	
	/* text */

	.title {
		font-size: 24px;
	}
	.subtitle {
		font-size: 16px;
	}
	.snack {
		font-size: 14px;
	}
	.text {
		font-size: 14px;
	}

	/*----- HOME -----*/
	
	/* header */
	
	#logo {
		margin-left: 0;
		left: 20px;
	}
	#menu {
		left: 0;
		width: 100%;
		position: absolute;
		top: -100px;
		z-index: 1000;
	    opacity: 0;
	}
	.active #menu {
		top: 0;
   		opacity: 1;
	}

	#menu ul li {
		margin-bottom: 0px;
		text-align: center;
		width: 60%;
		margin-left: 20%;
	}
	#menu ul li a {
		font-size: 18px;
	}
	.deg {
		display: none;
	}
	.sliderInfo.bigInfoCont {
		width: 80%;
		left: 10%;
    	right: 10%;
	}
	.sliderInfo .titleProject {
		font-size: 24px;
		line-height: 1;
		margin-bottom: 5px;
	}
	.sliderInfo .contentSlider {
		margin: 0;
	}
	/* Contacto */

	#contactForm {
		margin: 0 5%;
		width: 90%;
	}
	
	
	.project, .grid-sizer, .project.featured {
	    margin: 0;
		width: 50%;
	}
	
	
	
	
	.project, .grid-sizer{
		width:25%;
	}
	
	
	.project.projectBlock-square {
		width: 100%;
	}
	.project.projectBlock-horizontal {
		width: 100%;
	}
	.project.projectBlock-normal {
		width: 50%;
	}
	.project.projectBlock-vertical {
		width: 50%;
	}
	
	/*.titleProject {
		font-size: 34px;
	}*/
	
	.projectBlock-vertical .titleProject, .projectBlock-normal .titleProject, .projectBlock-horizontal .titleProject, .projectBlock-square .titleProject {
		font-size: 28px;
	}
	
	.projectBlock-vertical .subtitleProject, .projectBlock-normal .subtitleProject, .projectBlock-horizontal .subtitleProject, .projectBlock-square .subtitleProject {
    	font-size: 18px;
	}
	
	
	
	
	
	.featured .projectID, .projectID{
		width: 90%;
		left: 5%;
		bottom: 5%;
	}
	.projectInner {
		padding: 0;
		margin: 0;
		margin-bottom: 0px;
		width: 100%;
	}
	.mobileTitle.notOnTablet{
		display:block;
	}
	
	div#map {
		position: relative;
	}
	#mapContent {
		position: relative;
		bottom: auto;
		float: left;
		width: 100%;
		left: 0;
		background: #FFF;
    	margin-top: 0;
	}
	.titleContact {
		color: #000;
	}
	#addressCont {
		color: #000;
		padding-bottom: 40px;
	}
	#addressCont a {
		color: #000;
	}
	.aboutText {
		margin-bottom: 50px;
    margin-bottom: 20px;
	}
	
	.projectsButtonsBox li {
		width: 25%;
	}
	
	.projectsButtonsX {
		top: 0;
		margin-top: 0;
	}
	.activeTab .projectsButtonsX {
		padding: 3px;
    	margin-top: 0;
	}
	
	.projectsButtonsBox .projectsButtons {
		width: 100%;
		text-align: center;
		padding: 10px 0;
	}
	#burguerIcon, #exitMenu {
		z-index: 11000;
		top: 30px;
	}
	#menuContainer.bMenu .burguerBread {
		background: #666;
	}
	img.menuFold {
		display: none;
	}
	#burguerIcon.active {
		right: 0;
	}
	
	#menuContainer {
		width: 100%;
		height: 0;
		-webkit-transition: height 0.3s ease-in-out;
		-o-transition: height 0.3s ease-in-out;
		-moz-transition: height 0.3s ease-in-out;
		transition: height 0.3s ease-in-out;
	}
	#menuContainer.active {
		width: 100%;
		height: 100%;
	}

}
@media screen and (max-width: 600px) {/*menos de */
	.btn.contactBtn {
		margin: 0 5%;
	}
}

@media screen and (max-height: 600px) {/*menos de */
	.contactDescription{
		display:none;
	}
}

@media screen and (max-width: 500px) {/*menos de */
	/* general */
	.centeredBtn {
		width: 80%;
	}
	.btn.contactBtn {
		margin: 0 0px;
	}
	.socialCont{
		width: 60%;
		margin-left: 20%;
		margin-right: 20%;
	}
	
	
	/*.project, .grid-sizer, .project.featured {
		width: 100%;
	}*/
	
	.projectsButtonsBox li{
    	width: 25%;
	}
	.projectsButtonsBox .projectsButtons, .mainItemFilter .projectsButtons {
		width: 100%;
		text-align: center;
		padding: 10px 0px;
	}
	
	.projectsButtonsBox li.mainItemFilter{
		width:100%;
	}
	
	.project, .grid-sizer, .project.featured {
	    margin: 0;
		width: 100%;
	    margin-bottom: 4px;
	}
	
	
	.project.projectBlock-square {
		width: 100%;
	}
	.project.projectBlock-horizontal {
		width: 100%;
	}
	.project.projectBlock-normal {
		width: 100%;
	}
	.project.projectBlock-vertical {
		width: 100%;
	}
	
	
	.block_gallery {
    	width: 100%;
	}
	#wrapper {
	}
	
	/*----- HOME -----*/
	
	/* header */
	
	#logo {
		left: 10px;
	}
	.navCont {
		width: 10px;
	}
	
	

	/* Proyectos */

	.containerOver {
		padding: 0;
	}
	.aboutImg {
		height: 150px;
	}
	#aboutInfo {
		padding: 20px;
	    padding-bottom: 80px;
	}

	/* Contacto */

	#contactForm {
		margin: 0 5%;
		width: 90%;
	}
	.formCont .mediaCont {
		margin: 0px 0% 20px;
		width: 100%;
	}
	.fullCont {
		margin: 0%;
		width: 100%;
	}
	.ded {
		width: 70%;
	}

	.aboutContainer .centeredBtn {
		width: 100%;
	}
}
	
	
	
#birdsContainer, #birds  {
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	background-size:cover;
}
#birds canvas {
    width: 100% !important;
    height: 100% !important;
}


.homeTitle {
	
}

.homeTitles {
    font-family: 'Gibson';
	text-transform: uppercase;
	font-size: 42px;
     color: #FFF;
}
.homeTitles.homeTitle1 {
    font-size: 80px;
    line-height: 80px;
}
.homeTitles.homeTitle2 {
    font-size: 52px;
    line-height: 40px;
}
.homeTitles.homeTitle3 {
    font-size: 84px;
    line-height: 84px;
}



.homeDescription {
     color: #FFF;
    width: 40%;
    margin: 10px 30% 20px;
	font-size:18px;
}

#logo .logo1 {
    width: 46px;
    position: absolute;
    top: 0px;
    left: 0px;
}


.bMenu #logo .logo2 {
	
	
}
#logo .logo2 {
    width: 0;
    position: absolute;
    top: 14px;
    left: 72px;
    overflow: hidden;
    opacity: 0;
}
#logo .logo2 img{
      width: 150px;
	float:left;
}
.bMenu #logo .blackLogo, #menuContainer.active.bMenu #logo .blackLogo {
    opacity: 0;
}

.logo{
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.bmenu #logo .logo2.blackLogo{	
      width: 0px;
}
/*.bmenu #logo:hover .logo2.blackLogo {
    width: 0px;
    opacity: 0;
}
.bMenu #logo:hover .logo2.blackLogo {
    opacity: 0;
    width: 0;
}*/

#menuContainer.active #logo {
    margin-left: 65px;
    margin-top: 35px;
    width: 240px;
}
#menuContainer.active #logo .logo1 {
    width: 66px;
}
#menuContainer.active #logo .logo2 {
    width: 184px;
    opacity: 1;
}


@media screen and (min-width: 1600px) {/*mas de */
	/*.homeDescription {
		font-size: 25px;
	}*/

}








.bigInfoCont{
	width: 50%;
	left: 25%;
	right: 25%;
	text-align: center;
	color: #FFF;
}

.bigInfoTitle{
    font-size: 45px;
    font-family: 'Gibson';
    text-transform: uppercase;
	line-height:1;
}
.bigInfoCats{
	font-size: 24px;
	text-transform:uppercase;
}
.bigInfoSubtitle{
	font-size: 18px;
}

.bigInfoClient{
	font-size: 14px;
}
.projectInfoCTA {
    margin-top: 10px;
}














#projectInfo{
    background: #000;
    width: 100%;
    height: 100%;
    top: -100%;
    left: 0;
    position: fixed;
    z-index: 400000;
    display: none;
    box-sizing: border-box;
    padding-left: 60px;
    overflow: scroll;
	  -webkit-overflow-scrolling: touch; 
	/*overflow: hidden;*/
	overflow-y:scroll;
	-webkit-overflow-scrolling:touch;
	
}
#projectMainBanner{
    position: absolute;
    top: 0px;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 200;
    background: #000;
}


#projectInfoImage{
    position: absolute;
    top: 0px;
    left: 0;
    width: 100%;
    height: 100%;
	background-size:cover;
	background-position:center center;
}


#preloaderBG{
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: 600000;
    position: fixed;
}
.planePreloader{
    position: absolute;
    width: 128px;
    height: 128px;
    top: 50%;
    left: 50%;
    margin-top: -64px;
    margin-left: -64px;
    background-image: url(images/preloader_en.gif);
    background-size: cover;
    background-repeat: no-repeat;
    -webkit-transition: background 0.5s ease-in-out;
    -o-transition: background 0.5s ease-in-out;
    -moz-transition: background 0.5s ease-in-out;
    transition: background 0.5s ease-in-out;
    z-index: 500;
    border-radius: 20px;
    overflow: hidden;
}


.projectInfoContainer {
    width: 50%;
    left: 25%;
}
.projectInfoContainerInner{
    text-align: center;
}



.projectInfoTitle{
    -webkit-transition: all 0.3s ease-in-out 0.3s;
    -o-transition: all 0.3s ease-in-out 0.3s;
    -moz-transition: all 0.3s ease-in-out 0.3s;
    transition: all 0.3s ease-in-out 0.3s;
}

.projectInfoCats{
}

.projectInfoTagline{
}

.projectInfoClient{
}

#projectScroll{
    position: absolute;
    right: 0;
    bottom: 20px;
    left: 0;
    margin: auto;
    width: 24px;
    height: 40px;
}


.mousey {
    width: 3px;
    padding: 10px 10px;
    height: 20px;
    border: 2px solid #fff;
    border-radius: 25px;
    opacity: 0.75;
    box-sizing: content-box;
}
.scroller {
	position:relative;
    width: 3px;
    height: 0px;
    border-radius: 25%;
    background-color: #fff;
    animation-name: scroll;
    animation-duration: 1.5s;
    animation-timing-function: cubic-bezier(.15,.41,.69,.94);
    animation-iteration-count: infinite;
	transform: translateY(-5px);
}
@keyframes scroll {
  0% { opacity: 0; transform: translateY(-5px);}
  25% { opacity: 1; height: 7px;}
  55% { opacity: 1; height: 10px;transform: translateY(0px);}
  100% { transform: translateY(4px); opacity: 0; height: 20px;}
}



#projectInfo.notScrollable{
	overflow: hidden;
}
#changeContainer, #changeContainer2{
    width: 100%;
    height: 100%;
	top: 0;
	left: 0;
    z-index: 350000;
    z-index: 88000;
    position: fixed;
    background: #fff;
}
#changeContainer2{
	background: #FFF;
}



.changeContainerFold{
	width: 100%;
	height: 0;
	position:absolute;
	left: 0;
	-webkit-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}
.changeContainerFoldSides{
	display:none;
}

#changeContainerFoldTop{
	transform: scaleY(-1);
	/* transform: scaleY(-1) scaleX(-1);*/
	top: 0;
}
#changeContainerFoldTop.active{
	top: -199%;
	height: 200%;
}

#changeContainerFoldBottom{
	/* transform: scaleX(-1); */
	bottom: 0;
}
#changeContainerFoldBottom.active{
	bottom: -199%;
	height: 200%;
}



@media screen and (max-width: 768px) {/*menos de */

	.changeContainerFold{
		display:none;
		width: 0%;
		height: 100%;
		left: auto;
		top: 0;
		-webkit-transition: all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
		-moz-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}
	.changeContainerFoldSides{
		display:block;
	}

	#changeContainerFoldLeft{
		transform: scaleX(-1);
		/* transform: scaleY(-1) scaleX(-1);*/
		left: 0;
	}
	#changeContainerFoldLeft.active{
		left: -199%;
		width: 200%;
	}

	#changeContainerFoldRight{
		/* transform: scaleX(-1); */
		right: 0;
	}
	#changeContainerFoldRight.active{
		right: -199%;
		width: 200%;
	}
}




#lineContainer {
    position: absolute;
    top: 0;
    left: 50%;
    width: 1px;
    height: 100%;
    background: #ebebeb;
}

#projectSummary.active {
    border-bottom: 0px solid rgba(0,0,0,0);
	background-image:url(images/projectBtnHide.png);
	top:0px;
}
#projectSummary.visible {
}

#projectSummary .projectInfoCTA{
	display: none !important;
		
}
#projectSummary, #projectSummaryTrigger {
    position: fixed;
    width: 100%;
    text-align: center;
    color: #000;
	top:-60px;
	top:-63px;
	left:0;
}

#projectSummaryTrigger {
	display:none;
	top:0px;
    z-index: 450000;
    height: 60px;
}


#projectSummary {
	background-image:url(images/projectBtnShow.png);
	background-size:60px 60px;
	background-position:bottom left;
	background-repeat:no-repeat;
	
    z-index: 450000;
    background-color: #FFF;
    border-bottom: 1px solid #ececec;
    box-sizing: border-box;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
#projectSummary .bigInfoTitle {
    padding-top: 50px;
    padding-left: 60px;
    padding-right: 60px;
    box-sizing: border-box;
    min-height: 60px;
    max-height: 180px;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	
	
    padding-top: 35px;
	
}
#projectSummary.notact .bigInfoTitle {
    font-size: 24px;
    padding-top: 18px;
    max-height: 60px;
    overflow: hidden;
}


#moreInfoContainer {
    float: left;
    position: relative;
    width: 100%;
	overflow:hidden;
	height:0;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
#moreInfoContainerInner {
    float: left;
    position: relative;
    width: 100%;
}
	
#projectSummary .projectInfoText{
}
#projectSummaryFold{
}
#projectClose {
    position: fixed;
    top: -60px;
    right: 0;
	
    z-index: 500000;
    background-color: #FFF;
    width: 60px;
    height: 60px;
	cursor:pointer;
	display:none;
	
	background-image:url(images/projectBtnClose.png);
	background-size:cover;
	background-position:center center;
	
	
    box-shadow: 0px 2px 6px rgba(0,0,0,0.1);
	
}

#projectContent{
	position:relative;
	width:100%;
	float:left;
	margin-top:100%;
    z-index: 1000;
	
}



#projectSummaryFold{
    width: 100%;
    position: absolute;
    height: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    left: 0;
    bottom: 0;
    pointer-events: none;
}

#projectBannerFold{
    width: 100%;
    position: absolute;
    height: 0;
    left: 0;
    bottom: 0;
}


#projectSummary.active #projectSummaryFold{
	height:128px;
	bottom:-127px;
}

#otherProjects {
    float: left;
    width: 100%;
    min-height: 250px;
    background: #FFF;
    color: #000;
    position: relative;
    z-index: 1000;
}

.otherProject {
    width: 50%;
    min-height: 250px;
    text-align: right;
    box-sizing: border-box;
    border-top: 1px solid #ececec;
    cursor: pointer;
    float: left;
    position: relative;
    color: #000;
    text-decoration: none;
}

.otherProject .outer {
    box-sizing: border-box;
    padding: 0 90px;
}

.otherProject#projectPrev .outer {
}

.otherProject#projectNext .outer {
    text-align: left;
    border-left: 1px solid #ececec;
}

.otherProjectTitle{
    font-size: 24px;
    font-family: 'Gibson';
    text-transform: uppercase;
    line-height: 1;
}




#mobileHelper {
	display: none;
}

@media screen and (max-width: 1024px) {/*menos de */
	.bigInfoTitle{
		font-size: 36px;
	}
	.homeDescription {
		font-size: 18px;
	}

	#section-0 {
		background: #FFF;
	}
	#homeCTA2 {
		box-sizing: border-box;
		border: 1px solid #000;
	}
	.ded {
		/*filter: invert(1);*/
	}

	.homeDescription {
		/*color: #000;*/
	}
	#homeTestimonialsInner{
	    width: 100%;		
	}
	.homeTestimonialImage {
		width: 60px;
		height: 60px;
	}
	.homeTestimonialContainer {
		width: calc(100% - 80px);
    	margin-bottom: 30px;
	}
	.otherProject .outer {
		padding: 0 40px;
	}
	.otherProject{
    	overflow: hidden;
	}
}

@media screen and (max-width: 768px) {/*menos de */
	
	.homeTestimonialSizer{
    	width: 100%;
		
	}
	.homeTestimonial {
    	width: 100%;
	}
	
	html, body {
		font-size: 15px;
	}
	
	
	#projectInfo{
		padding-left: 0px;

	}
	
	#singleContent {
		padding-left: 0;
		padding-top: 0px;
	}

	
	.bigInfoTitle{
		font-size: 24px;
	}
	.homeDescription {
		width: 60% !important;
		margin: 10px 20% 20px !important;
		font-size: 16px;
		/*color: #000;*/
	}

	
	.projectInfoContainer {
		width: 80%;
		left: 10%;
	}
	.otherProject#projectNext, .otherProject#projectPrev{
	}
	.otherProject .outer {
		padding: 0 20px;
	}
	
	#otherProjects{
		height: 140px;
		min-height: 140px;
	}
	.otherProject{
	    min-height: 140px;
    	overflow: hidden;
	}
	
	#projectSummary .projectInfoTitle{
		font-size: 22px;
	}
	#projectSummary.active {
		background-size: 40px 40px;
	}
	#projectSummary.notact .bigInfoTitle {
	    font-size: 20px;
		padding-top: 22px;
		padding-top: 16px;
	}
	#mobileHelper {
		display: block;
		position: absolute;
		bottom: -45px;
		left: 0;
		width: 100%;
		height: 40px;
		height: 60px;
		-webkit-transition: all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
		-moz-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}
	#mobileHelper.active {
		bottom: 0px;
	}
	.mhContainer {
		width: 50%;
		float: left;
		position: relative;
		padding: 0 5%;
		box-sizing: border-box;
		background-repeat: no-repeat;
		background-size: 20px;
		border-top: 1px solid #ececec;
		overflow: hidden;
	}
	#mhLeftContainer {
		border-right: 1px solid #ececec;
		background-image: url(images/arrow-left.png);
		background-position: 5% 50%;
	}
	#mhRightContainer {
		background-image: url(images/arrow-right.png);
		background-position: 95% 50%;
	}
	.mhArrow {
		line-height: 1.4;
		position: relative;
	}
	#mhLeft {
		text-align: right;
	}


	#lineContainer {
		top: 50%;
		left: 0;
		width: 100%;
		height: 1px;
		background: #ccc;
	}
}


@media screen and (min-width: 1600px) {/*menos de */
	html, body {
		font-size: 21px;
	}
	.text {
		font-size: 18px;
	}
	.bigInfoClient {
		font-size: 18px;
	}
	.otherProjectTitle {
    	font-size: 32px;
	}
	
	.homeDescription {
		font-size: 21px;
	}
}
.mCSB_inside>.mCSB_container {
    margin-right: 10px;
}
.mCSB_scrollTools {
    width: 10px;
	opacity: 1;
    background: #ececec;
    z-index: 1000;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 100%;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail, .mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail {
    width: 100%;
    background: none;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    /* background-color: rgba(0,0,0,.75); */
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

#aboutContainer .mCSB_inside>.mCSB_container {
    margin-right: 0px;
}
#aboutContainer .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
    background: #666;
}

#aboutContainer .mCSB_scrollTools{
	background: rgba(0,0,0,0.4);
	
}


#projectInfo .mCSB_inside>.mCSB_container {
    margin-right: 0px;
}
#projectInfo .mCSB_scrollTools {
    background: rgba(0,0,0,0.2);
}

#projectInfo .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	background-color: #333;
    background-color: #999;
}



#cookiesContainer {
    position: fixed;
    background: #000;
    bottom: 20px;
    right: 20px;
    z-index: 1000000;
    width: 500px;
    color: white;
    border: 1px solid #474747;
    box-sizing: border-box;
}
#cookiesGraphic {
    width: 14%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 7%;
    background-image: url(images/cookies.png);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}
#cookiesContent {
    font-size: 14px;
    position: relative;
    float: right;
    width: 72%;
    box-sizing: border-box;
    padding: 20px 20px 10px 0;
}
.cookiesContentAnchor {
    color: #FFF;
    text-decoration: underline;
}
#cookiesContent p{
    margin-bottom: 10px;
}

#cnTower{
    background-image: url(images/cnTower.png);
    background-position: center;
    background-size: auto 100%;
    background-repeat: no-repeat;
    position: absolute;
    width: 40px;
    height: 270px;
    left: 70%;
    bottom: 0;
	
}

.general_container {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    overflow: scroll;
	-webkit-overflow-scrolling:touch;
}

.general_content_outer {
    width: 800px;
    margin: 60px auto;
}


.general_title{
    font-family: Gibson;
    font-weight: normal;
    font-style: normal;
    line-height: 1;
    text-transform: uppercase;
    font-size: 40px;
	
	
}

.general_content strong{
    font-family: Gibson;
    font-weight: normal;
    font-style: normal;
    line-height: 1;
    text-transform: uppercase;
	
}

.general_content p {
    float: left;
    width: 100%;
    margin-top: 20px;
}

.general_content strong {
    font-family: Gibson;
    font-weight: normal;
    font-style: normal;
    line-height: 1;
    text-transform: uppercase;
}
@media screen and (max-width: 1600px) {/*menos de */
	#cookiesContainer {
		width: 400px;
	}
}


@media screen and (max-width: 1024px) {/*menos de */
	
	.general_content_outer {
		width: 600px;
	}
}

@media screen and (max-width: 768px) {/*menos de */

	#cookiesContainer {
		width: 100%;
		width: calc(100% - 20px);
		bottom: 10px;
		right: 10px;
	}
	
	.general_content_outer {
		width: 90%;
	    margin-top: 90px;
	}
}


@media screen and (max-width: 512px) {/*menos de */
	#cookiesGraphic {
		width: 100%;
		height: 60px;
		position: relative;
		left: 0;
		margin-top: 10px;
	}
	#cookiesContent {
		width: 100%;
		padding: 10px 20px;
	}
	
}