/**************** CSS QUE APLICAN UNA PROPIEDAD CONCRETA ************************/

.float-left {
  float: left !important;
}
.sin-fondo {
  background-color: transparent;
}

.fuente-18px {
	font-size: 18px;
}

.fuente-15px {
	font-size: 15px;
}

.fuente-12px {
	font-size: 12px;
}

.pantalla-completa {
  height: 88vh; /*vh significa viewport height, que se adapta al tamaño de la pantalla, no del div que lo contiene */
}

.height-auto {
  height: initial;
}

.sin-color-borde {
  border-color: transparent;
}

.centrar-texto {
  text-align: center;
}

.alinear-texto-izq {
  text-align: left;
}

.alinear-texto-der {
  text-align: right;
}

.separar-5px {
  margin-left: 5px;
}

.separar-25px {
  margin-left: 25px;
}

.separar-top-75px {
  margin-top: 75px;
}
.separar-top-15px {
  margin-top: 15px;
}
.separar-top-10px {
  margin-top: 10px;
}

.separar-top-2px {
  margin-top: 2px;
}

.sin-margen {
  margin: 0px;
}

.padding-top-15prct {
  padding-top: 15%;
}

.padding-top-5prct {
  padding-top: 5%;
}

.padding-right-5prct {
  padding-right: 5%;
}

.padding-left-10px {
  padding-left: 10px;
}

.padding-left-20px {
  padding-left: 20px;
}

.padding-10px{
  padding: 10px;
}

.centrado {
  margin-right: 0;
  margin-left: 0;
}

.sin_padding_arriba_abajo {
	padding-top: 0px;
	padding-bottom: 0px;
}

.sin_padding_izq {
	padding-left: 0px;
}

.sin_padding_der {
	padding-right: 0px;
}

.sin_padding_der-izq {
	padding-right: 0px;
	padding-left: 0px;
}

.padding_der-5px {
	padding-right: 5px;
}

.sin_min_width {
  min-width: 0px;
}

.rotar-180grad {
	-webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.color_rojo {
  color: red;
}

.color_verde {
  color: green;
}

.bg-strong-yellow {
    background-color: #d0850d !important;
	color: #fff !important;
}

.bg-light-yellow {
    background-color: #EDC124 !important;
	color: #fff !important;
}

.bg-light-gray {
    background-color: #f5f5f5 !important;
	/* color: #fff !important; */
}

.sin-border-top {
	border-top: 0px;
}

.width-100px {
	width:100px;
}

.width-100prct {
	width: 100%;
}

.desactivado {
	cursor: not-allowed;
}

.clickable {
	cursor: pointer;
	color:#3c8dbc;
}

.max-width-400px {
	max-width: 400px;
}

.max-width-600px {
	max-width: 600px;
}
.min-width-300px {
	min-width: 300px;
}

.position-absolute {
	position: absolute !important;
}


/**************** CSS PARTICUALRES PARA UN ELEMENTO CONCRETO ************************/

.pagina-login {
	background-image: url('../../images/grey-gradient-background.jpg');
}

.cargando {
    font-size: 60px;
    position: relative;
    top: 40%;
    left: 50%;
    margin-left: -15px;
    margin-top: -15px;
    color: #000;
}

.imglogo{
	margin:0px;
	margin-top:-3px;
	width:65%;
	height:auto;
	max-width: 160px;
}

.logo_empresa img{
	width: 100%;
	max-height: 102px;
    display: block;
    margin: auto;
	max-width: 280px;
}

.icono{
	width:40px;
	height:30px;
}

.icono-informes{
	width:30px;
	height:22px;
}

.flechas-izq-der {
	height: 120px;
    padding-top: 40px;
}

.input-number {
	width: 40px; 
	text-align: right;
}

.pie-pagina{
	margin-left: 0px !important;
    z-index: 900;
	background: #fff;
    color: #444;
    border-top: 1px solid #d2d6de;
}

@media (min-width: 768px){
	.pie-pagina{
		margin-left: 0px !important;
		z-index: 900;
	}
}

/****************OVERLOAD DE METODOS YA DEFINIDOS POR LA PLANTILLA****************/

.dropdown-menu > li > a {
    padding: 3px 5px !important;
}

.small-box .icon{
	top: 5px !important;
}

.sidebar-menu li > a > .pull-right-container{
	    margin-top: -4px !important;
}

.breadcrumb{
	padding: 0px 0px;
    list-style: none;
    background-color: transparent;
    border-radius: 0px;
	float: left;
}

.breadcrumb > li + li:before{
	content: '>\00a0';
}

/*Esto son modificaciones extra que hacemos cuando la pantalla es xs*/
@media (max-width: 767px) {
  body {
    font-size: 12px !important;
  }
  .h1, h1 {
    font-size: 30px !important;
  }
  .h2, h2 {
    font-size: 24px !important;
  }
  .h3, h3 {
    font-size: 18px !important;
  }
  .h4, h4 {
    font-size: 14px !important;
  }
  .h5, h5 {
    font-size: 12px !important;
  }
  .h6, h6 {
    font-size: 10px !important;
  }
  
}

/****************** LISTA DE PLANTAS *******************************************/
.listaPlantas{
	padding:0px;
	padding-top: 15px;
	background-color: #666f76;
	height: 100%;
	color: #ccc; 
	overflow: auto; 
}

ul.listaPlantas{
	padding:0px;
	overflow: hidden;
	max-height:none !important;
}

.listaPlantas a{
	color: white;
	cursor: auto;
}
.listaPlantas ul li{
	list-style:none;
	 padding: 6px 15px 6px 15px; 
	/* padding: 4px 5px 4px 5px; */
	cursor: auto;
}

.treeview-menu{
	margin-left:0px;
	padding-left: 0px !important;
}

.listaPlantas li.active > a > .fa-angle-left,
.listaPlantas li.active > a > .pull-right-container > .fa-angle-left {
  -webkit-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

/*Esto son modificaciones extra que hacemos cuando la pantalla es sm*/
@media (min-width: 992px) {
	.leyenda {
		right: -366px !important;
		height: 207px !important;
	}
	
	.width-400px {
	  width: 400px !important;
	}
}

/*************************PANTALLA PLANTAS / GRAFICAS*********************/

.menu_graf{
	padding:5px 15px 10px 15px;
	margin:0px;
	margin-top:8px;
	margin-bottom:10px;
	clear:both;
}

.menu_graf span{
	font-size: 18px;
}

.lista-botones{
	float: right;
	height: auto;
	width: auto;
}

.botones_graf{
	padding-top: 10px;
}

.bar_chart_tooltips_css_propio {
	background-color: white ! important;
	border: 2px solid black ! important;
	opacity: 0.9 ! important;
	padding: 3px;
}

.recorta_texto {
    overflow: hidden !important;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/*************************PANTALLA DE CARGA*********************/

.cargando_pagina{
    position:absolute;
	top: 0px;
	left:0px;
    width:100%;
    height:100%;
    background-color:#d2d6de ;
	opacity: 0.9;
	z-index:1031;
}


/*************************Parte que hizo Jonatan (sin modificar, no significa que esté mal, solo que se ha dejado tal cual o comentado si no hace falta)*********************/

.wrapper{
	background-color: #ecf0f5 !important;
}

.main-header .logo{
	padding: 0px;
	background-color:white;
}

#ocultarLista, #salir{
	margin-top:6px;
	margin-right: 6px;
	padding: 7px;
}
/*
#ocultarLista, #salir, #imagen_usuario{
	margin-top:6px;
	margin-right: 6px;
	padding: 7px;
}

#imagen_usuario{
	color: white;
}

#imagen_usuario img{
	width:100px;
	height: auto;
	border-radius:0;
}
*/
.energ-pot{
	font-size:10px;
	color: #333333;
}

#ventanaFlotante{
	position:absolute;
	width: auto;
	height: auto;
	border: 1px solid #000000;
	background-color: red;
	text-align:center;
}

.text-white{
  color: #FFFFFF !important;
}

.text-blueR{
  color: #80bfff !important;
}

.text-grey{
  color: #d2d6de !important;
}

.color-texto-red{
	color: #ff4d4d !important;
}

.color-texto-grey{
	color: #d2d6de !important;
}

.color-texto-green{
	color: #00a65a !important;
}

.color-texto-blue{
	color: #80bfff !important;
}

.color-texto-orange{
	color: orange !important;
}

/*.boton1{
	padding: 6px;
	font-size: 10px;
	background-color: #fff;
	color: grey;
	border:solid 1px #d2d6de;
}

.boton1:first-child{
	border-top-left-radius: 4px;
	border-bottom-left-radius: 4px;
}

.boton1:last-child{
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
}
*/
.container{
	margin:auto;
}

.checked{
	background-color: #bbb;
}
/*
.graf_comb{
	background-color: white;
	margin-top: 30px;
	padding:8px;
}
*/

.selector_fecha{
	width: 80% !important;
	margin-right: 10px;
}

.canvas_graf{
	background-color: #777;
	width: 100%;
	height: 100%;
}

.container_graf{
	position:relative;
	width: 100%;
	height: 100%;
}

.cabecera_inicio{
	background-color: white;
	margin-bottom:10px;
}

.cabecera_inicio div{
	font-size:18px;
	padding-top: 1%;
}

.actualizar{
	height:34px;
}

#resen_cargando{
	width: 40%;
	margin:auto;
	margin-top:5%;	
}

#resen_cargando img{
	width:100%;
	height:auto;
	opacity: 0.5;
}

#gifCargando{
	width: 20%;
	min-width:120px;
	height: auto;
	padding:15px;
	background-color: white;
	margin:auto;
	margin-top:1%;
	border:1px solid #333333;
	border-radius: 5px;
	text-align:center;
}

#gifLoad{
	width: 15%;
	height: auto;
	margin: auto;
	margin-top: 5%;
}

.info-box{
	min-height: 65px;
	font-size: 14px;
	margin-bottom:7px;
}

.info-box-icon{
	height:65px;
	width:65px;
}

.info-box-content{
	margin-left: 65px;
}

#salir img{
	width: 20px;
	height: 20px;
}

.logo-mini{
	height: 50px;
	background-color:black;
}

/*
.resumen_planta{
	margin-top: 30px;
	padding: 8px 0px 8px 0px;
}

.datos1{
	background-color: white;
	border: 1px solid #ddd;
	padding: 15px;
	font-size: 14px;
	height: 120px;
}
*/
.form-control-box{
	width: 24%;
	float: left;
}

.input-group{
	margin-bottom:5px;
}

/*Fin de la parte que hizo Jonatan*/

