@font-face {
	font-family: 'fontawesome';
	src:url('../fonts/fontawesome/fontawesome.eot?-e43dk9');
	src:url('../fonts/fontawesome/fontawesome.eot?#iefix-e43dk9') format('embedded-opentype'),
		url('../fonts/fontawesome/fontawesome.woff?-e43dk9') format('woff'),
		url('../fonts/fontawesome/fontawesome.ttf?-e43dk9') format('truetype'),
		url('../fonts/fontawesome/fontawesome.svg?-e43dk9#fontawesome') format('svg');
	font-weight: normal;
	font-style: normal;
} /* Made with http://icomoon.io/app */



*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
body, html { font-size: 100%; padding: 0; margin: 0;}

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }

 
a { 
	text-decoration: none;
	outline: none;
}

a:hover { color: #000; }

 
 

 
/* General style */
.grid-gallery ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.grid-gallery figure {margin: 0;  }
.pink{   background-color: #F66;  }
.blue{   background-color: #0CC;  }
.green{   background-color: #990 ;  }
.orange{   background-color: #F60;  }
.yellow{   background-color: #FC3;  }

.grid-gallery figure img {
	display: block;
	width: 100%; opacity: 0.7; webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 1s ease;-ms-transition: all 0.5s ease; transition: all 0.5s ease; 
}

.grid-gallery figure img:hover {
	display: block;
	width: 100%; opacity:1;
}


.grid-gallery figcaption h3 {
	margin: 0;
	padding: 0 0 0.5em; display:none
}

.grid-gallery figcaption p {
	margin: 0;display:none
}

/* Grid style */
.grid-wrap {
	max-width: 69em;
	margin: 0 auto;
	padding: 0 1em 1.875em;
}

.grid {
	margin: 0 auto;
}

.grid li {
	width: 25%;
	float: left;
	cursor: pointer;
}

.grid figure { margin : 40px; 
	-webkit-transition: opacity 0.2s;
	transition: opacity 0.2s;  webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 1s ease;-ms-transition: all 0.5s ease; transition: all 0.5s ease;   box-shadow: -1px 2px 4px 1px rgba(0, 0, 0, 0.1) 
}

.grid li:hover figure { box-shadow: 5px 5px 1px 5px rgba(0, 0, 0, 0.25)
}

.grid figcaption {
	background: #FFF;
	padding: 25px; border:1px solid #F7F7F7; display:none
}

/* Slideshow style */
.slideshow {
	position: fixed; background:rgba(25,24,23,0.8);
	background-image: url(../assets/images/planet.png);
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 500;
	opacity: 0;
	visibility: hidden;
	overflow: hidden;
	-webkit-perspective: 1000px;
	perspective: 1000px;
	-webkit-transition: opacity 0.5s, visibility 0s 0.5s;
	transition: opacity 0.5s, visibility 0s 0.5s;   
}

.slideshow-open .slideshow {
	opacity: 1;
	visibility: visible;
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
}

.slideshow ul {
	width: 100%;
	height: 100%;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translate3d(0,0,150px);
	transform: translate3d(0,0,150px);
	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
}

.slideshow ul.animatable li {
	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
}

.slideshow-open .slideshow ul {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

.slideshow li {
	width: 660px;
	height: 560px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -280px 0 0 -330px;
	visibility: hidden; 
}

.slideshow li.show {
	visibility: visible;
}

.slideshow li:after {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(255,255,255,0.8);
	-webkit-transition: opacity 0.3s;
	transition: opacity 0.3s;
}

.slideshow li.current:after {
	visibility: hidden;
	opacity: 0;
	-webkit-transition: opacity 0.3s, visibility 0s 0.3s;
	transition: opacity 0.3s, visibility 0s 0.3s;
}

.slideshow figure {
	width: 100%;
	height: 100%;
	background: #FAFAFA;
	border: 40px solid #FAFAFA;
	overflow: hidden;padding-top:10px
}

.slideshow figure img{ opacity:1}

.slideshow figcaption {
	padding-bottom: 20px; display:block; 
}
.slideshow figcaption a { color:#FC3}

.slideshow figcaption h3 {
	font-weight: 300;
	font-size: 200%; display:block
}

/* Navigation */
.slideshow nav span {
	position: fixed;
	z-index: 1000;
	color: #000 ;
	text-align: center;
	padding: 3%;
	cursor: pointer;
	font-size: 2.2em; 
}

.slideshow nav span.nav-prev,
.slideshow nav span.nav-next {
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

.slideshow nav span.nav-next {
	right: 0;
}

.slideshow nav span.nav-close {
	top: 50px;
	right: 0;
	padding: 0.5em 1em;
	color: #E6E6E6; z-index:999999
}

.icon:before,
.icon:after {
	font-family: 'fontawesome';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

span.nav-prev:before {
	content: "\e601";
}

span.nav-next:before  {
	content: "\e600";
}

span.nav-close:before {
	content: "\e602";
}

/* Info on arrow key navigation */
.info-keys {
	position: fixed;
	bottom: 10px;
	left: 10px;
	width: 60px;
	font-size: 12px;
	padding-top: 20px;
	text-transform: uppercase;
	color: #fff;
	letter-spacing: 1px;
	text-align: center;
}

.info-keys:before,
.info-keys:after {
	position: absolute;
	top: 0;
	width: 16px;
	height: 16px;
	border: 1px solid #fff;
	text-align: center;
	line-height: 14px;
	font-size: 12px;  
}

.info-keys:before {
	left: 10px;
	content: "\e603";
}

.info-keys:after {
	right: 10px;
	content: "\e604";
}

/* Example media queries (reduce number of columns and change slideshow layout) */
 
.slideshow figure   .h { width:290px !important; margin:0 auto}
@media screen and (max-width: 60em) {
	/* responsive columns; see "Element sizing" on http://masonry.desandro.com/options.html */
	.grid li {
		width: 49%;
	}

	.slideshow li {
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		margin: 0;
	}

	.slideshow li figure img {
		width: auto;
		margin: 0 auto;
		max-width: 100%; 
	}

	.slideshow nav span,
	.slideshow nav span.nav-close {
		font-size: 1.8em;
		padding: 0.3em;z-index:99999
	}

	.info-keys {
		display: none;
	}
.grid-gallery figure img { opacity: 1 }
}

@media screen and (max-width: 35em) {
	.grid li {
		width: 100%;
	}
}

@media screen and (max-width: 24em) {
	.grid li {width: 100%;}
	.grid-gallery figure img { opacity: 1 }
	.slideshow figure   .h { width:100% !important; margin:0 auto}}
	
	
	
body {font-family:"hvt", Helvetica, sans-serif; font-size: 100%; line-height: 1.2em; color: #79796A; margin: 0;
padding: 0;  opacity: 1;transition: 1s opacity;}
body.fade-out { opacity: 0; transition: none;}
.menu{ padding:20px;  } 
::-webkit-scrollbar {width: 7px; background-color: #F0F0E1}
::-webkit-scrollbar-track {  border-radius: 10px;}
::-webkit-scrollbar-thumb { border-radius: 10px;  background-color: #352520; }
::-moz-selection { /* Code for Firefox */ color: #FFF; background: #FFF100;}
::selection { color: #FFF; background: #352520;}
.mobno  { display: block  }
.mobyes { display: none  }
.side{ background-color: transparent; float:left; width:25%; height:auto;  }
.aside{ background-color:#cd9c6c;float:left; width:75%;height:auto;    }  

.nav2 { text-align:left }
.button2{ background-color: #FFF; color:#666; padding:5px  15px; margin:2px; font-size:12px  }
.button2:hover{ background-color: #000; color: #FFF; padding:5px  15px; margin:2px;  }
.button2 .active{ background-color: #000; color:#666; padding:5px  15px; margin:2px;  }
 
@media only screen and (min-width: 280px) and (max-width: 768px) {
.side{ background-color: transparent; float: none; width:99%; height:auto; clear:both; }
.aside{ background-color: #FFF; float: none; width:99%;height:auto; padding:0%; }
@font-face {font-family:"hvt";src: url(assets/css/hvt.ttf);} 

.nav2 { text-align: center}
.button2{ background-color: #FFF; color:#666; padding:5px  15px; margin:5px; border:1px solid #EFEFEF  }
.button2:hover{ background-color: #000; color: #FFF; padding:5px  15px; margin:5px;border:1px solid #EFEFEF   }
.button2 .active{ background-color: #000; color:#666; padding:5px  15px; margin:5px; border:1px solid #EFEFEF  }
}
.nb{
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); filter: gray; -webkit-filter: grayscale(100%);}

.button { display:block; color:#BDBDAE; padding:8px ; text-decoration:none;    display:inline-block;   border:1px solid #DFDFD0; font-size:14px}
.button:hover { display:block; color: #333; padding:8px ; text-decoration:none;  display:inline-block;   border:1px solid #333}
hr {margin:20px ; clear:both;height:1px; background: #F3F3F3 ;border:medium;}

.cd-container { width: 90%; max-width: 1200px; margin: 0 auto;}
.cd-container::after {content: ''; display: table;clear: both;}

main { position: relative; z-index: 2; -webkit-transition-property: -webkit-transform; -moz-transition-property: -moz-transform; transition-property: transform;-webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; transition-duration: 0.3s;}
main.slide-out {
 -webkit-transform: translateX(-270px);-moz-transform: translateX(-270px); -ms-transform: translateX(-270px); -o-transform: translateX(-270px);transform: translateX(-270px);}
main.slide-out .cd-overlay {
display: block; -webkit-animation: cd-fade-in 0.3s; -moz-animation: cd-fade-in 0.3s; animation: cd-fade-in 0.3s;}

/*  COLONES */
.Grid {   overflow: auto  ; overflow:hidden;  }
.Grid-col { width: 100%; padding-left:3px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; float: left; padding:20px;   }
.cell { width: 33%; padding-left:3px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; float: left; padding:20px; border-bottom:0px solid  #3AD6FE; color: #FFF   }
.Grid .equal-col { width: 50%;   -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; float: left; overflow:visible ;     } 
@media (min-width: 500px) { .Grid .Grid-col { width: 50%;  }    }
@media (min-width: 800px) { .Grid .Grid-col { width: 32.51%;   }   .cell { width: 33%; margin:0px }}


@media only screen and (min-width: 768px) {
  main.slide-out { -webkit-transform: translateX(-600px); -moz-transform: translateX(-600px); -ms-transform: translateX(-600px); -o-transform: translateX(-600px); transform: translateX(-600px);}
  }
@media only screen and (min-width: 1200px) {
  main.slide-out {-webkit-transform: translateX(-800px); -moz-transform: translateX(-800px); -ms-transform: translateX(-800px); -o-transform: translateX(-800px); transform: translateX(-800px);}}

.cd-section {padding: 2em 0;text-align: center;}
.cd-section .cd-container { max-width: 768px;}
.cd-section h2 {font-family: "hvt", sans-serif;font-weight: bold;text-transform: uppercase; margin-bottom: 1em;
 font-size: 20px; font-size: 1.25rem;}
.cd-section p { line-height: 1.4;}
@media only screen and (min-width: 768px) {
.cd-section { padding: 4em;}
.cd-section p { line-height: 1.6;}}
@media only screen and (min-width: 1200px) {
.cd-section { padding: 6em;}
.cd-section h2 { margin-bottom: 2em;}
.cd-section p { line-height: 1.8; font-size: 18px; font-size: 1.125rem;}}
 
#cd-team .cd-container {max-width: 1200px;}
 

.no-touch #cd-team li:hover { box-shadow: 0 0 10px rgba(92, 75, 81, 0.3);}
.no-touch #cd-team li:hover .cd-img-overlay { opacity: 1;}
#cd-team figure { position: relative;}
#cd-team img { display: block; width: 100%; border-radius: .25em .25em 0 0;}
#cd-team .cd-img-overlay {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(245, 162, 34, 0.9);opacity: 0; border-radius: .25em .25em 0 0; -webkit-transition: opacity 0.3s; -moz-transition: opacity 0.3s; transition: opacity 0.3s;}
#cd-team .cd-img-overlay span {
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  color: #FFF;
}
#cd-team .cd-member-info { height: 80px;background: #FFF; text-align: center;
  font-family: "hvt", sans-serif;font-weight: bold; padding-top: 20px; border-radius: 0 0 .25em .25em;}
#cd-team .cd-member-info span { display: block;font-family: "hvt", serif; font-weight: normal;color: #999999; font-size: 14px; font-size: 0.875rem; margin-top: .5em;}
 
.cd-member-bio {
  position: fixed;
  top: 0;
  right: 0;
  width: 270px;
  height: 100%;
  overflow-y: auto;
  /* smooth scrolling on mobile phones and tablets */
  -webkit-overflow-scrolling: touch;
  background: #FFF1;
  z-index: 1;
  /* this how we move the author bio section off the canvas */
  -webkit-transform: translateX(270px);
  -moz-transform: translateX(270px);
  -ms-transform: translateX(270px);
  -o-transform: translateX(270px);
  transform: translateX(270px);
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.cd-member-bio.slide-in {
  /* the author bio section slides in when the user clicks on the team member picture */
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
}
.cd-member-bio .cd-member-bio-pict { position: relative;}
.cd-member-bio .cd-member-bio-pict::after {
  /* gradient at the bottom of the image - same color of the background of the section */
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 80px;
  background: -webkit-linear-gradient( bottom , #5c4b51, rgba(92, 75, 81, 0));
  background: linear-gradient(to top, #5c4b51, rgba(92, 75, 81, 0));
}
.no-cssgradients .cd-member-bio .cd-member-bio-pict::after {display: none;}
.cd-member-bio img {width: 100%; display: block;}
.cd-member-bio .cd-bio-content {padding: 1em;color: #FFF;}
.cd-member-bio .cd-bio-content h1 { font-family: "hvt", sans-serif; font-weight: bold; text-transform: uppercase; text-align: center;font-size: 20px;font-size: 1.25rem;}
.cd-member-bio .cd-bio-content p { font-size: 14px;font-size: 0.875rem;margin: 1em 0; line-height: 1.4;color: #79796A;}
@media only screen and (min-width: 768px) {
  .cd-member-bio { width: 600px; -webkit-transform: translateX(600px);  -moz-transform: translateX(600px); -ms-transform: translateX(600px); -o-transform: translateX(600px); transform: translateX(600px);}
  .cd-member-bio .cd-bio-content { padding: 2em;}
  .cd-member-bio .cd-bio-content p { line-height: 1.6; margin: 2em 0;}}
@media only screen and (min-width: 1200px) {
  .cd-member-bio {  width: 800px;  -webkit-transform: translateX(800px); -moz-transform: translateX(800px);  -ms-transform: translateX(800px); -o-transform: translateX(800px); transform: translateX(800px);}
  .cd-member-bio .cd-member-bio-pict::after { height: 150px;}
  .cd-member-bio .cd-bio-content { padding: 4em;-webkit-transform: translateY(-80px); -moz-transform: translateY(-80px);
 -ms-transform: translateY(-80px); -o-transform: translateY(-80px);transform: translateY(-80px);}
  .cd-member-bio .cd-bio-content h1 { font-size: 40px; font-size: 2.5rem;}
  .cd-member-bio .cd-bio-content p { font-size: 16px; font-size: 1rem;}
  .no-cssgradients .cd-member-bio .cd-bio-content {-webkit-transform: translateY(0); -moz-transform: translateY(0);
  -ms-transform: translateY(0); -o-transform: translateY(0);transform: translateY(0);}}

.cd-member-bio-close { width: 32px; height: 32px; overflow: hidden; position: fixed; top: 10px; right: 10px; background: url(img/x.png) no-repeat center center; text-indent: 100%; white-space: nowrap;z-index: 3; display: none;}
.cd-member-bio-close.is-visible {display: block; -webkit-animation: cd-move-in 0.8s; -moz-animation: cd-move-in 0.8s;
 animation: cd-move-in 0.8s;}
@media only screen and (min-width: 1200px) { .cd-member-bio-close {right: 20px; top: 20px; }}
.cd-overlay { position: absolute;top: 0;left: 0;width: 100%;
  height: 100%; background: url(assets/images/planet.png);cursor: pointer;display: none;}

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

xkeyframes 

-------------------------------- */
@-webkit-keyframes cd-fade-in {0% { opacity: 0; }100% {opacity: 1;}}
@-moz-keyframes cd-fade-in {0% { opacity: 0;}100% { opacity: 1;}}
@keyframes cd-fade-in { 0% {opacity: 0;} 100% { opacity: 1;}}
@-webkit-keyframes cd-move-in {0% { -webkit-transform: translateX(100px);}100% { -webkit-transform: translateX(0);}}
@-moz-keyframes cd-move-in {0% { -moz-transform: translateX(100px);}100% { -moz-transform: translateX(0); }}
@keyframes cd-move-in {
0% { -webkit-transform: translateX(100px); -moz-transform: translateX(100px);-ms-transform: translateX(100px);  -o-transform: translateX(100px); transform: translateX(100px);}

100% { -webkit-transform: translateX(0); -moz-transform: translateX(0);  -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); }}

header{ height:0px;    -webkit-transition: all 0.4s ease; transition: all 0.4s ease; overflow:hidden; }
header.sticky { position: fixed;font-size: 24px;line-height: 48px;height: 48px; width: 100%; background: #FFF;text-align: left;padding-left: 20px;overflow: visible; z-index:9998;padding:5px;box-shadow: -1px 2px 4px 1px rgba(0, 0, 0, 0.1);-webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 1s ease;-ms-transition: all 0.5s ease; transition: all 0.5s ease; }

@media only screen and (min-width: 280px) and (max-width: 768px) { 
.mobno  { display: none  }
.mobyes { display: block  }}