@lightgreen: #7BC792; @green: #18B14B; @darkgreen: #008014; @white: #FFFFFF; @red: #FF0000; @lightgrey: #F0F0F0; @grey: #CCCCCC; @darkgrey: #637379; @gold: #FFD100; @silver: #BBBCBE; @bronze: #B96F47; /** backgrounds **/ .lightgrey { background: @lightgrey; } .lightgreen { background: @lightgreen; } .green { background: @green; } .darkgreen { background: @darkgreen; } .greygradient { background: #fcfcfc; background: -moz-linear-gradient(top, #fcfcfc 1%, #ededed 99%); background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, #fcfcfc), color-stop(99%, #ededed)); background: -webkit-linear-gradient(top, #fcfcfc 1%, #ededed 99%); background: -o-linear-gradient(top, #fcfcfc 1%, #ededed 99%); background: -ms-linear-gradient(top, #fcfcfc 1%, #ededed 99%); background: linear-gradient(to bottom, #fcfcfc 1%, #ededed 99%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fcfcfc', endColorstr='#ededed', GradientType=0); } /** animation **/ .transition { -webkit-transition: All 0.5s ease; -moz-transition: All 0.5s ease; -o-transition: All 0.5s ease; -ms-transition: All 0.5s ease; transition: All 0.5s ease; } /** rounded corners **/ .rounded-corners (@radius: 5px) { -webkit-border-radius: @radius; -moz-border-radius: @radius; -ms-border-radius: @radius; -o-border-radius: @radius; border-radius: @radius; } .right-corner { -moz-border-radius-bottomright: 30px; -webkit-border-bottom-right-radius: 30px; } .right-corner10 { -moz-border-radius-bottomright: 10px; -webkit-border-bottom-right-radius: 10px; } .opaque { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50); -moz-opacity: 0.5; -khtml-opacity: 0.5; opacity: 0.5; } .shadow { padding-top:30px; border-top: 1px solid #FFF; background: -webkit-radial-gradient(50% 0%, 50% 18px, #dfdfdf 0%, #ffffff 99%); } .shadow_divider { border-top: 1px solid #FFF; background: -webkit-radial-gradient(50% 0%, 50% 18px, #dfdfdf 0%, #ffffff 99%); height: 18px; margin: 15px 0 0 0; } /** form elements **/ .input_colours { .checkbox_area { margin:0 -6px 10px; } .input-group { margin: 3px 0; padding-right: 6px; padding-left: 6px; &.no_margin { margin:0; } .input-group-addon:first-child { background: @darkgrey; margin-right: 10px; } label { padding: 0px; span { float: left; padding: 9px 24px 7px 12px; } p { margin-top: 8px; margin-bottom: 0px; font-size: 14px; } } .form-control { padding: 0px; text-align:center; } } } /** lists **/ ul.list-group { li { span { float: right; color: @darkgrey; } span:hover { color: @green; .transition; } } } /** column overrides **/ .col-xs-4 { background: none; border: 0px; } .padding_container { padding: 0 15px; } /** checkbox **/ .checkbox { margin: 3px 0; padding: 5px; .input-group-addon:first-child { background: @darkgrey; padding: 9px 10px 9px 10px; } .input-group-addon input { margin-left: 2px; } label { font-size: 13px; } .form-control { padding: 6px 7px } } .checkbox_title { margin-top: 14px; } html, body, h1, h2, h3, h4, h5, p, a, form, input, label { font-family: 'Ropa Sans', sans-serif; font-weight: 400; } html, body { height: 100%; margin: 0px; padding: 0px; } .container { width: 970px; padding-left: 0px; padding-right: 0px; } .nopad { padding-left: 0px; padding-right: 0px; } h1 { color: @green; margin-top:0; text-transform:uppercase; font-size:38px; } p { font-size: 15px; font-weight: 400; color: @darkgrey; } p.pullout { font-size: 20px; font-weight: 400; } .page_header { margin-bottom:15px; } input { -moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px; -khtml-border-radius: 0px; } .container { width: 970px; } a { color: @green; text-decoration: none; } .form-control { border-radius: 0px; &.disabled { background:#dddddd; } &.text_area { height:120px; overflow-y:scroll; } } .photo_list { a { display:block; } img { border:1px solid #dddddd; width:100%; height:auto; } } ul { -webkit-margin-before: 0; -webkit-margin-after: 0; -webkit-margin-start: 0; -webkit-margin-end: 0; -webkit-padding-start: 0; } /** buttons **/ .btn-danger { color: @darkgrey; background-color: @white; border-color: @darkgrey; } /** green button**/ .green_btn { background: @darkgreen; font-size: 21px; margin: 10px 0; padding-bottom: 5px; input{ border:none; } span, input { .right-corner; color: #FFF; padding: 16px; text-transform: uppercase; background: @green url(../img/btn-highlight.png) right top no-repeat; i { float: right; padding-top: 3px; } } span:hover { background: @darkgreen; text-decoration: none; .transition; } } .green_btn:hover { background: @green; text-decoration: none; cursor: pointer; span { text-decoration:none; cursor: pointer; background: @darkgreen; .transition; } } /** green button - small **/ .green_btn_sml { /* background: @darkgreen; */ font-size: 15px; margin: 3px 0; padding-bottom: 3px; input{ border:none; } span, input { .right-corner10; color: #FFF; padding: 9px 15px 6px 15px; background: @green url(../img/btn-highlight-sml.png) right top no-repeat; width: 100%; i { float: right; padding-top: 2px; } } &:hover { /* background: @green; */ text-decoration: none; cursor: pointer; span { text-decoration:none; cursor: pointer; background: @darkgreen; .transition; } } } /** headers **/ .green_header { background: @green url(../img/highlight.png) right top no-repeat; color: #FFF; padding: 5px 15px; font-size: 20px; text-transform: uppercase; p { float: right; color: @white; margin: 5px 0 0 15px; text-transform: none; a { color: @white; } } } .green_header span { border: 3px solid #ffffff; padding: 0px 5px; -webkit-border-radius: 7px; -moz-border-radius: 7px; -ms-border-radius: 7px; -o-border-radius: 7px; border-radius: 17px; font-size: 18px; } .grey_header { background: @grey url(../img/highlight.png) right top no-repeat; color: #FFF; padding: 5px 15px; font-size: 20px; } // Modal .modal-header { color: #FFF; padding: 16px; font-size:24px; text-transform: uppercase; background: @green url(../img/btn-highlight.png) right top no-repeat; i { float: right; padding-top: 3px; font-size:24px; color:#ffffff; opacity:1; filter:alpha(opacity=100); text-shadow:none; } &:hover { text-decoration: none; .transition; } } .modal-dialog { width:400px; } /** login **/ #login { position: absolute; right: 0px; top: -42px; width: 100%; .dropdown-toggle { display:inline-block; width:100%; &:focus { box-shadow:none; } } .btn-group { height:40px; float:right; width:100%; .login_button { span { border: 0px; background: none; text-align: right; color: #CCCCCC; display: inline-block; width: 94%; margin-right: 10px; font-size: 16px; line-height: 16px; padding-top: 7px; } i.anchor { display: inline-block; color: #ffffff; float: right; background: #cccccc; padding: 8px; font-size: 23px; } &:hover, &:focus, &:active { span { color:@green; .transition; } i { background: @green; .transition; } } } } .dropdown-menu { padding: 10px; min-width: 220px; right: 0; left: auto; } } /** nav bar **/ nav { padding: 40px 0; } .navbar { margin-bottom: 0px; } .navbar > .container .navbar-brand { background:url('../img/fixmyboat-logo.png') no-repeat left top transparent; width:212px; height:89px; margin: 0; text-indent:-9999px; } .navbar > .container .navbar-brand:hover { opacity:0.8; filter:alpha(opacity=80); } #forgotpw { font-size: 12px; color: #18B14B; } .navbar-inverse { .greygradient; border: 0px; .navbar-nav { margin: 10px 0 0 18px; } .navbar-nav > li { padding: 11px 6px; } .navbar-nav > li > a { font-size: 17px; text-transform: uppercase; color: #333333; } .navbar-nav > li > a:hover { color: @green; } } .navbar-fixed-top, .navbar-fixed-bottom { float: right; } /** navbar effects **/ .cl-effect-3 a { padding: 8px 0; } .cl-effect-3 a::after { position: absolute; top: 100%; left: 0; width: 100%; height: 4px; background: @green; content: ' '; opacity: 0; -webkit-transition: opacity 0.3s, -webkit-transform 0.3s; -moz-transition: opacity 0.3s, -moz-transform 0.3s; -ms-transition: opacity 0.3s, -moz-transform 0.3s; transition: opacity 0.3s, transform 0.3s; -webkit-transform: translateY(10px); -moz-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); } .cl-effect-3 a:hover::after, .cl-effect-3 a:focus::after { opacity: 1; -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); } /** STICKY FOOTER **/ #wrap { min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -70px; } .push, footer { height: 60px; } footer { background: #131313; background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSI0JSIgc3RvcC1jb2xvcj0iIzEzMTMxMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9Ijk1JSIgc3RvcC1jb2xvcj0iIzM4MzgzOCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=); background: -moz-linear-gradient(top, #131313 4%, #383838 95%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(4%, #131313), color-stop(95%, #383838)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #131313 4%, #383838 95%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #131313 4%, #383838 95%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #131313 4%, #383838 95%); /* IE10+ */ background: linear-gradient(to bottom, #131313 4%, #383838 95%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#131313', endColorstr='#383838', GradientType=0); /* IE6-8 */ padding: 19px 0; margin-top: 10px; p { color: #FFF; } a { color: #FFFFFF; } a:hover { color: #FFFFFF; text-decoration: underline; } } @media (max-width: 767px) { footer { margin-left: -20px; margin-right: -20px; padding-left: 20px; padding-right: 20px; } } .row{ margin:0; } /** search bar **/ .search-bar { .greygradient; padding: 1px 0; .container { .row { .col-xs-5{ } a.post-job { background: url(../img/postjob1.png) no-repeat 0 0; width:479px; position: absolute; top: -11px; z-index: 10000000; padding:45px 0; color:#FFFFFF; font-size:33px; i{ margin-left: -65px; } } a.post-job:hover { background: url(../img/postjob2.png) no-repeat 0 0; .transition; } a { font-size: 25px; } .or { font-size: 29px; padding: 39px 0 0 30px; margin-left: 9px; } } form { .input_container { input { height: 66px; border: 0px none; width: 242px; padding: 0px 17px; color: #949494; } input::-moz-placeholder{ opacity: 1; } select{ font-family: 'Ropa Sans', sans-serif; border: none; color: #949494; height: 55px; border: 0; -webkit-appearance: none; -moz-appearance: none; background: #FFFFFF url(/app/webroot/img/greenarrow.png) no-repeat; background-position: 212px 23px; width: 241px; text-indent: 0.01px; text-overflow: ""; padding-top: 20px; } } a.search-btn { position: absolute; color: #FFF; padding: 46px 0; top: -11px; background: url(../img/search1.png) no-repeat 0 0; z-index: 10000000; margin-left:9px; font-size:33px; i{ margin-left: -68px; font-size:26px; } } a.search-btn:hover { background: url(../img/search2.png) no-repeat 0 0; .transition; } } } } /** more info button on index **/ .more_info_btn { h1 { margin: 35px 0 25px 0; color:#637379; } p { margin: 0 0 25px 0; } .col-xs-2{ width:154px; padding-left:15px; } a.find_out_more { background: url(/app/webroot/img/findoutmore.png) no-repeat 0 -2px; text-decoration: none; color: #FFF; line-height: 17px; text-align: left; padding: 16px 3px 11px 40px; margin-left: 3px; font-size: 20px; } a.register_today { background: url(/app/webroot/img/registertoday.png) no-repeat 0 -2px; text-decoration: none; color: #FFF; font-size: 35px; padding: 16px 0 12px 0; width: 406px; margin-bottom:25px; } a.register_today:hover{ background: url(../img/registertoday-hover.png) no-repeat; .transition; } a.find_out_more:hover{ background: url(../img/findoutmore-hover.png) no-repeat; } } /**contact form**/ #contact_form { background: @lightgrey; padding:20px 30px; label { margin: 10px 0; width: 100%; font-size: 14px; } input { width: 100%; font-size: 14px; } textarea { width: 100%; height: 235px; font-size: 18px; } } /** search filter **/ .search_header { background: @green url(../img/highlight.png) right top no-repeat; color: #FFF; padding: 5px 15px; font-size: 20px; } #search_filter { background: @lightgrey; padding: 20px 30px 8px; margin-bottom: 58px; label { margin-right:5px; } .location_radius { background: @white; padding: 15px; margin-bottom: 10px; .radius { margin-left:20px; } .form-control { width:42%; } } .greybg { background: @darkgrey; margin-top: 19px; padding: 10px; font-size: 17px; color: @white; margin-bottom:5px; } .input_colours; } .update_search { background: url(../img/update-search.png) no-repeat top center; text-decoration: none; color: #FFF; font-size: 23px; text-align:center; margin-bottom:-50px; height:90px; display:inline-block; width:207px; padding-top:6px; &:hover { background: url(../img/update-search.png) no-repeat bottom center; color:#ffffff; text-decoration:none; } } /** search results **/ .search_results_header { background: @lightgrey url(../img/highlight.png) right top no-repeat; color: @darkgrey; padding: 7px 15px 4px 15px; font-size: 20px; .text-left { padding-top: 6px; } p { font-size: 12px; float: left; padding: 10px 10px 0 19px; } .btn.white { background:#ffffff; border:1px solid #637379; } .btn-group .dropdown-toggle { border-radius: 0px; background: @darkgrey; width:100%; display:inline-block; color: #FFF; height: 34px; .caret { border-top:4px solid #ffffff; } } .dropdown-menu { right:0; left:auto; min-width:120px; } } .search_results { .single_result { padding-top: 20px; padding-bottom: 0px; input[type="checkbox"]{ margin-bottom:10px; } .single_result_frame{ a{ border: 1px solid #CCCCCC; width: 132px; height: 132px; position: relative; display: table-cell; vertical-align: middle; } img{ margin: 0 auto; display: block; } } .row{ div{ p.email{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width:230px; } p:hover{ overflow:visible; } } } .search_result_description{ float:left; } .results_buttons { position: relative; bottom: -20px } h3, p { margin-top: 0px; margin-bottom: 0px; color:@darkgrey; } .col-xs-2, .col-xs-7 { } .col-xs-3, { padding-left: 0px; padding-right: 20px; } img.business_logo { max-width:125px; height:auto; } } } // Service tags ul.service_tags { list-style: none; padding: 0px 0 10px; margin:0 -3px; li div { background: @lightgrey; border: 1px solid @grey; padding: 5px 10px; margin: 0 3px 3px 0; float: left; color: @darkgrey; } li div:hover{ color: @lightgrey; background-color: @darkgrey; } } /** rating **/ .rating { padding: 3px 0 1px 0; letter-spacing: 9px; text-align: left; color: @darkgrey; margin: 3px 0; } .pending { font-size: 12px; text-transform: uppercase; background: @lightgrey; letter-spacing: 0px; text-align:center; } /** pagination **/ ul.pagination { list-style: none; padding: 0px; margin: 30px 0; &> li:first-child > a, &> li:first-child > span, &> li:last-child > a, &> li:last-child > span { border-radius:0; } li { a { padding: 10px 15px; background: @lightgrey; color: @darkgrey; margin-right: 5px; display: inline-block; border: 0px; font-size:20px; } a:hover { background: @darkgrey; color: @lightgrey; .transition; text-decoration: none; } .active { background: @green; color: @white; } } } /** signup form**/ .signup_form .row{ margin-left:-15px; margin-right:-15px; } .signup_form_container { background: @lightgrey; padding: 18px 14px 20px 15px; margin-bottom: 30px; font-size: 16px; .row{ margin-left:-15px; margin-right:-15px; } textarea { padding: 5px; height: 120px; } .input-group-addon { background: @darkgrey; } label span { color: @red; } .list-group { margin-bottom:0; } .form-group { label { span { color: @red; } } .bootstrap-filestyle { input { background: @white; border: 1px solid @grey; padding: 6px; width: 70%; } label { background: @darkgrey; border-radius: 0px; padding: 7px 15px; margin-top: -1px; width: 28%; span { color: @white; } } label:hover { background: @green; .transition; } } } .input_colours; } .subscription { margin-bottom:10px; .subscription_btn_nohover{ background: #CCCCCC; font-weight: 700; padding: 15px 0; font-size: 20px; border-bottom: 1px solid #F0F0F0; a{ color:#333333; padding:10px 0; text-decoration:none; } } .subscription_btn{ background: #CCCCCC; font-weight: 700; padding: 15px 0; font-size: 20px; border-bottom: 1px solid #F0F0F0; a{ color:#333333; padding:10px 0; text-decoration:none; } } .subscription_btn:hover, .subscribed{ background:#18b14b; color:#FFFFFF; a{ color:#FFFFFF; } } .subscription_header { color: @white; font-size: 26px; padding: 21px 15px; .subscription_one { background: url(../img/boats.png) top center no-repeat; width: 59px; height: 50px; float: right; margin: -3px -3px 0 0; } .subscription_two { background: url(../img/boats.png) -10px center no-repeat; width: 65px; height: 50px; float: right; margin: -5px -6px 0 0; } .subscription_three { background: url(../img/boats.png) bottom center no-repeat; width: 83px; height: 50px; float: right; margin: -5px -12px 0 0; } } .subscription_benefits { background: @white; height: 300px; padding: 20px; font-size: 25px; color: @darkgrey; ul { list-style: none; font-size: 16px; margin-top: 10px; li { background: url(../img/bullet.png) no-repeat; padding: 0 0 0 10px; margin-bottom: 12px; } } } .shiny_button.large { .inner { padding:15px 20px; } } } .about { .col-xs-6 { padding-left: 0px; padding-right: 0px; width: 46%; margin-right: 15px; } a.postjob { background: @darkgreen; height: 178px; } a.postjob:hover { text-decoration: none; background: @green; .transition; } a.postjob span { background: #18b14b url(../img/btn-highlight-lrg.png) right top no-repeat; color: #ffffff; font-size: 41px; text-align: center; height: 170px; padding: 57px 0; .right-corner; i { font-size: 33px; padding: 0 12px; } } a.postjob span:hover { background: @darkgreen; .transition; } .about-box { padding: 10px 15px; p { font-size: 18px; } } } /** payment page **/ .payment_container { background: #f0f0f0; padding: 15px 0 0 0; margin-bottom: 30px; color: @darkgrey; .row { margin-top: 12px; } .green_btn { margin: 0 0 15px 0; } .input-group-addon { background: @darkgrey; } &.paypal { padding-bottom:20px; } } /** 404 **/ .broken_boat { background: url(../img/404.png) no-repeat bottom center; width: 880px; height: 487px; h1 { color: #637379; font-size: 50px; margin-top: 65px; } p { font-size: 18px; } } /** Business Detail **/ .business_detail { padding-top:30px; h1 { margin:0 0 20px; font-size:38px; text-transform: uppercase; } .service_tags { margin-bottom:20px; } .breadcrumbs{ ul { li { list-style-type: none; float: left; margin-left: 3px; } padding-bottom: 30px; margin-top: -10px; } } .contact_business { .title { padding:15px; text-transform: uppercase; color:#ffffff; background:#BBBCBE; font-size:30px; line-height:30px; } .inner { .lightgrey; padding:15px; .contact_person { color:@green; text-transform: uppercase; } .fa { margin-right:8px; } p { font-size:22px; a { color:@darkgrey; } } } } .business_sidebar { .business_logo { border:1px solid @grey; margin-bottom:10px; max-width: 303px; height: auto; } .item { margin-bottom:15px; height:90px; p { font-size:17px; text-transform: uppercase; } .rating { text-align: center; border: 1px solid #ECECEC; padding: 10px 0 7px 0; .fa { font-size: 22px; padding: 0 10px; } } } .map { margin-bottom:15px; width : 303px; height : 200px; } .rate_this_business { .header { background:@green; padding:7px 15px; .fa { color:#ffffff; } .fa-inverse { color:@green; } .title { font-size:26px; color:#ffffff; text-transform: uppercase; position:relative; top:3px; } } .inner { .lightgrey; padding:20px; label { text-transform:uppercase; } .rating { text-align:center; padding-top:6px; .fa { font-size:22px; color:@green; } } .green_btn { text-transform:upperase; margin-bottom:0; } } } } } .rate_job_sub_heading { color:@green; font-size:17px; } .job_summary { background:@lightgrey; padding:20px; .title { font-size:30px; color:@green; text-transform: uppercase; line-height:30px; } .item { background:#ffffff; padding:10px; margin-bottom:10px; height: inherit; .type { color:@green; text-transform: uppercase; width:140px; display:inline-block; font-size:16px; } p { display:inline-block; margin-bottom:0; } &:last-child { margin-bottom:0; } } } .rate_job { background:@green; padding:15px 30px; .header { margin-bottom:10px; .fa { color:#ffffff; } .fa-inverse { color:@green; } .title { font-size:26px; color:#ffffff; text-transform: uppercase; position:relative; top:3px; } } label { color:#ffffff; text-transform:uppercase; font-size:16px; margin-top:5px; } .no_padding { padding-left:0; } .rating { text-align:left; .fa { color:#ffffff; font-size:22px; } } } //Manage Jobs #manageJobs { margin-bottom:70px; label { font-size:17px; text-transform: uppercase; span { color:@green; } } } .update_search_container { margin-top:30px; margin-bottom:-10px; } .table { thead > tr > th { font-weight:400; color:#ffffff; text-transform:uppercase; background:@green; border:0; } &> tbody > tr > td { vertical-align: middle; } } .shiny_button { border:0; padding:0 0 2px; -webkit-border-radius:0; -moz-border-radius:0; border-radius:0; display:inline-block; background:#bbbbbb; .transition; .inner { font-size:14px; display:block; color:#ffffff; background:#dddddd; padding:4px 8px; text-transform: uppercase; webkit-border-radius:0 0 8px 0; -moz-border-radius:0 0 8px 0; border-radius:0 0 8px 0; overflow:hidden; position:relative; .transition; &:after { content:''; position:absolute; background:#ffffff; opacity:0.2; filter:alpha(opacity=20); width:100px; height:40px; top:0; right:-50px; transform: rotate(55deg); -ms-transform: rotate(55deg); /* IE 9 */ -webkit-transform: rotate(55deg); /* Safari and Chrome */ .transition; } } &:hover { background:#dddddd; text-decoration:none; .inner { text-decoration:none; background:#bbbbbb; color:#ffffff; &:after { opacity:0; filter:alpha(opacity=0); .transition; } } } &.large { padding:0 0 3px; .inner { padding:14px 20px; &.stacked { padding:8px 20px; } font-size:24px; line-height:24px; .title { position: relative; text-align:left; margin-right:15px; &.top { top:4px; } } .smaller_icon { font-size:15px; display:inline-block; position: relative; right:-10px; } &:after { width:170px; height:60px; right:-75px; } } } &.medium { .inner { padding:8px 15px; font-size:16px; line-height:16px; .smaller_icon{ float:right; } &.stacked { padding:8px 15px; } .title { position: relative; float: left; clear:right; &.top { top:2px; } margin-right:5px; } .smaller_icon { font-size:9px; display:inline-block; position:relative; right:-7px; } .fa.fa-star-o { position:relative; right:-5px; top:2px; } &:after { width:130px; height:60px; right:-75px; } } } &.btn_yellow { background:#CE8F16; .inner { color:@darkgrey; background:#FFD100; } &:hover { background:#FFD100; .inner { background:#CE8F16; color:#ffffff; } } } &.btn_grey { .inner { color:@darkgrey; } &:hover { .inner { color:@darkgrey; } } } &.btn_green { background:#007D33; .inner { background:#18B14B; } &:hover { background:#18B14B; .inner { background:#007D33; } } } &.btn_blue { background:#055588; .inner { background:#007BC3; } &:hover { background:#007BC3; .inner { background:#055588; } } } &.btn_black { background:#211C1E; .inner { background:#3D3739; } &:hover { background:#3D3739; .inner { background:#211C1E; } } } &.btn_red { background:#871F15; .inner { background:#DD3221; .title { color:#ffffff; } &:after { right:-70px; } } &:hover { background:#DD3221; .inner { background:#871F15; } } } } .shiny_button_group { .shiny_button { margin-left: 10px; } } .logo_area { position:relative; border: 1px solid #CCCCCC; width: 132px; height: 132px; display: table-cell; vertical-align: middle; img{ width: 98%; height: auto; margin: 0 auto; display: block; } .shiny_button { position:absolute; bottom:0px; width:100%; } } .form-error{ border: 1px solid #ff0000!important; } form .error, .error-message{ color:#fe0000; input.form-error{ background:#FFFFFF!important; } } .other_make_container, .other_services_container{ display:none; } .row{ .col-xs-4{ button{ border:0px; width:100%; background:none; } } } .about-text{ background:url(../img/about-bg.png) no-repeat; height:269px; h3{ color:#FFFFFF; font-size:25px; margin-top:9px; } p{ font-size:23px; padding-right:55px; padding-top:15px; } } .form-group .files_uploaded input{ background:#0f0; padding:25px; } .pull-right{ .btn-group{ .dropdown-toggle{ width:auto!important; } } } // image carousel .table_imagecarousel{ width:100%; tr{ width:30%; } } // reporting page .table_reporting{ width:50%; tr{ width:30%; border-bottom:1px solid #CCCCCC; } } // Change colour of carousel indicators .carousel-indicators li{ border:1px solid #333333!important; } .centre-page-container { position: relative; } .ad-container { position: absolute; &#left-ad-container { width: 200px; height: 600px; left: -220px; } &#right-top-ad-container { width: 200px; height: 290px; right: -220px; top: 30px; } &#right-bottom-ad-container { width: 200px; height: 290px; right: -220px; top: 340px; } @media screen and (max-width: 1410px) { display: none; } }