// Less Stylesheet // -------------------------------------------------------------------------------- // Dependency: Less Library @see http://lesscss.org/ // Author: team @ Brandammo LTD // Website: www.moverevolution.com // Date created: 12 October 2011 // -------------------------------------------------------------------------------- // Variables // -------------------------------------------------------------------------------- @color-default : #555555; // default body text color @color-white : #FFFFFF; // white color @color-064B62 : #064B62; // darkest blue (e.g. in template static left panel) @color-CCCCCC : #cccccc; // light gray (e.g. navigation button) @color-f1f1f1 : #f1f1f1; // lighter gray (e.g. navigation button 'Newsletter Signup') @color-00abd2 : #00abd2; // blue (e.g. selected state navigation button) @color-0092b3 : #0092b3; // blue e.g. filter by background color (e.g. in template static left panel) @color-aaaaaa : #aaaaaa; // light gray (e.g. newsletter and free valuation buttons) @color-e5e5e5 : #e5e5e5; // form field gray @color-999999 : #999999; // form description colors @color-f5f5f5 : #f5f5f5; // color of gray blocks with dotted borders @media-images : "../../media/images/"; @sidebar-width : 185px; // width of sidebar // -------------------------------------------------------------------------------- // Functions // -------------------------------------------------------------------------------- .setDimensions (@width, @height) { width: @width; height: @height; } .setFixedPosition (@top, @left, @zindex) { position: fixed; top: @top; left: @left; z-index: @zindex; } .setAbsolutePosition (@top, @left, @zindex) { position: absolute; top: @top; left: @left; z-index: @zindex; } .setFont(@fontFamily, @fontSize) { font-family: @fontFamily; font-size: @fontSize; } .setContentPadding (@padding) { padding: @padding; } .setFormInputStyle (@width, @height, @color) { background: @color-e5e5e5; width: @width; height: @height; color: @color; .setFont(Tahoma, 11px); border: 0; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; .setContentPadding(0 5px); *padding: 5px; padding: 5px\9; } .setFormTextareaStyle(@width, @color) { background: @color-e5e5e5; width: @width; color: @color; .setFont(Tahoma, 11px); border: 0; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; .setContentPadding(5px); } .setSubHeadings(@fontsize, @padding, @color, @texttransform) { font-size: @fontsize; padding: @padding; color: @color; text-transform:@texttransform; } .setPageHeadings(@fontsize) { font-size:@fontsize; color:@color-white; text-transform:uppercase; } .setDropDownStyles(@width) { width:@width; border:0; .setFont(Tahoma, 11px); color:#333; .setContentPadding(2px); } .setPatternedBlocks(@background, @fontsize, @color) { padding:0 0 2px 0; border-bottom:1px dotted #b2b2b2; span { background:@background; display:block; color:@color; font-size:@fontsize; font-weight:bold; .setContentPadding(5px); } } .setEnquiryButton() { .setDimensions(235px, 35px); display:block; background:url("@{media-images}btn-makeanenquiry.png") 0 0; &:hover { background:url("@{media-images}btn-makeanenquiry.png") 0 -35px; } span { display:none; } } .setStandardSubmitButton(@background, @color, @backgroundhover, @colorhover) { background:@background; .setContentPadding(5px); border:0; color:@color; font-weight:bold; text-align:center; text-transform:uppercase; .setFont(Tahoma, 10px); border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius:5px; cursor:pointer; &:hover { background:@backgroundhover; color:@colorhover; } } .clear () { clear: both; } // All // -------------------------------------------------------------------------------- * { margin:0; padding:0; } img { border:0; } // HTML Selectors // -------------------------------------------------------------------------------- body { background:url("@{media-images}background-body-5px.png") 0px 0px repeat-y; position:relative; z-index: 0; .setFont(Tahoma, 11px); color:@color-default; overflow-x:hidden; min-height:810px; } aside, section, nav, header, footer { display: block; } // ID Selectors // -------------------------------------------------------------------------------- // -------------------------------------------------------------------------------- aside#static-left-col { //background: url("@{media-images}background-sidebar.png") no-repeat; .setDimensions (180px, auto); .setAbsolutePosition (0,0,1); section#moverevolution { .setDimensions (180px, 175px); } // -------------------------------------------------------------------------------- nav#primary { //background:url("@{media-images}navigation/sidebar-nav-dividers.png") no-repeat; ul { list-style:none; border-top:1px solid #013440; border-bottom:1px solid #1d6e80; li { .setDimensions(180px, 33px); a { font-size:15px; display:block; .setDimensions (161px, 27px); color: @color-white; .setContentPadding(4px 0 0 19px); background: url("@{media-images}navigation/sidebar-nav-background.png") no-repeat; text-decoration:none; text-transform:uppercase; border-top:1px solid #1d6e80; border-bottom:1px solid #013440; &:hover, &.active { background: url("@{media-images}navigation/sidebar-nav-background-on.png") no-repeat; border-top:1px solid #00a9cf; } } &:first-child { margin-top:0; } .filter_block { display:none; .setContentPadding(0 19px 10px 19px); border-bottom:1px solid #013440; .formfilter_description { .setContentPadding(10px 0 10px 0); color:@color-CCCCCC; font-weight:bold; text-transform:uppercase; font-size:10px; } fieldset { border:0; select { .setDropDownStyles(142px); margin:0 0 10px 0; } }/* fieldset */ span.reset-filters { color:@color-00abd2; font-size:10px !important; .setStandardSubmitButton(@color-00abd2, @color-white, @color-white, @color-00abd2); padding: 2px 3px !important; white-space:nowrap; cursor:pointer; } }/* filter_block */ } } } // -------------------------------------------------------------------------------- nav#secondary { border-bottom:1px solid #013440; ul { list-style:none; .setContentPadding(20px 0px); li { line-height:24px; a { font-size: 10px; text-decoration: none; text-transform:uppercase; font-weight:bold; color: @color-CCCCCC; .setContentPadding(0 19px); display:block; &:hover, &.active { background: #007899; color:@color-white; } } } } } // -------------------------------------------------------------------------------- section#newsletter-signup, section#free-valuation { .setDimensions (180px, 30px); position:relative; a { display:block; .setDimensions (161px, 20px); .setContentPadding(8px 0 0 19px); background:url("@{media-images}navigation/sidebar-smallnav-background.png") no-repeat; color:@color-white; text-decoration:none; text-transform:uppercase; font-weight:bold; font-size:10px; color:@color-CCCCCC; border-top:1px solid #1d6e80; border-bottom:1px solid #013440; &:hover, &.active { color:@color-white; background:url("@{media-images}navigation/sidebar-smallnav-background-on.png") no-repeat; border-top:1px solid #00a9cf; } } .form-popup { width:365px; .setAbsolutePosition(0px, @sidebar-width, 9999); display:none; opacity:0; filter:alpha(opacity=0); .form-popup-top { background:url("@{media-images}newsletter-form-top.png") no-repeat; .setDimensions(365px, 5px); } .form-popup-content { background:url("@{media-images}newsletter-form-content.png"); .setDimensions(325px, auto); .setContentPadding(15px 20px); position:relative; .close-form { .setDimensions(7px, 7px); background:url("@{media-images}close-form.png"); .setAbsolutePosition(10px, 348px, 999); cursor:pointer; } p.form-description { line-height:14px; color:@color-white; span { font-weight:bold; color:@color-00abd2; } small { color:#ccc; } } form { padding:10px 0 0 0; .field_container { .setDimensions(120px, 25px); float:left; margin:0 5px 0 0; position:relative; span.required_field { font-weight:bold; color:red; } label { .setAbsolutePosition(6px, 5px, 999); background:@color-e5e5e5; } input#firstname_field, input#bhhiiy-bhhiiy { .setFormInputStyle(110px, 25px, @color-default); *height: 15px; height: 15px\9; } input#name_field, input#fe_email_field, input#tel_field, input#postcode_field { .setFormInputStyle(150px, 25px, @color-default); *height: 15px; height: 15px\9; } } input#btn_signup { background:url("@{media-images}btn-signup.png") 0 0; .setDimensions(75px, 25px); border:0; cursor:pointer; &:hover { background:url("@{media-images}btn-signup.png") 0 -25px; } } &#valuation-form { .field_container { width:160px; margin:0 5px 5px 0; *margin:0 5px -5px 0; &.rightfield { margin:0px; } } input#btn_valuation { margin:0 0 0 165px; *margin-top:10px; background:url("@{media-images}btn-valuation.png") 0 0; .setDimensions(160px, 25px); border:0; cursor:pointer; &:hover { background:url("@{media-images}btn-valuation.png") 0 -25px; } } } } } .form-popup-bottom { background:url("@{media-images}newsletter-form-bottom.png") no-repeat; .setDimensions(365px, 5px); } } } // -------------------------------------------------------------------------------- section#footer-links { border-top:1px solid #1d6e80; ul { list-style:none; .setContentPadding(20px 19px); li { line-height:18px; color:#007893; text-transform:uppercase; a { font-size: 10px; text-decoration: none; font-weight:bold; color: #888; &:hover, &.active { color:@color-white; } } &.social_icons { .setContentPadding(10px 0 0 0); a { display:inline-block; margin:0 5px 0 0; } } &.logos { display:none; width:142px; height:81px; background:url("@{media-images}other-logos.png") no-repeat 0 30px; margin:30px 0 0 0; position:relative; img { position:absolute; &.rightmove { top:0px; left:0px; } &.heart { top:0px; left:88px; } &.primelocation { top:23px; left:0px; } &.zoopla { top:23px; left:88px; } &.ombudsman { top:46px; left:0px; } &.oft { top:46px; left:101px; } } } &.credit { a { color:#007893; font-weight:bold; font-size:9px; &:hover { color:@color-white; } } .setContentPadding(30px 0 0 0); } &.copyright { font-weight:bold; margin-top:-3px; font-size:9px; } } } } } // CONTENT // -------------- section#content { &.home_page { .setContentPadding(80px 0 0 230px) } #home_feature { .setDimensions(740px, 460px); overflow:hidden; a.feature_slide { display:block; position:relative; .setDimensions(730px, 460px); text-decoration:none; color:@color-white; text-transform:uppercase; padding:0 0 0 10px; span { .setAbsolutePosition(300px, 740px, 0); background: @color-00abd2; .setContentPadding(0 10px 0 10px); h1 { white-space:nowrap; margin-top:-5px; *margin-top: 3px; font-size:48px; } } } } // -------------------------------------------------------------------------------- #feature_pagination_container { position:relative; .setDimensions(200px, 25px); margin:0 0 0 325px; #feature_pagination_left { .setDimensions(5px, 25px); background:url("@{media-images}feature/feature-pagination-left.png") no-repeat; float:left; } #feature_pagination_right { .setDimensions(5px, 25px); background:url("@{media-images}feature/feature-pagination-right.png") no-repeat; float:left; } #feature_pagination { .setDimensions(90px, 18px); background:url("@{media-images}feature/feature-pagination-bg.png") repeat-x; .setContentPadding(7px 0 0 0); float:left; text-align:center; a { .setDimensions(10px, 10px); display:inline-block; background:url("@{media-images}feature/feature-pagination-icon.png") -16px 0px no-repeat; margin:0 3px; span { display:none; } &.selected { background:url("@{media-images}feature/feature-pagination-icon.png") 0px 0px no-repeat; } } } } // -------------------------------------------------------------------------------- #sub_content { .setContentPadding(20px 0 20px 10px); .setDimensions(760px, auto); .sub_block { .setDimensions(290px, 160px); background:url("@{media-images}home-block.png") 0px 0px no-repeat; float:left; margin:0 30px 0 0; .setContentPadding(20px 30px 0px 30px); color:#ededed; line-height:16px; position:relative; h2 { .setSubHeadings(19px, 0px, @color-white, uppercase); margin:0 0 10px 0; } #testimonials { ul { li { span { display:block; color:#cccccc; font-weight:bold; margin:5px 0 0 0; } } } } img#iphone { .setAbsolutePosition(-20px, 235px, 1); } a#download_our_app { display:block; .setDimensions(160px, 25px); margin:10px 0 0 0; background:url("@{media-images}btn-downloadapp.png") 0px 0px no-repeat; &:hover { background:url("@{media-images}btn-downloadapp.png") 0px -25px no-repeat; } span { display:none; } } p { padding:0 100px 0 0; } } } // -------------------------------------------------------------------------------- span.ipad_notice { display:none; .setAbsolutePosition(450px, @sidebar-width+10, 0); background:#000; color:@color-white; .setDimensions(450px, 15px); .setContentPadding(5px); font-weight:bold; text-transform:uppercase; font-size:12px; } // -------------------------------------------------------------------------------- span.iphone_notice { display:none; .setAbsolutePosition(380px, @sidebar-width+20, 0); background:#000; color:@color-white; .setDimensions(200px, 45px); .setContentPadding(5px); font-weight:bold; text-transform:uppercase; font-size:12px; } // -------------------------------------------------------------------------------- span#page_headings { background: @color-00abd2; .setContentPadding(0 10px); .setAbsolutePosition(80px, @sidebar-width, 0); height:54px; h1 { .setPageHeadings(48px); margin-top:-5px; *margin-top: 0px; } } // -------------------------------------------------------------------------------- #sort_tools, #breadcrumb, #blog_search { position:relative; background:@color-064B62; width:670px; height:35px; top:54px; left:20px; form#search_form { .setDimensions(220px, 35px); float:left; margin:0 0 0 10px; p { position:relative; float:left; label { .setAbsolutePosition(11px, 5px, 1); } input#search_properties_buy, input#search_properties_rent { .setFormInputStyle(155px, 20px, @color-default); margin:8px 5px 0 0; *padding:2px 5px 0 5px; *height:16px; padding:2px 5px 0 5px\9; height:17px\9; } } input#btn_go { float:left; margin:8px 0 0 0; } } fieldset { .setDimensions(350px, auto); position:absolute; top:0px; right:0px; border:0; padding:8px 10px 0 10px; select { .setDropDownStyles(155px); float:right; margin:0 0 0 10px; } }/* fieldset */ form#searchform { float:left; .setDimensions(50%, 35px); position:relative; input#s { .setFormInputStyle(155px, 20px, @color-default); height:auto\9; margin:8px 5px 0 7px; margin-top:6px\9; *margin-top:5px; } input#searchsubmit { .setStandardSubmitButton(@color-00abd2, @color-white, @color-white, @color-00abd2); .setAbsolutePosition(6px, 177px, 1); *width:55px; } label { .setAbsolutePosition(10px, 12px, 1); display:none; } }/* form#searchform */ select#cat { .setDropDownStyles(auto); position:absolute; right:7px; top:8px; }/* select#cat */ }/* #sort_tools, #breadcrumb, #blog_search */ #blog_sub_bar { position:relative; background:@color-white; width:650px; height:15px; top:54px; left:20px; .setContentPadding(5px 10px 5px 10px); span { font-weight:bold; } a { color:#777; text-decoration:none; &:hover { color:#000; } } } // -------------------------------------------------------------------------------- #breadcrumb { a { text-transform:uppercase; font-weight:bold; .setAbsolutePosition(2px, 10px, 1); padding:10px 0 0 0; color:@color-white; text-decoration:none; &:hover { color:#ddd; } } } // -------------------------------------------------------------------------------- #pagination { .short { width:86px; input { .setFormInputStyle(30px, 20px, @color-default); height:auto\9; float:left; } input.btn { .setStandardSubmitButton(@color-00abd2, @color-white, @color-white, @color-00abd2); float:left; padding:0px; padding:5px\9; } } } // -------------------------------------------------------------------------------- &.buy_index_page, &.rent_index_page, &.sell_index_page, &.let_index_page, &.aboutus_index_page, &.contactus_index_page, &.mortgages_index_page, &.legal_index_page, &.ourteam_index_page, &.promotions_index_page, &.terms_index_page, &.sitemap_index_page, &.blog_page { .setContentPadding(80px 0 20px @sidebar-width) } // -------------------------------------------------------------------------------- section#properties { background:#ededed; .setContentPadding(10px 0 0 10px); .setDimensions(90%, auto); margin:74px 0 0 20px; #property_list { .property_item { .setDimensions(190px, 315px); background:@color-white; margin:0 10px 10px 0; .property_image { .setDimensions(180px, 120px); margin:5px; background:#ccc; a { display:block; .setDimensions(180px, 120px); position:relative; .sales-lookup-1 { .setAbsolutePosition(-1px, 98px, 1); } .sales-lookup-2 { .setAbsolutePosition(-1px, 97px, 1); } .sales-lookup-3 { .setAbsolutePosition(-2px, 113px, 1); } .sales-lookup-4 { .setAbsolutePosition(-4px, 97px, 1); } .sales-lookup-5 { .setAbsolutePosition(-1px, 120px, 1); } .sales-lookup-7 { .setAbsolutePosition(-6px, 68px, 1); } .let-lookup-1 { .setAbsolutePosition(-1px, 98px, 1); } .let-lookup-2 { .setAbsolutePosition(-1px, 115px, 1); } .let-lookup-3 { .setAbsolutePosition(-3px, 98px, 1); } .let-lookup-4 { .setAbsolutePosition(-5px, 79px, 1); } .let-lookup-5 { .setAbsolutePosition(-1px, 137px, 1); } .let-lookup-6 { .setAbsolutePosition(-6px, 68px, 1); } } }/* .property_image */ .property_details { .setContentPadding(0 5px 0 5px); h4 { font-size:12px; color:#000; .setContentPadding(0 5px); display:block; height:35px; line-height:16px; } .property_price { .setPatternedBlocks(@color-f5f5f5, 15px, @color-999999); } ul { margin:10px 0; padding:0 0 0 20px; height:70px; overflow:hidden; li { padding:0 0 3px 0; } } }/* .property_details */ a.property_more_details { display:block; .setDimensions(190px, 25px); background:url("@{media-images}btn-morepropertydetails.png") 0 0; position:absolute; bottom:0; span { display:none; } &:hover { background:url("@{media-images}btn-morepropertydetails.png") 0 -25px; } }/* a.property_more_details */ &.no_results { .setDimensions(170px, auto); .setContentPadding(10px); text-align:center; font-weight:bold; text-transform:uppercase; } } /* .property_item */ &.centered { margin:0 auto; } }/* #property_list */ }/* section#properties */ // -------------------------------------------------------------------------------- section#property_details { background:#ededed; .setContentPadding(10px); .setDimensions(730px, 385px); margin:74px 0 0 20px; #property_gallery_col { .setDimensions(445px, 385px); margin:0 10px 0 0; float:left; position:relative; #main_property_image { .setDimensions(445px, 320px); overflow:hidden; font-size:0; a { display:inline-block; .setDimensions(445px, 320px); } } .image_tip { .setAbsolutePosition(0, 0, 1); padding:5px; opacity:0.75; filter:alpha(opacity=75); .setDimensions(435px, 15px); background:#000; color:@color-white; } #main_property_image_thumbs { .setDimensions(445px, 60px); margin:5px 0 0 0; overflow:hidden; a { display:inline-block; .setDimensions(85px, 60px); margin-right:5px; background:#000; img { opacity:0.5; filter:alpha(opacity=50); } } } a#prev { display:block; background:url("@{media-images}btn-propertythumb-scrollleft.png") 0 0; .setDimensions(25px, 60px); position:absolute; bottom:0; left:0; &:hover { background:url("@{media-images}btn-propertythumb-scrollleft.png") 0 -60px; } span { display:none; } } a#next { display:block; background:url("@{media-images}btn-propertythumb-scrollright.png") 0 0; .setDimensions(25px, 60px); position:absolute; bottom:0; right:0; &:hover { background:url("@{media-images}btn-propertythumb-scrollright.png") 0 -60px; } span { display:none; } } } #property_overview_col { .setDimensions(235px, 345px); background:@color-white; float:left; padding:20px; h1 { .setSubHeadings(18px, 0 0 10px 0, #000000, none) } .display-property-type { font-weight:bold; .setContentPadding(0 0 10px 0); text-transform:uppercase; } .property_price { .setPatternedBlocks(@color-f5f5f5, 20px, @color-999999); } section.property_overview_txt { .setContentPadding(10px 0 10px 0); line-height:16px; p { padding:0 0 10px 0; } } a.make_an_enquiry { .setEnquiryButton; } section.social { .setDimensions(235px, 30px); position:relative; top:15px; section.social-facebook { .setDimensions(115px, 30px); float:right; } section.social-twitter { .setDimensions(115px, 30px); float:right; } } } } /*section#property_details*/ // -------------------------------------------------------------------------------- section#tabs { margin:20px 0 0 20px; font-size:0; a { display:block; .setDimensions(140px, 30px); display:inline-block; border-right:1px solid @color-aaaaaa; border-left:1px solid @color-white; *margin-left:-1px; &#overview { background:url("@{media-images}tab-overview.png") 0 -30px; border-left: 0px !important; &:hover { background:url("@{media-images}tab-overview.png") 0 -30px; } } &#floorplans { background:url("@{media-images}tab-floorplans.png") 0 0; &:hover { background:url("@{media-images}tab-floorplans.png") 0 -30px; } } &#epcgraph { background:url("@{media-images}tab-epcgraph.png") 0 0; &:hover { background:url("@{media-images}tab-epcgraph.png") 0 -30px; } } &#brochures { background:url("@{media-images}tab-brochures.png") 0 0; &:hover { background:url("@{media-images}tab-brochures.png") 0 -30px; } } &#locationmap { background:url("@{media-images}tab-locationmap.png") 0 0; &:hover { background:url("@{media-images}tab-locationmap.png") 0 -30px; } } &#testimonials { background:url("@{media-images}tab-testimonials.png") 0 0; border-right: 0px !important; &:hover { background:url("@{media-images}tab-testimonials.png") 0 -30px; } } span { display:none; } } } // -------------------------------------------------------------------------------- section#more_details { background:#ededed; .setContentPadding(10px); .setDimensions(730px, auto); margin:0 0 0 20px; #content_slides { .tabbed_content { background:@color-white; .setContentPadding(20px); .setDimensions(690px, auto); line-height:16px; h1, h2, h3, h4, h5, p { margin:0 0 10px 0; } h2 { font-size:20px; } h3 { font-size:18px; } h4 { font-size:16px; } h5 { font-size:14px; } h6 { font-size:12px; } img { max-width: 690px; } a { color:@color-00abd2; text-decoration:none; font-weight:bold; &:hover { color:black; } } #testimonials_listing { width:690px; #testimonial_slides { width:690px; .testimonial_slide { width:690px; .testimonial_comment { position:relative; float:left; width:280px; .setContentPadding(30px); background:#eee; margin:20px 10px 0 0; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; .top_quote { .setDimensions(23px, 15px); background:url("@{media-images}testimonials-quote-open.png") 0 0 no-repeat; .setAbsolutePosition(10px, 10px, 1); } .bottom_quote { .setDimensions(23px, 15px); background:url("@{media-images}testimonials-quote-closed.png") 0 0 no-repeat; position:absolute; bottom:10px; right:10px; } &.right_testimonial_comment { margin-right:0px !important; } }/* .testimonial_comment */ } } #testimonials_pagination { margin:20px 0 0 0; a { background: @color-e5e5e5; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; .setContentPadding(5px); margin:0 2px 0 0; .setDimensions(15px, 15px); display:inline-block; text-align:center; &:hover, &.selected { background: @color-00abd2; color:@color-white; } } } } } } } // -------------------------------------------------------------------------------- section#page_content { .setDimensions(730px, auto); margin:74px 0 0 20px; header.subpage_heading { background:url("@{media-images}page-header-bar.png"); .setDimensions(680px, 40px); .setContentPadding(15px 25px); position:relative; h2 { .setSubHeadings(19px, 0px, @color-white, uppercase); } h3 { .setSubHeadings(11px, 0px, #ededed, none); font-weight:normal; } a.learn_more { width:110px; height:25px; background:url("@{media-images}btn-learnmore.png") 0 0; display:block; .setAbsolutePosition(23px, 600px, 1); &:hover { background:url("@{media-images}btn-learnmore.png") 0 -25px; } span { display:none; } } } section.subpage_content { background:@color-white; .setContentPadding(20px); //min-height:170px; header.small_heading { .setPatternedBlocks(#f5f5f5, 12px, @color-default); text-transform:uppercase; line-height:16px; } img { margin:20px 0 0 0; max-width: 690px; height: auto; &.floatimgleft { float:left; margin:20px 20px 20px 0; width:120px; height:120px; } &.areamap { float:left; margin:20px 20px 50px 0; } } section.text_content { .setContentPadding(0 5px); margin:20px 0 0 0; position:relative; .text_col_container { margin:0 0 10px 0; .text_col { width:330px; float:left; margin:0 0 0 20px; } } h1, h2, h3, h4, h5, h6, p { margin:0 0 10px 0; } h2 { font-size:20px; } h3 { font-size:18px; } h4 { font-size:16px; line-height:22px; } h5 { font-size:14px; } h6 { font-size:12px; } p { line-height:16px; } ul { .setContentPadding(0px 0 10px 15px); li { line-height:16px; } } a { color:@color-00abd2; text-decoration:none; &:hover { color:black; } } img.rightmove { .setAbsolutePosition(-18px, 155px, 0); } img.primelocation { .setAbsolutePosition(-18px, 245px, 0); } img.zoopla { .setAbsolutePosition(-18px, 335px, 0); } img.heart { .setAbsolutePosition(-18px, 393px, 0); } img.findaproperty { .setAbsolutePosition(-18px, 393px, 0); } img.globrix { .setAbsolutePosition(-18px, 472px, 0); } img.ombudsman { .setAbsolutePosition(-23px, 120px, 0); } img.oft { .setAbsolutePosition(-23px, 203px, 0); } a.facebook { .setDimensions(28px, 31px); .setAbsolutePosition(0px, 120px, 0); img { .setDimensions(19px, 20px); margin:0px; } } a.twitter { .setDimensions(29px, 31px); .setAbsolutePosition(0px, 144px, 0); img { .setDimensions(19px, 20px); margin:0px; } } a.make_an_enquiry { .setEnquiryButton; margin:20px 0 0 445px; } .contact_blocks { .setDimensions(290px, 40px); background:url("@{media-images}contact-block.png") 0 0; position: relative; .setContentPadding(15px 20px); margin:0 20px 20px 0; float:left; &.end { margin-right: 0px !important; } h2 { .setSubHeadings(19px, 0px, @color-white, uppercase); margin:0px !important; } h3 { .setSubHeadings(11px, 0px, #ededed, none); font-weight:normal; margin:0px !important; } a.contact_button { display:block; .setDimensions(90px, 25px); background:url("@{media-images}btn-contact.png") 0 0; .setAbsolutePosition(23px, 220px, 0); &:hover { background:url("@{media-images}btn-contact.png") 0 -25px; } span { display:none; } } }/* .contact_blocks */ section#contact_form_container { //display:none; form { border-top:1px dotted #b2b2b2; opacity:0; filter:alpha(opacity=0); .setDimensions(690px, auto); fieldset { border:0; h6 { text-transform:uppercase; margin-top:20px; } span.required_field { color:red; font-weight:bold; } .field_container { position:relative; float:left; .setDimensions(320px, 25px); margin:0 30px 10px 0; &.endfield { margin-right:0px !important; } &.textareafield { float:none; .clear(); .setDimensions(670px, auto); } label { .setAbsolutePosition(5px, 5px, 1); background:#e5e5e5; } input { .setFormInputStyle(320px, 25px, @color-default); *height: 15px; height: 15px\9; } textarea { .setFormTextareaStyle(670px, @color-default); max-width:670px; } } .btn_submitenquiry { margin:0 0 0 445px; background:url("@{media-images}btn-submitenquiry.png") 0 0; .setDimensions(235px, 35px); border:0; cursor:pointer; &:hover { background:url("@{media-images}btn-submitenquiry.png") 0 -35px; } } }/* fieldset */ }/* form */ }/* section#contact_form_container */ .dezrezConveyancing { .setFont(Tahoma, 11px); .setContentPadding(10px); background:@color-f1f1f1; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius:5px; margin:10px 0 0 0; h3 { font-size:14px !important; } form { label { margin:0 20px 0 5px; } .salesProperty, .purchaseProperty { margin:10px 0 0 0; background: @color-e5e5e5; .setContentPadding(10px); border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius:5px; h3 { font-size:11px !important; text-transform:uppercase; } input#salesPrice, input#purchasePrice { .setFormInputStyle(210px, 25px, @color-default); *height: 15px; height: 15px\9; background:@color-white; } } .dezrezErr { margin:20px 0; font-weight:bold; .exclaim { text-transform:uppercase; } } .dezrezConveyancingSubmit { margin:10px 0 0 0; .dezrezsubmit { .setStandardSubmitButton(@color-00abd2, @color-white, @color-white, @color-00abd2); } } } }/* .dezrezConveyancing */ }/* section.text_content */ }/* section.subpage_content */ .subpage_content_footer{ .setDimensions(730px, 5px); background:url("@{media-images}pagecontent-footer.png"); *margin-top:-4px; margin-bottom:20px; } #sub_content { padding-left:0px !important; } .team_member_caption { background: @color-00abd2; .setDimensions(130px, 25px); color:@color-white; font-weight:bold; text-transform:uppercase; cursor:pointer; font-size:10px; border-radius:2px; -webkit-border-radius:2px; -moz-border-radius:2px; &.firstmember { .setAbsolutePosition(154px, 205px, 0); background:url("@{media-images}ourteam/btn-teammember-cliffcooper.png") 0 0; &:hover, &.active { background:url("@{media-images}ourteam/btn-teammember-cliffcooper.png") 0 -25px; } } &.secondmember { .setAbsolutePosition(154px, 345px, 0); background:url("@{media-images}ourteam/btn-teammember-paulbrice.png") 0 0; &:hover, &.active { background:url("@{media-images}ourteam/btn-teammember-paulbrice.png") 0 -25px; } } &.thirdmember { .setAbsolutePosition(154px, 485px, 0); background:url("@{media-images}ourteam/btn-teammember-chriscrabtree.png") 0 0; &:hover, &.active { background:url("@{media-images}ourteam/btn-teammember-chriscrabtree.png") 0 -25px; } } }/* .team_member_caption */ .team_member_bio { background:@color-white; .setContentPadding(10px 25px 15px 15px); .setDimensions(200px, auto); display:none; opacity:0.9; filter:alpha(opacity=90); line-height:16px; a { font-weight:bold; color:@color-00abd2; &:hover { color:@color-default; } } .team_member_title { border-bottom:1px dotted #ccc; .setContentPadding(0 0 5px 0); font-weight:bold; h5 { font-size:12px; color:black } span.role { } }/* .team_member_title */ p { margin:10px 0 0 0; } &.firstmember { .setAbsolutePosition(199px, 205px, 0); } &.secondmember { .setAbsolutePosition(199px, 205px, 0); } &.thirdmember { .setAbsolutePosition(199px, 205px, 0); } .close_team { width:7px; height:7px; background:url("@{media-images}close-team.png"); position:absolute; right:10px; top:10px; cursor:pointer; } }/* .team_member_bio */ }/* section#page_content */ }/* section#content */ // CSS Selectors // -------------------------------------------------------------------------------- .clear_all { .clear(); } .home_backgrounds { .setFixedPosition (0,@sidebar-width,-1); -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; user-select: none; overflow:hidden; div { position:relative; overflow:hidden; img { position:relative; } } } a#home_backgrounds_next { .setDimensions(25px, 25px); position:fixed; bottom:20%; right:0px; display:block; background:url("@{media-images}home/home-feature-next.png") 0 0; span { display:none; } &:hover { background:url("@{media-images}home/home-feature-next.png") 0 -25px; } } a#home_backgrounds_prev { .setDimensions(25px, 25px); position:fixed; bottom:20%; left:185px; display:block; background:url("@{media-images}home/home-feature-prev.png") 0 0; span { display:none; } &:hover { background:url("@{media-images}home/home-feature-prev.png") 0 -25px; } } .home_captions { div { .setAbsolutePosition(40%, @sidebar-width, 0); height:100px; display:none; .setDimensions(690px, auto); margin:0 0 0 20px; &.img01 { display:block; } span { .setAbsolutePosition(0px, 0px, 888); background: @color-00abd2; .setContentPadding(0 10px 0 10px); h1 { color:@color-white; white-space:nowrap; margin-top:-5px; *margin-top: 3px; font-size:48px; text-transform:uppercase; } } section.caption { .setDimensions(400px, auto); margin:54px 0 0 40px; margin-top:53px\9; *margin-top:61px; .setContentPadding(15px); background:@color-white; line-height:18px; font-size:14px; color:#777; } a.btn_learnmore_large { background:url("@{media-images}btn-learnmore-big.png") 0 0; display:block; .setDimensions(220px,40px); margin:10px 0 0 80px; display:none; &:hover { background:url("@{media-images}btn-learnmore-big.png") 0 -40px; } span { display:none; } } } } .background_pattern { .setFixedPosition (0,@sidebar-width,-1); background:url("@{media-images}backgrounds/background-pattern.png"); .setDimensions(100%, 100%); *z-index:0; display:none; } .background_image { .setFixedPosition (0,0,-1); -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; user-select: none; &#team_member_one, &#team_member_two, &#team_member_three { display:none; //opacity:100; //filter:alpha(opacity=100); } } .image_credits { position:absolute; right:5px; bottom:5px; color:@color-999999; font-size:9px; text-transform:uppercase; } // BLOG MAIN PAGES // -------------------------------------------------------------------------------- body.blog, body.category, body.search, body.author, body.error404 { nav#nav-above, nav#nav-below { background:#fff; border-bottom:1px dotted #b2b2b2; .setDimensions(90%, 25px); .setContentPadding(0px 0 0 10px); margin:74px 0 0 20px; position:relative; opacity:0; filter:alpha(opacity=0); a { color:#777; text-decoration:none; font-weight:bold; text-transform:uppercase; &:hover { color:#000; } } h3.assistive-text { display:none; } .nav-previous { .setAbsolutePosition(6px, 10px, 1); .setDimensions(auto, 25px); } .nav-next { position:absolute; right:10px; top:6px; .setDimensions(auto, 25px); } }/* nav#nav-above, nav#nav-below */ nav#nav-below { margin:0 0 0 20px; border-bottom:none; border-top:1px dotted #b2b2b2; } section#articles_container { background:#ededed; .setContentPadding(10px 0 0 10px); .setDimensions(90%, auto); margin:0px 0 0 20px; opacity:0; filter:alpha(opacity=0); #articles_list { article.post { .setDimensions(350px, auto); background:@color-white; margin:0 10px 10px 0; .entry-header { .setContentPadding(5px); h1.entry-title { font-size:12px; line-height:16px; margin:5px 5px 10px 5px; a { color:#000; text-decoration:none; &:hover { color:@color-00abd2; } } } .entry-meta { padding:0 0 2px 0; border-bottom:1px dotted #b2b2b2; span.post_details { background:@color-f5f5f5; display:block; font-size:11px; font-weight:bold; .setContentPadding(5px); color:@color-999999; text-transform:uppercase; a { color:#777; text-decoration:none; &:hover { color:#000; } } } }/* .entry-meta */ .comments-link { display:none; } }/* .entry-header */ .entry-content, .entry-summary { padding:10px 10px 10px 10px; p { line-height: 16px; margin:0 0 10px 0; } img { width:330px !important; height:auto !important; } a { color:@color-00abd2; text-decoration:none; border-bottom: 1px dotted @color-00abd2; &:hover { color:#000; } } ul { .setContentPadding(10px 0 10px 15px); } ol { .setContentPadding(10px 0 10px 15px); padding-left:20px\9; } blockquote { border:1px dotted #b2b2b2; .setContentPadding(10px 10px 0 10px); } }/* .entry-content */ footer.entry-meta { .setContentPadding(5px); margin:0 5px 35px 5px; border-top:1px dotted #b2b2b2; color:@color-999999; a { color:#777; text-decoration:none; &:hover { color:#000; } } }/* footer.entry-meta */ &.no-results { h1.entry-title { margin-bottom:0px; } } }/* article.post */ &.centered { margin:0 auto; } }/* #articles_list */ a.read_more { display:block; .setDimensions(350px, 25px); background:url("@{media-images}btn-blogreadmore.png") 0 0; position:absolute; bottom:0px; left:0px; span { display:none; } &:hover { background:url("@{media-images}btn-blogreadmore.png") 0 -25px; } }/* a.read_more */ }/* section#articles_container */ } body.search, body.category, body.author { #blog_search { left:40px !important; } } // BLOG SINGLE PAGE // -------------------------------------------------------------------------------- section#content.blog_page { .subpage_heading { height: 50px !important; padding:10px 25px !important; } .subpage_content { span { display:inline !important; padding:0px !important; } .small_heading { padding:0 0 2px 0; border-bottom:1px dotted #b2b2b2; span.post_details { background:@color-f5f5f5; display:block !important; font-size:11px; font-weight:bold; padding: 5px !important; color:@color-999999; text-transform:uppercase; a { color:#777; text-decoration:none; &:hover { color:#000; } } } }/* .small_heading */ .text_content { #nav-single { .setDimensions(auto, 30px); span.nav-previous { .setDimensions(50%, 30px); float:left; } span.nav-next { .setDimensions(50%, 30px); float:left; text-align:right; } a { color:@color-999999; text-decoration:none; font-weight:bold; text-transform:uppercase; &:hover { color:#000; } } }/* #nav-single */ article.post { .entry-content { img { max-width:680px !important; height:auto; } ul, ol { .setContentPadding(10px 0 10px 15px); padding-top:10px !important; } blockquote { border:1px dotted #b2b2b2; .setContentPadding(10px 10px 0 10px); } a { color:@color-00abd2; text-decoration:none; border-bottom: 1px dotted @color-00abd2; &:hover { color:#000; } } .shareaholic-like-buttonset { .setContentPadding(20px 0 0 159px); } .shr-socials { padding-top:0px !important; } } .entry-meta { border-top:1px dotted #b2b2b2; .setContentPadding(10px 0 0 0); color:@color-999999; margin:20px 0 0 0; a { color:#777; text-decoration:none; &:hover { color:#000; } } } }/* article.post */ #comments { background:@color-f5f5f5; margin:20px 0; .setContentPadding(20px); border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; h2#comments-title { font-size:18px; line-height:20px; } ol.commentlist { list-style:none; li.comment { border-bottom:1px dotted #b2b2b2; .setContentPadding(20px 0 0 0); article.comment { footer.comment-meta { .comment-author { position:relative; .setDimensions(auto, 68px); .setContentPadding(20px 0 0 88px); color:@color-999999; font-weight:bold; text-transform:uppercase; img.avatar { .setAbsolutePosition(0px, 0px, 1); margin:0px; } a { color:#777; text-decoration:none; &:hover { color:#000; } } } } .reply { .setContentPadding(10px 0 20px 0); a.comment-reply-link { .setStandardSubmitButton(@color-00abd2, @color-white, @color-white, @color-00abd2); text-decoration:none; } } }/* article.comment */ ul.children { list-style:none; padding:0 0 0 20px; li.comment { .comment-author { .setDimensions(auto, 44px); .setContentPadding(15px 0 0 59px); } } li.comment:first-child { border-top:1px dotted #b2b2b2; } li.comment:last-child { border:none; } } }/* li.comment */ }/* ol.commentlist */ #respond { .setContentPadding(20px 0 0 0); h3#reply-title { font-size:19px; text-transform:uppercase; small { .setContentPadding(0 0 0 10px); a { font-size:12px; color:@color-999999; text-decoration:none; &:hover { color:#000; } } } } form#commentform { p.comment-notes { span.required { color:@color-00abd2; font-weight:bold; } } p.logged-in-as { a { color:#777; text-decoration:none; font-weight:bold; &:hover { color:#000; } } } /* p.logged-in-as */ p.comment-form-author, p.comment-form-email, p.comment-form-url, p.comment-form-comment { position:relative; label { .setAbsolutePosition(5px, 5px, 1); background:@color-e5e5e5; } span.required { .setAbsolutePosition(5px, 320px, 1); color:@color-00abd2; font-weight:bold; font-size:12px; } input#author, input#email, input#url { .setFormInputStyle (300px, 25px, @color-default); height:auto\9; } textarea#comment { .setFormTextareaStyle(90%, @color-default); max-width:90%; } } p.form-allowed-tags { border: 1px dotted #b2b2b2; padding:5px; } p.form-submit { input#submit { .setStandardSubmitButton(@color-00abd2, @color-white, @color-white, @color-00abd2); } } }/* form#commentform */ } }/* #comments */ }/* .text_content */ }/* .subpage_content */ }/* section#content.blog_page */ // PROPERTY ENQUIRY POPUP // -------------------------------------------------------------------------------- body.property-enquire-popup { background:none; min-height:10px; padding:20px; h6 { font-size:12px; text-transform:uppercase; margin:0 0 10px 0; color:@color-aaaaaa; } h4 { text-transform:uppercase; margin:0 0 20px 0; font-size:18px; } h5 { font-size:14px; line-height:20px; } p { line-height:16px; } .col_container { .setContentPadding(10px); background:@color-e5e5e5; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius:5px; margin:20px 0 0 0; .col_left { .setDimensions(234px, auto); .setContentPadding(0 20px 0 0); float:left; border-right:1px dotted #b2b2b2; text-align:center; .send_enquiry { margin:10px 0 0 0; display:block; .setDimensions(235px, 35px); background:url("@{media-images}btn-sendenquiry.png") 0 0 no-repeat; &:hover { background:url("@{media-images}btn-sendenquiry.png") 0 -35px no-repeat; } span { display:none; } }/* .send_enquiry */ } .col_right { .setDimensions(235px, auto); .setContentPadding(0 0 0 20px); float:left; text-align:center; .enquiry_phone_number { font-size:26px; color:@color-00abd2; .setContentPadding(5px); font-weight:bold; background:@color-white; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius:5px; margin:10px 0 0 0; } } } }