body {
  font-family: var(--editorFont);
  --pb-heading-font-family: var(--editorFont);
}

main {
   margin: 0 20px 0 20px;
   --pb-browse-toolbar-justify-content: space-between;
}

app-header-layout {
   background-image: url('resources/images/triangle-background.jpg');
   background-size: 100% auto;
   background-repeat-x: no-repeat;
   background-color: #e8fafa;
   min-height: 100vh;
}

@media (max-width: 1023px) {
   main {
       margin: 0 8px 0 8px;
   }
   .doclist {
       margin-bottom: 20px;
   }
   .documents {
       padding-left: 10px;
   }
   .documents .label {
       display: none;
   }
   .toolbar pb-search {
       padding-left: 0;
   }
   #facets {
       display: none;
   }
   app-header-layout {
       background-repeat-y: no-repeat;
   }
   .panels {
       display: grid;
       grid-template-columns: 1fr minmax(220px, 20vw);
       column-gap: 16px;
       max-width: content-width;
   }
}

.tp-title {
   font-family: var(--pb-heading-font-family);
   font-size: 36px;
   font-weight: 400;
}

.tp-title span {
   color: #9e9e9e;
   font-size: 26px;
   margin-top: 12px;
}

@media (min-width: 1024px) {
   .toolbar {
       display: none;
   }
.panels {
       display: grid;
       grid-template-columns: 1fr minmax(220px, 30vw);
       column-gap: 16px;
       max-width: 1100px;
   }
.panels {
   margin-bottom: 40px;
   margin-right: auto;
   margin-left: 40px;   
}

.panels .doclist {
   --paper-tabs-selection-bar-color: #607D8B;
   --paper-tab-content: {
       font-family: var(--editorFont);
       font-weight: 400;
   
   --paper-card-header: {
       background-color: #d1dae0;
   
   --paper-card-header-text: {
       font-family: var(--editorFont);
       font-size: 16px;
       font-weight: 400;
}

.panels .doclist .card-content {
   padding: 0;
}

.panels .doclist .browse {
   display: grid;
   grid-template-columns: auto 1fr;
   column-gap: 16px;
   padding: 0;
}

.panels .doclist dts-client {
   padding: 0 20px;
}

aside {
   flex: 1;
   display: flex;
   flex-direction: column;
}

aside .odds,
aside .upload {
   --paper-card-header: {
       background-color: #607D8B;
   
   --paper-card-header-text: {
       font-family: var(--pb-heading-font-family);
       font-size: 16px;
       font-weight: 400;
       color: white;
   }
   

aside .upload {
   margin-bottom: 20px;
   width: 100%;
}

.browse aside {
   padding: 0 10px;
}

pb-select {
   margin-top: 0;
}

#document-list {
   margin-top: 1rem;
}

.parent-link iron-icon {
   padding-right: 4px;
}

.parent-link {
   display: block;
   margin-bottom: 10px;
   padding: 6px 0;
}

.collection {
   margin-top: 8px;
   padding-top: 12px;
   /* border-top: thin solid var(--paper-grey-300); */
}

.documents img, .documents svg {
   margin-right: 40px;
}

@media (max-width: 1023px) {
   .documents img, .documents svg  {
       display: none;
   }
}

.documents ul {
   list-style: none;
}

.documents div {
   margin: 0;
}

.documents .error {
   color: #c02020;
}

.documents a,
.documents a:visited {
   color: #303F9F;
   text-decoration: none;
}

.documents li {
   display: flex;
   flex-direction: row;
   margin-bottom: 10px;
   padding: 6px 0;
   border-bottom: thin solid var(--paper-grey-300);
}

.documents li:last-child {
   border: none;
}

.documents .document-select {
   flex: 0 0;
   margin-right: 20px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
   font-family: var(--pb-heading-font-family);
   font-weight: 400 !important;
   line-height: 1.2;
}

h1 {
   font-size: 0.8rem;
}

h5 {
   font-size: 20px;
   margin-bottom: 5px;
 
}

.welcome {
   display: grid;
   grid-template-columns: 1fr 400px;
   align-items: center;
   min-height: 15vh;
   width: 100%;
}

.side {
   max-width: 40vw;
   padding-left: 3em;
}

.side strong {
   color: var(--pb-color-focus);
}

.thumbnail img {
   border-radius:35px;
   border-color: #19232d;
   border-style: groove;
   box-shadow: 1px 1px 1px 1px  #19232d;
}

/* hide Download menu button */
#download-button {
   display: none;
}