_theme.less

/**
  Fonts, variables and other global stuff
 */
/**
  HG Fonts && sizes
 */
@import '_hgstyles';
@import "_additionalToMerge";
@import '_hghomepage';
@import "_category";
@import "_cmsFramework";
@import "_events";
@import "_productPage";
@import "_blog";
@import "_checkout";
@import "_menu";

//layout width override
@layout__max-width: 1280px;
@layout-indent__width: 20px;
@hg-width_between-columns: 30px;
@hg-large-spacing: 30px;
@hg-standard-spacing: 20px;
@hg-medium-spacing: 15px;
@hg-small-spacing: 10px;

//fonts
//@hg-font: 13px 'Gotham SSm A', 'Gotham SSm B',sans-serif;
@hg-font-family__base: 'Gotham SSm A', 'Gotham SSm B', sans-serif;
@font-family__base: @hg-font-family__base;

@hg-font-size-very-small: 1rem;
@hg-font-size-small: 1.2rem;
@hg-font-size-medium: 1.4rem;
@hg-font-size-large: 1.6rem;
@hg-font-size-very-large: 1.6rem;

@hg-font-family__sectionTitle: "BauerBodoniBT-Roman";

.hg-menu-section-title{
  font-family: @hg-font-family__sectionTitle;
}

/**
HG base colours
 */
@hg-grey-icon: #e8e9eb;
@hg-gray: #333;
@hg-gray-dark: #1a1b1d;
@hg-gray-very-dark: #161618;
@hg-gray-light: #444;
@hg-gray-vlight:#f5f5f5;
@hg-grey-ultra-light: #e9eef4;
@hg-blue: #236192;
@hg-blue-light: #517ba6;
@hg-blue-darker: #265a90;
@hg-blue-darkest: #1c2b39;
@hg-brown: #c07d59;
@hg-brown-dark: #e37353;
@hg-brown-darkest: #bf654b;
@hg-gray-copyright: #c8c8c8;
@hg-orange-footer-icons: #b47655;



/**
Font colours
 */
@hg-color_font-primary: @hg-gray;
@hg-color_h1-primary: @hg-blue;
@hg-color_h2-primary: @hg-gray;
@hg-color_h2-blog: @hg-gray-light;
@hg-color_h4-primary: @hg-gray;


/**
Page element colours
 */
@hg-color_breadcrumbs: @hg-blue;

@hg-color_blue-background: @hg-blue-darker;
@hg-color_blue-background-light: @hg-blue-light;
@hg-color_blue-background-very-light: @hg-grey-ultra-light;
@hg-color_blue-background-dark: @hg-blue-darkest;
@hg-color_brown-background: @hg-brown;
@hg-color_brown-background-dark: @hg-brown-darkest;
@hg-color_orange-background: @hg-brown-dark;
@hg-color_container_background: @hg-gray-vlight;

@hg-color_a-blue-normal: @hg-color_blue-background;
@hg-color_a-blue-hover: @hg-gray;

@hg-color_footer-background-primary: @hg-gray-dark;
@hg-color_footer-background-darker: @hg-gray-very-dark;

//
//  Footer
//  ---------------------------------------------

@copyright__background-color: white;

//Originals

//  Fonts
@icons__font-path: '@{baseDir}fonts/Luma-Icons';
@icons__font-name: 'luma-icons';

//  Color nesting
@panel__background-color: @color-gray-light0;
@border-color__base: @color-gray80;

//  Headings
@h3__font-weight: @font-weight__semibold;
@h3__margin-top: @indent__base;

//  Links
@link__color: @color-blue2;

//  Focus
@focus__color: @color-blue3;

//
//  Tables
//  ---------------------------------------------

@table-cell__padding-vertical: 11px;
@table-cell-stripped__background-color: @table-cell__hover__background-color;
@table-responsive-th__background-color: @table-cell-stripped__background-color;
@table-responsive-cell__padding: @indent__xs @indent__s;

//
//  Layout grid
//  ---------------------------------------------

@total-columns: 24;

//  Variables for layout columns
@layout-column__sidebar-width: 5;

//  Checkout columns width
@layout-column-checkout__width-left: 6;

//
//  Navigation
//  ---------------------------------------------

@navigation__background: @color-gray94;
@navigation-level0-item__active__color: @primary__color;
@navigation-level0-item__active__border-color: @active__color;
@navigation-desktop-level0-item__active__border-color: @active__color;

@submenu-desktop-item__active__border-color: @active__color;
@submenu-item__active__border-color: @active__color;
@submenu-item__active__color: @navigation-level0-item__active__color;


//  Desktop navigation
@navigation-desktop-level0-item__line-height: 47px;
@submenu-desktop__font-weight: @font-weight__regular;
@submenu-desktop-item__active__color: @navigation-level0-item__active__color;

//  Tabs
@tab-control__color: @color-gray43;
@tab-control__font-weight: @font-weight__regular;
@tab-control__height: @indent__base*2;
@tab-control__margin-right: -1px;
@tab-control__padding-top: 1px;
@tab-control__padding-right: 35px;

//  Tabs content
@tab-content__padding-top: 35px;
@tab-content__padding-right: @tab-control__padding-right;

//
//  Accordion
//  ---------------------------------------------

@accordion-control__font-family: false;
@accordion-control__font-size: @font-size__base;
@accordion-control__font-style: false;
@accordion-control__font-weight: @font-weight__semibold;
@accordion-control__border-right: false;
@accordion-control__border-bottom: false;
@accordion-control__border-left: false;
@accordion-control__background-color: false;
@accordion-control__color: @primary__color;
@accordion-control__hover__background-color: false;
@accordion-control__hover__color: @accordion-control__color;
@accordion-control__active__background-color: false;
@accordion-control__active__color: @accordion-control__color;
@accordion-control__margin-bottom: 0;
@accordion-control__padding-right: @indent__s;
@accordion-control__padding-left: @indent__s;
@accordion-content__border: false;
@accordion-content__margin: 0;
@accordion-content__padding: @indent__s @indent__s @indent__l;

//
//  Buttons
//  ---------------------------------------------

@button__font-weight: @font-weight__semibold;

//  Default = secondary button
@button__background: @color-gray-darken0;
@button__border: 1px solid @border-color__base;
@button__hover__color: @button__color;
@button__hover__background: darken(@button__background, 5%);
@button__active__background: @color-gray-darken1;

//  Primary button
@button-primary__hover__color: @color-white;
@button-primary__active__background: @link__hover__color;
@button-primary__active__border: 1px solid @link__hover__color;
@button-primary__active__color: @color-white;

//  Button with icon
@button-icon__line-height: @icon-font__line-height;

//
//  Icons
//  ---------------------------------------------

@icon-wishlist-empty: false;
@icon-comment-reflected: false;
@icon-compare-empty: false;
@icon-arrow-up-thin: false;
@icon-arrow-right-thin: false;
@icon-arrow-left-thin: false;
@icon-arrow-down-thin: false;
@icon-wishlist-empty: '\e601';

//
//  Messages
//  ---------------------------------------------

@message__padding: 12px @indent__base 12px @indent__m;
@message__line-height: false;
@message-icon__font-size: 24px;
@message-icon__inner-padding-left: 45px;
@message-icon__top: 22px;
@message-error-icon: @icon-error;
@message-success-icon: @icon-success;

//
//  Loaders
//  ---------------------------------------------

@loader-overlay__background-color: rgba(255, 255, 255, .7);

//
//  Forms
//  ---------------------------------------------

//  Form fieldset
@form-fieldset-legend__font-size: 18px;
@form-fieldset-legend__font-weight: @font-weight__light;
@form-fieldset-legend__margin: 0 0 @indent__base;
@form-fieldset-legend__padding: 0 0 @indent__s;
@form-fieldset-legend__width: 100%;

//  Form field
@form-field-type-revert: false;
@form-field__additional-vertical-indent: @indent__s;

//  Form field label
@form-field-label__font-weight: @font-weight__semibold;
@form-field-type-label-block__margin: 0 0 8px;

//  Form field note icon
@form-field-note-icon-font__content: false;

//  Placeholder
@form-element-input-placeholder__color: @color-gray34;

//
//  Pager
//  ---------------------------------------------

@pager__font-weight: @font-weight__regular;
@pager__line-height: @indent__l;
@pager-item__margin: 0 8px 0 0;
@pager-item__padding: 0 @indent__xs;

//  Pager current page
@pager-current__background: @color-gray90;

//  Pager link.action
@pager-icon__font-margin: 0;
@pager-icon__font-size: 16px;

//  Pager link.action visited
@pager-action__visited__color: @text__color__muted;

//  Pager link.action hover
@pager-action__hover__color: @text__color__muted;

//  Pager link.action active
@pager-action__active__color: @text__color__muted;

//
//  Rating
//  ---------------------------------------------

@rating-icon__font-size: 16px;
@rating-icon__letter-spacing: 2px;
@rating-icon__active__color: @active__color;

//
//  Dropdowns
//  ---------------------------------------------

@dropdown-toggle-icon__content: @icon-down;
@dropdown-toggle-icon__active__content: @icon-up;
@dropdown-toggle-icon__font-size: 12px;

//  Split dropdown
@dropdown-split-actions__padding: 0 @indent__xs;
@dropdown-split-toggle__actions__padding: false;

//  Actions-toolbar
@actions-toolbar-actions__position: left;
@actions-toolbar-actions-primary__margin: 0 15px 0 0;

//
//  Breadcrumbs
//  ---------------------------------------------

@breadcrumbs__container-margin: 0 0 15px;
@breadcrumbs-icon__font-size: 10px;
@breadcrumbs-icon__font-margin: 0 @indent__s;

@breadcrumbs-current__color: @color-gray-middle5;
@breadcrumbs-link__color: @color-blue2;
@breadcrumbs-link__visited__color: @breadcrumbs-link__color;
@breadcrumbs-link__hover__color: @breadcrumbs-link__color;
@breadcrumbs-link__active__color: @breadcrumbs-link__color;

//
//  Popups
//  ---------------------------------------------

@popup__border: 1px solid @color-gray68;
@popup-title-headings__level: h2;

//  Popup icons
@popup-icon-font__size: 16px;
@popup-icon-font__line-height: 16px;
@popup-icon-font__color: @color-gray55;
@popup-icon-font__color-hover: darken(@popup-icon-font__color, 10%);
@popup-icon-font__color-active: @popup-icon-font__color-hover;

//  Window overlay
@overlay__background: @color-gray55;
@overlay__opacity: .7;
@overlay__opacity-old: 70;

@gallery-thumb-border-color-active: @active__color;

//  Checkout tooltip icon
@checkout-tooltip-icon__font-size: 21px;

//  Checkout Payment Option icon
@checkout-payment-option-title-icon__font-size: 14px;
@checkout-payment-option-title-icon__line-height: 16px;
@checkout-payment-option-title-icon__margin: 0 0 0 @indent__s;

//  Checkout Sidebar Shipping Information
@checkout-sidebar-shipping-information-edit-icon__content: @icon-edit;
@checkout-sidebar-shipping-information-edit-icon__font-size: 18px;
@checkout-sidebar-shipping-information-edit-icon__line-height: 20px;
@checkout-sidebar-shipping-information-edit-icon__top: @indent__s;

//  Checkout
@checkout-sidebar__columns: 8;

// buttons to be all square cornered
button, a.action.primary{
  border-radius: 0;
}

.pace .pace-progress {
display: none!important;
}

@media screen and (min-width: 768px) {
  
  div.hg_badges {
    position: relative;
    bottom: 5px;
    width: 100%;
  }

  .catalog-product-view .fotorama__stage.single-img .fotorama__stage__shaft .fotorama__stage__frame .fotorama__img {
    position: relative;
    transform: none;
    top: 0;
    left: 0;
    width: 100%;
    margin-top: 20px;
    margin-bottom: 20px;
  }
}