.dtxt1{color:#232323}
.dtxt2{color:#dad63f}
.dtxt3{color:#3f7187}

.dbk1{background-color:#232323}
.dbk2{background-color:#dad63f}
.dbk3{background-color:#c3fae8}

.hovericon {background-color:#232323;color:#fff !important;font-size:14px}
.hovericon:hover {color:#232323!important}

.linkf{color:#232323}
.linkdef1:hover{filter: brightness(85%);}

.linkfb{background-color:#3b5998;color:#fff}
.linkfb:hover{filter: brightness(85%);color:#fff}

.linktw{background-color:#55acee;color:#fff}
.linktw:hover{filter: brightness(85%);color:#fff}

.linkpn{background-color:#cb2027;color:#fff}
.linkpn:hover{filter: brightness(85%);color:#fff}

.linkgp{background-color:#dc4e41;color:#fff}
.linkgp:hover{filter: brightness(85%);color:#fff}

.linkwa{background-color:#25d366;color:#fff}
.linkwa:hover{filter: brightness(85%);color:#fff}

.thestrap-cover{background-color:#232323;color:#fff}

.ft24{
	font-size:24px
}

.w20 {width:20px}
.label {
    background-color:#3f7187;
}
.price {
    background-color: #232323;
}

.portal-box{
	padding: 10px; background-color:#fff;
	 	box-shadow: 0 15px 30px 0 rgba(0,0,0,0.11),
            0 5px 15px 0 rgba(0,0,0,0.08);
}

.portalsbanner{padding-top:20px;padding-bottom:20px;font-size: 14px;text-transform: uppercase;font-weight: 700;letter-spacing: 1px; color:#232323}

/* Website Search Banners*/
#mybanner1 {background-color:#232323;padding:15px;margin-bottom:30px; color:#fff; text-align:center}
#mybanner1, h3{ font-size:22px;padding-top:5px;}
#mybanner1, p{ font-size:14px}
.banner-btn {border-radius: 0px;margin-top: 5px;margin-bottom: 10px;}
.ftm{letter-spacing:0px;font-size: 13px;}

.stetch1{padding-top:75px;padding-bottom:75px}
.sketchbk1{	background-image:url('../images/regbk.png');	no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
   

}

.sketchbk2{	background-image:url('../images/valbk.png');	no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
    

}
.sketchbk3{	background-image:url('../images/valbk2.jpg');	no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
     

}
.sketchbk4{	background-image:url('../images/conbk.png');	no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
      

}
.sketchbk5{	background-image:url('../images/search.jpg');	no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
      

}
.sketchbk6{	background-image:url('../images/search2.jpg');	no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        

}
.sketchbk7{	background-image:url('../images/search3.jpg');	no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;


}
.sketchbk8{	background-image:url('../images/about5.jpg');	no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;


}

.sketchbklaw{	background-image:url('../images/law.jpg');	no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
      

}


.tv1{	background-image:url('../images/about1.jpg');	no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;

}
.tv2{	background-image:url('../images/about2.jpg');	no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;

}
.tv3{	background-image:url('../images/about3.jpg');	no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;

}
.tv4{	background-image:url('../images/about4.jpg');	no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;

}
.tv7{	background-image:url('../images/about7.jpg');	no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;

}


#topstile{
 display:inline-block;background: rgba(25, 25, 25, .8);margin:0px;padding:10px}
 
 #topstile, h1{ font-size:30px;margin:0px;margin:0px}
 
 
 ul.timeline {
    list-style-type: none;
    position: relative;
}
ul.timeline:before {
    content: ' ';
    background: #faead4;
    display: inline-block;
    position: absolute;
    left: 29px;
    width: 2px;
    height: 100%;
    z-index: 400;
}
ul.timeline > li {
    margin: 20px 0;
    padding-left: 20px;
}
ul.timeline > li:before {
    content: ' ';
    background: white;
    display: inline-block;
    position: absolute;
    border-radius: 50%;
    border: 3px solid #3f7187;
    left: 20px;
    width: 20px;
    height: 20px;
    z-index: 400;
}

/* The estate - Explore the village - interactive map */
#explore-the-village {
    text-align: center;
    border-top: 1px solid #868686;
    margin-top: 10px;
}

#explore-the-village h2 {
    font-family: 'Sabon MT W01 Semibold', Garamond, serif;
    font-size: 22px;
    line-height: 22px;
    color: #53879D;
    text-transform: uppercase;
    margin: 16px 0 13px;
}

.interactive-map {
    padding-bottom: 10px;
}

.interactive-map .map {
    width: 700px;
    height: 394px;
    background: transparent url(../images/map/map-complete.jpg) no-repeat scroll 0 0;
    position: relative;
}

.interactive-map .swap-container {
    min-height: 254px;
}

.map-prop {
    position: absolute;
}

.map-prop-1 {
    top: 145px;
    left: 76px;
}

.map-prop-2 {
    top: 104px;
    left: 192px;
}

.map-prop-3 {
    top: 10px;
    left: 298px;
}

.map-prop-4 {
    top: 209px;
    left: 228px;
}

.map-prop-5 {
    top: 218px;
    left: 400px;
}

.map-prop-6 {
    top: 136px;
    left: 566px;
}

.map-prop-7 {
    top: 198px;
    left: 24px;
}

.interactive-map .image-swap {
    margin-top: 20px;
}

.interactive-map .image-swap img {
}

.interactive-map .image-swap-preload {
    display: none;
}

.interactive-map .text-swap {
    margin-top: 30px;
}

.interactive-map .text-swap p {
}




img {
  max-width: 100%;
  height: auto;
}

.map {
  position: relative;
  max-width: 1100px;
  margin: auto;
  background-color: #ccc;
}
.map img {
  display: block;
  width: 100%;
}

.map-popup {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 99;
  width: 60%;
  padding: 2rem;
  background-color: #fff;
  transition: all 300ms ease-in;
  transform: translate(-50%,-50%);
  box-shadow: 0 0 24px rgba(0,0,0,0.22);
  opacity: 0;
  visibility: hidden;
}

.map-popup > *:first-child { margin-top: 0; }
.map-popup > *:last-child { margin-bottom: 0; }

.map-popup.open {
  opacity: 1;
  visibility: visible;
}

.marker {
  position: absolute;
  z-index: 1;
  display: inline-block;
  width: 36px;
  height: 36px;
  color: #fcf4e9;
  line-height: 36px;
  text-align: center;
  text-decoration: none;
  border-radius: 50%;
  background-color: #3f7187;
  transition: all 300ms;
}

.marker1 {
  top: 30%;
  left: 20%;
}
.marker2 {
  top: 50%;
  left: 64%;
}

@media only screen and (min-width:48em) {
  .map-item {
    position: absolute;
    width: 36px;
    height: 36px;
    }
    .map-item .marker {
      top: auto;
      left: auto;
    }
  
  .map-item1 {
    top: 57%;
    left: 8%;
  }
  .map-item2 {
    top: 42%;
    left: 18%;
  }
  .map-item3 {
    top: 42%;
    left:36%;
  }
  .map-item4 {
    top: 54%;
    left:36%;
  }
  .map-item5{
    top: 54%;
    left:56%;
  }
  .map-item6 {
    top: 42%;
    left:78%;
  }
  .map-item7 {
    top: 18%;
    left:50%;
  }
   
  .map-popup {
    position: absolute;
    left: 58px;
    width: 280px;
    transform: translateY(-50%);
  }
  .map-popup:before {
    content: "";
    position: absolute;
    top: 50%;
    left: -16px;
    margin-top: -16px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 16px 16px 16px 0;
    border-color: transparent #fff transparent transparent;
  }
  
  .map-popup.edge {
    left: auto;
    right: calc(100% + 24px);
  }
  .map-popup.edge:before {
    left: auto;
    right: -16px;
    border-width: 16px 0 16px 16px;
    border-color: transparent transparent transparent #fff;
  }
}