@charset "UTF-8";
/**

# MediaQuery

A collection of utilities for getting media queries

**/
/**

# Mixins

A collection of utilities for generating common CSS patterns

*/
/**

## Clearfix

Allows elements to properly wrap floated child elements

```
```

*/
/**

## Font Face

Generates bulletproof font syntax. Has built in support for WOFF2.

* __@param__ $font-family - Pretty name to be used when selecting fonts. EG: 'Gill Sans'
* __@param__ $font-filename - File name with relative path. EG: 'Gill-Sans-MT-Pro-Light'
* __@param__ $font-weight - Configure font weight. Defaults to 'normal'. EG: 200
* __@param__ $font-style - Configure font style. Defaults to 'normal'. EG: italic
* __@param__ $font-stretch - Configure font stretch. Defaults to 'normal'. EG: normal

```
```

*/
/**

## Font Size

Generates a font-size in REM with a px fallback. This mixin assumes you've reset the font size on the HTML tag to font-size: 62.5%; to allow for base-10 math.

* __@param__ $sizeValue - The font size in REM. Units should not be included. EG: 2

```
```

*/
/**

## Opacity

Generates IE8 safe opacity

* __@param__ $opacity - The opacity of the element. Values should be between 0 and 1. EG: .64

```
```

*/
/**

## Vertical Center

Generates IE9 safe vertical center

* __@param__ $child - The element that should be vertically cented. EG: '.lb-expander-menu'

```
```

*/
/**

## Background Logo

*/
/**

## Transitions

*/
/**

## Box styles

*/
#aws-page-content.aws-blog-has-related-posts {
  display: flex;
  flex-direction: column; }
  #aws-page-content.aws-blog-has-related-posts > .row {
    order: 1; }
    @media only screen and (min-width: 769px) {
      #aws-page-content.aws-blog-has-related-posts > .row {
        order: 2; } }

.aws-blog-related-posts {
  order: 2;
  margin: 0 15px; }
  .aws-blog-related-posts h4 {
    padding: 0 8px 8px;
    border-bottom: 1px solid #d5dbdb;
    color: #969696; }
  @media only screen and (max-width: 767px) {
    .aws-blog-related-posts {
      margin: 0 20px; } }
  @media only screen and (min-width: 769px) {
    .aws-blog-related-posts {
      order: 1;
      margin: 0 0 30px 0; }
      .aws-blog-related-posts h4 {
        font-weight: 400;
        margin: 0 30px 7px;
        padding: 0;
        color: #333;
        border: 0;
        text-transform: uppercase;
        font-weight: normal;
        font-size: 11px; }
        .aws-blog-related-posts h4 {
          font-family: AmazonEmber, Helvetica Neue, Helvetica, Arial, sans-serif; }
        .aws-lng-zh_CN .aws-blog-related-posts h4 {
          font-family: Helvetica, Arial, Microsoft Yahei, 微软雅黑, STXihei, 华文细黑, sans-serif; }
        .aws-lng-ja_JP .aws-blog-related-posts h4 {
          font-family: ヒラギノ角ゴ Pro W3, Hiragino Kaku Gothic Pro, Osaka, メイリオ, Meiryo, ＭＳ Ｐゴシック, MS PGothic, sans-serif; }
        .aws-lng-ko_KO .aws-blog-related-posts h4 {
          font-family: Malgun Gothic, sans-serif; }
        .aws-lng-zh_TW .aws-blog-related-posts h4 {
          font-family: Helvetica, Arial, Microsoft Yahei, SimSun, STXihei, sans-serif; }
      .aws-blog-related-posts nav {
        padding: 0 30px 0; } }
    @media only screen and (min-width: 769px) and (min-width: 769px) {
      .aws-blog-related-posts nav {
        box-shadow: -1px 2px 2px 0 #e0e0e0, 0 1px 2px 0 #d0d0d0;
        border-top: 1px solid #d5dbdb; } }
  .aws-blog-related-posts ul {
    list-style-type: none;
    margin: 0 8px 15px; }
    @media only screen and (min-width: 769px) {
      .aws-blog-related-posts ul {
        display: flex;
        flex-direction: row;
        margin: 0 -10px; } }
  .aws-blog-related-posts li {
    padding: 6px 0; }
    @media only screen and (min-width: 769px) {
      .aws-blog-related-posts li {
        padding: 0;
        line-height: 1.143;
        border-left: 1px solid #d5dbdb; }
        .aws-blog-related-posts li:first-child {
          border-left: none; } }
    @media only screen and (min-width: 769px) and (max-width: 979px) {
      .aws-blog-related-posts li {
        flex: 1; }
        .aws-blog-related-posts li:nth-child(n+5) {
          display: none; } }
    @media only screen and (min-width: 980px) and (max-width: 1199px) {
      .aws-blog-related-posts li {
        flex: 1; }
        .aws-blog-related-posts li:nth-child(n+7) {
          display: none; } }
    @media only screen and (min-width: 1200px) {
      .aws-blog-related-posts li {
        flex: 1; } }
  .aws-blog-related-posts a {
    display: block;
    height: 100%;
    padding: 8px 10px; }
    @media screen and (max-width: 768px) {
      .aws-blog-related-posts a {
        padding: 0;
        color: #333; }
        .aws-blog-related-posts a:visited {
          color: #333; }
        .aws-blog-related-posts a:hover {
          color: #e47911; } }

/**

# MediaQuery

A collection of utilities for getting media queries

**/
/**

# Mixins

A collection of utilities for generating common CSS patterns

*/
/**

## Clearfix

Allows elements to properly wrap floated child elements

```
```

*/
/**

## Font Face

Generates bulletproof font syntax. Has built in support for WOFF2.

* __@param__ $font-family - Pretty name to be used when selecting fonts. EG: 'Gill Sans'
* __@param__ $font-filename - File name with relative path. EG: 'Gill-Sans-MT-Pro-Light'
* __@param__ $font-weight - Configure font weight. Defaults to 'normal'. EG: 200
* __@param__ $font-style - Configure font style. Defaults to 'normal'. EG: italic
* __@param__ $font-stretch - Configure font stretch. Defaults to 'normal'. EG: normal

```
```

*/
/**

## Font Size

Generates a font-size in REM with a px fallback. This mixin assumes you've reset the font size on the HTML tag to font-size: 62.5%; to allow for base-10 math.

* __@param__ $sizeValue - The font size in REM. Units should not be included. EG: 2

```
```

*/
/**

## Opacity

Generates IE8 safe opacity

* __@param__ $opacity - The opacity of the element. Values should be between 0 and 1. EG: .64

```
```

*/
/**

## Vertical Center

Generates IE9 safe vertical center

* __@param__ $child - The element that should be vertically cented. EG: '.lb-expander-menu'

```
```

*/
/**

## Background Logo

*/
/**

## Transitions

*/
/**

## Box styles

*/
.lb-blog-nav {
  width: 100%;
  background-color: #f2f4f4;
  box-shadow: #d5dbdb 0 1px 2px; }
  .lb-blog-nav .lb-txt {
    font-weight: 500;
    font-size: 13px;
    font-size: 1.3rem;
    padding: 7px 0;
    margin-right: 20px;
    color: #232F3E; }
    .lb-blog-nav .lb-txt {
      font-family: AmazonEmberBold, Helvetica Neue Bold, Helvetica Neue, Helvetica, Arial, sans-serif; }
    .aws-lng-zh_CN .lb-blog-nav .lb-txt {
      font-family: Helvetica, Arial, Microsoft Yahei, 微软雅黑, STXihei, 华文细黑, sans-serif; }
    .aws-lng-ja_JP .lb-blog-nav .lb-txt {
      font-family: ヒラギノ角ゴ Pro W3, Hiragino Kaku Gothic Pro, Osaka, メイリオ, Meiryo, ＭＳ Ｐゴシック, MS PGothic, sans-serif; }
    .aws-lng-ko_KO .lb-blog-nav .lb-txt {
      font-family: Malgun Gothic, sans-serif; }
    .aws-lng-zh_TW .lb-blog-nav .lb-txt {
      font-family: Helvetica, Arial, Microsoft Yahei Bold, SimSun Bold, STXihei Bold, sans-serif; }
  .lb-blog-nav a:hover,
  .lb-blog-nav a:active,
  .lb-blog-nav a.lb-active {
    color: #007dbc;
    text-decoration: none; }

.lb-blog-nav-content {
  padding-left: 20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center; }

.lb-blog-nav-links {
  display: flex;
  flex-wrap: wrap;
  flex-grow: 1; }

.lb-blog-nav-search {
  margin: 5px 30px 4px 0; }

.lb-search-input {
  min-width: 250px;
  padding-right: 30px;
  border: 1px solid #aab7b8;
  border-radius: 3px;
  box-shadow: inset 0 1px 1px #d5dbdb;
  position: relative; }
  .lb-search-input.lb-active {
    border-color: #ec7211;
    background-color: #fafafa #fafafa; }
    .lb-search-input.lb-active button {
      color: #ec7211; }
  .lb-search-input:hover {
    background-color: #fafafa; }
  .lb-search-input input[type='text'] {
    width: 100%;
    padding: 5px 0 4px 8px;
    margin: 0;
    border: 0;
    font-size: 13px;
    font-size: 1.3rem;
    line-height: 1.4;
    background-color: transparent; }
    .lb-search-input input[type='text']::placeholder {
      color: #879196; }
  .lb-search-input .lb-blog-search-button {
    position: absolute;
    top: 0;
    right: 0; }
  .lb-search-input button {
    width: 30px;
    height: 25px;
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 17px;
    font-size: 1.7rem;
    color: #879196;
    background: transparent;
    cursor: pointer;
    outline: none; }

.lb-popover a:link,
.lb-popover a:visited {
  color: #232F3E;
  font-size: 13px;
  font-size: 1.3rem; }

.lb-popover a:hover,
.lb-popover a:active {
  color: #007dbc;
  text-decoration: none; }

@media only screen and (min-width: 769px) {
  .lb-blog-nav .lb-txt {
    margin-right: 30px; } }