/*
	this file includes HAR.com  components css styles
	- blocks
	- alerts
	- tables
	- tabs
	- status icons
	- circle image, and other images styles
	- fontawsome icons
	- 
*/



/* blocks */

.block { display: block; background-color: #fdfdfd; border: solid 1px #e0e0e0;border-radius:4px; }
.block_footer { padding: 10px; color:#757575; font-size: 12px; line-height: 16px; border-top: 1px solid  #e0e0e0;}
.block-property { width: 263px; margin-right:28px;}
.block-property .block_image { position: relative; display: block; width: 100%; height:143px;background-position: center center; background-size: cover; background-repeat: no-repeat; height: 144px;border-radius:4px 4px 0px 0px;  }
.block-property .block_image > a { display: block; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; z-index: 10;}
.block .h5 { display: block; padding:10px 10px 2px 10px;}
.block-property .block_add { font-size: 12px; color:#799fe6; line-height: 16px; padding: 4px 10px 10px 10px;}

.block-plogpost-wrapper { float: left; width:50%; padding: 2%; min-height:267px; margin-bottom: 40px; }
.block-plogpost .h5 { line-height: 24px; }
.block-plogpost .block_date { font-size:12px; color:#c1c1c1; padding: 4px 10px 5px 10px; }
.block-plogpost p { padding:0px 10px 7px 10px;font-size: 16px; color: #757575; margin: 0px; line-height: 24px; }
.block-plogpost p a { color: #757575; font-weight: bold; text-decoration: underline; }
.block_favorite { float: right;width:40px;height:40px; float: right; display: block; margin-top:4px; margin-right: 5px;}
.block_features { width: 50%; box-sizing: border-box; padding:7px 10px; font-size:16px; line-height: 18px; font-weight: bold; color: #212121; border-top:1px solid #e0e0e0;height:70px; overflow: hidden; }
.block_features_3cols .block_features { width: 33.33%; text-align: center; height: 53px; padding-top:8px;}
.block_features span { font-size: 12px; font-weight: normal; clear:right; color:#757575; }
.block_overlay{ left:0px; right: 0px; position: absolute; top: auto; bottom: 0px; height:60px; background:url(../images/bgs/overlay_gradient_small.png) repeat-x center center; }
.border-right {border-right:1px solid #e0e0e0; }
.block_price { font-size:28px;color:#fff; padding:30px 10px 10px 10px; font-weight: normal;}
.status-active .block_image{ border-bottom:4px solid #00db5d;}
.block_icon_heart { position: absolute; left:auto;right:5px;top: auto; bottom:5px; height:48px;width:48px;background:url(../images/icons/bookmark-button-uncheck.png) no-repeat center center; z-index: 11;}
.block_icon_heart:hover { background:url(../images/icons/bookmark-button-hover.png) no-repeat center center;}
.block_icon_heart.iconheart2, .block_icon_heart.selected { background:url(../images/icons/bookmark-button-checked.png) no-repeat center center;}
.block_icon_heart.iconheart2off { background:url(../images/icons/bookmark-button-uncheck.png) no-repeat center center;}

.block_overlay .block_icon_heart { bottom:0px; right:0px; }
.block_footer { position: relative;}
.block_footer .block_icon_heart { bottom: 10px; right: 10px;}

.block-property > p { font-size: 14px; line-height:20px;padding:5px 10px 0px 10px; margin-top: 0px;}
.heart_icon{display: block; position: absolute; left: auto; right:8px; bottom:8px; height:40px;width: 40px;background:url(../images/icons/heart_gray.png) no-repeat center center;}
.block-property.with-heart{position: relative;}
.btns_grid .btn{float: left; padding:2px 5px;min-width:260px; margin: 10px;}
.block-blog {min-height:180px;margin-bottom:0px; margin-top: 10px;}

.block-disctionary-wrapper { width:360px; margin-right:10px;min-height:110px; margin-bottom:10px; display:block; float: left; }
.block-disctionary { width:100%; padding:12px; float:none; min-height:110px; }
.block-disctionary p { padding:0px; margin:0px; font-size: 14px; line-height:18px; }
.block-disctionary .h5 { padding:0px 0px 5px 0px; margin:0px; }
.disctionary-inner-page .block-disctionary-wrapper { width:50%; padding-right:10px; margin-right:0px; }

/* alerts */
.alert {padding: 8px 35px 8px 14px;margin-bottom: 20px;text-shadow: 0 1px 0 rgba(255, 255, 255, .5);background-color: #fcf8e3;border: 1px solid #fbeed5;border-radius: 4px;display: block;}
.alert,.alert h4 {color: #c09853 } 
.alert h4 { margin: 0} 
.alert .close {position: relative;top: -2px;right: -21px;line-height: 20px} 
.alert-success {background-color: #dff0d8;border-color: #d6e9c6;color: #468847} 
.alert-success h4 {color: #468847} 
.alert-danger,.alert-error {background-color: #f2dede;border-color: #eed3d7;color: #b94a48} 
.alert-danger h4,.alert-error h4 {color: #b94a48} 
.alert-info {background-color: #d9edf7;border-color: #bce8f1;color: #3a87ad} 
.alert-info h4 {color: #3a87ad}

.alpha_list { padding:0px 10px;}
.alpha_list a { font-size:16px; line-height:24px; color:#212121; text-decoration: none; display: inline-block; padding:7px; }
.alpha_list a.active { color:#0b50d2 !important; }

.agent_pic { float: left; width:48px;height:48px;border-radius:50%;  background-position: center center; background-size: cover;  }
.agent_info { margin-left: 58px; padding-top:8px;}
.agent { display: inline-block; }
@media (max-width:580px){.block-plogpost-wrapper{ width:98%; clear:both; float:none; padding: 2% !important; }.block-links { width:98%; box-sizing: border-box; }}

.block-links { background-color:#fff;  width:31%; box-sizing: border-box; margin: 1%} 
.block-links .title,
.block-links > a{font-weight:bold;font-size:22px; line-height: 24px; display: block; width: 100%; box-sizing: border-box; border-bottom:1px solid #e0e0e0; padding: 10px;}
.block-links > a { font-weight: normal; font-size: 14px;}
.block-links > a:last-child{border-bottom: 0px;}
/* tables */
.table-responsive { display: table; width: 100%;border:none; padding: 0px; margin: 0px; border: 1px solid #e0e0e0;border-radius:4px;  background-color:#fdfdfd;}
.table-responsive .row { display: table-row; }
.table-responsive .cell { display: table-cell; padding:10px; border-bottom: 1px solid #e0e0e0; font-size: 14px; color:#757575;line-height: 20px; }
.table-responsive .cell > span { display: none; color:#8d8d8d; padding-right:10px; }
.row-header .cell { font-weight: bold; color: #424242;}

/* Tabs */
ul.tab { list-style-type: none;margin: 0px 0px 40px 0px;padding: 0;overflow: hidden; text-align: center;}
ul.tab li { display: inline-block; text-align: center;}
ul.tab li a { display:block; margin:0px 2px; border-bottom:2px solid #0b50d2; color:rgba(250,250,250,0.6);text-align: center;padding:16px 12px;text-decoration: none;transition: 0.3s;font-size: 16px;}
ul.tab li a:focus, ul.tab li a.active, ul.tab li.active a { border-bottom:2px solid #fff; color:#fff;}
.tabcontent {display: none;padding:0px;border-top: none;}
.tabcontent {-webkit-animation: fadeEffect 1s;animation: fadeEffect 1s; /* Fading effect takes 1 second */}
@-webkit-keyframes fadeEffect { from {opacity: 0;} to {opacity: 1;}}
@keyframes fadeEffect { from {opacity: 0;} to {opacity: 1;}}

/* status icons */
.prop_status { width: 26px;margin-left: 0;position: relative;float: left;height: 25px;margin-top: -3px;}
.status_icon_1 { display: block;position: absolute;top: 10px;left: 0;z-index: 11;width: 12px;height: 12px;border-radius: 50%;background-color: #ccc;}
.status_icon_2 {display: block;position: absolute;top: 10px;left:7px;z-index: 10;width: 12px;height: 12px;border-radius: 50%;background-color: transparent !important;}
.status_active .status_icon_1 {background-color: #028361!important;}
.status_pending .status_icon_1 {background-color: #f8c400!important;}
.status_option_pending .status_icon_1 {background-color: #f8c400!important;}
.status_pending_continue .status_icon_1 {background-color: #f99e00!important;-webkit-box-shadow: 4px -1px 5px -4px rgba(255,255,255,1);-moz-box-shadow: 4px -1px 5px -4px rgba(255,255,255,1);box-shadow: 4px -1px 5px -4px rgba(255,255,255,1);}
.status_pending_continue .status_icon_2 {background-color: #f8c400!important;}
.status_sold .status_icon_1 {background-color: #c51a08!important;}
.status_gray .status_icon_1 {background-color: #acacac!important;}

/* circle image */
.img_circle_50,.img_circle_70,.img_circle_90 { background-color: #e4e4e4;background-repeat: no-repeat;background-size: cover;width: 70px;height: 70px;border-radius: 50%;margin: 0 auto}
.img_circle_50 {width: 50px;height: 50px;}
.img_circle_90 {width: 90px;height: 90px;}

/* fontawsome icons */
.icon.icon-ok,.fa{background: url(//www.har.com/resources/images/icons/sprite_fontawsome.png) no-repeat top left; min-height:17px; min-width:17px; display: inline-block;}
.table { margin:0px; padding:0px; }
.table td,.table th { line-height:20px; padding: 5px;border: 1px solid #ddd; vertical-align: top; text-align: left; }

/*features table div based*/
.dc_title { border-bottom: 1px solid #E0E0E0!important;color: #0B50D2;clear: both;margin-top: 10px;font-family: effra, sans-serif;font-size: 17.5px;padding: 10px 0}
.dc_blocks_3c { float: left;width: 32.9%;min-height: 26px}
.dc_blocks_3c .dc_label {width: 75px;color: #757575;float: left;padding: 10px 0}
.dc_blocks_3c .dc_value {float: left;width: 90px;padding: 10px 0}
.dc_blocks_2c { width: 49%;float: left;margin-right: 5px;border-bottom: 1px solid #eaeaea!important}
.dc_blocks_2c .dc_label {width: 35%;font-weight: 700;float: left;padding: 10px 0}
.dc_blocks_2c .dc_value {width: 63%;float: left;color: #757575;padding: 10px 0}

.source_logos .sl_item {border: 1px solid #eaeae9;border-radius: 4px;display: inline-block;margin: 10px 10px 10px 0;padding: 10px;text-align: center;}

@media (max-width:640px){
.table-responsive .cell {display: block; clear: both; width: 100% !important; box-sizing: border-box; border-bottom:1px solid #eeeeee;}
.table-responsive { display: block; background-color: transparent; border: none; }
.table-responsive .row { display: block; border: 1px solid #e0e0e0;border-radius:4px; background-color:#fdfdfd; clear: both; margin: 10px; }
.table-responsive .row-header { display:none;}
.table-responsive .cell > span { display:inline-block;}
.block-disctionary-wrapper { width: auto; display: block; min-height:inherit;}
.disctionary-inner-page .block-disctionary-wrapper { width:100%; padding:5px; clear: both; min-height:inherit; }
.dc_blocks_2c { width:100%; clear: both;}
}
.table{width:100%;display: table;}
.table-row{display:table-row}
.table-col{display: table-cell;vertical-align:top;}

@media (max-width:550px){ 
.block-links { width: 99%; box-sizing: border-box;}
.btns_grid .btn{width: 100%; float: none; clear: both;}
}

@media (max-width:700px){ 
 .dc_blocks_2c {width: 100%;}
}


@media only screen  and (min-width :551px) and (max-width :900px) {
.block-links { width:47%; box-sizing: border-box; margin: 1%}
}