ol, li{
    list-style: none;
}

.line_bottom{
    border-bottom: 1px solid #CCC;
    margin-bottom: 5px;
    padding-bottom: 10px;
}

.shadow{
    box-shadow: 0 1px 5px rgba(0,0,0,.3);
}


/* F O R M U L A R I O S */

.panel{
    background: #FFF;
    border-radius: 10px;
    box-shadow: 0 3px 10px rgba(0,0,0,.3);
    display: none;
    height: auto;
    left: calc(50% - 200px);
    padding: 11px;
    position: fixed;
    top: 9%;
    width: 400px;
    z-index: 2;
}

form{
    display: block;
    width: 100%;
}

form ul{
    box-sizing: border-box;
    margin: 0;
    padding: 0 5px;
}

form li{
    display: block;
    height: auto;
    list-style: none;
    margin-bottom: 9px;
}

label{
    color: #777;
    display: inline-block;
    font-size: .84em;
    padding-left: 3px;
    text-align: left;
    width: calc(40% - 3px);
}
label.checkbox,
label.radio{
    clear: both;
    cursor: pointer;
    display: inline-block;
    font-size: .9em;
    min-width: 100px;
    width: auto;
}

.required,
label.required{
    position: relative;
}

.required:after,
label.required:after{
    background: #F94;
    border-radius: 50%;
    content: '';
    height: 4px;
    left: -5px;
    position: absolute;
    top: 5px;
    width: 4px;
    /*transform:rotate(45deg);*/
    /*-ms-transform:rotate(45deg);*/ /* IE 9 */
    /*-webkit-transform:rotate(45deg);*/ /* Opera, Chrome, and Safari */*/
}

input,
select,
textarea{
    border: 1px solid #CCC;
    box-sizing:border-box;
    font-size: .9em;
    line-height: 24px;
    margin: 0;
    min-width: 40px;
    outline: none;
    width: 60%;
    padding: 1px 3px;
}

textarea{
    line-height: 20px;
}

input:focus,
textarea:focus{
    border-color: #09F;
}

input[type="checkbox"],
input[type="radio"]{
    clear: both;
    display: inline-block;
    height: 16px;
    margin-right: 5px;
    min-width: 16px;
    width: 16px;
}

input[readonly], input[readonly="readonly"]{
    border-color: #EEE;
    background: #EEE;
}

select{
    appearance:none;
    -moz-appearance: none;
    -webkit-appearance: none;
    background: url(img/arrow.png) no-repeat right center #FFF;
    background-size: 20px;
    border-radius: none;
}

fieldset{
    background: #F9F9F9;
    border: 1px solid #DDD;
    border-radius: 5px;
    box-sizing: border-box;
    margin: 5px 0 9px;
    padding: 15px 10px;
    width: 100%;
}
legend{
    padding: 0 5px;
    width: auto;
}


button,
.button{
    background: #444;
    border-radius: 0;
    box-shadow: -1px 2px 0 rgba(0,0,0,.1);
    border:0;
    color: #FFF;
    display: block;
    font-size: 12pt;
    font-weight: lighter;
    letter-spacing: 1px;
    margin: 0;
    padding: 9px 15px;
    text-align: center;
    transition: all .3s ease-in;
    width: 120px;
}
button:hover,
.button:hover{
    background: #ff8372;
}

.bt_normal{
    background: #999;
}
.bt_normal:hover{
    background: #BBB;
}

.options{
    box-sizing:border-box;
    padding: 10px 0;
    width: 100%;
}

/* Carga de Archivos */
.upload_file{
    clear: both;
    display: block;
    height:auto;
    margin: 0 auto;
    width: 325px;
}

.image, .image_loading{
    border: 1px solid #FFF;
    background:rgba(0,0,0,.1);
    height:280px;
    padding:5px; display:block; margin:10px auto;
    width:280px;
}
.image_loading{background:url(../img/ajaxloader.gif) center center no-repeat #444;}

img#img_preview{ clear: both; display:block; float: none; max-height:inherit; margin:auto auto;}
input#img_name{width:130px; float:left;}

p.info{
    background: #FFD;
    border: 1px solid #FEC;
    border-radius: 5px;
    display: inline-block;
    color: #F90;
    min-width:190px; font-size:.7em; padding:7px;
}
p.examinar{width:100%; background:none; margin:4px 0;}




/* GENERAL FRAMEWORK */

.w100, .row{
    box-sizing: border-box;
    display: block;
    text-align: left;
    width: 100%;
}
.w70{
    width: 70%;
}
.w60{
    width: 60%;
}
.w50{
    width: 50%;
}
.w40{
    width: 40%;
}
.w30{
    width: 30%;
}

.col_1,
.col_2,
.col_3,
.col_4,
.col_5,
.col_6,
.col_7,
.col_8,
.col_9,
.col_10,
.col_11,
.col_12{
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
}

.col_1{
    width: 8.3333%;
}
.col_2{
    width: 16.6666%;
}
.col_3{
    width: 25%;
}
.col_4{
    width: 33.3333%;
}
.col_5{
    width: 41.6666%;
}
.col_6{
    width: 50%
}
.col_7{
    width: 58.3333%;
}
.col_8{
    width: 66.6666%;
}
.col_9{
    width: 75%;
}
.col_10{
    width: 83.3333%;
}
.col_11{
    width: 91.6666%;
}
.col_12{
    width: 100%;
}


/* E F F E C T O S */

.modal{
    background: rgba(255,255,255,.75);
    box-shadow: 0 0 50px rgba(255,255,255,.75), 0 0 50px #FFF inset;
    display: block;
    height: calc(100% - 140px);
    position: fixed;
    top: 140px;
    transition:all .3s ease-in;
    width: 100%;
}

.blur{
    -webkit-filter: blur(32px);
}

.border{
    box-shadow: 0 0 0 1px #CCC inset;
    border-radius: 5px;
    display: inline-block;
    padding: 5px;
}

.box{
    box-sizing: border-box;
    margin: 5px 0;
    /*padding: 9px;*/
}




.block{
    clear: both;
    display: block;
    float: none;
}
.center{
    display: block;
    margin: 0 auto;
}
.left{
    float: left;
}
.right{
    float: right;
}

.txt-left{
    text-align: left;
}
.txt-right{
    text-align: right;
}
.txt-center{
    text-align: center;
}
.txt-light{
    font-weight: lighter;
}

blockquote{
    color: #999;
    font-size: 1.2em;
    line-height: 1.6em;
    margin: 50px 20px;
}

.bg_white{
    background: #FFF;
}
.bg_glass{
    background: rgba(255,255,255,.75);
}

/* S O L O   P A R A   D E B U G   D E L   S I S T E M A */

.debug_box{
    background:#FFF;
    box-shadow: 0 0 0 5px rgba(255,255,255,.25);
    border-radius: 5px;
    clear: both;
    display: block;
    height:auto;
    margin:5% auto;
    padding: 10px 10px;
    min-width: 680px;
    width:64%;
}
.debug_box h3{
    background: url(img/space_invader.png) left center no-repeat;
    background-size: 48px;
    display: inline-block;
    padding:10px 0 5px 60px;
    font-weight: lighter;
    margin: 0;
    vertical-align: top;
    width:calc(100% - 60px);
}
.debug_box p{
    color: #777;
    display: inline-block;
    font-size:1em;
    float:none;
    height:auto;
    margin: 0;
    min-height:30px;
    padding:9px;
}
.debug_box b{
    color: #000;
}
.debug_box p small{
    padding:5px 10px; display:block;
}
.debug_box ul{
    width:calc(100% - 10px);
    margin-top: 10px;
    padding:5px; font-size: 80%; color: #999;
}
.debug_box ul li:last-child{
    border: none;
    float: right;
}

.debug_box hr{
    border-top: 0;
    border-bottom: 1px solid #CCC;
}
.debug_box li{
    display: inline-block;
    padding-right:10px; margin-right:10px; border-right:1px solid #CCC;
}
.debug_box a{
    display: block;
    color: #314159;
}

.debug_box a:hover{text-decoration:underline;}
.debug_box code{
    background: #F9F9F9;
    display: inline-block;
    color: #59C;
    margin: 10px 0;
    padding: 20px;
}

.alert_xss{
    width: 95%; height: 200px; padding:40px 0 0 5%; display: block;
    background:url(imgs/msg_boxes/img003.png) 105% -20px no-repeat #FFF; box-shadow:0 0 5px rgba(0,0,0,.4);
}



/*   N O T I F I C A C I O N E S   */

#notification{
    box-shadow: 0 1px 100px rgba(0,0,0,.75), 0 1px 3px rgba(0,0,0,.1) inset;
    box-sizing:border-box;
    color: #FFF;
    cursor: pointer;
    display: block;
    font-size: .9em;
    /*font-weight: bold;*/
    height: auto;
    left: 0;
    padding: 9px 20px 7px;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 100;
}
/*#notification:after{
    border: 7px solid transparent;
    border-top: 7px solid #FFF;
    content: '';
    display: block;
    left: 124px;
    position: absolute;
    top: -1px;
    width: 1px;
}*/
#notification p{
    padding-left: 10px;
    letter-spacing: 1px;
}

.msg_ok{ background: rgb(120,200,120); }
.msg_error{ background: rgb(255,115,115); }
.msg_info{ background: rgb(250,200, 100); }
.msg_question{ background: rgb(100, 200,255); }


table{
    border-collapse:collapse;
    border-spacing:0;
    width:100%;
}
table td:last-child{ border-right:0px;}
table{
    background:none;
}

/*  T A B L A S  */

table thead th, table thead td{
    border: none;
    font-size: .8em;
    padding:3px 2px;
}
table thead tr:nth-child(2) th{
    padding: 0 2px;
}

table td{
    padding:5px 0 5px 3px;
    text-align: left;
}

table.tb_list tbody{
    font-size: .84em;
}

table.tb_list tbody tr:nth-child(odd){
    /*background: #F9F9F9;*/
}

table.tb_list tbody tr:hover{
    background: #b2f7ff; /* Old browsers */
}

table.tb_list tbody tr:last-child td{
    border-right:none;
    border-bottom:none;
}

table.tb_list tbody td:first-child{
    padding-left: 10px;
}
table.tb_list tbody td:last-child{
    padding-right: 10px;
}

table.tb_list tbody tr{
    background: rgba(0,0,0,.025);
    *background: #F9F9F9;
}

table.tb_list tbody td{
    line-height:1.1em;
    border-bottom: 5px solid #FFF;
}

table.tb_list li{
    display:block;
    margin:2px 0 0;
    text-align: left;
    width:100%;
}
table.tb_list li small{
    color: #777; display: inline-block; min-width:30px;
    text-align: left;
}

table.tb_list li.list{
    font-size: .9em;
    padding-bottom: 3px;
    position: relative;
    text-indent: 7px;
}
table.tb_list td li.list:last-child{
    border: none;
}
table.tb_list li.list:after{
    background: #09F;
    border-radius: 50%;
    content: '';
    display: block;
    height: 4px;
    position: absolute;
    top: 5px;
    width: 4px;
}
/*
table.tb_list thead th{
    text-align: center;
}
*/
.tb_buttons a{
    float: right;
    text-align: right;
}

/* Botones iconos */
.bt_billing, .bt_print, .bt_edit, .bt_del,.bt_up, .bt_down{
    background:no-repeat center;
    cursor:pointer;
    display:inline-block;
    height:16px;
    margin:2px;
    width:18px;
}

.bt_billing{background-image:url(img/bt_billing.png);}
.bt_print{background-image:url(img/bt_print.png);}
.bt_edit{background-image:url(img/bt_edit.png);}
.bt_del{background-image:url(img/bt_delete.png);}
.bt_up{background-image:url(img/bt_up.png);}
.bt_down{background-image:url(img/bt_down.png);}