/*

    Fonts
    * Headings/bold -- font-family: Titillium Web, PT Sans, sans-serif;
    * Paragraph sans-serif -- font-family: PT Sans, sans-serif;

    .Storage Colors:

    Darkest Red = #681010
    Red = #C4261E
    Orange Red = #E5461C
    Lighter Red = #F79A8B
    Pale Red = #F9E8E4

    Black = #191818
    Dark Gray = #3F3E3E
    Gray = #777575
    Light Gray = #AFAEAE
    Lighter Gray = #DDDDDD
    Off White = #F9F7F7

    Navy Blue = #182447
    Dark Blue = #193C93
    Blue = #3B50EA
    Light Blue = #5498FC
    Pale Blue = #D9EDFC

    * Spacing (padding, margin) - increments of 20 (or 10)

    * Primarily mobile first

    * Mix of SMACSS and BEM naming conventions
    * .block__modifier, .block__element-modifier
        * ex: .button__small, .heading__1-alt, .list__checklist, .list__checklist-red
        * Could be made more consistent. Not all class names follow this style yet.

*/

/*  Reset
    Minified normalize.css - http://github.com/necolas/normalize.css */article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block;*display:inline;*zoom:1}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-size:100%;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}html,button,input,select,textarea{font-family:sans-serif}body{margin:0}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}h2{font-size:1.5em;margin:.83em 0}h3{font-size:1.17em;margin:1em 0}h4{font-size:1em;margin:1.33em 0}h5{font-size:.83em;margin:1.67em 0}h6{font-size:.67em;margin:2.33em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:600;font-family:Titillium Web, PT Sans, sans-serif;}blockquote{margin:1em 40px}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}p,pre{margin:1em 0}code,kbd,pre,samp{font-family:monospace,serif;_font-family:'courier new',monospace;font-size:1em}pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word}q{quotes:none}q:before,q:after{content:'';content:none}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}dl,menu,ol,ul{margin:0}dd{margin:0 0 0 40px}menu,ol,ul{padding:0 0 0 40px}nav ul,nav ol{list-style:none;list-style-image:none}img{border:0;-ms-interpolation-mode:bicubic}svg:not(:root){overflow:hidden}figure{margin:0}form{margin:0}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0;white-space:normal;*margin-left:-7px}button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle}button,input{line-height:normal}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;*overflow:visible}button[disabled],html input[disabled]{cursor:default}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;*height:13px;*width:13px}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}

body > iframe {
    position: absolute;
    height: 0;
}

/* Box-sizing */
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/* Hide images accessibly */
.image-replacement,
.ir {
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    display: block;
    height: 0;
}

/* Sup (for Trademark/TM) */
sup {
    font-size: 1.4rem;
    margin-left: 3px;
    top: -0.75em;
}

/* Images */
img {
    max-width: 100%;
    height: auto;
}

/* Email Addresses */
.email-address {
    vertical-align: text-bottom;
}

/*=================================
Base Size

These are the mobile styles. It's what people see on their phones. If
you set a great foundation, you won't need to add too many other styles.
Remember, keep it light: Speed is Important. This will be used across
all viewports.
=================================*/

/*=================================

Body, General Styles

=================================*/

/* 62.5% = 10px which makes for easier rem-to-pixel conversions
ex: 1.4rem = 14px */
html {
    font-size: 62.5%;
}

body {
    font-family: PT Sans, sans-serif;
    font-size: 1.6em;
    font-weight: 400;
    line-height: 1;
    color: #3F3E3E;

    /* Improves appearance of fonts */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;

    /* Sticky footer */
    min-height: 100%;
    min-height: 100vh;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

/*=================================

Typography

=================================*/

.main-content {
    line-height: 1.5;
    min-height: 600px;

    /* Sticky footer */
    -webkit-box-flex: 1;
    -webkit-flex: 1 0 auto;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
}

/* Paragraphs with typographic improvements:
http://www.newnet-soft.com/blog/csstypography */
p {
    /* Enable ligatures */
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga=1";
    -ms-font-feature-settings: "liga";
    -o-font-feature-settings: "liga";
    font-feature-settings: "liga";

    margin-top: 0;
    margin-bottom: 20px;
}

/* Remove space after last paragraph or after single paragraphs */
p + p:last-child,
p:only-of-type {
    margin-bottom: 0;
}

/*=================================

Layout

=================================*/

/*  .rows limit the width of content and adds vertical
    spacing too. If you want a full width background
    color/image it will need to be outside a .row */
.row {
    clear: both;
    zoom: 1;
    margin-left: auto;
    margin-right: auto;
    max-width: 1000px;
    overflow: auto;
}

.main-content .row,
.site-footer .row {
    padding-left: 20px;
    padding-right: 20px;
    width: 100%;
}

.main-content .row {
    padding-top: 40px;
    padding-bottom: 40px;
}

/* Exceptions to padding */
.main-content .row__no-bottom-padding { padding-bottom: 0; }
.main-content .row__no-top-padding { padding-top: 0; }

.main-content .row,
.site-footer .row,
.header-logo-container {
    -webkit-transition: padding .17s;
    -moz-transition: padding .17s;
    -ms-transition: padding .17s;
    -o-transition: padding .17s;
    transition: padding .17s;
}

/*=================================

Links

=================================*/

a {
    color: #3B50EA;
}

.main-content a:hover,
.main-content a:focus {
    color: #193C93;
}

.bg__dark a:hover,
.bg__dark a:focus {
    color: #5498FC;
}

/* Hover transitions*/
button,
input,
a,
button:hover,
button:focus,
input:hover,
input:focus,
a:hover,
a:focus {
    -webkit-transition: color .25s, background .25s, padding .25s;
    -moz-transition: color .25s, background .25s, padding .25s;
    -ms-transition: color .25s, background .25s, padding .25s;
    -o-transition: color .25s, background .25s, padding .25s;
    transition: color .25s, background .25s, padding .25s;
}

button,
input,
a {
    -webkit-transition: color .17s, background .17s, padding .17s;
    -moz-transition: color .17s, background .17s, padding .17s;
    -ms-transition: color .17s, background .17s, padding .17s;
    -o-transition: color .17s, background .17s, padding .17s;
    transition: color .17s, background .17s, padding .17s;
}

.link__external:after {
    content: '';
    display: inline-block;
    vertical-align: -3px;
    height: 16px;
    width: 16px;
    margin-left: 4px;
}

.cssmask .link__external:after {
    background-color: #fff;
    -webkit-mask-image: url('/assets/img/baseline-open_in_new-24px.svg');
    mask-image: url('/assets/img/baseline-open_in_new-24px.svg');
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: right center;
    mask-position: right center;
    -webkit-mask-size: 16px 16px;
    mask-size: 16px 16px;
    -webkit-transition: background .17s;
    -moz-transition: background .17s;
    -ms-transition: background .17s;
    -o-transition: background .17s;
    transition: background .17s;
}

.cssmask .link__external:hover:after,
.cssmask .link__external:focus:after {
    background-color: #5498FC;
    -webkit-transition: background .25s;
    -moz-transition: background .25s;
    -ms-transition: background .25s;
    -o-transition: background .25s;
    transition: background .25s;
}

.no-cssmask .link__external:after,
.no-cssmask .link__external:hover:after,
.no-cssmask .link__external:focus:after {
    background-color: transparent;
    background-image: url('/assets/img/baseline-open_in_new-24px.svg');
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 16px 16px;
}

/*=================================

Headings

    * Use classes rather than heading elements to dictate style.

=================================*/

h1,
h2,
h3,
h4,
h5,
h6,
.heading__1,
.heading__2,
.heading__3,
.heading__4,
.heading__5,
.heading__6 {
    color: #777575;
    font-family: Titillium Web, PT Sans, sans-serif;
    font-weight: 600;
    line-height: 1.33;
    text-rendering: optimizelegibility;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    font-size: 100%;
}

.heading__1 {
    color: #191818;
    font-size: 3rem;
    margin-bottom: 20px;
}

.heading__2 {
    color: #C4261E;
    font-size: 2.6rem;
    margin-bottom: 20px;
}

.heading__3 {
    font-size: 2.1rem;
    margin-bottom: 10px;
}

.heading__4 {
    font-size: 1.8rem;
}

.heading__5 {
    font-size: 1.6rem;
    line-height: 1.5;
}

.heading__6 {
    font-family: PT Sans, sans-serif;
    font-weight: 400;
    font-style: italic;
}

/*=================================

Lists

=================================*/

/* Reset a <ul> or <ol> */
.list__reset {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Checklist */
.list__bulleted,
.list__bulleted ul {
    list-style: none;
    margin: 10px 0 0 20px;
    padding: 0;
}

.list__bulleted li {
    margin-bottom: 10px;
    padding-left: 20px;
    min-height: 20px;
    line-height: 1.33;
    background-image: url('/assets/img/box-dot-outline.png');
    background-image: -webkit-linear-gradient( transparent,  transparent), url('/assets/img/box-dot-outline.svg');
    background-image:  linear-gradient( transparent,  transparent), url('/assets/img/box-dot-outline.svg');
    background-repeat: no-repeat;
    background-position: 0 .4em;
}

/* Basic list styles */
.list__basic,
.list__basic ul,
.list__basic ol {
    margin-top: 20px;
    margin-bottom: 20px;
}

.list__basic ul,
.list__basic ol {
    margin-top: 10px;
    margin-bottom: 0;
    margin-left: 20px;
}

.list__basic li {
    margin-bottom: 10px;
}

/* Ordered list */
.list__ordered {
    list-style-type: decimal;
}

.list__bulleted .list__ordered li {
    background: none;
    padding-left: 0;
}

/* Lists in columns */
.list__2-col > li,
.list__3-col > li,
.list__4-col > li {
    vertical-align: top;
    display: inline-block;
    padding-right: 20px;

    width: 100%;
}

/*=================================

Blockquote

=================================*/

blockquote {
    background-color: #F9F7F7;
    margin: 2rem 0;
    padding: 2rem;
    border-top: 5px solid #ddd;
    font-family: Titillium Web, PT Sans, sans-serif;
    font-weight: 600;
}

/*=================================

Tables

=================================*/

.table__basic {
    border: 2px solid #AFAEAE;
    width: 100%;
    margin-top: 40px;
    margin-bottom: 40px;
}

/* Some <th> elements are in the <thead>, others are in the <tbody> and form a heading column */
.table__basic-heading {
    font-weight: 600;
    font-family: Titillium Web, PT Sans, sans-serif;
    background-color: #DDDDDD;
    padding: 10px 15px;
}

.table__basic-body .table__basic-heading {
    text-align: left;
}

.table__basic-cell {
    border: 1px solid #DDDDDD;
    padding: 10px 15px;
}

/* Zebra striping */

.table__zebra tr:nth-of-type(even) {
    background-color: #F9F7F7;
}

/*
    Responsive table solution by ZURB Foundation
    http://zurb.com/playground/responsive-tables

    Replaced 767px media query (MQ) with 800px
    If this CSS MQ is changed, be sure to change the JS MQ too.

    Foundation v2.1.4 http://foundation.zurb.com */

.table__responsive-caption {
    display: none;
}

@media only screen and (max-width: 800px) {
    .table__responsive-caption {
        display: block;
        margin-top: -20px;
        margin-bottom: 30px;
        font-style: italic;
        text-align: center;
    }
    table.responsive {
        margin: 0;
        border-left: none;
        border-right: none;
    }
    .pinned {
        position: absolute;
        left: 0;
        top: 0;
        background: #fff;
        width: 150px;
        overflow: hidden;
        overflow-x: scroll;
        border-right: 2px solid #AFAEAE;
        border-left: 2px solid #AFAEAE;
    }
    .pinned table {
        border-right: none;
        border-left: none;
        margin: 0;
        width: 100%;
    }
    .pinned table th,
    .pinned table td {
        white-space: nowrap;
    }
    .pinned td:last-child {
        border-bottom: 0;
    }
    div.table-wrapper {
        position: relative;
        margin-top: 40px;
        margin-bottom: 40px;
        overflow: hidden;
        border-right: 2px solid #AFAEAE;
    }
    div.table-wrapper div.scrollable {
        margin-left: 150px;
    }
    div.table-wrapper div.scrollable {
        overflow: scroll;
        overflow-y: hidden;
    }
    table.responsive td,
    table.responsive th {
        position: relative;
        white-space: nowrap;
        overflow: hidden;
    }
    table.responsive th:first-child,
    table.responsive td:first-child,
    table.responsive td:first-child,
    table.responsive.pinned td {
        display: none;
    }
}

/*==================================================================

Buttons

    * Use .button for basic button style to any element
    * ADD .button__(modifier) classes to modify base button
* Use .button__reset instead of .button to reset <button> element

==================================================================*/

.button__reset {
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-font-smoothing: antialiased;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: none;
    border: none;
    margin: 0;
    padding: 0;
    font-family: inherit;
}

/* Default: red */
.button {
    /* Reset */
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    -webkit-font-smoothing: antialiased;
    border: none;
    text-shadow: none;
    background: none;
    cursor: pointer;
    text-decoration: none;

    /* Basic style */
    margin: 2rem;
    font-family: Titillium Web, PT Sans, sans-serif;
    font-weight: 600;
    text-align: center;
    color: #C4261E;
    font-size: 2.2rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    border-radius: 3px;
    border: 4px solid #C4261E;
    padding: .75rem 2rem;
    display: inline-block;
}

.button:hover,
.button:focus {
    background: #C4261E;
    color: #fff;
    outline: none;
    box-shadow: 0 2px 9px rgba(119, 117, 117, 0.5);
}

a.button,
.button a {
    color: #C4261E;
    text-decoration: none;
}

.dark-pattern-bg .button {
    color: #fff;
    border-color: #fff;
}

.dark-pattern-bg .button:hover,
.dark-pattern-bg .button:focus {
    border-color: #C4261E;
    box-shadow: 0 2px 9px rgba(52, 21, 21, 0.5);
}

a.button:hover,
a.button:focus,
.button a:hover,
.button a:focus {
    color: #fff;
}

.button:hover,
.button:focus,
.button {
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -ms-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}

.form__basic-field .button {
    margin-left: 0;
}

/* .button Modifiers */

/* Sizes
    (Further defined in media queries)
*/

.button__small {
    padding: .25rem .75rem;
    font-size: 1.5rem;
    border-width: 3px;
    margin: 1rem;
}

.button__large {
    padding: 1.5rem 2.5rem;
    font-size: 2.4rem;
    border-width: 5px;
    margin: 2.5rem;
}

/* Widths
	(Further defined in media queries)
*/

.button__narrow {}
.button__wide {}

/* Groups of buttons */

.button__collection-wide {
    margin: 5px 0;
    min-width: 270px;
}

/* Alternate Styles */
.button__simple {
    border: none;
    background-color: #777575;
    text-transform: none;
    letter-spacing: 0px;
}

.button__simple,
a.button__simple {
    color: #fff;
}

/*=================================

Forms

=================================*/

/*
    Basic form
*/

.form__basic-field {
    margin-bottom: 20px;
}

.form__quick-field {
    max-width: 275px;
    margin-left: auto;
    margin-right: auto;
}

.form__quick-field .button {
    margin-left: auto;
    margin-right: auto;
}

/* Labels */
.form__basic-label {
    display: block;
    margin-bottom: 7px;
    font-size: 1.6rem;
    color: #777575;
    font-weight: 600;
    font-family: Titillium Web, PT Sans, sans-serif;
}

.form__basic-label .asterisk {
    color: #C4261E;
}

/* Hide label accessibly */
.placeholder .hide-label {
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    display: block;
    height: 0;
    font-size: 0;
    margin: 0;
    padding: 0;
}

/* Browsers/devices that don't support placeholders get labels */
.no-placeholder .hide-label {
    margin-bottom: 5px;
}

.form__basic-select,
.form__basic-input,
.form__basic-textarea {
    border-radius: 0;
    border: 2px solid #777575;
    outline: none;
    background-color: #fff;
    color: #3F3E3E;
    font-weight: 400;
    font-family: PT Sans, sans-serif;
    font-size: 1.6rem;
    width: 100%;
    min-height: 50px;
    padding: 15px;
}

.form__basic-input:focus,
.form__basic-select:focus,
.form__basic-textarea:focus {
    box-shadow: 0 2px 9px rgba(119, 117, 117, 0.5);
}

/* Selects */
.form__basic-select {}

.no-bgpositionshorthand.appearance .form__basic-select {
    background-position: 95% center;
}

.appearance .form__basic-select {
    padding-right: 30px;

    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;

    background-image: url('/assets/img/dropdown-arrow.png');
    background-image: -webkit-linear-gradient(transparent, transparent), url('/assets/img/dropdown-arrow.svg');
    background-image: linear-gradient(transparent, transparent), url('/assets/img/dropdown-arrow.svg');
    background-repeat: no-repeat;
    background-position: 95% center;
    background-position: right 10px bottom 45%;
}

/* Inputs */
.form__basic-input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/* Textarea */
.form__basic-textarea {
    height: 110px;
}

/* Radio buttons */
.form__basic-radio-container {
    list-style: none;
    padding: 0;
}

.form__basic-radio-container li {
    display: inline-block;
    width: 80px;
}

.form__basic-radio-button,
.form__basic-label-radio {
    display: inline-block;
}

.form__basic-radio-button {
    margin-right: 5px;
}

::-webkit-input-placeholder { color: #AFAEAE; font-style: italic; }
::-moz-placeholder { color: #AFAEAE; font-style: italic; } /* firefox 19+ */
:-ms-input-placeholder { color: #AFAEAE; font-style: italic; } /* ie */
:-moz-placeholder { color: #AFAEAE; font-style: italic; }

/*=================================

Alerts

=================================*/

.alert {
    text-align: center;
    margin: 3rem auto;
}

.alert p {
    background-color: #dddddd;
    display: inline-block;
    padding: .5em 1em;
    font-family: Titillium Web, PT Sans, sans-serif;
    font-weight: bold;
}

.alert__error p {
    background-color: #F9E8E4;
    color: #E5461C;
}

.alert__success p {
    background-color: #D9EDFC;
    color: #193C93;
}

/*=================================

Header, Site Banner, Navigation

===================================*/

.site-header {
    background-color: #F9F7F7;
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}

.site-header .row {
    position: relative;
    overflow: initial;
}

.site-header a {
    text-decoration: none;
}

.header-logo-container {
    text-align: center;
}

.header-logo-container a {
    display: inline-block;
    vertical-align: top;
}

.site-logo {
    min-height: 40px;
}

/* Mobile nav */

.button__mobile-nav {
    position: absolute;
    right: 0;
    top: 0;
    margin: 0;
    top: 50%;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 20px;
}

/* Navigation */

nav ul,
nav ol {
    margin: 0;
    padding: 0;
}

.nav-item {
    display: block;
}

.main-nav-link {
    line-height: 1;
    display: block;

    color: #777575;
    font-family: Titillium Web, PT Sans, sans-serif;
    font-weight: 600;
}

.header-nav .main-nav-link {
    padding: 15px;
    text-align: center;
}

.header-nav .main-nav-link:hover,
.header-nav .main-nav-link:focus {
    color: #C4261E;
}

/*=================================

Footer, Footer nav

===================================*/

.site-footer {
    background-color: #681010;
    color: #fff;
    padding-top: 40px;
    padding-bottom: 60px;
}

.site-footer a {
    text-decoration: none;
}

.footer-nav .nav-item {
    margin-bottom: 10px;
}

.footer-nav .main-nav-link {
    color: #fff;
    display: inline-block;
    line-height: 1.25;
}

.footer-nav .main-nav-link:hover,
.footer-nav .main-nav-link:focus {
    color: #5498FC;
}

.footer-logo img {
    vertical-align: text-top;
}

/* Copyright */

.site-copyright {
    margin-top: 40px;
    padding-bottom: 30px;
    line-height: 1.33;
}

/* Social Icons */

.social-icons {
    padding: 0;
    list-style: none;
}

.social-icons li {
    display: inline-block;
    text-align: center;
    background-image: url('/assets/img/icon-sprite-2017.png');
    background-image: -webkit-linear-gradient(transparent, transparent), url('/assets/img/icon-sprite-2017.svg');
    background-image: linear-gradient(transparent, transparent), url('/assets/img/icon-sprite-2017.svg');
    background-repeat: no-repeat;

    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;

    -webkit-transition: .25s ease-out;
    -moz-transition: .25s ease-out;
    -ms-transition: .25s ease-out;
    -o-transition: .25s ease-out;
    transition: .25s ease-out;
}

.social-icons li:hover {
    -webkit-transform: scale(1.17) rotate(-5deg);
    -moz-transform: scale(1.17) rotate(-5deg);
    -ms-transform: scale(1.17) rotate(-5deg);
    -o-transform: scale(1.17) rotate(-5deg);
    transform: scale(1.17) rotate(-5deg);
}

.main-content .social-icons {
    margin-top: 20px;
    margin-bottom: 20px;
}

.main-content .social-icons li {
    height: 50px;
    width: 50px;
    background-size: auto 50px;
    margin-left: 5px;
    margin-right: 5px;
}

.main-content .social-icons li:hover {
    -webkit-filter: brightness(30%);
    -moz-filter: brightness(30%);
    -ms-filter: brightness(30%);
    -o-filter: brightness(30%);
    filter: brightness(30%);
}

.site-footer .social-icons li {
    height: 25px;
    width: 25px;
    background-size: auto 25px;
    margin-left: 2px;
    margin-right: 2px;

    -webkit-filter: brightness(200%);
    -moz-filter: brightness(200%);
    -ms-filter: brightness(200%);
    -o-filter: brightness(200%);
    filter: brightness(200%);
}

.social-icons a {
    display: block;
    height: 100%;
    width: 100%;
    text-decoration: none;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

.facebook-icon { background-position: 0 0; }
.twitter-icon { background-position: 9% 0; }
.instagram-icon { background-position: 17.5% 0; }
.youtube-icon { background-position: 26% 0; }
.google-plus-icon { background-position: 35% 0; }
.etsy-icon { background-position: 44% 0; }
.pinterest-icon { background-position: 51.5% 0; }
.vimeo-icon { background-position: 60.5% 0; }
.linkedin-icon { background-position: 69% 0; }
.email-icon { background-position: 78% 0; }
.rss-icon { background-position: 86.5% 0; }
.tumblr-icon { background-position: 95.5% 0; }
.soundcloud-icon { background-position: 101.5% 0; }

/*==================================================================

Icons, misc

==================================================================*/

/*
    SVG logos with fallback PNG background-images
    PNG fallback for SVG objects
    Including this fallback in main.css
    instead of ie.css for old droid support
*/
.fallback {
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center center;
}

/* Dropdowns */
.dropdown__parent {
    position: relative;
}

.dropdown__button,
.dropdown__parent .nav-link {
    display: inline;
    vertical-align: middle;
}

.dropdown__button {
    outline: none;
    height: 18px;
    width: 18px;
    margin-left: 3px;
}

/* Arrow icon */
.dropdown__button:hover .arrow,
.dropdown__button:focus .arrow {
    fill: #136e7f;
}

.svg .icon__dropdown.fallback { display: none; }
.no-svg .icon__dropdown.fallback { display: block; }

.dropdown__open svg {
    -moz-transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    transform: rotate(-180deg);
}

.dropdown__button svg {
    -moz-transition: transform .5s cubic-bezier(0.18, 0.89, 0.32, 1.28);
    -webkit-transition: transform .5s cubic-bezier(0.18, 0.89, 0.32, 1.28);
    -o-transition: transform .5s cubic-bezier(0.18, 0.89, 0.32, 1.28);
    -ms-transition: transform .5s cubic-bezier(0.18, 0.89, 0.32, 1.28);
    transition: transform .5s cubic-bezier(0.18, 0.89, 0.32, 1.28);
}

/*==================================================================

<hr>

==================================================================*/

hr,
.hr-line {
    width: 100%;
    height: 2px;
    background-color: #DDDDDD;
    border: none;
    margin: 15px auto;
}

/*==================================================================

Backgrounds for full width areas (ex: homepage)

==================================================================*/

.bg__gray {
    background-color: #AFAEAE;
}

.bg__dark {
    background-color: #191818;
    color: #fff;
}

/*=================================

Home

===================================*/

.home__splash-content {
    position: relative;
    z-index: 99;
}

.dark-pattern-bg {
    background-color: #191818;
    background-image: url('/assets/img/repeating-box.png');
    color: #fff;
    border-bottom: 7px solid #e5461c;
    position: relative;
}

.dark-pattern-bg:before {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#191818+40,191818+100&0.9+40,0.4+100 */
    background: -moz-linear-gradient(45deg,  rgba(25,24,24,0.9) 40%, rgba(25,24,24,0.4) 100%);
    background: -webkit-linear-gradient(45deg,  rgba(25,24,24,0.9) 40%,rgba(25,24,24,0.4) 100%);
    background: linear-gradient(45deg,  rgba(25,24,24,0.9) 40%,rgba(25,24,24,0.4) 100%);
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    content: '';
    z-index: 9;
}

.dark-pattern-bg a {
    color: #5498FC;
}

.dark-pattern-bg a:hover,
.dark-pattern-bg a:focus {
    color: #fff;
}
.tagline__reg {
    font-size: 50%;
    top: -0.75em;
}
.reg__logos {
    text-align: center;
}

.reg__logos-heading {
    text-align: center;
}

.register-page .reg__logos-heading {
    margin-top: 20px;
}

.reg__logos li {
    padding-right: 0;
}

.reg__logos img {
    padding: 0 10px;
}

.large-logo,
.extra-large-logo {
    width: 100%;
    max-width: 250px;
}

/*=================================

TLD Timeline

===================================*/

.tld-timeline {
    text-align: center;
    counter-reset: timeline;
}

.timeline-item {
    padding: 50px 15px;
    background-color: #E5461C;
}

.t2.timeline-item { background-color: #C4261E; }
.t3.timeline-item { background-color: #681010; }

.timeline-item,
.timeline-item a,
.timeline-item a:hover,
.timeline-item a:focus {
    color: #fff;
}

.timeline-item a:hover,
.timeline-item a:focus {
    text-decoration: none;
}

.active.timeline-item {
    padding-top: 70px;
    margin-top: -20px;
    margin-bottom: -20px;
}

.timeline-head:before {
    counter-increment: timeline;
    content: counter(timeline);
    background-color: #fff;
    border-radius: 25px;
    width: 50px;
    height: 50px;
    display: block;
    margin: 0 auto 20px auto;
    font-size: 2.8rem;
    color: #E5461C;
    line-height: 50px;
    font-weight: 600;
    font-family: Titillium Web, PT Sans, sans-serif;
}

.t2 .timeline-head:before { color: #C4261E; }
.t3 .timeline-head:before { color: #681010; }

.timeline-head h3 {
    font-family: Titillium Web, PT Sans, sans-serif;
    font-weight: 600;
    font-size: 2.2rem;
    color: #fff;
    margin-bottom: 10px;
}

.timeline-head h4 {
    margin-bottom: 20px;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 1.4rem;
}

.timeline-body {
    font-family: PT Sans, sans-serif;
    font-weight: 400;
    font-size: 1.4rem;
}

/*=================================

WHOIS Search

=================================*/

/* Search form */
.form__domain-search {
    position: relative;
}

.avail-prefix-input {
    border-radius: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    outline: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

    font-weight: 400;
    font-family: PT Sans, sans-serif;
    font-size: 1.6rem;

    min-height: 50px;
    padding: 15px 0 15px 15px;
    border: 2px solid transparent;
    left: 0;
    bottom: 0;
    position: absolute;
    z-index: 0;
    width: 0;
    background: none;
    -webkit-transition: width .25s;
    -moz-transition: width .25s;
    -ms-transition: width .25s;
    -o-transition: width .25s;
    transition: width .25s;
}

.prefix-active .avail-prefix-input {
    width: 105px;
    z-index: 555;
}

.prefix-active .whois-search-term {
    padding-left: 9.75rem;
}

.whois__terms {
    text-align: center;
    margin-bottom: 2rem;
}

.form__whois-captcha .g-recaptcha {
    width: 100%;
    max-width: 302px;
    overflow: hidden;
    background-color: #d3d3d3;
    border-right: 1px solid lightgrey;
    height: 76px;
    display: block;
    margin: 2rem auto;
}

.form__whois-submit {
    text-align: center;
}

/* WHOIS Search Results */

.whois__results {
    background-color: #fff;
    padding: 2rem;
}

/*=================================

Contact page

===================================*/

.contact__address {
    text-align: center;
    margin-bottom: 20px;
}

/*=================================

/files icons

===================================*/

.files-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.files-item {
    display: block;
    margin-bottom: 20px;
}

    .files-item a,
    .files-item a:hover {
        background-image: none;
        text-decoration: none;
    }

.files-icon {
    height: 160px;
    width: 160px;
    display: inline-block;
    margin-right: 1.5rem;
    vertical-align: middle;
    background-image: url('/assets/img/files-icons-sprite.png');
    background-image: -webkit-linear-gradient( transparent,  transparent), url('/assets/img/files-icons-sprite.svg');
    background-image:  linear-gradient( transparent,  transparent), url('/assets/img/files-icons-sprite.svg');
    background-size: 100% auto;
    background-color: #c4261e;
}

    .files-media-kit .files-icon {
        background-position: center 0;
    }

    .files-flyers .files-icon {
        background-position: center 40.5%;
    }

    .files-logos .files-icon {
        background-position: center 20%;
    }

    .files-fonts .files-icon {
        background-position: center 60%;
    }
    .files-content .files-icon {
        background-position: center 80%;
    }
    .files-banners .files-icon {
        background-position: center 100%;
    }

.files-title {
    display: inline-block;
    margin-right: -5px;
    vertical-align: middle;
    text-align: center;
    text-decoration: underline;
}

/*=================================

Sitemap

=================================*/

.list__sitemap {
    max-width: 300px;
    margin: 0 auto;
}

/*==================================================================

    Reusable helper classes

    Prefixes:
    * .s__ for style
    * .t__ for typography
    * .l__ for layout

==================================================================*/

.s__margin-bottom { margin-bottom: 20px; }
.s__margin-top { margin-top: 20px; }
.s__margin-left { margin-left: 20px; }
.s__margin-right { margin-right: 20px; }

.s__margin-top-neg { margin-top: -20px; }

.s__margin-none { margin: 0; }
.s__margin-bottom-none { margin-bottom: 0; }
.s__margin-top-none { margin-top: 0; }
.s__margin-left-none { margin-left: 0; }
.s__margin-right-none { margin-right: 0; }

.s__padding-bottom { padding-bottom: 20px; }
.s__padding-top { padding-top: 20px; }
.s__padding-left { padding-left: 20px; }
.s__padding-right { padding-right: 20px; }

.s__padding-none { padding: 0; }
.s__padding-bottom-none { padding-bottom: 0; }
.s__padding-top-none { padding-top: 0; }
.s__padding-left-none { padding-left: 0; }
.s__padding-right-none { padding-right: 0; }

.s__left { text-align: left; }
.s__center { text-align: center; }
.s__right { text-align: right; }

.t__normal { font-weight: 400; }
.t__bold { font-weight: 600; font-family: Titillium Web, PT Sans, sans-serif; }

/* Allow long words (like URLs) to break to avoid being cut off/overflow scroll */
.t__break-word {
    word-wrap: break-word;
    -ms-word-break: break-word;
    word-break: break-word;
}

small,
.t__small {
    font-size: 1.4rem;
}
.t__medium { font-size: 1.8rem; }
.t__large { font-size: 2.2rem; }

.t__italic { font-style: italic; }

.t__uppercase { text-transform: uppercase; }

.t__color-red { color: #C4261E; }
.t__color-gray { color: #777575; }
.t__color-black { color: #191818; }
.t__color-white { color: #fff; }

.l__align-top { vertical-align: top; }
.l__align-middle { vertical-align: middle; }
.l__align-bottom { vertical-align: bottom; }

.l__center {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.l__right {
    float: right;
    margin: 1rem 0 1rem 1rem;
}

.l__left {
    float: left;
    margin: 1rem 1rem 1rem 0;
}

.l__relative { position: relative; }

.l__width-small {
    max-width: 600px;
    margin-right: auto;
    margin-left: auto;
}

.l__width-medium {
    max-width: 800px;
    margin-right: auto;
    margin-left: auto;
}

/*==================================================================

Media Queries

    * Mobile first responsive design (mostly!)
    * http://bradfrost.com/blog/mobile/the-many-faces-of-mobile-first/
    * http://bradfrost.com/blog/post/responsive-strategy/#mobile-first

==================================================================*/

/* Under 450px / Small mobile specific styles */
@media only screen and (max-width: 449px) {

    .mobile-hide {
        display: none;
    }

    .main-content .row,
    .site-footer .row,
    .header-logo-container {
        -webkit-transition: padding .17s, left .17s;
        -moz-transition: padding .17s, left .17s;
        -ms-transition: padding .17s, left .17s;
        -o-transition: padding .17s, left .17s;
        transition: padding .17s, left .17s;
    }

    .header-logo-container {
        margin-left: 20px;
        text-align: left;
    }

    .site-logo {
        max-width: 175px;
    }

    /* Files */
    .files-item {
        margin: 2rem;
    }

    .files-icon {
        height: 50%;
        width: 50%;
        padding-top: 50%;
    }

    .files-title {
        width: 40%;
        width: -webkit-calc(50% - 1.5rem);
        width: calc(50% - 1.5rem);
        text-align: left;
    }

}

@media only screen and (min-width: 450px) {

    /* Lists */
    .list__3-col li,
    .list__4-col li {
        width: 48%;
        width: -webkit-calc(50% - 5px);
        width: calc(50% - 5px);
    }

    /* Files */
    .files-list {
        text-align: center;
    }

    .files-item {
        display: inline-block;
        vertical-align: top;
        margin: 1rem;
    }

    .files-icon {
        display: block;
        margin: 0 auto 1rem;
        -webkit-transition: height .25s, width .25s;
        -moz-transition: height .25s, width .25s;
        -ms-transition: height .25s, width .25s;
        -o-transition: height .25s, width .25s;
        transition: height .25s, width .25s;
    }

    .files-title {
        display: block;
        margin-left: 0;
    }

}

@media only screen and (max-width: 599px) {

    .form__newsletter-submit {
        max-width: 180px;
        padding: 15px;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    .reg__logos li {
        padding-right: 0;
    }

}

@media only screen and (min-width: 600px) {

    .heading__1 {
        font-size: 4rem;
    }

    .heading__2 {
        font-size: 2.8rem;
    }

    .heading__3 {
        font-size: 2.2rem;
    }

    /* HR */
    hr,
    .hr-line {
        margin-top: 30px;
        margin-bottom: 30px;
    }

    /* Buttons */
    .button {
        font-size: 2.2rem;
        padding: 1rem 2.5rem;
    }

    .button__small {
        font-size: 1.6rem;
        padding: .5rem 1rem;
    }

    .button__large {
        padding: 1.5rem 3.5rem;
        font-size: 2.8rem;
    }

    .button__collection-wide {
        margin: 10px;
        min-width: 290px;
    }

    /* Lists */
    .list__2-col > li {
        width: 48%;
        width: -webkit-calc(50% - 5px);
        width: calc(50% - 5px);
    }

    .list__3-col > li,
    .list__4-col > li {
        width: 31.33%;
        width: -webkit-calc(33.33% - 5px);
        width: calc(33.33% - 5px);
    }

    /* Registrars */
    .form__subscribe-group {
        padding-left: 20px;
        width: 50%;
        display: inline-block;
        vertical-align: top;
        margin-right: -4px;
    }

    .form__subscribe-group:first-of-type {
        padding-left: 0;
        padding-right: 20px;
    }

    .form__subscribe-group:last-of-type {
        margin-left: 50%;
    }

    .list__registrar-logos li {
        height: 130px;
        padding-left: 20px;
        padding-right: 20px;
    }

    /* WHOIS */

    .form__whois-captcha,
    .form__whois-submit {
        display: inline-block;
        vertical-align: top;
    }

    .form__whois-captcha .g-recaptcha {
        width: 302px;
        background-color: #f9f9f9;
        border: none;
    }

    .form__whois-submit {
        float: right;
    }

    .form__whois-submit .button {
        height: 76px;
        margin: 2rem 0 0 0;
        padding-top: 1.17rem;
        padding-bottom: 1.17rem;
        font-size: 2.8rem;
    }

    .whois__terms {
        text-align: right;
    }

}

/* Under 800px / Mobile specific styles */
@media only screen and (max-width: 799px) {

    /* Hide until toggled visible */
    #header-main-nav {
        display: none;

        padding-top: 1rem;
        padding-bottom: 1rem;
        box-shadow: inset 0 0 10px #AFAEAE;
        position: absolute;
        top: 100%;
        top: -webkit-calc(100% + 1.5rem);
        top: calc(100% + 1.5rem);
        width: 100%;
        right: 0;
        z-index: 999;
        background-color: #ddd;
    }

    /* Footer */
    .site-footer {
        text-align: center;
    }

    .footer-nav {
        margin-top: 20px;
    }

    /* Contact */
    .contact__address-left {
        padding-top: 30px;
    }

}


/* Wider than 800px - Most of our tablet/desktop styles */
@media only screen and (min-width: 800px) {

    .dark-pattern-bg {
        border-bottom-width: 13px;
    }

    .main-content .row:last-of-type {
        padding-bottom: 60px;
    }

    /* Grid */

    [class*="-column"] {
        padding-right: 50px;
        display: inline-block;
        vertical-align: top;
    }

    /* Removes gutter/padding-right for last columns with sibling(s) */
    [class*="-column"] ~ [class*="-column"]:last-child,
    .full-column {
        padding-right: 0;
    }

    .half-column {
        width: 48%;
        width: -webkit-calc(50% - 5px);
        width: calc(50% - 5px);
    }

    .half-column:first-of-type {
        padding-right: 25px;
    }

    .half-column + .half-column {
        padding-right: 0;
        padding-left: 25px;
    }

    .third-column {
        width: 31.3%;
        width: -webkit-calc(33.3% - 5px);
        width: calc(33.3% - 5px);
    }

    .third-column:nth-child(2n) {
        padding-right: 50px;
    }

    .third-column:last-child {
        display: inline-block;
        margin-top: 0;
    }

    .two-thirds-column {
        width: 64%;
        width: -webkit-calc(66.6% - 5px);
        width: calc(66.6% - 5px);
    }

    .fourth-column {
        width: 23%;
        width: -webkit-calc(25% - 5px);
        width: calc(25% - 5px);
    }

    .three-fourths-column {
        width: 73%;
        width: -webkit-calc(75% - 5px);
        width: calc(75% - 5px);
    }

    .two-fifths-column {
        width: 38%;
        width: -webkit-calc(40% - 5px);
        width: calc(40% - 5px);
    }

    .three-fifths-column {
        width: 58%;
        width: -webkit-calc(60% - 5px);
        width: calc(60% - 5px);
    }

    /* Lists */
    .list__4-col > li {
        width: 23%;
        width: -webkit-calc(25% - 5px);
        width: calc(25% - 5px);
    }

    /* Navigation */

    .button__mobile-nav,
    .icon__mobile-nav.fallback {
        display: none;
    }

    /* Keeps nav visible at desktop if nav was closed in mobile */
    #header-main-nav {
        display: inline-block !important;
    }

    .header-logo-container {
        display: inline-block;
        vertical-align: middle;
        text-align: left;
        margin-left: 20px;
        /* Keep logo clickable and above the absolutely positioned nav */
        position: relative;
        z-index: 9999;
    }

    .header-nav {
        position: absolute;
        top: 50%;
        -moz-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        right: 20px;
        background: none;
        display: inline-block;
        vertical-align: middle;
        width: 100%;
    }

    .header-nav .top-level-nav {
        padding: 0;
        text-align: right;
    }

    .header-nav .nav-item {
        display: inline-block;
        margin-left: 3rem;
    }

    .header-nav .main-nav-link {
        padding: 0;
    }

    .main-nav-link:focus {
        outline: none;
    }

    /* Footer */

    .site-footer {
        padding-bottom: 100px;
    }

    /* Align right half-column */
    .footer-nav {
        text-align: right;
    }

    .site-footer .social-icons li {
        margin-top: 0;
    }

    .site-footer .social-icons li:first-child {
        margin-left: 0;
    }

    .footer-nav .main-nav-item:first-of-type .main-nav-link {
        padding-top: 0;
    }

    /* Contact */
    .contact__address {
        width: 50%;
        display: inline-block;
        vertical-align: middle;
        padding-top: 20px;
    }

    .contact__address-left {
        text-align: right;
        padding-right: 20px;
    }

    .contact__address-right {
        text-align: left;
        padding-left: 20px;
    }

    .reg__logos img {
        padding: 5px 20px;
    }

    .l__flex-vert-center {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .extra-large-logo {
        max-width: 350px;
    }

}

/* Narrower than 1100px
	1100px = ( 1000px + (50px * 2) )
	1100px = ( rowWidth + (padding * eachSide) ) */
@media only screen and (max-width: 1099px) {

    .tld-timeline {
        max-width: 500px;
        margin-left: auto;
        margin-right: auto;
    }

    /* Active Timeline */
    .active.timeline-item {
        margin: 0 -10px;
        padding-top: 50px;
    }

}

/* Wider than 1100px
    1100px = ( 1000px + (50px * 2) )
    1100px = ( rowWidth + (padding * eachSide) ) */
@media only screen and (min-width: 1100px) {

    /* Header */
    .header-nav {
        right: 0;
    }

    .header-logo-container {
        margin-left: 0;
    }

    .header-nav .nav-item {
        margin-left: 5rem;
    }

    /* Timeline */
    /* TLD Timeline */

    .tld-timeline {
        max-width: 900px;
        margin-left: auto;
        margin-right: auto;
        /* Make all children equal height */
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }

    .timeline-item {
        width: 33.3%;
        display: inline-block;
        vertical-align: top;
        padding-bottom: 35px;
    }

    /* Don't need container padding */
    .main-content .row,
    .site-footer .row {
        padding-right: 0;
        padding-left: 0;
    }

    /* Headings */
    .page-title {
        margin-top: 20px;
        margin-bottom: 40px;
    }

    /* Forms */
    .form__subscribe-group {
        width: 33.33%;
    }

    .form__subscribe-group:first-of-type {
        margin-left: 0;
        padding-right: 30px;
    }

    .form__subscribe-group:nth-of-type(2n) {
        padding-left: 15px;
        padding-right: 15px;
    }

    .form__subscribe-group:last-of-type {
        margin-left: 0;
        padding-left: 30px;
    }

    .form__subscribe-submit {
        width: 250px;
        padding-top: 15px;
        padding-bottom: 15px;
        border-radius: 5px;
    }

    .form__subscribe .form__basic-field {
        min-height: 88px;
    }

    .footer-logo img {
        max-height: none;
    }

}

/*=================================

Retina (2x Resolution Devices)

=================================*/
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {}

/*=================================

Retina (2x Resolution Devices)

=================================*/
@media print {

    * {
        background: transparent !important;
        color: black !important;
        text-shadow: none !important;
        filter: none !important;
        -ms-filter: none !important;
    }

    a, a:visited {
        color: #3F3E3E !important;
        text-decoration: underline;
    }
    a:after, a:visited:after {
        content: " (" attr(href) ")";
    }
    a abbr[title]:after, a:visited abbr[title]:after {
        content: " (" attr(title) ")";
    }

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre, blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group;
    }

    tr, img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm; }
    p, h2, h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }

    nav {
        display: none;
    }
}
