@import url(https://fonts.googleapis.com/css?family=Roboto+Slab:400,100);

@import url('mobile.css');
@import url('controls.css');
@import url('preloader.css');

@import url('ball-fall.css');
@import url('ball-clip-rotate.css');
@import url('ball-scale.css');

@import url('share.css'); 
@import url('sections.css'); 
@import url('powerflips.css'); 
@import url('actionpoints.css'); 
@import url('rack.css'); 

::selection {
  background: transparent!important; /* WebKit/Blink Browsers */
}
::-moz-selection {
  background: transparent!important; /* Gecko Browsers */
}

body {
	margin: 0;
	background-color: #353535;
	overflow: hidden!important;
	font-family: "Roboto Slab","Helvetica Neue",Arial,sans-serif;
}

body:-webkit-full-screen	{ width: 100% }
body:-moz-full-screen		{ width: 100% }
body:-ms-full-screen		{ width: 100% }
body:-o-full-screen		{ width: 100% }
body:full-screen			{ width: 100% }

.jumbotron {
	background-color: #353535;
}

.flex {
	display: -webkit-box;
  	display: -moz-box;
  	display: -ms-flexbox;
  	display: -webkit-flex;
  	display: flex;
    align-items: center;
    justify-content: center;
}

.loadie {
	position: absolute;
	bottom: 0;
	left: 0;
	background-color: #ffffff;
	width: 0;
	height: 4px;
	-webkit-transition: width 0.5s ease-out;
	   -moz-transition: width 0.2s ease-out;
	    -ms-transition: width 0.2s ease-out;
	     -o-transition: width 0.2s ease-out;
	        transition: width 0.2s ease-out;
	box-shadow: 0px 1px 5px rgba(0,0,0,0.25);
	z-index: 1;
}

.transparent {
	background: transparent!important;
}

.progress {
	margin-bottom: 0px;
	background: rgba(0, 0, 0, 0.2);
}

.progress {
	position: fixed;
	display: none;
	height: 4px;
	width: 100%;
	bottom: 0;
	left: 0;
	z-index: 2;
	background-color: rgba(0, 0, 0, 0.2);
}

.process {
	background: url('../images/loader.gif') no-repeat center center transparent;
}

#page-ajax.fullScreen, 
#page-ajax[data-template="true"] {
  margin-bottom: 0;
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
	.page-bcg-book {
	  opacity: 1;
	  background-color: #353535!important;
	}

	#page-ajax .page-bcg-book {
		opacity: 1;
		position: absolute;
		top: 0;
		left: 0;
	    background: none no-repeat center center;
		background-size: cover;
		-moz-background-size: cover;
		-webkit-background-size: cover;
	    width: 100%;
		height: 100%;
	}

	#current {
	   font-family:Arial,sans-serif;	
	   font-size:14px;	
	   -webkit-text-size-adjust:none;
	   overflow:hidden;
	   top:0;
	   left:0;
	   display:block;
	   width:100%;
	   height:100%;
	   background:#353535;
	}
	
	.current { }
	.left { float: left; }
	.right { float: right; }
	.wait { color: #FFF; font-size: 12px; position: relative; margin: 0 auto; top: 65%; }
	.remove_scroll{ overflow: hidden;	}
	img.broken { content: "\f03e";}
	.padre {
  		-webkit-justify-content: center; /* Solo Safari */
  		justify-content:         center;
	}
	/* is offline */
	.heyoffline_overlay {
		position: fixed;
		top: 0px;
		left: 0px;
		width: 100%;
		min-width: 100%;
		height: 100%;
		min-height: 100%;
		background: rgba(0, 0, 0, 0.298039);
		z-index: 9999;
	}
	.heyoffline_modal {
		font-family: "Roboto Slab","Helvetica Neue",Arial,sans-serif;
		padding: 15px;
		box-shadow: rgba(0, 0, 0, 0.298039) 0px 2px 30px;
		width: 450px;
		margin: 0px auto;
		position: relative;
		top: 30%;
		color: rgb(68, 68, 68);
		border-radius: 2px;
		background: rgb(255, 255, 255);
	}
	.heyoffline_heading {
		font-size: 1.7em; 
		padding-bottom: 15px;
	}
	.heyoffline_content {
		padding-bottom: 15px;
	}
	.heyoffline_button {
		font-weight: bold; 
		cursor: pointer;
	}
	/* end offline */
	/***************************************************************/
	/*************************** Navbar ****************************/
	/**************************************************************
	
	#Navbar {
		opacity:0;
		position: absolute;
		top: 0;
		z-index: 15;
		width: 100%;
		height: 50px;
		margin: 0; padding: 0;
	}

	#Navbar a.logo {
		float: left;
	}

	#Navbar #logo {
		z-index: 5;
		padding: 10px;
	}

	#Navbar .page-bcg-tools {
	    height: 100%;
	    left: 0;
	    opacity: 0.55;
	    position: absolute;
	    top: 0;
	    width: 100%;
		border-bottom:1px solid #303030;
	}
*/
	.navbar-menu {
		width: auto;
		margin: 10px 6px 0 0;
		opacity:1;
		visibility: visible;
	}

	.navbar-menu#masthead { }
	
	.navbar-menu ul {
		list-style: none; 
		margin: 0; padding: 0;	
	}

	.navbar-menu li {
		float: left;
		position: relative;
		width: auto;
		margin: 0 8px;	
		list-style: none;
	    background:none;
	}
	.navbar-menu li a {
	  	color: #FFFFFF;
	  	opacity: .8;
	}
	.navbar-menu li a {
		display: block;
		background: url(../images/icons.png) no-repeat;
		width: auto;	
		height: 40px;
		font-size:21px;
		opacity:.7;
		cursor: pointer;
	}
	.navbar-menu li a.active {
		opacity: 1;
	}
	.navbar-menu li a:hover {
		opacity:1;
	}

		/* Menú Share Facebook - Twitter */
		.navbar-menu ul ul {
			display:none;
			position:absolute;
			top:100%;
			left:-40px;
			padding: 10px!important;
		  	background: #6d6e71;
		  	border-radius: inherit;
		  	border: 0px solid rgba(0,0,0,0.17);
		  	box-shadow: 0 0 5px rgba(0,0,0,0.1);
		  	font-weight: normal;
		  	-webkit-transition: all 0.2s ease-in;
		  	-moz-transition: all 0.2s ease-in;
		  	-ms-transition: all 0.2s ease-in;
		  	-o-transition: all 0.2s ease-in;
		  	transition: all 0.2s ease-in;
		  	list-style: none;
		}

		.navbar-menu ul ul:before {
		  content: "";
		  width: 0;
		  height: 0;
		  position: absolute;
		  bottom: 100%;
		  right: 10px;
		  border-width: 0 8px 8px 8px;
		  border-style: solid;
		  border-color: #6d6e71 transparent;
		}

		.navbar-menu ul ul li {
			float:left!important;
		  	display: block;
		  	cursor: pointer;
		  	width: 46px!important;
		  	margin: 0!important;
		  	position: relative;
		}

		.navbar-menu ul ul li a {
			text-align: center;
			line-height: 21px!important;
		}

		.navbar-menu ul ul li a i {
		 	line-height: 42px;
		}

		.navbar-menu ul ul li:first-child {
		 	background: #6386CF;
		}

		.navbar-menu ul ul li:last-child {
		 	background: #30BEEE; 
		}

		.navbar-menu ul li:hover > ul {
			display:block;
		}

	
	/************************* End Navbar **************************/

	/***************************************************************/
	/*************************** Preloader *************************/
	/***************************************************************/
	
	#current .page-preloader {
		width: 70px;
		position:absolute;
		top:50%;
		left:50%;
		z-index:101;
		margin-left:-35px;
	}

	/************************ End Preloader ************************/
	
	/***************************************************************/
	/*************************** Porcentaje ************************/
	/***************************************************************/
	
	.porcent {
	  	display: block;
	  	position: fixed;
	  	width: auto;
	  	z-index: 100;
	  	left: 20px;
	  	bottom: 10px;
	}

	.porcent div {
	  	color: #FFFFFF;
	  	font-size: 14px;
	  	position: relative;
		-webkit-transition: all 0.2s ease-out;
		   -moz-transition: all 0.2s ease-out;
		    -ms-transition: all 0.2s ease-out;
		     -o-transition: all 0.2s ease-out;
		        transition: all 0.2s ease-out;
	}

	/************************ End Porcentaje ***********************/

	/***************************************************************/
	/******************** Navigation Controls **********************/
	/***************************************************************/
	
	.controls {
	  	display: none;
	  	position: fixed;
	  	width: 110px;
	  	height: 110px;
	  	z-index: 100;
	  	right: 10px;
	  	bottom: 10px;
	}

	.controls div {
	  	position: absolute;
	  	opacity: 0.05;
	  	width: 0;
	  	height: 0;
	  	border: 12px solid transparent;
	  	-moz-transform: scale(.9999);
	  	-webkit-transition: all 0.2s ease;
	      -moz-transition: all 0.2s ease;
	       -ms-transition: all 0.2s ease;
	        -o-transition: all 0.2s ease;
	           transition: all 0.2s ease;
	}

	.controls div.enabled {
	  	opacity: 0.7;
	  	cursor: pointer;
	}

	.controls div.enabled:active {
	  	margin-top: 1px;
	}

	.controls div.navigate-left {
	  	top: 42px;
	  	border-right-width: 22px;
	  	border-right-color: #eee;
	}
	  
	.controls div.navigate-left.fragmented {
	    opacity: 0.3;
	}

	.controls div.navigate-right {
	  	left: 74px;
	  	top: 42px;
	  	border-left-width: 22px;
	  	border-left-color: #eee;
	}

	.controls div.navigate-right.fragmented {
	    opacity: 0.3;
	}

	.controls div.navigate-up {
	  	left: 42px;
	  	border-bottom-width: 22px;
	  	border-bottom-color: #eee;
	}
	
	.controls div.navigate-up.fragmented {
	    opacity: 0.3;
	}

	.controls div.navigate-down {
	  	left: 42px;
	  	top: 74px;
	  	border-top-width: 22px;
	  	border-top-color: #eee;
	}

  	.controls div.navigate-down.fragmented {
    	opacity: 0.3;
  	}

	.controls div.navigate-left,
	.controls div.navigate-left.enabled {
	  	border-right-color: #bcbec0; }

	.controls div.navigate-right,
	.controls div.navigate-right.enabled {
	  	border-left-color: #bcbec0; 
	}

	.moveLeft {
		-webkit-animation: moveLeft 1s linear infinite alternate forwards;
		animation: moveLeft 1s linear infinite alternate forwards;
	}
	.moveRight {
		-webkit-animation: moveRight 1s linear infinite alternate forwards;
		animation: moveRight 1s linear infinite alternate forwards;
	}
	@-webkit-keyframes moveRight {
		0%, 100% {
			-webkit-transform: translate3d(0, 0, 0);
			transform: translate3d(0, 0, 0);
		}
		50% {
			-webkit-transform: translate3d(5px, 0, 0);
			transform: translate3d(5px, 0, 0);
		}
	}

	@keyframes moveRight {
		0%, 100% {
			-webkit-transform: translate3d(0, 0, 0);
			transform: translate3d(0, 0, 0);
		}
		50% {
			-webkit-transform: translate3d(5px, 0, 0);
			transform: translate3d(5px, 0, 0);
		}
	}

	@-webkit-keyframes moveLeft {
		0%, 100% {
			-webkit-transform: translate3d(0, 0, 0);
			transform: translate3d(0, 0, 0);
		}
		50% {
			-webkit-transform: translate3d(-5px, 0, 0);
			transform: translate3d(-5px, 0, 0);
		}
	}

	@keyframes moveLeft {
		0%, 100% {
			-webkit-transform: translate3d(0, 0, 0);
			transform: translate3d(0, 0, 0);
		}
		50% {
			-webkit-transform: translate3d(-5px, 0, 0);
			transform: translate3d(-5px, 0, 0);
		}
	}
	.controls div.navigate-up,
	.controls div.navigate-up.enabled {
	  	border-bottom-color: #bcbec0; }

	.controls div.navigate-down,
	.controls div.navigate-down.enabled {
	  	border-top-color: #bcbec0; }

	.controls div.navigate-left.enabled:hover {
	  	border-right-color: #bcbec0; }

	.controls div.navigate-right.enabled:hover {
	  	border-left-color: #bcbec0; }

	.controls div.navigate-up.enabled:hover {
	  	border-bottom-color: #bcbec0; }

	.controls div.navigate-down.enabled:hover {
	  	border-top-color: #bcbec0; }

	div[data-type="{type: 'magazine'}"] .controls div.navigate-up,
	div[data-type="{type: 'magazine'}"] .controls div.navigate-down {
	  	display: none!important;
	}
	
	#lines {
		height: 55px;
		width: 200px;
		position: absolute;
		bottom: 25px;
		left: 25px;
	}

	#lines .line {
		width: 5px;
		background: #bcbec0;
		overflow: hidden;
		float: left;
		margin-right: 2px;
		position: relative;
		cursor: default;
	}

	#tracker {
		height: 10px;
		background: #fff;
		width: 5px;
		position: absolute;
		z-index: 1;
		cursor: default;
	}
	/****************** End Navigation Controls *******************/

	
	/***************************************************************/
	/************************** Portada ****************************/
	/***************************************************************/
	.magix {
		opacity: 0;
	  	bottom: 0;
	  	left: 0;
	  	margin: auto;
	  	position: absolute;
	  	top: 0;
	  	right: 0;
	  	height: auto;
	  	width: 350px;
	  	max-width: 350px;
	  	z-index: 999;
	  	display: -webkit-box;
	  	display: -moz-box;
	  	display: -ms-flexbox;
	  	display: -webkit-flex;
	  	display: flex;
	    align-items: center;
	    justify-content: center;
	}

	@media all and (max-width: 767px) {
		.magix {
			width: 260px;
	  		max-width: 280px;
		}
	}

	.destacadas-top .post {
	  	float: left;
	  	width: 100%;
	  	min-height: 100px;
	  	position: relative;
	  	overflow: hidden;
	}

	.post .thumb {
	  	margin: 0;
	}

	.post img {
	  	width: 100%;
	  	height: auto;
	}

	.encimaimagen {
	    background: -ms-linear-gradient(top,rgba(0,0,0,0.0) 0%,rgba(0,0,0,0.5) 100%);
	    background: -webkit-linear-gradient(top,rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 100%);
	    background: linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 100%);
	  	width: 100%;
	  	height: 100%;
	  	position: absolute;
	  	top: 0;
	  	left: 0;
	}

	.destacadas-top .meta {
	  	position: absolute;
	  	bottom: 0;
	  	left: 0;
	  	margin: 0;
	  	padding: 10px 20px;
	  	z-index: 2;
	}

	.destacadas-top .prompt {
	  	left: 20px;
	  	top: -20px;
	}

	.prompt {
	  	visibility: visible;
	  	font-family: "Roboto Slab","Helvetica Neue",Arial,sans-serif;
	  	font-size: 16px;
	  	font-weight: bold;
	  	text-transform: uppercase;
	  	line-height: 24px;
	  	padding: 0 7px;
	  	background: #FF6600;
	  	color: #FFFFFF;
	  	z-index: 99;
	  	left: 0;
	}

	.destacadas-top .meta h2 {
	  	font-family: "Roboto Slab","Helvetica Neue",Arial,sans-serif;
	  	font-size: 32px!important;
	  	line-height: 38px!important;
	  	color: #FFF;
	  	white-space: pre-wrap;
	  	display: inline;
	  	text-shadow: 1px 1px 4px #000;
	  	text-transform: none;
	}

	/************************ End Portada **************************/
	
	/***************************************************************/
	/************************* Progress ****************************/
	/***************************************************************/
	
	.read-progress-indicator {
	  	width: 100%;
	  	height: 9.5rem;
	  	bottom: 0;
	  	-webkit-appearance: none;
	  	-moz-appearance: none;
	  	appearance: none;
	  	border: none;
	  	background-color: transparent;
	  	color: #ccc;
	  	position: absolute;
	  	-webkit-transition: width 0.1s ease-out;
	   -moz-transition: width 0.1s ease-out;
	    -ms-transition: width 0.1s ease-out;
	     -o-transition: width 0.1s ease-out;
	        transition: width 0.1s ease-out;
	}

	.read-progress-indicator::-webkit-progress-bar {
	  	background-color: transparent;
	}

	.read-progress-indicator.single::-webkit-progress-value {
	  	background-color: rgba(53,53,53,0.8);
	}

	.read-progress-indicator.single::-moz-progress-bar {
	  	background-color: rgba(53,53,53,0.8);
	}

	.progress-container {
	  	width: 100%;
	  	background-color: transparent;
	  	position: absolute;
	  	top: 0;
	  	left: 0;
	  	height: 5rem;
	  	display: block;
	  	-webkit-transform: translateZ(0);
	  	transform: translateZ(0);
	  	overflow-x: hidden;
	}

	.progress-container .progress-bar {
	  	background-color: rgba(255,255,255,0.2);
	  	width: 100%;
	  	height: 100%;
	  	display: block;
	  	-webkit-transition: width 0.5s ease-out;
	    -moz-transition: width 0.2s ease-out;
	    -ms-transition: width 0.2s ease-out;
	     -o-transition: width 0.2s ease-out;
	        transition: width 0.2s ease-out;
	}

	/************************ End Progress *************************/
	
	/***************************************************************/
	/************************* BEGIN BOOK **************************/
	/***************************************************************/

	#fb5-container-book { position: absolute; z-index: 1; display: none; width: 1100px;  height: 715px; }
	.fb5-cont-page-book { opacity: 0; position: absolute; }

	.viewer-transition {
		-webkit-transition: all .3s ease-out;
		-o-transition: all .3s ease-out;
		transition: all .3s ease-out;
	}

	/* <!-- generate HTML CODE --> */
	#main { width: 100%; margin: auto;  height:100%;  overflow: hidden; position: relative; margin-top: 0px; }
	#gallery { left: 0px;  position: relative; width: 100%; height: 900px; }
	
	#main .inner { width: 999999px; height: 999999px; overflow: hidden; /*position: relative;*/ top: 0; left: 0; }
	
	#image-container {
	  -webkit-transition: all 1s ease;
	     -moz-transition: all 1s ease;
	      -ms-transition: all 1s ease;
	       -o-transition: all 1s ease;
	          transition: all 1s ease;
	  white-space: nowrap;
	  position: absolute;
	}
	
	#image-container .col.focus  {
	/*Animation*/
	  -webkit-transition: all 1s ease;
	     -moz-transition: all 1s ease;
	       -o-transition: all 1s ease;
	      -ms-transition: all 1s ease;
	          transition: all 1s ease;
	}



	#gallery .col { position: absolute; width: 1170px; }
	#gallery .col .item { height: 100%; width: 100%; margin: 0 auto; top: 0px; overflow: hidden; position: absolute; /* slows animation -moz-box-shadow: 0px 0px 15px #0f1219; */}
	
	.item.childrens {
		-webkit-transition: all 1s cubic-bezier(0,0,0,0);
		-moz-transition: all 1s cubic-bezier(0,0,0,0);
		-o-transition: all 1s cubic-bezier(0,0,0,0);
		transition: all 1s cubic-bezier(0,0,0,0);
	}

	.item div.pagina, .item div.main_stream { 
		position: relative; 
		z-index: 1; 
		margin: 0 auto; 
		text-align: center; 
		opacity: 1; 
	}

	.item div.main_stream {
		top: 0px!important;
		/*background: url("../images/360.GIF") no-repeat center center #353535;*/
	}
	
	.progressiveMedia-image {
		visibility: hidden;
		opacity: 0;
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
	}

	.is-imageLoaded .progressiveMedia-image {
		visibility: visible;
		opacity: 1;
		transition: visibility 0s linear 0s,opacity 1s 0s;
	}

	.zoomInOn, .zoomInOff, .zoomOutOn, .zoomOutOff
	{
	   width:34px;
	   height:34px;
	   display:block;
	   position:absolute;
	   -webkit-user-select: none;
	   -moz-user-select: none;
	   -ms-user-select: none;
	   user-select: none;
	}
	 
	.zoomInOn, .zoomInOff
	{
	   background-image:url(https://0.s3.envato.com/files/78471334/assets/zoom_in.png);
	   top:10px;
	   right:10px;
	}
	 
	.zoomOutOn, .zoomOutOff
	{
	   background-image:url(https://0.s3.envato.com/files/78471334/assets/zoom_out.png);
	   top:52px;
	   right:10px;
	}
	 
	.zoomInOn, .zoomOutOn
	{
	   opacity:1;
	   cursor:pointer;
	}
	 
	.zoomInOff, .zoomOutOff
	{
	   opacity:0.3;
	   cursor:auto;
	}

	.flexbox-parent {
	  display: -webkit-flex;
	  align-items: center;
	  display: flex;
	  overflow: hidden;
	}

	.flexbox-parent > div {
		display: inline-block;
		overflow: hidden;
	}

	.hijo {
		display: -webkit-box;
	  	display: -moz-box;
	  	display: -ms-flexbox;
	  	display: -webkit-flex;
	  	display: flex;
	    align-items: center;
	    justify-content: center;
	}
	.hijo img {
		width: auto;
		height: 100%;
	}
	.item div img { width: auto; position: relative; top: 0px; }
	.pagina.odd img { float: none!important; }

	.pagina .image-page:hover {
		/*cursor:pointer;
		cursor: -webkit-zoom-in;
		cursor: -moz-zoom-in;*/
	}
	
	.pagina .image-page.zoomed {
		/*cursor:pointer;
		cursor: -webkit-zoom-out;
		cursor: -moz-zoom-out;*/
	}

	.odd, .even { float: left; width: 50%; }

	div[data-current="horizontal"] .item .odd:first-child .main_stream {
		float: right!important;
	}
	div[data-current="horizontal"] .item .even:last-child .main_stream {
		float: left!important;
	}

	.even .main_stream { float: left; }
	.end-block-content { width: 100%; height: 100%; background: url("../images/logo-transparent.png") no-repeat center center transparent; }

	._ovg3g, ._njmhc {
		bottom: 0;
		left: 0;
		position: absolute;
		right: 0;
		top: 0;
	}

	.inner .col[data-section-order="0"] .item .pagina:first-child img { float: none; }
	.item .pagina:first-child img { float: right; }
	.item .pagina:last-child img { float: left; }

	.main_stream.clone { position: relative; top: 0px; z-index: 100; background: #353535; }
	.main_stream.clone img { display: none; position: absolute; }

	.icon-generic {
		background-repeat: no-repeat;
		background-size: 100%;
		height: 72px;
		margin: 0 0 40px;
		width: 72px;
		content: -webkit-image-set( url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABIAQMAAABvIyEEAAAABlBMV…hBMDDxRy/72O9FMnIFapGylsu1fgoBdkXfUHLrQgdfrlJN1BdYBjQQm3UAAAAASUVORK5CYII=) 1x, url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJAAAACQAQMAAADdiHD7AAAABlBMV…oq3npu+wQUrUuJHylSTmBaespJyJQoObUeyxDQb3bEm5Au81c0pSCD8HYAAAAASUVORK5CYII=) 2x);
	}

	/*********************** END BEGIN BOOK ************************/
	
