/* ------------------------------------------------- GENERICS ------------- */

/* -------------------------------------------------- LAYOUT ELEMENTS ---------- */
/* New button colors */
a.button,
label.button{
	color: #fff;
	background-color: rgb(209,36,33);
}
a.button:hover,
label.button:hover{background-color: rgba(209,36,33,0.80);}

/* Info wide */
.info-wide{
	padding: 8em 10%;
}
.info-wide{
	background-color: #B2B2B2;
	background-image: linear-gradient(131deg, rgb(209,36,33) 40%, rgb(203,75,73) 80%);
	background-image: -webkit-linear-gradient(131deg, rgb(209,36,33) 40%, rgb(203,75,73) 80%);
	background-image: -moz-linear-gradient(131deg, rgb(209,36,33) 40%, rgb(203,75,73) 80%);
	background-image: -o-linear-gradient(131deg, rgb(209,36,33) 40%, rgb(203,75,73) 80%);
}
.info-wide a.button:hover{
	background-color: #fff;
	color: rgb(209,36,33);
	transition: all 0.2s ease;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
}
.info-wide img:first-of-type{
	display: none;
	width: 50%;
	margin: auto;
}
.info-wide img:last-of-type{
	position: absolute;
	width: 35%;
	bottom: -0.4em;
	right: 10%;
}
.info-wide article{
	float: left;
}

/* -------------------------------------------------- NAVBAR ---------- */
.navbar .navbar-cont #item-invoices{color: #000;}
.navbar .navbar-cont #item-contacto{color: rgb(209,36,33)}
.navbar .navbar-cont #item-contacto:hover{color: rgba(209,36,33,0.90);}
.navbar .navbar-button:hover,
#navbar-controller:checked ~ .navbar > .navbar-button{color: #595959;}

/* Bottom items */
/*.navbar .menu-items-bottom {background: rgba(146,89,230,0.2);}*/
#subnavbar .menu-items-bottom a:hover{color: rgba(209,36,33,0.90)}

/* -------------------------------------------------- HIDDEN NAVBAR ---------- */
.navbar-hidden .collapse-button:hover,
.navbar-hidden .collapse-controller:checked ~ .collapse-button{color: #6D6D6D;}

/* Current item */
.navbar-hidden .menu-items #item-invoices{color: #6D6D6D;}

.navbar-hidden .menu-items .important{
background-color: rgb(209,36,33);
	box-shadow: -1em 0 0 rgba(209,36,33,0.90);

}


/* -------------------------------------------------- HEADER ---------- */
#header{
	background-image: url(../../../images/productos/ticketbai/cab-bg.jpg);
	background-size: cover;
	background-position: center;
	padding: 4em 5%;
}
#header a.scroll-down:hover:before,
#header-solutions a.scroll-down:hover:before{color: rgba(109,109,109,1);}
#header a.scroll-down:before,
#header-solutions a.scroll-down:before{color: rgba(109,109,109,0.5);}

/* -------------------------------------------------- HEADER SOLUTIONS ---------- */
#header-solutions{
	background-image: url(../../../images/productos/ticketbai/cab-bg.jpg);
}
#header-solutions a.button{
	color: #fff;
	background-color: rgb(209,36,33);
}
#header-solutions a.button:hover{background-color: rgba(209,36,33,0.90);}

/* -------------------------------------------------- COMPARATIVE ---------- */
#comparative {
	background-image: url(../../../images/productos/ticketbai/cab-bg.jpg);
	background-size: cover;
	background-position: top;
	padding: 4em 0;
}
#comparative .solutions{
	width: 100%;
	margin: auto;
}
#comparative table{
	position: relative;
	float: right;
	width: 33%;
	text-align: center;
	background-color: rgba(255,255,255,0.8);
	box-shadow: 0 0 0 1px #d5d5d5;
	z-index: 1100;
	margin-left: 0.5em;
}
#comparative table thead,
#comparative table p,
#comparative table tfoot{opacity: 0.8;}

#comparative table p.table-subtitle{opacity: 1;}

/*#comparative table{background-color: #fff;}*/
/*#comparative table:hover{background-color: #fff;}

#comparative table:hover thead,
#comparative table:hover p,
#comparative table:hover tfoot{opacity: 1;}*/

#comparative table th a{
	color: #333;
	text-decoration: none;
}
/*#comparative table th a:hover{color: #9259e6;}

#comparative table.current{
	box-shadow: 0 0 0 10px #fff, 0 0 0 11px #d5d5d5, 0 0.5em 1.5em rgba(150,150,150,0.5);
	background-color: #fff;
	z-index: 1110;
	opacity: 1;
}
#comparative table.current thead,
#comparative table.current p,
#comparative table.current tfoot{opacity: 1;}

#comparative table.current th a{color: #9259e6;}*/

#comparative table th{
	color: #333;
	padding: 0.8em 0;
}
#comparative table p{
	border-bottom: 1px solid #eee;
	padding: 0.5em 0;
	margin: 0 1em;
}
#comparative .included:before{
	content: "\e875";
	font-family: fontello;
	display: block;
	color: #595959;
}
#comparative table:last-of-type .table-subtitle{
	position: absolute;
	display: block;
	color: #595959;
	border: 0;
	margin-left: -100%;
}
#comparative table .table-subtitle{
	display: none;
	color: #595959;
	border: 0;
}
#comparative table td{
	font-size: 0.7em;
	color: #777;
}
#comparative table > thead{font-size: 1.3em;}

#comparative table a.button{
	width: 80%;
	margin: 1.2em 0;
}

/* -------------------------------------------------- LISTA UL LI ticketBAI---------- */

ul.lista{
	list-style-type: square;
	color:#747474;
}

/* -------------------------------------------------- TABLA ticketBAI ---------- */

	table.ticketbai  {
		width: 100%;
	}

	table.ticketbai th{
		color:white;
		background-color: rgb(212, 0, 0);
		vertical-align: middle;
		text-align: center;
		border: 1px solid white;
	}

	table.ticketbai td{
		vertical-align: middle;
		text-align: center;
	}
	table.ticketbai tr{
		height: 90px;
	}

/* -------------------------------------------------- Video ---------- */

.video-box {
	width: 100%;
	max-width: 720px;
	height: auto;
	margin: 36px auto 0;
  }
  .video {
	position: relative;
	height: 0;
	padding-top: 56.25%;
	margin-left: 10px;
	margin-right: 10px;
  }
  
  .video video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/*width: 100%; 
	height: auto;*/
  }
  
 /* .video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
  } */

/* -------------------------------------------------- DESTACADO ---------- */
#destacado .section-content{background-color: #595959;}

#destacado .section-content ul li:before{content: "\e800";}

#destacado .section-content a.button{color: #595959;}

/* -------------------------------------------------- GENERAL FEATURES ---------- */
#general-features #int-aplicaciones h2:before{content: "\e81a";}
#general-features #int-sistemas h2:before{content: "\e850";}
#general-features #sol-repcon h2:before{content: "\e84d";}




/* -------------------------------------------------- MEDIA QUERIES ---------- */
@media screen and (max-width: 988px){
	/* Info wide */
	.info-wide img:last-of-type{width: 45%;}
}
@media screen and (max-width: 768px){
	/* Info wide */
	.info-wide{padding: 5em 10%;}
	.info-wide img:first-of-type{display: block;}
	.info-wide img:last-of-type{display: none;}

	/* Comparative */
	#comparative{
		background-image: none;
		padding: 2em 0;
	}
	#comparative table .table-subtitle {display: inline-block;}
	#comparative table p{
		display: inline-block;
		width: 50%;
		margin: 0;
	}
	#comparative table:last-of-type .table-subtitle,
	#comparative table .table-subtitle{
		position: relative;
		display: inline-block;
		text-align: left;
		border-bottom: 1px solid #eee;
		padding: 0.5em 1em;
		margin: 0;
	}
	#comparative table td{padding: 0.2em;}
	
	#comparative table.disabled{display: none}
	
	#comparative table.current{
		width: 100%;
		font-size: 1.3em;
		box-shadow: none;
	}
	#comparative table.current a.button{
		width: 55%;
		font-size: 0.85em;
	}
}
@media screen and (max-width: 480px){
	/* Info wide */
	.info-wide img:first-of-type{width: 60%;}
	
	/* Comparative */
	#comparative table.current{font-size: 1.3em;}
	
	#comparative table.current a.button{width: 100%;}
	
	#comparative table p {
		display: block;
		width: 100%;
		padding: 0.1em 0 0.3em 0;
	}
	#comparative table:last-of-type .table-subtitle,
	#comparative table .table-subtitle{
		display: block;
		width: 100%;
		text-align: center;
		border: 0;
		padding: 0.3em 0 0.1em 0;
	}
}