@charset "UTF-8";
/* CSS Document cuadrito*/

body {
	background-color: #1B1C1F;
}
.numero { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 40px;
}
.numero2 { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 70px;
}
.numero3 { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 30px;
}
.fontmini { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 10px;
}
.fontmini2 { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 10px;
}
.fontnormal { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 18px;
}
.fontnormal1 { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 25px;
}
.fontnormal2 { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 14px;
}
.fontnormal2a { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 20px;
}
.fontgris { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 14px;
	color:#929292;
}	
.fontmonto { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 80px;
	font-weight: bold;
}
.fontplaca { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 60px;
}
.fontgris-ch { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 12px;
	color:#000000;
}
.fontgris-me { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 14px;
	color:#CDCDCD;
}
.fontgris-rep1 { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 24px;
	color:#CDCDCD;
}
.fontgris-rep2 { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 15px;
	color:#CDCDCD;
}
.fontgris-rep3 { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 15px;
	color:#020000;
}
.fontgris-xch { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 12px;
	color:#CDCDCD;
}
.fontblanco-ch { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 12px;
	color:#E0E0E0;
}
.fontblanco-xch { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 10px;
	color:#E0E0E0;
}
.fontblanco-xch1 { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 14px;
	color:#000000;
}
.fontblanco-me { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 18px;
	color: #000000;
	text-align: right;
}
.fontblanco-me2 { 	
	font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;
	font-size: 18px;
	color: #000000;
	text-align: left;
}
.fontblanco-chart { 	
	font-family: Lucida Grande,Lucida Sans Unicode,Lucida Sans,Geneva,Verdana,sans-serif;
	font-size: 18px;
	color:#E0AA75;
}
.fontamarillo3 { 	
	font-family: Lucida Grande,Lucida Sans Unicode,Lucida Sans,Geneva,Verdana,sans-serif;
	font-size: 13px;
	color:#BFB89D;
}
.fontamarillo3-m { 	
	font-family: Lucida Grande,Lucida Sans Unicode,Lucida Sans,Geneva,Verdana,sans-serif;
	font-size: 19px;
	color:#BFB89D;
}
.fontplaca { 	
	font-family: Lucida Grande,Lucida Sans Unicode,Lucida Sans,Geneva,Verdana,sans-serif;
	font-size: 50px;
}
.font1 { 	
	font-family: Lucida Grande,Lucida Sans Unicode,Lucida Sans,Geneva,Verdana,sans-serif;
	font-size: 22px;
	color:#1E1D1D;
}
.fontnaranja-danger { 	
	color:#DB524B;
}
.center { 	
	text-align: center;
	align-items: center;
}
.cuadroajuste { 
	width: 983px; 
}
.contenedor1 { 
	width: 700px;
	text-align:center;
}
.rojo { 
	color:#DB0509;
}
.blanco { 
	color:#E0E0E0;
}
.gris { 
	color:#CDCDCD;
}
.gris2 { 
	color:#929292;
}
.gris3 { 
	color:#626161;
}
.negro { 
	color:#1D1D1D;
}
.verde { 
	color:#0EA767;
}
.amarillo { 
	color:#DBD3B4;
}
.amarillo2 { 
	color:#E9D4AB;
}
.amarillo3 { 
	color:#BFB89D;
}	
.oro { 
	color:#746742;
}
.violeta { 
	color:#9F91B0;
}
.naranja { 
	color:#D03700;
}
.naranja2 { 
	color:#E0AA75;
}
.azul { 
	color:#2D6DB0;
}
.azulfb { 
	color:#3C579D;
}
.azultw { 
	color:#2E9FF9;
}
.morado { 
	color:#9A88C7;
}
.cafe { 
	color:#662D2D;
}
.padding10 { 
	padding-top:10px;
}
.padding20 { 
	padding-top:20px;
}
.boton_personalizado{
    text-decoration: none;
    padding: 5px;
	padding-left: 5px;
	padding-right: 5px;
    font-weight: 600;
    font-size: 20px;
    color: #ffffff;
    background-color: #53920A;
    border-radius: 6px;
    border: 2px solid #004F33;
  }
.boton_personalizado2{
    text-decoration: none;
    padding: 5px;
	padding-left: 5px;
	padding-right: 5px;
    font-weight: 600;
    font-size: 20px;
    color: #ffffff;
	width: 30px;
	height: 20px;
    background-color: #F50206;
    border-radius: 6px;
    border: 2px solid #ECECEC;
  }
#general { 
	margin: auto;
	width: 904px; 
	height: 600px;
	overflow: hidden;
	border-radius: 11px 11px 11px 11px;
	-moz-border-radius: 11px 11px 11px 11px;
	-webkit-border-radius: 11px 11px 11px 11px;	
	z-index: 1;
}
#general1 { 
	margin: auto;
	width: 904px; 
	height: 600px;
	border-radius: 11px 11px 11px 11px;
	-moz-border-radius: 11px 11px 11px 11px;
	-webkit-border-radius: 11px 11px 11px 11px;
	background: url(../img/fondo1.jpg);
	z-index: 1;
}
#generalpensiones { 
	margin: auto;
	width: 904px; 
	height: 600px;
	border-radius: 11px 11px 11px 11px;
	-moz-border-radius: 11px 11px 11px 11px;
	-webkit-border-radius: 11px 11px 11px 11px;
	background: url(../img/fondo2.jpg);
	z-index: 1;
}
#console { 

	float:left;
	width: 310px;
	height: 600px;
	padding-top: 10px;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
	border-radius: 0px 11px 11px 11px;
	-moz-border-radius: 0px 11px 11px 11px;
	-webkit-border-radius: 0px 11px 11px 11px;
	background-color: white;
	overflow-x:hidden;
	overflow:scroll;
	z-index: 1;
}
#console2 { 
	
	float:right;
	width: 590px;
	height: 600px;
	border-radius: 0px 0px 0px 0px;
	-moz-border-radius: 0px 0px 0px 0px;
	-webkit-border-radius: 0px 0px 0px 0px;
	background: url(../img/fondo1.jpg);
	z-index: 1;
}
#console3 { 
	
	width: 590px;
	height: 300px;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
	border-radius: 0px 0px 0px 0px;
	-moz-border-radius: 0px 0px 0px 0px;
	-webkit-border-radius: 0px 0px 0px 0px;
	background: url(../img/fondo1.jpg);
	z-index: 1;
}
#console3pension { 
	
	width: 590px;
	height: 300px;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
	border-radius: 0px 0px 0px 0px;
	-moz-border-radius: 0px 0px 0px 0px;
	-webkit-border-radius: 0px 0px 0px 0px;
	background: url(../img/wallpaper/fondopension1.jpg);
	z-index: 1;
}
#console4 { 
	
	float: inherit;
	width: 590px;
	height: 300px;	
	padding-left: 10px;
	padding-right: 10px;
	border-radius: 0px 0px 0px 0px;
	-moz-border-radius: 0px 0px 0px 0px;
	-webkit-border-radius: 0px 0px 0px 0px;
	background: url(../img/fondo1.jpg);
	z-index: 1;
}
#console4pension { 
	
	float: inherit;
	width: 590px;
	height: 300px;	
	padding-left: 10px;
	padding-right: 10px;
	border-radius: 0px 0px 0px 0px;
	-moz-border-radius: 0px 0px 0px 0px;
	-webkit-border-radius: 0px 0px 0px 0px;
	background: url(../img/wallpaper/fondopension2.jpg);
	z-index: 1;
}
#contador {
	position:absolute;
	margin-top: 5px;
	width: 90px;
	height: 40px;
	border-radius: 10px 10px 10px 10px;
	background-color: #000000;
	z-index: 4;
}
#contador1 {
	position: fixed;
	margin-bottom: 5px;
	width: 90px;
	height: 55px;
	border-radius: 10px 10px 10px 10px;
	box-shadow: 5px 5px grey;
	background-color: #000000;
	z-index: 3;
}
#sombra {
	border-radius: 12px 12px 12px 12px;
    box-shadow: 5px 5px grey;
	
}

/* ======================================== \
 ========== OBVIOUS BUTTONS CSS ===========
\========================================= */
/**
 * Obvious Buttons 0.1
 * https://github.com/skidding/obvious-buttons
 *
 * (c) 2014+ Ovidiu Cherecheș
 * http://skidding.mit-license.org
 */
// Variables

@default-background-color: #fafafa;
@default-text-color: #222;

@primary-background-color: #0088cc;
@primary-text-color: #fafafa;

@info-background-color: #49afcd;
@info-text-color: #fafafa;

@success-background-color: #5bb75b;
@success-text-color: #fafafa;

@warning-background-color: #faa732;
@warning-text-color: #fafafa;

@danger-background-color: #da4f49;
@danger-text-color: #fafafa;

@inverse-background-color: #363636;
@inverse-text-color: #fafafa;


// Cross-browser helpers

.boxShadow (@statement) {
  -webkit-box-shadow: @statement;
  -moz-box-shadow: @statement;
  box-shadow: @statement;
}
.transition (@property, @duration, @transition: linear) {
  -webkit-transition-property: @property;
  -webkit-transition-duration: @duration;
  -webkit-transition-timing-function: @transition;
  -moz-transition-property: @property;
  -moz-transition-duration: @duration;
  -moz-transition-timing-function: @transition;
  -ms-transition-property: @property;
  -ms-transition-duration: @duration;
  -ms-transition-timing-function: @transition;
  -o-transition-property: @property;
  -o-transition-duration: @duration;
  -o-transition-timing-function: @transition;
  transition-property: @property;
  transition-duration: @duration;
  transition-timing-function: @transition;
}


.buttonColor (@background, @text) {
  background: @background;
  color: @text;

  &:hover,
  &:focus {
    background: darken(@background, 8%);
    color: @text;
  }
}
.buttonSize (@height, @depth, @font-size) {
  height: @height;
  // Fine-tuned to look match font size
  padding: 0 @font-size - 4;
  border-radius: @depth + 2;
  // Make button look 3D by giving a thicker border at the bottom
  .boxShadow(inset 0 -@depth 0 0 rgba(0, 0, 0, 0.15));
  font-size: @font-size;
  line-height: @height - @depth;

  i {
    line-height: @height - @depth;
  }
  &:active, &:active i {
    line-height: @height;
  }
  &.button-primary, &.button-info, &.button-success, &.button-warning, &.button-danger, &.button-inverse {
    .boxShadow(inset 0 -@depth 0 0 rgba(0, 0, 0, 0.2));
  }
}

.button {
  // Add .button-inline class for inline-block display
  display: block;
  text-align: center;
  cursor: pointer;
  border: none;
  .buttonSize(40px, 3px, 18px);
  .transition(background-color, 0.2s);
  .buttonColor(@default-background-color, @default-text-color);

  &.button-primary {
    .buttonColor(@primary-background-color, @primary-text-color);
  }
  &.button-info {
    .buttonColor(@info-background-color, @info-text-color);
  }
  &.button-success {
    .buttonColor(@success-background-color, @success-text-color);
  }
  &.button-warning {
    .buttonColor(@warning-background-color, @warning-text-color);
  }
  &.button-danger {
    .buttonColor(@danger-background-color, @danger-text-color);
  }
  &.button-inverse {
    .buttonColor(@inverse-background-color, @inverse-text-color);
  }

  span {
    // We need this extra span because there's a WebKit bug that sometimes
    // misses click events when the text inside a the element moves between
    // mousedown and mouseup: http://stackoverflow.com/q/15679787/128816
    pointer-events: none;
  }

  &:hover {
    text-decoration: none;
  }
  &:focus {
    text-decoration: none;
    outline: none;
  }
  &:active {
    // Remove excess of bottom border when clicking on the button in order to
    // make it seem like it's physically pressed
    .boxShadow(~"none !important");
  }
}
.button-small {
  .buttonSize(30px, 2px, 14px);
}
.button-large {
  .buttonSize(50px, 4px, 22px);
}
.button-xlarge {
  .buttonSize(60px, 5px, 26px);
}


.bute {
display: inline-block;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
float: none;
z-index: auto;
cursor: pointer;
opacity: 1;
left: 0;
margin: auto;
padding: 10px 17px -14px 35px;
overflow: auto;
border: 1px solid #b7b7b7;
-webkit-border-radius: 46px;
border-radius: 46px;
font: normal normal bold 16px/normal "Lucida Sans Unicode", "Lucida Grande", sans-serif;
color: rgba(61,58,58,1);
text-align: center;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
white-space: pre-line;
word-spacing: 1px;
background: rgba(252,252,252,1);
-webkit-box-shadow: -7px 2px 5px 0 rgba(0,0,0,0.2) inset;
box-shadow: -7px 2px 5px 0 rgba(0,0,0,0.2) inset;
text-shadow: 1px 1px 0 rgba(255,255,255,0.66) ;
-webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
-moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
-o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
-webkit-transform: none;
transform: none;
-webkit-transform-origin: 50% 50% 0;
transform-origin: 50% 50% 0;
}
.bute2{
display: inline-block;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
float: none;
z-index: auto;
cursor: pointer;
opacity: 1;
left: 0;
margin: auto;
padding: 10px 17px -14px 35px;
overflow: auto;
border: 1px solid #b7b7b7;
-webkit-border-radius: 8px;
border-radius: 8px;
font: normal normal bold 16px/normal "Lucida Sans Unicode", "Lucida Grande", sans-serif;
color: rgba(61,58,58,1);
text-align: center;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
white-space: pre-line;
word-spacing: 1px;
background: rgba(252,252,252,1);
-webkit-box-shadow: -7px 2px 5px 0 rgba(0,0,0,0.2) inset;
box-shadow: -7px 2px 5px 0 rgba(0,0,0,0.2) inset;
text-shadow: 1px 1px 0 rgba(255,255,255,0.66) ;
-webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
-moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
-o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
-webkit-transform: none;
transform: none;
-webkit-transform-origin: 50% 50% 0;
transform-origin: 50% 50% 0;	
}
.shadow {
  color: black; 
   font: bold 30px CenturyGothic,AppleGothic,sans-serif;
   text-shadow: 1px 1px white, 
                2px 2px white, 
                3px 3px white;
}