@import url('https://fonts.googleapis.com/css?family=Merriweather+Sans');

body {
    font-family: 'Merriweather Sans', sans-serif;
}

@font-face {
    font-family: 'icomoon';
    src: url('fonts/icomoon.ttf?hl3fqx') format('truetype'),
    url('fonts/icomoon.woff?hl3fqx') format('woff'),
    url('fonts/icomoon.svg?hl3fqx#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

h1 {
  font-size: 36px;
}

.icon {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    font-size: 18px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.icon--download:before {
    content: "\e900";
}

.icon--chevron-up-down:before {
    content: "\e96c";
}

.icon--arrow-left:before {
    content: "\e905";
}

.icon--arrow-right:before {
    content: "\e906";
}

.icon--delete:before {
    content: "\e959";
}

.icon--search:before {
    content: "\e95e";
}

.icon--close:before {
    content: "\e965";
}

/* overwrite */
.btn {
    border-radius: 0;
    min-width: 175px;
    padding: 10px 20px;
}

.btn-warning {
    background-color: #f4c20e;
}

.btn-dark {
    background-color: #1e1e1e;
}

.form-control {
    border-radius: 0;
}

.form-group {
  margin-bottom: 10px;
}

input::-webkit-input-placeholder {
    font-size: 16px !important;
    font-weight: normal;
}

th {
    font-size: 12px;
}

a {
    color: #1e1e1e;
}

.btn-dark {
    background-color: #1e1e1e;;
}

.placeholder-ein::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    font-size: 12px;
    color: #bbbbbb;
    opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: red;
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: red;
}

/*popup*/
.popup {
    display: none;
}

.popup:target {
    display: block;
}

.popup .overlay {
    background-color: rgba(0, 0, 0, 0.5);
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    color: transparent;
}

.popup .dialog {
    background-color: white;
    padding: 33px 120px 50px 120px;
}

.popup .dialog > .header h1 {
    font-size: 14px;
    padding: 10px;
    content: "\00D7";
}

.popup .dialog > .message {
    font-size: 13px;
    padding: 30px 0 50px 0;
}

.center-fix-xy {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.buttonset {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-flow: space-between;
    justify-content: space-between;
    align-items: stretch;
    align-content: stretch;
}

.buttonset > * {
    flex: 1 auto;
}
/* end popup */

.table td, .table th {
    vertical-align: middle;
}

a:hover {
  text-decoration: none;
}

.counter {
  font-size: 12px;
  margin-bottom: 0;
}

.icon--counter {
  font-size: 25px;
}

.imagecounter {
  position: relative;
  top: -6px;
}

.btn-outline-dark:hover {
  background-color: #1e1e1e;
}

.searchbar p {
  position: relative;
}

.searchbar p .icon--search {
  position: absolute;
  top: 7px;
  left: 323px;
  font-size: 25px;
}

@media all and (max-width: 425px) {
  .counter {
    margin-bottom: 10px;
    padding-left: 15px;
  }

  .counterview {
    margin-right: 10px !important;
  }

  .icon--counter {
    font-size: 20px;
  }

  .imagecounter {
    top: -4px;
  }

  .popup .dialog {
    max-width: 320px;
    padding: 50px;
  }

  .popup .dialog h3 {
    font-size: 24px !important;
  }

  .popup .dialog .message {
    font-size: 16px !important;
  }

  .popup .dialog .buttonset {
    flex-direction: column;
  }

  .popup .dialog .buttonset .btn {
    margin-left: 0 !important;
    margin-top: 20px;
  }

  .searchbar {
    padding-top: 0 !important;
  }

  .table__file--date, .table__date {
    display: none;
  }
}

@media all and (min-width: 768px) {
  .counter {
    position: relative;
    top: 24px;
  }

  .searchbar {
    padding-right: 0;
  }
}

@media all and (max-width: 475px) {
  .btn {
    width: 100%;
  }

  .btn-delete {
    margin: 0 !important;
  }

  .btn-download {
    margin-bottom: 15px;
    margin-top: 50px;
  }

  .btn-delete, .btn-download {
    position: relative;
    right: 8px;
  }
}

@media all and (max-width: 1200px) {
  .searchbar p .icon--search {
    left: 269px;
  }
}

@media all and (max-width: 992px) {
  .searchbar p .icon--search {
    left: 190px;
  }
}

@media all and (max-width: 767px) {
  .searchbar {
    margin-top: 10px;
    padding: 0;
  }

  .searchbar p .icon--search {
    display: none;
  }
}

@media all and (max-width: 575px) {
  .counter {
    padding: 0 15px;
  }

  .searchbar {
    padding: 15px;
  }
}


