article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }

audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }

audio:not([controls]) { display: none; }

[hidden] { display: none; }

html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

body { margin: 0; font-size: 13px; line-height: 1.231; }

body, button, input, select, textarea { font-family: sans-serif; color: #222; }

::-moz-selection { background: #494949; color: #fff; text-shadow: none; }

::selection { background: #494949; color: #fff; text-shadow: none; }

a { color: #00e; }

a:visited { color: #551a8b; }

a:hover { color: #06e; }

a:focus { outline: thin dotted; }

a:hover, a:active { outline: 0; }

abbr[title] { border-bottom: 1px dotted; }

b, strong { font-weight: bold; }

blockquote { margin: 1em 40px; }

dfn { font-style: italic; }

hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }

ins { background: #ff9; color: #000; text-decoration: none; }

mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }

pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }

pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

q { quotes: none; }

q:before, q:after { content: ""; content: none; }

small { font-size: 85%; }

sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sup { top: -0.5em; }

sub { bottom: -0.25em; }

ul, ol { margin: 1em 0; padding: 0 0 0 40px; }

dd { margin: 0 0 0 40px; }

nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

svg:not(:root) { overflow: hidden; }

figure { margin: 0; }

form { margin: 0; }

fieldset { border: 0; margin: 0; padding: 0; }

label { cursor: pointer; }

legend { border: 0; *margin-left: -7px; padding: 0; }

button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }

button, input { line-height: normal; *overflow: visible; }

table button, table input { *overflow: auto; }

button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }

input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }

input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

textarea { overflow: auto; vertical-align: top; resize: vertical; }

input:invalid, textarea:invalid { background-color: #f0dddd; }

table { border-collapse: collapse; border-spacing: 0; }

td { vertical-align: top; }

.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }

.ir br { display: none; }

.hidden { display: none !important; visibility: hidden; }

.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

.invisible { visibility: hidden; }

.clearfix:before, .clearfix:after { content: ""; display: table; }

.clearfix:after { clear: both; }

.clearfix { zoom: 1; }

@media print { * { background: transparent !important; color: black !important; text-shadow: none !important; filter: none !important; -ms-filter: none !important; }
  /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }
  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; }
  /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, article li, .article li, article.grid_4 hgroup h3, .article.grid_4 hgroup h3, article.grid_8 > h3, .article.grid_8 > h3, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; } }
/* ==============================================
Compass global functions
=================================================*/
/** two-pros-transition: default usage for blue-back/white-text to diap transition (a la buttons) */
/** Basic stuff
*/
html, body { margin: 0; padding: 0; height: 100%; }

body { /* Forces backgrounds to span full width, even if there is horizontal scrolling. Increase this if your layout is wider.
 Note: IE6 works fine without this fix.
*/ min-width: 960px; background-color: #082238; }
body.agecheck { background-color: #151136; }

::-moz-selection { background: magenta; color: #fff; text-shadow: none; }

::selection { background: magenta; color: #fff; text-shadow: none; }

#page-content { /* need to set something, or else the main menu won't work nicely*/ margin-top: 60px; position: relative; float: left; }

.iframe-content { /* default-template for page, in which an iframe is pasted into tinyMCE */ margin-left: -42px; border: none; width: 632px; /* height needs to be set as attribute of <iframe> to match content*/ }

.center { text-align: center; }

.print-only { display: none; }

/** Links
*/
a { -webkit-transition-property: color, background-color; -webkit-transition-duration: 0.2s, 0.2s; -webkit-transition-timing-function: linear, ease-in; -moz-transition-property: color, background-color; -moz-transition-duration: 0.2s, 0.2s; -moz-transition-timing-function: linear, ease-in; -o-transition-property: color, background-color; -o-transition-duration: 0.2s, 0.2s; -o-transition-timing-function: linear, ease-in; transition-property: color, background-color; transition-duration: 0.2s, 0.2s; transition-timing-function: linear, ease-in; color: #102d4f; text-decoration: underline; }
a:hover { color: #002e5a; text-decoration: none; }

/** Buttons
*/
.goBtn { /* textual link with triangular arrow */ font-family: Georgia, Times New Roman, serif; font-size: 13px; line-height: 20px; color: #494949; text-transform: uppercase; text-decoration: none; display: block; padding-left: 7px; color: #102d4f; -webkit-transition-property: color, background-color; -webkit-transition-duration: 0.2s, 0.2s; -webkit-transition-timing-function: linear, ease-in; -moz-transition-property: color, background-color; -moz-transition-duration: 0.2s, 0.2s; -moz-transition-timing-function: linear, ease-in; -o-transition-property: color, background-color; -o-transition-duration: 0.2s, 0.2s; -o-transition-timing-function: linear, ease-in; transition-property: color, background-color; transition-duration: 0.2s, 0.2s; transition-timing-function: linear, ease-in; font-weight: bold; background: url("../img/layout/narrow_arrow.gif") no-repeat -27px -187px; }

.linkBtn { /* big colored button-like link */ -webkit-transition-property: color, background-color; -webkit-transition-duration: 0.2s, 0.2s; -webkit-transition-timing-function: linear, ease-in; -moz-transition-property: color, background-color; -moz-transition-duration: 0.2s, 0.2s; -moz-transition-timing-function: linear, ease-in; -o-transition-property: color, background-color; -o-transition-duration: 0.2s, 0.2s; -o-transition-timing-function: linear, ease-in; transition-property: color, background-color; transition-duration: 0.2s, 0.2s; transition-timing-function: linear, ease-in; text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 22px; font-weight: lighter; color: white; -webkit-font-smoothing: antialiased; line-height: 114%; color: white !important; background-color: #102d4f; height: 44px; line-height: 44px; margin: 4px 2px; text-align: left; padding: 0 12px; display: inline-block; cursor: hand; cursor: pointer; }
.linkBtn:active, .linkBtn:hover { color: #102d4f !important; background-color: white; }

.linkBtn.loud { /* big colored button-like link */ -webkit-transition-property: color, background-color; -webkit-transition-duration: 0.2s, 0.2s; -webkit-transition-timing-function: linear, ease-in; -moz-transition-property: color, background-color; -moz-transition-duration: 0.2s, 0.2s; -moz-transition-timing-function: linear, ease-in; -o-transition-property: color, background-color; -o-transition-duration: 0.2s, 0.2s; -o-transition-timing-function: linear, ease-in; transition-property: color, background-color; transition-duration: 0.2s, 0.2s; transition-timing-function: linear, ease-in; text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 22px; font-weight: lighter; color: white; -webkit-font-smoothing: antialiased; line-height: 114%; color: white !important; background-color: #f6891f; height: 44px; line-height: 44px; margin: 4px 2px; text-align: left; padding: 0 12px; display: inline-block; cursor: hand; cursor: pointer; }
.linkBtn.loud:active, .linkBtn.loud:hover { color: #f6891f !important; background-color: white; }

.linkBtn.quiet { /* big colored button-like link */ -webkit-transition-property: color, background-color; -webkit-transition-duration: 0.2s, 0.2s; -webkit-transition-timing-function: linear, ease-in; -moz-transition-property: color, background-color; -moz-transition-duration: 0.2s, 0.2s; -moz-transition-timing-function: linear, ease-in; -o-transition-property: color, background-color; -o-transition-duration: 0.2s, 0.2s; -o-transition-timing-function: linear, ease-in; transition-property: color, background-color; transition-duration: 0.2s, 0.2s; transition-timing-function: linear, ease-in; text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 22px; font-weight: lighter; color: white; -webkit-font-smoothing: antialiased; line-height: 114%; color: white !important; background-color: #bbbbbb; height: 44px; line-height: 44px; margin: 4px 2px; text-align: left; padding: 0 12px; display: inline-block; cursor: hand; cursor: pointer; }
.linkBtn.quiet:active, .linkBtn.quiet:hover { color: #bbbbbb !important; background-color: white; }

/** fake dropdown */
.pulldown { float: left; }
.pulldown .doFilter { background: url("../img/layout/narrow_arrow.gif") no-repeat right -88px; text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 22px; font-weight: lighter; color: white; -webkit-font-smoothing: antialiased; line-height: 114%; color: white !important; background-color: #102d4f; height: 44px; line-height: 44px; margin: 4px 2px; text-align: left; padding: 0 14px; -webkit-transition-property: color, background-color; -webkit-transition-duration: 0.2s, 0.2s; -webkit-transition-timing-function: linear, ease-in; -moz-transition-property: color, background-color; -moz-transition-duration: 0.2s, 0.2s; -moz-transition-timing-function: linear, ease-in; -o-transition-property: color, background-color; -o-transition-duration: 0.2s, 0.2s; -o-transition-timing-function: linear, ease-in; transition-property: color, background-color; transition-duration: 0.2s, 0.2s; transition-timing-function: linear, ease-in; padding-right: 44px; margin: 0; width: 60px; z-index: 6600; position: relative; }
.pulldown ul { -webkit-transition-property: opacity, top; -webkit-transition-duration: 0.2s, 0.3s; -webkit-transition-timing-function: linear, ease-in; -moz-transition-property: opacity, top; -moz-transition-duration: 0.2s, 0.3s; -moz-transition-timing-function: linear, ease-in; -o-transition-property: opacity, top; -o-transition-duration: 0.2s, 0.3s; -o-transition-timing-function: linear, ease-in; transition-property: opacity, top; transition-duration: 0.2s, 0.3s; transition-timing-function: linear, ease-in; display: block; opacity: 0; height: 1px; overflow: hidden; top: 0px; width: 117px; position: absolute; z-index: 6500; border: solid 1px #d3d3ce; background-color: white; margin: 0; padding: 0; -moz-box-shadow: 0px 1px 2px #cacaca; -webkit-box-shadow: 0px 1px 2px #cacaca; box-shadow: 0px 1px 2px #cacaca; -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=180, Color='#cacaca')"; filter: progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=180, Color='#cacaca'); }
.pulldown ul li { margin: 0; padding: 0; text-align: left; list-style-type: none; }
.pulldown ul li a { display: block; text-decoration: none; -webkit-transition-property: color, background-color; -webkit-transition-duration: 0.2s, 0.2s; -webkit-transition-timing-function: linear, ease-in; -moz-transition-property: color, background-color; -moz-transition-duration: 0.2s, 0.2s; -moz-transition-timing-function: linear, ease-in; -o-transition-property: color, background-color; -o-transition-duration: 0.2s, 0.2s; -o-transition-timing-function: linear, ease-in; transition-property: color, background-color; transition-duration: 0.2s, 0.2s; transition-timing-function: linear, ease-in; text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 15px; font-weight: lighter; color: white; -webkit-font-smoothing: antialiased; line-height: 114%; color: #002e5a !important; background-color: white; height: 36px; line-height: 36px; margin: 4px 2px; text-align: left; padding: 0 16px; margin: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.pulldown ul li a:hover { background-color: #102d4f; color: white !important; }
html.no-appleios .pulldown:hover .doFilter { background-position: right -132px; }
html.no-appleios .pulldown:hover ul { top: 44px; height: auto; opacity: 1; }

/** Search box */
input.search-box { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 22px; font-weight: lighter; color: white; -webkit-font-smoothing: antialiased; line-height: 114%; border: none; outline: none; text-align: left; font-size: 18px; line-height: 29px; color: #bbbbbb; background: none; padding: 2px; padding-left: 10px; /* creates a space between text and left border */ }
input.search-box:focus { color: #002e5a; }

input.search-button { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 22px; font-weight: lighter; color: white; -webkit-font-smoothing: antialiased; line-height: 114%; font-size: 18px; line-height: 28px; cursor: pointer; outline: none; color: white; background-color: #bbbbbb; border: none; height: 32px; width: 54px; -webkit-border-radius: 0; -webkit-appearance: none; }

/** H-tags inventory:

H1      all-caps    bols-sans       dark-blue       in hgroup
H2      all-caps    bols-serif      dark-blue       in hgroup || on top of page || title of page.php (?) || relateditems

H3      all-caps    georgia         dark-grey       in content                      see packages,products,cocktails
H2      all-caps    bols-sans       dark-blue       in content || above content     see cocktails
Hx      none        georgia         dark-grey       in content                      see distributors (name)
*/
h1, h2.article-header { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 28px; font-weight: lighter; color: #002e5a; -webkit-font-smoothing: antialiased; line-height: 114%; }

h2 { font-family: "BolsHeadline"; font-size: 22px; /* trivial size */ font-weight: lighter; text-align: center; text-transform: uppercase; text-decoration: none; line-height: 110%; /* trivial size */ color: #002e5a; /*-webkit-font-smoothing: subpixel-antialiased;	*/ -webkit-font-smoothing: antialiased; }

h3 { font-family: Georgia, Times New Roman, serif; font-size: 13px; line-height: 20px; color: #494949; }

table { font-family: Georgia, Times New Roman, serif; font-size: 13px; line-height: 20px; color: #494949; width: 100%; }
table thead th { color: #494949; text-transform: uppercase; text-align: left; }
table th, table td { padding: 4px 4px 4px 0; }
table td { border-top: dotted 1px #bbbbbb; }

/** special lists
*/
ul.image-list { margin: 12px 0 !important; padding: 0 !important; }
ul.image-list li { margin: 0 4px 0 0; padding: 0; float: left; text-align: center; list-style-type: none; }
ul.image-list li figure a img { display: block; }
ul.image-list li figure figcaption { margin: 0; text-decoration: none; }
ul.image-list.tooltip li { position: relative; z-index: 5; }
ul.image-list.tooltip li figcaption { display: none; }
ul.image-list.tooltip li:hover { z-index: 10; }
ul.image-list.tooltip li:hover figcaption { display: block; position: absolute; left: 70%; top: 10%; padding: 0 4px 3px 4px; background: transparent url(../img/layout/tooltip.png) no-repeat right bottom; min-width: 100px; max-width: 166px; min-height: 40px; }
ul.image-list.tooltip li:hover figcaption span { background: transparent url(../img/layout/tooltip.png) no-repeat left top; display: block; line-height: 140%; padding: 13% 4px 14% 11px; width: 100%; height: 84%; margin-left: -13px; margin-top: -2px; }

blockquote { font-family: Georgia, Times New Roman, serif; font-size: 25px; line-height: 20px; color: #002e5a; font-style: italic; text-transform: none; font-weight: normal; text-align: center; padding: 0 20px; line-height: 130%; margin: 28px 0; }

.spinner { position: relative; margin: 10px auto; width: 40px; height: 40px; background: transparent url(../img/layout/spinner.gif) no-repeat center center; }

/* prev-next nav for products & cocktails*/
.slider-container { padding-top: 44px; display: none; margin-top: 10px; /*margin-right: 7px;*/ position: relative; float: left; width: 960px; margin-left: 7px !important; position: relative; overflow: hidden; /* to hide second slide within .slider*/ }
.slider-container > .grid_12 { overflow: hidden; background-color: #FFF; }
.slider-container .slider { width: 1920px; margin-left: 0px; }
.slider-container .slider .slide { float: left; background-color: #eff0ea; }
.slider-container .slider.slideLeft { margin-left: -960px; }
.slider-container .slider-navigation { text-align: center; }
.slider-container .slider-navigation a.previous, .slider-container .slider-navigation a.next { position: absolute; top: 280px; text-indent: -9000px; }
.slider-container .slider-navigation a.previous { left: 4px; }
.slider-container .slider-navigation a.next { right: 4px; }
.slider-container .slider-navigation a.go-up { position: absolute; right: 4px; top: 0px; margin: 44px 0 0 0; padding-right: 52px; background-image: url("../img/layout/narrow_arrow.gif"); background-position: right -134px; background-repeat: no-repeat; }
.slider-container .slider-navigation a.go-up:hover { background-position: right -309px; }

/*
	Variable Grid System.
	Learn more ~ http://www.spry-soft.com/grids/
	Based on 960 Grid System - http://960.gs/

	Licensed under GPL and MIT.
*/
/* Containers
----------------------------------------------------------------------------------------------------*/
.container_12 { margin-left: auto; margin-right: auto; width: 960px; }

/* Grid >> Global
----------------------------------------------------------------------------------------------------*/
.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 { display: inline; float: left; position: relative; margin-left: 4px; margin-right: 4px; }

.push_1, .pull_1, .push_2, .pull_2, .push_3, .pull_3, .push_4, .pull_4, .push_5, .pull_5, .push_6, .pull_6, .push_7, .pull_7, .push_8, .pull_8, .push_9, .pull_9, .push_10, .pull_10, .push_11, .pull_11, .push_12, .pull_12 { position: relative; }

/* Grid >> Children (Alpha ~ First, Omega ~ Last)
----------------------------------------------------------------------------------------------------*/
.alpha { margin-left: 0; }

.omega { margin-right: 0; }

/* added HJB */
.grid_12 .grid_12 { margin-left: 0; margin-rihgt: 0; }

/* Grid >> 12 Columns
----------------------------------------------------------------------------------------------------*/
.container_12 .grid_1 { width: 72px; }

.container_12 .grid_2 { width: 152px; }

.container_12 .grid_3 { width: 232px; }

.container_12 .grid_4 { width: 312px; }

.container_12 .grid_5 { width: 392px; }

.container_12 .grid_6 { width: 472px; }

.container_12 .grid_7 { width: 552px; }

.container_12 .grid_8 { width: 632px; }

.container_12 .grid_9 { width: 712px; }

.container_12 .grid_10 { width: 792px; }

.container_12 .grid_11 { width: 872px; }

.container_12 .grid_12 { width: 952px; }

/* Prefix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/
.container_12 .prefix_1 { padding-left: 80px; }

.container_12 .prefix_2 { padding-left: 160px; }

.container_12 .prefix_3 { padding-left: 240px; }

.container_12 .prefix_4 { padding-left: 320px; }

.container_12 .prefix_5 { padding-left: 400px; }

.container_12 .prefix_6 { padding-left: 480px; }

.container_12 .prefix_7 { padding-left: 560px; }

.container_12 .prefix_8 { padding-left: 640px; }

.container_12 .prefix_9 { padding-left: 720px; }

.container_12 .prefix_10 { padding-left: 800px; }

.container_12 .prefix_11 { padding-left: 880px; }

/* Suffix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/
.container_12 .suffix_1 { padding-right: 80px; }

.container_12 .suffix_2 { padding-right: 160px; }

.container_12 .suffix_3 { padding-right: 240px; }

.container_12 .suffix_4 { padding-right: 320px; }

.container_12 .suffix_5 { padding-right: 400px; }

.container_12 .suffix_6 { padding-right: 480px; }

.container_12 .suffix_7 { padding-right: 560px; }

.container_12 .suffix_8 { padding-right: 640px; }

.container_12 .suffix_9 { padding-right: 720px; }

.container_12 .suffix_10 { padding-right: 800px; }

.container_12 .suffix_11 { padding-right: 880px; }

/* Push Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/
.container_12 .push_1 { left: 80px; }

.container_12 .push_2 { left: 160px; }

.container_12 .push_3 { left: 240px; }

.container_12 .push_4 { left: 320px; }

.container_12 .push_5 { left: 400px; }

.container_12 .push_6 { left: 480px; }

.container_12 .push_7 { left: 560px; }

.container_12 .push_8 { left: 640px; }

.container_12 .push_9 { left: 720px; }

.container_12 .push_10 { left: 800px; }

.container_12 .push_11 { left: 880px; }

/* Pull Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/
.container_12 .pull_1 { left: -80px; }

.container_12 .pull_2 { left: -160px; }

.container_12 .pull_3 { left: -240px; }

.container_12 .pull_4 { left: -320px; }

.container_12 .pull_5 { left: -400px; }

.container_12 .pull_6 { left: -480px; }

.container_12 .pull_7 { left: -560px; }

.container_12 .pull_8 { left: -640px; }

.container_12 .pull_9 { left: -720px; }

.container_12 .pull_10 { left: -800px; }

.container_12 .pull_11 { left: -880px; }

/* `Clear Floated Elements
----------------------------------------------------------------------------------------------------*/
/* http://sonspring.com/journal/clearing-floats */
.clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }

/* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified */
/** Commented out because clearfix is also present in Boilerplate */
/*.clearfix:before,*/
/*.clearfix:after {*/
/*content: '\0020';*/
/*display: block;*/
/*overflow: hidden;*/
/*visibility: hidden;*/
/*width: 0;*/
/*height: 0;*/
/*}*/
/*.clearfix:after {*/
/*clear: both;*/
/*}*/
/**/
/*The following zoom:1 rule is specifically for IE6 + IE7.*/
/*Move to separate stylesheet if invalid CSS is a problem.*/
/**/
/*.clearfix {*/
/*zoom: 1;*/
/*}*/
#parallax-container { width: 100%; height: 100%; /*height: 100%;*/ overflow: hidden; position: fixed; }

#parallax { width: 2500px; height: 2670px; position: absolute; margin-left: auto; margin-right: auto; }

#background { width: 1900px; height: 2670px; /*width: 100%;*/ /*height: 100%;*/ position: absolute; /* TODO: Make this image theme dependent */ }
body.agecheck #background { background: url("../img/layout/BolsSplashPage.jpg") no-repeat center top; width: 100%; }

#ipad-app-info { width: 510px; display: block; text-decoration: none; background-color: #fff; margin: 0 auto; position: relative; padding: 15px 60px 15px 60px; top: 100px; cursor: pointer; }
#ipad-app-info .article-header { font-size: 20px; }
#ipad-app-info .app-icon { background: transparent url("../img/splash/ipad-app-icon.png") no-repeat; width: 72px; height: 72px; display: inline-block; vertical-align: middle; position: relative; top: -3px; margin-right: 35px; }

#cookie-explanation { display: none; margin: 0 auto; padding: 40px 80px 48px 80px; position: relative; width: 470px; top: 80px; background-color: #102d4f; }
#cookie-explanation .logo { width: 107px; height: 41px; background: url("../img/layout/bols-logo-white.png") no-repeat; margin: 15px auto 35px auto; }
#cookie-explanation h1 { margin: 45px 0 40px; color: #fff; font-size: 28px; }
#cookie-explanation p, #cookie-explanation article li, article #cookie-explanation li, #cookie-explanation .article li, .article #cookie-explanation li, #cookie-explanation article.grid_4 hgroup h3, article.grid_4 hgroup #cookie-explanation h3, #cookie-explanation .article.grid_4 hgroup h3, .article.grid_4 hgroup #cookie-explanation h3, #cookie-explanation article.grid_8 > h3, #cookie-explanation .article.grid_8 > h3, #cookie-explanation li { font-family: Georgia, Times New Roman, serif; font-size: 13px; line-height: 20px; color: #bbbbbb; }
#cookie-explanation p.return, #cookie-explanation article li.return, article #cookie-explanation li.return, #cookie-explanation .article li.return, .article #cookie-explanation li.return, #cookie-explanation article.grid_4 hgroup h3.return, article.grid_4 hgroup #cookie-explanation h3.return, #cookie-explanation .article.grid_4 hgroup h3.return, .article.grid_4 hgroup #cookie-explanation h3.return, #cookie-explanation article.grid_8 > h3.return, #cookie-explanation .article.grid_8 > h3.return { margin: 40px 0 0; text-align: center; }
#cookie-explanation p.return a, #cookie-explanation article li.return a, article #cookie-explanation li.return a, #cookie-explanation .article li.return a, .article #cookie-explanation li.return a, #cookie-explanation article.grid_4 hgroup h3.return a, article.grid_4 hgroup #cookie-explanation h3.return a, #cookie-explanation .article.grid_4 hgroup h3.return a, .article.grid_4 hgroup #cookie-explanation h3.return a, #cookie-explanation article.grid_8 > h3.return a, #cookie-explanation .article.grid_8 > h3.return a { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 14px; font-weight: lighter; color: white; -webkit-font-smoothing: antialiased; line-height: 114%; text-decoration: underline; }
#cookie-explanation ul { padding: 0 0 0 15px; }
#cookie-explanation li { padding-left: 10px; }
#cookie-explanation .items p, #cookie-explanation .items article li, article #cookie-explanation .items li, #cookie-explanation .items .article li, .article #cookie-explanation .items li, #cookie-explanation .items article.grid_4 hgroup h3, article.grid_4 hgroup #cookie-explanation .items h3, #cookie-explanation .items .article.grid_4 hgroup h3, .article.grid_4 hgroup #cookie-explanation .items h3, #cookie-explanation .items article.grid_8 > h3, #cookie-explanation .items .article.grid_8 > h3 { margin-left: 25px; }

#splash { margin: 0 auto; position: relative; width: 510px; padding: 40px 60px 48px 60px; top: 80px; background-color: #102d4f; }
#splash > * { position: relative; }
#splash > .logo { width: 107px; height: 41px; background: url("../img/layout/bols-logo-white.png") no-repeat; margin: 15px auto 35px auto; }
#splash input[type="submit"] { color: white; background-color: #bbbbbb; border: 0; }
#splash input[type="submit"]:hover { background-color: #fff; color: #494949; }
#splash input[type="button"] { color: #102d4f; background-color: #bbbbbb; border: 0; }
#splash input[type="button"]:hover { background-color: #fff; }
#splash form { margin-top: 40px; text-align: center; }
#splash form > fieldset { float: left; width: 152px; height: 85px; margin-right: 27px; }
#splash form > fieldset.last { margin-right: 0; }
#splash form > fieldset.birth input { float: left; }
#splash form > fieldset input.two { width: 44px; border-right: solid 1px #969591; line-height: 200%; }
#splash form > fieldset input.four { width: 60px; line-height: 200%; }
#splash form label { display: block; text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 14px; font-weight: lighter; color: white; -webkit-font-smoothing: antialiased; line-height: 114%; margin: 0 0 14px 0; }
#splash form input, #splash form select, #splash form option { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 22px; font-weight: lighter; color: #969591; -webkit-font-smoothing: antialiased; line-height: 114%; width: 150px; height: 44px; padding: 0; border: none; }
#splash form input:focus { color: #494949; }
#splash form div.clearfix { top: 16px; float: none; text-align: center; position: relative; }
#splash form div.clearfix label { display: inline; }
#splash form div.clearfix input[type=checkbox] { width: auto; height: auto; }
#splash > h1 { font-family: "BolsHeadline"; font-size: 22px; /* trivial size */ font-weight: lighter; text-align: center; text-transform: uppercase; text-decoration: none; line-height: 110%; /* trivial size */ color: white; /*-webkit-font-smoothing: subpixel-antialiased;	*/ -webkit-font-smoothing: antialiased; margin: 16px 0; line-height: 124%; }
#splash h2 { width: 300px; font-weight: lighter; font-size: 16px; margin: 30px auto 14px; color: #FFF; line-height: 130%; }
#splash .btn-cookie { margin: 45px 0 15px; }
#splash .btn-cookie a { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 14px; font-weight: lighter; color: white; -webkit-font-smoothing: antialiased; line-height: 114%; color: #fff; text-decoration: underline; }

/* .ui-selectmenu from https://github.com/jquery/jquery-ui*/
.ui-selectmenu { display: block; display: inline-block; position: relative; height: 2.2em; vertical-align: middle; text-decoration: none; overflow: hidden; zoom: 1; }

.ui-selectmenu-icon { position: absolute; right: 6px; margin-top: -8px; top: 50%; }

.ui-selectmenu-menu { padding: 0; margin: 0; position: absolute; top: 0; display: none; z-index: 1005; }

/* z-index: 1005 to make selectmenu work with dialog */
.ui-selectmenu-menu ul { padding: 0; margin: 0; list-style: none; position: relative; overflow: auto; overflow-y: auto; overflow-x: hidden; }

.ui-selectmenu-open { display: block; }

.ui-selectmenu-menu-popup { margin-top: -1px; }

.ui-selectmenu-menu li { padding: 0; margin: 0; display: block; border-top: 1px dotted transparent; border-bottom: 1px dotted transparent; border-right-width: 0 !important; border-left-width: 0 !important; font-weight: normal !important; }

.ui-selectmenu-menu li a, .ui-selectmenu-status { line-height: 1.4em; display: block; padding: .405em 2.1em .405em 1em; outline: none; text-decoration: none; }

.ui-selectmenu-menu li.ui-state-disabled a, .ui-state-disabled { cursor: default; }

.ui-selectmenu-menu li.ui-selectmenu-hasIcon a, .ui-selectmenu-hasIcon .ui-selectmenu-status { padding-left: 20px; position: relative; margin-left: 5px; }

.ui-selectmenu-menu li .ui-icon, .ui-selectmenu-status .ui-icon { position: absolute; top: 1em; margin-top: -8px; left: 0; }

.ui-selectmenu-status { line-height: 1.4em; }

.ui-selectmenu-menu li span, .ui-selectmenu-status span { display: block; margin-bottom: .2em; }

.ui-selectmenu-menu li .ui-selectmenu-item-header { font-weight: bold; }

.ui-selectmenu-menu li .ui-selectmenu-item-footer { opacity: .8; }

/* for optgroups */
.ui-selectmenu-menu .ui-selectmenu-group { font-size: 1em; }

.ui-selectmenu-menu .ui-selectmenu-group .ui-selectmenu-group-label { line-height: 1.4em; display: block; padding: .6em .5em 0; font-weight: bold; }

.ui-selectmenu-menu .ui-selectmenu-group ul { margin: 0; padding: 0; }

/* IE6 workaround (dotted transparent borders) */
* html .ui-selectmenu-menu li { border-color: pink; filter: chroma(color=pink); width: 100%; }

* html .ui-selectmenu-menu li a { position: relative; }

/* IE7 workaround (opacity disabled) */
* + html .ui-state-disabled, * + html .ui-state-disabled a { color: silver; }

/* HJB: override defaults*/
.ui-selectmenu-status { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 22px; font-weight: lighter; color: #494949; -webkit-font-smoothing: antialiased; line-height: 114%; line-height: 140%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }

.ui-selectmenu-menu { margin-top: -4px; z-index: 9999 !important; }

.ui-selectmenu { height: 44px; display: block; background-color: #bbbbbb; }

.ui-selectmenu-menu li { border: solid 1px #FFF; height: 42px; }

.ui-selectmenu-menu li a, .ui-selectmenu-status { text-align: left !important; padding: 0.3em 44px 0.3em .405em; background-color: #bbbbbb; color: #fff; }

.ui-selectmenu-menu li a { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 22px; font-weight: lighter; color: #494949; -webkit-font-smoothing: antialiased; line-height: 31px; padding-right: .405em; background-color: #F1F1F1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

.ui-selectmenu-menu li a:hover { color: #000; }

.ui-state-default { border: none; }

.ui-corner-all { -moz-border-radius: 0px !important; -webkit-border-radius: 0px !important; -khtml-border-radius: 0px !important; border-radius: 0px !important; }

.ui-selectmenu-icon { margin-top: 0; right: 0px; top: 0px; background: #bbbbbb url("../img/layout/filter_arrow_white.png") no-repeat 6px center; width: 44px; height: 44px; }

.ui-selectmenu-menu .ui-selectmenu-item-selected a { color: #102d4f; }

.nice-select { width: 100%; margin: 0 0 20px 0; padding: 0; }

#page-container { min-height: 100%; position: relative; width: 974px; margin: 0 auto; background-color: #eff0ea; }

#page { width: 974px; background-color: #eff0ea; padding: 0 0 272px 0; }

#page-content { opacity: 1; }
#page-content.hide { -webkit-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; -o-transition: opacity 0.5s ease-in-out; -ms-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; opacity: 0; }

header#site-header { margin-top: 10px; /*margin-right: 7px;*/ position: relative; float: left; width: 952px; margin-left: 11px; }
header#site-header #bolsLogo { display: block; float: left; position: relative; margin-top: 12px; margin-left: 23px; margin-bottom: 13px; }
header#site-header #header-caption { font-family: "BolsHeadline"; font-size: 22px; /* trivial size */ font-weight: lighter; text-align: center; text-transform: uppercase; text-decoration: none; line-height: 110%; /* trivial size */ color: #002e5a; /*-webkit-font-smoothing: subpixel-antialiased;	*/ -webkit-font-smoothing: antialiased; cursor: default; position: absolute; width: 100%; top: 23px; text-align: center; }
header#site-header #search-container { margin-top: 15px; float: right; position: relative; height: 32px; background-color: white; }
header#site-header #search-container > * { float: left; }

/** all caroussel stuff moved to _caroussel */
/** all top-bar stuff moved to _top-bar */
/** title on top of page */
.section-title { margin-top: 25px; margin-bottom: 5px; }
.section-title > h2 { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 22px; font-weight: lighter; color: #002e5a; -webkit-font-smoothing: antialiased; line-height: 114%; text-align: left; margin-top: 6px; margin-bottom: 12px; }

.page-title { margin-top: 10px; /*margin-right: 7px;*/ position: relative; float: left; width: 952px; margin-left: 11px; margin-bottom: 5px; }
.page-title > h1 { font-family: "BolsHeadline"; font-size: 22px; /* trivial size */ font-weight: lighter; text-align: center; text-transform: uppercase; text-decoration: none; line-height: 110%; /* trivial size */ color: #002e5a; /*-webkit-font-smoothing: subpixel-antialiased;	*/ -webkit-font-smoothing: antialiased; margin-top: 6px; }

#quick-nav { position: absolute; width: 100%; top: 10px; }
#quick-nav a { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 15px; font-weight: lighter; color: #bbbbbb; -webkit-font-smoothing: antialiased; line-height: 114%; line-height: 15px; padding: 0 8px; text-decoration: none; display: inline-block; height: 15px; }
#quick-nav a:hover { color: #102d4f; }
#quick-nav div.prevnext { float: right; }
#quick-nav div.prevnext .prev { border-right: solid 1px #bbbbbb; }
#quick-nav div.prevnext .next { padding-right: 0; }
#quick-nav .hob-events-link { float: right; background-color: #102d4f; color: #fff; padding: 8px 10px 5px 10px; position: relative; top: -7px; line-height: 13px; }
#quick-nav .hob-events-link:hover { background-color: white; }

.section-title > hr, .page-title > hr { color: #bbbbbb; border-color: #bbbbbb; background-color: white; margin-top: 4px; margin-bottom: 0; border-bottom: solid 1px white; height: 0; }

#ipad-hint-bar { height: 44px; background: #dddeda url("../img/tool/ipad-hint-homepage-logo.gif") no-repeat 10px 9px; border-bottom: 1px solid #c2c2c2; padding-left: 50px; }
#ipad-hint-bar h2 { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 15px; font-weight: lighter; color: #102d4f; -webkit-font-smoothing: antialiased; line-height: 45px; text-align: left; margin: 0; display: inline-block; }
#ipad-hint-bar .open-tool, #ipad-hint-bar .close-bar { display: inline-block; line-height: 45px; float: right; }
#ipad-hint-bar .open-tool { width: 130px; height: 100%; background-color: #102d4f; text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 15px; font-weight: lighter; color: white; -webkit-font-smoothing: antialiased; line-height: 43px; }
#ipad-hint-bar .close-bar { width: 44px; height: 44px; text-indent: -99999px; overflow: hidden; background: transparent url("../img/tool/ipad-hint-homepage-close.gif") no-repeat 7px 7px; }

#page nav { position: relative; }

nav div.menu-primary-container { background-color: #102d4f; width: 952px; margin-left: 11px; position: absolute; top: 86px; z-index: 6666; }
nav div.menu-primary-container > ul > li { float: left; }
nav div.menu-primary-container > ul > li a { display: block; height: 50px; padding: 0 22px; }
nav div.menu-primary-container > ul > li:hover > a { color: #102d4f; background-color: #fff; }
nav div.menu-primary-container > ul > li:hover > ul { display: block; }
nav div.menu-primary-container > ul > li.external-link { border-left: 4px solid #eff0ea; float: right; overflow: hidden; }
nav div.menu-primary-container > ul > li.external-link > a { background: #102d4f url("../img/var/menu-arrow.png") no-repeat right -16px; padding-right: 45px; cursor: pointer; text-align: left; }
nav div.menu-primary-container > ul > li.external-link > a:hover { background-position: right -50px; background-color: #fff; }
nav div.menu-primary-container > ul > li > a { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 19px; font-weight: lighter; color: white; -webkit-font-smoothing: antialiased; line-height: 50px; cursor: default; background-color: #102d4f; -webkit-transition: none 1s; -moz-transition: none 1s; -o-transition: none 1s; transition: none 1s; }
nav div.menu-primary-container > ul > li > ul { position: absolute; display: none; -webkit-box-shadow: 0px 2px 2px -1px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0px 2px 2px -1px rgba(0, 0, 0, 0.3); box-shadow: 0px 2px 2px -1px rgba(0, 0, 0, 0.3); }
nav div.menu-primary-container > ul > li > ul a { background-color: white; min-width: 193px; text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 16px; font-weight: lighter; color: #bbbbbb; -webkit-font-smoothing: antialiased; line-height: 50px; text-align: left; border-bottom: 1px solid #eff0ea; }
nav div.menu-primary-container > ul > li > ul a:hover { color: #102d4f; background: white url("../img/var/menu-arrow.png") no-repeat 212px 19px; }

/** CAROUSSEL @param forceHeight: auto (and cropped) when false or not defined, otherwise scaled (and stretched). */
#page-content > #caroussel { margin-top: 10px; /*margin-right: 7px;*/ position: relative; float: left; width: 952px; margin-left: 11px; width: 952px; height: 534px; overflow: hidden; background-color: black; /* moved the arrows to _common-styles.scss because I want to reuse them*/ /* mcr: was 536px but caused a black line after a-href was added */ position: relative; }
#page-content > #caroussel > * { position: absolute; }
#page-content > #caroussel > ul.content { list-style-type: none; margin: 0; padding: 0; opacity: 0; /* TODO: set display:none from javascript, due to SEO ? */ }
#page-content > #caroussel > ul.content > li { float: left; margin: 0; padding: 0; width: 952px; height: 534px; }
#page-content > #caroussel > ul.content > li > * { position: absolute; }
#page-content > #caroussel > ul.content > li > a > img { display: block; width: 952px; height: auto; margin: 0 auto; }
#page-content > #caroussel > ul.content > li > a > img.youtube { height: auto; }
#page-content > #caroussel > ul.content > li > .video-play { /** without position:relative, the cloned play-button will overlap the other */ position: relative; top: 50%; left: 50%; margin: -45px; width: 91px; height: 91px; background-image: url("../img/layout/caroussel/caroussel-video-play.png"); cursor: pointer; }
#page-content > #caroussel > ul.shortcuts { list-style-type: none; margin: 0; padding: 0; top: 494px; left: 40px; }
#page-content > #caroussel > ul.shortcuts > * { float: left; margin-right: 5px; }
#page-content > #caroussel > ul.shortcuts > .caroussel-shortcut { width: 15px; height: 15px; background: url("../img/layout/caroussel/CarouselDot.png") no-repeat; }
#page-content > #caroussel > ul.shortcuts > .caroussel-shortcut.over { width: 15px; height: 15px; background: url("../img/layout/caroussel/CarouselDotRO.png") no-repeat; }
#page-content > #caroussel > ul.shortcuts > .caroussel-shortcut.selected { width: 15px; height: 15px; background: url("../img/layout/caroussel/CarouselDotA.png") no-repeat; }

article.grid_8 > #caroussel { /** approximately 16:9, like the home page caroussel, which is near 16:9 at 960 x 536. */ /*margin-right: 7px;*/ position: relative; width: 616px; height: 346px; overflow: hidden; background-color: black; /* moved the arrows to _common-styles.scss because I want to reuse them*/ margin-top: 0; margin-left: 8px; }
article.grid_8 > #caroussel > * { position: absolute; }
article.grid_8 > #caroussel > ul.content { list-style-type: none; margin: 0; padding: 0; opacity: 0; /* TODO: set display:none from javascript, due to SEO ? */ }
article.grid_8 > #caroussel > ul.content > li { float: left; margin: 0; padding: 0; width: 616px; height: 346px; }
article.grid_8 > #caroussel > ul.content > li > * { position: absolute; }
article.grid_8 > #caroussel > ul.content > li > a > img { display: block; width: 616px; height: auto; margin: 0 auto; }
article.grid_8 > #caroussel > ul.content > li > a > img.youtube { height: auto; }
article.grid_8 > #caroussel > ul.content > li > .video-play { /** without position:relative, the cloned play-button will overlap the other */ position: relative; top: 50%; left: 50%; margin: -45px; width: 91px; height: 91px; background-image: url("../img/layout/caroussel/caroussel-video-play.png"); cursor: pointer; }
article.grid_8 > #caroussel > ul.shortcuts { list-style-type: none; margin: 0; padding: 0; top: 306px; left: 40px; }
article.grid_8 > #caroussel > ul.shortcuts > * { float: left; margin-right: 5px; }
article.grid_8 > #caroussel > ul.shortcuts > .caroussel-shortcut { width: 15px; height: 15px; background: url("../img/layout/caroussel/CarouselDot.png") no-repeat; }
article.grid_8 > #caroussel > ul.shortcuts > .caroussel-shortcut.over { width: 15px; height: 15px; background: url("../img/layout/caroussel/CarouselDotRO.png") no-repeat; }
article.grid_8 > #caroussel > ul.shortcuts > .caroussel-shortcut.selected { width: 15px; height: 15px; background: url("../img/layout/caroussel/CarouselDotA.png") no-repeat; }

#top-bar { background-color: white; margin-top: 10px; margin-left: 8px; }
#top-bar .pulldown .doFilter { width: 174px; }
#top-bar .pulldown ul { width: 230px; }

#mailinglist { float: right; position: relative; margin: 5px 5px 5px 0; }
#mailinglist .loader { background: transparent url("../img/var/ajax-loader.gif") no-repeat; width: 16px; height: 16px; margin: 0 10px 0 0; display: none; }
#mailinglist .loader.sending { display: inline-block; }
#mailinglist .box, #mailinglist a, #mailinglist .resultmsg, #mailinglist .errormsg { display: inline-block; height: 30px; border: 2px solid #102d4f; text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 15px; font-weight: lighter; color: white; -webkit-font-smoothing: antialiased; line-height: 30px; text-align: left; }
#mailinglist input, #mailinglist .info { min-width: 200px; }
#mailinglist input { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 15px; font-weight: lighter; color: #102d4f; -webkit-font-smoothing: antialiased; line-height: 30px; border: 0; margin: 0; padding: 0; display: none; text-align: left; }
#mailinglist input:focus { outline: none; }
#mailinglist input::-webkit-input-placeholder { color: #102d4f; }
#mailinglist input:-moz-placeholder { color: #102d4f; }
#mailinglist input[placeholder] { color: #102d4f; }
#mailinglist a, #mailinglist .resultmsg, #mailinglist .errormsg { background: #102d4f; color: #fff; }
#mailinglist a { padding: 0 7px; }
#mailinglist .resultmsg { display: none; }
#mailinglist .resultmsg p, #mailinglist .resultmsg article li, article #mailinglist .resultmsg li, #mailinglist .resultmsg .article li, .article #mailinglist .resultmsg li, #mailinglist .resultmsg article.grid_4 hgroup h3, article.grid_4 hgroup #mailinglist .resultmsg h3, #mailinglist .resultmsg .article.grid_4 hgroup h3, .article.grid_4 hgroup #mailinglist .resultmsg h3, #mailinglist .resultmsg article.grid_8 > h3, #mailinglist .resultmsg .article.grid_8 > h3 { margin: 0 7px; }
#mailinglist .box { color: #102d4f; padding: 0 12px 0 10px; }
#mailinglist .box.error { border-color: red; }
#mailinglist .errormsg { position: absolute; top: -38px; left: 0; margin: 0; width: 100%; padding: 0; border: 0; display: none; }
#mailinglist .errormsg p, #mailinglist .errormsg article li, article #mailinglist .errormsg li, #mailinglist .errormsg .article li, .article #mailinglist .errormsg li, #mailinglist .errormsg article.grid_4 hgroup h3, article.grid_4 hgroup #mailinglist .errormsg h3, #mailinglist .errormsg .article.grid_4 hgroup h3, .article.grid_4 hgroup #mailinglist .errormsg h3, #mailinglist .errormsg article.grid_8 > h3, #mailinglist .errormsg .article.grid_8 > h3 { margin: 0 7px; }
#mailinglist .errormsg:before { content: ''; position: absolute; bottom: -4px; left: 10px; width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 4px solid #102d4f; }

article .article-arrow, article.product .article-arrow, article.cocktail .article-arrow { display: block; margin: 11px auto 24px auto !important; width: 21px; height: 21px; text-indent: -9999px; background: transparent url(../img/layout/article_arrow_sprite.png) no-repeat left top; }
article.over .article-arrow, article .article-arrow:hover, article.product.over .article-arrow, article.product .article-arrow:hover, article.cocktail.over .article-arrow, article.cocktail .article-arrow:hover { background-position: left -42px; }

.grid_2 .article-arrow { background-position: left -63px; width: 14px; height: 14px; margin-bottom: 0px !important; }
.grid_2.over .article-arrow, .grid_2 .article-arrow:hover { background-position: left -91px; }

div[role="main"] { /* all styles (?) apply even when it's not role=main */ margin-top: 10px; /*margin-right: 7px;*/ position: relative; float: left; width: 960px; margin-left: 7px !important; /**	In the design, there's 10 pixels between the top-bar and the first articles. 8 pixels will be the regular distance caused by the article tags, so 2px are added here. */ margin-top: 2px; }

.slide div[role="main"] { margin-left: 0 !important; }

article, .article { float: left; display: inline; background-color: white; margin-top: 8px; padding-top: 8px; }
article.over, .article.over { background-color: #102d4f; }
article.over h1, article.over h2, article.over p, article.over li, article.over article.grid_4 hgroup h3, article.grid_4 hgroup article.over h3, article.over .article.grid_4 hgroup h3, .article.grid_4 hgroup article.over h3, article.over article.grid_8 > h3, article.over .article.grid_8 > h3, .article.over h1, .article.over h2, .article.over p, .article.over li, .article.over article.grid_4 hgroup h3, article.grid_4 hgroup .article.over h3, .article.over .article.grid_4 hgroup h3, .article.grid_4 hgroup .article.over h3, .article.over article.grid_8 > h3, .article.over .article.grid_8 > h3 { color: #fff; }
article.type-person, .article.type-person { background-color: transparent; }
#single > article, #single > .article { padding-bottom: 23px; }
article h1 + p, article h1 + li, article .article h1 + li, .article article h1 + li, article.grid_4 hgroup h1 + h3, article .article.grid_4 hgroup h1 + h3, .article.grid_4 hgroup article h1 + h3, article.grid_8 > h1 + h3, article .article.grid_8 > h1 + h3, article h1 + ul, article h2 + p, article h2 + li, article .article h2 + li, .article article h2 + li, article.grid_4 hgroup h2 + h3, article .article.grid_4 hgroup h2 + h3, .article.grid_4 hgroup article h2 + h3, article.grid_8 > h2 + h3, article .article.grid_8 > h2 + h3, article h2 + ul, article h3 + p, article h3 + li, article .article h3 + li, .article article h3 + li, article.grid_4 hgroup h3 + h3, article .article.grid_4 hgroup h3 + h3, .article.grid_4 hgroup article h3 + h3, article.grid_8 > h3 + h3, article .article.grid_8 > h3 + h3, article h3 + ul, .article h1 + p, .article h1 + li, .article article.grid_4 hgroup h1 + h3, article.grid_4 hgroup .article h1 + h3, .article.grid_4 hgroup h1 + h3, .article article.grid_8 > h1 + h3, .article.grid_8 > h1 + h3, .article h1 + ul, .article h2 + p, .article h2 + li, .article article.grid_4 hgroup h2 + h3, article.grid_4 hgroup .article h2 + h3, .article.grid_4 hgroup h2 + h3, .article article.grid_8 > h2 + h3, .article.grid_8 > h2 + h3, .article h2 + ul, .article h3 + p, .article h3 + li, .article article.grid_4 hgroup h3 + h3, article.grid_4 hgroup .article h3 + h3, .article.grid_4 hgroup h3 + h3, .article article.grid_8 > h3 + h3, .article.grid_8 > h3 + h3, .article h3 + ul { padding-top: 0px; margin-top: 4px; }
article ul, .article ul { padding-left: 16px; margin-left: 8px; }
article p, article li, article .article li, .article article li, article.grid_4 hgroup h3, article .article.grid_4 hgroup h3, .article.grid_4 hgroup article h3, article.grid_8 > h3, article .article.grid_8 > h3, .article p, .article li, .article article.grid_4 hgroup h3, article.grid_4 hgroup .article h3, .article.grid_4 hgroup h3, .article article.grid_8 > h3, .article.grid_8 > h3 { font-family: Georgia, Times New Roman, serif; font-size: 13px; line-height: 20px; color: #494949; padding: 0 8px; margin-top: 16px; }
article h3, .article h3 { padding: 0 8px; text-transform: uppercase; }
article figcaption, .article figcaption { font-family: Georgia, Times New Roman, serif; font-size: 12px; line-height: 20px; color: #494949; font-style: italic; padding: 0; margin: 4px 32px; }
article li, .article li { padding: 0; margin: 0 0 0 4px; /*text-indent: 36px;*/ }
article hr, .article hr { border: none; color: #102d4f; background-color: #102d4f; height: 1px; }
article img + hr, .article img + hr { margin-top: 0px; }
article .double-col .col, .article .double-col .col { width: 48%; float: left; margin-right: 2%; }
article .double-col .col ul, .article .double-col .col ul { margin-left: 2px; }

article.person header { background-color: white; }
article.person header > img { margin: 8px; }
article.person header > div.image-overlay { position: absolute; top: 38px; bottom: 38px; max-height: 100%; overflow: hidden; /*margin: 30px;*/ width: 350px; right: 38px; }
article.person header > div.image-overlay > div.background { position: absolute; width: 100%; height: 100%; background-color: #0d2c4d; opacity: 0.9; }
article.person header > div.image-overlay > div.content { position: absolute; width: 100%; height: 100%; }
article.person header > div.image-overlay > div.content > h1, article.person header > div.image-overlay > div.content > h2.article-header { font-family: "BolsHeadline"; font-size: 18px; /* trivial size */ font-weight: lighter; text-align: center; text-transform: uppercase; text-decoration: none; line-height: 28px; /* trivial size */ color: #002e5a; /*-webkit-font-smoothing: subpixel-antialiased;	*/ -webkit-font-smoothing: antialiased; font-size: 37px; line-height: 37px; margin: 40px 16px 0; }
article.person header > div.image-overlay > div.content > h2 { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 28px; font-weight: lighter; color: white; -webkit-font-smoothing: antialiased; line-height: 114%; font-size: 47px; line-height: 47px; margin: 0 40px; padding-top: 0; }
article.person header > div.image-overlay > div.content > p, article.person header > div.image-overlay > div.content > li, article.person article.grid_4 hgroup header > div.image-overlay > div.content > h3, article.grid_4 hgroup article.person header > div.image-overlay > div.content > h3, article.person .article.grid_4 hgroup header > div.image-overlay > div.content > h3, .article.grid_4 hgroup article.person header > div.image-overlay > div.content > h3, article.person header > div.image-overlay > div.article.grid_8.content > h3 { font-style: italic; margin: 36px 40px 0 40px; }
article.person header > div.image-overlay > div.content > h1, article.person header > div.image-overlay > div.content > h2.article-header, article.person header > div.image-overlay > div.content h2, article.person header > div.image-overlay > div.content p, article.person header > div.image-overlay > div.content li, article.person header > div.image-overlay > div.content article.grid_4 hgroup h3, article.grid_4 hgroup article.person header > div.image-overlay > div.content h3, article.person header > div.image-overlay > div.content .article.grid_4 hgroup h3, .article.grid_4 hgroup article.person header > div.image-overlay > div.content h3, article.person header > div.image-overlay > div.content article.grid_8 > h3, article.person header > div.image-overlay > div.content .article.grid_8 > h3 { color: white; text-align: center; }
article.person .article { padding-top: 30px; }
article.person .article p:first-child, article.person .article li:first-child, article.person .article article.grid_4 hgroup h3:first-child, article.grid_4 hgroup article.person .article h3:first-child, article.person .article.grid_4 hgroup h3:first-child, article.person .article article.grid_8 > h3:first-child, article.person .article.grid_8 > h3:first-child { font-style: italic; }

article.social, article.order-ticket { margin-top: 28px; margin-bottom: 12px; height: 97px; background-color: transparent; }
article.social > div.background, article.order-ticket > div.background { background-image: url("../img/layout/grid_background_social.png"); background-repeat: no-repeat; margin-right: 0; position: absolute; /*right: 0;*/ left: -62px; width: 366px; height: 97px; }
article.social > div.content, article.order-ticket > div.content { /* width: 100%; do we really need this? */ position: absolute; top: 0; padding: 24px 32px; }
article.social > div.content > .social-container, article.order-ticket > div.content > .social-container { width: 110px; overflow: hidden; float: left; }
article.social > div.content > h1, article.social > div.content > h2.article-header, article.order-ticket > div.content > h1, article.order-ticket > div.content > h2.article-header { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 22px; font-weight: lighter; color: #494949; -webkit-font-smoothing: antialiased; line-height: 114%; margin: 0 0 8px; text-align: left; }

article.order-ticket > div.background { background-image: url("../img/layout/grid_background_ticket.png"); }
article.order-ticket a { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 26px; font-weight: lighter; color: white; -webkit-font-smoothing: antialiased; line-height: 114%; }
article.order-ticket > div.content { padding-top: 32px; }

h1.related, h2.related { font-family: "BolsHeadline"; font-size: 28px; /* trivial size */ font-weight: lighter; text-align: center; text-transform: uppercase; text-decoration: none; line-height: 110%; /* trivial size */ color: #002e5a; /*-webkit-font-smoothing: subpixel-antialiased;	*/ -webkit-font-smoothing: antialiased; font-weight: lighter; margin-top: 0; margin-bottom: 10px; }

/** mixes in the image width and alignment of the arrow */
article.grid_2 { -webkit-transition-property: background-color; -webkit-transition-duration: 0.4s; -webkit-transition-timing-function: ease-in; -webkit-transition-delay: 0s; -moz-transition-property: background-color; -moz-transition-duration: 0.4s; -moz-transition-timing-function: ease-in; -moz-transition-delay: 0s; -o-transition-property: background-color; -o-transition-duration: 0.4s; -o-transition-timing-function: ease-in; -o-transition-delay: 0s; transition-property: background-color; transition-duration: 0.4s; transition-timing-function: ease-in; transition-delay: 0s; }
article.grid_2 > img.thumb, article.grid_2 > img.full { width: 136px; height: auto; }
article.grid_2 > * { margin-left: 8px; margin-right: 8px; margin-left: 8px; margin-right: 8px; }
article.grid_2 hgroup h1, article.grid_2 hgroup h2.article-header { font-size: 18px; margin-bottom: 5px; }
article.grid_2 hgroup h2 { font-size: 11px; margin-top: 0; }
article.grid_2.over { background-color: #102d4f; cursor: hand; cursor: pointer; }
article.grid_2.over hgroup h1, article.grid_2.over hgroup h2.article-header { color: #FFF; }
article.grid_2 p, article.grid_2 li, article.grid_2 article.grid_4 hgroup h3, article.grid_4 hgroup article.grid_2 h3, article.grid_2 .article.grid_4 hgroup h3, .article.grid_4 hgroup article.grid_2 h3, article.grid_2 article.grid_8 > h3, article.grid_2 .article.grid_8 > h3 { font-family: Georgia, Times New Roman, serif; font-size: 8px; line-height: 14px; color: #494949; padding: 8px; margin-top: 16px; }

article.grid_3 { -webkit-transition-property: background-color; -webkit-transition-duration: 0.4s; -webkit-transition-timing-function: ease-in; -webkit-transition-delay: 0s; -moz-transition-property: background-color; -moz-transition-duration: 0.4s; -moz-transition-timing-function: ease-in; -moz-transition-delay: 0s; -o-transition-property: background-color; -o-transition-duration: 0.4s; -o-transition-timing-function: ease-in; -o-transition-delay: 0s; transition-property: background-color; transition-duration: 0.4s; transition-timing-function: ease-in; transition-delay: 0s; }
article.grid_3 > img.thumb, article.grid_3 > img.full { width: 216px; height: auto; }
article.grid_3 > * { margin-left: 8px; margin-right: 8px; }
article.grid_3 hgroup h1, article.grid_3 hgroup h2.article-header { font-size: 28px; margin-bottom: 12px; }
article.grid_3 hgroup h2 { font-size: 18px; margin-top: 0; margin-bottom: 18px; }
article.grid_3.over { background-color: #102d4f; cursor: hand; cursor: pointer; }
article.grid_3.over hgroup h1, article.grid_3.over hgroup h2.article-header { color: #FFF; }

article.grid_4, .article.grid_4 { -webkit-transition-property: background-color; -webkit-transition-duration: 0.4s; -webkit-transition-timing-function: ease-in; -webkit-transition-delay: 0s; -moz-transition-property: background-color; -moz-transition-duration: 0.4s; -moz-transition-timing-function: ease-in; -moz-transition-delay: 0s; -o-transition-property: background-color; -o-transition-duration: 0.4s; -o-transition-timing-function: ease-in; -o-transition-delay: 0s; transition-property: background-color; transition-duration: 0.4s; transition-timing-function: ease-in; transition-delay: 0s; }
article.grid_4 > img.thumb, article.grid_4 > img.full, .article.grid_4 > img.thumb, .article.grid_4 > img.full { width: 296px; height: auto; }
article.grid_4 > *, .article.grid_4 > * { margin-left: 8px; margin-right: 8px; }
article.grid_4.over, .article.grid_4.over { background-color: #102d4f; cursor: hand; cursor: pointer; }
article.grid_4.over hgroup h1, article.grid_4.over hgroup h2.article-header, .article.grid_4.over hgroup h1, .article.grid_4.over hgroup h2.article-header { color: #FFF; }
article.grid_4 .pad-content, .article.grid_4 .pad-content { margin: 0 30px; }
article.grid_4 hgroup h1, article.grid_4 hgroup h2.article-header, .article.grid_4 hgroup h1, .article.grid_4 hgroup h2.article-header { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 34px; font-weight: lighter; color: #002e5a; -webkit-font-smoothing: antialiased; line-height: 34px; margin-top: 14px; }
article.grid_4 hgroup h2, .article.grid_4 hgroup h2 { font-family: "BolsHeadline"; font-size: 22px; /* trivial size */ font-weight: lighter; text-align: center; text-transform: uppercase; text-decoration: none; line-height: 110%; /* trivial size */ color: #002e5a; /*-webkit-font-smoothing: subpixel-antialiased;	*/ -webkit-font-smoothing: antialiased; font-weight: normal; }
article.grid_4 hgroup h3, .article.grid_4 hgroup h3 { font-style: italic; }

article.grid_6 { -webkit-transition-property: background-color; -webkit-transition-duration: 0.4s; -webkit-transition-timing-function: ease-in; -webkit-transition-delay: 0s; -moz-transition-property: background-color; -moz-transition-duration: 0.4s; -moz-transition-timing-function: ease-in; -moz-transition-delay: 0s; -o-transition-property: background-color; -o-transition-duration: 0.4s; -o-transition-timing-function: ease-in; -o-transition-delay: 0s; transition-property: background-color; transition-duration: 0.4s; transition-timing-function: ease-in; transition-delay: 0s; }
article.grid_6 > img.thumb, article.grid_6 > img.full { width: 456px; height: auto; }
article.grid_6 > * { margin-left: 8px; margin-right: 8px; }
article.grid_6.over { background-color: #102d4f; cursor: hand; cursor: pointer; }
article.grid_6.over hgroup h1, article.grid_6.over hgroup h2.article-header { color: #FFF; }

article.grid_8, .article.grid_8 { -webkit-transition-property: background-color; -webkit-transition-duration: 0.4s; -webkit-transition-timing-function: ease-in; -webkit-transition-delay: 0s; -moz-transition-property: background-color; -moz-transition-duration: 0.4s; -moz-transition-timing-function: ease-in; -moz-transition-delay: 0s; -o-transition-property: background-color; -o-transition-duration: 0.4s; -o-transition-timing-function: ease-in; -o-transition-delay: 0s; transition-property: background-color; transition-duration: 0.4s; transition-timing-function: ease-in; transition-delay: 0s; }
article.grid_8 > img.thumb, article.grid_8 > img.full, .article.grid_8 > img.thumb, .article.grid_8 > img.full { width: 616px; height: auto; }
article.grid_8 > *, .article.grid_8 > * { margin-left: 8px; margin-right: 8px; }
article.grid_8 hgroup h1, article.grid_8 hgroup h2.article-header, .article.grid_8 hgroup h1, .article.grid_8 hgroup h2.article-header { margin-bottom: 28px; }
article.grid_8.over, .article.grid_8.over { background-color: #102d4f; cursor: hand; cursor: pointer; }
article.grid_8.over hgroup h1, article.grid_8.over hgroup h2.article-header, .article.grid_8.over hgroup h1, .article.grid_8.over hgroup h2.article-header { color: #FFF; }
article.grid_8 hgroup h1, article.grid_8 hgroup h2.article-header, .article.grid_8 hgroup h1, .article.grid_8 hgroup h2.article-header { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 28px; font-weight: lighter; color: #002e5a; -webkit-font-smoothing: antialiased; line-height: 114%; margin-top: 35px; text-align: center; }
article.grid_8 hgroup h2, .article.grid_8 hgroup h2 { font-family: "BolsHeadline"; font-size: 22px; /* trivial size */ font-weight: lighter; text-align: center; text-transform: uppercase; text-decoration: none; line-height: 110%; /* trivial size */ color: #002e5a; /*-webkit-font-smoothing: subpixel-antialiased;	*/ -webkit-font-smoothing: antialiased; font-weight: normal; }
article.grid_8 .pad-content, .article.grid_8 .pad-content { margin: 14px 34px; }
article.grid_8 > h3, .article.grid_8 > h3 { font-style: italic; }

article.grid_12 { -webkit-transition-property: background-color; -webkit-transition-duration: 0.4s; -webkit-transition-timing-function: ease-in; -webkit-transition-delay: 0s; -moz-transition-property: background-color; -moz-transition-duration: 0.4s; -moz-transition-timing-function: ease-in; -moz-transition-delay: 0s; -o-transition-property: background-color; -o-transition-duration: 0.4s; -o-transition-timing-function: ease-in; -o-transition-delay: 0s; transition-property: background-color; transition-duration: 0.4s; transition-timing-function: ease-in; transition-delay: 0s; }
article.grid_12 > img.thumb, article.grid_12 > img.full { width: 936px; height: auto; }
article.grid_12 > * { margin-left: 0px; margin-right: 0px; }
article.grid_12.over { background-color: #102d4f; cursor: hand; cursor: pointer; }
article.grid_12.over hgroup h1, article.grid_12.over hgroup h2.article-header { color: #FFF; }

article.related { cursor: pointer; padding-bottom: 20px; }

article.trainer { font-family: Georgia, Times New Roman, serif; font-size: 13px; line-height: 20px; color: #494949; }
article.trainer hgroup h1, article.trainer hgroup h2.article-header { font-size: 30px !important; margin-top: 45px !important; margin-bottom: 0px !important; }
article.trainer hgroup h2 { font-size: 12px !important; }
article.trainer .twitter-trainer { text-align: center; margin: 35px 24px 55px 24px; }
article.trainer .twitter-trainer a.twitter-name { font-weight: bold; text-decoration: none; font-style: italic; }
article.trainer .twitter-trainer .tweet { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 18px; font-weight: lighter; color: #002e5a; -webkit-font-smoothing: antialiased; line-height: 114%; line-height: 140%; margin: 16px 0 10px 0; }
article.trainer .twitter-trainer .tweet-when { color: #002e5a; }

article.no-results { text-align: center; min-height: 300px; }

article.product { padding-bottom: 0; }

article.package hgroup h1, article.package h2.article-header, article.course hgroup h1, article.course h2.article-header { margin-top: 28px; }

article.package-small hgroup h1, article.package-small h2.article-header { font-size: 26px !important; }

div#cocktail-selector article.cta { height: 318px; }
div#cocktail-selector article.cta h1, div#cocktail-selector article.cta h2.article-header { height: auto; font-size: 28px; line-height: 31px; margin: 43px 15px 0; }
div#cocktail-selector article.cta h2 { font-size: 18px; margin-left: 15px; margin-right: 15px; }

div#trainers article.cta { -webkit-transition-property: none; -webkit-transition-duration: 0.4s; -webkit-transition-timing-function: ease-in; -webkit-transition-delay: 0s; -moz-transition-property: none; -moz-transition-duration: 0.4s; -moz-transition-timing-function: ease-in; -moz-transition-delay: 0s; -o-transition-property: none; -o-transition-duration: 0.4s; -o-transition-timing-function: ease-in; -o-transition-delay: 0s; transition-property: none; transition-duration: 0.4s; transition-timing-function: ease-in; transition-delay: 0s; height: 439px; }
div#trainers article.cta div.facebook-logo { width: 189px; height: 167px; background: url("../img/var/cta-facebook-logo.gif") no-repeat; margin: 33px auto 0; }
div#trainers article.cta.over div.facebook-logo { background-position: 0 -167px; }
div#trainers article.cta h1, div#trainers article.cta h2.article-header { font-size: 20px; line-height: 20px; margin: 0 40px; }
div#trainers article.cta h2 { font-size: 32px; line-height: 31px; margin-bottom: 32px; margin-top: 21px; }

/** Without resetting the margin, both the sticky div and it's containers will have 4px on the left, adding up to 12 with the right margin of the main article. */
div.sticky { margin: 0; }

div.video { margin-left: 8px; }

.pad-content > .fb_edge_widget_with_comment { margin-left: 8px; }

.facebook-white-sprite, footer div.footer-cell > ul.social > li.facebook { background: url('../img/layout/social/facebook-white-se505f950a5.png') no-repeat; }

.twitter-white-sprite, footer div.footer-cell > ul.social > li.twitter { background: url('../img/layout/social/twitter-white-s07be84d186.png') no-repeat; }

.youtube-white-sprite, footer div.footer-cell > ul.social > li.youtube { background: url('../img/layout/social/youtube-white-sf1c49ebf9d.png') no-repeat; }

.bolsapp-white-sprite, footer div.footer-cell > ul > li.bolsapp a { background: url('../img/layout/social/bolsapp-white-s9c5066792a.png') no-repeat; }

.divider-white-sprite, footer div.footer-cell > ul.social > li.divider { background: url('../img/layout/social/divider-white-s224892ccca.png') no-repeat; }

#bottom-bar { margin-top: 8px; margin-left: 8px; background-color: white; }
#bottom-bar > .pagination { float: right; width: auto; }
#bottom-bar > .pagination > .current { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 22px; font-weight: lighter; color: white; -webkit-font-smoothing: antialiased; line-height: 114%; display: block; color: #494949; line-height: 44px; float: left; width: 44px; height: 44px; background: url("../img/layout/blue_grid.gif") repeat left top; }
#bottom-bar > .pagination > a:link, #bottom-bar > .pagination > a:hover, #bottom-bar > .pagination > a:visited { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 22px; font-weight: lighter; color: white; -webkit-font-smoothing: antialiased; line-height: 114%; display: block; color: #494949; line-height: 44px; float: left; width: 44px; height: 44px; }
#bottom-bar > .pagination > a:link.previous, #bottom-bar > .pagination > a:hover.previous, #bottom-bar > .pagination > a:visited.previous { width: auto; padding: 0 22px; border-right: #494949 1px solid; }
#bottom-bar > .pagination > a:link.next, #bottom-bar > .pagination > a:hover.next, #bottom-bar > .pagination > a:visited.next { width: auto; padding: 0 22px; border-left: #494949 1px solid; }
#bottom-bar > .pagination > a:link:hover, #bottom-bar > .pagination > a:hover:hover, #bottom-bar > .pagination > a:visited:hover { background-color: #102d4f; color: white; }

footer { height: 250px; position: absolute; bottom: 0; float: none; z-index: 6000; }
footer.container_12 { width: 960px; margin: 0 7px 15px 7px; }
footer .bg { background-color: #082238; padding-top: 20px; }
footer div.footer-cell { margin-top: 16px; }
footer div.footer-cell > h1, footer div.footer-cell .footer-header { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 22px; font-weight: lighter; color: white; -webkit-font-smoothing: antialiased; line-height: 114%; margin: 0; text-indent: 0; text-align: left; }
footer div.footer-cell > ul { text-indent: 0; margin: 25px 0; padding: 0; list-style-type: none; }
footer div.footer-cell > ul > li { margin: 0; padding: 5px 0; text-indent: 0; }
footer div.footer-cell > ul > li a { font-family: "BolsHeadline"; font-size: 12px; /* trivial size */ font-weight: lighter; text-align: center; text-transform: uppercase; text-decoration: none; line-height: 114%; /* trivial size */ color: white; /*-webkit-font-smoothing: subpixel-antialiased;	*/ -webkit-font-smoothing: antialiased; text-transform: none; text-align: left; -webkit-font-smoothing: subpixel-antialiased; }
footer div.footer-cell > ul > li a:hover { color: #969591; }
footer div.footer-cell > ul > li a > span.underline { text-decoration: underline; }
footer div.footer-cell > ul > li.bolsapp { height: 46px; }
footer div.footer-cell > ul > li.bolsapp a { height: 33px; vertical-align: middle; display: block; padding-left: 50px; padding-top: 15px; background-position: 0 0; }
footer div.footer-cell > ul > li.bolsapp a:hover, footer div.footer-cell > ul > li.bolsapp a.bolsapp_hover, footer div.footer-cell > ul > li.bolsapp a.bolsapp-hover { background-position: 0 -46px; }
footer div.footer-cell > ul.social > li { float: left; width: 36px; height: 46px; cursor: pointer; padding: 0; }
footer div.footer-cell > ul.social > li.facebook { background-position: 0 -46px; margin-left: -14px; }
footer div.footer-cell > ul.social > li.facebook:hover, footer div.footer-cell > ul.social > li.facebook.facebook_hover, footer div.footer-cell > ul.social > li.facebook.facebook-hover { background-position: 0 0; }
footer div.footer-cell > ul.social > li.twitter { background-position: 0 -46px; }
footer div.footer-cell > ul.social > li.twitter:hover, footer div.footer-cell > ul.social > li.twitter.twitter_hover, footer div.footer-cell > ul.social > li.twitter.twitter-hover { background-position: 0 0; }
footer div.footer-cell > ul.social > li.youtube { background-position: 0 -46px; }
footer div.footer-cell > ul.social > li.youtube:hover, footer div.footer-cell > ul.social > li.youtube.youtube_hover, footer div.footer-cell > ul.social > li.youtube.youtube-hover { background-position: 0 0; }
footer div.footer-cell > ul.social > li.divider { background-position: 0 0; width: 9px; margin: 0 8px; cursor: auto; }
footer div.footer-cell > ul.social > li > a { display: block; width: 36px; height: 46px; }
footer div#footer-copyright { font-family: "BolsHeadline"; font-size: 11px; /* trivial size */ font-weight: lighter; text-align: center; text-transform: uppercase; text-decoration: none; line-height: 114%; /* trivial size */ color: white; /*-webkit-font-smoothing: subpixel-antialiased;	*/ -webkit-font-smoothing: antialiased; -webkit-font-smoothing: subpixel-antialiased; text-align: left; text-transform: none; text-align: center; margin: 6px 0 20px; }

.mailing input { font-family: Georgia, Times New Roman, serif; font-size: 11px; line-height: 114%; color: white; background-color: transparent; color: #fff; border: 1px solid #fff; }
.mailing .mailing-result, .mailing .mailing-error { font-family: Georgia, Times New Roman, serif; font-size: 11px; line-height: 114%; color: white; display: none; }

#notfound { position: relative; width: 952px; height: 560px; margin: 11px 0 4px 11px; background: white; overflow: hidden; }
#notfound #notfound-logo { position: absolute; top: 60px; left: 61px; }
#notfound #notfound-butler { position: absolute; top: 181px; left: 531px; }
#notfound h1 { text-align: left; font-size: 40px; margin: 154px 0 0 59px; }
#notfound p, #notfound article li, article #notfound li, #notfound .article li, .article #notfound li, #notfound article.grid_4 hgroup h3, article.grid_4 hgroup #notfound h3, #notfound .article.grid_4 hgroup h3, .article.grid_4 hgroup #notfound h3, #notfound article.grid_8 > h3, #notfound .article.grid_8 > h3 { font-family: "BolsHeadline"; font-size: 25px; /* trivial size */ font-weight: lighter; text-align: center; text-transform: uppercase; text-decoration: none; line-height: 110%; /* trivial size */ color: #002e5a; /*-webkit-font-smoothing: subpixel-antialiased;	*/ -webkit-font-smoothing: antialiased; text-transform: uppercase; margin: 12px 0 0 59px; width: 440px; text-align: left; line-height: 29px; }
#notfound #notfound-bar { margin: 17px 0 0 60px; }
#notfound #notfound-search-container { margin: 51px 0 0 59px; position: relative; width: 413px; height: 39px; background-color: white; border: 1px solid #002e5a; white-space: nowrap; }
#notfound #notfound-search-container > * { float: left; }
#notfound #notfound-search-container .search-box { width: 304px; font-size: 20px; }
#notfound #notfound-search-container .search-button { width: 93px; height: 39px; background: #002e5a; font-size: 20px; }

body.site-us, body.site-en-uk { background: #ebe8df url("../img/bg/yoghurt.jpg") no-repeat center top; }
body.site-us #page, body.site-us #page-container, body.site-en-uk #page, body.site-en-uk #page-container { background-color: #ebe8df; }
body.site-us #ipad-hint-bar, body.site-en-uk #ipad-hint-bar { background-color: #fff; margin: 0 11px; border: 1px solid #dad7cd; border-top: 0; }
body.site-us #page-content > #caroussel .caroussel-arrow, body.site-en-uk #page-content > #caroussel .caroussel-arrow { background: #ebe8df url("../img/bg/carousel-arrows.png") no-repeat right top; height: 84px; width: 44px; -webkit-transition: width 0.2s, background-position 0.2s; -moz-transition: width 0.2s, background-position 0.2s; -o-transition: width 0.2s, background-position 0.2s; transition: width 0.2s, background-position 0.2s; }
body.site-us #page-content > #caroussel .caroussel-arrow.next, body.site-en-uk #page-content > #caroussel .caroussel-arrow.next { background-position: left -84px; }
body.site-us #page-content > #caroussel .caroussel-arrow:hover, body.site-en-uk #page-content > #caroussel .caroussel-arrow:hover { width: 39px; }
body.site-us #filter-bar .filter-top, body.site-en-uk #filter-bar .filter-top { background-color: #fff; }
body.site-us #filter-bar .filter-bottom, body.site-en-uk #filter-bar .filter-bottom { background-color: #f7f6f3; }
body.site-us #filter-bar li.bols-product, body.site-en-uk #filter-bar li.bols-product { border-color: #f7f6f3; }
body.site-us nav div.menu-primary-container > ul > li + li + li + li + li + li + li, body.site-en-uk nav div.menu-primary-container > ul > li + li + li + li + li + li + li { border-left: 4px solid #ebe8df; }

@media print { #cocktailtool, #parallax-container, header #search-container, nav, .page-title, #page-container > footer , #cocktail-selector , #cocktail-results , .find-cocktail , #quick-nav , .change-filters-button , hr.full { display: none; }
  .leftside { display: block; }
  #site-header { width: 100%; }
  #site-header * { text-align: center; display: inline; width: 100%; margin: 0; padding: 0; }
  #site-header * #header-caption { display: none; }
  img#bolsLogoFB { width: 200pt; height: auto; }
  a#bolsLogo { text-align: center; display: inline; float: none; margin: auto; }
  a#bolsLogo img { width: auto !important; }
  a#bolsLogo:after { content: ""; }
  .print-only { display: block; }
  body { font-family: Georgia, Times New Roman, serif; font-size: 14pt; line-height: 20px; color: black; line-height: 140%; width: 100%; margin: 0; padding: 0; }
  #page { background-color: #FFF; margin: 0; padding: 0; width: 100% !important; }
  .cocktail-ingredients, .cocktail-nav, .cocktail-summary, .cocktail-img, .cocktail-facebook, .cocktail-recipe { display: none; }
  #cocktail-selector, .slider-navigation, .slide { display: none; }
  .currentslide { display: block !important; }
  #print-cocktail { width: auto; }
  #print-cocktail h1, #print-cocktail h2.article-header { font-family: "BolsHeadline"; font-size: 28pt; /* trivial size */ font-weight: lighter; text-align: center; text-transform: uppercase; text-decoration: none; line-height: 114%; /* trivial size */ color: black; /*-webkit-font-smoothing: subpixel-antialiased;	*/ -webkit-font-smoothing: antialiased; padding: 0 24%; margin: 0; }
  #print-cocktail h2 { text-align: center; text-transform: uppercase; text-decoration: none; font-family: "TradeGothicLTStdBdCnNo.20"; font-size: 33pt; font-weight: lighter; color: black; -webkit-font-smoothing: antialiased; line-height: 114%; padding: 0 24%; font-weight: bold; margin: 0; }
  #print-cocktail img { max-width: 100%; min-width: 100%; height: auto; margin-top: -100px; float: left; }
  #print-cocktail .leftside { float: left; width: 32%; }
  #print-cocktail .rightside { float: left; width: 55%; }
  #print-cocktail h3 { font-size: 14pt; font-weight: bold; color: #000; margin-bottom: 0; }
  #print-cocktail h3 + p, #print-cocktail article h3 + li, article #print-cocktail h3 + li, #print-cocktail .article h3 + li, .article #print-cocktail h3 + li, #print-cocktail article.grid_4 hgroup h3 + h3, article.grid_4 hgroup #print-cocktail h3 + h3, #print-cocktail .article.grid_4 hgroup h3 + h3, .article.grid_4 hgroup #print-cocktail h3 + h3, #print-cocktail article.grid_8 > h3 + h3, #print-cocktail .article.grid_8 > h3 + h3 { margin-top: 1pt; }
  #print-cocktail p, #print-cocktail article li, article #print-cocktail li, #print-cocktail .article li, .article #print-cocktail li, #print-cocktail article.grid_4 hgroup h3, article.grid_4 hgroup #print-cocktail h3, #print-cocktail .article.grid_4 hgroup h3, .article.grid_4 hgroup #print-cocktail h3, #print-cocktail article.grid_8 > h3, #print-cocktail .article.grid_8 > h3 { line-height: 140%; }
  #print-cocktail dl { float: left; width: 100%; margin: 2pt 0; padding: 0; }
  #print-cocktail dl dt { margin: 0; padding: 0; float: left; width: 150px; clear: left; font-weight: bold; margin: 2pt 0; }
  #print-cocktail dl dd { margin: 0; padding: 0; float: left; clear: right; }
  #print-cocktail h3.ingredients { float: left; width: 150px; clear: left; margin: 2pt 0; padding: 0; }
  #print-cocktail ul { float: left; margin: 0; padding: 0; }
  #print-cocktail ul li { padding: 0; list-style-type: none; margin: 2pt 0; clear: right; }
  #print-cocktail h4 { clear: both; }
  #print-cocktail .cocktail-stats-print { clear: both !important; width: 100%; height: 40px; margin: 20px 0; position: relative !important; }
  #print-cocktail .cocktail-stats-print div { float: left !important; margin: 0 15px; position: relative !important; }
  #print-cocktail .cocktail-stats-print div img { margin: 0; min-width: auto !important; width: auto !important; height: auto !important; display: block; position: relative; }
  #print-cocktail .cocktail-stats-print .quadrant { width: 107px; height: 37px; }
  #print-cocktail .cocktail-stats-print .weak-strong-sweet-sour { width: 81px; }
  #print-cocktail .cocktail-stats-print .weak-strong-sweet-sour .weak-strong { height: 14px !important; position: relative !important; display: block !important; float: left !important; width: 81px !important; }
  #print-cocktail .cocktail-stats-print .weak-strong-sweet-sour .sweet-sour { height: 14px !important; position: relative; display: block; float: left; width: 81px !important; }
  #print-cocktail .cocktail-stats-print .difficult-easy { width: 63px; height: 33px; } }
.buildinfo { position: fixed; top: 0; right: 0; width: 170px; overflow: hidden; background: #000000; opacity: 0.5; color: #28fe14; border: 1px solid green; font-family: Courier,Arial; font-size: 10px; padding: 10px; margin: 10px; }
.buildinfo a { color: #28fe14; text-decoration: none; }
.buildinfo a:hover { text-decoration: underline; }