@charset "utf-8";

/*
Hive UX Framework
Copyright (c) 2008-2020 Hive Solutions Lda.

This file is part of Hive UX Framework.

Hive UX Framework is free software: you can redistribute it and/or modify
it under the terms of the Apache License as published by the Apache
Foundation, either version 2.0 of the License, or (at your option) any
later version.

Hive UX Framework is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
Apache License for more details.

You should have received a copy of the Apache License along with
Hive UX Framework. If not, see <http://www.apache.org/licenses/>.
*/

/*
__author__    = João Magalhães <joamag@hive.pt> & Afonso Caldas <acaldas@hive.pt>
__version__   = 1.0.0
__revision__  = $LastChangedRevision$
__date__      = $LastChangedDate$
__copyright__ = Copyright (c) 2008-2020 Hive Solutions Lda.
__license__   = Apache License, Version 2.0
*/

@import url(animations.css);

body {
    animation: fade-in 0.25s ease-in-out;
    -o-animation: fade-in 0.25s ease-in-out;
    -ms-animation: fade-in 0.25s ease-in-out;
    -moz-animation: fade-in 0.25s ease-in-out;
    -khtml-animation: fade-in 0.25s ease-in-out;
    -webkit-animation: fade-in 0.25s ease-in-out;
    color: #444444;
    font-family: Arial, "Lucida Grande", sans-serif;
    font-size: 13px;
}

body.opensans {
    font-family: "Open Sans", Arial, "Lucida Grande", sans-serif;
}

section {
    display: block;
    margin-bottom: 32px;
}

p {
    line-height: 20px;
    margin: 13px 0px 13px 0px;
}

pre,
code {
    background-color: #fefefe;
    border: 1px solid #cccccc;
    box-shadow: 0px 1px 2px #dddddd;
    -o-box-shadow: 0px 1px 2px #dddddd;
    -ms-box-shadow: 0px 1px 2px #dddddd;
    -moz-box-shadow: 0px 1px 2px #dddddd;
    -khtml-box-shadow: 0px 1px 2px #dddddd;
    -webkit-box-shadow: 0px 1px 2px #dddddd;
    font-family: Monaco, "Andale Mono", "Courier New", monospace;
    font-size: 12px;
    line-height: 20px;
    margin: 0px 0px 12px 0px;
    padding: 12px 12px 12px 12px;
}

h1 .sub-title {
    color: #aaaaaa;
    font-size: 10px;
    text-transform: uppercase;
}

h1.line {
    border-bottom: 1px solid #cccccc;
    cursor: pointer;
    margin: 16px 0px 16px 0px;
    padding-bottom: 8px;
}

#footer {
    color: #666666;
    font-size: 12px;
    margin: 24px auto 12px auto;
    padding-top: 12px;
    text-align: center;
    width: 960px;
}

.left {
    float: left;
}

.right {
    float: right;
}

.clear {
    clear: both;
}

.highlight {
    background-color: #fee9cc;
    font-family: monospace;
    font-size: 12px;
    padding: 2px 4px 2px 4px;
}

.logo {
    float: left;
    padding: 0px 0px 0x 0px;
}

.content-bar {
    background-color: #f0f0f0;
    border-bottom: 1px solid #dddddd;
    box-shadow: 0px 1px 4px #eeeeee;
    -o-box-shadow: 0px 1px 4px #eeeeee;
    -ms-box-shadow: 0px 1px 4px #eeeeee;
    -moz-box-shadow: 0px 1px 4px #eeeeee;
    -khtml-box-shadow: 0px 1px 4px #eeeeee;
    -webkit-box-shadow: 0px 1px 4px #eeeeee;
    height: 32px;
}

.top-bar {
    width: 100%;
    z-index: 12;
}

.box {
    background-color: #fafafa;
    border: 1px solid #cccccc;
    box-shadow: 0px 1px 2px #dddddd;
    -o-box-shadow: 0px 1px 2px #dddddd;
    -ms-box-shadow: 0px 1px 2px #dddddd;
    -moz-box-shadow: 0px 1px 2px #dddddd;
    -khtml-box-shadow: 0px 1px 2px #dddddd;
    -webkit-box-shadow: 0px 1px 2px #dddddd;
    margin: 0px 0px 12px 0px;
    padding: 12px 12px 12px 12px;
}

.box.box-white {
    background-color: #ffffff;
}

.navigation {
    float: left;
    height: 32px;
    margin: 0px 0px 0px 0px;
    padding: 0px 12px 0px 12px;
}

.navigation li {
    display: block;
    float: left;
    font-size: 13px;
    height: 32px;
    padding: 0px 10px 0px 10px;
}

.navigation li.selected {
    background-color: #fafafa;
}

.navigation li a {
    display: block;
    float: none;
    padding: 8px 0px 8px 0px;
}

.container-margin {
    margin-bottom: 42px;
}

.field-margin {
    margin-bottom: 6px;
}

.container-960 {
    margin: 0px auto 0px auto;
    width: 960px;
}

.section-contents :first-child {
    margin-top: 0px;
}

.section-contents :last-child {
    margin-bottom: 0px;
}

.section-function {
    margin-top: 20px;
}

.overlay-search {
    background-color: #fefefe;
    border: 1px solid #cccccc;
    padding: 12px 12px 12px 12px;
    position: absolute;
    z-index: 30;
}

.table-data {
    background: #ffffff;
    border: 1px solid #dddddd;
    border-collapse: separate;
    border-spacing: 0px;
    margin: 0px 0px 12px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
}

.table-data th,
.table-data td {
    line-height: 18px;
    padding: 10px 10px 9px 10px;
    text-align: left;
}

.table-data th {
    border-bottom: 1px solid #dddddd;
    font-weight: bold;
    padding-top: 9px;
    vertical-align: middle;
}

.table-data td {
    vertical-align: top;
}

.table-data th + th,
.table-data td + td {
    border-left: 1px solid #dddddd;
}

.table-data tr + tr td {
    border-top: 1px solid #dddddd;
}

.table-data tbody tr:first-child td:first-child {
    border-radius: 4px 0px 0px 0px;
    -o-border-radius: 4px 0px 0px 0px;
    -ms-border-radius: 4px 0px 0px 0px;
    -moz-border-radius: 4px 0px 0px 0px;
    -khtml-border-radius: 4px 0px 0px 0px;
    -webkit-border-radius: 4px 0px 0px 0px;
}

.table-data tbody tr:first-child td:last-child {
    border-radius: 0px 4px 0px 0px;
    -o-border-radius: 0px 4px 0px 0px;
    -ms-border-radius: 0px 4px 0px 0px;
    -moz-border-radius: 0px 4px 0px 0px;
    -khtml-border-radius: 0px 4px 0px 0px;
    -webkit-border-radius: 0px 4px 0px 0px;
}

.table-data tbody tr:last-child td:first-child {
    border-radius: 0px 0px 0px 4px;
    -o-border-radius: 0px 0px 0px 4px;
    -ms-border-radius: 0px 0px 0px 4px;
    -moz-border-radius: 0px 0px 0px 4px;
    -khtml-border-radius: 0px 0px 0px 4px;
    -webkit-border-radius: 0px 0px 0px 4px;
}

.table-data tbody tr:last-child td:last-child {
    border-radius: 0px 0px 4px 0px;
    -o-border-radius: 0px 0px 4px 0px;
    -ms-border-radius: 0px 0px 4px 0px;
    -moz-border-radius: 0px 0px 4px 0px;
    -khtml-border-radius: 0px 0px 4px 0px;
    -webkit-border-radius: 0px 0px 4px 0px;
}

.stack .stack-item {
    width: 934px;
}

.overlay,
.side-menu-movable {
    padding-left: 0px;
    transition: padding-left 0.50s cubic-bezier(0.645, 0.045, 0.355, 1.0);
    -o-transition: padding-left 0.50s cubic-bezier(0.645, 0.045, 0.355, 1.0);
    -ms-transition: padding-left 0.50s cubic-bezier(0.645, 0.045, 0.355, 1.0);
    -moz-transition: padding-left 0.50s cubic-bezier(0.645, 0.045, 0.355, 1.0);
    -khtml-transition: padding-left 0.50s cubic-bezier(0.645, 0.045, 0.355, 1.0);
    -webkit-transition: padding-left 0.50s cubic-bezier(0.645, 0.045, 0.355, 1.0);
}

body.menu-open {
    overflow-x: hidden;
}

body.menu-open .overlay,
body.menu-open .side-menu-movable {
    padding-left: 300px;
}

.side-menu {
    background-color: #2d2d2d;
    color: #ffffff;
    height: 100%;
    left: -300px;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    text-align: center;
    top: 0px;
    transition: left 0.50s cubic-bezier(0.645, 0.045, 0.355, 1.0);
    -o-transition: left 0.50s cubic-bezier(0.645, 0.045, 0.355, 1.0);
    -ms-transition: left 0.50s cubic-bezier(0.645, 0.045, 0.355, 1.0);
    -moz-transition: left 0.50s cubic-bezier(0.645, 0.045, 0.355, 1.0);
    -khtml-transition: left 0.50s cubic-bezier(0.645, 0.045, 0.355, 1.0);
    -webkit-transition: left 0.50s cubic-bezier(0.645, 0.045, 0.355, 1.0);
    width: 300px;
    z-index: 30;
}

.side-menu.open {
    left: 0px;
}

.side-menu > * {
    opacity: 0;
    -o-opacity: 0;
    -ms-opacity: 0;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    -webkit-opacity: 0;
    transition: opacity 0.50s cubic-bezier(0.645, 0.045, 0.355, 1.0) 0.20s;
    -o-transition: opacity 0.50s cubic-bezier(0.645, 0.045, 0.355, 1.0) 0.20s;
    -ms-transition: opacity 0.50s cubic-bezier(0.645, 0.045, 0.355, 1.0) 0.20s;
    -moz-transition: opacity 0.50s cubic-bezier(0.645, 0.045, 0.355, 1.0) 0.20s;
    -khtml-transition: opacity 0.50s cubic-bezier(0.645, 0.045, 0.355, 1.0) 0.20s;
    -webkit-transition: opacity 0.50s cubic-bezier(0.645, 0.045, 0.355, 1.0) 0.20s;
}

.side-menu.open > * {
    opacity: 1;
    -o-opacity: 1;
    -ms-opacity: 1;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    -webkit-opacity: 1;
}

.side-menu .stack {
    height: 100%;
}

.side-menu .stack > .stack-in {
    height: 100%;
}

.side-menu .stack .stack-item {
    height: 100%;
    width: 300px;
}

.side-menu .stack .stack-pop-button {
    font-size: 18px;
    font-weight: 600;
}

.side-menu .links-container {
    box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    display: inline-block;
    list-style: none;
    margin: 0px 0px 0px 0px;
    padding: 20px 30px 20px 30px;
    width: 100%;
}

.side-menu .links-container li {
    display: block;
    font-size: 13px;
    line-height: 13px;
    padding: 6px 0px 6px 0px;
}

.side-menu .links-container .link {
    color: #ffffff;
}