@pageDarkBgColor : #4E575A;  // Dark Grey
@pageContrastColor : #00C419; //Green
@navTextColor : #FFF; //White
@colorBoton1:#00C419;
@colorBoton2:#3101fb; 
@colorliPanel : #D8D8D8; // Gris
@colorletraPanel: #000; // Negro
@colorletraPanelpto: #000; // Negro


/*Layout*/
html,body{margin:0px;height:100%;}
#main {width:100%; height: 100%; font-family: Arial, Helvetica, sans-serif; min-width:939px;}
#main #header {width:100%; position: relative; clear:both; float:left;}
#main #container {width:100%; background: url("img/bg.png") repeat-y -2px -469px; }
#main #container #content {background-color: #FFF; margin: 0 0 0 192px;} 
#main #container #content .content_wrapper { margin: 20px 0 15px; float:left}
#main #container #sidebar {width:190px; float: left; background-color:#F0F0F0;  border-right:1px solid  #C9C9C9; }

h1 {font-family: 'Droid Sans', sans-serif; font-size:23px; color:#262626; font-weight:700; margin:5px 0 20px 0; }
h2 {font-size:16px; color:#242626; font-weight:bold; margin:5px 0 5px 0; }
h3 {font-size:13px; color:#424242; font-weight:700; margin:0 0 10px 0; }
p, td {line-height:130%}

.btn_new a {font-family: 'Droid Sans', sans-serif; font-size:13px; color:#FFF; font-weight:700; text-transform:uppercase; text-decoration:none; padding:8px 15px 6px 20px; background-color:#415054;}
.btn_new:hover {opacity:0.8}
#container{ float:left; width:100%; cleat:both;}
.sep {border-top:1px dotted #6F6F6E; margin:30px 0 0 0}

/*Cabecera*/
#main #header {background-color:#EAEAEA}

#main #header > .top {background-color:@pageDarkBgColor; height:30px; position:relative}
#main #header > .top .welcome {float:right; font-size:12px; color:@navTextColor; margin:9px 10px 0 0}
#main #header > .top .welcome .user {font-weight: bold} 
#main #header > .top ul {float:right; margin-right:20px}
#main #header > .top ul li {font-size:12px; display:inline; float:left; margin:9px 10px 0 0; border-right:1px solid #6D7274; padding-right:10px}
#main #header > .top ul li.last {border-right:none; padding-right:0}
#main #header > .top ul li.first {border-left:1px solid #6D7274; padding-left:10px}
#main #header > .top ul li a{color:@navTextColor; text-decoration:none;}
#main #header > .top ul li a:hover {text-decoration: underline}

#polyglotLanguageSwitcher ul li a{color:#3A4043 ! important; }
#polyglotLanguageSwitcher a{color:#3A4043 ! important; }

#main #header > .middle {
    background-color:#FFF;
    border-bottom:1px solid @pageDarkBgColor;
    clear: both;
    float: left;

    position: relative;
    width: 100%;
}

#main #header > .bottom { background-color:#FFF; padding-bottom: 10px; margin-left:-1px; border-bottom:1px solid #B2B2B2; -webkit-box-shadow: 2px 2px 5px 0px rgba(234,234,234,1); float:left;
width:100%;
-moz-box-shadow: 2px 2px 5px 0px rgba(234,234,234,1); box-shadow: 2px 2px 5px 0px rgba(234,234,234,1); position:relative}
#main #header > .bottom ul {margin-left:26px;}
#main #header > .bottom ul li {font-family: 'Droid Sans', sans-serif;  font-size:12px; display:inline; float:left; margin-right:15px; margin-top: 13px; position:relative}
#main #header > .bottom ul li a{color:#4C4C4C; text-decoration:none;  padding: 6px 10px; float:left}

#main #header > .bottom ul li.selected a { color:white;background-color:@pageContrastColor;  border: 0 none;  border-radius: 10px 10px 10px 10px;  padding: 6px 10px;}
#main #header > .bottom ul li:hover > a {color:white;background-color:@pageContrastColor; opacity:0.8;  border: 0 none;  border-radius: 10px 10px 10px 10px;  padding: 6px 10px;}
#header > #panelcontrol, #header > #alarmas, #header > #AEV, #header > #configuracion, #header > #monitorizacion , #header > #bloqueMYVMENU, #header > #bloqueSCADA, #header > #usuariosbloque, #header > #configuracion, #header > #usuariosbloque, #header > #rootuser, #header > rootconfig {display:none;}

.logo {
    float: left;
    text-align: center;
    width: 392px;
	height:100px;
}

#main #header div.logo a {
    display: block;
    float: left;
    margin: 15px 150px;
    width: 200px;
}

svg path{
	fill: @pageContrastColor;
}
.redondonew:hover svg path {
	fill: white; 
}
svg{
	max-width: 35px;
	float:left;
}
.redondonew{
			float:left;
			width:90px;
			height:70px;
			padding-left: 50%;
			border-radius: 20px;
			padding-top:10px;
		}
.redondonewn{
	width:110px;
	height:90px;
}
.redondonew:hover{
	background-color:@pageContrastColor;
	opacity: 0.8;
}
.redondonew:hover span{
	color:white;
}

.selectormarcadoJ{
	background-color:@pageContrastColor;
}

.selectormarcadoJ svg path {
	fill: white; 
}

.selectormarcadoJ span{
	color:white;
}

.textboyon{
	float:left;
	width:150%;
	text-align:center;
	margin-left:-49px;
}

@media( max-width:1000px){

.textboyon{
	margin-left:-40px;
}

svg{
	max-width: 31px;
}

.logo img{
	margin-top:20px;
	max-width:120px;
	margin-left:-85px;
}

.redondonew{
	width:78px;
	padding-left: 47%;
}

.redondonewn{
	width:90px;
}

#main #header nav ul li#op2{
	margin-left:10px;
	
}

#main #header nav ul li#op11{
	margin-left:10px;
	
}

#main #header nav ul li#op2 span, #main #header nav ul li#op4 span, #main #header nav ul li#op5 span, #main #header nav ul li#op8 span, #main #header nav ul li#op11 span, #main #header nav ul li#op33 span, #main #header nav ul li#op77 span{
	margin-left:-40px !important;
}

}

@media( max-width:1300px) and (min-width:1001px){

.textboyon{
	margin-left:-40px;
}

svg{
	max-width: 33px;
}

.logo img{
	margin-top:20px;
	max-width:150px;
	margin-left:-65px;
}

.redondonew{
	width:78px;
	padding-left: 47%;
}

.redondonewn{
	width:90px;
}

#main #header nav ul li#op2{
	margin-left:50px;
	
}
#main #header nav ul li#op11{
	margin-left:50px;
	
}

#main #header nav ul li#op2 span, #main #header nav ul li#op4 span, #main #header nav ul li#op5 span, #main #header nav ul li#op8 span, #main #header nav ul li#op11 span, #main #header nav ul li#op33 span, #main #header nav ul li#op77 span{
	margin-left:-40px !important;
}

}

@media( max-width:1400px) and (min-width:1301px){

.textboyon{
	width:150%;
	margin-left:-40px;
}

svg{
	max-width: 35px;
}

.logo img{
	margin-top:20px;
	max-width:175px;
	margin-left:-35px;
}

.redondonew{
	width:78px;
	padding-left: 47%;
}

.redondonewn{
	width:90px;
}

#main #header nav ul li#op2{
	margin-left:100px;
	
}

#main #header nav ul li#op11{
	margin-left:100px;
	
}

#main #header nav ul li#op2 span, #main #header nav ul li#op4 span, #main #header nav ul li#op5 span, #main #header nav ul li#op8 span, #main #header nav ul li#op11 span, #main #header nav ul li#op33 span, #main #header nav ul li#op77 span{
	margin-left:-41px !important;
}



}

@media (min-width:1401px){

#main #header nav ul li#op2{
	margin-left:150px;
	
}

#main #header nav ul li#op11{
	margin-left:150px;
	
}

.logo img{
	margin-top:10px;
	max-width:200px;
	margin-left:10px;
}

}

@media (min-width:1801px){
#main #header > .middle{
	padding-bottom:0;
}
}
 
/*Menú de navegación principal*/
#main #header nav {position:relative; top:16px; left:0px}
#main #header nav ul li {font-family: 'Droid Sans', sans-serif; text-transform:uppercase; font-size:12px; display:inline; float:left; margin-right:20px; position: relative; margin-top:-10px;}
#main #header nav ul li a{color:#000; text-decoration:none; display:block;  height:0px;  padding:0 0 0 0; word-wrap: break-word;}
#main #header nav ul li#op1 a {background: url("css/img/sprites.png") no-repeat 0px -65px;}
/*#main #header nav ul li#op2 a {background: url("css/img/sprites.png") no-repeat 0px -103px;}*/
#main #header nav ul li#op3 a {background: url("css/img/sprites.png") no-repeat 0px -141px;}
#main #header nav ul li#op4 a {background: url("css/img/sprites.png") no-repeat 0px -179px;}
#main #header nav ul li#op5 a {background: url("css/img/sprites.png") no-repeat 0px -217px;}
#main #header nav ul li#op6 a {background: url("css/img/sprites.png") no-repeat 0px -257px;}
#main #header nav ul li#op7 a {background: url("css/img/sprites.png") no-repeat -400px -340px;}
#main #header nav ul li#op8 a {background: url("css/img/sprites.png") no-repeat -401px -441px;}
#main #header nav ul li#op11 a {background: url("css/img/spritespgp.png") no-repeat 0px -65px;}
#main #header nav ul li#op22 a {background: url("css/img/spritespgp.png") no-repeat 0px -103px;}
#main #header nav ul li#op33 a {background: url("css/img/spritespgp.png") no-repeat 0px -141px;}
#main #header nav ul li#op44 a {background: url("css/img/spritespgp.png") no-repeat 0px -179px;}
#main #header nav ul li#op55 a {background: url("css/img/spritespgp.png") no-repeat 0px -217px;}
#main #header nav ul li#op66 a {background: url("css/img/spritespgp.png") no-repeat 0px -257px;}
#main #header nav ul li#op77 a {background: url("css/img/sprites.png") no-repeat 0px -217px;}
#main #header nav ul li#op88 a {background: url("css/img/spritespgp2.png") no-repeat -398px -362px;}
#op6{ margin-right:0 !important;}

#main #header nav ul li#op1 .redondo:hover {background: url("css/img/sprites.png") no-repeat -400px -68px;background-color:@pageContrastColor;}
#main #header nav ul li#op2 .redondo:hover {background: url("css/img/sprites.png") no-repeat -400px -106px;background-color:@pageContrastColor;}
#main #header nav ul li#op3 .redondo:hover {background: url("css/img/sprites.png") no-repeat -400px -144px;background-color:@pageContrastColor;}
#main #header nav ul li#op4 .redondo:hover {background: url("css/img/sprites.png") no-repeat -400px -182px;background-color:@pageContrastColor;}
#main #header nav ul li#op5 .redondo:hover {background: url("css/img/sprites.png") no-repeat -400px -220px;background-color:@pageContrastColor;}
#main #header nav ul li#op6 .redondo:hover {background: url("css/img/sprites.png") no-repeat -400px -260px;background-color:@pageContrastColor;}
#main #header nav ul li#op7 .redondo:hover {background: url("css/img/sprites.png") no-repeat -400px -300px;background-color:@pageContrastColor;}
#main #header nav ul li#op8 .redondo:hover {background: url("css/img/sprites.png") no-repeat -402px -391px;background-color:@pageContrastColor;}
#main #header nav ul li#op11 .redondo:hover {background: url("css/img/spritespgp.png") no-repeat -400px -68px;background-color:@pageContrastColor;}
#main #header nav ul li#op22 .redondo:hover {background: url("css/img/spritespgp.png") no-repeat -400px -106px;background-color:@pageContrastColor;}
#main #header nav ul li#op33 .redondo:hover {background: url("css/img/spritespgp.png") no-repeat -400px -144px;background-color:@pageContrastColor;}
#main #header nav ul li#op44 .redondo:hover {background: url("css/img/spritespgp.png") no-repeat -400px -182px;background-color:@pageContrastColor;}
#main #header nav ul li#op55 .redondo:hover {background: url("css/img/spritespgp.png") no-repeat -400px -220px;background-color:@pageContrastColor;}
#main #header nav ul li#op66 .redondo:hover {background: url("css/img/spritespgp.png") no-repeat -400px -260px;background-color:@pageContrastColor;}
#main #header nav ul li#op77 .redondo:hover {background: url("css/img/sprites.png") no-repeat -400px -220px;background-color:@pageContrastColor;}
#main #header nav ul li#op88 .redondo:hover {background: url("css/img/spritespgp2.png") no-repeat -399px -315px;background-color:@pageContrastColor;}

#main #header nav ul li#op1.selected a {font-weight:700;}
#main #header nav ul li#op1.selected .redondo {background: url("css/img/sprites.png") no-repeat -400px -68px;background-color:@pageContrastColor;}
#main #header nav ul li#op2.selected a {font-weight:700;}
#main #header nav ul li#op2.selected .redondo {background: url("css/img/sprites.png") no-repeat -400px -106px;background-color:@pageContrastColor;}
#main #header nav ul li#op3.selected a {font-weight:700;}
#main #header nav ul li#op3.selected .redondo {background: url("css/img/sprites.png") no-repeat -400px -144px;background-color:@pageContrastColor;}
#main #header nav ul li#op4.selected a {font-weight:700;}
#main #header nav ul li#op4.selected .redondo {background: url("css/img/sprites.png") no-repeat -400px -182px;background-color:@pageContrastColor;}
#main #header nav ul li#op5.selected a {font-weight:700;}
#main #header nav ul li#op5.selected .redondo {background: url("css/img/sprites.png") no-repeat -400px -220px;background-color:@pageContrastColor;}
#main #header nav ul li#op6.selected a {font-weight:700;}
#main #header nav ul li#op6.selected .redondo {background: url("css/img/sprites.png") no-repeat -400px -260px;background-color:@pageContrastColor;}
#main #header nav ul li#op7.selected a {font-weight:700;}
#main #header nav ul li#op7.selected .redondo {background: url("css/img/sprites.png") no-repeat -400px -300px;background-color:@pageContrastColor;}
#main #header nav ul li#op8.selected a {font-weight:700;}
#main #header nav ul li#op8.selected .redondo {background: url("css/img/sprites.png") no-repeat -402px -391px;background-color:@pageContrastColor;}

#main #header nav ul li#op11.selected a {font-weight:700;}
#main #header nav ul li#op11.selected .redondo {background: url("css/img/spritespgp.png") no-repeat -400px -68px;background-color:@pageContrastColor;}
#main #header nav ul li#op22.selected a {font-weight:700;}
#main #header nav ul li#op22.selected .redondo {background: url("css/img/spritespgp.png") no-repeat -400px -106px;background-color:@pageContrastColor;}
#main #header nav ul li#op33.selected a {font-weight:700;}
#main #header nav ul li#op33.selected .redondo {background: url("css/img/spritespgp.png") no-repeat -400px -144px;background-color:@pageContrastColor;}
#main #header nav ul li#op44.selected a {font-weight:700;}
#main #header nav ul li#op44.selected .redondo {background: url("css/img/spritespgp.png") no-repeat -400px -182px;background-color:@pageContrastColor;}
#main #header nav ul li#op55.selected a {font-weight:700;}
#main #header nav ul li#op55.selected .redondo {background: url("css/img/spritespgp.png") no-repeat -400px -220px;background-color:@pageContrastColor;}
#main #header nav ul li#op66.selected a {font-weight:700;}
#main #header nav ul li#op66.selected .redondo {background: url("css/img/spritespgp.png") no-repeat -400px -260px;background-color:@pageContrastColor;}
#main #header nav ul li#op77.selected a {font-weight:700;}
#main #header nav ul li#op77.selected .redondo {background: url("css/img/sprites.png") no-repeat -400px -220px;background-color:@pageContrastColor;}
#main #header nav ul li#op88.selected a {font-weight:700;}
#main #header nav ul li#op88.selected .redondo {background: url("css/img/spritespgp2.png") no-repeat -399px -315px;background-color:@pageContrastColor;}

#main #header nav ul li.selected:after { border-bottom: 0px solid @pageContrastColor; border-left: 6px solid transparent; border-right: 6px solid transparent; content: ""; height: 0; left: 10px; position: absolute; text-align: center; top: 36px; width: 0; }

#main #header nav ul li#op4 {position:relative}
#main #header nav ul li .alarms {position:absolute;  top:-5px; left:-5px; /*z-index:999*/; -webkit-border-radius: 180px; -moz-border-radius: 180px; border-radius: 180px; background-color:#D93600; color:#FFF;font-size:10px; width:18px; height:15px; font-weight:bold; text-align:center; padding-top:3px}

/*SergioB Scada-Plantillas Añadida siguiente regla para resaltar la opción de menú Scada*/
#main #header nav ul li .scada {position:absolute;  top:-5px; left:-5px; z-index:999; -webkit-border-radius: 180px; -moz-border-radius: 180px; border-radius: 180px; background-color:#D93600; color:#FFF;font-size:10px; width:28px; height:15px; font-weight:bold; text-align:center; padding-top:3px}

/*Columna izquierda*/

#main #sidebar #filter {height:120px;  padding:20px 0 0 15px}
#main #sidebar #filter h2 {font-family: 'Droid Sans', sans-serif; font-size:14px; color:#434A4C; font-weight:700; margin:5px 0 10px 0; text-transform: uppercase }
#main #sidebar #filter input.texto {width:125px; height:26px; border:1px solid #CCC; border-right:none; float:left; border-top-left-radius:3px; -moz-border-radius-topleft:3px; -webkit-border-top-left-radius:3px; border-bottom-left-radius:3px; -moz-border-radius-bottomleft:3px; -webkit-border-bottom-left-radius:3px}
#main #sidebar #filter input.submit {background: url("img/sprites.png") no-repeat -216px -8px;   height:30px; width:31px; border:none; text-indent:-999px; float:left; cursor:pointer}
#main #sidebar #filter input.submit:hover {background: url("img/sprites.png") no-repeat -266px -8px;}
#main #sidebar #filter input.button { background-color:#E9EBEB; border:1px solid #C5C5C5; color:#262626; font-family: 'Droid Sans', sans-serif; font-size:11px;  font-weight:700; text-transform: uppercase; width:80px; height:26px; cursor:pointer; margin-top:15px}
#main #sidebar #filter input.button:hover {background-color:@pageContrastColor; border:1px solid #FFF; color:#FFF;}

//#main #sidebar ul li {border-bottom:1px solid #C9C9C9; color:#FFC0CB;} 
#main #sidebar ul li span {color:@colorletraPanel;} 
#main #sidebar ul li a {font-family: 'Droid Sans', sans-serif; font-size:12px; text-decoration:none; color:#000;  padding:10px 0 10px 35px; position: relative; display:block}
#main #sidebar ul li.edificio {background:#D8D8D8;background: url("img/sprites.png") no-repeat -920px -62px !important;}
#main #sidebar ul li.carpeta {background: url("img/sprites.png") no-repeat -920px -112px !important;}
#main #sidebar ul li.eolica {background: url("img/sprites.png") no-repeat -920px -217px !important;}
#main #sidebar ul li.alumbrado {background: url("img/sprites.png") no-repeat -920px -159px !important;}
#main #sidebar ul li.bomba {background: url("img/sprites.png") no-repeat -920px -215px !important;}
#main #sidebar ul li.nave {background: url("img/sprites.png") no-repeat -920px -267px !important;}
#main #sidebar ul li.casa {background: url("img/sprites.png") no-repeat -920px -317px !important;}
#main #sidebar ul li.unifamiliar {background: url("img/sprites.png") no-repeat -920px -317px !important;}
#main #sidebar ul li.fotovoltaica {background: url("img/sprites.png") no-repeat -920px -364px !important;}
#main #sidebar ul li.plantaFV {background: url("img/sprites.png") no-repeat -920px -364px !important;}
//#main #sidebar ul li.last {border-bottom:none}

#main #sidebar ul li.open > a:after { border-bottom: 4px solid #666; border-left: 4px solid transparent; border-right: 4px solid transparent; content: ""; height: 0; right: 10px; position: absolute; text-align: center; top: 15px; width: 0; }
#main #sidebar ul li.closed > a:after { border-top: 4px solid #666; border-left: 4px solid transparent; border-right: 4px solid transparent; content: ""; height: 0; right: 10px; position: absolute; text-align: center; top: 15px; width: 0; }


#main #sidebar ul li ul li {/*position:relative;*/}
#main #sidebar ul li ul li i{color:@colorletraPanelpto;float:left;}
#main #sidebar ul li ul li a {font-family: 'Droid Sans', sans-serif; font-size:11px; text-decoration:none; color:#434A4C; padding:10px 0 10px 40px; display:block}
#main #sidebar ul li ul label{max-width:280px;}
#main #sidebar ul li ul label.A {background:#F1F1F1 url("css/img/sprites.png") no-repeat -653px -67px;}
#main #sidebar ul li ul label.M {background:#F1F1F1 url("css/img/sprites.png") no-repeat -653px -116px;}
#main #sidebar ul li ul label.S {background:#F1F1F1 url("css/img/sprites.png") no-repeat -653px -165px;}
#main #sidebar ul li ul label.T {background:#F1F1F1 url("css/img/sprites.png") no-repeat -653px -215px;}
#main #sidebar ul li ul label.E {background:#F1F1F1 url("css/img/sprites.png") no-repeat -653px -263px;}
#main #sidebar ul li ul label.V {background:#F1F1F1 url("css/img/sprites.png") no-repeat -653px -312px;}
#main #sidebar ul li ul label.R {background:#F1F1F1 url("css/img/sprites.png") no-repeat -653px -361px;}
#main #sidebar ul li ul label.SE {background:#F1F1F1 url("css/img/sprites.png") no-repeat -653px -409px;}
#main #sidebar ul li ul label.SDD {background:#F1F1F1 url("css/img/sprites.png") no-repeat -653px -450px;}

#main #sidebar ul li.A {background:#F1F1F1 url("css/img/sprites.png") no-repeat -633px -67px;}
#main #sidebar ul li.M {background:#F1F1F1 url("css/img/sprites.png") no-repeat -633px -116px;}
#main #sidebar ul li.S {background:#F1F1F1 url("css/img/sprites.png") no-repeat -633px -165px;}
#main #sidebar ul li.T {background:#F1F1F1 url("css/img/sprites.png") no-repeat -633px -215px;}
#main #sidebar ul li.E {background:#F1F1F1 url("css/img/sprites.png") no-repeat -633px -263px;}
#main #sidebar ul li.V {background:#F1F1F1 url("css/img/sprites.png") no-repeat -633px -312px;}
#main #sidebar ul li.R {background:#F1F1F1 url("css/img/sprites.png") no-repeat -633px -361px;}
#main #sidebar ul li.SE {background:#F1F1F1 url("css/img/sprites.png") no-repeat -633px -409px;}
#main #sidebar ul li.SDD {background:#F1F1F1 url("css/img/sprites.png") no-repeat -633px -450px;}

.divtablasver .A {background:url("css/img/sprites.png") no-repeat -663px -72px;max-width:270px;}
.divtablasver .M {background:url("css/img/sprites.png") no-repeat -663px -121px;max-width:270px;}
.divtablasver .S {background:url("css/img/sprites.png") no-repeat -663px -170px;max-width:270px;}
.divtablasver .T {background:url("css/img/sprites.png") no-repeat -663px -220px;max-width:270px;}
.divtablasver .E {background:url("css/img/sprites.png") no-repeat -663px -268px;max-width:270px;}
.divtablasver .V {background:url("css/img/sprites.png") no-repeat -663px -317px;max-width:270px;}
.divtablasver .R {background:url("css/img/sprites.png") no-repeat -663px -366px;max-width:270px;}
.divtablasver .SE {background:url("css/img/sprites.png") no-repeat -663px -414px;max-width:270px;}
.divtablasver .SDD {background:url("css/img/sprites.png") no-repeat -663px -455px;max-width:270px;}

/*
#main #sidebar ul li ul li.selected, #main #sidebar ul li ul li:hover{ background-color:#6C797D}
#main #sidebar ul li ul li.selected a {color:#FFF; font-weight:700}
#main #sidebar ul li ul li:hover > a {color:#FFF}
#main #sidebar ul li ul li.labels {background:#F1F1F1; padding-left:130px; padding-top:10px}
#main #sidebar ul li ul li.labels label {font-size:10px; color:#242626}

#main #sidebar ul li ul li .checks {position:absolute; top:6px; right:15px}
#main #sidebar ul li ul li input.check1 {float:left; margin-right:10px}
#main #sidebar ul li ul li input.check2 {float:left}
*/


/*Pie de página*/
#main footer {background-color: @pageDarkBgColor; clear:both; border-top: 0px solid @pageContrastColor; width: 100%;}
#main footer > .box {background-color: @pageDarkBgColor;}
#main footer > .box { overflow: hidden; }
#main footer .copy {float:left; font-size:12px; color:@navTextColor; margin:12px 25px 0 15px; width:415px;}
#main footer ul {float:left; height:35px}
#main footer ul li { font-size:14px; display:inline; float:left; background: url("img/sprites.png") no-repeat -9px -316px;  padding-top:11px; height:125px}
#main footer ul li a {font-size:12px; color:@navTextColor; text-decoration:none; padding:0 25px 0 25px}
#main footer ul li a:hover {color:#FFF}
#main footer .phone {float:right; font-size:14px; color:#FFF; font-weight:bold; background: url("img/sprites.png") no-repeat -402px -16px; padding-left:30px;  margin:12px  15px 0 0}

/*auxiliares*/
.rounded {-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
.rounded2 {-webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;}
.colored { background-color:#F5F5F5}

/*Instalaciones*/
.instalaciones {border:1px solid  #C5C5C5; margin-top:20px}
.instalaciones th {padding:10px; background-color:#ECEDED; color:#242627; font-size:12px; border-right:1px solid #C5C5C5; vertical-align: middle; text-align:left}
.instalaciones td {padding:10px; colro:#3F4647; font-size:12px; border-right:1px solid #C5C5C5; vertical-align: middle;} 
.instalaciones td.nombre {width:260px}
.instalaciones td.nombre img {float:left; width:75px; margin:0 10px 0 0}
.instalaciones td.nombre .txtNombre {float:left; font-weight:bold; width:170px}
.instalaciones td.alarmas {font-size:25px; font-weight:bold; color:#D93600; width:105px; text-align:center}
.instalaciones th.alarmas {background: #ECEDED url("img/sprites.png") no-repeat 11px -450px; padding-left:35px}
.instalaciones td.pie { background-color:#ECEDED; text-align:right; border-top:1px solid #C5C5C5}

/* Media Quiry its use Responsive Design */


@media( min-width:768px){

#main #header nav ul li {
    font-size: 12px;
    margin-right: 16px ;

}


}

@media all and (max-width: 1200px) and (min-width:1100px) {



.headRow .divCell-middile{ width: 41% !important;}

.divCell-middile{ width: 41%  !important;;}


.instalaciones .middle-colum {
    border-right: 1px solid #C5C5C5;
    float: left;
    font-size: 12px;
    min-height: 20px;
    width: 45.8% !important;
}

.colum1_1 {
    background-color: #F5F5F5;
    min-height: 74px !important;
    padding: 10px;
}

.colum1 {
    background-color: #FFFFFF;
    min-height: 76px  !important ;
    padding: 10px;
}

.colum3 {
    background-color: #FFFFFF;
    color: #D93600;
    font-size: 25px;
    font-weight: bold;
    min-height: 95px !important;
    text-align: center;
}

.colum3_3 {
    background-color: #F5F5F5;
    color: #D93600;
    font-size: 25px;
    font-weight: bold;
    min-height: 95px  !important;
    text-align: center;
}

.instalaciones .left-colum {
    border-right: 1px solid #C5C5C5;
    float: left;
    font-size: 12px;
    min-height: 20px;
    width: 36.6%  !important;
}

.instalaciones .right-colum {
    float: left;
    font-size: 12px;
    min-height: 20px;
    width: 17.1%  !important;
}



}



#op6 {
    min-width: 138px;
}




@media(max-width:1800px){
	.divCell-middile, .headRow .divCell-middile{
		width:35% !important;
	}
	.divCell-left{
			width:180px !important;
			min-width:180px;
	}
	#main #header nav ul li {
		margin-right: 6%;
	}
	#main .headerPGP nav ul li {
		margin-right: 6%;
	}
	.grey-left-area.grey-left-area-2{
		width:45%;
	}
	.sample-row-cell-2{
		max-width:190px;
		}
	.logo{
		width:142px;
	}
	#main #header div.logo a{
		margin: 6px 27px;
	}
}


@media (min-width:1401px){

#main #header nav ul li {
		margin-right: 5%;
	}

}




@media(max-width:1200px){
	#main #header nav ul li {
		margin-right: 4.1%;
	}
}


@media(max-width:900px){
	.divCell-middile, .headRow .divCell-middile{
		width:33% !important;
		min-width:430px;
	}
}
@media(max-width:800px){
	.divCell-middile, .headRow .divCell-middile{
		width:28% !important;
		min-width:430px;
	}
}
@media(max-width:767px){
	#main #header > .bottom ul li {
		padding-bottom: 24px;
	}
	

}















.instalaciones {min-height:20px; overflow:hidden; max-width:100%;}

.instalaciones .left-colum {
    border-right: 1px solid #C5C5C5;
    float: left;
    font-size: 12px;
    min-height: 20px;
    width: 280px;

}
.instalaciones .middle-colum {
    border-right: 1px solid #C5C5C5;
    float: left;
    font-size: 12px;
    min-height: 20px;
    width: 63%;
}
.instalaciones .right-colum {
    float: left;
    font-size: 12px;
    min-height: 20px;
    width: 125px;

}

.left-colum .nombre{background-color: #ECEDED;

    color: #242627;
    font-size: 12px;
    padding: 10px;
    text-align: left;
    vertical-align: middle;
}


.middle-colum .descrip{background-color: #ECEDED;

    color: #242627;
    font-size: 12px;
    padding: 10px;
    text-align: left;
    vertical-align: middle;
}




.right-colum .alarmas{background-color: #ECEDED;
    color: #242627;
    font-size: 12px;
    padding: 10px 0 10px 35px;
    text-align: left;
    vertical-align: middle;
	background: url("img/sprites.png") no-repeat scroll 11px -450px #ECEDED;
 }

/*-------------------------- 2 colums ------------------------------------------- */


.colum1{ background-color:#FFFFFF; min-height:50px; padding:10px;}
.colum2{ background-color:#FFFFFF; min-height:50px; padding:10px;line-height: 15px;}
.colum3 {
    background-color: #FFFFFF;
    color: #D93600;
    font-size: 25px;
    font-weight: bold;
    min-height: 70px;
    text-align: center;
}


.colum1 img {
    float: left;
    margin: 0 10px 0 0;
    width: 75px;
}
.colum1 .txtNombre {
    float: left;
    font-weight: bold;
    width: 170px;

}
.colum3 .alarms{ line-height: 66px;}

/*-------------------------- 2 colums ------------------------------------------- */

.colum1_1{ background-color:#F5F5F5; min-height:50px; padding:10px;}
.colum2_2{ background-color:#F5F5F5; min-height:50px; padding:10px;line-height: 15px;}
.colum3_3 {
    background-color: #F5F5F5;
    color: #D93600;
    font-size: 25px;
    font-weight: bold;
    min-height: 70px;
    text-align: center;
}


.colum1_1 img {
    float: left;
    margin: 0 10px 0 0;
    width: 75px;
}
.colum1_1 .txtNombre {
    float: left;
    font-weight: bold;
    width: 170px;

}
.colum3_3 .alarms{ line-height: 66px;}
	
.colums-footer{ border-top: 1px solid #C5C5C5; min-height:20px; clear:both; background-color: #ECEDED;

    text-align: right;padding: 10px; font-size: 12px;}	
	
	
	
	
	 .divTable
    {
        display:  table;
        width:100%;
         border: 1px solid #C5C5C5;
       /*cellspacing:poor IE support for  this*/
       /* border-collapse:separate;*/
    }

    .divRow
    {
       display:table-row;
       width:100%;
	 
	   background-color:#FFFFFF;
	   font-size:12px;

    }


    .divRow-alt1
    {
       display:table-row;
       width:100%;
		background-color:#F5F5F5;	   font-size:12px;

    }


	.cabecera
	{
		font-weight:bold;
		text-align:center;
	}


   .headRow .divCell-left
    {
        float:left;/*fix for  buggy browsers*/
        display:table-column;
		width: 350px;
		min-width:275px;
		border:none;
		border-right: 1px solid #C5C5C5;
		padding:10px;
    }
	

  .headRow .divCell-middile
    {
        float:left;/*fix for  buggy browsers*/
        display:table-column;
		 width: 53%;
		border:none;
		border-right: 1px solid #C5C5C5;
		padding:10px;
		line-height: 12px;
		min-height: 12px;
		min-width:400px;
    }
	
	
	.headRow .divCell-right
    {
        float:left;/*fix for  buggy browsers*/
        display:table-column;
		width: 280px;
		border:none;
		padding:10px;
		width: 110px;
		line-height: 15px;
    }

.divCell-left {
    display: table-column;
    float: left;
    padding: 10px;
    width: 350px;
	min-width:275px;
}
	
.divCell-left img {
    float: left;
    margin: 0 10px 0 0;
    width: 105px;
	max-height:72px !important;
}
	
.divCell-left .txtNombre {
	margin-top:30px;
    float: left;
    font-weight: bold;
}	
	
	
	.divCell-middile
    {
        float:left;/*fix for  buggy browsers*/
        display:table-column;
	    border-right: 1px solid #C5C5C5;
		 width: 53%;
		 padding:10px;
		 min-height: 72px;
		 line-height: 18px;
		 border-left: 1px solid #C5C5C5;
		 min-width:400px;
    }
	
	
	 .divCell-right
    {
        float:left;/*fix for  buggy browsers*/
        display:table-column;
		width: 105px;
		padding:10px;
		color: #D93600;
		font-size: 25px;
		font-weight: bold;
		line-height: 54px;
		text-align: center;
			
    }
	

	.headRow{background-color:#ECEDED; color: #242627;
    font-size: 12px; overflow:hidden; 
	}
	
	
.headRow .alarmas{background-color: #ECEDED;

    color: #242627;
    font-size: 12px;
    padding: 10px 0 5px 35px;
    text-align: left;
    vertical-align: middle;
	background: url("img/sprites.png") no-repeat scroll 11px -450px #ECEDED;
 }
	
/*-------------------------- 2 colums ------------------------------------------- */

.IconosIzquierda{
	float:left;
	padding:2px;
	margin-right:3px;
}


/*aqui le aplico less a los botones de la web*/

.green-btn.n-btn{
	background:@colorBoton1 !important;
	color:@navTextColor !important;
	border:1px solid @colorBoton1 !important;
	margin-left:0 !important;
	padding: 0 12px;
}
.blue-btn.n-btn{
	background: @colorBoton2 !important;
	border:1px solid @colorBoton2 !important;
	color:@navTextColor !important;
	margin-left:0 !important;
	padding: 0 12px;
}

.grey-right-area input[type="button"].foto-btn:hover,  .n-btn:hover{
	background:@colorBoton1;
	color:@navTextColor;
	border:1px solid @colorBoton1;
}

.table-bottom-area-left .n-btn.first:hover{
	background: url(./img/btn-icon-1.png) no-repeat 5px -34px @colorBoton1;
    border: 1px solid @colorBoton1;
    color: @navTextColor;
}

.table-bottom-area-left .n-btn.second:hover{
	background: url(img/btn-icon-2.png) no-repeat 5px -35px @colorBoton1;
    border: 1px solid @colorBoton1;
    color: @navTextColor;
}
.table-bottom-area-left .n-btn.third:hover{
	background: url(img/btn-icon-3.png) no-repeat 5px -34px @colorBoton1;
    border: 1px solid @colorBoton1;
    color: @navTextColor;
}

.table-bottom-area-left .n-btn.forth:hover{
	background: url(img/btn-icon-4.png) no-repeat 5px -34px @colorBoton1;
    border: 1px solid @colorBoton1;
    color: @navTextColor;
}

.table-bottom-area-left .n-btn.quinto:hover{
	background: url(img/btn-icon-5.png) no-repeat 6px -35px @colorBoton1;
    border: 1px solid @colorBoton1;
    color: @navTextColor;
}

.table-bottom-area-left .n-btn.sexto:hover{
    background: url(img/btn-icon-6-white.png) no-repeat 6px 2px @colorBoton1;
    border: 1px solid @colorBoton1;
    color: @navTextColor;
}

.table-bottom-area-left .n-btn.septimo:hover{
	background: url(img/btn-icon-7-white.png) no-repeat 5px 5px @colorBoton1;
    border: 1px solid @colorBoton1;
    color: @navTextColor;
}

.table-bottom-area-right .n-btn.first{
	margin-right:10px;
	background: @colorBoton1;
	border:1px solid @colorBoton1;
	color:@navTextColor;
}
.table-bottom-area-right .n-btn.second{
	background: @colorBoton2;
	border:1px solid @colorBoton2;
	color:@navTextColor;
}

.grey-right-area input[type="button"].foto-btn, .n-btn{
    background-color: #DCDEDE;
    border: 1px solid #C5C5C5;
    border-radius: 4px 4px 4px 4px;
    color: #262626;
    cursor: pointer;
    font-family: 'Droid Sans',sans-serif;
    font-size: 12px;
    font-weight: bold;
    height: 33px;
    margin-top: 15px;
    text-transform: uppercase;
	clear:both;
	/*float:left;*/
	width:auto !important;
	margin-left:0 !important;
}

#cab{
		border-bottom: 5px solid @pageContrastColor;
		padding: 15px;
		color: @navTextColor;
		font-size:24px;
		text-align: center;
		background-color: @pageDarkBgColor;
	}	
	
.grey-bg-content input[type="button"]:hover {
	background:@colorBoton1;
	color:@navTextColor;
	border:1px solid @colorBoton1;
}

#cab{
border-bottom: 5px solid @pageContrastColor;
		padding: 15px;
		color: @navTextColor;
		font-size:24px;
		text-align: center;
		background-color: @pageDarkBgColor;
}

.k-state-selected{
	background:@pageContrastColor !important;
}

.k-header{
	/*background:#D8D8D8 !important;*/
}



	
.tabsteps{
	text-align:left;
	width: 170px;
	height: 50px;
	background: @colorBoton2;
	border-radius: 8px;
	position:fixed;
	padding-left:8px;
}

.tabhelpus{
	vertical-align:top;
	text-align:left;
	width: 170px;
	height: 52px;
	background: @colorBoton1;
	border-radius: 8px;
	position:fixed;
	margin-top: 52px;
	padding-top:0px;
	padding-left:2px;
	
}

.progress .bar{
	background-color:@pageContrastColor !important;
}

.botonanteriorgraficas{
	display:block;
	margin:0 auto;
	width:0;
	height:0;
	border-color:white @colorBoton2 white white;
	border-style:solid;
	border-width:35px;
	position:absolute;
	z-index:-1;
}

.botonanteriorgraficas:hover{
	border-color:white @colorBoton2 white white !important;
}

.botonanteriorgraficas2{
	display:block;
	margin:0 auto;
	width:0;
	height:0;
	border-style:solid;
	border-width:35px;
	border-color:transparent white transparent transparent;
	margin-left:10px;
	z-index:1 ;
}

.botonsiguientegraficas{
	display:block;
	margin:0 auto;
	width:0;
	height:0;
	border-color:white white white @colorBoton1;
	border-style:solid;
	border-width:35px;
	z-index:-1;
}

.botonsiguientegraficas:hover{
	border-color:white white white @colorBoton1 !important;
}

.botonsiguientegraficas2{
	display:block;
	margin:0 auto;
	width:0;
	height:0;
	border-style:solid;
	border-width:35px;
	border-color:transparent transparent transparent white !important;
	margin-left:-10px;
	position:absolute;
	z-index:1;
}


#panelbar .k-group li{
	background-color:transparent !important;
}

[data-role=treeview] li{
	background-color:transparent !important;
}

[data-role=treeview] ul{
	background-color:transparent !important;
}

/* 
    Mecemsa Styles
*/
.icono-grid { text-align: center;}
.icono-grid img {cursor: pointer;}

#siguiente,#guardarinforme,#guardarinformedemo{float:right;}
.tablamia td, .tablamia th{padding:5px;}
.opcionTipo {border: 5px solid #EAEAEA; margin: 0px 10px 10px 0px; width: 19%; cursor: pointer;}
.opcionTipoMarcada {border: 5px solid #007ac9;}
.textOpcionTipo {border-bottom: 2px solid #EAEAEA; padding-top: 5px; padding-bottom:  5px; padding-left: 10px;}
.imgOpcionTipo {max-width: 70%; padding-left: 15%;}
.floatLeft {float: left;}
.clear {clear: both;}
.redondomyv {padding-left:10px; padding-top:6px; float:left; -webkit-border-radius: 30px; -moz-border-radius: 30px;
			border-radius: 30px; height:24px; width:20px; overflow:hidden; opacity: 0.3;}
.opcionmarcada > .redondomyv {opacity:1 !important;}
.opcionmarcada {font-weight:bold;}
.titulotexto {font-size:12px;font-weight:bold;}
.textoopcion {float:left; font-size:11px; margin-left:4px; margin-right:8px; margin-top:7px;}
#tabladeplanesmyv111222 {margin-top:25px;}
.lineass td, .lineass th, .lineass {border: 1px solid #AEAEAE !important; border-collapse: collapse !important; vertical-align:middle !important;}
.lineass th {background-color:#d8d8d8; font-weight:bold;}
.colorgrisfila {background-color:#F5F5F5;}
.iconoinfor {background: url("../images/videoinfoicon.png") no-repeat scroll 0 -26px rgba(0, 0, 0, 0); cursor: pointer;
			margin-left:25px; float: left; height: 26px; width: 30px;}
.grey-bg-content {padding-bottom:10px !important;}
.izquierdaalineado {width:200px; margin-top:15px; margin-left:10px; margin-right:10px; float:left;}
.bombaContenedor {background-color: #EAEAEA; padding: 5px 10px 5px 10px; border-radius: 5px; margin-bottom: 15px;}
.kendoTemplate input{float:right; padding:5px 0px;}
#btnSearch {width:30px}
.k-toolbar {height: 46px;}
.grafica{width: auto;}
.lblValor{float: left; position: absolute; width: 6.5%; text-align:right;margin-left:5px;}
.lblBombeo{float: left; position: absolute; width: 6.5%; text-align:right;}
.modal.fade{top:-100%}
#esquemaVerBombeo{position:relative;}
#imgVerBombeo{width:100%; height:100%;}