/********************************************
* 	Estilos Base
********************************************/

*  {
	margin: 0;
	padding: 0;

}

ul,ol {
    list-style: none;
}

html, body {
	background-color: #dde6e5;
	font-family: 'Open Sans', sans-serif;
    -webkit-font-smoothing: antialiased;
    font-size: x-small;
    color: #666666;
/* 	min-width:1312px; */
	width: 100%;
}


/********************************************
* 	Estilos Bloque Panel
********************************************/

#panel{
	position:fixed;
/* 	position:relative; */
	float:left;
	width: 252px;
 	height: 100%;
    background-color: #4a4a4a;
	z-index:21;
	
	box-shadow: 3px 0px 3px rgba(0, 0, 0, 0.3);
   -webkit-box-shadow: 3px 0px 3px rgba(0, 0, 0, 0.3);
   -moz-box-shadow: 3px 0px 3px rgba(0, 0, 0, 0.3);
}

#logoJunta {
	width: 252px;
 	height: 81px; 
	background: url("../img/logojunta.png") no-repeat;
	background-position: center;
}


/****Panel Wacom *******************************************************/

#panel_wacom{
	float:left;
	width: 252px;
 	height: calc(100%-81px);
	height: -webkit-calc(100%-81px); 
	height: -moz-calc(100%-81px);
    background-color: #4a4a4a;
}

li.panel_menu {
	height: 40px;
    background-color: #4a4a4a;
}

.botonwacom {
 	display: table;
	height:40px
}

.botonwacom .icono{
	width: 21px;
	height: 21px;
	margin: 10px 18px 9px 19px;
	vertical-align:middle;
	float: left;
}

.botonwacom #icono_territorio{
 	background: 0px 0px url("../img/icono_territorio.png") no-repeat;
}
.botonwacom #icono_localizacion{
 	background: 0px 0px url("../img/icono_localizacion.png") no-repeat;
}
.botonwacom #icono_aplicaciones{
 	background: 0px 0px url("../img/icono_aplicaciones.png") no-repeat;
}
.botonwacom #icono_complementos{
 	background: 0px 0px url("../img/icono_complementos.png") no-repeat;
}

.botonwacom .texto{
	width: 194px;
	font: 1.5em 'Open Sans', sans-serif;
	color: #ececec;
	line-height: 1em;
	display:table-cell;
	vertical-align:middle;
	text-decoration:none;
}

a, a:visited {
	color:#acacac;
	text-decoration:none;
	outline:none;
}

a:hover{
	text-decoration:none;
}


/****Panel Acordeon *******************************************************/

.acordeon{
	display:none; /*por defecto no se muestra*/
	float:left;
	width:207px;
 	height: calc(100%-81px);
	height: -webkit-calc(100%-81px); 
	height: -moz-calc(100%-81px);
    background-color: #4a4a4a;
}

.tituloacordeon{
	text-decoration:none;
	display:block;
	font-family: 'Open Sans', sans-serif;
	font-size:1.3em;
	font-weight: 600;
	line-height: 1em;
	color: #ffffff;
	position:relative;
	width:auto;
	height:32px;
	padding:13px 12px 1px 24px;
	overflow:hidden;
	background:#5f5f5f;
}

ul.menu_acordeon{
	float:left;
	width:207px;
}

li.button{
	cursor: pointer;
	height:40px;
	background:#5f5f5f;
}

li.button a{
	display:block;
	font-family: 'Open Sans', sans-serif;
	font-size:1.3em;
	font-weight: 400;
	height:20px;
	overflow:hidden;
	padding:11px 0px 0px 0px;
	position:relative;
	width:auto;
}

li.button a:hover{
	text-decoration:none;
	background-position:bottom left;
}

li.button .icono_flecha{
	width: 21px;
	height: 21px;
	margin: 10px 11px 9px 18px;
	vertical-align:middle;
	float: left;
 	background: 0px 0px url("../img/icono_flecha.png") no-repeat;
}

.ventanasubseccion {
	display:none;
	background-color: #FFFFFF;
}

.contenedorscroll{
	width:197px;
	height:11px;
	min-height: 100px;
}

.titulosubseccion{
	text-align:center;
	text-decoration:none;
	display:block;
	font-family: 'Open Sans', sans-serif;
	font-size:1.1em;
	font-weight: 400;
	line-height: 1em;
	color: #adadad;
	position:relative;
	width:auto;
	height:18px;
	padding:10px 12px 0px 13px;
	overflow:hidden;
}

.ventanasubseccion a .componenetedoble{
	width: 176px;
	height: 88px;
	margin: 5px 0px 0px 12px;
	float: left;
}
.ventanasubseccion a .componenetesimpleizq{
	width: 85px;
	height: 65px;
	margin: 5px 0px 0px 12px;
	float: left;
}
.ventanasubseccion a .componenetesimpledrc{
	width: 85px;
	height: 65px;
	margin: 5px 0px 0px 6px;
	float: left;
}

.ventanasubseccion a:hover{
    cursor: move;
}

.ventanasubseccion a #componente1{
background: 0px 0px url("../img/componente1.jpg") no-repeat;
}
.ventanasubseccion a #componente2{
background: 0px 0px url("../img/componente2.jpg") no-repeat;
}
.ventanasubseccion a #componente3{
background: 0px 0px url("../img/componente3.jpg") no-repeat;
}
.ventanasubseccion a #componente11{
background: 0px 0px url("../img/componente11.jpg") no-repeat;
}
.ventanasubseccion a #componente21{
background: 0px 0px url("../img/componente21.jpg") no-repeat;
}
.ventanasubseccion a #componente22{
background: 0px 0px url("../img/componente22.jpg") no-repeat;
}
.ventanasubseccion a #componente23{
background: 0px 0px url("../img/componente23.jpg") no-repeat;
}
.ventanasubseccion a #componente24{
background: 0px 0px url("../img/componente24.jpg") no-repeat;
}
.ventanasubseccion a #componente25{
background: 0px 0px url("../img/componente25.jpg") no-repeat;
}
.ventanasubseccion a #componente26{
background: 0px 0px url("../img/componente26.jpg") no-repeat;
}
.ventanasubseccion a #componente27{
background: 0px 0px url("../img/componente27.jpg") no-repeat;
}
.ventanasubseccion a #componente28{
background: 0px 0px url("../img/componente28.jpg") no-repeat;
}
.ventanasubseccion a #componente31{
background: 0px 0px url("../img/componente31.jpg") no-repeat;
}
.ventanasubseccion a #componente32{
background: 0px 0px url("../img/componente32.jpg") no-repeat;
}
.ventanasubseccion a #componente33{
background: 0px 0px url("../img/componente33.jpg") no-repeat;
}
.ventanasubseccion a #componente34{
background: 0px 0px url("../img/componente34.jpg") no-repeat;
}
.ventanasubseccion a #componente35{
background: 0px 0px url("../img/componente35.jpg") no-repeat;
}
.ventanasubseccion a #componente36{
background: 0px 0px url("../img/componente36.jpg") no-repeat;
}
.ventanasubseccion a #componente37{
background: 0px 0px url("../img/componente37.jpg") no-repeat;
}
.ventanasubseccion a #componente38{
background: 0px 0px url("../img/componente38.jpg") no-repeat;
}
.ventanasubseccion a #componente39{
background: 0px 0px url("../img/componente39.jpg") no-repeat;
}
.ventanasubseccion a #componente41{
background: 0px 0px url("../img/componente41.jpg") no-repeat;
}
.ventanasubseccion a #componente42{
background: 0px 0px url("../img/componente42.jpg") no-repeat;
}
.ventanasubseccion a #componente43{
background: 0px 0px url("../img/componente43.jpg") no-repeat;
}
.ventanasubseccion a #componente44{
background: 0px 0px url("../img/componente44.jpg") no-repeat;
}
.ventanasubseccion a #componente45{
background: 0px 0px url("../img/componente45.jpg") no-repeat;
}

/****opcion del panel sin acordeon *******************************************************/
.ventanasubseccion2 {
	display:block;
	background-color: #FFFFFF;
}
.ventanasubseccion2 a .componenetedoble{
	width: 176px;
	height: 88px;
	margin: 5px 0px 0px 12px;
	float: left;
}
.ventanasubseccion2 a .componenetesimpleizq{
	width: 85px;
	height: 65px;
	margin: 5px 0px 0px 12px;
	float: left;
}
.ventanasubseccion2 a .componenetesimpledrc{
	width: 85px;
	height: 65px;
	margin: 5px 0px 0px 6px;
	float: left;
}

.ventanasubseccion2 a:hover{
    cursor: move;
}

.ventanasubseccion2 a #componente51{
background: 0px 0px url("../img/componente51.jpg") no-repeat;
}
.ventanasubseccion2 a #componente52{
background: 0px 0px url("../img/componente52.jpg") no-repeat;
}
.ventanasubseccion2 a #componente53{
background: 0px 0px url("../img/componente53.jpg") no-repeat;
}


/********************************************
* 	Estilos Barra Menu
********************************************/

#barra_menu {
	position:fixed;
	width: 100%;
	height: 40px;
    background-color: #4a4a4a;
	z-index:20;
}

#boton_panel {
	margin: 6px 0px 0px 6px;
	width: 27px;
	height: 27px;
	background: 0px 0px url("../img/boton_panel.png") no-repeat;
	float: left;
}

#boton_panel:hover{
    background: #5f5f5f 0px 0px url("../img/boton_panel.png") no-repeat;
    cursor: pointer;
}

#boton_ayuda {
	margin: 6px 0px 0px 6px;
	width: 27px;
	height: 27px;
	background: 0px 0px url("../img/boton_ayuda.png") no-repeat;
	float: left;
}

#boton_ayuda:hover{
    background: #5f5f5f 0px 0px url("../img/boton_ayuda.png") no-repeat;
    cursor: pointer;
}

#boton_usuario{
	position:fixed;
/* 	position:absolute; */
	right: 6px;
	top: 6px;	
	width:25px;
    height:25px;
    border: 1px solid #5f5f5f;
	opacity: 0.8;
    background: #ececec url("../img/boton_usuario.png") no-repeat;
}

#boton_usuario:hover{
	opacity: 1;
    cursor: pointer;
}

#logojuntapequeño{
	margin: 6px 6px 0px 6px;
	padding-right: 12px;
	width: 27px;
	height: 27px;
	background: 0px 0px url("../img/logojunta2.png") no-repeat;
	border-right: 1px solid #acacac;
	float: left;
}

#dropborrar{

/* 	background-size:100% 100%; */

	margin-top: 6px;
/* 	margin-left:auto;
	margin-right:auto; */
	padding-right: 12px;
	width: 184px;
	height: 25px;
	background: 50% 50% url("../img/dropborrado.png") no-repeat;
	/* float: left; */
}
/* #dropborrar:hover{ 
	background-color: #ffffff;
} */
/*     -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -o-transform: scale(1.5);
    -ms-transform: scale(1.5);
    transform: scale(1.5)
} */

/********************************************
* 	Estilos Gridster
********************************************/

#contenedorgridster{
	position:absolute;
	top:46px;
	left:6px;
}

/****Gridster *******************************************************/

.gridster {
	float:left;
	height: calc(100%-122px);
	height: -webkit-calc(100%-122px); 
	height: -moz-calc(100%-122px);
	/* width: 960px; */
/* 	margin:0px 0px 0px 6px; */
	opacity: .8;
    -webkit-transition: opacity .6s;
    -moz-transition: opacity .6s;
    -o-transition: opacity .6s;
    -ms-transition: opacity .6s;
    transition: opacity .6s;
	background: #dde6e5;
}

/****Widgets *******************************************************/

.gridster .gs-w {
    background: #ffffff;
    cursor: pointer;
	border: 1px solid #C4D5D4;
}

.gridster .player {
    -webkit-box-shadow: 3px 3px 5px rgba(0,0,0,0.3);
    box-shadow: 3px 3px 5px rgba(0,0,0,0.3);
}

.gridster .preview-holder {
    border: none!important;
    border-radius: 0!important;
    background: rgba(196,213,212,.8)!important;
}

iframe{
	width:100%;
	height:100%;
	border:none;
	overflow:hidden;
/* 	position: absolute; */
}
.capaiframe{
	position:absolute;
	width:100%;
	height:100%;
	background-color:#dde6e5;
	opacity:0.7;
	display: none;
}

/****Barra Widgets ************************************************/
.barra_widget {
	position: absolute;
	width: 5px;
	height: 30px;
	opacity: 0.5;
    background-color: #000000;
    color: #666666;
	margin-left: -5px;
}
.boton_agrupado {
	margin: 6px 6px 0px 0px;
	width: 7px;
	height: 7px;
	position: absolute;
	left: 6px;
	
	background-color: #42ff4c;
	opacity: 1;
	display: none;
	z-index: 22;
	border:1px solid #9d9d9e;
}

.boton_agrupado :hover{
/*     opacity: 0.6; */
    cursor: pointer;
}

.boton_borrar {
	margin: 6px 0px 0px 6px;
	width: 11px;
	height: 11px;
	background: 0px 0px url("../img/borrar.png") no-repeat;
	position: absolute;
	right:6px;
	opacity: 1;
	display: none;
	z-index: 22;
}

.boton_borrar:hover{
    opacity: 0.6;
    cursor: pointer;

}
.boton_maximizar {
	margin: 6px 0px 0px 6px;
	width: 11px;
	height: 11px;
	background: 0px 0px url("../img/maximizar.png") no-repeat;
	position: absolute;
	right:22px;
	opacity: 1;
	display: none;
	z-index: 22;
}
#boton_minimizar:hover{
    opacity: 0.6;
    cursor: pointer;

}
#boton_minimizar {
	margin: 6px 0px 0px 6px;
	width: 11px;
	height: 11px;
	background: 0px 0px url("../img/minimizar.png") no-repeat;
/* 	position: absolute; */
	top: 2px;
	right:10px;
	border: 10px solid;
/* 	opacity: 1; */
	display: block;
	z-index: 2000;
	position: fixed;
}
.boton_maximizar:hover{
    opacity: 0.6;
    cursor: pointer;

}
#paneltips{
	position: absolute;
	background-color: #4a4a4a;
	width: 100px;
	height: 200px;
	z-index:2001;
}
.textotips{
	font-size: 11px;
	color: white;
}
.dropagrupar{
	display: none;
	margin-left:auto;
	margin-right:auto;
/* 	padding-top: 6px; */
	width: 100%;
	height: 30px;
	background: 50% 50% url("../img/dropagrupar.png") no-repeat;
	background-color: #000000;
	opacity: 0.7;
	position: absolute;
}

/****Resize Widgets *******************************************/

.gridster .dragging,
.gridster .resizing {
    z-index: 10!important;
    -webkit-transition: all 0s !important;
    -moz-transition: all 0s !important;
    -o-transition: all 0s !important;
    transition: all 0s !important;
}

.gs-resize-handle {
    position: absolute;
    z-index: 1;
}

.gs-resize-handle-both {
    width: 20px;
    height: 20px;
    bottom: -8px;
    right: -8px;
    background-image: url("../img/resize.png");
    background-position: top left;
    background-repeat: no-repeat;
    cursor: se-resize;
    z-index: 20;
}

.gs-resize-handle-x {
    top: 0;
    bottom: 13px;
    right: -5px;
    width: 10px;
    cursor: e-resize;
}

.gs-resize-handle-y {
    left: 0;
    right: 13px;
    bottom: -5px;
    height: 10px;
    cursor: s-resize;
}

.gs-w:hover .gs-resize-handle,
.resizing .gs-resize-handle {
    opacity: 1;
}

.gs-resize-handle,
.gs-w.dragging .gs-resize-handle {
    opacity: 0;
}

.gs-resize-disabled .gs-resize-handle {
    display: none!important;
}

[data-max-sizex="1"] .gs-resize-handle-x,
[data-max-sizey="1"] .gs-resize-handle-y,
[data-max-sizey="1"][data-max-sizex="1"] .gs-resize-handle {
    display: none !important;
}

/***********************************************/
/************* Formulario **********************/
/***********************************************/
#vertice{
	width: 25px;
	height: 10px;
	background: 0px 0px url("../img/vertice.png") no-repeat;
	position: fixed;
	right: 7px;
	top: 35px
}
#panelusuario{
	position: fixed;
	right: 4px;
	top: 43px;
	height: 119px;
	width: 327px;
	background-color: #4a4a4a;
	border: 1px solid #dde6e5;
}
#panelcerrarsesion{
	position: fixed;
  right: 4px;
  top: 43px;
  height: 77px;
  width: 152px;
  background-color: #4a4a4a;
  border: 1px solid #dde6e5;
}
#panelregistro{
	position: fixed;
	right: 4px;
	top: 168px;
	height: 406px;
	width: 327px;
	background-color: #4a4a4a;
	border: 1px solid #dde6e5;
}
#titulopanelregistro{
  border-bottom: 1px solid #CEE1E8;
  padding: 13px 0px 13px 20px;
}
#panelrecuperar{
	position: fixed;
	right: 4px;
	top: 43px;
	height: 119px;
	width: 327px;
	background-color: #4a4a4a;
	border: 1px solid #dde6e5;
}
label{
  font-size: 15px;
  color: #CEE1E8;
}	
input{
  font-size: 15px;
  width: 275px;
  height: 19px;
  border: 1px solid #CEE1E8;
  margin: 10px 20px 0px 20px;
  padding: 5px;
}
select {
  font-size: 15px;
  width: 287px;
  height: 30px;
  border: 1px solid #CEE1E8;
  margin: 10px 20px 0px 20px;
  padding: 5px
} 
input:focus, 
select:focus{
    border: 1px solid #AFCDD8;
    background-color: #EBF2F4;
}
#usuario{
  margin-top: 20px;
}
#pass{
  margin-right: 10px;
  margin-bottom: 5px;
  width: 168px;
}
#botonsesion, #botonnuevopassword{
  height: 32px;
  background-color: #333;
  color: #FFF;
  border: none;
  display: block;
  float: right;
  background-color: #4f7fd7;
  border: 1px solid #3d67c0;
  font-size: 13px;
  padding: 5px 0px 5px 0px;
  margin: 10px 20px 10px 0px;
}
#botoncerrarsesion{
  width: 100px;
  height: 32px;
  background-color: #333;
  color: #FFF;
  border: none;
  display: block;
  float: right;
  background-color: #4f7fd7;
  border: 1px solid #3d67c0;
  font-size: 13px;
  padding: 5px 0px 5px 0px;
  margin: 23px 25px 10px 0px;
}
#botonsesion{
  width: 97px;
}
#botonnuevopassword{
  width: 130px;
}
#botonsesion:focus :hover, #botonnuevopassword:focus :hover, #botoncerrarsesion:focus :hover{
  border: 1px solid #AFCDD8;
    background-color: #6ea3fe;
}

#usuarionombre,#usuariorecuperar{
  margin-top: 20px;
}
#passreg, #usuariociudad{
  width: 126px;
  margin-right: 0px;
}
#usuarionombre{
  width: 178px;
  margin-right: 0px;
}
#passregrep{
  width: 126px;
  margin-left: 10px;
}
#usuarionacimiento{
  width: 75px;
  margin-left: 10px;
}
#usuariopais{
  width: 138px;
  margin-left: 10px;
}
#botonsesionreg{
  width: 97px;
  height: 32px;
  background-color: #333;
  color: #FFF;
  border: none;
  display: block;
  float: right;
  background-color: #ffac33;
  border: 1px solid #f1a02a;
  font-size: 13px;
  padding: 5px 0px 5px 0px;
  margin: 10px 20px 10px 0px;
}
#botonsesionreg:focus :hover{
  border: 1px solid #e99110;
  background-color: #e99110;
}
#recordar{
	color: #BBBBBB;
	cursor: pointer;
	margin: 0px 0px 0px 20px;
}
#volver{
	color: #BBBBBB;
cursor: pointer;
  margin: 40px 0px 0px 20px;
}
#textousuario{
  position: fixed;
  right: 43px;
  top: 14px;
  color: white;
}
#formulariorecupear{
  position: relative;
  top: 50px;
  float: center;
  margin: auto;
  height: 205px;
  width: 327px;
  background-color: #4a4a4a;
  border: 1px solid #dde6e5local
}
#botonrec{
  float: right;
  height: 32px;
  width: 95px;
}
label.recuperar{
  float: left;
  margin: 10px 0px 0px 19px;
  font-size: 15px;
  color: #CEE1E8;
}