// ----------------------------------------
// S T Y L U S  T R E E
// C R I T I C A L  S T Y L E S
// ----------------------------------------

@import "nib"
@import "minireset.min.css"
@import "skeleton.css"
@import "../vars"
@import "../_helpers/mixins"
@import "../_helpers/blocks"
@import "../_helpers/helpers"
@import "../_molecules/block"
@import "../_molecules/social"
@import "../_molecules/toolbar"
@import "../_molecules/nav"
@import "../_organism/hero"
@import "../_organism/carousel"
@import "../_organism/header"
@import "../_molecules/discounts"

html
	font-size 62.5%
	box-sizing border-box
body
	{$bBody}
	font-size 1.6em // currently ems cause chrome bug misinterpreting rems on body element 
	line-height 1.6
	font-family Arial, Helvetica, sans-serif
	overflow-x hidden
main.container
	padding-top $default
	//background-color $bColor_main
	padding-bottom ($default * 3)
	margin-bottom ($default * 3)
	z-index 90
	.content
		padding-left $default
// .phone-list
// 	// min-width 210px !important
.bblue
	background blueinfo
	color blanco
.margin
	margin 1em 0
.go-top
	color blanco
	background-color blueinfo
	border-radius 50%
	width 4em
	height 4em
	display inline-block
	margin-bottom 17px
		
.bus
	margin-bottom 77px

.book-header
	font-size 33px
	font-weight 600
.menu-site
	{$cMenuSitemap}
.separator
	margin-bottom $default
	margin-top $default
	padding-top ($default * 2)
	hr
		width 95%
		margin-top 0
		margin-bottom 0
	i
		position relative
		top -10px
.formas-pago 
	img
		margin 0 auto

nav
	ul
		list-style-type none
		li
			float left
		
		a
			color inherit
			&:hover  
				color: $navUla
			

.dropdown-menu
	display none

.go-bottom
	position absolute
	bottom 15vh
	right 0
	i
		color blanco

.save
	margin-top remify(50px)
	padding-top remify(25px)
	border-top 1px solid seventh

.fakeCheck
	{$fake_checkbox}
	background-color blanco
	margin-right 10px
	color online
/*XPLOR*/	
.row
	.info-park-container
		&:first-child
			.link-xplor-park
				img	
					padding-top 15.5px
.link-xplor-park
	display table
	margin auto
	height 82px
.quees-xplor-image
	width 200px

.block
	&:last-child
		.separator
			display none

/*FAQ XPLOR*/
#faqDesck
	display none	
#faqDropdown
	display block
	background quaternary
	color blanco
	font-size 1em
	padding 0.5em
	#faqDrop
		margin-bottom 1em
		width 100%
	.dropdown-menu
		width 100%
		background blanco
		#myTabsFAQ
			padding-left 0 
			li
				display block
				padding 0.2em
				&.active
					background blanco
					color blanco
					&:after
						content ''
#faqContent
	width 100%
	margin-left 0em

.prices-table
	position relative
	oveflow hidden
	.main-header
		position relative
		margin-bottom 60px
		margin-left -10px
	.main-header-fixed
		position fixed
		top 0
		paddin-left 0
		z-index 2
		.categories
			position relative
			left -10px
		.prices-body
			margin-top 40px
.icon-external-link
	float right !important
	width 14px	
	margin 10px 0 0 10px
	right 0

/* small video */	
@media (min-width : 36.875em)
	.main-header
		margin-bottom 45px !important
//-------------
// Up to 768px
//-------------
@media (min-width : 48.000em)
	.table-mobile
		opacity 0
		display none
	.icon-external-link
		margin 7px 0 0 10px
	#faqDesck
		display block
		width 35%
		{$faqDesk}
		h4
			margin-top 1em
			margin-left 1em
			{$faqDeskText}
	#faqContent
		width 60%
		margin-left 2em
		.panel:nth-of-type(odd)
			{$faqContentPanel}
		.panel-title
			{$faqPanelTitle}
	#faqDropdown
		display none
	#myTabsFAQ
		padding-left 0 
		li
			display block
			padding 0.5em 1em
			width 100%
			position relative
			overflow hidden
			&.active
				{$faqTabsActive}
				&.active
					&:after
						content ''
						display block
						position absolute
						right 0
						top 0
						width 0
						height 0
						border-top 24px solid transparent
						border-right 15px solid blanco
						border-bottom 24px solid transparent
						margin auto
						bottom 0
						
			a
				font-size 0.85em
	h4.panel-title
		font-size 1em
	.intro
		.flex--item
			&:nth-of-type(1)
				border-right $borderFirstBlock
				padding-right ($default * 2)
			&:nth-of-type(2)
				flex-grow 2
				padding-left ($default * 2)
		h2
			text-align right
			
	// .save
	// 	> .flex--item
	// 		padding $default
	// 		&:first-child
	// 			border-right $dBorder
	aside
		/*&:before
			content ''
			width 1px
			height 90%
			position absolute
			left -15px
			top 65px
			border-left 1px solid alpha($bAsideDivider, 30%)*/
		.negative
			top emify(-54.4px)
			z-index 99
			position relative
//-------------
// Up to 990px
//-------------
@media (min-width : 61.875em)
	aside
		
		&.left
			&:before
				display none

	.block
		&.save
			margin-bottom ($default * 2)
//-------------
// Up to 1024px (1025px)
//-------------		
@media(min-width : 320px) and (max-width : 720px)
	.video-sm
		iframe			
			width 100%
			height auto
	.table-mobile
		display inline
		width 100%
		padding none
	.table-hotel
		display none	
	.table-desktop
		display none