
.hidden {
	font-weight:bold;
	position:absolute;
	left:-10000px;
	top:auto;
	width:1px;
	height:1px;
	overflow:hidden;
}

.visible {
	font-weight:bold;
	position:static;
	width:auto;
	height:auto;
}
/*	Eurostile is not used on this page.
		@font-face {
  font-family: "Eurostile";
  /* Eurostile W01 Regular */
  font-weight: normal;
  src: url("/Fonts/bdeb0954-a29d-41df-bd63-b1eb58201b11.eot?#iefix");
  src: url("/Fonts/bdeb0954-a29d-41df-bd63-b1eb58201b11.eot?#iefix") format("eot"), url("/Fonts/889bdee1-8c94-46f0-9aa3-18470143c3ff.woff") format("woff"), url("/Fonts/595cfe27-f15d-4a60-a589-c727a09e2bd8.ttf") format("truetype"), url("/Fonts/115a20aa-c3ab-447c-9f2e-84bf6399a707.svg#115a20aa-c3ab-447c-9f2e-84bf6399a707") format("svg");
}

@font-face {
  font-family: "Eurostile";
  /* Eurostile W01 Bold */
  font-weight: bold;
  src: url("/Fonts/6d228214-6287-48d1-a0d9-eca054e54ad7.eot?#iefix");
  src: url("/Fonts/6d228214-6287-48d1-a0d9-eca054e54ad7.eot?#iefix") format("eot"), url("/Fonts/4b5e0094-4fa5-40c0-813c-f8ac69e53416.woff") format("woff"), url("/Fonts/1571bf47-258a-49c3-8452-02dcde85b19c.ttf") format("truetype"), url("/Fonts/cc13952f-a6fa-44e9-9d52-d4783ef7a348.svg#cc13952f-a6fa-44e9-9d52-d4783ef7a348") format("svg");
}
*/


.head--0, .title--0,
.title--1,
.title--2, .pagination-number {
  font-family: "Eurostile";
}

/*! normalize.css v2.1.2 | MIT License | git.io/normalize */
/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined in IE 8/9.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block;
}

/**
 * Correct `inline-block` display not defined in IE 8/9.
 */
audio,
canvas,
video {
  display: inline-block;
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9.
 * Hide the `template` element in IE, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none;
}

/* ==========================================================================
   Base
   ========================================================================== */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 * 3. Allow using rem unit easily (1rem = 10px)
 */
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
  font-size: 62.5%;
  /* 3 */
}

/**
 * 1. Remove default margin.
 * 2. Set the base font size back to default
 */
body {
  margin: 0;
  /* 1 */
  font-size: 160%;
  /* 2 */
}

/* ==========================================================================
   Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background: transparent;
}

/**
 * Address `outline` inconsistency between Chrome and other browsers.
 */
a:focus {
  outline: thin dotted;
}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
  outline: 0;
}

/* ==========================================================================
   Typography
   ========================================================================== */
/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari 5, and Chrome.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/**
 * Address styling not present in IE 8/9, Safari 5, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
 */
b,
strong {
  font-weight: bold;
}

/**
 * Address styling not present in Safari 5 and Chrome.
 */
dfn {
  font-style: italic;
}

/**
 * Address differences between Firefox and other browsers.
 */
hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}

/**
 * Address styling not present in IE 8/9.
 */
mark {
  background: #ff0;
  color: #000;
}

/**
 * Correct font family set oddly in Safari 5 and Chrome.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  font-size: 1em;
}

/**
 * Improve readability of pre-formatted text in all browsers.
 */
pre {
  white-space: pre-wrap;
}

/**
 * Set consistent quote types.
 */
q {
  quotes: "\201C" "\201D" "\2018" "\2019";
}

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* ==========================================================================
   Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9.
 */
img {
  border: 0;
}

/**
 * Correct overflow displayed oddly in IE 9.
 */
svg:not(:root) {
  overflow: hidden;
}

/* ==========================================================================
   Figures
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari 5.
 */
figure {
  margin: 0;
}

/* ==========================================================================
   Forms
   ========================================================================== */
/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * 1. Correct font family not being inherited in all browsers.
 * 2. Correct font size not being inherited in all browsers.
 * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
 */
button,
input,
select,
textarea {
  /* font-family: inherit; */
  /* 1 */
  /* font-size: 100%; */
  /* 2 */
  margin: 0;
  /* 3 */
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
button,
input {
  line-height: normal;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
 * Correct `select` style inheritance in Firefox 4+ and Opera.
 */
button,
select {
  text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  /* -webkit-appearance: button; */
  /* 2 */
  cursor: pointer;
  /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default;
}

/**
 * 1. Address box sizing set to `content-box` in IE 8/9.
 * 2. Remove excess padding in IE 8/9.
 */
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  -webkit-box-sizing: content-box;
  /* 2 */
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}

/**
 * Remove inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/**
 * 1. Remove default vertical scrollbar in IE 8/9.
 * 2. Improve readability and alignment in all browsers.
 */
textarea {
  overflow: auto;
  /* 1 */
  vertical-align: top;
  /* 2 */
}

/* ==========================================================================
   Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/**
 * Typography
 */
body {
  font-family: arial, helvetica, sans-serif;
  font-size: 15px;
  background-color: #efeded;
  color: #59595a;
}
body a:hover {
  color: #ed1c24;
}

blockquote, dl, fieldset, figure, hr, menu, ol, p, table, ul {
  line-height: 23px;
}

a, h1, h2, h3, h4, h5, h6 {
  color: black;
}

/**
 * Remove margin top and add a fixed margin bottom on elements
 * which have top and bottom margins by default.
 */
blockquote, dl, fieldset, figure, h1, h2, h3, h4, h5, h6, hr, menu, ol, p, ul {
  margin-top: 0;
  margin-bottom: 14px;
}

/**
 * Remove margin bottom in some circumstances.
 */
fieldset > :last-child,
dl dl, dl menu, dl ol, dl ul,
menu dl, menu menu, menu ol, menu ul,
ol dl, ol menu, ol ol, ol ul,
ul dl, ul menu, ul ol, ul ul {
  margin-bottom: 0;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/region
 *
 * .r-body
 *
 * Styles the body region.
 */
@media only screen and (max-width: 768px) {
  .r-body {
    margin-left: auto;
    margin-right: auto;
    width: 768px;
  }
}
/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/region
 *
 * .r-footer
 *
 * Styles the footer region.
 */
.r-footer {
  margin-top: 40px;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/region
 *
 * .r-navigation
 *
 * Styles the navigation region.
 */
.r-navigation {
  -webkit-box-shadow: 0 3px 4px -2px rgba(0, 0, 0, 0.25);
  -moz-box-shadow: 0 3px 4px -2px rgba(0, 0, 0, 0.25);
  box-shadow: 0 3px 4px -2px rgba(0, 0, 0, 0.25);
  position: relative;
  z-index: 100;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/layout
 *
 * l-div
 *
 * Layout component which defines various options for bottom vertical margin.
 */
.l-div {
  margin-bottom: 20px;
}

.l-div--top {
  margin-top: 20px;
}

.l-div--half {
  margin-bottom: 10px;
}

.l-div--left--half {
  margin-left: 10px;
}

.l-div--zero {
  margin-bottom: 0;
}

.l-div--double {
  margin-bottom: 40px;
}

.l-div--right {
  margin-right: 20px;
}

.l-div--left {
  margin-left: 20px;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/layout
 *
 * This class can be used when some content needs top (and optionally sides) padding (spacing).
 */
.l-pad {
  padding-top: 20px;
}

.l-pad--bottom {
  padding-bottom: 20px;
}

.l-pad--left {
  padding-left: 20px;
}

.l-pad--right {
  padding-right: 20px;
}

.l-pad--right3 {
  padding-right: 30px;
}

.l-pad--right4 {
  padding-right: 40px;
}

.l-pad--bottom---lg {
  padding-bottom: 40px;
}

.l-pad--half {
  padding-top: 10px;
}

.l-pad--half--bottom {
  padding-bottom: 10px;
}

.l-pad--zero {
  padding-top: 0;
}

.l-pad--double {
  padding-top: 40px;
}

.l-pad--sides2 {
  padding-left: 20px;
  padding-right: 10px;
}

.l-pad--sides {
  padding-left: 20px;
  padding-right: 20px;
}
.l-pad--sides.l-pad--half {
  padding-left: 10px;
  padding-right: 10px;
}
.l-pad--sides.l-pad--zero {
  padding-left: 0;
  padding-right: 0;
}
.l-pad--sides.l-pad--double {
  padding-left: 40px;
  padding-right: 40px;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/layout
 *
 * .l-box
 *
 * Use this class when you need a container to contain any top/bottom margin of its children.
 */
.l-box:before, .l-box:after {
  content: "";
  display: table;
}
.l-box:after {
  clear: both;
}

.l-box2:before, .l-box2:after {
  content: "";
  display: table;
}
.l-box2:after {
  clear: both;
}
.l-box2:before {
  /* triangle */
  content: "";
  width: 0;
  height: 0;
  position: relative;
  left: 10px;
  bottom: -48px;
  margin-left: -10px;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 7px solid #242425;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/layout
 *
 * .l-row
 *
 * This class mimics the layout of a table.
 */
.l-row {
  margin: 0;
  padding: 0;
  display: inline-block;
  vertical-align: middle;
}
.l-row > * {
  text-align: left;
  vertical-align: top;
  display: table-cell;
}

.l-row--gutter > * {
  padding-left: 10px;
  padding-right: 10px;
}

.l-row--gutter--full > * {
  padding-left: 5px;
  padding-right: 20px;
}

.l-row--gutter--double > * {
  padding-left: 5px;
  padding-right: 60px;
}

.l-row--gutter--half > * {
  padding-left: 5px;
  padding-right: 5px;
}

.l-row--expand {
  display: table;
}

.l-row--nextline {
  clear: both;
}

.l-row--expand,
.l-row-cell--expand {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
}

.l-row--expand.l-row--gutter {
  margin-left: -10px;
  width: -webkit-calc(100% + 20px);
  width: -moz-calc(100% + 20px);
  width: -ms-calc(100% + 20px);
  width: -o-calc(100% + 20px);
  width: calc(100% + 20px);
}
.l-row--expand.l-row--gutter--half {
  margin-left: -5px;
  width: -webkit-calc(100% + 10px);
  width: -moz-calc(100% + 10px);
  width: -ms-calc(100% + 10px);
  width: -o-calc(100% + 10px);
  width: calc(100% + 10px);
}

.l-row--nowrap > *,
.l-row-cell--nowrap {
  white-space: nowrap;
}

.l-row--align-top > *,
.l-row-cell--align-top {
  vertical-align: top;
}

.l-row--align-middle > *,
.l-row-cell--align-middle {
  vertical-align: middle;
}

.l-row--align-bottom > *,
.l-row-cell--align-bottom {
  vertical-align: bottom;
}

.l-row--align-left > *,
.l-row-cell--align-left {
  text-align: center;
}

.l-row--align-center > *,
.l-row-cell--align-center {
  text-align: center;
}

.l-row--align-right > *,
.l-row-cell--align-right {
  text-align: right;
}

.l-row--separator {
  border-left: 1px solid white;
}
.l-row--separator > * {
  border-right: 1px solid white;
}
.l-row--separator.l-row--separator--alt,
.l-row--separator.l-row--separator--alt > * {
  border-color: #3a3a3b;
}

.l-row-separator--first > :first-child {
  border-right: 1px solid white;
}

.l-row-separator--second > :nth-child(2) {
  border-right: 1px solid white;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/layout
 *
 * l-page
 *
 * This class is used to limit the maximum width of the content in the page, while keeping it centred.
 */
.l-page {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin-left: auto;
  margin-right: auto;
  padding-left: 10px;
  padding-right: 10px;
  max-width: 768px;
  /* This is a wider l-page. */
}
@media only screen and (min-width: 1024px) {
  .l-page {
    max-width: 1024px;
  }
}
.l-page.l-page--wider {
  padding-left: 0;
  padding-right: 0;
  max-width: 1300px;
  /* This container crops the content keeping it centred */
}
.l-page.l-page--wider.l-page--wider--crop-center {
  overflow: hidden;
  text-align: center;
}
.l-page.l-page--wider2 {
  padding-left: 0;
  padding-right: 0;
  max-width: 1100px;
}

/* This is the container of the content whic is cropped and centred */
.l-page--wider--crop-center-content {
  margin-left: -50%;
  margin-right: -50%;
  text-align: left;
  display: inline-block;
  vertical-align: bottom;
  width: 1300px;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/layout
 *
 * .l-stack
 *
 * Styles for a list of elements.
 *
 * - optional top + bottom padding
 * - optional row top separator in different colours
 */
/*ul,ol*/
.l-stack {
  padding-left: 0;
  list-style-type: none;
}
.l-stack.l-stack--padding > * {
  padding-top: 10px;
  padding-bottom: 10px;
}
.l-stack.l-stack--separator > * {
  border-top: 1px solid transparent;
}
.l-stack.l-stack--separator.l-stack--separator--skipfirst > :first-child {
  border-top: none;
}
.l-stack.l-stack--separator.l-stack--separator--skipfirst.l-stack--padding > :first-child {
  padding-top: 0;
}
.l-stack.l-stack--separator.l-stack--separator--1 > * {
  border-top-color: #e5e5e5;
}
.l-stack.l-stack--separator.l-stack--separator--2 > * {
  border-top-color: #5f5f5f;
}
.l-stack.l-stack--separator-b > * {
  border-bottom: 1px solid transparent;
}
.l-stack.l-stack--separator-b.l-stack--separator--skipfirst-b > :first-child {
  border-bottom: none;
}
.l-stack.l-stack--separator-b.l-stack--separator--skipfirst-b.l-stack--padding-b > :first-child {
  padding-top: 0;
}
.l-stack.l-stack--separator-b.l-stack--separator--1-b > * {
  border-bottom-color: #e5e5e5;
}
.l-stack.l-stack--separator-b.l-stack--separator--2-b > * {
  border-bottom-color: #5f5f5f;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/layout
 *
 * .l-social
 *
 * Styles for a list of elements.
 *
 * - optional top + bottom padding
 * - optional row top separator in different colours
 */
/*ul,ol*/
.l-social {
  padding-left: 0;
  list-style-type: none;
}
.l-social.l-social--padding > * {
  padding-top: 6px;
  padding-bottom: 4px;
}
.l-social.l-social--separator > * {
  border-top: 1px solid transparent;
}
.l-social.l-social--separator.l-social--separator--nth > :nth-child(even) {
  border-top: none;
}
.l-social.l-social--separator.l-social--separator--nth.l-social--padding > :first-child {
  padding-top: 15px;
}
.l-social.l-social--separator.l-social--separator--1 > * {
  border-top-color: #e5e5e5;
}
.l-social.l-social--separator.l-social--separator--2 > * {
  border-top-color: #5f5f5f;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/layout
 *
 * .l-slider
 *
 * This class implements a slider, which allows content to be horizontally scrolled.
 */
.l-slider,
.l-slider-slides,
.l-slider-wrapper {
  position: relative;
}

.l-slider {
  overflow: hidden;
}
.l-slider:not(.is-init) .l-slider-slide + .l-slider-slide {
  /* Shows only the first slide untill the slider is ready. */
  display: none;
}

.l-slider-slides {
  margin: 0;
  border: 0;
  padding: 0;
  list-style-type: none;
  -webkit-transition: left 850ms;
  -moz-transition: left 850ms;
  -o-transition: left 850ms;
  transition: left 850ms;
  left: 0;
}
.l-slider-slides:after {
  clear: both;
  content: "";
  display: table;
}
.l-slider-slides > * {
  float: left;
}

.l-slider-pages {
  position: absolute;
  right: 0;
  bottom: 20px;
  margin-bottom: 20px;
  text-align: right;
}

.l-slider-prev,
.l-slider-next {
  cursor: pointer;
}
.l-slider-prev[disabled],
.l-slider-next[disabled] {
  cursor: default;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=25);
  opacity: 0.25;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/layout
 *
 * l-shutter
 *
 * This class allows animation of the height of a container, from 0 to auto and vice-versa.
 */
html.has-js .l-shutter {
  height: 0;
  overflow: hidden;
}
html.has-js .l-shutter.is-selected {
  height: auto;
}
html.has-js .l-shutter.is-transition {
  -webkit-transition: height 250ms;
  -moz-transition: height 250ms;
  -o-transition: height 250ms;
  transition: height 250ms;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/layout
 *
 * .l-tab
 *
 * Styles for the tab functionality.
 */
.l-tab-content {
  display: none;
}
.l-tab-content.is-selected {
  display: block;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .tab
 *
 * Style for the tab module. Mainly used for the tabs in the global header (select a country, sign in, ...).
 */
.tab {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  font-size: 14px;
  display: block;
  white-space: nowrap;
  line-height: 20px;
  margin-bottom: 20px;
  padding-bottom: 0;
}
.tab.is-selected {
  -moz-border-radius-bottomleft: 0;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
  -moz-border-radius-bottomright: 0;
  -webkit-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
  margin-bottom: 0;
  padding-bottom: 20px;
}
.tab.is-selected .tab-inner--icon.tab-inner--icon--magnifier:after {
  margin-left: 1px;
  margin-right: 1px;
}
.tab.is-selected .tab-inner--icon.tab-inner--icon--tool:after {
  margin-left: 1px;
  margin-right: 1px;
}
.tab.is-selected .tab-inner--icon.tab-inner--icon--wrench:after {
  margin-left: 1px;
  margin-right: 1px;
}

.tab-inner {
  display: block;
  cursor: pointer;
  padding: 10px;
}

.tab-inner--icon:after {
  content: "";
  margin-left: 10px;
}
.tab-inner--icon.tab-inner--icon--magnifier:after {
  margin-left: 0;
}
.tab-inner--icon.tab-inner--icon--tool:after {
  margin-left: 0;
}
.tab-inner--icon.tab-inner--icon--wrench:after {
  margin-left: 0;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .hero
 *
 * Style for the hero module.
 */
.hero {
  position: relative;
}
.hero, .hero a, .hero h1, .hero h2, .hero h3, .hero h4, .hero h5, .hero h6 {
  color: white;
}

.hero-image {
  display: block;
}

.hero-body {
  position: absolute;
  top: 100px;
  left: 0;
  right: 0;
}

.hero--1-3 .hero-title,
.hero--1-3 .hero-description {
  width: 33.333333%;
}

.hero--2-3 .hero-title,
.hero--2-3 .hero-description {
  width: 66.666666%;
}

/**
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package TheF Antipasti - Frontend Boilerplate
 *
 * .grid
 *
 * This is a fully responsive grid
 *
 * - fluid
 * - nestable
 * - responsive
 *      - by default, you'll have s (small), m (medium), l (large) and x (extralarge) grids
 *      - by default, you'll have 1 to 12 columns grids
 * - with optional vertical gutter
 */
.grid {
  padding-left: 0;
  margin-bottom: 0;
}
.grid:after {
  clear: both;
  content: "";
  display: table;
}
.grid, .grid > * {
  display: block;
}
.grid > * {
  float: left;
}

.grid--rtl > * {
  float: right;
}

.grid--inline {
  display: inline-block;
  vertical-align: bottom;
}

.grid--gutter {
  margin-left: -20px;
}
.grid--gutter > * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding-left: 20px;
}

.grid--gutter--half {
  margin-left: -10px;
}
.grid--gutter--half > * {
  padding-left: 10px;
}

@media only screen and (max-width: 1023px) {
  .grid-column--media-size-m--1-1 {
    width: 100%;
  }

  .grid-column--media-size-m--skip--1-1 {
    margin-left: 100%;
  }

  .grid-column--media-size-m--pull--1-1 {
    right: 100%;
  }

  .grid-column--media-size-m--push--1-1 {
    left: 100%;
  }

  .grid-column--media-size-m--pull--1-1,
  .grid-column--media-size-m--push--1-1 {
    position: relative;
  }

  .grid-column--media-size-m--1-2 {
    width: 50%;
  }

  .grid-column--media-size-m--skip--1-2 {
    margin-left: 50%;
  }

  .grid-column--media-size-m--pull--1-2 {
    right: 50%;
  }

  .grid-column--media-size-m--push--1-2 {
    left: 50%;
  }

  .grid-column--media-size-m--pull--1-2,
  .grid-column--media-size-m--push--1-2 {
    position: relative;
  }

  .grid-column--media-size-m--2-2 {
    width: 100%;
  }

  .grid-column--media-size-m--skip--2-2 {
    margin-left: 100%;
  }

  .grid-column--media-size-m--pull--2-2 {
    right: 100%;
  }

  .grid-column--media-size-m--push--2-2 {
    left: 100%;
  }

  .grid-column--media-size-m--pull--2-2,
  .grid-column--media-size-m--push--2-2 {
    position: relative;
  }

  .grid-column--media-size-m--1-3 {
    width: 33.33333%;
  }

  .grid-column--media-size-m--skip--1-3 {
    margin-left: 33.33333%;
  }

  .grid-column--media-size-m--pull--1-3 {
    right: 33.33333%;
  }

  .grid-column--media-size-m--push--1-3 {
    left: 33.33333%;
  }

  .grid-column--media-size-m--pull--1-3,
  .grid-column--media-size-m--push--1-3 {
    position: relative;
  }

  .grid-column--media-size-m--2-3 {
    width: 66.66667%;
  }

  .grid-column--media-size-m--skip--2-3 {
    margin-left: 66.66667%;
  }

  .grid-column--media-size-m--pull--2-3 {
    right: 66.66667%;
  }

  .grid-column--media-size-m--push--2-3 {
    left: 66.66667%;
  }

  .grid-column--media-size-m--pull--2-3,
  .grid-column--media-size-m--push--2-3 {
    position: relative;
  }

  .grid-column--media-size-m--3-3 {
    width: 100%;
  }

  .grid-column--media-size-m--skip--3-3 {
    margin-left: 100%;
  }

  .grid-column--media-size-m--pull--3-3 {
    right: 100%;
  }

  .grid-column--media-size-m--push--3-3 {
    left: 100%;
  }

  .grid-column--media-size-m--pull--3-3,
  .grid-column--media-size-m--push--3-3 {
    position: relative;
  }

  .grid-column--media-size-m--1-4 {
    width: 25%;
  }

  .grid-column--media-size-m--skip--1-4 {
    margin-left: 25%;
  }

  .grid-column--media-size-m--pull--1-4 {
    right: 25%;
  }

  .grid-column--media-size-m--push--1-4 {
    left: 25%;
  }

  .grid-column--media-size-m--pull--1-4,
  .grid-column--media-size-m--push--1-4 {
    position: relative;
  }

  .grid-column--media-size-m--2-4 {
    width: 50%;
  }

  .grid-column--media-size-m--skip--2-4 {
    margin-left: 50%;
  }

  .grid-column--media-size-m--pull--2-4 {
    right: 50%;
  }

  .grid-column--media-size-m--push--2-4 {
    left: 50%;
  }

  .grid-column--media-size-m--pull--2-4,
  .grid-column--media-size-m--push--2-4 {
    position: relative;
  }

  .grid-column--media-size-m--3-4 {
    width: 75%;
  }

  .grid-column--media-size-m--skip--3-4 {
    margin-left: 75%;
  }

  .grid-column--media-size-m--pull--3-4 {
    right: 75%;
  }

  .grid-column--media-size-m--push--3-4 {
    left: 75%;
  }

  .grid-column--media-size-m--pull--3-4,
  .grid-column--media-size-m--push--3-4 {
    position: relative;
  }

  .grid-column--media-size-m--4-4 {
    width: 100%;
  }

  .grid-column--media-size-m--skip--4-4 {
    margin-left: 100%;
  }

  .grid-column--media-size-m--pull--4-4 {
    right: 100%;
  }

  .grid-column--media-size-m--push--4-4 {
    left: 100%;
  }

  .grid-column--media-size-m--pull--4-4,
  .grid-column--media-size-m--push--4-4 {
    position: relative;
  }

  .grid-column--media-size-m--1-5 {
    width: 20%;
  }

  .grid-column--media-size-m--skip--1-5 {
    margin-left: 20%;
  }

  .grid-column--media-size-m--pull--1-5 {
    right: 20%;
  }

  .grid-column--media-size-m--push--1-5 {
    left: 20%;
  }

  .grid-column--media-size-m--pull--1-5,
  .grid-column--media-size-m--push--1-5 {
    position: relative;
  }

  .grid-column--media-size-m--2-5 {
    width: 40%;
  }

  .grid-column--media-size-m--skip--2-5 {
    margin-left: 40%;
  }

  .grid-column--media-size-m--pull--2-5 {
    right: 40%;
  }

  .grid-column--media-size-m--push--2-5 {
    left: 40%;
  }

  .grid-column--media-size-m--pull--2-5,
  .grid-column--media-size-m--push--2-5 {
    position: relative;
  }

  .grid-column--media-size-m--3-5 {
    width: 60%;
  }

  .grid-column--media-size-m--skip--3-5 {
    margin-left: 60%;
  }

  .grid-column--media-size-m--pull--3-5 {
    right: 60%;
  }

  .grid-column--media-size-m--push--3-5 {
    left: 60%;
  }

  .grid-column--media-size-m--pull--3-5,
  .grid-column--media-size-m--push--3-5 {
    position: relative;
  }

  .grid-column--media-size-m--4-5 {
    width: 80%;
  }

  .grid-column--media-size-m--skip--4-5 {
    margin-left: 80%;
  }

  .grid-column--media-size-m--pull--4-5 {
    right: 80%;
  }

  .grid-column--media-size-m--push--4-5 {
    left: 80%;
  }

  .grid-column--media-size-m--pull--4-5,
  .grid-column--media-size-m--push--4-5 {
    position: relative;
  }

  .grid-column--media-size-m--5-5 {
    width: 100%;
  }

  .grid-column--media-size-m--skip--5-5 {
    margin-left: 100%;
  }

  .grid-column--media-size-m--pull--5-5 {
    right: 100%;
  }

  .grid-column--media-size-m--push--5-5 {
    left: 100%;
  }

  .grid-column--media-size-m--pull--5-5,
  .grid-column--media-size-m--push--5-5 {
    position: relative;
  }

  .grid-column--media-size-m--1-6 {
    width: 16.66667%;
  }

  .grid-column--media-size-m--skip--1-6 {
    margin-left: 16.66667%;
  }

  .grid-column--media-size-m--pull--1-6 {
    right: 16.66667%;
  }

  .grid-column--media-size-m--push--1-6 {
    left: 16.66667%;
  }

  .grid-column--media-size-m--pull--1-6,
  .grid-column--media-size-m--push--1-6 {
    position: relative;
  }

  .grid-column--media-size-m--2-6 {
    width: 33.33333%;
  }

  .grid-column--media-size-m--skip--2-6 {
    margin-left: 33.33333%;
  }

  .grid-column--media-size-m--pull--2-6 {
    right: 33.33333%;
  }

  .grid-column--media-size-m--push--2-6 {
    left: 33.33333%;
  }

  .grid-column--media-size-m--pull--2-6,
  .grid-column--media-size-m--push--2-6 {
    position: relative;
  }

  .grid-column--media-size-m--3-6 {
    width: 50%;
  }

  .grid-column--media-size-m--skip--3-6 {
    margin-left: 50%;
  }

  .grid-column--media-size-m--pull--3-6 {
    right: 50%;
  }

  .grid-column--media-size-m--push--3-6 {
    left: 50%;
  }

  .grid-column--media-size-m--pull--3-6,
  .grid-column--media-size-m--push--3-6 {
    position: relative;
  }

  .grid-column--media-size-m--4-6 {
    width: 66.66667%;
  }

  .grid-column--media-size-m--skip--4-6 {
    margin-left: 66.66667%;
  }

  .grid-column--media-size-m--pull--4-6 {
    right: 66.66667%;
  }

  .grid-column--media-size-m--push--4-6 {
    left: 66.66667%;
  }

  .grid-column--media-size-m--pull--4-6,
  .grid-column--media-size-m--push--4-6 {
    position: relative;
  }

  .grid-column--media-size-m--5-6 {
    width: 83.33333%;
  }

  .grid-column--media-size-m--skip--5-6 {
    margin-left: 83.33333%;
  }

  .grid-column--media-size-m--pull--5-6 {
    right: 83.33333%;
  }

  .grid-column--media-size-m--push--5-6 {
    left: 83.33333%;
  }

  .grid-column--media-size-m--pull--5-6,
  .grid-column--media-size-m--push--5-6 {
    position: relative;
  }

  .grid-column--media-size-m--6-6 {
    width: 100%;
  }

  .grid-column--media-size-m--skip--6-6 {
    margin-left: 100%;
  }

  .grid-column--media-size-m--pull--6-6 {
    right: 100%;
  }

  .grid-column--media-size-m--push--6-6 {
    left: 100%;
  }

  .grid-column--media-size-m--pull--6-6,
  .grid-column--media-size-m--push--6-6 {
    position: relative;
  }

  .grid-column--media-size-m--1-12 {
    width: 8.33333%;
  }

  .grid-column--media-size-m--skip--1-12 {
    margin-left: 8.33333%;
  }

  .grid-column--media-size-m--pull--1-12 {
    right: 8.33333%;
  }

  .grid-column--media-size-m--push--1-12 {
    left: 8.33333%;
  }

  .grid-column--media-size-m--pull--1-12,
  .grid-column--media-size-m--push--1-12 {
    position: relative;
  }

  .grid-column--media-size-m--2-12 {
    width: 16.66667%;
  }

  .grid-column--media-size-m--skip--2-12 {
    margin-left: 16.66667%;
  }

  .grid-column--media-size-m--pull--2-12 {
    right: 16.66667%;
  }

  .grid-column--media-size-m--push--2-12 {
    left: 16.66667%;
  }

  .grid-column--media-size-m--pull--2-12,
  .grid-column--media-size-m--push--2-12 {
    position: relative;
  }

  .grid-column--media-size-m--3-12 {
    width: 25%;
  }

  .grid-column--media-size-m--skip--3-12 {
    margin-left: 25%;
  }

  .grid-column--media-size-m--pull--3-12 {
    right: 25%;
  }

  .grid-column--media-size-m--push--3-12 {
    left: 25%;
  }

  .grid-column--media-size-m--pull--3-12,
  .grid-column--media-size-m--push--3-12 {
    position: relative;
  }

  .grid-column--media-size-m--4-12 {
    width: 33.33333%;
  }

  .grid-column--media-size-m--skip--4-12 {
    margin-left: 33.33333%;
  }

  .grid-column--media-size-m--pull--4-12 {
    right: 33.33333%;
  }

  .grid-column--media-size-m--push--4-12 {
    left: 33.33333%;
  }

  .grid-column--media-size-m--pull--4-12,
  .grid-column--media-size-m--push--4-12 {
    position: relative;
  }

  .grid-column--media-size-m--5-12 {
    width: 41.66667%;
  }

  .grid-column--media-size-m--skip--5-12 {
    margin-left: 41.66667%;
  }

  .grid-column--media-size-m--pull--5-12 {
    right: 41.66667%;
  }

  .grid-column--media-size-m--push--5-12 {
    left: 41.66667%;
  }

  .grid-column--media-size-m--pull--5-12,
  .grid-column--media-size-m--push--5-12 {
    position: relative;
  }

  .grid-column--media-size-m--6-12 {
    width: 50%;
  }

  .grid-column--media-size-m--skip--6-12 {
    margin-left: 50%;
  }

  .grid-column--media-size-m--pull--6-12 {
    right: 50%;
  }

  .grid-column--media-size-m--push--6-12 {
    left: 50%;
  }

  .grid-column--media-size-m--pull--6-12,
  .grid-column--media-size-m--push--6-12 {
    position: relative;
  }

  .grid-column--media-size-m--7-12 {
    width: 58.33333%;
  }

  .grid-column--media-size-m--skip--7-12 {
    margin-left: 58.33333%;
  }

  .grid-column--media-size-m--pull--7-12 {
    right: 58.33333%;
  }

  .grid-column--media-size-m--push--7-12 {
    left: 58.33333%;
  }

  .grid-column--media-size-m--pull--7-12,
  .grid-column--media-size-m--push--7-12 {
    position: relative;
  }

  .grid-column--media-size-m--8-12 {
    width: 66.66667%;
  }

  .grid-column--media-size-m--skip--8-12 {
    margin-left: 66.66667%;
  }

  .grid-column--media-size-m--pull--8-12 {
    right: 66.66667%;
  }

  .grid-column--media-size-m--push--8-12 {
    left: 66.66667%;
  }

  .grid-column--media-size-m--pull--8-12,
  .grid-column--media-size-m--push--8-12 {
    position: relative;
  }

  .grid-column--media-size-m--9-12 {
    width: 75%;
  }

  .grid-column--media-size-m--skip--9-12 {
    margin-left: 75%;
  }

  .grid-column--media-size-m--pull--9-12 {
    right: 75%;
  }

  .grid-column--media-size-m--push--9-12 {
    left: 75%;
  }

  .grid-column--media-size-m--pull--9-12,
  .grid-column--media-size-m--push--9-12 {
    position: relative;
  }

  .grid-column--media-size-m--10-12 {
    width: 83.33333%;
  }

  .grid-column--media-size-m--skip--10-12 {
    margin-left: 83.33333%;
  }

  .grid-column--media-size-m--pull--10-12 {
    right: 83.33333%;
  }

  .grid-column--media-size-m--push--10-12 {
    left: 83.33333%;
  }

  .grid-column--media-size-m--pull--10-12,
  .grid-column--media-size-m--push--10-12 {
    position: relative;
  }

  .grid-column--media-size-m--11-12 {
    width: 91.66667%;
  }

  .grid-column--media-size-m--skip--11-12 {
    margin-left: 91.66667%;
  }

  .grid-column--media-size-m--pull--11-12 {
    right: 91.66667%;
  }

  .grid-column--media-size-m--push--11-12 {
    left: 91.66667%;
  }

  .grid-column--media-size-m--pull--11-12,
  .grid-column--media-size-m--push--11-12 {
    position: relative;
  }

  .grid-column--media-size-m--12-12 {
    width: 100%;
  }

  .grid-column--media-size-m--skip--12-12 {
    margin-left: 100%;
  }

  .grid-column--media-size-m--pull--12-12 {
    right: 100%;
  }

  .grid-column--media-size-m--push--12-12 {
    left: 100%;
  }

  .grid-column--media-size-m--pull--12-12,
  .grid-column--media-size-m--push--12-12 {
    position: relative;
  }

  .grid-column--media-size-m--newrow {
    clear: both;
  }

  .grid-column--media-size-m--center {
    float: none;
    clear: both;
    margin-left: auto;
    margin-right: auto;
  }

  .grid-column--media-size-m--hidden {
    display: none;
  }

  .grid-column--media-size-m--content-align--left {
    text-align: left;
  }

  .grid-column--media-size-m--content-align--right {
    text-align: right;
  }

  .grid-column--media-size-m--content-align--center {
    text-align: center;
  }
}
@media only screen and (min-width: 1024px) {
  .grid-column--media-size-l--1-1 {
    width: 100%;
  }

  .grid-column--media-size-l--skip--1-1 {
    margin-left: 100%;
  }

  .grid-column--media-size-l--pull--1-1 {
    right: 100%;
  }

  .grid-column--media-size-l--push--1-1 {
    left: 100%;
  }

  .grid-column--media-size-l--pull--1-1,
  .grid-column--media-size-l--push--1-1 {
    position: relative;
  }

  .grid-column--media-size-l--1-2 {
    width: 50%;
  }

  .grid-column--media-size-l--skip--1-2 {
    margin-left: 50%;
  }

  .grid-column--media-size-l--pull--1-2 {
    right: 50%;
  }

  .grid-column--media-size-l--push--1-2 {
    left: 50%;
  }

  .grid-column--media-size-l--pull--1-2,
  .grid-column--media-size-l--push--1-2 {
    position: relative;
  }

  .grid-column--media-size-l--2-2 {
    width: 100%;
  }

  .grid-column--media-size-l--skip--2-2 {
    margin-left: 100%;
  }

  .grid-column--media-size-l--pull--2-2 {
    right: 100%;
  }

  .grid-column--media-size-l--push--2-2 {
    left: 100%;
  }

  .grid-column--media-size-l--pull--2-2,
  .grid-column--media-size-l--push--2-2 {
    position: relative;
  }

  .grid-column--media-size-l--1-3 {
    width: 33.33333%;
  }

  .grid-column--media-size-l--skip--1-3 {
    margin-left: 33.33333%;
  }

  .grid-column--media-size-l--pull--1-3 {
    right: 33.33333%;
  }

  .grid-column--media-size-l--push--1-3 {
    left: 33.33333%;
  }

  .grid-column--media-size-l--pull--1-3,
  .grid-column--media-size-l--push--1-3 {
    position: relative;
  }

  .grid-column--media-size-l--2-3 {
    width: 66.66667%;
  }

  .grid-column--media-size-l--skip--2-3 {
    margin-left: 66.66667%;
  }

  .grid-column--media-size-l--pull--2-3 {
    right: 66.66667%;
  }

  .grid-column--media-size-l--push--2-3 {
    left: 66.66667%;
  }

  .grid-column--media-size-l--pull--2-3,
  .grid-column--media-size-l--push--2-3 {
    position: relative;
  }

  .grid-column--media-size-l--3-3 {
    width: 100%;
  }

  .grid-column--media-size-l--skip--3-3 {
    margin-left: 100%;
  }

  .grid-column--media-size-l--pull--3-3 {
    right: 100%;
  }

  .grid-column--media-size-l--push--3-3 {
    left: 100%;
  }

  .grid-column--media-size-l--pull--3-3,
  .grid-column--media-size-l--push--3-3 {
    position: relative;
  }

  .grid-column--media-size-l--1-4 {
    width: 25%;
  }

  .grid-column--media-size-l--skip--1-4 {
    margin-left: 25%;
  }

  .grid-column--media-size-l--pull--1-4 {
    right: 25%;
  }

  .grid-column--media-size-l--push--1-4 {
    left: 25%;
  }

  .grid-column--media-size-l--pull--1-4,
  .grid-column--media-size-l--push--1-4 {
    position: relative;
  }

  .grid-column--media-size-l--2-4 {
    width: 50%;
  }

  .grid-column--media-size-l--skip--2-4 {
    margin-left: 50%;
  }

  .grid-column--media-size-l--pull--2-4 {
    right: 50%;
  }

  .grid-column--media-size-l--push--2-4 {
    left: 50%;
  }

  .grid-column--media-size-l--pull--2-4,
  .grid-column--media-size-l--push--2-4 {
    position: relative;
  }

  .grid-column--media-size-l--3-4 {
    width: 75%;
  }

  .grid-column--media-size-l--skip--3-4 {
    margin-left: 75%;
  }

  .grid-column--media-size-l--pull--3-4 {
    right: 75%;
  }

  .grid-column--media-size-l--push--3-4 {
    left: 75%;
  }

  .grid-column--media-size-l--pull--3-4,
  .grid-column--media-size-l--push--3-4 {
    position: relative;
  }

  .grid-column--media-size-l--4-4 {
    width: 100%;
  }

  .grid-column--media-size-l--skip--4-4 {
    margin-left: 100%;
  }

  .grid-column--media-size-l--pull--4-4 {
    right: 100%;
  }

  .grid-column--media-size-l--push--4-4 {
    left: 100%;
  }

  .grid-column--media-size-l--pull--4-4,
  .grid-column--media-size-l--push--4-4 {
    position: relative;
  }

  .grid-column--media-size-l--1-5 {
    width: 20%;
  }

  .grid-column--media-size-l--skip--1-5 {
    margin-left: 20%;
  }

  .grid-column--media-size-l--pull--1-5 {
    right: 20%;
  }

  .grid-column--media-size-l--push--1-5 {
    left: 20%;
  }

  .grid-column--media-size-l--pull--1-5,
  .grid-column--media-size-l--push--1-5 {
    position: relative;
  }

  .grid-column--media-size-l--2-5 {
    width: 40%;
  }

  .grid-column--media-size-l--skip--2-5 {
    margin-left: 40%;
  }

  .grid-column--media-size-l--pull--2-5 {
    right: 40%;
  }

  .grid-column--media-size-l--push--2-5 {
    left: 40%;
  }

  .grid-column--media-size-l--pull--2-5,
  .grid-column--media-size-l--push--2-5 {
    position: relative;
  }

  .grid-column--media-size-l--3-5 {
    width: 60%;
  }

  .grid-column--media-size-l--skip--3-5 {
    margin-left: 60%;
  }

  .grid-column--media-size-l--pull--3-5 {
    right: 60%;
  }

  .grid-column--media-size-l--push--3-5 {
    left: 60%;
  }

  .grid-column--media-size-l--pull--3-5,
  .grid-column--media-size-l--push--3-5 {
    position: relative;
  }

  .grid-column--media-size-l--4-5 {
    width: 80%;
  }

  .grid-column--media-size-l--skip--4-5 {
    margin-left: 80%;
  }

  .grid-column--media-size-l--pull--4-5 {
    right: 80%;
  }

  .grid-column--media-size-l--push--4-5 {
    left: 80%;
  }

  .grid-column--media-size-l--pull--4-5,
  .grid-column--media-size-l--push--4-5 {
    position: relative;
  }

  .grid-column--media-size-l--5-5 {
    width: 100%;
  }

  .grid-column--media-size-l--skip--5-5 {
    margin-left: 100%;
  }

  .grid-column--media-size-l--pull--5-5 {
    right: 100%;
  }

  .grid-column--media-size-l--push--5-5 {
    left: 100%;
  }

  .grid-column--media-size-l--pull--5-5,
  .grid-column--media-size-l--push--5-5 {
    position: relative;
  }

  .grid-column--media-size-l--1-6 {
    width: 16.66667%;
  }

  .grid-column--media-size-l--skip--1-6 {
    margin-left: 16.66667%;
  }

  .grid-column--media-size-l--pull--1-6 {
    right: 16.66667%;
  }

  .grid-column--media-size-l--push--1-6 {
    left: 16.66667%;
  }

  .grid-column--media-size-l--pull--1-6,
  .grid-column--media-size-l--push--1-6 {
    position: relative;
  }

  .grid-column--media-size-l--2-6 {
    width: 33.33333%;
  }

  .grid-column--media-size-l--skip--2-6 {
    margin-left: 33.33333%;
  }

  .grid-column--media-size-l--pull--2-6 {
    right: 33.33333%;
  }

  .grid-column--media-size-l--push--2-6 {
    left: 33.33333%;
  }

  .grid-column--media-size-l--pull--2-6,
  .grid-column--media-size-l--push--2-6 {
    position: relative;
  }

  .grid-column--media-size-l--3-6 {
    width: 50%;
  }

  .grid-column--media-size-l--skip--3-6 {
    margin-left: 50%;
  }

  .grid-column--media-size-l--pull--3-6 {
    right: 50%;
  }

  .grid-column--media-size-l--push--3-6 {
    left: 50%;
  }

  .grid-column--media-size-l--pull--3-6,
  .grid-column--media-size-l--push--3-6 {
    position: relative;
  }

  .grid-column--media-size-l--4-6 {
    width: 66.66667%;
  }

  .grid-column--media-size-l--skip--4-6 {
    margin-left: 66.66667%;
  }

  .grid-column--media-size-l--pull--4-6 {
    right: 66.66667%;
  }

  .grid-column--media-size-l--push--4-6 {
    left: 66.66667%;
  }

  .grid-column--media-size-l--pull--4-6,
  .grid-column--media-size-l--push--4-6 {
    position: relative;
  }

  .grid-column--media-size-l--5-6 {
    width: 83.33333%;
  }

  .grid-column--media-size-l--skip--5-6 {
    margin-left: 83.33333%;
  }

  .grid-column--media-size-l--pull--5-6 {
    right: 83.33333%;
  }

  .grid-column--media-size-l--push--5-6 {
    left: 83.33333%;
  }

  .grid-column--media-size-l--pull--5-6,
  .grid-column--media-size-l--push--5-6 {
    position: relative;
  }

  .grid-column--media-size-l--6-6 {
    width: 100%;
  }

  .grid-column--media-size-l--skip--6-6 {
    margin-left: 100%;
  }

  .grid-column--media-size-l--pull--6-6 {
    right: 100%;
  }

  .grid-column--media-size-l--push--6-6 {
    left: 100%;
  }

  .grid-column--media-size-l--pull--6-6,
  .grid-column--media-size-l--push--6-6 {
    position: relative;
  }

  .grid-column--media-size-l--1-12 {
    width: 8.33333%;
  }

  .grid-column--media-size-l--skip--1-12 {
    margin-left: 8.33333%;
  }

  .grid-column--media-size-l--pull--1-12 {
    right: 8.33333%;
  }

  .grid-column--media-size-l--push--1-12 {
    left: 8.33333%;
  }

  .grid-column--media-size-l--pull--1-12,
  .grid-column--media-size-l--push--1-12 {
    position: relative;
  }

  .grid-column--media-size-l--2-12 {
    width: 16.66667%;
  }

  .grid-column--media-size-l--skip--2-12 {
    margin-left: 16.66667%;
  }

  .grid-column--media-size-l--pull--2-12 {
    right: 16.66667%;
  }

  .grid-column--media-size-l--push--2-12 {
    left: 16.66667%;
  }

  .grid-column--media-size-l--pull--2-12,
  .grid-column--media-size-l--push--2-12 {
    position: relative;
  }

  .grid-column--media-size-l--3-12 {
    width: 25%;
  }

  .grid-column--media-size-l--skip--3-12 {
    margin-left: 25%;
  }

  .grid-column--media-size-l--pull--3-12 {
    right: 25%;
  }

  .grid-column--media-size-l--push--3-12 {
    left: 25%;
  }

  .grid-column--media-size-l--pull--3-12,
  .grid-column--media-size-l--push--3-12 {
    position: relative;
  }

  .grid-column--media-size-l--4-12 {
    width: 33.33333%;
  }

  .grid-column--media-size-l--skip--4-12 {
    margin-left: 33.33333%;
  }

  .grid-column--media-size-l--pull--4-12 {
    right: 33.33333%;
  }

  .grid-column--media-size-l--push--4-12 {
    left: 33.33333%;
  }

  .grid-column--media-size-l--pull--4-12,
  .grid-column--media-size-l--push--4-12 {
    position: relative;
  }

  .grid-column--media-size-l--5-12 {
    width: 41.66667%;
  }

  .grid-column--media-size-l--skip--5-12 {
    margin-left: 41.66667%;
  }

  .grid-column--media-size-l--pull--5-12 {
    right: 41.66667%;
  }

  .grid-column--media-size-l--push--5-12 {
    left: 41.66667%;
  }

  .grid-column--media-size-l--pull--5-12,
  .grid-column--media-size-l--push--5-12 {
    position: relative;
  }

  .grid-column--media-size-l--6-12 {
    width: 50%;
  }

  .grid-column--media-size-l--skip--6-12 {
    margin-left: 50%;
  }

  .grid-column--media-size-l--pull--6-12 {
    right: 50%;
  }

  .grid-column--media-size-l--push--6-12 {
    left: 50%;
  }

  .grid-column--media-size-l--pull--6-12,
  .grid-column--media-size-l--push--6-12 {
    position: relative;
  }

  .grid-column--media-size-l--7-12 {
    width: 58.33333%;
  }

  .grid-column--media-size-l--skip--7-12 {
    margin-left: 58.33333%;
  }

  .grid-column--media-size-l--pull--7-12 {
    right: 58.33333%;
  }

  .grid-column--media-size-l--push--7-12 {
    left: 58.33333%;
  }

  .grid-column--media-size-l--pull--7-12,
  .grid-column--media-size-l--push--7-12 {
    position: relative;
  }

  .grid-column--media-size-l--8-12 {
    width: 66.66667%;
  }

  .grid-column--media-size-l--skip--8-12 {
    margin-left: 66.66667%;
  }

  .grid-column--media-size-l--pull--8-12 {
    right: 66.66667%;
  }

  .grid-column--media-size-l--push--8-12 {
    left: 66.66667%;
  }

  .grid-column--media-size-l--pull--8-12,
  .grid-column--media-size-l--push--8-12 {
    position: relative;
  }

  .grid-column--media-size-l--9-12 {
    width: 75%;
  }

  .grid-column--media-size-l--skip--9-12 {
    margin-left: 75%;
  }

  .grid-column--media-size-l--pull--9-12 {
    right: 75%;
  }

  .grid-column--media-size-l--push--9-12 {
    left: 75%;
  }

  .grid-column--media-size-l--pull--9-12,
  .grid-column--media-size-l--push--9-12 {
    position: relative;
  }

  .grid-column--media-size-l--10-12 {
    width: 83.33333%;
  }

  .grid-column--media-size-l--skip--10-12 {
    margin-left: 83.33333%;
  }

  .grid-column--media-size-l--pull--10-12 {
    right: 83.33333%;
  }

  .grid-column--media-size-l--push--10-12 {
    left: 83.33333%;
  }

  .grid-column--media-size-l--pull--10-12,
  .grid-column--media-size-l--push--10-12 {
    position: relative;
  }

  .grid-column--media-size-l--11-12 {
    width: 91.66667%;
  }

  .grid-column--media-size-l--skip--11-12 {
    margin-left: 91.66667%;
  }

  .grid-column--media-size-l--pull--11-12 {
    right: 91.66667%;
  }

  .grid-column--media-size-l--push--11-12 {
    left: 91.66667%;
  }

  .grid-column--media-size-l--pull--11-12,
  .grid-column--media-size-l--push--11-12 {
    position: relative;
  }

  .grid-column--media-size-l--12-12 {
    width: 100%;
  }

  .grid-column--media-size-l--skip--12-12 {
    margin-left: 100%;
  }

  .grid-column--media-size-l--pull--12-12 {
    right: 100%;
  }

  .grid-column--media-size-l--push--12-12 {
    left: 100%;
  }

  .grid-column--media-size-l--pull--12-12,
  .grid-column--media-size-l--push--12-12 {
    position: relative;
  }

  .grid-column--media-size-l--newrow {
    clear: both;
  }

  .grid-column--media-size-l--center {
    float: none;
    clear: both;
    margin-left: auto;
    margin-right: auto;
  }

  .grid-column--media-size-l--hidden {
    display: none;
  }

  .grid-column--media-size-l--content-align--left {
    text-align: left;
  }

  .grid-column--media-size-l--content-align--right {
    text-align: right;
  }

  .grid-column--media-size-l--content-align--center {
    text-align: center;
  }
}
/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .color
 *
 * Colours. Foreground and background colours. Any flavour. Come on folks, buy my colours!
 */
/* Foreground colours. */
.color--fg--brand {
  color: #ed1c24;
}

.color--fg--light-0 {
  color: white;
}

.color--fg--light-1 {
  color: #e5e5e5;
}

.color--fg--medium-1 {
  color: #d9d9d9;
}

.color--fg--medium-3 {
  color: #a4a4a4;
}

.color--fg--medium-4 {
  color: #5f5f5f;
}

.color--fg--dark-0 {
  color: black;
}

.color--fg--dark-2 {
  color: #242425;
}

.color--fg--dark-3 {
  color: #3a3a3b;
}

/* Background colours. */
.color--bg--brand {
  background-color: #ed1c24;
}

.color--bg--light-0 {
  background-color: white;
}

.color--bg--light-1 {
  background-color: #e5e5e5;
}

.color--bg--medium-1 {
  background-color: #d9d9d9;
}

.color--bg--medium-2 {
  background-color: #a4a4a4;
}

.color--bg--medium-3 {
  background-color: #a4a4a4;
}

.color--bg--dark-0 {
  background-color: black;
}

.color--bg--dark-2 {
  background-color: #242425;
}

.color--bg--dark-3 {
  background-color: #3a3a3b;
}

.color--bg--dark-0, .color--bg--dark-0 a, .color--bg--dark-0 h1, .color--bg--dark-0 h2, .color--bg--dark-0 h3, .color--bg--dark-0 h4, .color--bg--dark-0 h5, .color--bg--dark-0 h6,
.color--bg--dark-2,
.color--bg--dark-2 a,
.color--bg--dark-2 h1,
.color--bg--dark-2 h2,
.color--bg--dark-2 h3,
.color--bg--dark-2 h4,
.color--bg--dark-2 h5,
.color--bg--dark-2 h6,
.color--bg--dark-3,
.color--bg--dark-3 a,
.color--bg--dark-3 h1,
.color--bg--dark-3 h2,
.color--bg--dark-3 h3,
.color--bg--dark-3 h4,
.color--bg--dark-3 h5,
.color--bg--dark-3 h6 {
  color: white;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .small
 *
 * Small font size.
 */
.small {
  font-size: 13px;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .input
 *
 * Module to style input elements.
 */
.input,
.input[disabled],
.input[type="search"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  display: inline-block;
  background-color: none;
  border: none;
  padding: 10px 10px;
  font-family: inherit;
  font-size: 15px;
  line-height: 20px;
}

.input2,
.input2[disabled],
.input2[type="search"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  display: inline-block;
  background-color: none;
  border: none;
  padding: 8px 23px;
  font-family: inherit;
  font-size: 15px;
  line-height: 20px;
}

.input-red,
.input-red[disabled],
.input-red[type="search"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  -ms-border-radius: 1px;
  -o-border-radius: 1px;
  border-radius: 1px;
  display: inline-block;
  background-color: none;
  border: none;
  padding: 7px 10px;
  margin-right: 20px;
  font-family: inherit;
  font-size: 15px;
  line-height: 20px;
}

.input--expand {
  width: 100%;
  display: block;
}
.input--expand, .input--expand[type="search"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.input--expand2 {
  width: 100%;
  display: block;
  position: relative;
  left: -12px;
}
.input--expand2, .input--expand2[type="search"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.input--expand-red {
  width: 100%;
  display: block;
  background-color: #ed1c24;
  color: white;
  padding-left: 10px;
}
.input--expand-red, .input--expand-red[type="search"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.input--search {
  width: 70%;
  display: block;
}
.input--search, .input--search[type="search"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.input--search-white {
  width: 80%;
  display: block;
}
.input--search-white, .input--search-white[type="search"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.input--search-white-image {
  position: relative;
  right: -30px;
  top: 7px;
  width: 25px;
  height: 25px;
  z-index: 30;
  border: 0 !important;
  background-image: url("/materials/search_btn.jpg");
}

.input-label {
  display: inline-block;
  line-height: 20px;
  padding-top: 8px;
  padding-bottom: 8px;
}

.input--text,
.input--search,
.input--search-white,
.input--dropdown,
.input--checkbox {
  -webkit-transition: border 250ms;
  -moz-transition: border 250ms;
  -o-transition: border 250ms;
  transition: border 250ms;
  border: 1px solid #d9d9d9;
}
.input--text:focus,
.input--search:focus,
.input--search-white:focus,
.input--dropdown:focus,
.input--checkbox:focus {
  outline: none;
  border-color: #59595a;
}
.input--text.input--text--alternate,
.input--search.input--text--alternate,
.input--search-white.input--text--alternate,
.input--dropdown.input--text--alternate,
.input--checkbox.input--text--alternate {
  -webkit-box-shadow: inset 2px 2px 0 0 black;
  -moz-box-shadow: inset 2px 2px 0 0 black;
  box-shadow: inset 2px 2px 0 0 black;
  background-color: #242425;
}
.input--text.input--text--alternate, .input--text.input--text--alternate a,
.input--search.input--text--alternate,
.input--search.input--text--alternate a,
.input--search-white.input--text--alternate,
.input--search-white.input--text--alternate a,
.input--dropdown.input--text--alternate,
.input--dropdown.input--text--alternate a,
.input--checkbox.input--text--alternate,
.input--checkbox.input--text--alternate a {
  color: white;
}
.input--text.input--text--alternate, .input--text.input--text--alternate:focus,
.input--search.input--text--alternate,
.input--search.input--text--alternate:focus,
.input--search-white.input--text--alternate,
.input--search-white.input--text--alternate:focus,
.input--dropdown.input--text--alternate,
.input--dropdown.input--text--alternate:focus,
.input--checkbox.input--text--alternate,
.input--checkbox.input--text--alternate:focus {
  border: none;
}

.input--dropdown2 {
  -webkit-transition: border 250ms;
  -moz-transition: border 250ms;
  -o-transition: border 250ms;
  transition: border 250ms;
}
.input--dropdown2:focus {
  outline: none;
  border-color: #59595a;
}
.input--dropdown2.input--text--alternate {
  -webkit-box-shadow: inset 2px 2px 0 0 black;
  -moz-box-shadow: inset 2px 2px 0 0 black;
  box-shadow: inset 2px 2px 0 0 black;
  background-color: #242425;
}
.input--dropdown2.input--text--alternate, .input--dropdown2.input--text--alternate a {
  color: white;
}
.input--dropdown2.input--text--alternate, .input--dropdown2.input--text--alternate:focus {
  border: none;
}

.input--dropdown {
  display: block;
  position: relative;
}
.input--dropdown:after {
  content: "";
  pointer-events: none;
  position: absolute;
  top: 50%;
  right: 10px;
  margin-top: -5px;
}

.input--dropdown2 {
  display: block;
  position: relative;
  left: 5px;
}
.input--dropdown2:before {
  content: "";
  pointer-events: none;
  position: absolute;
  top: 50%;
  left: -7px;
  margin-top: -5px;
  z-index: 102;
}

.input--dropdown-red {
  display: block;
  position: relative;
}
.input--dropdown-red:after {
  content: "";
  pointer-events: none;
  position: absolute;
  top: 50%;
  right: 10px;
  margin-top: -5px;
  padding-left: 10px;
}

.input--checkbox {
  padding: 4px 3px;
  vertical-align: middle;
}
.input--checkbox input {
  width: 14px;
  height: 12px;
}

.input--submit {
  padding: 4px 3px;
  vertical-align: middle;
}

.input--search {
  display: block;
  position: relative;
}
.input--search:after {
  content: "";
  pointer-events: none;
  position: absolute;
  top: 50%;
  right: 10px;
  margin-top: -5px;
}

.input--button {
  -webkit-transition: color 250ms, background 250ms;
  -moz-transition: color 250ms, background 250ms;
  -o-transition: color 250ms, background 250ms;
  transition: color 250ms, background 250ms;
  text-align: center;
  text-decoration: none;
  background-color: #ed1c24;
}
.input--button, .input--button[disabled] {
  padding-left: 25px;
  padding-right: 25px;
}
.input--button:hover {
  background-color: #ff2d35;
}
.input--button[disabled], .input--button[disabled]:hover {
  background-color: #242425;
}
.input--button.input--button--action:after {
  content: "";
  margin-left: 10px;
}
.input--button.input--button--secondary {
  background-color: #3a3a3b;
}
.input--button.input--button--secondary:hover {
  background-color: black;
}

.input--button,
a.input--button:hover {
  color: white;
}
.input--button[disabled],
a.input--button:hover[disabled] {
  color: #a4a4a4;
}

.input--button2 {
  -webkit-transition: color 250ms, background 250ms;
  -moz-transition: color 250ms, background 250ms;
  -o-transition: color 250ms, background 250ms;
  transition: color 250ms, background 250ms;
  text-align: center;
  text-decoration: none;
  background-color: #0099FF;
}
.input--button2, .input--button2[disabled] {
  padding-left: 25px;
  padding-right: 25px;
}
.input--button2:hover {
  background-color: #00CCFF;
}
.input--button2[disabled], .input--button2[disabled]:hover {
  background-color: #242425;
}
.input--button2.input--button--action:after {
  content: "";
  margin-left: 10px;
}
.input--button2.input--button--secondary {
  background-color: #3a3a3b;
}
.input--button2.input--button--secondary:hover {
  background-color: black;
}

.input--button2,
a.input--button2:hover {
  color: white;
}
.input--button2[disabled],
a.input--button2:hover[disabled] {
  color: #a4a4a4;
}

.input--button3 {
  -webkit-transition: color 250ms, background 250ms;
  -moz-transition: color 250ms, background 250ms;
  -o-transition: color 250ms, background 250ms;
  transition: color 250ms, background 250ms;
  text-align: center;
  text-decoration: none;
  background-color: #FF9933;
}
.input--button3, .input--button3[disabled] {
  padding-left: 25px;
  padding-right: 25px;
}
.input--button3:hover {
  background-color: #FF9966;
}
.input--button3[disabled], .input--button3[disabled]:hover {
  background-color: #242425;
}
.input--button3.input--button--action:after {
  content: "";
  margin-left: 10px;
}
.input--button3.input--button--secondary {
  background-color: #3a3a3b;
}
.input--button3.input--button--secondary:hover {
  background-color: black;
}

.input--button3,
a.input--button3:hover {
  color: white;
}
.input--button3[disabled],
a.input--button3:hover[disabled] {
  color: #a4a4a4;
}

/*
.input--text--alternate[type="search"] {
    font-size: 21px;
    padding: {
        top: .4 * $base-rhythm-unit + px;
        bottom: .4 * $base-rhythm-unit + px;
    }
    text-transform: uppercase;
    background: transparent;
    @include box-shadow(none);

    &:focus {
        outline: none;
    }
}
*/
#searchWrap input[type="text"] {
  width: 250px;
  height: 35px;
  border: 1px solid #C8C8D2;
  padding-right: 10px;
  padding-left: 15px;
  left: 0px;
  position: relative;
  outline: none;
  font-size: 14px;
  color: #000;
  -moz-box-shadow: inset 0px 0px 15px #f7f7f7;
  -webkit-box-shadow: inset 0px 0px 15px #f7f7f7;
  box-shadow: inset 0px 0px 15px #f7f7f7;
  background: white;
  margin-top: 0 !important;
}

#searchWrap_emp input[type="text"] {
  width: 250px;
  height: 35px;
  border: 1px solid #C8C8D2;
  padding-right: 10px;
  padding-left: 15px;
  left: 0px;
  position: relative;
  outline: none;
  font-size: 14px;
  color: #000;
  -moz-box-shadow: inset 0px 0px 15px #f7f7f7;
  -webkit-box-shadow: inset 0px 0px 15px #f7f7f7;
  box-shadow: inset 0px 0px 15px #f7f7f7;
  background: white;
  margin-top: 0 !important;
}

#searchWrap_emp2 input[type="text"] {
  width: 564px;
  height: 35px;
  border: 1px solid #C8C8D2;
  padding-right: 10px;
  padding-left: 15px;
  left: 0px;
  position: relative;
  outline: none;
  font-size: 14px;
  color: #000;
  -moz-box-shadow: inset 0px 0px 15px #f7f7f7;
  -webkit-box-shadow: inset 0px 0px 15px #f7f7f7;
  box-shadow: inset 0px 0px 15px #f7f7f7;
  background: white;
  margin-top: 0 !important;
}

#searchWrap_bp input[type="text"] {
  width: 430px;
  height: 35px;
  border: 1px solid #C8C8D2;
  padding-right: 10px;
  padding-left: 15px;
  left: 0px;
  position: relative;
  outline: none;
  font-size: 14px;
  color: #000;
  -moz-box-shadow: inset 0px 0px 15px #f7f7f7;
  -webkit-box-shadow: inset 0px 0px 15px #f7f7f7;
  box-shadow: inset 0px 0px 15px #f7f7f7;
  background: white;
  margin-top: 0 !important;
}

#searchWrap2 input[type="text"] {
  width: 300px;
  height: 37px;
  border: 1px solid #C8C8D2;
  padding-right: 10px;
  padding-left: 15px;
  left: 0px;
  position: relative;
  outline: none;
  font-size: 14px;
  color: #000;
  -moz-box-shadow: inset 0px 0px 15px #f7f7f7;
  -webkit-box-shadow: inset 0px 0px 15px #f7f7f7;
  box-shadow: inset 0px 0px 15px #f7f7f7;
  background: white;
  margin-top: 0 !important;
}

#searchWrap input[type="image"] {
  width: 20px;
  height: 20px;
  position: relative;
  right: 30px;
  top: 6px;
  z-index: 2;
  border: 0 !important;
}

#searchWrap_emp input[type="image"] {
  width: 20px;
  height: 20px;
  position: relative;
  right: -250px;
  top: -27px;
  z-index: 2;
  border: 0 !important;
}

#searchWrap_emp2 input[type="image"] {
  width: 20px;
  height: 20px;
  position: relative;
  left: -30px;
  top: 5px;
  z-index: 2;
  border: 0 !important;
}

#searchWrap_bp input[type="image"] {
  width: 20px;
  height: 20px;
  position: relative;
  left: -30px;
  top: 5px;
  z-index: 2;
  border: 0 !important;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .head
 *
 * This styles headings.
 */
.head--0,
.head--1,
.head--2,
.head--3,
.head--4 {
  font-weight: normal;
  text-transform: uppercase;
}

.head--2, .head--2 a,
.head--3,
.head--3 a {
  color: #a4a4a4;
}

.head--0 {
  font-size: 80px;
  line-height: 70px;
}

.head--1 {
  font-size: 18px;
}

.head--2 {
  font-size: 16px;
  border-top: 1px solid #494949;
  padding-top: .5em;
}

.head--3 {
  font-size: 14px;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .table
 *
 * This styles titles.
 */
.title--0,
.title--1,
.title--2 {
  font-weight: normal;
}

.title--0 {
  line-height: .8;
  font-size: 80px;
}

.title--1 {
  line-height: 1;
  font-size: 38px;
}

.title--2 {
  font-size: 26px;
}

.title--3 {
  color: #000;
  display: block;
  font-size: 1.5em;
  font-weight: bold;
  margin: 5px 0 5px 0;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .float
 *
 * This styles titles.
 */
.float-right {
  float: right;
}

.float-left {
  float: left;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/layout
 *
 * .link
 *
 * Styles for links.
 */
a.link--plain, .link--plain a {
  text-decoration: none;
}

a.link--custom, .link--custom a {
  text-decoration: none;
}

a.link--custom, .link--custom a:hover {
  color: white !important;
}

a.link--black, .link--black a {
  color: #000 !important;
  text-decoration: none;
}

a.link--underline, .link--underline a {
  text-decoration: underline;
}

a.link--block, .link--block a {
  display: block;
}

a.link--dark, .link--dark a {
  color: #fff;
}

a.link--dark--with-selection, .link--dark--with-selection a {
  padding: 2px 15px;
}
a.link--dark--with-selection.is-active, .link--dark--with-selection a.is-active {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  color: #ed1c24;
  background-color: #272727;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .logo
 *
 * Style for the logo container. used in the partners' footer.
 */
.logo {
  height: 80px;
}
@media only screen and (min-width: 1024px) {
  .logo {
    height: 120px;
  }
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .table
 *
 * Main style for tables.
 */
/*table*/
.table {
  width: 100%;
}
.table thead {
  border-bottom: 1px solid #e5e5e5;
}
.table thead th {
  padding-bottom: 20px;
}
.table th {
  line-height: 1;
  font-size: 16px;
  text-align: left;
}
.table th, .table td {
  vertical-align: top;
}
.table th + th,
.table td + td {
  padding-left: 20px;
}
.table p:first-child {
  padding-top: 20px;
}
.table tr + tr p:first-child {
  border-top: 1px solid #e5e5e5;
}

.table2 {
  width: 100%;
}
.table2 thead {
  border-bottom: 0px solid #e5e5e5;
}
.table2 thead th {
  padding-top: 20px;
  padding-bottom: 4px;
}
.table2 th {
  line-height: 1;
  font-size: 16px;
  text-align: left;
}
.table2 th:first-child {
  width: 110px;
  padding-left: 35px;
}
.table2 th:nth-child(2) {
  width: 145px;
}
.table2 th:nth-last-child(2) {
  width: 240px;
}
.table2 th:last-child {
  width: 250px;
}

.table3 {
  width: 95%;
}
.table3 td {
  vertical-align: top;
  padding-top: 10px;
  text-align: left;
}
.table3 td:first-child {
  width: 120px;
}
.table3 td:nth-child(2) {
  width: 150px;
}
.table3 td:nth-last-child(2) {
  width: 250px;
}
.table3 td:last-child {
  width: 250px;
}
.table3 p {
  padding-top: 4px;
}

.table4 {
  border: 1px solid #e5e5e5;
  width: 100%;
}
.table4 td {
  vertical-align: top;
  padding-top: 10px;
  padding-left: 10px;
  text-align: left;
}
.table4 td:first-child {
  width: 60px;
}
.table4 td:nth-child(2) {
  width: 130px;
}
.table4 td:nth-last-child(2) {
  width: 60px;
}
.table4 td:last-child {
  width: 150px;
}
.table4 p {
  padding-top: 4px;
}

.table5 {
  width: 100%;
  table-layout: fixed;
}
.table5 thead {
  border: 0px solid #e5e5e5;
}
.table5 thead th {
  width: 45px;
  height: 40px;
  padding: 5px;
  vertical-align: top;
  text-align: center;
  table-layout: fixed;
}
.table5 td {
  width: 45px;
  height: 40px;
  vertical-align: top;
  text-align: center;
  padding: 10px;
  border: 1px solid #e5e5e5;
}
.table5 td:first-child {
  width: 40px;
  text-align: left;
  color: #0099FF;
  border: 0px solid #e5e5e5;
}
.table5 p {
  padding-top: 4px;
}

.toshiba-data-table {
  width: 100%;
}

.toshiba-data-table thead {
  background-color: #F7F8FC;
}

.toshiba-data-table thead th, .toshiba-data-table tbody th {
  padding-top: 10px;
  padding-bottom: 10px;
}

.toshiba-data-table tbody th + td {
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 20px;
}

.toshiba-data-table th, .toshiba-data-table td {
  vertical-align: top;
}

.toshiba-data-table th {
  font-size: 16px;
  text-align: left;
}

.toshiba-data-table ul {
  list-style: none;
  padding: 10px 0 0 0;
}

.toshiba-data-table td + td {
  padding-left: 20px;
}

.toshiba-data-table td:first-child {
  width: 240px;
}

.toshiba-data-table th + th {
  padding-left: 20px;
}

.toshiba-data-table th:first-child + th {
  padding-right: 20px;
}

.toshiba-data-table p:first-child {
  padding-top: 20px;
}

.toshiba-data-table tr {
  border-top: 1px solid #e5e5e5;
}

.toshiba-data-table > tbody > tr:hover, .toshiba-data-table > tbody > tr.alt:hover {
  background-color: #e5e5e5 !important;
}

.toshiba-data-table thead:first-child {
  border-top: 1px solid #e5e5e5;
}

.pages {
  font-weight: bold;
}
.pages > * + *:before {
  content: "";
  display: inline;
  border-left: 1px solid #d9d9d9;
  margin-left: .5em;
  margin-right: .5em;
}
.pages .is-active {
  color: #ed1c24;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .sprite
 *
 * Sprite, collection of all the graphical elements used in the project. Retina display ready.
 */
.sprite, .l-slider-prev,
.l-slider-next, .tab-inner--icon:after, .input--dropdown:after, .input--dropdown2:before, .input--dropdown-red:after, .input--checkbox input, .input--submit, .input--search:after, .input--button.input--button--action:after, .input--button2.input--button--action:after, .input--button3.input--button--action:after, .filter.filter--dropdown-head:after, .filter.filter--list-thumb:after, .filter.filter--list-detail:after, .filterb.filterb--dropdown-head:after, .filterb.filterb--list-thumb:after, .filterb.filterb--list-detail:after, .detail-button,
.detail-tooltip-close,
.detail-expand-collapse, .action--goto:before,
.action--goto--dark:before,
.action--download:before,
.action--download--dark:before, .action--goto2:before,
.action--goto--dark2:before,
.action--download2:before,
.action--download--dark2:before, .action--goto3:before,
.action--goto--dark3:before {
  font-size: 0;
  line-height: 0;
  text-shadow: none;
  color: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  display: block;
  background-color: transparent;
  background-repeat: no-repeat;
  background-image: url("/materials/sprite.png");
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .sprite, .l-slider-prev,
  .l-slider-next, .tab-inner--icon:after, .input--dropdown:after, .input--dropdown2:before, .input--dropdown-red:after, .input--checkbox input, .input--submit, .input--search:after, .input--button.input--button--action:after, .input--button2.input--button--action:after, .input--button3.input--button--action:after, .filter.filter--dropdown-head:after, .filter.filter--list-thumb:after, .filter.filter--list-detail:after, .filterb.filterb--dropdown-head:after, .filterb.filterb--list-thumb:after, .filterb.filterb--list-detail:after, .detail-button,
  .detail-tooltip-close,
  .detail-expand-collapse, .action--goto:before,
  .action--goto--dark:before,
  .action--download:before,
  .action--download--dark:before, .action--goto2:before,
  .action--goto--dark2:before,
  .action--download2:before,
  .action--download--dark2:before, .action--goto3:before,
  .action--goto--dark3:before {
    background-image: url("/materials/sprite@2.png");
    background-size: 215px 300px;
  }
}

.sprite--inline, .l-slider-prev,
.l-slider-next, .tab-inner--icon:after, .input--dropdown:after, .input--dropdown2:before, .input--dropdown-red:after, .input--submit, .input--search:after, .input--button.input--button--action:after, .input--button2.input--button--action:after, .input--button3.input--button--action:after, .filter.filter--dropdown-head:after, .filter.filter--list-thumb:after, .filter.filter--list-detail:after, .filterb.filterb--dropdown-head:after, .filterb.filterb--list-thumb:after, .filterb.filterb--list-detail:after, .action--goto:before,
.action--goto--dark:before,
.action--download:before,
.action--download--dark:before, .action--goto2:before,
.action--goto--dark2:before,
.action--download2:before,
.action--download--dark2:before, .action--goto3:before,
.action--goto--dark3:before {
  display: inline-block;
  vertical-align: middle;
}

.sprite--white-magnifier, .tab-inner--icon.tab-inner--icon--magnifier:after {
  width: 16px;
  height: 16px;
  background-position: 0px 0px;
}

.sprite--red-magnifier {
  width: 16px;
  height: 16px;
  background-position: -17px 0px;
}

.sprite--black-delete {
  width: 16px;
  height: 16px;
  background-position: -32px 0px;
}

.sprite--white-wrench, .tab-inner--icon.tab-inner--icon--wrench:after {
  width: 16px;
  height: 16px;
  background-position: -49px 0px;
}

.sprite--right-white-arrow, .l-slider-next.l-slider-next--alt, .input--button.input--button--action:after, .input--button2.input--button--action:after, .input--button3.input--button--action:after, .action--goto--dark:before, .action--goto--dark2:before, .action--goto--dark3:before {
  width: 10px;
  height: 14px;
  background-position: 0px -17px;
}

.sprite--up-white-arrow {
  width: 14px;
  height: 10px;
  background-position: -33px -17px;
}

.sprite--left-white-arrow, .l-slider-prev.l-slider-prev--alt {
  width: 10px;
  height: 14px;
  background-position: 0px -32px;
}

.sprite--down-white-arrow, .tab-inner--icon:after, .input--dropdown-red:after, .filterb.filterb--dropdown-head:after, .action--download--dark:before, .action--download--dark2:before {
  width: 14px;
  height: 10px;
  background-position: -33px -32px;
}

.sprite--right-red-arrow {
  width: 10px;
  height: 14px;
  background-position: -11px -17px;
}

.sprite--up-red-arrow, .tab.is-selected .tab-inner--icon:after, .filter.filter--dropdown-head.is-active:after, .filter.filter--dropdown-head.is-selected:after, .filter--dropdown.is-active .filter--dropdown-head:after, .filter--dropdown.is-selected .filter--dropdown-head:after, .filterb.filterb--dropdown-head.is-active:after, .filterb.filterb--dropdown-head.is-selected:after, .filterb--dropdown.is-active .filterb--dropdown-head:after, .filterb--dropdown.is-selected .filterb--dropdown-head:after {
  width: 14px;
  height: 10px;
  background-position: -48px -17px;
}

.sprite--left-red-arrow {
  width: 10px;
  height: 14px;
  background-position: -11px -32px;
}

.sprite--down-red-arrow {
  width: 14px;
  height: 10px;
  background-position: -48px -32px;
}

.sprite--right-black-arrow, .l-slider-next, .input--search:after, .action--goto:before, .action--goto2:before, .action--goto3:before {
  width: 10px;
  height: 14px;
  background-position: -22px -17px;
}

.sprite--up-black-arrow {
  width: 14px;
  height: 10px;
  background-position: -63px -17px;
}

.sprite--left-black-arrow, .l-slider-prev {
  width: 10px;
  height: 14px;
  background-position: -22px -32px;
}

.sprite--down-black-arrow, .input--dropdown:after, .input--dropdown2:before, .filter.filter--dropdown-head:after {
  width: 14px;
  height: 10px;
  background-position: -63px -32px;
}

.sprite--download-black-arrow, .action--download:before, .action--download2:before {
  width: 14px;
  height: 12px;
  background-position: -79px -17px;
}

.sprite--social-twitter {
  width: 33px;
  height: 23px;
  background-position: 0px -48px;
}

.sprite--social-facebook {
  width: 16px;
  height: 30px;
  background-position: -34px -48px;
}

.sprite--social-vimeo {
  width: 31px;
  height: 26px;
  background-position: -50px -48px;
}

.sprite--social-youtube {
  width: 27px;
  height: 28px;
  background-position: -82px -48px;
}

.sprite--social-linkedin {
  width: 33px;
  height: 29px;
  background-position: -109px -47px;
}

.sprite--social-googleplus {
  width: 23px;
  height: 23px;
  background-position: 0px -80px;
}

.sprite--key-tool {
  width: 24px;
  height: 24px;
  background-position: -25px -80px;
}

.sprite--plus-tool {
  width: 24px;
  height: 24px;
  background-position: -45px -80px;
}

.sprite--minus-tool {
  width: 24px;
  height: 24px;
  background-position: -70px -80px;
}

.sprite--white-tool, .tab-inner--icon.tab-inner--icon--tool:after, .input--submit {
  width: 24px;
  height: 24px;
  background-position: -96px -80px;
}

.sprite--plusbutton, .detail-button {
  width: 66px;
  height: 66px;
  background-position: -142px 0px;
}

.sprite--plusbutton--hover, .detail-button:hover {
  width: 66px;
  height: 66px;
  background-position: -142px -68px;
}

.sprite--plusbutton--active, .detail-button:active {
  width: 66px;
  height: 66px;
  background-position: -142px -136px;
}

.sprite--expand, .detail-expand-collapse {
  width: 70px;
  height: 70px;
  background-position: 0px -143px;
}

.sprite--collapse, .detail-expand-collapse:hover {
  width: 70px;
  height: 70px;
  background-position: -71px -143px;
}

.sprite--close, .detail-tooltip-close {
  width: 58px;
  height: 58px;
  background-position: 0px -214px;
}

.sprite--close--hover, .detail-tooltip-close:hover {
  width: 58px;
  height: 58px;
  background-position: -71px -214px;
}

.sprite--list-thumb, .filter.filter--list-thumb:after, .filterb.filterb--list-thumb:after {
  width: 15px;
  height: 11px;
  background-position: 0px -273px;
}

.sprite--list-thumb--brand, .filter.filter--list-thumb.is-active:after, .filter.filter--list-thumb.is-selected:after, .filterb.filterb--list-thumb.is-active:after, .filterb.filterb--list-thumb.is-selected:after {
  width: 15px;
  height: 11px;
  background-position: -16px -273px;
}

.sprite--list-detail, .filter.filter--list-detail:after, .filterb.filterb--list-detail:after {
  width: 15px;
  height: 11px;
  background-position: -32px -273px;
}

.sprite--list-detail--brand, .filter.filter--list-detail.is-active:after, .filter.filter--list-detail.is-selected:after, .filterb.filterb--list-detail.is-active:after, .filterb.filterb--list-detail.is-selected:after {
  width: 15px;
  height: 11px;
  background-position: -48px -273px;
}

.sprite--tick, .input--checkbox input:checked {
  width: 14px;
  height: 12px;
  background-position: 0px -286px;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .filter
 *
 * Style for the filter modules.
 */
.filter {
  cursor: pointer;
  display: inline-block;
  line-height: 20px;
  padding: 8px 10px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  -webkit-transition: border 250ms;
  -moz-transition: border 250ms;
  -o-transition: border 250ms;
  transition: border 250ms;
  border: 1px solid #d9d9d9;
}
.filter:hover {
  color: #59595a;
  border-color: #59595a;
}
.filter.is-active, .filter.is-selected {
  border-color: #ed1c24;
}
.filter.filter--dropdown-head:after {
  content: "";
  margin-left: 10px;
}
.filter.filter--list-thumb:after {
  content: "";
}
.filter.filter--list-detail:after {
  content: "";
}

.filter--dropdown:hover .filter {
  border-color: #59595a;
}
.filter--dropdown.is-active .filter, .filter--dropdown.is-selected .filter {
  border-color: #ed1c24;
}
.filter--dropdown.is-active .filter--dropdown-head, .filter--dropdown.is-selected .filter--dropdown-head {
  -moz-border-radius-bottomleft: 0;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
  -moz-border-radius-bottomright: 0;
  -webkit-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-color: white;
}
.filter--dropdown.is-active .filter--dropdown-body, .filter--dropdown.is-selected .filter--dropdown-body {
  -moz-border-radius-topleft: 0;
  -webkit-border-top-left-radius: 0;
  border-top-left-radius: 0;
}

.filterb {
  cursor: pointer;
  display: inline-block;
  line-height: 20px;
  padding: 8px 10px;
  background-color: #3a3a3b;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  -webkit-transition: border 250ms;
  -moz-transition: border 250ms;
  -o-transition: border 250ms;
  transition: border 250ms;
  border: 1px solid #3a3a3b;
}
.filterb:hover {
  color: #ed1c24;
  border-color: #3a3a3b;
}
.filterb.is-active, .filterb.is-selected {
  border-color: #ed1c24;
}
.filterb.filterb--dropdown-head:after {
  content: "";
  margin-left: 10px;
}
.filterb.filterb--list-thumb:after {
  content: "";
}
.filterb.filterb--list-detail:after {
  content: "";
}

.filterb--dropdown:hover .filter {
  border-color: #59595a;
}
.filterb--dropdown.is-active .filter, .filterb--dropdown.is-selected .filter {
  border-color: #59595a;
}
.filterb--dropdown.is-active .filterb--dropdown-head, .filterb--dropdown.is-selected .filterb--dropdown-head {
  -moz-border-radius-bottomleft: 0;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
  -moz-border-radius-bottomright: 0;
  -webkit-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-color: #59595a;
}
.filterb--dropdown.is-active .filterb--dropdown-body, .filterb--dropdown.is-selected .filterb--dropdown-body {
  -moz-border-radius-topleft: 0;
  -webkit-border-top-left-radius: 0;
  border-top-left-radius: 0;
}

.bpfilter {
  cursor: pointer;
  display: inline-block;
  line-height: 20px;
  padding: 8px 10px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  -webkit-transition: border 250ms;
  -moz-transition: border 250ms;
  -o-transition: border 250ms;
  transition: border 250ms;
  background-color: #3a3a3b;
  color: #fff;
  margin: 0 10px 10px 0;
}

.bpfilter:hover {
  color: red;
}

.bpfilter.is-active, .bpfilter.is-selected {
  border-color: #ed1c24;
}

.bpfilter.bpfilter--dropdown-head:after {
  content: "";
  margin-left: 10px;
}

.bpfilter.bpfilter--list-thumb:after {
  content: "";
}

.bpfilter.bpfilter--list-detail:after {
  content: "";
}

.bpfilter--dropdown:hover .bpfilter {
  border-color: #59595a;
}

.bpfilter--dropdown.is-active .bpfilter, .bpfilter--dropdown.is-selected .bpfilter {
  border-color: #ed1c24;
}

.bpfilter--dropdown.is-active .bpfilter--dropdown-head, .bpfilter--dropdown.is-selected .bpfilter--dropdown-head {
  -moz-border-radius-bottomleft: 0;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
  -moz-border-radius-bottomright: 0;
  -webkit-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-color: white;
}

.bpfilter--dropdown.is-active .bpfilter--dropdown-body, .bpfilter--dropdown.is-selected .bpfilter--dropdown-body {
  -moz-border-radius-topleft: 0;
  -webkit-border-top-left-radius: 0;
  border-top-left-radius: 0;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .detail
 *
 * This is the style for the product detail module.
 */
.detail {
  -webkit-transition: width 250ms;
  -moz-transition: width 250ms;
  -o-transition: width 250ms;
  transition: width 250ms;
  position: relative;
}
.detail .detail-button,
.detail .detail-tooltip {
  visibility: hidden;
}
.detail.is-open {
  width: 100%;
}
.detail.is-open .detail-button,
.detail.is-open .detail-tooltip {
  visibility: visible;
}

.detail,
.detail-aside {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 50%;
  float: left;
}

.detail-aside {
  padding-left: 20px;
  padding-right: 20px;
}
.detail-aside.is-hidden {
  display: none;
}

.detail-name,
.detail-button,
.detail-tooltip,
.detail-tooltip-close,
.detail-expand-collapse {
  position: absolute;
}

.detail-expand-collapse {
  left: 0;
  bottom: 0;
  cursor: pointer;
}

.detail-name {
  right: 20px;
}

.detail-button {
  cursor: pointer;
  z-index: 20;
}

.detail-tooltip {
  cursor: pointer;
  margin: 20px;
  max-width: 50%;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  -webkit-box-shadow: 0 3px 4px -2px rgba(0, 0, 0, 0.25);
  -moz-box-shadow: 0 3px 4px -2px rgba(0, 0, 0, 0.25);
  box-shadow: 0 3px 4px -2px rgba(0, 0, 0, 0.25);
  z-index: 40;
  display: none;
  background-color: black;
  background-color: rgba(0, 0, 0, 0.85);
}
.detail-tooltip, .detail-tooltip a, .detail-tooltip h1, .detail-tooltip h2, .detail-tooltip h3, .detail-tooltip h4, .detail-tooltip h5, .detail-tooltip h6 {
  color: white;
}
.detail-tooltip.is-open {
  display: block;
}

.detail-tooltip-close {
  top: 0;
  right: 0;
  cursor: pointer;
}

.detail-thumbnail {
  display: block;
  cursor: pointer;
  border: 1px solid #d9d9d9;
}
.detail-thumbnail:hover {
  border-color: #59595a;
}
.detail-thumbnail.is-selected {
  border-color: #ed1c24;
}

/**
 * This is the style for the product detail module, specific for the TCxWAVE product.
 */
.detail--tcxwave .detail-button--1,
.detail--tcxwave .detail-tooltip--1 {
  top: 12%;
  left: 28%;
}
.detail--tcxwave .detail-button--2,
.detail--tcxwave .detail-tooltip--2 {
  top: 60%;
  left: 25%;
}
.detail--tcxwave .detail-button--3,
.detail--tcxwave .detail-tooltip--3 {
  top: 36%;
  left: 40%;
}
.detail--tcxwave .detail-button--4,
.detail--tcxwave .detail-tooltip--4 {
  top: 16%;
  left: 48%;
}
.detail--tcxwave .detail-button--5,
.detail--tcxwave .detail-tooltip--5 {
  top: 2%;
  left: 50%;
}
.detail--tcxwave .detail-button--6,
.detail--tcxwave .detail-tooltip--6 {
  top: 73%;
  left: 72%;
}
.detail--tcxwave .detail-button--8,
.detail--tcxwave .detail-tooltip--8 {
  top: 12%;
  left: 48%;
}
.detail--tcxwave .detail-button--9,
.detail--tcxwave .detail-tooltip--9 {
  top: 60%;
  left: 45%;
}
.detail--tcxwave .detail-button--7 {
  top: 53%;
  left: 85%;
}
.detail--tcxwave .detail-tooltip--7 {
  top: 62%;
  left: 33%;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .navbar
 *
 * Module for a navigation bar. Used for the main navigation.
 */
.navbar {
  font-size: 13px;
  text-transform: uppercase;
}
.navbar a {
  position: relative;
  display: block;
  color: #000;
  text-decoration: none;
  line-height: 56px;
}
.navbar a:focus {
  outline: none;
}
.navbar a:after {
  background-color: #d9d9d9;
  content: "";
  position: absolute;
  right: 0;
  width: 1px;
  height: 18px;
  margin-top: -9px;
  top: 50%;
}
.navbar a.is-active {
  color: #ed1c24;
}
.navbar a.is-selected:before {
  /* triangle */
  content: "";
  width: 0;
  height: 0;
  position: absolute;
  bottom: -1px;
  left: 50%;
  margin-left: -10px;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 7px solid #3a3a3b;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .action
 *
 * Styles links with "action" function. E.g. "goto" or "download".
 */
.action {
  position: relative;
  display: block;
  padding-left: 20px;
}

.action--goto {
  text-decoration: underline;
}

.action--goto:before,
.action--goto--dark:before,
.action--download:before,
.action--download--dark:before {
  content: "";
  margin-right: 10px;
}

.action--goto:before,
.action--goto--dark:before,
.action--download:before,
.action--goto--dark:before {
  margin-left: -22px;
  margin-right: 12px;
}

.action2 {
  position: relative;
  padding-left: 20px;
}

.action--goto2 {
  text-decoration: underline;
}

.action--goto2:before,
.action--goto--dark2:before,
.action--download2:before,
.action--download--dark2:before {
  content: "";
  margin-right: 10px;
}

.action--goto2:before,
.action--goto--dark2:before,
.action--download2:before,
.action--goto--dark2:before {
  margin-left: -22px;
  margin-right: 12px;
}

.action3 {
  position: relative;
  padding-left: 20px;
}

.action--goto3 {
  text-decoration: underline;
}

.action--goto3:before,
.action--goto--dark3:before {
  content: "";
  margin-right: 10px;
}

.action--goto3:before,
.action--goto--dark3:before,
.action--goto--dark3:before {
  margin-left: -22px;
  margin-right: 12px;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .boxnav
 *
 * Styles the navigation list of tabs.
 */
.boxnav-link {
  display: block;
  cursor: pointer;
  padding: 16px 16px;
  background-color: #3a3a3b;
}
.boxnav-link, .boxnav-link:hover, .boxnav-link.is-selected {
  color: white;
}
.boxnav-link:hover {
  background-color: black;
}
.boxnav-link.is-selected {
  color: #59595a;
  background-color: white;
}

.boxnav-item + .boxnav-item {
  margin-left: 1px;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .logonav
 *
 * Style for the element containing the logo and the main navigation.
 */
.logonav {
  width: 100%;
  display: table;
}

.logonav-logo,
.logonav-navbar {
  display: table-cell;
}

.logonav-logo, .logonav-logo > img {
  height: 56px;
}
.logonav-logo > img {
  width: auto;
  display: block;
}
@media only screen and (min-width: 1024px) {
  .logonav-logo {
    display: block;
  }
  .logonav-logo, .logonav-logo > img {
    width: image-width "/materials/tgcs-logo@2.png"/2;
  }
  .logonav-logo > img {
    -moz-border-radius-bottomleft: 2px;
    -webkit-border-bottom-left-radius: 2px;
    border-bottom-left-radius: 2px;
    -moz-border-radius-bottomright: 2px;
    -webkit-border-bottom-right-radius: 2px;
    border-bottom-right-radius: 2px;
    -webkit-box-shadow: 0 3px 4px -2px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0 3px 4px -2px rgba(0, 0, 0, 0.25);
    box-shadow: 0 3px 4px -2px rgba(0, 0, 0, 0.25);
    height: 86px;
  }
}

.logonav-navbar {
  width: 100%;
}

@media only screen and (min-width: 1024px) {
  .logonav-overlayed:before {
    content: "";
    display: block;
    padding-top: 30px;
  }
}
/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .content
 *
 * content module, with option of image on the left or right.
 */
.content--left:after,
.content--right:after {
  clear: both;
  content: "";
  display: table;
}
.content--left .content-image,
.content--right .content-image {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  max-width: 50%;
}

.content--left .content-image {
  float: left;
  margin-right: -10px;
  padding-right: 30px;
}
.content--left .content-image.content-image--align-to-grid-gutter {
  margin-right: 10px;
  padding-right: 10px;
}

.content--right .content-image {
  float: right;
  margin-left: -10px;
  padding-left: 30px;
}
.content--right .content-image.content-image--align-to-grid-gutter {
  margin-left: 10px;
  padding-left: 10px;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .pullout
 *
 * Styles a pullout piece of text.
 */
.pullout {
  border-top: 1px solid #d9d9d9;
  border-bottom: 1px solid #d9d9d9;
  padding-top: 20px;
  padding-bottom: 10px;
  margin-bottom: 20px;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .bookmark
 *
 * This module applies a bottom triangle to a container. The triangle points downwards, and it sticks out of the container.
 */
.bookmark {
  position: relative;
}
.bookmark:after {
  content: "";
  width: 0;
  height: 0;
  position: absolute;
  left: 20px;
  bottom: -8px;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid #242425;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .iconwrap
 *
 * Styles a wrapper for any icon. Currently only used for the icon which closes the megamenu.
 */
.iconwrap {
  padding: 10px 15px;
  display: inline-block;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .dropdown
 *
 * Style for the dropdown module.
 */
.dropdown {
  display: inline-block;
}
.dropdown,
.dropdown .dropdown-head {
  position: relative;
}
.dropdown .dropdown-head {
  z-index: 100;
}
.dropdown .dropdown-body {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 150%;
  display: none;
  position: absolute;
  margin-top: -1px;
  z-index: 300;
}
.dropdown.is-active {
  z-index: 320;
}
.dropdown.is-active .dropdown-body {
  display: block;
}

.dropdown2 {
  display: inline-block;
}
.dropdown2,
.dropdown2 .dropdown-head2 {
  position: relative;
}
.dropdown2 .dropdown-head2 {
  z-index: 100;
}
.dropdown2 .dropdown-body2 {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  display: none;
  position: absolute;
  margin-top: -1px;
  z-index: 300;
}
.dropdown2.is-active {
  z-index: 320;
}
.dropdown2.is-active .dropdown-body2 {
  display: block;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .socialnav
 *
 * Styles the navigation list of social icons.
 * Mainly used to fake vertical alignment with the paraghraphs on its left in the footer.
 */
.socialnav {
  height: 46px;
}

.accordion {
  display: block;
  cursor: pointer;
}
.accordion:after {
  content: "+";
  vertical-align: top;
  font-size: 24px;
  float: right;
}
.accordion.is-selected {
  color: #ed1c24;
}
.accordion.is-selected:after {
  content: "?";
}

.accordion2 {
  display: block;
  cursor: pointer;
}
.accordion2:before {
  content: "+";
  vertical-align: top;
  font-size: 24px;
  float: left;
  margin-right: 20px;
  padding-top: 5px;
}
.accordion2.is-selected {
  color: #ed1c24;
}
.accordion2.is-selected:before {
  content: "?";
  vertical-align: top;
  font-size: 24px;
  float: left;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .invisible
 *
 * Makes the text invisible but still accessible.
 */
.invisible {
  font-size: 0;
  line-height: 0;
  text-shadow: none;
  color: transparent;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .swapimage
 *
 * Style used for swapping from an image to another, when the user rollovers the image's container.
 * E.g. of markup (note the images need to me adjacent).
 *
 * <div class="swapimage">
 *     <img src="..." alt="this image is shown by default">
 *     <img src="..." alt="this image is shown on rollover, hiding the prevoius one">
 * </div>
 */
.swapimage img + img, .swapimage:hover img {
  display: none;
}
.swapimage:hover img + img {
  display: block;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .fluidmedia
 *
 * Allows a media to resize to its container's width.
 * Option .fluidmedia--full will force the image to have with: 100%, useful when the container is a table cell.
 */
.fluidmedia {
  height: auto;
  display: block;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}
.fluidmedia.fluidmedia--full {
  width: 100%;
}

img.fluidmedia {
  width: auto;
  -ms-interpolation-mode: bicubic;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .limitwidth
 *
 * Limits the width of an element. Usefull to limit with of fluid retina images.
 */
.limitwidth--toshiba-logo {
  max-width: 152px;
}

.limitwidth--toshiba-text {
  max-width: 244px;
}

.limitwidth--tgcs-logo {
  max-width: 223px;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .pagination
 *
 * Style for the pagination module. Used for the pages of the carousel.
 */
.pagination-page.is-selected .pagination-link {
  color: #59595a;
  background-color: white;
}
.pagination-page.is-selected .pagination-link:hover {
  color: #ed1c24;
}

.pagination-link {
  cursor: pointer;
  padding: .5em 1em;
  display: inline-block;
  color: white;
  /* fallback bg color */
  background-color: black;
  background-color: rgba(0, 0, 0, 0.6);
}
.pagination-link:hover {
  color: #59595a;
  background-color: white;
}
.pagination-link:hover .pagination-title {
  display: inline;
}

.pagination-title {
  margin-right: 2em;
  display: none;
}

.pagination-number {
  font-weight: bold;
}

/**
 * @project TGCS - Retail
 * @author Sergio Agosti <sagosti@theframeworks.com>
 * @package CSS/module
 *
 * .breadcrumbs
 *
 * Styles the breadcrumbs.
 */
.breadcrumbs-list {
  margin: 0;
  border: 0;
  padding: 0;
  list-style-type: none;
  font-size: 12px;
  line-height: 30px;
}
.breadcrumbs-list:after {
  clear: both;
  content: "";
  display: table;
}
.breadcrumbs-list > * {
  float: left;
}
.breadcrumbs-list, .breadcrumbs-list a {
  color: #242425;
  text-decoration: none;
}
.breadcrumbs-list > * + * {
  /* from the second child on */
  margin-left: .5em;
}
.breadcrumbs-list > * + * + *:before {
  /* from the third child on */
  content: ">";
  margin-right: .5em;
}
.breadcrumbs-list li:last-child a {
  color: #ed1c24;
  font-weight: bold;
}

.placeit_120_60 {
  padding: 21px 40px 21px 40px;
  background-color: #ed1c24;
  cursor: pointer;
}

.placeit_45_60 {
  padding: 20px 11px 20px 11px;
  border-left: solid 1px #5F5F5F;
  background-color: #E8E8E8;
  cursor: pointer;
}

.placeit_120_70 {
  padding: 21px 10px 21px 10px;
  border-left: solid 1px #5F5F5F;
  background-color: #E8E8E8;
  cursor: pointer;
}

.pad-left--50 {
  padding-left: 70px;
}

.employee_logo {
  width: 244px;
  height: 30px;
  position: relative;
  padding-left: 25px;
  padding-top: 5px;
  margin-left: -33px;
  text-align: left;
  border-left: solid 2px #fff;
  color: #fff;
}

.toolTitle {
  width: 200px;
  font-size: 1.17em;
  -webkit-margin-before: 5px;
  -webkit-margin-after: 5px;
  -webkit-margin-start: 0px;
  -webkit-margin-end: 0px;
  font-weight: bold;
  display: block;
  white-space: nowrap;
}

.delBtn {
  float: right;
  display: none;
}

.inputtool {
  width: 250px;
  display: inline-block;
  padding: 0 30px 10px 0;
  margin: 5px 20px 0 20px;
  border-bottom: 2px solid gray;
}

.inputtool2 {
  width: 250px;
  display: inline-block;
  padding: 0 30px 10px 0;
  margin: 5px 20px 0 20px;
}

.deletebutton {
  color: #fff;
  font-type: arial;
  font-weight: bold;
  padding-right: 5px;
}

.pdficon {
  width: 20px;
  height: 20px;
  margin-right: 10px;
  background-image: url("/materials/pdf-icon.png");
}

.questionicon {
  width: 20px;
  height: 20px;
  margin-left: 10px;
  background-image: url("/materials/questionicon.png");
}

.checkmark {
  width: 30px;
  height: 30px;
  background-image: url("/materials/checkmark.png");
}

/**
 * IE7-
 */
html.lt-ie8 > body {
  display: none;
}

/**
 * IE8-
 */
/* In case we are using a JS library to implement CSS media queries,
   this prevents the mobile version to be visible when the page loads
   untill the JS library does its job. */
html.lt-ie9.has-js-mediaqueries > body {
  visibility: hidden;
}
@media only screen {
  html.lt-ie9.has-js-mediaqueries > body {
    visibility: visible;
  }
}

/* Styles the alert message to IE8 users, for example in case they have JS disabled. */
html.lt-ie9 ._alert {
  display: block;
  font-weight: bold;
  border: 5px solid red;
  padding: 20px;
}
/* fyi */

.color--fyi-bg--header {
  background-color: #0F3E50;
    height: 35px;
}

.color--fyi-bg--header2 {
   height: 75px;
    top: 55px;
    top: 35px;
    width: 100%;
    background-color: #FFFFFF;
}

.toshibalogo{
        width: 33%;
    float: left;
    margin: 20px;
}

.fyilogo img {
        margin: 0px 25px;
    height: 75px;
    width: 75px;
    padding: 0px 10px;
}

.logonav-navbar {
	width: 50%;
}

.navbar a {
    position: relative;
    display: block;
    color: #0F3E50;
	font-weight: bold;
    text-decoration: none;
    line-height: 75px;
}

.submitButton {
background:linear-gradient(to bottom, #0f3e50, #0f3e50);
color:#FFFFFF ;
	background-color:#0f3e50;
	font-size: 1.4rem;
	font-weight: 700;
}
.submitButton.focus, .submitButton:focus, .submitButton:hover{
background:linear-gradient(to bottom, #0f3e50, #0f3e50);
color:#8FC4C1 ;

	background-color:#0f3e50;
	
}


form.form p label {
    color: #0F3E50 !important;
}

form.form{
	color: #0F3E50 !important;
}

label{
color: #0F3E50 !important;
	font-weight: bold;
}
.body{
color: #0F3E50 ;
}
a, h1, h2, h3, h4, h5, h6{
color: #0F3E50 ;
}