/** SEARCH FORM **/ .search-form-wrapper { background:#FFDB35; } /** TITLE **/ .search-page-title { font-size:2.5em; text-transform:uppercase; margin:20px 0px; } .search-page-title { color:#E3181F; } /** VIEW BAR **/ .search-page-view { clear:both; width:100%; margin:0px 0px 20px 0px; } .search-page-view ul { float:left; list-style:none; margin:0px; padding:0px; max-width:350px; } .search-page-view ul li { margin:0px; padding:0px; display:inline-block; } .search-page-view ul li a { margin:0px; padding:15px 20px 15px 40px; display:inline-block; text-align:center; } .search-page-view .search-page-buttons { float:right; width:170px; text-align:right; } .search-page-view .search-page-buttons .btn, .search-page-view .results-save-status { margin:8px 10px 0px 0px; } .search-page-view .search-page-sort { float:right; width:125px; margin:10px 10px 0px 0px; } .search-page-view .search-page-sort .styledd { width:100%; } .search-page-view .search-page-sort label { display:none; } .search-page-view .results-save-status { margin:0px; } .search-page-view { background:#E3181F; } .search-page-view ul li a { color:#FFFFFF; background-repeat:no-repeat; background-position:0% 50%; -webkit-transition:all .3s ease; -moz-transition:all .3s ease; transition:all .3s ease; } .search-page-view ul li a:hover, .search-page-view ul li a.active { background-color:#a70b23; color:#FFFFFF; } .search-page-view a.search-page-list-view { background-image:url(icons/list-on.png); } .search-page-view a.search-page-map-view { background-image:url(icons/map-on.png); } .search-page-view .search-page-buttons { color:#FFFFFF; } .search-page-view .search-page-buttons a { color:#FFFFFF; text-decoration:underline; } .search-page-view .search-page-buttons a:hover { color:#000000; } .search-page-view .search-page-buttons .btn { background-color:#E3181F; color:#FFFFFF; text-decoration:none; } .search-page-view .search-page-buttons .btn:hover { background-color:#000000; color:#FFFFFF; } .search-page-view .search-page-sort .styledd { background-color:#FFFFFF; } /** LISTINGS **/ ul.property-list { list-style:none; margin:0px; padding:0px; } ul.property-list li.property-list-item { display:block; float:left; width:96%; clear:both; padding:2%; margin-bottom:15px; position:relative; } ul.property-list .property-list-photo { position:relative; float:left; width:330px; text-align:center; padding:5px; } ul.property-list .property-list-photo img { max-width:100%; height:auto; } ul.property-list .property-list-details { float:right; width:60%; } ul.property-list .property-list-details .address { display:block; clear:both; font-size:1.3em; text-transform:uppercase; } ul.property-list .property-list-details .townPostcode { display:block; clear:both; font-size:0.9em; } ul.property-list .property-list-details .property-list-attributes { display:block; clear:both; margin:20px 0px; padding:5px 0px; } ul.property-list .property-list-details .property-list-brief { display:block; clear:both; overflow:hidden; } ul.property-list .property-list-details .property-list-base { display:block; clear:both; margin:20px 0px; } ul.property-list .property-list-details .property-list-price { float:left; } ul.property-list .property-list-details .property-list-price .price-status { display:none; } ul.property-list .property-list-details .property-list-price .price-value { font-size:1.8em; text-transform:uppercase; } ul.property-list .property-list-details .btn-more { float:right; } ul.property-list .property-list-details .btn-shortlist { float:right; margin-right:1em; } .property-list-attributes .pla-icon { float:left; display:block; padding:10px 0px 0px 45px; width:33%; vertical-align:top; font-size:0.9em; height:30px; } ul.property-list li.property-list-item { border:1px solid #E5E5E5; background:#EEEEEE; -webkit-transition:all .3s ease; -moz-transition:all .3s ease; transition:all .3s ease; } ul.property-list li.property-list-item:hover { border:1px solid #C5C5C5; background:#F9F9F9; box-shadow:0 0 6px rgba(0, 0, 0, 0.15); cursor:pointer; } ul.property-list .property-list-photo { background-color:#F5F5F5; border:1px solid #E5E5E5; } ul.property-list .property-list-details .address { color:#E3181F; } ul.property-list .property-list-details .townPostcode, ul.property-list .property-list-details .property-list-attributes, ul.property-list .property-list-details .property-list-brief, ul.property-list .property-list-details .property-list-price { color:#777777; } ul.property-list .property-list-details .property-list-price .price-value { color:#E3181F; } ul.property-list .property-list-details .btn-more, ul.property-list .property-list-details .btn-shortlist { background:#E3181F; } ul.property-list .property-list-details .btn-more:hover, ul.property-list .property-list-details .btn-shortlist:hover { background:#000000; } .property-list-attributes .pla-icon { background-repeat:no-repeat; background-position:0% 0%; } .property-list-attributes .style { background-image:url(icons/att-icon-style.png); } .property-list-attributes .bedrooms { background-image:url(icons/att-icon-bedrooms.png); } .property-list-attributes .bathrooms { background-image:url(icons/att-icon-bathrooms.png); } .property-list-attributes .receptions { background-image:url(icons/att-icon-receptions.png); } /** STATUS **/ ul.property-list .property-list-item .status-banner { position:absolute; height:139px; width:139px; z-index:1; } ul.property-list .property-list-item.status-saleAgreed .status-banner, ul.property-list .property-list-item.status-sold .status-banner, ul.property-list .property-list-item.status-letAgreed .status-banner, ul.property-list .property-list-item.status-let .status-banner { background-repeat:no-repeat; background-position:97% 0%; } ul.property-list .property-list-item.status-saleAgreed .status-banner { background-image:url(property/status-sale-agreed.png); } ul.property-list .property-list-item.status-sold .status-banner { background-image:url(status/status-sold.png); } ul.property-list .property-list-item.status-letAgreed .status-banner { background-image:url(status/status-let-agreed.png); } ul.property-list .property-list-item.status-let .status-banner { background-image:url(status/status-let.png); } /** PAGINATION **/ .search-page-pagination { clear:both; margin:20px 0px 20px 0px; } .search-page-pagination .paging-prev, .search-page-pagination .paging-next { display:inline-block; float:left; width:auto; } .search-page-pagination ul { float:left; list-style:none; margin:0px; padding:0px; display:inline-block; } .search-page-pagination ul li { margin:0px; display:inline-block; float:left; } .search-page-pagination .paging-prev, .search-page-pagination .paging-next, .search-page-pagination ul li span, .search-page-pagination ul li a { display:inline-block; padding:5px 10px; } .search-page-pagination .paging-prev, .search-page-pagination .paging-next { margin:0px 0px 0px 5px; } .search-page-pagination ul li.paging-numbers-separator { padding:5px 5px; } .search-page-pagination .prevNext { float:right; } .search-page-pagination { color:#CCCCCC; } .search-page-pagination a { color:#AAAAAA; } .search-page-pagination a:hover, .search-page-pagination .paging-numbers-current { background-color:#E3181F; color:#FFFFFF; } .search-page-pagination .paging-prev, .search-page-pagination .paging-next { background-color:#E3181F; color:#FFFFFF; } .search-page-pagination .paging-prev:hover, .search-page-pagination .paging-next:hover { background-color:#000000; color:#FFFFFF; } /** NO PROPERTIES **/ .no-properties-wrapper { text-align:center; padding:30px 0px; } .no-properties-wrapper img { width:280px; max-width:571px; max-height:300px; margin:30px 0px; } /** RESPONSIVE **/ @media screen and (max-width:960px){ ul.property-list .property-list-details { width:50%; } } @media screen and (max-width:790px){ ul.property-list .property-list-details { width:45%; } } @media screen and (max-width:690px){ ul.property-list .property-list-photo, ul.property-list .property-list-details { float:none; clear:both; width:90%; margin:0px auto 10px auto; } } @media screen and (max-width:400px){ ul.property-list .property-list-photo img { max-width:100%; height:auto !important; } ul.property-list .property-list-details .address { font-size:1.1em; } ul.property-list .property-list-price { clear:both; margin:0px 0px 10px 0px; } ul.property-list .property-list-details .btn-more { display:block; float:none; clear:both; margin:20px auto; }