/* 
Extra small devices (portrait phones, less than 544px) 
No media query since this is the default in Bootstrap because it is "mobile first"
*/
/* thanks to  https://bootstrapcreative.com/can-adjust-text-size-bootstrap-responsive-design/ */
h1 {
  font-size: 1.5rem;
} /*1rem = 16px*/
/*
####################################################
M E D I A  Q U E R I E S
####################################################
*/

/*
::::::::::::::::::::::::::::::::::::::::::::::::::::
Bootstrap 4 breakpoints
*/
/* Small devices (landscape phones, 544px and up) */
@media (min-width: 544px) {
  h1 {
    font-size: 2rem;
  }
  /*1rem = 16px*/
  .price2 {
    font-size: 1.5rem;
  }
}

/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
@media (min-width: 768px) {
  h1 {
    font-size: 2rem;
  } /*1rem = 16px*/
  .price2 {
    font-size: 1.5rem;
  }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
  h1 {
    font-size: 2.5rem;
  } /*1rem = 16px*/

  .rnd img {
    border-radius: 0 12px 12px 0 !important;
  }

  .specbox {
    border-radius: 12px 0 0 12px !important;
  }
} /*END custom media queries*/

.specbox {
  border-radius: 0 0 12px 12px;
  padding: 1em !important;
} /*mobile padding*/

@media (min-width: 768px) {
  .specbox {
    padding: 1.5rem !important;
  } /*more padding specbox on tablet+ */

  .px-4md {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
  } /* replicate px-4 class for md devices and larger */
}

.rnd img {
  border-radius: 12px 12px 0 0;
}

.main {
  margin-top: 70px;
}

.sqft {
  /*margin-bottom: 1em;*/
  color: #595959;
  font-size: 14px;
  /*    text-transform:uppercase;*/
}

.startfrom {
  color: #595959;
  line-height: 0.5em;
  margin-top: -1em;
  margin-bottom: 2em;
  text-transform: uppercase;
  font-size: 12px;
}

.startfromihl {
  color: #595959;
  line-height: 0.5em;
  margin-top: 1.5em;
  margin-bottom: 0.5em;
  text-transform: uppercase;
  font-size: 18px;
}

.btn-primary {
  background-color: #a01e21;
}

.imgcover {
  height: 100%;
  object-fit: cover;
}

.imgcoverh {
  width: 100%;
  object-fit: cover;
}

.imgcoverwh {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body {
  font-family: azo-sans-web, sans-serif;
  font-weight: 300;
  font-style: normal;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: azo-sans-web, sans-serif;
  font-weight: 700;
  font-style: normal;
}

.start {
  vertical-align: middle;
}

.price {
  text-align: center;
  color: #a01e21;
  font-family: azo-sans-web, sans-serif;
  font-weight: 700;
  font-size: 28px;
}

/* ALBUM.CSS from bootstrap below */

.jumbotron {
  padding-top: 3rem;
  padding-bottom: 3rem;
  margin-bottom: 0;
  background-color: #fff;
}
@media (min-width: 768px) {
  .jumbotron {
    padding-top: 6rem;
    padding-bottom: 6rem;
  }
}

.jumbotron p:last-child {
  margin-bottom: 0;
}

.jumbotron h1 {
  font-weight: 500;
}

.jumbotron .container {
  max-width: 40rem;
}

footer {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

footer p {
  margin-bottom: 0.25rem;
}

.hbedbath {
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #595959;
  padding-bottom: 10px;
}

.hbedbath ul,
.hfppg ul {
  margin-left: 2.2em;
}
.hbedbath ul li,
.hfppg ul li i {
  margin: 0 3em 0 0;
}
.hbedbath ul li i,
.hfppg ul li i {
  margin-right: 0.3em;
}

section.homedetails div {
  margin-left: 4em;
  margin-right: 4em;
}

/*
/* START ORIGINAL CSS FROM LANDING PAGE BELOW
/* EVERYTHING ABOVE ADDED FOR INDIVIDUAL LISTING PAGES 
/* */

body {
  font-family: "Josefin Sans", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #333333;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Josefin Sans", sans-serif;
  font-weight: 700;
  font-style: normal;
}

h1 {
  font-size: 2rem;
}

a {
  color: #25235e;
}

a:hover {
  color: #363389;
}

a:focus {
  color: #363389;
}

.navbar-collapse {
  text-align: center;
}

.fa-bars {
  text-align: center;
  margin: 0.25rem 0 0 0.25em;
}

.logo img {
  max-width: 350px;
}

.nav-item {
  font-size: 1.2rem;
}

.navbar-brand img {
  max-width: 100%;
  max-height: 80px;
}

@media (max-width: 768px) {
  .navbar-brand img {
    max-width: 50px;
  }
}

.nav-item a:hover {
  text-decoration: underline;
}

.lhouse {
  text-align: left;
}

.rhouse {
  text-align: right;
}

.housecard {
  background-color: white;
}

.bg-test {
  background-image: url("https://mcusercontent.com/482e83768fa04f6b28a8d589c/images/b5537eee-c5df-4d45-bd07-89cab6cb0a0a.jpg");
}

.sqft {
  color: #595959;
  font-size: 1rem;
  /*    text-transform:uppercase;*/
}

.cardicon {
  display: inline-block;
  min-width: 32px;
}

.sqft .fas {
  color: #363389;
}

.statwrap {
  text-align: left;
  margin: 0;
  padding: 0;
}

.price2 {
  font-size: 1.5rem;
  color: #333333;
  font-family: "Josefin Sans", sans-serif;
  font-weight: 700;
  text-align: right;
  margin-top: 1em;
}

.startfrom {
  color: #595959;
  line-height: 0.5em;
  margin-top: -1em;
  margin-bottom: 2em;
  text-transform: uppercase;
  font-size: 12px;
}

.shadow-sm {
  box-shadow: rgba(0, 0, 0, 0.075) 0px 2px 4px 0px;
}

.btn-ph {
  text-transform: uppercase;
  font-weight: 400;
  /*  letter-spacing:1px;*/
  padding: 1rem;
  box-shadow: 3px 3px 0 0 #b0bdd6;
  border-radius: 0;
}

.btn-ph-primary {
  background-color: #25235e;
}

.btn-primary:hover {
  background-color: #363389;
}

.btn-ph:hover {
  background-color: #363389;
}

.btn-invert {
  background-color: #fff;
  border-width: 2px;
  border-color: #25235e;
  box-shadow: 3px 3px 0 0 #b0bdd6;
  color: #25235e;
}

.btn-invert:hover,
.btn-invert:active {
  color: #fff;
  background-color: #25235e;
  border-color: #b0bdd6;
  text-decoration: underline;
}

.imgcover {
  height: 100%;
  object-fit: cover;
}

.start {
  vertical-align: middle;
}

.price {
  text-align: center;
  color: #a01e21;
  font-family: "Josefin Sans", sans-serif;
  font-weight: 700;
  font-size: 28px;
}

.fas {
  margin-right: 10px;
}

.navbar {
  background-color: #e5e9f1;
}
.navbar .navbar-brand {
  color: #25235e;
}
.navbar .navbar-brand:hover,
.navbar .navbar-brand:focus {
  color: #363389;
}
.navbar .navbar-text {
  color: #25235e;
}
.navbar .navbar-text a {
  color: #363389;
}
.navbar .navbar-text a:hover,
.navbar .navbar-text a:focus {
  color: #363389;
}
.navbar .navbar-nav .nav-link {
  color: #25235e;
  border-radius: 0.25rem;
  margin: 0 0.25em;
}
.navbar .navbar-nav .nav-link:not(.disabled):hover,
.navbar .navbar-nav .nav-link:not(.disabled):focus {
  color: #363389;
}
.navbar .navbar-nav .nav-item.active .nav-link,
.navbar .navbar-nav .nav-item.active .nav-link:hover,
.navbar .navbar-nav .nav-item.active .nav-link:focus,
.navbar .navbar-nav .nav-item.show .nav-link,
.navbar .navbar-nav .nav-item.show .nav-link:hover,
.navbar .navbar-nav .nav-item.show .nav-link:focus {
  color: #363389;
  background-color: #bfc9dc;
}
.navbar .navbar-toggler {
  border-color: #bfc9dc;
}
.navbar .navbar-toggler:hover,
.navbar .navbar-toggler:focus {
  background-color: #bfc9dc;
}
.navbar .navbar-toggler .navbar-toggler-icon {
  color: #25235e;
}
.navbar .navbar-collapse,
.navbar .navbar-form {
  border-color: #25235e;
}
.navbar .navbar-link {
  color: #25235e;
}
.navbar .navbar-link:hover {
  color: #363389;
}

.dropdown-item {
  color: #25235e;
}

.dropdown-item:focus,
.dropdown-item:hover {
  color: #363389;
}

@media (max-width: 575px) {
  .navbar-expand-sm .navbar-nav .show .dropdown-menu .dropdown-item {
    color: #25235e;
  }
  .navbar-expand-sm .navbar-nav .show .dropdown-menu .dropdown-item:hover,
  .navbar-expand-sm .navbar-nav .show .dropdown-menu .dropdown-item:focus {
    color: #363389;
  }
  .navbar-expand-sm .navbar-nav .show .dropdown-menu .dropdown-item.active {
    color: #363389;
    background-color: #bfc9dc;
  }
}

@media (max-width: 767px) {
  .navbar-expand-md .navbar-nav .show .dropdown-menu .dropdown-item {
    color: #25235e;
  }
  .navbar-expand-md .navbar-nav .show .dropdown-menu .dropdown-item:hover,
  .navbar-expand-md .navbar-nav .show .dropdown-menu .dropdown-item:focus {
    color: #363389;
  }
  .navbar-expand-md .navbar-nav .show .dropdown-menu .dropdown-item.active {
    color: #363389;
    background-color: #bfc9dc;
  }
}

@media (max-width: 991px) {
  .navbar-expand-lg .navbar-nav .show .dropdown-menu .dropdown-item {
    color: #25235e;
  }
  .navbar-expand-lg .navbar-nav .show .dropdown-menu .dropdown-item:hover,
  .navbar-expand-lg .navbar-nav .show .dropdown-menu .dropdown-item:focus {
    color: #363389;
  }
  .navbar-expand-lg .navbar-nav .show .dropdown-menu .dropdown-item.active {
    color: #363389;
    background-color: #bfc9dc;
  }
}

@media (max-width: 1199px) {
  .navbar-expand-xl .navbar-nav .show .dropdown-menu .dropdown-item {
    color: #25235e;
  }
  .navbar-expand-xl .navbar-nav .show .dropdown-menu .dropdown-item:hover,
  .navbar-expand-xl .navbar-nav .show .dropdown-menu .dropdown-item:focus {
    color: #363389;
  }
  .navbar-expand-xl .navbar-nav .show .dropdown-menu .dropdown-item.active {
    color: #363389;
    background-color: #bfc9dc;
  }
}

.navbar-expand .navbar-nav .show .dropdown-menu .dropdown-item {
  color: #25235e;
}
.navbar-expand .navbar-nav .show .dropdown-menu .dropdown-item:hover,
.navbar-expand .navbar-nav .show .dropdown-menu .dropdown-item:focus {
  color: #363389;
}
.navbar-expand .navbar-nav .show .dropdown-menu .dropdown-item.active {
  color: #363389;
  background-color: #bfc9dc;
}

.phdblue {
  color: #25235e;
}

.phbgblue {
  background-color: #e5e9f1;
}

.card-title {
  text-align: left;
  font-size: 1.25rem;
}

#floorplanmodal {
  display: none;
}

.thumbs img {
  margin-top: 1em;
  width: 100%;
  height: auto;
}

/* ACCORDION */
.minimalist-accordion__panel[aria-hidden="true"] {
  display: none;
}

.minimalist-accordion__header {
  display: block;
}

/* title opened */
.minimalist-accordion__header[aria-expanded="true"]:before {
  content: "- ";
}
/* title closed */
.minimalist-accordion__header[aria-expanded="false"]:before {
  content: "+ ";
}

/* title selected */
.minimalist-accordion__header[aria-selected="true"]:after {
  content: " (sel)";
}
/* title non selected */
.minimalist-accordion__header[aria-selected="false"]:after {
  content: " (unselc)";
}

.modaal-gallery-item img {
  max-height: 85vh;
}

.gallery-more {
  margin-top: 1em;
  display: flex;
  text-align: center;
  line-height: 100%;
}

.morewrap {
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  text-align: center;
  background-color: #eaeef3;
}

.gallery-more span {
  display: inline;
  vertical-align: middle;
  line-height: 100%;
  font-size: 1.5rem;
}

//
// Stretched link
//

.stretched-link {
  &::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    // Just in case `pointer-events: none` is set on a parent
    pointer-events: auto;
    content: "";
    // IE10 bugfix, see https://stackoverflow.com/questions/16947967/ie10-hover-pseudo-class-doesnt-work-without-background-color
    background-color: rgba(0, 0, 0, 0);
  }
}

.features ul {
  padding-left: 0;
}

.features li {
  padding: 0.5rem 1rem;
  list-style-type: none;
}

.features li:nth-child(2n + 1) {
  background-color: #ffffed;
}

.btn-ph .fa-li {
  position: absolute;
  left: 2.5em;
  margin-right: -3em;
  font-size: 1.2rem;
}

.hfppg .btn {
  border-radius: 6px;
  padding: 0.5em;
  letter-spacing: 1px;
}

.pillbtn {
  border-radius: 6px;
  padding: 0.5em;
  letter-spacing: 1px;
}

.features .card-header,
.card {
  background-color: transparent;
  border-width: 2px 2px 1px 2px;
}

.features button {
  color: #25235e;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.features .card-header {
  padding: 0.5rem 1.25rem;
}

.features .card {
  margin-bottom: 1em;
}

.white {
  color: #fff;
}

.white.btn.btn-ph.btn-ph-primary.btn-block.stretched-link:hover {
  color: #fff;
}

.white.btn.btn-ph.btn-ph-primary.btn-block.stretched-link:active {
  color: #fff;
}

.white.btn.btn-ph.btn-ph-primary.btn-block.stretched-link:focus {
  color: #fff;
}