@import url('../vendor/bootstrap-helpers/css/bs3h.default.min.css');

.nav-pills{margin-top:12px}

/* ****************************************************************************
 *  Integración de estilos de web2py y Bootstrap 3 
 * ****************************************************************************/

.nav-pills{margin-top:12px}

.w2p_fw > input[type="text"],.w2p_fw > input[type="password"] {
	/* Propiedades de Bootstrap 3 .form-control */
	display: block;
	width: 160%;
	height: 34px;
	padding: 6px 12px;
	font-size: 14px;
	line-height: 1.428571429;
	color: #555;
	vertical-align: middle;
	background-color: #fff;
	background-image: none;
	border: 1px solid #ccc;
	border-radius: 4px;
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
	box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
	-webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
	transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
	/* Propiedades de Bootstrap 2 */
	margin: 0 5px 10px 0;
}

.w2p_fl label, .w2p_fw label {
	font-weight: inherit;
}

.w2p_fw .checkbox {
	display: inline;
}

#web2py_user_form{
	width:45%;
	float:left;
}

/* ****************************************************************************
 *  Integración de estilos de web2py y Kendo 
 * ****************************************************************************/
.k-grid table {
	margin: inherit;
}

.toStatus{
    position:absolute;
    right:0px;
    top:0px;
    border:1px solid black;
    font-size:10px;
    margin: 5px 0px;
    background: #1C4E93;
    color:white;
    padding: 2.5px 5px;
    border-radius:5px;
    -webkit-box-shadow: 0px 2.5px 10px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 2.5px 10px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 2.5px 10px 0px rgba(0,0,0,0.75);
}

#tblCarephoneConfig a.k-grid-Cancelar:hover {color: #515967}
#tblCarephoneConfig a.k-grid-Cancelar {color: #FFFFFF; background-color: #D9534F}
.k-grid.withOutChildren tr.k-master-row > td > a.k-icon { opacity: 0;cursor: default;}
.k-grid tr.k-master-row > td > a.k-icon { opacity: 1;}
.k-grid tr.k-master-row.k-state-selected a, .k-grid tr.k-master-row:hover a, .k-grid tr.k-master-row > td > a:hover {color: #FFFF00 !important;}
.k-grid > table tr.k-detail-row:hover {background-color: transparent !important;}
.k-grid > table tr.k-detail-row.k-alt:hover {background-color: #F6F7F7 !important;}
.k-grid > table thead.k-grid-header > tr:hover a{color: #515967 !important;}
.k-grid-header-wrap > table > thead > tr:hover a.k-link,
.k-grid-header-wrap > table > thead > tr a.k-link {color: #515967 !important;}
/*.k-grid-content > table tr:hover a { color: #FFFF00; }*/
.k-grid > table tr:hover, 
.k-grid-content > table tr:hover { color: #fff; background: #3f78a5 !important}

/*.k-grid > table tr:hover a,.k-grid-content > table tr:hover a{ color: #fff !important}*/

.k-grid > table tr.k-state-selected a.rlink,
.k-grid > table tr:hover a.rlink { color: #FFFF00 }
.k-grid > table tr.k-state-selected a { outline: none; }
.k-grid > table.filter tr:hover { color: inherit; background: inherit !important }
.k-grid-filter.k-state-active,
.k-pager-refresh {
    -ms-transition: -ms-transform 1s;
    -webkit-transition: -webkit-transform 1s;
    transition: transform 1s;
}
.k-pager-refresh.k-state-selected {
	background-color: rgb(192, 192, 192);
	border-radius: 3px;
	-ms-transform: rotate(360deg);
	-webkit-transform: rotate(360deg);
	transform: rotate(360deg);
}

.panel-heading .k-pager-refresh {
    border-radius: 3px;
    width: 22px;
    height: 22px;
    margin-top: -4px;
    padding: 3px;
}
.panel-heading .k-pager-refresh:hover {
    color: #263248;
    background-color: #b6bdca;
}

.k-grid-toolbar .k-pager-refresh {
    border-radius: 3px;
    margin-top: -4px;
    padding: 3px;
}

.k-grid-toolbar .k-pager-refresh:hover {
    color: #263248;
    background-color: #b6bdca;
}

#tblConfigCarephone .k-pager-refresh {
    border-radius: 3px;
   /**width: 22px;**/
   /**height: 22px;**/
    margin-top: 2px;
    margin-right: 7px;
    padding: 3px;
}
#tblConfigCarephone .k-pager-refresh:hover {
    color: #263248;
    background-color: #b6bdca;
}

.refresh{
	vertical-align: middle;
	background-image: url('../vendor/kendoui/styles/Silver/sprite.png');
	border-color: transparent;
	background-position: -32px -112px;
	background-color: transparent;
	display: inline-block;
	width: 16px;
	height: 16px;
	overflow: hidden;
	background-repeat: no-repeat;
	font-size: 0;
	line-height: 0;
	text-align: center;
	box-sizing: border-box;		
}



.k-grid-filter.k-state-active {
    background-color: #C6CCD6;
}

.k-grid > table tr a.clink { color: #515967; width: 100%;}
.k-grid > table tr:hover a.clink { color: #FFFFFF }

#alarmValue{overflow: hidden;text-overflow: ellipsis; white-space: nowrap;max-width:140px;}

.rEvent{/*max-width: 60px;word-wrap: break-word;*/}
.custom {width: 81%;}

p label span{margin-left: 3px;}
input.k-check-all span{margin-left: 3px;}
/* ****************************************************************************
 * Tweeks de Bootstrap 
 * ****************************************************************************/
.input-xs { height: 22px; padding: 1px 5px; font-size: 12px; line-height: 1.5; border-radius: 3px; }
/*label { font-weight: inherit; }*/
select.input-xs { height: 22px; line-height: 22px; }
.input-group .form-control.col-md-6 { width: 50% }
.glyphicon { line-height: 0; }
input[type="radio"],
input[type="checkbox"] { margin-top: 0; outline: none!important;	/* Para font-size: 12px; */ }
.primary { color: #357ebd }
.success { color: #4cae4c }
.danger { color: #d43f3a }
.dropdownTree > .form-control.btn {
	text-align: left;
}
.dropdownTree >	 .form-control > span.caret {
	float: right;
	margin-top: 5px;
}

.mylabel{/*float:left*/; margin-right: 0px; margin-top: 7px; /*nuevo*/;}
.mylabel_group{/*float:left*/; margin-right: 10px; margin-top: 7px;/*nuevo*/;}
#viewLog { visibility: visible;width: 58%/*46%*/; padding: 4px 6px; background-color: #ffffff; background-image: none;border: 1px solid #cccccc; border-radius: 4px; font-size: 12px;/*nuevos*/}
#view { visibility: visible;width: 8%/*46%*/; padding: 4px 6px; background-color: #ffffff; background-image: none;border: 1px solid #cccccc; border-radius: 4px; font-size: 12px;/*nuevos*/}
#view option {padding-left:6px}
#view_group { visibility: visible;width: 6%/*46%*/; padding: 4px 6px; background-color: #ffffff; background-image: none;border: 1px solid #cccccc; border-radius: 4px; font-size: 12px;/*nuevos*/}
#view_group option {padding-left:6px}


/* ****************************************************************************
 *  Estilos de la aplicación 
 * ****************************************************************************/
.main {
  padding: 20px 0;
}
.dataFormDetails { padding-right: 0 }
.dataFormDetails .panel-body .row, .modal-body form .row { margin-top: 10px; }
.dataFormDetails .panel-body .row:first-child, .modal-body form .row:first-child { margin-top: 0px; }
.dataFormFilter img:first-child { position: absolute; top: -25px; }
.dataFormFilter button:nth-child(2) { margin-top: 15px }
.dataFormFilter .input-group { margin-bottom: 8px; }
.groupStart { margin-top: 28px; }
.dataFormDetails div.group { border-bottom: 1px dashed #ddd; margin-bottom: 15px; padding-bottom: 15px; }
.dataFormDetails div.lineDiscont { border-top: 1px dashed #ddd; margin-top: 15px!important; padding-top: 15px; }
.dataFormDetails div.group:last-child { border-bottom: none; }
.dataFormDetails .tab-content { padding-top: 15px; }

.groupHeader + * { margin-top: 0 !important; }
.groupHeader.multicol { background-color: #f5f5f5; width: 100%; }
.panel-heading .pagination { margin: 0; }
.invalid { border-color: red !important; }
#navbarCollapse { padding-top: 15px; }

.dynHide { display: none; }
.dynVis { visibility: hidden; }

/* ****************************************************************************
 *  Estilos del nuevo menu de Bienvenido System cuanddo el usuario está logado
 * Las banderas se obtienen de la imagen flags.png. Para averiguar los pixels
 * de una bandera seguir la siguiente formula:
 * Horizontal: 4 + 28*(columna - 1)
 * Vertical: 5 + 28*(fila -1)
 * ****************************************************************************/

.flags{
	width: 16px;
	height: 11px;
	background: transparent url('../images/flags.png') no-repeat;
	float: left;
	margin: 1px 4px 4px 0;
}

.cs {
    background-position: -256px -117px;
}

.es{
	background-position: -4px -173px;
}

.en {
	background-position: -284px -173px ;
}

.sv {
	background-position: -32px -481px ;
}

.de {
	background-position: -284px -118px ;
}

.no {
	background-position: -144px -397px ;
}

.zh {
	background-position: -32px -118px ;
}

.fi {
	background-position: -88px -173px ;
}

.dk {
	background-position: -32px -145px ;
}

.fr {
	background-position: -228px -173px ;
}

.it {
	background-position: -172px -257px ;
}

.be {
	background-position: -228px -33px ;
}

.dropdown-submenu{
	position:relative;
}

.dropdown-submenu > .dropdown-menu{
	top:0;
	left:100%;
	margin-top:-6px;
	margin-left:-1px;
	-webkit-border-radius:0 6px 6px 6px;
	-moz-border-radius:0 6px 6px 6px;
	border-radius:0 6px 6px 6px;
}

.dropdown-submenu:hover > .dropdown-menu{
	display:block;
}

.dropdown-submenu > a:after{
	display:block;
	content:" ";
	float:right;
	width:0;
	height:0;
	border-color:transparent;
	border-style:solid;
	border-width:5px 0 5px 5px;
	border-left-color:#cccccc;
	margin-top:5px;
	margin-right:-10px;
}

.dropdown-submenu:hover > a:after{
	border-left-color:#ffffff;
}

li.menu-item.dropdown.dropdown-submenu > ul {
    left: -160px;
}

/* ****************************************************************************
 *  Estilos del footer (idiomas) cuando usuario no está logado
 * ****************************************************************************/

.footer {
 	text-align: left;
}


.footer-links {
    margin: 10px 0;
}

.footer-links li {
    display: inline;
    padding: 0 2px;
}
.muted {
    color: #999999;
}	

/* ****************************************************************************
 *  Estilos para los combos que contienen la estructura de arbol
 * ****************************************************************************/
			
.arbol{
white-space: normal;	
}

/* ****************************************************************************
 *  Estilo para resaltar la fila de un grid
 * ****************************************************************************/
			
.hightlightRow{
background-color: #E1E5E8;;	
}

/* ****************************************************************************
 *  Estilo para la versión móvil
 * ****************************************************************************/
	
@media screen (max-width: 520px) {
	[class^="icon-"] {
	  background-size: cover;
	}

	.navbar-header {
	  position: relative;
	  height: 48px;
	  box-shadow: 1px 1px 5px #222;
	  z-index: 10;
	}

	.navbar-brand{
	  display: none;
	}

	#navbarCollapse {
	  border-left: solid 1px #ccc;
	  box-shadow: -3px 5px 5px #555;
	  position: absolute;
	  top: 48px;
	  right: -15px;
	  width: 200px;
	  height: 100vh !important;;
	  max-height: none;
	  z-index: 9;
	  background: #FFF;
	  animation: menu 1s;
	}

	.dropdown-toggle {
	  display: none !important;;
	}

	.nav.nav-pills.pull-right > .dropdown-toggle {
	  background-color: red
	}

	#navbarCollapse li > a {
	  float: none; 
	  width: 165px; 
	  border-bottom: solid 1px #DDD;
	}

	.dropdown-menu .divider {
	  display: none
	}

	#navbarCollapse ul {float: none !important; 
	  position: relative;
	  left: -30px
	} 

	#navbarCollapse .dropdown-menu {
	  display: block !important;
	  background-color: transparent;
	  border: none;
	  box-shadow: none;
	  color: #628BD5;
	  margin: 0;
	  position: relative;
	  left: 0px;
	}

	.dropdown-menu > li > a {
	  color: #628BD5 !important;;
	  padding: 8px 15px;
	}

	@keyframes menu {
	  from {right: -200px}
	  to {right: -15px}
	}

	.k-grid {
	  overflow: auto;
	}
}

/* ******************************************************************************************
 * Estilo para cuando la imagen de loading está a nivel de página y no de un específico panel
 * ******************************************************************************************/

#divLoading
{
    display : none;
}
#divLoading.show
{
    display : block;
    position : fixed;
    z-index: 100;
    background-image: url("../vendor/kendoui/styles/Silver/loading-image.gif"); 
    background-color: transparent;	    
    opacity : 0.9;
    background-repeat : no-repeat;
    background-position : center;
    left : 0;
    bottom : 0;
    right : 0;
    top : 0;
    width: 100%%;
    height:100%;
}	

body.opacityBody{
	background-color: #FFF;	    
    opacity : 0.7;
}
body {
    padding: 10px 30px;
    max-width: 1800px;
    margin: auto;
}
/* make sidebar nav vertical */ 
@media only screen and (max-width : 767px) {
  .sidebar-nav .navbar .navbar-collapse {
    padding: 0;
    max-height: none;
  }
  .sidebar-nav .navbar ul {
    float: none;
  }
  .sidebar-nav .navbar ul:not {
    display: block;
  }
  .sidebar-nav .navbar li {
    float: none;
    display: block;
  }
  .sidebar-nav .navbar li a {
    padding-top: 12px;
    padding-bottom: 12px;
  }
}
/* Override class of bootstrap.min.css */
@media screen and (min-width: 600px) and (max-width: 800px) {
	.container {
	    width: 768px;
	}
}

/* ******************************************************************************************
 * Estilos página Access rights
 * ******************************************************************************************/

.bigSize{
	width: 700px!important;
}

.backgroundTd{
	background-color: rgb(240, 173, 78);    	
}

.backgroundTdOperator{
	background-color: rgb(240, 173, 78);    	
}

/* ******************************************************************************************
 * Estilo nuevos menus en columnas de los grid
 * ******************************************************************************************/

.k-state-active, .k-state-active:hover, .k-active-filter, .k-tabstrip .k-state-active, .k-header-column-menu .k-state-active{
	    background-color: #C6CCD6!important;
	    border-color: #a6afbe!important;
	    color: #515967!important;
	} 

/* ******************************************************************************************
 * Parpadeo
 * ******************************************************************************************/

/* Firefox old*/
@-moz-keyframes blink {
    0% {
        opacity:1;
    }
    50% {
        opacity:0;
    }
    100% {
        opacity:1;
    }
} 

@-webkit-keyframes blink {
    0% {
        opacity:1;
    }
    50% {
        opacity:0;
    }
    100% {
        opacity:1;
    }
}
/* IE */
@-ms-keyframes blink {
    0% {
        opacity:1;
    }
    50% {
        opacity:0;
    }
    100% {
        opacity:1;
    }
} 
/* Opera and prob css3 final iteration */
@keyframes blink {
    0% {
        opacity:1;
    }
    50% {
        opacity:0;
    }
    100% {
        opacity:1;
    }
} 
.blink-image {
    -moz-animation: blink normal 4s infinite ease-in-out; /* Firefox */
    -webkit-animation: blink normal 4s infinite ease-in-out; /* Webkit */
    -ms-animation: blink normal 4s  infinite ease-in-out; /* IE */
    animation: blink normal 4s  infinite ease-in-out; /* Opera and prob css3 final iteration */
}


/* ******************************************************************************************
 * Color de fondo del tooltip del popup
 * ******************************************************************************************/

.red-tooltip + .tooltip > .tooltip-inner {background-color: #f00;margin-top: 50px;}

/* ******************************************************************************************
 * Selected language indicator
 * ******************************************************************************************/

.selectedLanguage{
	color:#428bca !important;
}

.languageOption i{
	display: none;
}