and
Example: Code in a paragraph
This is a cool paragraph about a classname called .franz
----------------------------------------------------- */
/**
@forms
---------------------------------------------------------
base/_forms.scss
--------------------------------------------------------
Base styles for all forms and form related elements
Below you'll set styles for all forms, and if you have
any specific kinds of forms, like a search form that you
create a classname of form--search, put that at the
bottom of this partial.
This scss partial is pretty big. Here's how it is
organized.
* Base styling on form elements
* Styles for form & form modules
--------------------------------------------------------- */
/* @text inputs
--------------------------------------------------------
Base styles for inputs
Example: Text Input
Option 1
Option 2
Option 3
Option 4
Selects can have added sizing classes, .select--s and .select--l
Example: Small select
Option 1
Option 2
Option 3
Option 4
Example: Large select
Option 1
Option 2
Option 3
Option 4
------------------------------------------------------ */
/* @textareas
--------------------------------------------------------
Base styling for textareas
Textareas can have .textarea--s or .textarea--l classes
for different sizes
Example: Textarea
Example: Small Textarea
Example: Large Textarea
------------------------------------------------------ */
/* @radio inputs
--------------------------------------------------------
Base styling for radio inputs. Radios are surrounded
by a label for better click targets.
Example: Radio
Don't label me, I'm a free spirit
------------------------------------------------------ */
/* @form
--------------------------------------------------------
Like the bootstrap convention, apply standard styling
on any form with the classname .form
This allows us to create modifier classnames like
.form--inline and .form--horizontal, which will be
laid out further below.
------------------------------------------------------ */
/* @form-title
--------------------------------------------------------
A form title usually is found within the header element
at the beginning of a form.
Example: Form title
-------------------------------------------------------- */
/* @fieldsets
--------------------------------------------------------
Fieldsets group together related fields.
Example: Fieldset
Personal Information
Your Name
Your Email
Must be a valid email address
Fieldsets are also nested inside other fieldsets.
Example: Nested Fieldsets
Personal Information
Your Name
Your Email
Must be a valid email address
Address
Address 1
Must be a valid email address
Address 2
Must be a valid email address
-------------------------------------------------------- */
/* @fields
--------------------------------------------------------
A field is a div that contains the input and anything
related to the input.
Example: Field for a text input
Your Name
Example: Field with hint
Your Email
Must be a valid email address
Example: Field with Error
Your Email
Sorry, that email is in use.
Example: Field for a select input
Select your favorite
Pizza
Tacos
Burgers
Example: Field for a textarea input
Your Name
-------------------------------------------------------- */
/* @input group
--------------------------------------------------------
Group containing multiple inputs, helpful for lists
of radios or checkboxes. Shown below in a field...
Example: Field with input group of radios
Example: Field with input group of checkboxes
Example: Field with input group list modifier
------------------------------------------------------ */
/**
@headings
--------------------------------------------------------
base/_headings.scss
--------------------------------------------------------
We set any base styles for any headings that have
no classnames.
Base Headings ONLY - see ui-headings in /modules for
more stylized headings.
Example: Headings
This is an h1 heading
This is an h2 heading
This is an h3 heading
This is an h4 heading
This is an h5 heading
This is an h6 heading
Additionally, we add classnames so you
can apply the styling of, for instance, an h1 to an h2.
Example: H1 styled like an H3
This is an h1 but looks like an h3
------------------------------------------------------ */
/* @alt-headings
--------------------------------------------------------
Alternative headings class for heading 1-6 tags or class
Make sure to use a h1-h6 element if symantically correct
or a h1-h6 class and the heading base class along with
any optional headding modifier classes. Use correct semantic
heading first and then add desired .h1-.h6 classes and
any modifiers after
------------------------------------------------------ */
/**
@hr
--------------------------------------------------------
base/_hr.scss
--------------------------------------------------------
Horizontal Rule
Example:
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry.
-------------------------------------------------------- */
/**
@images
---------------------------------------------------------
base/_images.scss
--------------------------------------------------------
Base styling for images, plus some helpful utility
classes that modify images.
Note: You won't add any styling to these image classes,
these are just utility classes
--------------------------------------------------------- */
/* @images
--------------------------------------------------------
Base Image Style is 100% width by default
Example: Image
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
Example: Image, Natural Width
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
Example: Image, Center
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
------------------------------------------------------ */
/* @img--circle
--------------------------------------------------------
Popular circle image for bios etc.
Example: Circle image
Example: Large Chat Icon
--------------------------------------------------------- */
/**
@links
--------------------------------------------------------
base/_links.scss
--------------------------------------------------------
Links, etc. & Webkit tap highlight
Example: link
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry.
-------------------------------------------------------- */
/* @anchors
--------------------------------------------------------
Anchors will have this base styling
------------------------------------------------------ */
/* @link
--------------------------------------------------------
Alternative link class for a tags
------------------------------------------------------ */
/* @webkit-tap-highlight
--------------------------------------------------------
Declare the webkit tap highlight style
------------------------------------------------------ */
/**
@lists
--------------------------------------------------------
base/_lists.scss
--------------------------------------------------------
Structure for lists
See more layout focused list styles in layout/_ui-lists.scss
Example: Unordered List
List item here
List item here
List item here
List item here
Nested Item
Nested Item
Nested Item
Nested Item
Example: Ordered List
List item here
List item here
List item here
List item here
Nested Item
Nested Item
Nested Item
Nested Item
-------------------------------------------------------- */
/**
@quotes
--------------------------------------------------------
base/_quotes.scss
--------------------------------------------------------
Blockquotes and pull quotes
----------------------------------------------------- */
/* @blockquote
--------------------------------------------------------
Example:
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry.
The source
-------------------------------------------------------- */
/* @pull-quote
--------------------------------------------------------
Large quotes pulled from body text.
Example:
This is an awesome pull quote!
-------------------------------------------------------- */
/**
@tables
---------------------------------------------------------
base/_tables.scss
--------------------------------------------------------
Base styling for tables
--------------------------------------------------------- */
/* @table
--------------------------------------------------------
Base table styling
Example: Table
Heading
Heading
Heading
Heading
Test
Test
Test
Test
Test
Test
Test
Test
Test
Test
Test
Test
Test
Test
Test
Test
------------------------------------------------------ */
/* @table--striped
--------------------------------------------------------
Striped tables
Example: Table, striped
Heading
Heading
Heading
Heading
Test
Test
Test
Test
Test
Test
Test
Test
Test
Test
Test
Test
Test
Test
Test
Test
------------------------------------------------------ */
/**
@text
--------------------------------------------------------
base/_text.scss
--------------------------------------------------------
Some basic styles to paragraphs and
inline styles.
Base text ONLY - see ui-text in /modules for
more stylized text.
----------------------------------------------------- */
/* @paragraphs
--------------------------------------------------------
Example: Paragraphs
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry.
-------------------------------------------------------- */
/* @inline
--------------------------------------------------------
Common inline elements with class names too to avoid non-semantic markup
Example: inline elements
Lorem Ipsum is bold text of the strong printing and typesetting industry. Lorem Ipsum is italic simply dummy text emphasized of the printing and typesetting industry.
Your content goes here...
------------------------------------------------------ */
/**
* The $container__max-width var is used within the .container class and is applied to restrict the
* max-width of an element, usually a bit of content.
* Often, you will place a .container div within another
* element that has a background color. This gives you
* a u-full-bleed background, but the content is contained
* within the max-width.
*
* @example html
*
*
*
Your content goes here...
*
*
*/
/**
@flag
--------------------------------------------------------
layout/_flag.scss
--------------------------------------------------------
The flag object shares a lot of common traits with the media object; its sole purpose is displaying image- and text-like content side-by-side. Where the flag object differs, however, is its ability to vertically align the image and text to the tops, middles or bottoms of each other. Aside from the visual difference of vertical alignment, there isn’t too much difference between the two objects’ code. One thing to note is that the flag object is slightly more verbose in its implementation; the media object can have its classes applied directly to its content whereas the flag object needs its classes applied to wrappers around its content. For example, compare the following snippets for the media and flag objects respectively:
Source: http://csswizardry.com/2013/05/the-flag-object/
----------------------------------------------------- */
/* @flag objects
---------------------------------------------------------
Example: Flag Object
Example: Flag Object, top
--------------------------------------------------------- */
/**
@grids
---------------------------------------------------------
layout/_grids.scss
--------------------------------------------------------
Skyline uses a simple grid system. It starts with
a wrapper div that can have a classname of .grid
or .g for short. Inside of that div, you'll nest
your grid units. These are divs with classname of
either .grid__col or .gc for short.
To specify the responsive behavior of the grid,
add width classes from layout/_widths.scss.
Example: Grid with responsive width classes
...
...
...
...
...
...
...
...
...
...
...
...
For a grid wrap containing equally-sized grid units, like
a gallery of thumbnails for instance, use the responsive ups
classes from layout/_widths.scss. With these classes
applied to the .grid-wrap/.gw, you won't need to specify
widths on the individual grid units, just on the wrapper.
Example: Grid with responsive ups classes using short grid syntax
...
...
...
`
...
...
...
...
...
...
...
...
...
NOTE: see some test styles at the bottom of this partial
Remove them if you don't need them.
------------------------------------------------------ */
/**
@block-grids
--------------------------------------------------------
layout/_block-grids.scss
--------------------------------------------------------
UPS?
Yep, ups. These are global classes that will set
their direct children to a specific width. You will
mainly use these in grids, and maybe with tabs or
navigations.
For instance: four-up will set each child to 25%
Set the ups configuration variables below in this partial
to specify how many or how few classes you want available
in your project.
Example: Ups and grids
Ups work like widths in that they have responsive behavior. If
you prepend an up class with a responsive prefix, like (sm for small
or md for medium) the behaviour will only kick in at those
viewports.
For example, if you want your gallery to be two-up at the smallest
viewport, four-up at medium, six-up at large, and eight-up on the largest then use
this.
Example: Responsive Ups
----------------------------------------------------- */
/*
UP Widths at default Viewport
---------------------------------------------------- */
/*
Responsive UP widths at $small-mobile
---------------------------------------------------- */
/*
Responsive UP widths at $mobile
---------------------------------------------------- */
/*
Responsive UP widths at $tablet
---------------------------------------------------- */
/*
Responsive UP widths at $small-desktop
---------------------------------------------------- */
/*
Responsive UP widths at $desktop
---------------------------------------------------- */
/*
Responsive UP widths at $large-desktop
---------------------------------------------------- */
/**
@widths
---------------------------------------------------------
layout/_widths.scss
--------------------------------------------------------
Global Width Classes like .one-third or .seven-twelfths
and responsive widths like .sm-one-third or .xl-one-half
If you append the width class with a size indicator, the
size will only be applied if the viewport is at least
at that breakpoint size.
Set the widths configuration variables below in this partial
to specify how many or how few classes you want available
in your project.
Requires:
* base/_vars.scss and the breakpoint mixin from
* base/_mixin-breakpoints.scss
--------------------------------------------------------- */
/*
Responsive widths at $mobile
---------------------------------------------------- */
/*
Responsive widths at $tablet
---------------------------------------------------- */
/*
Responsive widths at $small-desktop
---------------------------------------------------- */
/*
Responsive widths at $desktop
---------------------------------------------------- */
/*
Responsive widths at $large-desktop
---------------------------------------------------- */
/**
@island
--------------------------------------------------------
modules/_island.scss
--------------------------------------------------------
A simple boxed off bleed using padding. Island uses the
$base-unit variable, while islet uses half of the same
variable. There's a u-full-bleed class available in
/_helpers.scss to counter the padding if necessary.
Usage: http://terabytenz.github.io/inuit.css-kitchensink/#island
----------------------------------------------------- */
/**
@media
--------------------------------------------------------
layout/_media.scss
--------------------------------------------------------
The 'media' object is a common pattern in OOCSS.
It consists of a wrapper element with a classname of
.media and then two child elements, one that contains
an image or video that is floated, and the other
contains text.
This used commonly in bios, or comments where you
have an avatar to one site, and the comment next to it.
Source: http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code/
----------------------------------------------------- */
/* @media objects
---------------------------------------------------------
Example: Media object, left
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Example: Media object, right
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry.
--------------------------------------------------------- */
/**
@ui-lists
--------------------------------------------------------
modules/_ui-list.scss
--------------------------------------------------------
The base ui-list layout object removes padding, margin,
and list style type and prepares it for any optional
ui-list modifier classes that can be used along side it
Example: Unordered List
Example: Ordered Counter List
List Item
List Item 2
Inline Numbered List Item
Inline Numbered List Item 2
----------------------------------------------------- */
/**
@ui-table
--------------------------------------------------------
modules/_ui-table.scss
--------------------------------------------------------
The ui-table layout object uses the many properties
and values the table element has to build layouts,
center things, and even modify actual table elements.
Use the ui-table object when you need to lay something
out in table format but semantically speaking it's not
a table
Example: Table Row on List
----------------------------------------------------- */
/**
@fixed-fluid
--------------------------------------------------------
modules/_fixed-fluid.scss
--------------------------------------------------------
Blocks contain sections of content. Blocks can have
different visual styling, but usually have the same
structure; one spacing unit margin at the bottom,
and some have borders, and padding, etc.
----------------------------------------------------- */
/**
@this-or-this
--------------------------------------------------------
modules/_this-or-this.scss
--------------------------------------------------------
This or this
https://github.com/csswizardry/inuit.css/blob/master/objects/_this-or-this.scss
------------------------------------------------------ */
/***
@modules
---------------------------------------------------------
Reusable objects that are combinations
of elements and other modules.
When you create a new module, make sure the partial is
in the modules directory, and you import it below
Comment out any partial you don't need for this app.
--------------------------------------------------------- */
/**
@site
--------------------------------------------------------
modules/_site.scss
--------------------------------------------------------
We use the naming convention of .site-* for global
modules like the header, main, and footer.
Sometimes it's beneficial to have a wrapping element
around the site, directly following the . In
this case, we call that .site.
------------------------------------------------------ */
/**
@site-header
--------------------------------------------------------
modules/_site-header.scss
--------------------------------------------------------
Site-wide header
------------------------------------------------------ */
/**
@site-main
--------------------------------------------------------
modules/_site-main.scss
--------------------------------------------------------
The site's main content
------------------------------------------------------ */
/**
@site-footer
--------------------------------------------------------
modules/_site-footer.scss
--------------------------------------------------------
The site's global footer
------------------------------------------------------ */
/**
@pages
--------------------------------------------------------
modules/_pages.scss
--------------------------------------------------------
Pages contain specific content and can have styled headers
and footers if you choose.
----------------------------------------------------- */
/**
@alerts
---------------------------------------------------------
modules/_alerts.scss
--------------------------------------------------------
Alerts are UI elements that give important info
Example: Error
×
Uh oh - something went wrong
Example: Warning
×
Shake it fast, but watch yourself.
Example: Success
×
The secret to my success is that I learn, 25 hours a day!
Example: Info
×
Did you ever know that you're my hero?
NOTE: The code below uses declared color units, if you'd
prefer, declare those as variables in _vars.scss
------------------------------------------------------ */
/* @branding
--------------------------------------------------------
The logo & (optional) wordmark
Example: Branding logo
My Company
------------------------------------------------------ */
/**/
/**
@callouts
--------------------------------------------------------
modules/_callouts.scss
--------------------------------------------------------
Callouts, are sections of featured content that usually
contain an icon, a title, and some text. These are
usually in a row, and call attention to highlighted features.
Example: Callout
Feature
This callout is very impressive, and should command your attention
----------------------------------------------------- */
/**
@dropdown
--------------------------------------------------------
modules/_dropdown.scss
--------------------------------------------------------
Dropdown that can be used in conjunction with site-footer
and site-header or as a stand alone module
------------------------------------------------------ */
/**
@heroes
--------------------------------------------------------
modules/_heroes.scss
--------------------------------------------------------
Just your everyday, normal hero. Contains a div that has
the media (video or image) in the background, and a div
for the main content.
Example: Hero
This is the leadin
Name Here
------------------------------------------------------ */
/**
@modals
---------------------------------------------------------
modules/_modals.scss
--------------------------------------------------------
These are very basic modals, which simply cover the entire
viewport from top to bottom, left to right. Feel free
to edit the styles of modals to suit your needs.
--------------------------------------------------------- */
/**
@nav
--------------------------------------------------------
modules/_nav.scss
--------------------------------------------------------
Navigations used throughout site
Includes site header & footer navigations
------------------------------------------------------ */
/**
@tabs
--------------------------------------------------------
modules/_tabs.scss
--------------------------------------------------------
Tab styled navigation.
------------------------------------------------------ */
/**
@tooltips
--------------------------------------------------------
modules/_tooltips.scss
--------------------------------------------------------
Just your everyday, normal hero. Contains a div that has
the media (video or image) in the background, and a div
for the main content.
Example: tooltip
Top Tooltip
Bottom Tooltip
Left Tooltip
Right Tooltip
------------------------------------------------------ */
/**
@post
--------------------------------------------------------
modules/_post.scss
--------------------------------------------------------
Blog Post styling - .post being the class that wraps around each article item
----------------------------------------------------- */
/* @region-flag
--------------------------------------------------------
Flags of the world. Woohoo!
Example: A flag icon
A caption title here
Some more text follows to tease the rest of
the content
----------------------------------------------------- */
/**
@video
--------------------------------------------------------
modules/_video-embeds.scss
--------------------------------------------------------
Video Embeds
----------------------------------------------------- */
/**
@badges
--------------------------------------------------------
modules/_badges.scss
--------------------------------------------------------
Badges
----------------------------------------------------- */
/**
@search
--------------------------------------------------------
modules/_search.scss
--------------------------------------------------------
Search
----------------------------------------------------- */
/**
@prices
--------------------------------------------------------
modules/_prices.scss
--------------------------------------------------------
Prices for products
------------------------------------------------------ */
/**
@product titles
--------------------------------------------------------
modules/_product-titles.scss
--------------------------------------------------------
Product's name and brand
------------------------------------------------------ */
/**
@product sections
--------------------------------------------------------
modules/_product-sections.scss
--------------------------------------------------------
Product's name and brand
------------------------------------------------------ */
/**
@product details
--------------------------------------------------------
modules/_product-details.scss
--------------------------------------------------------
Product's detail
------------------------------------------------------ */
/**
@carousel
--------------------------------------------------------
modules/_carousel.scss
--------------------------------------------------------
Styles for carousels
------------------------------------------------------ */
/**
@tags
--------------------------------------------------------
modules/_tags.scss
--------------------------------------------------------
Tag styled navigation.
------------------------------------------------------ */
/**
@slideshow
--------------------------------------------------------
modules/_slideshow.scss
--------------------------------------------------------
Styles for slideshows
------------------------------------------------------ */
/**
@helpers
---------------------------------------------------------
base/_helpers.scss
--------------------------------------------------------
This partial is for global helper classes only! Don't
tamper with units or add items that can't be used as
utilized helper classes. Helpers are abstract classes
that can be used over and over on any given HTML element.
Each class is responsible for doing one job and doing it
well. Don't use helpers as JS state classes.
--------------------------------------------------------- */
/*
@hide
---------------------------------------------------------
*/
/* @padding-helpers
--------------------------------------------------------
*/
/* @margin-helpers
--------------------------------------------------------
*/
/* @border-helpers
--------------------------------------------------------
*/
/* @bg-color
--------------------------------------------------------
*/
/* @color
--------------------------------------------------------
*/
/* @font-size-helpers
--------------------------------------------------------
*/
/* @push-pull-helpers
--------------------------------------------------------
*/
/* @float-helpers
--------------------------------------------------------
*/
/* @opacity-helpers
--------------------------------------------------------
*/
/* @clearix
--------------------------------------------------------
*/
/* @full-width
--------------------------------------------------------
*/
/* @letter-spacing
--------------------------------------------------------
*/
/* @ellipsis
--------------------------------------------------------
*/
/* @uppercase
--------------------------------------------------------
*/
/* @pointer
--------------------------------------------------------
*/
/* @inline-block
--------------------------------------------------------
*/
/* @text-center
--------------------------------------------------------
*/
/* @text-left
--------------------------------------------------------
*/
/* @text-right
--------------------------------------------------------
*/
/* @no-select
--------------------------------------------------------
*/
/* @invert
// Invert copy for readiblity on black backgrounds.
--------------------------------------------------------
*/
/***
@shame
---------------------------------------------------------
Add css here if you're unsure where it should go for now.
shame.scss is jokingly titled to make it a little
light-hearted whilst also indicating that anything in
there is a bit of a shame; a shame to have to have done,
a shame to pollute the codebase with and so on…
--------------------------------------------------------- */
/****
Shame STYLESHEET for Revolve
---------------------------------------------------------
/***
@shame
---------------------------------------------------------
Add css here if you're unsure where it should go for now.
shame.scss is jokingly titled to make it a little
light-hearted whilst also indicating that anything in
there is a bit of a shame; a shame to have to have done,
a shame to pollute the codebase with and so on…
By isolating all your hacks and bodge-jobs in their own
file you can really easily keep tabs on them; isolating
them isn’t to shame the developers, not at all, it’s
merely to make the team aware of them and make them
painfully, unmissably obvious.
1.If it’s a hack, it goes in shame.css.
2.Document all hacks fully:
-What part of the codebase does it relate to?
-Why was this needed?
-How does this fix it?
-How might you fix it properly, given more time?
3.Do not blame the developer; if they explained why they had to do it then their reasons are probably (hopefully) valid.
4.Try and clean shame.css up when you have some down time.
-Even better, get a tech-debt story in which you can dedicate actual sprint time to it.
5.Prefix all shame classes with 'shame-'
Read more: http://csswizardry.com/2013/04/shame-css/
----------------------------------------------------- */
}
.eagle *, .eagle *:before, .eagle *:after {
box-sizing: border-box;
padding: 0;
margin: 0;
}
.eagle article,
.eagle aside,
.eagle details,
.eagle figcaption,
.eagle figure,
.eagle footer,
.eagle header,
.eagle hgroup,
.eagle main,
.eagle nav,
.eagle section,
.eagle summary,
.eagle audio,
.eagle canvas,
.eagle video {
display: block;
}
.eagle .btn,
.eagle button,
.eagle [type="button"] {
border-color: #000;
background-color: #000;
color: #fff;
padding: 12px;
padding-top: 13px;
padding-left: 13px;
border-width: 2px;
font-size: 0.85714286em;
display: inline-block;
transition: all .25s ease-in-out;
border-style: solid;
letter-spacing: 2.25px;
line-height: 1;
text-align: center;
text-decoration: none;
text-transform: uppercase;
white-space: initial;
cursor: pointer;
}
.eagle .btn:hover, .eagle .btn:active, .eagle .btn:focus,
.eagle button:hover,
.eagle button:active,
.eagle button:focus,
.eagle [type="button"]:hover,
.eagle [type="button"]:active,
.eagle [type="button"]:focus {
border-color: #000;
background-color: #fff;
color: #000;
}
.eagle .btn:hover, .eagle .btn:active, .eagle .btn:focus,
.eagle button:hover,
.eagle button:active,
.eagle button:focus,
.eagle [type="button"]:hover,
.eagle [type="button"]:active,
.eagle [type="button"]:focus {
text-decoration: none;
}
.eagle .btn--light {
border-color: #000;
background-color: #fff;
color: #000;
}
.eagle .btn--light:hover, .eagle .btn--light:active, .eagle .btn--light:focus {
border-color: #000;
background-color: #000;
color: #fff;
}
.eagle .btn--ghost {
border-color: #fff;
background-color: transparent;
color: #fff;
}
.eagle .btn--ghost:hover, .eagle .btn--ghost:active, .eagle .btn--ghost:focus {
border-color: #000;
background-color: #fff;
color: #000;
}
.eagle .btn--sm {
padding: 6px;
padding-top: 7px;
padding-left: 7px;
border-width: 2px;
font-size: 0.78571429em;
}
.eagle .btn--lg {
padding: 16px;
padding-top: 17px;
padding-left: 17px;
border-width: 2px;
font-size: 0.92857143em;
}
.eagle .btn--full {
width: 100%;
}
.eagle code {
padding: 1px 5px;
background: rgba(193, 199, 208, 0.3);
cursor: pointer;
vertical-align: middle;
}
.eagle pre {
margin-top: 14px;
margin-bottom: 14px;
overflow-x: scroll;
}
.eagle input {
padding: 10px;
border: 1px solid #ccc;
border-radius: 0;
background-color: #f4f4f4;
color: #000;
font-size: 1em;
text-rendering: optimizeLegibility;
-webkit-appearance: none;
}
.eagle input:focus {
outline: none;
}
.eagle input:invalid {
border-color: #f4e8e8;
background-color: #f4e8e8;
color: #961c1c;
}
.eagle input:required {
border: 1px solid #ccc;
background-color: #f4f4f4;
color: #000;
}
.eagle input:disabled {
opacity: .5;
}
.eagle input::-webkit-input-placeholder,
.eagle textarea::-webkit-input-placeholder {
transition: opacity .25s ease-in-out;
color: #000;
font-family: "Karla", "Arial", sans-serif;
opacity: .3;
}
.eagle input:-moz-placeholder,
.eagle textarea:-moz-placeholder {
transition: opacity .25s ease-in-out;
color: #000;
font-family: "Karla", "Arial", sans-serif;
opacity: .3;
}
.eagle input::-moz-placeholder,
.eagle textarea::-moz-placeholder {
transition: opacity .25s ease-in-out;
color: #000;
font-family: "Karla", "Arial", sans-serif;
opacity: .3;
}
.eagle input:-ms-input-placeholder,
.eagle textarea:-ms-input-placeholder {
transition: opacity .25s ease-in-out;
color: #000;
font-family: "Karla", "Arial", sans-serif;
opacity: .3;
}
.eagle input:focus::-webkit-input-placeholder,
.eagle textarea:focus::-webkit-input-placeholder {
opacity: .4;
}
.eagle input:focus:-moz-placeholder,
.eagle textarea:focus:-moz-placeholder {
opacity: .4;
}
.eagle input:focus::-moz-placeholder,
.eagle textarea:focus::-moz-placeholder {
opacity: .4;
}
.eagle input:focus:-ms-input-placeholder,
.eagle textarea:focus:-ms-input-placeholder {
opacity: .4;
}
.eagle select {
width: 100%;
font-size: 1.14285714em;
text-rendering: optimizeLegibility;
}
.eagle select.select--s {
font-size: 0.71428571em;
}
.eagle select.select--l {
font-size: 1.28571429em;
}
.eagle textarea {
width: 100%;
min-height: 96px;
padding: 10px;
border: 1px solid #ccc;
border-radius: 0;
background-color: #f4f4f4;
color: #000;
font-size: 1em;
text-rendering: optimizeLegibility;
resize: none;
}
.eagle textarea:focus {
outline: none;
}
.eagle textarea.textarea--s {
font-size: 0.71428571em;
}
.eagle textarea.textarea--l {
font-size: 1.28571429em;
}
.eagle input[type=radio], .eagle input[type=checkbox],
.eagle input[type=radio].label--radio-check {
width: 20px;
height: 20px;
padding: 0;
transition: border .25s ease-in-out, background .25s ease-in-out;
border-width: 1px;
border-style: solid;
border-color: inherit;
background: #fff;
cursor: pointer;
-webkit-appearance: none;
}
.eagle input[type=radio]:checked, .eagle input[type=checkbox]:checked {
border-color: #000;
background: #000;
}
.eagle input[type=radio]:checked:after, .eagle input[type=checkbox]:checked:after {
border-color: #fff;
}
.eagle input[type=radio]:hover, .eagle input[type=checkbox]:hover, .eagle input[type=radio]:active, .eagle input[type=checkbox]:active, .eagle input[type=radio]:checked, .eagle input[type=checkbox]:checked {
border-width: 2px;
border-color: #000;
}
.eagle input[type=radio]:disabled:hover, .eagle input[type=checkbox]:disabled:hover, .eagle input[type=radio]:disabled:active, .eagle input[type=checkbox]:disabled:active, .eagle input[type=radio]:disabled:checked, .eagle input[type=checkbox]:disabled:checked {
border-color: inherit;
}
.is-error .eagle input[type=radio], .is-error .eagle input[type=checkbox] {
color: #961c1c;
}
.eagle .label--radio, .eagle .label--radio-check, .eagle .label--checkbox {
display: inline-block;
position: relative;
margin: 0;
padding-left: 25px;
border-color: #949494;
cursor: pointer;
}
.eagle .label--radio input, .eagle .label--radio-check input, .eagle .label--checkbox input {
position: absolute;
top: 2px;
left: 0;
}
.eagle input[type=radio] {
border-radius: 20px;
}
.eagle input[type=radio]:checked {
box-shadow: inset 0 0 0 4px #fff;
}
.eagle input[type=radio].label--radio-check:checked:checked {
box-shadow: none;
}
.eagle input[type=radio].label--radio-check:checked:checked:after {
border-color: #fff;
}
.eagle input[type=checkbox],
.eagle input[type=radio].label--radio-check {
border-radius: 20px;
}
.eagle input[type=checkbox]:after,
.eagle input[type=radio].label--radio-check:after {
position: absolute;
top: 40%;
left: 50%;
width: 8px;
height: 5px;
margin: auto;
-webkit-transform: translateX(-50%) translateY(-40%) rotate(-40deg);
-ms-transform: translateX(-50%) translateY(-40%) rotate(-40deg);
transform: translateX(-50%) translateY(-40%) rotate(-40deg);
border-bottom: 2px solid transparent;
border-left: 2px solid transparent;
background-color: transparent;
text-align: center;
content: '';
}
.eagle label {
display: block;
font-size: 0.78571429em;
font-weight: bold;
}
.eagle .form {
display: block;
padding: 10px;
}
.eagle .form__title {
margin: 0;
font-size: 1.07142857em;
}
.eagle fieldset {
border: 0;
}
.eagle .field {
position: relative;
margin-bottom: 14px;
}
.eagle .field.is-error {
color: #961c1c;
}
.eagle .field.is-error .field__feedback {
display: block;
}
.eagle .field.is-error .field__hint {
display: none;
}
.eagle .field.is-error input {
border: 0;
background-color: #f4e8e8;
color: #961c1c;
}
.eagle .bold--underline {
position: relative;
margin-bottom: 14px;
}
.eagle .bold--underline input {
color: #949494;
font-size: 16px;
text-align: center;
border-bottom: 2px solid #000;
border-top: none;
border-left: none;
border-right: none;
resize: none;
padding: 10px;
width: 100%;
background-color: transparent;
}
.eagle .bold--underline.is-error {
color: #961c1c;
}
.eagle .bold--underline.is-error .field__feedback {
display: block;
text-align: center;
}
.eagle .bold--underline.is-error input {
border-bottom: 2px solid #961c1c;
background-color: transparent;
color: #961c1c;
}
.eagle .field__label {
display: block;
}
.eagle .field__hint {
color: #949494;
font-size: smaller;
font-style: italic;
line-height: 1;
}
.eagle .field__feedback {
display: none;
padding-top: 5px;
color: #961c1c;
font-size: smaller;
line-height: 1;
}
.eagle .field__input-group {
display: block;
}
.eagle .field__input-group > * {
display: inline-block;
width: auto;
margin-right: 15px;
float: left;
}
.eagle .field__input-group > *:last-child {
margin-right: 0;
}
.eagle .field__input-group--list {
display: block;
}
.eagle .field__input-group--list > * {
display: block;
margin: 10px 0;
}
.eagle .field__input-group--list > *:last-child {
margin-bottom: 0;
}
.eagle h1,
.eagle .h1, .eagle h2,
.eagle .h2, .eagle h3,
.eagle .h3, .eagle h4,
.eagle .h4, .eagle h5,
.eagle .h5, .eagle h6,
.eagle .h6 {
color: #000;
letter-spacing: 1.75px;
text-transform: uppercase;
}
.eagle h1,
.eagle .h1 {
margin-top: 30px;
margin-bottom: 20px;
font-size: 2.57142857em;
line-height: 40px;
}
.eagle h2,
.eagle .h2 {
margin-top: 30px;
margin-bottom: 20px;
font-size: 2em;
line-height: 40px;
}
.eagle h3,
.eagle .h3 {
margin-top: 20px;
margin-bottom: 15px;
font-size: 1.5em;
line-height: 40px;
}
.eagle h4,
.eagle .h4 {
margin-top: 20px;
margin-bottom: 15px;
font-size: 1.14285714em;
line-height: 20px;
}
.eagle h5,
.eagle .h5 {
margin-top: 20px;
margin-bottom: 15px;
font-size: 1em;
line-height: 20px;
}
.eagle h6,
.eagle .h6 {
margin-top: 20px;
margin-bottom: 15px;
font-size: 0.85714286em;
line-height: 20px;
}
.eagle .heading:after {
display: block;
margin-left: -10px;
border-bottom: 1px solid #eaeaea;
content: '';
}
.eagle .heading--left:after {
width: 50px;
}
.eagle .heading--center {
text-align: center;
}
.eagle .heading--center:after {
width: 60px;
margin: auto;
}
.eagle hr {
display: block;
height: 1px;
margin: 8px 0;
padding: 0;
border: 0;
border-top: 1px solid #ccc;
}
.eagle img {
width: 100%;
max-width: 100%;
height: auto;
border: 0;
outline: 0;
vertical-align: middle;
}
.eagle .img--natural {
width: auto;
}
.eagle .img--title {
width: auto;
height: 16px;
vertical-align: top;
}
.eagle .img--right {
width: auto;
margin-bottom: 14px;
margin-left: 14px;
float: right;
}
.eagle .img--left {
width: auto;
margin-right: 14px;
margin-bottom: 14px;
float: left;
}
.eagle .img--center {
display: block;
width: auto;
margin-right: auto;
margin-bottom: 14px;
margin-left: auto;
}
.eagle .img--right img,
.eagle .img--left img,
.eagle .img--center img {
width: auto;
}
.eagle .img--circle {
border-radius: 50%;
}
.eagle .icon {
display: inline-block;
width: 22px;
height: 22px;
color: inherit;
vertical-align: middle;
fill: currentColor;
}
.eagle .icon > * {
display: block;
width: inherit;
height: inherit;
vertical-align: middle;
}
.eagle .icon--xs {
width: 8px;
height: 8px;
}
.eagle .icon--sm {
width: 12px;
height: 12px;
}
.eagle .icon--md {
width: 16px;
height: 16px;
}
.eagle .icon--lg {
width: 28px;
height: 28px;
}
.eagle .icon--xl {
width: 34px;
height: 34px;
}
.eagle .icon--xxl {
width: 46px;
height: 46px;
}
.eagle .icon--heart-fill--animate {
fill: #fff;
stroke: #b2b2b2;
stroke-width: 6px;
}
.eagle .icon--heart-fill--animate:hover {
stroke: #000;
}
.eagle a {
transition: color .25s ease-in-out;
color: #717171;
font-size: inherit;
text-decoration: none;
cursor: pointer;
}
.eagle a:hover, .eagle a:focus {
color: #000;
text-decoration: underline;
}
.eagle .link {
display: inline;
color: inherit;
text-decoration: underline;
cursor: pointer;
}
.eagle .link:hover, .eagle .link:focus {
text-decoration: none;
}
.eagle .link--underline {
text-decoration: underline;
}
.eagle .link--underline:hover, .eagle .link--underline:focus {
text-decoration: underline;
}
.eagle .link--noline {
text-decoration: none;
}
.eagle .link--noline:hover, .eagle .link--noline:focus {
border-color: transparent;
text-decoration: none;
}
.eagle .link--light {
color: #717171;
}
.eagle .link--light:hover, .eagle .link--light:focus {
color: #000;
}
.eagle .link--bold {
padding-bottom: 3px;
transition: border-color .25s ease-in-out;
border-bottom: 2px solid #000;
color: #000;
font-size: 1em;
line-height: 1.42857143em;
text-decoration: none;
text-transform: uppercase;
}
.eagle .link--bold:hover, .eagle .link--bold:focus {
border-color: transparent;
text-decoration: none;
}
.eagle body {
-webkit-tap-highlight-color: rba(0, 0, 0, 0.35);
}
.eagle ul,
.eagle ol {
margin-bottom: 14px;
margin-left: 14px;
padding-left: 0;
}
.eagle ul li,
.eagle ol li {
line-height: 2;
}
.eagle ul li ol,
.eagle ul li ul,
.eagle ol li ol,
.eagle ol li ul {
margin-left: 20px;
}
.eagle table {
width: 100%;
margin-top: 14px;
margin-bottom: 14px;
border: 0;
border-collapse: collapse;
}
.eagle th,
.eagle td {
padding: 0 5px;
}
.eagle th:first-child,
.eagle td:first-child {
padding-left: 0;
}
.eagle th:last-child,
.eagle td:last-child {
padding-right: 0;
}
.eagle .table--striped tbody tr:nth-of-type(odd) {
background-color: #717171;
}
.eagle p {
margin-bottom: 14px;
}
.eagle b,
.eagle strong,
.eagle .strong {
font-weight: bold;
}
.eagle i,
.eagle em,
.eagle .em {
font-style: italic;
}
.eagle small,
.eagle .small {
font-size: smaller;
}
.eagle del,
.eagle .del {
color: #717171;
text-decoration: line-through;
}
.eagle code,
.eagle .code {
padding: 1px 5px;
background: rgba(193, 199, 208, 0.3);
cursor: pointer;
vertical-align: middle;
}
.eagle pre,
.eagle .pre {
margin-top: 14px;
margin-bottom: 14px;
overflow-x: scroll;
}
.eagle .block {
margin-bottom: 14px;
}
.eagle .block--sm {
margin-bottom: 7px;
}
.eagle .block--md {
margin-bottom: 14px;
}
.eagle .block--lg {
margin-bottom: 28px;
}
.eagle .block--xl {
margin-bottom: 42px;
}
.eagle .block--ends {
margin-top: 14px;
margin-bottom: 14px;
}
.eagle .container {
width: 768px;
margin-right: auto;
margin-left: auto;
padding: 0 10px;
}
@media screen and (min-width: 48em) {
.eagle .container {
width: 100%;
max-width: 980px;
}
}
.eagle .flag {
display: table;
width: 100%;
}
.eagle .flag__image,
.eagle .flag__body {
display: table-cell;
vertical-align: middle;
}
.eagle .flag--top .flag__image,
.eagle .flag--top .flag__body {
vertical-align: top;
}
.eagle .flag--bottom .flag__image,
.eagle .flag--bottom .flag__body {
vertical-align: bottom;
}
.eagle .flag__image {
padding-right: 10px;
}
.eagle .flag__image > * {
display: block;
max-width: none;
}
.eagle .flag--rev .flag__image {
padding-right: 0;
padding-left: 10px;
}
.eagle .flag__body {
width: 100%;
}
.eagle .grid,
.eagle .g {
display: block;
margin-bottom: -16px;
list-style-type: none;
}
@media screen and (min-width: 34.375em) {
.eagle .grid,
.eagle .g {
margin: 0 0 0 -16px;
}
}
.eagle .grid--collapse,
.eagle .g--collapse {
margin-left: 0;
}
.eagle .grid--collapse .grid__col,
.eagle .grid--collapse .gc,
.eagle .g--collapse .grid__col,
.eagle .g--collapse .gc {
padding-right: 0;
padding-left: 0;
}
.eagle .grid--collapse-bottom .grid__col,
.eagle .grid--collapse-bottom .gc,
.eagle .g--collapse-bottom .grid__col,
.eagle .g--collapse-bottom .gc {
padding-bottom: 0;
}
.eagle .grid--collapse-all,
.eagle .g--collapse-all {
margin-left: 0;
}
.eagle .grid--collapse-all .grid__col,
.eagle .grid--collapse-all .gc,
.eagle .g--collapse-all .grid__col,
.eagle .g--collapse-all .gc {
padding: 0;
}
.eagle .grid__col,
.eagle .gc {
display: block;
position: relative;
width: 100%;
min-height: 1px;
padding-bottom: 16px;
}
@media screen and (min-width: 34.375em) {
.eagle .grid__col,
.eagle .gc {
padding: 0 0 16px 16px;
float: left;
}
}
.eagle .block-grid--1 > * {
width: 100%;
float: left;
}
.eagle .block-grid--1 > *:nth-of-type(1n) {
clear: none;
}
.eagle .block-grid--1 > *:nth-of-type(1n+1) {
clear: both;
}
.eagle .block-grid--1 + * {
clear: both;
}
.eagle .block-grid--2 > * {
width: 50%;
float: left;
}
.eagle .block-grid--2 > *:nth-of-type(1n) {
clear: none;
}
.eagle .block-grid--2 > *:nth-of-type(2n+1) {
clear: both;
}
.eagle .block-grid--2 + * {
clear: both;
}
.eagle .block-grid--3 > * {
width: 33.33333333%;
float: left;
}
.eagle .block-grid--3 > *:nth-of-type(1n) {
clear: none;
}
.eagle .block-grid--3 > *:nth-of-type(3n+1) {
clear: both;
}
.eagle .block-grid--3 + * {
clear: both;
}
.eagle .block-grid--4 > * {
width: 25%;
float: left;
}
.eagle .block-grid--4 > *:nth-of-type(1n) {
clear: none;
}
.eagle .block-grid--4 > *:nth-of-type(4n+1) {
clear: both;
}
.eagle .block-grid--4 + * {
clear: both;
}
.eagle .block-grid--5 > * {
width: 20%;
float: left;
}
.eagle .block-grid--5 > *:nth-of-type(1n) {
clear: none;
}
.eagle .block-grid--5 > *:nth-of-type(5n+1) {
clear: both;
}
.eagle .block-grid--5 + * {
clear: both;
}
.eagle .block-grid--6 > * {
width: 16.66666667%;
float: left;
}
.eagle .block-grid--6 > *:nth-of-type(1n) {
clear: none;
}
.eagle .block-grid--6 > *:nth-of-type(6n+1) {
clear: both;
}
.eagle .block-grid--6 + * {
clear: both;
}
.eagle .block-grid--7 > * {
width: 14.28571429%;
float: left;
}
.eagle .block-grid--7 > *:nth-of-type(1n) {
clear: none;
}
.eagle .block-grid--7 > *:nth-of-type(7n+1) {
clear: both;
}
.eagle .block-grid--7 + * {
clear: both;
}
.eagle .block-grid--8 > * {
width: 12.5%;
float: left;
}
.eagle .block-grid--8 > *:nth-of-type(1n) {
clear: none;
}
.eagle .block-grid--8 > *:nth-of-type(8n+1) {
clear: both;
}
.eagle .block-grid--8 + * {
clear: both;
}
.eagle .block-grid--9 > * {
width: 11.11111111%;
float: left;
}
.eagle .block-grid--9 > *:nth-of-type(1n) {
clear: none;
}
.eagle .block-grid--9 > *:nth-of-type(9n+1) {
clear: both;
}
.eagle .block-grid--9 + * {
clear: both;
}
.eagle .block-grid--10 > * {
width: 10%;
float: left;
}
.eagle .block-grid--10 > *:nth-of-type(1n) {
clear: none;
}
.eagle .block-grid--10 > *:nth-of-type(10n+1) {
clear: both;
}
.eagle .block-grid--10 + * {
clear: both;
}
.eagle .block-grid--11 > * {
width: 9.09090909%;
float: left;
}
.eagle .block-grid--11 > *:nth-of-type(1n) {
clear: none;
}
.eagle .block-grid--11 > *:nth-of-type(11n+1) {
clear: both;
}
.eagle .block-grid--11 + * {
clear: both;
}
.eagle .block-grid--12 > * {
width: 8.33333333%;
float: left;
}
.eagle .block-grid--12 > *:nth-of-type(1n) {
clear: none;
}
.eagle .block-grid--12 > *:nth-of-type(12n+1) {
clear: both;
}
.eagle .block-grid--12 + * {
clear: both;
}
@media screen and (min-width: 20em) {
.eagle .xs-block-grid--1 > * {
width: 100%;
float: left;
}
.eagle .xs-block-grid--1 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xs-block-grid--1 > *:nth-of-type(1n+1) {
clear: both;
}
.eagle .xs-block-grid--1 + * {
clear: both;
}
.eagle .xs-block-grid--2 > * {
width: 50%;
float: left;
}
.eagle .xs-block-grid--2 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xs-block-grid--2 > *:nth-of-type(2n+1) {
clear: both;
}
.eagle .xs-block-grid--2 + * {
clear: both;
}
.eagle .xs-block-grid--3 > * {
width: 33.33333333%;
float: left;
}
.eagle .xs-block-grid--3 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xs-block-grid--3 > *:nth-of-type(3n+1) {
clear: both;
}
.eagle .xs-block-grid--3 + * {
clear: both;
}
.eagle .xs-block-grid--4 > * {
width: 25%;
float: left;
}
.eagle .xs-block-grid--4 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xs-block-grid--4 > *:nth-of-type(4n+1) {
clear: both;
}
.eagle .xs-block-grid--4 + * {
clear: both;
}
.eagle .xs-block-grid--5 > * {
width: 20%;
float: left;
}
.eagle .xs-block-grid--5 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xs-block-grid--5 > *:nth-of-type(5n+1) {
clear: both;
}
.eagle .xs-block-grid--5 + * {
clear: both;
}
.eagle .xs-block-grid--6 > * {
width: 16.66666667%;
float: left;
}
.eagle .xs-block-grid--6 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xs-block-grid--6 > *:nth-of-type(6n+1) {
clear: both;
}
.eagle .xs-block-grid--6 + * {
clear: both;
}
.eagle .xs-block-grid--7 > * {
width: 14.28571429%;
float: left;
}
.eagle .xs-block-grid--7 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xs-block-grid--7 > *:nth-of-type(7n+1) {
clear: both;
}
.eagle .xs-block-grid--7 + * {
clear: both;
}
.eagle .xs-block-grid--8 > * {
width: 12.5%;
float: left;
}
.eagle .xs-block-grid--8 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xs-block-grid--8 > *:nth-of-type(8n+1) {
clear: both;
}
.eagle .xs-block-grid--8 + * {
clear: both;
}
.eagle .xs-block-grid--9 > * {
width: 11.11111111%;
float: left;
}
.eagle .xs-block-grid--9 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xs-block-grid--9 > *:nth-of-type(9n+1) {
clear: both;
}
.eagle .xs-block-grid--9 + * {
clear: both;
}
.eagle .xs-block-grid--10 > * {
width: 10%;
float: left;
}
.eagle .xs-block-grid--10 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xs-block-grid--10 > *:nth-of-type(10n+1) {
clear: both;
}
.eagle .xs-block-grid--10 + * {
clear: both;
}
.eagle .xs-block-grid--11 > * {
width: 9.09090909%;
float: left;
}
.eagle .xs-block-grid--11 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xs-block-grid--11 > *:nth-of-type(11n+1) {
clear: both;
}
.eagle .xs-block-grid--11 + * {
clear: both;
}
.eagle .xs-block-grid--12 > * {
width: 8.33333333%;
float: left;
}
.eagle .xs-block-grid--12 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xs-block-grid--12 > *:nth-of-type(12n+1) {
clear: both;
}
.eagle .xs-block-grid--12 + * {
clear: both;
}
}
@media screen and (min-width: 34.375em) {
.eagle .sm-block-grid--1 > * {
width: 100%;
float: left;
}
.eagle .sm-block-grid--1 > *:nth-of-type(1n) {
clear: none;
}
.eagle .sm-block-grid--1 > *:nth-of-type(1n+1) {
clear: both;
}
.eagle .sm-block-grid--1 + * {
clear: both;
}
.eagle .sm-block-grid--2 > * {
width: 50%;
float: left;
}
.eagle .sm-block-grid--2 > *:nth-of-type(1n) {
clear: none;
}
.eagle .sm-block-grid--2 > *:nth-of-type(2n+1) {
clear: both;
}
.eagle .sm-block-grid--2 + * {
clear: both;
}
.eagle .sm-block-grid--3 > * {
width: 33.33333333%;
float: left;
}
.eagle .sm-block-grid--3 > *:nth-of-type(1n) {
clear: none;
}
.eagle .sm-block-grid--3 > *:nth-of-type(3n+1) {
clear: both;
}
.eagle .sm-block-grid--3 + * {
clear: both;
}
.eagle .sm-block-grid--4 > * {
width: 25%;
float: left;
}
.eagle .sm-block-grid--4 > *:nth-of-type(1n) {
clear: none;
}
.eagle .sm-block-grid--4 > *:nth-of-type(4n+1) {
clear: both;
}
.eagle .sm-block-grid--4 + * {
clear: both;
}
.eagle .sm-block-grid--5 > * {
width: 20%;
float: left;
}
.eagle .sm-block-grid--5 > *:nth-of-type(1n) {
clear: none;
}
.eagle .sm-block-grid--5 > *:nth-of-type(5n+1) {
clear: both;
}
.eagle .sm-block-grid--5 + * {
clear: both;
}
.eagle .sm-block-grid--6 > * {
width: 16.66666667%;
float: left;
}
.eagle .sm-block-grid--6 > *:nth-of-type(1n) {
clear: none;
}
.eagle .sm-block-grid--6 > *:nth-of-type(6n+1) {
clear: both;
}
.eagle .sm-block-grid--6 + * {
clear: both;
}
.eagle .sm-block-grid--7 > * {
width: 14.28571429%;
float: left;
}
.eagle .sm-block-grid--7 > *:nth-of-type(1n) {
clear: none;
}
.eagle .sm-block-grid--7 > *:nth-of-type(7n+1) {
clear: both;
}
.eagle .sm-block-grid--7 + * {
clear: both;
}
.eagle .sm-block-grid--8 > * {
width: 12.5%;
float: left;
}
.eagle .sm-block-grid--8 > *:nth-of-type(1n) {
clear: none;
}
.eagle .sm-block-grid--8 > *:nth-of-type(8n+1) {
clear: both;
}
.eagle .sm-block-grid--8 + * {
clear: both;
}
.eagle .sm-block-grid--9 > * {
width: 11.11111111%;
float: left;
}
.eagle .sm-block-grid--9 > *:nth-of-type(1n) {
clear: none;
}
.eagle .sm-block-grid--9 > *:nth-of-type(9n+1) {
clear: both;
}
.eagle .sm-block-grid--9 + * {
clear: both;
}
.eagle .sm-block-grid--10 > * {
width: 10%;
float: left;
}
.eagle .sm-block-grid--10 > *:nth-of-type(1n) {
clear: none;
}
.eagle .sm-block-grid--10 > *:nth-of-type(10n+1) {
clear: both;
}
.eagle .sm-block-grid--10 + * {
clear: both;
}
.eagle .sm-block-grid--11 > * {
width: 9.09090909%;
float: left;
}
.eagle .sm-block-grid--11 > *:nth-of-type(1n) {
clear: none;
}
.eagle .sm-block-grid--11 > *:nth-of-type(11n+1) {
clear: both;
}
.eagle .sm-block-grid--11 + * {
clear: both;
}
.eagle .sm-block-grid--12 > * {
width: 8.33333333%;
float: left;
}
.eagle .sm-block-grid--12 > *:nth-of-type(1n) {
clear: none;
}
.eagle .sm-block-grid--12 > *:nth-of-type(12n+1) {
clear: both;
}
.eagle .sm-block-grid--12 + * {
clear: both;
}
}
@media screen and (min-width: 48em) {
.eagle .md-block-grid--1 > * {
width: 100%;
float: left;
}
.eagle .md-block-grid--1 > *:nth-of-type(1n) {
clear: none;
}
.eagle .md-block-grid--1 > *:nth-of-type(1n+1) {
clear: both;
}
.eagle .md-block-grid--1 + * {
clear: both;
}
.eagle .md-block-grid--2 > * {
width: 50%;
float: left;
}
.eagle .md-block-grid--2 > *:nth-of-type(1n) {
clear: none;
}
.eagle .md-block-grid--2 > *:nth-of-type(2n+1) {
clear: both;
}
.eagle .md-block-grid--2 + * {
clear: both;
}
.eagle .md-block-grid--3 > * {
width: 33.33333333%;
float: left;
}
.eagle .md-block-grid--3 > *:nth-of-type(1n) {
clear: none;
}
.eagle .md-block-grid--3 > *:nth-of-type(3n+1) {
clear: both;
}
.eagle .md-block-grid--3 + * {
clear: both;
}
.eagle .md-block-grid--4 > * {
width: 25%;
float: left;
}
.eagle .md-block-grid--4 > *:nth-of-type(1n) {
clear: none;
}
.eagle .md-block-grid--4 > *:nth-of-type(4n+1) {
clear: both;
}
.eagle .md-block-grid--4 + * {
clear: both;
}
.eagle .md-block-grid--5 > * {
width: 20%;
float: left;
}
.eagle .md-block-grid--5 > *:nth-of-type(1n) {
clear: none;
}
.eagle .md-block-grid--5 > *:nth-of-type(5n+1) {
clear: both;
}
.eagle .md-block-grid--5 + * {
clear: both;
}
.eagle .md-block-grid--6 > * {
width: 16.66666667%;
float: left;
}
.eagle .md-block-grid--6 > *:nth-of-type(1n) {
clear: none;
}
.eagle .md-block-grid--6 > *:nth-of-type(6n+1) {
clear: both;
}
.eagle .md-block-grid--6 + * {
clear: both;
}
.eagle .md-block-grid--7 > * {
width: 14.28571429%;
float: left;
}
.eagle .md-block-grid--7 > *:nth-of-type(1n) {
clear: none;
}
.eagle .md-block-grid--7 > *:nth-of-type(7n+1) {
clear: both;
}
.eagle .md-block-grid--7 + * {
clear: both;
}
.eagle .md-block-grid--8 > * {
width: 12.5%;
float: left;
}
.eagle .md-block-grid--8 > *:nth-of-type(1n) {
clear: none;
}
.eagle .md-block-grid--8 > *:nth-of-type(8n+1) {
clear: both;
}
.eagle .md-block-grid--8 + * {
clear: both;
}
.eagle .md-block-grid--9 > * {
width: 11.11111111%;
float: left;
}
.eagle .md-block-grid--9 > *:nth-of-type(1n) {
clear: none;
}
.eagle .md-block-grid--9 > *:nth-of-type(9n+1) {
clear: both;
}
.eagle .md-block-grid--9 + * {
clear: both;
}
.eagle .md-block-grid--10 > * {
width: 10%;
float: left;
}
.eagle .md-block-grid--10 > *:nth-of-type(1n) {
clear: none;
}
.eagle .md-block-grid--10 > *:nth-of-type(10n+1) {
clear: both;
}
.eagle .md-block-grid--10 + * {
clear: both;
}
.eagle .md-block-grid--11 > * {
width: 9.09090909%;
float: left;
}
.eagle .md-block-grid--11 > *:nth-of-type(1n) {
clear: none;
}
.eagle .md-block-grid--11 > *:nth-of-type(11n+1) {
clear: both;
}
.eagle .md-block-grid--11 + * {
clear: both;
}
.eagle .md-block-grid--12 > * {
width: 8.33333333%;
float: left;
}
.eagle .md-block-grid--12 > *:nth-of-type(1n) {
clear: none;
}
.eagle .md-block-grid--12 > *:nth-of-type(12n+1) {
clear: both;
}
.eagle .md-block-grid--12 + * {
clear: both;
}
}
@media screen and (min-width: 64em) {
.eagle .lg-block-grid--1 > * {
width: 100%;
float: left;
}
.eagle .lg-block-grid--1 > *:nth-of-type(1n) {
clear: none;
}
.eagle .lg-block-grid--1 > *:nth-of-type(1n+1) {
clear: both;
}
.eagle .lg-block-grid--1 + * {
clear: both;
}
.eagle .lg-block-grid--2 > * {
width: 50%;
float: left;
}
.eagle .lg-block-grid--2 > *:nth-of-type(1n) {
clear: none;
}
.eagle .lg-block-grid--2 > *:nth-of-type(2n+1) {
clear: both;
}
.eagle .lg-block-grid--2 + * {
clear: both;
}
.eagle .lg-block-grid--3 > * {
width: 33.33333333%;
float: left;
}
.eagle .lg-block-grid--3 > *:nth-of-type(1n) {
clear: none;
}
.eagle .lg-block-grid--3 > *:nth-of-type(3n+1) {
clear: both;
}
.eagle .lg-block-grid--3 + * {
clear: both;
}
.eagle .lg-block-grid--4 > * {
width: 25%;
float: left;
}
.eagle .lg-block-grid--4 > *:nth-of-type(1n) {
clear: none;
}
.eagle .lg-block-grid--4 > *:nth-of-type(4n+1) {
clear: both;
}
.eagle .lg-block-grid--4 + * {
clear: both;
}
.eagle .lg-block-grid--5 > * {
width: 20%;
float: left;
}
.eagle .lg-block-grid--5 > *:nth-of-type(1n) {
clear: none;
}
.eagle .lg-block-grid--5 > *:nth-of-type(5n+1) {
clear: both;
}
.eagle .lg-block-grid--5 + * {
clear: both;
}
.eagle .lg-block-grid--6 > * {
width: 16.66666667%;
float: left;
}
.eagle .lg-block-grid--6 > *:nth-of-type(1n) {
clear: none;
}
.eagle .lg-block-grid--6 > *:nth-of-type(6n+1) {
clear: both;
}
.eagle .lg-block-grid--6 + * {
clear: both;
}
.eagle .lg-block-grid--7 > * {
width: 14.28571429%;
float: left;
}
.eagle .lg-block-grid--7 > *:nth-of-type(1n) {
clear: none;
}
.eagle .lg-block-grid--7 > *:nth-of-type(7n+1) {
clear: both;
}
.eagle .lg-block-grid--7 + * {
clear: both;
}
.eagle .lg-block-grid--8 > * {
width: 12.5%;
float: left;
}
.eagle .lg-block-grid--8 > *:nth-of-type(1n) {
clear: none;
}
.eagle .lg-block-grid--8 > *:nth-of-type(8n+1) {
clear: both;
}
.eagle .lg-block-grid--8 + * {
clear: both;
}
.eagle .lg-block-grid--9 > * {
width: 11.11111111%;
float: left;
}
.eagle .lg-block-grid--9 > *:nth-of-type(1n) {
clear: none;
}
.eagle .lg-block-grid--9 > *:nth-of-type(9n+1) {
clear: both;
}
.eagle .lg-block-grid--9 + * {
clear: both;
}
.eagle .lg-block-grid--10 > * {
width: 10%;
float: left;
}
.eagle .lg-block-grid--10 > *:nth-of-type(1n) {
clear: none;
}
.eagle .lg-block-grid--10 > *:nth-of-type(10n+1) {
clear: both;
}
.eagle .lg-block-grid--10 + * {
clear: both;
}
.eagle .lg-block-grid--11 > * {
width: 9.09090909%;
float: left;
}
.eagle .lg-block-grid--11 > *:nth-of-type(1n) {
clear: none;
}
.eagle .lg-block-grid--11 > *:nth-of-type(11n+1) {
clear: both;
}
.eagle .lg-block-grid--11 + * {
clear: both;
}
.eagle .lg-block-grid--12 > * {
width: 8.33333333%;
float: left;
}
.eagle .lg-block-grid--12 > *:nth-of-type(1n) {
clear: none;
}
.eagle .lg-block-grid--12 > *:nth-of-type(12n+1) {
clear: both;
}
.eagle .lg-block-grid--12 + * {
clear: both;
}
}
@media screen and (min-width: 78.5em) {
.eagle .xl-block-grid--1 > * {
width: 100%;
float: left;
}
.eagle .xl-block-grid--1 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xl-block-grid--1 > *:nth-of-type(1n+1) {
clear: both;
}
.eagle .xl-block-grid--1 + * {
clear: both;
}
.eagle .xl-block-grid--2 > * {
width: 50%;
float: left;
}
.eagle .xl-block-grid--2 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xl-block-grid--2 > *:nth-of-type(2n+1) {
clear: both;
}
.eagle .xl-block-grid--2 + * {
clear: both;
}
.eagle .xl-block-grid--3 > * {
width: 33.33333333%;
float: left;
}
.eagle .xl-block-grid--3 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xl-block-grid--3 > *:nth-of-type(3n+1) {
clear: both;
}
.eagle .xl-block-grid--3 + * {
clear: both;
}
.eagle .xl-block-grid--4 > * {
width: 25%;
float: left;
}
.eagle .xl-block-grid--4 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xl-block-grid--4 > *:nth-of-type(4n+1) {
clear: both;
}
.eagle .xl-block-grid--4 + * {
clear: both;
}
.eagle .xl-block-grid--5 > * {
width: 20%;
float: left;
}
.eagle .xl-block-grid--5 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xl-block-grid--5 > *:nth-of-type(5n+1) {
clear: both;
}
.eagle .xl-block-grid--5 + * {
clear: both;
}
.eagle .xl-block-grid--6 > * {
width: 16.66666667%;
float: left;
}
.eagle .xl-block-grid--6 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xl-block-grid--6 > *:nth-of-type(6n+1) {
clear: both;
}
.eagle .xl-block-grid--6 + * {
clear: both;
}
.eagle .xl-block-grid--7 > * {
width: 14.28571429%;
float: left;
}
.eagle .xl-block-grid--7 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xl-block-grid--7 > *:nth-of-type(7n+1) {
clear: both;
}
.eagle .xl-block-grid--7 + * {
clear: both;
}
.eagle .xl-block-grid--8 > * {
width: 12.5%;
float: left;
}
.eagle .xl-block-grid--8 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xl-block-grid--8 > *:nth-of-type(8n+1) {
clear: both;
}
.eagle .xl-block-grid--8 + * {
clear: both;
}
.eagle .xl-block-grid--9 > * {
width: 11.11111111%;
float: left;
}
.eagle .xl-block-grid--9 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xl-block-grid--9 > *:nth-of-type(9n+1) {
clear: both;
}
.eagle .xl-block-grid--9 + * {
clear: both;
}
.eagle .xl-block-grid--10 > * {
width: 10%;
float: left;
}
.eagle .xl-block-grid--10 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xl-block-grid--10 > *:nth-of-type(10n+1) {
clear: both;
}
.eagle .xl-block-grid--10 + * {
clear: both;
}
.eagle .xl-block-grid--11 > * {
width: 9.09090909%;
float: left;
}
.eagle .xl-block-grid--11 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xl-block-grid--11 > *:nth-of-type(11n+1) {
clear: both;
}
.eagle .xl-block-grid--11 + * {
clear: both;
}
.eagle .xl-block-grid--12 > * {
width: 8.33333333%;
float: left;
}
.eagle .xl-block-grid--12 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xl-block-grid--12 > *:nth-of-type(12n+1) {
clear: both;
}
.eagle .xl-block-grid--12 + * {
clear: both;
}
}
@media screen and (min-width: 100em) {
.eagle .xxl-block-grid--1 > * {
width: 100%;
float: left;
}
.eagle .xxl-block-grid--1 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xxl-block-grid--1 > *:nth-of-type(1n+1) {
clear: both;
}
.eagle .xxl-block-grid--1 + * {
clear: both;
}
.eagle .xxl-block-grid--2 > * {
width: 50%;
float: left;
}
.eagle .xxl-block-grid--2 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xxl-block-grid--2 > *:nth-of-type(2n+1) {
clear: both;
}
.eagle .xxl-block-grid--2 + * {
clear: both;
}
.eagle .xxl-block-grid--3 > * {
width: 33.33333333%;
float: left;
}
.eagle .xxl-block-grid--3 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xxl-block-grid--3 > *:nth-of-type(3n+1) {
clear: both;
}
.eagle .xxl-block-grid--3 + * {
clear: both;
}
.eagle .xxl-block-grid--4 > * {
width: 25%;
float: left;
}
.eagle .xxl-block-grid--4 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xxl-block-grid--4 > *:nth-of-type(4n+1) {
clear: both;
}
.eagle .xxl-block-grid--4 + * {
clear: both;
}
.eagle .xxl-block-grid--5 > * {
width: 20%;
float: left;
}
.eagle .xxl-block-grid--5 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xxl-block-grid--5 > *:nth-of-type(5n+1) {
clear: both;
}
.eagle .xxl-block-grid--5 + * {
clear: both;
}
.eagle .xxl-block-grid--6 > * {
width: 16.66666667%;
float: left;
}
.eagle .xxl-block-grid--6 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xxl-block-grid--6 > *:nth-of-type(6n+1) {
clear: both;
}
.eagle .xxl-block-grid--6 + * {
clear: both;
}
.eagle .xxl-block-grid--7 > * {
width: 14.28571429%;
float: left;
}
.eagle .xxl-block-grid--7 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xxl-block-grid--7 > *:nth-of-type(7n+1) {
clear: both;
}
.eagle .xxl-block-grid--7 + * {
clear: both;
}
.eagle .xxl-block-grid--8 > * {
width: 12.5%;
float: left;
}
.eagle .xxl-block-grid--8 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xxl-block-grid--8 > *:nth-of-type(8n+1) {
clear: both;
}
.eagle .xxl-block-grid--8 + * {
clear: both;
}
.eagle .xxl-block-grid--9 > * {
width: 11.11111111%;
float: left;
}
.eagle .xxl-block-grid--9 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xxl-block-grid--9 > *:nth-of-type(9n+1) {
clear: both;
}
.eagle .xxl-block-grid--9 + * {
clear: both;
}
.eagle .xxl-block-grid--10 > * {
width: 10%;
float: left;
}
.eagle .xxl-block-grid--10 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xxl-block-grid--10 > *:nth-of-type(10n+1) {
clear: both;
}
.eagle .xxl-block-grid--10 + * {
clear: both;
}
.eagle .xxl-block-grid--11 > * {
width: 9.09090909%;
float: left;
}
.eagle .xxl-block-grid--11 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xxl-block-grid--11 > *:nth-of-type(11n+1) {
clear: both;
}
.eagle .xxl-block-grid--11 + * {
clear: both;
}
.eagle .xxl-block-grid--12 > * {
width: 8.33333333%;
float: left;
}
.eagle .xxl-block-grid--12 > *:nth-of-type(1n) {
clear: none;
}
.eagle .xxl-block-grid--12 > *:nth-of-type(12n+1) {
clear: both;
}
.eagle .xxl-block-grid--12 + * {
clear: both;
}
}
@media screen and (min-width: 34.375em) {
.eagle .sm-1-of-1 {
width: 100%;
}
.eagle .sm-1-of-2 {
width: 50%;
}
.eagle .sm-2-of-2 {
width: 100%;
}
.eagle .sm-1-of-3 {
width: 33.33333333%;
}
.eagle .sm-2-of-3 {
width: 66.66666667%;
}
.eagle .sm-3-of-3 {
width: 100%;
}
.eagle .sm-1-of-4 {
width: 25%;
}
.eagle .sm-2-of-4 {
width: 50%;
}
.eagle .sm-3-of-4 {
width: 75%;
}
.eagle .sm-4-of-4 {
width: 100%;
}
.eagle .sm-1-of-5 {
width: 20%;
}
.eagle .sm-2-of-5 {
width: 40%;
}
.eagle .sm-3-of-5 {
width: 60%;
}
.eagle .sm-4-of-5 {
width: 80%;
}
.eagle .sm-5-of-5 {
width: 100%;
}
.eagle .sm-1-of-6 {
width: 16.66666667%;
}
.eagle .sm-2-of-6 {
width: 33.33333333%;
}
.eagle .sm-3-of-6 {
width: 50%;
}
.eagle .sm-4-of-6 {
width: 66.66666667%;
}
.eagle .sm-5-of-6 {
width: 83.33333333%;
}
.eagle .sm-6-of-6 {
width: 100%;
}
.eagle .sm-1-of-7 {
width: 14.28571429%;
}
.eagle .sm-2-of-7 {
width: 28.57142857%;
}
.eagle .sm-3-of-7 {
width: 42.85714286%;
}
.eagle .sm-4-of-7 {
width: 57.14285714%;
}
.eagle .sm-5-of-7 {
width: 71.42857143%;
}
.eagle .sm-6-of-7 {
width: 85.71428571%;
}
.eagle .sm-7-of-7 {
width: 100%;
}
.eagle .sm-1-of-8 {
width: 12.5%;
}
.eagle .sm-2-of-8 {
width: 25%;
}
.eagle .sm-3-of-8 {
width: 37.5%;
}
.eagle .sm-4-of-8 {
width: 50%;
}
.eagle .sm-5-of-8 {
width: 62.5%;
}
.eagle .sm-6-of-8 {
width: 75%;
}
.eagle .sm-7-of-8 {
width: 87.5%;
}
.eagle .sm-8-of-8 {
width: 100%;
}
.eagle .sm-1-of-9 {
width: 11.11111111%;
}
.eagle .sm-2-of-9 {
width: 22.22222222%;
}
.eagle .sm-3-of-9 {
width: 33.33333333%;
}
.eagle .sm-4-of-9 {
width: 44.44444444%;
}
.eagle .sm-5-of-9 {
width: 55.55555556%;
}
.eagle .sm-6-of-9 {
width: 66.66666667%;
}
.eagle .sm-7-of-9 {
width: 77.77777778%;
}
.eagle .sm-8-of-9 {
width: 88.88888889%;
}
.eagle .sm-9-of-9 {
width: 100%;
}
.eagle .sm-1-of-10 {
width: 10%;
}
.eagle .sm-2-of-10 {
width: 20%;
}
.eagle .sm-3-of-10 {
width: 30%;
}
.eagle .sm-4-of-10 {
width: 40%;
}
.eagle .sm-5-of-10 {
width: 50%;
}
.eagle .sm-6-of-10 {
width: 60%;
}
.eagle .sm-7-of-10 {
width: 70%;
}
.eagle .sm-8-of-10 {
width: 80%;
}
.eagle .sm-9-of-10 {
width: 90%;
}
.eagle .sm-10-of-10 {
width: 100%;
}
.eagle .sm-1-of-11 {
width: 9.09090909%;
}
.eagle .sm-2-of-11 {
width: 18.18181818%;
}
.eagle .sm-3-of-11 {
width: 27.27272727%;
}
.eagle .sm-4-of-11 {
width: 36.36363636%;
}
.eagle .sm-5-of-11 {
width: 45.45454545%;
}
.eagle .sm-6-of-11 {
width: 54.54545455%;
}
.eagle .sm-7-of-11 {
width: 63.63636364%;
}
.eagle .sm-8-of-11 {
width: 72.72727273%;
}
.eagle .sm-9-of-11 {
width: 81.81818182%;
}
.eagle .sm-10-of-11 {
width: 90.90909091%;
}
.eagle .sm-11-of-11 {
width: 100%;
}
.eagle .sm-1-of-12 {
width: 8.33333333%;
}
.eagle .sm-2-of-12 {
width: 16.66666667%;
}
.eagle .sm-3-of-12 {
width: 25%;
}
.eagle .sm-4-of-12 {
width: 33.33333333%;
}
.eagle .sm-5-of-12 {
width: 41.66666667%;
}
.eagle .sm-6-of-12 {
width: 50%;
}
.eagle .sm-7-of-12 {
width: 58.33333333%;
}
.eagle .sm-8-of-12 {
width: 66.66666667%;
}
.eagle .sm-9-of-12 {
width: 75%;
}
.eagle .sm-10-of-12 {
width: 83.33333333%;
}
.eagle .sm-11-of-12 {
width: 91.66666667%;
}
.eagle .sm-12-of-12 {
width: 100%;
}
}
@media screen and (min-width: 48em) {
.eagle .md-1-of-1 {
width: 100%;
}
.eagle .md-1-of-2 {
width: 50%;
}
.eagle .md-2-of-2 {
width: 100%;
}
.eagle .md-1-of-3 {
width: 33.33333333%;
}
.eagle .md-2-of-3 {
width: 66.66666667%;
}
.eagle .md-3-of-3 {
width: 100%;
}
.eagle .md-1-of-4 {
width: 25%;
}
.eagle .md-2-of-4 {
width: 50%;
}
.eagle .md-3-of-4 {
width: 75%;
}
.eagle .md-4-of-4 {
width: 100%;
}
.eagle .md-1-of-5 {
width: 20%;
}
.eagle .md-2-of-5 {
width: 40%;
}
.eagle .md-3-of-5 {
width: 60%;
}
.eagle .md-4-of-5 {
width: 80%;
}
.eagle .md-5-of-5 {
width: 100%;
}
.eagle .md-1-of-6 {
width: 16.66666667%;
}
.eagle .md-2-of-6 {
width: 33.33333333%;
}
.eagle .md-3-of-6 {
width: 50%;
}
.eagle .md-4-of-6 {
width: 66.66666667%;
}
.eagle .md-5-of-6 {
width: 83.33333333%;
}
.eagle .md-6-of-6 {
width: 100%;
}
.eagle .md-1-of-7 {
width: 14.28571429%;
}
.eagle .md-2-of-7 {
width: 28.57142857%;
}
.eagle .md-3-of-7 {
width: 42.85714286%;
}
.eagle .md-4-of-7 {
width: 57.14285714%;
}
.eagle .md-5-of-7 {
width: 71.42857143%;
}
.eagle .md-6-of-7 {
width: 85.71428571%;
}
.eagle .md-7-of-7 {
width: 100%;
}
.eagle .md-1-of-8 {
width: 12.5%;
}
.eagle .md-2-of-8 {
width: 25%;
}
.eagle .md-3-of-8 {
width: 37.5%;
}
.eagle .md-4-of-8 {
width: 50%;
}
.eagle .md-5-of-8 {
width: 62.5%;
}
.eagle .md-6-of-8 {
width: 75%;
}
.eagle .md-7-of-8 {
width: 87.5%;
}
.eagle .md-8-of-8 {
width: 100%;
}
.eagle .md-1-of-9 {
width: 11.11111111%;
}
.eagle .md-2-of-9 {
width: 22.22222222%;
}
.eagle .md-3-of-9 {
width: 33.33333333%;
}
.eagle .md-4-of-9 {
width: 44.44444444%;
}
.eagle .md-5-of-9 {
width: 55.55555556%;
}
.eagle .md-6-of-9 {
width: 66.66666667%;
}
.eagle .md-7-of-9 {
width: 77.77777778%;
}
.eagle .md-8-of-9 {
width: 88.88888889%;
}
.eagle .md-9-of-9 {
width: 100%;
}
.eagle .md-1-of-10 {
width: 10%;
}
.eagle .md-2-of-10 {
width: 20%;
}
.eagle .md-3-of-10 {
width: 30%;
}
.eagle .md-4-of-10 {
width: 40%;
}
.eagle .md-5-of-10 {
width: 50%;
}
.eagle .md-6-of-10 {
width: 60%;
}
.eagle .md-7-of-10 {
width: 70%;
}
.eagle .md-8-of-10 {
width: 80%;
}
.eagle .md-9-of-10 {
width: 90%;
}
.eagle .md-10-of-10 {
width: 100%;
}
.eagle .md-1-of-11 {
width: 9.09090909%;
}
.eagle .md-2-of-11 {
width: 18.18181818%;
}
.eagle .md-3-of-11 {
width: 27.27272727%;
}
.eagle .md-4-of-11 {
width: 36.36363636%;
}
.eagle .md-5-of-11 {
width: 45.45454545%;
}
.eagle .md-6-of-11 {
width: 54.54545455%;
}
.eagle .md-7-of-11 {
width: 63.63636364%;
}
.eagle .md-8-of-11 {
width: 72.72727273%;
}
.eagle .md-9-of-11 {
width: 81.81818182%;
}
.eagle .md-10-of-11 {
width: 90.90909091%;
}
.eagle .md-11-of-11 {
width: 100%;
}
.eagle .md-1-of-12 {
width: 8.33333333%;
}
.eagle .md-2-of-12 {
width: 16.66666667%;
}
.eagle .md-3-of-12 {
width: 25%;
}
.eagle .md-4-of-12 {
width: 33.33333333%;
}
.eagle .md-5-of-12 {
width: 41.66666667%;
}
.eagle .md-6-of-12 {
width: 50%;
}
.eagle .md-7-of-12 {
width: 58.33333333%;
}
.eagle .md-8-of-12 {
width: 66.66666667%;
}
.eagle .md-9-of-12 {
width: 75%;
}
.eagle .md-10-of-12 {
width: 83.33333333%;
}
.eagle .md-11-of-12 {
width: 91.66666667%;
}
.eagle .md-12-of-12 {
width: 100%;
}
}
@media screen and (min-width: 64em) {
.eagle .lg-1-of-1 {
width: 100%;
}
.eagle .lg-1-of-2 {
width: 50%;
}
.eagle .lg-2-of-2 {
width: 100%;
}
.eagle .lg-1-of-3 {
width: 33.33333333%;
}
.eagle .lg-2-of-3 {
width: 66.66666667%;
}
.eagle .lg-3-of-3 {
width: 100%;
}
.eagle .lg-1-of-4 {
width: 25%;
}
.eagle .lg-2-of-4 {
width: 50%;
}
.eagle .lg-3-of-4 {
width: 75%;
}
.eagle .lg-4-of-4 {
width: 100%;
}
.eagle .lg-1-of-5 {
width: 20%;
}
.eagle .lg-2-of-5 {
width: 40%;
}
.eagle .lg-3-of-5 {
width: 60%;
}
.eagle .lg-4-of-5 {
width: 80%;
}
.eagle .lg-5-of-5 {
width: 100%;
}
.eagle .lg-1-of-6 {
width: 16.66666667%;
}
.eagle .lg-2-of-6 {
width: 33.33333333%;
}
.eagle .lg-3-of-6 {
width: 50%;
}
.eagle .lg-4-of-6 {
width: 66.66666667%;
}
.eagle .lg-5-of-6 {
width: 83.33333333%;
}
.eagle .lg-6-of-6 {
width: 100%;
}
.eagle .lg-1-of-7 {
width: 14.28571429%;
}
.eagle .lg-2-of-7 {
width: 28.57142857%;
}
.eagle .lg-3-of-7 {
width: 42.85714286%;
}
.eagle .lg-4-of-7 {
width: 57.14285714%;
}
.eagle .lg-5-of-7 {
width: 71.42857143%;
}
.eagle .lg-6-of-7 {
width: 85.71428571%;
}
.eagle .lg-7-of-7 {
width: 100%;
}
.eagle .lg-1-of-8 {
width: 12.5%;
}
.eagle .lg-2-of-8 {
width: 25%;
}
.eagle .lg-3-of-8 {
width: 37.5%;
}
.eagle .lg-4-of-8 {
width: 50%;
}
.eagle .lg-5-of-8 {
width: 62.5%;
}
.eagle .lg-6-of-8 {
width: 75%;
}
.eagle .lg-7-of-8 {
width: 87.5%;
}
.eagle .lg-8-of-8 {
width: 100%;
}
.eagle .lg-1-of-9 {
width: 11.11111111%;
}
.eagle .lg-2-of-9 {
width: 22.22222222%;
}
.eagle .lg-3-of-9 {
width: 33.33333333%;
}
.eagle .lg-4-of-9 {
width: 44.44444444%;
}
.eagle .lg-5-of-9 {
width: 55.55555556%;
}
.eagle .lg-6-of-9 {
width: 66.66666667%;
}
.eagle .lg-7-of-9 {
width: 77.77777778%;
}
.eagle .lg-8-of-9 {
width: 88.88888889%;
}
.eagle .lg-9-of-9 {
width: 100%;
}
.eagle .lg-1-of-10 {
width: 10%;
}
.eagle .lg-2-of-10 {
width: 20%;
}
.eagle .lg-3-of-10 {
width: 30%;
}
.eagle .lg-4-of-10 {
width: 40%;
}
.eagle .lg-5-of-10 {
width: 50%;
}
.eagle .lg-6-of-10 {
width: 60%;
}
.eagle .lg-7-of-10 {
width: 70%;
}
.eagle .lg-8-of-10 {
width: 80%;
}
.eagle .lg-9-of-10 {
width: 90%;
}
.eagle .lg-10-of-10 {
width: 100%;
}
.eagle .lg-1-of-11 {
width: 9.09090909%;
}
.eagle .lg-2-of-11 {
width: 18.18181818%;
}
.eagle .lg-3-of-11 {
width: 27.27272727%;
}
.eagle .lg-4-of-11 {
width: 36.36363636%;
}
.eagle .lg-5-of-11 {
width: 45.45454545%;
}
.eagle .lg-6-of-11 {
width: 54.54545455%;
}
.eagle .lg-7-of-11 {
width: 63.63636364%;
}
.eagle .lg-8-of-11 {
width: 72.72727273%;
}
.eagle .lg-9-of-11 {
width: 81.81818182%;
}
.eagle .lg-10-of-11 {
width: 90.90909091%;
}
.eagle .lg-11-of-11 {
width: 100%;
}
.eagle .lg-1-of-12 {
width: 8.33333333%;
}
.eagle .lg-2-of-12 {
width: 16.66666667%;
}
.eagle .lg-3-of-12 {
width: 25%;
}
.eagle .lg-4-of-12 {
width: 33.33333333%;
}
.eagle .lg-5-of-12 {
width: 41.66666667%;
}
.eagle .lg-6-of-12 {
width: 50%;
}
.eagle .lg-7-of-12 {
width: 58.33333333%;
}
.eagle .lg-8-of-12 {
width: 66.66666667%;
}
.eagle .lg-9-of-12 {
width: 75%;
}
.eagle .lg-10-of-12 {
width: 83.33333333%;
}
.eagle .lg-11-of-12 {
width: 91.66666667%;
}
.eagle .lg-12-of-12 {
width: 100%;
}
}
@media screen and (min-width: 78.5em) {
.eagle .xl-1-of-1 {
width: 100%;
}
.eagle .xl-1-of-2 {
width: 50%;
}
.eagle .xl-2-of-2 {
width: 100%;
}
.eagle .xl-1-of-3 {
width: 33.33333333%;
}
.eagle .xl-2-of-3 {
width: 66.66666667%;
}
.eagle .xl-3-of-3 {
width: 100%;
}
.eagle .xl-1-of-4 {
width: 25%;
}
.eagle .xl-2-of-4 {
width: 50%;
}
.eagle .xl-3-of-4 {
width: 75%;
}
.eagle .xl-4-of-4 {
width: 100%;
}
.eagle .xl-1-of-5 {
width: 20%;
}
.eagle .xl-2-of-5 {
width: 40%;
}
.eagle .xl-3-of-5 {
width: 60%;
}
.eagle .xl-4-of-5 {
width: 80%;
}
.eagle .xl-5-of-5 {
width: 100%;
}
.eagle .xl-1-of-6 {
width: 16.66666667%;
}
.eagle .xl-2-of-6 {
width: 33.33333333%;
}
.eagle .xl-3-of-6 {
width: 50%;
}
.eagle .xl-4-of-6 {
width: 66.66666667%;
}
.eagle .xl-5-of-6 {
width: 83.33333333%;
}
.eagle .xl-6-of-6 {
width: 100%;
}
.eagle .xl-1-of-7 {
width: 14.28571429%;
}
.eagle .xl-2-of-7 {
width: 28.57142857%;
}
.eagle .xl-3-of-7 {
width: 42.85714286%;
}
.eagle .xl-4-of-7 {
width: 57.14285714%;
}
.eagle .xl-5-of-7 {
width: 71.42857143%;
}
.eagle .xl-6-of-7 {
width: 85.71428571%;
}
.eagle .xl-7-of-7 {
width: 100%;
}
.eagle .xl-1-of-8 {
width: 12.5%;
}
.eagle .xl-2-of-8 {
width: 25%;
}
.eagle .xl-3-of-8 {
width: 37.5%;
}
.eagle .xl-4-of-8 {
width: 50%;
}
.eagle .xl-5-of-8 {
width: 62.5%;
}
.eagle .xl-6-of-8 {
width: 75%;
}
.eagle .xl-7-of-8 {
width: 87.5%;
}
.eagle .xl-8-of-8 {
width: 100%;
}
.eagle .xl-1-of-9 {
width: 11.11111111%;
}
.eagle .xl-2-of-9 {
width: 22.22222222%;
}
.eagle .xl-3-of-9 {
width: 33.33333333%;
}
.eagle .xl-4-of-9 {
width: 44.44444444%;
}
.eagle .xl-5-of-9 {
width: 55.55555556%;
}
.eagle .xl-6-of-9 {
width: 66.66666667%;
}
.eagle .xl-7-of-9 {
width: 77.77777778%;
}
.eagle .xl-8-of-9 {
width: 88.88888889%;
}
.eagle .xl-9-of-9 {
width: 100%;
}
.eagle .xl-1-of-10 {
width: 10%;
}
.eagle .xl-2-of-10 {
width: 20%;
}
.eagle .xl-3-of-10 {
width: 30%;
}
.eagle .xl-4-of-10 {
width: 40%;
}
.eagle .xl-5-of-10 {
width: 50%;
}
.eagle .xl-6-of-10 {
width: 60%;
}
.eagle .xl-7-of-10 {
width: 70%;
}
.eagle .xl-8-of-10 {
width: 80%;
}
.eagle .xl-9-of-10 {
width: 90%;
}
.eagle .xl-10-of-10 {
width: 100%;
}
.eagle .xl-1-of-11 {
width: 9.09090909%;
}
.eagle .xl-2-of-11 {
width: 18.18181818%;
}
.eagle .xl-3-of-11 {
width: 27.27272727%;
}
.eagle .xl-4-of-11 {
width: 36.36363636%;
}
.eagle .xl-5-of-11 {
width: 45.45454545%;
}
.eagle .xl-6-of-11 {
width: 54.54545455%;
}
.eagle .xl-7-of-11 {
width: 63.63636364%;
}
.eagle .xl-8-of-11 {
width: 72.72727273%;
}
.eagle .xl-9-of-11 {
width: 81.81818182%;
}
.eagle .xl-10-of-11 {
width: 90.90909091%;
}
.eagle .xl-11-of-11 {
width: 100%;
}
.eagle .xl-1-of-12 {
width: 8.33333333%;
}
.eagle .xl-2-of-12 {
width: 16.66666667%;
}
.eagle .xl-3-of-12 {
width: 25%;
}
.eagle .xl-4-of-12 {
width: 33.33333333%;
}
.eagle .xl-5-of-12 {
width: 41.66666667%;
}
.eagle .xl-6-of-12 {
width: 50%;
}
.eagle .xl-7-of-12 {
width: 58.33333333%;
}
.eagle .xl-8-of-12 {
width: 66.66666667%;
}
.eagle .xl-9-of-12 {
width: 75%;
}
.eagle .xl-10-of-12 {
width: 83.33333333%;
}
.eagle .xl-11-of-12 {
width: 91.66666667%;
}
.eagle .xl-12-of-12 {
width: 100%;
}
}
@media screen and (min-width: 100em) {
.eagle .xxl-1-of-1 {
width: 100%;
}
.eagle .xxl-1-of-2 {
width: 50%;
}
.eagle .xxl-2-of-2 {
width: 100%;
}
.eagle .xxl-1-of-3 {
width: 33.33333333%;
}
.eagle .xxl-2-of-3 {
width: 66.66666667%;
}
.eagle .xxl-3-of-3 {
width: 100%;
}
.eagle .xxl-1-of-4 {
width: 25%;
}
.eagle .xxl-2-of-4 {
width: 50%;
}
.eagle .xxl-3-of-4 {
width: 75%;
}
.eagle .xxl-4-of-4 {
width: 100%;
}
.eagle .xxl-1-of-5 {
width: 20%;
}
.eagle .xxl-2-of-5 {
width: 40%;
}
.eagle .xxl-3-of-5 {
width: 60%;
}
.eagle .xxl-4-of-5 {
width: 80%;
}
.eagle .xxl-5-of-5 {
width: 100%;
}
.eagle .xxl-1-of-6 {
width: 16.66666667%;
}
.eagle .xxl-2-of-6 {
width: 33.33333333%;
}
.eagle .xxl-3-of-6 {
width: 50%;
}
.eagle .xxl-4-of-6 {
width: 66.66666667%;
}
.eagle .xxl-5-of-6 {
width: 83.33333333%;
}
.eagle .xxl-6-of-6 {
width: 100%;
}
.eagle .xxl-1-of-7 {
width: 14.28571429%;
}
.eagle .xxl-2-of-7 {
width: 28.57142857%;
}
.eagle .xxl-3-of-7 {
width: 42.85714286%;
}
.eagle .xxl-4-of-7 {
width: 57.14285714%;
}
.eagle .xxl-5-of-7 {
width: 71.42857143%;
}
.eagle .xxl-6-of-7 {
width: 85.71428571%;
}
.eagle .xxl-7-of-7 {
width: 100%;
}
.eagle .xxl-1-of-8 {
width: 12.5%;
}
.eagle .xxl-2-of-8 {
width: 25%;
}
.eagle .xxl-3-of-8 {
width: 37.5%;
}
.eagle .xxl-4-of-8 {
width: 50%;
}
.eagle .xxl-5-of-8 {
width: 62.5%;
}
.eagle .xxl-6-of-8 {
width: 75%;
}
.eagle .xxl-7-of-8 {
width: 87.5%;
}
.eagle .xxl-8-of-8 {
width: 100%;
}
.eagle .xxl-1-of-9 {
width: 11.11111111%;
}
.eagle .xxl-2-of-9 {
width: 22.22222222%;
}
.eagle .xxl-3-of-9 {
width: 33.33333333%;
}
.eagle .xxl-4-of-9 {
width: 44.44444444%;
}
.eagle .xxl-5-of-9 {
width: 55.55555556%;
}
.eagle .xxl-6-of-9 {
width: 66.66666667%;
}
.eagle .xxl-7-of-9 {
width: 77.77777778%;
}
.eagle .xxl-8-of-9 {
width: 88.88888889%;
}
.eagle .xxl-9-of-9 {
width: 100%;
}
.eagle .xxl-1-of-10 {
width: 10%;
}
.eagle .xxl-2-of-10 {
width: 20%;
}
.eagle .xxl-3-of-10 {
width: 30%;
}
.eagle .xxl-4-of-10 {
width: 40%;
}
.eagle .xxl-5-of-10 {
width: 50%;
}
.eagle .xxl-6-of-10 {
width: 60%;
}
.eagle .xxl-7-of-10 {
width: 70%;
}
.eagle .xxl-8-of-10 {
width: 80%;
}
.eagle .xxl-9-of-10 {
width: 90%;
}
.eagle .xxl-10-of-10 {
width: 100%;
}
.eagle .xxl-1-of-11 {
width: 9.09090909%;
}
.eagle .xxl-2-of-11 {
width: 18.18181818%;
}
.eagle .xxl-3-of-11 {
width: 27.27272727%;
}
.eagle .xxl-4-of-11 {
width: 36.36363636%;
}
.eagle .xxl-5-of-11 {
width: 45.45454545%;
}
.eagle .xxl-6-of-11 {
width: 54.54545455%;
}
.eagle .xxl-7-of-11 {
width: 63.63636364%;
}
.eagle .xxl-8-of-11 {
width: 72.72727273%;
}
.eagle .xxl-9-of-11 {
width: 81.81818182%;
}
.eagle .xxl-10-of-11 {
width: 90.90909091%;
}
.eagle .xxl-11-of-11 {
width: 100%;
}
.eagle .xxl-1-of-12 {
width: 8.33333333%;
}
.eagle .xxl-2-of-12 {
width: 16.66666667%;
}
.eagle .xxl-3-of-12 {
width: 25%;
}
.eagle .xxl-4-of-12 {
width: 33.33333333%;
}
.eagle .xxl-5-of-12 {
width: 41.66666667%;
}
.eagle .xxl-6-of-12 {
width: 50%;
}
.eagle .xxl-7-of-12 {
width: 58.33333333%;
}
.eagle .xxl-8-of-12 {
width: 66.66666667%;
}
.eagle .xxl-9-of-12 {
width: 75%;
}
.eagle .xxl-10-of-12 {
width: 83.33333333%;
}
.eagle .xxl-11-of-12 {
width: 91.66666667%;
}
.eagle .xxl-12-of-12 {
width: 100%;
}
}
.eagle .island {
padding: 16px;
}
.eagle .islet {
padding: 8px;
}
.eagle .media {
display: block;
margin-bottom: 16px;
}
.eagle .media__left {
margin-right: 16px;
float: left;
}
.eagle .media__right {
margin-left: 16px;
float: right;
}
.eagle .media__left img,
.eagle .media__right img {
display: block;
}
.eagle .media__body {
overflow: hidden;
}
.eagle .media__body,
.eagle .media__body > :last-child {
margin-bottom: 0;
}
.eagle .media__heading {
margin-top: 0;
}
.eagle .ui-list {
margin: 0;
padding: 0;
list-style-type: none;
list-style-position: inside;
}
.eagle .ui-list__item {
line-height: inherit;
}
.eagle .ui-list__num {
list-style-type: none;
counter-increment: step-counter;
}
.eagle .ui-list__num:before {
padding-right: 5px;
content: counter(step-counter) ")";
}
.eagle .ui-list--inline > * {
display: inline-block;
}
.eagle .ui-list--inline-block {
display: inline-block;
vertical-align: top;
}
.eagle .table {
display: table;
width: 100%;
white-space: nowrap;
}
.eagle .table--fixed {
table-layout: fixed;
}
.eagle .table__cell {
display: table-cell;
vertical-align: center;
}
.eagle .fixed-fluid__fixed {
float: left;
}
.eagle .fixed-fluid__fluid {
display: block;
overflow: hidden;
}
.eagle .this-or-this {
display: table;
width: 100%;
text-align: center;
}
.eagle .this-or-this__this,
.eagle .this-or-this__or {
display: table-cell;
vertical-align: middle;
}
.eagle .this-or-this__or {
padding-right: 10px;
padding-left: 10px;
}
.eagle .site {
width: 768px;
}
@media screen and (min-width: 48em) {
.eagle .site {
width: 100%;
}
}
.eagle .site-header {
position: relative;
top: 0;
width: 100%;
background-color: #fff;
z-index: 15;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.eagle .site-header.is-fixed {
height: 87px;
}
.eagle .site-header.is-fixed > .site-header__content {
position: fixed;
top: 0;
width: 100%;
background-color: #fff;
z-index: 15;
}
.eagle .site-header__content {
padding-top: 10px;
}
.eagle .site-header__block {
zoom: 1;
}
.eagle .site-header__block:before, .eagle .site-header__block:after {
content: " ";
display: table;
}
.eagle .site-header__block:after {
clear: both;
}
.eagle .site-header__block.is-hidden {
position: absolute;
left: -9999%;
height: 0;
margin: 0;
padding: 0;
opacity: 0;
}
.eagle .site-header__block.is-aligned {
float: left;
}
.eagle .site-header__bullet {
width: 5px;
height: 5px;
margin: 0px 14px;
}
.eagle .site-main {
display: block;
}
.eagle .site-footer {
padding: 10px 0px;
}
.eagle .site-footer__social-icon {
margin-right: 20px;
}
.eagle .site-footer__copyright {
font-size: 0.78571429em;
text-align: right;
}
.eagle .alert {
position: relative;
margin-bottom: 14px;
padding: 5px 15px;
border-width: 1px;
border-style: solid;
line-height: 1.42857143em;
}
.eagle .alert__msg {
margin: 0;
}
.eagle .alert__close {
position: absolute;
top: 15px;
right: 15px;
width: 20px;
height: 20px;
transition: all .3s;
background-color: #fff;
text-align: center;
text-decoration: none;
opacity: .5;
}
.eagle .alert__close:hover {
opacity: 1;
}
.alert--error .eagle .alert__close {
color: #961c1c;
}
.eagle .alert__close .alert--warning {
color: #f1c40f;
}
.eagle .alert__close .alert--info {
color: #2980b9;
}
.eagle .alert__close .alert--success {
color: #27ae60;
}
.eagle .alert--error {
border-color: #961c1c;
background: #f4f4f4;
color: #961c1c;
}
.eagle .alert--error:after {
border-color: #961c1c;
}
.eagle .alert--warning {
border-color: #f1c40f;
background: #f4f4f4;
color: #f1c40f;
}
.eagle .alert--warning:after {
border-color: #f1c40f;
}
.eagle .alert--info {
border-color: #2980b9;
background: #f4f4f4;
color: #2980b9;
}
.eagle .alert--info:after {
border-color: #2980b9;
}
.eagle .alert--success {
border-color: #27ae60;
background: #f4f4f4;
color: #27ae60;
}
.eagle .alert--success:after {
border-color: #27ae60;
}
.eagle .branding {
display: block;
width: auto;
height: auto;
margin: 0;
padding-right: 20px;
float: left;
text-align: left;
text-decoration: none;
}
.eagle .branding__logo {
width: 224px;
height: 34px;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
transition: width .15s ease, height .15s ease;
vertical-align: top;
}
.eagle .is-fixed .branding__logo {
width: 124px;
height: 19px;
}
.eagle .branding__wordmark {
margin: 0;
padding-top: 10px;
font-size: 2.35714286em;
text-transform: uppercase;
white-space: nowrap;
}
.eagle .callout {
text-align: center;
}
.eagle .callout__media {
display: block;
width: auto;
max-height: 32px;
margin: 0 auto 10px;
}
.eagle .callout__title {
font-size: 1.42857143em;
}
.eagle .dropdown:hover > .dropdown__menu, .eagle .dropdown:active > .dropdown__menu, .eagle .dropdown.is-open > .dropdown__menu {
opacity: 1;
visibility: visible;
}
.eagle .dropdown {
position: relative;
cursor: pointer;
}
.eagle .dropdown:hover > .dropdown__menu, .eagle .dropdown:active > .dropdown__menu {
will-change: opacity;
}
.eagle .dropdown.is-open > .dropdown__menu {
z-index: 20;
}
.eagle .dropdown.is-disabled:hover > .dropdown__menu {
opacity: 0;
visibility: hidden;
}
.eagle .dropdown__menu {
display: block;
position: absolute;
transition: visibility 0s linear .1s, opacity .20s ease-in-out .1s;
border: 1px solid #f4f4f4;
background: #fff;
white-space: nowrap;
cursor: auto;
opacity: 0;
visibility: hidden;
z-index: 10;
}
.eagle .dropdown__list {
margin-bottom: 0;
margin-left: 44px;
float: left;
list-style: none;
}
.eagle .dropdown__icon {
width: 8px;
height: 8px;
margin-left: 2px;
vertical-align: inherit;
}
.eagle .dropdown__thumb {
width: 105px;
float: left;
}
@media screen and (min-width: 64em) {
.eagle .dropdown__thumb {
width: 205px;
}
}
.eagle .dropdown__badge-item--last {
width: 60px;
padding-top: 10px;
}
.eagle .dropdown--center > .dropdown__menu {
right: auto;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
.eagle .dropdown--right > .dropdown__menu {
right: auto;
left: 100%;
-webkit-transform: translateX(-100%);
-ms-transform: translateX(-100%);
transform: translateX(-100%);
}
.eagle .dropdown--full {
position: static;
}
.eagle .dropdown--full > .dropdown__menu {
right: 0;
left: 0;
width: 100%;
border: 0;
border-bottom: 1px solid #f4f4f4;
}
.eagle .dropdown--md > .dropdown__menu {
width: 270px;
white-space: normal;
}
.eagle .dropdown--section-title {
margin-top: 15px;
font-size: 0.85714286em;
letter-spacing: 2.25px;
line-height: 1em;
text-transform: uppercase;
}
@media screen and (min-width: 64em) {
.eagle .dropdown--lg-center > .dropdown__menu {
right: auto;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
.eagle .lg-dropdown--right > .dropdown__menu {
right: auto;
left: 100%;
-webkit-transform: translateX(-100%);
-ms-transform: translateX(-100%);
transform: translateX(-100%);
}
}
.eagle .hero {
position: relative;
margin-bottom: 30px;
overflow: hidden;
}
.eagle .hero__media {
position: relative;
z-index: 200;
}
.eagle .hero__main {
position: absolute;
top: 50%;
width: 100%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
color: #fff;
font-size: 1em;
text-align: center;
z-index: 210;
}
.eagle .modal {
display: none;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
height: 100%;
border: 0;
background: rgba(255, 255, 255, 0.96);
z-index: 20;
}
.eagle .modal--in-content {
position: absolute;
z-index: 14;
}
.eagle .modal__container {
display: table;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
height: 100%;
padding: 10px;
}
.eagle .modal__body {
display: table-cell;
width: 100%;
height: 100%;
vertical-align: middle;
}
.eagle .modal__close {
display: block;
position: absolute;
top: 0;
right: 0;
margin: 20px 20px 0 0;
padding: 20px;
border: 0;
background: #000;
cursor: pointer;
z-index: 3;
}
.eagle .modal__close-icon {
width: 8px;
height: 8px;
}
.eagle .modal__close-svg {
fill: #fff;
}
.eagle .modal__close:hover, .eagle .modal__close:focus {
border: 0;
outline: none;
opacity: .85;
}
.eagle .modal__close:active {
opacity: .6;
}
.eagle .modal__block {
position: absolute;
top: 40%;
left: 50%;
width: 80%;
margin: auto;
padding: 40px;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
border: 1px solid #eaeaea;
background: rgba(248, 248, 248, 0.8);
-o-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
}
.eagle .modal__block-col {
padding: 2px 10px;
color: #717171;
font-size: 0.85714286em;
line-height: normal;
}
.eagle .modal__subtitle {
font-size: 1.14285714em;
}
.eagle .nav {
background: #000;
/* ---------------------- */
/* OVERRIDE OLD FRAMEWORK */
/* ---------------------- */
/* This override shows up on the main navigation
code below should be deleted once possible */
/* Main Navigation - Justifed */
/* Main Navigation - Justifed END */
}
.eagle .nav li li {
display: block;
}
.eagle .nav__item {
display: inline-block;
padding: 0 4.6% 0 0;
list-style: none;
zoom: 1;
}
.eagle .nav__item:hover .nav__child {
display: block;
left: 0;
transition: visibility 0s linear .1s, opacity .20s ease-in .1s;
opacity: 1;
}
.eagle .nav__item:hover .nav__link {
border-bottom: 2px solid #f4f4f4;
}
.eagle .nav__link {
position: relative;
padding-top: 14px;
padding-bottom: 3px;
color: #fff;
font-size: 0.85714286em;
letter-spacing: 0.14285714em;
text-transform: uppercase;
white-space: nowrap;
}
.eagle .nav__link--active, .eagle .nav__link:hover, .eagle .nav__link:active, .eagle .nav__link:focus {
transition: all .125s ease-in-out;
border-bottom: 2px solid #f4f4f4;
color: #fff;
text-decoration: none;
}
.eagle .nav__link:before, .eagle .nav__link:after {
display: block;
position: absolute;
top: 0;
width: 25px;
height: 44px;
content: '';
}
.eagle .nav__link:before {
left: -25px;
}
.eagle .nav__link:after {
right: -25px;
}
.eagle .nav__link--last:after {
display: none;
}
.eagle .nav__link .icon--star-whole {
position: absolute;
top: 11px;
right: -16px;
width: 14px;
height: 14px;
color: #bab274;
}
.eagle .nav__child-inner {
width: 980px;
margin: 0 auto;
}
.eagle .nav--justified {
text-align: justify;
}
.eagle .nav--justified .nav__item {
padding: 0;
}
.eagle .nav--justified .nav__wrapper:after {
display: inline-block;
width: 100%;
content: '';
}
.eagle .nav--md-height {
height: 44px;
}
.eagle .nav--md-height .nav__item {
height: 44px;
}
.eagle .nav--md-height .nav__link {
line-height: 43px;
}
.eagle .nav__item {
display: inline-block;
padding: 0 8px;
}
.eagle .nav__item:first-of-type {
padding-left: 0;
}
.eagle .nav__item:last-of-type {
padding-right: 0;
}
.eagle .js-tabs__content {
display: none;
}
.eagle .js-tabs__content-active {
display: block;
}
.eagle .tooltip,
.eagle [role="tooltip"] {
display: inline-block;
position: relative;
outline: none;
}
.eagle .tooltip:after, .eagle .tooltip:before,
.eagle [role="tooltip"]:after,
.eagle [role="tooltip"]:before {
position: absolute;
transition: opacity .3s linear 0s;
outline: none;
font-size: 12px;
text-decoration: none;
opacity: 0;
visibility: hidden;
}
.eagle .tooltip:after,
.eagle [role="tooltip"]:after {
width: 215px;
padding: 6px 15px;
background-color: #f4f4f4;
color: #000;
white-space: normal;
content: attr(data-tooltip);
}
.eagle .tooltip .tooltip__circle,
.eagle [role="tooltip"] .tooltip__circle {
display: block;
width: 20px;
height: 20px;
padding: 0 5px;
border: 1px solid #000;
border-radius: 50%;
}
.eagle .tooltip[data-trigger="hover"]:hover:before, .eagle .tooltip[data-trigger="hover"]:hover:after, .eagle .tooltip[data-trigger="focus"]:focus:before, .eagle .tooltip[data-trigger="focus"]:focus:after,
.eagle [role="tooltip"][data-trigger="hover"]:hover:before,
.eagle [role="tooltip"][data-trigger="hover"]:hover:after,
.eagle [role="tooltip"][data-trigger="focus"]:focus:before,
.eagle [role="tooltip"][data-trigger="focus"]:focus:after {
transition: opacity .3s linear 0s;
opacity: 1;
visibility: visible;
z-index: 2;
}
.eagle .tooltip[data-placement="top"]:after, .eagle .tooltip[data-placement="top"]:before,
.eagle [role="tooltip"][data-placement="top"]:after,
.eagle [role="tooltip"][data-placement="top"]:before {
right: 50%;
bottom: 100%;
}
.eagle .tooltip[data-placement="top"]:after,
.eagle [role="tooltip"][data-placement="top"]:after {
margin: 0 0 14px;
-webkit-transform: translate(50%);
-ms-transform: translate(50%);
transform: translate(50%);
border-radius: 0px;
}
.eagle .tooltip[data-placement="top"]:before,
.eagle [role="tooltip"][data-placement="top"]:before {
margin: 0 0 7px;
-webkit-transform: translate(50%);
-ms-transform: translate(50%);
transform: translate(50%);
border-top: 8px solid #f4f4f4;
border-right: 8px solid transparent;
border-left: 8px solid transparent;
content: '';
}
.eagle .tooltip[data-placement="top left"]:after, .eagle .tooltip[data-placement="top left"]:before,
.eagle [role="tooltip"][data-placement="top left"]:after,
.eagle [role="tooltip"][data-placement="top left"]:before {
right: 50%;
bottom: 100%;
}
.eagle .tooltip[data-placement="top left"]:after,
.eagle [role="tooltip"][data-placement="top left"]:after {
margin: 0 80px 14px;
-webkit-transform: translate(50%);
-ms-transform: translate(50%);
transform: translate(50%);
border-radius: 0px;
}
.eagle .tooltip[data-placement="top left"]:before,
.eagle [role="tooltip"][data-placement="top left"]:before {
margin: 0 0 7px;
-webkit-transform: translate(50%);
-ms-transform: translate(50%);
transform: translate(50%);
border-top: 8px solid #f4f4f4;
border-right: 8px solid transparent;
border-left: 8px solid transparent;
content: '';
}
.eagle .tooltip[data-placement="bottom"]:after, .eagle .tooltip[data-placement="bottom"]:before,
.eagle [role="tooltip"][data-placement="bottom"]:after,
.eagle [role="tooltip"][data-placement="bottom"]:before {
top: 100%;
right: 50%;
}
.eagle .tooltip[data-placement="bottom"]:after,
.eagle [role="tooltip"][data-placement="bottom"]:after {
margin: 10px 0 0;
-webkit-transform: translate(50%);
-ms-transform: translate(50%);
transform: translate(50%);
border-radius: 0px;
}
.eagle .tooltip[data-placement="bottom"]:before,
.eagle [role="tooltip"][data-placement="bottom"]:before {
margin: 2px 0 0;
-webkit-transform: translate(50%);
-ms-transform: translate(50%);
transform: translate(50%);
border-right: 8px solid transparent;
border-bottom: 8px solid #f4f4f4;
border-left: 8px solid transparent;
content: '';
}
.eagle .tooltip[data-placement="right"]:after, .eagle .tooltip[data-placement="right"]:before,
.eagle [role="tooltip"][data-placement="right"]:after,
.eagle [role="tooltip"][data-placement="right"]:before {
right: 50%;
bottom: 50%;
}
.eagle .tooltip[data-placement="right"]:after,
.eagle [role="tooltip"][data-placement="right"]:after {
margin-right: -127px;
margin-bottom: -35px;
-webkit-transform: translate(50%);
-ms-transform: translate(50%);
transform: translate(50%);
border-radius: 0px;
}
.eagle .tooltip[data-placement="right"]:before,
.eagle [role="tooltip"][data-placement="right"]:before {
top: 5px;
margin-right: -16px;
margin-bottom: 5px;
-webkit-transform: translate(50%);
-ms-transform: translate(50%);
transform: translate(50%);
border-top: 8px solid transparent;
border-right: 8px solid #f4f4f4;
border-bottom: 8px solid transparent;
content: '';
}
.eagle .tooltip[data-placement="left"]:after, .eagle .tooltip[data-placement="left"]:before,
.eagle [role="tooltip"][data-placement="left"]:after,
.eagle [role="tooltip"][data-placement="left"]:before {
right: 100%;
bottom: 50%;
left: auto;
}
.eagle .tooltip[data-placement="left"]:after,
.eagle [role="tooltip"][data-placement="left"]:after {
margin-right: 117px;
margin-bottom: -35px;
-webkit-transform: translate(50%);
-ms-transform: translate(50%);
transform: translate(50%);
border-radius: 0px;
}
.eagle .tooltip[data-placement="left"]:before,
.eagle [role="tooltip"][data-placement="left"]:before {
top: 5px;
margin-right: 6px;
margin-bottom: 5px;
-webkit-transform: translate(50%);
-ms-transform: translate(50%);
transform: translate(50%);
border-top: 8px solid transparent;
border-bottom: 8px solid transparent;
border-left: 8px solid #f4f4f4;
content: '';
}
.eagle .region-flag {
display: inline-block;
width: 22px;
height: 15px;
background: url("../../../../i/currency_sprite.png") no-repeat;
text-indent: -9999em;
vertical-align: middle;
}
.eagle .region-flag.ars {
background-position: -3px -4px;
}
.eagle .region-flag.aud {
background-position: -3px -28px;
}
.eagle .region-flag.bsd {
background-position: -3px -51px;
}
.eagle .region-flag.brl {
background-position: -3px -76px;
}
.eagle .region-flag.cad {
background-position: -3px -100px;
}
.eagle .region-flag.xaf {
background-position: -3px -124px;
}
.eagle .region-flag.xbf {
background-position: -3px -147px;
}
.eagle .region-flag.clp {
background-position: -3px -171px;
}
.eagle .region-flag.cny {
background-position: -3px -194px;
}
.eagle .region-flag.cop {
background-position: -3px -220px;
}
.eagle .region-flag.krk {
background-position: -3px -243px;
}
.eagle .region-flag.czr {
background-position: -3px -267px;
}
.eagle .region-flag.dkk {
background-position: -3px -291px;
}
.eagle .region-flag.xcd {
background-position: -3px -315px;
}
.eagle .region-flag.eur {
background-position: -3px -339px;
}
.eagle .region-flag.fjd {
background-position: -3px -363px;
}
.eagle .region-flag.ghc {
background-position: -3px -387px;
}
.eagle .region-flag.gtq {
background-position: -3px -412px;
}
.eagle .region-flag.hnl {
background-position: -3px -435px;
}
.eagle .region-flag.hkd {
background-position: -3px -459px;
}
.eagle .region-flag.huf {
background-position: -28px -4px;
}
.eagle .region-flag.isk {
background-position: -28px -28px;
}
.eagle .region-flag.inr {
background-position: -28px -51px;
}
.eagle .region-flag.idr {
background-position: -28px -76px;
}
.eagle .region-flag.ils {
background-position: -28px -100px;
}
.eagle .region-flag.jmd {
background-position: -28px -124px;
}
.eagle .region-flag.jpy {
background-position: -28px -147px;
}
.eagle .region-flag.krw {
background-position: -28px -171px;
}
.eagle .region-flag.chf {
background-position: -28px -194px;
}
.eagle .region-flag.myr {
background-position: -28px -243px;
}
.eagle .region-flag.mxn {
background-position: -28px -267px;
}
.eagle .region-flag.mad {
background-position: -28px -243px;
}
.eagle .region-flag.mmk {
background-position: -28px -291px;
}
.eagle .region-flag.ang {
background-position: -28px -315px;
}
.eagle .region-flag.nzd {
background-position: -28px -339px;
}
.eagle .region-flag.nok {
background-position: -28px -363px;
}
.eagle .region-flag.pkr {
background-position: -28px -387px;
}
.eagle .region-flag.pab {
background-position: -28px -412px;
}
.eagle .region-flag.pen {
background-position: -28px -435px;
}
.eagle .region-flag.php {
background-position: -28px -459px;
}
.eagle .region-flag.pln {
background-position: -53px -4px;
}
.eagle .region-flag.ron {
background-position: -53px -28px;
}
.eagle .region-flag.rub {
background-position: -53px -51px;
}
.eagle .region-flag.rsd {
background-position: -53px -76px;
}
.eagle .region-flag.sgd {
background-position: -53px -100px;
}
.eagle .region-flag.zar {
background-position: -53px -124px;
}
.eagle .region-flag.lkr {
background-position: -53px -147px;
}
.eagle .region-flag.sek {
background-position: -53px -171px;
}
.eagle .region-flag.twd {
background-position: -53px -194px;
}
.eagle .region-flag.thb {
background-position: -53px -220px;
}
.eagle .region-flag.ttd {
background-position: -53px -243px;
}
.eagle .region-flag.tnd {
background-position: -53px -267px;
}
.eagle .region-flag.trl {
background-position: -53px -291px;
}
.eagle .region-flag.aed {
background-position: -53px -315px;
}
.eagle .region-flag.gbp {
background-position: -53px -339px;
}
.eagle .region-flag.usd {
background-position: -53px -363px;
}
.eagle .region-flag.vef {
background-position: -53px -387px;
}
.eagle .region-flag.vnd {
background-position: -53px -412px;
}
.eagle .region-flag.fra {
background-position: -55px -436px;
}
.eagle .region-flag.esp {
background-position: -55px -460px;
}
.eagle .thumbnail {
display: block;
padding: 3px;
border: 1px solid rgba(0, 0, 0, 0.15);
background: rgba(0, 0, 0, 0.1);
text-decoration: none;
}
.eagle .thumbnail__media {
margin-bottom: 5px;
}
.eagle .thumbnail__caption {
font-size: 0.71428571em;
}
.eagle .video-embed {
display: block;
position: relative;
width: 100%;
height: 0;
padding-top: 66.666%;
}
.eagle .video-embed iframe {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}
.eagle .image-badge {
position: absolute;
width: 100%;
padding: 9px 0;
background: rgba(0, 0, 0, 0.65);
color: #fff;
text-align: center;
}
.eagle .image-badge__hed {
display: block;
font: 0.78571429em "ProximaNova", "Helvetica", "Arial", sans-serif;
letter-spacing: 1px;
text-transform: uppercase;
}
.eagle .image-badge__dek {
display: block;
font: bold 0.85714286em "Karla", "Arial", sans-serif;
}
.eagle .image-badge--bottom {
bottom: 0;
}
.eagle .image-badge--relative {
display: block;
position: relative;
}
.eagle .earlyaccess-badge {
display: inline-block;
margin-bottom: 15px;
padding: 10px 15px 9px 12px;
clear: both;
border: 1px solid #bab274;
color: #bab274;
font: bold 0.85714286em "ProximaNova", "Helvetica", "Arial", sans-serif;
letter-spacing: 0.125em;
text-decoration: none;
text-transform: uppercase;
white-space: nowrap;
}
.eagle .earlyaccess-badge .icon {
margin-top: -4px;
margin-right: 6px;
}
.eagle .earlyaccess-badge:hover, .eagle .earlyaccess-badge:active, .eagle .earlyaccess-badge:focus {
color: #bab274;
}
.eagle .wedding-badge {
display: inline-block;
margin-top: -1px;
margin-left: -22px;
padding: 6px 22px;
background-color: #f9c5b0;
color: #fff;
font: 0.71428571em "EB Garamond", "Helvetica", "Arial", sans-serif;
letter-spacing: 0.22857143em;
text-transform: uppercase;
vertical-align: middle;
}
.eagle .wedding-badge .icon {
margin-top: -4px;
margin-right: 6px;
}
.eagle .wedding-badge:hover, .eagle .wedding-badge:active, .eagle .wedding-badge:focus {
color: #fff;
}
.eagle .site-search__wrap {
float: none;
}
@media screen and (min-width: 48em) {
.eagle .site-search__wrap {
float: right;
}
}
.eagle .site-search__field {
position: relative;
}
.eagle .site-search__submit {
position: absolute;
top: 0;
right: 0;
height: 100%;
padding: 0;
border: 0;
font-size: 1.5em;
}
@media screen and (min-width: 48em) {
.eagle .site-search__submit {
width: 17px;
margin: 0 5.333333333333%;
padding: 1.5%;
}
}
.eagle .site-search__submit:hover {
border: 0;
background: none;
}
.eagle .site-search__submit-icon {
display: none;
width: 100%;
}
@media screen and (min-width: 48em) {
.eagle .site-search__submit-icon {
display: inline-block;
}
}
.eagle .site-search__submit-copy {
display: block;
}
@media screen and (min-width: 48em) {
.eagle .site-search__submit-copy {
display: none;
}
}
@media screen and (max-width: 47.99em) {
.eagle .site-search__hed {
color: #fff;
font-size: 0.92857143em;
}
}
.eagle .site-search__textbox {
padding: 5px 25px 5px 5px;
}
@media screen and (max-width: 47.99em) {
.eagle .site-search__textbox {
border: 0;
font-size: 1.5em;
}
}
.eagle .site-search__highlight {
color: #fff;
}
@media screen and (min-width: 48em) {
.eagle .site-search__highlight {
color: inherit;
}
}
.eagle .site-search__predictions {
width: 100%;
padding-top: 40px;
border: 0;
background: none;
}
@media screen and (min-width: 48em) {
.eagle .site-search__predictions {
right: 0;
width: 200%;
padding: 10px;
border: 1px solid #eaeaea;
background: #fff;
z-index: 2;
}
}
.eagle .site-search__suggestions .tt-suggestion {
width: 100%;
padding-bottom: 0;
}
.eagle .site-search__suggested-detail {
font-size: 1.16666667em;
}
@media screen and (max-width: 47.99em) {
.eagle .site-search__suggested-detail {
font-size: 1.71428571em;
}
.eagle .site-search__suggested-detail:hover {
color: #fff;
}
}
.eagle .site-search__related-product {
margin: 10px 0px;
}
.eagle .site-search__related-product-detail {
margin-bottom: 0;
color: #fff;
font-size: 1em;
}
@media screen and (min-width: 48em) {
.eagle .site-search__related-product-detail {
margin-bottom: 10px;
color: #000;
line-height: 1.14285714em;
}
}
.eagle .site-search__typeahead {
display: block;
}
@media screen and (min-width: 48em) {
.eagle .site-search__typeahead {
display: inline-block;
}
}
.eagle .mobile-site-search {
position: relative;
top: -2px;
width: 17px;
}
@media screen and (min-width: 48em) {
.eagle .mobile-site-search {
visibility: hidden;
}
}
.eagle .mobile-site-search__icon {
width: 100%;
}
.eagle .site-search-tray {
display: none;
position: absolute;
width: 100%;
padding: 10px 10px 0px 10px;
border-top: 1px solid #000;
background: #fff;
z-index: 3;
}
.eagle .site-search-tray__overlay {
display: none;
position: fixed;
top: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.9);
z-index: 3;
}
.eagle .prices__retail {
font-weight: bold;
}
.eagle .prices__retail-strikethrough {
color: #717171;
text-decoration: line-through;
}
.eagle .prices__markdown {
color: #961c1c;
}
.eagle .prices--lg {
font-size: 1.42857143em;
}
.eagle .product-titles__name {
color: #000;
font-size: 1.57142857em;
line-height: 1em;
}
.eagle .product-titles__brand {
font-size: 0.92857143em;
line-height: 1em;
}
.eagle .product-sections__hed {
margin-bottom: 14px;
padding-bottom: 6px;
border-bottom: 1px solid #eaeaea;
color: #000;
font-size: 0.92857143em;
letter-spacing: 1.75px;
line-height: 0.92857143em;
text-transform: uppercase;
}
.eagle .product-sections__hed--b-none {
padding-bottom: 0;
border-bottom: 0;
}
.eagle .product-details__title {
color: #949494;
white-space: nowrap;
cursor: pointer;
}
.eagle .product-details__title--active {
border-bottom: 2px solid #000;
color: #000;
}
.eagle .product-details__list {
color: #717171;
font-size: 0.85714286em;
line-height: 1.83333333em;
}
.eagle .product-details__list li {
list-style: disc inside;
}
.eagle .product-details__copy {
color: #717171;
font-size: 0.85714286em;
line-height: 1.5em;
}
.eagle .carousel {
position: relative;
}
.eagle .carousel__content {
margin: 10px 30px;
overflow: hidden;
}
.eagle .carousel__hed {
margin: 5px 0px;
}
.eagle .carousel__dek {
color: #000;
font-size: 0.92857143em;
}
.eagle .carousel__slide {
padding: 0px 8px;
}
.eagle .carousel__nav {
position: absolute;
top: 0;
bottom: 0;
cursor: pointer;
}
.eagle .carousel__nav-outer {
display: table;
width: 20px;
height: 100%;
padding: 0px 6px;
}
.eagle .carousel__nav-inner {
display: table-cell;
vertical-align: middle;
}
.eagle .carousel__nav-prev {
left: 0;
}
.eagle .carousel__nav-next {
right: 0;
}
.eagle .carousel__nav-icon {
width: 100%;
}
.eagle .tags__btn {
display: inline-block;
margin: 0px 8px 10px 0px;
padding: 5px 20px;
border: 1px solid #fdcdca;
border-radius: 4px;
color: #949494;
font-size: 0.85714286em;
line-height: 12px 12px;
}
.eagle .tags__btn:hover {
background-color: #fdcdca;
color: #949494;
text-decoration: none;
}
.eagle .slideshow {
position: relative;
height: 100%;
z-index: 1;
}
.eagle .slideshow__pager-thumb {
display: block;
border: 2px solid #fff;
cursor: pointer;
}
.eagle .slideshow__pager-thumb:hover {
border: 2px solid #000;
}
.eagle .slideshow__pager-img {
border: 1px #eaeaea solid;
}
.eagle .slideshow__magnify-svg {
width: 100%;
height: 13px;
}
.eagle .slideshow__magnify {
width: 15px;
margin: 0 auto;
}
.eagle .slideshow__image--height-full {
width: auto;
height: 100%;
}
.eagle .slideshow__slide {
width: 100%;
height: 100%;
}
.eagle .slideshow__nav {
position: absolute;
top: 0;
bottom: 0;
cursor: pointer;
z-index: 2;
}
.eagle .slideshow__nav:hover {
opacity: .5;
}
.eagle .slideshow__nav-outer {
display: table;
width: 100px;
height: 100%;
padding: 0px 6px;
}
.eagle .slideshow__nav-inner {
display: table-cell;
vertical-align: middle;
}
.eagle .slideshow__nav-prev {
left: 0;
}
.eagle .slideshow__nav-next {
right: 0;
}
.eagle .slideshow__nav-icon {
width: 100%;
height: 30px;
}
.eagle .u-hide {
display: none;
}
.eagle .u-hide-visible {
position: absolute;
left: -9999%;
height: 0;
margin: 0;
padding: 0;
opacity: 0;
}
@media screen and (min-width: 20em) {
.eagle .u-hide-xs {
display: none;
}
}
@media screen and (min-width: 34.375em) {
.eagle .u-hide-sm {
display: none;
}
}
@media screen and (min-width: 48em) {
.eagle .u-hide-md {
display: none;
}
}
@media screen and (min-width: 64em) {
.eagle .u-hide-lg {
display: none;
}
}
@media screen and (min-width: 78.5em) {
.eagle .u-hide-xl {
display: none;
}
}
.eagle .u-padding-t--none {
padding-top: 0;
}
.eagle .u-padding-t--xs {
padding-top: 2px;
}
.eagle .u-padding-t--sm {
padding-top: 4px;
}
.eagle .u-padding-t--md {
padding-top: 5.33333333px;
}
.eagle .u-padding-t--lg {
padding-top: 8px;
}
.eagle .u-padding-t--xl {
padding-top: 16px;
}
.eagle .u-padding-t--xxl {
padding-top: 32px;
}
.eagle .u-padding-r--none {
padding-right: 0;
}
.eagle .u-padding-r--xs {
padding-right: 2px;
}
.eagle .u-padding-r--sm {
padding-right: 4px;
}
.eagle .u-padding-r--md {
padding-right: 5.33333333px;
}
.eagle .u-padding-r--lg {
padding-right: 8px;
}
.eagle .u-padding-r--xl {
padding-right: 16px;
}
.eagle .u-padding-r--xxl {
padding-right: 32px;
}
.eagle .u-padding-b--none {
padding-bottom: 0;
}
.eagle .u-padding-b--xs {
padding-bottom: 2px;
}
.eagle .u-padding-b--sm {
padding-bottom: 4px;
}
.eagle .u-padding-b--md {
padding-bottom: 5.33333333px;
}
.eagle .u-padding-b--lg {
padding-bottom: 8px;
}
.eagle .u-padding-b--xl {
padding-bottom: 16px;
}
.eagle .u-padding-b--xxl {
padding-bottom: 32px;
}
.eagle .u-padding-l--none {
padding-left: 0;
}
.eagle .u-padding-l--xs {
padding-left: 2px;
}
.eagle .u-padding-l--sm {
padding-left: 4px;
}
.eagle .u-padding-l--md {
padding-left: 5.33333333px;
}
.eagle .u-padding-l--lg {
padding-left: 8px;
}
.eagle .u-padding-l--xl {
padding-left: 16px;
}
.eagle .u-padding-l--xxl {
padding-left: 32px;
}
.eagle .u-padding-a--none {
padding: 0;
}
.eagle .u-padding-a--xs {
padding: 2px;
}
.eagle .u-padding-a--sm {
padding: 4px;
}
.eagle .u-padding-a--md {
padding: 5.33333333px;
}
.eagle .u-padding-a--lg {
padding: 8px;
}
.eagle .u-padding-a--xl {
padding: 16px;
}
.eagle .u-padding-a--xxl {
padding: 32px;
}
.eagle .u-margin-t--none {
margin-top: 0;
}
.eagle .u-margin-t--xs {
margin-top: 2px;
}
.eagle .u-margin-t--sm {
margin-top: 4px;
}
.eagle .u-margin-t--md {
margin-top: 5.33333333px;
}
.eagle .u-margin-t--lg {
margin-top: 8px;
}
.eagle .u-margin-t--xl {
margin-top: 16px;
}
.eagle .u-margin-t--xxl {
margin-top: 32px;
}
.eagle .u-margin-r--none {
margin-right: 0;
}
.eagle .u-margin-r--xs {
margin-right: 2px;
}
.eagle .u-margin-r--sm {
margin-right: 4px;
}
.eagle .u-margin-r--md {
margin-right: 5.33333333px;
}
.eagle .u-margin-r--lg {
margin-right: 8px;
}
.eagle .u-margin-r--xl {
margin-right: 16px;
}
.eagle .u-margin-r--xxl {
margin-right: 32px;
}
.eagle .u-margin-b--none {
margin-bottom: 0;
}
.eagle .u-margin-b--xs {
margin-bottom: 2px;
}
.eagle .u-margin-b--sm {
margin-bottom: 4px;
}
.eagle .u-margin-b--md {
margin-bottom: 5.33333333px;
}
.eagle .u-margin-b--lg {
margin-bottom: 8px;
}
.eagle .u-margin-b--xl {
margin-bottom: 16px;
}
.eagle .u-margin-b--xxl {
margin-bottom: 32px;
}
.eagle .u-margin-l--none {
margin-left: 0;
}
.eagle .u-margin-l--xs {
margin-left: 2px;
}
.eagle .u-margin-l--sm {
margin-left: 4px;
}
.eagle .u-margin-l--md {
margin-left: 5.33333333px;
}
.eagle .u-margin-l--lg {
margin-left: 8px;
}
.eagle .u-margin-l--xl {
margin-left: 16px;
}
.eagle .u-margin-l--xxl {
margin-left: 32px;
}
.eagle .u-margin-a--none {
margin: 0;
}
.eagle .u-margin-a--xs {
margin: 5.33333333px;
}
.eagle .u-margin-a--sm {
margin: 8px;
}
.eagle .u-margin-a--md {
margin: 16px;
}
.eagle .u-margin-a--lg {
margin: 18.82352941px;
}
.eagle .u-margin-a--xl {
margin: 45.71428571px;
}
.eagle .u-margin-a--xxl {
margin: 106.66666667px;
}
.eagle .u-margin--center {
margin-left: auto;
margin-right: auto;
}
.eagle .u-border-t {
border-top-style: solid;
}
.eagle .u-border-r {
border-right-style: solid;
}
.eagle .u-border-b {
border-bottom-style: solid;
}
.eagle .u-border-l {
border-left-style: solid;
}
.eagle .u-border-a {
border-style: solid;
}
.eagle .u-border--none {
border-width: 0px;
}
.eagle .u-border--xs {
border-width: 1px;
}
.eagle .u-border--sm {
border-width: 2px;
}
.eagle .u-border--md {
border-width: 3px;
}
.eagle .u-border--lg {
border-width: 4px;
}
.eagle .u-border--xl {
border-width: 5px;
}
.eagle .u-border--color-xdark {
border-color: #000;
}
.eagle .u-border--color-dark {
border-color: #717171;
}
.eagle .u-border--color-medium {
border-color: #949494;
}
.eagle .u-border--color-light {
border-color: #f4f4f4;
}
.eagle .u-border--color-xlight {
border-color: #fff;
}
.eagle .u-bg-color--black {
background-color: #000;
}
.eagle .u-bg-color--grey {
background-color: #717171;
}
.eagle .u-bg-color--grey-light {
background-color: #949494;
}
.eagle .u-bg-color--grey-lighter {
background-color: #ccc;
}
.eagle .u-bg-color--none {
background-color: transparent;
}
.eagle .u-bg-color--offwhite {
background-color: #f4f4f4;
}
.eagle .u-bg-color--white {
background-color: #fff;
}
.eagle .u-bg-color--blue {
background-color: #c8ddea;
}
.eagle .u-bg-color--pink {
background-color: #fdcdca;
}
.eagle .u-bg-color--pink--light {
background-color: #f4e8e8;
}
.eagle .u-bg-color--error {
background-color: #961c1c;
}
.eagle .u-color--black {
color: #000;
}
.eagle .u-color--grey {
color: #717171;
}
.eagle .u-color--grey-light {
color: #949494;
}
.eagle .u-color--grey-lighter {
color: #ccc;
}
.eagle .u-color--none {
color: transparent;
}
.eagle .u-color--offwhite {
color: #f4f4f4;
}
.eagle .u-color--white {
color: #fff;
}
.eagle .u-color--blue {
color: #c8ddea;
}
.eagle .u-color--pink {
color: #fdcdca;
}
.eagle .u-color--pink-light {
color: #f4e8e8;
}
.eagle .u-color--error {
color: #961c1c;
}
.eagle .u-text-xs {
font-size: 0.85714286em;
}
.eagle .u-text-sm {
font-size: 1em;
}
.eagle .u-text-md {
font-size: 1.14285714em;
}
.eagle .u-text-lg {
font-size: 1.5em;
}
.eagle .u-text-xl {
font-size: 2em;
}
.eagle .u-text-xxl {
font-size: 2.57142857em;
}
.eagle .u-full-bleed {
margin-right: -16px !important;
margin-left: -16px !important;
}
.island .eagle .u-full-bleed {
margin-right: -16px !important;
margin-left: -16px !important;
}
.islet .eagle .u-full-bleed {
margin-right: -8px !important;
margin-left: -8px !important;
}
.eagle .u-float-left {
float: left !important;
}
.eagle .u-float-right {
float: right !important;
}
.eagle .u-float-none {
float: none !important;
}
.eagle .u-muted {
opacity: .5 !important;
filter: alpha(opacity=50) !important;
}
.eagle .u-clearfix,
.eagle .field__input-group,
.eagle .container,
.eagle .grid,
.eagle .g,
.eagle .media,
.eagle .ui-list,
.eagle .site-header {
zoom: 1;
}
.eagle .u-clearfix:before, .eagle .u-clearfix:after,
.eagle .field__input-group:before,
.eagle .container:before,
.eagle .grid:before,
.eagle .g:before,
.eagle .media:before,
.eagle .ui-list:before,
.eagle .site-header:before,
.eagle .field__input-group:after,
.eagle .container:after,
.eagle .grid:after,
.eagle .g:after,
.eagle .media:after,
.eagle .ui-list:after,
.eagle .site-header:after {
content: " ";
display: table;
}
.eagle .u-clearfix:after,
.eagle .field__input-group:after,
.eagle .container:after,
.eagle .grid:after,
.eagle .g:after,
.eagle .media:after,
.eagle .ui-list:after,
.eagle .site-header:after {
clear: both;
}
.eagle .u-full-width {
width: 100% !important;
}
.eagle .u-letter-space {
letter-spacing: 0.14285714em !important;
}
.eagle .u-ellipsis {
text-overflow: ellipsis !important;
white-space: nowrap !important;
overflow: hidden !important;
}
.eagle .u-uppercase {
text-transform: uppercase;
}
.eagle .u-pointer {
cursor: pointer;
}
.eagle .u-inline-block {
display: inline-block;
}
.eagle .u-center {
text-align: center;
}
.eagle .u-left {
text-align: left;
}
.eagle .u-right {
text-align: right;
}
.eagle .u-no-select {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.eagle .u-invert {
color: #fff;
}
.eagle .u-invert--grey {
color: #808080;
}
.eagle .u-invert--svg {
fill: #fff;
}
.eagle .u-invert--link:hover, .eagle .u-invert--link:focus {
color: #ccc;
text-decoration: none;
}
.eagle .u-invert--input {
border-color: #3b3b3b;
background: none;
color: #717171;
}
.eagle .u-invert--input::-webkit-input-placeholder {
color: #717171;
opacity: 1;
}
.eagle .u-invert--input:-moz-placeholder {
color: #717171;
opacity: 1;
}
.eagle .u-invert--input::-moz-placeholder {
color: #717171;
opacity: 1;
}
.eagle .u-invert--input:-ms-input-placeholder {
color: #717171;
opacity: 1;
}
.eagle .is-fixed .shame-toggle-visibility {
display: inline-block;
}
/*# sourceMappingURL=style.css.map */