/* Set all parents to full height */
html, body, 
.container,
.cbp-fbscroller,
.cbp-fbscroller section { 
	height: 100%; 
}

/* The nav is fixed on the right side  and we center it by translating it 50% 
(we don't know it's height so we can't use the negative margin trick) */
 .menu {
	position: fixed;
	z-index: 8;
	right: 0px;
	top: 50%;
	width: 41px;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	background: rgba(91, 91, 91,  0.22);
	padding: 0 8px;
}

.menu a {
	display: block;
	position: relative;
	z-index: 9999;
	color: transparent;
	width: 26px;
	height: 26px;
	outline: none;
	margin: 25px 0;
	border-radius: 50%;

}
.cero{border: 4px solid #fff;}
.uno{border: 4px solid #a0cb50;}
.dos{border: 4px solid #0194be;}
.tres{border: 4px solid #915495;}
.cuatro{border: 4px solid #e6a06f;}
.cinco{border: 4px solid #729e90;}


.no-touch .menu a:hover {
	background: rgba(255,255,255,0.8);
}

.cbp-fbscroller > nav a.cbp-fbcurrent {
	background: #fff;
}

/* background-attachment does the trick */
.cbp-fbscroller section {
	position: relative;
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;

}

.no-touch .cbp-fbscroller section {
	background-attachment: fixed;
}
#fbsection1 {
	background-image: url(../images/0.jpg);
	border-bottom: 5px solid #a0cb50;
	z-index: 20;
}


#fbsection2 {
	background-image: url(../images/1.jpg);
	border-bottom: 5px solid #0194be;
}

#fbsection3 {
	background-image: url(../images/2.jpg);
	border-bottom: 5px solid #915495;
}

#fbsection4 {
	background-image: url(../images/3.jpg);
	border-bottom: 5px solid #e6a06f;
}

#fbsection5 {
	background-image: url(../images/4.jpg);
	border-bottom: 5px solid #729e90;
}

#fbsection6 {
	background-image: url(../images/5.jpg);

}
#titulo1{
	position: absolute;
	background: #a0cb50;
	color: #fff;
	padding: 6px 45px;
	z-index: 999;
	font-size: 21px;
	font-family: 'NHaasGroteskDSStd-25Th';
	-webkit-border-radius: 0 0 5px 5px;
	-moz-border-radius: 0 0 5px 5px;
	border-radius: 0 0 5px 5px;
	letter-spacing: 1px;
}
#titulo2{
	position: absolute;
	background: #0194be;
	color: #fff;
	padding: 6px 45px;
	z-index: 999;
	font-size: 21px;
	font-family: 'NHaasGroteskDSStd-25Th';
	-webkit-border-radius: 0 0 5px 5px;
	-moz-border-radius: 0 0 5px 5px;
	border-radius: 0 0 5px 5px;
	letter-spacing: 1px;
}
#titulo3{
	position: absolute;
	background: #915495;
	color: #fff;
	padding: 6px 45px;
	z-index: 999;
	font-size: 21px;
	font-family: 'NHaasGroteskDSStd-25Th';
	-webkit-border-radius: 0 0 5px 5px;
	-moz-border-radius: 0 0 5px 5px;
	border-radius: 0 0 5px 5px;
	letter-spacing: 1px;
}
#titulo4{
	position: absolute;
	background: #e6a06f;
	color: #fff;
	padding: 6px 45px;
	z-index: 999;
	font-size: 21px;
	font-family: 'NHaasGroteskDSStd-25Th';
	-webkit-border-radius: 0 0 5px 5px;
	-moz-border-radius: 0 0 5px 5px;
	border-radius: 0 0 5px 5px;
	letter-spacing: 1px;
}
#titulo5{
	position: absolute;
	background: #729e90;
	color: #fff;
	padding: 6px 45px;
	z-index: 999;
	font-size: 21px;
	font-family: 'NHaasGroteskDSStd-25Th';
	-webkit-border-radius: 0 0 5px 5px;
	-moz-border-radius: 0 0 5px 5px;
	border-radius: 0 0 5px 5px;
	letter-spacing: 1px;
}




#item{
	background: rgba(27, 27, 27, 0.5);
	width: 185px;
	height: 491px;
	padding: 0 15px;
	float: left;
	color: #fff;
	margin: 15px;
	font-size: 13px;
	font-family: 'Arial';
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: 1px 0 15px 0 rgba(102, 102, 102, 0.46);
	box-shadow: 1px 0 15px 0 rgba(102, 102, 102, 0.46);
}
#item img{
	display: block; 
	margin: 10px auto;
	width: 70%;
}
#item_empty{
	width: 185px;
	height: 510px;
	margin: 15px;
	float: left;

}

#clear{
	clear: both;
}

#compartir{
	width: 2%;
	position: absolute;
	left: 0;
	top: 35%;
	z-index: 9999;

}
#compartir a:hover{
	opacity: 0.8;
}
#logo{
	margin: 0 auto;
	width: 453px;
	height: auto;
	text-align: center;
	padding: 8% 0 0 0;
	position: relative;

}
#iconos{
	width: 50%;
	margin: 0 auto;
	padding-top: 20px;
}
#iconos img{	
	width: 19%;
}
#iconos a:hover{
	opacity: 0.8;
}
#flecha{
	margin: 10px auto;
	width: 80px;
}
#flecha img{
	width: 70%
}
#footer{
	width: 100%;
	color: #fff;
	background: rgba(0, 0, 0, 0.5);
	height: auto;
	padding: 5px;
	text-align: center;
	position: absolute;
	bottom: 0;
	font-size: 12px;
}