//@import "bootstrap.less"; @import "../bower_components/bootstrap/less/variables.less"; @import "../bower_components/bootstrap/less/mixins.less"; @import '../bower_components/colors/less/colors.less'; @import '../bower_components/yamm3/yamm/yamm.less'; // include custom style @import "_brand"; @brand-yellow: #fed000; @brand-gray: #434a54; @brand-white: @white; body { font-family: "Open Sans", Arial, sans-serif; } /* Account for fixed navbar */ body, .navbar { min-width: 970px !important; } .nav { .lead { font-size: 14px; text-transform: uppercase; font-weight: bold; } } .container { width: 970px !important; } span.yellow { color: @brand-yellow; } .header-top { background-color: @brand-gray; height: 40px; line-height: 40px; .container { line-height: 40px; height: 40px; .top-left-links { float: left; text-align: left; color: @brand-yellow; font-size: 10pt; a { color: @brand-yellow; } } .top-right-links { float: right; text-align: right; color: @brand-white; font-weight: bold; font-size: 10pt; a { color: @brand-white; } } } } .header-middle { background-color: @brand-yellow; height: 130px; .logo-container { line-height: 130px; float: left; text-align: left; } .quick-access-container { float: right; text-align: right; form { margin-top: 30px; input { background-color: lighten(@brand-yellow, 10%); border: darken(@brand-yellow, 10%) 1px solid; width: 245px; height: 30px; padding: 5px; } button { background: none; border: none; } } .small-welcome { font-size: 10pt; margin-top: 10px; } .quick-links { font-size: 10pt; color: @brand-gray; a { color: @brand-gray; } } } } //.header-bottom{ // #gradient > .vertical(@start-color: @brand-gray; @end-color: lighten(@brand-gray, 15%)); // height: 45px; // line-height: 45px; // font-size: 9pt; // a{ // color: @white; // border-right: 1px lighten(@brand-gray, 20%) solid; // padding: 0 10px; // font-weight: bold; // &:hover{ // color: @brand-yellow; // text-decoration: none; // } // } //} /* Template-specific stuff * * Customizations just for the template; these are not necessary for anything * with disabling the responsiveness. */ /* Account for fixed navbar */ body, .navbar-static-top, .navbar-fixed-bottom { min-width: 970px; } /* Don't let the lead text change font-size. */ .lead { font-size: 14px; font-weight: bold; } /* Finesse the page header spacing */ .page-header { margin-bottom: 30px; } .page-header .lead { margin-bottom: 10px; } /* Non-responsive overrides * * Utilize the following CSS to disable the responsive-ness of the container, * grid system, and navbar. */ /* Reset the container */ .container { width: 970px; max-width: none !important; } /* Demonstrate the grids */ //.col-xs-4 { // padding-top: 15px; // padding-bottom: 15px; // background-color: #eee; // background-color: rgba(86,61,124,.15); // border: 1px solid #ddd; // border: 1px solid rgba(86,61,124,.2); //} .container .navbar-header, .container .navbar-collapse { margin-right: 0; margin-left: 0; } /* Always float the navbar header */ .navbar-header { float: left; } /* Undo the collapsing navbar */ .navbar-collapse { display: block !important; height: auto !important; padding-bottom: 0; overflow: visible !important; visibility: visible !important; } .navbar-toggle { display: none; } .navbar-collapse { border-top: 0; } .navbar-brand { margin-left: -15px; } /* Always apply the floated nav */ .navbar-nav { float: left; margin: 0; } .navbar-nav > li { float: left; } .navbar-nav > li > a { padding: 15px; } /* Redeclare since we override the float above */ .navbar-nav.navbar-right { float: right; } /* Undo custom dropdowns */ .navbar .navbar-nav .open .dropdown-menu { position: absolute; float: left; background-color: @brand-gray; color: @white; ul { list-style-type: none; padding: 0px; margin: 0px 0 15px 0px; } a { color: @white; border: none; font-weight: normal; font-size: 11px; &.title { color: @brand-yellow !important; //lighten(@blue, 30%) !important; font-weight: bold; font-size: 12px; } &:hover { text-decoration: underline; color: @brand-yellow; } } //border: 1px solid #ccc; //border: 1px solid rgba(0, 0, 0, .15); border-width: 0 1px 1px; border-radius: 0 0 2px 2px; -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175); box-shadow: 0 6px 12px rgba(0, 0, 0, .175); } a#order-call-link { color: #FC6E51; //font-size: 14px; } .navbar-default .navbar-nav .open .dropdown-menu > li > a { color: #333; } //ul.nav li.dropdown:hover > ul.dropdown-menu { // display: block; // color: #333; // position: absolute; // float: left; // background-color: @brand-gray; // color: @white; // ul { // // list-style-type: none; // padding: 0px; // margin: 0px 0 15px 0px; // } // a { // color: @white; // border: none; // font-weight: normal; // font-size: 11px; // &.title { // color: lighten(@blue, 30%) !important; // font-weight: bold; // } // &:hover { // text-decoration: underline; // color: @brand-yellow; // } // } // //border: 1px solid #ccc; // //border: 1px solid rgba(0, 0, 0, .15); // border-width: 0 1px 1px; // border-radius: 0 0 2px 2px; // -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175); // box-shadow: 0 6px 12px rgba(0, 0, 0, .175); //} .navbar .navbar-nav .open .dropdown-menu > li > a:hover, .navbar .navbar-nav .open .dropdown-menu > li > a:focus, .navbar .navbar-nav .open .dropdown-menu > .active > a, .navbar .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar .navbar-nav .open .dropdown-menu > .active > a:focus { color: #fff !important; background-color: #428bca !important; } .navbar .navbar-nav .open .dropdown-menu > .disabled > a, .navbar .navbar-nav .open .dropdown-menu > .disabled > a:hover, .navbar .navbar-nav .open .dropdown-menu > .disabled > a:focus { color: #999 !important; background-color: transparent !important; } /* Undo form expansion */ .navbar-form { float: left; width: auto; padding-top: 0; padding-bottom: 0; margin-right: 0; margin-left: 0; border: 0; -webkit-box-shadow: none; box-shadow: none; } /* Copy-pasted from forms.less since we mixin the .form-inline styles. */ .navbar-form .form-group { display: inline-block; margin-bottom: 0; vertical-align: middle; } .navbar-form .form-control { display: inline-block; width: auto; vertical-align: middle; } .navbar-form .form-control-static { display: inline-block; } .navbar-form .input-group { display: inline-table; vertical-align: middle; } .navbar-form .input-group .input-group-addon, .navbar-form .input-group .input-group-btn, .navbar-form .input-group .form-control { width: auto; } .navbar-form .input-group > .form-control { width: 100%; } .navbar-form .control-label { margin-bottom: 0; vertical-align: middle; } .navbar-form .radio, .navbar-form .checkbox { display: inline-block; margin-top: 0; margin-bottom: 0; vertical-align: middle; } .navbar-form .radio label, .navbar-form .checkbox label { padding-left: 0; } .navbar-form .radio input[type="radio"], .navbar-form .checkbox input[type="checkbox"] { position: relative; margin-left: 0; } .navbar-form .has-feedback .form-control-feedback { top: 0; } .navbar-container { padding: 0; } .dropdown-menu { min-width: 720px !important; } .navbar { margin-bottom: 0px !important; } .main-container { //border-right: 1px @silver solid; //border-left: 1px @silver solid; padding: 20px 0 100px 0; } .index-goods { .thumbnail { padding-bottom: 10px !important; .box-shadow(none); border: 0; } .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3 { } margin-top: 20px; .title { height: 40px; overflow: hidden; //display: block; //margin-top: -20px; a { font-weight: bold; color: @blue; font-size: 12px; } } .price { font-size: 18px; font-weight: bold; margin-bottom: 5px; } .state-yes { color: @green; font-size: 11px; margin-bottom: 10px; } .state-no { color: @red; font-size: 11px; margin-bottom: 10px; } .in-cart span { //background-color: @brand-yellow; //padding: 5px; } a.cart-link { color: @black; &:hover { text-decoration: none; color: @black; } } } footer { .footer-col { margin-top: 10px; background: none; border-left: 1px darken(@gray, 30%) solid; height: 100px; &.col-last { border-right: 1px darken(@gray, 30%) solid; } } .footer-top { height: 30px; margin-top: -40px; background-color: @brand-yellow; } .footer-bottom { height: 330px; //background-color: @brand-gray; color: @white; font-size: 12px; .title { color: @brand-yellow; font-weight: bold; } a { color: @white; &:hover { color: @brand-yellow; } } } } /* Sticky footer styles -------------------------------------------------- */ html { position: relative !important; min-height: 100% !important; } body { /* Margin bottom by footer height */ margin-bottom: 360px !important; } .footer { position: absolute !important; bottom: 0 !important; width: 100% !important; /* Set the fixed height of the footer here */ height: 360px !important; } .navbar-inverse { a { color: @white !important; border-right: 1px lighten(@brand-gray, 20%) solid; font-weight: bold; font-size: 9pt; &:hover { color: @brand-yellow !important; text-decoration: none; } } #gradient > .vertical(@start-color: @brand-gray; @end-color: lighten(@brand-gray, 7%)); .reset-filter(); // Remove gradient in IE<10 to fix bug where dropdowns don't get triggered; see https://github.com/twbs/bootstrap/issues/10257 .navbar-nav > .open > a, .navbar-nav > .active > a { #gradient > .vertical(@start-color: @navbar-inverse-link-active-bg; @end-color: lighten(@navbar-inverse-link-active-bg, 2.5%)); .box-shadow(inset 0 3px 9px rgba(0, 0, 0, .25)); } .navbar-brand, .navbar-nav > li > a { text-shadow: 0 -1px 0 rgba(0, 0, 0, .25); } } body { background-color: rgb(241, 242, 246); } h1, h2, h3, h4, h5, h6 { text-align: center; } .well-lg form { margin: 10px 0; } .alert h4 { text-align: left; } .navbar-container.affix { top: 0; width: 100%; z-index: 5000; } .navbar-container { width: 100%; z-index: 5000; } .panel-filter { ul { text-align: left; list-style-type: none; list-style-position: inherit; padding: 0; margin: 0; .icheckbox_square-blue { margin-right: 5px; } label { font-weight: normal; } } } hr.dashed { border: none; height: 1px; width: 100%; border-top: 1px dashed #ccc } .category-filter-title { text-transform: uppercase; font-size: 12px; font-weight: bold; margin-bottom: 15px; } .category-paginator { font-size: 12px; line-height: 25px; background: @brand-gray; height: 50px; color: @white; margin-bottom: 20px; .border-right-radius(4px); .border-left-radius(4px); .category-paginator-top { padding: 0 10px; height: 25px; border-bottom: 1px #BDC3C7 solid; } .category-paginator-bottom { height: 20px; padding: 0 10px; } select { color: black; } } .category-items { margin: 0; } @bradcrumbs-background: @brand-yellow; @bradcrumbs-border: darken(@bradcrumbs-background, 5%); @bradcrumbs-color: @brand-gray; .breadcrumb-arrow li a::before { border-left-color: @bradcrumbs-background; } .breadcrumb-arrow li a::after { border-left: 11px solid @bradcrumbs-border; } .breadcrumb-arrow li a::after { border-left: 11px solid @bradcrumbs-border; } .breadcrumb-arrow li a { background-color: @bradcrumbs-background; border: 1px solid @bradcrumbs-border; color: @bradcrumbs-color; } .breadcrumb-arrow li a:focus::before, .breadcrumb-arrow li a:hover::before { border-left-color: @bradcrumbs-background; } .breadcrumb-arrow li a:focus, .breadcrumb-arrow li a:hover { background-color: @bradcrumbs-background; border: 1px solid @bradcrumbs-background; } .breadcrumb-arrow li a:active::after, .breadcrumb-arrow li a:active::before { border-left-color: @bradcrumbs-background; } .breadcrumb-arrow li a:active::after, .breadcrumb-arrow li a:active::before { border-left-color: @bradcrumbs-background; } .breadcrumb-arrow li a:active { background-color: @bradcrumbs-background; border: 1px solid @bradcrumbs-background; } .category-paginator { a { color: @brand-yellow; &:hover, &:active { color: @brand-yellow; } } } .product-min-thumbnails { img { margin-bottom: 10px; } } .product-big-thumbnail { .product-big-thumbnail-container { width: 400px; height: 400px; min-width: 400px; min-height: 400px; max-width: 400px; max-height: 400px; background: white; border: 1px #ddd solid; border-radius: 4px; text-align: center; line-height: 400px; img { width: 396px; margin-top: 2px; } } } .product-short-description { padding-left: 35px; h4 { text-align: left; margin-top: 0; padding-top: 0; } .product-detail-price { font-size: 41px; font-weight: bold; } } .product-not-in-stock { color: @red; font-style: italic; display: none; } .product-in-stock { .itogo { font-size: 20px; } } table.table-cart { input { width: 70px; text-align: left; float: right; } tbody { td { padding-top: 45px; &.table-cart-image { padding-top: 8px; } .form-control { margin-top: -8px; } } } } .breadcrumbs { overflow: hidden !important; } ol.breadcrumb.breadcrumb-arrow { overflow: hidden !important; } .table { thead { tr { //background: @brand-gray; th { background: @brand-gray; color: @brand-white; border-right: 1px gray solid; &:last-child { border-right: none; } &:last-of-type { border-right: none; } &:last { border-right: none; } } } } tbody { td { border-right: 1px #ddd solid; &:last-child { border-right: none; } &:last-of-type { border-right: none; } &:last { border-right: none; } } } .table-cart-itogo { font-size: 20px; } } ul.messages { display: none; } .product-description { margin-top: 40px; padding-top: 20px; border-top: 1px #ddd solid; } .order-data .radio { margin-left: 15px; } #order-itogo-amount, #order-itogo-delivery, #cart-itogo, #order-itogo-amount-up, #order-itogo-delivery-up, #cart-itogo-up { font-size: 20px; } .well-large { padding: 40px; } .news-container { .comment { overflow: auto; } .media { background: #F5F7FA; padding: 15px; } } .call-form, .order-form { background: #FFF; padding: 20px 30px; text-align: left; max-width: 500px; margin: 40px auto; position: relative } .sale-percent-block { background: #E9573F; width: 50px; height: 50px; text-align: center; color: white; top: 0; font-size: 20px; line-height: 50px; } .radio { img { margin-top: 10px; margin-bottom: 10px; } label { margin-left: 0px !important; padding-left: 0px !important; input { margin-left: 0 !important; position: relative !important; } } }