/* Generic styles for records */

div.record {
	display: block;
	position: relative;
	background-color: white;
	margin-top: 20px;
	border-radius: 3px;
	/*border: 2px solid #edebe9;*/
	padding: 20px;
	box-sizing: border-box;
	overflow: hidden;
	transition: margin 0.5s;
	box-shadow: 0 3px 10px 0 rgb(0 0 0 / 16%);
}

div.record.transition-enabled {
	transition: height 0.5s, padding 0.5s 0.5s, margin 0.5s 0.5s, opacity 0.5s, background 0.5s;
	-webkit-transition: height 0.5s, padding 0.5s 0.5s, margin 0.5s 0.5s, opacity 0.5s, background 0.5s;
	-moz-transition: height 0.5s, padding 0.5s 0.5s, margin 0.5s 0.5s, opacity 0.5s, background 0.5s;
	-ms-transition: height 0.5s, padding 0.5s 0.5s, margin 0.5s 0.5s, opacity 0.5s, background 0.5s;
}

div.record.deleted-record {
	opacity: 0;
	padding: 0;
	margin: 0;
}

div.record div.featured-button {
	display: block;
    position: relative;
	float: right;
    width: 30px;
    height: 30px;
    background: transparent url(../img/star_gray.png) no-repeat center center;
    background-size: 24px;
	cursor: pointer;
}

div.record div.favorite-button {
	display: block;
    position: relative;
	float: right;
    width: 30px;
    height: 30px;
    /*background: transparent url(../img/star.png) no-repeat center center;*/
    /*background: transparent url(../img/thumbs_up_grey_64.png) no-repeat center center;*/
    background: transparent url(../img/like_gray.png) no-repeat center center;
    background-size: 24px;
	cursor: pointer;
}

div.record.featured div.featured-button {
    background: transparent url(../img/star_green.png) no-repeat center center;
    background-size: 24px;
}

div.record.favorite div.favorite-button {
    /*background: transparent url(../img/star_blue_32.png) no-repeat center center;*/
    /*background: transparent url(../img/thumbs_up_green_64.png) no-repeat center center;*/
    background: transparent url(../img/like_selected.png) no-repeat center center;
    background-size: 24px;
}

div.record div.delete-button {
	display: block;
    position: relative;
	float: right;
    width: 30px;
    height: 30px;
    background: transparent url(../img/delete.png) no-repeat center center;
    background-size: 24px;
	cursor: pointer;
}



div.record:first-of-type {
	margin-top: 0;
}

div.record a.hidden-area  {
	display: none;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 9999;
}

div.record div.image {
	display: block;
	float: left;
	position: relative;
	height: 180px;
	width: 245px;
	overflow: hidden;
	cursor: pointer;
	
	-webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	-webkit-tap-highlight-color: transparent;
	outline: none;
	
}

div.record div.image div.img {
	display: block;
	position: relative;
	height: 100%;
	overflow: hidden;
}

div.record div.image img {
	display: block;
	position: absolute;
	max-height: 101%;
	max-width: none;
	top: -9999px;
	left: -9999px;
	bottom: -9999px;
	right: -9999px;
	margin: auto;
	transition: opacity 0.5s;
	-webkit-transition: opacity 0.5s;
	opacity: 0;
	
	height: 100%;
	max-width: none;
}

div.record div.image img.loaded {
	opacity: 1;
}

div.record div.image img.portrait {
	width: 100%;
	height: auto;
	max-height: none;
}

div.record div.image img.preview-image.selected-image {
	/*display: block;
	opacity: 1 !important;*/
}

div.record div.image div.side {
	display: block;
	position: absolute;
	height: 100%;
	width: 50%;
	cursor: pointer;
	z-index: 200;
	opacity: 0;
	-webkit-touch-callout: none;
	-webkit-user-select: none; /* Safari 3.1+ */
	-khtml-user-select: none;
	-moz-user-select: none; /* Firefox 2+ */
	-ms-user-select: none; /* IE 10+ */
	user-select: none; /* Standard syntax */
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	/*background-color: rgba(0, 0, 0, 0.2);*/
	
	transition: opacity 0.5s;
	-webkit-transition: opacity 0.5s;
	opacity: 0;
}

div.record div.slide-page-indicators-center {
	transition: opacity 0.5s;
	-webkit-transition: opacity 0.5s;
	opacity: 0;
}

div.record.loaded div.slide-page-indicators-center, div.record.loaded div.image div.side {
	opacity: 1;
}

/*
div.record div.image div.side:hover {
  background-color: transparent;
}

div.record div.image div.side:active {
  background-color: transparent;
}

div.record div.image div.side:focus{
  background-color: transparent;
  outline: none !important;
}
*/

div.record div.image div.left-side {
    left: 0;	
	width: 25%;
	/*background: linear-gradient(to right,rgba(33, 31, 31, 0.81),transparent);*/
}

div.record div.image div.right-side {
    right: 0;	
	width: 25%;
	/*background: linear-gradient(to left,rgba(33, 31, 31, 0.81),transparent);*/
}

div.record div.image:hover div.side {
	opacity: 1;
}

div.record div.image div.left-side div.button-previous, div.record div.image div.right-side div.button-next {
	display: block;
	position: absolute;
	z-index: 9999;
	width: 40px;
	height: 40px;
	border-radius: 5px;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);	
}

div.record:hover div.image div.left-side div.button-previous, div.record:hover div.image div.right-side div.button-next {
	background-color: var(--button-color);
	border-radius: 50%;
}

div.record div.image div.left-side div.button-previous {
	background: url(../img/left_arrow_64.png) no-repeat center center;
	background-size: 20px;
	left: 5px;
}

div.record div.image div.right-side div.button-next {
	background: url(../img/right_arrow_64.png) no-repeat center center;
	background-size: 20px;
	right: 5px;
}

div.record div.image span.record-type {
	display: block;
    position: absolute;
    z-index: 9999;
    color: white;
    background-color: #2e7df1;
    padding: 5px 10px;
    font-size: 16px;
    top: 10px;
    left: 10px;
    border-radius: 3px;
}

div.record div.image span.record-type.buy {
	background-color: #4caf50;
}

div.record div.image span.record-type.rent {
	/* background-color: #F44336;*/
	background-color: #03A9F4;
}

div.record div.image span.record-type.new {
	background-color: #FF9800;
}

div.record div.image span.recent-ad {
	display: block;
    position: absolute;
    z-index: 9999;
    /*background-color: #e13131a8;*/
	background-color: #d12525;
    padding: 10px 20px;
    color: #ffffff;
    font-size: 15px;
    font-weight: bold;
    text-align: center;
    border-radius: 10px;
    bottom: 10px;
    left: 10px;
}

div.record div.info {
	display: block;
	overflow: hidden;
	text-align: left;
}

div.record div.info div.info-inner {
	display: block;
	position: relative;
	padding: 15px 20px;
	overflow: hidden;
}

div.record div.info div.info-inner span.new-ads-found{
	display: block;
    float: left;
    clear: both;
    position: relative;
    color: #d12525;
    font-size: 14px;
    font-weight: bold;
    border-radius: 10px;
    margin: 10px 0;
}

div.record div.info div.info-inner span.whatsapp-enabled {
	display: block;
    float: left;
    clear: both;
    position: relative;
    color: #d12525;
    font-size: 14px;
    margin-top: 20px;
    background: transparent url(../img/whatsapp.png) no-repeat left center;
    background-size: 20px;
    padding-left: 30px;
    line-height: 32px;
    color: green;
}

div.record div.info div.info-inner span.normal-text {
	display: block;
	position: relative;
	clear: both;
	
	margin-bottom: 20px;
}

div.record div.info div.center {
	display: block;
	margin-top: 10px;
    overflow: hidden;	
}

div.record div.info div.center span.price {
	float: left;
	margin-right: 10px;
	font-size: 24px;
	font-weight: bold;
	color: #404348;
	font-family: MontSerrat;
}

div.record div.info div.center span.price-old {
	font-weight: normal;
    text-decoration: line-through;
    opacity: 0.5;	
}

div.record a {
	text-decoration: none;
	color: inherit;
}

div.record div.info span.name {
	display: block;
	font-size: 18px;
	padding-right: 50px;
	text-transform: uppercase;
}

div.record div.info span.version-name {
    display: block;	
    font-size: 12px;
    margin-top: 10px;
	text-transform: uppercase;
}

div.record div.info span.info {
	display: block;
	font-size: 16px;
}

div.record div.info a.website {
	display: block;
	margin-top: 10px;
	color: inherit;
}

div.record div.info span.info.margin-top {
	margin-top: 10px;
}

div.record div.buttons {
	float: right;
	width: 150px;
	height: 150px;
	position: relative;
}

div.record div.buttons div.buttons-inner {
	position: absolute;
	bottom: 0;
	width: 100%;
}

a.button-icon.record-button {
	margin-top: 5px;
}

a.button-icon.record-button:first-child {
	margin-top: 0;
}

a.button-icon.record-button div {
	padding: 5px;
}

a.button-icon.record-button span.icon {
	width: 34px;
}

a.button-icon.record-button span.text {
	text-transform: lowercase;
}

a.button-icon.record-button.view-vehicles-button span.icon {
    background: transparent url(../img/add_vehicle.png) no-repeat left center;
    background-size: 20px;
}

a.button-icon.record-button.favorite-button span.icon {
    background: transparent url(../img/star_all_grey.png) no-repeat left center;
    background-size: 20px;
}

a.button-icon.record-button.website-button span.icon {
    background: transparent url(../img/website.png) no-repeat left center;
    background-size: 20px;
}

a.button-icon.record-button.location-button span.icon {
    background: transparent url(../img/location.png) no-repeat left center;
    background-size: 20px;
}

/*
a.button-icon.record-button.view-vehicles-button:hover span.icon {
    background: transparent url(../img/car2.png) no-repeat left center;
    background-size: 20px;
}

a.button-icon.record-button.favorite-button:hover span.icon {
    background: transparent url(../img/star_all_white.png) no-repeat left center;
    background-size: 20px;
}

a.button-icon.record-button.website-button:hover span.icon {
    background: transparent url(../img/website_white.png) no-repeat left center;
    background-size: 20px;
}

a.button-icon.record-button.location-button:hover span.icon {
    background: transparent url(../img/location_white.png) no-repeat left center;
    background-size: 20px;
}

*/

div.message-info {
	display: block;
	margin-top: 10px;
}

div.message-info-date {
	display: block;
	overflow: hidden;
}

div.message-info-date span {
	float: left;
	margin-right: 5px;
}

div.stats-information {
	display: block;
	overflow: hidden;
	margin-top: 10px;
	padding-right: 50px;
}

div.stats-information span {
	display: block;
	float: left;
	margin-right: 10px;
	color: #a29f9f;
}

div.record div.real-state-info {
	display: block;
	margin-top: 20px;
	overflow: hidden;
}

div.record div.real-state-info > div.item {
	display: block;
	float: left;
	margin-left: 15px;
}

div.record div.real-state-info > div.item:first-child {
	margin-left: 0;
}

div.record div.real-state-info > div.item > span.item-value {
	display: block;
	font-size: 24px;
	font-weight: bold;
	text-align: center;
}

div.record div.real-state-info > div.item > span.item-name {
	display: block;
	text-align: center;
	font-size: 14px;
}

div.record div.real-state-info > div.item > div.value-with-symbol {
	display: block;
	text-align: center;
}

div.record div.real-state-info > div.item > div.value-with-symbol span.item-value {
	display: inline;
    font-size: 24px;
    font-weight: bold;
}

div.record div.real-state-info > div.item > div.value-with-symbol span.item-symbol {
	display: inline;
    margin-left: 5px;
}

div.record div.real-state-comments {
	display: block;
	margin-top: 20px;
	font-size: 16px;
}

div.real-state-buttons {
	display: block;
	position: relative;
	margin-top: 20px;
	overflow: hidden;
	/*float: left;*/
	clear: both;
}

div.real-state-buttons a {
	display: block;
	float: left;
	margin-right: 10px;
	margin-top: 10px;
	font-size: 14px;
	padding: 15px 30px;
	border-radius: 5px;
	text-decoration: none;
	font-family: MontSerrat;
	text-transform: uppercase;
	font-weight: bold;
}

div.record a {
	color: inherit;
	text-decoration: none;
}

div.record span.city-name {
	display: block;
	position: relative;
	font-size: 12px;
	background: transparent url(../img/location_green.png) no-repeat left center;
    background-size: 15px;
    padding-left: 18px;	
	
	/*
    right: 0;
    bottom: 5px;

	max-width: 35%;*/
}

div.record span.creation-date {
	display: block;
	position: relative;
	float: right;
	font-size: 12px;
}

div.real-state-buttons a:first-child {
	/*margin-left: 0;*/
}

div.real-state-buttons a.more-details, div.real-state-buttons a.view-location, div.real-state-buttons a.button-edit {
	/*color: white;*/
	background-color: #dadada;
}

div.real-state-buttons a.whatsapp {
	color: white !important;
	background-color: #25d366 !important;
}

div.real-state-buttons a.view-phone, div.real-state-buttons a.view-ads, div.real-state-buttons a.button-delete  {
	color: inherit;
	background-color: #dadada;
}

div.real-state-buttons span.phone {
	display: none;
    float: left;
	font-weight: bold;
	line-height: 38px;
	font-size: 22px;	
	margin-left: 20px;
}

div.real-state-company-logo {
	display: block;
    position: relative;
    float: right;
    margin-top: 20px;
    width: 100px;
	height: 40px;
}

div.real-state-company-logo img {
	display: none;
    position: absolute;
    max-width: 100%;
    max-height: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

span.vehicle-info {
	display: block;
	font-size: 14px;
	margin-top: 20px;
	margin-bottom: 20px;
}

div.vehicle-info-parent {
	display: block;
    /*margin: 20px 0;*/ /* when no button to view ad */
    margin: 15px 0;
    overflow: hidden;
}

div.vehicle-info-parent span.vehicle-info-ex {
	display: block;
    float: left;
    padding: 5px 10px;
    background-color: #e6e6e6;
    border-radius: 10px;
    margin-right: 5px;
	margin-bottom: 5px;
	font-size: 12px;
}

/*
img.load-record-images-when-scroll {
	transition: opacity 0.5s;
	-webkit-transition: opacity 0.5s;
	opacity: 0;
}
*/

span.waiting-approval {
    display: block;
    font-size: 12px;
    background: transparent url(../img/alert.png) no-repeat left center;
    background-size: 20px;
    color: #d42519;
    padding-left: 30px;
    line-height: 30px;
    font-weight: bold;	
    /*margin: 20px 0;*/
}

div.record-parent {
	display: block;
	position: relative;
	float: left;
	width: 25%;
	box-sizing: border-box;
	padding: 10px;
}

div.record.vertical {
	width: 100%;
}

div.record.vertical div.image {
	width: 100%;
	float: none;
}

div.record div.sold {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99999;
    background-color: rgb(22 22 22 / 48%);	
    transition: opacity 0.5s;
    -webkit-transition: opacity 0.5s;
    opacity: 0;	
}

div.record div.sold span{
	display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9999;
    color: white;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
}

div.record.loaded div.sold {
	opacity: 1;
}

div.record div.record-bottom {
    display: block;
    position: relative;	
	clear: both;
	overflow: hidden;
}

/*
div.record div.record-bottom a.button-view {
    display: inline-block;
    color: white;
    padding: 10px 20px;
    background-color: var(--button-color);
    border-radius: 10px;
    font-size: 14px;	
}
*/

div.record div.record-bottom a.record-button {
    display: inline-block;
    color: white;
    padding: 10px 20px;
    background-color: var(--button-color);
    border-radius: 10px;
    font-size: 14px;	
}

div.record div.record-bottom.multiple-buttons a.record-button {
	margin-right: 5px;
	margin-bottom: 5px;
}

div.record div.record-bottom span.city-name {
	float: right;
    position: absolute;
    right: 0;
    bottom: 0;
}

div.record-stats {
	display: block;
    position: relative;
    margin-top: 20px;
    font-size: 14px;
	overflow: hidden;
}

div.record-stats span.title {
	display: block;
	float: left;
	margin-right: 30px;
}

div.record-stats span.item {
	display: block;
	float: left;
    padding-left: 22px;
	margin-right: 30px;
    padding-left: 22px;
}

div.record-stats span.item.view-count {
    background: transparent url(../img/eye.png) no-repeat left center;
    background-size: 16px;
}

div.record-stats span.item.view-phone-count {
    background: transparent url(../img/phone-flip.png) no-repeat left center;
    background-size: 16px;
}

div.record-stats span.item.view-whatsapp-count {
    background: transparent url(../img/whatsapp_gray.png) no-repeat left center;
    background-size: 16px;
}

div.record-stats span.item.messages-count {
    background: transparent url(../img/envelope.png) no-repeat left center;
    background-size: 16px;
}



div.record {
	padding: 0;
}

div.record div.image {
	height: 220px;
    width: 295px;
	border-radius: 0;
}

div.record span.views-count {
    display: block;
    float: left;
	font-size: 14px;
    background: transparent url(../img/eye.png) no-repeat center left;
    background-size: 18px;
    padding-left: 25px;
    cursor: pointer;
    position: absolute;
    right: 0;
    bottom: 0;	
}

@media only screen and (max-width: 1220px) {


}

@media only screen and (max-width: 1020px) {

	/*
	div.record.record-search-page div.image {
		width: 100%;
		float: none;
	}
	
	div.record.record-search-page div.image img.preview-image {
		width: 100%;
		max-height: none;
	}
	
	div.record.record-search-page div.info div.info-inner {
		padding: 10px 0;
	}

	div.record.record-search-page div.info span.name {
		font-size: 22px;
	}
	
	div.record.record-search-page div.real-state-info.no-info {
		display: none;
	}
	
	div.record.record-search-page div.real-state-info {
		margin-top: 15px;
	}
	
	div.record.record-search-page div.real-state-comments {
		margin-top: 15px;
	}
	*/
	
}

@media only screen and (max-width: 880px) {

	/*
	div.record {
		padding: 0;
		margin-top: 10px;
	}
	
	div.record a.hidden-area {
		display: block;
	}

	div.record div.buttons {
		display: none;
	}
	
	div.record div.payment_warning {
		display: none;
	}

	div.record div.image {
		width: 100%;
		float: none;
		border-radius: 3px 3px 0 0;
	}
	
	div.record div.image img.preview-image {
		width: 100%;
		max-height: none;
	}
	
	div.record div.info div.info-inner {
		padding: 10px !important;
	}

	div.record div.info span.name {
		font-size: 18px;
	}
	
	div.record div.info span.info, div.record div.info a.info{
		font-size: 14px;
	}
	
	div.record div.real-state-info.no-info {
		display: none;
	}
	
	div.record div.real-state-info {
		margin-top: 15px;
	}
	
	div.record div.real-state-info > div.item > span.item-name {
		font-size: 12px;
	}
	
	div.record div.real-state-comments {
		margin-top: 15px;
	}
	
	div.real-state-buttons a.view-phone {
		display: none;
	}
	*/

	/*
	div.record div.info span.name {
		font-size: 16px;
	}
	
	div.record div.info div.center span.price {
		font-size: 16px;
	}
	*/
	
	div.record div.image {
		/*width: 200px !important;*/
	}
	
}

@media only screen and (max-width: 600px) {
	
	div.record div.image {
		width: 100% !important;
		float: none !important;
	}
	
	div.record div.info div.info-inner {
		padding: 10px !important;
	}
	
	div.record.record-search-page div.info span.name {
		font-size: 22px;
	}
	
	div.record div.info div.center span.price {
		font-size: 22px;
	}
	
	div.record div.record-bottom span.city-name {
		float: none;
		position: relative;
		right: auto;
		bottom: auto;
		margin-top: 15px;		
	}

	div.record span.views-count {
		float: right;
		position: relative;
		right: auto;
		bottom: auto;
		margin-top: 15px;		
	}
	
	div.record-stats span.title {
		display: none;
	}
	
}