/*.element {*/
/*color: #f94817; !* Primary color 1 *!*/
/*color: #00b17c; !* Primary color 2 *!*/

/*color: #d43e17; !* Primary color 1 darken *!*/
/*}*/

@font-face {
    font-family: 'Roboto Condensed Light';
    src: url('/static/vendor/fonts/RobotoCondensed-Light.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto Condensed';
    src: url('/static/vendor/fonts/RobotoCondensed-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

body {
    font-family: 'Roboto Condensed Light', sans-serif;
    overflow-y: scroll;
}

.btn-primary, .btn-danger, .btn-warning {
    font-family: 'Roboto Condensed', sans-serif;
}

.plate {
    border-radius: 0;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.2);
}

.plate-header {
    padding: 2em;
    color: #545454;
}

.plate-header > h4 {
    margin: 0.3em 0 0.36em 0;
    font-size: 1.4em;
}

.plate-content {
    padding: 2em;
}

.no-content-stub {
    text-align: center;
    padding: 6em 3em 6em 3em;
    color: #b1b1b1;
}

.loading-stub {
    text-align: center;
    padding: 10em 3em;
    color: #b1b1b1;
}

.common-table-wrapper {
    padding-bottom: 4em;
}

.common-table {
    margin: 0;
}

.common-table td {
    vertical-align: middle !important;
    border: none !important;
    padding-right: 1.5em !important;
    padding-left: 1.5em !important;
}

.common-table td.align-top {
    vertical-align: top !important;
}

.common-table td:first-child, .common-table th:first-child {
    padding-left: 2.1em !important;
}

.common-table td:last-child, .common-table th:last-child {
    padding-right: 2.1em !important;
}

.common-table th {
    position: relative;
    vertical-align: middle !important;
    border: none !important;

    background: #d9d9d9;
    color: #000000;
    font-weight: 100;
    text-transform: uppercase;

    padding-right: 1.5em !important;
    padding-left: 1.5em !important;
}

.common-table th .dropdown-menu {
    text-transform: none;
}

.common-table .bottom-bordered {
    border-bottom: 1px solid #dedede !important;
}

.common-table .top-bordered {
    border-top: 1px solid #dedede !important;
}

.common-table.table-hover > tbody > tr:hover {
    background: #f2f2f2 !important;
}

.common-table th.sorted.headerSortDown, .common-table th.sorted.headerSortUp {
    background: #d9d9d9;
    text-decoration: underline;
}

.common-table th.sorted {
    cursor: pointer;
}

.common-table th.sorted:after {
    position: absolute;
    font-size: 0.8em;
    right: 0.5em;
    margin-top: 0.2em;
    font-family: 'fontawesome';
    content: '\f0dc';
    opacity: 0.3;
}

.common-table th.sorted.headerSortDown:after {
    content: '\f0d8';
    opacity: 1;
}

.common-table th.sorted.headerSortUp:after {
    content: '\f0d7';
    opacity: 1;
}

.common-table td.actions {
    text-align: right;
    white-space: nowrap;
    vertical-align: middle !important;
}

/*.common-table td.actions .btn {*/
/*opacity: 0;*/
/*}*/
/**/
/*.common-table tr:hover td.actions .btn {*/
/*opacity: 1;*/
/*}*/

.common-table tr:not(:last-child) {
    border-bottom: 1px solid #a5a5a5;
}

.common-table tr.inactive {
    color: gray;
}

.common-table td hr {
    margin: 0.5em 0 !important;
}

label.required:after {
    content: ' *';
    font-weight: bold;
    color: red;
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #FDFDFD !important;
}

.table-hover > tbody > tr:hover {
    background-color: #e5e5e5 !important;
}

.form-group.check input[type="checkbox"], .form-group.check input[type="radio"] {
    display: none;
}

.form-group.check input[type="checkbox"] + .btn-group, .form-group.check input[type="radio"] + .btn-group {
    display: table;
    width: 100%;
}

.form-group.check input[type="checkbox"] + .btn-group > label, .form-group.check input[type="radio"] + .btn-group > label {
    display: table-cell;
}

.form-group.check input[type="checkbox"] + .btn-group > label.check-place, .form-group.check input[type="radio"] + .btn-group > label.check-place {
    width: 22%;
    text-align: center;
}

.form-group.check input[type="checkbox"] + .btn-group > label.label-place, .form-group.check input[type="radio"] + .btn-group > label.label-place {
    width: 78%;
    text-align: left;
}

.form-group.check input[type="checkbox"]:not(:checked) + .btn-group > label.check-place, .form-group.check input[type="radio"]:not(:checked) + .btn-group > label.check-place {
    opacity: 0.4;
}

.form-group.check input[type="checkbox"]:not(:checked) + .btn-group > label.check-place span.checked, .form-group.check input[type="radio"]:not(:checked) + .btn-group > label.check-place span.checked {
    display: none;
}

.form-group.check input[type="checkbox"]:not(:checked) + .btn-group > label.check-place span.unchecked, .form-group.check input[type="radio"]:not(:checked) + .btn-group > label.check-place span.unchecked {
    display: inline-block;
}

.form-group.check input[type="checkbox"]:checked + .btn-group > label.check-place, .form-group.check input[type="radio"]:checked + .btn-group > label.check-place {
    opacity: 1;
}

.form-group.check input[type="checkbox"]:checked + .btn-group > label.check-place span.checked, .form-group.check input[type="radio"]:checked + .btn-group > label.check-place span.checked {
    display: inline-block;
}

.form-group.check input[type="checkbox"]:checked + .btn-group > label.check-place span.unchecked, .form-group.check input[type="radio"]:checked + .btn-group > label.check-place span.unchecked {
    display: none;
}

pre {
    padding: 0;
    margin: 0;
    background: transparent;
    border: none;
    font: inherit;
    font-size: 0.9em;
}

.editable-field .view {
    display: block;
    padding: 5px;
    border-bottom: 1px dashed silver;
}

.editable-field .edit {
    display: none;
    margin-bottom: 0;
}

.editable-field.edit-mode .view {
    display: none;
}

.editable-field.edit-mode .edit {
    display: block;
}

#loader {
    display: none;

    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;

    background: rgba(0, 0, 0, 0.3);

    z-index: 10000;
}

#loader .fa {
    position: absolute;

    left: 50%;
    top: 50%;

    font-size: 3em;
    color: white
}

.photo-view {
    display: none;
    position: absolute;
    width: 800px;
    z-index: 10;
    top: 0;
    right: -800px;
    cursor: move;
}

.photo-view .title {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    font-size: 2em;
}

.photo-view img {
    width: 100%;
}

.photo-view .fa-times {
    font-size: 2em;
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
}