/*
 * Base CSS for features added with this plugin
 * Styling is intentionally minimal. Further styling should be done in theme
 * 
 *
 */
 
 
/* Start: Recommended Isotope styles */

/**** Isotope Filtering ****/

.isotope-item {
  z-index: 2;
}

.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}

/**** Isotope CSS3 transitions ****/

.isotope,
.isotope .isotope-item {
  -webkit-transition-duration: 0.3s;
     -moz-transition-duration: 0.3s;
      -ms-transition-duration: 0.3s;
       -o-transition-duration: 0.3s;
          transition-duration: 0.3s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:      -o-transform, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}


/* Specials
 *-----------------------------------------------------*/
.type-specials {
    max-width: 600px;
    margin: 0 auto 30px;
    border: 1px solid;
    padding: 30px;
}

.type-specials .entry-header {
	padding: 0 0 10px 0;
}

.type-specials h1,
.type-specials h2,
.type-specials .entry-title {
    font-size: 3rem;
	text-align: center;
}

.type-specials p:last-of-type {
    margin-bottom: 0;
}


/* Neighborhood
 *-----------------------------------------------------*/

.acf-map {
    width: 96%;
    height: 600px;
    margin: 0 auto;
}

.acf-map img {
   max-width: inherit !important; /* Fixes potential theme css conflict. */
}


/* Tabcordion */

.ajh-tabcordion {
  margin: 0 auto 4rem auto;
}

.ajh-tabcordion.has-tabs .ajh-tabcordion--tabs {
  opacity: 1;
  height: auto;
  visibility: visible;
}

.ajh-tabcordion.has-tabs .ajh-tabcordion--entry {
  min-height: 0;
}

.ajh-tabcordion.has-tabs .ajh-tabcordion--entry::before {
  display: none;
}

.ajh-tabcordion.has-tabs .ajh-tabcordion--entry.is-active .ajh-tabcordion--entry-content {
  opacity: 1;
  transition: opacity 400ms ease-in-out;
}

.ajh-tabcordion.has-tabs .ajh-tabcordion--entry .ajh-tabcordion--entry-content {
  opacity: 0;
  transition: opacity 400ms ease-in-out;
}

.ajh-tabcordion--tabs {
  opacity: 0;
  height: 0;
  visibility: hidden;
  display: flex;
  flex-flow: wrap;
  margin: 0;
  list-style: none;
  padding: 0;
}

.filters-wrapper .tab {
  display: block;
  padding: 0.5rem 1rem;
  margin: 0 0 1px 0;
  cursor: pointer;
}

.filters-wrapper .tab:hover, 
.filters-wrapper .tab:focus,
.filters-wrapper .tab.is-active,
.filters-wrapper .active .tab,
.filters-wrapper .tab.selected,
.ajh-tabcordion--entry:hover::before, .ajh-tabcordion--entry:focus::before,
.ajh-tabcordion--entry.is-active::before,
.ajh-tabcordion--entry.is-active:hover::before, .ajh-tabcordion--entry.is-active:focus::before {
	background: #ddd;
	color: #000;
}

.ajh-tabcordion--entry {
  overflow: hidden;
}

.ajh-tabcordion--entry::before {
  position: relative;
  content: attr(data-title);
  cursor: pointer;
  z-index: 1;
  background: #000;
  color: #fff;
  padding: 0.5rem 1rem;
  display: block;
}

.ajh-tabcordion--entry:hover, .ajh-tabcordion--entry:focus {
  outline: none;
}

.ajh-tabcordion--entry.is-active .ajh-tabcordion--entry-content {
  margin-top: 0;
  height: auto;
  opacity: 1;
  transition: margin 400ms ease-out -100ms;
}

.ajh-tabcordion--entry-container {
  overflow: hidden;
  margin-bottom: 1px;
}

.ajh-tabcordion--entry-content {
  position: relative;
  margin-top: -100%;
  height: 0;
  opacity: 0;
  transition: margin 500ms ease-in;
  padding: 1rem;
}

/* Floor Plans 
 * ------------------------------------- */

/* Filter buttons */
.floorplans-container div#filters {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
              -ms-grid-row-align: center;
          align-items: center;	
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
	text-align: center;
    line-height: 1.2;
}

.floorplans-container div#filters .filter-button:not(:last-of-type) {
	margin-right: 15px;
}

.floorplans-container div#filters .filter-button {
    min-width: 140px;
    margin-bottom: 10px;
}

.sitemap-container.alignfull {
	padding: 0 2em !important;
}

/* Floor plans */
.floor-plan {
	margin-bottom: 25px;
}

.floor-plan-link-wrapper {
	position: relative;
}
.floor-plan-link-wrapper.unavailable{
  opacity: .3;
}

.floor-plan img {
    width: 80%;
    margin: auto;
    display: block;
}

.floor-plan-link {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    cursor: pointer;
    z-index: 10;
}

.tab-content {
	display: none; 
}

.tab-content.active {
    display: block;
}

.tour-iframe {
	display: none;
}

/* Engrain iframe */
.iframe-container {
	min-height: 800px;
	overflow: hidden;
	/* 16:9 aspect ratio */
	padding-top: 56.25%;
	position: relative;
}

.iframe-container iframe {
	border: 0;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}


@media (min-width: 600px) {	

	 .floor-plan {
		width: calc(50% - 30px); /* have to use floats because Isotope doesn't support css grid */
	}
	
}

@media (min-width: 960px) {	

	.acf-map { /* map can be full width on larger screens */
		width: 100%;
	}
	
	 .floor-plan {
		width: calc(33.3333% - 40px); 
	}
	
}