* {
  box-sizing: border-box;
}

div.mySlides img {
  vertical-align: middle;
}

/* Position the image container (needed to position the left and right arrows) */
.mySlides_container {
  position: relative;
  
}

/* Hide the images by default */
.mySlides {
  display: none;
}

/* Add a pointer when hovering over the thumbnail images */
.cursor {
  cursor: pointer;
}

/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 70%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: #e1ab35;
  font-weight: bold;
  font-size: 20px;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
  background-color: rgba(0, 0, 0, 0.8);
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* Container for image text */
.caption-container {
  text-align: center;
  /*background-color: #e5ebe1;*/
  font-family: "Roboto", sans-serif;
  padding: 2px 16px;
  color: #153e02;
}



.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Six columns side by side */

.column_container {
 
  width: 90%;
  max-height: 130px;
  height:130px;
  margin: 0 auto;
  position:relative;
  overflow:hidden;
  align-content: center;
  flex-wrap: wrap;
  background-size: cover;
  background-position: center;
}

#column_container_inner {
	
	height:150px;
	 max-height: 150px;
	 width:110%;
	overflow:auto;
}

#column_container_scroll {
	width:2200px;
	 overflow:scroll;
}

.column {
  float: left;
  width:300px;
  max-height: 140px;
  height:140px;
  display: flex;
  
  align-content: center;
  flex-wrap: wrap;
}

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

p#caption {
		color:#d8a548;
}


/* Add a transparency effect for thumnbail images */
.demo {
  opacity: 0.6;
}

.active,
.demo:hover {
  opacity: 1;
}


.modal {
z-index:1;
display:none;
padding-top:10px;
position:fixed;
left:0;
top:0;
width:100%;
height:100%;
overflow:auto;
background-color:rgb(0,0,0);
background-color:rgba(0,0,0,0.8)
}

.modal-content{
margin: auto;
display: block;
    position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}


.modal-hover-opacity {
opacity:1;
filter:alpha(opacity=100);
-webkit-backface-visibility:hidden
}

.modal-hover-opacity:hover {
opacity:0.60;
filter:alpha(opacity=60);
-webkit-backface-visibility:hidden
}


.close {
text-decoration:none;float:right;font-size:24px;font-weight:bold;color:white;
  cursor:pointer;
}
.container1 {
width:200px;
display:inline-block;
}
.modal-content, #caption {   
  
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}


@-webkit-keyframes zoom {
    from {-webkit-transform:scale(0)} 
    to {-webkit-transform:scale(1)}
}

@keyframes zoom {
    from {transform:scale(0)} 
    to {transform:scale(1)}
}




.property-wrapper {
  text-align: center;
  padding: 80px 0 0 0;
}

.property-wrapper h1 {
  font: 30px "Playfair Display", serif;
  color: #e1ab35;
  text-transform: uppercase;
}

.property-wrapper span {
  font: 500 13px/21px "Roboto", sans-serif;
  color: #153e02;
  text-transform: uppercase;
  letter-spacing: 0.2em;
}