/*  Theme Name: BN Voyage
    Description: BN Voyage
    Author: bn
    Tags: travel, grid, filterable
    Version: 1.0
*/

@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lato&display=swap');
body {
  font-family: 'Open Sans', sans-serif;
}

.navbar {
  background-color: transparent;
}

#navbar-logo {
  background: url("/wp-content/themes/BN_theme/img/logo.png") no-repeat center center;
  background-size: contain;
  margin-top: 0.5rem;
  width: 180px;
  height: 2.5rem;
}

.section {
  padding-top: 1.5rem;
}

h1, h2, h3, h4, nav, .tabs {
  font-family: 'Lato', sans-serif;
}

.table {
  width: 100%;
}

.table td:not([align]), .table th:not([align]) {
  text-align: center;
}

#search-container, #search-item, #search-form {
  flex: 1;
}

.filter {
  -webkit-transition: opacity 400ms;
  -moz-transition: opacity 400ms;
  -o-transition: opacity 400ms;
  -ms-transition: opacity 400ms;
  transition: opacity 400ms;
}

.lang-item, span {
  font-size: 0.9rem;
}

.card-toggle {
  cursor: pointer;
}

.card-content {
  text-align: left;
}

.swiper-button-next:after, .swiper-button-prev:after {
  font-size: 1.5rem;
}

.leaflet-popup-content-wrapper {
  font-weight: bold;
  border-radius: 0px;
  background: rgba(255, 255, 255, 0.9);
}

.leaflet-popup-content {
  width: 160px;
}

/*goto top button*/

#goto_top {
  position: fixed;
  width: 40px;
  height: 40px;
  bottom: 10px;
  right: 10px;
  z-index: 999;
  font-size: 1.2rem;
  border: none;
  outline: none;
  background-color: rgba(21, 21, 21, 0.7);
  color: white;
  cursor: pointer;
  padding-top: 7px;
  text-align: center;
}

#goto_top:hover {
  background-color: #1976D2;
}

.hide_top {
  display: none;
}

/* goto top button end */

@media screen and (max-width: 800px) {
  #navbar-logo {
    background: url("/wp-content/themes/BN-Voyage/img/logo_mobile.png") no-repeat center center;
    background-size: contain;
    width: 40px;
    height: 40px;
    margin: 0.5rem 0 0.5rem 0.5rem;
  }
  .is-responsive {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    display: block;
    position: relative;
  }
  .is-responsive td:empty:before {
    content: " ";
  }
  .is-responsive th, .is-responsive td {
    margin: 0;
    vertical-align: top;
  }
  .is-responsive th {
    text-align: left;
  }
  .is-responsive thead {
    border-right: solid 2px #dbdbdb;
    display: block;
    float: left;
  }
  .is-responsive thead tr {
    display: block;
    padding: 0 10px 0 0;
  }
  .is-responsive thead tr th::before {
    content: " ";
  }
  .is-responsive thead td, .is-responsive thead th {
    border-width: 0 0 1px;
  }
  .is-responsive tbody {
    display: block;
    width: auto;
    position: relative;
    overflow-x: auto;
    white-space: nowrap;
  }
  .is-responsive tbody tr {
    display: inline-block;
    vertical-align: top;
  }
  .is-responsive th {
    display: block;
    text-align: right;
  }
  .is-responsive td {
    display: block;
    min-height: 1.25em;
    text-align: left;
  }
  .is-responsive th:last-child, .is-responsive td:last-child {
    border-bottom-width: 0;
  }
  .is-responsive tr:last-child td:not(:last-child) {
    border: 1px solid #dbdbdb;
    border-width: 0 0 1px;
  }
  .is-responsive.is-bordered td, .is-responsive.is-bordered th {
    border-width: 1px;
  }
  .is-responsive.is-bordered tr td:last-child, .is-responsive.is-bordered tr th:last-child {
    border-bottom-width: 1px;
  }
  .is-responsive.is-bordered tr:last-child td, .is-responsive.is-bordered tr:last-child th {
    border-width: 1px;
  }
  #trans-table {
    width: 100%;
  }
  #trans-table #trans-thead {
    display: none;
  }
  #trans-table #trans-tr {
    display: block;
  }
  #trans-table #trans-td {
    display: block;
    text-align: right;
    border-bottom: 1px solid #dbdbdb;
  }
  #trans-td-excerpts {
    display: block;
    text-align: left;
  }
  #trans-table #trans-td:last-child {
    border-bottom: 0;
  }
  #trans-table #trans-td:before {
    content: attr(data-column);
    float: left;
    font-weight: bold;
  }
}