/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background:0 0}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}

/* ================================================================== *\
   Base ($base)
\* ================================================================== */

/* Viewport resizing */
@-webkit-viewport { width: device-width; zoom: 1.0; }
@-moz-viewport    { width: device-width; zoom: 1.0; }
@-ms-viewport     { width: device-width; zoom: 1.0; }
@-o-viewport      { width: device-width; zoom: 1.0; }
@viewport         { width: device-width; zoom: 1.0; }

/**
 * Box model adjustments
 * `border-box`... ALL THE THINGS - http://cbrac.co/RQrDL5
 */

*,
*:before,
*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing:    border-box;
    box-sizing:         border-box;
}

/**
 * 1. Customize `background` for text selections
 * 2. Remove `text-shadow` selection highlight - http://cbrac.co/Q6swON
 */

::-moz-selection {
    background: #b3d4fc; /* 1 */
    text-shadow: none;   /* 2 */
}

::selection {
    background: #b3d4fc; /* 1 */
    text-shadow: none;   /* 2 */
}

/* Change `background` for text selections when browser is unfocused */
::selection:window-inactive {
    background: #dedede;
}

/* Remove `background` on images when selected */
img::selection {
    background: transparent;
}

img::-moz-selection {
    background: transparent;
}





/* ================================================================== *\
   Fonts ($fonts)
\* ================================================================== */

/* Roboto Slab Bold (headlines only) */
@font-face {
    font-family: "RobotoSlabBold";
    src: url("fonts/robotoslab-bold-webfont.eot");
    src: url("fonts/robotoslab-bold-webfont.eot?#iefix") format("embedded-opentype"),
         url("fonts/robotoslab-bold-webfont.woff") format("woff"),
         url("fonts/robotoslab-bold-webfont.ttf") format("truetype"),
         url("fonts/robotoslab-bold-webfont.svg#RobotoSlab") format("svg");
    font-weight: normal;
    font-style: normal;
}





/* ================================================================== *\
   Text ($text)
\* ================================================================== */

/**
 * 1. Force a vertical scrollbar - http://cbrac.co/163MspB
 * NOTE: Use `text-rendering` with caution - http://cbrac.co/SJt8p1
 * NOTE: Avoid the webkit anti-aliasing trap - http://cbrac.co/TAdhbH
 * NOTE: IE for Windows Phone 8 ignores `-ms-text-size-adjust` if the
 *       viewport <meta> tag is used - http://cbrac.co/1cFrAvl
 */

html {
    overflow-y: scroll; /* 1 */
    min-height: 100%;
    font-size: 100%;
}

/**
 * 1. Inherits percentage declared on above <html> as root `font-size`
 * 2. Unitless `line-height`, which acts as multiple of base `font-size`
 */

body {
    background-color: #eee;
    color: #444;
    font-size: 16px;  /* 1 */
    font-family: Georgia, Times, serif;
    line-height: 1.5; /* 2 */
}

/**
 * Links ($links)
 */

a {
    /*color: #07e;*/
    color: #2d5341;
}

a:hover {
    text-decoration: none;
}

.link--bare  { text-decoration: none; }
.link--block { position: relative; display: block; }

.more-link {
    display: inline-block;
    margin-left: 8px;
    font-family: "RobotoSlabBold", Cambria, Times, serif;
}

p.more-link {
    margin: 0 0 16px;
}

/**
 * Headings ($headings)
 */

h1, h2, h3, h4, h5, h6 {
    margin: 16px 0;
    color: #222;
    font-weight: 400;
    font-family: "RobotoSlabBold", Cambria, Times, serif;
    line-height: 1.333;
}

.byline {
    font-style: italic;
}

hr {
    margin: 16px 0;
    height: 0;
    border: 1px solid #eee;
}





/* ================================================================== *\
   Embedded content ($embedded-content)
\* ================================================================== */

/* Fluid-width <audio> & <video> elements */
audio,
video {
    width: 100%;
}

audio:focus,
video:focus {
    outline: 1px dotted #222;
}

/* Fluid-width media that maintain their aspect ratios */
embed,
img,
object,
video {
    max-width: 100%;
    height: auto;
}

embed,
object {
    height: 100%;
}

figure {
    margin: 16px 0;
}

/**
* 1. Remove the gap between <img> elements and the bottom of their
* containers - http://cbrac.co/Q6smqV
*/

img {
    vertical-align: middle; /* 1 */
    -ms-interpolation-mode: bicubic;
}





/* ================================================================== *\
   Form elements ($form-elements)
\* ================================================================== */

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native
 *    <audio> and <video> controls
 * 2. Improve usability and consistency of cursor style between
 *    image-type <input> and others
 */

button,
html input[type="button"], /* 1 */
input[type="checkbox"],
input[type="file"],
input[type="image"],
input[type="radio"],
input[type="reset"],
input[type="submit"],
label,
select {
    cursor: pointer; /* 2 */
}

input[type="color"],
input[type="range"] {
    vertical-align: middle;
}

/**
 * 1. Remove default `margin`, `padding`, and `border` across browsers
 * 2. Set `min-width` to 0 to avoid overflow issues in Chrome
 */

fieldset {
    margin: 0;    /* 1 */
    padding: 0;   /* 1 */
    min-width: 0; /* 2 */
    border: 0;    /* 1 */
}

/* Remove `margin-bottom` from the last element in a <fieldset> */
fieldset > *:last-child {
    margin-bottom: 0;
}

/* Add this class for a bordered <fieldset> */
.fieldset--border {
    padding: 1em;
    border: 1px solid #dedede;
}

/* Make checkbox, image, and radio inputs `inline-block` by default */
input[type="checkbox"],
input[type="image"],
input[type="radio"] {
    display: inline-block;
    width: auto;
}

/**
 * Give inputs, selects, and textareas some basic styles
 */

input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="email"],
input[type="month"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
input[type="week"],
select,
textarea {
    display: block;
    padding: 8px;
    width: 100%;
    height: 44px;
    outline: 0 none;
   *outline: thin dotted #222 \9; /* IE 6-8 */
    border: 1px solid #ccc;
    -webkit-border-radius: 0;
    -moz-border-radius:    0;
    border-radius:         0;
    vertical-align: middle;
    font-family: inherit;
    line-height: 1.5;
}

input[type="date"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="email"]:focus,
input[type="month"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="text"]:focus,
input[type="time"]:focus,
input[type="url"]:focus,
input[type="week"]:focus,
select:focus,
textarea:focus {
    outline: 0 none;
    -webkit-box-shadow: inset 0.1em 0.1em 0.238em hsla(0, 0%, 0%, 0.15);
    -moz-box-shadow:    inset 0.1em 0.1em 0.238em hsla(0, 0%, 0%, 0.15);
    box-shadow:         inset 0.1em 0.1em 0.238em hsla(0, 0%, 0%, 0.15);
}

/**
 * 1. Constrict `max-width` for file inputs to avoid overflow issues
 */

input[type="file"] {
    max-width: 100%; /* 1 */
    cursor: pointer;
}

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

/**
 * 1. Remove `padding` so people aren't caught out if they zero out fieldsets
 * 2. Correct `color` not being inherited in IE 8/9
 */

legend {
    padding: 0; /* 1 */
    border: 0;  /* 2 */
    color: #222;
    font-weight: 700;
}

/* If <fieldset> has a border, give its <legend> some styling */
.fieldset--border legend {
    margin: 0;
    padding: 0 0.356em;
    background: #fff;
}

@media only screen and (min-width: 600px) {
    legend {
        font-size: 112.5%;
    }
}

/* Give <select> menus a fixed height and solid background color */
select {
    background: #f8f8f8;
    padding: 10px;
}

select:focus {
    outline: 1px dotted #222;
}

/**
 * 1. Restrict <textarea> elements to vertical resizing only
 */

textarea {
    resize: vertical; /* 1 */
}





/* ================================================================== *\
   Layout ($layout)
\* ================================================================== */

/* Fluid-width container */
.container {
    margin-left: auto;
    margin-right: auto;
    min-width: 1000px;
    max-width: 1140px;
    width: 95%;
}

/**
 * Grids ($grids)
 *
 * <div class="grid">
 *     <div class="grid__item one-third">
 *         <p>One third grid</p>
 *     </div><!--
 *
 *  --><div class="grid__item two-thirds">
 *         <p>Two thirds grid</p>
 *     </div><!--
 *
 *  --><div class="grid__item one-half">
 *         <p>One half grid</p>
 *     </div><!--
 *
 *  --><div class="grid__item one-fourth">
 *         <p>One fourth grid</p>
 *     </div><!--
 *
 *  --><div class="grid__item one-fourth">
 *         <p>One fourth grid</p>
 *     </div>
 * </div>
 *
 * 1. Default gutter width, change if desired
 * 2. Remove `list-style` in case `.grid` is on a <ul> element
 */

.grid {
    margin: 0;
    margin-left: -1em; /* 1 */
    padding: 0;
    list-style: none;  /* 2 */
}

/* Grid gutters */
.gutter-none               { margin-left: 0;      }
.gutter-none .grid__item   { padding-left: 0;     }
.gutter-half               { margin-left: -0.5em; }
.gutter-half .grid__item   { padding-left: 0.5em; }
.gutter-double             { margin-left: -2em;   }
.gutter-double .grid__item { padding-left: 2em;   }

/**
 * Grid items
 * 1. Default gutter width, change if desired
 * 2. Ensures elements within `.grid-item` start at the top
 */

.grid__item {
    display: inline-block;
    padding-left: 1em;   /* 1 */
    vertical-align: top; /* 2 */
}

/* Widths */
.grid__item,
.one-whole        { width: 100%;    }
.one-half         { width: 50%;     }
.one-third        { width: 33.333%; }
.two-thirds       { width: 66.666%; }
.one-fourth       { width: 25%;     }
.two-fourths      { width: 50%;     }
.three-fourths    { width: 75%;     }
.one-fifth        { width: 20%;     }
.two-fifths       { width: 40%;     }
.three-fifths     { width: 60%;     }
.four-fifths      { width: 80%;     }
.one-sixth        { width: 16.666%; }
.two-sixths       { width: 33.333%; }
.three-sixths     { width: 50%;     }
.four-sixths      { width: 66.666%; }
.five-sixths      { width: 83.333%; }
.one-eighth       { width: 12.5%;   }
.two-eighths      { width: 25%;     }
.three-eighths    { width: 37.5%;   }
.four-eighths     { width: 50%;     }
.five-eighths     { width: 62.5%;   }
.six-eighths      { width: 75%;     }
.seven-eighths    { width: 87.5%;   }
.one-tenth        { width: 10%;     }
.two-tenths       { width: 20%;     }
.three-tenths     { width: 30%;     }
.four-tenths      { width: 40%;     }
.five-tenths      { width: 50%;     }
.six-tenths       { width: 60%;     }
.seven-tenths     { width: 70%;     }
.eight-tenths     { width: 80%;     }
.nine-tenths      { width: 90%;     }
.one-twelveth     { width: 8.333%;  }
.two-twelveths    { width: 16.666%; }
.three-twelveths  { width: 25%;     }
.four-twelveths   { width: 33.333%; }
.five-twelveths   { width: 41.666%; }
.six-twelveths    { width: 50%;     }
.seven-twelveths  { width: 58.333%; }
.eight-twelveths  { width: 66.666%; }
.nine-twelveths   { width: 75%;     }
.ten-twelveths    { width: 83.333%; }
.eleven-twelveths { width: 91.666%; }
.width-auto       { width: auto;    }





/* ================================================================== *\
   Buttons ($buttons)
\* ================================================================== */

/* States */
.button,
.paging-navigation a,
.post-navigation a {
    display: inline-block;
    margin: 0;
    padding: 0.633em 0.875em;
    border: 0 none;
    background-color: #dedede;
    color: #444;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    font-weight: 400;
    font-family: "RobotoSlabBold", Cambria, Times, serif;
    line-height: 1.5;
    cursor: pointer;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.button:hover,
.paging-navigation a:hover,
.post-navigation a:hover {
    background-color: #e5e5e5;
}

.button:active,
.paging-navigation a:active,
.post-navigation a:active,
.button.is-active {
    background-color: #ccc;
    -webkit-box-shadow: inset 0 0 0.317em hsla(0, 0%, 0%, 0.25);
    -moz-box-shadow:    inset 0 0 0.317em hsla(0, 0%, 0%, 0.25);
    box-shadow:         inset 0 0 0.317em hsla(0, 0%, 0%, 0.25);
}

.button:active:focus {
    outline: 0 none;
}

/* Consistent button focus style across browsers */
.button:focus {
    outline: thin dotted #222;
}

.button[disabled],
.button.is-disabled {
    -webkit-box-shadow: none;
    -moz-box-shadow:    none;
    box-shadow:         none;
    text-shadow: none;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
    opacity: 0.50;
    cursor: not-allowed;
    pointer-events: none;
}

/* Sizes */
.button--xs {
    padding: 0.238em 0.475em;
    font-size: 0.75em;
}

.button--sm {
    padding: 0.356em 0.633em;
    font-size: 0.875em;
}

@media(min-width: 600px) {
    .button--lg,
    .button--block {
        padding: 1em 1.333em;
        font-size: 1.333em;
        line-height: 1.333;
    }
}

.button--block {
    display: block;
}

/* Colors */
.button--primary,
.paging-navigation a,
.post-navigation a {
    background-color: #2d5341;
    color: #fff;
}

.button--primary:hover,
.paging-navigation a:hover,
.post-navigation a:hover {
    background-color: #335e4a;
}

.button--primary:active,
.paging-navigation a:active,
.post-navigation a:active,
.button--primary.is-active {
    background-color: #274838;
}

.button--secondary {
    background-color: #f9d33a;
    color: #222;
}

.button--secondary:hover {
    background-color: #fada5b;
}

.button--secondary:active,
.button--secondary.is-active {
    background-color: #f8cc19;
}

.button--tertiary {
    background-color: #07e;
    color: #fff;
}

.button--tertiary:hover {
    background-color: #007fff;
}

.button--tertiary:active,
.button--tertiary.is-active {
    background-color: #006fdd;
}





/* ================================================================== *\
   Icons ($icons)
\* ================================================================== */

@font-face {
    font-family: "ja_icons";
    src:url("fonts/ja_icons.eot?-bwql7");
    src:url("fonts/ja_icons.eot?#iefix-bwql7") format("embedded-opentype"),
        url("fonts/ja_icons.woff?-bwql7") format("woff"),
        url("fonts/ja_icons.ttf?-bwql7") format("truetype"),
        url("fonts/ja_icons.svg?-bwql7#ja_icons") format("svg");
    font-weight: normal;
    font-style: normal;
}

[class^="icon-"],
[class*=" icon-"] {
    text-transform: none;
    font-weight: normal;
    font-style: normal;
    font-variant: normal;
    font-family: "ja_icons";
    line-height: 1;
    speak: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-home:before     { content: "\e605"; }
.icon-cart:before     { content: "\e604"; }
.icon-drawer:before   { content: "\e603"; }
.icon-search:before   { content: "\e606"; }
.icon-facebook:before { content: "\e600"; }
.icon-twitter:before  { content: "\e601"; }
.icon-feed:before     { content: "\e602"; }





/* ================================================================== *\
   Labels ($labels)
\* ================================================================== */

.label {
    position: relative;
    display: inline-block;
    margin-left: -16px;
    padding: 8px 16px;
    background-color: #2d5341;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.label__content {
    margin: 0;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.label--attention { background-color: #f9d33a; }
.label--attention .label__content { color: #222; }





/* ================================================================== *\
   Media ($media)
\* ================================================================== */

.media {
    margin: 16px 0;
    padding: 0 0 16px;
    border-bottom: 2px solid #eee;
}

/* Clear floats */
.media:before,
.media:after {
    display: table;
    content: " ";
}

.media:after { clear: both; }

.media__link {
    color: #444;
}

.media__link:hover {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);
    opacity: 0.85;
}

.media__image {
    float: left;
    margin: 0 16px 0 0;
    /*margin: 0 3% 0 0;
    width: 30.333%;*/
}

.media__body {
    overflow: hidden;
    /*float: right;
    width: 66.666%;*/
}

.media__title {
    margin: 0 0 8px;
    color: #396953;
    font-size: 18px;
}

.media__meta {
    display: inline-block;
    margin: 0 0 8px;
    font-size: 12px;
}

.media--feature {
    padding: 0;
    border: 0;
}

.media--feature .media__link:hover {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    opacity: 1;
}

.media--feature .media__image {
    float: none;
    margin: 0;
    width: auto;
}

.media--feature .media__body {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    float: none;
    padding: 64px 16px 16px;
    background: -moz-linear-gradient(
        top,
        rgba(0,0,0,0) 0,
        rgba(0,0,0,0.85) 95%
    );
    background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        color-stop(0%,rgba(0,0,0,0)),
        color-stop(95%,rgba(0,0,0,0.85))
    );
    background: -webkit-linear-gradient(
        top,
        rgba(0,0,0,0) 0,
        rgba(0,0,0,0.85) 95%
    );
    background: -o-linear-gradient(
        top,
        rgba(0,0,0,0) 0,
        rgba(0,0,0,0.85) 95%
    );
    background: -ms-linear-gradient(
        top,
        rgba(0,0,0,0) 0,
        rgba(0,0,0,0.85) 95%
    );
    background: linear-gradient(
        to bottom,
        rgba(0,0,0,0) 0,
        rgba(0,0,0,0.85) 95%
    );
    filter:progid:DXImageTransform.Microsoft.gradient(
        startColorstr='#00000000',
        endColorstr='#66000000',
        GradientType=0
    );
}

.media--feature .media__link:hover .media__body {
    background: -moz-linear-gradient(
        top,
        rgba(0,0,0,0) 0,
        rgba(0,0,0,0.95) 95%
    );
    background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        color-stop(0%,rgba(0,0,0,0)),
        color-stop(95%,rgba(0,0,0,0.95))
    );
    background: -webkit-linear-gradient(
        top,
        rgba(0,0,0,0) 0,
        rgba(0,0,0,0.95) 95%
    );
    background: -o-linear-gradient(
        top,
        rgba(0,0,0,0) 0,
        rgba(0,0,0,0.95) 95%
    );
    background: -ms-linear-gradient(
        top,
        rgba(0,0,0,0) 0,
        rgba(0,0,0,0.95) 95%
    );
    background: linear-gradient(
        to bottom,
        rgba(0,0,0,0) 0,
        rgba(0,0,0,0.95) 95%
    );
}

.media--feature .media__link,
.media--feature .media__title {
    color: #fff;
}

.media--feature .media__title {
    font-size: 36px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.media--vertical {
    padding: 0;
    border-bottom: 0;
}

.media--vertical .media__image,
.media--vertical .media__body {
    float: initial;
    width: auto;
}

.media--vertical .media__image {
    margin: 0 0 16px;
}





/* ================================================================== *\
   Searchbar ($searchbar)
\* ================================================================== */

.searchbar input,
.searchbar .button {
    float: left;
    -webkit-box-sizing: border-box;
    -moz-box-sizing:    border-box;
    box-sizing:         border-box;
    padding: 16px;
    border: 0;
    background-color: #fff;
}

.searchbar input {
    width: 200px;
    height: 56px;
}

.searchbar .button {
    padding-right: 20px;
    padding-left: 20px;
    max-width: 56px;
    border-left: 1px solid #ccc;
}

.searchbar .button:hover {
    background-color: #f8f8f8;
}

.searchbar .button:active {
    background-color: #eee;
}

.site-main .searchbar {
    position: relative;
    border: 1px solid #ccc;
    height: 58px;
}

.site-main .searchbar input {
    width: 100%;
    padding-right: 72px;
}

.site-main .searchbar .button {
    position: absolute;
    top: 0;
    right: 0;
}





/* ================================================================== *\
   Cards ($cards)
\* ================================================================== */

.card {
    -webkit-box-shadow: 1px 1px 3px hsla(0, 0%, 0%, 0.2);
    -moz-box-shadow:    1px 1px 3px hsla(0, 0%, 0%, 0.2);
    box-shadow:         1px 1px 3px hsla(0, 0%, 0%, 0.2);
}

.card__image {
    margin: 0;
}

.media--vertical .card__image {
    margin: 0;
}

.card__body {
    padding: 16px;
}





/* ================================================================== *\
   Menus ($menus)
\* ================================================================== */

.menu {
    margin: 0;
    padding-left: 0;
    list-style: none;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 400;
    font-family: "RobotoSlabBold", Cambria, Times, serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.menu a {
    display: inline-block;
}

/* Inline menus */
.menu--inline li,
.menu--inline li a {
    display: inline-block;
}

/* Float menus */
.menu--float li {
    float: left;
}

/* Clear floats */
.menu--float:before,
.menu--float:after {
    display: table;
    content: " ";
}

.menu--float:after {
    clear: both;
}

/* Primary menus */
.menu--primary a:hover,
/*.menu--primary .is-active*/
.menu--primary .current-menu-item {
    background-color: #2d5341;
}

/* Secondary menus */
.menu--secondary {
    background: #fc0;
    background: -moz-linear-gradient(
        top,
        hsla(47,100%,71%,1) 0%,
        hsla(48,100%,50%,1) 100%
    );
    background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        color-stop(0%,hsla(47,100%,71%,1)),
        color-stop(100%,hsla(48,100%,50%,1))
    );
    background: -webkit-linear-gradient(
        top,
        hsla(47,100%,71%,1) 0%,
        hsla(48,100%,50%,1) 100%
    );
    background: -o-linear-gradient(
        top,
        hsla(47,100%,71%,1) 0%,
        hsla(48,100%,50%,1) 100%
    );
    background: -ms-linear-gradient(
        top,
        hsla(47,100%,71%,1) 0%,
        hsla(48,100%,50%,1) 100%
    );
    background: linear-gradient(
        to bottom,
        hsla(47,100%,71%,1) 0%,
        hsla(48,100%,50%,1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(
        startColorstr='#ffdf6d',
        endColorstr='#ffcc00',GradientType=0
    );
    text-align: center;
    font-size: 13px;
}

.menu--secondary .sub-menu li {
    display: block;
    text-align: left;
}

.menu--secondary a {
    padding: 16px 24px;
    color: #213d30;
    text-decoration: none;
}

/* Dropdown menus */
.menu .menu-item-has-children {
    position: relative;
}

/**
 * 1. Make sure parent <a> sits on top of `.sub-menu` to avoid any
 *    `box-shadow` bleed
 */
.menu .menu-item-has-children > a {
    position: relative;
    z-index: 2; /* 1 */
}

.menu .menu-item-has-children:hover > a {
    background-color: #222;
}

.menu--secondary .menu-item-has-children:hover a {
    color: #fff;
}

.sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1;
    display: none;
    margin: 0;
    padding: 16px 0;
    min-width: 245px;
    background-color: #222;
    -webkit-box-shadow: 0 0 10px hsla(0, 0%, 0%, 0.2);
    -moz-box-shadow:    0 0 10px hsla(0, 0%, 0%, 0.2);
    box-shadow:         0 0 10px hsla(0, 0%, 0%, 0.2);
    list-style: none;
}

.menu-item-has-children:hover .sub-menu {
    display: block;
}

.sub-menu li {
    float: none;
}

.sub-menu li a {
    display: block;
}

.sub-menu li a:hover {
    background-color: #333;
}



/* ================================================================== *\
   Toolbars ($toolbars)
\* ================================================================== */

.toolbar {
    background-color: #213d30;
    -webkit-box-shadow:
        0 0 0 3px #fc0,
        0 0 0 5px #213d30,
        0 0 0 8px #fff,
        0 0 0 10px #213d30,
        0 0 0 13px #fc0;
    -moz-box-shadow:
        0 0 0 3px #fc0,
        0 0 0 5px #213d30,
        0 0 0 8px #fff,
        0 0 0 10px #213d30,
        0 0 0 13px #fc0;
    box-shadow:
        0 0 0 3px #fc0,
        0 0 0 5px #213d30,
        0 0 0 8px #fff,
        0 0 0 10px #213d30,
        0 0 0 13px #fc0;
}

.toolbar a {
    color: #fff;
    text-decoration: none;
}

.toolbar--fixed {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    width: 100%;
    height: 56px;
}

.admin-bar .toolbar--fixed {
    margin-top: 32px;
}

.toolbar .menu--primary {
    float: left;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.toolbar .menu a {
    padding: 16px;
}

.toolbar .social,
.toolbar .searchbar {
    float: right;
}

.toolbar .social a {
    padding-right: 20px;
    padding-left: 20px;
}

.toolbar .social a,
.toolbar .social a i {
    -webkit-transition: all 0.25s;
    -moz-transition:    all 0.25s;
    -o-transition:      all 0.25s;
    transition:         all 0.25s;
}

.toolbar .social a i {
display: inline-block;
    -webkit-transform: rotate(0);
    -moz-transform:    rotate(0);
    -o-transform:      rotate(0);
    transform:         rotate(0);
}

.toolbar .social a:hover i {
    -webkit-transform: rotate(-45deg);
    -moz-transform:    rotate(-45deg);
    -o-transform:      rotate(-45deg);
    transform:         rotate(-45deg);
}

.toolbar .social--feed     { background-color: #ee802f; }
.toolbar .social--facebook { background-color: #3b5998; }
.toolbar .social--twitter  { background-color: #55acee; }




/* ================================================================== *\
   Widgets ($widgets)
\* ================================================================== */

.widget {
    padding: 0 16px;
}

.widget--sidebar {
    border-bottom: 2px solid #eee;
}

.widget--sidebar .widget-title {
    font-size: 16px;
}

.widget_archive select {
    margin-bottom: 16px;
    background-color: #f8f8f8;
}

.widget_links {
    margin-top: 16px;
}

.widget_links .widget-title {
    margin: 0;
    padding: 8px 16px;
    background-color: #2d5341;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.widget_links .blogroll {
    margin-top: 0;
    padding: 16px 0;
    background-color: #f8f3e3;
    list-style: none;
}

.widget_links .blogroll a {
    display: block;
    padding: 4px 20px;
}

.widget_links .blogroll a:hover {
    background-color: #f1e7c8;
    color: #222;
}

.widget .twitter-timeline {
    margin-bottom: 10px;
}

.widget_mailchimp {
    margin: 0 0 16px;
}

.widget_mailchimp label {
    display: inline-block;
    margin-bottom: 4px;
}

.error-404 .widget {
    margin-top: 24px;
    border-top: 2px solid #eee;
}

.widget--footer {
    margin: 16px 0;
    padding: 0;
}





/* ================================================================== *\
   Ads ($ads)
\* ================================================================== */

.ad {
    text-align: center;
    margin: 16px 0;
}

.ad--well {
    padding: 4px 0;
    background-color: #eee;
}

.ad__title {
    margin: 0 0 4px;
    color: #777;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 11px;
}

.ad--468x60 {
    overflow: hidden;
}




/* ================================================================== *\
   Entries ($entries)
\* ================================================================== */

.post {
    margin: 16px 0;
    border-bottom: 2px solid #eee;
}

/*.entry-title a {
    color: #2d5341;
}*/

.entry-content .wp-caption-text {
    margin-top: 4px;
    color: #777;
    font-style: italic;
    font-size: 13px;
}

.entry-footer {
    position: relative;
    margin: 16px 0;
    padding: 16px;
    background-color: #f8f8f8;
    font-size: 14px;
}

.entry-footer:before {
    content: '';
    display: block;
    right: 0;
    top: 0;
    position: absolute;
    border-bottom: 16px solid transparent;
    border-right: 16px solid #fff;
}

.entry-footer:after {
    content: '';
    display: block;
    right: 0;
    top: 0;
    position: absolute;
    border-top: 16px solid transparent;
    border-left: 16px solid #dedede;
}

.entry-footer .cat-links,
.entry-footer .tag-links {
    display: block;
}

.entry-footer .cat-links {
    margin-bottom: 8px;
}

.paging-navigation,
.post-navigation {
    margin: 16px 0;
}

.paging-navigation .nav-previous,
.post-navigation .nav-previous {
    float: left;
}

.paging-navigation .nav-next,
.post-navigation .nav-next {
    float: right;
}





/* ================================================================== *\
   Site ($site)
\* ================================================================== */

.site {
    padding: 85px 0 16px;
}

.site-desc {
    text-align: center;
}

.site-desc a {
    display: inline-block;
    color: #222;
    text-decoration: none;
}

.site-desc a:hover {
    text-decoration: underline;
}

.site-desc h3 {
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 10px;
}

.logo {
    display: block;
}

/**
 * 1. Fix for Firefox to prevent table layout from overflowing due to
 *    fluid-width images inside the table cells
 */

.site-main {
    display: table;
    background-color: #fff;
    table-layout: fixed; /* 1 */
}

.site__block {
    display: table-cell;
    padding: 0 16px;
    vertical-align: top;
}

.sidebar {
    width: 334px;
    border-left: 2px solid #eee;
    padding: 0;
}

.sidebar--slim {
    width: 194px;
}

.site-footer {
    position: relative;
    padding: 16px 32px;
    background-color: #213d30;
    color: #4b8a6d;
    font-family: "RobotoSlabBold", Cambria, Times, serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    border-top: 13px solid #fc0;
}

.site-footer h1,
.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer h5,
.site-footer h6 {
    margin-top: 0;
    margin-bottom: 8px;
    color: #4b8a6d;
    text-transform: uppercase;
    letter-spacing: 1px;
}


.site-footer a {
    color: #fff;
    text-decoration: none;
    text-transform: none;
    letter-spacing: 0;
}

.site-footer a:hover {
    text-decoration: underline;
}

.site-footer .ad {
    margin-top: 0;
}





/* ================================================================== *\
   Utilities ($utilities)
\* ================================================================== */

/**
 * Alignment ($alignment)
 */

/* WP floats */
.alignleft {
    float: left;
    margin-right: 16px;
}

.alignright {
    float: left;
    margin-right: 16px;
}

.aligncenter {
    margin: 0 auto;
    text-align: center;
}

.alignnone {
    float: none;
}

/* Table layout helpers */
.dt  {
    display: table;
    width: 100%;
}

.dtc { display: table-cell; }

/* Vertical alignment */
.vat { vertical-align: top;    }
.vam { vertical-align: middle; }

/* Floats */
.fl-l { float: left;  }
.fl-r { float: right; }
.fl-n { float: none;  }

/* Text alignment */
.text-left    { text-align: left;    }
.text-right   { text-align: right;   }
.text-center  { text-align: center;  }
.text-justify { text-align: justify; }

/* Medium-sized breakpoint */
@media only screen and (min-width: 600px) {
    /* Floats */
    .md-fl-l { float: left;  }
    .md-fl-r { float: right; }
    .md-fl-n { float: none;  }

    /* Text alignment */
    .md-text-left    { text-align: left;    }
    .md-text-right   { text-align: right;   }
    .md-text-center  { text-align: center;  }
    .md-text-justify { text-align: justify; }
}

/* Large-sized breakpoint */
@media only screen and (min-width: 960px) {
    /* Floats */
    .lg-fl-l { float: left;  }
    .lg-fl-r { float: right; }
    .lg-fl-n { float: none;  }

    /* Text alignment */
    .lg-text-left    { text-align: left;    }
    .lg-text-right   { text-align: right;   }
    .lg-text-center  { text-align: center;  }
    .lg-text-justify { text-align: justify; }
}

/**
 * Clearfix ($clearfix)
 */

/* Clear floats with an extra markup element - http://cbrac.co/SFv1Ua */
.clear {
    display: block;
    visibility: hidden;
    clear: both;
    overflow: hidden;
    width: 0;
    height: 0;
}

/* Contain floats */
.cf:before,
.cf:after {
    display: table; /* 1 */
    content: " ";   /* 2 */
}

.cf:after {
    clear: both;
}

/**
 * Visibility ($visibility)
 */

/* Simple show-and-hide */
.is-visible { display: inherit !important; }
.is-hidden  { display: none !important;    }

/* Medium-sized breakpoint */
@media only screen and (min-width: 600px) {
    /* Simple show-and-hide */
    .md-is-visible { display: inherit !important; }
    .md-is-hidden  { display: none !important;    }
}

/* Large-sized breakpoint */
@media only screen and (min-width: 960px) {
    /* Simple show-and-hide */
    .lg-is-visible { display: inherit !important; }
    .lg-is-hidden  { display: none !important;    }
}

/**
 * Hide only visually, but have it available for screenreaders -
 * http://cbrac.co/TUcUgH
 */

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

/**
 * Extends the `.visuallyhidden` class to allow the element to be
 * focusable when navigated to via the keyboard - http://cbrac.co/RR8gO6
 */

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