body
{
    margin: 0;
    padding: 0;
}

video
{
  width: 100%  !important;
  height: auto !important;
}

header
{
    width: 100%;
    margin-top: 1em;
    margin-bottom: 7px;
    padding-bottom: 7px;
    display: block;
    vertical-align: top;
    position: relative;
}

header #logout
{
    position: absolute;
    right: 5px;
    top: 5px;
}

input[type="file"]
{
    display: none;
}

article
{
    display: inline-block;
    vertical-align: top;
    width: 100%;
    padding-top: 0.5em;
}

h1
{
    display: block;
    margin: 0.3em 0;
    height: 1.3em;
}

header h1
{
    display: inline;
    vertical-align: text-bottom;
}

article h1
{
    margin-bottom: 0;
}

article h1 button,
article #tag_container button
{
    vertical-align: text-bottom;
    margin: 0 7px 0 11px;
    padding-top: 7px;
    padding-bottom: 7px;
}

section
{
    margin: 0 2.5% 37px 2.5%;
}

section#authentication
{
    margin: 0 auto;
    width: 40%;
    min-width: 30em;
}

section#authentication input
{
    width: 100%;
    padding: 3px;
}

section#authentication input#submit
{
    display: block;
    padding: 7px;
    margin: 37px auto;
    width: 60%;
}

section#authentication input#submit:hover,
section#authentication input#submit:focus
{
    margin-top: 38px;
    width: 59.5%;
}

section#navigation
{
    margin: 0 auto;
    width: 22.7em;
}

article section#navigation button
{
    width: 6em;
}

section#info
{
    width: 22.7em;
    margin: 17px auto;
}

section#info td
{
  padding: 7px 13px 0 ;
}

label h3
{
    display: inline-block;
    margin: 17px 0 3px 0; 
}

aside
{
  position: absolute;
  left: 7px;
  top: 5em;
}

.centered
{
    display: block;
}

.progress_entry
{
    padding: 0 7px;
    margin-bottom: 17px;
    display: block;
    overflow: hidden;
}


.column
{
    display: inline-block;
}

.progress_entry .column.status
{
    width: 12em;
    float: right;
}

#logo
{
    text-align: center;
    display: inline-block;
    overflow: hidden;
    width: 1.2em;
    height: 1.2em;
    margin-left: 0.37em;
    margin-top: 0.37em;
    -moz-border-radius: 50%;      /* Mozilla renderers */
    -webkit-border-radius: 50%;   /* webkit renderers */
    border-radius: 50%;           /* future proofing */
    -khtml-border-radius: 50%;    /* for old Konqueror browsers */
}

#droptarget
{
    width: 100%;
    display: block;
    height: 4.3em;
    padding: 0;
    margin: 0;
    margin-bottom: 13px;
    cursor: pointer;
}

#droptarget form
{
    height: 100%;
}

#droptarget label
{
    vertical-align: middle;
    height: 0;
    display: inline-block;
}

#droptarget *
{
    cursor: pointer;
}

#progress .placeholder,
#results .placeholder
{
    display: block;
}

section#search
{
    min-height: 16em;
}

section#search div
{
    margin: 0.6em 0;
}

select
{
    margin-left: 0.7em;
    padding: 5px;
}

section#search button
{
    margin: 0 9px;
}

section#navigation a
{
  display: inline-block;
  margin-bottom: 13px;
}

article section#search button,
article section#results .placeholder button,
article .info button.tag
{
  padding: 5px 13px;
  margin-right: 0.25em;
  margin-left: 0.25em;
  vertical-align: top;
}

article button.enabled
{
  cursor: pointer;
}

.search_result_entry
{
  min-height: 7.1em;
  margin-bottom: 1.3em;
}

.search_result_entry .icon
{
  height: 7.9em;
  width: 7.9em;
  padding: 0.2em;
  margin-right: 0.5em;
  display: inline-block;
}

.search_result_entry .icon img
{
  width: 100%;
  height: 100%;
  display: block;
  margin: 0;
  padding: 0;
}

.search_result_entry .info
{
  display: inline-block;
  vertical-align: top;
  max-width: 85%;
}

.search_result_entry .info .row
{
  display: block;
  height: 2.0em;
}

.search_result_entry .info .row h2
{
  display: inline-block;
  margin: 0 1em 0 0;
}

.search_result_entry .info .row.download
{
  height: 2.2em;
}

.search_result_entry .info .row.tags
{
  height: 2.7em;
}

.info .download_options a
{
  vertical-align: middle;
}

article input.button,
article button
{
    padding: 13px;
    cursor: pointer;
    -moz-border-radius: 13px 13px;      /* Mozilla renderers */
    -webkit-border-radius: 13px 13px;   /* webkit renderers */
    border-radius: 13px 13px;           /* future proofing */
    -khtml-border-radius: 13px 13px;    /* for old Konqueror browsers */
}

article .row.download button,
article .row.tags .add button,
article .row .filename button,
article .row .date button,
article #paging button
{
    padding: 5px 7px;
    margin-left: 5px;
    vertical-align: top;
    -moz-border-radius: 9px 9px;      /* Mozilla renderers */
    -webkit-border-radius: 9px 9px;   /* webkit renderers */
    border-radius: 9px 9px;           /* future proofing */
    -khtml-border-radius: 9px 9px;    /* for old Konqueror browsers */
}

article section#search button,
article section#results .placeholder button,
article .info button.tag
{
    -moz-border-radius: 9px 9px;      /* Mozilla renderers */
    -webkit-border-radius: 9px 9px;   /* webkit renderers */
    border-radius: 9px 9px;           /* future proofing */
    -khtml-border-radius: 9px 9px;    /* for old Konqueror browsers */
}

article button
{
    vertical-align: middle;
}

article button:hover
{
    margin-top: 2px;
}

article .row.download button:hover,
article .row.tags .add button:hover,
article .row .filename button:hover,
article .row .date button:hover,
article #paging button:hover
{
    margin-top: 1px;
}

div.vr
{
  width: 3px;
  height: 4.6em;
  margin: 2.2em 13px;
  display: inline-block;
  vertical-align: middle;
}

#tag_container
{
    min-height: 4em;
    padding-top: 17px;
}

#tag_container button.tag:hover
{
    margin-top: 1px;
    margin-left: 0.5em;
    padding-top: 6px;
    padding-bottom: 6px;
}

section#results #paging
{
    margin: 0 0 11px 0;
    height: 1.6em;
}

section#results #pages
{
    vertical-align: sub;
}

button.disabled
{
    cursor: default;
}

.spinner {
  display: inline-block;
  margin: 0;
  margin-right: 13px;
  margin-bottom: -0.3em;
  height: 1em;
  width: 1em;
  animation: rotateSpinner 0.67s infinite linear;
}
@keyframes rotateSpinner {
  0%    { transform: rotate(0deg); }
  100%  { transform: rotate(360deg); }
}


/* Never display these */
iframe,
#progress_template,
#result_template
{
    width: 0;
    height: 0;
    display: none;
}