@font-face
 {
	font-family: 'font-book', 'arial';
    font-weight: normal;
    font-style: normal;
 }

body,html {
	margin:0;
	padding:0;
	height:100%;width:100%;
	font-family: 'font-book', 'arial';
	font-size:12pt
}

/*
.big body,html {
	font-size:16pt	
}
*/
#viewport {
	font-size:12pt;
	font-family: 'font-book', 'arial';
}
.big #viewport {
	font-size:16pt;
	font-family: 'font-book', 'arial';
}
.font160 {font-size:140%}
.font140 {font-size:130%}
.font120 {font-size:120%}
.font80 {font-size:80%}
table{padding:10px;}
table th {
	font-size:120%;
	text-align:left;
	height:30px;
	font-weight:normal;
	padding-left:20px;
	padding-top:10px;
	padding-bottom:10px;
	background-color: #000;
    background:rgba(0,0,0,.1);
	
}
table td {
	vertical-align:middle;
	text-align:center;
	width:100%;
}
img {vertical-align:middle}
#viewport,#loading,#nosupport {
    /*width:1024px;*/
    width:100%;
    height:100%;
    background-color: #f2f2f2;
    margin-left:auto;
    margin-right:auto;
    margin-top:0px;
    overflow:hidden;
    position:relative; /* Para que container soporte left */
}
#loading {
    z-index:100;
    left: 0px;
    top:0px;
    margin-top:0px;
    visibility: visible;	
	/*background-image:url('../images/progress.gif');*/
	background-image:url('../images/loading.gif');
	background-repeat:no-repeat;
	background-position:center center;
}
#nosupport {
    z-index:200;
} 
#container {
    position:absolute;
    background-color: #d9d9d9;
    margin:0;
    padding:0;
    left:0px;
    width:1000px;
}
#container-resultados, #container-familia, #container-equipos {
    position:absolute;
    margin:0;
    padding:0;
    left:0px;
	background-color: #10316f;
    background:rgba(16,49,111,.8);
    overflow: hidden;
	text-align:left;
	display:block;
	width:100%;
}
#container-familia {
	color:#08397f;
	background-color: #d5d5d5;
	border-top: 1px solid #d5d5d5;
}
#container-equipos {
	color:#08397f;
	background-color: #d5d5d5;
	border-bottom: 1px solid #d5d5d5;
}
#ventana-datos, #ventanaHelp, #ventanaHelp2, #ventanaHelp3, #paredes {
    position:absolute;
    margin:0;
    padding:0;
    left:0px;
    overflow: hidden;
	text-align:left;
	display:block;
	width:100%;
	margin-bottom:10px
}
#ventanaHelp2{
	margin-top:90px;
	left:-300px;	
}
#ventanaHelp3{
	margin-top:110px;
	left:-300px;	
}

#ventana-datos {
	padding-top:10px;
}
.ventana-button{
	display:inline-block;
	border:1px solid white;
	padding:5px;
	font-weight:700;
	width:30px;
	border-radius:0px;
	text-align:center;
	margin-left:8px;
	cursor:pointer
}
.ventana-button:hover, #pared-selector:hover{
	background-color: #b4ca2c;
}
#pared-selector:hover{
	background-color: red;
}

.pared-selector-container {
	position:relative;
	display:inline-block;
	vertical-align:middle;
	width:50px;height:30px;
	border:1px solid white;
	border-radius:15px;
	text-align:center;
	font-weight:bold;
	margin:8px;
	border:1px solid white
}
#pared-selector {
	position:absolute;
	border:1px solid white;
	width:30px;height:30px;
	left:-1px;
	top:-1px;
	border-radius:15px;
    background-color: #b7202c;
	cursor:pointer;
}
.pared-selector-enabled {
	border:1px solid silver;
	background-color:#B4CA2C;
}

.familia-arrow-up {
	height:30px;width:100%;top:0px;position:absolute;cursor:pointer;color:white;
	background-image:url('../images/divup.png');
	background-position:center 3px;
	background-repeat:no-repeat;
	cursor:pointer;
}

.familia-arrow-down {
	background-image:url('../images/divdown.png');
}

#familia-imgicon-container {
	position:absolute;
	top:-50px;
	width: 100px;
	height: 50px;
	text-align:center;
	left: 50%;
	transform: translate(-50px, 0px); /* center! */
	-webkit-transform: translate(-50px, 0px); /* center! */	
	-ms-transform: translate(-50px, 0px); /* center! */
	background-color:#d5d5d5;
	background-color:transparent;
    border-top-left-radius:5px;
    border-top-right-radius:5px;
	/*border: 1px solid #27B6EA;*/
	border-bottom:none;    
}
#familia-imgicon-container.big {
	top:-71px;	
	width: 150px;
	height: 70px;
	transform: translate(-75px, 0px); /* center! */
	-webkit-transform: translate(-75px, 0px); /* center! */	
	-ms-transform: translate(-75px, 0px); /* center! */	
}

#familia-imgicon-container:hover {
	background-color:#d5d5d5;
	padding-top:4px;
}

#familia-imgicon-container img{  
   -webkit-filter: invert(1);
   filter: invert(1);   
}

#familia-imgicon {
	height:48px;
	cursor:pointer;
}
#familia-imgicon.big {
	height:70px;
}

.resultados-arrow-down {
	height:30px;width:100%;bottom:0px;position:absolute;cursor:pointer;color:white;
	background-image:url('../images/divdown.png');
	background-position:center center;
	background-repeat:no-repeat;
	cursor:pointer;
}

.resultados-arrow-up {
	background-image:url('../images/divup.png');
}

.resultados-arrow-left {
	width:30px;height:100%;top:0px;position:absolute;cursor:pointer;color:white;
	background-image:url('../images/divleft.png');
	background-position:center center;
	background-repeat:no-repeat
}
.resultados-arrow-right {
	width:30px;height:100%;top:0px;position:absolute;cursor:pointer;color:white;
	background-image:url('../images/divright.png');
	background-position:center center;
	background-repeat:no-repeat
}

.chartText{
	position:absolute;color:white;text-align:center;top:65%;left:50%
}
.chartContainerFinal .chartText {
    color:#10316f;
}
.chartText p {
	font-size:100%;
	margin:2px;
}

.page {	
	float:left;
	margin:0px;
	padding:0px;
	color:#08397f;
	position:relative;
}
.page-container{
	position:relative;
	height:300px;
	overflow:auto;
	overflow-x:hidden;
	margin-top:30px;
}
.page-background{
	position:absolute;
	width:100%;
	height:100%;
}
#page-button-container {
	position:absolute;
    background-color: #08387d;	
	bottom:0px;
	left: 0px;
	width:100%;
}
#page-logo {
	position:absolute;
	width:100%;
	height:100%;
	background-image:url('../images/carrierPie.png');
	background-repeat:no-repeat;
	background-position:center,center;
	background-size:auto 60%;
	display:none;
}
.page-button {
	position:absolute;
	width:70px;
	height:70px;
	cursor:pointer;
}
.page-button:hover {
	background-color: #94b832;	
}

#prev-button{
	display:none;
	background-image:url('../images/divleft.png');
	background-repeat:no-repeat;
	background-position:20px,center
}
#next-button{
	background-image:url('../images/divright.png');
	background-repeat:no-repeat;
	background-position:25px,center;
	right:0px;
}

.option-button-container {
	text-align:center;
	margin-left:auto;
	margin-right:20px;
	display:inline-block;
	width:150px;
    vertical-align:top;
}
.option-button-container.big {
	width:180px;
}
.option-button-img{
	text-align:center;
	width:150px;
	height:150px;
	border:1px solid transparent;
	background-color:#d9d9d9;		
	background-repeat:no-repeat;
	background-position:center center;
	margin-left:auto;
	margin-right:auto;
	cursor:pointer;
}
.option-button-img.big{
	width:150px;
	height:150px;
}
.option-button-img-doble{
	text-align:center;
	width:150px;
	height:180px;
	border:1px solid transparent;
	background-color:#d9d9d9;	
	background-repeat:no-repeat;
	background-position:center top;
	margin-left:auto;
	margin-right:auto;
	cursor:pointer;
}
.option-button-img-doble.big{
	width:150px;
}
.option-button-img-small{
	text-align:center;
	width:60px;
	height:60px;
	border-radius:30px;
	background:rgba(255,255,255,.4);	
	background-repeat:no-repeat;
	background-position: center center;
	margin-left:auto;
	margin-right:auto;
	cursor:pointer;
}
.option-button-img-small p{
	position:absolute;
	margin-top:-30px;
	width:auto;
	text-align:left
}

.option-button-img:hover, .option-button-img-doble:hover{
	background-color:transparent;
	border:1px solid #FFFFFF;
}

.option-button-img-small:hover{
	background-color: #f2f2f2;
}
.option-button-img-small p{
	visibility:hidden;
    background:rgba(255,255,255,.3);
    padding:5px;
    border-radius:5px;
	
}
.option-button-img-small:hover p{
	visibility:visible;	
}
.option-button-img-selected{
	background-color: #f5f5f5;
	border:1px solid transparent;
}

.option-button-txt {
	text-align:center;
	margin-top:8px;
	margin-bottom:8px;
}

.option-button-extraimage{
	width:100%;
	height:100%;
	margin-top:70px;
	background-repeat:no-repeat;
	background-size:80%;
	background-position:center top;
 	opacity:0.5; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter:alpha(opacity=50);
}
.option-button-extraimage.big{
	background-size:80%;
}

.extraimage-Living{
	background-image:url('../images/btn_hab_living.png');
}
.extraimage-Dormitorio{
	background-image:url('../images/btn_hab_dormitorio.png');
}
.extraimage-Oficina{
	background-image:url('../images/btn_hab_oficina.png');
}
.extraimage-Comercio{
	background-image:url('../images/btn_hab_comercio.png');
}

.section-container {
	text-align:center;
	margin-left:auto;
	margin-right:20px;
	display:inline-block;
    vertical-align:top;
	zoom: 1;
    *display: inline;
    
    
}
.section-item {
	display:inline-block;
}

.pared, .compass, .sol {
	position:absolute;
	visibility:hidden
}
.pared img {
	border:0px;
}
.orientacion{
	position:absolute;
	margin-left:50px;
	margin-top:35px;
	text-align:center;
	background-color:transparent;
	width:70%;
	height:auto;
}
.compassChange {
	position:absolute;
	display:inline-block;
	width:50%;
	height:100%;
	cursor:pointer;
}
#compassChange1 {
	background-image:url('../images/compassarrowleft.png');
	background-repeat:no-repeat;
	left:0px;
}
#compassChange2 {
	background-image:url('../images/compassarrowright.png');
	background-repeat:no-repeat;
	right:0px
}

.orientacion img {
	border:0px;
	width:70%;
 	opacity:0.7; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter:alpha(opacity=70);
	
}
.visible {
	visibility:visible
}
.map {
	
}
.iluintback {
	background-repeat:no-repeat;
	background-position:center center;
}
#iluintback0{
	opacity:0.35; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=35)"; filter:alpha(opacity=35);	
}
#iluintback1{
	opacity:0.7; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter:alpha(opacity=70);
}
#FamiliasList{
	text-align:left;
	width:auto;
	margin-bottom:50px;
}

.familia{  /* botones de la lista*/
/*
	position:relative;
	border:1px solid #27B6EA;
	padding:0px;
	cursor:pointer;
	border-radius:10px;
	height:30px;
	min-height:30px;
	width:auto;
	min-width:30%;
	max-width:300px;
	margin:1px;
	overflow:visible;
*/	
}

.familia{
	position:relative;
	border:1px solid transparent;
	background-color:rgba(0,0,0,.3);
	padding:0px;
	cursor:pointer;
	/*border-radius:10px;*/
	height:30px;
	min-height:30px;
	width:auto;
	min-width:30%;
	max-width:300px;
	margin:1px;
	overflow:visible;
	color:White;
}
.familia:hover, .familia-selected{
	background-color: #b4ca2c;
	border:1px solid transparent;
}
.familia img {
	vertical-align:middle;
}
.familiaImagenList { /* imagen del equipo de la familia*/
	height:100%;
	max-height:100%;
	min-height:28px;
	width:auto;
	margin-left:10px;
	vertical-align:middle;
}
.chartContainerFinal {
	width:50%;
	height:274px; /*274*/
	min-height:274px;
	position:relative;
	text-align:left;
}

.chartContainerFinal .dxg-labels
{
    fill:#10316f !important;
}
.chartContainerFinal .dxg-value-indicator, .chartContainerFinal .dxg-spindle-hole 
{
    fill:#888888 !important;
}

#resultadoMensaje{
	position:absolute;text-align:center;width:100%;background-color:#27B6EA;height:70px;
	display:block;color:white;font-size:120%;
	/*opacity:0.7; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter:alpha(opacity=70);	*/
}
.button-familia-ver {
	border:1px solid #27B6EA;
	cursor:pointer;
	border-radius:10px;
	left:-30px;
	margin:-4px;
}
#familia-buttons{
	position:absolute;
	text-align:left;
	padding-left:40px;
	bottom:80px;
	width:100%;
}
.modelo-container{
	width:100%;
}
.modelo-container p{
	margin:5px;
	margin-top:10px;
	text-align:center;
	font-size:100%;
}
.equipo-button{}
-equipos-result-ok {
	width:100%;
}
.equipos-result-text {
	width:80%;
	text-align:center;
	border-radius: 0px;
	padding: 30px;
	margin-top: 20px;
	margin-left:auto;
	margin-right:auto;
	color:White;
}

/*
.pageHabLiving {
	background-image:url('../images/fondos/living.jpg');
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center center;
}
.pageHabDormitorio {	
	background-image:url('../images/fondos/dormitorio.jpg');
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center center;
}
.pageHabOficina {	
	background-image:url('../images/fondos/oficina.jpg');
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center center
}
.pageHabComercio {	
	background-image:url('../images/fondos/comercio.jpg');
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center center
}

.pageZonaTemplada {
	background-image:url('../images/fondos/fadeUp.png'),url('../images/fondos/zona_templada.jpg');
	background-repeat:repeat-x,no-repeat;
	background-size:contain,cover;
	background-position:center center, center center;
}
.pageZonaCalida {
	background-image:url('../images/fondos/fadeUp.png'),url('../images/fondos/zona_calida.jpg');
	background-repeat:repeat-x,no-repeat;
	background-size:contain,cover;
	background-position:center center;
}
.pageZonaMuyCalida {
	background-image:url('../images/fondos/fadeUp.png'),url('../images/fondos/zona_muycalida.jpg');
	background-repeat:repeat-x,no-repeat;
	background-size:contain,cover;
	background-position:center center;
}

.pageEdificioAntiguo {
	background-image:url('../images/fondos/fadeUp.png'),url('../images/fondos/edificio_antiguo.jpg');
	background-repeat:repeat-x,no-repeat;
	background-size:contain,cover;
	background-position:center center, center center;
}
.pageEdificioModerno {
	background-image:url('../images/fondos/fadeUp.png'),url('../images/fondos/edificio_moderno.jpg');
	background-repeat:repeat-x,no-repeat;
	background-size:contain,cover;
	background-position:center center;
}
.pageEdificioNuevo {
	background-image:url('../images/fondos/fadeUp.png'),url('../images/fondos/edificio_nuevo.jpg');
	background-repeat:repeat-x,no-repeat;
	background-size:contain,cover;
	background-position:center center;
}
*/
/*
#page0{
	background-image:url('../images/fondos/fadeUp.png'),url('../images/fondos/bienvenido.jpg');
	background-repeat:repeat-x,no-repeat;
	background-size:contain,cover;
	background-position:center center, center center
}
#page2{
	background-image:url('../images/fondos/tipo_edificio.png');
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center center
}
*/
/*#page3,#page4,#page5,#page6,#page7,#page8,#page9,#page10,#page11,#page12{
	background-image:url('../images/fondos/fade.png');
	background-repeat:repeat-x;
	background-size:contain;
	background-position:center center
}*/

.page-container {
	background-image:url('../images/fondos/fade.png');
	background-repeat:repeat-x;
	background-size:contain;
	background-position:center center
}}
/*
#page13{
	background-image:url('../images/fondos/fadefinal.png');
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center center
}
*/

@media (max-height: 640px) {
	#viewport {height:570px;}
}
@media (max-height: 480px) {
	#viewport {height:410px;}
}