.\n\n.list-group {\n // No need to set list-style: none; since .list-group-item is block level\n margin-bottom: 20px;\n padding-left: 0; // reset padding because ul and ol\n}\n\n\n// Individual list items\n//\n// Use on `li`s or `div`s within the `.list-group` parent.\n\n.list-group-item {\n position: relative;\n display: block;\n padding: 10px 15px;\n // Place the border on the list items and negative margin up for better styling\n margin-bottom: -1px;\n background-color: @list-group-bg;\n border: 1px solid @list-group-border;\n\n // Round the first and last items\n &:first-child {\n .border-top-radius(@list-group-border-radius);\n }\n &:last-child {\n margin-bottom: 0;\n .border-bottom-radius(@list-group-border-radius);\n }\n}\n\n\n// Interactive list items\n//\n// Use anchor or button elements instead of `li`s or `div`s to create interactive items.\n// Includes an extra `.active` modifier class for showing selected items.\n\na.list-group-item,\nbutton.list-group-item {\n color: @list-group-link-color;\n\n .list-group-item-heading {\n color: @list-group-link-heading-color;\n }\n\n // Hover state\n &:hover,\n &:focus {\n text-decoration: none;\n color: @list-group-link-hover-color;\n background-color: @list-group-hover-bg;\n }\n}\n\nbutton.list-group-item {\n width: 100%;\n text-align: left;\n}\n\n.list-group-item {\n // Disabled state\n &.disabled,\n &.disabled:hover,\n &.disabled:focus {\n background-color: @list-group-disabled-bg;\n color: @list-group-disabled-color;\n cursor: @cursor-disabled;\n\n // Force color to inherit for custom content\n .list-group-item-heading {\n color: inherit;\n }\n .list-group-item-text {\n color: @list-group-disabled-text-color;\n }\n }\n\n // Active class on item itself, not parent\n &.active,\n &.active:hover,\n &.active:focus {\n z-index: 2; // Place active items above their siblings for proper border styling\n color: @list-group-active-color;\n background-color: @list-group-active-bg;\n border-color: @list-group-active-border;\n\n // Force color to inherit for custom content\n .list-group-item-heading,\n .list-group-item-heading > small,\n .list-group-item-heading > .small {\n color: inherit;\n }\n .list-group-item-text {\n color: @list-group-active-text-color;\n }\n }\n}\n\n\n// Contextual variants\n//\n// Add modifier classes to change text and background color on individual items.\n// Organizationally, this must come after the `:hover` states.\n\n.list-group-item-variant(success; @state-success-bg; @state-success-text);\n.list-group-item-variant(info; @state-info-bg; @state-info-text);\n.list-group-item-variant(warning; @state-warning-bg; @state-warning-text);\n.list-group-item-variant(danger; @state-danger-bg; @state-danger-text);\n\n\n// Custom content options\n//\n// Extra classes for creating well-formatted content within `.list-group-item`s.\n\n.list-group-item-heading {\n margin-top: 0;\n margin-bottom: 5px;\n}\n.list-group-item-text {\n margin-bottom: 0;\n line-height: 1.3;\n}\n","// List Groups\n\n.list-group-item-variant(@state; @background; @color) {\n .list-group-item-@{state} {\n color: @color;\n background-color: @background;\n\n a&,\n button& {\n color: @color;\n\n .list-group-item-heading {\n color: inherit;\n }\n\n &:hover,\n &:focus {\n color: @color;\n background-color: darken(@background, 5%);\n }\n &.active,\n &.active:hover,\n &.active:focus {\n color: #fff;\n background-color: @color;\n border-color: @color;\n }\n }\n }\n}\n","//\n// Panels\n// --------------------------------------------------\n\n\n// Base class\n.panel {\n margin-bottom: @line-height-computed;\n background-color: @panel-bg;\n border: 1px solid transparent;\n border-radius: @panel-border-radius;\n .box-shadow(0 1px 1px rgba(0,0,0,.05));\n}\n\n// Panel contents\n.panel-body {\n padding: @panel-body-padding;\n &:extend(.clearfix all);\n}\n\n// Optional heading\n.panel-heading {\n padding: @panel-heading-padding;\n border-bottom: 1px solid transparent;\n .border-top-radius((@panel-border-radius - 1));\n\n > .dropdown .dropdown-toggle {\n color: inherit;\n }\n}\n\n// Within heading, strip any `h*` tag of its default margins for spacing.\n.panel-title {\n margin-top: 0;\n margin-bottom: 0;\n font-size: ceil((@font-size-base * 1.125));\n color: inherit;\n\n > a,\n > small,\n > .small,\n > small > a,\n > .small > a {\n color: inherit;\n }\n}\n\n// Optional footer (stays gray in every modifier class)\n.panel-footer {\n padding: @panel-footer-padding;\n background-color: @panel-footer-bg;\n border-top: 1px solid @panel-inner-border;\n .border-bottom-radius((@panel-border-radius - 1));\n}\n\n\n// List groups in panels\n//\n// By default, space out list group content from panel headings to account for\n// any kind of custom content between the two.\n\n.panel {\n > .list-group,\n > .panel-collapse > .list-group {\n margin-bottom: 0;\n\n .list-group-item {\n border-width: 1px 0;\n border-radius: 0;\n }\n\n // Add border top radius for first one\n &:first-child {\n .list-group-item:first-child {\n border-top: 0;\n .border-top-radius((@panel-border-radius - 1));\n }\n }\n\n // Add border bottom radius for last one\n &:last-child {\n .list-group-item:last-child {\n border-bottom: 0;\n .border-bottom-radius((@panel-border-radius - 1));\n }\n }\n }\n > .panel-heading + .panel-collapse > .list-group {\n .list-group-item:first-child {\n .border-top-radius(0);\n }\n }\n}\n// Collapse space between when there's no additional content.\n.panel-heading + .list-group {\n .list-group-item:first-child {\n border-top-width: 0;\n }\n}\n.list-group + .panel-footer {\n border-top-width: 0;\n}\n\n// Tables in panels\n//\n// Place a non-bordered `.table` within a panel (not within a `.panel-body`) and\n// watch it go full width.\n\n.panel {\n > .table,\n > .table-responsive > .table,\n > .panel-collapse > .table {\n margin-bottom: 0;\n\n caption {\n padding-left: @panel-body-padding;\n padding-right: @panel-body-padding;\n }\n }\n // Add border top radius for first one\n > .table:first-child,\n > .table-responsive:first-child > .table:first-child {\n .border-top-radius((@panel-border-radius - 1));\n\n > thead:first-child,\n > tbody:first-child {\n > tr:first-child {\n border-top-left-radius: (@panel-border-radius - 1);\n border-top-right-radius: (@panel-border-radius - 1);\n\n td:first-child,\n th:first-child {\n border-top-left-radius: (@panel-border-radius - 1);\n }\n td:last-child,\n th:last-child {\n border-top-right-radius: (@panel-border-radius - 1);\n }\n }\n }\n }\n // Add border bottom radius for last one\n > .table:last-child,\n > .table-responsive:last-child > .table:last-child {\n .border-bottom-radius((@panel-border-radius - 1));\n\n > tbody:last-child,\n > tfoot:last-child {\n > tr:last-child {\n border-bottom-left-radius: (@panel-border-radius - 1);\n border-bottom-right-radius: (@panel-border-radius - 1);\n\n td:first-child,\n th:first-child {\n border-bottom-left-radius: (@panel-border-radius - 1);\n }\n td:last-child,\n th:last-child {\n border-bottom-right-radius: (@panel-border-radius - 1);\n }\n }\n }\n }\n > .panel-body + .table,\n > .panel-body + .table-responsive,\n > .table + .panel-body,\n > .table-responsive + .panel-body {\n border-top: 1px solid @table-border-color;\n }\n > .table > tbody:first-child > tr:first-child th,\n > .table > tbody:first-child > tr:first-child td {\n border-top: 0;\n }\n > .table-bordered,\n > .table-responsive > .table-bordered {\n border: 0;\n > thead,\n > tbody,\n > tfoot {\n > tr {\n > th:first-child,\n > td:first-child {\n border-left: 0;\n }\n > th:last-child,\n > td:last-child {\n border-right: 0;\n }\n }\n }\n > thead,\n > tbody {\n > tr:first-child {\n > td,\n > th {\n border-bottom: 0;\n }\n }\n }\n > tbody,\n > tfoot {\n > tr:last-child {\n > td,\n > th {\n border-bottom: 0;\n }\n }\n }\n }\n > .table-responsive {\n border: 0;\n margin-bottom: 0;\n }\n}\n\n\n// Collapsable panels (aka, accordion)\n//\n// Wrap a series of panels in `.panel-group` to turn them into an accordion with\n// the help of our collapse JavaScript plugin.\n\n.panel-group {\n margin-bottom: @line-height-computed;\n\n // Tighten up margin so it's only between panels\n .panel {\n margin-bottom: 0;\n border-radius: @panel-border-radius;\n\n + .panel {\n margin-top: 5px;\n }\n }\n\n .panel-heading {\n border-bottom: 0;\n\n + .panel-collapse > .panel-body,\n + .panel-collapse > .list-group {\n border-top: 1px solid @panel-inner-border;\n }\n }\n\n .panel-footer {\n border-top: 0;\n + .panel-collapse .panel-body {\n border-bottom: 1px solid @panel-inner-border;\n }\n }\n}\n\n\n// Contextual variations\n.panel-default {\n .panel-variant(@panel-default-border; @panel-default-text; @panel-default-heading-bg; @panel-default-border);\n}\n.panel-primary {\n .panel-variant(@panel-primary-border; @panel-primary-text; @panel-primary-heading-bg; @panel-primary-border);\n}\n.panel-success {\n .panel-variant(@panel-success-border; @panel-success-text; @panel-success-heading-bg; @panel-success-border);\n}\n.panel-info {\n .panel-variant(@panel-info-border; @panel-info-text; @panel-info-heading-bg; @panel-info-border);\n}\n.panel-warning {\n .panel-variant(@panel-warning-border; @panel-warning-text; @panel-warning-heading-bg; @panel-warning-border);\n}\n.panel-danger {\n .panel-variant(@panel-danger-border; @panel-danger-text; @panel-danger-heading-bg; @panel-danger-border);\n}\n","// Panels\n\n.panel-variant(@border; @heading-text-color; @heading-bg-color; @heading-border) {\n border-color: @border;\n\n & > .panel-heading {\n color: @heading-text-color;\n background-color: @heading-bg-color;\n border-color: @heading-border;\n\n + .panel-collapse > .panel-body {\n border-top-color: @border;\n }\n .badge {\n color: @heading-bg-color;\n background-color: @heading-text-color;\n }\n }\n & > .panel-footer {\n + .panel-collapse > .panel-body {\n border-bottom-color: @border;\n }\n }\n}\n","// Embeds responsive\n//\n// Credit: Nicolas Gallagher and SUIT CSS.\n\n.embed-responsive {\n position: relative;\n display: block;\n height: 0;\n padding: 0;\n overflow: hidden;\n\n .embed-responsive-item,\n iframe,\n embed,\n object,\n video {\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n height: 100%;\n width: 100%;\n border: 0;\n }\n}\n\n// Modifier class for 16:9 aspect ratio\n.embed-responsive-16by9 {\n padding-bottom: 56.25%;\n}\n\n// Modifier class for 4:3 aspect ratio\n.embed-responsive-4by3 {\n padding-bottom: 75%;\n}\n","//\n// Wells\n// --------------------------------------------------\n\n\n// Base class\n.well {\n min-height: 20px;\n padding: 19px;\n margin-bottom: 20px;\n background-color: @well-bg;\n border: 1px solid @well-border;\n border-radius: @border-radius-base;\n .box-shadow(inset 0 1px 1px rgba(0,0,0,.05));\n blockquote {\n border-color: #ddd;\n border-color: rgba(0,0,0,.15);\n }\n}\n\n// Sizes\n.well-lg {\n padding: 24px;\n border-radius: @border-radius-large;\n}\n.well-sm {\n padding: 9px;\n border-radius: @border-radius-small;\n}\n","//\n// Close icons\n// --------------------------------------------------\n\n\n.close {\n float: right;\n font-size: (@font-size-base * 1.5);\n font-weight: @close-font-weight;\n line-height: 1;\n color: @close-color;\n text-shadow: @close-text-shadow;\n .opacity(.2);\n\n &:hover,\n &:focus {\n color: @close-color;\n text-decoration: none;\n cursor: pointer;\n .opacity(.5);\n }\n\n // Additional properties for button version\n // iOS requires the button element instead of an anchor tag.\n // If you want the anchor version, it requires `href=\"#\"`.\n // See https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile\n button& {\n padding: 0;\n cursor: pointer;\n background: transparent;\n border: 0;\n -webkit-appearance: none;\n }\n}\n","//\n// Modals\n// --------------------------------------------------\n\n// .modal-open - body class for killing the scroll\n// .modal - container to scroll within\n// .modal-dialog - positioning shell for the actual modal\n// .modal-content - actual modal w/ bg and corners and shit\n\n// Kill the scroll on the body\n.modal-open {\n overflow: hidden;\n}\n\n// Container that the modal scrolls within\n.modal {\n display: none;\n overflow: hidden;\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: @zindex-modal;\n -webkit-overflow-scrolling: touch;\n\n // Prevent Chrome on Windows from adding a focus outline. For details, see\n // https://github.com/twbs/bootstrap/pull/10951.\n outline: 0;\n\n // When fading in the modal, animate it to slide down\n &.fade .modal-dialog {\n .translate(0, -25%);\n .transition-transform(~\"0.3s ease-out\");\n }\n &.in .modal-dialog { .translate(0, 0) }\n}\n.modal-open .modal {\n overflow-x: hidden;\n overflow-y: auto;\n}\n\n// Shell div to position the modal with bottom padding\n.modal-dialog {\n position: relative;\n width: auto;\n margin: 10px;\n}\n\n// Actual modal\n.modal-content {\n position: relative;\n background-color: @modal-content-bg;\n border: 1px solid @modal-content-fallback-border-color; //old browsers fallback (ie8 etc)\n border: 1px solid @modal-content-border-color;\n border-radius: @border-radius-large;\n .box-shadow(0 3px 9px rgba(0,0,0,.5));\n background-clip: padding-box;\n // Remove focus outline from opened modal\n outline: 0;\n}\n\n// Modal background\n.modal-backdrop {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: @zindex-modal-background;\n background-color: @modal-backdrop-bg;\n // Fade for backdrop\n &.fade { .opacity(0); }\n &.in { .opacity(@modal-backdrop-opacity); }\n}\n\n// Modal header\n// Top section of the modal w/ title and dismiss\n.modal-header {\n padding: @modal-title-padding;\n border-bottom: 1px solid @modal-header-border-color;\n &:extend(.clearfix all);\n}\n// Close icon\n.modal-header .close {\n margin-top: -2px;\n}\n\n// Title text within header\n.modal-title {\n margin: 0;\n line-height: @modal-title-line-height;\n}\n\n// Modal body\n// Where all modal content resides (sibling of .modal-header and .modal-footer)\n.modal-body {\n position: relative;\n padding: @modal-inner-padding;\n}\n\n// Footer (for actions)\n.modal-footer {\n padding: @modal-inner-padding;\n text-align: right; // right align buttons\n border-top: 1px solid @modal-footer-border-color;\n &:extend(.clearfix all); // clear it in case folks use .pull-* classes on buttons\n\n // Properly space out buttons\n .btn + .btn {\n margin-left: 5px;\n margin-bottom: 0; // account for input[type=\"submit\"] which gets the bottom margin like all other inputs\n }\n // but override that for button groups\n .btn-group .btn + .btn {\n margin-left: -1px;\n }\n // and override it for block buttons as well\n .btn-block + .btn-block {\n margin-left: 0;\n }\n}\n\n// Measure scrollbar width for padding body during modal show/hide\n.modal-scrollbar-measure {\n position: absolute;\n top: -9999px;\n width: 50px;\n height: 50px;\n overflow: scroll;\n}\n\n// Scale up the modal\n@media (min-width: @screen-sm-min) {\n // Automatically set modal's width for larger viewports\n .modal-dialog {\n width: @modal-md;\n margin: 30px auto;\n }\n .modal-content {\n .box-shadow(0 5px 15px rgba(0,0,0,.5));\n }\n\n // Modal sizes\n .modal-sm { width: @modal-sm; }\n}\n\n@media (min-width: @screen-md-min) {\n .modal-lg { width: @modal-lg; }\n}\n","//\n// Tooltips\n// --------------------------------------------------\n\n\n// Base class\n.tooltip {\n position: absolute;\n z-index: @zindex-tooltip;\n display: block;\n // Our parent element can be arbitrary since tooltips are by default inserted as a sibling of their target element.\n // So reset our font and text properties to avoid inheriting weird values.\n .reset-text();\n font-size: @font-size-small;\n\n .opacity(0);\n\n &.in { .opacity(@tooltip-opacity); }\n &.top { margin-top: -3px; padding: @tooltip-arrow-width 0; }\n &.right { margin-left: 3px; padding: 0 @tooltip-arrow-width; }\n &.bottom { margin-top: 3px; padding: @tooltip-arrow-width 0; }\n &.left { margin-left: -3px; padding: 0 @tooltip-arrow-width; }\n}\n\n// Wrapper for the tooltip content\n.tooltip-inner {\n max-width: @tooltip-max-width;\n padding: 3px 8px;\n color: @tooltip-color;\n text-align: center;\n background-color: @tooltip-bg;\n border-radius: @border-radius-base;\n}\n\n// Arrows\n.tooltip-arrow {\n position: absolute;\n width: 0;\n height: 0;\n border-color: transparent;\n border-style: solid;\n}\n// Note: Deprecated .top-left, .top-right, .bottom-left, and .bottom-right as of v3.3.1\n.tooltip {\n &.top .tooltip-arrow {\n bottom: 0;\n left: 50%;\n margin-left: -@tooltip-arrow-width;\n border-width: @tooltip-arrow-width @tooltip-arrow-width 0;\n border-top-color: @tooltip-arrow-color;\n }\n &.top-left .tooltip-arrow {\n bottom: 0;\n right: @tooltip-arrow-width;\n margin-bottom: -@tooltip-arrow-width;\n border-width: @tooltip-arrow-width @tooltip-arrow-width 0;\n border-top-color: @tooltip-arrow-color;\n }\n &.top-right .tooltip-arrow {\n bottom: 0;\n left: @tooltip-arrow-width;\n margin-bottom: -@tooltip-arrow-width;\n border-width: @tooltip-arrow-width @tooltip-arrow-width 0;\n border-top-color: @tooltip-arrow-color;\n }\n &.right .tooltip-arrow {\n top: 50%;\n left: 0;\n margin-top: -@tooltip-arrow-width;\n border-width: @tooltip-arrow-width @tooltip-arrow-width @tooltip-arrow-width 0;\n border-right-color: @tooltip-arrow-color;\n }\n &.left .tooltip-arrow {\n top: 50%;\n right: 0;\n margin-top: -@tooltip-arrow-width;\n border-width: @tooltip-arrow-width 0 @tooltip-arrow-width @tooltip-arrow-width;\n border-left-color: @tooltip-arrow-color;\n }\n &.bottom .tooltip-arrow {\n top: 0;\n left: 50%;\n margin-left: -@tooltip-arrow-width;\n border-width: 0 @tooltip-arrow-width @tooltip-arrow-width;\n border-bottom-color: @tooltip-arrow-color;\n }\n &.bottom-left .tooltip-arrow {\n top: 0;\n right: @tooltip-arrow-width;\n margin-top: -@tooltip-arrow-width;\n border-width: 0 @tooltip-arrow-width @tooltip-arrow-width;\n border-bottom-color: @tooltip-arrow-color;\n }\n &.bottom-right .tooltip-arrow {\n top: 0;\n left: @tooltip-arrow-width;\n margin-top: -@tooltip-arrow-width;\n border-width: 0 @tooltip-arrow-width @tooltip-arrow-width;\n border-bottom-color: @tooltip-arrow-color;\n }\n}\n",".reset-text() {\n font-family: @font-family-base;\n // We deliberately do NOT reset font-size.\n font-style: normal;\n font-weight: normal;\n letter-spacing: normal;\n line-break: auto;\n line-height: @line-height-base;\n text-align: left; // Fallback for where `start` is not supported\n text-align: start;\n text-decoration: none;\n text-shadow: none;\n text-transform: none;\n white-space: normal;\n word-break: normal;\n word-spacing: normal;\n word-wrap: normal;\n}\n","//\n// Popovers\n// --------------------------------------------------\n\n\n.popover {\n position: absolute;\n top: 0;\n left: 0;\n z-index: @zindex-popover;\n display: none;\n max-width: @popover-max-width;\n padding: 1px;\n // Our parent element can be arbitrary since popovers are by default inserted as a sibling of their target element.\n // So reset our font and text properties to avoid inheriting weird values.\n .reset-text();\n font-size: @font-size-base;\n\n background-color: @popover-bg;\n background-clip: padding-box;\n border: 1px solid @popover-fallback-border-color;\n border: 1px solid @popover-border-color;\n border-radius: @border-radius-large;\n .box-shadow(0 5px 10px rgba(0,0,0,.2));\n\n // Offset the popover to account for the popover arrow\n &.top { margin-top: -@popover-arrow-width; }\n &.right { margin-left: @popover-arrow-width; }\n &.bottom { margin-top: @popover-arrow-width; }\n &.left { margin-left: -@popover-arrow-width; }\n}\n\n.popover-title {\n margin: 0; // reset heading margin\n padding: 8px 14px;\n font-size: @font-size-base;\n background-color: @popover-title-bg;\n border-bottom: 1px solid darken(@popover-title-bg, 5%);\n border-radius: (@border-radius-large - 1) (@border-radius-large - 1) 0 0;\n}\n\n.popover-content {\n padding: 9px 14px;\n}\n\n// Arrows\n//\n// .arrow is outer, .arrow:after is inner\n\n.popover > .arrow {\n &,\n &:after {\n position: absolute;\n display: block;\n width: 0;\n height: 0;\n border-color: transparent;\n border-style: solid;\n }\n}\n.popover > .arrow {\n border-width: @popover-arrow-outer-width;\n}\n.popover > .arrow:after {\n border-width: @popover-arrow-width;\n content: \"\";\n}\n\n.popover {\n &.top > .arrow {\n left: 50%;\n margin-left: -@popover-arrow-outer-width;\n border-bottom-width: 0;\n border-top-color: @popover-arrow-outer-fallback-color; // IE8 fallback\n border-top-color: @popover-arrow-outer-color;\n bottom: -@popover-arrow-outer-width;\n &:after {\n content: \" \";\n bottom: 1px;\n margin-left: -@popover-arrow-width;\n border-bottom-width: 0;\n border-top-color: @popover-arrow-color;\n }\n }\n &.right > .arrow {\n top: 50%;\n left: -@popover-arrow-outer-width;\n margin-top: -@popover-arrow-outer-width;\n border-left-width: 0;\n border-right-color: @popover-arrow-outer-fallback-color; // IE8 fallback\n border-right-color: @popover-arrow-outer-color;\n &:after {\n content: \" \";\n left: 1px;\n bottom: -@popover-arrow-width;\n border-left-width: 0;\n border-right-color: @popover-arrow-color;\n }\n }\n &.bottom > .arrow {\n left: 50%;\n margin-left: -@popover-arrow-outer-width;\n border-top-width: 0;\n border-bottom-color: @popover-arrow-outer-fallback-color; // IE8 fallback\n border-bottom-color: @popover-arrow-outer-color;\n top: -@popover-arrow-outer-width;\n &:after {\n content: \" \";\n top: 1px;\n margin-left: -@popover-arrow-width;\n border-top-width: 0;\n border-bottom-color: @popover-arrow-color;\n }\n }\n\n &.left > .arrow {\n top: 50%;\n right: -@popover-arrow-outer-width;\n margin-top: -@popover-arrow-outer-width;\n border-right-width: 0;\n border-left-color: @popover-arrow-outer-fallback-color; // IE8 fallback\n border-left-color: @popover-arrow-outer-color;\n &:after {\n content: \" \";\n right: 1px;\n border-right-width: 0;\n border-left-color: @popover-arrow-color;\n bottom: -@popover-arrow-width;\n }\n }\n}\n","//\n// Carousel\n// --------------------------------------------------\n\n\n// Wrapper for the slide container and indicators\n.carousel {\n position: relative;\n}\n\n.carousel-inner {\n position: relative;\n overflow: hidden;\n width: 100%;\n\n > .item {\n display: none;\n position: relative;\n .transition(.6s ease-in-out left);\n\n // Account for jankitude on images\n > img,\n > a > img {\n &:extend(.img-responsive);\n line-height: 1;\n }\n\n // WebKit CSS3 transforms for supported devices\n @media all and (transform-3d), (-webkit-transform-3d) {\n .transition-transform(~'0.6s ease-in-out');\n .backface-visibility(~'hidden');\n .perspective(1000px);\n\n &.next,\n &.active.right {\n .translate3d(100%, 0, 0);\n left: 0;\n }\n &.prev,\n &.active.left {\n .translate3d(-100%, 0, 0);\n left: 0;\n }\n &.next.left,\n &.prev.right,\n &.active {\n .translate3d(0, 0, 0);\n left: 0;\n }\n }\n }\n\n > .active,\n > .next,\n > .prev {\n display: block;\n }\n\n > .active {\n left: 0;\n }\n\n > .next,\n > .prev {\n position: absolute;\n top: 0;\n width: 100%;\n }\n\n > .next {\n left: 100%;\n }\n > .prev {\n left: -100%;\n }\n > .next.left,\n > .prev.right {\n left: 0;\n }\n\n > .active.left {\n left: -100%;\n }\n > .active.right {\n left: 100%;\n }\n\n}\n\n// Left/right controls for nav\n// ---------------------------\n\n.carousel-control {\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n width: @carousel-control-width;\n .opacity(@carousel-control-opacity);\n font-size: @carousel-control-font-size;\n color: @carousel-control-color;\n text-align: center;\n text-shadow: @carousel-text-shadow;\n background-color: rgba(0, 0, 0, 0); // Fix IE9 click-thru bug\n // We can't have this transition here because WebKit cancels the carousel\n // animation if you trip this while in the middle of another animation.\n\n // Set gradients for backgrounds\n &.left {\n #gradient > .horizontal(@start-color: rgba(0,0,0,.5); @end-color: rgba(0,0,0,.0001));\n }\n &.right {\n left: auto;\n right: 0;\n #gradient > .horizontal(@start-color: rgba(0,0,0,.0001); @end-color: rgba(0,0,0,.5));\n }\n\n // Hover/focus state\n &:hover,\n &:focus {\n outline: 0;\n color: @carousel-control-color;\n text-decoration: none;\n .opacity(.9);\n }\n\n // Toggles\n .icon-prev,\n .icon-next,\n .glyphicon-chevron-left,\n .glyphicon-chevron-right {\n position: absolute;\n top: 50%;\n margin-top: -10px;\n z-index: 5;\n display: inline-block;\n }\n .icon-prev,\n .glyphicon-chevron-left {\n left: 50%;\n margin-left: -10px;\n }\n .icon-next,\n .glyphicon-chevron-right {\n right: 50%;\n margin-right: -10px;\n }\n .icon-prev,\n .icon-next {\n width: 20px;\n height: 20px;\n line-height: 1;\n font-family: serif;\n }\n\n\n .icon-prev {\n &:before {\n content: '\\2039';// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039)\n }\n }\n .icon-next {\n &:before {\n content: '\\203a';// SINGLE RIGHT-POINTING ANGLE QUOTATION MARK (U+203A)\n }\n }\n}\n\n// Optional indicator pips\n//\n// Add an unordered list with the following class and add a list item for each\n// slide your carousel holds.\n\n.carousel-indicators {\n position: absolute;\n bottom: 10px;\n left: 50%;\n z-index: 15;\n width: 60%;\n margin-left: -30%;\n padding-left: 0;\n list-style: none;\n text-align: center;\n\n li {\n display: inline-block;\n width: 10px;\n height: 10px;\n margin: 1px;\n text-indent: -999px;\n border: 1px solid @carousel-indicator-border-color;\n border-radius: 10px;\n cursor: pointer;\n\n // IE8-9 hack for event handling\n //\n // Internet Explorer 8-9 does not support clicks on elements without a set\n // `background-color`. We cannot use `filter` since that's not viewed as a\n // background color by the browser. Thus, a hack is needed.\n // See https://developer.mozilla.org/en-US/docs/Web/Events/click#Internet_Explorer\n //\n // For IE8, we set solid black as it doesn't support `rgba()`. For IE9, we\n // set alpha transparency for the best results possible.\n background-color: #000 \\9; // IE8\n background-color: rgba(0,0,0,0); // IE9\n }\n .active {\n margin: 0;\n width: 12px;\n height: 12px;\n background-color: @carousel-indicator-active-bg;\n }\n}\n\n// Optional captions\n// -----------------------------\n// Hidden by default for smaller viewports\n.carousel-caption {\n position: absolute;\n left: 15%;\n right: 15%;\n bottom: 20px;\n z-index: 10;\n padding-top: 20px;\n padding-bottom: 20px;\n color: @carousel-caption-color;\n text-align: center;\n text-shadow: @carousel-text-shadow;\n & .btn {\n text-shadow: none; // No shadow for button elements in carousel-caption\n }\n}\n\n\n// Scale up controls for tablets and up\n@media screen and (min-width: @screen-sm-min) {\n\n // Scale up the controls a smidge\n .carousel-control {\n .glyphicon-chevron-left,\n .glyphicon-chevron-right,\n .icon-prev,\n .icon-next {\n width: (@carousel-control-font-size * 1.5);\n height: (@carousel-control-font-size * 1.5);\n margin-top: (@carousel-control-font-size / -2);\n font-size: (@carousel-control-font-size * 1.5);\n }\n .glyphicon-chevron-left,\n .icon-prev {\n margin-left: (@carousel-control-font-size / -2);\n }\n .glyphicon-chevron-right,\n .icon-next {\n margin-right: (@carousel-control-font-size / -2);\n }\n }\n\n // Show and left align the captions\n .carousel-caption {\n left: 20%;\n right: 20%;\n padding-bottom: 30px;\n }\n\n // Move up the indicators\n .carousel-indicators {\n bottom: 20px;\n }\n}\n","// Clearfix\n//\n// For modern browsers\n// 1. The space content is one way to avoid an Opera bug when the\n// contenteditable attribute is included anywhere else in the document.\n// Otherwise it causes space to appear at the top and bottom of elements\n// that are clearfixed.\n// 2. The use of `table` rather than `block` is only necessary if using\n// `:before` to contain the top-margins of child elements.\n//\n// Source: http://nicolasgallagher.com/micro-clearfix-hack/\n\n.clearfix() {\n &:before,\n &:after {\n content: \" \"; // 1\n display: table; // 2\n }\n &:after {\n clear: both;\n }\n}\n","// Center-align a block level element\n\n.center-block() {\n display: block;\n margin-left: auto;\n margin-right: auto;\n}\n","// CSS image replacement\n//\n// Heads up! v3 launched with only `.hide-text()`, but per our pattern for\n// mixins being reused as classes with the same name, this doesn't hold up. As\n// of v3.0.1 we have added `.text-hide()` and deprecated `.hide-text()`.\n//\n// Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757\n\n// Deprecated as of v3.0.1 (has been removed in v4)\n.hide-text() {\n font: ~\"0/0\" a;\n color: transparent;\n text-shadow: none;\n background-color: transparent;\n border: 0;\n}\n\n// New mixin to use as of v3.0.1\n.text-hide() {\n .hide-text();\n}\n","//\n// Responsive: Utility classes\n// --------------------------------------------------\n\n\n// IE10 in Windows (Phone) 8\n//\n// Support for responsive views via media queries is kind of borked in IE10, for\n// Surface/desktop in split view and for Windows Phone 8. This particular fix\n// must be accompanied by a snippet of JavaScript to sniff the user agent and\n// apply some conditional CSS to *only* the Surface/desktop Windows 8. Look at\n// our Getting Started page for more information on this bug.\n//\n// For more information, see the following:\n//\n// Issue: https://github.com/twbs/bootstrap/issues/10497\n// Docs: http://getbootstrap.com/getting-started/#support-ie10-width\n// Source: http://timkadlec.com/2013/01/windows-phone-8-and-device-width/\n// Source: http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/\n\n@-ms-viewport {\n width: device-width;\n}\n\n\n// Visibility utilities\n// Note: Deprecated .visible-xs, .visible-sm, .visible-md, and .visible-lg as of v3.2.0\n.visible-xs,\n.visible-sm,\n.visible-md,\n.visible-lg {\n .responsive-invisibility();\n}\n\n.visible-xs-block,\n.visible-xs-inline,\n.visible-xs-inline-block,\n.visible-sm-block,\n.visible-sm-inline,\n.visible-sm-inline-block,\n.visible-md-block,\n.visible-md-inline,\n.visible-md-inline-block,\n.visible-lg-block,\n.visible-lg-inline,\n.visible-lg-inline-block {\n display: none !important;\n}\n\n.visible-xs {\n @media (max-width: @screen-xs-max) {\n .responsive-visibility();\n }\n}\n.visible-xs-block {\n @media (max-width: @screen-xs-max) {\n display: block !important;\n }\n}\n.visible-xs-inline {\n @media (max-width: @screen-xs-max) {\n display: inline !important;\n }\n}\n.visible-xs-inline-block {\n @media (max-width: @screen-xs-max) {\n display: inline-block !important;\n }\n}\n\n.visible-sm {\n @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {\n .responsive-visibility();\n }\n}\n.visible-sm-block {\n @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {\n display: block !important;\n }\n}\n.visible-sm-inline {\n @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {\n display: inline !important;\n }\n}\n.visible-sm-inline-block {\n @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {\n display: inline-block !important;\n }\n}\n\n.visible-md {\n @media (min-width: @screen-md-min) and (max-width: @screen-md-max) {\n .responsive-visibility();\n }\n}\n.visible-md-block {\n @media (min-width: @screen-md-min) and (max-width: @screen-md-max) {\n display: block !important;\n }\n}\n.visible-md-inline {\n @media (min-width: @screen-md-min) and (max-width: @screen-md-max) {\n display: inline !important;\n }\n}\n.visible-md-inline-block {\n @media (min-width: @screen-md-min) and (max-width: @screen-md-max) {\n display: inline-block !important;\n }\n}\n\n.visible-lg {\n @media (min-width: @screen-lg-min) {\n .responsive-visibility();\n }\n}\n.visible-lg-block {\n @media (min-width: @screen-lg-min) {\n display: block !important;\n }\n}\n.visible-lg-inline {\n @media (min-width: @screen-lg-min) {\n display: inline !important;\n }\n}\n.visible-lg-inline-block {\n @media (min-width: @screen-lg-min) {\n display: inline-block !important;\n }\n}\n\n.hidden-xs {\n @media (max-width: @screen-xs-max) {\n .responsive-invisibility();\n }\n}\n.hidden-sm {\n @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {\n .responsive-invisibility();\n }\n}\n.hidden-md {\n @media (min-width: @screen-md-min) and (max-width: @screen-md-max) {\n .responsive-invisibility();\n }\n}\n.hidden-lg {\n @media (min-width: @screen-lg-min) {\n .responsive-invisibility();\n }\n}\n\n\n// Print utilities\n//\n// Media queries are placed on the inside to be mixin-friendly.\n\n// Note: Deprecated .visible-print as of v3.2.0\n.visible-print {\n .responsive-invisibility();\n\n @media print {\n .responsive-visibility();\n }\n}\n.visible-print-block {\n display: none !important;\n\n @media print {\n display: block !important;\n }\n}\n.visible-print-inline {\n display: none !important;\n\n @media print {\n display: inline !important;\n }\n}\n.visible-print-inline-block {\n display: none !important;\n\n @media print {\n display: inline-block !important;\n }\n}\n\n.hidden-print {\n @media print {\n .responsive-invisibility();\n }\n}\n","// Responsive utilities\n\n//\n// More easily include all the states for responsive-utilities.less.\n.responsive-visibility() {\n display: block !important;\n table& { display: table !important; }\n tr& { display: table-row !important; }\n th&,\n td& { display: table-cell !important; }\n}\n\n.responsive-invisibility() {\n display: none !important;\n}\n","/**\n * Buttons\n */\n\n.btn-lg {\n font-size: @font-size-base;\n border-radius: @border-radius-base;\n}\n\n#button {\n\n .btn(@btn-color; @btn-font-color) {\n background-color: @btn-color;\n border-color: fade(black,10%);\n color: @btn-font-color;\n transition: all .05s linear;\n\n &:hover {\n background-color: (@btn-color - #151515);\n border-color: fade(black,15%);\n color: @btn-font-color;\n }\n &:focus, &.focus,\n &:active, &:active:hover, &:active:focus,\n &.active, &.active:hover, &.active:focus {\n background: (@btn-color - #151515);\n border-color: fade(black,12.5%);\n box-shadow: inset 0 3px 5px 0 fade(black,12.5%);\n outline: none;\n }\n }\n\n /*\n .btn(@btn-color; @btn-font-color) {\n background: @btn-color;\n border-color: fade(black,10%);\n color: @btn-font-color;\n #gradient > .vertical(fade(white,20%); transparent);\n box-shadow: inset 0 1px 1px fade(white,50%);\n\n &:hover, &:focus, &.focus,\n &:active, &:active:hover, &:active:focus,\n &.active, &.active:hover, &.active:focus {\n border-color: fade(black,15%);\n background: @btn-color;\n background-image: none;\n color: @btn-font-color;\n box-shadow: inset 0 0 1px fade(black,20%);\n outline: 0;\n .reset-filter(); \n }\n }\n */\n}\n\n/* Button Colors */\n\n.btn-default {\n #button > .btn(#f5f5f5; @text-color);\n}\n.btn-primary {\n #button > .btn(@brand-primary; white);\n}\n.btn-secondary {\n #button > .btn(@brand-sec; white);\n}\n.btn-gray {\n #button > .btn(@brand-gray; white);\n}","/**\n * Carousel\n */\n\n/* Slideshow controls */\n\n.carousel-arrow {\n position: absolute;\n top: 50%; left: 0; margin-top: -25px;\n display: block;\n width: 50px; height: 50px;\n text-align: center;\n border: 1px solid fade(black,12%);\n border-left-width: 0;\n border-radius: 0 @border-radius-base @border-radius-base 0;\n background-color: fade(white,70%);\n color: fade(black,70%);\n font-size: 28px;\n transition: all .1s linear;\n\n > .fa {\n line-height: 50px;\n }\n &:hover {\n padding-right: 5px;\n }\n &:hover, &:focus {\n color: fade(black,70%);\n }\n}\n.carousel-arrow-next {\n left: auto; right: 0;\n border-left-width: 1px;\n border-right-width: 0;\n border-radius: @border-radius-base 0 0 @border-radius-base;\n\n &:hover {\n padding-right: 0;\n padding-left: 5px;\n }\n}\n.carousel-arrow {\n opacity: 0;\n}\n.carousel:hover .carousel-arrow {\n opacity: 1;\n}\n\n/* Carousel indicators: Inverse */\n\n.carousel-indicators_inverse > li {\n border-color: #ccc;\n\n &.active {\n width: 10px; height: 10px;\n margin: 0;\n border-color: #ccc;\n background-color: #ccc;\n }\n}\n\n/* Fade slide transition */\n\n/*\n Bootstrap Carousel Fade Transition (for Bootstrap 3.3.x)\n CSS from: http://codepen.io/transportedman/pen/NPWRGq\n and: http://stackoverflow.com/questions/18548731/bootstrap-3-carousel-fading-to-new-slide-instead-of-sliding-to-new-slide\n Inspired from: http://codepen.io/Rowno/pen/Afykb \n*/\n.carousel-fade .carousel-inner .item {\n opacity: 0;\n transition-property: opacity;\n}\n\n.carousel-fade .carousel-inner .active {\n opacity: 1;\n}\n\n.carousel-fade .carousel-inner .active.left,\n.carousel-fade .carousel-inner .active.right {\n left: 0;\n opacity: 0;\n z-index: 1;\n}\n\n.carousel-fade .carousel-inner .next.left,\n.carousel-fade .carousel-inner .prev.right {\n opacity: 1;\n}\n\n.carousel-fade .carousel-control {\n z-index: 2;\n}\n\n@media all and (transform-3d), (-webkit-transform-3d) {\n .carousel-fade .carousel-inner > .item.next,\n .carousel-fade .carousel-inner > .item.active.right {\n opacity: 0;\n -webkit-transform: translate3d(0, 0, 0);\n transform: translate3d(0, 0, 0);\n }\n .carousel-fade .carousel-inner > .item.prev,\n .carousel-fade .carousel-inner > .item.active.left {\n opacity: 0;\n -webkit-transform: translate3d(0, 0, 0);\n transform: translate3d(0, 0, 0);\n }\n .carousel-fade .carousel-inner > .item.next.left,\n .carousel-fade .carousel-inner > .item.prev.right,\n .carousel-fade .carousel-inner > .item.active {\n opacity: 1;\n -webkit-transform: translate3d(0, 0, 0);\n transform: translate3d(0, 0, 0);\n }\n}","/**\n * Comments\n */\n\n.comments {\n margin: 20px 0;\n}\n.comments__heading {\n margin-bottom: 15px;\n font-weight: 600;\n text-transform: uppercase;\n color: @gray-light;\n}\n\n/* New comment */\n\nform[name=\"comments__new\"] {\n margin-bottom: 30px;\n .clearfix();\n\n textarea {\n height: @input-height-base;\n }\n button[type=\"submit\"] {\n float: right;\n }\n}\n\n/* List of comments */\n\n.comments__item {\n margin-bottom: 30px;\n}\n.comments-item__avatar {\n float: left;\n margin-right: 20px;\n width: 50px; height: 50px;\n border-radius: 50%;\n overflow: hidden; \n}\n.comments-item__body {\n overflow: hidden; \n}\n.comments-item__info {\n margin-bottom: 10px;\n .clearfix();\n}\n.comments-item-info__author,\n.comments-item-info__divider,\n.comments-item-info__timestamp {\n float: left;\n}\n.comments-item-info__author {\n font-weight: 600;\n}\n.comments-item-info__divider {\n margin-left: 15px;\n margin-right: 15px;\n line-height: @line-height-computed;\n color: #ddd;\n font-size: 6px;\n}\n.comment-item-info__timestamp {\n color: #999;\n}\n.comments-item__content {\n line-height: 1.7;\n color: @gray-light;\n margin-bottom: 10px;\n}\n.comments-item__actions {\n\n > a {\n color: #999;\n\n &:hover, &:focus {\n color: @text-color;\n }\n }\n}","/**\n * Footer\n */\n\nfooter {\n position: absolute;\n bottom: 0;\n width: 100%;\n margin-top: 40px;\n background-color: #f5f5f5;\n color: @text-color;\n border-top: 1px solid fade(black,14%);\n overflow: hidden;\n\n &:before {\n display: block;\n position: absolute;\n content: \"\";\n bottom: 100%; left: 10%; right: 10%;\n width: 80%; height: 100%;\n border-bottom-left-radius: 50% 10px;\n border-bottom-right-radius: 50% 10px;\n box-shadow: 0 0 20px fade(black,20%);\n }\n}\n.footer_top {\n padding: 60px 0 40px;\n border-bottom: 1px solid fade(black,10%);\n}\n.footer__item {\n margin-bottom: 20px;\n}\n.footer-item__title {\n margin: 0 0 20px;\n padding-bottom: 10px;\n border-bottom: 1px solid fade(black, 10%);\n text-transform: uppercase;\n font-weight: 600;\n font-size: (@font-size-base + 1px);\n\n > span {\n position: relative;\n display: inline-block;\n\n /* &::after {\n position: absolute;\n left: 0; right: 0; bottom: -11px;\n border-top: 1px solid @brand-primary;\n content: \"\";\n } */\n }\n}\n.footer-item__content {\n\n p {\n margin-bottom: 10px;\n }\n}\n@media(max-width: @screen-xs-max) {\n .footer-item__content {\n display: none;\n }\n}\n.footer__tweet + .footer__tweet,\n.footer__post + .footer__post {\n margin-top: 20px;\n}\n.footer-tweet__icon,\n.footer-post__img {\n float: left;\n margin-right: 15px;\n}\n.footer-tweet__content,\n.footer-post__content {\n overflow: hidden;\n}\n\n/* Recent Tweets */\n\n.footer-tweet__icon {\n font-size: 28px;\n color: @twitter-color;\n}\n\n/* Recent Posts */\n\n.footer-post__img {\n width: 35px;\n height: 35px;\n border-radius: 50%;\n overflow: hidden;\n}\n.footer-post__img > img {\n width: 100%;\n height: auto;\n}\n.footer-post__content > p {\n margin-bottom: 2px;\n}\n\n/* Footer Quick Links */\n\n.footer__links {\n padding-left: 0;\n list-style: none;\n}\n.footer__links > li > a {\n position: relative;\n display: block;\n padding: 10px 35px 10px 0;\n border-bottom: 1px dotted fade(black,20%);\n}\n.footer__links > li > a:after {\n content: \"\\f064\";\n position: absolute;\n top: 0;\n right: 0;\n padding: 10px;\n font-family: FontAwesome;\n color: fade(black,30%);\n opacity: 0;\n transition: all .1s;\n}\n.footer__links > li > a:hover:after,\n.footer__links > li > a:focus:after {\n opacity: 1;\n}\n.footer__links > li:first-child > a,\n.footer__links > li:first-child > a:after {\n padding-top: 0;\n}\n.footer__links > li:last-child > a {\n border-bottom: 0;\n}\n\n/* Footer bottom */\n\n.footer_bottom {\n padding: 20px 0;\n}\n.footer__copyright {\n margin-top: 6px;\n margin-bottom: 6px;\n}\n.footer__social {\n padding-left: 0;\n margin-bottom: 0;\n list-style: none;\n text-align: right;\n}\n.footer__social > li {\n display: inline-block;\n}\n.footer__social > li > a {\n display: block;\n background-color: fade(black,20%);\n color: white;\n .circle(30px);\n transition: all .1s;\n}\n.footer__social > li:hover > a {\n color: white;\n}\n.footer__social > li.twitter > a:hover {\n background-color: @twitter-color;\n}\n.footer__social > li.facebook > a:hover {\n background-color: @facebook-color;\n}\n.footer__social > li.linkedin > a:hover {\n background-color: @linkedin-color;\n}\n.footer__social > li.google-plus > a:hover {\n background-color: @google-plus-color;\n}\n.footer__social > li.pinterest > a:hover {\n background-color: @pinterest-color;\n}\n@media (max-width: @screen-xs-max) {\n\n /* Footer top */\n\n .footer_top {\n padding: 40px 0 20px;\n }\n .footer-item__title {\n position: relative;\n cursor: pointer;\n\n &:after {\n content: \"\\f107\";\n font-family: FontAwesome;\n position: absolute;\n right: 0;\n }\n &.expanded:after {\n content: \"\\f106\";\n }\n }\n\n /* Footer bottom */\n\n .footer_bottom,\n .footer__social {\n text-align: center;\n }\n .footer__copyright {\n margin-top: 0;\n margin-bottom: 15px;\n }\n}","/**\n * Affix\n */\n\n@media(max-width: @screen-sm-max) {\n .affix {\n position: static !important;\n top: auto !important;\n }\n}\n\n\n/**\n * Blackout\n */\n\n.blackout {\n position: relative;\n}\n.blackout__layer {\n position: absolute;\n top: 0; left: 0;\n width: 100%; height: 100%;\n background-color: black;\n opacity: 0;\n transition: opacity 1000ms linear;\n}\n\n\n/**\n * Background parallax\n */\n\n.bg-parallax,\n.bg-parallax__layer {\n background-repeat: no-repeat;\n background-position: center top;\n background-size: cover;\n}\n.bg-parallax {\n position: relative !important;\n overflow: hidden !important;\n background-color: transparent !important;\n}\n.bg-parallax__layer {\n position: absolute;\n top: 0; left: 0;\n width: 100%; height: 100%;\n min-height: 100vh;\n z-index: -1;\n}\n\n\n/**\n * Categories\n */\n\n.categories-list {\n list-style: none;\n padding-left: 5px;\n margin-bottom: 20px;\n\n > li {\n padding: 4px 0;\n }\n}\n\n\n/**\n * Rating\n */\n\n.rating {\n display: inline-block;\n list-style: none;\n padding-left: 0;\n margin-bottom: 20px;\n\n li {\n display: inline-block;\n margin: 0;\n padding: 0;\n font-size: 16px;\n color: #F7C41F;\n cursor: pointer;\n }\n}\n\n\n/**\n * Features list\n */\n\n.ft-list {\n list-style-type: none;\n padding-left: 0;\n\n > li {\n padding: 3px 0;\n }\n > li:before {\n content: \"\\f00c\";\n font-family: FontAwesome;\n display: inline-block;\n margin-right: 10px;\n color: @brand-sec;\n }\n}\n\n\n/* Animation delay */\n\n.delay-1 {\n .animation-delay(300ms);\n}\n.delay-2 {\n .animation-delay(600ms);\n}\n.delay-3 {\n .animation-delay(900ms);\n}\n.delay-4 {\n .animation-delay(1200ms);\n}\n.delay-5 {\n .animation-delay(1500ms);\n}\n.delay-6 {\n .animation-delay(1800ms);\n}\n.delay-7 {\n .animation-delay(2100ms);\n}\n.delay-8 {\n .animation-delay(2400ms);\n}\n\n\n/* Circle text block */\n\n.circle(@diameter) {\n height: @diameter;\n width: @diameter;\n border-radius: @diameter;\n line-height: @diameter;\n text-align: center;\n}\n.block(@size; @border-width: 0) {\n width: @size; height: @size;\n line-height: @size - @border-width*2;\n text-align: center;\n}\n\n\n/* Lists */\n\n.list-style-none {\n list-style: none;\n padding-left: 0;\n}\n\n\n/* Shadow effect */\n\n.shadow-effect {\n position: relative;\n background: white;\n\n &:before, &:after {\n z-index: -1;\n position: absolute;\n content: \"\";\n bottom: 15px;\n left: 10px;\n width: 50%;\n top: 80%;\n max-width:300px;\n background: #777;\n .box-shadow(0 15px 10px #777);\n .rotate(-3deg);\n }\n &:after {\n .rotate(3deg);\n right: 10px;\n left: auto;\n }\n}\n\n\n/* Vertically centered columns */\n\n \n@media(min-width: @screen-sm-min) {\n\n .row_v-centered {\n display: table;\n table-layout: fixed;\n width: 100%; height: 100%;\n\n [class*=\"col-\"] {\n display: table-cell;\n vertical-align: middle;\n float: none;\n height: 100%;\n }\n }\n\n}","/**\n * Forms\n */\n\n@input-border: fade(black,10%);\n@input-border-focus: fade(black,15%);\n\n.form-control,\n.form-control:focus {\n box-shadow: none;\n outline: none;\n}\n\n\n/* Has error */\n\n.has-error {\n\n .form-control {\n border-color: @brand-danger;\n box-shadow: none !important;\n\n &:focus {\n border-color: darken(@brand-danger,15%);\n }\n }\n .help-block {\n color: @brand-danger;\n }\n}\n\n\n/* Checkboxes */\n\n.checkbox {\n \n input[type=\"checkbox\"] {\n display: none;\n }\n label {\n padding-left: 0;\n \n &:before {\n content: \"\";\n display: inline-block;\n vertical-align: middle;\n margin-right: 15px;\n width: 20px; height: 20px;\n line-height: 20px;\n background-color: #eee;\n text-align: center;\n font-family: \"FontAwesome\";\n }\n }\n input[type=\"checkbox\"]:checked + label::before {\n content: \"\\f00c\";\n }\n\n}\n\n\n/* Radios */\n\n.radio {\n\n input[type=\"radio\"] {\n display: none;\n }\n label {\n padding-left: 0;\n\n &:before {\n content: \"\";\n display: inline-block;\n vertical-align: middle;\n margin-right: 15px;\n width: 20px; height: 20px;\n border-radius: 50%;\n border: 10px solid #eee;\n background-color: @text-color; \n }\n }\n input[type=\"radio\"]:checked + label:before {\n border-width: 7px;\n }\n}\n\n\n/* Quantity */\n\n.input_qty {\n margin-bottom: 10px;\n\n input[type=\"text\"] {\n display: none;\n }\n label {\n width: 100%; height: 40px;\n border: 1px solid fade(black,10%);\n line-height: 40px;\n text-align: center;\n\n > span:not(.output) {\n width: 40px; height: 40px;\n float: left;\n border-right: 1px solid fade(black,10%);\n cursor: pointer;\n -webkit-user-select: none;\n user-select: none;\n\n &:last-child {\n float: right;\n border-right: 0;\n border-left: 1px solid fade(black,10%);\n }\n &:hover {\n background-color: fade(black,2%);\n }\n }\n > output {\n display: inline-block;\n line-height: inherit;\n padding: 0;\n }\n }\n}\n.input_qty_sm {\n \n \n label {\n width: 80px; height: 20px;\n border: 0;\n line-height: 20px;\n color: #ccc;\n\n > span:not(.output) {\n width: 20px; height: 20px;\n border: 0 !important;\n\n &:hover {\n background-color: transparent;\n color: @text-color;\n }\n }\n output {\n color: #ccc;\n font-weight: 600;\n }\n }\n}","/**\n * Dropdowns styles\n */\n\n@dropdown-border: fade(black,10%);\n@dropdown-link-color: #858585;\n@dropdown-link-hover-color: @text-color;\n@dropdown-link-hover-bg: fade(black,2%);\n@dropdown-link-active-color: @text-color;\n@dropdown-link-active-bg: @dropdown-link-hover-bg;\n\n.dropdown-menu {\n padding: 0;\n box-shadow: 0px 2px 10px 0 fade(black,10%);\n .border-top-radius(0);\n}\n.navbar-nav > li > .dropdown-menu > li > a,\n.dropdown-submenu > .dropdown-menu > li > a {\n padding: 10px 15px 10px 30px !important;\n border-bottom: 1px solid fade(black,10%);\n}\n\n@media (min-width: @grid-float-breakpoint) {\n .navbar-nav > li > .dropdown-menu,\n .dropdown-submenu > .dropdown-menu {\n margin-top: 1px;\n\n &:before {\n content: \"\";\n position: absolute;\n top: -2px;\n height: 0; left: -1px; right: -1px;\n border-top: 2px solid @brand-sec; \n }\n }\n .navbar-inverse .navbar-nav > li > .dropdown-menu,\n .navbar-inverse .dropdown-submenu > .dropdown-menu {\n\n &:before {\n left: 0; right: 0;\n border-top-color: fade(@brand-sec,75%);\n } \n }\n .navbar-nav > li > .dropdown-menu > li > a,\n .dropdown-submenu > .dropdown-menu > li > a {\n padding: 8px 15px !important;\n border-bottom: 1px solid fade(black,5%);\n }\n .navbar-nav > li > .dropdown-menu > li:last-child > a,\n .dropdown-submenu > .dropdown-menu > li:last-child > a {\n border-bottom: 0;\n .border-bottom-radius(@border-radius-base);\n }\n}\n\n/*** Dropdown Sub Menu ***/\n\n.dropdown-submenu {\n position: relative;\n}\n.dropdown-submenu > .dropdown-menu {\n top: -1px;\n left: 100%;\n margin: 0;\n}\n.dropdown-submenu:hover > .dropdown-menu {\n display: block;\n}\n@media (max-width: @grid-float-breakpoint-max) {\n .dropdown-submenu > .dropdown-menu {\n display: block;\n\n > li > a {\n padding-left: 45px !important;\n font-size: (@font-size-base - 1px);\n }\n }\n}\n@media(min-width: @grid-float-breakpoint) {\n .dropdown-submenu > a:after {\n position: absolute;\n right: 10px;\n content: \"\\f105\";\n font-family: FontAwesome;\n }\n}\n.dropdown-submenu.pull-left {\n float:none !important;\n}\n.dropdown-submenu.pull-left > .dropdown-menu {\n left: -100%;\n right: 100%;\n}","/**\n * Columns with equal height\n */\n\n/* USAGE\n
\n*/\n\n/* content styles */\n\n.inside-full-height {\n /*\n // if you want to give content full height give him height: 100%;\n // with content full height you can't apply margins to the content\n // content full height does not work in ie http://stackoverflow.com/questions/27384433/ie-display-table-cell-child-ignores-height-100\n */\n height: 100%;\n margin-top: 0;\n margin-bottom: 0;\n}\n\n/* columns of same height styles */\n\n.row-height {\n display: table;\n table-layout: fixed;\n height: 100%;\n width: 100%;\n}\n.col-height {\n display: table-cell;\n float: none;\n height: 100%;\n}\n.col-top {\n vertical-align: top;\n}\n.col-middle {\n vertical-align: middle;\n}\n.col-bottom {\n vertical-align: bottom;\n}\n\n@media (min-width: 480px) {\n .row-xs-height {\n display: table;\n table-layout: fixed;\n height: 100%;\n width: 100%;\n }\n .col-xs-height {\n display: table-cell;\n float: none;\n height: 100%;\n }\n .col-xs-top {\n vertical-align: top;\n }\n .col-xs-middle {\n vertical-align: middle;\n }\n .col-xs-bottom {\n vertical-align: bottom;\n }\n}\n\n@media (min-width: 768px) {\n .row-sm-height {\n display: table;\n table-layout: fixed;\n height: 100%;\n width: 100%;\n }\n .col-sm-height {\n display: table-cell;\n float: none;\n height: 100%;\n }\n .col-sm-top {\n vertical-align: top;\n }\n .col-sm-middle {\n vertical-align: middle;\n }\n .col-sm-bottom {\n vertical-align: bottom;\n }\n}\n\n@media (min-width: 992px) {\n .row-md-height {\n display: table;\n table-layout: fixed;\n height: 100%;\n width: 100%;\n }\n .col-md-height {\n display: table-cell;\n float: none;\n height: 100%;\n }\n .col-md-top {\n vertical-align: top;\n }\n .col-md-middle {\n vertical-align: middle;\n }\n .col-md-bottom {\n vertical-align: bottom;\n }\n}\n\n@media (min-width: 1200px) {\n .row-lg-height {\n display: table;\n table-layout: fixed;\n height: 100%;\n width: 100%;\n }\n .col-lg-height {\n display: table-cell;\n float: none;\n height: 100%;\n }\n .col-lg-top {\n vertical-align: top;\n }\n .col-lg-middle {\n vertical-align: middle;\n }\n .col-lg-bottom {\n vertical-align: bottom;\n }\n}","/**\n * Headline\n */\n\n.section > .headline:first-child, .section > .headline-lg:first-child {\n margin-top: 0;\n}\n.headline {\n display: block;\n position: relative;\n margin-bottom: 30px;\n font-size: 18px;\n\n &:before {\n display: block;\n content: \"\";\n position: absolute;\n left: 0; right: 0; top: 50%;\n height: 6px;\n margin-top: -3px;\n border-width: 1px 0 1px;\n border-style: solid;\n border-color: #e9e9e9;\n }\n\n > span {\n display: inline-block;\n position: relative;\n background: white;\n padding-right: 15px;\n }\n}\n\n/* Headline: Large */\n\n.headline-lg {\n margin-bottom: 30px;\n text-align: center;\n text-transform: uppercase;\n font-size: 22px;\n\n + h4 {\n margin: -15px auto 45px;\n text-align: center;\n font-size: (@font-size-base + 1px);\n color: #757575;\n }\n}\n.headline-lg_left {\n text-align: left;\n\n + h4 {\n text-align: left;\n }\n}\n.headline-lg_right {\n text-align: right;\n\n + h4 {\n text-align: right;\n }\n}","/**\n * Info boards\n */\n\n.info-board {\n margin-bottom: 20px;\n padding: 30px;\n background: #f9f9f9;\n border-top: 2px solid fade(black,20%);\n}\n.info-board__header {\n margin-bottom: 20px;\n font-size: (@font-size-base + 2px);\n font-weight: 600;\n}\n.info-board_primary {\n border-color: @brand-primary;\n background-color: fade(@brand-primary,5%);\n}\n.info-board_secondary {\n border-color: @brand-sec;\n background-color: fade(@brand-sec,5%);\n}","/**\n * Lightbox\n */\n\n.lightboxOverlay {\n filter:;\n opacity: 1;\n background-color: fade(black,50%);\n}\n.lightbox .lb-image,\n.lb-outerContainer,\n.lb-dataContainer {\n border-radius: 0;\n}","/**\n * Navbar styles\n */\n\n@navbar-height: 75px;\n@navbar-default-bg: white;\n@navbar-default-border: fade(black,15%);\n@navbar-default-link-color: #999;\n@navbar-default-link-hover-color: @text-color;\n@navbar-default-link-active-color: @text-color;\n@navbar-default-link-active-bg: transparent;\n\n.navbar {\n border-top: 0;\n border-radius: 0;\n}\n\n@media(max-width: @grid-float-breakpoint-max) {\n .navbar-default .navbar-collapse {\n background-color: #f9f9f9;\n }\n .navbar-default .navbar-nav > li > a {\n border-bottom: 1px solid fade(black,10%);\n color: @text-color;\n }\n .nav .open > a,\n .nav .open > a:hover,\n .nav .open > a:focus {\n border-color: fade(black,10%);\n }\n}\n\n/*** Navbar Shadow ***/\n\n.navbar {\n z-index: 1030;\n}\n.navbar-container {\n position: relative;\n background-color: white;\n z-index: 1030;\n}\n.navbar-shadow:before {\n display: block;\n position: absolute;\n content: \"\";\n top: 0; left: 20%; right: 20%;\n width: 60%; height: 100%;\n border-bottom-left-radius: 50% 10px;\n border-bottom-right-radius: 50% 10px;\n box-shadow: 0 0 20px fade(black,20%);\n z-index: 1029;\n}\n\n/*** Navbar Brand ***/\n\n@navbar-default-brand-color: #555;\n@navbar-default-brand-hover-color: #555;\n\n.navbar-brand {\n font-weight: 600;\n font-size: 20px;\n\n > .fa {\n display: inline-block;\n height: 20px; width: 20px;\n border-radius: 50%;\n line-height: 20px;\n text-align: center;\n background-color: @brand-primary;\n color: white;\n font-size: 13px;\n vertical-align: top;\n }\n}\n\n/*** Navbar Links ***/\n\n.navbar-nav > li > a {\n text-transform: uppercase;\n font-size: (@font-size-base - 1px);\n}\n\n@media (min-width: @grid-float-breakpoint) {\n .navbar-default .navbar-nav > li > a:before {\n content: \"\";\n position: absolute;\n top: -2px;\n height: 0;\n left: 0;\n width: 100%;\n border-top: 2px solid @brand-primary;\n }\n .navbar-default .navbar-nav > .active > a:before,\n .navbar-default .navbar-nav > li > a:hover:before,\n .navbar-default .navbar-nav > li > a:focus:before {\n top: 0;\n }\n}\n\n/*** Navbar Toggle ***/\n\n.navbar-default .navbar-toggle {\n border: 1px solid fade(black,10%);\n border-bottom-color: fade(black,20%);\n #gradient > .vertical(transparent; fade(black,10%));\n background-color: white;\n\n > .icon-bar {\n background-color: fade(black,40%);\n box-shadow: 0 1px 1px white;\n }\n &:hover, &:focus {\n background-color: #f9f9f9;\n }\n}\n\n/*** Navbar Search ***/\n\n.navbar-search {\n position: absolute;\n top: 100%; right: 0;\n width: 250px;\n box-shadow: 0px 2px 10px 0 fade(black,15%);\n border-radius: 0 0 3px 3px;\n border: 1px solid fade(black,15%);\n border-top-color: transparent;\n display: none;\n z-index: 1000;\n \n &:before, &:after {\n content: \"\";\n display: block;\n position: absolute;\n width: 0; height: 0;\n }\n &:before {\n top: -10px; right: 10px;\n border-bottom: 10px solid fade(black,25%);\n border-left: 10px solid transparent; border-right: 10px solid transparent;\n }\n &:after {\n top: -9px; right: 10px;\n border-bottom: 10px solid #f9f9f9;\n border-left: 10px solid transparent; border-right: 10px solid transparent;\n }\n}\n.navbar-search__box,\n.navbar-search__extra {\n padding: 15px;\n}\n.navbar-search__box {\n background-color: #f9f9f9;\n border-radius: 0 0 3px 3px;\n}\n.navbar-search-box__tips {\n color: fade(black,50%);\n font-size: (@font-size-base - 2px);\n margin-top: 5px;\n margin-left: 5px;\n}\n\n/*** Navbar Shopping Cart ***/\n\n.navbar__shopping-cart-items {\n position: relative;\n display: inline-block;\n height: @line-height-computed;\n background-color: @brand-sec;\n color: white;\n text-align: center;\n border-radius: 2px;\n padding: 0 7px;\n margin-left: 7px;\n font-size: 10px;\n line-height: @line-height-computed;\n opacity: .8;\n\n &:after {\n content: \"\";\n position: absolute;\n top: 50%; left: -5px;\n margin-top: -5px;\n width: 0; height: 0;\n border-right: 5px solid @brand-sec;\n border-top: 5px solid transparent;\n border-bottom: 5px solid transparent;\n }\n}\n.navbar__shopping-cart:hover {\n\n .navbar__shopping-cart-items {\n opacity: 1;\n }\n}\n\n/*** Mega menu ***/\n\n.mega-menu__heading {\n display: block;\n padding: 10px 15px 10px 15px;\n margin: 0;\n border-bottom: 1px solid fade(black,10%);\n font-size: @font-size-base;\n}\n.mega-menu__menu {\n list-style: none;\n padding: 0;\n\n > li > a {\n display: block;\n padding: 10px 15px 10px 30px;\n border-bottom: 1px solid fade(black,10%);\n color: @navbar-default-link-color;\n text-decoration: none;\n }\n > .active > a {\n color: @text-color;\n\n &:hover {\n color: @text-color;\n }\n }\n}\n\n@media(min-width: @grid-float-breakpoint) {\n\n /* Preparation */\n\n .navbar > .container {\n position: relative;\n }\n .mega-menu.dropdown {\n position: static;\n\n [class^=\"col\"] {\n border-right: 1px solid fade(black,10%);\n\n &:last-child {\n border-right: 0;\n }\n }\n }\n .mega-menu .dropdown-menu {\n left: (@grid-gutter-width/2); right: (@grid-gutter-width/2);\n padding-left: (@grid-gutter-width/2);\n padding-right: (@grid-gutter-width/2);\n }\n\n /* Main code */\n\n .mega-menu__heading {\n margin: 0 -15px;\n padding: 15px;\n background: #f5f5f5;\n text-transform: uppercase;\n color: #666;\n }\n .mega-menu__menu {\n margin: 10px -15px;\n\n > li > a {\n padding: 8px 15px 8px 20px;\n border-bottom: none;\n color: #858585;\n\n &:hover, &:focus {\n background-color: @dropdown-link-hover-bg;\n color: @dropdown-link-hover-color;\n }\n &:before {\n content: \"\\f0da\";\n margin-right: 7px;\n font-family: FontAwesome;\n }\n }\n > .active > a {\n color: @brand-primary;\n\n &:hover, &:focus {\n background-color: white;\n color: @brand-primary;\n }\n }\n }\n}\n@media(max-width: @screen-xs-max) {\n .mega-menu .dropdown-menu .row {\n margin-right: 0;\n margin-left: 0;\n }\n}\n\n/*** Fixed Navbar ***/\n\n.body-navbar-fixed-top {\n padding-top: (@navbar-height + @navbar-margin-bottom);\n\n .navbar-container {\n position: fixed;\n top: 0; left: 0; right: 0;\n height: @navbar-height;\n }\n}\n\n\n/**\n * Navbar inverse\n */\n\n@navbar-inverse-bg: transparent;\n@navbar-inverse-border: transparent;\n@navbar-inverse-link-color: fade(white,60%);\n@navbar-inverse-link-hover-color: fade(white,90%);\n@navbar-inverse-link-active-color: fade(white,90%);\n@navbar-inverse-link-active-bg: transparent;\n@navbar-inverse-brand-color: fade(white,60%);\n@navbar-inverse-brand-hover-color: fade(white,90%);\n@navbar-inverse-toggle-hover-bg: transparent;\n@navbar-inverse-toggle-icon-bar-bg: fade(white,60%);\n@navbar-inverse-toggle-border-color: fade(white,20%);\n\n.navbar-inverse {\n margin-top: -2px;\n\n /* Brand */\n .navbar-brand {\n font-weight: 400;\n }\n\n /* Toggle */\n .navbar-toggle {\n\n &:hover, &:focus {\n border-color: fade(white,25%);\n\n > .icon-bar {\n background-color: @navbar-inverse-link-hover-color;\n }\n }\n }\n}\n@media(max-width: @screen-xs-max) {\n \n .navbar-inverse {\n\n /* Mega menu */\n .mega-menu__heading {\n color: @navbar-inverse-link-color;\n }\n .mega-menu__menu {\n list-style: none;\n padding: 0;\n\n > .active > a {\n color: @navbar-inverse-link-hover-color;\n\n &:hover {\n color: @navbar-inverse-link-hover-color;\n }\n }\n }\n\n /* Navbar form */\n .navbar-form {\n\n .form-control {\n background-color: fade(white,12%);\n }\n label {\n color: @navbar-inverse-link-color;;\n }\n }\n }\n}","/**\n * Navs\n */\n\n/* Tabs */\n\n@nav-tabs-border-color: #e9e9e9;\n\n.nav-tabs > li > a {\n border-radius: 0;\n padding: 10px 30px;\n color: @text-color;\n transition: all .05s linear;\n\n &:hover, &:focus {\n background-color: #f9f9f9;\n border-color: #eee #eee @nav-tabs-border-color;\n color: @text-color;\n }\n}\n.nav-tabs > .active > a {\n position: relative;\n border-top-color: transparent !important;\n\n &:before {\n content: \"\";\n position: absolute;\n left: -1px; right: -1px; top: -1px;\n border-top: 2px solid @brand-primary;\n }\n}\n\n/* Tabs Justified */\n\n.nav-tabs.nav-justified > li > a {\n border-radius: 0;\n\n &:hover, &:focus {\n border-bottom-color: #eee;\n }\n}\n@media(min-width: @screen-sm-min) {\n .nav-tabs.nav-justified > li > a {\n\n &:hover, &:focus {\n border-bottom-color: @nav-tabs-border-color;\n }\n }\n .nav-tabs.nav-justified > .active + li > a:hover,\n .nav-tabs.nav-justified > .active + li > a:focus {\n border-left-color: transparent;\n }\n}\n\n/* Pills */\n\n.nav-pills > li > a {\n border-radius: @border-radius-base;\n padding: 10px 30px;\n color: @text-color;\n transition: all .05s linear;\n}\n.nav-pills > li > a:hover,\n.nav-pills > li > a:focus {\n background-color: #f9f9f9;\n box-shadow: inset 0 0 1px fade(black,20%);\n color: @text-color;\n}\n.nav-pills > li.active > a,\n.nav-pills > li.active > a:hover,\n.nav-pills > li.active > a:focus {\n background-color: @brand-sec;\n}\n\n/* Tab Pane */\n\n.tab-pane {\n padding-top: 20px;\n}","/**\n * Pagination\n */\n\n@pagination-color: @text-color;\n@pagination-border: fade(black,10%);\n@pagination-hover-color: white;\n@pagination-hover-bg: @brand-primary;\n@pagination-hover-border: @pagination-border;\n@pagination-active-color: white;\n@pagination-active-border: @pagination-border;\n@pagination-disabled-color: @text-color;\n@pagination-disabled-border: @pagination-border;\n\n/* Border radius */\n\n.pagination,\n.pagination-lg,\n.pagination-sm {\n border-radius: @border-radius-base;\n\n > li:first-child > a,\n > li:first-child > span {\n border-top-left-radius: @border-radius-base;\n border-bottom-left-radius: @border-radius-base;\n }\n > li:last-child > a,\n > li:last-child > span {\n border-top-right-radius: @border-radius-base;\n border-bottom-right-radius: @border-radius-base;\n }\n}\n\n/* General */\n\n.pagination {\n background-color: #f9f9f9;\n\n > li > a, > li > span {\n background: transparent;\n border-left-width: 0;\n box-shadow: 1px 0 1px fade(white,90%);\n transition: all .05s linear;\n }\n > li > a:hover, li > span:hover,\n > li > a:focus, li > span:focus,\n > li.active > a, li.active > span {\n box-shadow: inset 0 0 10px fade(black,20%);\n }\n > li:first-child > a,\n > li:first-child > span {\n border-left-width: 1px;\n }\n > li.disabled > a, li.disabled > span {\n border-left-width: 1px;\n\n &:hover, &:focus {\n box-shadow: none;\n z-index: 1;\n }\n }\n}\n\n/* Pager */\n\n.pager > li > a,\n.pager > li > span {\n background-color: #f9f9f9;\n color: @text-color;\n transition: all .05s linear;\n\n &:hover, &:focus {\n box-shadow: inset 0 0 10px fade(black,20%);\n background-image: none;\n .reset-filter();\n color: white;\n }\n}\n.pager > li.disabled > a, .pager > li.disabled > a:hover, .pager > li.disabled > a:focus,\n.pager > li.disabled > span, .pager > li.disabled > span:hover, .pager > li.disabled > span:focus {\n background-image: none;\n .reset-filter();\n box-shadow: none;\n}","/**\n * Panels\n */\n\n@panel-inner-border: fade(black,5%);\n@panel-default-border: fade(black,10%);\n\n.panel-heading {\n text-transform: uppercase;\n border-color: @panel-inner-border;\n}\n\n#panel {\n\n .panel(@panel-color; @panel-font-color) {\n border-color: fade(black,10%);\n\n > .panel-heading {\n color: @panel-font-color;\n background-color: lighten(@panel-color, 5%);\n border: 1px solid @panel-default-border;\n border-radius: @border-radius-base @border-radius-base 0 0;\n margin: -1px -1px 0 -1px;\n }\n\n > .panel-heading + .panel-collapse .panel-body {\n border-top-color: fade(black,10%);\n }\n\n > .panel-footer + .panel-collapse .panel-body {\n border-bottom-color: fade(black,10%);\n }\n\n > .panel-footer {\n background-color: @panel-footer-bg;\n color: @text-color;\n }\n\n }\n}\n\n/* Panel Colors */\n\n.panel-primary {\n #panel > .panel(@brand-primary; white);\n}\n.panel-secondary {\n #panel > .panel(@brand-sec; white);\n}\n\n\n/* Accordion */\n\n.panel-group .panel-heading {\n position: relative;\n padding: 0;\n}\n.panel-group .panel-heading > a {\n position: relative;\n display: block;\n padding: 10px 15px;\n color: inherit;\n text-decoration: none;\n text-transform: uppercase;\n\n &:after {\n position: absolute;\n right: 10px;\n height: 20px;\n width: 20px;\n content: \"\\f107\";\n background: fade(black,15%);\n border-radius: 20px;\n border: 1px solid fade(black,5%);\n text-align: center;\n line-height: 20px;\n font-family: FontAwesome;\n color: white; \n }\n}\n.panel-group .panel-heading > .collapsed:after {\n content: \"\\f105\" !important; \n}\n\n/* Panel body */\n\n.panel-body {\n\n > ul {\n list-style-type: none;\n padding: 0;\n margin: 0;\n\n > li {\n border-bottom: 1px solid @panel-inner-border;\n\n &:last-child {\n border-bottom: 0;\n }\n\n > a {\n display: block;\n padding: 8px 0;\n font-weight: 600;\n font-size: 11px;\n color: @gray-light;\n text-transform: uppercase;\n text-decoration: none;\n\n &:hover {\n color: @text-color;\n }\n }\n\n }\n }\n}","/**\n * Popovers\n */\n\n@popover-border-color: fade(black,10%);\n@popover-title-bg: white;\n@popover-arrow-width: 7px;\n@popover-arrow-outer-color: fade(black,20%);\n\n.popover {\n border-radius: @border-radius-base;\n padding: 12px;\n box-shadow: 0 5px 10px 0 fade(black,15%);\n}\n.popover-title,\n.popover-content {\n padding: 6px;\n}\n.popover-title {\n border-bottom: 0;\n border-radius: 2px 2px 0 0;\n font-size: (@font-size-base + 1px);\n font-weight: 600;\n color: @brand-primary;\n}\n.popover-content {\n color: #555;\n font-size: (@font-size-base - 1px);\n}","/**\n * Progress\n */\n\n/* General */\n\n.progress {\n background: #f5f5f5;\n box-shadow: inset 0 0 1px fade(black,10%);\n border-radius: 0px;\n height: 10px;\n}\n.progress-bar {\n line-height: 10px;\n}\n.progress-caption,\n.progress-value {\n font-size: (@font-size-base + 1px);\n padding-bottom: 12px;\n}\n.progress-value {\n text-align: right;\n font-weight: 600;\n}\n\n/* Progress bar (small) */\n\n.progress-sm {\n height: 3px;\n\n > .progress-bar {\n line-height: 3px;\n }\n}\n\n/* Progress bar (secondary) */\n\n.progress-secondary {\n\n > .progress-bar {\n background-color: @brand-sec;\n }\n}","/**\n * Scaffolding\n */\n\n@body-bg: white;\n@link-color: @brand-sec;\n@link-hover-color: @brand-sec;\n\n.text-primary {\n color: @brand-primary !important;\n}\n.text-secondary {\n color: @brand-sec !important;\n}","/**\n * Scrolltopcontrol\n */\n\n.backtotop {\n background: fade(black,20%);\n padding: 10px 15px;\n font-size: 18px;\n color: #FFF;\n border-radius: @border-radius-base;\n box-shadow: inset 0 0 1px fade(black,20%);\n text-shadow: 1px 1px fade(black,20%);\n transition: background .1s;\n\n &:hover {\n background: fade(black,40%);\n }\n}","/**\n * Social links\n */\n \n.social {\n margin-bottom: 15px;\n}\n.social > ul,\n.social > ul > li {\n margin: 0 0 10px;\n padding: 0;\n}\n.social li > a {\n display: inline-block;\n background: #f5f5f5;\n border: 1px solid fade(black,10%);\n color: @text-color;\n .circle(34px);\n transition: all .1s linear;\n\n &.rss:hover {\n background: @rss-color;\n }\n &.facebook:hover {\n background: @facebook-color;\n }\n &.twitter:hover {\n background: @twitter-color;\n }\n &.plus:hover {\n background: @google-plus-color;\n }\n &.vk:hover {\n background: @vk-color;\n }\n &.pinterest:hover {\n background: @pinterest-color;\n }\n &.vimeo:hover {\n background: @vimeo-color;\n }\n &.github:hover {\n background: @github-color;\n }\n &.linkedin:hover {\n background: @linkedin-color;\n }\n &.dropbox:hover {\n background: @dropbox-color;\n }\n &.youtube:hover {\n background: @youtube-color;\n }\n}\n.social li:hover > a {\n color: #fff;\n border-color: transparent;\n}\n\n/*** Social Large ***/\n\n.social-lg li > a {\n .circle(45px);\n}\n\n/*** Social Small ***/\n\n.social-sm li > a {\n .circle(30px);\n}","/**\n * Tables\n */\n\n/* General */\n\n@table-border-color: #e6e6e6;\n\n.table > thead > tr > th {\n border-bottom-width: 1px;\n}\n.table > thead > tr > th > span {\n position: relative;\n\n &:after {\n content: \"\";\n position: absolute;\n left: 0; right: 0; bottom: (-(@table-cell-padding + 1px));\n border-top: 2px solid @brand-primary;\n }\n}\n.table-condensed > thead > tr > th > span {\n\n &:after {\n bottom: (-(@table-condensed-cell-padding + 2px));\n }\n}\n\n/* Custom tables */\n\n.table > thead > tr > td.yellow,\n.table > tbody > tr > td.yellow,\n.table > tfoot > tr > td.yellow,\n.table > thead > tr > th.yellow,\n.table > tbody > tr > th.yellow,\n.table > tfoot > tr > th.yellow,\n.table > thead > tr.yellow > td,\n.table > tbody > tr.yellow > td,\n.table > tfoot > tr.yellow > td,\n.table > thead > tr.yellow > th,\n.table > tbody > tr.yellow > th,\n.table > tfoot > tr.yellow > th {\n background-color: lighten(yellow, 10%);\n}\n.table-hover > tbody > tr > td.yellow:hover,\n.table-hover > tbody > tr > th.yellow:hover,\n.table-hover > tbody > tr.yellow:hover > td,\n.table-hover > tbody > tr.yellow:hover > th {\n background-color: yellow;\n}","/**\n * Tooltips\n */\n\n@tooltip-bg: darken(black, 80%);\n@tooltip-arrow-color: @tooltip-bg;\n\n.tooltip-inner {\n padding: 7px;\n border-radius: 2px;\n}","/**\n * Wells\n */\n\n.well {\n box-shadow: none;\n background-color: #f5f5f5;\n border-color: fade(black,5%);\n}","/**\n * Home App Landing\n */\n\n.home-app__container {\n font-size: (@font-size-base + 1px);\n font-weight: 300;\n line-height: 1.7;\n \n /* General styles */\n\n > .section {\n margin-bottom: 0;\n\n .section__inner {\n padding-top: 60px;\n padding-bottom: 60px;\n }\n\n /* Sections by Styles */\n\n &.section_inverse {\n position: relative;\n background-color: @brand-gray;\n\n &:before {\n content: \"\";\n position: absolute;\n top: 3%; right: 3%; bottom: 3%; left: 3%;\n background: url(../img/world-map.png) no-repeat center center / cover;\n opacity: .4;\n }\n }\n\n &.section_wood {\n position: relative;\n background: black url(\"../img/dark_wood.png\");\n\n &:before {\n content: \"\";\n position: absolute;\n top: 0; right: 0; bottom: 0; left: 0;\n #gradient > .radial(fade(white,10%); transparent);\n }\n }\n\n &.section_download {\n position: relative;\n background-image: url(../img/home_8.jpg);\n\n &::before {\n content: \"\";\n position: absolute;\n top: 0; left: 0; \n width: 100%; height: 100%;\n background-color: fade(black,60%);\n } \n }\n }\n\n /* First slide (home) */\n\n > .section:first-child {\n position: relative;\n background-image: url(../img/home_8.jpg);\n margin-top: -@line-height-computed;\n\n &::before {\n content: \"\";\n position: absolute;\n top: 0; left: 0; \n width: 100%; height: 100%;\n background-color: fade(black,60%);\n }\n .home-app__heading {\n font-size: 48px;\n\n &:before {\n display: none;\n }\n }\n }\n}\n@media(min-width: @screen-sm-min) {\n \n /* Sections by Layout */\n\n .section_centered {\n\n .row {\n display: table;\n table-layout: fixed;\n width: 100%; height: 100%;\n\n [class*=\"col-\"] {\n display: table-cell;\n vertical-align: middle;\n float: none;\n height: 100%;\n }\n }\n }\n .section > .section__inner {\n padding: 110px 0 !important;\n }\n}\n\n/* Home App: Typography */\n\n.home-app__heading {\n position: relative;\n margin: 0 0 40px;\n font-family: 'Questrial', sans-serif;\n font-size: 42px;\n font-weight: 300;\n\n &:before {\n content: \"\";\n position: absolute;\n width: 30px; height: 2px;\n background-color: @brand-primary;\n bottom: -20px;\n left: 0;\n }\n &.text-center:before {\n left: 50%;\n margin-left: -15px;\n }\n &.inverse {\n text-shadow: 1px 1px 1px fade(black,20%);\n color: fade(white,90%);\n }\n}\n.home-app__subheading {\n margin: 0 0 40px;\n font-size: (@font-size-base + 2px);\n\n &.inverse {\n color: fade(white,60%);\n }\n}\n@media(min-width: @screen-sm-min) {\n .home-app__button {\n\n > .btn {\n padding: 15px 25px;\n }\n }\n}\n@media(max-width: @screen-xs-max) {\n .home-app__heading {\n font-size: 32px !important;\n text-align: center;\n\n &:before {\n left: 50%;\n margin-left: -15px;\n }\n }\n .home-app__subheading {\n font-size: (@font-size-base + 1px) !important;\n text-align: center;\n }\n .home-app__button {\n text-align: center;\n }\n}\n\n/* Home App: Images */\n\n.home-app__img {\n \n > img {\n max-width: 250px;\n margin: 0 auto;\n }\n}\n.home-app__img_center {\n max-width: 250px;\n margin: 0 auto;\n}\n.home-app__img_lg {\n\n > img {\n max-width: 350px;\n }\n}\n\n/* Home App: Features */\n\n.home-app__features {\n margin: 20px 0;\n}\n.home-app__feature {\n margin-bottom: 40px;\n text-align: left;\n}\n.home-app-feature__icon {\n float: left;\n margin-left: auto;\n margin-right: 20px;\n height: 50px; width: 50px;\n line-height: 50px;\n text-align: center;\n border: 1px solid fade(black,10%);\n border-radius: 50%;\n font-size: 15px;\n color: #757575;\n}\n.home-app-feature__body {\n overflow: hidden;\n}\n.home-app-feature__title {\n font-family: 'Questrial', sans-serif;\n margin: 0 0 10px 0;\n font-size: 20px;\n color: #000;\n}\n@media(min-width: @screen-sm-min) {\n .home-app__feature_left {\n text-align: right;\n\n .home-app-feature__icon {\n float: right;\n margin-left: 20px;\n margin-right: auto;\n }\n }\n}\n\n/* Home App: Describe */\n\n.home-app__features-list {\n padding-left: 0;\n list-style: none;\n color: fade(white,60%);\n\n > li {\n margin-bottom: 15px;\n\n > .fa {\n font-size: 15px;\n color: @brand-primary;\n margin-right: 10px;\n }\n }\n}\n@media(min-width: @screen-sm-min) {\n .home-app__features-list {\n > li > .fa {\n margin-right: 20px;\n }\n }\n}\n\n/* Home App: Video */\n\n.home-app__video {\n box-shadow: 0 10px 50px fade(black,50%);\n}\n\n/* Home App: Reviews */\n\n.home-app__review {\n margin-bottom: 40px;\n}\n.home-app-review__avatar {\n width: 100px; height: 100px;\n border-radius: 50%;\n margin: 0 auto 20px;\n overflow: hidden;\n}\n.home-app-review__content {\n margin-bottom: 20px;\n}\n.home-app-review__body {\n text-align: center;\n}\n.home-app-review__author {\n\n > span {\n font-family: 'Questrial', sans-serif;\n font-size: 22px;\n color: #333;\n }\n}\n@media(min-width: @screen-sm-min) {\n .home-app__review {\n display: table;\n }\n .home-app-review__avatar {\n display: table-cell;\n vertical-align: middle;\n float: left;\n margin: 0 50px 0 0;\n width: 200px; height: 200px;\n }\n .home-app-review__body {\n display: table-cell;\n vertical-align: middle;\n overflow: hidden;\n text-align: left;\n }\n}\n\n/* Home App: Pricing */\n\n.home-app__pricing {\n\n .row > div[class*=\"col-\"] {\n padding-left: 0;\n padding-right: 0;\n }\n}\n.home-app-pricing__item {\n padding: 40px;\n margin-left: -1px;\n margin-top: -1px;\n border: 1px solid #ddd;\n text-align: center;\n transition: all .1s linear;\n\n &:hover {\n box-shadow: 0 15px 50px fade(black,30%);\n }\n}\n.home-app-pricing__title {\n font-family: 'Questrial', sans-serif;\n font-size: 22px;\n font-weight: 400;\n}\n.home-app-pricing__price {\n margin: 20px 0;\n font-size: 48px;\n color: @brand-primary;\n\n > span {\n font-size: (@font-size-base + 2px);\n\n &:first-child {\n vertical-align: 100%;\n }\n }\n}\n.home-app-pricing__content {\n margin-bottom: 10px;\n font-weight: 400;\n}\n\n/* Home App: Navigation */\n\n#fp-nav {\n\n > ul > li > a > span,\n > ul > li > a > span:hover,\n > ul > li > a > span:focus {\n width: 12px; height: 12px;\n margin: -6px 0 0 -6px;\n padding: 2px;\n background-clip: content-box !important;\n background: transparent;\n border: 1px solid #ccc;\n }\n > ul > li > .active > span,\n > ul > li > .active > span:hover,\n > ul > li > .active > span:focus {\n background-color: #ccc;\n }\n}\n\n/* Animation */\n\n[data-animation]:not(.animated) {\n visibility: hidden;\n}","/**\n * Index: version 3\n */\n\n/* General */\n\n.index-3__section {\n padding: 60px 0;\n}\n.index-3__section_inverse {\n background-color: fade(@brand-gray,2%);\n}\n\n\n/* Jumbotron */\n\n.index-3__jumbotron {\n position: relative;\n display: table;\n table-layout: fixed;\n width: 100%; height: 600px;\n margin-top: -@line-height-computed;\n background: @brand-gray url(../img/home_10.jpg) no-repeat center center / cover;\n text-align: center;\n\n &:before {\n content: \"\";\n position: absolute;\n top: 0; left: 0;\n width: 100%; height: 100%;\n background-color: fade(@brand-gray,90%);\n }\n}\n.index-3-jumbotron__inner {\n display: table-cell;\n width: 100%;\n vertical-align: middle;\n}\n.index-3-jumbotron__heading {\n font-family: 'Questrial', sans-serif;\n font-size: 40px;\n color: white;\n margin-bottom: 30px;\n text-shadow: 1px 1px 1px fade(black,50%);\n}\n.index-3-jumbotron__subheading {\n font-size: (@font-size-base + 1px);\n color: fade(white,50%);\n margin-bottom: 60px;\n text-shadow: 1px 1px 1px fade(black,10%);\n}\n.index-3-jumbotron__btn {\n\n .btn-link {\n color: fade(white,50%);\n\n &:hover, &:focus {\n color: #fff;\n }\n }\n}\n@media(min-width: @screen-md-min) {\n .index-3__jumbotron {\n text-align: left;\n }\n}\n\n\n/* Headings */\n\n.index-3__heading {\n font-family: 'Questrial', sans-serif;\n font-size: 32px;\n font-weight: 400;\n margin-bottom: 60px;\n}\n.index-3__subheading {\n font-size: (@font-size-base + 1px);\n color: @text-muted;\n margin-top: -50px;\n margin-bottom: 60px;\n}\n\n\n/* Features */\n\n.index-3-features__item {\n margin-bottom: 20px;\n}\n.index-3-features__img,\n.index-3-features__heading,\n.index-3-features__subheading {\n max-width: 440px;\n margin-left: auto;\n margin-right: auto;\n}\n.index-3-features__icon {\n font-size: 24px;\n}\n.index-3-features__img {\n margin-bottom: 20px;\n border-radius: @border-radius-base;\n overflow: hidden;\n}\n.index-3-features__heading {\n font-family: 'Questrial', sans-serif;\n margin-bottom: 20px;\n line-height: 1.3;\n}\n.index-3-features__subheading {\n color: @text-muted;\n line-height: 1.7;\n margin-bottom: 10px;\n}\n\n\n/* Features 2 */\n\n.index-3-features-2__item {\n margin-bottom: 30px;\n}\n.index-3-features-2__icon {\n @size: 40px;\n width: @size; height: @size;\n line-height: @size;\n text-align: center;\n border-radius: 3px;\n color: white;\n background-color: @brand-gray;\n display: inline-block;\n margin-right: 10px;\n margin-bottom: 15px;\n}\n.index-3-features-2__heading {\n display: inline-block;\n font-family: 'Questrial', sans-serif;\n font-size: 20px;\n line-height: 40px;\n}\n.index-3-features-2__content {\n color: @text-muted;\n}\n\n\n/* Subscribe */\n\n.index-3__sign-up {\n \n .form-control {\n height: 44px;\n padding-top: 12px;\n padding-bottom: 12px;\n }\n [type=\"submit\"] {\n padding-top: 12px;\n padding-bottom: 12px;\n }\n}\n\n@media(min-width: @screen-sm-min) {\n \n .index-3__sign-up {\n\n .row > [class*=\"col-\"] {\n padding-left: 5px;\n padding-right: 5px;\n }\n }\n}","/**\n * Shop\n */\n\n/** Shop: Index **/\n\n/* General */\n\n.shop-index__section {\n position: relative;\n margin-bottom: 60px;\n\n &.alt {\n background-color: #f5f5f5;\n padding-top: 60px;\n padding-bottom: 60px;\n border-width: 1px 0 1px 0;\n border-style: solid;\n border-color: fade(black,5%);\n }\n}\n.shop-index__heading {\n margin-top: 0;\n margin-bottom: 60px;\n font-family: 'Questrial', sans-serif;\n\n + p {\n margin-top: -50px;\n margin-bottom: 60px;\n color: @text-muted;\n }\n}\n\n/* Shop: Slideshow */\n\n.shop__slideshow {\n margin-top: -@line-height-computed;\n margin-bottom: 60px;\n\n .carousel-inner {\n\n .item__container {\n display: table;\n width: 100%; height: 100%;\n }\n .item-container__inner {\n display: table-cell;\n vertical-align: middle;\n }\n .item {\n width: 100%; height: 600px;\n }\n .item_1 {\n background: url(../img/home_11.jpg) no-repeat center center / cover;\n }\n .item_2 {\n background: url(../img/home_12.jpg) no-repeat center center / cover;\n }\n .item_3 {\n background: url(../img/home_14.jpg) no-repeat center center / cover;\n }\n }\n}\n.shop-slideshow__heading {\n margin: 0 0 20px 0;\n font-family: 'Questrial', sans-serif;\n font-size: 46px;\n line-height: 1.2;\n color: white;\n}\n.shop-slideshow__subheading {\n margin-bottom: 30px;\n font-family: 'Questrial', sans-serif;\n font-size: 20px;\n line-height: 1.5;\n color: white;\n}\n.shop-slideshow__btn {\n border: 2px solid white;\n border-radius: 0;\n color: white;\n font-weight: 600;\n\n &:hover, &:focus {\n color: @text-color;\n background-color: white;\n }\n}\n@media(max-width: @screen-xs-max) {\n .shop__slideshow {\n\n .carousel-inner {\n\n .item {\n height: 400px;\n padding: 0 30px;\n text-align: center;\n }\n }\n }\n .shop-slideshow__heading {\n font-size: 32px;\n }\n .shop-slideshow__subheading {\n font-size: 16px;\n }\n}\n\n/* Carousel controls */\n\n.shop-slideshow__control {\n display: block;\n position: absolute;\n top: 50%; left: 10px;\n width: 30px; height: 70px;\n opacity: 0;\n transform: translateY(-50%);\n transition: opacity .3s;\n\n &:hover {\n opacity: 1 !important;\n }\n}\n.shop-slideshow__control[data-slide=\"next\"] {\n left: auto; right: 10px;\n}\n.shop__slideshow:hover .shop-slideshow__control {\n opacity: .3;\n}\n\n\n/* Features */\n\n.shop-index-features__item {\n margin-bottom: 40px;\n text-align: center;\n}\n.shop-index-features__icon {\n margin-bottom: 20px;\n width: 90px; height: 100px;\n background: url(../img/hexagon.svg) no-repeat center center / cover;\n .center-block();\n line-height: 100px;\n text-align: center;\n font-size: 24px;\n}\n.shop-index-features__heading {\n margin-bottom: 15px;\n\n + p {\n color: @text-muted;\n }\n}\n\n/* Blog post */\n\n.shop-index-blog__posts > [class*=\"col-\"] {\n padding-top: 20px;\n padding-bottom: 20px;\n border-right: 1px solid fade(black,5%);\n\n &:last-child {\n border-right: 0;\n }\n}\n.shop-index-blog__post {\n width: 80%;\n .center-block();\n}\n.shop-index-blog__img {\n position: relative;\n float: left;\n margin-right: 30px;\n margin-bottom: 20px;\n width: 90px; height: 100px;\n overflow: hidden;\n\n &:before {\n content: \"\";\n position: absolute;\n top: 0; right: 0; bottom: 0; left: 0;\n background: url(../img/hexagon_reversed.svg) no-repeat top left / 100% 100%;\n }\n > img {\n height: 100%; width: auto;\n }\n}\n.shop-index-blog__body {\n overflow: hidden;\n}\n.shop-index-blog__heading {\n position: relative;\n margin-top: 0;\n margin-bottom: 30px;\n line-height: 1.5;\n\n &:after {\n content: \"\";\n position: absolute;\n bottom: -15px; left: 0;\n width: 30px; height: 2px;\n background-color: fade(black,10%);\n }\n}\n.shop-index-blog__content {\n margin-bottom: 20px;\n color: @text-muted;\n}\n@media(max-width: @screen-sm-max) {\n\n .shop-index-blog__img {\n float: none;\n margin-right: 0;\n .center-block();\n }\n .shop-index-blog__heading {\n text-align: center;\n\n &:after {\n left: 50%;\n margin-left: -15px;\n }\n }\n}\n@media(max-width: @screen-xs-max) {\n .shop-index-blog__posts > [class*=\"col-\"] {\n padding-top: 0;\n padding-bottom: 60px;\n border-right: 0;\n\n &:last-child {\n padding-bottom: 0;\n }\n }\n .shop-index-blog__post {\n width: 100%;\n }\n}\n\n\n/* Newsletter */\n\n.shop-index__newsletter {\n padding-bottom: 20px;\n\n .shop-index__heading {\n margin-bottom: 20px;\n line-height: 42px;\n text-align: center;\n }\n input[type=\"email\"] {\n height: 42px;\n padding: 11px 12px;\n }\n button[type=\"submit\"] {\n padding: 11px 30px;\n width: 100%;\n }\n}\n@media(min-width: @screen-sm-min) {\n\n .shop-index__newsletter {\n\n .shop-index__heading {\n margin-bottom: 0px;\n text-align: right;\n }\n input[type=\"email\"] {\n border-radius: 21px 0 0 21px;\n }\n button[type=\"submit\"] {\n margin-left: -3px;\n border-radius: 0 21px 21px 0;\n width: auto;\n }\n }\n}\n\n\n/** Shop: Thumbnails **/\n\n.shop__thumb {\n border: 1px solid fade(black,5%);\n padding: 20px;\n margin-bottom: 20px;\n background-color: white;\n text-align: center;\n transition: border-color .1s, box-shadow .1s;\n\n &:hover {\n border-color: fade(black,7%);\n box-shadow: 0 5px 30px fade(black,7%);\n }\n > a {\n color: @text-color;\n\n &:hover {\n text-decoration: none;\n }\n }\n}\n.shop-thumb__img {\n position: relative;\n margin-bottom: 20px;\n overflow: hidden;\n}\n.shop-thumb__title {\n font-weight: 600;\n}\n.shop-thumb__price {\n color: @gray-light;\n}\n.shop-thumb-price_old {\n text-decoration: line-through;\n}\n.shop-thumb-price_new {\n color: red;\n}\n\n\n/** Shop: Item **/\n\n.shop-item__info {\n padding: 30px;\n margin-bottom: 40px;\n background-color: white;\n border: 1px solid fade(black,5%);\n}\n.shop-item-cart__title {\n margin-bottom: 20px;\n line-height: 1.3;\n}\n.shop-item-cart__price {\n font-size: 28px;\n font-weight: 400;\n color: #F7C41F;\n}\n.shop-item__intro {\n color: @gray-light;\n border-bottom: 1px solid fade(black,5%);\n padding-bottom: 10px;\n margin-bottom: 20px;\n}\n.shop-item__add {\n\n button[type=\"submit\"] {\n padding: 15px 20px;\n }\n}\n.shop-item__img {\n margin-bottom: 40px;\n}\n.shop-item-img__main {\n width: ~\"calc(100% - 110px)\"; height: auto;\n float: left;\n}\n.shop-item-img__aside {\n width: 100px; height: auto;\n float: left;\n\n > img {\n cursor: pointer;\n margin-bottom: 10px;\n border: 1px solid fade(black,10%);\n opacity: .5;\n\n &:hover, &.active {\n border-color: fade(black,5%);\n opacity: 1;\n }\n }\n}\n@media(max-width: @screen-xs-max) {\n .shop-item-img__main {\n width: ~\"calc(100% - 60px)\";\n }\n .shop-item-img__aside {\n width: 50px;\n }\n}\n\n\n/** Shop: Filter **/\n\n.shop__filter {\n margin-bottom: 40px;\n}\n\n/* Shop filter: Pricing */\n\n.shop-filter__price {\n padding: (@grid-gutter-width/2);\n\n [class*='col-'] {\n padding: 2px;\n }\n}\n\n/* Shop filter: Colors */\n\n.shop-filter__color {\n display: inline-block;\n margin: 0 2px 2px 0;\n\n input[type=\"text\"] {\n display: none;\n }\n label {\n width: 30px; height: 30px;\n background: transparent;\n border: 1px solid fade(black,10%);\n border-radius: 3px;\n cursor: pointer;\n }\n}\n\n\n/** Shop: Sorting **/\n\n.shop__sorting {\n list-style: none;\n padding-left: 0;\n margin-bottom: 40px;\n margin-top: -20px;\n border-bottom: 1px solid fade(black,10%);\n text-align: right;\n\n > li {\n display: inline-block;\n\n > a {\n display: block;\n padding: 20px 10px;\n margin-bottom: -1px;\n border-bottom: 2px solid transparent;\n color: #757575;\n transition: all .05s linear;\n\n &:hover, &:focus {\n color: @text-color;\n text-decoration: none;\n }\n }\n\n &.active > a {\n color: @brand-primary;\n border-bottom-color: @brand-primary;\n }\n }\n}\n@media(max-width: @screen-xs-max) {\n .shop__sorting {\n text-align: left;\n border-bottom: 0;\n\n > li {\n display: block;\n\n > a {\n padding: 10px 15px;\n margin-bottom: 10px;\n border-bottom: 1px solid fade(black,10%);\n }\n &.active > a {\n font-weight: 600;\n }\n }\n }\n}\n\n\n/** Shop: Checkout **/\n\n.checkout__block {\n margin-bottom: 40px;\n}\n.checkout-cart__item {\n margin-bottom: 15px;\n}\n.checkout-cart-item__img {\n max-width: 80px;\n margin-right: 10px;\n float: left;\n}\n.checkout-cart-item__content {\n overflow: hidden;\n}\n.checkout-cart-item__heading {\n margin-top: 0;\n}\n.checkout-cart-item__footer {\n padding: 10px 0;\n margin-top: 10px;\n border-top: 1px solid #eee;\n}\n.checkout-cart-item__price {\n font-weight: 600;\n}\n.checkout-total__block {\n margin-bottom: 40px;\n border-top: 1px solid #e9e9e9;\n border-bottom: 1px solid #e9e9e9;\n\n > .row > [class*=\"col-\"] {\n padding: 40px 40px;\n border-right: 1px solid #e9e9e9;\n color: #aaa;\n\n &:last-child {\n border-right: 0;\n color: @text-color;\n }\n }\n}\n@media(max-width: @screen-xs-max) {\n .checkout-total__block {\n border: 0;\n\n > .row > [class*=\"col-\"] {\n padding: 15px 20px;\n border: 0;\n border-top: 1px solid #e9e9e9;\n\n &:last-child {\n border-bottom: 1px solid #e9e9e9;\n }\n }\n }\n}\n.checkout-total__heading {\n float: left;\n}\n.checkout-total__price {\n float: right;\n margin: 9px 0;\n font-size: 17px;\n}\n.checkout__submit {\n padding: 15px 40px;\n}\n\n\n/** Shop: Order Confirmation */\n\n.shop-conf__heading {\n margin-bottom: 40px;\n\n + p {\n margin-bottom: 100px;\n }\n}","/*------------------------------------------------------------------\nProject: Paperclip\nAuthor: Simpleqode.com\nURL: http://simpleqode.com/\n https://twitter.com/YevSim\n https://www.facebook.com/simpleqode\nVersion: 1.3.2\nCreated: 11/03/2014\nLast change: 16/11/2015\n-------------------------------------------------------------------*/\n\n/**\n * Import LESS files\n */\n\n// @import \"./../bootstrap/less/bootstrap.less\";\n\n/* UI Elements */\n\n@import \"buttons.less\";\n@import \"carousel.less\";\n@import \"colors.less\";\n@import \"comments.less\";\n@import \"components.less\";\n@import \"container-sizes.less\";\n@import \"footer.less\";\n@import \"forms.less\";\n@import \"dropdowns.less\";\n@import \"equal-height-cols.less\";\n@import \"headline.less\";\n@import \"info-boards.less\";\n@import \"lightbox.less\";\n@import \"misc.less\";\n@import \"navbar.less\";\n@import \"navs.less\";\n@import \"pagination.less\";\n@import \"panels.less\";\n@import \"popovers.less\";\n@import \"progress.less\";\n@import \"scaffolding.less\";\n@import \"scrolltopcontrol.less\";\n@import \"social-links.less\";\n@import \"tables.less\";\n@import \"tooltips.less\";\n@import \"typography.less\";\n@import \"wells.less\";\n\n/* Theme */\n\n@import \"theme/index_app-landing.less\";\n@import \"theme/index_version-3.less\";\n@import \"theme/shop.less\";\n\n\n/**\n * General\n */\n\nhtml {\n position: relative;\n min-height: 100%;\n}\n.section {\n margin-bottom: 40px;\n}\n\n\n/**\n * Topic header\n */\n\n.topic {\n position: relative;\n margin-top: -@navbar-margin-bottom;\n margin-bottom: 40px;\n border-bottom: 1px solid fade(black,5%);\n background: #f5f5f5;\n\n h3 {\n display: inline-block;\n margin: 0;\n padding: 23px 0;\n font-size: 16px;\n }\n .breadcrumb {\n margin-bottom: 0;\n padding: 21px 0;\n background: transparent;\n }\n}\n\n\n/**\n * About Us: Default\n */\n\n.team-photo {\n position: relative;\n height: 500px; width: 100%;\n margin-top: -30px;\n padding-top: 10px;\n background-image: url(../img/our-team.jpg);\n\n > .container, > .container > .row {\n height: 100%;\n }\n}\n.team-photo__caption {\n \n > h1 {\n font-weight: 300;\n margin: 0 0 30px;\n }\n}\n.team-about {\n padding: 50px 0;\n margin-bottom: 40px;\n background: #f5f5f5;\n font-size: 16px;\n line-height: 1.4;\n text-align: center;\n color: #777;\n}\n\n\n/**\n * About Us: Option 1\n */\n\n.team-member {\n margin-bottom: 10px;\n}\n.team-member {\n > img {\n margin-bottom: 5px;\n border-radius: 4px 4px 0 0;\n }\n > .info {\n padding: 5px;\n background: #f0f0f0;\n border-radius: 0 0 5px 5px;\n transiton: background .3s linear;\n }\n &:hover > .info {\n background: #f5f5f5;\n }\n > .info > p {\n margin-bottom: 0;\n }\n}\n\n\n/**\n * Blog\n */\n\n.blog-post__avatar {\n display: none;\n}\n@media (min-width: @screen-sm-min) {\n .blog-post__avatar {\n display: block;\n width: 80px; height: 80px;\n margin-right: 20px;\n float: left;\n border: 5px solid fade(black,10%);\n border-radius: 50%;\n overflow: hidden;\n }\n}\n.blog-post__body {\n position: relative;\n overflow: hidden;\n padding-bottom: 40px;\n\n &:after {\n content: \"\";\n position: absolute;\n bottom: 20px; left: 0;\n height: 1px; width: 100%;\n #gradient > .horizontal-three-colors(white; #ddd; 50%; white);\n }\n &.no-hr {\n\n &:after {\n display: none;\n }\n }\n}\n.blog-post__title {\n font-weight: 500;\n font-size: 20px;\n line-height: 1.5;\n margin-top: 0;\n}\n.blog-post__info {\n margin-bottom: 20px;\n color: @gray-light;\n}\n.blog-post__content {\n margin-bottom: 20px;\n line-height: 1.7;\n}\n.blog-post__read-more {\n margin-bottom: 20px;\n}\n.blog-post__img {\n border-radius: @border-radius-base;\n margin-bottom: 20px;\n}\n\n/* Blog Tags */\n\n.blog-tags > a {\n padding: 3px 6px;\n margin: 4px 4px 4px 0;\n background: #eee;\n border: 1px solid fade(black,5%);\n border-width: 0 1px 1px 0;\n border-radius: @border-radius-base;\n color: #515151;\n text-decoration: none;\n font-size: @font-size-small;\n white-space: nowrap;\n display: inline-block;\n\n &:hover {\n background: @brand-sec;\n color: #FFF;\n border-color: transparent;\n\n &:before {\n color: #FFF;\n }\n }\n &:before {\n font-family: FontAwesome;\n content: \"\\f02b\";\n color: #999;\n margin-right: 5px;\n }\n}\n\n\n/**\n * Coming soon\n */\n\n.coming-soon {\n height: 100vh;\n background-color: #555;\n text-align: center;\n}\n.coming-soon__table {\n display: table;\n height: 100%;\n width: 100%;\n}\n.coming-soon-table__inner {\n display: table-cell;\n vertical-align: middle;\n}\n.coming-soon__heading {\n color: white;\n font-weight: 700;\n font-size: 36px;\n text-transform: uppercase;\n text-shadow: 0 0 1px fade(black,30%);\n margin-top: 0;\n margin-bottom: 30px;\n}\n.coming-soon__intro {\n color: white;\n font-weight: 300;\n font-size: (@font-size-base + 1px);\n text-shadow: 0 0 1px fade(black,30%);\n line-height: 1.7;\n margin-bottom: 40px;\n}\n.coming-soon__form {\n display: block;\n margin-bottom: 40px;\n\n .form-control {\n height: 45px;\n width: 100%;\n padding: 12px 24px;\n border-radius: 45px;\n font-size: @font-size-base;\n }\n button[type=\"submit\"] {\n height: 45px;\n border-radius: 45px;\n width: 100%;\n }\n}\n\n/* Countdown */\n\n.countdown-row {\n display: block;\n}\n.countdown-section {\n display: inline-block;\n width: 40px; height: 40px; line-height: 40px;\n font-size: 18px;\n margin: 0 10px;\n font-weight: 300;\n color: white;\n}\n.countdown-period {\n display: block;\n margin-top: 10px;\n font-size: @font-size-base;\n line-height: @line-height-computed;\n}\n\n@media(min-width: @screen-sm-min) {\n .coming-soon__heading {\n font-size: 52px;\n }\n .coming-soon__intro {\n font-size: (@font-size-base + 3px);\n }\n .coming-soon__form {\n display: inline-block;\n border: 20px solid fade(white,10%);\n border-radius: 100px;\n box-shadow: 0 0 1px fade(black,30%);\n\n .form-control {\n width: 300px;\n border-radius: 45px 0 0 45px;\n }\n button[type=\"submit\"] {\n border-radius: 0 45px 45px 0;\n margin-left: -4px;\n width: auto;\n }\n }\n .countdown-section {\n width: 70px; height: 70px; line-height: 70px;\n font-size: 24px;\n margin: 0 5px;\n }\n}\n\n\n/**\n * Contact us: Option 1\n */\n\n.contact-us__google-map_big {\n width: 100%;\n height: 400px;\n margin: -40px auto 40px;\n border-bottom: 1px solid fade(black,10%);\n background: #f9f9f9;\n}\n.contact-us__intro {\n margin-bottom: 20px;\n}\n\n/* Contact form */\n\n#form_message {\n display: none;\n position: fixed;\n top: 0; left: 0; right: 0;\n border-radius: 0;\n text-align: center;\n z-index: 999999;\n}\n#form_sendemail .help-block {\n display: none;\n}\n\n/* Contact info */\n\n.contact-info {\n list-style-type: none;\n padding-left: 0;\n margin-bottom: 40px;\n\n > li {\n padding: 10px 0;\n border-bottom: 1px dashed #ddd;\n\n > .fa {\n float: left;\n margin-top: 10px;\n font-size: 28px;\n }\n }\n}\n.contact-info__content {\n overflow: hidden;\n margin-left: 45px;\n\n .title {\n font-weight: 700;\n margin-bottom: 0;\n }\n .description {\n font-size: (@font-size-small + 1px);\n }\n}\n\n\n/**\n * Error Page\n */\n\n.error-page__container {\n position: relative;\n width: 100%;\n max-width: 350px;\n margin: 0 auto;\n padding: 40px 60px;\n background: fade(black,5%);\n text-align: center;\n border: 1px solid fade(black,5%);\n\n &:before, &:after {\n content: \"\";\n position: absolute;\n width: 0; height: 0;\n }\n &:before {\n top: -1px; right: -1px;\n border-top: 80px solid white;\n border-left: 80px solid transparent;\n }\n &:after {\n top: -1px; right: -1px;\n border-bottom: 80px solid fade(black,10%);\n border-right: 80px solid transparent;\n }\n}\n.error-page__404 {\n font-weight: 600;\n font-size: 96px;\n font-family: 'Khand', sans-serif;\n}\n.error-page__heading {\n margin-bottom: 30px;\n font-size: @font-size-large;\n font-weight: 600;\n}\n.error-page__desc {\n margin-bottom: 20px;\n}\n\n\n/**\n * Help Center\n */\n\n.help-center__questions {\n list-style: none;\n padding-left: 0;\n\n > li > a {\n display: block;\n padding: 12px;\n border-bottom: 1px solid fade(black,5%);\n color: @text-color;\n\n &:hover {\n background-color: fade(black,2%);\n color: @text-color;\n text-decoration: none;\n }\n &::before {\n content: \"\\f054\";\n font-family: \"FontAwesome\";\n margin-right: 12px;\n color: @brand-sec;\n }\n }\n}\n.help-center__top {\n position: relative;\n padding: 20px;\n margin-bottom: 10px;\n background: fade(black,2%);\n border: 1px solid fade(black,5%);\n \n &:before, &:after {\n content: \"\";\n position: absolute;\n width: 0; height: 0;\n }\n &:before {\n top: -1px; right: -1px;\n border-top: 20px solid white;\n border-left: 20px solid transparent;\n }\n &:after {\n top: -1px; right: -1px;\n border-bottom: 20px solid fade(black,10%);\n border-right: 20px solid transparent;\n }\n > a {\n color: @text-color;\n }\n}\n.help-item__article {\n line-height: 1.7;\n}\n\n\n/**\n * Home: Version 1\n */\n\n/* Home: Carousel */\n\n.home-carousel__container {\n width: 100%;\n overflow-x: hidden;\n margin-top: -@line-height-computed;\n margin-bottom: 40px;\n border-bottom: 1px solid fade(black,10%);\n}\n.home-carousel {\n position: relative;\n display: table;\n width: 100%; height: 500px;\n\n .btn-link {\n color: fade(@text-color,80%);\n\n &:hover, &:focus {\n color: @text-color;\n }\n &.inverse {\n color: fade(white,80%);\n text-shadow: 1px 1px 1px fade(black,20%);\n\n &:hover, &:focus {\n color: white;\n }\n }\n }\n}\n.home-carousel__slide {\n vertical-align: middle;\n width: 100%;\n display: none;\n\n &.active {\n display: table-cell;\n }\n}\n.home-carousel__img {\n position: absolute;\n top: 0; left: 50%;\n height: 500px;\n width: auto;\n}\n.home-carousel__title,\n.home-parallax__title {\n margin-top: 0;\n margin-bottom: 30px;\n line-height: 1.4;\n color: fade(black,70%);\n \n &.inverse {\n font-weight: 300;\n color: white;\n text-shadow: 1px 1px 1px fade(black,50%);\n }\n}\n.home-carousel__subtitle,\n.home-parallax__subtitle {\n margin-bottom: 30px;\n color: fade(@text-color,80%);\n\n &.inverse {\n color: fade(white,80%);\n text-shadow: 1px 1px 1px fade(black,20%);\n }\n}\n.home-carousel__arrow {\n position: absolute;\n width: 55px; height: 55px;\n top: 50%; left: 0;\n margin-top: -30px;\n color: fade(black,70%);\n font-size: 32px;\n line-height: 55px;\n text-align: center;\n cursor: pointer;\n opacity: 0;\n transition: all .1s linear;\n background-color: fade(white,80%);\n border-radius: 0 @border-radius-base @border-radius-base 0;\n box-shadow: 0 0 1px fade(black,15%);\n\n &:hover {\n background-color: fade(white,95%);\n }\n}\n.home-carousel__arrow_right {\n left: auto; right: 0;\n border-radius: @border-radius-base 0 0 @border-radius-base;\n}\n.home-carousel:hover .home-carousel__arrow {\n opacity: 1;\n}\n.home-carousel__indicators {\n position: absolute;\n list-style: none;\n padding-left: 0;\n left: 0; right: 0; bottom: 20px;\n text-align: center;\n\n > li {\n display: inline-block;\n width: 12px; height: 12px;\n margin: 0 2px;\n border: 1px solid white;\n border-radius: 50%;\n background-color: transparent;\n cursor: pointer;\n\n &.active {\n background-color: white;\n }\n }\n}\n\n/* Home: Parallax */\n\n.home-parallax__container {\n margin-top: -@line-height-computed;\n margin-bottom: 40px;\n overflow: hidden;\n}\n.home-parallax {\n height: 500px;\n width: 100%;\n display: table;\n background-image: url(../img/home_7.jpg);\n text-align: center;\n\n .btn-link {\n color: fade(@text-color,80%);\n\n &:hover, &:focus {\n color: @text-color;\n }\n &.inverse {\n color: fade(white,80%);\n text-shadow: 1px 1px 1px fade(black,20%);\n\n &:hover, &:focus {\n color: white;\n }\n }\n }\n}\n.home-parallax__inner {\n display: table-cell;\n vertical-align: middle;\n}\n\n/* Home: Call to action */\n\n.call-to-action {\n padding: 40px;\n margin-bottom: 60px;\n border-top: 2px solid @brand-primary;\n background-color: #f5f5f5;\n}\n.call-to-action__heading {\n margin-top: 0;\n font-size: 18px;\n}\n.call-to-action__btn {\n text-align: center;\n margin-top: 10px;\n\n > .btn {\n padding: 12px 25px;\n }\n}\n@media(max-width: @screen-xs-max) {\n .call-to-action__heading {\n line-height: 1.5;\n }\n .call-to-action__content {\n line-height: 1.7;\n text-align: center;\n margin-bottom: 20px;\n }\n}\n\n/* Home: Features 2 */\n\n.home-features_2 {\n margin-bottom: 40px;\n}\n.home-features_2__item {\n margin-bottom: 20px;\n}\n.home-features_2__icon {\n float: left;\n margin-right: 20px;\n color: @brand-primary;\n font-size: 22px;\n}\n.home-features_2__body {\n overflow: hidden;\n}\n.home-features_2__heading {\n margin-top: 0;\n font-size: 18px;\n}\n.home-features_2__content {\n line-height: 1.7;\n}\n\n/* Home: Portfolio */\n\n.home-portfolio {\n margin-bottom: 40px;\n}\n\n/* Home: About */\n\n.home-about__content {\n line-height: 1.7;\n margin-bottom: 20px;\n}\n\n\n/**\n * Home: Version 2\n */\n\n/* Home: Slider */\n\n.home-slider {\n margin-top: -@line-height-computed;\n\n .carousel-inner > .item {\n height: 500px;\n overflow: hidden;\n background-color: #f5f5f5;\n background-repeat: no-repeat;\n background-position: center center;\n background-size: cover;\n }\n #item-1 {\n background-image: url(../img/home_1.png);\n background-position: bottom center;\n\n h1 {\n margin-top: 0;\n font-size: 30px;\n text-transform: capitalize;\n }\n h3 {\n font-size: 16px;\n color: @brand-primary;\n text-transform: capitalize;\n }\n p {\n color: @gray-light;\n margin: 35px 0;\n line-height: 1.5;\n }\n }\n #item-2 {\n background-image: url(../img/home_2.png);\n\n ul {\n list-style: none;\n text-align: right;\n font-size: 18px;\n font-weight: 300;\n margin-bottom: 20px;\n }\n ul > li > span {\n display: inline-block;\n margin-bottom: 3px;\n padding: 5px 15px;\n background: fade(@brand-primary, 90%);\n color: white;\n box-shadow: 0 0 10px fade(black, 17.5%);\n }\n ul:last-child > li > span {\n background: fade(@brand-sec,90%);\n } \n }\n #item-3 {\n background-image: url(../img/home_3.png);\n\n h1 {\n margin-top: 0;\n font-size: 30px;\n text-transform: capitalize;\n }\n h3 {\n font-size: 16px;\n color: @brand-primary;\n }\n ul {\n margin: 30px 0;\n padding-left: 0;\n list-style: none;\n }\n ul > li {\n font-size: 16px;\n padding: 5px 0;\n }\n ul > li > .fa {\n color: @brand-sec;\n }\n }\n}\n.home-slider__img {\n position: absolute;\n top: 0; bottom: 0; left: 50%;\n width: 50%;\n overflow: hidden;\n text-align: center;\n\n > img {\n height: 100%; width: auto;\n margin: 0 auto;\n }\n}\n.home-slider__table {\n display: table;\n width: 100%; height: 100%;\n}\n.home-slider-table__inner {\n display: table-cell;\n vertical-align: middle;\n}\n\n/* Home: Fullpage image */\n\n.home-fullscreen {\n position: relative;\n height: 100vh;\n margin-top: (-(@line-height-computed + @navbar-height));\n padding-top: @navbar-height;\n background: #f5f5f5 url(../img/home_5.jpg) no-repeat center bottom / cover;\n\n h3 {\n margin-top: 0;\n color: @brand-primary;\n }\n p {\n margin: 35px 0;\n line-height: 1.5;\n }\n .home-slider__img {\n\n > img {\n position: absolute;\n height: 80%;\n top: 10%;\n left: 50%;\n transform: translate(-50%, 0);\n }\n }\n}\n\n/* Home: Services */\n\n.home-services {\n margin-bottom: 40px;\n background: @brand-primary;\n color: white;\n}\n.home-services {\n\n .lead {\n margin: 0;\n line-height: 93px;\n }\n ul {\n list-style-type: none;\n margin: 0;\n padding: 0;\n }\n li {\n float: left;\n width: 24%;\n padding: 20px 3px;\n border-right: 1px solid (@brand-primary - #111111);\n text-align: center;\n cursor: pointer;\n overflow: hidden;\n white-space: nowrap;\n .transition(width 300ms);\n &:first-child {\n border-left: 1px solid (@brand-primary - #111111); \n }\n }\n ul:hover li {\n width: 20%;\n &:hover {\n width: 36%;\n }\n }\n li {\n i {\n font-size: 22px;\n }\n p {\n margin: 10px 0 0;\n text-transform: uppercase;\n }\n span {\n display: none;\n }\n &:hover span {\n display: inline-block;\n }\n }\n}\n@media (max-width: @screen-sm-max) {\n .home-services ul {\n text-align: center;\n }\n}\n@media (max-width: @screen-xs-max) {\n .home-services li {\n display: block;\n float: none;\n width: 100%;\n border-right: 0;\n border-bottom: 1px solid (@brand-primary - #111111);\n\n &:first-child {\n border-left: 0;\n }\n }\n .home-services ul:hover li {\n width: 100%;\n\n &:hover {\n width: 100%;\n }\n }\n}\n\n/* Home: Features */\n\n.home-features {\n padding: 50px 0;\n border-top: 1px solid fade(black,10%);\n}\n.home-features__item {\n margin: 30px 0;\n\n .fa {\n display: block;\n margin-right: 15px;\n background: @brand-primary;\n color: white;\n float: left;\n .circle(30px); \n }\n}\n.home-features-item__content {\n overflow: hidden;\n\n > h4 {\n margin-top: 0;\n }\n p {\n color: @gray-light;\n }\n}\n\n/* Home: Responsive Showcase */\n\n.responsive-showcase {\n padding: 50px 0;\n border-top: 1px solid fade(black,10%);\n height: 450px;\n overflow: hidden;\n #gradient > .vertical-three-colors(#f5f5f5; white; 150px; white);\n\n img {\n margin: 0 auto;\n }\n img#imac {\n max-width: 80%;\n }\n img#iphone {\n max-width: 60%;\n }\n} \n.responsive-showcase__desc {\n margin-top: -20px;\n margin-bottom: 40px;\n color: @gray-light;\n font-size: (@font-size-base + 1px);\n}\n.responsive-showcase__devices {\n list-style: none;\n padding-left: 0;\n\n > li {\n display: inline-block;\n margin-right: 5px;\n transition: all .1s linear;\n\n > .fa {\n display: block;\n width: 50px; height: 50px; line-height: 50px;\n text-align: center;\n font-size: 22px;\n border-radius: @border-radius-base;\n border: 1px solid fade(black,10%);\n color: fade(black,70%);\n cursor: pointer;\n }\n &:hover .fa, &.active .fa {\n border-color: @brand-sec;\n color: @brand-sec;\n }\n }\n}\n.responsive-showcase__images {\n text-align: center;\n\n > img {\n display: none;\n }\n}\n@media(max-width: @screen-xs-max) {\n .responsive-showcase {\n height: auto;\n }\n}\n\n/* Home: Feedback */\n\n.home-feedback {\n margin: 0 0 20px;\n padding: 50px 0 80px;\n background-image: url(../img/feedback.jpg);\n border: 1px solid fade(black,10%);\n}\n.home-feedback__item {\n margin: 20px 0 10px;\n}\n.home-feedback__avatar {\n float: left;\n margin-right: 15px; \n}\n.home-feedback__body {\n position: relative;\n overflow: hidden;\n padding-left: 20px;\n padding-right: 6px;\n}\n.home-feedback-body__content {\n padding: 15px;\n margin: 1px;\n background: white;\n border-radius: 0 @border-radius-base @border-radius-base;\n box-shadow: 0 1px 1px 1px fade(black,10%);\n\n &:before, &:after {\n content: \"\";\n position: absolute;\n width: 0; height: 0;\n }\n &:after {\n top: 1px; left: 0;\n border-top: 20px solid white; \n border-left: 21px solid transparent; \n }\n &:before {\n top: 2px; left: 0;\n border-top: 20px solid fade(black,10%); \n border-left: 21px solid transparent; \n }\n}\n\n\n/**\n * Portfolio\n */\n\n/* Portfolio navigation */\n\n.portfolio__nav {\n list-style: none;\n padding-left: 0;\n margin-bottom: 40px;\n margin-top: -20px;\n border-bottom: 1px solid fade(black,10%);\n\n > li {\n display: inline-block;\n\n > a {\n display: block;\n padding: 20px 10px;\n margin-bottom: -1px;\n border-bottom: 2px solid transparent;\n color: #757575;\n transition: all .05s linear;\n\n &:hover, &:focus {\n color: @text-color;\n text-decoration: none;\n }\n }\n\n &.active > a {\n color: @brand-primary;\n border-bottom-color: @brand-primary;\n }\n }\n}\n@media(max-width: @screen-xs-max) {\n .portfolio__nav {\n border-bottom: 0;\n\n > li {\n display: block;\n\n > a {\n padding: 10px 15px;\n margin-bottom: 10px;\n border-bottom: 1px solid fade(black,10%);\n }\n &.active > a {\n font-weight: 600;\n }\n }\n }\n}\n\n/* Portfolio thumbnails */\n\n.isotope-item {\n padding-left: 10px;\n padding-right: 10px;\n}\n/* Firefox bug fix */\n@media(min-width: @screen-lg-min) {\n .col-lg-4.isotope-item {\n width: 33%;\n }\n}\n.portfolio__item {\n margin-bottom: 20px;\n}\n.portfolio-item__img {\n position: relative;\n overflow: hidden;\n cursor: pointer;\n}\n.portfolio-item__img:hover {\n\n .portfolio-item__mask {\n background: fade(white,90%);\n }\n .portfolio-item-mask__content {\n top: 0;\n }\n}\n.portfolio-item__mask {\n position: absolute;\n top: 0; left: 0;\n width: 100%;\n height: 100%;\n background: fade(white,0%);\n transition: background .3s;\n}\n@media(max-width: @screen-xs-max) {\n .portfolio-item__mask {\n visibility: hidden;\n }\n}\n.portfolio-item-mask__content {\n position: absolute;\n display: block;\n top: -100%; left: 0;\n width: 100%;\n height: 100%;\n padding: 40px 20px;\n overflow: hidden;\n color: @text-color;\n text-decoration: none;\n transition: top .3s;\n }\n.portfolio-item-mask__title {\n margin-bottom: 20px;\n font-weight: 600;\n text-transform: uppercase;\n}\n.portfolio-item-mask__summary {\n font-size: @font-size-small;\n}\n.portfolio-item__recent > [class*=\"col-\"] {\n padding-left: 10px;\n padding-right: 10px;\n}\n\n\n/**\n * Pricing Options\n */\n\n.pricing-option {\n margin-bottom: 20px;\n border: 15px solid fade(black,5%);\n text-align: center;\n}\n.pricing-option__inner {\n background-color: white;\n}\n.pricing-option_popular {\n position: relative;\n \n &::before {\n content: \"\";\n position: absolute;\n top: -15px; left: -15px;\n height: 0; width: 0;\n border-left: 60px solid @brand-primary;\n border-bottom: 60px solid transparent;\n }\n &::after {\n content: \"\\f0e7\";\n font-family: \"FontAwesome\";\n font-size: 16px;\n position: absolute;\n display: block;\n top: -5px; left: 0;\n color: white;\n }\n}\n.pricing-option__inner {\n border: 1px solid fade(black,10%);\n transition: all .1s;\n\n &:hover {\n border-color: fade(black,14%);\n box-shadow: 0 3px 15px fade(black,10%);\n }\n}\n.pricing-option__header {\n padding: 15px 10px;\n\n h5,\n .h5 {\n font-weight: 600;\n font-size: (@font-size-base + 1px);\n }\n}\n.pricing-option__price {\n padding: 10px;\n background: fade(black,3%);\n color: @brand-primary;\n}\n.pricing-option-price__currency {\n vertical-align: 90%;\n}\n.pricing-option-price__number {\n font-size: 36px;\n font-weight: 300;\n}\n.pricing-option__body {\n padding: 10px 0 15px;\n\n ul {\n\n > li{\n padding: 10px 0;\n border-bottom: 1px solid fade(black,10%);\n text-transform: uppercase;\n font-size: (@font-size-base - 2px);\n font-weight: 600;\n color: #999;\n\n &:last-child {\n border-bottom: 0;\n }\n }\n }\n}\n\n/* Pricing Options - Joint */\n\n.pricing-options_joint {\n padding: 10px;\n margin-bottom: 40px;\n background-color: fade(black,5%);\n\n .row {\n margin-left: 0;\n margin-right: 0;\n }\n [class*=\"col-\"] {\n padding-left: 0;\n padding-right: 0;\n }\n .pricing-option {\n margin-bottom: 0;\n border: 5px solid transparent;\n }\n .pricing-option_popular {\n\n &:before {\n top: 0; left: 0;\n }\n &:after {\n top: 10px; left: 15px;\n }\n }\n}\n\n/* Pricing Options - Table */\n\n.pricing-options_table {\n border: 15px solid fade(black,5%);\n}\n.pricing-options-table__table {\n margin-bottom: 0;\n text-align: center;\n\n > thead > tr > th {\n text-align: center;\n padding: 0;\n }\n .pricing-option__price {\n margin: -8px;\n }\n .pricing-option_popular {\n \n &:before {\n border-bottom-width: 40px;\n border-left-width: 40px;\n top: 0; left: 0;\n }\n &:after {\n font-size: (@font-size-base - 1px);\n top: 5px; left: 11px;\n }\n }\n .fa-check {\n color: fade(black,40%);\n }\n .fa-times {\n color: fade(black,20%);\n }\n}\n.pricing-options-table__title {\n vertical-align: middle !important;\n padding-left: 20px !important;\n text-align: left;\n}\n\n\n/**\n * Search Results\n */\n\n.search-results__form {\n margin-bottom: 40px;\n border: 15px solid fade(black,5%);\n}\n.search-results__filter {\n margin-bottom: 40px;\n padding-bottom: 10px;\n border-bottom: 1px solid fade(black,10%);\n}\n.search-results-filter__sort {\n list-style: none;\n padding-left: 0;\n text-align: right;\n\n > li {\n display: inline-block;\n margin: 0 2px;\n\n > a {\n display: block;\n padding: 2px 7px;\n\n &:hover, &:focus {\n text-decoration: none;\n }\n }\n &.active > a {\n background-color: @brand-sec;\n border-radius: @border-radius-base;\n color: white;\n }\n }\n}\n@media(max-width: @screen-xs-max) {\n .search-results-filter__sort {\n text-align: left;\n margin-top: 20px;\n }\n}\n.search-results__links {\n list-style-type: none;\n padding-left: 0;\n\n li {\n margin-bottom: 30px;\n }\n}\n.search-results-links__title {\n display: block;\n margin-bottom: 5px;\n font-size: 16px;\n font-weight: 600;\n}\n.search-results-links__snippet {\n margin-bottom: 5px;\n}\n.search-results-links__url {\n display: block;\n color: #999;\n\n &:hover {\n color: @brand-sec;\n } \n}\n\n\n/**\n * Sign In & Sign Up\n */\n\n.sign__form {\n padding: 30px;\n border: 1px solid fade(black,10%);\n outline: 15px solid fade(black,5%);\n\n .popover {\n min-width: 200px;\n }\n}\n.sign-form__title {\n margin: 0 0 20px;\n padding-bottom: 20px;\n border-bottom: 1px solid fade(black,5%);\n}\n\n\n/**\n * User Profile\n */\n\n.user-profile__avatar,\n.user-avatar {\n padding: 10px;\n margin-bottom: 30px;\n border: 1px solid #eee;\n border-radius: 3px;\n\n > img {\n margin-bottom: 10px;\n border-radius: @border-radius-base;\n }\n}\n.user-profile__title {\n font-weight: 700;\n}\n.user-profile__desc {\n color: @gray-light;\n}\n.user-profile__url {\n margin-bottom: 20px;\n}\n.user-profile__info {\n margin: 20px 0;\n padding-left: 0;\n list-style: none;\n\n > li {\n padding: 5px 0;\n\n .fa {\n margin-right: 10px;\n }\n }\n}\n.user-profile__tabs {\n margin-top: 40px;\n}\n\n\n/**\n * Timeline\n */\n\n.timeline {\n position: relative;\n list-style-type: none;\n padding: 10px 0;\n height: auto;\n overflow: hidden;\n\n &:before {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 50%;\n content: \"\";\n border-left: 1px solid fade(black,10%);\n z-index: -1;\n }\n > .year {\n text-align: center;\n\n > span {\n display: inline-block;\n padding: 8px 18px;\n margin: 20px 0;\n border-radius: @border-radius-base;\n background-color: #505050;\n font-weight: 700;\n color: white;\n z-index: 1; \n }\n }\n > .event {\n position: relative;\n width: 50%;\n margin-top: 0;\n margin-bottom: 40px;\n padding-right: 30px;\n padding-left: 0;\n text-align: right;\n float: left;\n clear: left;\n\n &:nth-child(2n) {\n margin-bottom: 0;\n margin-top: 40px;\n padding-left: 30px;\n padding-right: 0;\n text-align: left;\n float: right;\n clear: right;\n }\n &:before {\n position: absolute;\n content: \".\";\n top: 20px;\n right: -11px;\n font-size: 72px;\n line-height: 0;\n color: #ccc;\n } \n &:nth-child(2n):before {\n right: auto;\n left: -8px;\n }\n &:hover {\n cursor: pointer;\n h3 {\n color: @brand-primary;\n }\n /* &:after {\n content: \"\\f111\";\n } */\n }\n .event__title {\n position: relative;\n padding: 15px 20px;\n border: 1px solid fade(black,10%);\n .border-top-radius(@border-radius-base);\n border-bottom: 1px solid fade(black,10%);\n background-color: #f5f5f5;\n\n > h3 {\n font-size: 16px;\n font-weight: 400;\n margin: 0 0 5px 0;\n .transition(color 300ms);\n }\n > time {\n display: block;\n color: #777777;\n\n &:before {\n content: \"\\f073\";\n font-family: FontAwesome;\n color: @brand-sec;\n margin-right: 5px;\n }\n }\n &:before, &:after {\n position: absolute;\n content: \"\";\n width: 0;\n height: 0;\n }\n &:before {\n @size: 15px;\n top: 25px;\n right: -@size;\n border-top: @size solid transparent;\n border-left: @size solid fade(black,15%);\n border-bottom: @size solid transparent;\n }\n &:after {\n @size: 14px;\n top: 26px;\n right: -@size;\n border-top: @size solid transparent;\n border-left: @size solid #f5f5f5;\n border-bottom: @size solid transparent;\n }\n }\n &:nth-child(2n) .event__title:before {\n @size: 15px;\n right: auto;\n left: -@size;\n border-right: @size solid fade(black,15%);\n border-left: 0;\n }\n &:nth-child(2n) .event__title:after {\n @size: 14px;\n right: auto;\n left: -@size;\n border-right: @size solid #f5f5f5;\n border-left: 0;\n }\n .event__content {\n padding: 15px 20px;\n border-width: 0 1px 1px 1px;\n border-style: solid;\n border-color: fade(black,10%);\n .border-bottom-radius(@border-radius-base);\n\n > p {\n color: #777777;\n margin-bottom: 0;\n > img {\n margin-bottom: 10px;\n }\n + .btn {\n margin-top: 10px;\n }\n }\n }\n }\n}\n@media (max-width: @screen-xs-max) {\n .timeline {\n &:before {\n left: 6px;\n }\n > .year {\n margin-left: 6px;\n text-align: left;\n \n > span {\n border-radius: 0 @border-radius-base @border-radius-base 0;\n margin: 0 0 30px;\n }\n }\n > .event,\n > .event:nth-child(2n) {\n width: 100%;\n padding-left: 30px;\n padding-right: 0;\n margin: 0 0 40px 0;\n text-align: left;\n float: none;\n clear: none;\n }\n > .event:before,\n > .event:nth-child(2n):before {\n top: 20px;\n left: -2px;\n right: auto;\n }\n .event,\n .event:nth-child(2n) {\n\n .event__title:before {\n @size: 15px;\n right: auto;\n left: -@size;\n border-right: @size solid fade(black,15%);\n border-left: 0;\n }\n .event__title:after {\n @size: 14px;\n right: auto;\n left: -@size;\n border-right: @size solid #f5f5f5;\n border-left: 0;\n }\n }\n }\n}\n.timeline_left {\n &:before {\n left: 6px;\n }\n > .year {\n margin-left: 6px;\n text-align: left;\n\n > span {\n border-radius: 0 @border-radius-base @border-radius-base 0;\n margin: 0 0 30px;\n }\n }\n > .event,\n > .event:nth-child(2n) {\n width: 100%;\n padding-left: 30px;\n padding-right: 0;\n margin: 0 0 40px 0;\n text-align: left;\n float: none;\n clear: none;\n }\n > .event:before,\n > .event:nth-child(2n):before {\n top: 20px;\n left: -2px;\n right: auto;\n }\n .event,\n .event:nth-child(2n) {\n .event__title:before {\n @size: 15px;\n right: auto;\n left: -@size;\n border-right: @size solid fade(black,15%);\n border-left: 0;\n }\n .event__title:after {\n @size: 14px;\n right: auto;\n left: -@size;\n border-right: @size solid #f5f5f5;\n border-left: 0;\n }\n }\n}\n.timeline_right {\n &:before {\n right: 6px;\n left: auto;\n }\n > .year {\n margin-right: 6px;\n margin-left: auto;\n text-align: right;\n > span {\n border-radius: @border-radius-base 0 0 @border-radius-base;\n margin: 0 0 30px;\n }\n }\n > .event,\n > .event:nth-child(2n) {\n width: 100%;\n padding-right: 30px;\n padding-left: 0;\n margin: 0 0 40px 0;\n text-align: right;\n float: none;\n clear: none;\n }\n > .event:before,\n > .event:nth-child(2n):before {\n top: 20px;\n right: -2px;\n left: auto;\n }\n .event,\n .event:nth-child(2n) {\n\n .event__title:before {\n @size: 15px;\n left: auto;\n right: -@size;\n border-left: @size solid fade(black,15%);\n border-right: 0;\n }\n .event__title:after {\n @size: 14px;\n left: auto;\n right: -@size;\n border-left: @size solid #f5f5f5;\n border-right: 0;\n }\n }\n}\n\n\n/**\n * UI Elements\n */\n\n.tooltip-test button, \n.popover-test button {\n margin-bottom: 10px;\n}\n\n/* Pagination */\n\n.pagination-example ul {\n margin: 10px 0;\n}\n\n\n/**\n * Resume\n */\n\n.resume__profile {\n border-radius: @border-radius-base;\n // border: 1px solid fade(black,10%);\n background-color: fade(black,5%);\n padding: 20px;\n margin-bottom: 20px;\n}\n.resume-profile__title {\n font-size: 14px;\n font-weight: 600;\n text-transform: uppercase;\n margin-top: 0;\n border-bottom: 1px solid fade(black,5%);\n padding-bottom: 10px;\n margin-bottom: 15px;\n}\n.resume-profile__section {\n padding-bottom: 10px;\n\n a {\n color: @text-muted;\n\n &:hover, &:focus {\n color: @text-color;\n }\n }\n}\n.resume__table {\n\n td {\n border-top-color: transparent !important;\n }\n}\n.resume-table__header {\n color: @gray-light;\n width: 110px;\n}\n.resume__reference {\n padding-bottom: 20px;\n}"]}