/* ------- version: 2023-07-24 --------*/

/* ============================================ */
/*                   COLOR                      */
/* ============================================ */

body {
/*  background-color: #EFEFEF;*/
  background-color: #FFF;
}

body.listing-page {
  background-color: #EFEFEF !important;
}

.footer {
  background-color: #111;
  color: #e2e2e2;
}

a {
  color: #05b16a;
}

.footer a {
  color: #05b16a;
}

/*--------COLOR:  nav bar --------------*/
.navbar-light .nav-link {
  color:  #666;
}

.navbar-dark .nav-link {
  color: #d0d0d0;
}

/* -------COLOR:  top-banner   --------*/
.top-banner {
  background-color: #05b16a;
}

.top-banner-content {
  color: #FFF;
}

/* -------COLOR:  main_content  --------*/
.main_content {
  background-color: #FFF;
  color: #444;
}

/* -------COLOR:  sidebar --------*/
.sidebar-card .card-header {
  background-color: #05b16a;
  /* border-bottom: none; */
  color: #FFF;
}

.sidebar-card .card-body a,
.sidebar-card .list-group a
 {
  /*text-decoration:none;*/
  color: #838383;
}

.sidebar-card .card-body a:hover
.sidebar-card .list-group a:hover {
  color: #444;
}

/* ------- COLOR:  article list --------*/
.article_index h2 a,
.article_include h3 a {
  color:#585858;
}

.article_info {
  color: #999;
}

/*---------- COLOR: arrticle_include_card --- */

.article_include_card .card-title a {
  color: #444;
}

.article_include_card .card-text {
  color: #666;
}

/*----------- COLOR: article blockquote background --- */
.main_content blockquote {
  background-color: #f0fdf6 !important;
}

/* ============================================ */
/*                   FONT                       */
/* ============================================ */

body {
  font-family: 'Roboto', sans-serif;
/*  font-family: 'PT Serif', serif;*/
}

h1,h2,h3,h4,h5,h6 {
  /*font-family: 'PT Serif', serif;*/
  font-family: 'Roboto', sans-serif;
}

.nav-link {
  font-family: 'Roboto', sans-serif;
/*  text-transform: uppercase;*/
  font-size: 1.05rem;
  margin-left: 5px;
}

.top-banner-content {
  /*font-family: 'PT Serif', serif;*/
  font-size: 1.5rem;
  font-weight: bold;
  text-shadow: none;
}

.sidebar-card .card-header {
  font-family: 'Roboto', sans-serif;
}

.sidebar-card .card-body {
  font-family: 'Roboto', sans-serif;
}

.page-item {
  font-family: sans-serif;
}

.listing-city, .listing-entry, .listing-section-title,  .listing_pagination{
  font-family: sans-serif;
}

.footer {
  font-family: sans-serif;
}

/* -------------------------- General  ----------------------------- */

body {
  line-height: 1.55rem;
}

h1,h2,h3,h4,h5,h6 {
  font-weight: bold !important;
}

h1 {
  font-size: calc(1.2rem + 1.45vw);
}

h1.main-title {
  font-size: 1.75rem;
  font-weight: bold;
  margin-bottom: 1.5rem;
}

a {
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

/* a:hover that with a class 'text-dark' */
.text-dark:hover, 
nav a:hover, 
.footer a:hover,
.btn:hover {
  text-decoration: none;
}

.clickable {
  cursor: pointer;
}

/* -------------------------- Footer ----------------------------- */

.footer {
  margin-top: 20px;
  padding: 6em 0;
  font-size: 1em;
}

/* -------------------------- Top Banner  ----------------------------- */

.top-banner {
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 1;
  position: relative;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

.top-banner-content {
  text-align: left;
}


/* ------------------- Borders & Margins --------------------------------- */

.main_content, .sidebar {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
  /*padding-top: 5px;*/
}

/* ---------------------- Main Content ------------------------------ */

.main_content {
  padding: 1.75rem 2.1rem;
  position:relative;
  overflow: hidden;
  text-align: left;
}

.main_content img {
  max-width: 100%;
  height: auto;
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}

.main_content h1 {
  font-size: calc(1.2rem + 1.45vw);
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}

.main_content h2 {
  font-size: 1.75rem;
  margin-top: 2rem;
  margin-bottom: 1.15rem;
}

.main_content h3 {
  font-size: 1.4rem;
  margin-top: 1.9rem;
  margin-bottom: 0.75rem;

}

.main_content h4,
.main_content h5 {
  font-size: 1.05rem;
}

.main_content strong, .main_content b {
  font-weight: bold !important;
}

.main_content .google-auto-placed, .main_content table {
  margin-bottom: 1rem !important;
}

.main_content blockquote {
  padding: 1rem;
  font-style: italic;
  background-color: #EDEDED;
  border-radius: 10px;
}

/*-------------------------- article -------------------------------*/
.article_entry {
  font-size: 17px;
  line-height: 1.7rem;
}

/* -------------------------- Sidebar ------------------------------ */

.sidebar-card {
  margin-bottom: 1rem;
  -webkit-box-shadow: 2px 2px 22px 0px rgba(230,230,230,1);
  -moz-box-shadow: 2px 2px 22px 0px rgba(230,230,230,1);
  box-shadow: 2px 2px 22px 0px rgba(230,230,230,1);
  border: 1px solid #e9e9e9;
  border-radius: 0;
}

.sidebar-card .card-header {
  font-size: 1.1rem;
  font-weight: bold;
  border-radius: 0;
}

.sidebar-card .card-body {
  font-size: 0.95rem;
}


.sidebar-card .card-body ul {
  /*margin-left: 1.2rem;*/
  margin-top: -0.5rem;
  margin-bottom: -0.5rem;
  padding-left: 0;
}

.sidebar-card .card-body li {
  border-bottom: 1px solid #D5D5D5;
  list-style: none;
  padding: 0.3rem;
}

.sidebar-card .card-body li:last-child {
  border-bottom: none;
  /*padding-bottom: 8px;*/
}


/* ------------------------ Article Lists -------------------------- */

.article_include, .article_index {
  padding: 1.5rem;
  background-color: #FFF;
  -webkit-box-shadow: 2px 2px 22px 0px rgba(230,230,230,1);
  -moz-box-shadow: 2px 2px 22px 0px rgba(230,230,230,1);
  box-shadow: 2px 2px 22px 0px rgba(230,230,230,1);
  border: 1px solid #e9e9e9;
  border-radius: 0;
  margin-bottom: 1rem;
}

img.article_thumbnail {
  display:inline;
  float:left;
  margin: 0.3rem 1rem 1rem 0;
  width: 190px;
  height: 190px;
  object-fit: cover;
  object-position: center;
}

/*.article_index,
.article_include {
  padding-bottom: 1rem;
  margin-bottom: 1.25rem;
  border-bottom: 1px solid #EDEDED;
}*/

.article_index:last-child,
.article_include:last-child {
  border-bottom: none;
  margin-bottom: 0;
}

.article_index h2,
.article_include h3 {
  font-size: 1.5rem;
  font-weight: bold;
  margin-bottom: 0.8rem;
}

.article_info {
  font-style:italic;
  margin-top: 8px;
  margin-bottom: 10px;
}

/* ----------------------- article card layouts -------------------- */
.article_include_card {
  border-radius: 0 !important;
  -webkit-box-shadow: 2px 2px 22px 0px rgba(230,230,230,1);
  -moz-box-shadow: 2px 2px 22px 0px rgba(230,230,230,1);
  box-shadow: 2px 2px 22px 0px rgba(230,230,230,1);
  border: 1px solid #e9e9e9;
}

.article_include_card .card-title {
  font-size: 20px;
  line-height: 1.65rem;
}

.article_include_card .card-text {
  font-size: 15px;
}

.article_include_card .article_info_top_card {
  /*background-color: #EDEDED;*/
  margin-bottom: 10px;
}

.article_include_card .article_info_top_card,
.article_include_card .article_info_bottom_card {
/*  background-color: #EDEDED;
  padding: 0px 8px;
  border-radius: 3px;*/
}

img.article_thumbnail_card {
  height: 200px;
  object-fit: cover;
  object-position: center;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
}


/************************ begin pagination styles ************************/

/*---- old ------*/
a.page-link {
  color: #666;
}

/*---- old ------*/
.page-item.active .page-link {
  background-color: #666;
  border-color: #666;
}

div.pagination-section {
  margin: 10px auto;
  text-align: center;
}
div.pagination_wrapper {
  clear:both;
  padding: 3px;
  margin: 1.5rem auto;
}
div.pagination {
/*  padding: 5px;
  margin: 10px;*/
  background: none;
  display: inline-block;
  font-size:16px;
}
div.pagination a,
div.pagination span.current,
div.pagination span.disabled {
  padding: 3px 8px;
  margin: 1px;
  border: 1px solid #cacaca;
  text-decoration: none;
  border-radius: 2px;
}
.dark-mode div.pagination a,
.dark-mode div.pagination span.current,
.dark-mode div.pagination span.disabled {
  border: 1px solid #848484;
}
div.pagination a {
  color: #444;
  background-color: #FFF;
}
.dark-mode div.pagination a {
  color: #FFF;
  background-color: #000;
}
div.pagination a:hover, div.pagination a:active {
  border: 1px solid #666;
  color: #000;
}
.dark-mode div.pagination a:hover,
.dark-mode div.pagination a:active {
  color: #EDEDED;
}
div.pagination span.current {
  /*font-weight: bold;*/
  background-color: #7fbd42;
   border-color: #7fbd42;
  color: #FFF;
}
div.pagination span.disabled {
  color: #b1b1b1;
}

/************************ begin listing styles ************************/

body.listing-page {
  /*background-color: #EFEFEF !important;*/
}
h1.page-title {
  text-align: center;
  margin-bottom: 40px!important;
  font-size: 32px;
}

div.listing-entry h2 {
  font-size: 28px;
  margin-top: 10px;
  margin-bottom: 10px;
}

div.main-column-content {
  /* outline: 1px dashed gray; */
  clear:both;
  margin: 0 auto;
  padding: 0;
  text-align:left;
}

div.ad-box {
  /* outline: 1px dashed gray; */
  float:left;
  clear:both;
  /*background:#FCFCFC;*/
  padding: 12px;
  color:#666;
  width: 100%;
  margin-top: 15px;
  margin-bottom: 15px;
  text-align: center;
  border: 1px solid #CDCDCD;
}

div.ad-box-large {
  text-align: center;
  clear:both;
  padding: 25px 12px;
  color:#666;
  width: 100%;
  margin-top: 15px;
  margin-bottom: 15px;
  text-align: center;
  border: 1px solid #CDCDCD;
}

.listing_container {
  margin-top: -20px !important;
  margin-bottom: -40px;
}

.listing_row {
  background-color: #CCC;
  margin-top: -20px;
  margin-left: 0px;
  margin-right: 0px;
  border-radius: none !important;
}

.listing_main_content {
  padding-left: 90px;
  padding-right: 90px;
}

.listings {
  text-align:center;
  /*width: 380px;*/
}

.listing_title {
  font-size:17px;
  padding-top:10px;
  padding-bottom:10px;
  text-align:center;
  margin: 0 auto;
}

.listing_pagination {
  font-size: 12px;
  font-weight: bold;
  clear:both;
  margin: 10px  auto;
  width: 360px;
  text-align:center;
}

div.listing-city {
  /* outline: 1px dashed gray; */
  float:left;
  clear:both;
  background:#FCFCFC;
  padding: 20px 25px;
  color:#666;
  width: 100%;
  margin-bottom: 20px;
  text-align: left;
  border: 1px solid #CDCDCD;
}

div.listing-info {
  /* outline: 1px dashed gray; */
  /*width: 230px;*/
  float:left;
  text-align:left;
  margin: 0px;
  padding: 0px;
}

.listing-info a {
  color:#000080;
  text-decoration:none;
}

div.listing-info-no-thumb {
  /* outline: 1px dashed gray; */
  float:left;
  /*width: 364px;*/
  text-align:left;
  padding: 0px;
}

.listing-info-no-thumb a {
  color:#000080;
  text-decoration:none;
}

div.listing-address {
  margin-top: 5px;
  margin-bottom: 5px;
}

div.listing-phone {
  margin-top: 5px;
  margin-bottom: 5px;
}

div.major_links {
  text-align:center;
  margin: 8px;
  /*font-size:13px;*/
}

div.listing-thumb {
  /* outline: 1px dashed gray; */
  width: 130px;
  float:right;
  padding: 2px;
  margin: 0;
}

a.listing-thumb {
  text-decoration:none;
}

.listing-thumb img{
  border: 1px solid #999999;
}

div.listing-city-link_box {
  float:left;
  background:#FCFCFC;
  padding: 12px;
  color:#666;
  width: 100%;
  margin-top: 10px;
  margin-bottom: 10px;
  border: 1px solid #CDCDCD;
  font-size: 0.9em;
  text-align:center;
  clear:both;
}

div.listing-entry {
  /*background:#FCFCFC;*/
  width: 100% !important;
  clear: both;
  padding: 10px 30px;
  color:#000;
  margin-top: 15px;
  margin-bottom: 15px;
  /*border: 1px solid #CCC;*/
}

div.listing-entry-textbox {
  /*background:#FCFCFC;*/
  width: 100%;
  clear: both;
  padding: 12px;
  color:#666;
  margin-top: 15px;
  margin-bottom: 15px;
  /*border: 1px solid #CCC;*/
}

div.listing-entry-map {
  clear: both;
  margin-top: 15px;
  margin-bottom: 15px;
  padding: 8px;
  text-align: center;
  /*border: 1px solid #CCC;*/
}

div.listing-entry h2 {
  font-size: 28px;
  margin-top: 10px;
  margin-bottom: 10px;
}


h2.listing-other-city-title {
  color:#000000;
  font-size: 24px;
  font-weight:bold;
  clear:both;
  text-align:center;
  margin: 0 auto;
  padding-top: 20px;
  padding-bottom: 10px;
}
.listing-name {
  padding-left: 0px;
  margin-left: 0px;
  margin-bottom: 10px;
  font-size: 18px;
  color:#333;
}
a.listing-title-link {
  text-decoration:none;
  color:#000080;
}

.listing-city img {
   padding: 4px;
  background-color: #FFF;
  border-color:#CCC;
  border-width:1px;
}
.listing-entry img{
    padding: 2px;
  border-color:#CCC;
  border-width:1px;
}
div.listing-details {
  /*outline: 1px dashed gray; */
  width: 364px;
  float:left;
  text-align:left;
  clear:both;
}
.bold_text {
  font-weight:bold;
  color: #333;
}
.listing-large-sidebar {
  border: 1px solid #CCC;
  text-align: center;
  padding: 10px 25px;
  background-color: #FFF;
  margin-top: 40px;
}

/* -------------------------- Media Queries ----------------------------- */

@media (max-width: 575.98px) {
  body {
    background: #FFF;
  }
  .cover-banner {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .cover-banner-content h1 {
    font-size: 1.85rem;
  }
  .cover-banner-content h3 {
    font-size: 1.15rem;
  }
  .top-banner {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }

  .main_content, .sidebar {
    margin-top: 0;
    margin-bottom: 0;
  }

  .main_content {
    padding: 0.95rem 0.15rem;
  }

  img.article_thumbnail {
    width: 100%;
    object-fit: cover;
    object-position: center;
    height: 25vh;
    overflow: hidden;
    margin-bottom: 1rem;
  }

  div.listing-city, div.ad-box, div.listing-entry-textbox,
  div.listing-city-link_box, div.listing-entry {
    margin: 8px 0px;
  }
  div.ad-box {
    padding: 8px 0;
    overflow: hidden;
  }
  .listing_main_content {
    padding-left: 0px;
    padding-right: 0px;
  }
  .listing_row {
    background-color: #FFF;
  }

}

