.clear { clear: both; height:0px; }
.fright { float : right; }
.fleft { float : left; }
.hidden { display:none;}

.nav-btns-right a,.nav-btns-left a,#building_parts{width: 50px;height: 43px;line-height: 43px;display:block;font-size: 30px; text-align:center;}

#GoogleMap table.property img {max-width: 100% !important;}
#GoogleMap img {max-width: none !important;}
#GoogleMap .project img {max-width: 100% !important;}


.clear { clear: both; }
.fleft { float: left; }
.fright { float: right; }
.hidden { display: none; }

.w40 { width: 40px; }

#ProjectRegion { }

#topnav {  
    white-space:nowrap;
    z-index:3000; /* IE7 Bug */    
    height: 24px;
    padding:0px 10px 0px 20px;
    margin: 10px 0px 0px 0px;
    font-weight:bold;
    list-style: none;    
    background: #252526; 
	-moz-border-radius: 10px;	
	border-radius: 10px;
	height: 28px;
	line-height: 28px;
	font-size:13px;
	font-family: Verdana, Helvetica, sans-serif;
	border: 1px solid #ccc;
}

#topnav li { height: 28px; line-height: 28px; float:left;  margin:0px; padding:0px 10px; border-right: 2px solid #ccc;}
#topnav li.last { margin-right:0; border-right: none;}
#topnav li.active a { color: white;  }

#pr_links { float: right; margin-right: 10px; font-weight: bold; font-size:13px;  padding:5px 0px;}

.pr_tab_container { padding: 10px 5px; }

#general_common div.field { padding:2px 0px;} 
#general_common div.field .name { width: 120px; float:left; font-weight: bold; }
#general_common div.field .sep { float: left; padding: 0px 5px; font-weight: bold;  }
#general_common div.field .value { float: left; width: 740px; }
#general_image { width: 100%; height: 400px; overflow: hidden;; text-align: center; margin-top: 10px;}
#general_image img{  height: 100%;  }

#Photos .image { width: 166px; height: 120px; overflow: hidden; float: left; margin: 5px; text-align: center; background: transparent; border: solid 1px #ccc; }
#Photos .image img { cursor: hand; cursor: pointer; height: 100%; }
#Photos .image img:hover { opacity:0.6; filter:alpha(opacity=60); }


#Documents { padding: 10px 20px;}
#Documents ul.doc li { background: none !important; list-style-type: decimal;}

#PriceList #Buildings td { vertical-align: top;}
#PriceList .constuctions li{  }
#ProjectRegion #PriceList .constuctions li a {
color: #009FC5;
background: #F3F3F3;
border: 1px solid #EEE;
margin-right: 10px;
}

#ProjectRegion #PriceList .constuctions li a:hover, #ProjectRegion #PriceList .constuctions li a.active {color: #004C84;background: #FFF;}
/*
#BuildingContainer .floor  {  border : solid 1px gray; margin-top: 20px; background: #808080; border-radius: 10px; -moz-border-radius:10px; color: black;  }
#BuildingContainer .floor .caption{ text-align:  left !important;   padding: 5px; font-weight: bold; background: #a7a7a7; border-bottom : solid 1px gray;  border-radius: 10px 10px 0px 0px; -moz-border-radius:10px 10px 0px 0px; }
#BuildingContainer .floor .item { float:left; width: 166px; margin: 5px;  background: #e9e9e9; border-radius: 5px; -moz-border-radius:5px; }
#BuildingContainer .floor .item:hover { background : #444444;}
#BuildingContainer .floor .item a { color : black;  text-decoration: none;}
#BuildingContainer .floor .item:hover a {  text-decoration: none; color: white;}
#BuildingContainer .floor .item .pic {  width: 166px; height: 120px; text-align: center; overflow: hidden; }
#BuildingContainer .floor .item .pic img {   height: 100%; }
#BuildingContainer .floor .item .content { text-align : center; padding: 5px; height: 90px; }
#BuildingContainer .floor .item .content div { overflow:  hidden; line-height:18px;  text-overflow: ellipsis; -o-text-overflow: ellipsis; white-space: nowrap; margin:0px; }
*/
#ProjectRegion .contact-form { height : 520px; }

/*==========================Header=========================*/
.nav-btns-left .arrow {float: left;margin-right: 6px;}

#form_send_to_friend:hover {background-position: -41px 0px;}

#print_btn:hover {
    background-position: -31px 0px;
}
.addthis_button_compact .at16nc {
background: none;
}
.nav-btns-right a{width: 60px;height: 60px;display: block;font-size: 70px;}
.nav-btns-right .icon-list {
font-size: 54px;
line-height: 72px;
text-align: center;
}
.nav-btns-right .arrow {float: left;margin: 2px;}
.nav-btns-right a:hover{background-position: -60px 0px;}
#at15s {display: none;}
#ProjectRegion .header {font-size: 24px;color: #004C84;}
#ProjectRegion .header .sold {color: #F00;}
#ProjectRegion .header .nav-btns-wrapper {padding: 31px 0px;}


#ProjectRegion #GoogleMap {}
#ProjectRegion .group-container .group .content.map {text-align: center;padding: 0px 2px;}
#ProjectRegion .group-container .group .content.map iframe {height: 210px;}
#ProjectRegion .group-container .group {margin-bottom: 25px;border: 1px solid #ECECEC;padding: 5px;border-radius: 4px;}
#ProjectRegion .group-container .group.contact-btns{padding: 20px 7px;}
#ProjectRegion .group-container .group .caption {text-align: left;line-height: 35px;color: #004C84;font-size: 18px;}
#ProjectRegion .group-container .group .field .name {float: left;}
#ProjectRegion .group-container .group .field .sep {float: left;padding: 0px 10px 0px 5px;font-weight: bold;}
#ProjectRegion .group-container .group .field .value {float: left;font-weight: bold;}
#ProjectRegion .group-container .group .field {line-height: 30px;}
#ProjectRegion .group-container .group .content {padding-bottom: 5px;}

/*====================== Photos ======================*/
#LargePhotos {
position: relative;
width: 100%;
padding-bottom: 65%;
height: 0;
overflow: hidden;
}
#ProjectRegion #Pictures #LargePhotos img {max-width: 100%;border: solid 1px #E6E6E6;vertical-align: top;}
#ProjectRegion #Pictures #LargePhotos .item {
    text-align: center;
    display: none;
    position: absolute;
    width: 100%;
    height: 99%;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
#ProjectRegion #Pictures #LargePhotos .item:first-child {display: block;}
#ProjectRegion #Pictures .thumbnails li {background: rgba(0, 0, 0, 0);
width: 14%;
float: left !important;
overflow: hidden;
text-align: center;
vertical-align: inherit;
position: relative;
margin: 0px !important;
margin-right: 4px !important;
height: 70px;}
#ProjectRegion #Pictures .thumbnails li {

}
#ProjectRegion #Pictures .thumbnails.less6 li{display:inline-block; float: none !important;}
#ProjectRegion #Pictures .thumbnails li a{height: 70px;width: 14%;vertical-align: middle;text-align: center;}
#Pictures .SmallPhotos {margin-top: 10px;margin-bottom: 17px;}

#ProjectRegion #Pictures .SmallPhotos ul.thumbnails{text-align: center !important;}
#ProjectRegion #Pictures .thumbnails li img {max-height: 100%;max-width: 100%;}
#ProjectRegion #Pictures .control{position:relative;text-align: center;margin-bottom: 8px;margin-top: 8px;}
#ProjectRegion #Pictures .control img {cursor: pointer;}
#ProjectRegion #Pictures .control a#next, #ProjectRegion #Pictures .control a#prev {height: 26px;width: 26px;cursor: pointer;position: absolute;top: -64px;}
#ProjectRegion #Pictures .control a#prev {background: url(/components/com_properties/media/images/carousel_prev.png) no-repeat;left: 0;float: left;margin-left: 15px;}
#ProjectRegion #Pictures .control a#next {background: url(/components/com_properties/media/images/carousel_next.png) no-repeat;right: 0;float: right;margin-right: 15px;}
/*=========================== Tab side =========================*/
#ProjectRegion ul.nav {margin: 0;}
#ProjectRegion ul.nav a {background: #E9E9E9;}
#ProjectRegion ul.nav li.active a {background: #fff;}
#ProjectRegion .tab-nav-wrapper .content{border: 1px solid #DDD;border-top: none;border-radius: 0px 0px 5px 5px;}
#ProjectRegion .tab-nav-wrapper .content .tab{display: none;padding: 30px 12px;min-height: 220px;}
#ProjectRegion .tab-nav-wrapper .content .tab.description{display: block;}
#ProjectRegion .tab-nav-wrapper {margin-bottom: 19px;}

/*============================== Price list ===========================*/
#Buildings {margin-bottom: 30px;}

#BuildingContainer {font-size: 12px;}
#BuildingContainer h3 { font-weight: bold; font-size: 13px; margin-bottom: 15px; }

#BuildingContainer .floor { margin-top: 20px; }
#BuildingContainer .floor .caption{ text-align:  left !important; font-weight: bold; color: #004C84; margin-bottom:5px; }
#BuildingContainer .floor .row-floor{ background-color: #009FC5; border: 1px solid white; box-shadow: 0px 0px 4px #888; -moz-box-shadow: 0px 0px 4px #888;-webkit-box-shadow: 0px 0px 4px #888;}

#BuildingContainer .floor .header-title{ font-weight: bold; color: white; }
#BuildingContainer .floor .header-title .header-image { float:left; width:42px; margin-left:5px; }

#BuildingContainer .floor .row-item { margin-top: 7px; padding:5px 0px; background-color: #E5E5E5; border: 1px solid white; box-shadow: 0px 0px 4px #888; -moz-box-shadow: 0px 0px 4px #888;-webkit-box-shadow: 0px 0px 4px #888;}
#BuildingContainer .floor .row-item .header-image{ width:40px; height:30px; float:left; width:40px; margin-left:5px; text-align:center; border:solid 1px gray; }
#BuildingContainer .floor .row-item .header-image img { max-width:100%; height:100%; } 

#BuildingContainer .floor .header-unit{ float:left; width:16%; margin-left:10px; }
#BuildingContainer .floor .header-floor{float:left; min-width:7%; text-align:center;}
#BuildingContainer .floor .header-total{float:left; min-width:8%; text-align:center; }
#BuildingContainer .floor .header-icons {float:left;min-width:16%;}
#BuildingContainer .floor .header-icons .bed { float:left; background:url('../../../media/images/icon_bed.png') 0px -3px no-repeat; padding-left:30px; }
#BuildingContainer .floor .header-icons .bath { float:left; background:url('../../../media/images/icon_bath.png') 0px -3px no-repeat ; padding-left:30px; }
#BuildingContainer .floor .header-icons .garage { float:left; background:url('../../../media/images/icon_garage.png') 0px -3px no-repeat ; padding-left:20px; }
#BuildingContainer .floor .header-garden{ float: left; min-width:7%; text-align:center; }
#BuildingContainer .floor .header-terrace{ float: left; min-width:7%; text-align:center; }
#BuildingContainer .floor .header-requirement{ float:left; min-width :9%; text-align:center; }
#BuildingContainer .floor .header-doc { float:left; max-width: 16%; text-align:center; }
#BuildingContainer .floor .header-icons .shower {float: left;background: url('../../../media/images/icon_shower.png') 0px 0px no-repeat;padding-left: 16px;position: relative;top: -4px;left: 10px;padding-top: 5px;}

#ProjectRegion #Pictures .control .icon{margin: 0px 4px;cursor: pointer;margin-left: 2px;position: relative;top: 3px;font-size: 20px;}
.nav-btns-left .icon {font-size: 45px;}
.nav-btns-left .building_parts .addthis_toolbox a {
display: block;
height: 40px;
margin-top: 2px;
}

#GoogleMap table.property img {max-width: 100% !important;}
#GoogleMap img {max-width: none !important;}


/****************************************** Navigation ******************************************/
.ProjectRegion-tab {
	text-align: center;
}

.ProjectRegion-tab ul {
	list-style: none;
	margin: auto;
	display: inline-block;
	background: #FAFAFA;
	position: relative;
	z-index: 1;
	border-radius: 6px 6px 0 0;
	overflow: hidden;
}

.ProjectRegion-tab .tab-item {
	display: inline-block;
	border-top: 3px solid #EBEBEB;
	float: left;
	box-sizing: border-box;
}

.ProjectRegion-tab .tab-item.is-active,
.ProjectRegion-tab .tab-item:hover
{
	border-top: 3px solid #1A74BA;
	background: rgba(0, 0, 0, 0.06);
}

.ProjectRegion-tab .tab-item a:hover {
	color: inherit;
}


.ProjectRegion-tab .tab-item a {
	display: block;
	width: 100%;
	height: 100%;
	line-height: 42px;
	border: 1px solid #EBEBEB;
	border-top: none;
	box-sizing: border-box;
	color: #000;
	min-width: 120px;
	padding: 0 5px;
}

/****************************************** Project container ******************************************/

.ProjectRegion-container {
	border: 1px solid #EBEBEB;
	position: relative;
	top: -26px;
	padding: 40px 20px 20px;
	border-radius: 5px;
	min-height: 500px;
}

.tab-container {
	display: none;
}
.tab-container.is-visible {
	display: block;
}


/*Home*/
.proj-home__img-wrapper {
	padding: 4px;
	background: #F5F5F5;
	border: 1px solid #E0E0E0;
}
.proj-home__img {
	padding-bottom: 75%;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
}
.proj-home__name {
	text-align: center;
	margin: 25px 0px;
	text-transform: uppercase;
}
.proj-home__percentage-sold h3 { color: #F00;}
.proj-home__address h3 { color: inherit;}
.proj-home__fields {
	margin: 15px 0px 20px;
	line-height: 22px;
}
.proj-home__slogan h4 {
	text-align: center;
	font-weight: bold;
}
.proj-home__description {
	line-height: 23px;
	margin-top: 15px;
}

/*Google map*/
#ProjectRegion #GoogleMap {
	height: 540px;
	border: solid 1px #E0E0E0;
}

/*Street view*/
.proj-street_view iframe{
	height: 540px;
	border: solid 1px #E0E0E0;
}

.proj-map__link {
	text-align: center;
	padding-top: 18px;
}

/*Pictures*/
.proj-photos__big-pics-wrapper {
	padding: 4px;
	background: #F5F5F5;
	border: 1px solid #E0E0E0;
}
.proj-photos__big-pics {
	position: relative;
	width: 100%;
	padding-bottom: 70%;
	overflow: hidden;
	height: 0;
}
.proj-photos__big-pics .pic-container {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	display:none;
}
.proj-photos__big-pics .pic-container.is-visible {
	display: block;
}
.proj-photos__small-pics {
	text-align: center;
}
.proj-photos__small-pics .pic-container {
	width: 100px;
	display: inline-block;
	margin: 0px 3px 4px 0px;
	height: 75px;
}
.proj-photos__small-pics .pic-container img{
	max-height: 100%;
}
.proj-photos__big-pics .pic-container a {
	display: block;
	height: 100%;
}



@media (max-width: 1020px){
    #ProjectRegion #Pictures .thumbnails li{height: 55px;width: 12%;}
    #ProjectRegion #Pictures .thumbnails li a {height: 56px;width: 12%;}
}
@media (max-width: 767px){
    .nav-btns-right {float: none !important; text-align: center;}
    .nav-btns-right .arrow {display: inline-block;margin: 2px;float:none;}
    #ProjectRegion .header .nav-btns-wrapper{padding-top: 0px;}
    #content-row{padding-top: 0px !important;}
}

@media (max-width: 520px){
    #ProjectRegion .header{font-size: 18px;}
}


/*Container tab*/
@media (max-width: 1020px) {
	.ProjectRegion-tab .tab-item {
		width: 20%;
	}
}

@media (max-width: 782px) {
	.ProjectRegion-tab .tab-item {
		width: 33.3%;
	}
}

@media (max-width: 520px) {
	.ProjectRegion-tab .tab-item {
		width: 50%;
	}
}

@media (max-width: 370px) {
	.ProjectRegion-tab .tab-item {
		width: 100%;
	}
}