﻿/* Presupuestos Styles BEGIN */
.presupuestosForm .form-group {
    font-size: 14px;
}

.layout-nuevo-lista-presupuestos {
    padding: 15px;
    background: #fcfcfc;
    border: 1px solid #e9e9e9;
}

.mt-2 {
    margin-top: 10px !important;
}

.no-spacing {
    width: 20px !important;
}

.mr-2 {
    margin-right: 10px !important;
}

.pl-10 {
    padding-left: 12px;
}

.ml-30 {
    margin-left: 30px;
}

.mb-10 {
    margin-bottom: 20px !important;
}

.d-none {
    display: none;
}

.message-bordered {
    margin-bottom: 20px;
    padding: 20px;
    border: 1px solid #ccc;
    background: #fcfcfc;
}

.loader {
    border: 5px solid #f3f3f3; /* Light grey */
    border-top: 5px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 30px;
    height: 30px;
    animation: spin 2s linear infinite;
    margin: auto;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}
/* Presupuestos Styles END */

@charset "UTF-8";
/************************* APP STYLES ******************************/
/************************* COMMON ******************************/
/************************* COMMON / FONTS ******************************/
/* OpenSans Family */
@font-face {
    font-family: OpenSans-Regular;
    src: url('../fonts/OpenSans-Regular.ttf') format('truetype'), url('../fonts/OpenSans-Regular.woff') format('woff');
}

@font-face {
    font-family: OpenSans-Italic;
    src: url('../fonts/OpenSans-Italic.ttf') format('truetype'), url('../fonts/OpenSans-Italic.woff') format('woff');
}

@font-face {
    font-family: OpenSans-Light;
    src: url('../fonts/OpenSans-Light.ttf') format('truetype'), url('../fonts/OpenSans-Light.woff') format('woff');
}

@font-face {
    font-family: OpenSans-LightItalic;
    src: url('../fonts/OpenSans-LightItalic.ttf') format('truetype'), url('../fonts/OpenSans-LightItalic.woff') format('woff');
}

@font-face {
    font-family: OpenSans-Semibold;
    src: url('../fonts/OpenSans-Semibold.ttf') format('truetype'), url('../fonts/OpenSans-Semibold.woff') format('woff');
}

@font-face {
    font-family: OpenSans-SemiboldItalic;
    src: url('../fonts/OpenSans-SemiboldItalic.ttf') format('truetype'), url('../fonts/OpenSans-SemiboldItalic.woff') format('woff');
}

@font-face {
    font-family: OpenSans-Bold;
    src: url('../fonts/OpenSans-Bold.ttf') format('truetype'), url('../fonts/OpenSans-Bold.woff') format('woff');
}

@font-face {
    font-family: OpenSans-BoldItalic;
    src: url('../fonts/OpenSans-BoldItalic.ttf') format('truetype'), url('../fonts/OpenSans-BoldItalic.woff') format('woff');
}

@font-face {
    font-family: OpenSans-ExtraBold;
    src: url('../fonts/OpenSans-ExtraBold.ttf') format('truetype'), url('../fonts/OpenSans-ExtraBold.woff') format('woff');
}

@font-face {
    font-family: OpenSans-ExtraBoldItalic;
    src: url('../fonts/OpenSans-ExtraBoldItalic.ttf') format('truetype'), url('../fonts/OpenSans-ExtraBoldItalic.woff') format('woff');
}
/************************* COMMON / VARIABLES ******************************/
/* Colors */
/* Sizes */
/* Fonts */
/************************* LAYOUT ******************************/
/************************* LAYOUT / STRUCTURE ******************************/
* {
    margin: 0;
    padding: 0;
    /* Scrollbar */
    /* Selection */
    /* Autofill */
    /* Links Styles */
}

    *::-webkit-scrollbar-track {
        background-color: #949494;
    }

    *::-webkit-scrollbar {
        width: 16px;
        height: 6px;
        background-color: #949494;
    }

    *::-webkit-scrollbar-thumb {
        background-color: #383838;
    }

    *::-moz-selection {
        background: #da2e33;
        color: #ffffff;
    }

    *::selection {
        background: #da2e33;
        color: #ffffff;
    }

    * input:-webkit-autofill,
    * textarea:-webkit-autofill,
    * select:-webkit-autofill {
        background: #fff;
    }

    * a {
        color: #3f494c;
        text-decoration: none;
        cursor: pointer;
    }

        * a:link,
        * a:visited,
        * a:active {
            color: #3f494c;
            text-decoration: none;
        }

        * a:hover {
            color: #da2e33;
            text-decoration: none;
        }

    *:focus {
        outline: 0;
    }

html {
    background: #ffffff;
    /* Body */
}

    html body {
        margin-bottom: 85px;
        padding: 0;
        height: auto;
        background: #ffffff;
        font-family: OpenSans-Regular, helvetica, verdana, tahoma, sans-serif;
        font-size: 12px;
        cursor: default;
    }

        html body.opened {
            overflow: hidden;
        }

.clear {
    clear: both;
}
/************************* LAYOUT / HEADER ******************************/
header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 60px;
    padding: 10px 0;
    background: #d14d3d;
    font-size: 0;
    color: #ffffff;
    z-index: 55;
}

    header.header-auto {
        height: auto;
    }

    header img {
        max-height: 75px;
    }

    header .header-left,
    header .header-right {
        display: inline-block;
        vertical-align: middle;
        width: 40%;
        font-size: 14px;
    }

        header .header-left i,
        header .header-right i,
        header .header-left .option-menu,
        header .header-right .option-menu {
            display: inline-block;
            vertical-align: middle;
        }

        header .header-left i,
        header .header-right i {
            margin-bottom: 2px;
            font-size: 24px;
        }

        header .header-left .option-menu,
        header .header-right .option-menu {
            font-family: OpenSans-Light;
            font-size: 12px;
        }

        header .header-left .aside-menu .username-menu,
        header .header-right .aside-menu .username-menu {
            display: block;
            font-family: OpenSans-Bold;
            font-size: 11px;
            text-transform: uppercase;
        }

    header .header-center {
        display: inline-block;
        vertical-align: middle;
        width: 20%;
        text-align: center;
    }

    header .header-left {
        padding-left: 15px;
    }

        header .header-left i {
            padding-right: 10px;
        }

    header .header-right {
        padding-right: 15px;
        text-align: right;
        white-space: nowrap;
    }

        header .header-right i {
            padding-left: 10px;
        }

        header .header-right .header-right-user,
        header .header-right .header-right-alerts {
            display: inline-block;
            vertical-align: middle;
        }

            header .header-right .header-right-user:hover i,
            header .header-right .header-right-user:hover .option-menu {
                opacity: .8;
                cursor: pointer;
            }

        header .header-right .header-right-alerts {
            margin-right: 10px;
        }

            header .header-right .header-right-alerts .alert-icon-items {
                display: inline-block;
                vertical-align: middle;
            }

            header .header-right .header-right-alerts .alert-icon {
                display: inline-block;
                vertical-align: middle;
                position: relative;
                color: #ffffff;
            }

                header .header-right .header-right-alerts .alert-icon:hover .alert-icon-a,
                header .header-right .header-right-alerts .alert-icon:hover .alert-icon-p {
                    opacity: .8;
                }

                header .header-right .header-right-alerts .alert-icon.alert-icon-global {
                    display: none;
                    cursor: pointer;
                }

                    header .header-right .header-right-alerts .alert-icon.alert-icon-global.alerts-drop-active {
                        opacity: .8;
                    }

                        header .header-right .header-right-alerts .alert-icon.alert-icon-global.alerts-drop-active .alert-icon-num {
                            display: none;
                        }

                    header .header-right .header-right-alerts .alert-icon.alert-icon-global:hover .alert-icon-g {
                        opacity: .8;
                    }

                header .header-right .header-right-alerts .alert-icon .alert-icon-g {
                    margin-top: 2px;
                    font-size: 22px;
                }

                header .header-right .header-right-alerts .alert-icon .alert-icon-p {
                    margin-top: 1px;
                    font-size: 22px;
                }

                header .header-right .header-right-alerts .alert-icon .alert-icon-a,
                header .header-right .header-right-alerts .alert-icon .alert-icon-p {
                    cursor: pointer;
                }

                header .header-right .header-right-alerts .alert-icon .alert-icon-num {
                    position: absolute;
                    bottom: -2px;
                    right: -10px;
                    display: inline-block;
                    vertical-align: middle;
                    width: 15px;
                    height: 15px;
                    background: #89081e;
                    border-radius: 50%;
                    font-family: OpenSans-Light;
                    font-size: 10px;
                    color: #ffffff;
                    text-align: center;
                }
/************************* LAYOUT / MENU ******************************/
nav {
    position: fixed;
    top: 60px;
    display: inline-block;
    vertical-align: middle;
    width: 100%;
    height: 35px;
    background: #666666;
    border-top: 1px solid #ffffff;
    text-transform: uppercase;
    text-align: center;
    z-index: 25;
}

    nav ul {
        list-style: none;
        margin: 0;
    }

        nav ul li {
            display: inline-block;
            vertical-align: middle;
            position: relative;
            margin-right: 5px;
            font-family: OpenSans-Bold;
            font-size: 11px;
            color: #e9e9e9;
        }

            nav ul li:last-child {
                margin-right: 0;
            }

            nav ul li:before {
                display: none;
            }

            nav ul li:hover {
                background: #888888;
                cursor: pointer;
            }

                nav ul li:hover .subnav {
                    visibility: visible;
                    opacity: 1;
                }

            nav ul li.active {
                background: #888888;
                cursor: pointer;
                color: #e9e9e9;
            }

                nav ul li.active a:link,
                nav ul li.active a:visited {
                    color: #e9e9e9;
                }

            nav ul li a {
                display: inline-block;
                vertical-align: middle;
                padding: 0 10px;
                line-height: 34px;
                color: #e9e9e9;
            }

                nav ul li a:link,
                nav ul li a:visited,
                nav ul li a:active {
                    color: #e9e9e9;
                }

                nav ul li a:hover {
                    color: #e9e9e9;
                }

                nav ul li a.active {
                    background: #888888;
                    cursor: pointer;
                }

            nav ul li .subnav {
                position: absolute;
                top: 35px;
                left: 0;
                width: 120px;
                background: #666666;
                text-align: left;
                visibility: hidden;
                opacity: 0;
                transition: 0.1s all ease-in-out;
            }

                nav ul li .subnav li {
                    display: block;
                    margin-right: 0;
                }

                    nav ul li .subnav li.subnav-separator {
                        border-bottom: 1px solid #a3a3a3;
                    }

                    nav ul li .subnav li a {
                        width: 100%;
                    }

#nav-menu {
    display: none;
}
/************************* LAYOUT / FOOTER ******************************/
footer {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 10px 0;
    background: #eeeeee;
    border-top: 1px solid #efefef;
    border-bottom: 3px solid #d14d3d;
    text-align: center;
    z-index: 40;
}

    footer .copyright {
        font-family: OpenSans-Semibold;
        font-size: 10px;
        color: #6d6d6d;
        text-transform: uppercase;
    }
/************************* LAYOUT / SECTION ******************************/
section {
    margin: 120px 50px 40px 50px;
    z-index: 40;
}

    section.subheader {
        margin-top: 100px;
    }

.gotop {
    position: fixed;
    bottom: 50px;
    right: 10px;
    width: 35px;
    height: 35px;
    background: #da2e33;
    border-radius: 50%;
    visibility: hidden;
    opacity: 0;
    transition: 1s opacity ease-in-out;
}

    .gotop:before {
        content: '\f077';
        display: inline-block;
        vertical-align: middle;
        width: 100%;
        font-family: 'fontAwesome';
        font-size: 16px;
        line-height: 32px;
        color: #ffffff;
        text-align: center;
    }

    .gotop.gotop-visible {
        visibility: visible;
        opacity: 1;
    }
/************************* LAYOUT / CONTENT ******************************/
.layout {
    padding: 25px 0;
    /* Title */
}

    .layout.title {
        position: fixed;
        top: 50px;
        left: 0;
        width: 100%;
        padding: 10px 0;
        background: #eeeeee;
        border-bottom: 1px solid #e9e9e9;
        font-family: OpenSans-Bold;
        font-size: 12px;
        color: #3f494c;
        text-align: center;
        text-transform: uppercase;
        z-index: 49;
    }

        .layout.title small {
            display: block;
            opacity: .6;
        }

    .layout.centered {
        text-align: center;
    }

.layout-btn {
    padding: 15px;
    background: #fcfcfc;
    border: 1px solid #e9e9e9;
    text-align: right;
}

.content.centered {
    text-align: center;
}
/************************* COMPONENTS ******************************/
/************************* COMPONENTS / TITLES ******************************/
h1 {
    display: inline-block;
    vertical-align: middle;
    margin: 0;
    font-family: OpenSans-Bold;
    font-size: 16px;
    color: #da2e33;
    text-transform: uppercase;
}

    h1.squared {
        width: 100%;
        padding: 15px;
        background: #ffffff;
        border: 1px solid #da2e33;
        color: #da2e33;
        text-align: center;
    }

    h1.fa {
        padding-left: 25px;
        font-family: OpenSans-Bold;
        font-size: 16px;
        color: #da2e33;
        text-transform: uppercase;
    }

        h1.fa:before {
            display: inline-block;
            vertical-align: middle;
            position: absolute;
            top: -2px;
            left: 0;
            margin-right: 5px;
            font-size: 20px;
            color: #b30721;
            font-family: 'fontAwesome';
        }

h2 {
    margin: 15px 0 5px 0;
    font-family: OpenSans-ExtraBold;
    font-size: 12px;
    color: #3f494c;
    text-transform: uppercase;
}

h3 {
    margin: 0;
    font-family: OpenSans-Regular;
    font-size: 12px;
    color: #3f494c;
}

h4 {
    display: table-cell;
    vertical-align: middle;
    margin: 0;
    font-family: OpenSans-ExtraBold;
    font-size: 11px;
    color: #3f494c;
    text-transform: uppercase;
    text-align: left;
    transition: .1s all linear;
}

h5 {
    display: inline-block;
    vertical-align: middle;
    margin: 0;
    font-family: OpenSans-Bold;
    font-size: 10px;
    color: #da2e33;
    text-align: left;
}
/************************* COMPONENTS / SUBTITLES ******************************/
section .subtitle {
    margin: 0 0 20px 0;
    padding: 15px 0 0 0;
    border-bottom: 1px solid #e9e9e9;
    font-size: 0;
}

    section .subtitle .subtitle-left,
    section .subtitle .subtitle-right,
    section .subtitle .subtitle-full {
        display: inline-block;
        vertical-align: middle;
        margin-bottom: 10px;
    }

    section .subtitle .subtitle-left {
        position: relative;
        width: 50%;
    }

        section .subtitle .subtitle-left .subtitle-breadcrumb-prev {
            font-family: OpenSans-Regular;
        }

        section .subtitle .subtitle-left .subtitle-breadcrumb-bar {
            font-family: OpenSans-Light;
        }

    section .subtitle .subtitle-right {
        width: 50%;
        text-align: right;
    }

        section .subtitle .subtitle-right input,
        section .subtitle .subtitle-right button,
        section .subtitle .subtitle-right .button {
            display: inline-block;
            vertical-align: middle;
        }

        section .subtitle .subtitle-right .search-icon {
            display: inline-block;
            vertical-align: middle;
            margin-right: 30px;
            font-size: 16px;
            opacity: .6;
        }

    section .subtitle .subtitle-full {
        position: relative;
        width: 100%;
    }

        section .subtitle .subtitle-full .subtitle-breadcrumb-prev {
            font-family: OpenSans-Regular;
        }

        section .subtitle .subtitle-full .subtitle-breadcrumb-bar {
            font-family: OpenSans-Light;
        }

    section .subtitle.subtitle-alert {
        margin-bottom: 0;
        border: none;
    }
/************************* COMPONENTS / ICONS ******************************/
/************************* COMPONENTS / ICONS / APP ******************************/
.app-icon {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    width: 55px;
    height: 55px;
    background: #6d6d6d;
    border-radius: 5px;
    text-align: center;
}

    .app-icon:hover {
        cursor: pointer;
    }

    .app-icon .fa {
        line-height: 55px;
        font-size: 30px;
        color: #ffffff;
    }

        .app-icon .fa.app-icon-fav {
            position: absolute;
            top: -7px;
            right: -7px;
            width: 20px;
            height: 20px;
            text-align: center;
            background: #bbbbbb;
            border-radius: 50%;
            font-size: 12px;
            line-height: 20px;
            cursor: pointer;
            transition: .1s all linear;
        }

            .app-icon .fa.app-icon-fav:hover {
                background: #ffffff;
                color: #da2e33;
            }

            .app-icon .fa.app-icon-fav.marked {
                background: #da2e33;
                color: #ffffff;
            }

                .app-icon .fa.app-icon-fav.marked:hover {
                    background: #ffffff;
                    color: #a3a3a3;
                }
/************************* COMPONENTS / ICONS / FAVORITE ******************************/
.fav-icon {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    width: 55px;
    height: 55px;
    background: #dedede;
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
}

    .fav-icon .fa {
        line-height: 55px;
        font-size: 30px;
        color: #6d6d6d;
    }

    .fav-icon .fav-icon-edit,
    .fav-icon .fav-icon-delete {
        opacity: 0;
        position: absolute;
        top: -7px;
        right: -12px;
        width: 20px;
        height: 20px;
        background: #da2e33;
        border-radius: 50%;
        font-size: 12px;
        color: #ffffff;
        line-height: 20px;
        transition: .1s all linear;
    }

    .fav-icon .fav-icon-edit {
        top: 15px;
        background: #da672e;
    }
/************************* COMPONENTS / ICONS / MENU ******************************/
.menu-icon {
    display: table-cell;
    vertical-align: middle;
    width: 35px;
    height: 35px;
    background: #8c9294;
    border-radius: 50%;
    font-size: 15px;
    color: #fcfcfc;
    line-height: 35px;
    text-align: center;
    transition: .2s all linear;
}

    .menu-icon.menu-icon-inline {
        display: inline-block;
    }

    .menu-icon:hover {
        background: #da2e33;
    }

    .menu-icon.info-icon {
        display: inline-block;
        vertical-align: middle;
        margin-left: 10px;
        background: transparent;
        border: 2px solid #cccccc;
        font-size: 19px;
        line-height: 33px;
        color: #a3a3a3;
    }

        .menu-icon.info-icon:hover {
            background: #cccccc;
            color: #ffffff;
            cursor: pointer;
        }

    .menu-icon.icon-active {
        background: #da2e33;
    }

.cancel-icon {
    position: absolute;
    top: -2px;
    right: -6px;
    width: 15px;
    height: 15px;
    background-color: #333;
    background-image: url('../images/icons/delete.svg');
    background-size: 50% 50%;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 50%;
    color: #fff;
    line-height: 15px;
    text-align: center;
    cursor: pointer;
    visibility: hidden;
    opacity: 0;
}

    .cancel-icon.cancel-icon-show {
        visibility: visible;
        opacity: 1;
    }
/************************* COMPONENTS / ICONS / PREV ******************************/
.prev-icon {
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
    font-size: 32px;
    color: #ffffff;
}

    .prev-icon:hover {
        opacity: .8;
    }

    .prev-icon:link,
    .prev-icon:visited,
    .prev-icon:active {
        color: #ffffff;
    }

        .prev-icon:link:hover,
        .prev-icon:visited:hover,
        .prev-icon:active:hover {
            opacity: .8;
        }
/************************* COMPONENTS / ICONS / TITLE ******************************/
.title-icon {
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
    font-size: 20px;
    color: #da2e33;
}
/************************* COMPONENTS / LISTS ******************************/
ul,
ol {
    display: inline-block;
    vertical-align: middle;
    font-family: OpenSans-Light;
    font-size: 13px;
    color: #333333;
}

ul {
    list-style: none;
}

    ul li:before {
        content: '\f111';
        margin-right: 5px;
        font-family: 'fontAwesome';
        font-size: 8px;
        color: #da2e33;
    }

    ul.dots li:before {
        content: '\f111';
        position: relative;
        top: -2px;
        font-size: 6px;
    }

    ul.angles li:before {
        content: '\f101';
        position: relative;
        top: 0;
        font-size: 14px;
    }

    ul.arrows li:before {
        content: '\f0da';
        position: relative;
        top: 0;
        font-size: 14px;
    }

    ul.uploaded {
        width: 100%;
        margin-bottom: 0;
        text-align: left;
    }

        ul.uploaded li {
            position: relative;
            padding: 5px 30px 5px 5px;
            border-top: 1px dashed #e9e9e9;
            font-family: OpenSans-Regular;
            font-size: 12px;
            word-break: break-all;
        }

            ul.uploaded li:last-child {
                border-bottom: 1px dashed #e9e9e9;
            }

            ul.uploaded li:before {
                content: '\f0c8';
                position: relative;
                top: -3px;
                margin-right: 7px;
                font-size: 4px;
                color: #666666;
            }

            ul.uploaded li.uploaded-ok:after,
            ul.uploaded li.uploaded-no:after {
                display: inline-block;
                vertical-align: middle;
                position: absolute;
                top: 6px;
                right: 5px;
                width: 15px;
                height: 15px;
                border-radius: 50%;
                font-family: 'fontAwesome';
                font-size: 10px;
                line-height: 15px;
                color: #ffffff;
                text-align: center;
            }

            ul.uploaded li.uploaded-ok:after {
                content: '\f00c';
                background: #49b84d;
            }

            ul.uploaded li.uploaded-no:after {
                content: '\f00d';
                background: #da2e33;
            }

ol {
    list-style: none;
    counter-reset: my-badass-counter;
}

    ol li:before {
        content: counter(my-badass-counter);
        counter-increment: my-badass-counter;
        display: inline-block;
        vertical-align: middle;
        position: relative;
        top: -1px;
        width: 12px;
        height: 12px;
        margin-right: 5px;
        background: #da2e33;
        border-radius: 100%;
        font-family: OpenSans-Bold;
        font-size: 8px;
        color: #ffffff;
        line-height: 12px;
        text-align: center;
    }
/************************* COMPONENTS / APPS ******************************/
section .apps .apps-menu {
    padding-bottom: 10px;
    border-top: 1px solid #efefef;
    border-bottom: 1px solid #efefef;
}

    section .apps .apps-menu .apps-col {
        display: table;
        vertical-align: middle;
        height: 25px;
        margin-top: 10px;
        text-align: left;
    }

        section .apps .apps-menu .apps-col:hover h4 {
            color: #da2e33;
            cursor: pointer;
        }

        section .apps .apps-menu .apps-col:hover .menu-icon {
            background: #da2e33;
            color: #ffffff;
            cursor: pointer;
        }

        section .apps .apps-menu .apps-col h4 {
            padding-left: 10px;
        }

        section .apps .apps-menu .apps-col.marked h4 {
            color: #da2e33;
            cursor: pointer;
        }

        section .apps .apps-menu .apps-col.marked .menu-icon {
            background: #da2e33;
            color: #ffffff;
            cursor: pointer;
        }

section .apps .apps-submenu {
    padding: 15px 0 25px 0;
    text-align: center;
}

    section .apps .apps-submenu .submenu-item {
        display: inline-block;
        vertical-align: middle;
        padding: 5px 10px;
        margin: 10px 5px 0 5px;
        border: 1px solid #da2e33;
        font-family: OpenSans-Regular;
        font-size: 12px;
        color: #da2e33;
        transition: .2s all linear;
    }

        section .apps .apps-submenu .submenu-item:hover {
            background: #da2e33;
            color: #ffffff;
            cursor: pointer;
        }

        section .apps .apps-submenu .submenu-item.marked {
            background: #da2e33;
            color: #ffffff;
            cursor: default;
        }

section .apps .apps-content {
    padding-bottom: 25px;
    background: #eeeeee;
    border: 1px solid #efefef;
}

    section .apps .apps-content .app-col {
        padding-top: 25px;
        text-align: center;
    }

        section .apps .apps-content .app-col h3 {
            cursor: pointer;
        }

    section .apps .apps-content #apps .application {
        -webkit-transform: scale(0);
        transform: scale(0);
        -webkit-transition: all 350ms ease;
        transition: all 350ms ease;
    }

        section .apps .apps-content #apps .application.selected {
            transform: scale(1);
        }
/************************* COMPONENTS / FAVORITES ******************************/
section .favs {
    position: relative;
    background: #eeeeee;
}

    section .favs .fav-col {
        margin-top: 25px;
        text-align: center;
        cursor: default;
    }

        section .favs .fav-col:hover .fav-icon-edit,
        section .favs .fav-col:hover .fav-icon-delete {
            opacity: 1;
            cursor: pointer;
        }

        section .favs .fav-col:hover h2,
        section .favs .fav-col:hover h3 {
            cursor: pointer;
        }

    section .favs .fav-category {
        text-align: center;
    }

        section .favs .fav-category .fav-layout {
            display: inline-block;
            vertical-align: middle;
            margin: 0 auto;
        }

            section .favs .fav-category .fav-layout i {
                display: inline-block;
                vertical-align: middle;
                margin-right: 5px;
                font-size: 16px;
                color: #da2e33;
            }

    section .favs.closed {
        position: fixed;
        top: -100%;
        width: 100%;
        z-index: 50;
        visibility: hidden;
        transition: .7s all linear;
    }

        section .favs.closed .close-menu {
            position: absolute;
            bottom: -22px;
            left: 50%;
            margin-left: -60px;
            width: 120px;
            height: 20px;
            background: #da2e33;
            border-bottom-left-radius: 20px;
            border-bottom-right-radius: 20px;
            color: #ffffff;
            text-align: center;
            line-height: 18px;
            visibility: hidden;
            opacity: 0;
            transition: .5s all linear;
            cursor: pointer;
        }

        section .favs.closed .row {
            max-height: 400px;
            margin: 0;
            padding: 0 25px 25px 25px;
            overflow: auto;
        }

        section .favs.closed.opened {
            display: block;
            top: 50px;
            left: 0;
            visibility: visible;
            padding: 0;
            border-bottom: 3px solid #da2e33;
        }

            section .favs.closed.opened .close-menu {
                visibility: visible;
                opacity: 1;
            }
/************************* COMPONENTS / SEPARATORS ******************************/
.mega-separator {
    display: block;
    width: 100%;
    margin: 30px 0 20px 0;
    border-top: 1px solid #e9e9e9;
}

.big-separator {
    display: block;
    width: 100%;
    height: 50px;
}

.separator {
    display: block;
    width: 100%;
    height: 25px;
}

.mini-separator {
    display: block;
    width: 100%;
    height: 10px;
}

.space {
    display: inline-block;
    vertical-align: middle;
    width: 25px;
}

.divisor {
    display: block;
    width: 100%;
    margin: 40px 0 35px 0;
    border-top: 1px solid #e9e9e9;
}
/************************* COMPONENTS / FILTERS ******************************/
.row.filters {
    margin: 0;
}

    .row.filters .checks {
        margin-top: 10px;
    }

@media (max-width: 1023px) {
    .filters .form-group .checks label,
    .filters .form-group .radios label {
        display: inline-block;
        vertical-align: middle;
        margin: 0 10px;
    }
}

@media (max-width: 767px) {
    .filters .form-group .checks label,
    .filters .form-group .radios label {
        display: block;
        margin: 5px;
    }

    .filters .form-right .form-group {
        text-align: left;
    }

        .filters .form-right .form-group label {
            text-align: left;
        }
}
/************************* COMPONENTS / OPTIONS ******************************/
aside {
    position: fixed;
    top: 0;
    right: -300px;
    width: 300px;
    height: auto;
    padding: 15px 20px 25px 20px;
    background: #959597;
    border-left: 3px solid #d14d3d;
    border-bottom: 3px solid #d14d3d;
    font-family: OpenSans-Regular;
    font-size: 13px;
    color: #ffffff;
    z-index: 60;
    transition: .2s all linear;
}

    aside.opened {
        right: 0;
    }

    aside .aside-icon {
        display: inline-block;
        vertical-align: middle;
        position: relative;
        width: 100%;
        margin-bottom: 15px;
        font-size: 24px;
        color: #e9e9e9;
        text-align: right;
    }

        aside .aside-icon i:hover {
            color: #ffffff;
            cursor: pointer;
        }

    aside .aside-info {
        font-size: 0;
    }

        aside .aside-info i,
        aside .aside-info .aside-group {
            display: inline-block;
            vertical-align: middle;
        }

        aside .aside-info i {
            width: 10%;
            font-size: 24px;
        }

        aside .aside-info .aside-group {
            position: relative;
            width: 85%;
            margin-left: 5%;
        }

            aside .aside-info .aside-group .aside-user {
                font-family: OpenSans-Bold;
                font-size: 14px;
                text-transform: uppercase;
            }

            aside .aside-info .aside-group .aside-center {
                font-size: 14px;
            }

            aside .aside-info .aside-group .aside-center-icon {
                position: absolute;
                top: 7px;
                right: 0;
                padding: 5px;
                background: #da2e33;
                border-radius: 50%;
                font-size: 16px;
                color: #ffffff;
                text-decoration: none;
            }

                aside .aside-info .aside-group .aside-center-icon:hover {
                    color: #d3d3d3;
                    text-decoration: none;
                }

    aside .aside-data {
        margin-top: 25px;
        padding: 15px 0;
        background: #757575;
        font-size: 0;
    }

        aside .aside-data .aside-group {
            display: inline-block;
            vertical-align: top;
            width: 45%;
            padding-top: 2px;
            text-align: center;
        }

            aside .aside-data .aside-group:first-child {
                margin-right: 5%;
            }

            aside .aside-data .aside-group:last-child {
                margin-left: 5%;
            }

            aside .aside-data .aside-group label {
                margin: 5px 0 3px 0;
                padding: 2px 5px;
                background: #cccccc;
                font-size: 11px;
                color: #333333;
            }

            aside .aside-data .aside-group span {
                display: block;
                font-size: 13px;
                word-break: break-word;
            }

    aside .aside-date {
        padding-top: 15px;
        background: #666666;
    }

        aside .aside-date .aside-group label,
        aside .aside-date .aside-group span {
            display: inline-block;
            vertical-align: middle;
            width: 100%;
            text-align: center;
        }

        aside .aside-date .aside-group label {
            font-size: 11px;
            color: #ffffff;
        }

        aside .aside-date .aside-group span {
            font-family: OpenSans-Light;
            font-size: 13px;
            word-break: break-word;
        }

        aside .aside-date .aside-group:first-child {
            margin-bottom: 10px;
        }

        aside .aside-date .aside-group:last-child {
            margin-bottom: 50px;
            padding-bottom: 15px;
            border-bottom: 1px solid #757575;
        }

    aside .aside-actions {
        font-size: 0;
    }

        aside .aside-actions button,
        aside .aside-actions .button {
            display: inline-block;
            vertical-align: middle;
            width: 45%;
        }

            aside .aside-actions button:first-child,
            aside .aside-actions .button:first-child {
                margin-right: 5%;
            }

            aside .aside-actions button:last-child,
            aside .aside-actions .button:last-child {
                margin-left: 5%;
            }

    aside .aside-logout {
        display: inline-block;
        vertical-align: middle;
        width: 100%;
        margin-top: 15px;
        padding: 5px 0;
        border: 1px solid rgba(255, 255, 255, 0.5);
        color: #ffffff;
        text-transform: uppercase;
        text-align: center;
    }

        aside .aside-logout:hover {
            background: rgba(255, 255, 255, 0.1);
        }
/************************* COMPONENTS / FORMS ******************************/
/************************* COMPONENTS / FORMS / GENERAL ******************************/
a label {
    cursor: pointer;
}

    a label:hover {
        text-decoration: underline;
    }

.form-group {
    width: 100%;
    margin-bottom: 25px;
    font-size: 0;
}

    .form-group label,
    .form-group .form-item {
        display: inline-block;
        vertical-align: top;
        text-align: left;
    }

    .form-group label {
        display: block;
        margin-bottom: 5px;
        font-size: 13px;
        color: #666666;
    }

        .form-group label.required {
            display: inline-block;
            vertical-align: middle;
        }

        .form-group label.sublabel {
            font-family: OpenSans-Regular;
            font-weight: normal;
            line-height: 15px;
        }

        .form-group label.retext {
            margin-top: 5px;
            font-family: OpenSans-Regular;
            font-weight: normal;
            text-transform: initial;
        }

    .form-group .form-item {
        display: block;
    }

        .form-group .form-item input,
        .form-group .form-item select {
            display: inline-block;
            width: 100%;
            padding-top: 0;
            padding-bottom: 0;
            border: none;
            border-bottom: 1px solid #e9e9e9;
            text-align: left;
        }

        .form-group .form-item.items-3 input:nth-child(1) {
            width: 100px;
            margin-right: 15px;
        }

        .form-group .form-item.items-3 input:nth-child(2) {
            width: 200px;
            margin-right: 15px;
        }

        .form-group .form-item.items-3 input:nth-child(3) {
            width: 50px;
        }

        .form-group .form-item.items-special input,
        .form-group .form-item.items-special select,
        .form-group .form-item.items-special span {
            display: inline-block;
            vertical-align: middle;
        }

            .form-group .form-item.items-special input.first-item,
            .form-group .form-item.items-special select.first-item {
                width: 58%;
                margin-right: 1%;
            }

            .form-group .form-item.items-special input.last-item,
            .form-group .form-item.items-special select.last-item {
                width: 38%;
                margin-left: 1%;
            }

        .form-group .form-item.items-special span {
            width: 2%;
            font-family: OpenSans-Bold;
            font-size: 24px;
            line-height: 2px;
            color: #aaa;
            text-align: center;
        }

        .form-group .form-item.item-pass {
            position: relative;
        }

            .form-group .form-item.item-pass .view-pass {
                position: absolute;
                top: 2px;
                right: 5px;
                font-size: 15px;
                cursor: pointer;
            }

                .form-group .form-item.item-pass .view-pass.not-view-pass:before {
                    content: '\f070';
                    cursor: pointer;
                }

    .form-group.required label:after {
        content: '*';
        font-family: OpenSans-Bold;
        font-size: 10px;
        color: #da2e33;
        position: relative;
        left: 5px;
        top: -5px;
    }

    .form-group.align-center {
        text-align: center;
    }

        .form-group.align-center label {
            text-align: center;
        }

.form-special-group {
    margin-bottom: 25px;
}

    .form-special-group .form-left {
        padding: 15px 10px 2px 10px;
        background: #eee;
    }

        .form-special-group .form-left .form-group {
            padding: 0 10px;
        }

            .form-special-group .form-left .form-group label {
                color: #666;
            }

            .form-special-group .form-left .form-group input {
                border-bottom-color: #da2e33;
            }

.login-box .form-group .form-item.item-pass .view-pass {
    top: 20px;
    right: 10px;
}
/************************* COMPONENTS / FORMS / TYPES ******************************/
/* Form Left */
.form-left .form-group {
    text-align: left;
}

    .form-left .form-group label,
    .form-left .form-group .form-item {
        text-align: left;
    }

        .form-left .form-group label input,
        .form-left .form-group .form-item input,
        .form-left .form-group label select,
        .form-left .form-group .form-item select {
            text-align: left;
        }
/* Form Center */
.form-center {
    text-align: center;
}

    .form-center.spaced {
        margin-top: 25px;
    }

    .form-center .form-group {
        text-align: center;
    }

        .form-center .form-group label,
        .form-center .form-group .form-item {
            text-align: center;
        }

            .form-center .form-group label input,
            .form-center .form-group .form-item input,
            .form-center .form-group label select,
            .form-center .form-group .form-item select {
                text-align: center;
            }

        .form-center .form-group .error-message {
            text-align: center;
        }

            .form-center .form-group .error-message:before {
                left: initial;
                right: 50%;
                margin-right: -15px;
            }
/* Form Right */
.form-right .form-group {
    text-align: right;
}

    .form-right .form-group label,
    .form-right .form-group .form-item {
        text-align: right;
    }

        .form-right .form-group label input,
        .form-right .form-group .form-item input,
        .form-right .form-group label select,
        .form-right .form-group .form-item select {
            text-align: right;
        }

    .form-right .form-group .error-message {
        text-align: right;
    }

        .form-right .form-group .error-message:before {
            left: initial;
            right: 15px;
        }
/* Form Bordered */
.form-bordered {
    margin-top: 20px;
    padding: 20px;
    border: 1px solid #ccc;
    background: #fcfcfc;
}

    .form-bordered label.sublabel {
        line-height: 10px;
    }

    .form-bordered label a {
        font-family: OpenSans-Semibold;
        color: #d14d3d;
        text-transform: initial;
    }
/* Form Subtitle */
.form-subtitle {
    display: inline-block;
    vertical-align: middle;
    width: 100%;
    padding: 5px;
    margin-bottom: 15px;
    background: #959597;
    border-left: 1px solid #ffffff;
    border-right: 1px solid #ffffff;
    font-family: OpenSans-Bold;
    font-size: 12px;
    color: #ffffff;
    text-transform: uppercase;
    text-align: center;
}
/* Form Specs */
.form-specs {
    display: inline-block;
    vertical-align: middle;
}
/************************* COMPONENTS / FORMS / FIELDSET ******************************/
/* Fieldset Layout */
.fieldset-layout {
    padding: 0;
}
/* Fieldset */
.fieldset {
    position: relative;
    margin: 0 5px 20px 0;
    padding-top: 10px;
    border: 1px dashed #cccccc;
}

    .fieldset:before {
        content: attr(data);
        position: absolute;
        top: -12px;
        left: 8px;
        padding: 0 10px;
        background: #ffffff;
        font-family: OpenSans-Bold;
        font-weight: normal;
        color: #da2e33;
        text-transform: uppercase;
    }

    .fieldset label {
        font-family: OpenSans-Semibold;
        font-size: 11px;
        font-weight: normal;
        color: #000;
        text-transform: initial;
    }

    .fieldset.fieldset-noborder {
        background: #757575;
        border: none;
    }

        .fieldset.fieldset-noborder .form-group label {
            color: #ffffff;
        }

        .fieldset.fieldset-noborder .form-group .form-item input {
            border-bottom: 1px solid #a3a3a3;
            color: #e9e9e9;
        }

        .fieldset.fieldset-noborder .form-group .form-item ::-webkit-input-placeholder {
            color: #e9e9e9;
        }

        .fieldset.fieldset-noborder .form-group .form-item :-moz-placeholder {
            color: #e9e9e9;
            opacity: 1;
        }

        .fieldset.fieldset-noborder .form-group .form-item ::-moz-placeholder {
            color: #e9e9e9;
            opacity: 1;
        }

        .fieldset.fieldset-noborder .form-group .form-item :-ms-input-placeholder {
            color: #e9e9e9;
        }

        .fieldset.fieldset-noborder .form-group .form-item ::-ms-input-placeholder {
            color: #e9e9e9;
        }
/************************* COMPONENTS / FORMS / LABEL ******************************/
label {
    margin-bottom: 0;
    font-family: OpenSans-Bold;
    font-size: 12px;
    color: #da2e33;
    text-transform: uppercase;
}

    label.required {
        position: relative;
        display: inline-block;
        vertical-align: middle;
    }

        label.required:after {
            content: 'Obligatoria';
            position: absolute;
            top: 17px;
            right: 0;
            display: inline-block;
            vertical-align: top;
            margin-left: 5px;
            font-family: OpenSans-Light;
            font-size: 9px;
            font-weight: normal;
            color: #d14d3d;
        }
/************************* COMPONENTS / FORMS / INPUT ******************************/
input {
    width: 200px;
    padding-bottom: 10px;
    background: transparent;
    border: none;
    border-bottom: 1px solid #e9e9e9;
    font-family: OpenSans-Light;
    font-size: 14px;
}

    input.simple {
        margin-right: 15px;
        padding-bottom: 0;
        border: none;
    }

    input[type='number'] {
        -moz-appearance: textfield;
    }

        input[type='number']::-webkit-inner-spin-button,
        input[type='number']::-webkit-outer-spin-button {
            -webkit-appearance: none;
            margin: 0;
        }
/************************* COMPONENTS / FORMS / SELECT ******************************/
select {
    width: 200px;
    height: 21px;
    padding-bottom: 10px;
    background: transparent;
    border: none;
    border-bottom: 1px solid #e9e9e9;
    font-family: OpenSans-Light;
    font-size: 14px;
}

    select.simple {
        margin-right: 15px;
        padding-bottom: 0;
        border: none;
    }
/************************* COMPONENTS / FORMS / RADIO ******************************/
.radios.inline label {
    display: inline-block;
    margin: 0 10px;
}

.radios.blocked {
    margin-top: 25px;
}

    .radios.blocked label {
        display: block;
        margin-bottom: 10px;
    }

.radios input[type="radio"] {
    display: none;
}

    .radios input[type="radio"]:checked + label:before {
        content: '\f00c';
        background: #da2e33;
        border: 1px solid #da2e33;
        border-radius: 50%;
        font-family: 'fontAwesome';
        font-size: 10px;
        line-height: 18px;
        color: #ffffff;
    }

.radios label {
    font-family: OpenSans-Light;
    font-weight: 100;
    color: #333333;
    text-transform: capitalize;
    cursor: pointer;
}

    .radios label:before {
        content: '';
        display: inline-block;
        vertical-align: top;
        width: 22px;
        height: 22px;
        margin: 0 10px 0 0;
        border: 1px solid #bbbbbb;
        border-radius: 50%;
        text-align: center;
        cursor: pointer;
    }
/************************* COMPONENTS / FORMS / CHECK ******************************/
.checks.inline label {
    display: inline-block;
    margin: 0 10px;
}

.checks.blocked {
    margin-top: 25px;
}

    .checks.blocked label {
        display: block;
        margin-bottom: 10px;
    }

.checks input[type="checkbox"] {
    display: none;
}

    .checks input[type="checkbox"]:checked + label:before {
        content: '\f00d';
        background: #da2e33;
        border: 1px solid #da2e33;
        font-family: 'fontAwesome';
        font-size: 10px;
        line-height: 18px;
        color: #ffffff;
    }

.checks label {
    font-family: OpenSans-Light;
    font-weight: 100;
    color: #333333;
    text-transform: capitalize;
    cursor: pointer;
}

    .checks label:before {
        content: '';
        display: inline-block;
        vertical-align: top;
        width: 22px;
        height: 22px;
        margin: 0 10px 0 0;
        border: 1px solid #bbbbbb;
        border-radius: 2px;
        text-align: center;
        cursor: pointer;
    }
/************************* COMPONENTS / FORMS / DATEPICKER ******************************/
.datepicker {
    font-family: OpenSans-Regular;
    z-index: 30 !important;
}

    .datepicker table thead {
        font-family: OpenSans-Bold;
        color: #444444;
    }

        .datepicker table thead .dow {
            font-family: OpenSans-Semibold;
            color: #888888;
        }

    .datepicker table tr td.active {
        background: #da2e33;
    }

        .datepicker table tr td.active:hover,
        .datepicker table tr td.active.disabled,
        .datepicker table tr td.active.disabled:hover,
        .datepicker table tr td.active:hover,
        .datepicker table tr td.active:hover:hover,
        .datepicker table tr td.active.disabled:hover,
        .datepicker table tr td.active.disabled:hover:hover,
        .datepicker table tr td.active:active,
        .datepicker table tr td.active:hover:active,
        .datepicker table tr td.active.disabled:active,
        .datepicker table tr td.active.disabled:hover:active,
        .datepicker table tr td.active.active,
        .datepicker table tr td.active:hover.active,
        .datepicker table tr td.active.disabled.active,
        .datepicker table tr td.active.disabled:hover.active,
        .datepicker table tr td.active.disabled,
        .datepicker table tr td.active:hover.disabled,
        .datepicker table tr td.active.disabled.disabled,
        .datepicker table tr td.active.disabled:hover.disabled,
        .datepicker table tr td.active[disabled],
        .datepicker table tr td.active:hover[disabled],
        .datepicker table tr td.active.disabled[disabled],
        .datepicker table tr td.active.disabled:hover[disabled] {
            background: #da2e33;
        }

    .datepicker table tr td span.active {
        background: #da2e33;
    }

        .datepicker table tr td span.active:hover,
        .datepicker table tr td span.active.disabled,
        .datepicker table tr td span.active.disabled:hover,
        .datepicker table tr td span.active:hover,
        .datepicker table tr td span.active:hover:hover,
        .datepicker table tr td span.active.disabled:hover,
        .datepicker table tr td span.active.disabled:hover:hover,
        .datepicker table tr td span.active:active,
        .datepicker table tr td span.active:hover:active,
        .datepicker table tr td span.active.disabled:active,
        .datepicker table tr td span.active.disabled:hover:active,
        .datepicker table tr td span.active.active,
        .datepicker table tr td span.active:hover.active,
        .datepicker table tr td span.active.disabled.active,
        .datepicker table tr td span.active.disabled:hover.active,
        .datepicker table tr td span.active.disabled,
        .datepicker table tr td span.active:hover.disabled,
        .datepicker table tr td span.active.disabled.disabled,
        .datepicker table tr td span.active.disabled:hover.disabled,
        .datepicker table tr td span.active[disabled],
        .datepicker table tr td span.active:hover[disabled],
        .datepicker table tr td span.active.disabled[disabled],
        .datepicker table tr td span.active.disabled:hover[disabled] {
            background: #da2e33;
        }
/************************* COMPONENTS / FORMS / BUTTON ******************************/
button,
.button {
    display: inline-block;
    vertical-align: middle;
    padding: 10px 15px;
    background: #da2e33;
    border: none;
    font-family: OpenSans-Bold;
    font-size: 12px;
    color: #ffffff;
    text-transform: uppercase;
}

    button:hover,
    .button:hover {
        background: #666666;
        color: #ffffff;
    }

    button:link,
    .button:link,
    button:visited,
    .button:visited,
    button:active,
    .button:active {
        color: #ffffff;
    }

    button.cancel,
    .button.cancel {
        background: #a3a3a3;
    }

        button.cancel:hover,
        .button.cancel:hover {
            background: #666666;
        }

    button.disabled,
    .button.disabled {
        opacity: .2;
        pointer-events: none;
    }

        button.disabled.enabled,
        .button.disabled.enabled {
            opacity: 1;
            pointer-events: all;
        }

    button.enter,
    .button.enter {
        background: #ffffff;
        color: #666666;
    }

        button.enter:hover,
        .button.enter:hover {
            background: #cccccc;
            color: #333333;
        }

    button.exit,
    .button.exit {
        background: #da2e33;
    }

        button.exit:hover,
        .button.exit:hover {
            background: #cccccc;
            color: #333333;
        }

    button.other,
    .button.other {
        background: #686f75;
    }

        button.other:hover,
        .button.other:hover {
            background: #666666;
            color: #ffffff;
        }

    button.select,
    .button.select {
        background: #666666;
    }

    button.upload:hover,
    .button.upload:hover {
        background: #da2e33;
    }

    button.upload:after,
    .button.upload:after {
        content: '';
        display: inline-block;
        width: 13px;
        height: 10px;
        margin-left: 5px;
        background: url('../images/icons/upload-w.svg');
        background-size: 100%;
        background-position: center;
        background-repeat: no-repeat;
        opacity: .8;
    }
/************************* COMPONENTS / FORMS / ERROR ******************************/
/* Box Errors */
.box-errors {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    width: 100%;
    margin-top: 45px;
    padding: 15px;
    background: #fcfcfc;
    border: 1px solid #da2e33;
    text-align: center;
}

    .box-errors:before {
        content: '\f071';
        font-family: 'fontAwesome';
        position: absolute;
        top: -24px;
        left: 0;
        font-size: 16px;
        color: #da2e33;
    }

    .box-errors:after {
        content: 'Se han producido varios errores...';
        position: absolute;
        top: -20px;
        left: 20px;
        font-family: OpenSans-Bold;
        font-size: 12px;
        color: #da2e33;
        text-transform: uppercase;
    }

    .box-errors p {
        margin: 0;
        font-family: OpenSans-Semibold;
        font-size: 12px;
        color: #333333;
    }
/* Error Message */
.error-message {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    width: 100%;
    margin-top: 25px;
    padding: 5px 10px;
    background: #fcfcfc;
    border: 1px solid #da2e33;
    text-align: left;
}

    .error-message:before {
        content: '';
        position: absolute;
        top: -8px;
        left: 15px;
        width: 15px;
        height: 15px;
        background: #fcfcfc;
        border-left: 1px solid #da2e33;
        border-top: 1px solid #da2e33;
        transform: rotateZ(45deg);
    }

    .error-message .error-message-title i {
        margin-right: 5px;
        font-size: 16px;
        color: #da2e33;
    }

    .error-message .error-message-title span {
        font-family: OpenSans-Bold;
        font-size: 12px;
        color: #da2e33;
    }

    .error-message .error-message-text {
        font-family: OpenSans-Semibold;
        font-size: 12px;
        color: #da2e33;
    }

    .error-message.error-message-left,
    .error-message.error-message-right {
        display: inline-block;
        vertical-align: middle;
    }

    .error-message.error-message-left {
        margin-right: 2%;
        width: 58%;
    }

    .error-message.error-message-right {
        margin-left: 2%;
        width: 38%;
    }
/************************* COMPONENTS / DROPDOWN ******************************/
.dropdown button,
.dropup button,
.dropdown .button,
.dropup .button {
    background: #da2e33;
    border: none;
    color: #ffffff;
}

    .dropdown button:hover,
    .dropup button:hover,
    .dropdown .button:hover,
    .dropup .button:hover {
        background: #666666;
        color: #ffffff;
    }

    .dropdown button.btn-default.active.focus,
    .dropup button.btn-default.active.focus,
    .dropdown .button.btn-default.active.focus,
    .dropup .button.btn-default.active.focus,
    .dropdown button.btn-default:active.focus,
    .dropup button.btn-default:active.focus,
    .dropdown .button.btn-default:active.focus,
    .dropup .button.btn-default:active.focus,
    .dropdown button.btn-default.active:focus,
    .dropup button.btn-default.active:focus,
    .dropdown .button.btn-default.active:focus,
    .dropup .button.btn-default.active:focus,
    .dropdown button.btn-default:active:focus,
    .dropup button.btn-default:active:focus,
    .dropdown .button.btn-default:active:focus,
    .dropup .button.btn-default:active:focus,
    .dropdown button.btn-default.active:hover,
    .dropup button.btn-default.active:hover,
    .dropdown .button.btn-default.active:hover,
    .dropup .button.btn-default.active:hover,
    .dropdown button.btn-default:active:hover,
    .dropup button.btn-default:active:hover,
    .dropdown .button.btn-default:active:hover,
    .dropup .button.btn-default:active:hover {
        background: #666666;
        color: #ffffff;
    }

.dropdown.open > .dropdown-toggle.btn-default.focus,
.dropup.open > .dropdown-toggle.btn-default.focus,
.dropdown.open > .dropdown-toggle.btn-default:focus,
.dropup.open > .dropdown-toggle.btn-default:focus,
.dropdown.open > .dropdown-toggle.btn-default:hover,
.dropup.open > .dropdown-toggle.btn-default:hover {
    background: #666666;
    color: #ffffff;
}

.dropdown .caret,
.dropup .caret {
    color: #ffffff;
}

.dropdown ul li:before,
.dropup ul li:before {
    display: none;
}
/************************* COMPONENTS / POPUP ******************************/
.popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    text-align: center;
    visibility: hidden;
    opacity: 0;
    transition: .2s all linear;
    z-index: 100;
}

    .popup .popup-layout {
        display: inline-block;
        vertical-align: middle;
        position: relative;
        top: 50%;
        margin-top: -180px;
        width: 600px;
        padding: 25px;
        background: #ffffff;
        box-shadow: 1px 1px 10px 3px rgba(0, 0, 0, 0.3);
        -webkit-box-shadow: 1px 1px 10px 3px rgba(0, 0, 0, 0.3);
    }

        .popup .popup-layout .popup-content {
            max-height: 141px;
            overflow: auto;
        }

            .popup .popup-layout .popup-content p.popup-content-important {
                font-family: OpenSans-Bold;
            }

        .popup .popup-layout .popup-actions button,
        .popup .popup-layout .popup-actions .button {
            cursor: pointer;
        }

    .popup.opened {
        visibility: visible;
        opacity: 1;
    }
/************************* COMPONENTS / TOOLTIP ******************************/
.tooltip .tooltip-inner {
    padding-top: 1px;
    background: #da2e33;
    font-family: OpenSans-Light;
    font-size: 13px;
}

.tooltip.top .tooltip-arrow {
    border-top-color: #da2e33;
}

.tooltip.right .tooltip-arrow {
    border-right-color: #da2e33;
}

.tooltip.bottom .tooltip-arrow {
    border-bottom-color: #da2e33;
}

.tooltip.left .tooltip-arrow {
    border-left-color: #da2e33;
}
/************************* COMPONENTS / POPOVER ******************************/
.popover {
    background: #ffffff;
    border-color: #d3d3d3;
    box-shadow: none;
    -webkit-box-shadow: none;
}

    .popover .popover-content {
        font-family: OpenSans-Light;
        font-size: 13px;
    }

    .popover.top .arrow {
        border-top-color: #d3d3d3;
    }

        .popover.top .arrow:after {
            border-top-color: #ffffff;
        }

    .popover.right .arrow {
        border-right-color: #d3d3d3;
    }

        .popover.right .arrow:after {
            border-right-color: #ffffff;
        }

    .popover.bottom .arrow {
        border-bottom-color: #d3d3d3;
    }

        .popover.bottom .arrow:after {
            border-bottom-color: #ffffff;
        }

    .popover.left .arrow {
        border-left-color: #d3d3d3;
    }

        .popover.left .arrow:after {
            border-left-color: #ffffff;
        }
/************************* COMPONENTS / ACCORDION ******************************/
.accordion.panel-group {
    margin-bottom: 0;
}

    .accordion.panel-group .panel {
        border-radius: 0;
        box-shadow: none;
        -webkit-box-shadow: none;
    }

        .accordion.panel-group .panel .panel-heading {
            border-radius: 0;
        }

            .accordion.panel-group .panel .panel-heading .panel-title a {
                font-family: OpenSans-Bold;
                font-size: 14px;
                text-transform: uppercase;
            }

        .accordion.panel-group .panel .panel-collapse .panel-body {
            font-family: OpenSans-Light;
            font-size: 13px;
        }
/************************* COMPONENTS / COLLAPSABLE ******************************/
.collapsable.panel-group {
    margin-bottom: 0;
}

    .collapsable.panel-group .panel {
        border: none;
        border-radius: 0;
        box-shadow: none;
        -webkit-box-shadow: none;
    }

        .collapsable.panel-group .panel .panel-heading {
            padding: 0;
            background: transparent;
            border-radius: 0;
        }

            .collapsable.panel-group .panel .panel-heading .panel-title a {
                display: inline-block;
                vertical-align: middle;
                padding: 10px 15px;
                background: #3f494c;
                font-family: OpenSans-Bold;
                font-size: 14px;
                color: #ffffff;
                text-transform: uppercase;
            }

                .collapsable.panel-group .panel .panel-heading .panel-title a:hover {
                    color: #e9e9e9;
                }

        .collapsable.panel-group .panel .panel-collapse {
            font-family: OpenSans-Light;
            font-size: 13px;
        }

            .collapsable.panel-group .panel .panel-collapse .list-group {
                border: none;
            }

                .collapsable.panel-group .panel .panel-collapse .list-group .list-group-item {
                    margin: 5px 0;
                    border: 1px solid #e9e9e9;
                }

                    .collapsable.panel-group .panel .panel-collapse .list-group .list-group-item:first-child {
                        margin-top: 15px;
                    }

                    .collapsable.panel-group .panel .panel-collapse .list-group .list-group-item:last-child {
                        margin-bottom: 15px;
                    }

                    .collapsable.panel-group .panel .panel-collapse .list-group .list-group-item:before {
                        display: none;
                    }
/************************* COMPONENTS / PAGINATION ******************************/
.pagination {
    width: 100%;
    margin: 20px 0 0 0;
    border-radius: 0;
    text-align: center;
}

    .pagination .results {
        margin-bottom: 15px;
        font-family: OpenSans-Light;
        font-weight: normal;
        color: #959597;
    }

        .pagination .results span {
            font-family: OpenSans-Bold;
            font-weight: bold;
            color: #da2e33;
        }

    .pagination .pages span {
        display: inline-block;
        vertical-align: middle;
        width: 30px;
        height: 30px;
        margin-bottom: 5px;
        background: #ffffff;
        border: 1px solid #cccccc;
        font-family: OpenSans-Bold;
        font-size: 12px;
        color: #959597;
        text-align: center;
        line-height: 30px;
    }

        .pagination .pages span:hover {
            background: #da2e33;
            border: 1px solid #da2e33;
            color: #ffffff;
            cursor: pointer;
        }

        .pagination .pages span.page-actual {
            background: #da2e33;
            border: 1px solid #da2e33;
            color: #ffffff;
        }

            .pagination .pages span.page-actual:hover {
                cursor: default;
            }

        .pagination .pages span.page-points {
            border: none;
        }

            .pagination .pages span.page-points:hover {
                background: none;
                color: #959597;
                cursor: default;
            }
/************************* COMPONENTS / CODE ******************************/
#postal-lay {
    display: none;
}

    #postal-lay.active {
        display: block;
    }

#postal-form-1 {
    display: block;
}

    #postal-form-1.inactive {
        display: none;
    }

#postal-form-2 {
    display: none;
}

    #postal-form-2.active {
        display: block;
    }
/************************* COMPONENTS / CAROUSEL ******************************/
.carousel {
    display: inline-block;
    vertical-align: middle;
    width: 100%;
    height: 350px;
    border: 5px solid rgba(0, 0, 0, 0.1);
    text-align: center;
}

    .carousel .carousel-inner {
        width: 100%;
        height: 100%;
    }

        .carousel .carousel-inner .item {
            width: 100%;
            height: 100%;
            line-height: 335px;
        }

            .carousel .carousel-inner .item img {
                display: inline-block;
                vertical-align: middle;
                max-width: 100%;
                max-height: 100%;
            }

    .carousel .carousel-caption {
        bottom: 40px;
        padding: 0;
        text-shadow: 0 0 3px rgba(0, 0, 0, 0.6);
    }

        .carousel .carousel-caption h3 {
            font-family: OpenSans-Bold;
            font-size: 20px;
            color: #ffffff;
            text-transform: uppercase;
        }

        .carousel .carousel-caption p {
            font-family: OpenSans-Semibold;
            font-size: 16px;
            line-height: 16px;
            color: #e9e9e9;
        }

    .carousel .carousel-control {
        background-image: none;
        text-shadow: none;
    }

        .carousel .carousel-control .fa {
            position: absolute;
            top: 50%;
            margin-top: -35px;
            font-size: 75px;
            color: rgba(0, 0, 0, 0.9);
        }

        .carousel .carousel-control.left .fa {
            left: 25px;
        }

        .carousel .carousel-control.right .fa {
            right: 25px;
        }

        .carousel .carousel-control:hover,
        .carousel .carousel-control:focus {
            opacity: 1;
        }

            .carousel .carousel-control:hover .fa,
            .carousel .carousel-control:focus .fa {
                color: #da2e33;
            }

    .carousel .carousel-indicators {
        bottom: 0;
        left: 0;
        margin-left: 0;
        margin-bottom: 0;
        padding: 5px 0 15px 0;
        width: 100%;
        overflow: hidden;
    }

        .carousel .carousel-indicators li {
            visibility: hidden;
            width: 15px;
            height: 15px;
            margin: 0;
            border-color: rgba(0, 0, 0, 0.1);
            background: rgba(0, 0, 0, 0.1);
            opacity: 0;
            transition: .3s all linear;
        }

            .carousel .carousel-indicators li.active {
                background: #da2e33;
                border-color: #da2e33;
                opacity: 0;
            }

            .carousel .carousel-indicators li:before {
                display: none;
            }

        .carousel .carousel-indicators:hover li {
            visibility: visible;
            opacity: .5;
        }

            .carousel .carousel-indicators:hover li.active {
                opacity: 1;
            }
/************************* COMPONENTS / LEGEND ******************************/
.legend {
    display: inline-block;
    vertical-align: middle;
    position: relative;
}

    .legend .legend-box {
        position: absolute;
        top: 46px;
        right: 0;
        width: 200px;
        padding: 10px;
        background: #fcfcfc;
        border: 1px solid #cccccc;
        font-size: 12px;
        z-index: 50;
        visibility: hidden;
        opacity: 0;
        transition: 0.1s all ease-in-out;
    }

        .legend .legend-box:before {
            content: '\f0d7';
            position: absolute;
            top: -16px;
            right: 0;
            padding: 0 13px 9px 190px;
            font-family: 'fontAwesome';
            color: #a3a3a3;
        }

        .legend .legend-box .legend-title,
        .legend .legend-box .legend-item {
            display: inline-block;
            vertical-align: middle;
            width: 100%;
            margin-bottom: 10px;
        }

        .legend .legend-box .legend-title {
            padding-bottom: 5px;
            border-bottom: 1px solid #d3d3d3;
            font-family: OpenSans-Bold;
            font-size: 13px;
            color: #da2e33;
            text-transform: uppercase;
            text-align: center;
        }

        .legend .legend-box .legend-item:last-child {
            margin-bottom: 0;
        }

        .legend .legend-box .legend-item span,
        .legend .legend-box .legend-item i {
            display: inline-block;
            vertical-align: middle;
        }

        .legend .legend-box .legend-item span {
            width: 139px;
            padding-left: 10px;
            font-family: OpenSans-Semibold;
            text-align: left;
        }

        .legend .legend-box .legend-item i:hover {
            background: #8c9294;
        }

        .legend .legend-box .legend-item i.menu-icon-red {
            background: #da2e33;
            color: #ffffff;
        }

        .legend .legend-box .legend-item i.menu-icon-orange {
            background: #da672e;
            color: #ffffff;
        }

        .legend .legend-box .legend-item i.menu-icon-green {
            background: #49b84d;
            color: #ffffff;
        }

    .legend:hover .legend-box,
    .legend.legend-visible .legend-box {
        visibility: visible;
        opacity: 1;
    }

    .legend:hover .menu-icon.info-icon,
    .legend.legend-visible .menu-icon.info-icon {
        background: #cccccc;
        color: #ffffff;
    }

    .legend.legend-visible .legend-box {
        position: relative;
        top: initial;
        right: initial;
        visibility: visible;
        opacity: 1;
    }

        .legend.legend-visible .legend-box:before {
            display: none;
        }
/************************* COMPONENTS / TABLES ******************************/
/***** TABLES *****/
.table {
    margin-bottom: 0;
    /* Table Rows */
    /* Table Header Styles */
}

    .table .file {
        display: flex;
        display: -webkit-flex;
        flex-direction: row;
        -webkit-flex-direction: row;
        flex-grow: 0;
        -webkit-flex-grow: 0;
        flex-wrap: wrap;
        -webkit-flex-wrap: wrap;
        width: 100%;
        /* Table Cells */
    }

        .table .file .cell {
            position: relative;
            display: flex;
            display: -webkit-flex;
            flex-grow: 1;
            -webkit-flex-grow: 1;
            align-items: center;
            -webkit-align-items: center;
            padding-right: 20px;
            width: 180px;
            text-align: left;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

            .table .file .cell .subcell {
                display: block;
            }

            .table .file .cell.auto {
                width: 60px;
            }

            .table .file .cell.super {
                max-width: 150px;
            }

            .table .file .cell.big {
                max-width: 120px;
            }

            .table .file .cell.med {
                max-width: 100px;
            }

            .table .file .cell.min {
                max-width: 70px;
            }

            .table .file .cell.good span {
                display: inline-block;
                vertical-align: middle;
                min-width: 40px;
                height: 25px;
                padding: 0 5px;
                background: #49b84d;
                border-radius: 5px;
                font-family: OpenSans-Bold;
                line-height: 25px;
                color: #ffffff;
                text-align: center;
            }

            .table .file .cell.regular span {
                display: inline-block;
                vertical-align: middle;
                min-width: 40px;
                height: 25px;
                padding: 0 5px;
                background: #da672e;
                border-radius: 5px;
                font-family: OpenSans-Bold;
                line-height: 25px;
                color: #ffffff;
                text-align: center;
            }

            .table .file .cell.bad span {
                display: inline-block;
                vertical-align: middle;
                min-width: 40px;
                height: 25px;
                padding: 0 5px;
                background: #da2e33;
                border-radius: 5px;
                font-family: OpenSans-Bold;
                line-height: 25px;
                color: #ffffff;
                text-align: center;
            }

            .table .file .cell.align-left {
                justify-content: flex-start;
                -webkit-justify-content: flex-start;
                align-items: center;
                -webkit-align-items: center;
            }

            .table .file .cell.align-center {
                justify-content: center;
                -webkit-justify-content: center;
                align-items: center;
                -webkit-align-items: center;
            }

            .table .file .cell.align-right {
                justify-content: flex-end;
                -webkit-justify-content: flex-end;
                align-items: center;
                -webkit-align-items: center;
            }

            .table .file .cell.paragraph {
                text-align: center;
                white-space: normal;
                overflow: visible;
            }

            .table .file .cell.bold {
                font-family: OpenSans-Bold;
            }

            .table .file .cell i,
            .table .file .cell .menu-icon {
                display: inline-block;
                vertical-align: middle;
                margin-right: 5px;
            }

                .table .file .cell i:last-child,
                .table .file .cell .menu-icon:last-child {
                    margin-right: 0;
                }

                .table .file .cell .menu-icon:link,
                .table .file .cell .menu-icon:visited,
                .table .file .cell .menu-icon:active {
                    color: #ffffff;
                }

                .table .file .cell .menu-icon:hover {
                    background: #8c9294;
                    color: #ffffff;
                }

                .table .file .cell .menu-icon.icon-active {
                    background: #da2e33;
                    color: #ffffff;
                }

        .table .file.good {
            color: #49b84d;
        }

        .table .file.regular {
            color: #da672e;
        }

        .table .file.bad {
            color: #da2e33;
        }

        .table .file.foot {
            background: #F9F9F9;
        }

    .table .thead {
        background: #3f494c;
        color: #fcfcfc;
        line-height: 30px;
        cursor: default;
    }

        .table .thead .file .cell {
            padding: 5px;
            border-right: 1px solid #fff;
            font-family: OpenSans-Semibold;
            font-size: 12px;
            line-height: 20px;
            font-weight: 100;
            text-align: center;
            white-space: initial;
        }

    .table .tbody .file {
        border-bottom: 1px solid #e9e9e9;
        /* Without Border */
        /* With Subfile */
    }

        .table .tbody .file .cell {
            padding: 15px 10px;
            word-break: break-word;
            white-space: normal;
            text-align: center;
        }

        .table .tbody .file.without-border {
            border-bottom: none;
        }

            .table .tbody .file.without-border:hover {
                background: none;
                cursor: auto;
            }

        .table .tbody .file:hover {
            background: #fcfcfc;
            cursor: pointer;
        }

        .table .tbody .file.with-subfile {
            position: relative;
        }

            .table .tbody .file.with-subfile .arrow-icn {
                opacity: .8;
                -ms-transform: rotate(0);
                -webkit-transform: rotate(0);
                transform: rotate(0);
                -webkit-transition: transform 0.3s ease-out;
                -moz-transition: transform 0.3s ease-out;
                -ms-transition: transform 0.3s ease-out;
                -o-transition: transform 0.3s ease-out;
                transition: transform 0.3s ease-out;
            }

            .table .tbody .file.with-subfile.with-subfile-non-collapsed .arrow-icn {
                -ms-transform: rotate(90deg);
                -webkit-transform: rotate(90deg);
                transform: rotate(90deg);
                -webkit-transition: transform 0.3s ease-in;
                -moz-transition: transform 0.3s ease-in;
                -ms-transition: transform 0.3s ease-in;
                -o-transition: transform 0.3s ease-in;
                transition: transform 0.3s ease-in;
            }

    .table .tbody a:hover {
        color: inherit;
    }

        .table .tbody a:hover .file {
            background: #fcfcfc;
            /* Without Border */
        }

            .table .tbody a:hover .file.without-border {
                background: none;
            }

    .table .tfoot .file .cell {
        padding: 15px 10px;
        word-break: break-word;
        white-space: normal;
        font-weight: bold;
        font-family: OpenSans-Bold;
    }

        .table .tfoot .file .cell.table-total {
            text-transform: uppercase;
        }

    .table.h-table .thead {
        background: none;
    }

        .table.h-table .thead .cell {
            position: relative;
            padding: 0;
        }

            .table.h-table .thead .cell input {
                width: 100%;
                padding: 7px 40px;
                background: #e9e9e9;
                border: none;
                color: #333333;
            }

            .table.h-table .thead .cell i {
                position: absolute;
                top: 11px;
                left: 10px;
                font-size: 20px;
                color: #757575;
            }

                .table.h-table .thead .cell i.delete-icn {
                    top: 14px;
                    left: initial;
                    right: 10px;
                    font-size: 16px;
                    color: #a3a3a3;
                    opacity: 0;
                    transition: 0.3s all ease-in-out;
                }

                    .table.h-table .thead .cell i.delete-icn.visible {
                        opacity: 1;
                    }

    .table.h-table .tbody .file {
        margin-top: 5px;
        border: 1px solid #e9e9e9;
    }

        .table.h-table .tbody .file .cell {
            display: inline-block;
            vertical-align: middle;
            position: relative;
            width: 100%;
            padding: 10px 40px 10px 10px;
            background: #F5F5F5;
            font-family: OpenSans-Bold;
            color: #757575;
            text-transform: uppercase;
        }

            .table.h-table .tbody .file .cell:hover {
                cursor: pointer;
            }

            .table.h-table .tbody .file .cell:after {
                content: '\f054';
                position: absolute;
                top: 5.5px;
                right: 15px;
                font-family: 'fontAwesome';
                font-size: 20px;
                color: #666666;
            }

    .table.h-table.own-company .tbody .file .cell {
        background: #ffffff;
    }

    .table.h-table.own-company.no-arrow .tbody .file .cell:after {
        display: none;
    }

    .table.h-table.own-company.is-title .tbody .file .cell {
        padding: 10px;
    }

        .table.h-table.own-company.is-title .tbody .file .cell:hover {
            cursor: default;
        }

    .table.in-table .tbody .file {
        position: relative;
        border: none;
    }

        .table.in-table .tbody .file:hover {
            background: none;
            cursor: auto;
        }

        .table.in-table .tbody .file .cell {
            position: relative;
            border: 1px solid #e9e9e9;
            cursor: auto !important;
        }

            .table.in-table .tbody .file .cell:after {
                display: none;
            }

            .table.in-table .tbody .file .cell.subcell-1 {
                width: 100%;
                margin-right: 170px;
            }

                .table.in-table .tbody .file .cell.subcell-1 input {
                    position: absolute;
                    top: 4px;
                    right: 4px;
                    width: 60px;
                    padding: 5px 0;
                    background: #fafafa;
                    border: 1px solid #e9e9e9;
                    font-family: OpenSans-Semibold;
                    font-size: 12px;
                    color: #222222;
                    text-align: center;
                    pointer-events: none;
                }

                    .table.in-table .tbody .file .cell.subcell-1 input::-webkit-input-placeholder {
                        color: #666666;
                    }

                    .table.in-table .tbody .file .cell.subcell-1 input::-moz-placeholder {
                        color: #666666;
                    }

                    .table.in-table .tbody .file .cell.subcell-1 input:-ms-input-placeholder {
                        color: #666666;
                    }

                    .table.in-table .tbody .file .cell.subcell-1 input:-moz-placeholder {
                        color: #666666;
                    }

                    .table.in-table .tbody .file .cell.subcell-1 input::placeholder {
                        color: #666666;
                    }

                    .table.in-table .tbody .file .cell.subcell-1 input.input-enabled {
                        background: #ffffff;
                        border-color: #cccccc;
                        font-family: OpenSans-Regular;
                        color: #222222;
                        pointer-events: all;
                        cursor: text;
                    }

                        .table.in-table .tbody .file .cell.subcell-1 input.input-enabled::-webkit-input-placeholder {
                            color: #222222;
                        }

                        .table.in-table .tbody .file .cell.subcell-1 input.input-enabled::-moz-placeholder {
                            color: #222222;
                        }

                        .table.in-table .tbody .file .cell.subcell-1 input.input-enabled:-ms-input-placeholder {
                            color: #222222;
                        }

                        .table.in-table .tbody .file .cell.subcell-1 input.input-enabled:-moz-placeholder {
                            color: #222222;
                        }

                        .table.in-table .tbody .file .cell.subcell-1 input.input-enabled::placeholder {
                            color: #222222;
                        }

            .table.in-table .tbody .file .cell.subcell-2 {
                position: absolute;
                top: 0;
                right: 0;
                width: 170px;
                padding: 5px 0;
                background: #ffffff;
                border: none;
                text-align: right;
                cursor: auto;
            }

                .table.in-table .tbody .file .cell.subcell-2 input {
                    display: inline-block;
                    vertical-align: middle;
                    position: relative;
                    top: 0;
                    left: 0;
                    width: 115px;
                    margin-right: 10px;
                    padding: 5px 0;
                    border-top: none;
                    border-bottom: none;
                    border-left: 1px solid #ddd;
                    border-right: 1px solid #ddd;
                    font-family: OpenSans-Bold;
                    font-size: 12px;
                    color: #757575;
                    text-align: center;
                    pointer-events: none;
                }

                    .table.in-table .tbody .file .cell.subcell-2 input::-webkit-input-placeholder {
                        color: #757575;
                    }

                    .table.in-table .tbody .file .cell.subcell-2 input::-moz-placeholder {
                        color: #757575;
                    }

                    .table.in-table .tbody .file .cell.subcell-2 input:-ms-input-placeholder {
                        color: #757575;
                    }

                    .table.in-table .tbody .file .cell.subcell-2 input:-moz-placeholder {
                        color: #757575;
                    }

                    .table.in-table .tbody .file .cell.subcell-2 input::placeholder {
                        color: #757575;
                    }

                .table.in-table .tbody .file .cell.subcell-2 i {
                    width: 29px;
                    height: 29px;
                    padding-left: 1px;
                    font-size: 14px;
                    line-height: 30px;
                    transition: none;
                }

                    .table.in-table .tbody .file .cell.subcell-2 i.fa-save {
                        background: #da2e33;
                        font-size: 15px;
                    }

                .table.in-table .tbody .file .cell.subcell-2 .subcell-icons {
                    display: inline-block;
                    vertical-align: middle;
                    position: relative;
                }

                    .table.in-table .tbody .file .cell.subcell-2 .subcell-icons i {
                        cursor: pointer;
                    }

.table-titles {
    position: relative;
    margin-bottom: 15px;
    font-size: 0;
}

    .table-titles .table-titles-left,
    .table-titles .table-titles-right {
        display: inline-block;
        vertical-align: middle;
        font-family: OpenSans-Bold;
        font-size: 12px;
        color: #666666;
        text-transform: uppercase;
    }

    .table-titles .table-titles-left {
        width: 100%;
        padding-right: 176px;
        text-align: right;
    }

    .table-titles .table-titles-right {
        position: absolute;
        top: 0;
        right: 0;
        width: 170px;
        padding-left: 38px;
        text-align: left;
    }
/******************/
.ie9 .table .file {
    display: table;
    vertical-align: middle;
}

    .ie9 .table .file .cell {
        display: table-cell;
        vertical-align: middle;
        width: 10%;
    }
/***** REPSONSIVE TABLES *****/
@media (max-width: 1023px) {
    .table.s-table .thead .file,
    .table.s-table .tbody .file,
    .table.s-table .tfoot .file {
        flex-direction: column;
    }

        .table.s-table .thead .file .cell.paragraph,
        .table.s-table .tbody .file .cell.paragraph,
        .table.s-table .tfoot .file .cell.paragraph {
            text-align: left;
        }

    .table.s-table .thead .file {
        text-align: center;
    }

        .table.s-table .thead .file:before {
            content: attr(data-th);
            width: 100%;
            font-family: OpenSans-Semibold;
        }

        .table.s-table .thead .file .cell {
            display: none;
        }

    .table.s-table .tbody {
        max-height: initial;
    }

        .table.s-table .tbody .file {
            position: relative;
            padding: 10px 0;
        }

            .table.s-table .tbody .file:before {
                display: none;
            }

            .table.s-table .tbody .file .cell {
                display: block;
                width: auto;
                max-width: initial;
                padding: 5px 10px;
                justify-content: center;
                -webkit-justify-content: center;
                align-items: center;
                -webkit-align-items: center;
                font-family: OpenSans-Regular;
                color: #333333;
                font-weight: 100;
                text-align: left;
            }

                .table.s-table .tbody .file .cell:before {
                    content: attr(data-th) ": ";
                    margin-right: 5px;
                    font-family: OpenSans-Bold;
                    color: #da2e33;
                    text-transform: uppercase;
                }

            .table.s-table .tbody .file.good:after {
                content: '\f164';
                position: absolute;
                bottom: 10px;
                right: 10px;
                font-family: 'fontAwesome';
                font-size: 20px;
                color: #49b84d;
            }

            .table.s-table .tbody .file.bad:after {
                content: '\f165';
                position: absolute;
                bottom: 10px;
                right: 10px;
                font-family: 'fontAwesome';
                font-size: 20px;
                color: #da2e33;
            }

    .table.s-table .tfoot {
        max-height: initial;
    }

        .table.s-table .tfoot .file {
            position: relative;
            padding: 10px 0;
        }

            .table.s-table .tfoot .file:before {
                display: none;
            }

            .table.s-table .tfoot .file .cell {
                display: block;
                width: auto;
                max-width: initial;
                padding: 5px 10px;
                justify-content: center;
                -webkit-justify-content: center;
                align-items: center;
                -webkit-align-items: center;
                font-family: OpenSans-Regular;
                color: #333333;
                font-weight: 100;
                text-align: left;
            }

                .table.s-table .tfoot .file .cell:before {
                    content: attr(data-th) ": ";
                    margin-right: 5px;
                    font-family: OpenSans-Bold;
                    color: #333333;
                    text-transform: uppercase;
                }

                .table.s-table .tfoot .file .cell:not([data-th]) {
                    display: none;
                }

    .ie9 .table.s-table .file .cell {
        width: auto;
        white-space: nowrap;
    }

        .ie9 .table.s-table .file .cell:before {
            white-space: nowrap;
        }
}

@media (max-width: 767px) {
    .table.m-table .thead .file,
    .table.m-table .tbody .file,
    .table.m-table .tfoot .file {
        flex-direction: column;
    }

        .table.m-table .thead .file .cell.paragraph,
        .table.m-table .tbody .file .cell.paragraph,
        .table.m-table .tfoot .file .cell.paragraph {
            text-align: left;
        }

    .table.m-table .thead .file {
        text-align: center;
    }

        .table.m-table .thead .file:before {
            content: attr(data-th);
            width: 100%;
            font-family: OpenSans-Semibold;
        }

        .table.m-table .thead .file .cell {
            display: none;
        }

    .table.m-table .tbody {
        max-height: initial;
    }

        .table.m-table .tbody .file {
            position: relative;
            padding: 10px 0;
        }

            .table.m-table .tbody .file:before {
                display: none;
            }

            .table.m-table .tbody .file .cell {
                display: block;
                width: auto;
                max-width: initial;
                padding: 3px 10px;
                justify-content: center;
                -webkit-justify-content: center;
                align-items: center;
                -webkit-align-items: center;
                font-family: OpenSans-Regular;
                color: #333333;
                font-weight: 100;
                text-align: left;
            }

                .table.m-table .tbody .file .cell:before {
                    content: attr(data-th) ": ";
                    margin-right: 5px;
                    font-family: OpenSans-Bold;
                    color: #da2e33;
                    text-transform: uppercase;
                }

            .table.m-table .tbody .file.good:after {
                content: '\f164';
                position: absolute;
                bottom: 10px;
                right: 10px;
                font-family: 'fontAwesome';
                font-size: 20px;
                color: #49b84d;
            }

            .table.m-table .tbody .file.bad:after {
                content: '\f165';
                position: absolute;
                bottom: 10px;
                right: 10px;
                font-family: 'fontAwesome';
                font-size: 20px;
                color: #da2e33;
            }

    .table.m-table .tfoot {
        max-height: initial;
    }

        .table.m-table .tfoot .file {
            position: relative;
            padding: 10px 0;
        }

            .table.m-table .tfoot .file:before {
                display: none;
            }

            .table.m-table .tfoot .file .cell {
                display: block;
                width: auto;
                max-width: initial;
                padding: 5px 10px;
                justify-content: center;
                -webkit-justify-content: center;
                align-items: center;
                -webkit-align-items: center;
                font-family: OpenSans-Regular;
                color: #333333;
                font-weight: 100;
                text-align: left;
            }

                .table.m-table .tfoot .file .cell:before {
                    content: attr(data-th) ": ";
                    margin-right: 5px;
                    font-family: OpenSans-Bold;
                    color: #333333;
                    text-transform: uppercase;
                }

                .table.m-table .tfoot .file .cell:not([data-th]) {
                    display: none;
                }

    .ie9 .table.m-table .file .cell {
        width: auto;
        white-space: nowrap;
    }

        .ie9 .table.m-table .file .cell:before {
            white-space: nowrap;
        }
}
/************************* COMPONENTS / BOX ******************************/
.box {
    margin-top: 30px;
    padding: 25px 45px;
    background: #fafafa;
    border: 1px solid #e9e9e9;
}
/************************* COMPONENTS / ALERT ******************************/
.subtitle-alert {
    position: relative;
}

    .subtitle-alert .subtitle-alert-date,
    .subtitle-alert .subtitle-alert-title {
        display: block;
    }

    .subtitle-alert .subtitle-alert-date {
        margin-bottom: 5px;
        font-family: OpenSans-Light;
        font-size: 12px;
        color: #888888;
    }

    .subtitle-alert .subtitle-alert-title {
        padding-right: 120px;
        font-family: OpenSans-Bold;
        font-size: 18px;
        color: #da2e33;
        text-transform: uppercase;
    }

    .subtitle-alert .switch {
        position: absolute;
        top: 15px;
        right: 0;
    }

        .subtitle-alert .switch .switch-on,
        .subtitle-alert .switch .switch-off {
            right: initial;
            left: -100px;
            width: 100px;
            padding-left: initial;
            padding-right: 10px;
            text-align: right;
        }

            .subtitle-alert .switch .switch-on:after {
                content: '\f06e';
                display: inline-block;
                vertical-align: middle;
                position: relative;
                top: -2px;
                margin-left: 5px;
                font-family: 'fontAwesome';
                font-size: 16px;
                line-height: 12px;
            }

            .subtitle-alert .switch .switch-off:after {
                content: '\f070';
                display: inline-block;
                vertical-align: middle;
                position: relative;
                top: -2px;
                margin-left: 5px;
                font-family: 'fontAwesome';
                font-size: 16px;
                line-height: 12px;
            }

.switch {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    width: 45px;
    height: 17px;
    background: #b1cfd8;
    border: 1px solid #ffffff;
    border-radius: 25px;
    cursor: pointer;
}

    .switch:before {
        content: '';
        display: inline-block;
        vertical-align: middle;
        position: absolute;
        top: -4px;
        right: -3px;
        width: 23px;
        height: 23px;
        background: #2d6c9a;
        border-radius: 50%;
        transition: 0.2s all ease-in-out;
    }

    .switch .switch-on,
    .switch .switch-off {
        position: absolute;
        top: 0;
        right: -200px;
        width: 200px;
        height: 15px;
        padding-left: 10px;
        font-family: OpenSans-Bold;
        font-size: 11px;
        line-height: 15px;
        color: #666666;
        text-transform: uppercase;
        text-align: left;
        transition: 0.2s all ease-in-out;
    }

    .switch .switch-on {
        visibility: visible;
        opacity: 1;
    }

    .switch .switch-off {
        visibility: hidden;
        opacity: 0;
    }

    .switch.switch-actuated {
        background: #cccccc;
    }

        .switch.switch-actuated:before {
            background: #959597;
            transform: translateX(-25px);
        }

        .switch.switch-actuated .switch-on {
            visibility: hidden;
            opacity: 0;
        }

        .switch.switch-actuated .switch-off {
            visibility: visible;
            opacity: 1;
        }

.attached-files {
    max-height: 120px;
    padding: 13px 10px 0 10px;
    border: 1px solid #efefef;
    font-size: 0;
    overflow: auto;
}

    .attached-files .file {
        display: inline-block;
        vertical-align: middle;
        width: 20%;
        margin-bottom: 13px;
        font-size: 0;
        white-space: nowrap;
    }

        .attached-files .file:hover .file-info .file-title {
            text-decoration: underline;
        }

        .attached-files .file .file-info {
            display: inline-block;
            vertical-align: middle;
            max-width: 65%;
            margin-left: 5px;
            overflow: hidden;
        }

            .attached-files .file .file-info .file-title,
            .attached-files .file .file-info .file-size {
                display: block;
            }

            .attached-files .file .file-info .file-title {
                max-width: 100%;
                font-family: OpenSans-Bold;
                font-size: 12px;
                color: #3f494c;
                text-overflow: ellipsis;
                overflow: hidden;
            }

            .attached-files .file .file-info .file-size {
                font-family: OpenSans-Light;
                font-size: 12px;
                color: #3f494c;
            }

        .attached-files .file .file-type {
            display: inline-block;
            vertical-align: middle;
        }

            .attached-files .file .file-type:before {
                content: '';
                display: inline-block;
                vertical-align: middle;
                width: 40px;
                height: 40px;
            }

            .attached-files .file .file-type.file-type-pdf:before {
                background: url('../images/icons/pdf.svg');
                background-size: cover;
            }

            .attached-files .file .file-type.file-type-doc:before {
                background: url('../images/icons/doc.svg');
                background-size: cover;
            }

            .attached-files .file .file-type.file-type-txt:before {
                background: url('../images/icons/txt.svg');
                background-size: cover;
            }

            .attached-files .file .file-type.file-type-xls:before {
                background: url('../images/icons/xls.svg');
                background-size: cover;
            }

            .attached-files .file .file-type.file-type-ppt:before {
                background: url('../images/icons/ppt.svg');
                background-size: cover;
            }

            .attached-files .file .file-type.file-type-zip:before {
                background: url('../images/icons/zip.svg');
                background-size: cover;
            }

            .attached-files .file .file-type.file-type-jpg:before {
                background: url('../images/icons/jpg.svg');
                background-size: cover;
            }

            .attached-files .file .file-type.file-type-png:before {
                background: url('../images/icons/png.svg');
                background-size: cover;
            }

            .attached-files .file .file-type.file-type-svg:before {
                background: url('../images/icons/svg.svg');
                background-size: cover;
            }

            .attached-files .file .file-type.file-type-psd:before {
                background: url('../images/icons/psd.svg');
                background-size: cover;
            }

            .attached-files .file .file-type.file-type-mp3:before {
                background: url('../images/icons/mp3.svg');
                background-size: cover;
            }

            .attached-files .file .file-type.file-type-mp4:before {
                background: url('../images/icons/mp4.svg');
                background-size: cover;
            }

            .attached-files .file .file-type.file-type-avi:before {
                background: url('../images/icons/avi.svg');
                background-size: cover;
            }

            .attached-files .file .file-type.file-type-html:before {
                background: url('../images/icons/html.svg');
                background-size: cover;
            }

            .attached-files .file .file-type.file-type-url:before {
                background: url('../images/icons/url.svg');
                background-size: cover;
            }

            .attached-files .file .file-type.file-type-noext:before {
                background: url('../images/icons/noextension-1.svg');
                background-size: cover;
            }

    .attached-files.attached-files-user {
        max-height: initial;
        padding: 5px 0;
        border: none;
    }

        .attached-files.attached-files-user .file {
            position: relative;
            width: initial;
            margin-bottom: 10px;
            padding-right: 50px;
        }

            .attached-files.attached-files-user .file:hover .file-info .file-title {
                text-decoration: none;
            }

            .attached-files.attached-files-user .file:hover .file-info .file-delete {
                visibility: visible;
                opacity: 1;
            }

            .attached-files.attached-files-user .file .file-info {
                max-width: initial;
            }

                .attached-files.attached-files-user .file .file-info .file-title {
                    font-family: OpenSans-Regular;
                    font-size: 12px;
                    color: #3f494c;
                    overflow: initial;
                    text-overflow: initial;
                }

                    .attached-files.attached-files-user .file .file-info .file-title:hover .file-title-name {
                        text-decoration: underline;
                    }

                    .attached-files.attached-files-user .file .file-info .file-title .file-title-name {
                        display: block;
                        font-family: OpenSans-Regular;
                        font-size: 12px;
                    }

                    .attached-files.attached-files-user .file .file-info .file-title .file-title-size {
                        display: block;
                        font-family: OpenSans-Bold;
                        font-size: 10px;
                    }

                .attached-files.attached-files-user .file .file-info .file-delete {
                    display: inline-block;
                    vertical-align: middle;
                    position: absolute;
                    top: 8px;
                    right: 25px;
                    width: 15px;
                    height: 15px;
                    padding: 4px;
                    background: #b30721;
                    border-radius: 50%;
                    visibility: hidden;
                    opacity: 0;
                    transition: 0.1s all ease-in-out;
                    cursor: pointer;
                }

                    .attached-files.attached-files-user .file .file-info .file-delete:hover {
                        background: #da2e33;
                    }

                    .attached-files.attached-files-user .file .file-info .file-delete img {
                        width: 100%;
                        height: auto;
                    }

            .attached-files.attached-files-user .file .file-type:before {
                width: 25px;
                height: 25px;
                margin-top: 2px;
            }

.alert-title {
    display: inline-block;
    vertical-align: middle;
    width: 100%;
    margin-bottom: 10px;
    font-family: OpenSans-Bold;
    font-size: 14px;
    color: #3f494c;
    text-transform: uppercase;
}

.alert-content {
    display: inline-block;
    vertical-align: middle;
    width: 100%;
    padding: 15px 20px 7px 20px;
    background: #efefef;
}

    .alert-content p {
        font-family: OpenSans-Regular;
        font-size: 14px;
        color: #3f494c;
    }

    .alert-content strong {
        font-family: OpenSans-Bold;
        font-size: 14px;
        font-weight: 100;
        color: #3f494c;
    }

.alert-comments textarea {
    display: block;
    width: 100%;
    height: 150px;
    padding: 20px 3px;
    border-top: 1px solid #efefef;
    border-bottom: 1px solid #efefef;
    border-left: none;
    border-right: none;
    font-family: OpenSans-Regular;
    font-size: 14px;
    color: #888888;
    overflow: auto;
    resize: none;
}

.alert-upload .alert-upload-title {
    font-family: OpenSans-Bold;
    font-size: 14px;
    color: #3f494c;
    text-transform: uppercase;
}

.alert-upload .alert-upload-action {
    font-size: 0;
}

    .alert-upload .alert-upload-action input {
        display: inline-block;
        vertical-align: middle;
        width: 84%;
        margin-right: 1%;
        padding: 10px 15px;
        background: #efefef;
        font-size: 12px;
    }

    .alert-upload .alert-upload-action button,
    .alert-upload .alert-upload-action .button {
        display: inline-block;
        vertical-align: middle;
        position: relative;
        width: 10%;
        font-size: 12px;
        text-align: center;
        overflow: hidden;
        cursor: pointer;
    }

        .alert-upload .alert-upload-action button input,
        .alert-upload .alert-upload-action .button input {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
            line-height: 100px;
            opacity: 0;
            -ms-filter: 'alpha(opacity=0)';
            cursor: pointer;
        }

        .alert-upload .alert-upload-action button.btn-grey,
        .alert-upload .alert-upload-action .button.btn-grey {
            background: #666666;
        }

        .alert-upload .alert-upload-action button.upload,
        .alert-upload .alert-upload-action .button.upload {
            width: 4%;
            margin-left: 1%;
        }

.upload-info {
    margin-bottom: 10px;
    padding: 5px 0;
    font-family: OpenSans-Semibold;
    font-size: 12px;
}

    .upload-info .upload-info-ok,
    .upload-info .upload-info-error {
        position: relative;
        padding-left: 22px;
        line-height: 12px;
    }

        .upload-info .upload-info-ok:before,
        .upload-info .upload-info-error:before {
            content: '';
            display: inline-block;
            vertical-align: middle;
            position: absolute;
            left: 0;
            top: 0;
            font-family: 'fontAwesome';
            font-size: 18px;
        }

    .upload-info .upload-info-ok {
        color: #49b84d;
    }

        .upload-info .upload-info-ok:before {
            content: '\f058';
            color: #49b84d;
        }

    .upload-info .upload-info-error {
        color: #da2e33;
    }

        .upload-info .upload-info-error:before {
            content: '\f057';
            color: #da2e33;
        }
/************************* COMPONENTS / GRAPHS ******************************/
/************************* COMPONENTS / GRAPHS / PROGRESS ******************************/
.progressbar {
    font-size: 0;
}

    .progressbar .progressbar-info,
    .progressbar .progressbar-lay {
        display: inline-block;
        vertical-align: middle;
    }

    .progressbar .progressbar-info {
        width: 20%;
        padding: 15px 15px 15px 0;
        font-family: OpenSans-Bold;
        font-size: 12px;
    }

    .progressbar .progressbar-lay {
        width: 80%;
        padding: 0 10px;
        border-left: 1px solid #ccc;
    }

    .progressbar .progressbar-line {
        max-width: 100%;
        height: 80px;
        margin: 0 auto;
    }

.highcharts-container {
    overflow: visible !important;
}

    .highcharts-container svg:not(:root) {
        overflow: visible !important;
    }
/************************* COMPONENTS / GRAPHS / ACCUMULATED ******************************/
.accumulatedbar .accumulatedbar-line {
    max-width: 100%;
    width: 800px;
    height: 300px;
    margin: 0 auto;
}
/************************* COMPONENTS / GRAPHS / CAPTION ******************************/
.caption-box {
    display: inline-block;
    vertical-align: middle;
    width: 100%;
    text-align: center;
}

    .caption-box .caption-layout {
        display: inline-block;
        vertical-align: middle;
        margin: 0 auto;
        padding: 8px 2px 8px 1px;
        font-size: 0;
        background: #ffffff;
        border: 1px solid #e9e9e9;
        border-radius: 20px;
    }

        .caption-box .caption-layout .caption-item {
            margin: 0 12px;
            font-family: OpenSans-Regular;
            font-size: 12px;
            color: #333;
            white-space: nowrap;
        }

            .caption-box .caption-layout .caption-item:before {
                content: '';
                display: inline-block;
                vertical-align: middle;
                position: relative;
                top: -1px;
                width: 12px;
                height: 12px;
                margin-right: 7px;
                background: #cccccc;
                border-radius: 50%;
            }

    .caption-box.caption-box-1 {
        margin-top: 25px;
    }

        .caption-box.caption-box-1 .caption-layout .caption-item:nth-child(1):before {
            background: #d24d3d;
        }

        .caption-box.caption-box-1 .caption-layout .caption-item:nth-child(2):before {
            background: #3d90d2;
        }

        .caption-box.caption-box-1 .caption-layout .caption-item:nth-child(3):before {
            background: #49c04b;
        }

    .caption-box.caption-box-2 {
        margin-top: 5px;
    }

        .caption-box.caption-box-2 .caption-layout .caption-item:nth-child(1):before {
            background: #666;
        }

        .caption-box.caption-box-2 .caption-layout .caption-item:nth-child(2):before {
            background: #888;
        }

        .caption-box.caption-box-2 .caption-layout .caption-item:nth-child(3):before {
            background: #aaa;
        }

        .caption-box.caption-box-2 .caption-layout .caption-item:nth-child(4):before {
            background: #ccc;
        }

        .caption-box.caption-box-2 .caption-layout .caption-item:nth-child(5):before {
            background: #ddd;
        }
/************************* COMPONENTS / SPINNER ******************************/
.loading {
    visibility: hidden;
    opacity: 0;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    text-align: center;
    transition: .2s all linear;
    z-index: 1500;
}

    .loading.opened {
        visibility: visible;
        opacity: 1;
    }

    .loading .loading-icon {
        display: inline-block;
        vertical-align: middle;
        position: absolute;
        top: 50%;
        margin-top: -25px;
        border: 5px solid #e9e9e9;
        border-top: 5px solid #da2e33;
        border-radius: 50%;
        width: 50px;
        height: 50px;
        animation: spinner 1.5s ease infinite;
    }

    .loading.wheel .loading-icon {
        display: inline-block;
        vertical-align: middle;
        position: absolute;
        top: 50%;
        margin-top: -25px;
        border: 5px solid #e9e9e9;
        border-top: 5px solid #da2e33;
        border-radius: 50%;
        width: 50px;
        height: 50px;
        animation: spinner 1.5s ease infinite;
    }

    .loading.wind .loading-icon {
        display: inline-block;
        vertical-align: middle;
        position: absolute;
        width: 100px;
        height: 2px;
        top: 50%;
        margin-top: -1px;
        background: #da2e33;
        border: none;
        border-radius: 0;
        animation: spinner 1.5s ease infinite;
    }

        .loading.wind .loading-icon:before {
            content: '';
            display: inline-block;
            vertical-align: middle;
            position: relative;
            top: -51px;
            left: 0;
            width: 2px;
            height: 100px;
            background: #da2e33;
            border-radius: 0;
            transform: rotateZ(-30deg);
        }

        .loading.wind .loading-icon:after {
            content: '';
            display: inline-block;
            vertical-align: middle;
            position: relative;
            top: -51px;
            left: 0;
            width: 2px;
            height: 100px;
            background: #da2e33;
            border-radius: 0;
            transform: rotateZ(30deg);
        }

    .loading.line .loading-icon {
        display: inline-block;
        vertical-align: middle;
        position: absolute;
        width: 50%;
        height: 5px;
        top: 50%;
        left: -50%;
        margin-top: -3px;
        background: #da2e33;
        border: none;
        border-radius: 0;
        animation: linner 2s ease infinite;
    }
/************************* COMPONENTS / CHAT ******************************/
.messaging {
    display: inline-block;
    vertical-align: middle;
    position: fixed;
    bottom: 20px;
    right: 10px;
    width: 30px;
    height: 30px;
    background: url('../images/icons/messages.svg');
    background-size: 100%;
    background-repeat: no-repeat;
    border-radius: 50%;
    cursor: pointer;
    transition: 0.3s all ease-in-out;
    transition-delay: .3s;
    z-index: 80000;
}

    .messaging.chat-on {
        right: -50px;
    }

        .messaging.chat-on .messaging-num {
            visibility: hidden;
            opacity: 0;
        }

    .messaging .messaging-num {
        display: inline-block;
        vertical-align: middle;
        position: absolute;
        top: -5px;
        left: -5px;
        width: 17px;
        height: 17px;
        background: #da2e33;
        border-radius: 50%;
        font-family: OpenSans-Regular;
        font-size: 10px;
        line-height: 16px;
        color: #ffffff;
        text-transform: uppercase;
        text-align: center;
        transition: 0.3s all ease-in-out;
    }

.subtitle-chat .subtitle-alert-title {
    display: inline-block;
    vertical-align: middle;
}

.chat-return {
    display: none;
    vertical-align: middle;
    width: 25px;
    height: 25px;
    margin-top: -2px;
    font-size: 28px;
    line-height: 24px;
    cursor: pointer;
}

    .chat-return:before {
        content: '\f104';
        font-family: 'fontAwesome';
        color: #444444;
    }

    .chat-return:hover:before {
        color: #959597;
    }

#imagenSend {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
}

.chat {
    position: fixed;
    top: 100%;
    right: 0;
    width: 100%;
    height: 100%;
    padding-bottom: 60px;
    background: #ffffff;
    transition: 0.3s all ease-in-out;
    z-index: 90000;
    /* User Bar */
    /* Conversation */
    /* Messages */
    /* Compose */
    /* Others */
}

    .chat.chat-on {
        top: 0;
    }

    .chat .chat-header {
        display: inline-block;
        vertical-align: middle;
        position: relative;
        width: 100%;
        height: 59px;
        background: #414a4e;
        font-family: OpenSans-Bold;
        font-size: 14px;
        line-height: 59px;
        color: #ffffff;
        text-transform: uppercase;
        text-align: center;
    }

        .chat .chat-header .chat-title {
            margin-top: -2px;
            margin-left: 15px;
            text-align: left;
        }

            .chat .chat-header .chat-title .chat-logo {
                height: 30px;
                transform: translateX(-200px);
                transition: 0.3s all ease-in-out;
                transition-delay: .3s;
            }

                .chat .chat-header .chat-title .chat-logo.chat-on {
                    transform: translateX(0);
                }

        .chat .chat-header .chat-close {
            display: inline-block;
            vertical-align: middle;
            position: absolute;
            top: 20px;
            right: -50px;
            width: 20px;
            height: 20px;
            background: url('../images/icons/close-w.svg');
            background-size: 100%;
            background-repeat: no-repeat;
            cursor: pointer;
            transition: 0.3s all ease-in-out;
            transition-delay: .3s;
            z-index: 91000;
        }

            .chat .chat-header .chat-close.chat-on {
                right: 15px;
            }

    .chat .chat-main {
        display: inline-block;
        vertical-align: middle;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        margin-top: 59px;
        overflow: auto;
    }

    .chat #users {
        display: inline-block;
        vertical-align: middle;
        width: 100%;
        margin: 0 auto;
        overflow: auto;
    }

    .chat .page {
        width: 100%;
        height: 32vw;
        display: flex;
        align-items: center;
        justify-content: center;
        float: left;
        display: none;
    }

    .chat #buttons {
        width: 30%;
        clear: both;
    }

    .chat #imgSend {
        width: auto;
        height: 16px;
        margin: 0 0 0 1px;
    }

    .chat img.logo {
        height: 32px;
        width: 32px;
    }

    .chat .chat-container {
        height: 100%;
    }

    .chat .screen-container {
        width: 100%;
        height: 100%;
    }

    .chat .chat-box {
        height: calc(31%);
    }

    .chat .chat-container {
        height: 100%;
    }

    .chat .user-bar {
        position: relative;
        padding: 10px;
        background: #e9e9e9;
        border-bottom: 1px solid #cccccc;
        box-shadow: 0 0 1px 1px #ffffff;
        font-size: 24px;
        color: #ffffff;
        white-space: nowrap;
        z-index: 1;
    }

        .chat .user-bar:after {
            content: "";
            display: table;
            clear: both;
        }

        .chat .user-bar .actions {
            position: absolute;
            top: 12px;
            right: 10px;
        }

            .chat .user-bar .actions i {
                font-family: OpenSans-Semibold;
                font-size: 24px;
                color: #444444;
                font-style: normal;
            }

        .chat .user-bar .avatar {
            display: inline-block;
            vertical-align: middle;
            width: 36px;
            height: 36px;
            margin-right: 0 0 0 5px;
        }

            .chat .user-bar .avatar img {
                display: block;
                width: 100%;
                background-color: white;
                border-radius: 50%;
                box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1);
            }

        .chat .user-bar .name {
            display: inline-block;
            vertical-align: middle;
            width: 55%;
            margin: 0 0 0 8px;
            font-family: OpenSans-Bold;
            font-size: 14px;
            color: #444444;
            text-overflow: ellipsis;
            letter-spacing: 0.3px;
            overflow: hidden;
            white-space: nowrap;
        }

        .chat .user-bar .status {
            display: block;
            font-family: OpenSans-Regular;
            font-size: 13px;
            color: #959597;
            letter-spacing: 0;
        }

    .chat .conversation {
        position: relative;
        background: #efe7dd url("https://cloud.githubusercontent.com/assets/398893/15136779/4e765036-1639-11e6-9201-67e728e86f39.jpg") repeat;
        z-index: 0;
    }

        .chat .conversation ::-webkit-scrollbar {
            width: 5px;
            height: 1px;
            transition: all .5s;
            z-index: 10;
        }

        .chat .conversation ::-webkit-scrollbar-track {
            background: transparent;
        }

        .chat .conversation ::-webkit-scrollbar-thumb {
            background: #b3ada7;
        }

        .chat .conversation #conversation-container {
            margin-bottom: 5px;
            padding: 0 16px;
            overflow-x: hidden;
        }

            .chat .conversation #conversation-container:after {
                content: "";
                display: table;
                clear: both;
            }

    .chat .message {
        position: relative;
        max-width: 85%;
        margin: 8px 0;
        padding: 8px;
        font-size: 15px;
        line-height: 18px;
        color: #000;
        word-wrap: break-word;
        clear: both;
        z-index: -1;
    }

        .chat .message:after {
            content: "";
            position: absolute;
            width: 0;
            height: 0;
            border-style: solid;
        }

        .chat .message:first-child {
            margin: 16px 0 8px;
        }

        .chat .message.received {
            float: left;
            background: #ffffff;
            border-radius: 0px 5px 5px 5px;
        }

            .chat .message.received:after {
                top: 0;
                left: -10px;
                border-width: 0px 10px 10px 0;
                border-color: transparent #ffffff transparent transparent;
            }

        .chat .message.sent {
            float: right;
            background: #e1ffc7;
            border-radius: 5px 0px 5px 5px;
        }

            .chat .message.sent:after {
                top: 0;
                right: -10px;
                border-width: 0px 0 10px 10px;
                border-color: transparent transparent transparent #e1ffc7;
            }

    .chat #down {
        position: absolute;
        left: 50%;
        bottom: 10px;
        width: 15px;
        height: auto;
        margin-left: -8px;
        background-color: transparent;
        opacity: 0;
        cursor: pointer;
        transition: 0.5s all ease-in-out;
        z-index: 100;
    }

        .chat #down #downConver {
            width: 22px;
            height: auto;
            opacity: .3;
            transition: 0.5s all ease-in-out;
        }

            .chat #down #downConver:hover {
                opacity: .7;
            }

    .chat .conversation-compose {
        display: flex;
        flex-direction: row;
        align-items: flex-end;
        position: absolute;
        bottom: -50px;
        height: 50px;
        width: 100%;
        padding: 8px 0;
        background: #e9e9e9;
        border-top: 2px solid #ffffff;
        border-bottom: 2px solid #ffffff;
        overflow: hidden;
        z-index: 2;
    }

        .chat .conversation-compose div,
        .chat .conversation-compose input {
            height: 100%;
            background: #ffffff;
        }

        .chat .conversation-compose input {
            padding-bottom: 0;
        }

        .chat .conversation-compose .emoji {
            display: flex;
            align-items: center;
            justify-content: center;
            flex: 0 0 auto;
            width: 48px;
            margin-left: 8px;
            background: white;
            border-radius: 5px 0 0 5px;
        }

        .chat .conversation-compose .input-msg {
            flex: 1 1 auto;
            min-width: 50px;
            margin: 0;
            border: 0;
            outline: none;
            font-size: 16px;
        }

        .chat .conversation-compose .send {
            position: relative;
            top: 2px;
            left: 1px;
            flex: 0 0 auto;
            margin-left: 8px;
            margin-right: 8px;
            padding: 0;
            background: transparent;
            border: 0;
            outline: none;
            cursor: pointer;
        }

            .chat .conversation-compose .send .circle {
                display: flex;
                align-items: center;
                justify-content: center;
                position: relative;
                width: 34px;
                height: 34px;
                background: #487682;
                border-radius: 50%;
                color: #ffffff;
            }

            .chat .conversation-compose .send:hover .circle {
                background: #444444;
            }

    .chat .namesConversation {
        font-weight: 700;
    }

    .chat .container {
        position: fixed;
        left: 40%;
        top: 15%;
        width: 26%;
        margin: 0;
        padding: 0;
    }

    .chat .main-row {
        width: 100%;
        margin: 0;
    }

    .chat .top-whatsapp {
        height: 60px;
        background-color: #075e54;
        color: #ffffff;
    }

    .chat .icons {
        padding-top: 22px;
        text-align: right;
    }

        .chat .icons i {
            margin-left: 20px;
            font-size: 25px;
        }

    .chat .whatssApp-med {
        height: 40px;
        padding-top: 10px;
        font-family: 'Roboto', sans-serif;
        background-color: #075e54;
        color: #ffffff;
    }

    .chat .tabs {
        text-align: center;
        opacity: 0.5;
    }

    .chat .tabs-selected {
        padding-bottom: 6px;
        border-bottom: 2px solid #ffffff;
        text-align: center;
    }

    .chat .chats {
        width: 50%;
        margin: auto;
        font-family: 'Roboto', sans-serif;
    }

    .chat .contacts {
        position: relative;
        width: 100%;
        padding: 10px;
    }

        .chat .contacts:before {
            content: '';
            display: inline-block;
            vertical-align: middle;
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 1px;
            background: #e9e9e9;
        }

        .chat .contacts:after {
            content: '';
            display: inline-block;
            vertical-align: middle;
            position: absolute;
            bottom: 0;
            left: 0;
            width: 62px;
            height: 1px;
            background: #ffffff;
        }

        .chat .contacts:last-child:before,
        .chat .contacts:last-child:after {
            display: none;
        }

    .chat .chat-img,
    .chat .chat-info {
        display: inline-block;
        vertical-align: middle;
    }

    .chat .chat-img {
        margin-right: 12px;
    }

        .chat .chat-img img {
            width: 40px;
            height: 40px;
            border-radius: 50%;
        }

    .chat .chat-info {
        font-family: OpenSans-Bold;
        font-size: 13px;
        color: #444444;
    }

        .chat .chat-info:hover {
            color: #666666;
        }

    .chat .numberMessages {
        position: absolute;
        top: 20px;
        right: 10px;
        height: 20px;
        width: 20px;
        background-color: #da2e33;
        border-radius: 50%;
        font-family: OpenSans-Bold;
        font-size: 11px;
        line-height: 20px;
        color: #ffffff;
        text-align: center;
    }

    .chat #hiddenUsers {
        width: 100%;
        z-index: 101;
    }

        .chat #hiddenUsers h1 {
            margin-bottom: 25px;
        }

    .chat #flotar {
        width: 100%;
    }

    .chat .nameClick {
        position: relative;
        margin: 0;
        padding: 0;
        cursor: pointer;
        z-index: 140;
    }

@media (max-width: 1023px) {
    .chat .conversation-compose .input-msg {
        padding-bottom: 3px;
        font-size: 13px;
    }
}
/************************* PAGES ******************************/
/************************* PAGES / LOGIN ******************************/
.login body {
    margin-bottom: 0;
}

.login section {
    margin: 10vh 0 0 0;
    text-align: center;
}

    .login section .login-box {
        display: inline-block;
        vertical-align: middle;
        float: none;
        width: 350px;
        max-width: 100%;
        margin: 0 auto;
        padding: 40px 30px 20px 30px;
        background: #d14d3d;
        text-align: center;
    }

        .login section .login-box img {
            max-width: 100%;
            max-height: 100px;
            margin-bottom: 50px;
        }

        .login section .login-box .form-group label,
        .login section .login-box .form-group input {
            font-size: 14px;
        }

        .login section .login-box .form-group label {
            color: #ffffff;
        }

        .login section .login-box .form-group .form-item input {
            max-width: 100%;
            margin: 10px 0;
            padding: 8px 10px;
            background: rgba(255, 255, 255, 0.85);
            border: 1px solid #e9e9e9;
        }

        .login section .login-box .form-group:last-child .form-item input {
            margin-bottom: 0;
        }

        .login section .login-box button,
        .login section .login-box .button {
            margin: 10px 0;
            background: #b30721;
            color: #ffffff;
        }

            .login section .login-box button:hover,
            .login section .login-box .button:hover {
                background: #ffffff;
                color: #da2e33;
            }
/************************* PAGES / MAIN ******************************/
.main section {
    margin: 80px 50px 40px 50px;
}

/************************* PAGES / KPIS ******************************/
.kpi-block {
    visibility: hidden;
    opacity: 0;
    height: 0;
    overflow: hidden;
    transform: translateY(100%);
}

    .kpi-block.kpi-show {
        visibility: visible;
        opacity: 1;
        height: auto;
        transform: translateY(0);
        transition: 0.2s ease-out;
    }
/************************* UTILITIES ******************************/
/************************* UTILITIES / ANIMATIONS ******************************/
@keyframes spinner {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes linner {
    0% {
        width: 50%;
        left: -50%;
    }

    100% {
        width: 50%;
        left: 150%;
    }
}

@keyframes alerdown {
    0% {
        top: 20px;
        opacity: 0;
    }

    100% {
        top: 50px;
        opacity: 1;
    }
}
/************************* UTILITIES / MEDIA ******************************/
@media (max-width: 2000px) {
    /* Upload */
    .alert-upload .alert-upload-action input {
        width: 74%;
        margin-right: 1%;
    }

    .alert-upload .alert-upload-action button,
    .alert-upload .alert-upload-action .button {
        width: 15%;
    }

        .alert-upload .alert-upload-action button.upload,
        .alert-upload .alert-upload-action .button.upload {
            width: 9%;
        }
}

@media (max-width: 1700px) {
    /* Progress Bar */
    .progressbar .progressbar-info {
        width: 30%;
    }

    .progressbar .progressbar-lay {
        width: 70%;
    }
}

@media (max-width: 1300px) {
    /* Progress Bar */
    .progressbar .progressbar-info {
        width: 35%;
    }

    .progressbar .progressbar-lay {
        width: 65%;
    }
    /* Upload */
    .alert-upload .alert-upload-action input {
        width: 64%;
        margin-right: 1%;
    }

    .alert-upload .alert-upload-action button,
    .alert-upload .alert-upload-action .button {
        width: 20%;
    }

        .alert-upload .alert-upload-action button.upload,
        .alert-upload .alert-upload-action .button.upload {
            width: 14%;
        }
}

@media (max-width: 1199px) {
    /* Layout */
    .layout {
        padding: 20px 0;
    }

        .layout.subtitle {
            padding: 25px 0 0 0;
            margin: 0 50px;
        }
    /* Progress Bar */
    .progressbar .progressbar-info {
        width: 40%;
    }

    .progressbar .progressbar-lay {
        width: 60%;
    }
    /* Attached Files */
    .attached-files .file {
        width: 25%;
    }
}

@media (max-width: 1024px) {
    /* Carousel */
    .carousel {
        height: 250px;
    }

        .carousel .carousel-inner .item {
            line-height: 235px;
        }
    /* Upload */
    .alert-upload .alert-upload-action input {
        width: 59%;
        margin-right: 1%;
    }

    .alert-upload .alert-upload-action button,
    .alert-upload .alert-upload-action .button {
        width: 25%;
    }

        .alert-upload .alert-upload-action button.upload,
        .alert-upload .alert-upload-action .button.upload {
            width: 14%;
        }
}

@media (max-width: 1023px) {
    html body {
        margin-bottom: 60px;
    }
    /* Layout */
    .layout {
        padding: 15px;
    }

    .layout-btn {
        margin: 15px;
    }

    section {
        margin: 80px 20px 40px 20px;
        /* Subtitle */
    }

        section .subtitle {
            margin: 15px;
        }

            section .subtitle .subtitle-left {
                width: 70%;
            }

            section .subtitle .subtitle-right {
                width: 30%;
            }

    .main section {
        margin: 80px 20px 40px 20px;
    }
    /* Forms */
    .form-group .form-item.items-3 input:nth-child(1),
    .form-group .form-item.items-3 input:nth-child(2),
    .form-group .form-item.items-3 input:nth-child(3) {
        display: block;
        width: 200px;
        margin: 0 auto 5px auto;
    }

    .form-group .checks label,
    .form-group .radios label {
        display: block;
        margin: 5px;
    }
    /* Header */
    header {
        border-bottom: 1px solid #ffffff;
    }

        header .header-left,
        header .header-right {
            /* Header Text */
        }

            header .header-left .option-menu,
            header .header-right .option-menu {
                display: none;
            }
    /* Menu */
    #nav-menu {
        display: inline-block;
        vertical-align: middle;
    }

    nav {
        display: inline-block;
        vertical-align: middle;
        top: 0;
        left: -200px;
        width: 200px;
        height: 100%;
        margin-top: 59px;
        padding: 40px 0 140px 0;
        overflow: auto;
        transition: 0.3s left ease-in-out;
    }

        nav ul {
            display: table-cell;
            vertical-align: middle;
        }

            nav ul li {
                display: inline-block;
                vertical-align: middle;
                width: 100%;
                font-size: 14px;
            }

                nav ul li a {
                    padding: 8px 9px 9px 9px;
                }

                nav ul li .subnav {
                    display: inline-block;
                    vertical-align: middle;
                    position: relative;
                    top: initial;
                    left: initial;
                    width: 100%;
                    margin-top: 0;
                    background: #555555;
                    border-top: 1px solid #757575;
                    border-bottom: 1px solid #757575;
                    text-align: center;
                    visibility: visible;
                    opacity: 1;
                    overflow: hidden;
                    display: none;
                }

                    nav ul li .subnav li {
                        font-family: OpenSans-Regular;
                        font-size: 12px;
                    }

                        nav ul li .subnav li.subnav-separator {
                            border-bottom: 0;
                        }

                nav ul li:hover .subnav {
                    display: none;
                }

                nav ul li.active .subnav .active {
                    background: #444444;
                }

                nav ul li.active-mobile .subnav {
                    display: block;
                }

        nav.opened {
            left: 0;
        }
    /* Internet Explorer 9 */
    .ie9 nav {
        margin-top: 0;
        padding-top: 59px;
    }

        .ie9 nav ul {
            display: block;
            margin-bottom: 25px;
        }

            .ie9 nav ul li .subnav {
                position: relative;
                top: 0;
                left: 0;
            }
    /* Switch */
    .subtitle-alert .subtitle-alert-title {
        padding-right: 0;
        padding-top: 10px;
    }
}

@media (max-width: 991px) {
    /* Box */
    .box {
        padding-bottom: 35px;
    }
    /* Progress Bar */
    .progressbar {
        margin-bottom: 15px;
    }

        .progressbar .progressbar-info {
            width: 100%;
            padding-top: 0;
        }

        .progressbar .progressbar-lay {
            width: 100%;
            padding-right: 0;
        }
    /* Legend */
    .legend-box.legend-box-1 {
        margin-top: 10px;
    }
    /* Attached Files */
    .attached-files .file {
        width: 33.33333%;
    }
}

@media (max-width: 767px) {
    /* Layout */
    .layout {
        padding: 5px;
    }

        .layout.subtitle {
            padding: 25px 0 0 0;
            margin: 0 25px;
        }

    .layout-btn {
        margin: 15px 5px;
        padding: 0;
        background: none;
        border: none;
    }

        .layout-btn button,
        .layout-btn .button {
            width: 100%;
            text-align: center;
        }

    .form-right {
        text-align: left;
    }

        .form-right .form-group {
            text-align: left;
        }

            .form-right .form-group label,
            .form-right .form-group .form-item {
                text-align: left;
            }

    header {
        padding-top: 10px;
        /* Header Icons */
    }

        header .header-left,
        header .header-right {
            width: 30%;
        }

        header .header-center {
            width: 40%;
        }

        header .header-right .header-right-alerts .alert-icon.alert-icon-global {
            display: block;
        }

        header .header-right .header-right-alerts .alert-icon-items {
            display: none;
        }

            header .header-right .header-right-alerts .alert-icon-items.alerts-items-drop {
                display: block;
                position: absolute;
                top: 50px;
                right: 9px;
                padding: 10px 15px 12px 5px;
                background: #444444;
                border-top: 2px solid #757575;
                border-radius: 0 0 5px 5px;
                box-shadow: 0 0 2px 0px rgba(255, 255, 255, 0.5);
                text-align: center;
                animation: alerdown .5s;
            }

                header .header-right .header-right-alerts .alert-icon-items.alerts-items-drop .alert-icon {
                    display: block;
                    margin-bottom: 8px;
                }

                    header .header-right .header-right-alerts .alert-icon-items.alerts-items-drop .alert-icon:last-child {
                        margin-bottom: 0;
                    }

    section {
        /* Subtitle */
    }

        section .subtitle {
            margin: 5px;
            border-bottom: none;
        }

            section .subtitle .subtitle-left input,
            section .subtitle .subtitle-right input,
            section .subtitle .subtitle-left button,
            section .subtitle .subtitle-right button,
            section .subtitle .subtitle-left .button,
            section .subtitle .subtitle-right .button {
                width: 100%;
            }

            section .subtitle .subtitle-left input,
            section .subtitle .subtitle-right input {
                margin: 30px 0 15px 0;
                padding: 10px;
                border: 1px solid #e9e9e9;
                text-align: center;
            }

            section .subtitle .subtitle-left button,
            section .subtitle .subtitle-right button,
            section .subtitle .subtitle-left .button,
            section .subtitle .subtitle-right .button {
                text-align: center;
            }

            section .subtitle .subtitle-left .search-icon,
            section .subtitle .subtitle-right .search-icon {
                display: none;
            }

            section .subtitle .subtitle-left,
            section .subtitle .subtitle-right {
                width: 100%;
            }
    /* Legend */
    .legend {
        width: 100%;
        margin: 20px 0 10px 0;
    }

        .legend .info-icon {
            display: none;
        }

        .legend .legend-box {
            position: initial;
            top: initial;
            left: initial;
            width: 100%;
            margin-top: 10px;
            visibility: visible;
            opacity: 1;
        }

            .legend .legend-box:before {
                display: none;
            }

            .legend .legend-box .legend-item {
                text-align: left;
            }

                .legend .legend-box .legend-item span {
                    width: 90%;
                }
    /* Form Group */
    .form-group .form-item.items-special input.first-item,
    .form-group .form-item.items-special select.first-item {
        width: 57%;
        margin-right: 1%;
    }

    .form-group .form-item.items-special input.last-item,
    .form-group .form-item.items-special select.last-item {
        width: 37%;
        margin-left: 1%;
    }

    .form-group .form-item.items-special span {
        width: 4%;
    }
    /* Error Message */
    .error-message.error-message-left {
        margin-right: 3%;
        width: 57%;
    }

    .error-message.error-message-right {
        margin-left: 3%;
        width: 37%;
    }
    /* Internet Explorer 9 */
    .ie9 .legend {
        z-index: 1;
    }

        .ie9 .legend .legend-box {
            position: relative;
            top: 0;
            left: 0;
        }
    /* Attached Files */
    .attached-files .file {
        width: 50%;
    }

    .attached-files.attached-files-user .file .file-info .file-delete {
        visibility: visible;
        opacity: 1;
    }
    /* Upload */
    .alert-upload .alert-upload-action input {
        width: 100%;
        margin-right: 0;
        margin-bottom: 5px;
    }

    .alert-upload .alert-upload-action button,
    .alert-upload .alert-upload-action .button {
        width: 100%;
    }

        .alert-upload .alert-upload-action button.upload,
        .alert-upload .alert-upload-action .button.upload {
            width: 100%;
            margin-top: 5px;
            margin-left: 0;
        }
    /* Popup */
    .popup .popup-layout {
        width: 90%;
    }
}

@media (max-width: 500px) {
    /* Login */
    .login {
        background: #d14d3d;
    }

        .login section {
            margin: 0;
            background: #d14d3d;
        }
    /* Menu */
    nav {
        left: -100%;
        width: 100%;
        padding-top: 20px;
    }

        nav ul li {
            font-size: 12px;
        }

            nav ul li a {
                padding: 6px 7px 7px 7px;
            }

        nav.opened {
            left: 0;
        }
    /* Aside */
    aside {
        width: 100%;
        height: 100%;
        right: -100%;
        border-left: none;
    }
    /* Legend */
    .legend .legend-box .legend-item span {
        width: 80%;
    }
    /* Form Group */
    .form-group .form-item.items-special input.first-item,
    .form-group .form-item.items-special select.first-item {
        width: 56%;
        margin-right: 1%;
    }

    .form-group .form-item.items-special input.last-item,
    .form-group .form-item.items-special select.last-item {
        width: 36%;
        margin-left: 1%;
    }

    .form-group .form-item.items-special span {
        width: 6%;
    }
    /* Error Message */
    .error-message.error-message-left {
        margin-right: 4%;
        width: 56%;
    }

    .error-message.error-message-right {
        margin-left: 4%;
        width: 36%;
    }
    /* Box */
    .box {
        padding: 15px 15px 20px 15px;
    }
    /* Attached Files */
    .attached-files .file {
        width: 100%;
    }

    .attached-files.attached-files-user .file {
        width: 100%;
    }

        .attached-files.attached-files-user .file .file-info {
            width: 100%;
        }

            .attached-files.attached-files-user .file .file-info .file-title {
                overflow: hidden;
                text-overflow: ellipsis;
            }

            .attached-files.attached-files-user .file .file-info .file-delete {
                right: 1px;
            }
    /* Switch */
    .subtitle-alert .subtitle-alert-title {
        padding-top: 0;
        padding-bottom: 19px;
    }

    .subtitle-alert .switch {
        position: relative;
        top: initial;
        right: initial;
        left: initial;
    }

        .subtitle-alert .switch .switch-on,
        .subtitle-alert .switch .switch-off {
            right: -100px;
            left: initial;
            width: 100px;
            padding-left: 10px;
            padding-right: 0;
            text-align: left;
        }
    /* Input Table */
    .table.in-table .tbody .file .cell.subcell-1 {
        width: 100%;
        margin-right: 0;
        text-align: left;
    }

    .table.in-table .tbody .file .cell.subcell-2 {
        position: relative;
        width: 100%;
        margin-bottom: 10px;
        text-align: left;
    }

        .table.in-table .tbody .file .cell.subcell-2 input {
            border: 1px solid #ddd;
        }

    .table-titles {
        margin-bottom: 5px;
    }

        .table-titles .table-titles-left {
            width: 100%;
            padding-right: 6px;
            text-align: right;
        }

        .table-titles .table-titles-right {
            display: none;
        }
}

@media (max-width: 399px) {
    /* Columns */
    section .apps .apps-menu .apps-col {
        width: 100%;
    }
    /* Forms */
    div.form-group .form-item input,
    div.form-group .form-item select {
        width: 100%;
    }

    div.form-group .form-item.items-3 input {
        width: 100%;
    }

        div.form-group .form-item.items-3 input:nth-child(1),
        div.form-group .form-item.items-3 input:nth-child(2),
        div.form-group .form-item.items-3 input:nth-child(3) {
            width: 100%;
        }
    /* Legend */
    .legend .legend-box .legend-item span {
        width: 70%;
    }
    /* Form Group */
    .form-group .form-item.items-special input.first-item,
    .form-group .form-item.items-special select.first-item {
        width: 55%;
        margin-right: 1%;
    }

    .form-group .form-item.items-special input.last-item,
    .form-group .form-item.items-special select.last-item {
        width: 35%;
        margin-left: 1%;
    }

    .form-group .form-item.items-special span {
        width: 8%;
    }
    /* Error Message */
    .error-message.error-message-left {
        margin-right: 5%;
        width: 55%;
    }

    .error-message.error-message-right {
        margin-left: 5%;
        width: 35%;
    }
}

@media (max-width: 319px) {
    html body {
        margin-bottom: 75px;
    }
    /* Columns */
    section .favs .fav-col {
        width: 100%;
    }

    section .apps .apps-content .app-col {
        width: 100%;
    }
    /* Form Group */
    .form-group .form-item.items-special input.first-item,
    .form-group .form-item.items-special select.first-item {
        width: 53%;
        margin-right: 1%;
    }

    .form-group .form-item.items-special input.last-item,
    .form-group .form-item.items-special select.last-item {
        width: 33%;
        margin-left: 1%;
    }

    .form-group .form-item.items-special span {
        width: 12%;
    }
    /* Error Message */
    .error-message.error-message-left {
        margin-right: 7%;
        width: 53%;
    }

    .error-message.error-message-right {
        margin-left: 7%;
        width: 33%;
    }
}

@media (max-width: 250px) {
    /* Header */
    header .header-left,
    header .header-right {
        display: none;
    }

    header .header-center {
        width: 100%;
    }
}
/************************* Presupuestos ******************************/
.marginRight-5 {
    margin-left: -5px;
}

.marginRight-10 {
    margin-left: -15px;
}

.margin5 {
    margin: 5px;
}

.margin20 {
    margin-top: 20px;
    margin-bottom: 20px;
}

.marginRightLabelForm {
    margin-right: 10px;
}

.flexBox {
    display: flex;
    justify-content: space-between;
}

.flexBoxCenter {
    display: flex;
    justify-content: start;
}

.alinearIzquierda {
    margin-left: -40px;
    float: left !important;
}

.alinearDerecha {
    float: right;
}

.anchoInputForm {
    width: 175px;
}

.justificarTextoEnFormCenter {
    text-align: justify !important;
}

.alinearDerechaTextoEnFormCenter {
    text-align: right !important;
}

.buttonWidth {
    width: 180px !important;
    margin: 2px;
}

.buttonWidth50pc {
    width: 50%;
    line-height: 22px;
}

.buttonWidthFull {
    width: 100% !important;
    margin: 0px;
}

#colorHeaderAndFooterImgPresupuesto {
    border-top-right-radius: inherit;
    border-top-left-radius: inherit;
    background: #d14d3d;
}

.tituloModelImagen {
    font-weight: bold;
    color: #ffffff;
}

.btnRadiusZero {
    border-radius: 0 !important;
}

.paddingGeneral-20 {
    margin: 20px;
}

#custom-text {
    margin-left: 10px;
    font-family: sans-serif;
    color: #aaa;
}

.alinearEtiquetaVisualizador {
    display: inline;
    vertical-align: middle;
    margin-left: 2%;
}
/************************ Campañas-Chollos**************************************/

.tituloCampanaBox {
    /*border-style: solid;
    border-radius: 5px;
    border-width: 2px;*/
    margin-bottom: 2px;
    padding: 5px 0px 5px 5px;
    text-align: left;
}

.tituloCampanaText {
    padding: 0px 0px 0px 5px;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
}

.ventas {
    padding-bottom: 0px;
}
.stockactual {
    padding-bottom: 0px;
}
