/*! HTML5 Boilerplate v6.0.1 | MIT License | https://html5boilerplate.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/*	==========================================================================
	Base styles: opinionated defaults
	========================================================================== */

html {
	color: #222;
	font-size: 1em;
	line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * Vendor-prefixed and regular ::selection selectors cannot be combined:
 * https://stackoverflow.com/a/16982510/7133471
 *
 * Customize the background color to match your design.
 */

::-moz-selection {
	background: #b3d4fc;
	text-shadow: none;
}

::selection {
	background: #b3d4fc;
	text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid #ccc;
	margin: 1em 0;
	padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio,
canvas,
iframe,
img,
svg,
video {
	vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
	border: 0;
	margin: 0;
	padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
	resize: vertical;
}

/*	==========================================================================
	Browser Upgrade Prompt
	========================================================================== */

.browserupgrade {
	margin: 0.2em 0;
	background: #ccc;
	color: #000;
	padding: 0.2em 0;
}

/*	==========================================================================
	Author's custom styles
	========================================================================== */

/*Colores

turquesa: #4dbed0
turquesa hover: #249aae
cafe claro: #fef7f1
azul claro: #dbf1f6

*/

/*General*/

@font-face {
	font-family: Avenir;
	src: url(../fonts/Avenir-Light.eot);
	src: url(../fonts/Avenir-Light.eot?#iefix) format("embedded-opentype"), url(../fonts/Avenir-Light.woff) format("woff"), url(../fonts/Avenir-Light.ttf) format("truetype");
	font-style: normal;
	font-weight: 200
}

@font-face {
	font-family: Avenir;
	src: url(../fonts/Avenir-LightOblique.eot);
	src: url(../fonts/Avenir-LightOblique.eot?#iefix) format("embedded-opentype"), url(../fonts/Avenir-LightOblique.woff) format("woff"), url(../fonts/Avenir-LightOblique.ttf) format("truetype");
	font-style: italic;
	font-weight: 200
}

@font-face {
	font-family: Avenir;
	src: url(../fonts/Avenir-Medium.eot);
	src: url(../fonts/Avenir-Medium.eot?#iefix) format("embedded-opentype"), url(../fonts/Avenir-Medium.woff) format("woff"), url(../fonts/Avenir-Medium.ttf) format("truetype");
	font-style: normal;
	font-weight: 400
}

@font-face {
	font-family: Avenir;
	src: url(../fonts/Avenir-MediumOblique.eot);
	src: url(../fonts/Avenir-MediumOblique.eot?#iefix) format("embedded-opentype"), url(../fonts/Avenir-MediumOblique.woff) format("woff"), url(../fonts/Avenir-MediumOblique.ttf) format("truetype");
	font-style: italic;
	font-weight: 400
}

@font-face {
	font-family: Avenir;
	src: url(../fonts/Avenir-Heavy.eot);
	src: url(../fonts/Avenir-Heavy.eot?#iefix) format("embedded-opentype"), url(../fonts/Avenir-Heavy.woff) format("woff"), url(../fonts/Avenir-Heavy.ttf) format("truetype");
	font-style: normal;
	font-weight: 700
}

@font-face {
	font-family: Avenir;
	src: url(../fonts/Avenir-HeavyOblique.eot);
	src: url(../fonts/Avenir-HeavyOblique.eot?#iefix) format("embedded-opentype"), url(../fonts/Avenir-HeavyOblique.woff) format("woff"), url(../fonts/Avenir-HeavyOblique.ttf) format("truetype");
	font-style: italic;
	font-weight: 700
}

@font-face {
	font-family: Avenir;
	src: url(../fonts/Avenir-Black.eot);
	src: url(../fonts/Avenir-Black.eot?#iefix) format("embedded-opentype"), url(../fonts/Avenir-Black.woff) format("woff"), url(../fonts/Avenir-Black.ttf) format("truetype");
	font-style: normal;
	font-weight: 900
}

/*html {background: #f5f5f5!important;}*/

body{
	display: flex;				/*para tener footer abajo  */
	min-height: 100vh;			/*para tener footer abajo  */
	flex-direction: column;		/*para tener footer abajo */
	overflow-x: hidden;
}

.container{
	max-width: 1488px;
	/*width: inherit;*/
}

.box{background-color: #FFFFFF!important;}
.spacer{height: 20px;}
.foot-spacer{height: 10px;}
a{color: #4dbed0;}
.input:focus, .input:active{border-color: #4dbed0;}
.textarea:focus, .textarea:active{border-color: #4dbed0;}

.footer{
	padding: 0;
	padding-bottom: 0!important;
	background-color: inherit;
	flex-shrink: 0;
}

.mifooter {
	padding: 2rem;
	background-color: #4dbed0;
	color: #dcdcdc;
	z-index: 100;
}

.mifooter .container {margin: 0px!important;}

.social{
	float: left;
	padding-left: 10px;
}

.vplogo-foot{display: none;}

/*Elements*/
nav#navbar{padding: 0;}
.navbar {box-shadow: inherit;}
.navbar-brand, .navbar-menu{margin: 0!important;}
.navbar > .container{margin-bottom: 0!important;}
.navbar.is-spaced a.navbar-item {border-radius: inherit;}

.navbar-menu {
	justify-content: space-evenly;
	align-items: center;
}

.navbar.pasos{
	justify-content: space-evenly;
	flex-grow: 1;
	box-shadow: none;
}

.navbar span {
    font-size: 17px;
}

.modal-background {
    cursor: pointer;
}

/*span.menu-break {display: block;}*/
.navbar-item {padding: 0}
.navbar-item img {max-height: inherit;}

.navbar-item.is-tab{
	font-family: "Helvetica Light";
	font-weight: 900;
}

.navbar-item.is-tab.is-active {
	border-bottom-color: #4dbed0;
	color: #4dbed0;
}

.navbar-item.is-tab:hover {
	color: #4dbed0;
}

table{width: 100%;}
h1.title.is-3{padding-bottom: 1rem;}
.title {font-family: "Helvetica Light";}

/*Paso 0 seleccionar idioma*/
.container.welcomescreen{
	margin-top: 5px;
	height: 864px;
	/*overflow: hidden;*/
	max-height: 500px;
	/*padding-top: 5px;*/ /*Si va con Logo comentar*/
}

.overlaywelcome {
    position: absolute;
    background: #0000006e;
    width: 100%;
    height: 100%;
}
.welcomescreen{
	background-image: url(../images/home/WelcomeScreen.jpg);
	background-size: cover;
	margin-top: 5px;
}

.venue-title.welcome {
	padding-left: 1.25rem;
	background-color: #da7712;
	display: none;
}

h1.title.is-1.welcome{color: #FFFFFF;}


.welcome-title {
    position: absolute;
    color: white;
    font-size: 5em;
    width: 650px;
    left: 110px;
    bottom: 214px;
    line-height: 80px;
    font-family: "Helvetica Light";
    font-weight: 600;
}

.welcome-logo {
	background-color: #FFFFFF;
	padding-bottom: 5px;
}

nav.panel.language {
	margin-right: 20px;
	display: none;
}

.panel-heading.language {
	text-transform: uppercase;
	border-bottom: 0px;
	background-color: #dbdbdb;
}

.the-triangle {
	display: flex;
	justify-content: center;
}

.lang-triangle {
	width: 0;
	margin-right: auto;
	margin-left: auto;
	border: 12px solid transparent;
	border-top-color: #dbdbdb;
	border-bottom: 0px;
	position: absolute;
}

.panel-block.one.language{/*padding-top: 12px;*/}

.panel-block.language {
	text-transform: uppercase;
	background-color: #f5f5f5;
	padding: 1em;
	border-bottom: 1px solid #dbdbdb;
}

.panel-block.language:hover {background-color: #dbdbdb;}

a.button.is-info.is-large.enter {
    position: absolute;
    left: 110px;
    bottom: 112px;
    border-radius: 0px;
    text-transform: uppercase;
    font-family: "Helvetica Light";
    font-weight: bold;
    width: 13.8em;
    height: 3.4em;
    background-color: #4dbed0;
}
.button.is-large {
    font-size: 1.3rem;
}

a.button.is-info.is-large.enter:hover {background-color: #249aae;}


/*Paso 0 Zonas*/

a#showModal {
    text-transform: uppercase;
    width: 200px;
}

.container.mobile-step-0 {display: none;}

.precarga{display: none;}

.container.step0.is-fluid {margin: 0;flex: 1;}
/*.columns.select-venue-title {background-color: #fef7f1;}*/
.column.selectttt {text-align: right;}
.selectttt h1.title {font-size: 2.5rem;}

.select-venue-decor9 {
	border-top: 10px solid #dbf1f6;
	border-right: 10px solid #dbf1f6;
	margin-right: 20%;
	margin-top: 30px;
	padding-bottom: 60px;
}

.edificios {
	/*top: -13%;*/
	position: relative;
	right: -20%;
}

.columns.selectvenuedecor {
    bottom: -67px;
    position: relative;
    margin-bottom: 0;
    z-index: -1;
}

.columns.select-venue-title {
	background-image: url(../images/mapa/zones/bg-map.png);
	background-size: contain;
}

.lista-zonas-mapa {z-index: 100;}

ul.lista-zonas {
	font-weight: bold;
	line-height: 2.5rem;
	padding-top: 6em;
	font-size: 1.2rem;
	padding-right: 3em;
}

ul.lista-zonas li {
	justify-content: flex-end;
	align-items: center;
	display: flex;
}

ul.lista-zonas li a {
	color: #363636;
	font-size: 1.4vw;
}

ul.lista-zonas li a:hover {
	color: #4dbed0;
	text-decoration: underline;
}

.dot {
	height: 1.4vw;
	width: 1.4vw;
	border-radius: 50%;
	margin-left: 20px;
}

.dot.swc {background-color: #a54a80;}
.dot.vcc {background-color: #b6a798;}
.dot.hp {background-color: #ede7df;}
.dot.pl {background-color: #dfd6cb;}
.dot.poo {background-color: #9bc8e1;}

/*#tab-content {display: none;}*/

#tab-content .is-active {display: block;}
#tab-content-mobile .is-active {display: block;}


/*Acordion salones*/
.accordion {
    width: 250px;
    margin: 25px auto;
}

.accordion h1, h2, h3, h4 {cursor: pointer;}
.accordion h2, h3, h4 {font-family: Avenir, sans-serif;}

.accordion h1 {
	padding: 0.7em 0.75em;
	/*background-color: #333;*/
    font-family: "Helvetica Light";
	/*font-size: 1.5rem;*/
	color: #4a4a4a;
}

.accordion h1:hover {color: #4dbed0;}
.accordion h1:first-child {/*border-radius: 10px 10px 0 0;*/}
.accordion h1:last-of-type {border-radius: 0!important;/*border-radius: 0 0 10px 10px;*/}
.accordion h1:not(:last-of-type) {/*border-bottom: 1px dotted #1abc9c;*/}
.accordion div, .accordion p {display: none;}

.accordion h2 {
	padding: 5px 25px;
	font-size: .9rem;
	font-family: "Helvetica Light";
	color: #4a4a4a;
}

.accordion h2:last-of-type {border-radius: 0!important;/*border-radius: 0 0 10px 10px;*/}
.accordion h2:hover {background-color: #f5f5f5;}

.accordion h3 {
	padding: 5px 30px;
	background-color: #f5f5f5;
	font-family: "Helvetica Light";
	font-size: .9rem;
	color: #4a4a4a; 
}

.accordion h3:hover {background-color: #efecec;}

.accordion h4 {
	padding: 5px 35px;
	background-color: #ffc25a;
	font-size: .9rem;
	color: #af720a; 
}

.accordion h4:hover {background-color: #e0b040;}

.accordion p {
	padding: 15px 35px;
	background-color: #ddd;
	font-family: "Helvetica Light";
	font-size: .8rem;
	color: #333;
	line-height: 1.3rem;
}

.accordion a {text-decoration: none;}
.accordion .opened-for-view {display: block;}


/*Paso 1 seleccionar salón*/
.container.desktop-step-1{
	flex: 1; /*para tener footer abajo*/
}

.container.mobile-step-1 {display: none;}
.table.step1 {font-size: .9rem;}
.footer-mobile {display: none;}


/*Venues List*/
.menu-label{
	font-size: 1.25rem;
	text-align: center;
	font-family: "Helvetica Light";
	margin-bottom: .5em;
}

.menu-list {line-height: 0.85;}

.menu-list a{
	font-weight: bold;
	font-family: Avenir, sans-serif;
	padding: 0;
}

.menu-list a.is-active{
	background-color: unset;
/*	color: #4dbed0;
	text-decoration: underline;*/
	color: #4a4a4a;
}

.menu-list {display: none;}
.level-active{display: block;}

/*Tabs*/

/*Delineado de tabs para mapas*/
.map-tabs-span {
	position: relative;
	display: inline-block;
	font-size: 24px;
	font-weight: 400;
	text-align: center;
}

.custom-underline {
	content: "";
	position: absolute;
	top: 100%;
	height: 2px;
	width: 0%;
	left: 5%;
	background-color: rgba(255, 255, 255, 0.6);
}

/*Delineado de tabs para mapas*/

.tabs.is-large.niveles{
	top: -26px;
	position: relative;
	margin-bottom: 0px;
	justify-content: center;
}

.tabs{white-space: normal;}

.tabs a{
	border-bottom: none;
	font-size: 1.3rem;
	padding: 0.5em 0.5em;
}

.tabs ul{
	justify-content: center;
	font-family: Avenir, sans-serif;
	font-weight: bold;
	border-bottom: 0px;
	background-color: #4dbed0;
	flex-grow: 0;
}

.tabs li{
	border-left-color: #2c98a9;
	border-left-style: solid;
	border-left-width: 1px;
	/*padding: 0 15px;*/
	margin: 10px 0;
}

li#tab1{border: 0px;}
.tabs li.is-active a{color: #ffffff}

.tabs_item {
	display: none;
	padding: 0 0 30px 0;
	text-align: center;
}

.tabs_item h4 {
	font-weight: bold;
	font-size: 20px;
}

.tabs_item img {}
.tabs_item:first-child {display: block;}

.current a {
	color: #fff;
}

/*Caja central planos*/

#levels-map{border: 8px solid #dcf1f6;}
.columns.biggers {margin-bottom: 0px;}
.columns.biggers.maps{padding: 0 15px;}


/*Sidebar right*/

.capacidades-sidebar-show{display: block;}
.capacidades-sidebar{display: none;}

.tabla-capacidades{
	border-radius: 0px;
	border: 0px;
	color: #FFFFFF;
	background-color: #4dbed0;
}

.field.has-addons.metros-pies-sidebar {justify-content: center;}
.button.metros {background-color: #4dbed0;}

h3.title.is-4.venue-name-sidebar {
	margin: 0;
	padding: 1em;
	text-align: center;
	font-size: 1.3rem;
}

/*Paso 1 en móvil*/
#table_detail {
	text-align:left;
	border-collapse: collapse;
	color:#2E2E2E;
	border:none;
	margin-top: 10px;
}

#table_detail th {padding: 4px;}
#table_detail tr:hover {background-color:#F2F2F2;}
#table_detail td {padding: 4px;}
#table_detail .hidden_row {display:none;}

td.iexpand {text-align: center;}
.iexpand span.icon.is-small .fa {padding-right: 0px;}


/*Paso 2 multimedia*/

.container.step2 {flex-grow: 1;}

.tile.is-parent{margin-bottom: -0.75rem;}
.tile.is-ancestor:last-child{padding-bottom: 10px;}
h1.title.is-3 {padding-bottom: 1rem;}
.multimedia-thumbs span.icon.is-small {width: 100%;}
.icon.is-small .fa {padding-right: 6px;}

iframe.wixia {
	height: 562px;
	width: 100%;
}

.thumb-2-big img{width: 100%}
.thumb-3-big img{width: 100%}
.thumb-4-big img{width: 100%}
.thumb-5-big img{width: 100%}


/* Tooltip container */

#tooltipp{
	display: none;
	visibility: visible;
	opacity: 1;
}

.tooltip {
	position: relative;
	display: inline-block;
	/* border-bottom: 1px dotted black; If you want dots under the hoverable text */
}

/* Tooltip text */
.tooltip .tooltiptext {
	visibility: hidden;
	width: 320px;
	background-color: black;
	color: #fff;
	text-align: center;
	padding: 5px 0;
	border-radius: 6px;
	
	/* Position the tooltip text - see examples below! */
	position: absolute;
	z-index: 1;

	top: 150%;
	left: 50%; 
	margin-left: -160px; /* Use half of the width (120/2 = 60), to center the tooltip */

	opacity: 0;
/*	transition: opacity 1s;*/

	-webkit-animation: bounce 1.2s ease-out;
	-moz-animation: bounce 800ms ease-out;
	-o-animation: bounce 800ms ease-out;
	animation: bounce 1.2s ease-out;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
	visibility: visible;
	opacity: 1;
	transition: opacity .6s;
}

.tooltip .tooltiptext::after {
	content: " ";
	position: absolute;
	bottom: 100%;  /* At the top of the tooltip */
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: transparent transparent black transparent;
}

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

/* Webkit, Chrome and Safari */

@-webkit-keyframes bounce {
	0% {
		-webkit-transform:translateY(-100%);
	}
	5% {
		-webkit-transform:translateY(-100%);
	}
	15% {
		-webkit-transform:translateY(0);
		padding: 4px auto;
	}
	20% {
		-webkit-transform:translateY(-80%);
	}
	25% {
		-webkit-transform:translateY(0%);
		padding: 4px auto;
	}
	30% {
		-webkit-transform:translateY(-70%);
	}
	35% {
		-webkit-transform:translateY(0%);
		padding: 5px auto;
	}
	40% {
		-webkit-transform:translateY(-60%);
	}
	45% {
		-webkit-transform:translateY(0%);
		padding: 5px auto;
	}
	50% {
		-webkit-transform:translateY(-50%);
	}
	55% {
		-webkit-transform:translateY(0%);
		padding: 6px auto;
	}
	60% {
		-webkit-transform:translateY(-30%);
	}
	65% {
		-webkit-transform:translateY(0%);
		padding: 6px auto;
	}
	70% {
		-webkit-transform:translateY(-15%);
	}
	75% {
		-webkit-transform:translateY(0);
		padding: 8px auto;
	}
	80% {
		-webkit-transform:translateY(-10%);
	}
	85% {
		-webkit-transform:translateY(0);
		padding: 8px auto;
	}
	90% {
		-webkit-transform:translateY(-5%);
	}
	95% {
		-webkit-transform:translateY(0);
		padding: 10px;
	}
	100% {
		-webkit-transform:translateY(0);
		padding: 10px;
	}
}

/* Mozilla Firefox 15 below */
@-moz-keyframes bounce {
 
	70% {
		-moz-transform:translateY(0%);
		padding-bottom: 7px;
	}
	80% {
		-moz-transform:translateY(-15%);
	}
	90% {
		-moz-transform:translateY(0%);
		padding-bottom: 8px;
	}
	95% {
		-moz-transform:translateY(-10%);
	}
	97% {
		-moz-transform:translateY(0%);
		padding-bottom: 9px;
	}
	99% {
		-moz-transform:translateY(-5%);
	}
	100% {
		-moz-transform:translateY(0);
		padding-bottom: 9px;
		opacity: 1;
	}
}

/* Opera 12.0 */
@-o-keyframes bounce {
	0% {
		-o-transform:translateY(-100%);
		opacity: 0;
	}
	5% {
		-o-transform:translateY(-100%);
		opacity: 0;
	}
	15% {
		-o-transform:translateY(0);
		padding-bottom: 5px;
	}
	30% {
		-o-transform:translateY(-50%);
	}
	40% {
		-o-transform:translateY(0%);
		padding-bottom: 6px;
	}
	50% {
		-o-transform:translateY(-30%);
	}
	70% {
		-o-transform:translateY(0%);
		padding-bottom: 7px;
	}
	80% {
		-o-transform:translateY(-15%);
	}
	90% {
		-o-transform:translateY(0%);
		padding-bottom: 8px;
	}
	95% {
		-o-transform:translateY(-10%);
	}
	97% {
		-o-transform:translateY(0%);
		padding-bottom: 9px;
	}
	99% {
		-o-transform:translateY(-5%);
	}
	100% {
		-o-transform:translateY(0);
		padding-bottom: 9px;
		opacity: 1;
	}
}

/* W3, Opera 12+, Firefox 16+ */
@keyframes bounce {
	0% {
		transform:translateY(-100%);
		opacity: 0;
	}
	5% {
		transform:translateY(-100%);
		opacity: 0;
	}
	15% {
		transform:translateY(0);
		padding-bottom: 5px;
	}
	30% {
		transform:translateY(-50%);
	}
	40% {
		transform:translateY(0%);
		padding-bottom: 6px;
	}
	50% {
		transform:translateY(-30%);
	}
	70% {
		transform:translateY(0%);
		padding-bottom: 7px;
	}
	80% {
		transform:translateY(-15%);
	}
	90% {
		transform:translateY(0%);
		padding-bottom: 8px;
	}
	95% {
		transform:translateY(-7%);
	}
	97% {
		transform:translateY(0%);
		padding-bottom: 9px;
	}
	99% {
		transform:translateY(-3%);
	}
	100% {
		transform:translateY(0);
		padding-bottom: 9px;
		opacity: 1;
	}
}
/*---------------------------------------------*/


.video-thumb {
	background-image: url(../images/general/play-off.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;;
	cursor: pointer;
	background-color: #4dbed0;
}

.video-thumb:hover {background-image: url(../images/general/play-on.png);}
.columns.is-mobile.multimedia-nav.mobile-step-2 {display: none;}
.columns.biggers{justify-content: flex-end;}

.see-full{
	position: absolute;
	margin-top: 20px;
	margin-left: -20px;
	opacity: 0.5;
}

.see-full:hover{
	opacity: 1;
	cursor: pointer;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.see-full {
		display: none !important;
	}
}

/* Paso 1 Mapa*/


/* Paso 2 Mobile Nav Styles */
.column.thumb-left, .column.thumb-right {text-align: center;}
button#prever:disabled {opacity: .2;}
button#nexter:disabled {opacity: .2;}

a.card-footer-item.metros {
	background: #ff000073;
	padding: 0.4rem;
}

a.card-footer-item.pies {
	/*background: #ff000073;*/
	padding: 0.4rem;
}

/*Paso 3 selector de setup*/

.bg-chooser {
	background-image: url(../images/step3/bg-chooser.jpg);
	background-size: cover;
	height: 768px;
}

span.file-name {background-color: #FFFFFF;}

section.section.app {
	background: #f5f5f5;
	padding-bottom: 0;
}

article.tile.is-child.setups-chooser {
	display: flex;
	justify-content: space-between;
	flex-direction: column;
}

.venue-title {
    padding-left: 12px;
    padding-right: 12px;
    text-align: center;
    font-weight: 400;
}

.title{
	    font-weight: 400;
}

h1.title.is-1 {color: #FFFFFF;}
h1.title.is-3.step3 {color: #FFFFFF;}
.column.setups{text-align: center;}

.column.setups.is-one-third.setup-icons{
	display: flex;
	align-items: center;
	flex-direction: column;
}

img.setup-icons {
	/*display: block;*/
	/*margin: 0 auto;*/
}

p.setup-titles {
	background: rgba(255, 255, 255, 0.69);
	display: inline-block;
	padding: 2px 8px;
	border-radius: 3px;
}

.tcapacidades {
	padding: 1.25rem;
	background-color: #FFFFFF;
}


/*Paso 4 selector de setup*/
.container.step4 {padding-top: 0.75rem;}

.bg-unity {
	background-image: url(../images/step4/bg-unity.jpg);
	background-size: contain;
	background-repeat: no-repeat;
	height: 768px;
	border: 1px solid #000000;
	background-size: cover;
}

/* Paso 5 RFP */
.container.step5 {
	border: 8px solid #000000;
	padding: 15px;
}

.message.is-danger {
	width: 60%;
	margin: 0 auto;
	margin-bottom: 20px;
}

a.rfp-title {
	position: absolute;
	top: -23px;
	left: -1px;
	text-transform: uppercase;
	font-size: 11px;
	font-weight: 700;
	background: #000000;
	border-radius: 3px 3px 0 0;
	padding: 3px 5px;
	color:#ffffff;
	letter-spacing: 1px;
}

.rfp-contacto, .structure {	
	border-top-right-radius: 3px;
	color: rgba(0, 0, 0, 0.7);
	padding: 1rem;
	position: relative;
}

.rfp-contacto:before, .structure:before {
	background: #dcf1f6;
	border-radius: 3px 3px 0 0;
	bottom: 100%;
	/*content: "Contact Information";*/
	display: inline-block;
	font-size: 7px;
	font-weight: bold;
	left: -1px;
	letter-spacing: 1px;
	padding: 3px 5px;
	position: absolute;
	text-transform: uppercase;
	vertical-align: top;
	font-size: .7rem;
}

.rfp-contacto:not(:last-child), .structure:not(:last-child) {
	/*margin-bottom: 1.5rem;*/
}

.rfp-contacto:not(:first-child), .structure:not(:first-child) {
	margin-top: 2rem;
}

.rfp-comidas, .structure {	
	border-top-right-radius: 3px;
	color: rgba(0, 0, 0, 0.7);
	padding: 1rem;
	position: relative;
}

.rfp-comidas:before, .structure:before {
	background: #dcf1f6;
	border-radius: 3px 3px 0 0;
	bottom: 100%;
	/*content: "Event Details";*/
	display: inline-block;
	font-size: 7px;
	font-weight: bold;
	left: -1px;
	letter-spacing: 1px;
	padding: 3px 5px;
	position: absolute;
	text-transform: uppercase;
	vertical-align: top;
	font-size: .7rem;
}

.rfp-comidas:not(:last-child), .structure:not(:last-child) {
	/*margin-bottom: 1.5rem;*/
}

.rfp-comidas:not(:first-child), .structure:not(:first-child) {
	margin-top: 2rem;
}

.rfp-evento, .structure {	
	border-top-right-radius: 3px;
	color: rgba(0, 0, 0, 0.7);
	padding: 1rem;
	position: relative;
}

.rfp-evento:before, .structure:before {
	background: #dcf1f6;
	border-radius: 3px 3px 0 0;
	bottom: 100%;
	/*content: "Event Dates (Arrival & Departure)"; */
	display: inline-block;
	font-size: 7px;
	font-weight: bold;
	left: -1px;
	letter-spacing: 1px;
	padding: 3px 5px;
	position: absolute;
	text-transform: uppercase;
	vertical-align: top;
	font-size: .7rem;
}

.rfp-evento:not(:last-child), .structure:not(:last-child) {
	/*margin-bottom: 1.5rem;*/
}

.rfp-evento:not(:first-child), .structure:not(:first-child) {
	margin-top: 2rem;
}

.rfp-montaje, .structure {	
	border-top-right-radius: 3px;
	color: rgba(0, 0, 0, 0.7);
	padding: 1rem;
	position: relative;
}

.rfp-montaje:before, .structure:before {
	background: #dcf1f6;
	border-radius: 3px 3px 0 0;
	bottom: 100%;
	/*content: "Meeting room requirements";*/
	display: inline-block;
	font-size: 7px;
	font-weight: bold;
	left: -1px;
	letter-spacing: 1px;
	padding: 3px 5px;
	position: absolute;
	text-transform: uppercase;
	vertical-align: top;
	font-size: .7rem;
}

.rfp-montaje:not(:last-child), .structure:not(:last-child) {
	/*margin-bottom: 1.5rem;*/
}

.rfp-montaje:not(:first-child), .structure:not(:first-child) {
	margin-top: 2rem;
}

.rfp-montaje .textarea {min-height: 63px;}

.rfp-comentarios, .structure {	
	border-top-right-radius: 3px;
	color: rgba(0, 0, 0, 0.7);
	padding: 1rem;
	position: relative;
}

.rfp-comentarios:before, .structure:before {
	background: #dcf1f6;
	border-radius: 3px 3px 0 0;
	bottom: 100%;
	/*content: "Other Events and Venues";*/
	display: inline-block;
	font-size: 7px;
	font-weight: bold;
	left: -1px;
	letter-spacing: 1px;
	padding: 3px 5px;
	position: absolute;
	text-transform: uppercase;
	vertical-align: top;
	font-size: .7rem;
}

.rfp-comentarios:not(:last-child), .structure:not(:last-child) {
	/*margin-bottom: 1.5rem;*/
}

.rfp-comentarios:not(:first-child), .structure:not(:first-child) {
	margin-top: 2rem;
}

.rfp-recaptcha, .structure {	
	border-top-right-radius: 3px;
	color: rgba(0, 0, 0, 0.7);
	padding: 1rem;
	position: relative;
}

.rfp-recaptcha:before, .structure:before {
	background: #dcf1f6;
	border-radius: 3px 3px 0 0;
	bottom: 100%;
	/*content: "Verification";*/
	display: inline-block;
	font-size: 7px;
	font-weight: bold;
	left: -1px;
	letter-spacing: 1px;
	padding: 3px 5px;
	position: absolute;
	text-transform: uppercase;
	vertical-align: top;
	font-size: .7rem;
}

.rfp-recaptcha:not(:last-child), .structure:not(:last-child) {margin-bottom: 1.5rem;}
.rfp-recaptcha:not(:first-child), .structure:not(:first-child) {margin-top: 2rem;}
.columns.evento, .columns.comentarios {margin-top: 0.25rem;}

.rfp-contacto, .rfp-comidas, .rfp-evento, .rfp-montaje, .rfp-comentarios, .rfp-recaptcha {
	/*margin-bottom: 1.5rem;*/
	margin-top: 2rem;
	margin-right: 1rem;
	margin-left: 1rem;
}

.rfp-comentarios, .rfp-recaptcha {margin-bottom: 1rem;}


.button.is-success.send-rfp {
	background-color: #4dbed0;
	text-transform: uppercase;
	font-family: Avenir, sans-serif;
	font-weight: bold;
}

.button.is-success.send-rfp:hover {background-color: #249aae;}

@media only screen and (max-width: 768px)
{
	.customize-3d-button
	{
	    width: 80%;
   		font-size: 1.25rem !important;
   		margin: 0 0 10% 10%;
   		padding: 0 !important;
	}
}
.box-title-welcome {
    padding-top: 40px;
    padding-right: 50px;
    padding-bottom: 10px;
    padding-left: 50px;
    display: block;
    margin: 0 auto;
    margin-top: -100px;
    z-index: 10;
    border: 6px solid #d6f9ff8f;
    max-width: 850px;
    position: absolute;
    bottom: 0;
    margin-left: 180px;
    margin-bottom: -230px;
}

div#linea {
 	background: #101010;
    width: 160px;
    height: 5px;
    position: absolute;
    margin-top: 81px;
    margin-left: -187px;
}

.title-box{
    display: block;
    font-weight: bold;
    font-size: 1.8em;
    margin-bottom: 20px;
    margin-top: 10px;
}



@media screen and (min-device-height: 961px) and (max-device-height: 4024px){
  .container.welcomescreen {

    max-height: 670px;

}
}

@media screen and (min-width: 1088px) and (max-width: 1280px) {
  .box-title-welcome {
    padding-top: 40px;
    padding-right: 50px;
    padding-bottom: 10px;
    padding-left: 50px;
    display: block;
    margin: 0 auto;
    margin-top: -100px;
    z-index: 10;
    border: 6px solid #d6f9ff8f;
    max-width: 734px;
    position: absolute;
    bottom: 0;
    margin-left: 155px;
    margin-bottom: -255px;
  }
}



@media screen and (min-width: 414px) and (max-width: 420px) {
		span.imp {

    position: absolute;
}
	.welcome-title {
	    position: absolute;
	    color: white;
	    font-size: 9vw;
	    width: 75vw;
	    left: 65px;
	    top: 114px;
	    bottom: auto;
	    line-height: 10vw;
	    font-family: Avenir, sans-serif;
	    font-weight: 600;
	}
	a.button.is-info.is-large.enter {
    position: absolute;
    left: 65px;
    top: 70%;
    border-radius: 0px;
    text-transform: uppercase;
    font-family: Avenir, sans-serif;
    font-weight: bold;
    width: 9em;
    background-color: #4dbed0;
}
.container.welcomescreen {
    height: 78vw !important;
}
.fontresc {
    font-size: 2.9vw;
}
div#linea {
    background: none;
    width: 160px;
    height: 5px;
    position: absolute;
    margin-top: 81px;
    margin-left: -187px;
}
.box-title-welcome {
	padding-top: 0;
     padding-top: 0px; 
     padding-right: 0px; 
     padding-bottom: 0px; 
     padding-left: 0px; 
    display: block;
    margin: 0 auto;
    margin-top: -100px;
    z-index: 10;
     border: none;
    max-width: none;
    position: absolute;
    bottom: 0;
    margin-left: 34px;
    margin-right: 10px;
    margin-bottom: -239px;
    min-height: auto;
}
}


@media screen and (min-width: 321px) and (max-width: 667px) {
	span.imp {

    position: absolute;
}
	.welcome-title {
	    position: absolute;
	    color: white;
	    font-size: 9vw;
	    width: 75vw;
	    left: 65px;
	    top: 114px;
	    bottom: auto;
	    line-height: 10vw;
	    font-family: Avenir, sans-serif;
	    font-weight: 600;
	}
	a.button.is-info.is-large.enter {
    position: absolute;
    left: 65px;
    top: 70%;
    border-radius: 0px;
    text-transform: uppercase;
    font-family: Avenir, sans-serif;
    font-weight: bold;
    width: 9em;
    background-color: #4dbed0;
}



.container.welcomescreen {
    height: 78vw !important;
}
.fontresc {
    font-size: 2.9vw;
}
div#linea {
    background: none;
    width: 160px;
    height: 5px;
    position: absolute;
    margin-top: 81px;
    margin-left: -187px;
}
.box-title-welcome {
	padding-top: 0;
     padding-top: 0px; 
     padding-right: 0px; 
     padding-bottom: 0px; 
     padding-left: 0px; 
    display: block;
    margin: 0 auto;
    margin-top: -100px;
    z-index: 10;
     border: none;
    max-width: none;
    position: absolute;
    bottom: 0;
    margin-left: 34px;
    margin-right: 10px;
    margin-bottom: -239px;
    min-height: auto;
}
}


@media screen and (max-width: 420px) {
	.welcome-title {
    position: absolute;
    color: white;
    font-size: 9vw;
    width: 75vw;
    left: 40px;
    top: 85px;
    bottom: auto;
    line-height: 10vw;
    font-family: Avenir, sans-serif;
    font-weight: 600;
}
	a.button.is-info.is-large.enter {
    position: absolute;
    right: 3%;
    bottom: 2%;
    border-radius: 0px;
    text-transform: uppercase;
    font-family: Avenir, sans-serif;
    font-weight: bold;
    width: 9em;
    background-color: #4dbed0;
    left: 40px;
    top: 65%;
}

.title-box{
    display: block;
    font-weight: bold;
    font-size: 1.6em;
    margin-bottom: 20px;
    margin-top: 10px;
}

.container.welcomescreen {
    height: 78vw !important;
}
.fontresc {
    font-size: 3.9vw;
}
div#linea {
    background: none;
    width: 160px;
    height: 5px;
    position: absolute;
    margin-top: 81px;
    margin-left: -187px;
}
.box-title-welcome {
    padding-top: 0;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    display: block;
    margin: 0 auto;
    margin-top: -100px;
    z-index: 10;
    border: none;
    max-width: none;
    position: absolute;
    bottom: 0;
    margin-left: 34px;
    margin-right: 10px;
    margin-bottom: -248px;
    min-height: auto;
}
}




@media screen and (min-width: 1088px) and (max-width: 1220px) {
	.welcome-title {   
		bottom: 160px;
	}

	a.button.is-info.is-large.enter {
	    bottom: 64px;
	}
}

@media screen and (max-width: 1087px) and (min-width: 668px) {
body {
    display: block;
}

div#linea {
    background: #101010;
    width: 54px;
    height: 5px;
    position: absolute;
    margin-top: 81px;
    margin-left: -69px;
}

.container.welcomescreen {
    height: 48vw !important;
}

.fontresc{
font-size: 1.9vw
}

.welcome-title {
    position: absolute;
    color: white;
    font-size: 7vw;
    width: 62vw;
    left: 110px;
    top: 138px;
    bottom: auto;
    line-height: 7vw;
    font-family: Avenir, sans-serif;
    font-weight: 600;
}

a.button.is-info.is-large.enter {
    position: absolute;
    left: 110px;
    bottom: auto;
    top: 35vw;
    border-radius: 0px;
    text-transform: uppercase;
    font-family: Avenir, sans-serif;
    font-weight: bold;
    width: 13.8em;
    height: 3.0em;
    background-color: #4dbed0;
}

.box-title-welcome {
    padding-top: 38px;
    padding-right: 40px;
    padding-bottom: 10px;
    padding-left: 40px;
    display: block;
    margin: 0 auto;
    margin-top: -100px;
    z-index: 10;
    border: 6px solid #d6f9ff8f;
    max-width: none;
    position: absolute;
    bottom: 0;
    margin-left: 34px;
    margin-right: 10px;
    margin-bottom: -239px;
    min-height: auto;
}


}
.customize-3d-button
{
	background-color: #4dbed0;
    padding-top: 10px;
    padding-right: 30px;
    padding-bottom: 10px;
    padding-left: 30px;
	position: relative;
	min-width: 180px;
	margin-top: 30px;
}



.customize-3d-button:hover
{
	color: white;
}

.customize-3d-button:hover:after { width: 90%; }

/*	==========================================================================
	Helper classes
	========================================================================== */

/*
 * Hide visually and from screen readers
 */

.hidden {
	display: none !important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 *
 * 1. For long content, line feeds are not interpreted as spaces and small width
 *    causes content to wrap 1 word per line:
 *    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
 */

.visuallyhidden {
	border: 0;
	clip: rect(0 0 0 0);
	-webkit-clip-path: inset(50%);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	white-space: nowrap; /* 1 */
}

/*
 * Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
	clip: auto;
	-webkit-clip-path: none;
	clip-path: none;
	height: auto;
	margin: 0;
	overflow: visible;
	position: static;
	width: auto;
	white-space: inherit;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */

.invisible {
	visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1.	The space content is one way to avoid an Opera bug when the
 *		`contenteditable` attribute is included anywhere else in the document.
 *		Otherwise it causes space to appear at the top and bottom of elements
 *		that receive the `clearfix` class.
 * 2.	The use of `table` rather than `block` is only necessary if using
 *		`:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
	content: " "; /* 1 */
	display: table; /* 2 */
}

.clearfix:after {
	clear: both;
}

/*	==========================================================================
	EXAMPLE Media Queries for Responsive Design.
	These examples override the primary ('mobile first') styles.
	Modify as content requires.
	========================================================================== */

/*iPhone 5 & 5S in portrait*/
@media only screen 
and (min-device-width : 420px)
and (max-device-width : 568px)
and (orientation : portrait) { /* STYLES GO HERE */ }


/*iPhone 6 in portrait*/
@media only screen 
and (min-device-width : 420px) /*Antes 375*/
and (max-device-width : 768px) /*Antes 667px*/
and (orientation : portrait) {


	html {
		height: 100%;				/*para tener footer abajo  */
		box-sizing: border-box;		/*para tener footer abajo  */
	}

	body{
		display: block;				/*para tener footer abajo  */
		min-height: 100vh;			/*para tener footer abajo  */
		flex-direction: column;		/*para tener footer abajo */
		position: relative;			/*para tener footer abajo  */
		/*padding-bottom: 4rem;*/		/*para tener footer abajo  */
	}

	/* Welcome Screen */
	.container.welcomescreen {
		/* margin-top: 5px; */
		height: 470px;
		padding-top: 0px;
	}

	.navbar.pasos {
		justify-content: space-evenly;
		flex-grow: 1;
		box-shadow: none;
		padding-left: 10px;
	}

	span.menu-break {display: inline-block;}

	.tooltip .tooltiptext{
		width: 220px;
		margin-left: 0;
		left: 0;
	}
    

	.navbar-item.is-tab{
		min-height: 0px;
		margin-top: 10px;
	}

	.deskfoot{display: none;}

	/*Espacio metros pies en móvil*/

	.field.has-addons.metros-pies-sidebar {
		justify-content: center;
		padding-top: 20px;
	}

	h1.title.is-1.welcome {font-size: 2rem;}

	/*Footer*/	
	.vplogo-foot{display: block;}
	
	.losfooters-mobile {
		position: relative;
		width: 100%;
		/*bottom: 0;
		height: 8rem;
		padding-top: 2rem;*/
	}

	.footer-mobile {
		display: block;
	}


	.mifooter {
		font-size: .7rem;
	}

	/* Paso 0 */

	.container.desktop-step-0 {display: none;}
	.container.mobile-step-0 {display: block;}
	.complex-mobile {background-color: #fff8f2;}

	/*.column.step-0-col {
		padding-right: 0;
	}*/

	.select-title-mobile {float: left;}

	h3.select-venue-movil {
		font-size: 1.4em;
		margin-bottom: 20px;
		padding: 0px!important;
	}

	/* Paso 1 */
	.container.desktop-step-1 {display: none;}
	.container.mobile-step-1 {display: block; margin-bottom: 100px!important;}

	/*Paso 1 móvil*/
	h3.select-venue-movil {
		padding: 5px;
		float: right;
		font-weight: bold;
	}

	a.venue-table-movil {display: block;}
	.level-img {margin-bottom: 20px;}
	.mobile-venue-menu {clear: both;}
	.accordion h2 {padding: 10px 25px;}
	a.sub.level-2, a.sub.level-3, a.sub.level-4, a.sub.level-5 {padding: 7px 0;}

	.building-mobile-img {
		height: 130px;
		width: 100%;
	}

	/* Paso 2 */
	/*.video-thumsb {
		height: 188px;
	}*/

	iframe.wixia {
		height: 207px;
		width: 100%;
	}

	.see-full{display: none;}

	.columns.multimedia-thumbs.desktop-step-2 {display: none;}
	.columns.is-mobile.multimedia-nav.mobile-step-2 {display: flex;}

	.tile.is-ancestor.mobile {
		margin-left: 0;
		margin-right: 0;
	}

	.step2-title {font-size: 1.5rem;}


	/* Paso 3 */
	.bg-chooser {height: 470px;}


	/* Paso 4 */
	.bg-unity {
		background-color: #f6f6f6;
		background-size: contain;
	}


	/* Paso 5 */
	.container.step5 {margin: 0.75rem;}

	.columns.evento, .columns.comentarios {
		margin-top: 0.25rem;
		padding-bottom: 1px;
	}
}

/*iPhone 6 Plus in portrait*/
@media only screen 
and (min-device-width : 414px)
and (max-device-width : 736px)
and (orientation : portrait) { /* STYLES GO HERE */ }


/*Ancho de la tabla en el paso 1 para escritorio*/
/*@media screen and (min-width: 1088px) {
	.container {
		max-width: 1152px;
		width: 1152px;
	}
}*/


@media only screen and (min-width: 35em) {
	/* Style adjustments for viewports that meet the condition */
}

@media print,
		(-webkit-min-device-pixel-ratio: 1.25),
		(min-resolution: 1.25dppx),
		(min-resolution: 120dpi) {
	/* Style adjustments for high resolution devices */
}

/*	==========================================================================
	Print styles.
	Inlined to avoid the additional HTTP request:
	http://www.phpied.com/delay-loading-your-print-css/
	========================================================================== */

@media print {
	*,
	*:before,
	*:after {
		background: transparent !important;
		color: #000 !important; /* Black prints faster:
								   http://www.sanbeiji.com/archives/953 */
		box-shadow: none !important;
		text-shadow: none !important;
	}

	a,
	a:visited {
		text-decoration: underline;
	}

	a[href]:after {
		content: " (" attr(href) ")";
	}

	abbr[title]:after {
		content: " (" attr(title) ")";
	}

	/*
	 * Don't show links that are fragment identifiers,
	 * or use the `javascript:` pseudo protocol
	 */

	a[href^="#"]:after,
	a[href^="javascript:"]:after {
		content: "";
	}

	pre {
		white-space: pre-wrap !important;
	}
	pre,
	blockquote {
		border: 1px solid #999;
		page-break-inside: avoid;
	}

	/*
	 * Printing Tables:
	 * http://css-discuss.incutio.com/wiki/Printing_Tables
	 */

	thead {
		display: table-header-group;
	}

	tr,
	img {
		page-break-inside: avoid;
	}

	p,
	h2,
	h3 {
		orphans: 3;
		widows: 3;
	}

	h2,
	h3 {
		page-break-after: avoid;
	}
}


.thumb-photo span.icon.is-small {
    top: 0;
    height: 32px;
    color: white;
    position: absolute;
    z-index: 100;
    background: rgba(0, 0, 0, 0.7);
}
.thumb-video span.icon.is-small {
    top: 0;
    height: 32px;
    color: white;
    position: absolute;
    z-index: 100;
}

span.icon.is-small.icon-video-yt {
    width: 100%;
    height: 100%;
    background:  rgba(0, 0, 0, 0.7);
}

i.far.fa-play-circle {
    font-size: 50px;
    color: #b5b5b585;
    margin-top: 12px;
}

.button.metricSystemReactive-meters span, .button.metricSystemReactive-feets span {
    color: black;
}

.button.metros{
	background-color: #000000;
}

.button.metros span{
	color: #FFFFFF !important ;
}

.nativeInputDialogInput{
	margin-top: auto!important;
}

.button{

    border-radius: 0px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
}

.containerCheckbox{
	padding-left: 10px;
	font-size: 16px;
}

.containerCheckbox.lbl_leyenda_vp2_eh{
	font-weight: bold;
}



.cc-window{
	position:absolute;
	bottom: 30%!important;

}

.cc-window.cc-banner.cc-type-opt-out.cc-theme-block {
	background-color: #cccccced;
	z-index: 9999;
	width: 100%;
}

.cc-window.cc-banner {
    padding: 50px!important;
    text-align: justify;
    font-size: .9em;
}

a.cc-btn.cc-dismiss {
    width: 150px;    
    background-color: #999999;
    color: #cccccc;
}

.cc-compliance.cc-highlight a {
    font-size: 1em!important;
    padding: 20px;
    font-family: arial;
    font-weight: bold;
    text-transform: uppercase;
}

.cc-banner .cc-message {
    padding-right: 100px;
    color: #666666;
}

a.cc-link {
    color: #999999!important;
}




.cc-window.cc-banner {
    padding: 5px;
}
.cc-revoke, .cc-window {
    font-size: 13px;
}
.cc-banner .cc-btn:last-child {
    min-width: 82px;
}
.cc-btn {

    padding: 0px;
    font-size: 13px!important;
    margin: 5px;
    font-weight: normal;
}
.cc-revoke{
    display: none!important;
}

.cc-deny{
  display: none!important;
}

img#icon-360{
	width: 70%;
    height: auto;
    margin: auto auto;
}