/*@import "css_reset.css";*/
@import "bootstrap.min.css";
@import "app.css";
/*@import "media.css";*/

/* ======================================== */
/* 1. CLASES DE AYUDA
/* ======================================== */

/* RESET */
p{ margin: 0px; }
img{ max-width: 100%; height: auto;}


/* MARGENES */
.m0   { margin: 0px; }
.m10   { margin: 10px; }
.m20   { margin: 20px; }
.m30   { margin: 30px; }
.m40   { margin: 40px; }
.m50   { margin: 50px; }
.m60   { margin: 60px; }
.m70   { margin: 70px; }
.m80   { margin: 80px; }
.m90   { margin: 90px; }
.m100   { margin: 100px; }
.mt0   { margin-top: 0px; }
.mr0   { margin-right: 0px; }
.mb0   { margin-bottom: 0px; }
.ml0   { margin-left: 0px; }
.mt10  { margin-top: 10px; }
.mr10  { margin-right: 10px; }
.mb10  { margin-bottom: 10px; }
.ml10  { margin-left: 10px; }
.mt20  { margin-top: 20px; }
.mr20  { margin-right: 20px; }
.mb20  { margin-bottom: 20px; }
.ml20  { margin-left: 20px; }
.mt30  { margin-top: 30px; }
.mr30  { margin-right: 30px; }
.mb30  { margin-bottom: 30px; }
.ml30  { margin-left: 30px; }
.mt40  { margin-top: 40px; }
.mr40  { margin-right: 40px; }
.mb40  { margin-bottom: 40px; }
.ml40  { margin-left: 40px; }
.mt50  { margin-top: 50px; }
.mr50  { margin-right: 50px; }
.mb50  { margin-bottom: 50px; }
.ml50  { margin-left: 50px; }
.mt60  { margin-top: 60px; }
.mr60  { margin-right: 60px; }
.mb60  { margin-bottom: 60px; }
.ml60  { margin-left: 60px; }
.mt70  { margin-top: 70px; }
.mr70  { margin-right: 70px; }
.mb70  { margin-bottom: 70px; }
.ml70  { margin-left: 70px; }
.mt80  { margin-top: 80px; }
.mr80  { margin-right: 80px; }
.mb80  { margin-bottom: 80px; }
.ml80  { margin-left: 80px; }
.mt90  { margin-top: 90px; }
.mr90  { margin-right: 90px; }
.mb90  { margin-bottom: 90px; }
.ml90  { margin-left: 90px; }
.mt100 { margin-top: 100px; }
.mr100 { margin-right: 100px; }
.mb100 { margin-bottom: 100px; }
.ml100 { margin-left: 100px; }

/* PADDING */
.p0   { padding: 0px; }
.p5   { padding: 5px; }
.p10   { padding: 10px; }
.p20   { padding: 20px; }
.p30   { padding: 30px; }
.p40   { padding: 40px; }
.p50   { padding: 50px; }
.p60   { padding: 60px; }
.p70   { padding: 70px; }
.p80   { padding: 80px; }
.p90   { padding: 90px; }
.p100   { padding: 100px; }
.ptb10   { padding-top: 10px; padding-bottom: 10px; }
.ptb20   { padding-top: 20px; padding-bottom: 20px; }
.ptb30   { padding-top: 30px; padding-bottom: 30px; }
.ptb40   { padding-top: 40px; padding-bottom: 40px; }
.ptb50   { padding-top: 50px; padding-bottom: 50px; }
.ptb60   { padding-top: 60px; padding-bottom: 60px; }
.ptb70   { padding-top: 70px; padding-bottom: 70px; }
.ptb80   { padding-top: 80px; padding-bottom: 80px; }
.ptb90   { padding-top: 90px; padding-bottom: 90px; }
.ptb100   { padding-top: 100px; padding-bottom: 100px; }
.pt0   { padding-top: 0px; }
.pr0   { padding-right: 0px; }
.pb0   { padding-bottom: 0px; }
.pl0   { padding-left: 0px; }
.pt10  { padding-top: 10px; }
.pr10  { padding-right: 10px; }
.pb10  { padding-bottom: 10px; }
.pl10  { padding-left: 10px; }
.pt20  { padding-top: 20px; }
.pr20  { padding-right: 20px; }
.pb20  { padding-bottom: 20px; }
.pl20  { padding-left: 20px; }
.pt30  { padding-top: 30px; }
.pr30  { padding-right: 30px; }
.pb30  { padding-bottom: 30px; }
.pl30  { padding-left: 30px; }
.pt40  { padding-top: 40px; }
.pr40  { padding-right: 40px; }
.pb40  { padding-bottom: 40px; }
.pl40  { padding-left: 40px; }
.pt50  { padding-top: 50px; }
.pr50  { padding-right: 50px; }
.pb50  { padding-bottom: 50px; }
.pl50  { padding-left: 50px; }
.pt60  { padding-top: 60px; }
.pr60  { padding-right: 60px; }
.pb60  { padding-bottom: 60px; }
.pl60  { padding-left: 60px; }
.pt70  { padding-top: 70px; }
.pr70  { padding-right: 70px; }
.pb70  { padding-bottom: 70px; }
.pl70  { padding-left: 70px; }
.pt80  { padding-top: 80px; }
.pr80  { padding-right: 80px; }
.pb80  { padding-bottom: 80px; }
.pl80  { padding-left: 80px; }
.pt90  { padding-top: 90px; }
.pr90  { padding-right: 90px; }
.pb90  { padding-bottom: 90px; }
.pl90  { padding-left: 90px; }
.pt100 { padding-top: 100px; }
.pr100 { padding-right: 100px; }
.pb100 { padding-bottom: 100px; }
.pl100 { padding-left: 100px; }

/* BORDES DE RECONOCIMIENTO */
.br { border: 1px solid red; }
.bg { border: 1px solid green; }
.bb { border: 1px solid blue; }
.by { border: 1px solid yellow; }

/* COLORES */
.white { color:#FFF!important; }

/* FUENTES */
.fw100 {font-weight:100; }
.fw200 {font-weight:200; }
.fw300 {font-weight:300; }
.fw400 {font-weight:400; }
.fw500 {font-weight:500; }
.fw600 {font-weight:600; }
.fw700 {font-weight:700; }
.fw800 {font-weight:800; }
.fw900 {font-weight:900; }
.fs0 {font-size:0px; }
.fs1 {font-size:1px; }
.fs2 {font-size:2px; }
.fs3 {font-size:3px; }
.fs4 {font-size:4px; }
.fs5 {font-size:5px; }
.fs6 {font-size:6px; }
.fs7 {font-size:7px; }
.fs8 {font-size:8px; }
.fs9 {font-size:9px; }
.fs10 {font-size:10px; }
.fs11 {font-size:11px; }
.fs12 {font-size:12px; }
.fs13 {font-size:13px; }
.fs14 {font-size:14px; }
.fs15 {font-size:15px; }
.fs16 {font-size:16px; }
.fs17 {font-size:17px; }
.fs18 {font-size:18px; }
.fs19 {font-size:19px; }
.fs20 {font-size:20px; }
.fs21 {font-size:21px; }
.fs22 {font-size:22px; }
.fs23 {font-size:23px; }
.fs24 {font-size:24px; }
.fs25 {font-size:25px; }
.fs26 {font-size:26px; }
.fs27 {font-size:27px; }
.fs28 {font-size:28px; }
.fs29 {font-size:29px; }
.fs30 {font-size:30px; }
.fs31 {font-size:31px; }
.fs32 {font-size:32px; }
.fs33 {font-size:33px; }
.fs34 {font-size:34px; }
.fs35 {font-size:35px; }
.fs36 {font-size:36px; }
.fs37 {font-size:37px; }
.fs38 {font-size:38px; }
.fs39 {font-size:39px; }
.fs40 {font-size:40px; }
.fs41 {font-size:41px; }
.fs42 {font-size:42px; }
.fs43 {font-size:43px; }
.fs44 {font-size:44px; }
.fs45 {font-size:45px; }
.fs46 {font-size:46px; }
.fs47 {font-size:47px; }
.fs48 {font-size:48px; }
.fs49 {font-size:49px; }
.fs50 {font-size:50px; }

/* TEXTOS */
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-left { text-align: left; }
.text-justify { text-align: justify; }
.uppercase { text-transform: uppercase; }
.lowercase { text-transform: lowercase; }

/* ALINEACION */
.right { float: right; }
.left { float: left; }
.relative { position: relative; }
.inline { display: inline; }
.block { display: block; }

/* FUNCIONALES */
.pointer { cursor: pointer; }
.hidde { display: none; }
.grayscale { -webkit-filter: grayscale(1); filter: grayscale(1); }

/* BORDER RADIUS */
.br5 { border-radius: 5px; }
.br10 { border-radius: 10px; }
.br15 { border-radius: 15px; }
.br20 { border-radius: 20px; }
.br25 { border-radius: 25px; }
.br30 { border-radius: 30px; }
.br35 { border-radius: 35px; }
.br40 { border-radius: 40px; }
.br45 { border-radius: 45px; }
.br50 { border-radius: 50px; }

/* ======================================== */
/* 2. TABLAS
/* ======================================== */

.tabla td{
	border-bottom: 1px dotted #c2c2c2;
	height: 35px;
	padding: 0px 5px;
}

.tabla td.header{
	font-weight: bold;
	height: 30px;
}

.tabla tr:hover{
	background-color: #f1f1f1;
}

.tabla .zebra{
	background-color: ;
}

/* ======================================== */
/* 3. CONFIRMACIONES
/* ======================================== */

.informacion, .exito, .alerta, .error {
	border: 0px solid;
	padding: 10px 20px;
	overflow: auto;
	color: white;
}

.informacion {
   background-color: #BDE5F8;
}
.exito {
   background-color: #628f00;
}
.alerta {
   color: #544600;
}
.error {
   background-color: #a30000;
}

/* Redondear confirmacion */
.informacion, .exito, .alerta, .error {
	border-radius: 4px;
	margin-bottom: 10px;
	margin-top: 10px;
}