@charset "UTF-8";
/* Do not edit base.css - This file is auto-generated by base.scss using SASS - http://sass-lang.com/ */
/* Imports */
/* Mixins...  */
/* Settings... this is where all the default colors, font-sizes, radiuses etc are set. */
/* == VARIABLES == */
/* Extends... Classes that may be extended within the SASS later. */
.track-container:before, .training-map:before, .track-container:after, .training-map:after { content: " "; display: table; }
.track-container:after, .training-map:after { clear: both; }

.carousel-nav a { color: transparent; font: 0/0 a; text-shadow: none; }

.track-box, .testimonial-carousel .slide { box-shadow: 0 0 4px 2px rgba(215, 213, 212, 0.34); }

.track-box ul { list-style: none; margin-left: 0; padding-left: 0; }

.training-callout ul li:before { content: "\f046"; font-family: "FontAwesome"; color: #e17000; margin-right: .5em; }

.track-box { position: relative; overflow: hidden; background-color: white; border: 1px solid #d7d5d4; border-top: 0; border-radius: 8px; }

/* Normalize... from H5BP... get all browsers to behave the same.  */
/*! normalize.css v2.1.1 | MIT License | git.io/normalize */
/* ========================================================================== HTML5 display definitions ========================================================================== */
/* Sort the box-sizing out! */
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

/** 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 styling not present in IE 8/9. */
[hidden] { display: none; }

/* ========================================================================== Base ========================================================================== */
/** 1. Prevent system color scheme's background color being used in Firefox, IE, and Opera. 2. Prevent system color scheme's text color being used in Firefox, IE, and Opera. 3. Set default font family to sans-serif. 4. Prevent iOS text size adjust after orientation change, without disabling user zoom. */
html { background: #fff; /* 1 */ color: #000; /* 2 */ font-family: sans-serif; /* 3 */ -ms-text-size-adjust: 100%; /* 4 */ -webkit-text-size-adjust: 100%; /* 4 */ }

/** Remove default margin. */
body { margin: 0; }

/* ========================================================================== Links ========================================================================== */
/** 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 { 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: Consolas, "Liberation Mono", Courier, monospace; 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 */ }

/** 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; line-height: 1.5; }

th { text-align: left; }

/* ========================================================================== Lists ========================================================================== */
dt { margin-top: 10px; }

dd { margin-left: 0px; }

/* Global Styles... standard HTML modifications for HWX... buttons, images, lists, tables,  etc.  */
html, button, input, select, textarea { color: #333; }

body, table { font-size: 1em; line-height: 1.5; font-family: "Helvetica Neue", Helvetica, Arial, "Open Sans", "Lucida Grande", sans-serif; font-weight: 300; }

/* Remove text-shadow in selection highlight: h5bp.com/i */
::-moz-selection, ::selection { background: #b3d4fc; text-shadow: none; }

a { color: #598ba6; }
a:visited { color: #598ba6; }
a:hover { color: #e17000; }

figcaption { text-align: center; color: #999; font-size: 80%; }

/* We should really add some context to this... h1's, h2's appear differently in panel pages than L300 pages. */
h1 { font-size: 250%; font-weight: 300; line-height: 1.125em; margin: 0px 0px 20px; font-family: "Cabin", "Helvetica Neue", Arial, Helvetica, "Lucida Grande", sans-serif; }
@media only screen and (min-width: 48em) { h1 { font-size: 380%; line-height: 1.5em; } }
h1 + .subtitle { font-size: 110%; color: #999; font-weight: 300; margin-top: 0px; }
@media only screen and (min-width: 48em) { h1 + .subtitle { font-size: 140%; } }
h1.wordy { font-size: 300%; padding-top: 10px; }
h1 a { text-decoration: none; }

h2, .slug_labs .innovation .group_title { font-size: 200%; font-weight: 300; margin: 10px 0px 15px; overflow: auto; font-family: "Cabin", "Helvetica Neue", Arial, Helvetica, "Lucida Grande", sans-serif; }
h2 + .subtitle, .slug_labs .innovation .group_title + .subtitle { font-size: 110%; color: #aaa; font-weight: 300; margin-top: -20px; margin-bottom: 20px; line-height: 170%; }
h2 + h3, .slug_labs .innovation .group_title + h3 { margin-top: 0px; }
h2 + p, .slug_labs .innovation .group_title + p { margin-top: 5px; }
h2 a, .slug_labs .innovation .group_title a { text-decoration: none; }

h3 { font-size: 145%; margin: 40px 0 10px; font-family: "Cabin", "Helvetica Neue", Arial, Helvetica, "Lucida Grande", sans-serif; font-weight: 300; }
h3 + p { margin-top: 0px; }
h3 a { text-decoration: none; }

h4 { margin: 0px; }
h4 + p { margin-top: 0px; }

/* A better looking default horizontal rule */
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }

/* Remove the gap between images and the bottom of their containers: h5bp.com/i/440  */
img { max-width: 100%; vertical-align: middle; }
img.shadowed { -webkit-filter: drop-shadow(0px 0px 8px rgba(0, 0, 0, 0.5)); filter: url(/wp-content/themes/hortonworks/css/shadow.svg#drop-shadow); -ms-filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=0, OffY=0, Color='#777')"; filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=0, OffY=0, Color='#777')"; }

.btn, .bottom_drawer .promo .cta a { display: inline-block; padding: 5px 10px; text-decoration: none; text-align: center; border-radius: 3px; color: #fff; background-color: #69be28; font-weight: bold; margin-right: 5px; margin-bottom: 5px; }
.btn:active, .bottom_drawer .promo .cta a:active { position: relative; top: 1px; }
.btn:visited, .bottom_drawer .promo .cta a:visited { color: #fff; }
.btn:hover, .bottom_drawer .promo .cta a:hover { color: #fff; background-color: #3d7215; }
.btn .subtext, .bottom_drawer .promo .cta a .subtext { color: #d4dee7; color: #9ac5dc; font-weight: normal; font-size: 75%; text-transform: uppercase; display: block; margin-top: 4px; }
.btn.small, .bottom_drawer .promo .cta a.small { padding: 5px 10px; font-size: 80%; }
.btn.large, .bottom_drawer .promo .cta a.large { padding: 15px 30px; font-size: 120%; }
.btn.w_subtext, .bottom_drawer .promo .cta a.w_subtext { padding: 5px; }
.btn.full, .bottom_drawer .promo .cta a.full { width: 100%; display: block; }
.btn.clear, .bottom_drawer .promo .cta a { color: #69be28 !important; border: 1px solid #DCDCDC; background-color: #f2f0ef !important; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y2ZjdmNyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2U3ZThlOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f6f7f7), color-stop(100%, #e7e8e9)); background-image: -moz-linear-gradient(#f6f7f7 0%, #e7e8e9 100%); background-image: -webkit-linear-gradient(#f6f7f7 0%, #e7e8e9 100%); background-image: linear-gradient(#f6f7f7 0%, #e7e8e9 100%); }
.btn.clear:hover, .bottom_drawer .promo .cta a:hover { border: 1px solid #DCDCDC; background-color: #f2f0ef; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2U3ZThlOSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2Y2ZjdmNyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e7e8e9), color-stop(100%, #f6f7f7)); background-image: -moz-linear-gradient(#e7e8e9 0%, #f6f7f7 100%); background-image: -webkit-linear-gradient(#e7e8e9 0%, #f6f7f7 100%); background-image: linear-gradient(#e7e8e9 0%, #f6f7f7 100%); }
.btn.loud, .bottom_drawer .promo .cta a.loud { background: #e17000; color: #fff; border: 0px solid #b05801; }
.btn.loud:hover, .bottom_drawer .promo .cta a.loud:hover { background-color: #ff8003; }
.btn.loud .subtext, .bottom_drawer .promo .cta a.loud .subtext { color: #fee8d4; }

/* For documents linking to xyz sort of file */
a.pdf { padding-left: 20px; background: url(../images/icons/pdf_icon.png) no-repeat; }

ol { padding-left: 20px; }

ol li { margin-bottom: 5px; }

ul ul { padding: 0px; }

/* No Indent for the list */
ul.no-indent, ol.no-indent { padding-left: 15px; }

/* Simple, no dots, just line-breaks */
ul.nodots, .widget_display_topics ul, .related_posts ul, ol.nodots { padding: 0px; }
ul.nodots li, .widget_display_topics ul li, .related_posts ul li, ol.nodots li { list-style-type: none; }

/* Create a commma separated list */
ul.comma_separated, ol.comma_separated { overflow: auto; padding-left: 0px; display: inline-block; }
ul.comma_separated li, ol.comma_separated li { list-style-type: none; display: inline-block; }
ul.comma_separated li:after, ol.comma_separated li:after { content: ", "; }
ul.comma_separated li:last-child:after, ol.comma_separated li:last-child:after { content: ""; }

/* Used for a list of links */
ul.jump_offs, ol.jump_offs { list-style-type: none; padding-left: 0px; }

/* Use with lots of text per bullet. - Adds spacing below the list item to give it more of a paragraph styling */
ul.wide li, ol.wide li { margin-bottom: 10px; }
ul.wide li b:first-child, ul.wide li strong:first-child, ol.wide li b:first-child, ol.wide li strong:first-child { display: block; }
ul.wide li b + br, ol.wide li b + br { display: none; }

ul.check, ol.check { padding-left: 0px; list-style-type: none; }
ul.check li, ol.check li { padding-left: 25px; background: url(/wp-content/themes/hortonworks/images/icons/check_grey_x16.png) left 3px no-repeat; vertical-align: top; margin-bottom: 10px; }

table.fixed, table.fixed tbody { table-layout: fixed; }

td { vertical-align: top; }

/* We don't need padding around a UL if it's the only content in a table */
td > ul:first-child { margin-top: 0px; margin-bottom: 0px; }

/* Avoids funky spacing at the top of a column that starts with a paragraph */
div > p:first-child { margin-top: 0px; }

/* Notations are used for those little footer notes about what's not quite right.... kind of an antiquated paper concept, but occasionally useful. - Used currently in downloads. */
.notations { font-size: 85%; font-style: italic; }

/* Typer - Couldn't think of a better terminology - Describes the type of content below it */
.typer { color: #aaa; text-transform: uppercase; font-size: 80%; }

/* Used as a bit of subtext - Maybe below a form, or a picture */
.footnote { font-size: 85%; }

/* Marker - used to grafiti text..  using it on the homepage to add 2.0 after HDP */
.marker { font-family: 'Permanent Marker', sans-serif; }

/* Used at the bottom of blog posts to show categories this post belongs to. */
.categories a { background-color: #f2f0ef; padding: 3px 5px; border-radius: 3px; line-height: 2; text-decoration: none; }

/* Used to show an update at the beginning of a blog post */
.update-note { background-color: #f6f6f6; padding: 10px; font-weight: bold; }

/* Forms */
/*  Remove default fieldset styles. */
fieldset { border: 0; margin: 0; padding: 0; }

input, select, textarea { border: 1px solid #cccccc; -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px; -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); color: rgba(0, 0, 0, 0.75); font-size: 14px; margin: 0 0 10px 0; padding: 6px; -webkit-transition: all 0.15s linear; -moz-transition: all 0.15s linear; -o-transition: all 0.15s linear; transition: all 0.15s linear; }

textarea { height: 100px; width: 300px; }

input[type="button"], input[type="submit"] { color: #69be28; font-weight: bold; background-color: #f2f0ef; background: -moz-linear-gradient(top, #f6f7f7 0%, #e7e8e9 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f6f7f7), color-stop(100%, #e7e8e9)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f6f7f7 0%, #e7e8e9 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f6f7f7 0%, #e7e8e9 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f6f7f7 0%, #e7e8e9 100%); /* IE10+ */ background: linear-gradient(to bottom, #f6f7f7 0%, #e7e8e9 100%); /* W3C */ border: 1px solid #DCDCDC; }

input.oversize, textarea.oversize { font-size: 17px; padding: 4px 6px; }

input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus, textarea:focus { background: #fafafa; outline: none !important; border-color: #b3b3b3; }

input[disabled], textarea[disabled] { background-color: #ddd; }

/*  Allow only vertical resizing of textareas. */
textarea { resize: vertical; }

fieldset.grey { padding: 10px; padding-bottom: 20px; background-color: #f2f0ef; }

/* == FORMS == */
.labels-on-top label { display: block; font-size: 85%; color: #999; }

.labels-by-side label { display: inline-block; width: 250px; }

.fill-it-out input, .fill-it-out textarea { width: 100%; }

form .grid.row { margin-bottom: 0px; }

form .row { clear: both; }

/* Results of forms... this would be inserted into the header of the page.  */
/* FadeIn will be faded in */
.response { border-left: 5px solid #666; background-color: #f6f6f6; padding: 5px 10px; font-size: 90%; margin: 10px 0px 20px; }
.response .title { font-size: 120%; font-weight: 700; }

.response.success { border-left: 5px solid #69be28; background-color: #e6f2df; color: #69be28; }
.response.success a { color: #3d7215; }
.response.success .title { color: #69be28; font-weight: bold; }

.response.fail { border-left: 5px solid #c00; background-color: #fcc; }
.response.fail .title { color: #c00; }
.response.fail .title a { color: #800; }

/* Gravity Forms Overrides */
html .gform_wrapper .gfield_description { padding: 0; }

/* Grid... this includes the DIY grid, plus the two-hree-four hitter technique */
/* Simple Grid I picked this up from somewhere. - http://css-tricks.com/dont-overthink-it-grids/ */
@media only screen and (min-width: 48em) { .grid { margin: 0 0 2.1875em 0; }
  .grid:after { /* Or @extend clearfix */ content: ""; display: table; clear: both; }
  [class*='col-'] { float: left; padding-right: 2.1875em; }
  .grid [class*='col-']:last-of-type { padding-right: 0; }
  .col-2-3 { width: 66.66%; }
  .col-3-4 { width: 75%; }
  .col-1-3 { width: 33.33%; }
  .col-1-2 { width: 50%; }
  .col-1-4 { width: 25%; }
  .col-1-8 { width: 12.5%; }
  /* Opt-in outside padding */
  .grid-pad { padding: 2.1875em 0 2.1875em 2.1875em; }
  .grid-pad [class*='col-']:last-of-type { padding-right: 2.1875em; } }
@media only screen and (min-width: 48em) { /* We've defined the mainpoints (below) with table display, but these are needed to keep column width's even */
  .three > div, .three > li { width: 33%; }
  .two > div, .two > li { width: 50%; }
  .four > div, .four > li { width: 25%; } }
@media only screen and (min-width: 48em) { .two.hitters > div, .two.hitters > li { width: 48%; }
  .three.hitters > div, .three.hitters > li { width: 32.8%; }
  .four.hitters > div, .four.hitters > li { width: 24.5%; }
  .five.hitters > div, .five.hitters > li { width: 19.5%; } }
/* Layout.. generic panels styles (light-grey, green) Search fields, etc. .  */
/* Mainbody delineates the page from the header and the footer */
.mainbody { background: #f6f6f6; /* Old browsers */ background: -moz-linear-gradient(top, #f0f0f0 0%, #f6f6f6 10%, #fff 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f0f0f0), color-stop(100px, #f6f6f6), color-stop(100%, #fff)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f0f0f0 0%, #f6f6f6 10%, #fff 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f0f0f0 0%, #f6f6f6 10%, #fff 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f0f0f0 0%, #f6f6f6 10%, #fff 100%); /* IE10+ */ background: linear-gradient(to bottom, #f0f0f0 0%, #f6f6f6 10%, #ffffff 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0f0f0', endColorstr='#fafafa',GradientType=0 ); /* IE6-9 */ -moz-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -moz-transition: -moz-transform 500ms ease; -o-transition: -o-transform 500ms ease; -webkit-transition: -webkit-transform 500ms ease; transition: transform 500ms ease; }
.mainbody.active { -moz-transform: translate3d(70%, 0, 0); -webkit-transform: translate3d(70%, 0, 0); transform: translate3d(70%, 0, 0); -moz-transition: -moz-transform 500ms ease; -o-transition: -o-transform 500ms ease; -webkit-transition: -webkit-transform 500ms ease; transition: transform 500ms ease; }

.lowerbody .ps > div { background-color: #fff; overflow: auto; }

/* We want the last page section to have some padding before the footer bar */
.lowerbody .ps:last-child { padding-bottom: 45px; }

/* Show a warning to old browsers that they need to upgrade */
.browsehappy { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; position: relative; z-index: 999999; }

/* Page Sections are full width areas of the page */
.ps { position: relative; clear: both; }
.ps > div { position: relative; margin: auto; max-width: 1200px; border-top: 0px; border-bottom: 0px; overflow: visible; padding: 15px 20px; /* On standard pages, h2's and h3's are left aligned inside the .maincontent area.... but if they come straight inside the main panel, they should be bigger and centered */ }
@media only screen and (min-width: 48em) { .ps > div { padding: 30px 40px; } }
.ps > div > h2, .slug_labs .innovation .ps > div > .group_title { text-align: center; font-size: 250%; margin-bottom: 35px; }
.ps > div > h3 { text-align: center; font-size: 150%; color: #aaa; margin-bottom: 35px; }
.ps > div > h2 + h3, .slug_labs .innovation .ps > div > .group_title + h3 { margin-top: -35px; }

.ps.titlebar { text-align: left; background-color: #69be28; color: #fff; padding-bottom: 0px; min-height: 100px; /* Cuz sometimes you want a regular subtitle... like when there's a menu in the black area */ /* Titlebar Featured Image  */ }
.ps.titlebar > div { padding-top: 10px; text-align: left; }
.ps.titlebar .subtitle p { margin: 0px; }
.ps.titlebar .basic_subtitle { font-size: 120%; }
@media only screen and (min-width: 48em) { .ps.titlebar .basic_subtitle { font-size: 150%; margin-bottom: -10px; margin-top: -10px; } }
.ps.titlebar .green_subtitle { text-transform: none; }
.ps.titlebar .featured_image { float: right; right: 50px; top: 20px; }
.ps.titlebar h1 { color: #fff; margin-top: 20px; margin-bottom: 20px; }
@media only screen and (min-width: 48em) { .ps.titlebar h1 { margin-bottom: 10px; } }
.ps.titlebar h1 + .subtitle { background-color: #000; color: #fff; width: auto; padding: 5px 20px 10px; margin: 10px -20px -20px; }
@media only screen and (min-width: 48em) { .ps.titlebar h1 + .subtitle { padding: 5px 40px; margin: 10px -40px -30px; } }
.ps.titlebar a { color: #e6f2df; text-decoration: none; }
.ps.titlebar a:hover { color: #fff; text-decoration: underline; }
.ps.titlebar.grey { background-color: #d7d5d4; color: #555; border-top: 1px solid #ccc; padding-bottom: 0px; }
.ps.titlebar.grey h1 { color: #555; }
.ps.titlebar.grey .breadcrumb a { color: #44697d; }
.ps.titlebar.grey .breadcrumb a:hover { color: #e17000; }

.green { color: #fff; }
.green.full { background-color: #69be28; }
.green .date { color: #e6f2df; }
.green a { color: #fff; }
.green a:hover { color: #e6f2df; text-decoration: underline; }
.green a.alt { color: #000; }
.green a.btn, .green .bottom_drawer .promo .cta a, .bottom_drawer .promo .cta .green a { background: #3d7215; border: 1px solid #3d7215; color: #fff; }
.green a.btn:hover, .green .bottom_drawer .promo .cta a:hover, .bottom_drawer .promo .cta .green a:hover { border: 1px solid #e6f2df; }
.green h2, .green .slug_labs .innovation .group_title, .slug_labs .innovation .green .group_title { color: #fff; }
.green h3 { color: #fff; }
.green h2 + h3, .green .slug_labs .innovation .group_title + h3, .slug_labs .innovation .green .group_title + h3 { color: #3d7215; }
.green .related_posts .post .date { color: #e6f2df; }
.green .related_posts .post .author { color: #e6f2df; }

.ps.green > div { background-color: #69be28; }

.orange { color: #fff; }
.orange.full { background-color: #e17000; }
.orange a { color: #fff; }
.orange a:hover { color: #fee8d4; }
.orange a.alt { color: #000; }
.orange a.btn, .orange .bottom_drawer .promo .cta a, .bottom_drawer .promo .cta .orange a { background: #b05801; border: 1px solid #b05801; color: #fff; }
.orange a.btn:hover, .orange .bottom_drawer .promo .cta a:hover, .bottom_drawer .promo .cta .orange a:hover { border: 1px solid #fee8d4; }

.ps.orange > div { background-color: #e17000; }

.dark { color: #fff; }
.dark a { color: #fff; }
.dark a:hover { color: #e6f2df; }
.dark a.alt { color: #000; }
.dark.full { background-color: rgba(0, 0, 0, 0.9); }
.dark h3 { color: #69be28; }

.ps.dark > div { background-color: rgba(0, 0, 0, 0.9); }

.light-grey.full { background-color: #f2f0ef; }
.light-grey h2 + h3, .light-grey .slug_labs .innovation .group_title + h3, .slug_labs .innovation .light-grey .group_title + h3 { color: #69be28; }

.ps.light-grey > div { background-color: #f2f0ef; }

/* Used when we want to break the standard frame and let the background show through */
.ps.clear > div, .bottom_drawer .promo .cta a.ps > div { background-color: transparent; }

/* Used to prevent a divided full-width bleed. - Typical for the bottom of the page */
.ps.divided { overflow: auto; }
.ps.divided > div { padding: 0px; }
.ps.divided > div > div { padding: 40px; width: 50%; float: left; }
.ps.divided > div > div.green { background: #69be28 url(http://hortonworks.com/wp-content/uploads/unversioned/backgrounds/square-green-carter.jpg) center center; }
.ps.divided > div > div.dark { background: #000 url(http://hortonworks.com/wp-content/uploads/unversioned/backgrounds/square-black-elephant.jpg) center center; }
.ps.divided > div > div h3:first-child { margin-top: 0px; }

/* This acts a little like a panel divider, but it can sit within the content.... it's only used on the customers page! */
.divider { overflow: auto; padding-bottom: 45px; padding-top: 0px; background: url(/wp-content/themes/hortonworks/images/assets/divider_light.jpg) no-repeat scroll center bottom transparent; }
.divider.top { background-position: center top; padding-bottom: 25px; padding-top: 35px; }

/* Aside is the sidebar in the L300 templates. */
.aside { font-size: 90%; }
@media only screen and (min-width: 48em) { .aside { border-left: 1px solid #eee; }
  .aside.left { padding-right: 45px; }
  .aside.right { padding-left: 35px; padding-right: 0px; } }
.aside h3:first-child { margin-top: 0px; }

/* Simple tab system for inlining small chunks of content */
ul.tabs { list-style-type: none; padding-left: 0px !important; padding: 5px; margin-left: -5px; padding-bottom: 0px; }
ul.tabs li { z-index: 2; position: relative; padding: 3px 10px; margin-right: 10px; background-color: #ccc; display: block; width: 100%; margin-bottom: 2px; }
@media only screen and (min-width: 48em) { ul.tabs li { display: inline-block; border-radius: 10px; margin-bottom: 0; width: auto; } }
ul.tabs li.active, ul.tabs li:hover { background-color: #44697d; }
ul.tabs li a { text-decoration: none; color: #fff; }
ul.tabs li.spacer { background-color: #fff; }
@media only screen and (min-width: 48em) { ul.tabs li.spacer { width: 30px; } }

/* Options Panel - Static, right aligned panel with a link for feedback, contact, fwd etc.  */
#options_panel { color: #fff; border-bottom: 0px; padding: 0px; z-index: 100; display: none; }
@media only screen and (min-width: 48em) { #options_panel { display: block; position: fixed; right: -97px; top: 500px; border-right: 3px solid #69be28; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); transform: rotate(-90deg); } }
#options_panel ul { padding-left: 0px; overflow: hidden; margin: 0px; }
#options_panel li { background-color: #333; list-style-type: none; float: right; padding: 0px; overflow: hidden; }
#options_panel li:last-of-type { display: block; }
@media only screen and (min-width: 48em) { #options_panel li { border-right: 2px solid #fff; display: block; } }
@media only screen and (min-width: 48em) { #options_panel li img { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); transform: rotate(90deg); } }
#options_panel li .fa { font-size: 150%; padding: 1px 4px 7px 4px; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); transform: rotate(90deg); }
#options_panel li.chat-to-sales { padding: 0px; background-color: transparent; }
#options_panel a { display: inline-block; color: #fff; padding: 5px 12px 8px; text-decoration: none; height: 37px; font-weight: 500; }
#options_panel a:hover { background-color: #e17000; }

.modal { display: none; padding: 10px; }

/* Icons... icomoon stuff, but is this working?  */
/* I think we have to stuff font declarations up front? */
@font-face { font-family: 'icomoon'; src: url("../fonts/icomoon.eot?-ml0117"); src: url("../fonts/icomoon.eot?#iefix-ml0117") format("embedded-opentype"), url("../fonts/icomoon.woff?-ml0117") format("woff"), url("../fonts/icomoon.ttf?-ml0117") format("truetype"), url("../fonts/icomoon.svg?-ml0117#icomoon") format("svg"); font-weight: normal; font-style: normal; }
[class^="icon-"], [class*=" icon-"] { font-family: 'icomoon'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.icon-download:before { content: "\e600"; }

.icon-pdf:before { content: "\e601"; }

.icon-menu:before { content: "\e602"; }

.icon-language:before { content: "\e603"; }

.icon-search:before { content: "\e604"; }

.icon-profile:before { content: "\e605"; }

.icon-close:before { content: "\e606"; }

.icon-drop:before { content: "\e607"; }

/* Utilities... these are things class descriptors like clearfixes, leftaligns, notes,  etc.  */
/* Used to launch an item out of the maincontent area into the green titlebar.... currently used with the badges for the YARN ready program etc. */
@media only screen and (min-width: 75em) { .send-to-titlebar { position: absolute; top: -180px; right: 70px; } }

/* This is used quite extensively in WP */
img.alignleft, .maincontent img.alignleft { float: left; margin: 8px 15px 15px 0; }

img.alignright, .maincontent img.alignright { float: right; margin: 8px 0 15px 15px; }

/* Align text in the div */
.center { text-align: center; }

.align-right { text-align: right; }

.align-left { text-align: left; }

/* Image replacement */
.ir { background-color: transparent; border: 0; overflow: hidden; *text-indent: -9999px; }

.ir:before { content: ""; display: block; width: 0; height: 150%; }

/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* Clearfix: contain floats - http://nicolasgallagher.com/micro-clearfix-hack/  - note there's a mixin for clearfix*/
.clearfix:before, .clearfix:after { content: " "; display: table; }

.clearfix:after { clear: both; }

.clearfix { *zoom: 1; }

/* Grayscale - Turns logos etc - gray: Media  */
.grayscale img { filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale"); /* Firefox 3.5+ */ filter: gray; /* IE6-9 */ -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */ -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); }

/* Make text smaller */
div.smaller, p.smaller, span.smaller { font-size: 80%; }

/* WP Image Captions */
.wp-caption { font-weight: bold; font-size: 85%; color: #999; border: 0; max-width: 96%; /* Image does not overflow the content area */ padding: 5px 3px 10px; text-align: center; }

.wp-caption.alignnone { margin: 5px 20px 20px 0; }

.wp-caption.alignleft { margin: 5px 20px 20px 0; float: left; }

.wp-caption.alignright { margin: 5px 0 20px 20px; float: right; }

.wp-caption img { border: 0 none; height: auto; margin: 0 0 5px 0; max-width: 98.5%; padding: 0; width: auto; }

/* == WORDPRESS STYLE OVERRIDES */
.widget_display_topics li { margin-bottom: 10px; }

.widget_display_topics li > div { font-size: 80%; color: #aaa; }

/* DB Queries on dev */
.db_queries { font-size: 10px; width: 800px; }

/* Google Site Search - Supress the Paid Ads until we renew our account */
.gsc-adBlock { display: none !important; }

.gsc-adBlockVertical { display: none !important; }

.gsc-wrapper.gsc-thinWrapper { width: 100% !important; border-right: 0px; }

/* == GRAVITY FORMS OVERRIDES */
.gform_wrapper .top_label .gfield_label { font-weight: normal; margin: 0 0 2px 0; }

/* Used with the menu items. */
.show-on-mobile, nav#main ul.sub-menu li.show-on-mobile { display: block; }
@media only screen and (min-width: 48em) { .show-on-mobile, nav#main ul.sub-menu li.show-on-mobile { display: none; } }

/* Used to allow editors to place notes in content that are not visible to users */
/* Used anytime we want to create a note when browsing the text */
.note { display: none; background-color: #ffff99; padding: 3px 8px; }

.is_editor .note, .is_admin .note { display: block; }

.is_editor span.note, .is_admin span.note { display: inline; }

.in_test { display: none; }

.is_admin .in_test { display: block; }

/* Edit Link - Usually used to give Admins the ability to edit a chunk of content */
.edit_link a, a.edit_link { display: none; }

.admin-bar .edit_link a, .admin-bar a.edit_link { display: inline; color: #e17000; font-size: 80%; text-decoration: none; }

.admin-bar .edit_link a:hover, .admin-bar a.edit_link:hover { text-decoration: underline; }

.admin-bar .editable_area { border: 1px solid transparent; position: relative; }

.admin-bar .editable_area .edit_link { display: none; position: absolute; top: -20px; right: 0px; }

.admin-bar .editable_area:hover { border: 1px dashed #aaa; }

.admin-bar .editable_area:hover .edit_link { display: block; text-decoration: underline; }

/* Added by JS to external links in the document: Font Icon */
.ext-link { background-image: url(/wp-content/themes/hortonworks/images/assets/ext.png); background-position: top right; background-repeat: no-repeat; padding-right: 12px; }

.ext-link.treat-as-local { background-image: none; }

/* bbPress */
/* BBPress Overrides */
#content table.bbp-topics tbody tr.status-closed td, #content table.bbp-topics tbody tr.status-closed td a { color: #333 !important; }

#bbpress-forums p.bbp-topic-meta img.avatar, #bbpress-forums ul.bbp-reply-revision-log img.avatar, #bbpress-forums ul.bbp-topic-revision-log img.avatar, #bbpress-forums div.bbp-template-notice img.avatar, #bbpress-forums .widget_display_topics img.avatar, #bbpress-forums .widget_display_replies img.avatar { margin-bottom: 10px !important; }

.subscription-toggle { float: right; margin-top: 5px; }

.moderator_email { font-size: 10px; }

#bbpress-forums .status-closed, #bbpress-forums .status-closed a { color: #333 !important; }

li.bbp-body > ul { margin: 0 !important; }

a.reply_toggler { display: block; float: right; margin: 10px; background: #f4f4f4; border: 1px solid #dddddd; padding: 5px 10px; }

.global_reply_toggler span.ajax_image { display: none; }

.bbp-footer { display: none; }

.bbp-breadcrumb-home { display: none; }

.bbp-breadcrumb-home + .bbp-breadcrumb-sep { display: none; }

.bbp-template-notice .open-login, .bbp-template-notice .register { color: #598ba6; }

/*!
 *  Font Awesome 4.1.0 by @davegandy - http://fontawesome.io - @fontawesome
 *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
 */
.test { color: #fff; }

/* FONT PATH -------------------------- */
@font-face { font-family: 'FontAwesome'; src: url("//netdna.bootstrapcdn.com/font-awesome/4.1.0/fonts/fontawesome-webfont.eot?v=4.1.0"); src: url("//netdna.bootstrapcdn.com/font-awesome/4.1.0/fonts/fontawesome-webfont.eot?#iefix&v=4.1.0") format("embedded-opentype"), url("//netdna.bootstrapcdn.com/font-awesome/4.1.0/fonts/fontawesome-webfont.woff?v=4.1.0") format("woff"), url("//netdna.bootstrapcdn.com/font-awesome/4.1.0/fonts/fontawesome-webfont.ttf?v=4.1.0") format("truetype"), url("//netdna.bootstrapcdn.com/font-awesome/4.1.0/fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular") format("svg"); font-weight: normal; font-style: normal; }
.fa { display: inline-block; font-family: FontAwesome; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* makes the font 33% larger relative to the icon container */
.fa-lg { font-size: 1.33333em; line-height: 0.75em; vertical-align: -15%; }

.fa-2x { font-size: 2em; }

.fa-3x { font-size: 3em; }

.fa-4x { font-size: 4em; }

.fa-5x { font-size: 5em; }

.fa-fw { width: 1.28571em; text-align: center; }

.fa-ul { padding-left: 0; margin-left: 2.14286em; list-style-type: none; }
.fa-ul > li { position: relative; }

.fa-li { position: absolute; left: -2.14286em; width: 2.14286em; top: 0.14286em; text-align: center; }
.fa-li.fa-lg { left: -1.85714em; }

.fa-border { padding: .2em .25em .15em; border: solid 0.08em #eee; border-radius: .1em; }

.pull-right { float: right; }

.pull-left { float: left; }

.fa.pull-left { margin-right: .3em; }
.fa.pull-right { margin-left: .3em; }

.fa-spin { -webkit-animation: spin 2s infinite linear; -moz-animation: spin 2s infinite linear; -o-animation: spin 2s infinite linear; animation: spin 2s infinite linear; }

@-moz-keyframes spin { 0% { -moz-transform: rotate(0deg); }
  100% { -moz-transform: rotate(359deg); } }
@-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(359deg); } }
@-o-keyframes spin { 0% { -o-transform: rotate(0deg); }
  100% { -o-transform: rotate(359deg); } }
@keyframes spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -webkit-transform: rotate(359deg); transform: rotate(359deg); } }
.fa-rotate-90 { filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); }

.fa-rotate-180 { filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); }

.fa-rotate-270 { filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); -webkit-transform: rotate(270deg); -moz-transform: rotate(270deg); -ms-transform: rotate(270deg); -o-transform: rotate(270deg); transform: rotate(270deg); }

.fa-flip-horizontal { filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0); -webkit-transform: scale(-1, 1); -moz-transform: scale(-1, 1); -ms-transform: scale(-1, 1); -o-transform: scale(-1, 1); transform: scale(-1, 1); }

.fa-flip-vertical { filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); -webkit-transform: scale(1, -1); -moz-transform: scale(1, -1); -ms-transform: scale(1, -1); -o-transform: scale(1, -1); transform: scale(1, -1); }

.fa-stack { position: relative; display: inline-block; width: 2em; height: 2em; line-height: 2em; vertical-align: middle; }

.fa-stack-1x, .fa-stack-2x { position: absolute; left: 0; width: 100%; text-align: center; }

.fa-stack-1x { line-height: inherit; }

.fa-stack-2x { font-size: 2em; }

.fa-inverse { color: #fff; }

/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen readers do not read off random characters that represent icons */
.fa-glass:before { content: ""; }

.fa-music:before { content: ""; }

.fa-search:before { content: ""; }

.fa-envelope-o:before { content: ""; }

.fa-heart:before { content: ""; }

.fa-star:before { content: ""; }

.fa-star-o:before { content: ""; }

.fa-user:before { content: ""; }

.fa-film:before { content: ""; }

.fa-th-large:before { content: ""; }

.fa-th:before { content: ""; }

.fa-th-list:before { content: ""; }

.fa-check:before { content: ""; }

.fa-times:before { content: ""; }

.fa-search-plus:before { content: ""; }

.fa-search-minus:before { content: ""; }

.fa-power-off:before { content: ""; }

.fa-signal:before { content: ""; }

.fa-gear:before, .fa-cog:before { content: ""; }

.fa-trash-o:before { content: ""; }

.fa-home:before { content: ""; }

.fa-file-o:before { content: ""; }

.fa-clock-o:before { content: ""; }

.fa-road:before { content: ""; }

.fa-download:before { content: ""; }

.fa-arrow-circle-o-down:before { content: ""; }

.fa-arrow-circle-o-up:before { content: ""; }

.fa-inbox:before { content: ""; }

.fa-play-circle-o:before { content: ""; }

.fa-rotate-right:before, .fa-repeat:before { content: ""; }

.fa-refresh:before { content: ""; }

.fa-list-alt:before { content: ""; }

.fa-lock:before { content: ""; }

.fa-flag:before { content: ""; }

.fa-headphones:before { content: ""; }

.fa-volume-off:before { content: ""; }

.fa-volume-down:before { content: ""; }

.fa-volume-up:before { content: ""; }

.fa-qrcode:before { content: ""; }

.fa-barcode:before { content: ""; }

.fa-tag:before { content: ""; }

.fa-tags:before { content: ""; }

.fa-book:before { content: ""; }

.fa-bookmark:before { content: ""; }

.fa-print:before { content: ""; }

.fa-camera:before { content: ""; }

.fa-font:before { content: ""; }

.fa-bold:before { content: ""; }

.fa-italic:before { content: ""; }

.fa-text-height:before { content: ""; }

.fa-text-width:before { content: ""; }

.fa-align-left:before { content: ""; }

.fa-align-center:before { content: ""; }

.fa-align-right:before { content: ""; }

.fa-align-justify:before { content: ""; }

.fa-list:before { content: ""; }

.fa-dedent:before, .fa-outdent:before { content: ""; }

.fa-indent:before { content: ""; }

.fa-video-camera:before { content: ""; }

.fa-photo:before, .fa-image:before, .fa-picture-o:before { content: ""; }

.fa-pencil:before { content: ""; }

.fa-map-marker:before { content: ""; }

.fa-adjust:before { content: ""; }

.fa-tint:before { content: ""; }

.fa-edit:before, .fa-pencil-square-o:before { content: ""; }

.fa-share-square-o:before { content: ""; }

.fa-check-square-o:before { content: ""; }

.fa-arrows:before { content: ""; }

.fa-step-backward:before { content: ""; }

.fa-fast-backward:before { content: ""; }

.fa-backward:before { content: ""; }

.fa-play:before { content: ""; }

.fa-pause:before { content: ""; }

.fa-stop:before { content: ""; }

.fa-forward:before { content: ""; }

.fa-fast-forward:before { content: ""; }

.fa-step-forward:before { content: ""; }

.fa-eject:before { content: ""; }

.fa-chevron-left:before { content: ""; }

.fa-chevron-right:before { content: ""; }

.fa-plus-circle:before { content: ""; }

.fa-minus-circle:before { content: ""; }

.fa-times-circle:before { content: ""; }

.fa-check-circle:before { content: ""; }

.fa-question-circle:before { content: ""; }

.fa-info-circle:before { content: ""; }

.fa-crosshairs:before { content: ""; }

.fa-times-circle-o:before { content: ""; }

.fa-check-circle-o:before { content: ""; }

.fa-ban:before { content: ""; }

.fa-arrow-left:before { content: ""; }

.fa-arrow-right:before { content: ""; }

.fa-arrow-up:before { content: ""; }

.fa-arrow-down:before { content: ""; }

.fa-mail-forward:before, .fa-share:before { content: ""; }

.fa-expand:before { content: ""; }

.fa-compress:before { content: ""; }

.fa-plus:before { content: ""; }

.fa-minus:before { content: ""; }

.fa-asterisk:before { content: ""; }

.fa-exclamation-circle:before { content: ""; }

.fa-gift:before { content: ""; }

.fa-leaf:before { content: ""; }

.fa-fire:before { content: ""; }

.fa-eye:before { content: ""; }

.fa-eye-slash:before { content: ""; }

.fa-warning:before, .fa-exclamation-triangle:before { content: ""; }

.fa-plane:before { content: ""; }

.fa-calendar:before { content: ""; }

.fa-random:before { content: ""; }

.fa-comment:before { content: ""; }

.fa-magnet:before { content: ""; }

.fa-chevron-up:before { content: ""; }

.fa-chevron-down:before { content: ""; }

.fa-retweet:before { content: ""; }

.fa-shopping-cart:before { content: ""; }

.fa-folder:before { content: ""; }

.fa-folder-open:before { content: ""; }

.fa-arrows-v:before { content: ""; }

.fa-arrows-h:before { content: ""; }

.fa-bar-chart-o:before { content: ""; }

.fa-twitter-square:before { content: ""; }

.fa-facebook-square:before { content: ""; }

.fa-camera-retro:before { content: ""; }

.fa-key:before { content: ""; }

.fa-gears:before, .fa-cogs:before { content: ""; }

.fa-comments:before { content: ""; }

.fa-thumbs-o-up:before { content: ""; }

.fa-thumbs-o-down:before { content: ""; }

.fa-star-half:before { content: ""; }

.fa-heart-o:before { content: ""; }

.fa-sign-out:before { content: ""; }

.fa-linkedin-square:before { content: ""; }

.fa-thumb-tack:before { content: ""; }

.fa-external-link:before { content: ""; }

.fa-sign-in:before { content: ""; }

.fa-trophy:before { content: ""; }

.fa-github-square:before { content: ""; }

.fa-upload:before { content: ""; }

.fa-lemon-o:before { content: ""; }

.fa-phone:before { content: ""; }

.fa-square-o:before { content: ""; }

.fa-bookmark-o:before { content: ""; }

.fa-phone-square:before { content: ""; }

.fa-twitter:before { content: ""; }

.fa-facebook:before { content: ""; }

.fa-github:before { content: ""; }

.fa-unlock:before { content: ""; }

.fa-credit-card:before { content: ""; }

.fa-rss:before { content: ""; }

.fa-hdd-o:before { content: ""; }

.fa-bullhorn:before { content: ""; }

.fa-bell:before { content: ""; }

.fa-certificate:before { content: ""; }

.fa-hand-o-right:before { content: ""; }

.fa-hand-o-left:before { content: ""; }

.fa-hand-o-up:before { content: ""; }

.fa-hand-o-down:before { content: ""; }

.fa-arrow-circle-left:before { content: ""; }

.fa-arrow-circle-right:before { content: ""; }

.fa-arrow-circle-up:before { content: ""; }

.fa-arrow-circle-down:before { content: ""; }

.fa-globe:before { content: ""; }

.fa-wrench:before { content: ""; }

.fa-tasks:before { content: ""; }

.fa-filter:before { content: ""; }

.fa-briefcase:before { content: ""; }

.fa-arrows-alt:before { content: ""; }

.fa-group:before, .fa-users:before { content: ""; }

.fa-chain:before, .fa-link:before { content: ""; }

.fa-cloud:before { content: ""; }

.fa-flask:before { content: ""; }

.fa-cut:before, .fa-scissors:before { content: ""; }

.fa-copy:before, .fa-files-o:before { content: ""; }

.fa-paperclip:before { content: ""; }

.fa-save:before, .fa-floppy-o:before { content: ""; }

.fa-square:before { content: ""; }

.fa-navicon:before, .fa-reorder:before, .fa-bars:before { content: ""; }

.fa-list-ul:before { content: ""; }

.fa-list-ol:before { content: ""; }

.fa-strikethrough:before { content: ""; }

.fa-underline:before { content: ""; }

.fa-table:before { content: ""; }

.fa-magic:before { content: ""; }

.fa-truck:before { content: ""; }

.fa-pinterest:before { content: ""; }

.fa-pinterest-square:before { content: ""; }

.fa-google-plus-square:before { content: ""; }

.fa-google-plus:before { content: ""; }

.fa-money:before { content: ""; }

.fa-caret-down:before { content: ""; }

.fa-caret-up:before { content: ""; }

.fa-caret-left:before { content: ""; }

.fa-caret-right:before { content: ""; }

.fa-columns:before { content: ""; }

.fa-unsorted:before, .fa-sort:before { content: ""; }

.fa-sort-down:before, .fa-sort-desc:before { content: ""; }

.fa-sort-up:before, .fa-sort-asc:before { content: ""; }

.fa-envelope:before { content: ""; }

.fa-linkedin:before { content: ""; }

.fa-rotate-left:before, .fa-undo:before { content: ""; }

.fa-legal:before, .fa-gavel:before { content: ""; }

.fa-dashboard:before, .fa-tachometer:before { content: ""; }

.fa-comment-o:before { content: ""; }

.fa-comments-o:before { content: ""; }

.fa-flash:before, .fa-bolt:before { content: ""; }

.fa-sitemap:before { content: ""; }

.fa-umbrella:before { content: ""; }

.fa-paste:before, .fa-clipboard:before { content: ""; }

.fa-lightbulb-o:before { content: ""; }

.fa-exchange:before { content: ""; }

.fa-cloud-download:before { content: ""; }

.fa-cloud-upload:before { content: ""; }

.fa-user-md:before { content: ""; }

.fa-stethoscope:before { content: ""; }

.fa-suitcase:before { content: ""; }

.fa-bell-o:before { content: ""; }

.fa-coffee:before { content: ""; }

.fa-cutlery:before { content: ""; }

.fa-file-text-o:before { content: ""; }

.fa-building-o:before { content: ""; }

.fa-hospital-o:before { content: ""; }

.fa-ambulance:before { content: ""; }

.fa-medkit:before { content: ""; }

.fa-fighter-jet:before { content: ""; }

.fa-beer:before { content: ""; }

.fa-h-square:before { content: ""; }

.fa-plus-square:before { content: ""; }

.fa-angle-double-left:before { content: ""; }

.fa-angle-double-right:before { content: ""; }

.fa-angle-double-up:before { content: ""; }

.fa-angle-double-down:before { content: ""; }

.fa-angle-left:before { content: ""; }

.fa-angle-right:before { content: ""; }

.fa-angle-up:before { content: ""; }

.fa-angle-down:before { content: ""; }

.fa-desktop:before { content: ""; }

.fa-laptop:before { content: ""; }

.fa-tablet:before { content: ""; }

.fa-mobile-phone:before, .fa-mobile:before { content: ""; }

.fa-circle-o:before { content: ""; }

.fa-quote-left:before { content: ""; }

.fa-quote-right:before { content: ""; }

.fa-spinner:before { content: ""; }

.fa-circle:before { content: ""; }

.fa-mail-reply:before, .fa-reply:before { content: ""; }

.fa-github-alt:before { content: ""; }

.fa-folder-o:before { content: ""; }

.fa-folder-open-o:before { content: ""; }

.fa-smile-o:before { content: ""; }

.fa-frown-o:before { content: ""; }

.fa-meh-o:before { content: ""; }

.fa-gamepad:before { content: ""; }

.fa-keyboard-o:before { content: ""; }

.fa-flag-o:before { content: ""; }

.fa-flag-checkered:before { content: ""; }

.fa-terminal:before { content: ""; }

.fa-code:before { content: ""; }

.fa-mail-reply-all:before, .fa-reply-all:before { content: ""; }

.fa-star-half-empty:before, .fa-star-half-full:before, .fa-star-half-o:before { content: ""; }

.fa-location-arrow:before { content: ""; }

.fa-crop:before { content: ""; }

.fa-code-fork:before { content: ""; }

.fa-unlink:before, .fa-chain-broken:before { content: ""; }

.fa-question:before { content: ""; }

.fa-info:before { content: ""; }

.fa-exclamation:before { content: ""; }

.fa-superscript:before { content: ""; }

.fa-subscript:before { content: ""; }

.fa-eraser:before { content: ""; }

.fa-puzzle-piece:before { content: ""; }

.fa-microphone:before { content: ""; }

.fa-microphone-slash:before { content: ""; }

.fa-shield:before { content: ""; }

.fa-calendar-o:before { content: ""; }

.fa-fire-extinguisher:before { content: ""; }

.fa-rocket:before { content: ""; }

.fa-maxcdn:before { content: ""; }

.fa-chevron-circle-left:before { content: ""; }

.fa-chevron-circle-right:before { content: ""; }

.fa-chevron-circle-up:before { content: ""; }

.fa-chevron-circle-down:before { content: ""; }

.fa-html5:before { content: ""; }

.fa-css3:before { content: ""; }

.fa-anchor:before { content: ""; }

.fa-unlock-alt:before { content: ""; }

.fa-bullseye:before { content: ""; }

.fa-ellipsis-h:before { content: ""; }

.fa-ellipsis-v:before { content: ""; }

.fa-rss-square:before { content: ""; }

.fa-play-circle:before { content: ""; }

.fa-ticket:before { content: ""; }

.fa-minus-square:before { content: ""; }

.fa-minus-square-o:before { content: ""; }

.fa-level-up:before { content: ""; }

.fa-level-down:before { content: ""; }

.fa-check-square:before { content: ""; }

.fa-pencil-square:before { content: ""; }

.fa-external-link-square:before { content: ""; }

.fa-share-square:before { content: ""; }

.fa-compass:before { content: ""; }

.fa-toggle-down:before, .fa-caret-square-o-down:before { content: ""; }

.fa-toggle-up:before, .fa-caret-square-o-up:before { content: ""; }

.fa-toggle-right:before, .fa-caret-square-o-right:before { content: ""; }

.fa-euro:before, .fa-eur:before { content: ""; }

.fa-gbp:before { content: ""; }

.fa-dollar:before, .fa-usd:before { content: ""; }

.fa-rupee:before, .fa-inr:before { content: ""; }

.fa-cny:before, .fa-rmb:before, .fa-yen:before, .fa-jpy:before { content: ""; }

.fa-ruble:before, .fa-rouble:before, .fa-rub:before { content: ""; }

.fa-won:before, .fa-krw:before { content: ""; }

.fa-bitcoin:before, .fa-btc:before { content: ""; }

.fa-file:before { content: ""; }

.fa-file-text:before { content: ""; }

.fa-sort-alpha-asc:before { content: ""; }

.fa-sort-alpha-desc:before { content: ""; }

.fa-sort-amount-asc:before { content: ""; }

.fa-sort-amount-desc:before { content: ""; }

.fa-sort-numeric-asc:before { content: ""; }

.fa-sort-numeric-desc:before { content: ""; }

.fa-thumbs-up:before { content: ""; }

.fa-thumbs-down:before { content: ""; }

.fa-youtube-square:before { content: ""; }

.fa-youtube:before { content: ""; }

.fa-xing:before { content: ""; }

.fa-xing-square:before { content: ""; }

.fa-youtube-play:before { content: ""; }

.fa-dropbox:before { content: ""; }

.fa-stack-overflow:before { content: ""; }

.fa-instagram:before { content: ""; }

.fa-flickr:before { content: ""; }

.fa-adn:before { content: ""; }

.fa-bitbucket:before { content: ""; }

.fa-bitbucket-square:before { content: ""; }

.fa-tumblr:before { content: ""; }

.fa-tumblr-square:before { content: ""; }

.fa-long-arrow-down:before { content: ""; }

.fa-long-arrow-up:before { content: ""; }

.fa-long-arrow-left:before { content: ""; }

.fa-long-arrow-right:before { content: ""; }

.fa-apple:before { content: ""; }

.fa-windows:before { content: ""; }

.fa-android:before { content: ""; }

.fa-linux:before { content: ""; }

.fa-dribbble:before { content: ""; }

.fa-skype:before { content: ""; }

.fa-foursquare:before { content: ""; }

.fa-trello:before { content: ""; }

.fa-female:before { content: ""; }

.fa-male:before { content: ""; }

.fa-gittip:before { content: ""; }

.fa-sun-o:before { content: ""; }

.fa-moon-o:before { content: ""; }

.fa-archive:before { content: ""; }

.fa-bug:before { content: ""; }

.fa-vk:before { content: ""; }

.fa-weibo:before { content: ""; }

.fa-renren:before { content: ""; }

.fa-pagelines:before { content: ""; }

.fa-stack-exchange:before { content: ""; }

.fa-arrow-circle-o-right:before { content: ""; }

.fa-arrow-circle-o-left:before { content: ""; }

.fa-toggle-left:before, .fa-caret-square-o-left:before { content: ""; }

.fa-dot-circle-o:before { content: ""; }

.fa-wheelchair:before { content: ""; }

.fa-vimeo-square:before { content: ""; }

.fa-turkish-lira:before, .fa-try:before { content: ""; }

.fa-plus-square-o:before { content: ""; }

.fa-space-shuttle:before { content: ""; }

.fa-slack:before { content: ""; }

.fa-envelope-square:before { content: ""; }

.fa-wordpress:before { content: ""; }

.fa-openid:before { content: ""; }

.fa-institution:before, .fa-bank:before, .fa-university:before { content: ""; }

.fa-mortar-board:before, .fa-graduation-cap:before { content: ""; }

.fa-yahoo:before { content: ""; }

.fa-google:before { content: ""; }

.fa-reddit:before { content: ""; }

.fa-reddit-square:before { content: ""; }

.fa-stumbleupon-circle:before { content: ""; }

.fa-stumbleupon:before { content: ""; }

.fa-delicious:before { content: ""; }

.fa-digg:before { content: ""; }

.fa-pied-piper-square:before, .fa-pied-piper:before { content: ""; }

.fa-pied-piper-alt:before { content: ""; }

.fa-drupal:before { content: ""; }

.fa-joomla:before { content: ""; }

.fa-language:before { content: ""; }

.fa-fax:before { content: ""; }

.fa-building:before { content: ""; }

.fa-child:before { content: ""; }

.fa-paw:before { content: ""; }

.fa-spoon:before { content: ""; }

.fa-cube:before { content: ""; }

.fa-cubes:before { content: ""; }

.fa-behance:before { content: ""; }

.fa-behance-square:before { content: ""; }

.fa-steam:before { content: ""; }

.fa-steam-square:before { content: ""; }

.fa-recycle:before { content: ""; }

.fa-automobile:before, .fa-car:before { content: ""; }

.fa-cab:before, .fa-taxi:before { content: ""; }

.fa-tree:before { content: ""; }

.fa-spotify:before { content: ""; }

.fa-deviantart:before { content: ""; }

.fa-soundcloud:before { content: ""; }

.fa-database:before { content: ""; }

.fa-file-pdf-o:before { content: ""; }

.fa-file-word-o:before { content: ""; }

.fa-file-excel-o:before { content: ""; }

.fa-file-powerpoint-o:before { content: ""; }

.fa-file-photo-o:before, .fa-file-picture-o:before, .fa-file-image-o:before { content: ""; }

.fa-file-zip-o:before, .fa-file-archive-o:before { content: ""; }

.fa-file-sound-o:before, .fa-file-audio-o:before { content: ""; }

.fa-file-movie-o:before, .fa-file-video-o:before { content: ""; }

.fa-file-code-o:before { content: ""; }

.fa-vine:before { content: ""; }

.fa-codepen:before { content: ""; }

.fa-jsfiddle:before { content: ""; }

.fa-life-bouy:before, .fa-life-saver:before, .fa-support:before, .fa-life-ring:before { content: ""; }

.fa-circle-o-notch:before { content: ""; }

.fa-ra:before, .fa-rebel:before { content: ""; }

.fa-ge:before, .fa-empire:before { content: ""; }

.fa-git-square:before { content: ""; }

.fa-git:before { content: ""; }

.fa-hacker-news:before { content: ""; }

.fa-tencent-weibo:before { content: ""; }

.fa-qq:before { content: ""; }

.fa-wechat:before, .fa-weixin:before { content: ""; }

.fa-send:before, .fa-paper-plane:before { content: ""; }

.fa-send-o:before, .fa-paper-plane-o:before { content: ""; }

.fa-history:before { content: ""; }

.fa-circle-thin:before { content: ""; }

.fa-header:before { content: ""; }

.fa-paragraph:before { content: ""; }

.fa-sliders:before { content: ""; }

.fa-share-alt:before { content: ""; }

.fa-share-alt-square:before { content: ""; }

.fa-bomb:before { content: ""; }

/* LAYOUT - These are the base template layout files for the Hortonworks Site */
#logo { width: 100px; height: auto; padding: 10px 0px; text-align: center; font-size: 120%; margin: 0 auto; }
@media only screen and (min-width: 48em) { #logo { width: 150px; } }
@media only screen and (min-width: 60em) { #logo { width: 200px; float: left; } }

/* Search Box in Navigation */
.search { position: absolute; top: 0; left: -16em; display: block; z-index: 100; margin-left: 12px; }
@media only screen and (min-width: 48em) { .search { position: relative; float: right; margin-top: 8px; margin-left: 20px; margin-right: 10px; left: auto; top: auto; } }

#login-drawer, #fat-nav, #toplinks, .tool-form, .smt-trigger ul { display: none; }

.menu { padding: 0; }

#header > div { padding: 1em; }
#header > div:before, #header > div:after { content: ""; display: table; }
#header > div:after { clear: both; }

#header.ps { overflow: visible; }

#menu-header-new a { font-size: 12px; color: #ccc; font-weight: 500; text-decoration: none; font-weight: 500; }

body { background: #333; }

#navbar { background: #fff; position: relative; -moz-box-shadow: -6px 0 4px rgba(0, 0, 0, 0.1); -webkit-box-shadow: -6px 0 4px rgba(0, 0, 0, 0.1); box-shadow: -6px 0 4px rgba(0, 0, 0, 0.1); z-index: 99998; -moz-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -moz-transition: -moz-transform 500ms ease; -o-transition: -o-transform 500ms ease; -webkit-transition: -webkit-transform 500ms ease; transition: transform 500ms ease; }
#navbar.active { -moz-transform: translate3d(70%, 0, 0); -webkit-transform: translate3d(70%, 0, 0); transform: translate3d(70%, 0, 0); -moz-transition: -moz-transform 500ms ease; -o-transition: -o-transform 500ms ease; -webkit-transition: -webkit-transform 500ms ease; transition: transform 500ms ease; }

#blacknav { background-color: #000; height: 5px; }
#blacknav > div { text-align: right; padding: 3px 40px; }

/* The header is the area included in header.inc - including navigation and all that. */
#header { height: auto; background: #333; border-bottom: 3px solid #69be28; }
#header:before, #header:after { content: ""; display: table; }
#header:after { clear: both; }
#header > div { position: relative; }
#header .blacklinks { color: #ccc; font-size: 80%; border-radius: 5px; background-color: #000; position: absolute; right: 40px; top: -5px; padding: 5px 20px; z-index: 50; }
#header .blacklinks a { color: #fff; text-decoration: none; }
#header .blacklinks a:hover { text-decoration: underline; }

.navigation .search { background-color: #000; float: none; position: absolute; top: 0; left: 0; z-index: 0; padding: .75em; width: 100%; }
.navigation .search input[type="text"], .navigation .search input[type="search"] { background: transparent; border: none; color: #fff; padding-left: 2em; line-height: 2em; margin-bottom: 0; width: 100%; }
.navigation .search button { left: .5em; right: auto; top: 1.375em; }
@media only screen and (min-width: 60em) { .navigation .search { display: none; } }

#menu-header-new { display: block; left: 0; margin: 0; position: absolute; top: 4em; width: 100%; }
@media only screen and (min-width: 60em) { #menu-header-new { display: none; } }
#menu-header-new a { color: #fff; }
#menu-header-new li { list-style: none; }
#menu-header-new li a { border-bottom: 1px solid rgba(0, 0, 0, 0.2); display: block; padding: 1em; }
#menu-header-new li li a { color: #ccc; font-weight: 300; }

.menu-link { font-size: 36px; position: absolute; left: .325em; top: 18px; color: #fff; border: none; text-decoration: none; }
.menu-link:visited { color: #fff; }
.menu-link:hover { color: #ccc; }

@media only screen and (min-width: 60em) { #header > div { padding: 0 40px 0; max-width: 1200px; }
  #header > div:before, #header > div:after { content: ""; display: table; }
  #header > div:after { clear: both; }
  #header { background: #333; overflow: visible; position: relative; }
  #logo { width: 120px; margin-right: 1em; margin-top: 10px; float: left; }
  .menu-link { display: none; }
  #fat-nav { display: block; width: 90%; margin: 15px 50px 0 150px; }
  #fat-nav:before, #fat-nav:after { content: ""; display: table; }
  #fat-nav:after { clear: both; }
  #fat-nav > li { width: 14%; }
  #fat-nav li { display: block; float: left; padding: 1em 0 1em 1em; border-radius: 5px 5px 0 0; }
  #fat-nav li:hover { background-color: #111; color: #e17000; margin-left: -1px; margin-right: 2px; padding-left: 17px; padding-right: 1px; }
  #fat-nav li:hover .menu-item-link { border-right: 1px solid rgba(255, 255, 255, 0); }
  #fat-nav li.disabled:hover { background-color: transparent; }
  #fat-nav li.download { background: url("../images/layout/header/paper.png") 0 80px no-repeat, #d76b00; border-radius: 0; }
  #fat-nav li.download .menu-item-link:hover { color: rgba(255, 255, 255, 0.8); }
  #fat-nav li.highlight { background-color: #d76b00; }
  #fat-nav li.highlight .menu-item-link:hover { color: rgba(255, 255, 255, 0.8); }
  #fat-nav li:last-of-type .menu-item-link { border-right: 0; }
  #fat-nav li .menu-item-link { border-right: 1px solid rgba(255, 255, 255, 0.2); color: #fff; display: block; font-size: .8em; font-weight: 300; line-height: 1.25em; padding: 0.5em 1em 0 0; min-height: 45px; text-decoration: none; }
  #fat-nav li .menu-item-link a { color: #fff; text-decoration: none; }
  #fat-nav li .menu-item-link a:hover { color: #e17000; }
  #fat-nav li .menu-item-link span { color: rgba(255, 255, 255, 0.5); }
  #fat-nav li .menu-item-link:hover { border-right: 1px solid transparent; color: #e17000; }
  #fat-nav li .subhead { color: rgba(255, 255, 255, 0.5); display: block; font-size: .75rem; font-weight: 300; margin-top: .25em; }
  #fat-nav li a.btn, #fat-nav li .bottom_drawer .promo .cta a, .bottom_drawer .promo .cta #fat-nav li a { color: #e17000; cursor: pointer; font-size: .8rem; font-weight: 300; }
  #fat-nav li .mega { float: left; font-size: 2em; margin-right: .5em; }
  #fat-nav li .h-icon { margin-top: .5em; }
  #fat-nav li .sub-menu { -moz-box-shadow: 3px, 3px, 3px, rgba(0, 0, 0, 0.75); -webkit-box-shadow: 3px, 3px, 3px, rgba(0, 0, 0, 0.75); box-shadow: 3px, 3px, 3px, rgba(0, 0, 0, 0.75); background: #111; display: none; position: absolute; left: 0; margin-top: 1em; padding: 0; padding-bottom: 0; vertical-align: top; width: 100%; z-index: 100; }
  #fat-nav li .sub-menu.col-6 li { width: 16.6%; }
  #fat-nav li .sub-menu.col-5 li { width: 20%; }
  #fat-nav li .sub-menu.col-4 li { width: 24.5%; }
  #fat-nav li .sub-menu li { border-radius: 0; border-right: none; display: table-cell; float: left; padding: 0 0 0 1em; width: auto; min-height: 120px; }
  #fat-nav li .sub-menu li:hover { margin-left: 0; margin-right: 0; padding-left: 1em; padding-right: 0; }
  #fat-nav li .sub-menu li:nth-child(4) { clear: none; }
  #fat-nav li .sub-menu li:last-of-type .menu-item-link { border: none; }
  #fat-nav li .sub-menu .menu-item-link { margin: 1.5em 0 1.5em; border-right: none; width: 100%; border-right: 1px solid rgba(255, 255, 255, 0.125); } }
@media only screen and (min-width: 75em) { #logo { margin-right: 10px; margin-top: 0px; width: 180px; }
  #fat-nav { margin-left: 200px; width: 840px; margin: 15px 100px 0 250px; }
  #fat-nav > li { width: auto; min-width: 120px; }
  #fat-nav > li:hover > a { color: #e17000; }
  #fat-nav li { padding: .5em 0 1.25em 1.125em; }
  #fat-nav li:hover { margin-left: -1px; margin-right: 1px; padding-left: 19px; padding-right: 0; }
  #fat-nav li.download { background: url("../images/layout/header/paper.png") 0 95px no-repeat, #d76b00; }
  #fat-nav li.download a { height: 100%; }
  #fat-nav li.download .uptext { display: block; margin-top: -23px; font-size: 80%; color: #fee8d4; font-weight: normal; }
  #fat-nav li .menu-item-link { font-size: 1em; }
  #fat-nav li .sub-menu { margin-left: 215px; margin-top: 1.25em; width: auto; }
  #fat-nav li .sub-menu li { padding: 0 0 0 1.5em; width: auto; min-height: 150px; }
  #fat-nav li .sub-menu li:hover { margin-left: 0; margin-right: 0; padding-left: 1.5em; padding-right: 0; }
  #fat-nav li .sub-menu.col-6 li { width: 164px; }
  #fat-nav li .sub-menu.col-5 li { width: 197px; }
  #fat-nav li .sub-menu.col-4 li { width: 235px; }
  #fat-nav li .sub-menu.col-2 li { width: 235px; }
  #fat-nav li .sub-menu.col-2 li { width: 235px; }
  #fat-nav li .sub-menu .menu-item-link { padding: .5em 1em .5em 0; }
  #fat-nav li#menu-item-6 .sub-menu { right: 0px; left: initial; } }
/* Breadcrumbs */
.breadcrumb { text-transform: uppercase; display: none; font-size: 80%; margin-top: 10px; margin-bottom: 10px; }
@media only screen and (min-width: 48em) { .breadcrumb { display: block; } }
.breadcrumb a:hover { color: #fff; }
.breadcrumb ul { padding-left: 0px; margin: 0px; }

/* SECTIONNAV - Used for creating sub-pages within one page....  */
.sectionnav ul { padding-left: 0px; margin: 0px; overflow: auto; position: relative; }
.sectionnav li { list-style-type: none; }
.sectionnav li .text { padding: 5px; margin-left: 20px; margin-right: 5px; }
@media only screen and (min-width: 48em) { .sectionnav li { display: inline-block; margin-right: 20px; } }

/* ...the default application is when used below the titlebar in it's own 'ps'  */
.ps.sectionnav { border-top: 0px; background-color: #69be28; }
.ps.sectionnav > div { padding: 10px 20px 10px; background-color: #000; }
@media only screen and (min-width: 48em) { .ps.sectionnav > div { padding: 10px 40px 10px; } }
.ps.sectionnav li a { display: block; color: #bbb; border-radius: 3px; padding: 5px 10px; text-decoration: none; }
.ps.sectionnav li a:hover { background-color: #e6e6e6; color: #666; }
.ps.sectionnav li.active a { background-color: #e17000; color: #fff; }
.ps.sectionnav.grey { background-color: #d7d5d4; }

/* ...can also be used within an opener container. */
.opener .sectionnav { text-align: center; padding-bottom: 0px; }
.opener .sectionnav a { display: block; color: #fff; border-top-left-radius: 3px; border-top-right-radius: 3px; padding: 20px 20px; text-decoration: none; text-transform: uppercase; }
.opener .sectionnav a:hover { background-color: #fff; color: #e17000; }
.opener .sectionnav li.active a { background-color: #fff; color: #69be28; }
@media only screen and (min-width: 48em) { .opener .sectionnav li { margin-right: 10px; } }

.opener.lighter .sectionnav a { color: #333; }

/* Tools */
.pop-over .search-form, .pop-over .language-form, .pop-over .login-form { padding: 0; }
@media only screen and (min-width: 60em) { .pop-over .search-form, .pop-over .language-form, .pop-over .login-form { padding: 7px 50px 0 70px; } }

.pop-over .language-form .icon-language, .pop-over .login-form .icon-profile { font-size: 36px; left: .5rem; line-height: 45px; position: absolute; top: 1rem; }

.navigation .search button, .pop-over .search-form button, .pop-over .login-form button, .pop-over .login-form .button { background-color: transparent; border: none; color: #fff; position: absolute; }

.pop-over input[type="text"], .pop-over input[type="search"], .pop-over input[type="password"], .pop-over .language-form .langugage-list .language, .pop-over .login-form input[type="text"], .pop-over .login-form input[type="password"] { background-color: transparent; border-bottom: 1px solid #fff; }

.pop-over .search-form, .pop-over .login-form { display: none; }
@media only screen and (min-width: 60em) { .pop-over .search-form, .pop-over .login-form { display: block; } }

.tools { position: absolute; right: 1em; top: 10px; }
.tools .tools-list { list-style: none; padding: 0; }
.tools .tools-list:before, .tools .tools-list:after { content: ""; display: table; }
.tools .tools-list:after { clear: both; }
@media only screen and (min-width: 60em) { .tools .tools-list { margin-top: 15px; } }
@media only screen and (min-width: 75em) { .tools .tools-list { margin: 0; } }
.tools .tools-list li { display: block; padding: 0; font-size: 150%; padding-top: 0; }
@media only screen and (min-width: 60em) { .tools .tools-list li { text-align: center; font-size: 100%; } }
@media only screen and (min-width: 75em) { .tools .tools-list li { padding: 10px 0; float: left; } }
.tools .tools-list li.hide-small { display: none; }
@media only screen and (min-width: 60em) { .tools .tools-list li.hide-small { display: block; } }
.tools .tools-list li .sub-menu { -moz-box-shadow: 3px, 3px, 3px, rgba(0, 0, 0, 0.75); -webkit-box-shadow: 3px, 3px, 3px, rgba(0, 0, 0, 0.75); box-shadow: 3px, 3px, 3px, rgba(0, 0, 0, 0.75); background: #111; display: none; position: absolute; right: 1px; margin-top: -.5em; padding: 0; padding-bottom: 0; vertical-align: top; z-index: 100; }
.tools .tools-list li .sub-menu li { padding: 0; width: auto; }
.tools .tools-list li .sub-menu li:hover a { color: #e17000; }
.tools .tools-list li .sub-menu li a { line-height: normal; font-size: .7em; min-width: 10em; display: block; }
.tools .tools-list li .sub-menu .menu-item-link { padding: 1em; }
.tools .tools-list a { color: #fff; text-decoration: none; }
@media only screen and (min-width: 60em) { .tools .tools-list a { line-height: 0.9em; } }
@media only screen and (min-width: 75em) { .tools .tools-list a { line-height: 3em; } }
.tools .tools-list a span { padding: 13px 7px; }
.tools .tools-list a span.icon-profile { -moz-transition-property: background; -o-transition-property: background; -webkit-transition-property: background; transition-property: background; -moz-transition-duration: 50ms; -o-transition-duration: 50ms; -webkit-transition-duration: 50ms; transition-duration: 50ms; -moz-transition-timing-function: fade; -o-transition-timing-function: fade; -webkit-transition-timing-function: fade; transition-timing-function: fade; }
.tools .tools-list a span.icon-profile:hover, .tools .tools-list a span.icon-profile.hover { background: #111; }
@media only screen and (min-width: 60em) { .tools { top: 0; right: 1.625em; } }
@media only screen and (min-width: 75em) { .tools { top: 0; font-size: 140%; } }

.pop-over { display: none; position: absolute; background-color: #000; color: #fff; z-index: 999; right: 0; top: 70px; width: 50%; }
@media only screen and (min-width: 60em) { .pop-over { display: none; font-size: 18px; height: 75px; line-height: 40px; left: 175px; right: auto; top: 8px; width: 75%; } }
@media only screen and (min-width: 75em) { .pop-over { font-size: 22px; height: 75px; left: 230px; top: 7px; right: auto; width: 810px; } }
.pop-over input[type="text"], .pop-over input[type="search"], .pop-over input[type="password"] { border-top: none; border-left: none; border-right: none; color: #fff; font-size: 22px; line-height: 45px; width: 100%; }
.pop-over input[type="text"], .pop-over input[type="password"] { line-height: 40px; }
.pop-over a { color: #fff; text-decoration: none; }
.pop-over .close { color: rgba(255, 255, 255, 0.3); display: none; line-height: 60px; position: absolute; right: 10px; top: 10px; }
@media only screen and (min-width: 60em) { .pop-over .close { display: block; } }
.pop-over .search-form button { left: .75rem; top: 1rem; }
.pop-over .search-form button .icon-search { color: #fff; font-size: 36px; line-height: 45px; }
.pop-over .language-form .smt-menu { background-color: rgba(0, 0, 0, 0.65); margin: 0; padding: 6px 0; position: relative; }
.pop-over .language-form .smt-menu li a { color: #cccccc; display: block; padding: .25em 1em; padding-right: 1em; }
.pop-over .language-form .smt-menu li a:hover { background-color: rgba(0, 0, 0, 0.5); }
.pop-over .language-form .langugage-list { display: inline-block; margin: 0; padding: 0; position: relative; width: 100%; z-index: 2000; }
.pop-over .language-form .langugage-list .language { color: #fff; display: block; padding-top: 6px; padding-bottom: 6px; }
.pop-over .language-form .langugage-list .language .icon-drop { float: right; font-size: 36px; line-height: 45px; }
.pop-over .language-form .langugage-list ul { margin-top: 5px; }
.pop-over .language-form li { list-style: none; }
.pop-over .language-form .icon-language { display: none; }
@media only screen and (min-width: 60em) { .pop-over .language-form .icon-language { display: block; } }
.pop-over .login-fail { padding: 18px 50px 0px 70px; }
.pop-over .login-form input[type="text"], .pop-over .login-form input[type="password"] { font-size: 16px; margin-top: 5px; width: 42%; }
@media only screen and (min-width: 75em) { .pop-over .login-form input[type="text"], .pop-over .login-form input[type="password"] { font-size: 22px; width: 40%; } }
.pop-over .login-form .forgot { color: rgba(255, 255, 255, 0.6); font-size: 12px; line-height: 60px; position: absolute; right: 150px; }
@media only screen and (min-width: 75em) { .pop-over .login-form .forgot { right: 180px; } }
.pop-over .login-form button, .pop-over .login-form .button { font-size: 14px; line-height: 50px; right: 35px; text-transform: uppercase; top: 15px; padding: 0 1em; background-color: rgba(255, 255, 255, 0.2); border: 1px solid rgba(255, 255, 255, 0.5); }
@media only screen and (min-width: 75em) { .pop-over .login-form button, .pop-over .login-form .button { font-size: 14px; right: 50px; } }
.pop-over .login-form .name { display: inline-block; line-height: 60px; padding: 0 1em; }
.pop-over .login-form .icon-profile { text-align: center; top: 0.4rem; left: 1rem; }
.pop-over .login-form .icon-profile .login_to { font-size: 13px; display: block; line-height: normal; }

/* ----------------------------------------------
/* =Footer
---------------------------*/
#footer_nav .menu .menu-item a { color: #436682; }

#newsletter_signup { background: #e17000; min-height: 65px; padding: 1px; }

#newsletter_signup > div { padding-top: 00px; padding-bottom: 0px; }

#newsletter_signup form { text-align: center; }

#newsletter_signup span { font-size: 20px; line-height: 65px; color: white; font-weight: lighter; margin-right: 5px; }

#newsletter_signup p { font-size: 20px; line-height: 65px; color: white; text-align: center; }

#newsletter_signup label { display: none; }

#newsletter_signup input[type="email"] { width: 266px; height: 35px; line-height: 35px; border: none; padding: 0 5px 0 35px; margin: 0 5px 4px 0; background: white url("../images/icons/envelope.jpg") no-repeat 10px 12px; }

#newsletter_signup input[type="submit"] { height: 35px; margin: 0px; padding: 0px 7px; background: transparent; border: 1px solid white; margin: 0 0 4px 0; color: white; font-size: 17px; font-weight: lighter; display: inline-block; position: relative; top: 0px; }

#newsletter_signup input[type="submit"]:hover { background-color: #b05801; }

#footer_menu { background: #262626; }

#footer_menu li { display: block; width: 220px; float: left; margin: 0 10px; line-height: 20px; }

#footer_menu > li.parent > a #footer_menu li a { font-size: 11px; font-weight: normal; color: #e5e5e5; background: url(../images/icons/footer-bullet.gif) no-repeat left center; padding-left: 10px; }

#footer_search input { display: inline; }

#footer_search .search_input { background: transparent; border: none; border-bottom: 1px solid #5e89a9; border-radius: 0; color: #fff; height: 20px; width: 96.5%; float: right; margin-top: 11px; font-size: 16px; font-weight: bold; font-family: Arial; -webkit-font-smoothing: antialiased; padding-left: 0px; float: right; text-shadow: none; }

#footer_search #footer_submit { float: left; background: url("../images/icons/new_search.png") no-repeat transparent; height: 19px; width: 20px; border: none; display: block; margin: 14px 0 0; }

.menu-footer-navigation-container { width: 950px; height: 230px; overflow: hidden; position: relative; margin-top: 15px; }

.footer-container { position: relative; }

.footer-container .content-wrapper { padding-bottom: 0; }

#sub_footer { background: #262626; }

#sub_footer > div { overflow: hidden; padding-top: 25px; padding-bottom: 25px; }

#sub_footer p, #sub_footer ul { float: right; text-align: right; color: #e5e5e5; clear: both; font-size: 11px; }

#sub_footer a { color: #FFF; padding-right: 0; }

#sub_footer .social-icons-list { margin-bottom: 10px; }

.social-icons-list { padding-left: 0px; }

.social-icons-list li { list-style-type: none; float: left; margin-right: 15px; }

.social-icons-list li:last-child { margin: 0; }

#sub_footer .logo { width: 180px; float: left; }

#sub_footer .logo a { display: block; width: 180px; height: 68px; background: url(../images/layout/footer/footer-logo.png) no-repeat; text-indent: -9999px; }

#sub_footer small { float: left; line-height: 20px; }

#sub_footer ul { padding-left: 0; }

#sub_footer a.linkedin, a.twitter, a.slideshare, a.rss, a.newsletter, a.facebook { text-indent: -9999px; width: 15px; height: 15px; float: right; margin-left: 3px; vertical-align: middle; }

#footer_menu { width: 100%; background: #2d2d2d; }

#footer_menu li a { font-weight: bold; padding-right: 15px; }

#footer_menu nav { margin-bottom: 3px; }

#fat_footer { background-color: #333; color: #fff; }
#fat_footer a { color: #fff; text-decoration: none; }
#fat_footer .menu { font-size: .8em; list-style: none; margin: 0; padding: 0; text-transform: uppercase; }
#fat_footer .menu:before, #fat_footer .menu:after { content: ""; display: table; }
#fat_footer .menu:after { clear: both; }
@media only screen and (min-width: 48em) { #fat_footer .menu { margin: 2em 1em 8em 1em; } }
#fat_footer .menu > li { display: block; float: left; font-weight: 500; margin-bottom: 2em; width: 100%; }
@media only screen and (min-width: 48em) { #fat_footer .menu > li { margin-bottom: 0; padding-right: 1em; width: 20%; } }
#fat_footer .menu .sub-menu { list-style: none; margin-top: .5em; text-transform: capitalize; }
#fat_footer .menu .sub-menu li { font-weight: 300; padding: .25em 0; }
#fat_footer .menu .sub-menu li a { color: rgba(255, 255, 255, 0.4); }
#fat_footer .menu .sub-menu li a:hover { color: rgba(255, 255, 255, 0.8); }
#fat_footer .social-icons-list { margin-top: 1em; }
#fat_footer .logo a { background: url(../images/layout/header/hortonworks-logo-wht.png) no-repeat; background-size: cover; display: block; width: 180px; height: 68px; text-indent: -9000px; margin: 0 auto; }
#fat_footer .copy { color: rgba(255, 255, 255, 0.1); font-size: .75em; margin-bottom: -1em; text-align: center; }
#fat_footer .copy a { color: rgba(255, 255, 255, 0.4); line-height: 2em; }
#fat_footer .tel { font-size: 150%; font-weight: normal; margin: 15px 0; }

/* Opener is a big picture way of starting the page - Added Nov 2014 for the Why-HWX page.... obviously, there's a few things that are a bit too fixed here, like positioning of the h2 and copy */
.opener { overflow: initial; /* When we use a carousel as part of the opener, we're going to style it differently. */ }
.opener > div { background-size: cover; text-align: left; margin-top: -43px; padding: 0px; }
.opener > div > div { padding: 0px 40px 30px; }
.opener > div:before { display: block; height: 43px; background-color: rgba(0, 0, 0, 0.3); content: " "; }
.opener .intro-copy { color: #fff; padding: 15px 20px; }
.opener .intro-copy .container { padding: 20px; }
.opener .intro-copy p { font-size: 130%; font-family: "Cabin", "Helvetica Neue", Arial, Helvetica, "Lucida Grande", sans-serif; }
.opener .intro-copy h1 { border-bottom: 4px solid #69be28; }
.opener .intro-copy h2, .opener .intro-copy .slug_labs .innovation .group_title, .slug_labs .innovation .opener .intro-copy .group_title { border-bottom: 4px solid #69be28; }
@media only screen and (min-width: 48em) { .opener .intro-copy { padding: 70px 11% 40px; /* Default   */ }
  .opener .intro-copy h1 { width: auto; font-size: 300%; font-weight: 500; display: inline-block; }
  .opener .intro-copy h2, .opener .intro-copy .slug_labs .innovation .group_title, .slug_labs .innovation .opener .intro-copy .group_title { width: auto; font-size: 240%; font-weight: 500; display: inline-block; }
  .opener .intro-copy.left { padding-left: 40px; padding-right: 45%; }
  .opener .intro-copy.right { padding-left: 45%; padding-right: 40px; } }
.opener.lighten > div > div { background-color: rgba(255, 255, 255, 0.6); color: initial; }
.opener.lighten > div > div .container { background-color: rgba(255, 255, 255, 0.4); }
.opener.lighten > div:before { background-color: rgba(149, 221, 94, 0.7); }
.opener.darken > div > div { background-color: rgba(0, 0, 0, 0.6); color: initial; color: #fff; }
.opener.darken > div > div .container { background-color: rgba(0, 0, 0, 0.4); }
.opener.darken > div:before { background-color: rgba(0, 0, 0, 0.75); }
.opener .bx-wrapper .bx-viewport { background: none; border: 0px; }

/* Promo Panel can be seen on the MDA page and the solutions page and are used to show an interstitial promo */
.ps.promo-panel { overflow: visible; z-index: 10; }
.ps.promo-panel > div { padding: 20px 30px 15px; overflow: visible; position: relative; }
.ps.promo-panel h2, .ps.promo-panel .slug_labs .innovation .group_title, .slug_labs .innovation .ps.promo-panel .group_title { font-size: 250%; margin-bottom: 0px; }
.ps.promo-panel .desc { margin-bottom: 10px; text-align: center; }
.ps.promo-panel .img { display: none; }
@media only screen and (min-width: 48em) { .ps.promo-panel h2, .ps.promo-panel .slug_labs .innovation .group_title, .slug_labs .innovation .ps.promo-panel .group_title { text-transform: uppercase; font-size: 150%; font-weight: bold; margin-top: -5px; width: 65%; float: left; }
  .ps.promo-panel .desc { width: 65%; padding-right: 20px; }
  .ps.promo-panel .img { display: block; position: absolute; right: -45px; bottom: 0px; padding-right: 30px; text-align: right; } }
@media only screen and (min-width: 75em) { .ps.promo-panel h2, .ps.promo-panel .slug_labs .innovation .group_title, .slug_labs .innovation .ps.promo-panel .group_title { float: none; width: 25%; font-size: 225%; }
  .ps.promo-panel .desc { position: absolute; left: 28%; top: 20px; width: 50%; padding-right: 20px; } }

/* Bottom Drawer... used at the bottom of some of the L300 pages.  */
.bottom_drawer { background-color: #f2f0ef; }
.bottom_drawer > div { padding-bottom: 20px; }

.bottom_drawer .hitters { padding-top: 20px; }
@media only screen and (min-width: 48em) { .bottom_drawer .hitters { margin-left: 20px; } }
.bottom_drawer .hitters > div:nth-child(3) .promo { border-right: 0px; }
.bottom_drawer .promo { padding-right: 20px; text-align: center; color: #888; font-size: 95%; }
@media only screen and (min-width: 48em) { .bottom_drawer .promo { border-right: 1px solid #ccc; } }
.bottom_drawer .promo .title { font-weight: bold; }
.bottom_drawer .promo .cta a { margin-top: 10px; }

/* Maincontent is where the main-content of the page will usually go. BODY COPY */
.lowerbody .ps .maincontent { text-align: left; }

.maincontent h1 ul { padding-left: 1em; }
.maincontent h1 ul a { -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; }
@media only screen and (min-width: 48em) { .maincontent h1 ul { padding-left: 2em; } }

.maincontent img { max-width: 100%; margin: 10px 0px; height: auto; }

/* Prevent inline photos overflowing the content boundry */
/* Prevent overflow in the tables! */
.maincontent pre { display: block; background-color: #f2f0ef; border: 1px solid #ccc; font-family: Consolas, "Liberation Mono", Courier, monospace; padding: 6px 10px; border-radius: 3px; font-size: 13px; overflow: auto; }

.maincontent code { background-color: #f2f0ef; border: 1px solid #ccc; font-family: Consolas, "Liberation Mono", Courier, monospace; padding: 6px 10px; border-radius: 3px; font-size: 13px; }

.maincontent pre code { border: 0px; padding: 0; border-radius: 0; background-color: none; }

/* we don't want to compound when a code block is inside a div as from github. */
.maincontent blockquote { quotes: "“" "”"; margin-left: 0px; margin-right: 0px; padding: 4px; padding-left: 30px; padding-right: 30px; font-family: "Roboto Slab", serif; font-weight: 300; position: relative; color: #999; }

.maincontent blockquote cite { display: block; margin-top: 5px; font-family: "Helvetica Neue", Helvetica, Arial, "Open Sans", "Lucida Grande", sans-serif; font-style: normal; font-weight: normal; font-size: 90%; color: #666; }

.maincontent blockquote:before { content: open-quote; font-size: 300%; color: #69be28; font-family: serif; position: absolute; top: 0px; left: 0px; }

.maincontent blockquote:after { content: close-quote; font-size: 300%; color: #69be28; font-family: serif; position: absolute; bottom: 0px; right: 0px; }

/* Related Files - For associated files embedded in the main flow of the content */
.maincontent .related_files .file { overflow: auto; margin-bottom: 20px; }

.maincontent .related_files .file .icon { float: left; }

.maincontent .related_files .file .icon img { width: 80px; border: 3px solid #fff; box-shadow: 0 0 5px #999; }

.maincontent .related_files .file .title { font-weight: bold; margin-left: 105px; }

.maincontent .related_files .file .desc { margin-left: 105px; font-size: 90%; color: #999; }

/* Categories listed at the bottom of a post */
.maincontent .categories a { font-size: 85%; }

.comment_warning { background-color: #fee8d4; padding: 5px; font-weight: bold; }

/* For Related Posts.... shown in the sidebar */
.related_posts li { margin-bottom: 8px; }
.related_posts a { text-decoration: none; }
.related_posts .post .title { font-weight: bold; }
.related_posts .post .date { color: #999; }

/* Related Tutorials - As generated by the insert_related_links function */
.related_tutorials { padding-left: 0px; margin-left: 0px; list-style-type: none; }
.related_tutorials ol { padding-left: 0px; margin-left: 24px; counter-reset: li; }
.related_tutorials li { position: relative; margin: 0 0 6px 0; padding: 4px 0px; list-style: none; }
.related_tutorials ol li:before { /* Trick picked up from : http://www.456bereastreet.com/archive/201105/styling_ordered_list_numbers/ */ content: counter(li); /* Use the counter as content */ counter-increment: li; /* Increment the counter by 1 */ /* Position and style the number */ position: absolute; top: 8px; left: -1.7rem; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; width: 1.5em; /* Some space between the number and the content in browsers that support generated content but not positioning it (Camino 2 is one example) */ margin-right: 8px; font-size: 85%; padding: 0px; /* Style it */ border-radius: 12px; color: #fff; background: #ccc; font-weight: bold; text-align: center; }
.related_tutorials li.active:before { background-color: #e17000; }
.related_tutorials .active { font-weight: bold; }
.related_tutorials a { text-decoration: none; }
.related_tutorials li { margin-bottom: 10px; }
.related_tutorials .title { font-weight: bold; }
.related_tutorials .tuts_type { text-transform: uppercase; color: #aaa; font-size: 90%; }
.related_tutorials .excerpt p { display: inline; }

.maincontent ul.related_tutorials { padding-left: 0px; }

.aside .related_tutorials .excerpt { display: none; }

.aside { /* Content blocks within the sidebar should be contained within widgets */ /* Promo - Used to highlight something... typically in the sidebar: ASIDE */ /* For Related Webinars.... shown in the sidebar */ /* For Related Tutorials.... shown in the sidebar */ /* For Associated Files.... shown in the sidebar */ /* Used on some partner related pages and the getting started with YARN page */ }
.aside h3 { color: #555; }
.aside .widget { margin-bottom: 30px; }
.aside .promo { background-color: #f9f9f9; margin: 0px -10px 20px; border-radius: 3px; padding: 10px; }
.aside .categories { font-weight: bold; }
.aside .categories ul { display: inline-block; padding-left: 0px; }
.aside .categories li { display: inline-block; }
.aside .webinars { margin-bottom: 30px; }
.aside .webinar { margin-bottom: 15px; }
.aside .webinar .title { font-weight: 600; margin: 10px 0px 5px; }
.aside .webinar .date { color: #999; display: inline-block; }
.aside .webinar .time { color: #999; display: inline-block; }
.aside .webinar .options { margin: 10px 0; }
.aside .tutorial .thumb { height: 100px; background-size: cover; background-position: center center; }
.aside .tutorial .title { font-weight: 600; margin: 10px 0px 5px; }
.aside .related_files .file { margin-bottom: 20px; }
.aside .related_files .file:before, .aside .related_files .file:after { content: ""; display: table; }
.aside .related_files .file:after { clear: both; }
.aside .related_files .icon { float: left; position: relative; }
.aside .related_files .icon img { margin: 5px; box-shadow: 0px 0px 5px #999; border: 2px solid #fff; max-width: 70px; }
.aside .related_files .name { margin-left: 85px; font-weight: bold; }
.aside .related_files .desc { margin-left: 85px; }
.aside .related_files .edit_link { margin-left: 85px; }
.aside .related_files .btn_container { clear: both; padding: 8px 0px; }
.aside .related_files .icon img.video_overlay { box-shadow: none; position: absolute; top: 0px; left: 0px; border: none; }
.aside .related_posts .author { display: none; }
.aside .related_pages { margin-bottom: 35px; }
.aside .related_page p { margin: 0px; }
.aside .related_page { margin-bottom: 10px; }
.aside .related_partner { margin-bottom: 15px; }
.aside .related_partner .logo { margin-bottom: 5px; }
.aside .insightera_promo { margin: 40px 0px; }
.aside .insightera_promo:empty { margin: 0px; }
.aside .featured_story { background-color: #f9f8f8; border-radius: 5px; padding: 10px; font-size: 110%; margin: 0px 0px 20px; }
.aside .featured_story .logo:before { content: "Customer Story"; display: block; color: #ccc; text-transform: uppercase; margin: -5px 0px 5px; font-size: 90%; }
.aside .featured_story.partner .logo:before { content: "Featured Partner"; }
.aside .featured_story .logo { margin: 10px 0px; }
.aside .featured_story .logo img { max-width: 150px; max-height: 50px; }
.aside .featured_story .title { font-weight: bold; font-size: 110%; }
.aside .logo_collection { margin-bottom: 25px; text-align: center; }
.aside .logo_collection .partner { display: inline-block; margin: 0px 10px 10px 0px; }
.aside .logo_collection .partner .logo { display: inline; }
.aside .logo_collection .partner .name { display: none; }
.aside .logo_collection .partner .logo img { max-height: 50px; max-width: 150px; width: auto; }
.aside .featured_image { margin-bottom: 30px; }
.aside .in-depth-offer { background-color: #F4FAE9; padding: 3px 8px; }
.aside .in-depth-offer .case-study-img { float: right; width: 75px; margin-top: 10px; margin-right: -10px; -moz-transform: rotate(4deg); -ms-transform: rotate(4deg); -webkit-transform: rotate(4deg); transform: rotate(4deg); }
.aside .simple_promo { background: none repeat scroll 0 0 #FFFFFF; border-radius: 5px; border: 1px solid #d7d5d4; margin: 10px 0px; padding: 10px; position: relative; }
.aside .simple_promo a { background: no-repeat scroll 13px center #d7d5d4; display: block; padding: 15px 15px 5px 70px; text-transform: uppercase; text-decoration: none; color: #756e69; min-height: 50px; }
.aside .simple_promo a:hover { color: #fff; background-color: #756e69; }
.aside .simple_promo.contact_sales a { background-image: url("/wp-content/themes/hortonworks/images/icons/simplepromoicon-newsletter-white.png"); color: #fff; background-color: #69be28; }
.aside .simple_promo.contact_sales a:hover { color: #fff; background-color: #e17000; }
.aside .simple_promo.download a { background-image: url("/wp-content/themes/hortonworks/images/icons/simplepromoicon-download.png"); background-color: #d7d5d4; }
.aside .simple_promo.download a:hover { background-image: url("/wp-content/themes/hortonworks/images/icons/simplepromoicon-download-white.png"); background-color: #756e69; color: #fff; }

/* Used to create larger text at the beginning of a page */
.page_summary { font-size: 120%; line-height: 150%; color: #aaa; margin-bottom: 20px; }
@media only screen and (min-width: 48em) { .page_summary { font-size: 130%; line-height: 170%; } }

/* Content Tables are used to display information in the body of the content */
.data-table { width: 100%; }
.data-table th { color: #fff; background-color: #69be28; padding: 2px 5px; border: 1px solid #fff; }
.data-table td { padding: 2px 5px; border: 1px solid #fff; }
.data-table tr:nth-child(odd) { background-color: #f6f6f6; }
.data-table tr:nth-child(odd) td:first-child { background-color: #f0f0f0; font-weight: bold; }
.data-table tr:nth-child(even) { background-color: #f0f0f0; }
.data-table tr:nth-child(even) td:first-child { background-color: #e6e6e6; font-weight: bold; }

/* A very simple non-colored table for use in docs. */
.basic-table { margin: 10px 0px; }
.basic-table td { padding: 2px 5px; border: 1px solid #dedede; }
.basic-table .divider { padding-top: 30px; font-weight: bold; text-align: center; background: none; border: 1px solid #fff; }

/* Quote Bubbles  <div class="quote_bubble"><div class="quote"></div></div> */
.quote_bubble { font-family: "Roboto Slab", serif; color: #777; position: relative; padding: 25px 35px; margin: 0.5em 0 2em; background: #fff; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 25px; box-shadow: 5px 5px 0px #69be28; /* This is the triangle part of the quote. */ }
.quote_bubble:after { content: ""; position: absolute; bottom: -40px; /* value = - border-top-width - border-bottom-width */ left: 50px; /* controls horizontal position */ border-width: 40px 40px 0 0; /* vary these values to change the angle of the vertex */ border-style: solid; border-color: #fff transparent; /* reduce the damage in FF3.0 --> */ display: block; width: 0; }
.quote_bubble.right:after { right: 50px; left: initial; border-width: 40px 0 0 40px; }
.quote_bubble.massive { font-size: 130%; }
@media only screen and (min-width: 48em) { .quote_bubble.massive { font-size: 200%; } }

/* Where is this used? */
ul.rich_list { list-style-type: none; padding-left: 0px; margin: 10px 0px; overflow: auto; }
ul.rich_list li { padding-left: 85px; overflow: auto; margin-bottom: 15px; }
ul.rich_list .title { margin-top: 5px; }
ul.rich_list .desc { display: block; }
ul.rich_list .icon img { float: left; width: 70px; margin-left: -85px; }

/* Definition Lists... occationally nice for inline copy. */
dl.classic { padding-left: 10px; }
@media only screen and (min-width: 48em) { dl.classic { padding-left: 30px; } }
dl.classic dt { font-weight: bold; margin-top: 10px; }
dl.classic dd { margin-bottom: 10px; }

/* This is usually used inside repeating elements. We'll let the title/header determine the spacing. The <p> element should have a benign margin */
.content p:first-of-type { margin-top: 0px; }
.content p:last-of-type { margin-top: 0px; }

/* Pull Quotes: Typography */
.pullquote { quotes: "\201C" "\201D" "\2018" "\2019"; position: relative; padding-left: 35px; padding-right: 25px; margin: 25px 20px 20px 0; width: 300px; font-size: 150%; font-style: italic; color: #aaa; font-family: "Roboto Slab", serif; font-weight: 300; display: block; }
@media only screen and (min-width: 48em) { .pullquote { float: left; margin-left: -30px; } }
@media only screen and (min-width: 48em) { .pullquote.right { float: right; margin-right: -50px; margin-left: 30px; } }
.pullquote.full { float: none; margin-right: 0px; margin-left: 30px; width: auto; display: block; }
.pullquote:before { font-size: 300%; color: #69be28; font-size: 250%; position: absolute; top: -35px; left: 0px; font-family: serif; }
.pullquote:after { font-size: 300%; color: #69be28; font-size: 250%; position: absolute; right: 0px; font-family: serif; }

/* Breakout... used to draw attention to a chunk of inline text */
.breakout { font-weight: bold; color: #69be28; border: 1px solid #69be28; border-left: 0px; border-right: 0px; padding: 8px 0px; }

/* Are these for quotations and the like? */
.callout { float: right; margin-left: 30px; width: 30%; }
.callout.left { float: left; margin-left: 0px; margin-right: 30px; }

/* Creates a horizontal bookshelf style of links */
.bookshelf { list-style-type: none; padding-left: 0px; margin: 10px -25px 10px 0px; overflow: auto; padding-top: 20px; }
.bookshelf li { vertical-align: top; margin-right: 20px; margin-bottom: 10px; padding-left: 0px; overflow: visible; }
@media only screen and (min-width: 48em) { .bookshelf li { width: 120px; display: inline-block; } }
@media only screen and (min-width: 48em) { .bookshelf .title { font-size: 80%; text-align: center; } }
.bookshelf .desc { display: none; }
.bookshelf .icon { text-align: center; overflow: visible; }
.bookshelf .icon img { float: none; width: 100px; margin-left: 0px; margin-bottom: 8px; }
@media only screen and (min-width: 48em) { .bookshelf .icon img { border: 4px solid #fff; box-shadow: 0 0 5px #aaa; } }
@media only screen and (min-width: 48em) { .bookshelf .icon img:hover { -webkit-transform: translateY(-10%) scale(1.15); -webkit-transition: 250ms; } }

/* Hitters are an easy way to do column layouts...  */
.hitters { list-style-type: none; padding-left: 0px; }
@media only screen and (min-width: 48em) { .hitters { margin-right: -30px; } }
.hitters > div, .hitters > li { display: inline-block; padding-bottom: 10px; margin-bottom: 15px; vertical-align: top; }
@media only screen and (min-width: 48em) { .hitters > div, .hitters > li { border-right: 10px solid transparent; padding-right: 20px; } }
.hitters #drawer_2, .hitters #drawer_3 { display: none; }
@media only screen and (min-width: 48em) { .hitters #drawer_2, .hitters #drawer_3 { display: inline-block; } }
.hitters.center > div { text-align: center; }

.maincontent ul.hitters { padding: 0px; }

/* extends hitters, simple white boxes instead of inline */
.boxes .item { padding: 15px; border-radius: 3px; margin-bottom: 30px; background-color: #fff; color: #555; }
.boxes .item h3, .boxes .item .title { margin-top: 0px; }
.boxes.two .item:nth-child(even) { margin-left: 1.5%; }
.boxes.two .item:nth-child(odd) { margin-right: 1.5%; }
.boxes.green-border .item { box-shadow: 5px 5px 0 #69be28; }

/* We used these temporarily on the enterprise-hadoop page and the careers page, but the standard hitters technique is probably better */
.promo-boxes .promo-box { position: relative; margin-bottom: 20px; text-align: center; }
.promo-boxes .promo-box h3 { margin-top: 0px; display: inline-block; margin: 1em auto .25em; width: 100%; }
.promo-boxes .promo-box .promo-img .promo-mask { z-index: 200; width: 300px; height: 200px; background: rgba(51, 94, 51, 0.5); position: relative; display: none; }
.promo-boxes .promo-box .promo-img img { position: relative; left: 0; z-index: 100; }
@media only screen and (min-width: 48em) { .promo-boxes .promo-box { margin: 20px auto; padding-left: 320px; text-align: left; overflow: auto; }
  .promo-boxes .promo-box h3 { margin-top: 0; }
  .promo-boxes .promo-box .promo-img { float: left; width: 300px; margin-left: -320px; } }
@media only screen and (min-width: 60em) { .promo-boxes .promo-box { width: 33%; margin: 0 auto; float: left; overflow: initial; text-align: center; padding: 0 18px; }
  .promo-boxes .promo-box h3 { margin-top: 1em; }
  .promo-boxes .promo-box .promo-img { float: none; width: auto; margin: 0px auto; } }

/* twoway is a row with an image on the left, some copy on the right  */
.twoway { /* Put content in nice white boxes... helpful when used on the light grey background. */ /* This extends the bxslider carousel class... add 'bxslider' to pick up standard styles, and 'auto' to fire the standard JS init script.  */ }
.twoway .item { margin-bottom: 45px; padding: 20px 0px; overflow: auto; text-align: left; }
.twoway .title, .twoway h3 { font-size: 180%; margin-bottom: 10px; margin-top: 0px; font-family: "Cabin", "Helvetica Neue", Arial, Helvetica, "Lucida Grande", sans-serif; }
@media only screen and (min-width: 48em) { .twoway { /* Staggered extends twoway */ }
  .twoway .img img { padding-right: 40px; display: inline; }
  .twoway .img.logo img { padding: 15%; }
  .twoway .img { width: 45%; float: left; }
  .twoway .title, .twoway h3 { margin-left: 45%; }
  .twoway .desc { margin-left: 45%; }
  .twoway.staggered > div:nth-child(even) .img, .twoway.staggered > li:nth-child(even) .img { float: right; text-align: right; padding-left: 40px; padding-right: 0px; }
  .twoway.staggered > div:nth-child(even) .title, .twoway.staggered > div:nth-child(even) .desc, .twoway.staggered > div:nth-child(even) h3 { margin-left: 0; margin-right: 45%; } }
.twoway.boxes .item { padding: 20px; }
.twoway.bxslider .item { padding: 20px 40px; }
.twoway.bxslider .item .img img { width: auto; }

ol.mainpoints, ul.mainpoints { list-style-type: none; padding-left: 0px; }
@media only screen and (min-width: 48em) { ol.mainpoints, ul.mainpoints { margin-right: -30px; } }

.mainpoints { margin: 20px 0px; overflow: hidden; }
.mainpoints > div, .mainpoints > li { background-color: #f9f8f8; margin-bottom: 0px; padding-bottom: 0px; padding: 10px; position: relative; margin-bottom: 1em; }
@media only screen and (min-width: 48em) { .mainpoints > div, .mainpoints > li { float: left; border-right: 15px solid #fff; margin-bottom: 0; } }
.mainpoints .title { font-weight: bold; color: #44697d; font-size: 110%; margin-bottom: 5px; border-bottom: 1px solid #d4dee7; }
.mainpoints .title a { text-decoration: none; }
.mainpoints .desc { margin-bottom: 25px; }
.mainpoints .desc p:first-of-type { margin-top: 0px; }
.mainpoints .more { -webkit-transition: opacity 0.3s ease; position: absolute; display: block; background-color: #7696A7; font-size: 85%; bottom: 0px; left: 0px; width: 100%; padding: 4px 10px; }
.mainpoints .more a { color: #fff; font-weight: bold; text-decoration: none; }
.mainpoints .more a:hover { text-decoration: underline; }
.mainpoints .more a:after { display: inline-block; content: "   »"; padding: 0px 10px; }
.mainpoints .more > div:hover .more { opacity: 1; }

/* Phase Diagrams - Used on Labs Pages */
.phase_diagram { font-size: 90%; margin-bottom: 30px; }
.phase_diagram .phase { border: 1px solid #d7d5d4; position: relative; background-color: #f2f0ef; border-radius: 5px; padding: 10px; margin-bottom: -10px; padding-right: 40px; }
.phase_diagram .completed { background-color: #e6f2df; border-color: #69be28; }
.phase_diagram .title { font-weight: bold; font-size: 110%; }
.phase_diagram .desc ul { padding-left: 20px; }
.phase_diagram .progress { background-color: #fff; border: 1px solid #333; padding: 8px; text-align: center; box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2); margin-bottom: 1em; }
@media only screen and (min-width: 48em) { .phase_diagram .progress { width: 40%; position: absolute; top: 20px; right: -35px; -webkit-transform: rotate(4deg); -moz-transform: rotate(4deg); margin-bottom: 0; } }
.phase_diagram .completed .progress { border-color: #e17000; }
.phase_diagram .apache-release { font-size: 110%; font-weight: bold; color: #69be28; display: block; }
.phase_diagram .hwx-release { font-size: 90%; display: block; }

/* Tutorial Styles... used across a couple pages showing the tutorials, but mainly the tor   */
.tutorials { margin: 25px 0px; }
.tutorials .series { counter-reset: tutorial; margin-bottom: 10px; }
.tutorials .series h4 { background-color: #f2f0ef; padding: 2px 5px; }
.tutorials .series .series-desc { margin: 5px; }
.tutorials .tutorial { position: relative; padding-bottom: 12px; padding-bottom: 10px; margin-bottom: 5px; margin-top: 10px; vertical-align: text-top; counter-increment: tutorial; min-height: 85px; }
@media only screen and (min-width: 48em) { .tutorials .tutorial { background: url(/wp-content/themes/hortonworks/images/page-specific/get-started/tutorial-list.png) left bottom no-repeat; } }
@media only screen and (min-width: 48em) { .tutorials .tutorial:before { content: counter(tutorial); background-color: #44697d; display: inline-block; float: left; border-top: 5px solid #fff; font-size: 120%; font-weight: bold; color: #fff; width: 30px; height: 28px; border-radius: 20px; text-align: center; } }
.tutorials .tutorial > div { /*  */ }
@media only screen and (min-width: 48em) { .tutorials .tutorial > div { padding-left: 50px; } }
.tutorials .tutorial:last-of-type { border-bottom: none; background-image: none; }

#tuts-partners .tutorial { background: none; }

#tuts-partners .tutorial:before { content: none; }

.tutorial .title { font-size: 110%; font-weight: bold; }
.tutorial .pic { border-color: 1px solid #bbb; background-color: #fff; background-repeat: no-repeat; margin-bottom: 5px; }
@media only screen and (min-width: 48em) { .tutorial .pic { float: left; background-size: 80%; width: 110px; height: 80px; overflow: hidden; }
  .tutorial .pic img { width: 150px; } }
.tutorial .partner_name a { color: #999; text-transform: uppercase; font-size: 80%; text-decoration: none; }
.tutorial .partner_name a:hover { text-decoration: underline; }
.tutorial .summary p { margin: 0px; }
.tutorial .desc p { font-style: italic; }

/* Press Releases */
.release { margin-bottom: 35px; }
.release .title { font-size: 130%; }
.release .title a { text-decoration: none; }
.release .excerpt p { margin-top: 0px; }
.release .date { color: #aaa; font-size: 85%; }

/* Fancybox... for some reason something's not quite right : */
.fancybox-wrap { padding: 30px; }

.fancybox-skin { background-color: #fff; border-radius: 15px; }

.fancybox-inner { background-color: #f9f8f8; }
.fancybox-inner h2.header, .fancybox-inner .slug_labs .innovation .header.group_title, .slug_labs .innovation .fancybox-inner .header.group_title { color: #fff; text-align: center; margin: 0; padding: 5px 10px; border-bottom: 1px solid #3d7215; font-size: 180%; background-color: #57a41c; text-transform: uppercase; }
.fancybox-inner .body { padding: 15px; overflow: auto; }
.fancybox-inner .subheader { color: #555; font-size: 150%; }

/* Fancybox settings for the contact-us form */
.contact-sales-form { background-color: #f9f8f8; }
.contact-sales-form h2.header, .contact-sales-form .slug_labs .innovation .header.group_title, .slug_labs .innovation .contact-sales-form .header.group_title { color: #fff; text-align: center; margin: 0 0 10px; padding: 5px 10px; border-bottom: 1px solid #3d7215; font-size: 180%; background-color: #57a41c; text-transform: uppercase; }
.contact-sales-form .desc { width: 300px; position: absolute; background-color: #f9f8f8; font-size: 85%; padding: 10px; }
.contact-sales-form form { float: left; padding-left: 320px; width: 100%; }

/* Thank you page for modals */
.view-mode-compact.slug_thank-you .aside, .view-mode-compact.slug_thank-you .bottom_drawer { display: none; }

/* Used in the Contact Us form and the footer */
ul.contact-options { margin-top: 25px; }
ul.contact-options li { padding-left: 10px; padding-top: 5px; vertical-align: top; margin-bottom: 5px; }
ul.contact-options li.tel { list-style-image: url(../images/icons/contact_phone_black.png); }
ul.contact-options li.email { list-style-image: url(../images/icons/contact_email_black.png); }

.download-cta-box { display: none; float: right; width: 245px; padding: 15px 15px 0px; margin: -20px 0 20px 60px; text-align: center; }
.download-cta-box img { margin: 0; padding: 0; }
@media only screen and (min-width: 48em) { .download-cta-box { display: block; } }

.strat_partners { width: 80%; margin: auto; }
.strat_partners td { padding: 0px 10px; vertical-align: middle; display: block; text-align: center; }
@media only screen and (min-width: 48em) { .strat_partners td { display: table-cell; text-align: left; } }

/* Extended Items - This is tied in with the custom style override for the image galleries, and there is a hook that a JS event handler adds content to! */
.extended_items { list-style-type: none; -webkit-backface-visibility: hidden; margin: 10px 0px; padding-left: 0px; }
.extended_items li { overflow: auto; margin-bottom: 15px; padding-left: 50px; }
.extended_items .desc { display: none; }
.extended_items .icon { vertical-align: top; }
.extended_items .icon img { float: left; width: 40px; margin: 0px; margin-left: -50px; }

/* Creates a horizontal bookshelf style of links... used with extended-items */
.bookshelf { list-style-type: none; padding-left: 10px; margin: 10px -25px 10px 0px; overflow: auto; padding-top: 20px; }
.bookshelf li { vertical-align: top; margin-right: 20px; margin-bottom: 10px; padding-left: 0px; overflow: visible; }
@media only screen and (min-width: 48em) { .bookshelf li { width: 120px; display: inline-block; } }
@media only screen and (min-width: 48em) { .bookshelf .title { font-size: 80%; text-align: center; } }
.bookshelf .desc { display: none; }
.bookshelf .item .img { border: 4px solid #fff; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); }
.bookshelf .icon { text-align: center; overflow: visible; }
.bookshelf .icon img { float: none; width: 100px; margin-left: 0px; margin-bottom: 8px; }
@media only screen and (min-width: 48em) { .bookshelf .icon img { border: 4px solid #fff; box-shadow: 0 0 5px #aaa; } }
@media only screen and (min-width: 48em) { .bookshelf .icon img:hover { -webkit-transform: translateY(-10%) scale(1.15); -webkit-transition: 250ms; } }

/* This works with the show_partners shortcode to show a list of partner logos inline with text... used on YARN Ready page, Training page, and maybe other places */
.partners { text-align: center; }
.partners .partner { display: inline-block; margin: 5px 15px; }
.partners .partner .logo img { max-width: 120px; max-height: 60px; }
.partners .partner .name { display: none; }

/* These have been used on the what's new page to denote additional resources on a topic */
.learning_options { overflow: auto; }
.learning_options > div { float: left; margin-right: 30px; }
.learning_options .fa { padding-right: 6px; font-size: 120%; position: relative; top: 1px; }

@media print, (-o-min-device-pixel-ratio: 5 / 4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) { /* Style adjustments for high resolution devices */ }
/* == PRINT STYLES  Inlined to avoid required HTTP connection: h5bp.com/r == */
@media print { @page { margin: 1.5cm; }
  body { width: auto !important; margin: 0 !important; padding: 0 !important; float: none !important; font-size: 0.8em; }
  * { background: transparent !important; color: #000; 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) ")"; }
  a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }
  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { color: #999; page-break-inside: avoid; }
  thead { display: table-header-group; }
  /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  h1 { font-size: 220% !important; color: #333 !important; line-height: 1.5 !important; }
  h1 + .subtitle { font-size: 130%; color: #333 !important; }
  h2, .slug_labs .innovation .group_title { font-size: 140%; }
  p, h2, .slug_labs .innovation .group_title, h3 { orphans: 2; widows: 2; }
  h2, .slug_labs .innovation .group_title, h3 { page-break-after: avoid; }
  ol.para li, ul.para li { margin-bottom: 15px; }
  /*  Page Layout - Hide Crap that doesn't need to be there. */
  #login-drawer { display: none !important; }
  #header { display: none !important; }
  .ps > div { width: 100%; padding: 0px; padding-bottom: 20px; }
  #newsletter_signup { display: none !important; }
  #sub_footer { display: none !important; }
  #footer_menu { display: none !important; }
  #options_panel { display: none !important; }
  .bottom_drawer { display: none !important; }
  .no-print { display: none !important; }
  .share { display: none !important; }
  .aside { display: none !important; }
  #respond { display: none !important; }
  /* Comments */
  .main { width: 100%; }
  .maincontent { width: 100%; }
  .mainbody .ps.titlebar { border-top: 0px; }
  .mainpoints > div { height: auto !important; } }
/* Modules */
/** BxSlider v4.1.2 - Fully loaded, responsive content slider http://bxslider.com  Written by: Steven Wanderski, 2014 http://stevenwanderski.com (while drinking Belgian ales and listening to jazz)  CEO and founder of bxCreative, LTD http://bxcreative.com */
/** RESET AND LAYOUT
===================================*/
.bx-wrapper { position: relative; margin: 0 auto 60px; padding: 0; *zoom: 1; }

.bx-wrapper img { max-width: 100%; display: block; }

/** THEME
===================================*/
.bx-wrapper .bx-viewport { -moz-box-shadow: 0 0 5px #ccc; -webkit-box-shadow: 0 0 5px #ccc; box-shadow: 0 0 5px #ccc; border: 5px solid #fff; left: -5px; background: #fff; /*fix other elements on the page moving (on Chrome)*/ -webkit-transform: translatez(0); -moz-transform: translatez(0); -ms-transform: translatez(0); -o-transform: translatez(0); transform: translatez(0); }

.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto { position: absolute; bottom: -30px; width: 100%; }

/* LOADER */
.bx-wrapper .bx-loading { min-height: 50px; background: url(/wp-content/themes/hortonworks/images/icons/bx_loader.gif) center center no-repeat #fff; height: 100%; width: 100%; position: absolute; top: 0; left: 0; z-index: 2000; }

/* PAGER */
.bx-wrapper .bx-pager { text-align: center; font-size: .85em; font-family: Arial; font-weight: bold; color: #666; padding-top: 20px; }

.bx-wrapper .bx-pager .bx-pager-item, .bx-wrapper .bx-controls-auto .bx-controls-auto-item { display: inline-block; *zoom: 1; *display: inline; }

.bx-wrapper .bx-pager.bx-default-pager a { background: #666; text-indent: -9999px; display: block; width: 10px; height: 10px; margin: 0 5px; outline: 0; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }

.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active { background: #000; }

/* DIRECTION CONTROLS (NEXT / PREV) */
.bx-wrapper .bx-prev { left: 10px; background: url(/wp-content/themes/hortonworks/images/icons/bx_controls.png) no-repeat 0 -32px; }

.bx-wrapper .bx-next { right: 10px; background: url(/wp-content/themes/hortonworks/images/icons/bx_controls) no-repeat -43px -32px; }

.bx-wrapper .bx-prev { left: -45px; background: url(/wp-content/themes/hortonworks/images/icons/bx_controls.png) no-repeat 0px 0px; border-left: 3px solid #000; }

.bx-wrapper .bx-next { right: -45px; background: url(/wp-content/themes/hortonworks/images/icons/bx_controls.png) no-repeat -70px 0px; border-right: 3px solid #000; }

.bx-wrapper .bx-prev:hover { background-position: 0 -64px; }

.bx-wrapper .bx-next:hover { background-position: -70px -64px; }

.bx-wrapper .bx-controls-direction a { position: absolute; top: 50%; margin-top: -16px; outline: 0; width: 32px; height: 32px; text-indent: -9999px; z-index: 9999; }

.bx-wrapper .bx-controls-direction a.disabled { display: none; }

/* AUTO CONTROLS (START / STOP) */
.bx-wrapper .bx-controls-auto { text-align: center; }

.bx-wrapper .bx-controls-auto .bx-start { display: block; text-indent: -9999px; width: 10px; height: 11px; outline: 0; background: url(/wp-content/themes/hortonworks/images/icons/bx-controls.png) -86px -11px no-repeat; margin: 0 3px; }

.bx-wrapper .bx-controls-auto .bx-start:hover, .bx-wrapper .bx-controls-auto .bx-start.active { background-position: -86px 0; }

.bx-wrapper .bx-controls-auto .bx-stop { display: block; text-indent: -9999px; width: 9px; height: 11px; outline: 0; background: url(/wp-content/themes/hortonworks/images/icons/bx-controls.png) -86px -44px no-repeat; margin: 0 3px; }

.bx-wrapper .bx-controls-auto .bx-stop:hover, .bx-wrapper .bx-controls-auto .bx-stop.active { background-position: -86px -33px; }

/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager { text-align: left; width: 80%; }

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto { right: 0; width: 35px; }

/* IMAGE CAPTIONS */
.bx-wrapper .bx-caption { position: absolute; bottom: 0; left: 0; background: #666 \9; background: rgba(80, 80, 80, 0.75); width: 100%; }

.bx-wrapper .bx-caption span { color: #fff; font-family: Arial; display: block; font-size: .85em; padding: 10px; }

/* HWX Overrides on for BoxSlider jQuery plugin */
.bx-wrapper { margin-bottom: 20px; }

.bx-wrapper .bx-viewport { margin-left: 5px; box-shadow: none; }

.bx-wrapper .bx-controls-direction a { width: 64px; height: 64px; margin-top: -32px; }

.bx-wrapper:hover .bx-controls-direction a { opacity: 1; }

.bx-viewport { margin-left: 5px; box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; }

/* Modules */
/*! fancyBox v2.0.6 fancyapps.com | fancyapps.com/fancybox/#license */
.fancybox-tmp iframe, .fancybox-tmp object { vertical-align: top; padding: 0; margin: 0; }

.fancybox-wrap { position: absolute; top: 0; left: 0; z-index: 8020; }

.fancybox-skin { position: relative; padding: 0; margin: 0; background: #ffffff; color: #444; text-shadow: none; }

.fancybox-opened { z-index: 8030; overflow: visible !important; }

.fancybox-opened .fancybox-skin { -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); }

.fancybox-outer, .fancybox-inner { padding: 0; margin: 0; position: relative; outline: none; }

.fancybox-inner { overflow: hidden; }

.fancybox-type-iframe .fancybox-inner { -webkit-overflow-scrolling: touch; }

.fancybox-error { color: #444; font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; margin: 0; padding: 10px; }

.fancybox-image, .fancybox-iframe { display: block; width: 100%; height: 100%; border: 0; padding: 0; margin: 0; vertical-align: top; }

.fancybox-image { max-width: 100%; max-height: 100%; }

#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url("../images/fancybox_sprite.png"); }

#fancybox-loading { position: fixed; top: 50%; left: 50%; margin-top: -22px; margin-left: -22px; background-position: 0 -108px; opacity: 0.8; cursor: pointer; z-index: 8020; }

#fancybox-loading div { width: 44px; height: 44px; background: url("../images/fancybox_loading.gif") center center no-repeat; }

.fancybox-close { position: absolute; top: -18px; right: -18px; width: 36px; height: 36px; cursor: pointer; z-index: 8040; }

.fancybox-nav { position: absolute; top: 0; width: 40%; height: 100%; cursor: pointer; background: transparent url("../images/blank.gif"); /* helps IE */ -webkit-tap-highlight-color: transparent; z-index: 8040; }

.fancybox-prev { left: 0; }

.fancybox-next { right: 0; }

.fancybox-nav span { position: absolute; top: 50%; width: 36px; height: 34px; margin-top: -18px; cursor: pointer; z-index: 8040; visibility: hidden; }

.fancybox-prev span { left: 20px; background-position: 0 -36px; }

.fancybox-next span { right: 20px; background-position: 0 -72px; }

.fancybox-nav:hover span { visibility: visible; }

.fancybox-tmp { position: absolute; top: -9999px; left: -9999px; padding: 0; overflow: visible; visibility: hidden; }

/* Overlay helper */
#fancybox-overlay { position: absolute; top: 0; left: 0; overflow: hidden; display: none; z-index: 8010; background: #000; opacity: 0.4 !important; }

#fancybox-overlay.overlay-fixed { position: fixed; bottom: 0; right: 0; }

/* Title helper */
.fancybox-title { visibility: hidden; font: normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; position: relative; text-shadow: none; z-index: 8050; }

.fancybox-opened .fancybox-title { visibility: visible; }

.fancybox-title-float-wrap { position: absolute; bottom: 0; right: 50%; margin-bottom: -35px; z-index: 8030; text-align: center; }

.fancybox-title-float-wrap .child { display: inline-block; margin-right: -100%; padding: 2px 20px; background: transparent; /* Fallback for web browsers that doesn't support RGBa */ background: rgba(0, 0, 0, 0.8); -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; text-shadow: 0 1px 2px #222; color: #FFF; font-weight: bold; line-height: 24px; white-space: nowrap; }

.fancybox-title-outside-wrap { position: relative; margin-top: 10px; color: #fff; }

.fancybox-title-inside-wrap { margin-top: 10px; }

.fancybox-title-over-wrap { position: absolute; bottom: 0; left: 0; color: #fff; padding: 10px; background: #000; background: rgba(0, 0, 0, 0.8); }

/* Modules */
/* Overall Diagram */
.lowerbody .hadoop_arch td { display: table-cell; width: auto; }

.hadoop_arch { word-wrap: normal; word-break: normal; margin: 0px auto; }

.maintable { position: relative; border-spacing: 5px; border-collapse: separate; margin-left: -5px; }

/* Customize Diagram based on type */
.lo .hilevel { display: none; }

.hi .lowlevel { display: none; }

.external .sec.external { display: table-cell; }

/* Sections */
.hadoop_arch .sec { font-size: 80%; position: relative; background-color: #e6f2df; border: 1px solid #c2e0b0; border-radius: 5px; padding: 0px; }
.hadoop_arch .sec .body { padding: 5px; text-align: center; }
.hadoop_arch .sec .label { width: 100%; text-transform: uppercase; text-align: center; color: #fff; min-height: 30px; font-weight: bold; font-size: 90%; background-color: #69be28; padding: 5px 8px; border-radius: 5px 5px 0 0; }
.hadoop_arch .sec.side { width: 15%; min-width: 80px; }
.hadoop_arch .sec.side .label { margin-bottom: 50px; }
.hadoop_arch .sec.side.governance .label { margin-bottom: 28px; }
.hadoop_arch .sec.external { display: none; background-color: #f2f0ef; border-color: #ccc; padding: 10px; }
.hadoop_arch .sec:hover, .hadoop_arch .sec.hilight { background-color: #fee8d4; border-color: #e17000; }
.hadoop_arch .sec:hover .label, .hadoop_arch .sec.hilight .label { background-color: #e17000; }
.hadoop_arch .sec :hover .component, .hadoop_arch .sec.hilight .component { border-color: #e17000; }

.hadoop_arch .core { width: 50%; }

.hadoop_arch .purpose { font-weight: bold; text-align: center; text-overflow: ellipsis; overflow: hidden; }

/* Low-Level Components */
.hadoop_arch .component { position: relative; background-color: #fff; border-radius: 5px; padding: 5px 1px; margin-bottom: 5px; border: 1px solid #c2e0b0; }
.hadoop_arch .component.hilight { background-color: #e17000; border-color: #b05801; color: #fff; }
.hadoop_arch .component.hilight a { color: #fff; }

.hadoop_arch .sub-components { padding-left: 0px; }
.hadoop_arch .sub-components li { list-style-type: none; text-align: center; text-overflow: ellipsis; overflow: hidden; }
.hadoop_arch .sub-components li a { text-decoration: none; }

#ha_yarn { position: relative; z-index: 4; }
#ha_yarn.component { margin: 5px; background-color: #44697d; color: #fff; height: 70px; padding-top: 25px; margin-top: -20px; }
#ha_yarn.component.hilight { background-color: #e17000; border-color: #b05801; color: #fff; }
#ha_yarn.component.hilight a { color: #fff; }
#ha_yarn .purpose a { position: relative; display: inline-block; padding-top: 5px; color: #fff; text-decoration: none; font-size: 130%; }

#ha_hdfs.component { height: 100px; padding-top: 30px; background: #fff url(/wp-content/themes/hortonworks/images/assets/hdfs_backdrop.png) no-repeat; background-size: 100% 100%; font-size: 120%; }
#ha_hdfs .purpose { background-color: rgba(255, 255, 255, 0.5); }

#data_management { padding-top: 0px; }
#data_management .label { top: auto; bottom: 0px; border-radius: 0 0 5px 5px; }
#data_management .body { padding-top: 20px; border-radius: 5px 5px 0 0; }

#ha_data_access { margin-bottom: 8px; }
#ha_data_access .body { height: 150px; padding: 0px; }

/* Data Access */
.hadoop_arch .apps { position: relative; z-index: 5; border-spacing: 5px; border-collapse: separate; table-layout: fixed; width: 100%; font-size: 100%; }
.hadoop_arch .apps td { height: 110px; }
.hadoop_arch .apps li { font-size: 90%; }
.hadoop_arch .apps td.others { background-color: #f6f6f6; border: 1px dashed #ddd; }
.hadoop_arch .apps td.more { display: none; }
.hadoop_arch .plug_below .sub-components:after { display: block; position: absolute; bottom: -15px; left: 2px; width: 100%; height: 15px; text-align: center; background: url(/wp-content/themes/hortonworks/images/assets/yarn_plugs.png) top center no-repeat; content: " "; }
.hadoop_arch .plug { position: absolute; bottom: -21px; width: 100%; text-align: center; margin-left: -4px; }
.hadoop_arch .plug_below span { display: inline-block; height: 22px; width: 38px; position: absolute; bottom: 0; right: 18%; }
.hadoop_arch .on_tez { background-image: url(/wp-content/themes/hortonworks/images/assets/arch_tez.png); background-position: center bottom; background-repeat: no-repeat; }
.hadoop_arch .on_slider { background-image: url(/wp-content/themes/hortonworks/images/assets/arch_slider.png); background-position: center bottom; background-repeat: no-repeat; }
.hadoop_arch .on_slider_tez { background-image: url(/wp-content/themes/hortonworks/images/assets/arch_tez-slider.png); background-position: center bottom; background-repeat: no-repeat; }

@media only screen and (max-width: 900px) { .hadoop_arch .apps td.solr { display: none; } }
@media only screen and (max-width: 800px) { .hadoop_arch .apps td.others { display: none; }
  .hadoop_arch .plug_below span { right: 20%; width: 30px; } }
@media only screen and (max-width: 700px) { .hadoop_arch .data_access .body { height: 138px; }
  .hadoop_arch .side.sec .component { min-height: 200px; }
  #ha_ops .component { min-height: 98px; }
  .hadoop_arch .purpose { font-size: 85%; }
  .hadoop_arch .sub-components { display: none; }
  #ha_yarn { padding-top: 25px; }
  .hadoop_arch .apps .component { height: 100px; min-width: 30px; }
  .hadoop_arch .apps .purpose { float: left; text-align: left; position: relative; left: 17px; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); /* Rotate from top left corner (not default) */ -webkit-transform-origin: 0 0; -moz-transform-origin: 0 0; -ms-transform-origin: 0 0; -o-transform-origin: 0 0; transform-origin: 0 0; }
  .hadoop_arch .plug_below span { display: none; } }
/* How can I apply the Media Queries to an artificially small version of the image? */
.min .side.sec .component { min-height: 200px; }

.min .side.sec { width: 12%; min-width: 90px; }

.min .sec:hover { background-color: #e6f2df; border-color: #c2e0b0; }

.min .sec:hover .label { background-color: #69be28; }

.min .sec:hover .component { border-color: #c2e0b0; }

.min #ha_ops .component { min-height: 98px; }

.min .purpose { font-size: 85%; font-weight: normal; }

.min .sub-components { display: none; }

.min .ingest .the_extra { display: none; }

.min .sec.side .label { margin-bottom: 20px; }

.min .sec.side.ingest .label { margin-bottom: 20px; }

.min #ha_yarn { padding-top: 25px; height: 70px; }

.min #ha_yarn .purpose a { text-decoration: none; font-size: 120%; top: 0px; }

.min #ha_yarn .purpose a:hover { color: #fff; }

.min #ha_data_access .body { height: 115px; }

.min #ha_hdfs a { color: #555; text-decoration: none; }

.min #ha_hdfs a:hover { color: #555; text-decoration: none; }

.min .apps td.nosql { display: none; }

.min .apps .component { height: 80px; min-width: 30px; }

.min .apps .purpose { float: left; text-align: left; position: relative; left: 20px; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); white-space: nowrap; /* Rotate from top left corner (not default) */ -webkit-transform-origin: 0 0; -moz-transform-origin: 0 0; -ms-transform-origin: 0 0; -o-transform-origin: 0 0; transform-origin: 0 0; }

.min .on_tez { background-image: none; }
.min .on_slider { background-image: none; }
.min .on_slider_tez { background-image: none; }

/* Modules */
/* Z-INDEX */
.formError { z-index: 9090; }

.formError .formErrorContent { z-index: 9091; }

.formError .formErrorArrow { z-index: 9096; }

.ui-dialog .formError { z-index: 9500; }

.ui-dialog .formError .formErrorContent { z-index: 9501; }

.ui-dialog .formError .formErrorArrow { z-index: 9506; }

.inputContainer { position: relative; float: left; }

.formError { position: absolute; top: 300px; left: 300px; display: block; cursor: pointer; text-align: left; }

.formError.inline { position: relative; top: 0; left: 0; display: inline-block; }

.ajaxSubmit { padding: 20px; background: #55ea55; border: 1px solid #999; display: none; }

.formError .formErrorContent { width: 100%; background: #e17000; position: relative; color: #fff; min-width: 120px; font-size: 11px; border: 2px solid #ddd; box-shadow: 0 0 6px #000; -moz-box-shadow: 0 0 6px #000; -webkit-box-shadow: 0 0 6px #000; -o-box-shadow: 0 0 6px #000; padding: 4px 10px 4px 10px; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; -o-border-radius: 6px; }

.formError.inline .formErrorContent { box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; border: none; border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0; -o-border-radius: 0; }

.greenPopup .formErrorContent { background: #33be40; }

.blackPopup .formErrorContent { background: #393939; color: #FFF; }

.formError .formErrorArrow { width: 15px; margin: -2px 0 0 13px; position: relative; }

body[dir='rtl'] .formError .formErrorArrow, body.rtl .formError .formErrorArrow { margin: -2px 13px 0 0; }

.formError .formErrorArrowBottom { box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; margin: 0px 0 0 12px; top: 2px; }

.formError .formErrorArrow div { border-left: 2px solid #ddd; border-right: 2px solid #ddd; box-shadow: 0 2px 3px #444; -moz-box-shadow: 0 2px 3px #444; -webkit-box-shadow: 0 2px 3px #444; -o-box-shadow: 0 2px 3px #444; font-size: 0px; height: 1px; background: #e17000; margin: 0 auto; line-height: 0; font-size: 0; display: block; }

.formError .formErrorArrowBottom div { box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; }

.greenPopup .formErrorArrow div { background: #33be40; }

.blackPopup .formErrorArrow div { background: #393939; color: #FFF; }

.formError .formErrorArrow .line10 { width: 15px; border: none; }

.formError .formErrorArrow .line9 { width: 13px; border: none; }

.formError .formErrorArrow .line8 { width: 11px; }

.formError .formErrorArrow .line7 { width: 9px; }

.formError .formErrorArrow .line6 { width: 7px; }

.formError .formErrorArrow .line5 { width: 5px; }

.formError .formErrorArrow .line4 { width: 3px; }

.formError .formErrorArrow .line3 { width: 1px; border-left: 2px solid #ddd; border-right: 2px solid #ddd; border-bottom: 0 solid #ddd; }

.formError .formErrorArrow .line2 { width: 3px; border: none; background: #ddd; }

.formError .formErrorArrow .line1 { width: 1px; border: none; background: #ddd; }

/* Modules */
/* example css for company select list display frame class */
.divDisplayFrame { visibility: hidden; font-family: "Cabin", "Helvetica Neue", Arial, Helvetica, "Lucida Grande", sans-serif; width: 400px; position: absolute !important; z-index: 2147483647 !important; background-color: #ffffff !important; text-align: left; font-size: 16px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -moz-box-shadow: 5px 5px 0px #69be28, -1px -1px 15px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 5px 5px 0px #69be28, -1px -1px 15px rgba(0, 0, 0, 0.5); box-shadow: 5px 5px 0px #69be28, -1px -1px 15px rgba(0, 0, 0, 0.5); }

/* example css for company select list table class within displayFrame */
.tabCompList { border: 0; margin-bottom: 10px; }

.tabCompList caption { line-height: 95%; padding: 0; }

.tabCompList h3 { padding: 5px 0 6px 0; font-family: "Cabin", "Helvetica Neue", Arial, Helvetica, "Lucida Grande", sans-serif; font-weight: bold; color: #245B27; border-width: 0; margin-top: 20px; }

.tabCompList td { line-height: 115%; font-size: 14px; border-width: 0; }

/* company rows/columns */
.tabCompTR:nth-child(even), .tabCompNATR { background: #F9F8F8 !important; }

.tabCompTR:hover, .tabCompNATR:hover { background: #3e3e3e !important; }

.tabCompTR:hover .divCompName, .tabCompNATR:hover .divCompNAName { color: #e17000 !important; }

.tabCompTR:hover .divCompDetails, .tabCompNATR:hover .divCompNADetails { color: #fff !important; }

.tabCompTD { padding-left: 2px; }

/* None of the Above row/column */
.tabCompNATD { padding-left: 2px; }

/* example css for company select list div row class within displayFrame */
/* company name/details */
.divCompName { color: #598ba6; }

.divCompDetails { color: #606060; }

/* None of the Above name/details */
.divCompNAName { color: #598ba6; font-weight: bold; font-size: 12px; }

/* example css for loading animation div */
/* Modules */
/*
style for pagination
*/
ul.page-numbers { clear: both; margin: 0; padding: 0; }
ul.page-numbers li { list-style-type: none; float: left; }
ul.page-numbers a, ul.page-numbers span { text-decoration: none; border: 1px solid #BFBFBF; padding: 3px 5px; margin: 2px; }
ul.page-numbers a:hover, ul.page-numbers a.current, ul.page-numbers span:hover, ul.page-numbers span.current { border-color: #000; }
ul.page-numbers a.current, ul.page-numbers span.current { font-weight: bold; }

/* Modules */
#registration_complete { display: none; }

form.register.ajax .row { border-bottom: 1px solid #eee; }
form.register.ajax .row:before, form.register.ajax .row:after { content: ""; display: table; }
form.register.ajax .row:after { clear: both; }
form.register.ajax .row:last-child { border-bottom: none; }
form.register.ajax label { line-height: 40px; cursor: pointer; color: #999; }
form.register.ajax input, form.register.ajax select { margin: 10px 0; width: 350px; padding: 10px; font-size: 16px; }
form.register.ajax input.disabled, form.register.ajax select.disabled { color: grey; }
form.register.ajax input[type="submit"] { width: auto; }
form.register.ajax .ajax-loading { display: none; margin: 0 15px; }

.form_notice span { color: red; display: block; }

/* Modules */
.ui-dialog.insightera { position: absolute; top: 50%; right: 0; }
.ui-dialog.insightera .ui-dialog-titlebar-close { height: 24px; margin: -12px 0 0; width: 26px; }

/* CUSTOM - These are page-specific styles and overrides... they shouldn't really be included in the main stylesheet, but for now they are */
/* Blog */
/* == BLOG STYLING == */
.post_meta { margin-bottom: 30px; color: #999; }

/* == COMMENT STYLING == */
.comment { position: relative; padding-left: 60px; margin-bottom: 20px; }

.awaiting_moderation .comment_meta { border-bottom: 1px solid #e17000; background-color: #fff; }
.awaiting_moderation .comment_body { color: #ccc; background-color: #fff; }
.awaiting_moderation .comment_title { color: #ccc; }
.awaiting_moderation .comment_title a { color: #9bafc3; }
.awaiting_moderation .posted_on { color: #ccc; }
.awaiting_moderation .reply { display: none; }
.awaiting_moderation .avatar_container img { -webkit-filter: opacity(25%); }

.awaiting_moderation_note { display: inline; color: #666; }

.comment_title { background-color: #eee; padding: 2px 5px; }
.comment_title a { text-decoration: none; }

.comment_author { display: inline; font-weight: bold; }

.comment_body { background-color: #f6f6f6; overflow: auto; padding: 10px 5px; }

.comment_meta { font-size: 85%; color: #999; background-color: #fafafa; padding: 2px 5px; }
.comment_meta a { color: #e17000; }

.comment_actions { display: inline; }

.comment .avatar_container { position: absolute; left: 0px; top: 0px; }

.posted_on { display: inline; font-size: 85%; color: #999; }

.reply { display: inline; font-weight: bold; }

#respond input, #respond textarea { width: 100%; }
#respond code { display: block; font-size: 75%; margin: 10px 0px; }
#respond .form-allowed-tags { width: 100%; }

#cancel-comment-reply-link { font-size: 16px; font-weight: normal; float: right; font-size: 15px; text-decoration: none; padding-top: 8px; }

.tax-blog_type h2, .tax-blog_type .slug_labs .innovation .group_title, .slug_labs .innovation .tax-blog_type .group_title, .blog h2, .blog .slug_labs .innovation .group_title, .slug_labs .innovation .blog .group_title, .archive h2, .archive .slug_labs .innovation .group_title, .slug_labs .innovation .archive .group_title { font-size: 175%; margin-top: 0px; }
.tax-blog_type h2 a, .tax-blog_type .slug_labs .innovation .group_title a, .slug_labs .innovation .tax-blog_type .group_title a, .blog h2 a, .blog .slug_labs .innovation .group_title a, .slug_labs .innovation .blog .group_title a, .archive h2 a, .archive .slug_labs .innovation .group_title a, .slug_labs .innovation .archive .group_title a { text-decoration: none; }
.tax-blog_type .entry, .blog .entry, .archive .entry { padding-bottom: 30px; overflow: auto; padding: 10px; margin: 0px -10px 50px; }
.tax-blog_type .entry:hover, .blog .entry:hover, .archive .entry:hover { background-color: #f6f6f6; }
@media only screen and (min-width: 48em) { .tax-blog_type .meta, .blog .meta, .archive .meta { width: 35%; float: left; } }
.tax-blog_type .post_date, .blog .post_date, .archive .post_date { font-size: 85%; color: #999; }
.tax-blog_type .post_author, .blog .post_author, .archive .post_author { font-size: 85%; }
.tax-blog_type .post_author a, .blog .post_author a, .archive .post_author a { text-decoration: none; }
@media only screen and (min-width: 48em) { .tax-blog_type .content, .blog .content, .archive .content { width: 65%; float: left; padding-left: 10%; } }
.tax-blog_type .more_link a, .blog .more_link a, .archive .more_link a { text-decoration: none; }
.tax-blog_type .blog_type, .blog .blog_type, .archive .blog_type { padding: 2px 5px; background-color: #69be28; border-bottom: 2px solid #3d7215; color: #fff; }
.tax-blog_type .blog_type a, .blog .blog_type a, .archive .blog_type a { color: #fff; text-decoration: none; }
.tax-blog_type .blog_type a:hover, .blog .blog_type a:hover, .archive .blog_type a:hover { text-decoration: underline; }
.tax-blog_type .blog_type.announcements, .blog .blog_type.announcements, .archive .blog_type.announcements { background-color: #e17000; border-bottom: 2px solid #b05801; }
.tax-blog_type .social-icons-list, .blog .social-icons-list, .archive .social-icons-list { float: right; }

/* Product */
.slug_hdp .hdp_assembly .stage { position: relative; }
@media only screen and (min-width: 48em) { .slug_hdp .hdp_assembly .stage { margin-top: 100px; margin-bottom: 100px; padding-left: 50%; } }
@media only screen and (min-width: 48em) { .slug_hdp .hdp_assembly .diagram { position: absolute; top: 0px; left: 0px; width: 48%; } }
.slug_hdp .hdp_assembly .sec { text-transform: uppercase; color: #aaa; margin-bottom: 15px; }
.slug_hdp .hdp_assembly h3.title { border-bottom: 0px; margin-bottom: 0px; }
.slug_hdp .benefits > div > .title { font-weight: bold; font-size: 120%; margin-bottom: 10px; }
.slug_hdp .benefits > div > .icon { margin-bottom: 20px; display: none; }
@media only screen and (min-width: 48em) { .slug_hdp .community-promo { padding-bottom: 160px; margin-top: -30px; } }
.slug_hdp .committers-image { margin-top: 25px; }
.slug_hdp .committers-image img { max-width: 50%; }
.slug_hdp .community-caption { padding: 10px; border-radius: 5px; font-size: 80%; color: #999; display: inline-block; }
@media only screen and (min-width: 48em) { .slug_hdp .community-caption { width: 48%; margin-top: 95px; } }
.slug_hdp .build-diagram { margin-top: 90px; }

.slug_whats-new .lowerbody .ps > div { overflow: hidden; }
.slug_whats-new .segue { margin: 0 auto; background-color: #f2f0ef; padding: 5px 20px; font-weight: bold; border-top-left-radius: 5px; border-top-right-radius: 5px; color: #69be28; }
@media only screen and (min-width: 48em) { .slug_whats-new .segue { max-width: 500px; text-align: center; margin-bottom: -30px; } }
@media only screen and (min-width: 48em) { .slug_whats-new .hive_promo { float: left; width: 55%; } }
.slug_whats-new .community_promo { padding: 20px; padding-bottom: 160px; background-color: #fff; border-radius: 10px; background: #fff url(/wp-content/themes/hortonworks/images/page-specific/hdp/hive_collab.jpg) center bottom no-repeat; background-size: 100% auto; color: #555; }
@media only screen and (min-width: 48em) { .slug_whats-new .community_promo { float: right; width: 35%; margin-left: 40px; } }
.slug_whats-new h2, .slug_whats-new .slug_labs .innovation .group_title, .slug_labs .innovation .slug_whats-new .group_title { margin-top: 20px; }
.slug_whats-new .community_promo h3 { margin-top: 0px; }
.slug_whats-new .asparagus { text-align: center; margin-top: 25px; margin-bottom: 20px; }
.slug_whats-new .asparagus img { max-width: 100%; }
.slug_whats-new .core_image { text-align: center; display: none; }
@media only screen and (min-width: 48em) { .slug_whats-new .core_image { display: block; } }
.slug_whats-new .new_features { overflow: auto; }
.slug_whats-new .feature_group { margin-bottom: 40px; }
.slug_whats-new .feature { background-color: #f0f0f0; padding: 10px 15px; margin-bottom: 1em; }
@media only screen and (min-width: 48em) { .slug_whats-new .feature { margin-bottom: 10px; } }
@media only screen and (min-width: 48em) { .slug_whats-new .feature.ambari { position: absolute; top: 60px; right: 0px; width: 25%; } }
@media only screen and (min-width: 48em) { .slug_whats-new .feature.storm { float: left; width: 40%; }
  .slug_whats-new .feature.solr { float: right; width: 54%; }
  .slug_whats-new .feature.falcon { float: left; width: 40%; }
  .slug_whats-new .feature.knox { float: right; width: 54%; } }
.slug_whats-new .feature h3 { margin-top: 0px; }
.slug_whats-new .invests h3 { margin-top: 20px; }

.version { text-transform: uppercase; font-size: 150%; margin-bottom: -15px; }

@media only screen and (min-width: 48em) { .whats_new { width: 70%; float: left; overflow: auto; padding-right: 50px; } }

.whats_new ul { padding-left: 0px; list-style-type: none; overflow: auto; margin-left: 0; }

.whats_new li { margin-bottom: 8px; display: inline-block; min-width: 300px; max-width: 600px; margin: 0px; margin-right: 40px; margin-bottom: 25px; line-height: 1.45em; vertical-align: top; }

.whats_new li b { display: block; margin-bottom: 10px; }

@media only screen and (min-width: 48em) { .techspecs { width: 30%; float: left; overflow: auto; } }
.techspecs table { width: 100%; }

.techspecs th { padding-bottom: 10px; }

.techspecs tr td:first-of-type { padding-right: 30px; }

.techspecs tr:nth-child(even) { background-color: #f5f5f5; }

.benefits { margin-top: 35px; }

/* Download Options */
/* Previous Versions */
.previous_versions ul { list-style-type: none; padding-left: 0px; }

/* Docs section on product page */
.documentation .search { float: right; }

.documentation .search input[type=submit] { margin-left: 20px; }

.docs { overflow: auto; }
@media only screen and (min-width: 48em) { .docs { width: 75%; } }

.docs .segment { position: relative; margin-bottom: 20px; padding: 10px; background-color: #f6f6f6; vertical-align: top; }

.docs .segment h3 { background-repeat: no-repeat; margin-top: 0px; padding-left: 20px; background-position: 0px 8px; }

.docs .segment h4 { font-weight: normal; font-size: 100%; margin: 10px 0px 0px; padding-left: 20px; font-weight: bold; }

.docs .segment ul { list-style-type: none; padding-left: 20px; margin: 0px; }

.docs .segment a { color: #5C7F92; text-decoration: none; }

.docs .segment a:hover { color: #e17000; text-decoration: none; }

#getting_started h3 { background-image: url(../images/icons/docs_play_9x12.png); }

#installation h3 { background-image: url(../images/icons/docs_wrench_12x12.png); }

#cluster_guide h3 { background-image: url(../images/icons/docs_cog_12x12.png); }

#ops_guide h3 { background-image: url(../images/icons/docs_key_stroke_12x12.png); }

#integration_guide h3 { background-image: url(../images/icons/docs_chart_12x12.png); }

#sysadmin_guide h3 { background-image: url(../images/icons/docs_sun_stroke_12x12.png); }

#reference h3 { background-image: url(../images/icons/docs_book_alt_12x12.png); }

#user_guide h3 { background-image: url(../images/icons/docs_sun_stroke_12x12.png); }

.cse .gsc-search-button input.gsc-search-button-v2, input.gsc-search-button-v2 { padding: 6px 7px; }

.gsc-control-cse { background-color: transparent; border: 0px; padding: 0px; }

.gsc-control-cse table { border-collapse: separate; margin-bottom: 0; }

.gsc-input td { padding: 2px 4px; }

table.addons { margin-left: -5px; }

table.addons .desc { padding: 10px 30px 5px 5px; }

table.addons .downloads { padding: 10px 5px; width: 100%; text-align: center; }
@media only screen and (min-width: 48em) { table.addons .downloads { width: 20%; } }

table.addons tr { border-bottom: 1px dashed #ddd; }

div.roundedcorners .fancybox-skin { border-radius: 10px; background: #fafafa; }

#eula { text-align: left; width: 542px; }

#eula .eula_box { height: 200px; width: auto; overflow-y: auto; background: white; padding: 10px; border: 1px solid #BBB; font-size: 11px; }

#eula h3 { font-weight: normal; color: #69BE28; font-size: 1.2em; padding: 0 0 1em 0; margin: 0 0 1em 0; }

#eula pre { margin: 0.2em 0 1em 0; white-space: pre; }

#eula pre, #eula tt { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5; padding: 10px; display: block; }

#eula button { margin: 10px 0 0 0; }

.float_l { float: left; }

.float_r { float: right; }

/* Legacy Download Options Layout - Updated for hitters.... this can probably get cleaned out.  */
.download-options-wide { margin-bottom: 10px; }

.download-options-wide .download-option { position: relative; margin-bottom: 30px; overflow: auto; }

.download-options-wide .do-title { font-size: 125%; border-bottom: 1px solid #eee; margin-bottom: 10px; }

.download-options-wide .body { margin-right: 250px; }

.download-options-wide .option { float: right; width: 200px; }

.download-options .download-option { border-radius: 3px; padding: 0; position: relative; display: inline-block; margin-bottom: 0px; border: 1px solid #ddd; }

.download-options .do-title { border-radius: 3px; font-weight: bold; color: #fff; padding: 20px 15px 15px; background: #999; /* Old browsers */ background: -moz-linear-gradient(top, #999 0%, #777 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #999), color-stop(100%, #777)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #999 0%, #777 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #999 0%, #777 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #999 0%, #777 100%); /* IE10+ */ background: linear-gradient(to bottom, #999999 0%, #777777 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#999', endColorstr='#777',GradientType=0 ); /* IE6-9 */ }

.download-options .do-title a { color: #fff; font-weight: bold; text-decoration: none; }

.download-options .body { position: relative; min-height: 250px; padding: 15px; border-top: 0px; }

.download-options .desc { min-height: 150px; }

.download-option .details { font-size: 80%; color: #999; }

/* Why is this doen as a ul? */
.download-options ul.install_docs { padding-left: 0px; list-style-type: none; text-align: center; }

.download-options ul.install_docs li { font-size: 85%; display: inline-block; padding-right: 5px; border-right: 1px solid #999; }

.download-options ul.install_docs li:last-of-type { border-right: 0px; }

.download-options .install_docs { text-align: center; font-size: 90%; }

.download-option .option .downloads_page_btn { display: block; text-align: center; margin: 0; width: 100%; font-weight: bold; color: #69BF44; padding: 17px 0 17px; text-decoration: none; border: 1px solid #dcdcdc; border-top: 0px; border-collapse: collapse; box-shadow: none; background: white; /* Old browsers */ /*background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlOWU5ZTkiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);*/ background: -moz-linear-gradient(top, white 0%, #e9e9e9 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, #e9e9e9)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, white 0%, #e9e9e9 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, white 0%, #e9e9e9 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, white 0%, #e9e9e9 100%); /* IE10+ */ background: linear-gradient(to bottom, #ffffff 0%, #e9e9e9 100%); /* W3C */ }

.download-option .option .downloads_page_btn:hover { background: #F8F8F8; }

.also { padding-left: 50px; background: url(../images/icons/green_arrow_x41.png) no-repeat left; position: absolute; top: 0px; right: 70px; }

.also .type { font-size: 80%; color: #999; text-transform: uppercase; }

.also a { color: #69be28; }

/* New style Downloads Page */
.download-all { margin-bottom: 20px; }
.download-all .download-option { position: relative; padding-bottom: 10px; margin-bottom: 10px; overflow: auto; border-bottom: 1px  solid #eee; }
.download-all .download-option:last-of-type { border-bottom: 0px; }
.download-all .do-title { font-size: 110%; margin-bottom: 0px; font-weight: 500; }
.download-all .details { margin-bottom: 10px; }
@media only screen and (min-width: 48em) { .download-all .desc { width: 45%; float: left; margin-right: 40px; } }
.download-all .option { text-align: center; margin-top: 20px; }
@media only screen and (min-width: 48em) { .download-all .option { float: right; width: 22%; font-size: 85%; margin-top: -40px; } }
.download-all .option a { margin-bottom: 20px; }
.download-all .install_docs { font-size: 85%; margin-top: 20px; }
@media only screen and (min-width: 48em) { .download-all .install_docs { float: left; width: 23%; min-height: 110px; margin-top: -40px; } }
.download-all .install_docs ul { padding-left: 0px; margin-top: 0px; display: inline-block; }
.download-all .install_docs li { list-style-type: none; margin-bottom: 10px; }

.doc_icon img { margin: 0px; box-shadow: 0 0 5px #aaa; height: 100px; margin-right: 20px; float: left; overflow: visible; }

/* Styling the sidebar links to forums */
.forums_list { list-style-type: none; padding-left: 0px; }

.forums_list li { margin-bottom: 20px; }

.forums_list .desc { display: block; }

.slug_hortonworks-sandbox #sandbox_image { position: relative; z-index: 5; max-width: 1200px; margin: auto; overflow: visible; }
@media only screen and (min-width: 48em) { .slug_hortonworks-sandbox #sandbox_image img { position: absolute; top: 20px; right: 50px; } }
.slug_hortonworks-sandbox .bicon { text-align: center; }
.slug_hortonworks-sandbox .bicon img { width: 30%; }
.slug_hortonworks-sandbox .center.hitters .hitter { text-align: center; padding-right: 40px; }

/* Enterprise */
.slug_why-hortonworks-for-hadoop .innovation .title { font-size: 140%; }
.slug_why-hortonworks-for-hadoop .innovation.three .project { margin-bottom: 50px; }
.slug_why-hortonworks-for-hadoop .innovation .tagline { font-size: 110%; }

.slug_hadoop-modern-data-architecture article { margin: 0 0 40px 0; }
.slug_hadoop-modern-data-architecture .mainpoints.green > div { padding: 0; background-color: #fff; height: auto !important; margin-bottom: 20px; }
@media only screen and (min-width: 48em) { .slug_hadoop-modern-data-architecture .mainpoints.green > div { height: 307px !important; margin-bottom: 0; } }
.slug_hadoop-modern-data-architecture .mainpoints.green .colhead h3 { color: #fff; border-bottom: 0px; margin-top: 0px; overflow: visible; }
.slug_hadoop-modern-data-architecture .mainpoints.green .colhead { background-color: #69be28; text-align: center; padding: 20px; margin-bottom: 20px; overflow: visible; }
@media only screen and (min-width: 48em) { .slug_hadoop-modern-data-architecture .mainpoints.green .colhead { height: 120px; } }
.slug_hadoop-modern-data-architecture .mainpoints.green .colbody { font-size: .9em; padding: 0px 15px; line-height: 1.5em; }
.slug_hadoop-modern-data-architecture .readmore { margin-top: 28px; padding: 0px; }
.slug_hadoop-modern-data-architecture .readmore a { font-size: inherit; }
.slug_hadoop-modern-data-architecture .orange { color: #e17000; }
.slug_hadoop-modern-data-architecture .center { text-align: center; }
.slug_hadoop-modern-data-architecture .last { margin-bottom: 0; }
.slug_hadoop-modern-data-architecture .no-break { white-space: nowrap; }

.slug_use-cases .case { overflow: auto; clear: both; padding-top: 35px; padding-bottom: 25px; background: url(/wp-content/themes/hortonworks/images/assets/divider_light.jpg) no-repeat scroll center top transparent; padding-left: 300px; }
.slug_use-cases .uc_video { width: 250px; padding-top: 15px; }
.slug_use-cases .uc_video img { width: 250px; }
.slug_use-cases .uc_video.left { float: left; margin-left: -300px; margin-right: 40px; }
.slug_use-cases .get_the_doc { width: 150px; float: right; margin-left: 50px; text-align: center; margin-top: -20px; }
.slug_use-cases .get_the_doc .subtitle { color: #aaa; text-transform: uppercase; font-size: 90%; margin-bottom: 5px; }
.slug_use-cases .get_the_doc img { border: 5px solid #fff; box-shadow: 0px 0px 5px #666; width: 120px; }

/* About */
.slug_contact .contact-us.hitters > div { width: 100%; height: 450px; background-repeat: no-repeat !important; background-size: cover !important; }
@media only screen and (min-width: 48em) { .slug_contact .contact-us.hitters > div { margin-right: 10px; width: 31%; } }
.slug_contact .main.location .details { font-size: 110%; background-color: #f9f8f8; padding: 10px; }
.slug_contact .main.location .details a { text-decoration: none; }
.slug_contact .details > div { margin-bottom: 20px; }
.slug_contact .details .title { font-size: 130%; }
.slug_contact .remote.locations .office { background-color: #f9f8f8; padding: 10px; }
@media only screen and (min-width: 48em) { .slug_contact .remote.locations .office { float: left; width: 31%; margin-right: 20px; } }

.slug_contact h1 + .subtitle, .slug_management-team h1 + .subtitle, .slug_board-of-directors h1 + .subtitle, .slug_founders h1 + .subtitle, .slug_press-releases h1 + .subtitle { display: none; }
@media only screen and (min-width: 48em) { .slug_contact h1 + .subtitle, .slug_management-team h1 + .subtitle, .slug_board-of-directors h1 + .subtitle, .slug_founders h1 + .subtitle, .slug_press-releases h1 + .subtitle { display: block; } }

/* Partner */
@media only screen and (min-width: 48em) { .slug_become-a-partner .program { padding-left: 320px; }
  .slug_become-a-partner .program .logo { margin-left: -320px; width: 280px; float: left; } }

.partner-filters { /**** Isotope Filtering ****/ /**** Isotope CSS3 transitions ****/ /**** disabling Isotope CSS3 transitions ****/ /*  This'll make the strategic partners bigger.
.strategic.partner              { width:298px; height:297px; }
.strategic.partner .logo        { margin:20px; width:240px; height:240px; }
*/ }
.partner-filters .isotope-item { z-index: 2; }
.partner-filters .isotope-hidden.isotope-item { pointer-events: none; z-index: 1; }
.partner-filters .isotope, .partner-filters .isotope .isotope-item { -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; -ms-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; }
.partner-filters .isotope { -webkit-transition-property: height, width; -moz-transition-property: height, width; -ms-transition-property: height, width; -o-transition-property: height, width; transition-property: height, width; }
.partner-filters .isotope .isotope-item { -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; -ms-transition-property: -ms-transform, opacity; -o-transition-property: -o-transform, opacity; transition-property: transform, opacity; }
.partner-filters .isotope.no-transition, .partner-filters .isotope.no-transition .isotope-item, .partner-filters .isotope .isotope-item.no-transition { -webkit-transition-duration: 0s; -moz-transition-duration: 0s; -ms-transition-duration: 0s; -o-transition-duration: 0s; transition-duration: 0s; }
.partner-filters .mainbody .ps.titlebar h1 + .subtitle { margin-left: -40px; padding-left: 40px; }
.partner-filters #partner_blox { overflow: visible; }
@media only screen and (min-width: 48em) { .partner-filters #partner_blox { padding-right: 41px; padding-left: 60px; } }
.partner-filters .partner-gallery { width: 100%; margin-left: -9px; }
.partner-filters .fwd_back { position: relative; font-size: 300%; font-weight: bold; z-index: 999; }
.partner-filters .fwd_back a { text-decoration: none; display: inline-block; padding: 3px 10px 10px; border-radius: 20px; color: #d6d6d6; }
.partner-filters .fwd_back a:hover { color: #aaa; }
.partner-filters .fwd_back .left { position: absolute; top: 230px; left: 0; z-index: 2; }
@media only screen and (min-width: 48em) { .partner-filters .fwd_back .left { left: -60px; } }
.partner-filters .fwd_back .right { position: absolute; z-index: 2; top: 230px; right: 0; }
@media only screen and (min-width: 48em) { .partner-filters .fwd_back .right { right: -50px; } }
.partner-filters #partners { width: 100%; visibility: hidden; }
@media only screen and (min-width: 48em) { .partner-filters #partners { visibility: visible; } }
.partner-filters .partner { position: relative; padding: 10px; width: 141px; height: 141px; display: inline-block; border: 1px solid #eee; background-color: #fff; margin: 8px; cursor: pointer; -moz-box-shadow: 0 0 7px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 0 7px rgba(0, 0, 0, 0.1); box-shadow: 0 0 7px rgba(0, 0, 0, 0.1); }
.partner-filters .partner:hover { border-color: #fcc79b; }
.partner-filters .partner .name { display: none; }
.partner-filters .partner .logo { width: 120px; height: 120px; background: no-repeat center center; background-size: contain; }
.partner-filters .partner .certified { position: absolute; top: -4px; left: -4px; width: 149px; height: 60px; background: url("/wp-content/themes/hortonworks/images/certified_ribbon_60.png") no-repeat; }
.partner-filters .partner .yarn.certified { background: url("/wp-content/themes/hortonworks/images/certified_ribbon_yarn_60.png") no-repeat; }
.partner-filters .sort_n_filter { display: none; }
@media only screen and (min-width: 48em) { .partner-filters .sort_n_filter { display: block; } }
@media only screen and (min-width: 48em) { .partner-filters .sort_n_filter .label { float: left; } }
.partner-filters .filters { list-style-type: none; margin: 15px 0px; padding-left: 0; overflow: auto; }
@media only screen and (min-width: 48em) { .partner-filters .filters { padding-left: 30px; } }
@media only screen and (min-width: 48em) { .partner-filters .filters li { display: inline-block; margin-right: 10px; } }
.partner-filters .filters li a { display: block; background-color: #999; color: #fff; border-radius: 10px; padding: 10px 20px; margin-bottom: 10px; text-decoration: none; font-size: 80%; }
@media only screen and (min-width: 48em) { .partner-filters .filters li a { padding: 3px 8px; margin-bottom: 0; } }
.partner-filters .filters li a:hover { background-color: #e17000; }
.partner-filters .filters li a.active { background-color: #44697d; }
.partner-filters .form_table { width: 100%; }
.partner-filters .form_table td { padding-right: 20px; }
.partner-filters .form_table select { width: 100%; }
.partner-filters .form_table textarea { width: 100%; }
.partner-filters .form_table input { width: 100%; }

/* Used for the YARN Ready logos in the partner page template... this is a different method than what is used on the ready program pages themselves */
.titlebar .certified_logo { display: none; }
@media only screen and (min-width: 48em) { .titlebar .certified_logo { display: block; position: absolute; right: 50px; top: 20px; } }
.titlebar .certified_logo a { margin-left: 15px; }
.titlebar .certified_logo img { height: 130px; }

.single-hw_partner .partner_logo { text-align: center; }
.single-hw_partner .partner_logo img { width: auto; max-width: 100%; max-height: 140px; }

/* Home */
@media only screen and (min-width: 48em) { .page-template-page-events-php .event { padding-left: 170px; position: relative; } }
@media only screen and (min-width: 48em) { .page-template-page-events-php .event .title { margin-left: -170px; } }
.page-template-page-events-php .event .logo { display: block; overflow: hidden; }
@media only screen and (min-width: 48em) { .page-template-page-events-php .event .logo { float: left; margin-left: -170px; } }
.page-template-page-events-php .event .logo img { max-width: 150px; height: auto; }
.page-template-page-events-php .date { font-size: 90%; }
.page-template-page-events-php .loc { font-size: 90%; font-weight: bold; margin-bottom: 10px; }
.page-template-page-events-php .related_posts { list-style: none; padding-left: 0; }

/* Labs */
/* Innovation Projects - Used in labs.... layout is controlled by hitters. */
.slug_labs .hadoop_arch { margin: -150px auto -180px; position: relative; top: -20px; left: 20px; text-align: center; display: none; }
@media only screen and (min-width: 48em) { .slug_labs .hadoop_arch { display: block; } }
.slug_labs .innovation { margin: 30px 0px 0px; overflow: visible; }
.slug_labs .innovation .project { padding: 10px; vertical-align: top; margin-bottom: 20px; position: relative; border-radius: 5px; background-color: #f0f0f0; z-index: 5; }
.slug_labs .innovation .partners .hitters { font-size: 200%; }
.slug_labs .innovation .partners .hitters .project { width: 32%; font-size: 50%; }
@media only screen and (min-width: 48em) { .slug_labs .innovation .upper .project, .slug_labs .innovation .lower .project { width: 29%; display: inline-block; } }
@media only screen and (min-width: 48em) { .slug_labs .innovation .upper .project:first-child, .slug_labs .innovation .lower .project:first-child { margin-left: 0px; margin-right: 5%; }
  .slug_labs .innovation .upper .project:last-child, .slug_labs .innovation .lower .project:last-child { margin-left: 5%; margin-right: 0px; } }
@media only screen and (min-width: 48em) { .slug_labs .project.stinger { margin-top: 60px; }
  .slug_labs .project.spark { margin-top: 60px; }
  .slug_labs .project.security { margin-top: 60px; } }
.slug_labs .innovation .desc { text-align: center; }
.slug_labs .innovation .title { font-size: 150%; text-align: center; margin-top: -5px; }
.slug_labs .innovation .title a { text-decoration: none; }
.slug_labs .innovation .icon { text-align: center; }
.slug_labs .innovation .icon img { width: 50px; }
.slug_labs .innovation .tagline { font-size: 90%; text-transform: uppercase; color: #999; margin-bottom: 10px; text-align: center; }
.slug_labs .innovation .add_links { display: none; }
.slug_labs .innovation .quote { display: none; }
.slug_labs .innovation .group_desc { margin-bottom: 20px; }
.slug_labs .innovation .project .delivered { position: absolute; top: 10px; right: 20px; text-align: right; }
.slug_labs .innovation .project .delivered img { width: 90px; }
.slug_labs .innovation .pullquote { margin-left: -100px; font-size: 100%; margin-top: 35px; margin-bottom: 0px; }
.slug_labs .innovation .quoter { font-size: 80%; margin-left: -65px; margin-top: 0px; }
.slug_labs .innovation.three .project { padding-left: 70px; }
.slug_labs .innovation.three .icon { margin-left: -70px; }
.slug_labs .innovation.three img { width: 60px; }

.slug_yarn .delivered, .slug_stinger .delivered { display: none; }
@media only screen and (min-width: 48em) { .slug_yarn .delivered, .slug_stinger .delivered { position: absolute; top: -160px; right: 50px; display: block; } }
.slug_yarn .delivered img, .slug_stinger .delivered img { width: 300px; }
.slug_yarn .mainbody .ps, .slug_stinger .mainbody .ps { overflow: visible; }
.slug_yarn .mainbody .ps:last-child > div, .slug_stinger .mainbody .ps:last-child > div { overflow: visible; }
.slug_yarn .titlebar .ps > div, .slug_stinger .titlebar .ps > div { overflow: visible; }

/* Solutions */
/* on single view, solutions, and other pages... this is the row that speaks to the high-level of benefits.... green circle images */
.solutions-benefits .item .img { overflow: hidden; display: none; }
.solutions-benefits .item .img img { opacity: 0.65; width: 100%; margin-top: -20%; margin-left: -20%; }
.solutions-benefits .item:nth-child(even) .img img { margin-left: 0px; margin-right: -20%; }
.solutions-benefits .item .cta { margin-top: 30px; }
.solutions-benefits .item h3 { margin-top: 10px; text-transform: uppercase; }
@media only screen and (min-width: 48em) { .solutions-benefits .item .img { display: block; } }

/* FROM THE CUSTOMERS PAGE */
.cs_container { position: relative; overflow: hidden; }

.cs_btn.next { position: absolute; right: 0px; top: 0px; width: 42px; height: 60px; overflow: hidden; z-index: 999; }

.cs_btn.prev { position: absolute; left: 0px; top: 0px; width: 42px; height: 60px; overflow: hidden; z-index: 999; }

.cs_btn.next img:hover { margin-left: -42px; }

.cs_btn.prev img:hover { margin-left: -42px; }

.cs_btn img { max-width: none; }

.customer_slider { text-align: center; margin: 5px auto; }
.customer_slider ul { list-style-type: none; padding-left: 0px; }
.customer_slider .customer { display: inline-block; margin: 0px 10px; }
.customer_slider .logo { text-align: center; width: 110px; height: 60px; }
.customer_slider .logo img { max-width: 100px; max-height: 50px; position: relative; top: 50%; margin-top: -25px; }

.featured_customer { overflow: hidden; padding-top: 10px; padding-bottom: 10px; }
@media only screen and (min-width: 48em) { .featured_customer { float: left; width: 60%; } }

.featured_customer .image img { border: 3px solid #fff; }

.featured_customer .title { display: none; font-size: 150%; margin-bottom: 10px; }

.featured_customer .title a { text-decoration: none; }

.featured_customer .logo img { max-width: 180px; max-height: 50px; margin: 10px 0px; }

.featured_customer .more { margin: 10px 0px; }

.related_industry { border-radius: 5px; font-size: 90%; position: relative; overflow: hidden; }
@media only screen and (min-width: 48em) { .related_industry { width: 35%; float: right; } }

.related_industry .icon { position: absolute; top: -5px; right: 5px; }

.related_industry .title { background-color: #69be28; padding: 5px 10px; color: #fff; text-transform: uppercase; font-weight: bold; margin-top: 20px; }

.related_industry .title a { text-decoration: none; color: #e6f2df; }

.related_industry .title a:hover { color: #fff; }

.related_industry .desc { background-color: #f0f0f0; padding: 12px 10px 5px; }

.related_industry .desc ul { padding-left: 20px; }

.related_industry .more { background-color: #f0f0f0; padding: 0px 10px 10px; }
@media only screen and (min-width: 48em) { .related_industry .more { position: absolute; bottom: 15px; right: 0px; } }

/* Home */
/* == HOME PAGE == */
.home { /* Banner class - Used for displaying things like logos in a strip - as used on the home page */ /* New Wirestone MDA Panel */ /* Industries */ /* New Wirestone HDP Story */ }
.home .mainbody { background: #fff; }
.home h1 { font-size: 400%; }
.home h2, .home .slug_labs .innovation .group_title, .slug_labs .innovation .home .group_title { font-size: 280%; border-bottom: 0px; }
.home h3 { border-bottom: 0px; }
.home #top { background: top center no-repeat; overflow: visible; position: relative; z-index: 5; }
.home #top > div { padding-bottom: 40px; }
.home #top h1 { margin-top: -10px; margin-bottom: 0px; }
.home #top h1 sup { top: -20px; }
.home #top h1 + .subtitle { font-size: 150%; }
@media only screen and (min-width: 48em) { .home #top h1 + .subtitle { width: 480px; } }
.home #top h1 + .subtitle a { text-decoration: none; color: #777; }
.home #top h1 + .subtitle a:hover { text-decoration: underline; }
.home #top .marker { font-size: 120%; }
.home #top .summary_block { float: right; margin-top: 60px; margin-bottom: 20px; color: #fff; overflow: auto; width: auto !important; max-width: 600px; }
@media only screen and (min-width: 48em) { .home #top .summary_block { max-width: none; } }
.home #top .summary { padding: 10px; padding-right: 20px; text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); background-color: rgba(0, 0, 0, 0.45); display: table-cell; vertical-align: middle; }
.home #top .summary a { color: #fff; }
.home #top .avance { display: table-cell; vertical-align: middle; background-color: rgba(105, 190, 40, 0.5); height: 100%; vertical-align: middle; color: #fff; font-size: 200%; font-weight: bold; margin: auto; padding: 5px; padding-top: 0px; cursor: pointer; }
.home #top .avance:hover { background-color: #69be28; }
.home #top .teaser .title { margin-top: 15px; }
.home #top.new-dawn { color: #fff; background-color: #fff; background-image: url(../images/page-specific/home/generic-banner.jpg); background-size: cover; background-position: center; }
.home #top.new-dawn h1 { margin-top: -10px; }
.home #top.new-dawn .subtitle { color: #fff; }
@media only screen and (min-width: 48em) { .home #top.new-dawn .subtitle { display: block; } }
.home #top.new-dawn .subtitle a { color: #fff; }
.home #top.new-dawn .subtitle a:hover { color: #fff; }
.home #top .hitters { color: #555; margin-top: 30px; }
@media only screen and (min-width: 48em) { .home #top .hitters { margin: 95px -40px 0px; background: none; padding: 10px 20px 0px 40px; } }
.home #top .hitters > div { display: block; }
@media only screen and (min-width: 48em) { .home #top .hitters > div { display: inline-block; } }
.home #top .hitters .hitter { background-color: rgba(255, 255, 255, 0.9); position: relative; height: 100%; margin-bottom: 10px; padding: 10px; border-radius: 4px; }
@media only screen and (min-width: 48em) { .home #top .hitters .hitter { padding: 5px 15px 10px; background-color: #fff; box-shadow: 5px 5px 0px #69be28, -1px -1px 15px rgba(0, 0, 0, 0.5); -webkit-border-radius: 4px; -moz-border-radius: 4px; margin-bottom: 0px; }
  .home #top .hitters .hitter:hover { background-color: #f6f6f6; } }
.home #top .hitters h3 { font-weight: bold; color: #69be28; text-transform: uppercase; margin: 8px 0px 15px; font-size: 110%; }
.home #top .hitters .title a { font-weight: bold; text-decoration: none; }
.home #top .hitters .content { color: #888; position: relative; z-index: 5; }
.home #top .hitters li { padding-left: 20px; }
.home #top .hitters li .subtext { display: block; font-size: 90%; color: #999; margin-left: -7px; font-weight: normal; }
.home #top .hitters li:before { content: "» "; color: #69be28; margin-left: -20px; }
.home #top .hitters .content a { font-weight: bold; text-decoration: none; }
.home #top .hitters .more { position: absolute; bottom: 20px; right: 15px; width: 90px; height: 90px; background-image: url("../images/assets/home-down-green.png"); visibility: hidden; text-indent: -9999px; }
.home #top .hitters:hover .more { visibility: visible; }
.home #top .other-suggestions { font-size: 85%; }
.home #home_hitters { position: relative; clear: both; z-index: 5; }
@media only screen and (min-width: 48em) { .home #home_hitters { margin-top: -180px; } }
.home #sandbox-promo > div { padding: 20px 40px 15px; overflow: auto; }
.home #sandbox-promo h2, .home #sandbox-promo .slug_labs .innovation .group_title, .slug_labs .innovation .home #sandbox-promo .group_title { font-size: 250%; margin-bottom: 0px; }
.home #sandbox-promo .desc { margin-bottom: 10px; }
@media only screen and (min-width: 48em) { .home #sandbox-promo h2, .home #sandbox-promo .slug_labs .innovation .group_title, .slug_labs .innovation .home #sandbox-promo .group_title { text-transform: uppercase; font-size: 150%; font-weight: bold; margin-top: -5px; width: 65%; float: left; text-align: left; }
  .home #sandbox-promo .desc { float: left; width: 65%; padding-right: 20px; }
  .home #sandbox-promo .cta { float: right; width: 200px; width: 35%; margin-top: -5px; padding-right: 30px; } }
@media only screen and (min-width: 75em) { .home #sandbox-promo h2, .home #sandbox-promo .slug_labs .innovation .group_title, .slug_labs .innovation .home #sandbox-promo .group_title { float: left; width: 25%; font-size: 225%; }
  .home #sandbox-promo .desc { float: left; width: 55%; padding-right: 20px; }
  .home #sandbox-promo .cta { float: right; width: 200px; width: 20%; margin-top: -5px; } }
.home #customers { display: none; box-shadow: 0px 20px 30px rgba(0, 0, 0, 0.05); }
@media only screen and (min-width: 48em) { .home #customers { display: block; } }
.home #customers > div { padding-top: 0px; }
.home .ps.dark { color: #f6f6f9; }
.home .ps.dark a { color: #fff; }
.home .ps.dark a:hover { color: #e17000; }
.home .ps.strip > div { padding-top: 25px; padding-bottom: 25px; }
.home .ps.strip .hey { text-align: center; font-size: 110%; }
.home .banner { margin-bottom: 20px; }
.home .banner h3 { float: left; color: #999; text-transform: uppercase; font-size: 100%; border-bottom: 2px solid #ccc; margin-bottom: 0px; padding-bottom: 5px; float: left; }
.home .banner .item { display: inline-block; vertical-align: middle; color: green; text-align: center; }
.home .banner .items { text-align: center; }
.home .customers { margin-bottom: 0px; margin-top: 10px; }
.home .customers h3 { color: #999; font-size: 120%; border-bottom: 0px; float: left; padding-top: 18px; }
.home .customers .logo img { margin: 10px 15px; max-width: 100px; max-height: 45px; }
.home .customers .desc { display: none; }
.home .customers .next { float: right; font-size: 300%; margin-top: -10px; }
.home .customers .next a { text-decoration: none; }
.home .customers .logo:hover img { filter: none; /*
-webkit-filter: grayscale(0%);
-moz-filter: grayscale(0%);
*/ }
.home .partners { margin-bottom: 0px; margin-top: 10px; text-align: center; clear: both; }
.home .partners .title { color: #999; text-transform: uppercase; float: left; margin-top: 8px; max-width: 140px; text-align: left; }
.home .partners .item { display: inline-block; vertical-align: middle; text-align: center; }
.home .partners .items { text-align: center; }
.home .partners .item img { margin: 10px 15px; max-width: 100px; max-height: 35px; }
.home .partners .desc { display: none; }
.home .partners .more { font-size: 85%; float: right; max-width: 220px; margin-top: 15px; }
.home .partners .more a { text-decoration: none; }
.home .partners .next { float: right; font-size: 300%; margin-top: -10px; }
.home .partners .next a { text-decoration: none; }
.home #mda > div { padding-bottom: 10px; }
.home #mda h2, .home #mda .slug_labs .innovation .group_title, .slug_labs .innovation .home #mda .group_title { padding: 0; text-align: center; }
.home #mda h3.subtitle { font-size: 140%; color: #69be28; font-weight: normal; margin: -15px 0 40px 0; padding: 0; text-align: center; }
.home #mda p { font-size: 120%; text-align: left; }
.home #mda .cta { text-align: center; }
.home #mda .promo-box img { max-width: 220px; height: 150px; }
.home #mda .promo-box h3 { text-transform: uppercase; font-weight: normal; }
.home #industries { position: relative; z-index: 10; overflow: visible; box-shadow: 0px 20px 30px rgba(0, 0, 0, 0.05); }
.home #industries > div { text-align: center; padding: 0 0 30px; }
.home #industries .label { font-size: 140%; display: inline-block; }
.home #industries .dropdown { padding: 5px; border: 1px solid #e9e9e9; position: relative; margin-left: 20px; display: inline-block; color: #555; width: 190px; text-align: left; font-size: 120%; -webkit-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.05); -moz-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.05); box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.05); }
.home #industries .submenu { background: #fff; position: absolute; z-index: 100; display: none; margin-left: 0px; border-radius: 6px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45); }
.home #industries .dropdown li { border-bottom: 1px solid #f6f6f6; }
.home #industries .dropdown li a { color: #555555; display: block; font-family: arial; padding: 6px 15px; cursor: pointer; text-decoration: none; }
.home #industries .dropdown li a:hover { background: #7bc143; color: #FFFFFF; text-decoration: none; }
.home #industries a.account { color: #555; display: block; padding-left: 5px; text-decoration: none; background: url("../images/icons/arrow.png") 152px -1px no-repeat; cursor: pointer; }
.home #industries .root { font-size: 90%; list-style: none; margin: 0px; padding: 0px; padding: 0; border-top: 1px solid #dedede; }
.home #hdp-feature > div { margin: 0 auto; padding-top: 45px; }
.home #hdp-feature > div > .col-2 { margin-top: 20px; }
.home #hdp-feature h2, .home #hdp-feature .slug_labs .innovation .group_title, .slug_labs .innovation .home #hdp-feature .group_title { margin: 0; padding: 0; text-align: center; font-size: 80%; }
@media only screen and (min-width: 48em) { .home #hdp-feature h2, .home #hdp-feature .slug_labs .innovation .group_title, .slug_labs .innovation .home #hdp-feature .group_title { font-size: 320%; } }
.home #hdp-feature h3.subtitle { font-size: 140%; color: #69be28; font-weight: normal; margin: 0 0 30px 0; padding: 0; text-align: center; }
.home #hdp-feature h3.subtitle a { color: #69be28; }
.home #hdp-feature h3.subtitle a:hover { text-decoration: underline; }
.home #hdp-feature p { margin-bottom: 0; font-size: 120%; text-align: left; }
.home #hdp-feature div.feature-unit div.feature-thumb { margin-right: 48px; width: 32%; float: left; }
.home #hdp-feature div.feature-unit div.feature-thumb img { outline: 1px solid #ccc; box-shadow: 2px 3px 5px 1px #888888; width: 335px; height: auto; border: 10px solid #fff; }
.home #hdp-feature div.feature-unit div.feature-info { width: 63%; float: left; }
.home #hdp-feature div.feature-unit div.feature-info h3 { font-size: 180%; font-weight: normal; margin: 0 0 10px 0; padding: 0; text-align: left; }
.home #hdp-feature div.feature-unit div.cta a { font-weight: bold; text-transform: uppercase; text-decoration: none; }
.home #hdp-feature div.feature-unit div.feature-gap { clear: both; margin-bottom: 54px; }
.home #learn { padding-bottom: 50px; background-color: #f2f0ef; }
.home #learn h3 { border-bottom: 1px; }
.home #learn h4 { margin-top: 10px; }
.home #learn .hitter { padding-right: 30px; }
.home #learn .classes { padding-left: 0px; list-style-type: none; }
.home #learn .classes li { margin-bottom: 5px; }
.home .essentials_callout { position: absolute; right: 50px; bottom: -150px; width: 300px; height: 300px; border-radius: 50%; background-color: #fff; color: #555; text-align: center; padding: 40px 40px; }
.home .essentials_callout .typer { color: #e17000; font-weight: bold; }
.home .essentials_callout h3 { margin: 10px 5px 0px; }
.home .essentials_callout h3 a { color: #69be28 !important; }

/* Wirestone MDA */
.slug_mda { /* Industries */ }
.slug_mda h2, .slug_mda .slug_labs .innovation .group_title, .slug_labs .innovation .slug_mda .group_title { text-align: center; font-size: 270%; }
.slug_mda h2 + h3, .slug_mda .slug_labs .innovation .group_title + h3, .slug_labs .innovation .slug_mda .group_title + h3 { text-align: center; font-size: 180%; margin-top: -15px; margin-bottom: 25px; color: #69be28; }
.slug_mda .ps.mda-adnimate > div { padding: 0 50px; }
.slug_mda .ps.mda-adnimate > div ul li { margin: -20px 0 0 -40px; padding: 0px; }
.slug_mda .ps.mda-adnimate > div ul li video { margin: 0 auto; padding: 0 150px; }
.slug_mda .ps.maincontent > div { padding-bottom: 0px; }
.slug_mda .ps.maincontent > div h2, .slug_mda .ps.maincontent > div .slug_labs .innovation .group_title, .slug_labs .innovation .slug_mda .ps.maincontent > div .group_title { text-align: center; }
.slug_mda .ps.maincontent > div h3 { color: #69be28; }
.slug_mda .ps.maincontent div.maincontent { width: 66%; float: left; }
.slug_mda .ps.maincontent div.mda-cta { width: 33%; float: left; }
.slug_mda .ps.maincontent div.mda-cta img { display: block; clear: both; margin: 0 auto; }
.slug_mda .column-2 { width: 50%; float: left; min-height: 300px; }
.slug_mda .column-2 p { margin: 0; padding: 15px 25px; }
.slug_mda .ps.opportunities > div { padding-top: 0px; }
.slug_mda .ps.opportunities > div h2, .slug_mda .ps.opportunities > div .slug_labs .innovation .group_title, .slug_labs .innovation .slug_mda .ps.opportunities > div .group_title { margin-bottom: 30px; }
.slug_mda .ps.opportunities > div .item { padding: 0px 15px; }
.slug_mda .ps.opportunities > div h3 { color: #69be28; text-align: center; margin-top: 0; line-height: 1.4; font-size: 160%; }
.slug_mda .ps.opportunities > div h4 { text-align: center; font-weight: normal; text-transform: uppercase; color: #ccc; margin-top: -5px; margin-bottom: 20px; padding-top: 0; }
.slug_mda .ps#partnerships > div .hitters > div { background-color: #fff; padding: 25px; margin-right: 3%; width: 30%; border-radius: 5px; }
.slug_mda .ps#partnerships > div h2, .slug_mda .ps#partnerships > div .slug_labs .innovation .group_title, .slug_labs .innovation .slug_mda .ps#partnerships > div .group_title { text-align: center; font-size: 300%; }
.slug_mda .ps#partnerships > div h3 { color: #69be28; text-align: center; margin-top: 0; font-size: 200%; }
.slug_mda .ps#partnerships > div .logo { width: 50%; margin: 0 auto; height: 75px; text-align: center; }
.slug_mda .ps#partnerships > div .logo img { max-height: 75px; }
.slug_mda .ps#hdp > div { margin-bottom: 0; }
.slug_mda .ps#hdp p { margin-bottom: 50px; }
.slug_mda .ps#hdp img { box-shadow: 2px 2px 1px #888; }
.slug_mda .ps#hdp .cta-wrap { text-align: center; margin: 0; padding: 0 10%; }
.slug_mda .ps#hdp .cta-wrap h3 { font-size: 200%; }
.slug_mda #industries { position: relative; z-index: 10; overflow: visible; box-shadow: 0px 20px 30px rgba(0, 0, 0, 0.05); }
.slug_mda #industries > div { text-align: center; padding: 30px 0 30px; overflow: visible; }
.slug_mda #industries .label { font-size: 140%; display: inline-block; font-weight: bold; }
.slug_mda #industries .dropdown { padding: 5px; border: 1px solid #e9e9e9; background-color: #fff; position: relative; margin-left: 20px; display: inline-block; color: #555; width: 190px; text-align: left; font-size: 120%; -webkit-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.05); -moz-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.05); box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.05); }
.slug_mda #industries .submenu { background: #fff; position: absolute; bottom: 40px; z-index: 100; display: none; margin-left: 0px; border-radius: 6px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45); }
.slug_mda #industries .dropdown li { border-bottom: 1px solid #f6f6f6; }
.slug_mda #industries .dropdown li a { color: #555555; display: block; font-family: arial; padding: 6px 15px; cursor: pointer; text-decoration: none; }
.slug_mda #industries .dropdown li a:hover { background: #7bc143; color: #FFFFFF; text-decoration: none; }
.slug_mda #industries a.account { color: #555; display: block; padding-left: 5px; text-decoration: none; background: url("../images/icons/arrow.png") 152px -1px no-repeat; cursor: pointer; }
.slug_mda #industries .root { font-size: 90%; list-style: none; margin: 0px; padding: 0px; padding: 0; border-top: 1px solid #dedede; }

/* Wirestone MDA */
.link--green { color: #69be28; }

.link--plane { display: inline-block; position: relative; left: -23px; vertical-align: middle; }
.link--plane:before { content: ""; position: relative; left: 100%; display: inline-block; width: 23px; height: 18px; margin-left: 5px; background: transparent url(/wp-content/themes/hortonworks/images/page-specific/training/icon-plane.png) no-repeat 0 0; vertical-align: middle; }

.training-tracks { background-color: #f9f8f8; padding-bottom: 2em; }

.track-heading { text-align: center; }
.track-heading h3 { display: inline-block; width: auto; padding: .5em	1em; background-color: white; border-bottom: 0; border-radius: 8px; color: #999; font-weight: bold; text-transform: uppercase; }
.track-heading .track-arrows { display: block; padding-top: 10%; background: transparent url("/wp-content/themes/hortonworks/images/page-specific/training/track-path.png") no-repeat center center; }

.track-box { padding: 2em; text-align: center; color: #756e69; }
@media only screen and (min-width: 48em) { .track-box { width: 32%; float: left; margin: 0 1%; } }
.track-box:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 12px; background-color: #756e69; }
.track-box .track--title { position: relative; font-size: 28px; margin-top: 0; padding-top: 2.25em; border-bottom: 0; }
.track-box .track--title:before, .track-box .track--title:after { font-family: "FontAwesome"; font-size: 32px; position: absolute; left: 50%; margin-left: -.5em; }
.track-box .track--title:before { top: 0.25em; }
.track-box .track--title:after { top: 0; }
.track-box:first-child { margin-left: 0; }
.track-box:last-child { margin-right: 0; }
@media only screen and (min-width: 48em) { .track-box:last-child { float: right; } }
.track-box .track-box--classes { text-align: left; }
.track-box .track-box--classes h5 { margin-bottom: 0; font-size: 1rem; }
.track-box .classes-list { border-bottom: 2px dashed #d7d5d4; margin: 0 0 .5em; padding-bottom: .5em; }
.track-box .classes-list a { display: inline-block; vertical-align: middle; }
.track-box .class-name:after { display: inline-block; border-bottom: 0; padding-left: 4px; font-size: 2.5em; line-height: 24px; vertical-align: top; }
.track-box .class-topic { font-size: 12px; }

.track-box--dev { border-top-color: #e17000; }
.track-box--dev:before { background-color: #e17000; }
.track-box--dev .track--title:before, .track-box--dev .track--title:after, .track-box--dev a, .track-box--dev .class-name:after { color: #e17000; }
.track-box--dev .track--title:before, .track-box--dev .track--title:after { font-size: 24px; }
.track-box--dev .track--title:before { content: "\F0F4"; margin-left: -.625em; top: 1em; }
.track-box--dev .track--title:after { content: "\F06D"; }

.track-box--sysadmin { border-top-color: #69be28; }
.track-box--sysadmin:before { background-color: #69be28; }
.track-box--sysadmin .track--title:before, .track-box--sysadmin .track--title:after, .track-box--sysadmin a, .track-box--sysadmin .class-name:after { color: #69be28; }
.track-box--sysadmin .track--title:before { content: "\F0AD"; }

.track-box--data .track--title:before, .track-box--data .track--title:after, .track-box--data a, .track-box--data .class-name:after { color: #756e69; }
.track-box--data .track--title:before { content: "\F0E8"; }

.training-different--carousel { position: relative; height: auto; min-height: 450px; }

.testimonial-carousel { position: relative; min-height: 450px; height: auto; }
@media only screen and (min-width: 48em) { .testimonial-carousel { padding: 0 2em; } }
.testimonial-carousel .slide { width: 95%; margin: 0 auto; height: auto; min-height: 100%; left: 5%	!important; /* forgive the !important, it needs	to fight the inline	styles from	js */ text-align: center; padding: 2.5em 0; border: 1px soild #d7d5d4; background-color: white; }
@media only screen and (min-width: 48em) { .testimonial-carousel .slide-body { max-width: 60%; margin: 0 auto; } }
.testimonial-carousel .slide-body blockquote { quotes: "\201C" "\201D"; font-family: "Helvetica Neue", Helvetica, Arial, "Open Sans", "Lucida Grande", sans-serif; font-weight: normal; position: relative; color: #756e69; }
.testimonial-carousel .slide-body blockquote:before { top: .075em; left: 0.025em; font-family: sans-serif; font-size: 15em; line-height: .5; color: #f2f0ef; }
.testimonial-carousel .slide-body blockquote .quote { position: relative; font-size: 20px; }
.testimonial-carousel .slide-body blockquote .source { display: inline-block; width: auto; padding: .75em 1em; border-top: 1px solid #d7d5d4; }
.testimonial-carousel .slide-body blockquote .client { text-transform: uppercase; font-weight: bold; }
.testimonial-carousel .slide-body blockquote .client-title { font-style: italic; }
.testimonial-carousel .slide-body blockquote .client-company { color: #44697d; text-decoration: none; font-weight: bold; }
.testimonial-carousel .slide-body blockquote .client-company:hover { color: #756e69; }

.carousel-nav a { position: absolute; top: 50%; margin-top: -50px; }
.carousel-nav a:before { font-family: "FontAwesome"; font-size: 100px; color: #d7d5d4; }
.carousel-nav #prev { left: -20px; }
.carousel-nav #prev:before { content: "\F104"; }
.carousel-nav #next { right: -20px; }
.carousel-nav #next:before { content: "\F105"; }

.training-map { padding: 0 0	2em; }
.training-map .sect-banner { text-align: center; border-bottom: 0; margin-bottom: 1em; font-size: 45px; font-weight: 300; }
.training-map .sect-banner span { font-size: 28px; color: #999; display: block; }
@media only screen and (min-width: 48em) { .training-map .sect-banner span { display: inline-block; } }

.map-col { float: left; }

.map-box { position: relative; background: transparent url(/wp-content/themes/hortonworks/images/page-specific/training/map-dotted.png) no-repeat center center; background-size: contain; min-height: 339px; width: 100%; }
@media only screen and (min-width: 48em) { .map-box { width: 66%; } }
.map-box .map-mark { display: none; }
@media only screen and (min-width: 48em) { .map-box .map-mark { position: absolute; display: block; width: 15px; height: 19px; background: transparent url(/wp-content/themes/hortonworks/images/page-specific/training/marker-map.png) no-repeat center center; }
  .map-box .map-mark:before { -moz-transition: opacity 0.2s ease-out; -o-transition: opacity 0.2s ease-out; -webkit-transition: opacity 0.2s ease-out; transition: opacity 0.2s ease-out; content: attr(data-location); display: block; position: absolute; top: 2px; left: 100%; width: auto; min-width: 115px; margin-left: 3px; font-size: 13px; color: #69be28; font-weight: bold; text-shadow: 0 1px 0 white; opacity: 0; }
  .map-box .map-mark:nth-child(1) { top: 125px; left: 190px; z-index: 1; }
  .map-box .map-mark:nth-child(1):hover { z-index: 10; }
  .map-box .map-mark:nth-child(2) { top: 105px; left: 200px; z-index: 2; }
  .map-box .map-mark:nth-child(2):hover { z-index: 10; }
  .map-box .map-mark:nth-child(3) { top: 90px; left: 330px; z-index: 3; }
  .map-box .map-mark:nth-child(3):hover { z-index: 10; }
  .map-box .map-mark:nth-child(3):before { right: 100%; left: auto; text-align: right; margin-right: 3px; }
  .map-box .map-mark:nth-child(4) { top: 80px; left: 340px; z-index: 4; }
  .map-box .map-mark:nth-child(4):hover { z-index: 10; }
  .map-box .map-mark:nth-child(5) { top: 110px; left: 340px; z-index: 5; }
  .map-box .map-mark:nth-child(5):hover { z-index: 10; }
  .map-box .map-mark:nth-child(6) { top: 125px; left: 560px; z-index: 6; }
  .map-box .map-mark:nth-child(6):hover { z-index: 10; }
  .map-box .map-mark:nth-child(7) { top: 135px; left: 115px; z-index: 6; }
  .map-box .map-mark:nth-child(7):hover { z-index: 10; }
  .map-box .map-mark:hover:before { opacity: 1; } }

.exam-details { font-weight: 300; }
@media only screen and (min-width: 48em) { .exam-details { width: 33%; padding-left: 2em; } }
.exam-details h2, .exam-details .slug_labs .innovation .group_title, .slug_labs .innovation .exam-details .group_title { display: inline-block; vertical-align: middle; width: auto; margin-bottom: 0; font-size: 20px; font-weight: bold; font-style: normal; color: #69be28; border-bottom: 0; }
.exam-details h2:before, .exam-details .slug_labs .innovation .group_title:before, .slug_labs .innovation .exam-details .group_title:before { content: ""; display: inline-block; vertical-align: middle; width: 29px; height: 35px; margin-right: .5em; background: transparent url(/wp-content/themes/hortonworks/images/page-specific/training/marker-online.png) no-repeat center center; }
.exam-details .lede { font-style: normal; }

.training-tracks { padding-bottom: 2rem; }

.training-tracks > div { background: url("/wp-content/themes/hortonworks/images/page-specific/training/class_bg.jpg") no-repeat; background-size: 100%; position: relative; padding-top: 150px; }
@media only screen and (min-width: 48em) { .training-tracks > div { padding-top: 280px; } }

.training-tracks .subheader { background-color: rgba(255, 255, 255, 0.8); padding: 15px 30px; color: #555; font-size: 115%; font-weight: 500; border-radius: 5px; margin-bottom: 0px; }
@media only screen and (min-width: 48em) { .training-tracks .subheader { position: absolute; width: 40%; right: 40px; margin: 0; top: 50px; } }

.training-callouts { padding-bottom: 2rem; }

.training-callout { background-color: #f2f0ef; padding: 20px; text-align: center; }

@media only screen and (min-width: 48em) { .two.hitters .training-callout { width: 46%; } }

@media only screen and (min-width: 48em) { .training-callout:first-of-type { margin-right: 40px; } }

.training-callout .title { font-size: 160%; font-family: "Cabin", "Helvetica Neue", Arial, Helvetica, "Lucida Grande", sans-serif; margin: 10px	0px; }
.training-callout .subtitle { text-transform: uppercase; color: #999; font-size: 90%; margin: -10px	0px	20px; }
.training-callout .subtitle + p { margin-top: 0px; }
.training-callout .body { text-align: left; font-size: 110%; }
.training-callout ul { margin-bottom: 5px; list-style-type: none; font-size: 110%; }
.training-callout ul li { margin-bottom: 5px; }
.training-callout .image { float: left; border: 5px solid #fff; }
.training-callout .image + .body { margin-left: 180px; }

.training-certification { margin-bottom: 40px; }
.training-certification .cert-icon:before { content: ""; display: inline-block; position: relative; top: 5px; width: 50px; height: 61px; background: transparent url(/wp-content/themes/hortonworks/images/page-specific/training/icon-certificate-lg.png) no-repeat left center; }

.cert-content { margin-right: 1%; color: white; }
@media only screen and (min-width: 48em) { .cert-content { width: 49%; float: left; display: inline-block; } }
.cert-content:last-of-type { margin-right: 0; margin-left: 1%; }

.cert-body p { font-size: 125%; }

.cert-icon:before { content: ""; display: inline-block; position: relative; top: 5px; width: 60px; height: 61px; background: transparent url(../images/training/icon-certificate-lg.png) no-repeat left center; }

.cert-callout--inner { padding: 1.5em 2em 2em; background-color: rgba(51, 79, 94, 0.34); }
.cert-callout--inner h3 { margin-top: 0px; }

.cert-list { padding-left: 20px; }

.cert-callout-note { font-size: 90%; font-style: italic; margin-top: 10px; color: #bfc9d3; }

.training-different .sect-banner { text-align: center; }

.training-different .diff-inner { padding-bottom: 20px; padding-right: 20px; }
@media only screen and (min-width: 48em) { .training-different .diff-inner { padding-left: 55%; min-height: 450px; background: transparent url(/wp-content/themes/hortonworks/images/page-specific/training/training_instructors.png) no-repeat 5% bottom; } }
.training-different .diff-inner h3 { text-align: center; border-bottom: 0; color: #aaa; font-weight: bold; }

.training-different .diff-list { color: #aaa; }
.training-different .diff-list li { margin-bottom: 0px; font-size: 200%; vertical-align: top; }
.training-different .diff-list li div { color: #555; font-size: 70%; }

.training-different .diff-list b { color: #e17000; font-weight: normal; }

.training-different .btn-wrap { text-align: center; padding: 20px; }
