/* * Author: Wisely Themes * Author URI: http://themeforest.net/user/wiselythemes * Theme Name: Cozy * Version: 1.0.0 */ /* Table of Content ================================================== #Variables #Mixins #Imports #Typography #General #Header #Navigation #Home #About #Agency detail/listing #Property detail/listing #FAQ #Pricing Tables #404 Error #Blog #Login/Resgister #Contacts #Footer #PrettyPhoto Skin Override*/ /* Variables ================================================== */ @color10: #F5F5F5; @color20: #E3E3E3; @text-color: #74777c; @dark-gray:#4d4f52; @light-gray:#adb2b6; @light-gray-bg:#f1f3f6; @font-family: 'Open Sans', sans-serif; @headings-font-family: 'Raleway', sans-serif; @pattern: '../images/patterns/pattern1.jpg'; /* Color Scheme ================================================== */ h1, h2, h3, h4, h5, h6 { color: @color10; } ::selection { background: @color10; } ::-moz-selection { background: @color10; } .color { color: @color10; } a { color: @color10; } a:hover, a:focus { color: @color10; } .btn-default-color:hover, .btn-default-color:active, .btn-default-color.active, .open .dropdown-toggle.btn-default-color { background-color: transparent; border-color: @color10; color: @color10; } .btn-fullcolor, .btn-fullcolor:focus { background-color: @color10; } .section-title:before, .section-highlight:before, .section-title:after, .section-highlight:after { background-color: #4d4f52; } .text-highlight { background-color: @color10; } .amenities > a { color: @color10; } .owl-controls .owl-buttons { background: @color10; } .owl-dots .owl-dot.active span, .owl-dots .owl-dot:hover span { background: @color10; } .carousel-style1 .item .price { background-color: @color10; } .fullwidthsingle .price, .latest-news-slider .price { background-color: @color10; } .fullwidthsingle .info, .latest-news-slider .info { background-color: @color10; } .latest-news-slider .item .tag { background-color: @color10; } .latest-news-slider .item .info { background-color: @color10; } .fullwidthsingle2 .price { background-color: @color10; } .fullwidthsingle2 .info h3 a:hover { color: @color10; } .tp-bullets.simplebullets.round .bullet:hover, .tp-bullets.simplebullets.round .bullet.selected, .tp-bullets.simplebullets.navbar .bullet:hover, .tp-bullets.simplebullets.navbar .bullet.selected { background: @color10; } .tp-leftarrow:hover, .tp-rightarrow:hover { background: @color10; } #top-bar a:hover, #top-bar a:focus { color: @color10; } .language-switcher:hover { color: @color10; } .sb-icon-search:hover { color: @color10; } .sb-search.sb-search-open .sb-search-submit, .no-js .sb-search .sb-icon-search { color: @color10; } .nav .open > a, .nav .open > a:hover, .nav .open > a:focus, .nav > li > a:hover, .nav > li > a:focus, .navbar-nav > li > a.active { color: @color10; } .navbar-nav .dropdown-menu > li > a:hover, .navbar-nav .dropdown-menu > li > a:focus, .navbar-nav .dropdown-menu > li > a.active { color: @color10; border-left: 4px solid @color10; } .navbar-nav .dropdown-submenu:hover > a:after { border-left-color: @color10; } #nav-mobile-btn { background-color: @color10; } .nav-mobile a:hover { color: @color10; } #home-search-buttons .form-control:focus { border-color: @color10; } #home-search-buttons .input-group .btn-default { background-color: @color10; } .action-box { background-color: @color10; } .pattern-bg.colored-bg:before { background-color: @color10; } .content.colored:before, .content.gray:before { background-color: @color10; } .feature i { color: @color10; border: 4px solid @color10; } .feature i:after { background: @color10; } .feature:hover h3 { color: @color10; } .sidebar .latest-news > li h3 a:hover { color: @color10; } .agency-detail-agents li:hover h3, .agency-detail-agents li a:hover { color: @color10; } .sidebar.colored { background-color: @color10; } .sidebar.colored .testimonials .item .text:after { border-color: transparent @color10 transparent transparent; _border-color: #000000 @color10 #000000 #000000; } .contact-us li a:hover { color: @color10; } .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus, .nav-tabs.nav-justified > .active > a, .nav-tabs.nav-justified > .active > a:hover, .nav-tabs.nav-justified > .active > a:focus { color: @color10; } .panel-group .panel .panel-heading .panel-title > a { color: @color10; } .panel-group .panel .panel-heading .panel-title > a:after { border: 1px solid @color10; color: @color10; } .panel-group .panel .panel-heading .panel-title > a:hover { color: @color10; } .panel-group .panel .panel-heading .panel-title > a:hover:after { color: @color10; border-color: @color10; } .sidebar.gray .panel-group .panel .panel-heading .panel-title > a, .gray .sidebar .panel-group .panel .panel-heading .panel-title > a { color: @color10; } .agency-detail .info .contact-us li a:hover, .agent-detail .info .contact-us li a:hover { color: @color10; } .agencies-list > li .tag, .agencies-grid > li .tag, .agents-list > li .tag, .agents-grid > li .tag, .agencies-list .item .tag, .agencies-grid .item .tag, .agents-list .item .tag, .agents-grid .item .tag { background-color: @color10; } .assigned { color: @color10; } .agencies-list > li .info .contact-us li a:hover, .agencies-grid > li .info .contact-us li a:hover, .agents-list > li .info .contact-us li a:hover, .agents-grid > li .info .contact-us li a:hover, .agencies-list .item .info .contact-us li a:hover, .agencies-grid .item .info .contact-us li a:hover, .agents-list .item .info .contact-us li a:hover, .agents-grid .item .info .contact-us li a:hover { color: @color10; } .agencies-list > li .info .contact-us li a:hover i, .agencies-grid > li .info .contact-us li a:hover i, .agents-list > li .info .contact-us li a:hover i, .agents-grid > li .info .contact-us li a:hover i, .agencies-list .item .info .contact-us li a:hover i, .agencies-grid .item .info .contact-us li a:hover i, .agents-list .item .info .contact-us li a:hover i, .agents-grid .item .info .contact-us li a:hover i { color: @color10; } #property-detail-wrapper.style1 .price, #property-detail-large .item .price { background-color: @color10; } .property-amenities-list > li.enabled:beofre, .property-amenities-list > li.disabled:before { color: @color10; } .property-features > li i { color: @color10; } .grid-style1 .item .price, .grid-style2 .item .price, .list-style .item .price, .grid-style1 .item .tag, .grid-style2 .item .tag, .list-style .item .tag { background-color: @color10; } .grid-style1 .item > .info h3 a:hover, .grid-style2 .item > .info h3 a:hover, .list-style .item > .info h3 a:hover, .grid-style1 .item > .info-blog h3 a:hover, .grid-style2 .item > .info-blog h3 a:hover, .list-style .item > .info-blog h3 a:hover { color: @color10; } .phone-icon { color: @color10; } .agency-service:hover { background-color: @color10; } .pricing .item header .price { color: @color10; } .pricing .item .btn-default-color { border: 1px solid @color10; color: @color10; } .pricing .item .btn-default-color:hover { background-color: @color10; } .pricing .item:hover header, .pricing .item.featured header { background-color: @color10; } .e404 > div { color: @color10; } .e404 i { color: @color10; } .blog-main-image .tag { background-color: @color10; } .post-content .highlight-color { color: @color10; } .post-content .quote span { color: @color10; } .categories li a:hover { color: @color10; } .categories li a:hover span { color: @color10; } .categories li:hover:before { color: @color10; } .blog-accordion.panel-group .panel .panel-body ul li a:hover { color: @color10; } .blog-accordion.panel-group .panel .panel-body ul li:hover:before { color: @color10; } #contacts-overlay ul li i { background-color: @color10; } #footer #copyright a:hover { color: @color10; } .list-style .item .amenities .property-details h5 { color: @color10; } .footer-listings li li:hover > p a { color: @color10 !important; } .footer-listings li li:hover > p a span { border-color: @color10; } a.pp_next, a.pp_previous { background-color: @color10; } div.cozy .pp_details { background-color: @color10; } .grid-style2 .item .price, .list-style2 .item .price, .grid-style2 .item .tag, .list-style2 .item .tag { background-color: @color10; } .grid-style2 .item > .info h3 a:hover, .list-style2 .item > .info h3 a:hover, .grid-style2 .item > .info-blog h3 a:hover, .list-style2 .item > .info-blog h3 a:hover { color: @color10; } .carousel-style2 .item .price { background-color: @color10; } .property-gallery.style2 .owl-controls .owl-buttons, .property-gallery2.style2 .owl-controls .owl-buttons { background: none repeat scroll 0 0 @color10; } .fullwidthsingle.style2 .owl-controls .owl-buttons, .latest-news-slider.style2 .owl-controls .owl-buttons, .fullwidthsingle2.style2 .owl-controls .owl-buttons { background: none repeat scroll 0 0 @color10; } #property-detail-wrapper.style2 .price { background-color: @color10; } .auto-suggest-items-wrapper { background-color: @color10; } li.ui-menu-item:hover { background-color: @color10; } .chzn-container .chzn-results li.highlighted { background-color: @color10; } #footer .roll:hover { background-color: @color10; } .footer-contacts li i { color: @color10; } /* Mixins ================================================== */ .border-radius(@radius) { -webkit-border-radius: @radius; -moz-border-radius: @radius; border-radius: @radius; } .box-shadow(...){ -webkit-box-shadow: @arguments; -moz-box-shadow: @arguments; box-shadow: @arguments; } .opacity(@opacity) { -webkit-opacity: @opacity; -moz-opacity: @opacity; opacity: @opacity; } .transition(@transition) { -webkit-transition: @transition; -moz-transition: @transition; -ms-transition: @transition; -o-transition: @transition; transition: @transition; } /* A helper mixin for applying high-resolution background images (http://www.retinajs.com) */ .at2x(@path, @w: auto, @h: auto) { background-image: url(@path); @at2x_path: ~`"@{path}".split('.').slice(0, "@{path}".split('.').length - 1).join(".") + "@2x" + "." + "@{path}".split('.')["@{path}".split('.').length - 1]`; @media all and (-webkit-min-device-pixel-ratio : 1.5) { background-image: url(@at2x_path); } } /* DATE PICKER */ .datepicker .day.active, .datepicker .prev.active, .datepicker .next.active, .datepicker .month.active, .datepicker .year.active { background-color: @color10; color: #ffffff; } .datepicker .month:hover, .datepicker .year:hover, .datepicker .day:hover, .datepicker .prev:hover, .datepicker .next:hover { background-color: @color10; color: #ffffff; } /* Secondary Colors */ #top-bar { background-color: @color20; } #home-search-section:after, .agency-services::after { background-color: @color20; } #footer .roll { background-color: @color20; }