@font-face {
    font-family: 'futura_oblique';
    font-style: normal;
    font-weight: normal;
    src: url('../fonts/futura_oblique-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/futura_oblique-webfont.woff2') format('woff2'),
    url('../fonts/futura_oblique-webfont.woff') format('woff'),
    url('../fonts/futura_oblique-webfont.ttf') format('truetype'),
    url('../fonts/futura_oblique-webfont.svg#futura_oblique') format('svg');
}

html {
    background: white;
    overflow: hidden;
}

body {
    margin: 0;
    width: 100%;
}

#top_cntrl {
    background: black none repeat scroll 0 0;
    box-sizing: border-box;
    height: 6em;
    text-align: left;
    width: 100%;
}

#top_cntrl * {
    display: inline;
}

#top_cntrl .download_link {
    margin: 15px 3px 10px calc(9% - 2em);
}

#top_cntrl .titleLink {
    color: #ffffff;
}

#top_cntrl .titleLink a {
    color: #ffffff;
}

#top_cntrl .linkOverlayLabel,
#top_cntrl .linkOverlay,
#top_cntrl .ui-overlaypanel-content{
    display: block;
}

.middle {
    vertical-align: calc(20%);
}

/*Header text*/
.logoText {
    color: #fff;
    font-size: 4em;
    height: 30px;
    left: 10px;
    position: relative;
    top: 10px;
    z-index: 10;
}

/*Download button*/
#top_cntrl .buttonLink {
    background: #ffffff none repeat scroll 0 0;
    border: 1px solid #cbc3be;
    border-radius: 4px;
    color: #000000;
    cursor: pointer;
    font-weight: bold;
    font-size: 1.4em;
    padding: 0 12px;
    text-align: center;
    text-decoration: none;
}

.download_button {
    display: inline-block;
    margin: 5px;
    vertical-align: top;
}

.download_button a .buttonLink {
    background: #111111 url("/alvin/javax.faces.resource/images/ui-bg_glass_40_111111_1x400.png.jsf?ln=primefaces-black-tie") repeat-x scroll 50% 50%;
    border: 1px solid #777777;
    border-radius: 4px;
    color: #e3e3e3;
    cursor: pointer;
    font-weight: bold;
    font-size: 1.4em;
    padding: 0 12px;
    text-align: center;
    text-decoration: none;
}

/*Navigating between images*/
#top_cntrl .msg_controls div{
    display: inline-block;
}

#top_cntrl .msg_controls {
    margin: 0 6em 0 calc(15% - 9em);
    text-align: center;
}

#top_cntrl .msg_controls .controls {
    display: inline-block;
    margin: 20px 3px;
    vertical-align: top;
    width: 20px;
}

#top_cntrl .msg_controls .image_select {
    display: inline-block;
    margin: 15px 3px 10px 3px;
    vertical-align: top;
    width: 80px;
}

.image_select input {
    text-align: right;
    width: 25px;
}

a.noHover:hover {
    text-decoration: none;
}

#content {
    display: block;
    position: relative;
    width: 100%;
}

.image_view {
    display: inline-block;
    width: 50%;
}

#viewer {
    height: 100%;
    min-height: 14em;
    min-width: 14em;
}

.toggler {
    background-color: white;
    border: medium none;
    cursor: pointer;
    float: right;
    height: 30px;
    position: relative;
    text-align: center;
    top: 45%;
    width: 30px;
    z-index: 2;
}

.expand {
    display: block;
}

.collapse {
    display: none;
}

.toggler svg {
    fill: #000000;
    height: 25px;
    width: 25px;
}

.meta_data {
    display: inline-block;
    float: right;
    width: 50%;
}

.meta_data .ui-tabs-panel.ui-widget-content {
    height: 90vh;
    overflow: auto;
}

.meta_data.ui-panel, .meta_data.ui-panel .ui-panel-content {
    padding: 0;
}

.meta_data.ui-panel .ui-panel-titlebar {
    border: medium none;
    height: 1px;
    padding: 0;
}

.meta_data.ui-panel .ui-panel.ui-panel-titlebar {
    background-color: lightgrey;
    border-radius: 0;
}

.meta_data .ui-panel-titlebar-icon {
    background: transparent none repeat scroll 0 0;
    width: 100%;
}

.meta_data .ui-datalist {
    max-width: 99%;
}

.meta_data li {
    margin: 5px 0;
}

.meta_data .ui-fieldset {
 /*   padding: 3px 0;*/
}

.meta_data .ui-fieldset-toggleable .ui-fieldset-legend {
    background: #ffffff none repeat scroll 0 0;
    border-radius: 0;
    width: 99%;
}

.meta_data .ui-fieldset-toggleable .ui-fieldset-legend span {
    display: none;
}

.content_tabs {
    display: inline-block;
    min-height: 90vh;
    vertical-align: top;
    width:100%;
}

.content_tabs h2 {
    color: #88a6bc;
}

.meta_data .ui-tabs .ui-tabs-panel {
    padding:0.5em;
}

.record {
    background-color: white;
    display: inline-block;
    margin-left: 1em;
    vertical-align: top;
}

/*Thumbnails*/
.thumbnail div {
    height: 10em;
}

.thumbnail img {
    display: block;
    margin: 0.3em auto;
    max-height: 10em;
    max-width: 10em;
}

.thumbnail span {
    display: block;
    padding-top: 2px;
    vertical-align: middle;
}

td.ui-datagrid-column {
    width: 14em;
}

div.thumbnail {
    border: 1px solid #dddddd;
    height: 13em;
    padding: 0.3em;
}

div.thumbnail:hover {
    border: 1px solid #88a6bc;
}

.ui-paginator.ui-paginator-top,
.ui-paginator.ui-paginator-bottom {
    color: #222222;
}

.ui-paginator .ui-widget-content .ui-icon {
    background-image: url("/alvin/javax.faces.resource/images/ui-icons_222222_256x240.png.jsf?ln=primefaces-black-tie");
}
/*end thumbnails*/

svg {
    fill: #fff;
    height: 25px;
    width: 25px;
}

svg:hover,
svg:active,
svg:focus {
    fill: #ddd;
}

/*Lists in view part*/
.content_tabs ul {
    line-height: 1.5;
    margin: 0;
    padding-left: 0;
}

.content_tabs.ui-tabs,
.content_tabs.ui-tabs.ui-tabs-top > .ui-tabs-nav {
    padding: 0;
}

.content_tabs ul.ui-widget-header {
    background: #ddd;
}

.content_tabs ul.ui-corner-all,
.content_tabs li.ui-corner-top {
    border-radius: 0;
}

.content_tabs ul li.ui-state-default {
    background: #ddd;
    border: medium none;
}

.content_tabs ul li.ui-state-active {
    background: white;
    border: medium none;
}

.content_tabs ul li.ui-state-hover {
    border: medium none;
}

.content_tabs ul li.ui-state-default,
.content_tabs ul li.ui-state-default a,
.content_tabs ul li.ui-state-default a:link,
.content_tabs ul li.ui-state-default a:visited {
    color: #88a6bc;
    font-weight: bold;
}

.content_tabs ul li.ui-state-default a:hover {
    color: black;
    font-weight: bold;
}

.content_tabs ul li.ui-state-active,
.content_tabs ul li.ui-state-active a,
.content_tabs ul li.ui-state-active a:link,
.content_tabs ul li.ui-state-active a:visited {
    color: black;
    font-weight: bold;
}

.content_tabs .ui-datalist .ui-datalist-empty-message {
    padding: 0;
}

.recordIcon {
    display: block;
    position: relative;
}

.recordIcon svg {
    fill: #666;
}

.recordIcon .resourceText {
    bottom: 9px;
    margin-left: 5px;
    position: relative;
}

.infoOverview .leftOverview {
    padding-right: 2em;
    vertical-align: text-top;
}

.leftOverview {
    font-weight: bold;
}

/*Component tree in view page*/
.componentTree {
    margin-bottom: 1em;
}

.componentTree .title {
    display: block;
    font-weight: bold;
}

.componentTree .note,
.componentTree .yearDate,
.componentTree .related,
.componentTree .link {
    display: block;
    font-weight: bold;
}

.componentTree .ui-tree-toggler {
    display: none;
}

.componentTree .ui-treenode-label {
    display: inline-block;
    margin: 2px 0 0;
    padding: 0;
    vertical-align: top;
}

.componentTree .ui-tree-selectable .ui-treenode-label,
.componentTree .ui-tree-selectable .ui-treenode-icon {
    cursor: default;
}

.componentTree li.ui-treenode.ui-treenode-parent li {
    line-height: 1.5;
    padding-left: 0;
}

.componentTree .ui-tree-selectable > .ui-treenode-label ul {
    padding-left: 0;
}

.componentTree .ui-tree-container {
    overflow: visible;
    padding: 0;
}

.componentTree ul.ui-dataList-data {
    padding-left: 0;
}

.componentTree .signumWrapper {
    border: 1px dashed #88a6bc;
    padding: 0 3px;
}

.componentTree .recordDeleted .ui-state-highlight {
    background: #ffffff none repeat scroll 0 0;
}

.componentTree .recordDeleted span.ui-treenode-label {
    text-decoration: line-through;
}

.componentTree h2 {
    font-weight: bold;
    margin: 0;
}

.componentTree .ui-state-highlight,
.componentTree .ui-widget-content .ui-state-highlight,
.componentTree .ui-widget-header .ui-state-highlight,
.componentTree .ui-treenode-label.ui-state-hover.ui-state-highlight {
    background: none;
}

.componentTree .title {
    display: block;
    font-weight: bold;
}
.componentTitle a.ui-icon-zoomin {
    display: inline-block;
    margin-left: 4px;
    vertical-align: top;
    width: 15px;
}

/*.componentTitle a.titleLink {
    display: inline-block;
    font-size: 1.4em;
    margin:0;
    width: auto;
}*/

.componentTitle.section {
    margin-top: 10px;
}

/*Transcription and translation */
.ui-widget-content .display_panel {
    height: 90%;
    width: 100%;
    border: 1px solid #cbc3be;
    overflow: hidden;
}
.display_panel .ui-panel-content,
.display_panel .pdf{
    height: 100%;
    width: 100%;
    overflow: auto;
}

.display_panel .text {
    border: medium none;
    font-size: large;
    height: 99%;
    width: 99%;
}
.control {
    display: inline-block;
    margin: 5px;
    vertical-align: top;
}

.control.download_button {
    margin-left: 10%;
}

.control_text {
    font-weight: bold;
    display: block;
}
.control_main {
    height: 19px;
    width: 350px;
    margin-top: 2px;
}

#aboutDialog,
#copyrightDialog {
    top: 5em !important;
}