/* Mains
----------------------------------------*/
body
{
    font-size: .85em;
    font-family: "SegoeWPLight" , "Trebuchet MS" , Verdana;
    color: Black;
    background-color: White;
    margin: 0px;
    padding: 0px;
    border-top: 3px solid #9a263f;
    min-width: 800px;
}
p
{
    max-width: 400px;
}
h1, h2, h3
{
    font-weight: lighter;
    color: Black;
}
td
{
    vertical-align: top;
}
a
{
    text-decoration: none;
    color: #ec6332;
}
a:hover
{
    text-decoration: underline;
}
a.search-link
{
    color: Black;
    font-size: 12pt;
}
a.non-underlined:hover
{
    text-decoration: none !important;
}
textarea
{
    width: 300px;
}
.editor-field > input[type=text], .editor-field > input[type=password], select
{
    -webkit-transition: background 0.3s linear;
    padding: 5px;
    width: 300px;
    border-width: 1px;
}
/*input[type=text]:focus, input[type=password]:focus, select:focus { background-color: Orange; }*/
input[type=text].datebox
{
    background-image: url(images/metro-icons/icons-50/calendar.png);
    background-position: right center;
    background-repeat: no-repeat;
    padding-right: 55px !important;
    width: 250px !important;
}
input[type=text].emailbox
{
    background-image: url(images/metro-icons/icons-50/address-book.png);
    background-position: right center;
    background-repeat: no-repeat;
    padding-right: 55px !important;
    width: 250px !important;
}
input[type=text].urlbox
{
    background-image: url(images/metro-icons/icons-50/world.png);
    background-position: right center;
    background-repeat: no-repeat;
    padding-right: 55px !important;
    width: 250px !important;
}
input[type=text].phonebox
{
    background-image: url(images/metro-icons/icons-50/phone.png);
    background-position: right center;
    background-repeat: no-repeat;
    padding-right: 55px !important;
    width: 250px !important;
}
input[type=text].twitterbox
{
    background-image: url(images/metro-icons/icons-50/twitter.png);
    background-position: right center;
    background-repeat: no-repeat;
    padding-right: 55px !important;
    width: 250px !important;
}
input[type=text].facebookbox
{
    background-image: url(images/metro-icons/icons-50/facebook.png);
    background-position: right center;
    background-repeat: no-repeat;
    padding-right: 55px !important;
    width: 250px !important;
}
input[type=submit], input[type=button]
{
    border-width: 0px;
    color: Black;
    font-size: 14pt;
    font-weight: normal !important;
    background-color: inherit;
    cursor: pointer;
    padding-right: 10px;
}
div.search-wrapper
{
    position: absolute;
    top: 0px;
    right: 20px;
}

/* ids
----------------------------------------*/
#title
{
    padding: 5px 10px 5px 42px;
    font-size: 14pt;
    position: absolute;
    top: 0px;
    left: 0px;
    color: White;
    background-image: url(images/metro-icons/icons-26/home.png);
    background-position: 10px center;
    background-repeat: no-repeat;
    background-color: #9a263f;
}
#user-info-wrapper
{
    position: absolute;
    top: 1px;
    right: 200px;
}
#user-info-wrapper .pic
{
    background-image: url(images/icons-26/user.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-color: #9a263f;
    margin-left: 5px;
    width: 40px;
    height: 40px;
}

/* Layouts
----------------------------------------*/
.row, .col
{
    overflow: hidden;
    position: absolute;
}
.row
{
    left: 0;
    right: 0;
}
.col
{
    top: 0;
    bottom: 0;
}
.scroll-x
{
    overflow-x: auto;
}
.scroll-y
{
    overflow-y: auto;
}
.header
{
    height: 40px;
    top: 0px;
}
.nav
{
    height: 50px;
    top: 40px;
    color: #7e7e7e;
}
.botonera-container
{
    height: 33px;
}
.body
{
    top: 90px;
    bottom: 30px;
}
.footer
{
    bottom: 0px;
    height: 29px;
    border-top: 1px solid #7e7e7e;
    padding-left: 30px;
    font-size: 8pt;
}
.title
{
    border-bottom: 1px solid #7e7e7e !important;
}
.metro-file-uploader
{
    width: auto;
    height: auto;
    border-bottom: 10px solid #A2000B;
    background-color: #CA060A;
    color: Black;
    font-size: 20pt;
    text-align: center;
    margin-bottom: 15px;
    overflow: hidden;
}
.metro-file-uploader.hover
{
    background-color: #A2000B;
    color: White;
}
.picture
{
    width: 50px !important;
    height: 50px !important;
    margin-right: 15px;
}
.boton
{
    padding: 5px 15px 5px 0px;
    font-size: 16pt;
}
.boton-selected
{
    color: Black;
}
.boton:hover
{
    color: Black;
    border-bottom: 1px solid Black !important;
    cursor: pointer;
    text-decoration: none !important;
}
.block
{
    display: block;
}
.shadow
{
    box-shadow: 0px 5px 5px -3px #999;
    -webkit-box-shadow: 0px 5px 5px -3px #999;
    -moz-box-shadow: 0px 5px 5px -3px #999;
}

/* Percents
----------------------------------------*/
.fifty-percent-left
{
    left: 0px;
    width: 50%;
    border-right: 1px solid #CA060A;
}
.fifty-percent-right
{
    right: 0px;
    width: 50%;
}
.fifty-percent-top
{
    top: 0px;
    height: 50%;
}
.fifty-percent-bottom
{
    bottom: 0px;
    height: 50%;
}
.seventy-percent-top
{
    top: 0px;
    height: 70%;
}
.thirty-percent-bottom
{
    bottom: 0px;
    height: 30%;
}
.seventy-percent-bottom
{
    bottom: 0px;
    height: 70%;
}
.thirty-percent-top
{
    top: 0px;
    height: 30%;
}
.content
{
    margin: 20px 20px 20px 20px;
}

/* List
----------------------------------------*/
.list
{
    top: 50px;
    bottom: 70px;
}
.list .item
{
    position: relative;
    padding: 5px;
    clear: both;
    border-bottom: 1px solid #d7d7d7;
}
.list .item a:hover
{
    text-decoration: underline;
}
.list .item .loader
{
    position: absolute;
    bottom: 3px;
    right: 3px;
}
.list-actions-wrapper
{
    height: 20px;
    clear: both;
    overflow: hidden;
}
.list-actions
{
    height: 20px;
    margin-right: 20px;
    padding-left: 20px;
    line-height: 20px;
    cursor: pointer;
}
.list-actions:hover
{
    text-decoration: underline;
}
.list .item:hover
{
    background-color: #97e6c0;
    color: Black;
}
.actions
{
    margin-right: 30px;
    text-align: right;
    height: 50px;
    bottom: 0px;
}

/* Helpers
----------------------------------------*/
.relativate
{
    position: relative;
}
.loader
{
    display: none;
}
.show-overflow
{
    overflow: visible !important;
}
.pop-up
{
    display: none;
}
.toBold
{
    font-weight: bold;
}
.float-left
{
    float: left;
}
.float-right
{
    float: right;
}
.clear
{
    clear: both;
}
.toLower
{
    text-transform: lowercase !important;
}
.toUpper
{
    text-transform: uppercase !important;
}

/* Styles for basic forms
----------------------------------------*/
fieldset
{
    border: 1px solid #ddd;
    padding: 0 1.4em 1.4em 1.4em;
    margin: 0 0 1.5em 0;
}
legend
{
    font-size: 1.2em;
    font-weight: bold;
}
textarea
{
    min-height: 75px;
}
.editor-label
{
    margin: 1em 0 0 0;
}
.editor-field
{
    margin: 0 0 0 0;
}
.five-cols > div
{
    float: left;
    width: 20%;
}
.one-cols > div
{
    width: 100%;
}

/* icons 16 
----------------------------------------*/
.add-icon-16
{
    background-image: url(images/metro-icons/icons-16/add.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 16px;
    min-height: 16px;
    padding-left: 21px;
}
.trash-icon-16
{
    background-image: url(images/metro-icons/icons-16/trash.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 16px;
    min-height: 16px;
    padding-left: 21px;
}
.refresh-icon-16
{
    background-image: url(images/metro-icons/icons-16/refresh.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 16px;
    min-height: 16px;
    padding-left: 21px;
}
.user-icon-16
{
    background-image: url(images/metro-icons/icons-16/user.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 16px;
    min-height: 16px;
    padding-left: 21px;
}
.group-icon-16
{
    background-image: url(images/metro-icons/icons-16/group.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 16px;
    min-height: 16px;
    padding-left: 21px;
}
.search-icon-16
{
    background-image: url(images/metro-icons/icons-16/search.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 16px;
    min-height: 16px;
    padding-left: 21px;
}
.logout-icon-16
{
    background-image: url(images/metro-icons/icons-16/logout.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 16px;
    min-height: 16px;
    padding-left: 21px;
}
.login-icon-16
{
    background-image: url(images/metro-icons/icons-16/login.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 16px;
    min-height: 16px;
    padding-left: 21px;
}
.up-icon-16
{
    background-image: url(images/metro-icons/icons-16/up.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 16px;
    min-height: 16px;
    padding-left: 21px;
}
.excel-icon-16
{
    background-image: url(images/metro-icons/icons-16/excel.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 16px;
    min-height: 16px;
    padding-left: 21px;
}
.cross-icon-16
{
    background-image: url(images/metro-icons/icons-16/cross.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 16px;
    min-height: 16px;
    padding-left: 21px;
}
.check-icon-16
{
    background-image: url(images/metro-icons/icons-16/check.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 16px;
    min-height: 16px;
    padding-left: 21px;
}
.comment-icon-16
{
    background-image: url(images/metro-icons/icons-16/comment.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 16px;
    min-height: 16px;
    padding-left: 21px;
}

/* icons 20
----------------------------------------*/
.add-icon-20
{
    background-image: url(images/icons-20/plus.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 20px;
    min-height: 20px;
}
.trash-icon-20
{
    background-image: url(images/icons-20/empty_trash.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 20px;
    min-height: 20px;
}
.refresh-icon-20
{
    background-image: url(images/icons-20/sinchronize.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 20px;
    min-height: 20px;
}
.home-icon-20
{
    background-image: url(images/metro-icons/icons-20/home.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 20px;
    min-height: 20px;
    padding-left: 25px;
}
.comment-icon-20
{
    background-image: url(images/metro-icons/icons-20/comment.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 20px;
    min-height: 20px;
    padding-left: 25px;
}
.group-icon-20
{
    background-image: url(images/metro-icons/icons-20/group.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 20px;
    min-height: 20px;
    padding-left: 25px;
}
.cotizacion-icon-20
{
    background-image: url(images/metro-icons/icons-20/cotizacion.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 20px;
    min-height: 20px;
    padding-left: 25px;
}
.check-icon-20
{
    background-image: url(images/metro-icons/icons-20/check.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 20px;
    min-height: 20px;
    padding-left: 25px;
}
.take-off-icon-20
{
    background-image: url(images/metro-icons/icons-20/take-off.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 20px;
    min-height: 20px;
    padding-left: 25px;
}
.up-icon-20
{
    background-image: url(images/metro-icons/icons-20/up.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 20px;
    min-height: 20px;
    padding-left: 25px;
}
.charts-icon-20
{
    background-image: url(images/metro-icons/icons-20/charts.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 20px;
    min-height: 20px;
    padding-left: 25px;
}
.help-icon-20
{
    background-image: url(images/metro-icons/icons-20/help.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 20px;
    min-height: 20px;
    padding-left: 25px;
}
.comment-icon-20
{
    background-image: url(images/metro-icons/icons-20/comment.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 20px;
    min-height: 20px;
    padding-left: 25px;
}
.excel-icon-20
{
    background-image: url(images/metro-icons/icons-20/excel.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 20px;
    min-height: 20px;
    padding-left: 25px;
}

/* icons 26 
----------------------------------------*/
.home-icon-26
{
    background-image: url(images/metro-icons/icons-26/home.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 26px;
    min-height: 26px;
    padding-left: 31px;
}
.login-icon-26
{
    background-image: url(images/metro-icons/icons-26/login.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 26px;
    min-height: 26px;
    padding-left: 31px;
}
.save-icon-26
{
    background-image: url(images/metro-icons/icons-26/save.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 26px;
    min-height: 26px;
    padding-left: 31px;
}
.user-icon-26
{
    background-image: url(images/metro-icons/icons-26/user.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 26px;
    min-height: 26px;
    padding-left: 31px;
}
.group-icon-26
{
    background-image: url(images/metro-icons/icons-26/group.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 26px;
    min-height: 26px;
    padding-left: 31px;
}
.take-off-icon-26
{
    background-image: url(images/metro-icons/icons-26/take-off.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 26px;
    min-height: 26px;
    padding-left: 31px;
}
.check-icon-26
{
    background-image: url(images/metro-icons/icons-26/check.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 26px;
    min-height: 26px;
    padding-left: 31px;
}
.add-icon-26
{
    background-image: url(images/metro-icons/icons-26/add.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 26px;
    min-height: 26px;
    padding-left: 31px;
}
.comment-icon-26
{
    background-image: url(images/metro-icons/icons-26/comment.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 26px;
    min-height: 26px;
    padding-left: 31px;
}

.cross-icon-26
{
    background-image: url(images/metro-icons/icons-26/cross.png);
    background-repeat: no-repeat;
    background-position: left center;
    min-width: 26px;
    min-height: 26px;
    padding-left: 31px;
}


/* Styles for validation helpers
----------------------------------------*/
.editor-field
{
    margin-bottom: 10px;
}
.field-validation-error
{
    color: #CA060A;
    display: block;
    position: absolute;
    right: 20px;
    font-size: 9pt;
}
.field-validation-valid
{
    display: none;
}
.input-validation-error
{
    border: 1px solid #CA060A;
    background-color: #CA060A;
    color: White;
}
.validation-summary-errors
{
    font-weight: bold;
    background-color: #CA060A;
    color: White;
}
.validation-summary-valid
{
    display: none;
}

/* fonts
----------------------------------------*/
.font-8
{
    font-size: 8pt !important;
}
.font-9
{
    font-size: 9pt !important;
}
.font-12
{
    font-size: 12pt !important;
}
.font-14
{
    font-size: 14pt !important;
}
.font-16
{
    font-size: 16pt !important;
}
.font-18
{
    font-size: 18pt !important;
}

.font-10
{
    font-size: 10pt !important;
}
.font-20
{
    font-size: 20pt !important;
}
.font-30
{
    font-size: 30pt !important;
}
.font-40
{
    font-size: 40pt !important;
}
.font-50
{
    font-size: 50pt !important;
}

/* messages
----------------------------------------*/
div.success
{
    background-color: #97e6c0;
    color: Black;
    background-image: url(images/metro-icons/icons-50/check.png);
    background-repeat: no-repeat;
    background-position: -10px -10px;
    padding: 10px 10px 10px 70px;
}
div.error
{
    background-color: #CA060A;
    color: White;
    background-image: url(images/metro-icons/icons-50/cross.png);
    background-repeat: no-repeat;
    background-position: -10px -10px;
    padding: 10px 10px 10px 70px;
}
div.warning
{
    background-color: #FFD940;
    color: Black;
    background-image: url(images/metro-icons/icons-50/alert.png);
    background-repeat: no-repeat;
    background-position: -10px -10px;
    padding: 10px 10px 10px 70px;
}

/* colors
----------------------------------------*/
.green
{
    color: Green;
}
.red
{
    color: #ff2211;
}
.light-gray
{
    color: #888;
}

/* metro emergent element 
----------------------------------------*/
#metro-form
{
    border-left: 2px solid #CA060A;
    border-right: 2px solid #CA060A;
    border-bottom: 2px solid #CA060A;
    width: auto;
    max-height: 98%;
    position: absolute;
    top: 0px;
    left: 50px;
    display: none;
    color: Black;
    z-index: 19;
    background-color: White;
    padding-bottom: 40px;
}
#cerrar-metro-form
{
    position: absolute;
    bottom: 10px;
    right: 10px;
}
.form-message
{
    font-size: 16pt;
    margin: 10px auto;
}
#metro-form .loader
{
    text-align: center;
    font-size: 18pt;
}

/* drag and drop
----------------------------------------*/
.drop-hover
{
    background-color: #CA060A !important;
}
.drop-highlight
{
    color: White !important;
    background-color: #A2000B !important;
}
.draggable
{
    cursor: move;
}

/* trashes 
----------------------------------------*/
.list-trash
{
    display: block;
    position: absolute;
    height: 16px;
    bottom: 50px;
    border-bottom: 1px solid gray;
    padding: 5px;
    background-image: url(images/metro-icons/icons-20/trash.png);
    background-position: center center;
    background-repeat: no-repeat;
    width: 90%;
    margin: auto;
}

/* The bouncing box 
----------------------------------------*/
#box
{
    height: auto;
    padding: 20px 70px 20px 20px;
    margin-top: -10px;
    padding-top: 20px;
    width: 500px;
    display: block;
    color: black;
    background-image: url(images/memes/cereal-guy-small.jpg);
    background-repeat: no-repeat;
    background-position: right center;
    background-color: White;
    border-bottom: 3px solid #CA060A;
    border-left: 3px solid #CA060A;
    border-right: 3px solid #CA060A;
}
#box p
{
    font-size: 16px;
    background-image: url(images/icons-26/error.png);
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 90px;
}
#box p b
{
    font-size: 30px;
    display: block;
}

/* Paging 
----------------------------------------*/
.paging
{
    background-color: #a62300 !important;
    margin-top: 10px;
}
.paging > a
{
    color: #ff3500;
}

/* Colorpicker
----------------------------------------*/
/*.colorPicker{ width: 28px; height: 28px; background: url(images/colorpicker/select.png) center; position: absolute; }*/

/* HelpDesk
----------------------------------------*/
.selected-thread
{
    background-color: #eee;
}
.wysiwyg
{
    width: 300px !important;
}

.cancelled
{
    background-image: url(images/inactivo.png);
    background-position: center center;
    background-repeat: no-repeat;
}

/*---------------Backgrounds---------------*/
.back
{
    background-image: url(images/fondos/fondo.jpg);
}

.back1
{
    background-image: url(images/fondos/Carne.jpg);
    width: 150px;
    height: 150px;
    background-repeat: no-repeat;
}

.back2
{
    background-image: url(images/fondos/Chuletas.jpg);
}

.back3
{
    background-image: url(images/fondos/Coliflor.jpg);
}

.back4
{
    background-image: url(images/fondos/Electrodomesticos.jpg);
}

.back5
{
    background-image: url(images/fondos/Emparedado.jpg);
}

.back6
{
    background-image: url(images/fondos/Fresas.jpg);
}

.back7
{
    background-image: url(images/fondos/Frutas.jpg);
}

.back8
{
    background-image: url(images/fondos/Frutas_y_vegetales.jpg);
}

.back9
{
    background-image: url(images/fondos/Manzanas.jpg);
}

.back10
{
    background-image: url(images/fondos/Mariscos.jpg);
}

.back11
{
    background-image: url(images/fondos/Patilla.jpg);
}

.back12
{
    background-image: url(images/fondos/Pescados.jpg);
}

.back13
{
    background-image: url(images/fondos/pollo.jpg);
}

.hidden
{
    display: none;
}